aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorMario Vavti <mario@mariovavti.com>2016-12-15 12:25:59 +0100
committerMario Vavti <mario@mariovavti.com>2016-12-15 12:26:35 +0100
commit61f105da6fcd10999178f40a1bdfea7b1cd388dc (patch)
treeaf11356911702bd3aa4fdab850aab1e3607171f9
parent1d3af68f298d89b94eb1faa61794cf4ee20cff15 (diff)
downloadvolse-hubzilla-61f105da6fcd10999178f40a1bdfea7b1cd388dc.tar.gz
volse-hubzilla-61f105da6fcd10999178f40a1bdfea7b1cd388dc.tar.bz2
volse-hubzilla-61f105da6fcd10999178f40a1bdfea7b1cd388dc.zip
reworked doco navigation
-rw-r--r--doc/toc.html525
-rw-r--r--view/tpl/help.tpl9
2 files changed, 246 insertions, 288 deletions
diff --git a/doc/toc.html b/doc/toc.html
index 0d342d25a..7fad42b36 100644
--- a/doc/toc.html
+++ b/doc/toc.html
@@ -15,10 +15,6 @@
#region_1 .widget ul ul {
list-style-type: none;
}
-
- .toc-content {
- background-color: white;
- }
.toc-content li,
#doco-top-toc li {
@@ -99,293 +95,272 @@
</div>
<script>
-// Sticky Plugin v1.0.4 for jQuery
-// =============
-// Author: Anthony Garand
-// Improvements by German M. Bravo (Kronuz) and Ruud Kamphuis (ruudk)
-// Improvements by Leonardo C. Daronco (daronco)
-// Created: 02/14/2011
-// Date: 07/20/2015
-// Website: http://stickyjs.com/
-// Description: Makes an element on the page stick on the screen as you scroll
-// It will only set the 'top' and 'position' of your element, you
-// might need to adjust the width in some cases.
+// Generated by CoffeeScript 1.10.0
-(function (factory) {
- if (typeof define === 'function' && define.amd) {
- // AMD. Register as an anonymous module.
- define(['jquery'], factory);
- } else if (typeof module === 'object' && module.exports) {
- // Node/CommonJS
- module.exports = factory(require('jquery'));
- } else {
- // Browser globals
- factory(jQuery);
- }
-}(function ($) {
- var slice = Array.prototype.slice; // save ref to original slice()
- var splice = Array.prototype.splice; // save ref to original slice()
+/**
+@license Sticky-kit v1.1.3 | MIT | Leaf Corcoran 2015 | http://leafo.net
+ */
- var defaults = {
- topSpacing: 0,
- bottomSpacing: 0,
- className: 'is-sticky',
- wrapperClassName: 'sticky-wrapper',
- center: false,
- getWidthFrom: '',
- widthFromWrapper: true, // works only when .getWidthFrom is empty
- responsiveWidth: false,
- zIndex: 'auto'
- },
- $window = $(window),
- $document = $(document),
- sticked = [],
- windowHeight = $window.height(),
- scroller = function() {
- var scrollTop = $window.scrollTop(),
- documentHeight = $document.height(),
- dwh = documentHeight - windowHeight,
- extra = (scrollTop > dwh) ? dwh - scrollTop : 0;
+(function() {
+ var $, win;
- for (var i = 0, l = sticked.length; i < l; i++) {
- var s = sticked[i],
- elementTop = s.stickyWrapper.offset().top,
- etse = elementTop - s.topSpacing - extra;
+ $ = window.jQuery;
- //update height in case of dynamic content
- s.stickyWrapper.css('height', s.stickyElement.outerHeight());
+ win = $(window);
- if (scrollTop <= etse) {
- if (s.currentTop !== null) {
- s.stickyElement
- .css({
- 'width': '',
- 'position': '',
- 'top': '',
- 'z-index': ''
- });
- s.stickyElement.parent().removeClass(s.className);
- s.stickyElement.trigger('sticky-end', [s]);
- s.currentTop = null;
- }
+ $.fn.stick_in_parent = function(opts) {
+ var doc, elm, enable_bottoming, fn, i, inner_scrolling, len, manual_spacer, offset_top, outer_width, parent_selector, recalc_every, sticky_class;
+ if (opts == null) {
+ opts = {};
+ }
+ sticky_class = opts.sticky_class, inner_scrolling = opts.inner_scrolling, recalc_every = opts.recalc_every, parent_selector = opts.parent, offset_top = opts.offset_top, manual_spacer = opts.spacer, enable_bottoming = opts.bottoming;
+ if (offset_top == null) {
+ offset_top = 0;
+ }
+ if (parent_selector == null) {
+ parent_selector = void 0;
+ }
+ if (inner_scrolling == null) {
+ inner_scrolling = true;
+ }
+ if (sticky_class == null) {
+ sticky_class = "is_stuck";
+ }
+ doc = $(document);
+ if (enable_bottoming == null) {
+ enable_bottoming = true;
+ }
+ outer_width = function(el) {
+ var _el, computed, w;
+ if (window.getComputedStyle) {
+ _el = el[0];
+ computed = window.getComputedStyle(el[0]);
+ w = parseFloat(computed.getPropertyValue("width")) + parseFloat(computed.getPropertyValue("margin-left")) + parseFloat(computed.getPropertyValue("margin-right"));
+ if (computed.getPropertyValue("box-sizing") !== "border-box") {
+ w += parseFloat(computed.getPropertyValue("border-left-width")) + parseFloat(computed.getPropertyValue("border-right-width")) + parseFloat(computed.getPropertyValue("padding-left")) + parseFloat(computed.getPropertyValue("padding-right"));
}
- else {
- var newTop = documentHeight - s.stickyElement.outerHeight()
- - s.topSpacing - s.bottomSpacing - scrollTop - extra;
- if (newTop < 0) {
- newTop = newTop + s.topSpacing;
- } else {
- newTop = s.topSpacing;
- }
- if (s.currentTop !== newTop) {
- var newWidth;
- if (s.getWidthFrom) {
- newWidth = $(s.getWidthFrom).width() || null;
- } else if (s.widthFromWrapper) {
- newWidth = s.stickyWrapper.width();
- }
- if (newWidth == null) {
- newWidth = s.stickyElement.width();
- }
- s.stickyElement
- .css('width', newWidth)
- .css('position', 'fixed')
- .css('top', newTop)
- .css('z-index', s.zIndex);
-
- s.stickyElement.parent().addClass(s.className);
-
- if (s.currentTop === null) {
- s.stickyElement.trigger('sticky-start', [s]);
- } else {
- // sticky is started but it have to be repositioned
- s.stickyElement.trigger('sticky-update', [s]);
- }
-
- if (s.currentTop === s.topSpacing && s.currentTop > newTop || s.currentTop === null && newTop < s.topSpacing) {
- // just reached bottom || just started to stick but bottom is already reached
- s.stickyElement.trigger('sticky-bottom-reached', [s]);
- } else if(s.currentTop !== null && newTop === s.topSpacing && s.currentTop < newTop) {
- // sticky is started && sticked at topSpacing && overflowing from top just finished
- s.stickyElement.trigger('sticky-bottom-unreached', [s]);
- }
-
- s.currentTop = newTop;
- }
-
- // Check if sticky has reached end of container and stop sticking
- var stickyWrapperContainer = s.stickyWrapper.parent();
- var unstick = (s.stickyElement.offset().top + s.stickyElement.outerHeight() >= stickyWrapperContainer.offset().top + stickyWrapperContainer.outerHeight()) && (s.stickyElement.offset().top <= s.topSpacing);
-
- if( unstick ) {
- s.stickyElement
- .css('position', 'absolute')
- .css('top', '')
- .css('bottom', 0)
- .css('z-index', '');
- } else {
- s.stickyElement
- .css('position', 'fixed')
- .css('top', newTop)
- .css('bottom', '')
- .css('z-index', s.zIndex);
+ return w;
+ } else {
+ return el.outerWidth(true);
+ }
+ };
+ fn = function(elm, padding_bottom, parent_top, parent_height, top, height, el_float, detached) {
+ var bottomed, detach, fixed, last_pos, last_scroll_height, offset, parent, recalc, recalc_and_tick, recalc_counter, spacer, tick;
+ if (elm.data("sticky_kit")) {
+ return;
+ }
+ elm.data("sticky_kit", true);
+ last_scroll_height = doc.height();
+ parent = elm.parent();
+ if (parent_selector != null) {
+ parent = parent.closest(parent_selector);
+ }
+ if (!parent.length) {
+ throw "failed to find stick parent";
+ }
+ fixed = false;
+ bottomed = false;
+ spacer = manual_spacer != null ? manual_spacer && elm.closest(manual_spacer) : $("<div />");
+ if (spacer) {
+ spacer.css('position', elm.css('position'));
+ }
+ recalc = function() {
+ var border_top, padding_top, restore;
+ if (detached) {
+ return;
+ }
+ last_scroll_height = doc.height();
+ border_top = parseInt(parent.css("border-top-width"), 10);
+ padding_top = parseInt(parent.css("padding-top"), 10);
+ padding_bottom = parseInt(parent.css("padding-bottom"), 10);
+ parent_top = parent.offset().top + border_top + padding_top;
+ parent_height = parent.height();
+ if (fixed) {
+ fixed = false;
+ bottomed = false;
+ if (manual_spacer == null) {
+ elm.insertAfter(spacer);
+ spacer.detach();
}
+ elm.css({
+ position: "",
+ top: "",
+ width: "",
+ bottom: ""
+ }).removeClass(sticky_class);
+ restore = true;
}
- }
- },
- resizer = function() {
- windowHeight = $window.height();
-
- for (var i = 0, l = sticked.length; i < l; i++) {
- var s = sticked[i];
- var newWidth = null;
- if (s.getWidthFrom) {
- if (s.responsiveWidth) {
- newWidth = $(s.getWidthFrom).width();
- }
- } else if(s.widthFromWrapper) {
- newWidth = s.stickyWrapper.width();
+ top = elm.offset().top - (parseInt(elm.css("margin-top"), 10) || 0) - offset_top;
+ height = elm.outerHeight(true);
+ el_float = elm.css("float");
+ if (spacer) {
+ spacer.css({
+ width: outer_width(elm),
+ height: height,
+ display: elm.css("display"),
+ "vertical-align": elm.css("vertical-align"),
+ "float": el_float
+ });
}
- if (newWidth != null) {
- s.stickyElement.css('width', newWidth);
+ if (restore) {
+ return tick();
}
+ };
+ recalc();
+ if (height === parent_height) {
+ return;
}
- },
- methods = {
- init: function(options) {
- return this.each(function() {
- var o = $.extend({}, defaults, options);
- var stickyElement = $(this);
-
- var stickyId = stickyElement.attr('id');
- var wrapperId = stickyId ? stickyId + '-' + defaults.wrapperClassName : defaults.wrapperClassName;
- var wrapper = $('<div></div>')
- .attr('id', wrapperId)
- .addClass(o.wrapperClassName);
-
- stickyElement.wrapAll(function() {
- if ($(this).parent("#" + wrapperId).length == 0) {
- return wrapper;
+ last_pos = void 0;
+ offset = offset_top;
+ recalc_counter = recalc_every;
+ tick = function() {
+ var css, delta, recalced, scroll, will_bottom, win_height;
+ if (detached) {
+ return;
+ }
+ recalced = false;
+ if (recalc_counter != null) {
+ recalc_counter -= 1;
+ if (recalc_counter <= 0) {
+ recalc_counter = recalc_every;
+ recalc();
+ recalced = true;
+ }
+ }
+ if (!recalced && doc.height() !== last_scroll_height) {
+ recalc();
+ recalced = true;
+ }
+ scroll = win.scrollTop();
+ if (last_pos != null) {
+ delta = scroll - last_pos;
+ }
+ last_pos = scroll;
+ if (fixed) {
+ if (enable_bottoming) {
+ will_bottom = scroll + height + offset > parent_height + parent_top;
+ if (bottomed && !will_bottom) {
+ bottomed = false;
+ elm.css({
+ position: "fixed",
+ bottom: "",
+ top: offset
+ }).trigger("sticky_kit:unbottom");
}
-});
-
- var stickyWrapper = stickyElement.parent();
-
- if (o.center) {
- stickyWrapper.css({width:stickyElement.outerWidth(),marginLeft:"auto",marginRight:"auto"});
}
-
- if (stickyElement.css("float") === "right") {
- stickyElement.css({"float":"none"}).parent().css({"float":"right"});
+ if (scroll < top) {
+ fixed = false;
+ offset = offset_top;
+ if (manual_spacer == null) {
+ if (el_float === "left" || el_float === "right") {
+ elm.insertAfter(spacer);
+ }
+ spacer.detach();
+ }
+ css = {
+ position: "",
+ width: "",
+ top: ""
+ };
+ elm.css(css).removeClass(sticky_class).trigger("sticky_kit:unstick");
}
-
- o.stickyElement = stickyElement;
- o.stickyWrapper = stickyWrapper;
- o.currentTop = null;
-
- sticked.push(o);
-
- methods.setWrapperHeight(this);
- methods.setupChangeListeners(this);
- });
- },
-
- setWrapperHeight: function(stickyElement) {
- var element = $(stickyElement);
- var stickyWrapper = element.parent();
- if (stickyWrapper) {
- stickyWrapper.css('height', element.outerHeight());
- }
- },
-
- setupChangeListeners: function(stickyElement) {
- if (window.MutationObserver) {
- var mutationObserver = new window.MutationObserver(function(mutations) {
- if (mutations[0].addedNodes.length || mutations[0].removedNodes.length) {
- methods.setWrapperHeight(stickyElement);
+ if (inner_scrolling) {
+ win_height = win.height();
+ if (height + offset_top > win_height) {
+ if (!bottomed) {
+ offset -= delta;
+ offset = Math.max(win_height - height, offset);
+ offset = Math.min(offset_top, offset);
+ if (fixed) {
+ elm.css({
+ top: offset + "px"
+ });
+ }
+ }
}
- });
- mutationObserver.observe(stickyElement, {subtree: true, childList: true});
+ }
} else {
- if (window.addEventListener) {
- stickyElement.addEventListener('DOMNodeInserted', function() {
- methods.setWrapperHeight(stickyElement);
- }, false);
- stickyElement.addEventListener('DOMNodeRemoved', function() {
- methods.setWrapperHeight(stickyElement);
- }, false);
- } else if (window.attachEvent) {
- stickyElement.attachEvent('onDOMNodeInserted', function() {
- methods.setWrapperHeight(stickyElement);
- });
- stickyElement.attachEvent('onDOMNodeRemoved', function() {
- methods.setWrapperHeight(stickyElement);
- });
+ if (scroll > top) {
+ fixed = true;
+ css = {
+ position: "fixed",
+ top: offset
+ };
+ css.width = elm.css("box-sizing") === "border-box" ? elm.outerWidth() + "px" : elm.width() + "px";
+ elm.css(css).addClass(sticky_class);
+ if (manual_spacer == null) {
+ elm.after(spacer);
+ if (el_float === "left" || el_float === "right") {
+ spacer.append(elm);
+ }
+ }
+ elm.trigger("sticky_kit:stick");
}
}
- },
- update: scroller,
- unstick: function(options) {
- return this.each(function() {
- var that = this;
- var unstickyElement = $(that);
-
- var removeIdx = -1;
- var i = sticked.length;
- while (i-- > 0) {
- if (sticked[i].stickyElement.get(0) === that) {
- splice.call(sticked,i,1);
- removeIdx = i;
- }
+ if (fixed && enable_bottoming) {
+ if (will_bottom == null) {
+ will_bottom = scroll + height + offset > parent_height + parent_top;
}
- if(removeIdx !== -1) {
- unstickyElement.unwrap();
- unstickyElement
- .css({
- 'width': '',
- 'position': '',
- 'top': '',
- 'float': '',
- 'z-index': ''
- })
- ;
+ if (!bottomed && will_bottom) {
+ bottomed = true;
+ if (parent.css("position") === "static") {
+ parent.css({
+ position: "relative"
+ });
+ }
+ return elm.css({
+ position: "absolute",
+ bottom: padding_bottom,
+ top: "auto"
+ }).trigger("sticky_kit:bottom");
}
+ }
+ };
+ recalc_and_tick = function() {
+ recalc();
+ return tick();
+ };
+ detach = function() {
+ detached = true;
+ win.off("touchmove", tick);
+ win.off("scroll", tick);
+ win.off("resize", recalc_and_tick);
+ $(document.body).off("sticky_kit:recalc", recalc_and_tick);
+ elm.off("sticky_kit:detach", detach);
+ elm.removeData("sticky_kit");
+ elm.css({
+ position: "",
+ bottom: "",
+ top: "",
+ width: ""
});
- }
+ parent.position("position", "");
+ if (fixed) {
+ if (manual_spacer == null) {
+ if (el_float === "left" || el_float === "right") {
+ elm.insertAfter(spacer);
+ }
+ spacer.remove();
+ }
+ return elm.removeClass(sticky_class);
+ }
+ };
+ win.on("touchmove", tick);
+ win.on("scroll", tick);
+ win.on("resize", recalc_and_tick);
+ $(document.body).on("sticky_kit:recalc", recalc_and_tick);
+ elm.on("sticky_kit:detach", detach);
+ return setTimeout(tick, 0);
};
-
- // should be more efficient than using $window.scroll(scroller) and $window.resize(resizer):
- if (window.addEventListener) {
- window.addEventListener('scroll', scroller, false);
- window.addEventListener('resize', resizer, false);
- } else if (window.attachEvent) {
- window.attachEvent('onscroll', scroller);
- window.attachEvent('onresize', resizer);
- }
-
- $.fn.sticky = function(method) {
- if (methods[method]) {
- return methods[method].apply(this, slice.call(arguments, 1));
- } else if (typeof method === 'object' || !method ) {
- return methods.init.apply( this, arguments );
- } else {
- $.error('Method ' + method + ' does not exist on jQuery.sticky');
+ for (i = 0, len = this.length; i < len; i++) {
+ elm = this[i];
+ fn($(elm));
}
+ return this;
};
- $.fn.unstick = function(method) {
- if (methods[method]) {
- return methods[method].apply(this, slice.call(arguments, 1));
- } else if (typeof method === 'object' || !method ) {
- return methods.unstick.apply( this, arguments );
- } else {
- $.error('Method ' + method + ' does not exist on jQuery.sticky');
- }
- };
- $(function() {
- setTimeout(scroller, 0);
- });
-}));
+}).call(this);
+
</script>
@@ -393,7 +368,6 @@
// Generate the table of contents in the side nav menu (see view/tpl/help.tpl)
$(document).ready(function () {
-
$(".panel-collapse.in").find('a').each(function(){
window.console.log($(this).attr('href'));
var url = document.createElement('a');
@@ -407,21 +381,14 @@
tocUl.removeClass(); // Classes are automatically added to <ul> elements by something else
tocUl.toc({content: "#doco-content", headings: "h1"});
tocUl.addClass('toc-content sub-menu');
- tocUl.attr('id', 'doco-side-toc');
- if( $(window).width() > 768) {
- tocUl.sticky({topSpacing:$('nav').outerHeight(true), zIndex: 1000});
- }
+ tocUl.attr('id', 'doco-side-toc');
+
}
});
- $( window ).resize(function() {
- if($(window).width() < 768 ) {
- $( "#doco-side-toc" ).unstick();
- } else {
- $( "#doco-side-toc" ).sticky({topSpacing:$('nav').outerHeight(true), zIndex: 1000});
- }
- });
-
+ $(".widget").stick_in_parent({
+ offset_top: $('nav').outerHeight(true)
+ });
});
</script>
diff --git a/view/tpl/help.tpl b/view/tpl/help.tpl
index 1c5d05738..8eb53417a 100644
--- a/view/tpl/help.tpl
+++ b/view/tpl/help.tpl
@@ -16,16 +16,7 @@
// Generate the table of contents in the side nav menu (see view/tpl/help.tpl)
$(document).ready(function () {
-
$('#doco-top-toc').toc({content: "#doco-content", headings: "h1,h2,h3,h4"});
- $('.navbar-header').append('<button id="doco-return-to-top-btn">'); //.find('button');
- var goTopBtn = $('#doco-return-to-top-btn');
- goTopBtn.append('<i>').find('i').addClass('fa fa-arrow-circle-up');
- //goTopBtn.attr('id', 'doco-return-to-top-btn');
- goTopBtn.attr('type', 'button');
- goTopBtn.attr('data-toggle', 'offcanvas');
- goTopBtn.addClass('navbar-toggle');
- goTopBtn.click(function() { $(window).scrollTop(0); });
});
function docoTocToggle() {