TATATA

From XPUB & Lens-Based wiki

<source lang="html4strict"> <!DOCTYPE html> <html> <head> <meta charset="utf-8" />

<script> // Define a draw function that contains your // drawing code // var data = ["een","twee","tomaat","westerse filosofie","hi","zes"]; // var data = ["een","twee"];

function read(d){ data = d; }

function draw(){

 c = document.getElementById("canvas")
 //console.log("c is",c)
 p = c.getContext("2d")
 var i =  0; 
 var y = 10;

// while (i<data.length){

// p.fillText(data[i], 10, y); // i+=1 // y+=10

// }

for (var magic in data.query.pages) {}

data = data.query.pages[magic].revisions;

 console.log("start");

var i=data.length-1;

function showedit() { //while(i >= 0){

 console.log(i);
 currentcomment = new Date(data[i].timestamp);
 
 if(i >= 1){  	
 	nextcomment = new Date(data[i-1].timestamp);
 	time = (nextcomment - currentcomment) * 0.00001;
 	console.log(time);
 	}
 p.clearRect(0,0,p.canvas.width, p.canvas.height);	
 p.fillText(data[i].user, 10, y);
 p.fillText(currentcomment, 130, y);
 p.fillText(data[i].comment, 360, y);
 //y+=10
 i--;
 
 if(i >= 0) {
 	setTimeout(showedit,time);

} }

showedit();


 // p.fillText(data[0], 10, 10);
 // p.fillText(data[1], 10, 50);
 // p.fillText(data[2], 10, 100);
 // p.fillText(data[3], 10, 150);

} </script>

<script src="http://en.wikipedia.org/w/api.php?action=query&prop=revisions&rvprop=content&format=json&titles=tom_Cruise&rvlimit=100&rvprop=user%7Ccomment%7Ctimestamp&callback=read"> </script>

</head> <body onload="draw()"> <canvas id="canvas" width="1250" height="1250" style="border: 1px solid black"></canvas> </body> </html> </source lang="html4strict">