Frac
// Creates canvas 600 × 600 at 40, 40
var paper = Raphael(40,40,800,600);
cm=200/3;unit=cm/2;
var source = paper.rect(0,0, 8*unit,8*unit);
var dest = paper.rect(0,9*unit,8*unit,8*unit);
var c = paper.image(“lena1.png”,0,0,8*unit,unit);
var d = paper.image(“lena2.png”,0,1*unit,8*unit,unit);
var e = paper.image(“lena3.png”,0,2*unit,8*unit,unit);
var f = paper.image(“lena4.png”,0,3*unit,8*unit,unit);
var g = paper.image(“lena5.png”,0,4*unit,8*unit,unit);
var h = paper.image(“lena6.png”,0,5*unit,8*unit,unit);
var i = paper.image(“lena7.png”,0,6*unit,8*unit,unit);
var j = paper.image(“lena8.png”,0,7*unit,8*unit,unit);
var L = paper.image(“L.png”,16*unit,5*unit,unit,unit);
var H = paper.image(“H.png”,17*unit,5*unit,unit,unit);
L.hide();
H.hide();
var BufferHoriz= paper.rect(13*unit,4*unit, 8*unit,unit);
var DoubleBufferHoriz= paper.rect(9*unit,13*unit, 8*unit,2*unit);
var BuffLH=paper.rect(19*unit,13*unit, 2*unit,1*unit);
var FiltHorizL= paper.image(“FiltHorizL.png”,10*unit,2*unit,9*unit,1*unit);
var FiltHorizH= paper.image(“FiltHorizH.png”,10*unit,3*unit,7*unit,1*unit);
var FiltVertL= paper.image(“FiltVertL.png”,22*unit,8*unit,1*unit,9*unit);
var FiltVertH= paper.image(“FiltVertH.png”,21*unit,10*unit,1*unit,7*unit);
time=1000;
function FiltVdown(cnt){
FiltVertL.animate({y:(8+cnt)*unit},time,””);
FiltVertH.animate({y:(10+cnt)*unit},time,””);
}
function FiltHdown(){
FiltHorizL.animate({y:4*unit},time,””);
FiltHorizH.animate({y:5*unit},time,””);
}
function FiltHup(){
FiltHorizL.animate({y:2*unit},time,””);
FiltHorizH.animate({y:3*unit},time,””);
}
function mvLH(){
L.show();H.show();
L.animate({x: 19*unit,y:13*unit}, time);
H.animate({x: 20*unit,y:13*unit}, time);
}
function FiltH(){
FiltHdown();//move horiz filter down
setTimeout (“FiltHup()”, 1*time);
setTimeout ( “mvLH()”, 2*time );// move result to buffer
}
function mvFiltH(dx){
FiltHorizL.animate({x:dx}, time/2,””);
FiltHorizH.animate({x:dx}, time/2,””);
}
function FiltVleft(){
FiltVertL.animate({x:19*unit}, time,””);
FiltVertH.animate({x:18*unit}, time,””);
}
function FiltVright(){
FiltVertL.animate({x:(22)*unit}, time,””);
FiltVertH.animate({x:(21)*unit}, time,””);
L.hide();H.hide();
// move L and H to orign:
L.animate({x: 16*unit,y:5*unit}, time);
H.animate({x: 17*unit,y:5*unit}, time);
}
function mvFrac(xdest){
//xdest=9*unit;
var LL = paper.image(“LL.png”,19*unit,13*unit,unit,unit);
var LH = paper.image(“LH.png”,19*unit,13*unit,unit,unit);
var HL = paper.image(“HL.png”,19*unit,13*unit,unit,unit);
var HH = paper.image(“HH.png”,19*unit,13*unit,unit,unit);
//LL.show();LH.show();HL.show();HH.show();
LL.animate({x: xdest}, time);
HH.animate({x: xdest+4*unit,y:14*unit},time);
LH.animate({x: xdest,y:14*unit}, time);
HL.animate({x: xdest+4*unit}, time);
}
function FiltV(xdest){
FiltVleft();
setTimeout (“FiltVright()”, time);
str=’mvFrac(‘; str=str.concat(xdest+”);str=str.concat(‘)’);
setTimeout ( str, 2*time );
}
function fillFracBuff(pos){
//pos=1..4
// 1)
mvFiltH(10*unit+(pos-1)*2*unit);
//window.alert(pos);
// 2)
setTimeout (“FiltH()”,time );
// 3)
xdest=8*unit+pos*unit;
str=’FiltV(‘; str=str.concat(xdest+”);str=str.concat(‘)’);
setTimeout (str,4*time);
}
function linej(){
time=time/8;
fillFracBuff(2);
setTimeout(“fillFracBuff(3)”,time*8);
setTimeout(“fillFracBuff(4)”,time*16);
}
function line(){
time=time/2;
fillFracBuff(1);
setTimeout(“fillFracBuff(2)”,time*8);
setTimeout(“fillFracBuff(3)”,time*16);
setTimeout(“fillFracBuff(4)”,time*24);
time=time*2;
}
function writeDest(){
//var DoubleBufferHoriz= paper.rect(9*unit,13*unit, 8*unit,2*unit);
var a = paper.image(“result2.png”,9*unit,13*unit,8*unit,2*unit);
var b = paper.image(“ll.png”,9*unit,13*unit,4*unit,1*unit);
var c = paper.image(“hl.png”,13*unit,13*unit,4*unit,1*unit);
var d = paper.image(“lh.png”,9*unit,14*unit,4*unit,1*unit);
var e = paper.image(“hh.png”,13*unit,14*unit,4*unit,1*unit);
b.animate({x: 0*unit,y:12*unit},1000)
c.animate({x: 4*unit,y:12*unit},1000)
d.animate({x: 0*unit,y:16*unit},1000)
e.animate({x: 4*unit,y:16*unit},1000)
}
// ******************** action
counter=0;
function CallAction(){
counter=counter+1;
switch (counter){
case 1:
j.animate({x: 13*unit,y:4*unit},2*time,””);
break;
case 2:
FiltH();
break;
case 3:
xdest=9*unit;
FiltV(xdest);
break;
case 4:
linej();
break
case 5:
j.hide();i.animate({x: 13*unit,y:4*unit},2*time);
FiltVdown(1);
setTimeout(function(){
i.hide();h.animate({x: 13*unit,y:4*unit},2*time);
FiltVdown(2);
},8*time);
setTimeout(function(){
h.hide();g.animate({x: 13*unit,y:4*unit},2*time);
FiltVdown(3);
},16*time);
setTimeout(function(){
g.hide();f.animate({x: 13*unit,y:4*unit},2*time);
FiltVdown(4);
},24*time);
//setTimeout(function(){
// f.hide();e.animate({x: 13*unit,y:4*unit},2*time);
// },32*time);
// FiltVdown();
//setTimeout(function(){
// var a = paper.image(“result.png”,9*unit,13*unit,8*unit,2*unit);
// },40*time);
break;
case 6:
writeDest();
break;
case 7:
var transf = paper.image(“Lena2.png”,0,9*unit,8*unit,8*unit);
break;
default:
window.alert(‘done’);
}
}
// ***************************
Created with Raphaël