79 lines
1.1 KiB
JavaScript
79 lines
1.1 KiB
JavaScript
|
|
||
|
|
|
||
|
|
class animationBlock{
|
||
|
|
|
||
|
|
width = 100;
|
||
|
|
|
||
|
|
height = 100;
|
||
|
|
|
||
|
|
margin = 20;
|
||
|
|
|
||
|
|
background = "#03a9f4";
|
||
|
|
|
||
|
|
marginTop = 12;
|
||
|
|
|
||
|
|
marginLeft = 12;
|
||
|
|
|
||
|
|
create() {
|
||
|
|
|
||
|
|
|
||
|
|
this.moveAnimation = this.createAnimation("moveAnimation");
|
||
|
|
|
||
|
|
|
||
|
|
var key = this.moveAnimation.createKeyFrame( 0 );
|
||
|
|
|
||
|
|
key.setProperty( "margin-right", 12 );
|
||
|
|
|
||
|
|
|
||
|
|
var key = this.moveAnimation.createKeyFrame( 20 );
|
||
|
|
|
||
|
|
//key.setProperty( "margin-top", 200 );
|
||
|
|
key.setProperty( "margin-right", 40 );
|
||
|
|
|
||
|
|
|
||
|
|
var key = this.moveAnimation.createKeyFrame( 30 );
|
||
|
|
|
||
|
|
//key.setProperty( "margin-top", 500 );
|
||
|
|
key.setProperty( "margin-right", 120 );
|
||
|
|
|
||
|
|
|
||
|
|
var key = this.moveAnimation.createKeyFrame( 50 );
|
||
|
|
|
||
|
|
key.setProperty( "margin-top", 200 );
|
||
|
|
|
||
|
|
|
||
|
|
var key = this.moveAnimation.createKeyFrame( 100 );
|
||
|
|
|
||
|
|
//key.setProperty( "margin-top", 0 );
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
async click() {
|
||
|
|
|
||
|
|
this.moveAnimation.play("2s");
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
import panelRow from '/elements/panel/row.js';
|
||
|
|
|
||
|
|
import label from '/elements/label.js';
|
||
|
|
|
||
|
|
|
||
|
|
class rowLabel extends label{
|
||
|
|
|
||
|
|
flex = "1";
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
export default class moveRow extends panelRow{
|
||
|
|
|
||
|
|
boxWidth = "95%"
|
||
|
|
|
||
|
|
rowLabel = new rowLabel("Move");
|
||
|
|
|
||
|
|
animationBlock = new animationBlock();
|
||
|
|
|
||
|
|
}
|