diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..9d08a1a --- /dev/null +++ b/.editorconfig @@ -0,0 +1,9 @@ +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true diff --git a/src/delighters.js b/src/delighters.js index c31f8b5..82c95e4 100644 --- a/src/delighters.js +++ b/src/delighters.js @@ -1,98 +1,98 @@ /* - Delighters - Add CSS animations to delight users as they scroll down. - (c) 2018 - Q42 - Written by Martin Kool - https://github.com/Q42/delighters + Delighters - Add CSS animations to delight users as they scroll down. + (c) 2018 - Q42 + Written by Martin Kool + https://github.com/Q42/delighters */ var Delighters = new (function() { - var self = this, - dels = this.dels = [], + var self = this, + dels = this.dels = [], - // default options - options = { - attribute: 'data-delighter', - classNames: ['delighter', 'started', 'ended'], - start: 0.75, // default start threshold - end: 0.75, // default end threshold - autoInit: true // initialize when DOMContentLoaded - }; + // default options + options = { + attribute: 'data-delighter', + classNames: ['delighter', 'started', 'ended'], + start: 0.75, // default start threshold + end: 0.75, // default end threshold + autoInit: true // initialize when DOMContentLoaded + }; - document.addEventListener("DOMContentLoaded", function() { - if (options.autoInit) init(); - }); + document.addEventListener("DOMContentLoaded", function() { + if (options.autoInit) init(); + }); - function config(opts) { - for (var name in opts) options[name] = opts[name]; - } - - function init() { - document.addEventListener('scroll', scroll) - var els = document.querySelectorAll('[' + options.attribute + ']'); + function config(opts) { + for (var name in opts) options[name] = opts[name]; + } + + function init() { + document.addEventListener('scroll', scroll) + var els = document.querySelectorAll('[' + options.attribute + ']'); - for (var i=0; i= 0 && factorStart <= 1) { - if (!del.startLine) { - del.startLine = document.createElement('div') - document.body.appendChild(del.startLine); - del.startLine.style = 'position:fixed;height:0;width:100%;border-bottom:dotted red 2px;top:' + (del.start * 100) + 'vh'; - } - } - if (((factorEnd < del.end) || (factorStart > 1)) && del.startLine) { - del.startLine.parentNode.removeChild(del.startLine); - delete del.startLine; - } - } - if (factorStart < del.start && !del.started) { - del.started = true; - del.el.classList.add(options.classNames[1]) - } - else if (factorStart > del.start && del.started) { - del.started = false; - del.el.classList.remove(options.classNames[1]) - } - if (factorEnd < del.end && !del.ended) { - del.ended = true; - del.el.classList.add(options.classNames[2]) - } - else if (factorEnd > del.end && del.ended) { - del.ended = false; - del.el.classList.remove(options.classNames[2]) - } - } - } + if (del.debug) { + if (factorStart >= 0 && factorStart <= 1) { + if (!del.startLine) { + del.startLine = document.createElement('div') + document.body.appendChild(del.startLine); + del.startLine.style = 'position:fixed;height:0;width:100%;border-bottom:dotted red 2px;top:' + (del.start * 100) + 'vh'; + } + } + if (((factorEnd < del.end) || (factorStart > 1)) && del.startLine) { + del.startLine.parentNode.removeChild(del.startLine); + delete del.startLine; + } + } + if (factorStart < del.start && !del.started) { + del.started = true; + del.el.classList.add(options.classNames[1]) + } + else if (factorStart > del.start && del.started) { + del.started = false; + del.el.classList.remove(options.classNames[1]) + } + if (factorEnd < del.end && !del.ended) { + del.ended = true; + del.el.classList.add(options.classNames[2]) + } + else if (factorEnd > del.end && del.ended) { + del.ended = false; + del.el.classList.remove(options.classNames[2]) + } + } + } - self.init = init; - self.config = config; + self.init = init; + self.config = config; })();