1 /** 2 *This functions detects if a browser supports <canvas> tag and if 3 *it does it tests to see if beasic drawring features are supported 4 *@return {Number} 0 - means no support at all, 1-means simulated support IE 2-means full support 5 *@author Augustin <cdaugustin@yahoo.com> 6 *@author Alex <alex@scriptoid.com> 7 * 8 *TODO: some functions might be present but empty.... 9 **/ 10 function isBrowserReady() 11 { 12 13 var canvas = document.createElement("canvas"); 14 var retVal = 0; //0 - means no support at all, 1-means simulated support IE 2-means full support 15 var retTxtDebug = ""; 16 var ctx = ""; 17 try { 18 ctx = canvas.getContext("2d"); 19 20 retTxtDebug = "We have support for canvas\n"; 21 retVal = 2; 22 //weve got no context maybe IE ? 23 24 } catch(errx){ 25 try{ 26 G_vmlCanvasManager.initElement(canvas); 27 ctx = canvas.getContext('2d'); 28 29 if (ctx){ 30 retTxtDebug = "IE with excanvas\n"; 31 retVal = 1; 32 }else{ 33 //no canvas or excanvas 34 retTxtDebug = "no html5 or excanvas working\n"; 35 } 36 }catch(err){ 37 retTxtDebug = "no html5 or excanvas working -- possible not an IE browser too\n"; 38 } 39 } 40 41 if (retVal > 0){ 42 //we have basic canvas lets see if we have working functions 43 44 var functionUsed = ["fill", "arc", "beginPath", "moveTo", "lineTo", 45 "stroke", "bezierCurveTo", "quadraticCurveTo", "closePath", "save", 46 "restore", "translate", "rotate", "drawImage", "strokeText", 47 "fillText", "measureText"]; 48 49 for (var idx in functionUsed){ 50 if (typeof( ctx[functionUsed[idx]]) != "function"){ 51 retTxtDebug = retTxtDebug + functionUsed[idx] + " function missing\n"; 52 retVal = 0; 53 } 54 } 55 } 56 57 //alert('Debug: ' + retTxtDebug + ' retVal = ' + retVal); 58 59 return retVal; 60 } 61 62 /** 63 * Displays a modal window with information about the browser HTML5 support 64 * Note: requires jquery.simplemodal-1.3.5.min.js to be loaded 65 **/ 66 function modal(){ 67 var msg = "<div style=\"background-color: #EDEDED; border:1px dotted gray; padding: 5px;\" >\ 68 <h1>Browser problem</h1>\ 69 <div>Your browser does not fully support HTML5</div>\ 70 <div>Please use one of the following browsers for best experience</div>\ 71 <ul> \ 72 <li> <a href=\"http://www.mozilla.com/firefox/\" target=\"_blank\">Firefox</a></li> \ 73 <li> <a href=\"www.google.com/chrome/\" target=\"_blank\">Chrome</a></li> \ 74 <li> <a href=\"http://www.opera.com\" target=\"_blank\">Opera</a></li> \ 75 <li> <a href=\"http://www.apple.com/safari\" target=\"_blank\">Safari</a></li> \ 76 </ul> \ 77 Press <span style=\"color:red;\">Escape</span> to close this message</div>"; 78 $.modal(msg, { 79 closeHTML:'Close' 80 }); 81 }