1/** 2 * Page behaviours 3 * 4 * This class adds various behaviours to the rendered page 5 */ 6dw_page = { 7 /** 8 * initialize page behaviours 9 */ 10 init: function(){ 11 dw_page.sectionHighlight(); 12 jQuery('a.fn_top').mouseover(dw_page.footnoteDisplay); 13 dw_page.initTocToggle(); 14 }, 15 16 /** 17 * Highlight the section when hovering over the appropriate section edit button 18 * 19 * @author Andreas Gohr <andi@splitbrain.org> 20 */ 21 sectionHighlight: function() { 22 jQuery('form.btn_secedit') 23 .mouseover(function(){ 24 var $tgt = jQuery(this).parent(); 25 var nr = $tgt.attr('class').match(/(\s+|^)editbutton_(\d+)(\s+|$)/)[2]; 26 27 // Walk the DOM tree up (first previous siblings, then parents) 28 // until boundary element 29 while($tgt.length > 0 && !$tgt.hasClass('sectionedit' + nr)) { 30 // $.last gives the DOM-ordered last element: 31 // prev if present, else parent. 32 $tgt = $tgt.prev().add($tgt.parent()).last(); 33 $tgt.addClass('section_highlight'); 34 } 35 }) 36 .mouseout(function(){ 37 jQuery('.section_highlight').removeClass('section_highlight'); 38 }); 39 }, 40 41 /** 42 * Create/get a insitu popup used by the footnotes 43 * 44 * @param target - the DOM element at which the popup should be aligned at 45 * @param popup_id - the ID of the (new) DOM popup 46 * @return the Popup JQuery object 47 */ 48 insituPopup: function(target, popup_id) { 49 // get or create the popup div 50 var $fndiv = jQuery('#' + popup_id); 51 52 // popup doesn't exist, yet -> create it 53 if($fndiv.length === 0){ 54 $fndiv = jQuery(document.createElement('div')) 55 .attr('id', popup_id) 56 .addClass('insitu-footnote JSpopup') 57 .mouseleave(function () {jQuery(this).hide();}); 58 jQuery('div.dokuwiki:first').append($fndiv); 59 } 60 61 // position() does not support hidden elements 62 $fndiv.show().position({ 63 my: 'left top', 64 at: 'left center', 65 of: target 66 }).hide(); 67 68 return $fndiv; 69 }, 70 71 /** 72 * Display an insitu footnote popup 73 * 74 * @author Andreas Gohr <andi@splitbrain.org> 75 * @author Chris Smith <chris@jalakai.co.uk> 76 */ 77 footnoteDisplay: function(e){ 78 var $fndiv = dw_page.insituPopup(this, 'insitu__fn'); 79 80 // locate the footnote anchor element 81 var $a = jQuery("#fn__" + e.target.id.substr(5)); 82 if (!$a.length){ return; } 83 84 // anchor parent is the footnote container, get its innerHTML 85 var content = new String ($a.parent().parent().html()); 86 87 // strip the leading content anchors and their comma separators 88 content = content.replace(/<sup>.*<\/sup>/gi, ''); 89 content = content.replace(/^\s+(,\s+)+/,''); 90 91 // prefix ids on any elements with "insitu__" to ensure they remain unique 92 content = content.replace(/\bid=(['"])([^"']+)\1/gi,'id="insitu__$2'); 93 94 // now put the content into the wrapper 95 $fndiv.html(content); 96 $fndiv.show(); 97 }, 98 99 /** 100 * Adds the toggle switch to the TOC 101 */ 102 initTocToggle: function() { 103 var $header = jQuery('#toc__header'); 104 if(!$header.length) return; 105 var $toc = jQuery('#toc__inside'); 106 107 var setClicky = function(){ 108 if($toc.css('display') == 'none'){ 109 $clicky.html('<span>+</span>'); 110 $clicky[0].className = 'toc_open'; 111 }else{ 112 $clicky.html('<span>−</span>'); 113 $clicky[0].className = 'toc_close'; 114 } 115 }; 116 117 var $clicky = jQuery(document.createElement('span')) 118 .attr('id','toc__toggle') 119 $header.css('cursor','pointer') 120 .click(function(){ 121 $toc.slideToggle(200,setClicky); 122 }) 123 .prepend($clicky); 124 125 setClicky(); 126 } 127 128 129}; 130 131jQuery(dw_page.init); 132