joseph/Monocle — Issue #94: Suggestion: class names for prev/next panels
Author: joloco
Created: 2012-02-29 02:04:47+00:00
State: open

Hi,

I'm not sure how to use github, so I'm putting this here!

I use the 'marginal' panels, and wanted "back" and "next" page arrows on my touch panels. In panels/marginal.js, I added two lines to the ```setWidths``` function to add class names to the back and next areas...

```javascript
function setWidths() {
var page = flipper.properties.reader.dom.find('page');
var sheaf = page.m.sheafDiv;
var bw = sheaf.offsetLeft;
var fw = page.offsetWidth - (sheaf.offsetLeft + sheaf.offsetWidth);
bw = Math.floor(((bw - 2) / page.offsetWidth) * 10000 / 100 ) + "%";
fw = Math.floor(((fw - 2) / page.offsetWidth) * 10000 / 100 ) + "%";
p.panels.forwards.properties.div.style.width = fw;
p.panels.backwards.properties.div.style.width = bw;
// new lines below
p.panels.forwards.properties.div.className += " page_next";
p.panels.backwards.properties.div.className += " page_prev";
}
```

This allows me to add nice light grey arrows to the panels. I'm sure this could easily be added to the other panel types.