From 10ecffd81cdbfc2eb72dda53c4039701687aae33 Mon Sep 17 00:00:00 2001
From: Adrian Lang <lang@cosmocode.de>
Date: Mon, 22 Aug 2011 14:55:02 +0200
Subject: page.js: Improve footnote cleaning regex, cleaner toc toggling

  * <sup> elements are only removed from the start of a footnote
  * the TOC wrapper instantly gets the target size to reduce layout jumping
---
 lib/scripts/page.js | 60 +++++++++++++++++++++++++++++++----------------------
 1 file changed, 35 insertions(+), 25 deletions(-)

(limited to 'lib/scripts')

diff --git a/lib/scripts/page.js b/lib/scripts/page.js
index f3d35609d..e4033b76d 100644
--- a/lib/scripts/page.js
+++ b/lib/scripts/page.js
@@ -21,8 +21,8 @@ dw_page = {
     sectionHighlight: function() {
         jQuery('form.btn_secedit')
             .mouseover(function(){
-                var $tgt = jQuery(this).parent();
-                var nr = $tgt.attr('class').match(/(\s+|^)editbutton_(\d+)(\s+|$)/)[2];
+                var $tgt = jQuery(this).parent(),
+                    nr = $tgt.attr('class').match(/(\s+|^)editbutton_(\d+)(\s+|$)/)[2];
 
                 // Walk the DOM tree up (first previous siblings, then parents)
                 // until boundary element
@@ -74,38 +74,38 @@ dw_page = {
      * @author Andreas Gohr <andi@splitbrain.org>
      * @author Chris Smith <chris@jalakai.co.uk>
      */
-    footnoteDisplay: function(e){
-        var $fndiv = dw_page.insituPopup(this, 'insitu__fn');
+    footnoteDisplay: function () {
+        var content = jQuery(jQuery(this).attr('href')) // Footnote text anchor
+                      .closest('div.fn').html();
 
-        // locate the footnote anchor element
-        var $a = jQuery("#fn__" + e.target.id.substr(5));
-        if (!$a.length){ return; }
-
-        // anchor parent is the footnote container, get its innerHTML
-        var content = new String ($a.parent().parent().html());
+        if (content === null){
+            return;
+        }
 
         // strip the leading content anchors and their comma separators
-        content = content.replace(/<sup>.*<\/sup>/gi, '');
-        content = content.replace(/^\s+(,\s+)+/,'');
+        content = content.replace(/((^|\s*,\s*)<sup>.*?<\/sup>)+\s*/gi, '');
 
         // prefix ids on any elements with "insitu__" to ensure they remain unique
         content = content.replace(/\bid=(['"])([^"']+)\1/gi,'id="insitu__$2');
 
         // now put the content into the wrapper
-        $fndiv.html(content);
-        $fndiv.show();
+        dw_page.insituPopup(this, 'insitu__fn').html(content).show();
     },
 
     /**
      * Adds the toggle switch to the TOC
      */
     initTocToggle: function() {
-        var $header = jQuery('#toc__header');
-        if(!$header.length) return;
-        var $toc    = jQuery('#toc__inside');
+        var $header, $clicky, $toc, $tocul, setClicky;
+        $header = jQuery('#toc__header');
+        if(!$header.length) {
+            return;
+        }
+        $toc = jQuery('#toc__inside');
+        $tocul = $toc.children('ul.toc');
 
-        var setClicky = function(){
-            if($toc.css('display') == 'none'){
+        setClicky = function(hiding){
+            if(hiding){
                 $clicky.html('<span>+</span>');
                 $clicky[0].className = 'toc_open';
             }else{
@@ -114,18 +114,28 @@ dw_page = {
             }
         };
 
-        var $clicky = jQuery(document.createElement('span'))
-                        .attr('id','toc__toggle')
+        $clicky = jQuery(document.createElement('span'))
+                        .attr('id','toc__toggle');
         $header.css('cursor','pointer')
-               .click(function(){
-                    $toc.slideToggle(200,setClicky);
+               .click(function () {
+                    var hidden;
+
+                    // Assert that $toc instantly takes the whole TOC space
+                    $toc.css('height', $toc.height()).show();
+
+                    hidden = $tocul.stop(true, true).is(':hidden');
+
+                    setClicky(!hidden);
+
+                    // Start animation and assure that $toc is hidden/visible
+                    $tocul.dw_toggle(hidden, function () {
+                        $toc.toggle(hidden);
+                    });
                 })
                .prepend($clicky);
 
         setClicky();
     }
-
-
 };
 
 jQuery(dw_page.init);
-- 
cgit v1.2.3