j3nda/speed-dial-chrome — pull request #10 by heavensrevenge (2013-12-24 21:54:56+00:00)
Title: Quick cleanup & fixes before flexboxification & thumbnail generation

I'm going to test out converting our layout to flexbox layout to remove as much JavaScript positioning logic as possible.

P.S.
Do any of you have any good ideas on how to detect or mark what dial would need updating if I implement thumbnailing?
You can put the following code in the eventPage.js and have it log all the websites to localstorage, but I've been trying to figure out a way to make the data-format or JSON object to hold the info and how to to check or trigger thumbnail refresh in some way.

```javascript
chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
if (tab.selected && tab.status == "complete") {
chrome.tabs.captureVisibleTab(null, {format:"png"}, function(dataUrl) {
var image = new Image();
image.src = dataUrl;
image.onload = function () {
var canvas = document.createElement("canvas");
var width = image.width /2;
var height = image.height /2;
canvas.width = width;
//canvas.width = height * (4/3); // Auto-sizes to 4:3 aspect ratio
canvas.height = height;
var ctx = canvas.getContext("2d");
ctx.drawImage(image, 0, 0, width, height);
localStorage.setItem(tab.url, canvas.toDataURL("image/webp", 0.6));
};
});
}
});
```