====== Differences ====== This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
script_animation_flip [2014/05/18 11:27] lm13 [Changelog] |
script_animation_flip [2014/09/24 16:10] (current) lm13 [About the script] |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| ====== About the script ====== | ====== About the script ====== | ||
| - | * Purpose : These scripts will give you a beautiful page transition animation and a horizontal page loop | + | * Purpose : This script will give you a beautiful page transition animation and an optional horizontal & vertical page loop |
| * Author : [[https://plus.google.com/+LukasMorawietz|LM13]] | * Author : [[https://plus.google.com/+LukasMorawietz|LM13]] | ||
| - | * Current Version : 1.0 | + | * Current Version : 3.1 |
| * Link: https://plus.google.com/115366157037831519359/posts/EAUStJNGa5o | * Link: https://plus.google.com/115366157037831519359/posts/EAUStJNGa5o | ||
| + | * Video : https://plus.google.com/115366157037831519359/posts/9eUTw8cCCpi | ||
| + | * Download avialable! (Check repository) | ||
| ====== Changelog ====== | ====== Changelog ====== | ||
| * Version 1.0 (30/4/2014): initial release in wiki | * Version 1.0 (30/4/2014): initial release in wiki | ||
| * Version 2.0 (18/5/2014): Reworked parsing structure, added vertical support, improved smoothness | * Version 2.0 (18/5/2014): Reworked parsing structure, added vertical support, improved smoothness | ||
| + | * Version 2.1 (20/6/2014): added rotation check | ||
| + | * Version 3.1 (21/7/2014): standalone, reworked structure | ||
| ====== How to use the script ====== | ====== How to use the script ====== | ||
| - | * Set the main script to the positionchanged event of your container | + | * Set the script to the positionchanged event of your container |
| * enable infinte scrolling if you want a page loop, disable it if you don't want to loop through pages | * enable infinte scrolling if you want a page loop, disable it if you don't want to loop through pages | ||
| - | * in this container: create a shortcut to the toggle script and set up toggle sripts configuration | + | * in this container: create a shortcut to the script |
| * one click on the shortcut will enable the animation, clicking again will disable the animation. | * one click on the shortcut will enable the animation, clicking again will disable the animation. | ||
| * BE SURE TO DISABLE THE ANIMATION BEFORE YOU EDIT, MOVE OR ADD ITEMS! | * BE SURE TO DISABLE THE ANIMATION BEFORE YOU EDIT, MOVE OR ADD ITEMS! | ||
| ====== Issues and hints ====== | ====== Issues and hints ====== | ||
| - | * this will break any other script, which uses item or container tags, and will be broken by them | + | * this will break any other script, which uses item or container tags, and will be broken by them |
| - | * with many items it won't run smooth | + | * you can improve smoothness if you create on each page a panel and put all items in it. |
| * don't use dual position, this will do weird stuff | * don't use dual position, this will do weird stuff | ||
| + | * make sure all of your items have exactly one of the following rotations: 0°,90°,180°,270° | ||
| //please report all bugs in the g+ community// | //please report all bugs in the g+ community// | ||
| - | ====== Main Script code ====== | + | ====== Script ====== |
| - | <code>var d=LL.getEvent().getContainer(); | + | <sxh javascript;> |
| - | var cont=JSON.parse(d.getTag()||"null"); | + | var e=LL.getEvent(); |
| - | if(cont==null || !cont.setup) | + | var d=e.getContainer(); |
| - | { | + | var cont= JSON.parse(d.getTag()||"null"); |
| - | return; | + | |
| - | } | + | |
| - | var dwidth=d.getWidth(); | + | |
| - | var pos=d.getPositionX(); | + | |
| - | var current=Math.floor(pos/dwidth); | + | |
| - | var pagepos=current*dwidth; | + | |
| - | var dposy=d.getPositionY(); | + | |
| - | var percent=(pos-pagepos)/dwidth; | + | |
| var items=d.getItems(); | var items=d.getItems(); | ||
| - | var l=items. getLength(); | + | var dwidth=d.getWidth(); |
| - | var tag=parseInt(LL.getScriptTag()); | + | var dheight=d.getHeight(); |
| - | var maxpage= Math.floor((cont.max-dwidth)/dwidth); | + | |
| - | + | if(e.getSource()!="C_POSITION_CHANGED") | |
| - | if((percent>0.005&&percent<99.995) && pos>cont.min-dwidth) | + | |
| { | { | ||
| - | if(pos>cont.max-dwidth&&d.getProperties().getBoolean("noScrollLimit")) | + | if(cont==null) cont=new Object(); |
| - | { | + | var box=d.getBoundingBox(); |
| - | d.setPosition(cont.min-dwidth ,dposy,1,false); | + | cont.minx=box.getLeft(); |
| - | } | + | cont.maxx=box.getRight(); |
| - | if(pos<cont.min) | + | cont.miny=box.getTop(); |
| - | { | + | cont.maxy=box.getBottom(); |
| - | cont.state=2; | + | var minpagex=Math.floor( cont.minx/dwidth); |
| - | } | + | var minpagey=Math.floor( cont.miny/dheight); |
| - | for(i=0;i<l;i++) | + | if(cont.setup!=true) |
| - | { | + | { |
| - | item=items.getAt(i); | + | cont.pages=[]; |
| - | var pinned= item.getProperties().getString("i.pinMode"); | + | for(x=0;x<Math.ceil(cont.maxx/dwidth)-minpagex;x++) |
| - | if(pinned=="NONE"|| pinned=="Y") | + | { |
| - | { | + | cont.pages[x]=[]; |
| - | var data=JSON.parse(item.getTag()); | + | for(y=0;y<Math.ceil(cont.maxy/dheight)-minpagey;y++) |
| - | if(data.page==current || (cont.state==2 && data.page==maxpage)) | + | { |
| - | { | + | cont.pages[x][y]=[]; |
| - | if(percent<0.5) | + | } |
| - | { | + | } |
| - | item.setScale(1-percent*2,1); | + | for(x=0;x<items.length;x++) |
| - | item.setPosition(pos+percent*(dwidth)+data.posx*(1-percent*2),data.posy); | + | { |
| - | item.setVisibility(true); | + | var i=items.getAt(x); |
| - | } | + | var pinned=i.getProperties() .getString("i.pinMode"); |
| - | else item.setVisibility(false); | + | if(pinned!="XY") |
| - | } | + | { |
| - | if(data.page==current+1) | + | var data=new Object(); |
| - | { | + | data.posx=i.getPositionX(); |
| - | if(percent>=0.5) | + | data.posy=i.getPositionY(); |
| - | { | + | data.rot=Math.abs(i.getRotation())==90; |
| - | item.setScale(percent*2-1,1); | + | data.sx=data.rot?i.getScaleX():i.getScaleY(); |
| - | item.setPosition(pos+dwidth/2*(2-percent*2)+data.posx*(percent*2-1),data.posy); | + | data.sy=data.rot?i.getScaleY():i.getScaleX(); |
| - | item.setVisibility(true); | + | data.pin=pinned; |
| - | } | + | if(i.getProperties().getBoolean("i.onGrid")) data.onGrid=true; |
| - | else item.setVisibility(false); | + | else data.onGrid=false; |
| - | } | + | i.getProperties().edit().setBoolean("i.onGrid",false).commit(); |
| - | } | + | if(pinned=="X") |
| - | } | + | { |
| - | } | + | var ypages=cont.pages[Math.floor(data.posx/dwidth)-minpagex][Math.floor(data.posy/dheight)-minpagey]; |
| - | else | + | for(z=0;cont.pages[z]!=null;z++) |
| - | { | + | cont.pages[z][Math.floor(data.posy/dheight)-minpagey].push(i.getId()); |
| - | if(pos<cont.min) | + | } |
| - | { | + | else if(pinned=="Y") |
| - | d.setPosition(pos,dposy); | + | { |
| - | d.setPosition(cont.max-dwidth,dposy,1,false); | + | var xpages=cont.pages[Math.floor(data.posx/dwidth)-minpagex]; |
| - | } | + | for(z=0;z<xpages.length;z++) |
| - | cont.state=0; | + | xpages[z].push(i.getId()); |
| - | for(i=0;i<l;i++) | + | } |
| - | { | + | else cont.pages[Math.floor(data.posx/dwidth)-minpagex][Math.floor(data.posy/dheight)-minpagey].push(i.getId()); |
| - | item=items.getAt(i); | + | i.setTag(JSON.stringify(data)); |
| - | var data=JSON.parse(item.getTag()); | + | } |
| - | item.setScale(1,1); | + | } |
| - | item.setPosition(data.page*dwidth+data.posx,data.posy); | + | cont.setup=true; |
| - | item.setVisibility(true); | + | Android.makeNewToast("Animation enabled",true).show(); |
| - | } | + | LL.writeToLogFile(JSON.stringify(cont.pages),false); |
| + | } | ||
| + | else | ||
| + | { | ||
| + | var cellw=d.getCellWidth(); | ||
| + | var cellh=d.getCellHeight(); | ||
| + | for(x=0;x<items.length;x++) | ||
| + | { | ||
| + | var i=items.getAt(x); | ||
| + | var data=JSON.parse(i.getTag()); | ||
| + | i.setScale(1,1); | ||
| + | if(data!=null&& data.onGrid==true) | ||
| + | { | ||
| + | iwidth=i.getWidth(); | ||
| + | iheight=i.getHeight(); | ||
| + | i.getProperties().edit().setBoolean("i.onGrid",true).commit(); | ||
| + | i.setCell(Math.round(data.posx/cellw),Math.round(data.posy/cellh),Math.round((data.posx+iwidth)/cellw),Math.round(( data.posy+iheight)/cellh)); | ||
| + | } | ||
| + | } | ||
| + | cont.setup=false; | ||
| + | Android.makeNewToast("Animation disabled",true).show(); | ||
| + | } | ||
| + | d.setTag(JSON.stringify(cont)); | ||
| } | } | ||
| - | </code> | ||
| - | ====== Toggle Script code ====== | ||
| - | <code>//config | ||
| - | var main_scripts_name="AnimationFlip"; | ||
| - | //endconfig | ||
| + | if(cont==null || !cont.setup || d.getPositionScale()!=1)return; | ||
| + | var dposx=d.getPositionX(); | ||
| + | var dposy=d.getPositionY(); | ||
| + | var currentx=Math.floor(dposx/dwidth); | ||
| + | var pageposx=currentx*dwidth; | ||
| + | var percentx=(dposx-pageposx)/dwidth; | ||
| + | var currenty=Math.floor(dposy/dheight); | ||
| + | var pageposy=currenty*dheight; | ||
| + | var percenty=(dposy-pageposy)/dheight; | ||
| + | var maxpagex=Math.floor( (cont.maxx-dwidth)/dwidth); | ||
| + | var maxpagey=Math.floor( (cont.maxy-dheight)/dheight); | ||
| + | var minpagex=Math.floor( cont.minx/dwidth); | ||
| + | var minpagey=Math.floor( cont.miny/dheight); | ||
| - | var d=LL.getEvent().getContainer(); | + | if(((percentx>0.005 && percentx<99.995) ||(percenty>0.005 && percenty<99.995)) && dposx>cont.minx-dwidth && dposy>cont.miny-dheight) |
| - | var box=d.getBoundingBox(); | + | |
| - | var cont=JSON.parse(d.getTag()||"null"); | + | |
| - | if(cont==null) cont=new Object(); | + | |
| - | cont.min=box.getLeft(); | + | |
| - | cont.max= box.getRight(); | + | |
| - | var items=d.getItems(); | + | |
| - | LL.runScript(main_scripts_name,null); | + | |
| - | var dwidth=d.getWidth(); | + | |
| - | if(cont.setup!=true) | + | |
| { | { | ||
| - | for(x=0;x<items.length;x++) | + | var scrollLimit=d.getProperties() .getBoolean("noScrollLimit"); |
| - | { | + | if(dposx>cont.maxx-dwidth&&scrollLimit){ |
| - | var i=items. getAt(x); | + | d.setPosition(cont.minx-dwidth,dposy,1,false); |
| - | var posx=i.getPositionX(); | + | } |
| - | var data=new Object(); | + | else if(dposy>cont.maxy-dheight&&scrollLimit) d.setPosition(dposx,cont.miny-dheight,1,false); |
| - | data.page=Math.floor(posx/dwidth); | + | if(dposx<cont.minx&&scrollLimit) |
| - | data.posx=posx-data.page*dwidth; | + | cont.statex=true; |
| - | data.posy=i.getPositionY(); | + | if(dposy<cont.miny&&scrollLimit) |
| - | if(i.getProperties().getBoolean("i.onGrid")) | + | cont.statey=true; |
| - | { | + | |
| - | var cell=i.getCell(); | + | var items0=(cont.pages[(cont.statex?maxpagex:currentx)-minpagex]||[])[(cont.statey?maxpagey:currenty)-minpagey]; |
| - | data.left=cell.getLeft(); | + | if(items0!=null) |
| - | data.right=cell.getRight(); | + | { |
| - | data.top=cell.getTop(); | + | for(z=0;z<items0.length;z++) |
| - | data.bottom=cell.getBottom(); | + | { |
| - | } | + | var item=LL.getItemById(items0[z]); |
| - | else data.left=null; | + | var data=JSON.parse(item.getTag()); |
| - | i.setTag(JSON.stringify(data)); | + | item.setScale(((data.pin=="X"||percentx>=0.5||percenty>=0.5)?1:data.rot?1-percenty*2:1-percentx*2)*data.sx, ((data.pin=="Y"||percentx>=0.5||percenty>=0.5)?1:1-(data.rot?percentx:percenty)*2)*data.sy); |
| - | i.getProperties().edit().setBoolean("i.onGrid",false).commit(); | + | item.setPosition(data.pin=="X"?data.posx:dposx+((data.posx%dwidth+dwidth)%dwidth)+percentx*(dwidth- ((data.posx%dwidth+dwidth)%dwidth)*2),data.pin=="Y"?data.posy:dposy+((data.posy%dheight+dheight)%dheight)+percenty*(dheight- ((data.posy%dheight+dheight)%dheight)*2)); |
| - | } | + | item.setVisibility((percentx<0.5||data.pin=="X")&&(percenty<0.5||data.pin=="Y")); |
| - | cont.setup=true; | + | } |
| - | Android.makeNewToast("Animation enabled",true).show(); | + | } |
| + | var items=(cont.pages[currentx+1-minpagex]||[])[(cont.statey?maxpagey:currenty)-minpagey]; | ||
| + | if(items!=null) | ||
| + | { | ||
| + | for(z=0;z<items.length;z++) | ||
| + | { | ||
| + | if(items0==null||items0.indexOf(items[z])==-1) | ||
| + | { | ||
| + | var item=LL.getItemById(items[z]); | ||
| + | var data=JSON.parse(item.getTag()); | ||
| + | item.setScale((data.pin=="X"||percentx<0.5||percenty>=0.5?1:data.rot?1-percenty*2:percentx>0.005?percentx*2-1:1)*data.sx,(data.pin=="Y"||percentx<0.5||percenty>=0.5?1:data.rot?(percentx>0.005?percentx*2-1:1):1-percenty*2)*data.sy); | ||
| + | item.setPosition(data.pin=="X"?data.posx:dposx+dwidth/2*(2-percentx*2)+ ((data.posx%dwidth+dwidth)%dwidth)*(percentx*2-1),data.pin=="Y"?data.posy:dposy+((data.posy%dheight+dheight)%dheight)+percenty*(dheight- ((data.posy%dheight+dheight)%dheight)*2)); | ||
| + | item.setVisibility((percentx>=0.5||data.pin=="X")&&(percenty<0.5||data.pin=="Y")); | ||
| + | } | ||
| + | } | ||
| + | } | ||
| + | var items=(cont.pages[(cont.statex?maxpagex:currentx)-minpagex]||[])[currenty+1-minpagey]; | ||
| + | if(items!=null) | ||
| + | { | ||
| + | for(z=0;z<items.length;z++) | ||
| + | { | ||
| + | if(items0==null||items0.indexOf(items[z])==-1) | ||
| + | { | ||
| + | var item=LL.getItemById(items[z]); | ||
| + | var data=JSON.parse(item.getTag()); | ||
| + | item.setScale((data.pin=="X"||percentx>=0.5||percenty<0.5?1:data.rot?(percenty>0.005?percenty*2-1:1):1-percentx*2)*data.sx,(data.pin=="Y"|| percentx>=0.5||percenty<0.5?1:data.rot?1-percentx*2:percenty>0.005?percenty*2-1:1)*data.sy); | ||
| + | item.setPosition(data.pin=="X"?data.posx:dposx+((data.posx%dwidth+dwidth)%dwidth)+percentx*(dwidth- ((data.posx%dwidth+dwidth)%dwidth)*2),data.pin=="Y"?data.posy:dposy+dheight/2*(2-percenty*2)+ ((data.posy%dheight+dheight)%dheight)*(percenty*2-1)); | ||
| + | item.setVisibility((percentx<0.5||data.pin=="X")&&(percenty>=0.5||data.pin=="Y")); | ||
| + | } | ||
| + | } | ||
| + | } | ||
| } | } | ||
| else | else | ||
| { | { | ||
| - | for(x=0;x<items.length;x++) | + | d.setPosition(dposx,dposy); |
| - | { | + | d.setPosition(dposx<cont.minx?cont.maxx-dwidth:dposx,dposy<cont.miny?cont.maxy-dheight:dposy,1,false); |
| - | var i=items. getAt(x); | + | cont.statex=false; |
| - | var data=JSON.parse(i.getTag()); | + | cont.statey=false; |
| - | if(data!=null && data.left!=null) | + | for(i=0;i<items.length;i++) |
| - | { | + | { |
| - | i.getProperties().edit().setBoolean("i.onGrid",true).commit(); | + | item=items.getAt(i); |
| - | i.setCell(parseInt(data.left), parseInt(data.top), parseInt(data.right), parseInt(data.bottom)); | + | var data=JSON.parse(item.getTag()); |
| - | } | + | item.setScale(data.sx,data.sy); |
| - | } | + | item.setPosition(data.posx,data.posy); |
| - | cont.setup=false; | + | item.setVisibility(true); |
| - | Android.makeNewToast("Animation disabled",true).show(); | + | } |
| } | } | ||
| - | d.setTag(JSON.stringify(cont)); | + | </sxh> |
| - | </code> | + | |