Aby przetestować ajax współpracujący z rysowaniem po canvas za pomocą js napisałem prosty programik
i działa na płatnym serwerze a u mnie nie chce działać na apache2
podaje kod:
<http://december.com/html/4/element/html.html> <http://december.com/html/4/element/head.html> <http://december.com/html/4/element/title.html>tesciczek</http://december.com/html/4/element/title.html> </http://december.com/html/4/element/head.html> <http://december.com/html/4/element/body.html> <canvas style="background:#F0F0F0" id="krzyzyki" width="150" height="150" /> <http://december.com/html/4/element/script.html> var tab = [[0,0,0],[0,0,0],[0,0,0]]; var X=0; var Y=0; //var tabt = new Array(); var zmiana=0; var bok =40; var ctx=document.getElementById("krzyzyki").getContext('2d'); function rysujKrzysz(x,y) { //ExtendFirefoxEvent(e); ctx.beginPath(); ctx.strokeStyle= "rgb(0,0,0)"; ctx.moveTo(bok*x, bok*y); ctx.lineTo(bok*x+bok,bok*y+bok); ctx.stroke(); ctx.moveTo(bok*x, bok*y+bok); ctx.lineTo(bok*x+bok,bok*y); ctx.stroke(); ctx.closePath(); } function marz(x,y) { // ctx.rect(x*bok,y*bok,bok,bok); ctx.beginPath(); ctx.fillStyle = "rgb(255,255,255)"; ctx.fillRect(x*bok,y*bok,bok,bok); ctx.fill(); ctx.closePath(); } function czysc() { ctx.fillStyle = "#00FF00"; ctx.fillRect(0,0,150,150); ctx.fill(); } var zablokuj=false; xmlhttp=new XMLHttpRequest(); function odebrane() { zablokuj=true; if (xmlhttp.readyState==4 && xmlhttp.status==200) { var con=xmlhttp.responseText; // alert(con); var temp=con.split(" "); var m=0; for(var i =0 ;i<3;i++) { for(var j=0;j<3;j++) { tab[i][j]=parseInt(temp[m]); m++; } } m=0; zablokuj=false; } //zablokuj=false; } xmlhttp.onreadystatechange=odebrane; function process() { rysujKrzysz(0,0); marz(0,0); if(!zablokuj){ czysc(); for(var i=0;i<3;i++) for(var j=0;j<3;j++) { if(tab[i][j]){ rysujKrzysz(j,i); }else{ marz(j,i); } } } zablokuj=true; xmlhttp.open("GET","s2.php?czy=0"+"&X="+X.toString()+"&Y="+Y.toString(),true); xmlhttp.send(null); zmiana=0; setTimeout("process()",500); } function nacmysz(e) { zablokuj=true; X=Math.floor(e.layerX/bok); Y=Math.floor(e.layerY/bok); zmiana=1; xmlhttp.open("GET","s2.php?czy=1"+"&X="+X.toString()+"&Y="+Y.toString(),true); xmlhttp.send(null); } krzyzyki.addEventListener("mousedown", nacmysz, false); process(); </http://december.com/html/4/element/script.html> </http://december.com/html/4/element/body.html> </http://december.com/html/4/element/html.html>
<?php $czy = $_REQUEST['czy']; $X = $_REQUEST['X']; $Y = $_REQUEST['Y']; http://www.php.net/settype($X, 'integer'); http://www.php.net/settype($Y, 'integer'); $filename = "tablicunia.txt"; $content = http://www.php.net/file($filename); $array = http://www.php.net/explode(" ", $content[0]); $krzyzyki = $content[0]; if((int)$czy) { if((int)($array[$Y*3+$X]))$array[$Y*3+$X]='0'; else $array[$Y*3+$X]='1'; $krzyzyki = http://www.php.net/implode(" ", $array); $fp = http://www.php.net/fopen($filename,"w"); http://www.php.net/fputs($fp,$krzyzyki); http://www.php.net/fclose($fp); } ?> <?php http://www.php.net/echo($krzyzyki); //echo($czy); //echo($X); //echo($Y); ?>
Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)