| OLD | NEW |
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <script> | 3 <script> |
| 4 var animationFrames = 36; | 4 var animationFrames = 36; |
| 5 var animationSpeed = 10; // ms | 5 var animationSpeed = 10; // ms |
| 6 var browserActionWidth = 27; | 6 var browserActionWidth = 27; |
| 7 var browserActionHeight = 23; | 7 var browserActionHeight = 23; |
| 8 var canvasContext; | 8 var canvasContext; |
| 9 var gmail = "http://mail.google.com/"; | 9 var gmail = "http://mail.google.com/"; |
| 10 var gmailAtomRef = "http://mail.google.com/mail/feed/atom"; | 10 var gmailAtomRef = "http://mail.google.com/mail/feed/atom"; |
| 11 var gmailIconName = 'gmail_logged_in.png'; | 11 var loggedInImage; |
| 12 var gmailImage; | 12 var loggedOutImage; |
| 13 var pollInterval = 1000 * 10; // 10 seconds | 13 var pollInterval = 1000 * 10; // 10 seconds |
| 14 var requestTimeout = 1000 * 2; // 5 seconds | 14 var requestTimeout = 1000 * 2; // 5 seconds |
| 15 var rotation = 0; | 15 var rotation = 0; |
| 16 var unreadCount = 0; | 16 var unreadCount = 0; |
| 17 | 17 |
| 18 | 18 |
| 19 chrome.tabs.onUpdated.addListener(function(tabId, changeInfo) { | 19 chrome.tabs.onUpdated.addListener(function(tabId, changeInfo) { |
| 20 if (changeInfo.url && changeInfo.url.indexOf(gmail) == 0) { | 20 if (changeInfo.url && changeInfo.url.indexOf(gmail) == 0) { |
| 21 console.log("saw gmail! updating..."); | 21 console.log("saw gmail! updating..."); |
| 22 getInboxCount(function(count) { | 22 getInboxCount(function(count) { |
| 23 updateUnreadCount(count); | 23 updateUnreadCount(count); |
| 24 }); | 24 }); |
| 25 } | 25 } |
| 26 }); | 26 }); |
| 27 | 27 |
| 28 function init() { | 28 function init() { |
| 29 chrome.browserAction.setBadgeBackgroundColor([230, 190, 190, 190]); | 29 var canvas = document.getElementById('canvas'); |
| 30 chrome.browserAction.setBadgeText("?"); | 30 loggedInImage = document.getElementById('logged_in'); |
| 31 | 31 loggedOutImage = document.getElementById('logged_out'); |
| 32 var canvas = document.getElementById('canvas'); | |
| 33 canvasContext = canvas.getContext('2d'); | 32 canvasContext = canvas.getContext('2d'); |
| 34 gmailImage = new Image(); | 33 startRequest(); |
| 35 gmailImage.onload = function() { | |
| 36 window.setTimeout(startRequest, 0); | |
| 37 } | |
| 38 gmailImage.src = gmailIconName; | |
| 39 } | 34 } |
| 40 | 35 |
| 41 function scheduleRequest() { | 36 function scheduleRequest() { |
| 42 window.setTimeout(startRequest, pollInterval); | 37 window.setTimeout(startRequest, pollInterval); |
| 43 } | 38 } |
| 44 | 39 |
| 45 // ajax stuff | 40 // ajax stuff |
| 46 function startRequest() { | 41 function startRequest() { |
| 47 getInboxCount( | 42 getInboxCount( |
| 48 function(count) { | 43 function(count) { |
| 49 updateUnreadCount(count); | 44 updateUnreadCount(count); |
| 50 scheduleRequest(); | 45 scheduleRequest(); |
| 51 }, | 46 }, |
| 52 function() { | 47 function() { |
| 48 showLoggedOut(); |
| 53 scheduleRequest(); | 49 scheduleRequest(); |
| 54 } | 50 } |
| 55 ); | 51 ); |
| 56 } | 52 } |
| 57 | 53 |
| 58 function getInboxCount(onSuccess, onError) { | 54 function getInboxCount(onSuccess, onError) { |
| 59 var xhr = new XMLHttpRequest(); | 55 var xhr = new XMLHttpRequest(); |
| 60 var abortTimerId = window.setTimeout(function() { | 56 var abortTimerId = window.setTimeout(function() { |
| 61 xhr.abort(); | 57 xhr.abort(); |
| 62 onError(); | 58 onError(); |
| (...skipping 72 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 135 | 131 |
| 136 function animateFlip() { | 132 function animateFlip() { |
| 137 rotation += 1/animationFrames; | 133 rotation += 1/animationFrames; |
| 138 drawIconAtRotation(); | 134 drawIconAtRotation(); |
| 139 | 135 |
| 140 if (rotation <= 1) { | 136 if (rotation <= 1) { |
| 141 setTimeout("animateFlip()", animationSpeed); | 137 setTimeout("animateFlip()", animationSpeed); |
| 142 } else { | 138 } else { |
| 143 rotation = 0; | 139 rotation = 0; |
| 144 drawIconAtRotation(); | 140 drawIconAtRotation(); |
| 145 chrome.browserAction.setBadgeText(unreadCount); | 141 chrome.browserAction.setBadgeText({text:unreadCount}); |
| 146 chrome.browserAction.setBadgeBackgroundColor([255, 208, 0, 24]); | 142 chrome.browserAction.setBadgeBackgroundColor({color:[255, 208, 0, 24]}); |
| 147 chrome.browserAction.setName(unreadCount + " unread emails"); | 143 chrome.browserAction.setTitle({title:unreadCount + " unread emails"}); |
| 148 } | 144 } |
| 149 } | 145 } |
| 150 | 146 |
| 147 function showLoggedOut() { |
| 148 canvasContext.save(); |
| 149 canvasContext.clearRect(0, 0, browserActionWidth, browserActionHeight); |
| 150 canvasContext.translate(browserActionWidth/2, browserActionHeight/2); |
| 151 canvasContext.drawImage(loggedOutImage, |
| 152 -loggedOutImage.width/2 - 1, -loggedOutImage.height/2); |
| 153 canvasContext.restore(); |
| 154 |
| 155 chrome.browserAction.setIcon({imageData:canvasContext.getImageData(0, 0, |
| 156 browserActionWidth,browserActionHeight)}); |
| 157 chrome.browserAction.setBadgeBackgroundColor({color:[230, 190, 190, 190]}); |
| 158 chrome.browserAction.setBadgeText({text:"?"}); |
| 159 } |
| 160 |
| 151 function drawIconAtRotation() { | 161 function drawIconAtRotation() { |
| 152 canvasContext.save(); | 162 canvasContext.save(); |
| 153 canvasContext.clearRect(0, 0, browserActionWidth, browserActionHeight); | 163 canvasContext.clearRect(0, 0, browserActionWidth, browserActionHeight); |
| 154 canvasContext.translate(browserActionWidth/2, browserActionHeight/2); | 164 canvasContext.translate(browserActionWidth/2, browserActionHeight/2); |
| 155 canvasContext.rotate(2*Math.PI*ease(rotation)); | 165 canvasContext.rotate(2*Math.PI*ease(rotation)); |
| 156 canvasContext.drawImage(gmailImage, -gmailImage.width/2, | 166 canvasContext.drawImage(loggedInImage, |
| 157 -gmailImage.height/2); | 167 -loggedInImage.width/2 - 1, -loggedInImage.height/2); |
| 158 canvasContext.restore(); | 168 canvasContext.restore(); |
| 159 | 169 |
| 160 chrome.browserAction.setIcon(canvasContext.getImageData(0, 0, | 170 chrome.browserAction.setIcon({imageData:canvasContext.getImageData(0, 0, |
| 161 browserActionWidth,browserActionHeight)); | 171 browserActionWidth,browserActionHeight)}); |
| 162 } | 172 } |
| 163 | 173 |
| 164 function goToInbox() { | 174 function goToInbox() { |
| 165 chrome.tabs.create({url: gmail}); | 175 chrome.tabs.create({url: gmail}); |
| 166 } | 176 } |
| 167 | 177 |
| 168 // Called when the user clicks on the browser action. | 178 // Called when the user clicks on the browser action. |
| 169 chrome.browserAction.onClicked.addListener(function(windowId) { | 179 chrome.browserAction.onClicked.addListener(function(tab) { |
| 170 goToInbox(); | 180 goToInbox(); |
| 171 }); | 181 }); |
| 172 | 182 |
| 173 </script> | 183 </script> |
| 174 </head> | 184 </head> |
| 175 <body onload="init()"> | 185 <body onload="init()"> |
| 186 <img id="logged_in" src="gmail_logged_in.png"> |
| 187 <img id="logged_out" src="gmail_not_logged_in.png"> |
| 176 <canvas id="canvas" width="27" height="23"> | 188 <canvas id="canvas" width="27" height="23"> |
| 177 </body> | 189 </body> |
| 178 </html> | 190 </html> |
| 179 | 191 |
| OLD | NEW |