function MagicScrollbar(document) {
  var styles = "@import url(http://tb4.fr/labs/jetpack/magicscrollbar/scrollbar-contents.css);";
  var newSS=document.createElement('link');
  newSS.rel='stylesheet';
  newSS.href='data:text/css,'+escape(styles);
  document.getElementsByTagName("head")[0].appendChild(newSS);
  
  // Setup navigation element (magic scrollbar)
  var jqNavContainer = $("<div id='scrollbar-contents'></div>", document);
  var jqNavUl = $('<ul></ul>', document);
  $("body", document).append(jqNavContainer);
  jqNavContainer.append(jqNavUl);
  
  // Get Sections for linuxfr.org
  var jqSections = $("h1.contenttitle, div.comments > h1", document);
  
  // Generate a unique ID
  var uniqueIdCount = 0
  function uniqueId() {
    return "scrollbar-contents-item-" + (uniqueIdCount++);
  }  
  
  function hideNav() {
    jqNavContainer.addClass('scrollbar-contents-hide');
    jqNavContainer.removeClass('scrollbar-contents-show');
  }
  function showNav() {
    jqNavContainer.removeClass('scrollbar-contents-hide');
    jqNavContainer.addClass('scrollbar-contents-show');
  }
  
  jqNavContainer.mouseover(showNav);
  jqNavContainer.focus(showNav);
  jqNavContainer.mouseout(hideNav);
  jqNavContainer.blur(hideNav);
  
  hideNav();
  
  var currentlySelected;
  var previousSetCurrentEvent;
  function setCurrent(navAnchorReference, sourceEvent) {
    if (sourceEvent == "scroll" && previousSetCurrentEvent == "click") {
    } else {
      if (currentlySelected !== navAnchorReference) {
        navAnchorReference.setSelected();
        if (currentlySelected) {
          currentlySelected.setDeselected();
        }
        currentlySelected = navAnchorReference;
      }
    }
    previousSetCurrentEvent = sourceEvent;
  }

  if (jqSections.length > 0) {
    var navAnchors = new Array();

    // navAnchor CLASS
    var navAnchor = function(sectionElem) {
      var navAnchorPub = new Object();

      var jqSectionElem = $(sectionElem);
      if (!jqSectionElem.attr('id')) {
        jqSectionElem.attr('id', uniqueId)
      }
      
      var linkElement = $('<a>'+jqSectionElem.text()+'</a>', document);
      var jqLi = $('<li></li>', document);
      jqLi.addClass(jqSectionElem.attr('id'));
      linkElement.attr('href', '#'+jqSectionElem.attr('id'));
      linkElement.wrap("<span></span>");
      navAnchorPub.jqSlug = linkElement.parent();
      jqLi.append(navAnchorPub.jqSlug);
      
      navAnchorPub.liElement = jqLi[0];
      navAnchorPub.yPos = 0;
      navAnchorPub.sectionHeight = 0;
      navAnchorPub.sectionTop = 0;  
      navAnchorPub.setHeight = 0;
      navAnchorPub.setTop = 0;

      linkElement.click(function() {
        setCurrent(navAnchorPub, "click");
      });
      
      navAnchorPub.resetYPos = function() {
        //navAnchorPub.yPos = $(linkElement.attr("href"), document).offset().top;
        navAnchorPub.yPos = $(linkElement.attr("href"), document)[0].offsetTop;
      }
      
      var selected = false;
      
      navAnchorPub.setSelected = function() {
        if (selected != true) {
          navAnchorPub.jqSlug.addClass("current");
          selected = true;
        }
      }
      
      navAnchorPub.setDeselected = function() {
        if (selected == true) {
          navAnchorPub.jqSlug.removeClass("current");
          selected = false;
        }
      }
        
      return navAnchorPub;
    }
  
    // Create navAnchor objects
    jqSections.each(function(i){
      var tempNavAnchor = new navAnchor(this);
      navAnchors.push(tempNavAnchor);
      jqNavUl.append(tempNavAnchor.liElement);
    });

    var previousDocHeight = 0;

    // Position function
    function positionNavAnchors() {
      var docHeight = document.height;

      var viewHeight;
      viewHeight = jetpack.tabs[0].contentWindow.innerHeight;
      
      if (docHeight != previousDocHeight) {
        for (var i = 0; i < navAnchors.length; i++) {
          navAnchors[i].resetYPos();
        }
        previousDocHeight = docHeight;
      }
      
      // Run through each item, determing the height & space from top
      for (var current = 0; current < navAnchors.length; current++) {
        var next = current + 1;
        if (current == 0) {
          // First
          navAnchors[current].sectionHeight = navAnchors[next].yPos - navAnchors[current].yPos;
          navAnchors[current].sectionTop = navAnchors[current].yPos;
        } else if (next < navAnchors.length) {
          navAnchors[current].sectionHeight = navAnchors[next].yPos - navAnchors[current].yPos;
          navAnchors[current].sectionTop = 0;
        } else {
          // Last
          navAnchors[current].sectionHeight = docHeight - navAnchors[current].yPos;          
          navAnchors[current].sectionTop = 0;
        }
      }
      
      // New array of navAnchors ordered by sectionHeight
      var compareSectionHeight = function(a, b) {
        if (a.sectionHeight < b.sectionHeight) {
          return -1;
        } else if (a.sectionHeight > b.sectionHeight) {
          return 1;
        }
        return 0;
      }  
      var navAnchorsOrdered = navAnchors.slice(0);
      navAnchorsOrdered.sort(compareSectionHeight);
      
      // Track the remaining space while assigning heights
      var docRemaining = docHeight;
      var spaceRemaining = viewHeight;
      
      // Set height to a % of spaceRemaining based on sectionHeight/docRemaining
      for (var i = 0; i < navAnchorsOrdered.length; i++) {
        // Remove inline styles
        navAnchorsOrdered[i].jqSlug.attr("style", "");
        navAnchorsOrdered[i].jqSlug.css("display", "block");
        // Default min-height to compare with computed ideal height
        var currentHeight = navAnchorsOrdered[i].jqSlug.height();
        var testHeight = (navAnchorsOrdered[i].sectionHeight / docRemaining) * spaceRemaining;
        navAnchorsOrdered[i].setTop =  (navAnchorsOrdered[i].sectionTop / docRemaining) * spaceRemaining;
        
        if (testHeight < currentHeight) {
          navAnchorsOrdered[i].setHeight = 0;
          spaceRemaining -= currentHeight;
        } else {
          navAnchorsOrdered[i].setHeight = testHeight;
          spaceRemaining -= testHeight;        
        }
        spaceRemaining -= navAnchorsOrdered[i].setTop;
        docRemaining -= navAnchorsOrdered[i].sectionHeight;
        docRemaining -= navAnchorsOrdered[i].sectionTop;  
      }
      
      // RENDER
      for (var i = 0; i < navAnchorsOrdered.length; i++) {
    
        if (navAnchors[i].setHeight > 0) {
          navAnchors[i].jqSlug.height(navAnchors[i].setHeight);
        }
        
        if (navAnchors[i].setTop > 0) {
          navAnchors[i].jqSlug.css("margin-top", navAnchors[i].setTop);
        }
      }

    }
    
    // Highlight the current section in view
    function checkCurrent(evt) {

      var scrollY = 0;
      scrollY = document.body.scrollTop;
      
      for (var i = 0; i < navAnchors.length; i++) {
        if (scrollY >= navAnchors[i].yPos && scrollY < (navAnchors[i].yPos + navAnchors[i].sectionHeight)) {
          setCurrent(navAnchors[i], "scroll");
        }
      }
    }
  
    // Position
    positionNavAnchors();
    // $(window).resize(positionNavAnchors);
    // Highlight the current section in view 
    checkCurrent();
    //$(window).scroll(checkCurrent); TODO
  }
}

jetpack.future.import("pageMods");
jetpack.pageMods.add(MagicScrollbar, ["http://*.linuxfr.org/*", "https://*.linuxfr.org/*", "http://linuxfr.org/*", "https://linuxfr.org/*"]);