hugosoucycc

[ARCHIVED] Another old source code of <hugo.soucy.cc>.
Log | Files | Refs | Submodules

commit ab325e87ef80023d3312a1fbee8266d4cbf1e025
parent 5ef63bf453ab552b7bd5e84818ed0c64283e0dcf
Author: Hugo Soucy <hugo.soucy@savoirfairelinux.com>
Date:   Sun,  6 Nov 2016 19:34:09 -0500

Add new JS files.

Diffstat:
M.gitmodules | 3+++
Mpublic_html/js/script.js | 527++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-
Dpublic_html/js/vendor/atomic.min.js | 3---
Mstatic/dev/js/custom/init.js | 39+++++++++++++++++++++++++++++++++++++--
Astatic/dev/js/vendor/dom-utilities | 1+
Mstatic/prod/js/script.js | 527++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-
Astatic/prod/js/script.min.js | 35+++++++++++++++++++++++++++++++++++
Dstatic/prod/js/vendor/atomic.min.js | 3---
8 files changed, 1120 insertions(+), 18 deletions(-)

diff --git a/.gitmodules b/.gitmodules @@ -4,3 +4,6 @@ [submodule "static/dev/js/vendor/atomic"] path = static/dev/js/vendor/atomic url = git@github.com:toddmotto/atomic.git +[submodule "static/dev/js/vendor/dom-utilities"] + path = static/dev/js/vendor/dom-utilities + url = git@github.com:savoirfairelinux/dom-utilities.git diff --git a/public_html/js/script.js b/public_html/js/script.js @@ -1,5 +1,522 @@ -atomic.setContentType('application/json'); -atomic.get('http://webmention.io/api/mentions?jsonp=?') // this request will use application/json as Content-type - .success(function (data, xhr) { - console.log(data); - }); +/*! atomic v1.0.0 | (c) 2015 @toddmotto | https://github.com/toddmotto/atomic */ +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + define(factory); + } else if (typeof exports === 'object') { + module.exports = factory; + } else { + root.atomic = factory(root); + } +})(this, function (root) { + + 'use strict'; + + var exports = {}; + + var config = { + contentType: 'application/x-www-form-urlencoded' + }; + + var parse = function (req) { + var result; + try { + result = JSON.parse(req.responseText); + } catch (e) { + result = req.responseText; + } + return [result, req]; + }; + + var xhr = function (type, url, data) { + var methods = { + success: function () {}, + error: function () {}, + always: function () {} + }; + var XHR = root.XMLHttpRequest || ActiveXObject; + var request = new XHR('MSXML2.XMLHTTP.3.0'); + + request.open(type, url, true); + request.setRequestHeader('Content-type', config.contentType); + request.onreadystatechange = function () { + var req; + if (request.readyState === 4) { + req = parse(request); + if (request.status >= 200 && request.status < 300) { + methods.success.apply(methods, req); + } else { + methods.error.apply(methods, req); + } + methods.always.apply(methods, req); + } + }; + request.send(data); + + var atomXHR = { + success: function (callback) { + methods.success = callback; + return atomXHR; + }, + error: function (callback) { + methods.error = callback; + return atomXHR; + }, + always: function (callback) { + methods.always = callback; + return atomXHR; + } + }; + + return atomXHR; + }; + + exports.get = function (src) { + return xhr('GET', src); + }; + + exports.put = function (url, data) { + return xhr('PUT', url, data); + }; + + exports.post= function (url, data) { + return xhr('POST', url, data); + }; + + exports.delete = function (url) { + return xhr('DELETE', url); + }; + + exports.setContentType = function(value) { + config.contentType = value; + }; + + return exports; + +}); +// DOM Utilities +// A mashup of functions gleaned everywhere to code in lightweight vanilla Javascript (internet explorer 8 gte). +// This is a toolkit, so take what you need and comment or delete the rest. +// Don't load unused code! + +var du = (function(win) { + 'use strict'; + + // @param {Object} `out` + // @return {Object} `out` + // @usage du.doExtend({}, objA, objB); + // @about Merge objects. Equivalent to jQuery.extend() + // @source <http://youmightnotneedjquery.com/#extend> + function doExtend(out) { + var key; + var i; + + out = out || {}; + + for (i = 1; i < arguments.length; i++) { + if (!arguments[i]) { + continue; + } + + for (key in arguments[i]) { + if (arguments[i].hasOwnProperty(key)) { + out[key] = arguments[i][key]; + } + } + } + + return out; + } + + // @param {String} `eventType` String containing the type of event + // @param {Node} `context` The DOM context of the query + // @return {Array} An array with element nodes + // @usage du.queryAll('.slide', document.getElementById('slider')); + // @source <http://lea.verou.me/2015/04/jquery-considered-harmful/> + function queryAll(selector, context) { + return Array.prototype.slice.call((context || document).querySelectorAll(selector)); + } + + // @param {Node} `el` The base element + // @param {Object} `attrs` The key/value list of attributes + // @return {Node} `el` + // @usage du.setAttrs(el, {'role' : 'tab', 'tabindextab' : '0', ...}); + // @about Setting multiple attributes to an element + function setAttrs(el, attrs) { + var key; + + if (isElement(el) && isObject(attrs)) { + for(key in attrs) { + if (attrs.hasOwnProperty(key)) { + el.setAttribute(key, attrs[key]); + } + } + } else { + console.log('Error "' + el + '" should be a DOM element!!'); + console.log('Error "' + attrs + '" should be an Object!!'); + } + } + + // @param {Node} `el` The base element + // @param {String} `eventType` String containing the type of event + // @param {Object} `handler` Object that receives a notification or a JavaScript function + // @return {Object} `handler` + // @usage du.setEvent(el, 'click', myJsFunction); + // @source <http://youmightnotneedjquery.com/#on> + // @about addEventListener with a fallback for IE 8 lte + function setEvent(el, eventType, handler) { + if (window.addEventListener) { + el.addEventListener(eventType, handler, false); + } else { + el.attachEvent('on' + eventType, function() { + handler.call(el); + }); + } + } + + // @param {Object} `elList` A collections of nodes + // @param {String} `eventType` String containing the type of event + // @param {Object} `handler` Object that receives a notification or a JavaScript function + // @return {Object} `handler` + // @usage du.setEventList(document.querySelectorAll('li'), 'click', doSomethingFunction); + // @about addEventListener on list of elements + function setEventList(elList, event, handler) { + var lengthOf = elList.length; + + while(lengthOf--) { + setEvent(elList[lengthOf], event, handler); + } + } + + // @param {Object} `array` Must be an array + // @param {Node} `item` An element from the array + // @return {Number} The index of the `item` + // @usage du.getIndex(myArray, this); + // @source <http://youmightnotneedjquery.com/#index_of> + // @about Array.indexOf for IE 8 gte + function getIndex(array, item) { + var lengthOf = array.length; + + while(lengthOf--) { + if (array[lengthOf] === item) { + return lengthOf; + } + } + + return -1; + } + + // @param {Node} `el` The base element + // @param {String} `selector` The class, id, data attribute, or tag to look for + // @return {Node} HTMLElement from the `selector` param || {Boolean} false + // @usage du.getClosest(el, '.my-selector'); + // @source <http://gomakethings.com/ditching-jquery#climb-up-the-dom> + // @about Get closest DOM element up the tree that contains a class, ID, data attribute, or tag. + function getClosest(el, selector) { + // Variables + var firstChar = selector.charAt(0); + var supports = 'classList' in document.documentElement; + var attribute, value; + + // If selector is a data attribute, split attribute from value + if (firstChar === '[') { + selector = selector.substr(1, selector.length - 2); + attribute = selector.split('='); + + if (attribute.length > 1) { + value = true; + attribute[1] = attribute[1].replace(/"/g, '').replace(/'/g, ''); + } + } + + // Get closest match + for (; el && el !== document && el.nodeType === 1; el = el.parentNode) { + // If selector is a class + if (firstChar === '.') { + if (supports) { + if (el.classList.contains(selector.substr(1))) { + return el; + } + } else { + if (new RegExp('(^|\\s)' + selector.substr(1) + '(\\s|$)').test(el.className)) { + return el; + } + } + } + + // If selector is an ID + if (firstChar === '#') { + if (el.id === selector.substr(1)) { + return el; + } + } + + // If selector is a data attribute + if (firstChar === '[') { + if (el.hasAttribute(attribute[0])) { + if (value) { + if (el.getAttribute(attribute[0]) === attribute[1]) { + return el; + } + } else { + return el; + } + } + } + + // If selector is a tag + if (el.tagName.toLowerCase() === selector) { + return el; + } + } + + return null; + } + + // @param {Node} `el` The base element + // @return {Number} The largest measurement height + // @usage du.getHeight(document.getElementById('myNav')); + function getHeight(el) { + return Math.max(el.scrollHeight, el.offsetHeight, el.clientHeight); + } + + // @param {Node} `el` The base element + // @param {String} `className` The class name to be add + // @return {Node} `el` with `classname` + // @usage du.setClass(document.querySelector('button'), 'myNewStateClass'); + // @source <http://youmightnotneedjquery.com/#add_class> + // @about Add a class to an element + function setClass(el, classname) { + if (el.classList) { + el.classList.add(classname); + } else { + el.className += ' ' + classname; + } + + return; + } + + // @param {Node} `el` The base element + // @param {String} `className` The class name to be remove + // @return {Node} `el` without `classname` + // @usage du.unsetClass(document.querySelector('[data-header]'), 'thatRemovableClass'); + // @source <http://youmightnotneedjquery.com/#remove_class> + // @about Remove a class from an element + function unsetClass(el, classname) { + if (el.classList) { + el.classList.remove(classname); + } else { + el.className = el.className.replace(new RegExp('(^|\\b)' + classname.split(' ').join('|') + '(\\b|$)', 'gi'), ' '); + } + + return; + } + + // @param {Node} `el` The base element + // @param {String} `className` The class name to be test + // @return {Boolean} True if `classname` is present + // @usage du.hasClass(document.getElementById('thatID'), 'aStateClass'); + // @source <http://youmightnotneedjquery.com/#has_class> + function hasClass(el, classname) { + if (el.classList) { + return el.classList.contains(classname); + } else { + return new RegExp('(^| )' + classname + '( |$)', 'gi').test(el.className); + } + } + + // @param {Node} `el` The base element + // @param {String} `className` The class name to be toggle + // @return {Node} `el` with or without `classname` + // @usage du.toggleClass(document.body, 'state--remove-scrollbar'); + // @about Toogle a class true if an element has a specific class + function toggleClass(el, classname) { + if (du.hasClass(el, classname)) { + return unsetClass(el, classname); + } else { + return setClass(el, classname); + } + } + + + // @param {Object} `fnCallback` The function to debounce + // @param {Number} `delay` The setTimeout delay in milisecond + // @return {Object} `fnCallback` + // @usage du.setEvent(myButton, 'keyup', du.setDebounce(fireThatFunction, 1000)); + // @source <http://www.grafikart.fr/tutoriels/javascript/debounce-throttle-642> + // @about Limits the rate at which a function can fire + function setDebounce(fnCallback, delay) { + var timer; + + return function() { + var args = arguments; + var context = this; + + clearTimeout(timer); + + timer = setTimeout(function() { + fnCallback.apply(context, args); + }, delay); + }; + } + + // @param {Object} `fnCallback` The function to debounce + // @param {Number} `delay` The setTimeout delay in milisecond + // @return {Object} `fnCallback` + // @usage window.addEventListener('scroll', du.setThrottle(function(e) {...}, 50)); + // @source <http://www.grafikart.fr/tutoriels/javascript/debounce-throttle-642> + // @about Reduce the amount of times a function can run + function setThrottle(fnCallback, delay) { + var last; + var timer; + + return function() { + var context = this; + var now = +new Date(); + var args = arguments; + + if (last && now < last + delay) { + clearTimeout(timer); + + timer = setTimeout(function() { + last = now; + fnCallback.apply(context, args); + }, delay); + + } else { + last = now; + + fnCallback.apply(context, args); + } + }; + } + + // @param {Object} `obj` The item to test + // @return {Boolean} True if `obj` is an Node.ELEMENT_NODE + // @usage du.isElement(thatItem); + // @source <http://underscorejs.org/#isElement> + // @about Is a given value a DOM element + function isElement(obj) { + return !!(obj && obj.nodeType === 1); + } + + // @param {Object} `obj` The item to test + // @return {Boolean} True if `obj` is an Object + // @usage du.isObject(anotherItem); + // @source <http://underscorejs.org/#isObject> + // @about Is a given variable an Object + function isObject(obj) { + var type = typeof obj; + + return type === 'function' || type === 'object' && !!obj; + } + + // @param {Node} `el` The base element + // @param {String} `eventType` The event type or name + // @usage du.triggerEvent(element, 'mousedown'); + // @source <http://youmightnotneedjquery.com/#trigger_native> + function triggerEvent(el, eventType) { + if (document.createEvent) { + var event = document.createEvent('HTMLEvents'); + + event.initEvent(eventType, true, false); + + el.dispatchEvent(event); + } else { + el.fireEvent('on' + eventType); + } + } + + // @param {Node} `el` The base element + // @param {String} `eventType` The event type or name + // @param {Object} `eventData` The detail property. Data associated with the event + // @usage du.triggerCustomEvent(element, 'mousedown', [myBigFatData, 'Hello Goodbye!']); + // @source <http://youmightnotneedjquery.com/#trigger_custom> + function triggerCustomEvent(el, eventType, eventData) { + var customEvent; + + if (window.CustomEvent) { + customEvent = new CustomEvent(eventType, {detail: eventData}); + + } else { + customEvent = document.createEvent('CustomEvent'); + + customEvent.initCustomEvent(eventType, true, true, eventData); + } + + el.dispatchEvent(customEvent); + } + + // @param {Node} `el` The base element + // @return {Boolean} True if `el` is in viewport + // @usage du.isElementInViewport(document.getElementbyid('myId')); + // @about Check if an element is in the viewport + function isElementInViewport(el) { + var elRect = el.getBoundingClientRect(); + + return ( + elRect.top >= 0 + && elRect.left >= 0 + && elRect.bottom <= (window.innerHeight || document.documentElement.clientHeight) + && elRect.right <= (window.innerWidth || document.documentElement.clientWidth) + ); + } + + return { + doExtend : doExtend, + queryAll : queryAll, + setAttrs : setAttrs, + setEvent : setEvent, + setEventList : setEventList, + getIndex : getIndex, + getClosest : getClosest, + getHeight : getHeight, + setClass : setClass, + unsetClass : unsetClass, + hasClass : hasClass, + toggleClass : toggleClass, + setDebounce : setDebounce, + setThrottle : setThrottle, + isElement : isElement, + isObject : isObject, + triggerEvent : triggerEvent, + triggerCustomEvent : triggerCustomEvent, + isElementInViewport : isElementInViewport + }; +})(window); +function setNavigation() { + var $nav = document.querySelector('.nav'); + var $nav_button; + var $nav_panel; + var $nav_close; + + if ($nav) { + $nav_button = document.querySelector('.nav-button'); + $nav_panel = $nav.querySelector('.nav__panel'); + $nav_close = $nav_panel.querySelector('.nav__close'); + + du.setClass($nav_panel, 'state--hidden'); + + du.setEvent($nav_button, 'click', function(thatEvt) { + thatEvt.preventDefault(); + + du.toggleClass($nav_panel, 'state--hidden'); + du.toggleClass($nav_panel, 'state--visible'); + }); + + du.setEvent($nav_close, 'click', function(thatEvt) { + thatEvt.preventDefault(); + + du.toggleClass($nav_panel, 'state--hidden'); + du.toggleClass($nav_panel, 'state--visible'); + }); + } +} + +setNavigation(); + +// atomic.setContentType('application/json'); +// atomic.get('http://webmention.io/api/mentions?jsonp=?') // this request will use application/json as Content-type +// .success(function (data, xhr) { +// console.log(data); +// }); + diff --git a/public_html/js/vendor/atomic.min.js b/public_html/js/vendor/atomic.min.js @@ -1,2 +0,0 @@ -/*! atomic v1.0.0 | (c) 2015 @toddmotto | https://github.com/toddmotto/atomic */ -!function(a,b){"function"==typeof define&&define.amd?define(b):"object"==typeof exports?module.exports=b:a.atomic=b(a)}(this,function(a){"use strict";var b={},c={contentType:"application/x-www-form-urlencoded"},d=function(a){var b;try{b=JSON.parse(a.responseText)}catch(c){b=a.responseText}return[b,a]},e=function(b,e,f){var g={success:function(){},error:function(){},always:function(){}},h=a.XMLHttpRequest||ActiveXObject,i=new h("MSXML2.XMLHTTP.3.0");i.open(b,e,!0),i.setRequestHeader("Content-type",c.contentType),i.onreadystatechange=function(){var a;4===i.readyState&&(a=d(i),i.status>=200&&i.status<300?g.success.apply(g,a):g.error.apply(g,a),g.always.apply(g,a))},i.send(f);var j={success:function(a){return g.success=a,j},error:function(a){return g.error=a,j},always:function(a){return g.always=a,j}};return j};return b.get=function(a){return e("GET",a)},b.put=function(a,b){return e("PUT",a,b)},b.post=function(a,b){return e("POST",a,b)},b["delete"]=function(a){return e("DELETE",a)},b.setContentType=function(a){c.contentType=a},b});- \ No newline at end of file diff --git a/static/dev/js/custom/init.js b/static/dev/js/custom/init.js @@ -1,2 +1,37 @@ -// console.log('test'); -// console.log('gulp'); +function setNavigation() { + var $nav = document.querySelector('.nav'); + var $nav_button; + var $nav_panel; + var $nav_close; + + if ($nav) { + $nav_button = document.querySelector('.nav-button'); + $nav_panel = $nav.querySelector('.nav__panel'); + $nav_close = $nav_panel.querySelector('.nav__close'); + + du.setClass($nav_panel, 'state--hidden'); + + du.setEvent($nav_button, 'click', function(thatEvt) { + thatEvt.preventDefault(); + + du.toggleClass($nav_panel, 'state--hidden'); + du.toggleClass($nav_panel, 'state--visible'); + }); + + du.setEvent($nav_close, 'click', function(thatEvt) { + thatEvt.preventDefault(); + + du.toggleClass($nav_panel, 'state--hidden'); + du.toggleClass($nav_panel, 'state--visible'); + }); + } +} + +setNavigation(); + +// atomic.setContentType('application/json'); +// atomic.get('http://webmention.io/api/mentions?jsonp=?') // this request will use application/json as Content-type +// .success(function (data, xhr) { +// console.log(data); +// }); + diff --git a/static/dev/js/vendor/dom-utilities b/static/dev/js/vendor/dom-utilities @@ -0,0 +1 @@ +Subproject commit 84d72973b8e366de2fc147a2564dca99a9014576 diff --git a/static/prod/js/script.js b/static/prod/js/script.js @@ -1,5 +1,522 @@ -atomic.setContentType('application/json'); -atomic.get('http://webmention.io/api/mentions?jsonp=?') // this request will use application/json as Content-type - .success(function (data, xhr) { - console.log(data); - }); +/*! atomic v1.0.0 | (c) 2015 @toddmotto | https://github.com/toddmotto/atomic */ +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + define(factory); + } else if (typeof exports === 'object') { + module.exports = factory; + } else { + root.atomic = factory(root); + } +})(this, function (root) { + + 'use strict'; + + var exports = {}; + + var config = { + contentType: 'application/x-www-form-urlencoded' + }; + + var parse = function (req) { + var result; + try { + result = JSON.parse(req.responseText); + } catch (e) { + result = req.responseText; + } + return [result, req]; + }; + + var xhr = function (type, url, data) { + var methods = { + success: function () {}, + error: function () {}, + always: function () {} + }; + var XHR = root.XMLHttpRequest || ActiveXObject; + var request = new XHR('MSXML2.XMLHTTP.3.0'); + + request.open(type, url, true); + request.setRequestHeader('Content-type', config.contentType); + request.onreadystatechange = function () { + var req; + if (request.readyState === 4) { + req = parse(request); + if (request.status >= 200 && request.status < 300) { + methods.success.apply(methods, req); + } else { + methods.error.apply(methods, req); + } + methods.always.apply(methods, req); + } + }; + request.send(data); + + var atomXHR = { + success: function (callback) { + methods.success = callback; + return atomXHR; + }, + error: function (callback) { + methods.error = callback; + return atomXHR; + }, + always: function (callback) { + methods.always = callback; + return atomXHR; + } + }; + + return atomXHR; + }; + + exports.get = function (src) { + return xhr('GET', src); + }; + + exports.put = function (url, data) { + return xhr('PUT', url, data); + }; + + exports.post= function (url, data) { + return xhr('POST', url, data); + }; + + exports.delete = function (url) { + return xhr('DELETE', url); + }; + + exports.setContentType = function(value) { + config.contentType = value; + }; + + return exports; + +}); +// DOM Utilities +// A mashup of functions gleaned everywhere to code in lightweight vanilla Javascript (internet explorer 8 gte). +// This is a toolkit, so take what you need and comment or delete the rest. +// Don't load unused code! + +var du = (function(win) { + 'use strict'; + + // @param {Object} `out` + // @return {Object} `out` + // @usage du.doExtend({}, objA, objB); + // @about Merge objects. Equivalent to jQuery.extend() + // @source <http://youmightnotneedjquery.com/#extend> + function doExtend(out) { + var key; + var i; + + out = out || {}; + + for (i = 1; i < arguments.length; i++) { + if (!arguments[i]) { + continue; + } + + for (key in arguments[i]) { + if (arguments[i].hasOwnProperty(key)) { + out[key] = arguments[i][key]; + } + } + } + + return out; + } + + // @param {String} `eventType` String containing the type of event + // @param {Node} `context` The DOM context of the query + // @return {Array} An array with element nodes + // @usage du.queryAll('.slide', document.getElementById('slider')); + // @source <http://lea.verou.me/2015/04/jquery-considered-harmful/> + function queryAll(selector, context) { + return Array.prototype.slice.call((context || document).querySelectorAll(selector)); + } + + // @param {Node} `el` The base element + // @param {Object} `attrs` The key/value list of attributes + // @return {Node} `el` + // @usage du.setAttrs(el, {'role' : 'tab', 'tabindextab' : '0', ...}); + // @about Setting multiple attributes to an element + function setAttrs(el, attrs) { + var key; + + if (isElement(el) && isObject(attrs)) { + for(key in attrs) { + if (attrs.hasOwnProperty(key)) { + el.setAttribute(key, attrs[key]); + } + } + } else { + console.log('Error "' + el + '" should be a DOM element!!'); + console.log('Error "' + attrs + '" should be an Object!!'); + } + } + + // @param {Node} `el` The base element + // @param {String} `eventType` String containing the type of event + // @param {Object} `handler` Object that receives a notification or a JavaScript function + // @return {Object} `handler` + // @usage du.setEvent(el, 'click', myJsFunction); + // @source <http://youmightnotneedjquery.com/#on> + // @about addEventListener with a fallback for IE 8 lte + function setEvent(el, eventType, handler) { + if (window.addEventListener) { + el.addEventListener(eventType, handler, false); + } else { + el.attachEvent('on' + eventType, function() { + handler.call(el); + }); + } + } + + // @param {Object} `elList` A collections of nodes + // @param {String} `eventType` String containing the type of event + // @param {Object} `handler` Object that receives a notification or a JavaScript function + // @return {Object} `handler` + // @usage du.setEventList(document.querySelectorAll('li'), 'click', doSomethingFunction); + // @about addEventListener on list of elements + function setEventList(elList, event, handler) { + var lengthOf = elList.length; + + while(lengthOf--) { + setEvent(elList[lengthOf], event, handler); + } + } + + // @param {Object} `array` Must be an array + // @param {Node} `item` An element from the array + // @return {Number} The index of the `item` + // @usage du.getIndex(myArray, this); + // @source <http://youmightnotneedjquery.com/#index_of> + // @about Array.indexOf for IE 8 gte + function getIndex(array, item) { + var lengthOf = array.length; + + while(lengthOf--) { + if (array[lengthOf] === item) { + return lengthOf; + } + } + + return -1; + } + + // @param {Node} `el` The base element + // @param {String} `selector` The class, id, data attribute, or tag to look for + // @return {Node} HTMLElement from the `selector` param || {Boolean} false + // @usage du.getClosest(el, '.my-selector'); + // @source <http://gomakethings.com/ditching-jquery#climb-up-the-dom> + // @about Get closest DOM element up the tree that contains a class, ID, data attribute, or tag. + function getClosest(el, selector) { + // Variables + var firstChar = selector.charAt(0); + var supports = 'classList' in document.documentElement; + var attribute, value; + + // If selector is a data attribute, split attribute from value + if (firstChar === '[') { + selector = selector.substr(1, selector.length - 2); + attribute = selector.split('='); + + if (attribute.length > 1) { + value = true; + attribute[1] = attribute[1].replace(/"/g, '').replace(/'/g, ''); + } + } + + // Get closest match + for (; el && el !== document && el.nodeType === 1; el = el.parentNode) { + // If selector is a class + if (firstChar === '.') { + if (supports) { + if (el.classList.contains(selector.substr(1))) { + return el; + } + } else { + if (new RegExp('(^|\\s)' + selector.substr(1) + '(\\s|$)').test(el.className)) { + return el; + } + } + } + + // If selector is an ID + if (firstChar === '#') { + if (el.id === selector.substr(1)) { + return el; + } + } + + // If selector is a data attribute + if (firstChar === '[') { + if (el.hasAttribute(attribute[0])) { + if (value) { + if (el.getAttribute(attribute[0]) === attribute[1]) { + return el; + } + } else { + return el; + } + } + } + + // If selector is a tag + if (el.tagName.toLowerCase() === selector) { + return el; + } + } + + return null; + } + + // @param {Node} `el` The base element + // @return {Number} The largest measurement height + // @usage du.getHeight(document.getElementById('myNav')); + function getHeight(el) { + return Math.max(el.scrollHeight, el.offsetHeight, el.clientHeight); + } + + // @param {Node} `el` The base element + // @param {String} `className` The class name to be add + // @return {Node} `el` with `classname` + // @usage du.setClass(document.querySelector('button'), 'myNewStateClass'); + // @source <http://youmightnotneedjquery.com/#add_class> + // @about Add a class to an element + function setClass(el, classname) { + if (el.classList) { + el.classList.add(classname); + } else { + el.className += ' ' + classname; + } + + return; + } + + // @param {Node} `el` The base element + // @param {String} `className` The class name to be remove + // @return {Node} `el` without `classname` + // @usage du.unsetClass(document.querySelector('[data-header]'), 'thatRemovableClass'); + // @source <http://youmightnotneedjquery.com/#remove_class> + // @about Remove a class from an element + function unsetClass(el, classname) { + if (el.classList) { + el.classList.remove(classname); + } else { + el.className = el.className.replace(new RegExp('(^|\\b)' + classname.split(' ').join('|') + '(\\b|$)', 'gi'), ' '); + } + + return; + } + + // @param {Node} `el` The base element + // @param {String} `className` The class name to be test + // @return {Boolean} True if `classname` is present + // @usage du.hasClass(document.getElementById('thatID'), 'aStateClass'); + // @source <http://youmightnotneedjquery.com/#has_class> + function hasClass(el, classname) { + if (el.classList) { + return el.classList.contains(classname); + } else { + return new RegExp('(^| )' + classname + '( |$)', 'gi').test(el.className); + } + } + + // @param {Node} `el` The base element + // @param {String} `className` The class name to be toggle + // @return {Node} `el` with or without `classname` + // @usage du.toggleClass(document.body, 'state--remove-scrollbar'); + // @about Toogle a class true if an element has a specific class + function toggleClass(el, classname) { + if (du.hasClass(el, classname)) { + return unsetClass(el, classname); + } else { + return setClass(el, classname); + } + } + + + // @param {Object} `fnCallback` The function to debounce + // @param {Number} `delay` The setTimeout delay in milisecond + // @return {Object} `fnCallback` + // @usage du.setEvent(myButton, 'keyup', du.setDebounce(fireThatFunction, 1000)); + // @source <http://www.grafikart.fr/tutoriels/javascript/debounce-throttle-642> + // @about Limits the rate at which a function can fire + function setDebounce(fnCallback, delay) { + var timer; + + return function() { + var args = arguments; + var context = this; + + clearTimeout(timer); + + timer = setTimeout(function() { + fnCallback.apply(context, args); + }, delay); + }; + } + + // @param {Object} `fnCallback` The function to debounce + // @param {Number} `delay` The setTimeout delay in milisecond + // @return {Object} `fnCallback` + // @usage window.addEventListener('scroll', du.setThrottle(function(e) {...}, 50)); + // @source <http://www.grafikart.fr/tutoriels/javascript/debounce-throttle-642> + // @about Reduce the amount of times a function can run + function setThrottle(fnCallback, delay) { + var last; + var timer; + + return function() { + var context = this; + var now = +new Date(); + var args = arguments; + + if (last && now < last + delay) { + clearTimeout(timer); + + timer = setTimeout(function() { + last = now; + fnCallback.apply(context, args); + }, delay); + + } else { + last = now; + + fnCallback.apply(context, args); + } + }; + } + + // @param {Object} `obj` The item to test + // @return {Boolean} True if `obj` is an Node.ELEMENT_NODE + // @usage du.isElement(thatItem); + // @source <http://underscorejs.org/#isElement> + // @about Is a given value a DOM element + function isElement(obj) { + return !!(obj && obj.nodeType === 1); + } + + // @param {Object} `obj` The item to test + // @return {Boolean} True if `obj` is an Object + // @usage du.isObject(anotherItem); + // @source <http://underscorejs.org/#isObject> + // @about Is a given variable an Object + function isObject(obj) { + var type = typeof obj; + + return type === 'function' || type === 'object' && !!obj; + } + + // @param {Node} `el` The base element + // @param {String} `eventType` The event type or name + // @usage du.triggerEvent(element, 'mousedown'); + // @source <http://youmightnotneedjquery.com/#trigger_native> + function triggerEvent(el, eventType) { + if (document.createEvent) { + var event = document.createEvent('HTMLEvents'); + + event.initEvent(eventType, true, false); + + el.dispatchEvent(event); + } else { + el.fireEvent('on' + eventType); + } + } + + // @param {Node} `el` The base element + // @param {String} `eventType` The event type or name + // @param {Object} `eventData` The detail property. Data associated with the event + // @usage du.triggerCustomEvent(element, 'mousedown', [myBigFatData, 'Hello Goodbye!']); + // @source <http://youmightnotneedjquery.com/#trigger_custom> + function triggerCustomEvent(el, eventType, eventData) { + var customEvent; + + if (window.CustomEvent) { + customEvent = new CustomEvent(eventType, {detail: eventData}); + + } else { + customEvent = document.createEvent('CustomEvent'); + + customEvent.initCustomEvent(eventType, true, true, eventData); + } + + el.dispatchEvent(customEvent); + } + + // @param {Node} `el` The base element + // @return {Boolean} True if `el` is in viewport + // @usage du.isElementInViewport(document.getElementbyid('myId')); + // @about Check if an element is in the viewport + function isElementInViewport(el) { + var elRect = el.getBoundingClientRect(); + + return ( + elRect.top >= 0 + && elRect.left >= 0 + && elRect.bottom <= (window.innerHeight || document.documentElement.clientHeight) + && elRect.right <= (window.innerWidth || document.documentElement.clientWidth) + ); + } + + return { + doExtend : doExtend, + queryAll : queryAll, + setAttrs : setAttrs, + setEvent : setEvent, + setEventList : setEventList, + getIndex : getIndex, + getClosest : getClosest, + getHeight : getHeight, + setClass : setClass, + unsetClass : unsetClass, + hasClass : hasClass, + toggleClass : toggleClass, + setDebounce : setDebounce, + setThrottle : setThrottle, + isElement : isElement, + isObject : isObject, + triggerEvent : triggerEvent, + triggerCustomEvent : triggerCustomEvent, + isElementInViewport : isElementInViewport + }; +})(window); +function setNavigation() { + var $nav = document.querySelector('.nav'); + var $nav_button; + var $nav_panel; + var $nav_close; + + if ($nav) { + $nav_button = document.querySelector('.nav-button'); + $nav_panel = $nav.querySelector('.nav__panel'); + $nav_close = $nav_panel.querySelector('.nav__close'); + + du.setClass($nav_panel, 'state--hidden'); + + du.setEvent($nav_button, 'click', function(thatEvt) { + thatEvt.preventDefault(); + + du.toggleClass($nav_panel, 'state--hidden'); + du.toggleClass($nav_panel, 'state--visible'); + }); + + du.setEvent($nav_close, 'click', function(thatEvt) { + thatEvt.preventDefault(); + + du.toggleClass($nav_panel, 'state--hidden'); + du.toggleClass($nav_panel, 'state--visible'); + }); + } +} + +setNavigation(); + +// atomic.setContentType('application/json'); +// atomic.get('http://webmention.io/api/mentions?jsonp=?') // this request will use application/json as Content-type +// .success(function (data, xhr) { +// console.log(data); +// }); + diff --git a/static/prod/js/script.min.js b/static/prod/js/script.min.js @@ -0,0 +1,34 @@ +/*!atomic v1.0.0 | (c) 2015 @toddmotto | https://github.com/toddmotto/atomic*/(function(root,factory){if(typeof define==='function'&&define.amd){define(factory);}else if(typeof exports==='object'){module.exports=factory;}else{root.atomic=factory(root);}})(this,function(root){'use strict';var exports={};var config={contentType:'application/x-www-form-urlencoded'};var parse=function(req){var result;try{result=JSON.parse(req.responseText);}catch(e){result=req.responseText;} +return[result,req];};var xhr=function(type,url,data){var methods={success:function(){},error:function(){},always:function(){}};var XHR=root.XMLHttpRequest||ActiveXObject;var request=new XHR('MSXML2.XMLHTTP.3.0');request.open(type,url,true);request.setRequestHeader('Content-type',config.contentType);request.onreadystatechange=function(){var req;if(request.readyState===4){req=parse(request);if(request.status>=200&&request.status<300){methods.success.apply(methods,req);}else{methods.error.apply(methods,req);} +methods.always.apply(methods,req);}};request.send(data);var atomXHR={success:function(callback){methods.success=callback;return atomXHR;},error:function(callback){methods.error=callback;return atomXHR;},always:function(callback){methods.always=callback;return atomXHR;}};return atomXHR;};exports.get=function(src){return xhr('GET',src);};exports.put=function(url,data){return xhr('PUT',url,data);};exports.post=function(url,data){return xhr('POST',url,data);};exports.delete=function(url){return xhr('DELETE',url);};exports.setContentType=function(value){config.contentType=value;};return exports;});var du=(function(win){'use strict';function doExtend(out){var key;var i;out=out||{};for(i=1;i<arguments.length;i++){if(!arguments[i]){continue;} +for(key in arguments[i]){if(arguments[i].hasOwnProperty(key)){out[key]=arguments[i][key];}}} +return out;} +function queryAll(selector,context){return Array.prototype.slice.call((context||document).querySelectorAll(selector));} +function setAttrs(el,attrs){var key;if(isElement(el)&&isObject(attrs)){for(key in attrs){if(attrs.hasOwnProperty(key)){el.setAttribute(key,attrs[key]);}}}else{console.log('Error "'+el+'" should be a DOM element!!');console.log('Error "'+attrs+'" should be an Object!!');}} +function setEvent(el,eventType,handler){if(window.addEventListener){el.addEventListener(eventType,handler,false);}else{el.attachEvent('on'+eventType,function(){handler.call(el);});}} +function setEventList(elList,event,handler){var lengthOf=elList.length;while(lengthOf--){setEvent(elList[lengthOf],event,handler);}} +function getIndex(array,item){var lengthOf=array.length;while(lengthOf--){if(array[lengthOf]===item){return lengthOf;}} +return-1;} +function getClosest(el,selector){var firstChar=selector.charAt(0);var supports='classList'in document.documentElement;var attribute,value;if(firstChar==='['){selector=selector.substr(1,selector.length-2);attribute=selector.split('=');if(attribute.length>1){value=true;attribute[1]=attribute[1].replace(/"/g,'').replace(/'/g,'');}} +for(;el&&el!==document&&el.nodeType===1;el=el.parentNode){if(firstChar==='.'){if(supports){if(el.classList.contains(selector.substr(1))){return el;}}else{if(new RegExp('(^|\\s)'+selector.substr(1)+'(\\s|$)').test(el.className)){return el;}}} +if(firstChar==='#'){if(el.id===selector.substr(1)){return el;}} +if(firstChar==='['){if(el.hasAttribute(attribute[0])){if(value){if(el.getAttribute(attribute[0])===attribute[1]){return el;}}else{return el;}}} +if(el.tagName.toLowerCase()===selector){return el;}} +return null;} +function getHeight(el){return Math.max(el.scrollHeight,el.offsetHeight,el.clientHeight);} +function setClass(el,classname){if(el.classList){el.classList.add(classname);}else{el.className+=' '+classname;} +return;} +function unsetClass(el,classname){if(el.classList){el.classList.remove(classname);}else{el.className=el.className.replace(new RegExp('(^|\\b)'+classname.split(' ').join('|')+'(\\b|$)','gi'),' ');} +return;} +function hasClass(el,classname){if(el.classList){return el.classList.contains(classname);}else{return new RegExp('(^| )'+classname+'( |$)','gi').test(el.className);}} +function toggleClass(el,classname){if(du.hasClass(el,classname)){return unsetClass(el,classname);}else{return setClass(el,classname);}} +function setDebounce(fnCallback,delay){var timer;return function(){var args=arguments;var context=this;clearTimeout(timer);timer=setTimeout(function(){fnCallback.apply(context,args);},delay);};} +function setThrottle(fnCallback,delay){var last;var timer;return function(){var context=this;var now=+new Date();var args=arguments;if(last&&now<last+delay){clearTimeout(timer);timer=setTimeout(function(){last=now;fnCallback.apply(context,args);},delay);}else{last=now;fnCallback.apply(context,args);}};} +function isElement(obj){return!!(obj&&obj.nodeType===1);} +function isObject(obj){var type=typeof obj;return type==='function'||type==='object'&&!!obj;} +function triggerEvent(el,eventType){if(document.createEvent){var event=document.createEvent('HTMLEvents');event.initEvent(eventType,true,false);el.dispatchEvent(event);}else{el.fireEvent('on'+eventType);}} +function triggerCustomEvent(el,eventType,eventData){var customEvent;if(window.CustomEvent){customEvent=new CustomEvent(eventType,{detail:eventData});}else{customEvent=document.createEvent('CustomEvent');customEvent.initCustomEvent(eventType,true,true,eventData);} +el.dispatchEvent(customEvent);} +function isElementInViewport(el){var elRect=el.getBoundingClientRect();return(elRect.top>=0&&elRect.left>=0&&elRect.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&elRect.right<=(window.innerWidth||document.documentElement.clientWidth));} +return{doExtend:doExtend,queryAll:queryAll,setAttrs:setAttrs,setEvent:setEvent,setEventList:setEventList,getIndex:getIndex,getClosest:getClosest,getHeight:getHeight,setClass:setClass,unsetClass:unsetClass,hasClass:hasClass,toggleClass:toggleClass,setDebounce:setDebounce,setThrottle:setThrottle,isElement:isElement,isObject:isObject,triggerEvent:triggerEvent,triggerCustomEvent:triggerCustomEvent,isElementInViewport:isElementInViewport};})(window);function setNavigation(){var $nav=document.querySelector('.nav');var $nav_button;var $nav_panel;var $nav_close;if($nav){$nav_button=document.querySelector('.nav-button');$nav_panel=$nav.querySelector('.nav__panel');$nav_close=$nav_panel.querySelector('.nav__close');du.setClass($nav_panel,'state--hidden');du.setEvent($nav_button,'click',function(thatEvt){thatEvt.preventDefault();du.toggleClass($nav_panel,'state--hidden');du.toggleClass($nav_panel,'state--visible');});du.setEvent($nav_close,'click',function(thatEvt){thatEvt.preventDefault();du.toggleClass($nav_panel,'state--hidden');du.toggleClass($nav_panel,'state--visible');});}} +setNavigation();+ \ No newline at end of file diff --git a/static/prod/js/vendor/atomic.min.js b/static/prod/js/vendor/atomic.min.js @@ -1,2 +0,0 @@ -/*! atomic v1.0.0 | (c) 2015 @toddmotto | https://github.com/toddmotto/atomic */ -!function(a,b){"function"==typeof define&&define.amd?define(b):"object"==typeof exports?module.exports=b:a.atomic=b(a)}(this,function(a){"use strict";var b={},c={contentType:"application/x-www-form-urlencoded"},d=function(a){var b;try{b=JSON.parse(a.responseText)}catch(c){b=a.responseText}return[b,a]},e=function(b,e,f){var g={success:function(){},error:function(){},always:function(){}},h=a.XMLHttpRequest||ActiveXObject,i=new h("MSXML2.XMLHTTP.3.0");i.open(b,e,!0),i.setRequestHeader("Content-type",c.contentType),i.onreadystatechange=function(){var a;4===i.readyState&&(a=d(i),i.status>=200&&i.status<300?g.success.apply(g,a):g.error.apply(g,a),g.always.apply(g,a))},i.send(f);var j={success:function(a){return g.success=a,j},error:function(a){return g.error=a,j},always:function(a){return g.always=a,j}};return j};return b.get=function(a){return e("GET",a)},b.put=function(a,b){return e("PUT",a,b)},b.post=function(a,b){return e("POST",a,b)},b["delete"]=function(a){return e("DELETE",a)},b.setContentType=function(a){c.contentType=a},b});- \ No newline at end of file