Contenu connexe Similaire à Creating Rajanikant Powered Site (20) 9. recently I saw this site
http://www.desimartini.com/allaboutrajni.htm
13. Today we are going to
create a site which does the
magic of rajanikant in HTML5
14. A site which can work offline,
even if your internet unplugged
15. A site which works no matter
how your laptop is oriented!
20. Which allows you to cache
entire app offline so that your
app will be fully operational
even offline
22. Declaration of cache manifest
<!DOCTYPE html>
<html manifest="/cache-manifest-file">
----
-----------------
---------------------
---------------------
24. Cache manifest MIME type
has to be
text/cache-manifest
PHP
header('Content-type: text/cache-manifest');
App Engine
self.response.headers['Content-Type'] = "text/cache-
manifest"
25. WARNING
Once you deploy offline capable
app , none of your files will update to
user, untill you will update your
cache-manifest
30. Canvas was here for
long time
in non-IE browsers, and now
avaialable in IE9 as well
31. Canvas APIs are simple
var
canvas = document.getElementById('canvas'),
ctx = canvas.getContext('2d');
34. Canvas APIs are simple
ctx.beginPath();
ctx.moveTo(x, y);
ctx.lineTo(x, y);
ctx.arc(x,y,radius,startAngle,endAngle, clockwise);
ctx.stroke();
ctx.fill();
35. DataUrl and Images
var dataURL = canvas.toDataURL("image/png");
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA
img = new Image();
img.src=imgurl; //data:image/
png;base64,iVBORw0
ctx.drawImage(img,0,0);
37. its a way to store small size data
on client side.
(around 15MB per origin in most of the browsers)
38. Large data on localStorage should
be avoided & too many read/write
should be avoided !! To keep your
app faster!!
39. HTML5 Local Storage API
localStorage.setItem('name',value);
value=localStorage.getItem('name');
40. Other APIs to store data locally are
1. Indexed Database API
2. File API
44. Device orientation
window.addEventListener('deviceorientation',
function(event) {
var a = event.alpha,
b = event.beta,
g = event.gamma;
}, false);
47. Thank you
&
Questions!!
twitter: @markandey
email: markandey.singh at gmail
