jekyll-uikit 0.1.5 → 0.1.7

data/assets/node_modules/uikit/src/js/core/scroll.js

@@ -0,0 +1,76 @@
+import { $, clamp, doc, escape, height, offset, requestAnimationFrame, trigger, win } from '../util/index';
+
+export default function (UIkit) {
+
+    UIkit.component('scroll', {
+
+        props: {
+            duration: Number,
+            offset: Number
+        },
+
+        defaults: {
+            duration: 1000,
+            offset: 0
+        },
+
+        methods: {
+
+            scrollTo(el) {
+
+                el = el && $(el) || doc.body;
+
+                var target = offset(el).top - this.offset,
+                    docHeight = height(doc),
+                    winHeight = height(win);
+
+                if (target + winHeight > docHeight) {
+                    target = docHeight - winHeight;
+                }
+
+                if (!trigger(this.$el, 'beforescroll', [this, el])) {
+                    return;
+                }
+
+                var start = Date.now(),
+                    startY = win.pageYOffset,
+                    step = () => {
+                        var currentY = startY + (target - startY) * ease(clamp((Date.now() - start) / this.duration));
+
+                        win.scrollTo(win.pageXOffset, currentY);
+
+                        // scroll more if we have not reached our destination
+                        if (currentY !== target) {
+                            requestAnimationFrame(step);
+                        } else {
+                            trigger(this.$el, 'scrolled', [this, el])
+                        }
+                    };
+
+                step();
+
+            }
+
+        },
+
+        events: {
+
+            click(e) {
+
+                if (e.defaultPrevented) {
+                    return;
+                }
+
+                e.preventDefault();
+                this.scrollTo(escape(this.$el.hash).substr(1));
+            }
+
+        }
+
+    });
+
+    function ease(k) {
+        return 0.5 * (1 - Math.cos(Math.PI * k));
+    }
+
+}

data/assets/node_modules/uikit/src/js/core/scrollspy-nav.js

@@ -0,0 +1,108 @@
+import { $, $$, addClass, closest, doc, filter, height, isInView, offset, removeClass, trigger, win } from '../util/index';
+
+export default function (UIkit) {
+
+    UIkit.component('scrollspy-nav', {
+
+        props: {
+            cls: String,
+            closest: String,
+            scroll: Boolean,
+            overflow: Boolean,
+            offset: Number
+        },
+
+        defaults: {
+            cls: 'uk-active',
+            closest: false,
+            scroll: false,
+            overflow: true,
+            offset: 0
+        },
+
+        computed: {
+
+            links(_, $el) {
+                return $$('a[href^="#"]', $el).filter(el => el.hash);
+            },
+
+            elements() {
+                return this.closest ? closest(this.links, this.closest) : this.links;
+            },
+
+            targets() {
+                return $$(this.links.map(el => el.hash).join(','));
+            }
+
+        },
+
+        update: [
+
+            {
+
+                read() {
+                    if (this.scroll) {
+                        UIkit.scroll(this.links, {offset: this.offset || 0});
+                    }
+                }
+
+            },
+
+            {
+
+                read() {
+
+                    var scroll = win.pageYOffset + this.offset + 1,
+                        max = height(doc) - height(win) + this.offset;
+
+                    this.active = false;
+
+                    this.targets.every((el, i) => {
+
+                        var top = offset(el).top, last = i + 1 === this.targets.length;
+                        if (!this.overflow && (i === 0 && top > scroll || last && top + el.offsetTop < scroll)) {
+                            return false;
+                        }
+
+                        if (!last && offset(this.targets[i + 1]).top <= scroll) {
+                            return true;
+                        }
+
+                        if (scroll >= max) {
+                            for (var j = this.targets.length - 1; j > i; j--) {
+                                if (isInView(this.targets[j])) {
+                                    el = this.targets[j];
+                                    break;
+                                }
+                            }
+                        }
+
+                        return !(this.active = $(filter(this.links, `[href="#${el.id}"]`)));
+
+                    });
+
+                },
+
+                write() {
+
+                    this.links.forEach(el => el.blur());
+                    removeClass(this.elements, this.cls);
+
+                    if (this.active) {
+                        trigger(this.$el, 'active', [
+                            this.active,
+                            addClass(this.closest ? closest(this.active, this.closest) : this.active, this.cls)
+                        ]);
+                    }
+
+                },
+
+                events: ['scroll', 'load', 'resize']
+
+            }
+
+        ]
+
+    });
+
+}

data/assets/node_modules/uikit/src/js/core/scrollspy.js

@@ -0,0 +1,140 @@
+import { $$, addClass, attr, css, filter, isInView, removeClass, toggleClass, trigger } from '../util/index';
+
+export default function (UIkit) {
+
+    UIkit.component('scrollspy', {
+
+        args: 'cls',
+
+        props: {
+            cls: 'list',
+            target: String,
+            hidden: Boolean,
+            offsetTop: Number,
+            offsetLeft: Number,
+            repeat: Boolean,
+            delay: Number
+        },
+
+        defaults: {
+            cls: ['uk-scrollspy-inview'],
+            target: false,
+            hidden: true,
+            offsetTop: 0,
+            offsetLeft: 0,
+            repeat: false,
+            delay: 0,
+            inViewClass: 'uk-scrollspy-inview'
+        },
+
+        computed: {
+
+            elements({target}, $el) {
+                return target ? $$(target, $el) : [$el];
+            }
+
+        },
+
+        update: [
+
+            {
+
+                write() {
+                    if (this.hidden) {
+                        css(filter(this.elements, `:not(.${this.inViewClass})`), 'visibility', 'hidden');
+                    }
+                }
+
+            },
+
+            {
+
+                read() {
+
+                    if (!UIkit._initialized) {
+                        return false;
+                    }
+
+                    this.elements.forEach(el => {
+
+                        if (!el._scrollspy) {
+                            var cls = attr(el, 'uk-scrollspy-class');
+                            el._scrollspy = {toggles: cls && cls.split(',') || this.cls};
+                        }
+
+                        el._scrollspy.show = isInView(el, this.offsetTop, this.offsetLeft);
+
+                    });
+                },
+
+                write() {
+
+                    var index = this.elements.length === 1 ? 1 : 0;
+
+                    this.elements.forEach((el, i) => {
+
+                        var data = el._scrollspy, cls = data.toggles[i] || data.toggles[0];
+
+                        if (data.show) {
+
+                            if (!data.inview && !data.timer) {
+
+                                var show = () => {
+                                    css(el, 'visibility', '');
+                                    addClass(el, this.inViewClass);
+                                    toggleClass(el, cls);
+
+                                    trigger(el, 'inview');
+
+                                    this.$update();
+
+                                    data.inview = true;
+                                    delete data.timer;
+                                };
+
+                                if (this.delay && index) {
+                                    data.timer = setTimeout(show, this.delay * index);
+                                } else {
+                                    show();
+                                }
+
+                                index++;
+
+                            }
+
+                        } else {
+
+                            if (data.inview && this.repeat) {
+
+                                if (data.timer) {
+                                    clearTimeout(data.timer);
+                                    delete data.timer;
+                                }
+
+                                css(el, 'visibility', this.hidden ? 'hidden' : '');
+                                removeClass(el, this.inViewClass);
+                                toggleClass(el, cls);
+
+                                trigger(el, 'outview');
+
+                                this.$update();
+
+                                data.inview = false;
+
+                            }
+
+                        }
+
+                    });
+
+                },
+
+                events: ['scroll', 'load', 'resize']
+
+            }
+
+        ]
+
+    });
+
+}

data/assets/node_modules/uikit/src/js/core/sticky.js

@@ -0,0 +1,308 @@
+import { Class } from '../mixin/index';
+import { $, addClass, after, Animation, assign, attr, css, docEl, hasClass, height, isNumeric, isString, isVisible, noop, offset, query, remove, removeClass, replaceClass, requestAnimationFrame, toFloat, toggleClass, trigger, win, within } from '../util/index';
+
+export default function (UIkit) {
+
+    UIkit.component('sticky', {
+
+        mixins: [Class],
+
+        attrs: true,
+
+        props: {
+            top: null,
+            bottom: Boolean,
+            offset: Number,
+            animation: String,
+            clsActive: String,
+            clsInactive: String,
+            clsFixed: String,
+            clsBelow: String,
+            selTarget: String,
+            widthElement: 'query',
+            showOnUp: Boolean,
+            media: 'media',
+            target: Number
+        },
+
+        defaults: {
+            top: 0,
+            bottom: false,
+            offset: 0,
+            animation: '',
+            clsActive: 'uk-active',
+            clsInactive: '',
+            clsFixed: 'uk-sticky-fixed',
+            clsBelow: 'uk-sticky-below',
+            selTarget: '',
+            widthElement: false,
+            showOnUp: false,
+            media: false,
+            target: false
+        },
+
+        computed: {
+
+            selTarget({selTarget}, $el) {
+                return selTarget && $(selTarget, $el) || $el;
+            }
+
+        },
+
+        connected() {
+
+            this.placeholder = $('<div class="uk-sticky-placeholder"></div>');
+            this.widthElement = this.$props.widthElement || this.placeholder;
+
+            if (!this.isActive) {
+                this.hide();
+            }
+        },
+
+        disconnected() {
+
+            if (this.isActive) {
+                this.isActive = false;
+                this.hide();
+                removeClass(this.$el, this.clsInactive);
+            }
+
+            remove(this.placeholder);
+            this.placeholder = null;
+            this.widthElement = null;
+        },
+
+        ready() {
+
+            if (!(this.target && location.hash && win.pageYOffset > 0)) {
+                return;
+            }
+
+            var target = $(location.hash);
+
+            if (target) {
+                requestAnimationFrame(() => {
+
+                    var top = offset(target).top,
+                        elTop = offset(this.$el).top,
+                        elHeight = this.$el.offsetHeight;
+
+                    if (elTop + elHeight >= top && elTop <= top + target.offsetHeight) {
+                        win.scrollTo(0, top - elHeight - this.target - this.offset);
+                    }
+
+                });
+            }
+
+        },
+
+        events: [
+
+            {
+                name: 'active',
+
+                self: true,
+
+                handler() {
+                    replaceClass(this.selTarget, this.clsInactive, this.clsActive);
+                }
+
+            },
+
+            {
+                name: 'inactive',
+
+                self: true,
+
+                handler() {
+                    replaceClass(this.selTarget, this.clsActive, this.clsInactive);
+                }
+
+            }
+
+        ],
+
+        update: [
+
+            {
+
+                write() {
+
+                    var placeholder = this.placeholder,
+                        outerHeight = (this.isActive ? placeholder : this.$el).offsetHeight, el;
+
+                    css(placeholder, assign(
+                        {height: css(this.$el, 'position') !== 'absolute' ? outerHeight : ''},
+                        css(this.$el, ['marginTop', 'marginBottom', 'marginLeft', 'marginRight'])
+                    ));
+
+                    if (!within(placeholder, docEl)) {
+                        after(this.$el, placeholder);
+                        attr(placeholder, 'hidden', '');
+                    }
+
+                    attr(this.widthElement, 'hidden', null);
+                    this.width = this.widthElement.offsetWidth;
+                    attr(this.widthElement, 'hidden', this.isActive ? null : '');
+
+                    this.topOffset = offset(this.isActive ? placeholder : this.$el).top;
+                    this.bottomOffset = this.topOffset + outerHeight;
+
+                    ['top', 'bottom'].forEach(prop => {
+
+                        this[prop] = this.$props[prop];
+
+                        if (!this[prop]) {
+                            return;
+                        }
+
+                        if (isNumeric(this[prop])) {
+
+                            this[prop] = this[`${prop}Offset`] + toFloat(this[prop]);
+
+                        } else {
+
+                            if (isString(this[prop]) && this[prop].match(/^-?\d+vh$/)) {
+                                this[prop] = height(win) * toFloat(this[prop]) / 100;
+                            } else {
+
+                                el = this[prop] === true ? this.$el.parentNode : query(this[prop], this.$el);
+
+                                if (el) {
+                                    this[prop] = offset(el).top + el.offsetHeight;
+                                }
+
+                            }
+
+                        }
+
+                    });
+
+                    this.top = Math.max(toFloat(this.top), this.topOffset) - this.offset;
+                    this.bottom = this.bottom && this.bottom - outerHeight;
+                    this.inactive = this.media && !win.matchMedia(this.media).matches;
+
+                    if (this.isActive) {
+                        this.update();
+                    }
+                },
+
+                events: ['load', 'resize']
+
+            },
+
+            {
+
+                read({scrollY = win.pageYOffset}) {
+                    this.offsetTop = offset(this.$el).top;
+                    this.scroll = scrollY;
+                    this.visible = isVisible(this.$el);
+                },
+
+                write({dir} = {}) {
+
+                    var scroll = this.scroll;
+
+                    if (scroll < 0 || !this.visible || this.disabled || this.showOnUp && !dir) {
+                        return;
+                    }
+
+                    if (this.inactive
+                        || scroll < this.top
+                        || this.showOnUp && (scroll <= this.top || dir === 'down' || dir === 'up' && !this.isActive && scroll <= this.bottomOffset)
+                    ) {
+
+                        if (!this.isActive) {
+                            return;
+                        }
+
+                        this.isActive = false;
+
+                        if (this.animation && scroll > this.topOffset) {
+                            Animation.cancel(this.$el);
+                            Animation.out(this.$el, this.animation).then(() => this.hide(), noop);
+                        } else {
+                            this.hide();
+                        }
+
+                    } else if (this.isActive) {
+
+                        this.update();
+
+                    } else if (this.animation) {
+
+                        Animation.cancel(this.$el);
+                        this.show();
+                        Animation.in(this.$el, this.animation).catch(noop);
+
+                    } else {
+                        this.show();
+                    }
+
+                },
+
+                events: ['scroll']
+
+            },
+
+        ],
+
+        methods: {
+
+            show() {
+
+                this.isActive = true;
+                this.update();
+                attr(this.placeholder, 'hidden', null);
+
+            },
+
+            hide() {
+
+                if (!this.isActive || hasClass(this.selTarget, this.clsActive)) {
+                    trigger(this.$el, 'inactive');
+                }
+
+                removeClass(this.$el, this.clsFixed, this.clsBelow);
+                css(this.$el, {position: '', top: '', width: ''});
+                attr(this.placeholder, 'hidden', '');
+
+            },
+
+            update() {
+
+                var top = Math.max(0, this.offset), active = this.scroll > this.top;
+
+                if (this.bottom && this.scroll > this.bottom - this.offset) {
+                    top = this.bottom - this.scroll;
+                }
+
+                css(this.$el, {
+                    position: 'fixed',
+                    top: `${top}px`,
+                    width: this.width
+                });
+
+                if (hasClass(this.selTarget, this.clsActive)) {
+
+                    if (!active) {
+                        trigger(this.$el, 'inactive');
+                    }
+
+                } else {
+
+                    if (active) {
+                        trigger(this.$el, 'active');
+                    }
+                }
+
+                toggleClass(this.$el, this.clsBelow, this.scroll > this.bottomOffset);
+                addClass(this.$el, this.clsFixed);
+
+            }
+
+        }
+
+    });
+
+}