diff options
| author | Christopher Smith <chris@jalakai.co.uk> | 2012-06-30 14:51:49 +0100 |
|---|---|---|
| committer | Christopher Smith <chris@jalakai.co.uk> | 2012-06-30 14:52:07 +0100 |
| commit | 2329bcd3221cf684db3352d71182139b7d9e5281 (patch) | |
| tree | 933ab2b1c5490c1a6d86e6c57a3b314e674f246f | |
| parent | ea39a99f28e4fd1d71a629dac7a18a12875ae5c8 (diff) | |
| download | rpg-2329bcd3221cf684db3352d71182139b7d9e5281.tar.gz rpg-2329bcd3221cf684db3352d71182139b7d9e5281.tar.bz2 | |
separate determination of device class & set as an html class on <html>, only attempt layout changes with device class changes
| -rw-r--r-- | lib/tpl/dokuwiki/script.js | 38 |
1 files changed, 34 insertions, 4 deletions
diff --git a/lib/tpl/dokuwiki/script.js b/lib/tpl/dokuwiki/script.js index 5badb5859..069f2526f 100644 --- a/lib/tpl/dokuwiki/script.js +++ b/lib/tpl/dokuwiki/script.js @@ -1,9 +1,38 @@ +/** + * We handle several device classes based on browser width. + * see http://twitter.github.com/bootstrap/scaffolding.html#responsive + * + * - desktop: 980+ + * - mobile: < 980 + * - tablet 481 - 979 (ostensibly for tablets in portrait mode) + * - phone <= 480 + */ +var device_class = 'not yet known'; +var device_classes = 'desktop mobile tablet phone'; + function tpl_dokuwiki_mobile(){ - // check if we are in mobile or tablet mode be sure to adjust the number - // here when adjusting it in the css + + // determine our device pattern + // TODO: consider moving into dokuwiki core + var w = document.body.clientWidth; + if (w > 979) { + if (device_class == 'desktop') return; + device_class = 'desktop'; + } else if (w > 480) { + if (device_class.match(/tablet/)) return; + device_class = 'mobile tablet'; + } else { + if (device_class.match(/phone/)) return; + device_class = 'mobile phone'; + } + + jQuery('html').removeClass(device_classes).addClass(device_class); + + // handle some layout changes based on change in device var $handle = jQuery('#dokuwiki__aside h3.toggle'); var $toc = jQuery('#dw__toc h3'); - if(document.body.clientWidth > 979) { + + if (device_class == 'desktop') { // reset for desktop mode if($handle.length) { $handle[0].setState(1); @@ -12,7 +41,8 @@ function tpl_dokuwiki_mobile(){ if($toc.length) { $toc[0].setState(1); } - } else { + } + if (device_class.match(/mobile/)){ // toc and sidebar hiding if($handle.length) { $handle.show(); |