1/* DOKUWIKI:include script/navbar.js */ 2/** 3 * We handle several device classes based on browser width. 4 * 5 * - desktop: > __tablet_width__ (as set in style.ini) 6 * - mobile: 7 * - tablet <= __tablet_width__ 8 * - phone <= __phone_width__ 9 */ 10var device_class = ''; // not yet known 11var device_classes = 'desktop mobile tablet phone'; 12 13function tpl_dokuwiki_mobile(){ 14 15 // the z-index in mobile.css is (mis-)used purely for detecting the screen mode here 16 var screen_mode = jQuery('#screen__mode').css('z-index') + ''; 17 18 // determine our device pattern 19 // TODO: consider moving into dokuwiki core 20 switch (screen_mode) { 21 case '1': 22 if (device_class.match(/tablet/)) return; 23 device_class = 'mobile tablet'; 24 break; 25 case '2': 26 if (device_class.match(/phone/)) return; 27 device_class = 'mobile phone'; 28 break; 29 default: 30 if (device_class == 'desktop') return; 31 device_class = 'desktop'; 32 } 33 34 jQuery('html').removeClass(device_classes).addClass(device_class); 35 36 // handle some layout changes based on change in device 37 var $handle = jQuery('#dokuwiki__aside h3.toggle'); 38 var $toc = jQuery('#dw__toc h3'); 39 40 if (device_class == 'desktop') { 41 // reset for desktop mode 42 if($handle.length) { 43 $handle[0].setState(1); 44 $handle.hide(); 45 jQuery('#dokuwiki__aside').appendTo('#navbar'); 46 document.getElementById("navbar").style.visibility = "visible"; 47 document.getElementById("openbtn").style.visibility = "hidden"; 48 document.getElementById("main").style.left = "18em"; 49 } 50 if($toc.length) { 51 $toc[0].setState(1); 52 } 53 } 54 if (device_class.match(/mobile/)){ 55 // toc and sidebar hiding 56 if($handle.length) { 57 $handle.show(); 58 $handle[0].setState(-1); 59 jQuery('#dokuwiki__aside').insertBefore('#dokuwiki__content'); 60 document.getElementById("navbar").style.visibility = "hidden"; 61 document.getElementById("main").style.left = "0"; 62 document.getElementById("openbtn").style.visibility = "hidden"; 63 } 64 if($toc.length) { 65 $toc[0].setState(-1); 66 } 67 } 68} 69 70jQuery(function(){ 71 SetScrollPosition(); 72 var resizeTimer; 73 dw_page.makeToggle('#dokuwiki__aside h3.toggle','#dokuwiki__aside div.content'); 74 75 jQuery(window).on('resize', 76 function(){ 77 if (resizeTimer) clearTimeout(resizeTimer); 78 resizeTimer = setTimeout(tpl_dokuwiki_mobile,200); 79 } 80 ); 81 82 /** increase sidebar length to match content (desktop mode only) 83 var $sidebar = jQuery('.desktop #dokuwiki__aside'); 84 if($sidebar.length) { 85 var $content = jQuery('#dokuwiki__content div.page'); 86 $content.css('min-height', $sidebar.height()); 87 } 88 */ 89}); 90