script_scrollbar_interactive

====== 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_scrollbar_interactive [2014/05/03 19:55]
tbog [Script code]
script_scrollbar_interactive [2014/05/07 13:07] (current)
tbog [Script code]
Line 1: Line 1:
 ====== About script ====== ====== About script ======
   * Purpose : Scrollbar to show screen position in container. Also click on scrollbar to go scroll to that position   * Purpose : Scrollbar to show screen position in container. Also click on scrollbar to go scroll to that position
-  * Author : TBog +  * Author : [[www.google.com/​+BogdanTautuTBog|TBog]] 
-  * Link: www.google.com/​+BogdanTautuTBog +  * Link: [[https://​plus.google.com/​104484987458557530625/​posts/​J2t8AeTiTXr|for feedback]]
 ====== How to use the script ====== ====== How to use the script ======
   - Create a panel with the label **__scrollBar__** inside the container you want to have a scrollbar into.   - Create a panel with the label **__scrollBar__** inside the container you want to have a scrollbar into.
Line 15: Line 14:
 ====== Photo examples ====== ====== Photo examples ======
  
-[[https://​lh3.googleusercontent.com/​-dS-pTuih_Ok/​U2UdJb4YoZI/​AAAAAAAARf8/​a2-wIofUoWQ/​w516-h108-no/​2014-05-03+16.46.53.png|Horizontal scrollbar]] panel has white borders, inside panel red grid that represents pagesgreen indicator. +  * [[https://​lh3.googleusercontent.com/​-dS-pTuih_Ok/​U2UdJb4YoZI/​AAAAAAAARf8/​a2-wIofUoWQ/​w516-h108-no/​2014-05-03+16.46.53.png|Horizontal scrollbar]] ​where the panel has white borders, inside panel red grid that represents pages and a green indicator. 
- +  ​* ​[[https://​lh4.googleusercontent.com/​-RtsolwWaWBM/​U2UdTo3V2NI/​AAAAAAAARgE/​k650ZxJ1srU/​w1329-h4362-no/​2014-05-03+16.45.44.png|Vertical scrollbar]] inside a folder ​on the right side.
-[[https://​lh4.googleusercontent.com/​-RtsolwWaWBM/​U2UdTo3V2NI/​AAAAAAAARgE/​k650ZxJ1srU/​w1329-h4362-no/​2014-05-03+16.45.44.png|Vertical scrollbar]] inside a folder. +
 ====== Script code ====== ====== Script code ======
 **__updateScrollBar__** **__updateScrollBar__**
Line 44: Line 41:
 fg.setPosition(fgX,​ fgY); fg.setPosition(fgX,​ fgY);
 </​code>​ </​code>​
 +
 +----
  
 **__onScrollbarTap__** **__onScrollbarTap__**
Line 91: Line 90:
 </​code>​ </​code>​
  
-TODO: Script to setup more easily+---- 
 + 
 +Script to set scrollbar inside a folder ​easily. It places the scrollbar on the right side of the last cell column, this requires to have a custom folder width and custom cell width. 
 +Set script to appear in the item menu and run it from any item inside the folder. 
 +<​code>​ 
 +var thickness = 50; 
 + 
 +function getContainerCellCountX(c) 
 +
 +  var items = c.getItems();​ 
 +  var I = items.getLength() - 1; 
 +  var max = Number.MIN_VALUE;​ 
 +  var min = Number.MAX_VALUE;​ 
 +  while ( I >= 0 ) 
 +  { 
 +    var item = items.getAt(I--);​ 
 +    if ( !item.getProperties().getBoolean("​i.onGrid"​) ) 
 +      continue; 
 +    var r = item.getCell();​ 
 +    max = Math.max(max,​ r.getRight());​ 
 +    min = Math.min(min,​ r.getLeft());​ 
 +  } 
 +  return max - min; 
 +
 + 
 +var c = LL.getEvent().getContainer();​ 
 +var sb = c.getItemByLabel("​scrollBar"​);​ 
 +// right 
 +sb.setSize(thickness,​ c.getHeight());​ 
 +var width = c.getOpener().getProperties().getInteger("​f.wW"​);​ 
 +var space = width - getContainerCellCountX(c) * c.getCellWidth();​ 
 +var padding = space - thickness;​ 
 + 
 +alert("​found width "​+width+";​ space "​+space+";​ will use "​+padding+"​ padding"​);​ 
 + 
 +sb.setPosition(width - thickness, 0); 
 + 
 +c.setPosition(0,​ 0); 
 +</​code>​
script_scrollbar_interactive.1399146946.txt.gz · Last modified: 2014/05/03 19:55 by tbog