var period = 1000;
var count = 1;
setInterval(function(){
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
var img = new Image;
img.onload = function(){
ctx.drawImage(img,0,0);
};
if (count == 31) count = 1;
img.src = 'S'+ count + '.png';
document.getElementById("demo").innerHTML = count;
count++;
},period);