Lightning Launcher

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== About script ======
  * Purpose : Scrollbar to show screen position in container. Also click on scrollbar to go scroll to that position
  * Author : [[www.google.com/+BogdanTautuTBog|TBog]]
  * Link: [[https://plus.google.com/104484987458557530625/posts/J2t8AeTiTXr|for feedback]]
====== How to use the script ======
  - Create a panel with the label **__scrollBar__** inside the container you want to have a scrollbar into.
  - Inside the panel place an item, detached from grid and not clickable. Disable label and icon. Set background color. This will be the page indicator.
  - Set **onScrollBarTap** script as the //tap empty space// event of the panel. Optional: disable panel scrolling.
  - Set **updateScrollBar** script to the change position event of the container that holds the **__scrollBar__** panel

//__Optional__:// Can set grid on the **__scrollBar__** panel to show pages, must manually set the layout of the panel and select the grid size according to the number of pages ( or items if you're so inclined )

In the **onScrollBarTap** script you can configure where to scroll on tap. Set **bSnapGrid** to **true** to snap at grid position ( or else you will see partial items ), or set **bSnapPage** to **true** to snap at page positions ( or else you will be able to see partial pages )
====== 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]] 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.
====== Script code ======
**__updateScrollBar__**
<code>
var c = LL.getEvent().getContainer();
var bgC = c.getItemByLabel("scrollBar").getContainer();
var fg = bgC.getItems().getAt(0);

var bgW = bgC.getWidth();
var bgH = bgC.getHeight();

var bb = c.getBoundingBox();
var wholeW = bb.getRight() - bb.getLeft();
var wholeH = bb.getBottom() - bb.getTop();

var fgW = Math.min(1, c.getWidth() / wholeW) * bgW;
var fgH = Math.min(1, c.getHeight() / wholeH) * bgH;

var fgX = bgW * (c.getPositionX() - bb.getLeft()) / wholeW;
var fgY = bgH * (c.getPositionY() - bb.getTop()) / wholeH;

bgC.setPosition(0, 0, 1, false);
//fg.setScale(1, 1);
fg.setSize(fgW, fgH);
fg.setPosition(fgX, fgY);
</code>

----

**__onScrollbarTap__**
<code>
var bSnapPage = false;
var bSnapGrid = true;

var e = LL.getEvent();
var ey= e.getTouchY();
var ex= e.getTouchX();
var ec= e.getContainer();
var itm = ec.getOpener();
var c = itm.getParent();
var w = c.getWidth();
var h = c.getHeight();

var bb= c.getBoundingBox();
var wholeW = bb.getRight() - bb.getLeft();
var wholeH = bb.getBottom() - bb.getTop();

var pPW = w / wholeW;
var pPH = h / wholeH;

var pX = ex / ec.getWidth();
var pY = ey / ec.getHeight();
if ( bSnapPage )
{
  pX-= pX % pPW;
  pY-= pY % pPH;
}
else
{
  pX-= pPW * 0.5;
  pY-= pPH * 0.5;
}
if ( bSnapGrid )
{
  var pGW = c.getCellWidth() / wholeW;
  var pGH = c.getCellHeight() / wholeH;
  pX-= pX % pGW;
  pY-= pY % pGH;
}
pX = Math.min(1 - pPW, Math.max(0, pX));
pY = Math.min(1 - pPH, Math.max(0, pY));

LL.goToDesktopPosition(c.getId(), pX * wholeW + bb.getLeft(), pY * wholeH + bb.getTop());
</code>

----

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>
Lightning Launcher

User Tools

Site Tools

Page Tools
