16162 2012-02-29 18:00:43 +0000  <html><head><meta http-equiv="Content- 2012-02-29 22:40:47 +0000 1 1 1 Unclassified HTML WG HTML Canvas 2D Context unspecified Other other RESOLVED INVALID http://www.whatwg.org/specs/web-apps/current-work/#top P3 normal --- 1 contributor ian ian mike public-html-admin public-html-wg-issue-tracking public-html-bugzilla oldest_to_newest 64741 0 contributor 2012-02-29 18:00:43 +0000 Specification: http://dev.w3.org/html5/2dcontext/ Multipage: http://www.whatwg.org/C#top Complete: http://www.whatwg.org/c#top Comment:  <html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <style> div { position: relative; left: 190px; } </style> <script> var CWID = 400; var CHEI = 400; var cleft = 50; var ctop = 50; var vlist = [{x: 15, y: 15}, {x: 45, y: 15}, {x: 45, y:-15}, {x: 15, y:-15}, {x: 15, y:-45}, {x:-15, y:-45}, {x:-15, y:-15}, {x:-45, y:-15}, {x:-45, y: 15}, {x:-15, y: 15}, {x:-15, y: 45}, {x: 15, y: 45} ]; var angle = 0; // starting rotation angle var trans = {x:CWID/2, y:CHEI/2}; // starting position var canvas = document.createElement('canvas'); canvas.width = CWID; canvas.height = CHEI; canvas.style.backgroundColor = '#eeeeee'; canvas.style.position = 'absolute'; canvas.style.left = cleft+'px'; canvas.style.top = ctop+'px'; var con = canvas.getContext('2d'); con.translate(trans.x, trans.y); drawPath(vlist); function translate(e) { trans.x = e.pageX-cleft; trans.y = e.pageY-ctop; drawPath(vlist); } function rotate() { angle += 0.1; drawPath(vlist); } function drawPath(v) { con.setTransform(1,0,0,1,0,0); // set to identity con.clearRect(0,0,CWID,CHEI); // clear canvas con.translate(trans.x,trans.y); con.rotate(angle); con.beginPath() // draw the shape con.moveTo(v[0].x,v[0].y); for (var i=1; i<v.length; i++) con.lineTo(v[i].x,v[i].y); con.closePath(); con.stroke(); } div.addEventListener('Right Rotation',tran,false); function tran(e) { con.save(); con.setTransform(1,0,0,1,0,0); con.clearRect(0,0,400,400); con.restore(); con.translate(150,220); con.rotate(0.1); con.translate(-150,-220); con.beginPath(); con.moveTo(100,100); con.rect(100,200,100,40); con.stroke(); } div.addEventListener('Left Rotaion',tran,false); function tran(e) { con.save(); con.setTransform(1,0,0,1,0,0); con.clearRect(0,0,400,400); con.restore(); con.translate(150,220); con.rotate(0.1); con.translate(-150,-220); con.beginPath(); con.moveTo(100,100); con.rect(100,200,100,40); con.stroke(); } var x = 0; canvas.addEventListener('Big',func1,false); function func1() { x += 10; con.clearRect(0,0,300,300); con.beginPath(); con.arc(150,150,10+x, 0,2*Math.PI); con.stroke(); } var x = 0; canvas.addEventListener('Small',func1,false); function func1() { x += 10; con.clearRect(0,0,300,300); con.beginPath(); con.arc(150,150,10-x, 0,2*Math.PI); con.stroke(); } </script> </head> <body id="body"><meta name="VeeHD" content="plugin for corp"> <div id="button">rotate</div> <script> document.getElementById('body').appendChild(canvas); canvas.addEventListener('mousedown',translate,false); document.getElementById('button') .addEventListener('mousedown',rotate,false); </script><canvas width="400" height="400" style="background-color: rgb(238, 238, 238); position: absolute; left: 50px; top: 50px; "></canvas> </body></html> Posted from: 2602:306:ccb3:5d80:c5a0:d08e:7bb2:39ff User agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.11 (KHTML, like Gecko) Chrome/17.0.963.56 Safari/535.11 64777 1 ian 2012-02-29 22:40:47 +0000 EDITOR'S RESPONSE: This is an Editor's Response to your comment. If you are satisfied with this response, please change the state of this bug to CLOSED. If you have additional information and would like the editor to reconsider, please reopen this bug. If you would like to escalate the issue to the full HTML Working Group, please add the TrackerRequest keyword to this bug, and suggest title and text for the tracker issue; or you may create a tracker issue yourself, if you are able to do so. For more details, see this document: http://dev.w3.org/html5/decision-policy/decision-policy.html Status: Did Not Understand Request Change Description: no spec change Rationale: I don't understand. Could you elaborate?