On google chrome, when an alert() is activated and chrome is minimized there is an instance that the chrome icon on the taskbar glows orange (windows 7) sometimes the whole browser maximizes.
Is it possible to activate that glowing feature with javascript?
I need this for our office. I want the chrome icon to glow when its minimized and the user received a new message.
Thanks!
I found this piece of code, can't test is right now because i'm not using windows, but you should give it a try.
<script type="text/javascript">
// Flashing TaskBar
setInterval(flashToolbar, 10000); // calls flashToolbar every 10000 ms
function flashToolbar() {
if (window.external.msIsSiteMode()) {
window.external.msSiteModeActivate();
}
}
</script>
source: http://blogs.msdn.com/b/jennifer/archive/2011/05/10/ie-pinned-sites-part-8-how-to-implement-a-flashing-taskbar-button.aspx
What I needed was a tactic that can get the users attention when they receive a new message while the browser is minimized. I couldn't find a way for the icon on the task bar to blink but I found an alternative that still fills the need. #HariKrishnan gave a link that led to a couple of googling that made me discover Web Notifications. You can find a very simple tutorial here.
Cheers!
For future reference I added the tut here since its just a two step process . .
Step 1
Ask user to allow webkitNotifications (Same thing with the html5 geolocation)
function askPermission(){
webkitNotifications.requestPermission(testNotification);
}
Step 2
Creating a notification
function testNotification(){
var notification = webkitNotifications.createNotification('IMAGE','TITLE','BODY');
notification.show();
}
(Note: Multiple notifications will stack)
Related
I have written a plain JavaScript code that will run on different Desktop and on Mobiles.
For Desktop, I can just open the browser console and test my JavaScript code. But how can I test for mobile devices. My code is mostly failing for mobile devices which I am able to figure out when I check the user agent.
Here is a simple piece of code, that extract word counts from a web page.
function countWords() {
try {
if (top.document && top.document.querySelector("body")) {
var _body = top.document.querySelector("body");
var words = _body.textContent || _body.innerText; //For old firefox, innerText does not work
if (words) {
words = words.replace(/\n/g,'');
var filteredWords = words.match(/\S+/g);
if (filteredWords && filteredWords.length > 0) {
userDetail.wordCount = filteredWords.length;
}
}
}
} catch (err) {
processError("countWords", err);
}
}
This code is not working on on mobile devices.
As mentioned above by, you can use a mac and IOS device, another option is Remote Debugging for android if you want to go that path - https://developers.google.com/web/tools/chrome-devtools/remote-debugging/
It's very handy and easier to get your hands on
To debug Javascript code (or just browser stuff in general) You need OS X and an iOS device (you should be able to do the same with the iOS Simulator, but I couldn't get it working and I mainly use a device to debug stuff, so didn't bother to figure it out). There's a feature to attach a web inspector to your browser window in the iOS device.
To enable it:
Device -> Settings -> Safari -> Advanced -> Enable Web Inspector
OS X -> Safari -> Develop (top bar) -> Choose your device from the dropdown menu -> Select app running JS code.
The web inspector should show up, if everything is ok. From there you should be able to debug your JS code.
EDIT:
This is for debugging iOS devices (useful if you want to support mobile Webkit).
You can actually open Console/Inspect element on mobile devices!
You need "chrome" for this to work.
javascript:(function () { var script = document.createElement('script'); script.src="//cdn.jsdelivr.net/npm/eruda"; document.body.appendChild(script); script.onload = function () { eruda.init() } })();
Just create a new bookmark and name it whatever you want, in the url part enter this above 👆 code and that's it!!
Now whenever you want to access Console in your mobile browser tap on the address bar and search for the bookmark that we just created.
Let's say that we named it as "Inspect Element" , If we type "Inspect Element" on the address bar our bookmark will appear, click on it to run the javascript , after few seconds your "console toggle button" should showup click on it to access the console/Inspect Element on your mobile browser.
Ok, let me give you a detailed step by step procedure for this.
•Create a new bookmark.
•Click on the three dot button on the top right corner and click on the "star" button on the top right of the side bar,to create a new bookmark.
•After Pasting the javascript code in the url section hit back button and search for Inspect element in the address bar.
•Click on the Inspect Element bookmark to run the javascript and you can see the console toggle button in the browser.
•Click on it to open the Console!
•You can enable the console in any website you want.
•Just go to the website and tap on the address bar and search for Inspect Element and press on it , console toggle button should showup.
•I hope this helped someone if so feel free to upvote ☺️.
Every time I open google homepage in Firefox I keep getting this really annoying message below the address bar as shown below.
I often delete history(cache), so even if I click "No Thanks", it appears again. Is there a script to disable it permanently.
Is it possible to remove the "Install Google Chrome" ad from the Google home page.
Edit: There seems to be no solution neither on the internet nor from the users here, so I formed my own script. Works fine. Please refer my answer below.
Install Greasemonkey addon to firefox and add the following script.
google.promos&&google.promos.toast && google.promos.toast.cpc();
window.google.promos.pushdown.pd_tp = function(){return false;};
If you want to understand how it works, read further.
Removing the Chrome promo-box: The first line of the code invokes the function that executes when we click the close button on the chrome promo-box.
Disabling the push-down bar: Unfortunately, this task is not as easy as the previous one, because the push-down bar activates after a short delay (clever programming by the google folks). So, our only choice is to remove the contents of the function that initiates the push-down event. The second line accomplishes this effectively.
I am still fairly new at programing. I have played around with JavaScript before, but it is still tricky for me.
I got this great idea for an extension for Google Chrome- in the future it would be nice to port it into other browsers. For now I think Google Chrome would be the easiest way to develop for.
I investigated a little and finished the kitties tutorial on the extensions site.
From there it makes sense- easy for the most part, but my idea sounds impossible to me. Simply, the extension would automatically reload the browser when window is selected or focused on the screen. Saves time by not pressing Ctrl+R (PC), or Cmd+R (Mac), or reload button every time the developer checks an update on code.
I was reading through the API documentation and found the method
chrome.browserAction.onClick, is there like chrome.browserAction.focused? Is this idea even feasible?
I also have to take in consideration that Chrome is visited by multiple OS. I wonder if Mac OS, Linux, and Windows version need different JavaScript instruction to pull this off? This simple idea is overwhelming...
Thanks for input in advance :)
Sounds like you'll want to use chrome.windows.onFocusChanged:
Fired when the currently focused window changes. Will be chrome.windows.WINDOW_ID_NONE if all chrome windows have lost focus. Note: On some Linux window managers, WINDOW_ID_NONE will always be sent immediately preceding a switch from one chrome window to another.
Here's an example of how to reload a newly-focused window's active tab:
chrome.windows.onFocusChanged.addListener(function(windowId) {
if (windowId != chrome.windows.WINDOW_ID_NONE) {
chrome.tabs.query({ active:true, windowId:windowId }, function(tabs) {
if (tabs.length == 1) {
var tab = tabs[0];
chrome.tabs.reload(tab.id);
}
});
}
});
You'll also need to declare the tabs permission in your manifest.
I'm creating a website for a kiosk, and I need to make the bar that shows the page address you are about to go to at the bottom of Firefox or IE disappear. Please see the image.
Is it possible to make this bar disappear?
EDIT:
Thanks to everyone's reply. I have tried the code Chris and Mrtsherman suggested, I'm not sure I missed something unfortunately none of it worked for me. Is it really not possible to hide the status bar for Firefox in the kiosk mode?
The problem I'm having is that I've got three divs on one page, so it goes like a photoslide when each div is clicked, the first div is an a tag entirely so the status bar is showing all the time. If making the status bar disappear not possible, is there any way I can set the cursor off the screen so that the status bar doesn't show all the time on the first div? Thanks a lot.
If you'd like to use Internet Explorer, just create a shortcut in the client's startup folder that points to iexplore -k http://example.com. This will start IE in Kiosk Mode at the designated page, as soon as the kiosk machine starts.
Alernately, you could have the first page open a pop-up with code like this:
window.open(filename,"","width="+winwidth+",height="+winheight+",scrollbars=yes ,menubar=no,location=no,left=0,top=0")
to open a window with no UI chrome.
Option 3:
Try this, not sure if it will work. In firefox you can enable an option to allow the status text to be changed via javascript:
Tools -> Preferences -> Content -> Enable Javascript(click on the 'Advanced' Button) -> Change status bar text
Once you've done that in Firefox, add this snippet to your achor tags:
onmouseover="window.status=''; return true;"
I make no guarantees this will work as desired.
You can't force that to go away. It is a function of the browser and provides the very useful feature of telling the user where a link is leading.
Here is a userscript that apparently works for FF.
#namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
#statusbar-display:not([label^="Looking"]):not([label^="Connecting"]):not([label^="Connected"]):not([label^="Transferring"]):not([label^="Waiting"]):not([label^="Read"])
{opacity: 0 !important; }
http://userstyles.org/styles/43764/firefox-10-only-hide-hovered-link-target-urls
"useful feature"? awho the hell cares, where a link points to? this is just a huge annoyance in any browser. no normal user cares about this and even if they did, most URL are not readable anyway.
so this should be off by default and possible to switch on for developers...
Disclaimer before the uppity types start in: This is not to be deployed "in the wild". This is for local, personal use by a Chrome add-on only. I am not trying trick visitors to my sites or do anything else unsavory. I've seen a bit of chastising of those wanting to hook onbeforeunload.
Some Background
Far and away my biggest gripe with Chrome (at least on Mac OS) is its tab close buttons which, when I have several tabs open (as I usually do), results in my frequently closing tabs unintentionally as the tabs themselves become fairly small and thus the click target area that isn't covered by the tab close button is very small. On certain tabs with news stories, blog posts, documentation, etc. it's annoying but not a huge inconvenience. I just CMD+T to reopen the tab and there's no real harm done. However, certain tabs, in particular Gmail, have definite downsides to being closed. I frequently have one or more chat dialogs with coworkers open and reopening a tab does not restore the chat dialog, and initiating a new chat loses me the current chat history (yes, it's saved, but it's not conveniently accessible by scrolling backwards in context). There are a handful of requests for Google to add the option to simply remove tab close buttons (I prefer to use CMD+W myself), but I'm not holding my breath on that.
A Partial Solution
A while back a friend pointed me towards the dotJS Chrome add-on which allows per-domain custom JavaScript execution, akin to GreaseMonkey, but slightly different. At any rate, it gave me a means to "fix" issues/wants on a number of sites I visit regularly, and I've found it to be very helpful thus far. The other day it occurred to me that I could probably keep my Gmail, et al tab(s) open with a bit of JavaScript. I threw together a small script that based on a regular expression would prompt you before closing a tab. The gist of the code is as follows:
var unloadHandler = function(e) {
if (/(mail.google.com|google.com\/reader|gmail.com)/.test(location)) {
return 'Are you sure you want to close: ' + location.host;
}
};
window.onbeforeunload = unloadHandler;
Lo and behold, this did the trick for most of the sites I tried it on; except one: Gmail. Let me correct that: it worked, insofar as it prompted me to confirm the closing of the Gmail tab, and if I opted to not close it, it would keep the tab open, but before the dialog prompted me, the page had gone completely white. Element inspector shows that the markup is all still there (so far as I can tell), and the styles on the elements shouldn't be hiding things (i.e. display: none; visibility: hidden; etc) and the elements' positioning is still correct (e.g. they're within the viewable area). I went through one-by-one removing elements to see if anything was obscuring the Gmail interface, but was never able to reveal it on screen. I cannot for the life of me figure out what's going on. I'm not sure if Gmail is hooked into some event I'm unaware of (an on*before*beforeunload?), or if Google's browser is doing something special with their Gmail page, or what is causing the strange behavior. Google Reader is unaffected by this oddity (I can prevent close and retain the contents of the page) as are all of the other sites I've tested with.
Does anyone know what might be causing this issue?
For the record, I am running the following: Mac OS X 10.6.5, Google Chrome 10.0.648.205, and dotJS 1.3.
I appreciate any feedback, but I am not looking for solutions that involve: pinning tabs, changing my workflow/usage (e.g. not selecting tabs with the mouse), etc. I really want to figure out what, specifically, Gmail (or perhaps Chrome?) is doing that is sabotaging my efforts here. Thanks in advance.
I think Gmail's own code causes this behavior. I can reproduce your problem (on linux machine) with subscribing for this event from the console with this function
window.onbeforeunload = function(e) {
return "Hey what\'s wrong with you?!";
};
After it I've started the developer tool profiler, the last call after closing the window (and choose the 'stay on this page' answer for the question) is a removeChild function call, which removes some content from the <iframe id="canvas_frame" />. So the content elements are not there anymore.
function Fc(b) {
return b && b.parentNode ? b.parentNode.removeChild(b) : m
}
I've found some 'traces' in the obfuscated code for subscribing for the beforeunload event, but it's hard to be sure :)
function It(b, a) {
this.Qc = jCa++;
this.ea = b;
this.ka = new J(this);
this.Qa = a;
this.Ka = [];
this.Za = !1;
this.ka.ya(this.ea, "unload", this.Da);
this.ka.ya(this.ea, "beforeunload", this.ab);
Ypa(Zd(a), this);
this.ia()
}
I tried to reproduce this behavior in Firefox but I think google ships different javascript codes for different browsers so I can't reproduce it.