diff options
author | rafaelw@chromium.org <rafaelw@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> | 2009-10-09 04:39:02 +0000 |
---|---|---|
committer | rafaelw@chromium.org <rafaelw@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> | 2009-10-09 04:39:02 +0000 |
commit | 336a193c20a33b8b4de6bbaf4df8de9e2966ad29 (patch) | |
tree | cb1f481e06c658c2b34636589f7f4fbb506c689a /chrome/test | |
parent | b9885f901bc93a6b31caa0c89128d841a29819a9 (diff) | |
download | chromium_src-336a193c20a33b8b4de6bbaf4df8de9e2966ad29.zip chromium_src-336a193c20a33b8b4de6bbaf4df8de9e2966ad29.tar.gz chromium_src-336a193c20a33b8b4de6bbaf4df8de9e2966ad29.tar.bz2 |
set BrowserActionButton inset to 0 so icon can draw to edges.
Also, implement cool spinning gmail icon when unread count changes.
Review URL: http://codereview.chromium.org/264021
git-svn-id: svn://svn.chromium.org/chrome/trunk/src@28524 0039d316-1c4b-4281-b951-d872f2087c98
Diffstat (limited to 'chrome/test')
-rw-r--r-- | chrome/test/data/extensions/samples/gmail_browser_action/background.html | 54 | ||||
-rwxr-xr-x | chrome/test/data/extensions/samples/gmail_browser_action/blank.png | bin | 0 -> 47124 bytes | |||
-rw-r--r-- | chrome/test/data/extensions/samples/gmail_browser_action/manifest.json | 3 |
3 files changed, 50 insertions, 7 deletions
diff --git a/chrome/test/data/extensions/samples/gmail_browser_action/background.html b/chrome/test/data/extensions/samples/gmail_browser_action/background.html index f8068bd..7a5dd93 100644 --- a/chrome/test/data/extensions/samples/gmail_browser_action/background.html +++ b/chrome/test/data/extensions/samples/gmail_browser_action/background.html @@ -1,14 +1,20 @@ <html> <head> <script> +var animationFrames = 36; +var animationSpeed = 10; // ms +var browserActionWidth = 27; +var browserActionHeight = 23; +var canvasContext; var gmail = "http://mail.google.com/"; var gmailAtomRef = "http://mail.google.com/mail/feed/atom"; +var gmailIconName = 'gmail_logged_in.png'; +var gmailImage; var pollInterval = 1000 * 10; // 10 seconds var requestTimeout = 1000 * 2; // 5 seconds +var rotation = 0; var unreadCount = 0; -var defaultIconId = 1; -var whiteoutIconId = 2; -var numberOfBlinks = 0; + chrome.tabs.onUpdated.addListener(function(tabId, changeInfo) { if (changeInfo.url && changeInfo.url.indexOf(gmail) == 0) { @@ -22,7 +28,14 @@ chrome.tabs.onUpdated.addListener(function(tabId, changeInfo) { function init() { chrome.browserAction.setBadgeBackgroundColor([230, 190, 190, 190]); chrome.browserAction.setBadgeText("?"); - window.setTimeout(startRequest, 0); + + var canvas = document.getElementById('canvas'); + canvasContext = canvas.getContext('2d'); + gmailImage = new Image(); + gmailImage.onload = function() { + window.setTimeout(startRequest, 0); + } + gmailImage.src = gmailIconName; } function scheduleRequest() { @@ -111,13 +124,43 @@ function gmailNSResolver(prefix) { function updateUnreadCount(count) { if (unreadCount != count) { unreadCount = count; + animateFlip(); + } +} + + +function ease(x) { + return (1-Math.sin(Math.PI/2+x*Math.PI))/2; +} + +function animateFlip() { + rotation += 1/animationFrames; + drawIconAtRotation(); + + if (rotation <= 1) { + setTimeout("animateFlip()", animationSpeed); + } else { + rotation = 0; + drawIconAtRotation(); chrome.browserAction.setBadgeText(unreadCount); chrome.browserAction.setBadgeBackgroundColor([255, 208, 0, 24]); - chrome.browserAction.setIcon(defaultIconId); chrome.browserAction.setName(unreadCount + " unread emails"); } } +function drawIconAtRotation() { + canvasContext.save(); + canvasContext.clearRect(0, 0, browserActionWidth, browserActionHeight); + canvasContext.translate(browserActionWidth/2, browserActionHeight/2); + canvasContext.rotate(2*Math.PI*ease(rotation)); + canvasContext.drawImage(gmailImage, -gmailImage.width/2, + -gmailImage.height/2); + canvasContext.restore(); + + chrome.browserAction.setIcon(canvasContext.getImageData(0, 0, + browserActionWidth,browserActionHeight)); +} + function goToInbox() { chrome.tabs.create({url: gmail}); } @@ -130,6 +173,7 @@ chrome.browserAction.onClicked.addListener(function(windowId) { </script> </head> <body onload="init()"> +<canvas id="canvas" width="27" height="23"> </body> </html> diff --git a/chrome/test/data/extensions/samples/gmail_browser_action/blank.png b/chrome/test/data/extensions/samples/gmail_browser_action/blank.png Binary files differnew file mode 100755 index 0000000..77c0f49 --- /dev/null +++ b/chrome/test/data/extensions/samples/gmail_browser_action/blank.png diff --git a/chrome/test/data/extensions/samples/gmail_browser_action/manifest.json b/chrome/test/data/extensions/samples/gmail_browser_action/manifest.json index ed16067..a9accab 100644 --- a/chrome/test/data/extensions/samples/gmail_browser_action/manifest.json +++ b/chrome/test/data/extensions/samples/gmail_browser_action/manifest.json @@ -8,8 +8,7 @@ ], "browser_action": { "name": "Gmail", - "icons": ["gmail_not_logged_in.png", - "gmail_logged_in.png"] + "icons": ["blank.png"] }, "icons": { "128": "icon_128.png" |