From a0d9f903885314235eb21c08e55eb96189f1d51e Mon Sep 17 00:00:00 2001 From: Vova Yatsyuk Date: Fri, 3 Apr 2015 10:52:20 +0300 Subject: [PATCH 1/3] Sticky without jQuery dependency --- src/shortcuts/noframework.sticky.js | 121 ++++++++++++++++++++++++++++ 1 file changed, 121 insertions(+) create mode 100644 src/shortcuts/noframework.sticky.js diff --git a/src/shortcuts/noframework.sticky.js b/src/shortcuts/noframework.sticky.js new file mode 100644 index 00000000..a49e37c2 --- /dev/null +++ b/src/shortcuts/noframework.sticky.js @@ -0,0 +1,121 @@ +/*! +Waypoints Sticky Element Shortcut - 3.1.1 +Copyright © 2011-2015 Caleb Troughton +Licensed under the MIT license. +https://github.com/imakewebthings/waypoints/blog/master/licenses.txt +*/ +(function() { + 'use strict' + + var Waypoint = window.Waypoint + + /* http://imakewebthings.com/waypoints/shortcuts/sticky-elements */ + function Sticky(options) { + this.options = Waypoint.Adapter.extend({}, Waypoint.defaults, Sticky.defaults, options) + this.element = this.options.element + this.adapter = new Waypoint.Adapter(this.element) + this.createWrapper() + this.createWaypoint() + } + + /* Private */ + Sticky.prototype.createWaypoint = function() { + var originalHandler = this.options.handler + + this.waypoint = new Waypoint(Waypoint.Adapter.extend({}, this.options, { + element: this.wrapper, + handler: Sticky.proxy(function(direction) { + var shouldBeStuck = this.options.direction.indexOf(direction) > -1 + var wrapperHeight = shouldBeStuck ? this.adapter.outerHeight() + 'px' : '' + + this.wrapper.style.height = wrapperHeight + Sticky.toggleClassName(this.element, this.options.stuckClass, shouldBeStuck) + + if (originalHandler) { + originalHandler.call(this, direction) + } + }, this) + })) + } + + /* Private */ + Sticky.prototype.createWrapper = function() { + if (this.options.wrapperTag) { + this.wrapper = document.createElement(this.options.wrapperTag) + Sticky.addClassName(this.wrapper, this.options.wrapperClass) + this.element.parentNode.insertBefore(this.wrapper, this.element) + this.element.parentNode.removeChild(this.element) + this.wrapper.appendChild(this.element) + } else { + this.wrapper = this.element.parentNode + } + } + + /* Public */ + Sticky.prototype.destroy = function() { + if (this.element.parentNode === this.wrapper) { + this.waypoint.destroy() + Sticky.removeClassName(this.element, this.options.stuckClass) + + var parent = this.wrapper.parentNode + while (this.wrapper.firstChild) { + parent.insertBefore(this.wrapper.firstChild, this.wrapper) + } + parent.removeChild(this.wrapper) + } + } + + Sticky.proxy = function(func, obj) { + if (typeof func !== 'function') { + return + } + if (!obj) { + obj = this + } + return function() { + return func.apply(obj, arguments) + } + } + + /* Methods to work with classes from prototype.js */ + Sticky.hasClassName = function(element, className) { + var elementClassName = element.className + if (elementClassName.length === 0) { + return false + } + if (elementClassName === className) { + return true + } + var re = new RegExp("(^|\\s+)" + className + "(\\s+|$)") + return re.test(elementClassName) + } + + Sticky.addClassName = function(element, className) { + if (!Sticky.hasClassName(element, className)) { + element.className += (element.className ? ' ' : '') + className + } + } + + Sticky.removeClassName = function(element, className) { + var re = new RegExp("(^|\\s+)" + className + "(\\s+|$)") + element.className = element.className.replace(re, ' ').strip() + } + + Sticky.toggleClassName = function(element, className, bool) { + if (undefined === bool) { + bool = Sticky.hasClassName(element, className) + } + var method = Sticky[bool ? 'addClassName' : 'removeClassName'] + method(element, className) + } + + Sticky.defaults = { + wrapperTag: 'div', + wrapperClass: 'sticky-wrapper', + stuckClass: 'stuck', + direction: 'down right' + } + + Waypoint.Sticky = Sticky +}()) +; \ No newline at end of file From bdb04b3f607a28860f2680c72d4fa81083120cc6 Mon Sep 17 00:00:00 2001 From: Vova Yatsyuk Date: Fri, 3 Apr 2015 11:17:16 +0300 Subject: [PATCH 2/3] Added original Sticky configuration support --- src/shortcuts/noframework.sticky.js | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/src/shortcuts/noframework.sticky.js b/src/shortcuts/noframework.sticky.js index a49e37c2..c5e88a89 100644 --- a/src/shortcuts/noframework.sticky.js +++ b/src/shortcuts/noframework.sticky.js @@ -40,10 +40,9 @@ https://github.com/imakewebthings/waypoints/blog/master/licenses.txt /* Private */ Sticky.prototype.createWrapper = function() { - if (this.options.wrapperTag) { - this.wrapper = document.createElement(this.options.wrapperTag) - Sticky.addClassName(this.wrapper, this.options.wrapperClass) - this.element.parentNode.insertBefore(this.wrapper, this.element) + if (this.options.wrapper) { + this.element.insertAdjacentHTML('beforebegin', this.options.wrapper) + this.wrapper = this.element.previousSibling this.element.parentNode.removeChild(this.element) this.wrapper.appendChild(this.element) } else { @@ -110,8 +109,7 @@ https://github.com/imakewebthings/waypoints/blog/master/licenses.txt } Sticky.defaults = { - wrapperTag: 'div', - wrapperClass: 'sticky-wrapper', + wrapper: '
', stuckClass: 'stuck', direction: 'down right' } From 7a6843cb2545c1119681324fb993ec1bd7d04bd2 Mon Sep 17 00:00:00 2001 From: Vova Yatsyuk Date: Fri, 3 Apr 2015 14:45:00 +0300 Subject: [PATCH 3/3] Removed arguments validation from proxy method --- src/shortcuts/noframework.sticky.js | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/shortcuts/noframework.sticky.js b/src/shortcuts/noframework.sticky.js index c5e88a89..78bc2ed0 100644 --- a/src/shortcuts/noframework.sticky.js +++ b/src/shortcuts/noframework.sticky.js @@ -65,12 +65,6 @@ https://github.com/imakewebthings/waypoints/blog/master/licenses.txt } Sticky.proxy = function(func, obj) { - if (typeof func !== 'function') { - return - } - if (!obj) { - obj = this - } return function() { return func.apply(obj, arguments) }