Napisałem klasę generującą coś na wzór wątków:
Object.prototype.$ = function(v){
return document.getElementById(v);
}
MyInterval = function (f, t){
this.func = f
this.time = t;
this.handler;
this.start = function() {
this.handler = setInterval(this.func, this.time);
}
this.repeat = function(h) {
h.handler = setInterval(h.func, h.time);
}
this.sleep = function(time) {
this.stop();
setTimeout(this.repeat, time, this);
}
this.stop = function() {
clearInterval(this.handler);
}
}
watek :
watek 2:
watek 3:
var i = 0;
animacja = function() {
i+=2;
$('watek1').style.marginLeft = i+'px';
$('watek1').innerHTML = i;
if(i == 26) {watek.sleep(3000)};
if(i == 60) {watek.sleep(3000)};
if(i == 70) {watek.stop()};
}
var j = 0;
animacja2 = function() {
j+=2;
$('watek2').style.marginLeft = j+'px';
$('watek2').innerHTML = j;
if(j == 30) {watek2.sleep(2000)};
if(j == 74) {watek2.sleep(2000)};
if(j == 100) {watek2.stop()};
}
var k = 0;
animacja3 = function() {
k+=2;
$('watek3').style.marginLeft = k+'px';
$('watek3').innerHTML = k;
if(k == 34) {watek3.sleep(1500)};
if(k == 64) {watek3.stop()};
}
watek = new MyInterval(animacja, 500);
watek.start();
watek2 = new MyInterval(animacja2, 450);
watek2.start();
watek3 = new MyInterval(animacja3, 400);
watek3.start();
Wszystko jest ok jeśli wywołuje tak jak wyżej lecz jeśli wywołam tak:
watek = new MyInterval(animacja, 500);
watek.start();
watek2 = new MyInterval(animacja2, 500);
watek2.start();
watek3 = new MyInterval(animacja3, 500);
watek3.start();
to zaczynają dziać się strasznie dziwne rzeczy. Nie dość, że przeskoki idą co 6 (2+2+2) to wykonują się zapewne co 1500 milisekund...
Czy mam jakiś błąd w kodzie, czy tak poprostu zachowuje się Javascript?