Simple animation where node transitions to the left, content changes, and transitions back. This sequence of set/thenSet does not work. Transitioning to the left, back to the right, THEN changing the content DOES work though this is not the desired behavior.
FamousFramework.scene('tutaslabs:test', {
'behaviors': {
'#button': {
content: '[[identity]]',
'origin': [0.5, 0.5],
'align': [0.5, 0.5],
'size': [200, 100],
'position': '[[identity]]',
'style': {
'text-align': 'center',
'line-height': '100px',
'font-size': '30px',
'background-color': 'lightblue',
'cursor':'pointer'
}
}
},
'events':{
'#button': {
'click': function($state,$event) {
// this does not work. The first two sets (and the animation) execute then stop. Last transition never
// happens
$state.set('position',[-200,0],{duration: 2000}).thenSet('content',"Was clicked").
thenSet('position',[0,0],{duration: 2000})
// These sets do work. All three sets (and animations) work as coded.
// $state.set('position',[-200,0],{duration: 2000}).thenSet('position',[0,0],{duration: 2000}).
// thenSet('content',"Was clicked")
}
}
},
'states':{
'content': 'Click me',
'position': [0,0]
},
'tree': '<node id="button"></node>'
});
Simple animation where node transitions to the left, content changes, and transitions back. This sequence of set/thenSet does not work. Transitioning to the left, back to the right, THEN changing the content DOES work though this is not the desired behavior.
FamousFramework.scene('tutaslabs:test', {
'behaviors': {
'#button': {
content: '[[identity]]',
'origin': [0.5, 0.5],
'align': [0.5, 0.5],
'size': [200, 100],
'position': '[[identity]]',
});