localstorage.enchant.js (enchant.js meetup! 発表資料)

4,929 views

Published on

Published in: Technology, Art & Photos
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
4,929
On SlideShare
0
From Embeds
0
Number of Embeds
1,805
Actions
Shares
0
Downloads
11
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

localstorage.enchant.js (enchant.js meetup! 発表資料)

  1. 1. localstorage.enchant.jsymrl
  2. 2. ymrl 1TweetShooting Web
  3. 3. http://tweetshooting.appspot.com/
  4. 4. enchant.js
  5. 5. touch➡enchant.js iOS 1
  6. 6. localstorage.enchant.js 3GHTML5 localStorage Data URI Scheme
  7. 7. localStorage key-value iOS 5MB localStorage[key-name]
  8. 8. Data URI Scheme data:[<MIME-type>][;charset=<encoding>][;base64],<data> URL <img src=”data:image/png;base64;,...”> Base64 Canvas toDataURI
  9. 9. Data URI Schemedata:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAABgCAYAAACaJ3mZAAAUE0lEQVR4Ae1dX4hdxRmflNJCQbhBmmKocCUQq5h2oZDiw+JCYEOhSTYvC7YvW4SIoHTbSMsKQkEwWNSsKAh5Wh9aISAm20IxNLB2S4WFwhbFlkDwQovBlbIXLIX6ks5v7v2dfHfuzDkz58yZu1vvwN35//2+75vffGfOuSe5B27fvq2maeoBnwcOHjxYEGR3d/eAb5xsj5nzZTlxWp56QHoARFo82lGPnjhqmlEnCSXJ5ByUV2YfME03P7ml5Bx7HOpTArq8Mm0b8cCFN6+Z+ttPzBtCoQKSHX/orpFxWx98pkA6fEJTJQEl08n+KuF15lTJnPZPzgPdQ90C3EU8doKQ
  10. 10. Data URI Scheme var img = new Image(); img.src = foo.png; img.addEventListener(load,function( ){ var cvs = document.createElement(canvas); cvs.height = this.naturalHeight; cvs.width = this.naturalWidth; var ctx = cvs.getContext(2d); ctx.drawImage(this,0,0); console.log(cvs.toDataURL()); });
  11. 11. localstorage.enchant.jsenchant.js Game#preload URL localStorage localStorage preload
  12. 12. game.preload(foo.png);game.preloadToLocalStorage(foo.png);
  13. 13. enchant( );window.addEventListener(load,function(){ var game = new Game(400,400); game.preloadToLocalStorage(/img/Lenna.jpg); // localStorage[/img/Lenna.jpg] に画像が保存され、 // 次回からは localStorageから読み出されるようになる game.addEventListener(load,function(){ var lenna = new Sprite(400,400); lenna.image = game.assets[/img/Lenna.jpg]; game.rootScene.addChild(lenna); }); game.start( );});
  14. 14. URL URL localStorage
  15. 15. foo.png#20111021#
  16. 16. Data URI Scheme iOS Simulator Local Server 30ms localStorage 81ms 3G Cache > localStorage >
  17. 17. localStorage Base64
  18. 18. Thank you.geishatokyo’s enchant.js repository:https://github.com/geishatokyo/enchant.js

×