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 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('.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 () { 78 var content = jQuery(jQuery(this).attr('href')) // Footnote text anchor 79 .closest('div.fn').html(); 80 81 if (content === null){ 82 return; 83 } 84 85 // strip the leading content anchors and their comma separators 86 content = content.replace(/((^|\s*,\s*)<sup>.*?<\/sup>)+\s*/gi, ''); 87 88 // prefix ids on any elements with "insitu__" to ensure they remain unique 89 content = content.replace(/\bid=(['"])([^"']+)\1/gi,'id="insitu__$2'); 90 91 // now put the content into the wrapper 92 dw_page.insituPopup(this, 'insitu__fn').html(content).show(); 93 }, 94 95 /** 96 * Adds the toggle switch to the TOC 97 */ 98 initTocToggle: function() { 99 var $wrapper, $header, $clicky, $toc, $tocul, setClicky; 100 $wrapper = jQuery('#dw__toc'); 101 $header = jQuery('h3', $wrapper); 102 if(!$header.length) { 103 return; 104 } 105 $toc = jQuery('div', $wrapper).first(); 106 $tocul = jQuery('ul', $toc); 107 108 setClicky = function(hiding){ 109 if(hiding){ 110 $clicky.html('<span>+</span>'); 111 $wrapper.addClass('close').removeClass('open'); 112 }else{ 113 $clicky.html('<span>−</span>'); 114 $wrapper.addClass('open').removeClass('close'); 115 } 116 }; 117 118 $clicky = jQuery(document.createElement('strong')); 119 $header.css('cursor','pointer') 120 .click(function () { 121 var hidden; 122 123 // Assert that $toc instantly takes the whole TOC space 124 $toc.css('height', $toc.height()).show(); 125 126 hidden = $tocul.stop(true, true).is(':hidden'); 127 128 setClicky(!hidden); 129 130 // Start animation and assure that $toc is hidden/visible 131 $tocul.dw_toggle(hidden, function () { 132 $toc.toggle(hidden); 133 }); 134 }) 135 .prepend($clicky); 136 137 setClicky(); 138 } 139}; 140 141jQuery(dw_page.init); 142