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 }, 14 15 /** 16 * Highlight the section when hovering over the appropriate section edit button 17 * 18 * @author Andreas Gohr <andi@splitbrain.org> 19 */ 20 sectionHighlight: function() { 21 jQuery('form.btn_secedit') 22 .mouseover(function(){ 23 var $tgt = jQuery(this).parent(); 24 var nr = $tgt.attr('class').match(/(\s+|^)editbutton_(\d+)(\s+|$)/)[2]; 25 26 // Walk the DOM tree up (first previous siblings, then parents) 27 // until boundary element 28 while($tgt.length > 0 && !$tgt.hasClass('sectionedit' + nr)) { 29 // $.last gives the DOM-ordered last element: 30 // prev if present, else parent. 31 $tgt = $tgt.prev().add($tgt.parent()).last(); 32 $tgt.addClass('section_highlight'); 33 } 34 }) 35 .mouseout(function(){ 36 jQuery('.section_highlight').removeClass('section_highlight'); 37 }); 38 }, 39 40 /** 41 * Create/get a insitu popup used by the footnotes 42 * 43 * @param target - the DOM element at which the popup should be aligned at 44 * @param popup_id - the ID of the (new) DOM popup 45 * @return the Popup JQuery object 46 */ 47 insituPopup: function(target, popup_id) { 48 // get or create the popup div 49 var $fndiv = jQuery('#' + popup_id); 50 51 // popup doesn't exist, yet -> create it 52 if($fndiv.length === 0){ 53 $fndiv = jQuery(document.createElement('div')) 54 .attr('id', popup_id) 55 .addClass('insitu-footnote JSpopup') 56 .mouseleave(function () {jQuery(this).hide();}); 57 jQuery('div.dokuwiki:first').append($fndiv); 58 } 59 60 // position() does not support hidden elements 61 $fndiv.show().position({ 62 my: 'left top', 63 at: 'left center', 64 of: target 65 }).hide(); 66 67 return $fndiv; 68 }, 69 70 /** 71 * Display an insitu footnote popup 72 * 73 * @author Andreas Gohr <andi@splitbrain.org> 74 * @author Chris Smith <chris@jalakai.co.uk> 75 */ 76 footnoteDisplay: function(e){ 77 var $fndiv = dw_page.insituPopup(this, 'insitu__fn'); 78 79 // locate the footnote anchor element 80 var $a = jQuery("#fn__" + e.target.id.substr(5)); 81 if (!$a.length){ return; } 82 83 // anchor parent is the footnote container, get its innerHTML 84 var content = new String ($a.parent().parent().html()); 85 86 // strip the leading content anchors and their comma separators 87 content = content.replace(/<sup>.*<\/sup>/gi, ''); 88 content = content.replace(/^\s+(,\s+)+/,''); 89 90 // prefix ids on any elements with "insitu__" to ensure they remain unique 91 content = content.replace(/\bid=(['"])([^"']+)\1/gi,'id="insitu__$2'); 92 93 // now put the content into the wrapper 94 $fndiv.html(content); 95 $fndiv.show(); 96 } 97}; 98 99jQuery(dw_page.init); 100