Google Calendar for Todayの紹介と拡張内ページ間通信の実例

3,733 views

Published on

oogle Calendar for Todayの紹介と拡張内ページ間通信の実例 (Chrome Extension TechTalk at 2010-04-09)

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
3,733
On SlideShare
0
From Embeds
0
Number of Embeds
281
Actions
Shares
0
Downloads
9
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide










  • Google Calendar for Todayの紹介と拡張内ページ間通信の実例

    1. 1. Google Calendar for Today Makoto Kawasaki (twitter:@makoto_kw) 2010-04-09 Chrome Extension TechTalk
    2. 2. Google Calendar for Today background.html Google Calendar API popup.html Yahoo! Widget DevFest 5.4 j.mp/crxgcaltoday @makoto_kw
    3. 3. Lifetime popup.html background.html j.mp/crxgcaltoday @makoto_kw
    4. 4. Problem Popup j.mp/crxgcaltoday @makoto_kw
    5. 5. Hierarchy popup.html (UI) Google background.html Ajax Calendar (Data) API j.mp/crxgcaltoday @makoto_kw
    6. 6. Ex) access data function refreshUI() { var bg = chrome.extension.getBackgroundPage(); var events = bg.events; for (var i=0, len=events.length; i<len; i++) { var e = events[i]; //... } } popup.html window.events = []; background.html j.mp/crxgcaltoday @makoto_kw
    7. 7. Ex) notify dataChanged chrome.extension.onRequest.addListener( function(request, sender, sendResponse) { if (request.eventUpdated) { refreshUI(); return; } }); popup.html function fetchEvent() { // $.get('http://....',function(data){ window.events = ["event"]; chrome.extension.sendRequest({eventUpdated:true}); //}); } setInterval(fetchEvent,5*60*1000); background.html j.mp/crxgcaltoday @makoto_kw
    8. 8. hack: exetension.getPopupPage() (function () { this.getPopupPage = function() { return this.findWindowByPathname('/popup.html'); } this.findWindowByPathname = function(pathname) { var views = this.getViews(); for (var i=0, len=views.length; i<len; i++) { var w = views[i]; if (w.location.pathname == pathname) { return w; } } } }).apply(chrome.extension,[]); j.mp/crxgcaltoday @makoto_kw
    9. 9. Conclusion popup background other -> background getBackgroundPage() background -> other sendRequest()/onRequestListener() j.mp/crxgcaltoday @makoto_kw
    10. 10. Reference Example Code: http://github.com/makotokw/crxjptalk_20100409 Google Calendar for Today: http://j.mp/crxgcaltoday Open Source of Google Calendar for Today: http://github.com/makotokw/google-calendar-for-today My Google Calendar (Yahoo! Widget) http://widgets.yahoo.com/widgets/my-google-calendar j.mp/crxgcaltoday @makoto_kw

    ×