User Tools

Site Tools


script_animation_flip

====== Differences ====== This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
script_animation_flip [2014/05/17 20:27]
lm13 [About the script]
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 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.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=itemsgetLength(); +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=itemsgetAt(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>+
script_animation_flip.1400358446.txt.gz · Last modified: 2014/05/17 20:27 by lm13