bookma!のChrome Extensions書いた
週末bookma!の更新情報をチェックしてくれるChrome Extensionsを書いた。
https://chrome.google.com/webstore/detail/bookma/liokhcpckffcejhmhgboapcfgjboagjm
Retinaディスプレイだと38x38のアイコンを用意しておくと自動でそっちを読んでくれる。
manifest.json
{ "name":"bookma!", "version":"0.0.7", "manifest_version": 2, "description": "bookma!", "browser_action":{ "default_icon": { "19": "icon-19.png", "38": "icon-38.png" }, "default_title":"bookma!", "default_popup": "popup.html" }, "icons": { "48": "icon-48.png", "128": "icon-128.png" }, "background": { "scripts": ["jquery-2.0.0.min.js", "background.js"] }, "permissions": [ "tabs", "http://bookma.org/" ], "web_accessible_resources": [ "icon-128.png" ] }
background.js
(function(ns, w, d, $) { w.setInterval(function(){ $.ajax({ url: 'http://bookma.org/', dataType: 'json', data: { json: 1, limit: 20 } }).done(function(data){ var last_time = localStorage.getItem('org.bookma.last_time') || ''; var count = 0; $.each(data.entries, function(i, entry){ if (last_time.localeCompare(entry.publish_time) === -1) { count++; } }); if (count > 0) { chrome.browserAction.setBadgeBackgroundColor({color: [208, 0, 24, 255]}); chrome.browserAction.setBadgeText({text: count.toString()}); } else { chrome.browserAction.setBadgeText({text: ''}); } }); }, 300000); })(this, window, document, jQuery);
popup.html
<html> <head> <meta charset="utf-8"> <title>Bookma for Chrome</title> <link rel="stylesheet" type="text/css" href="style.css" media="screen"> <script type="text/javascript" src="jquery-2.0.0.min.js"></script> <script type="text/javascript" src="app.js"></script> </head> <body> <table> <tbody> <tr> <th><a href="http://bookma.org/" target="_blank">bookma v3</a></th> <td> <a class="btn">現在表示しているサイトを推薦する</a> </td> </tr> </tbody> </table> <ul> <li></li> </ul> </body> </html>
app.js
(function(ns, w, d, $) { $(d).ready(function(){ var ul = $(d.body).find('ul'); var button = $(d.body).find('a.btn'); var token = null; ul.empty(); $.ajax({ url: 'http://bookma.org/', dataType: 'json', data: { json: 1, limit: 20 } }).done(function(data){ token = data.token; chrome.browserAction.setBadgeText({text: ''}); var last_time = ''; $.each(data.entries, function(i, entry){ if (last_time.localeCompare(entry.publish_time) === -1) { last_time = entry.publish_time; } var li = $($.parseHTML('<li><a target="_blank"><img><span></span></a></li>')); li.find('a').attr('href', 'http://bookma.org/entry/' + entry.entry_id + '/view'); li.find('img').attr('src', 'http://bookma.org/thumbnails/' + entry.entry_id + '-thumbnail-' + entry.delay + '.png?' + entry.update_time); li.find('span').text(entry.title); li.appendTo(ul); }); localStorage.setItem('org.bookma.last_time', last_time); }); button.on('click', function(e){ e.preventDefault(); chrome.tabs.getSelected(null, function(tab){ button .off('click') .addClass('disabled') .text('サイト推薦を受け付けました!'); $.ajax({ url: 'http://bookma.org/entry/create', dataType: 'json', type: 'post', data: { url: tab.url, csrf_token: token } }); }); }); }); })(this, window, document, jQuery);