khufu-runtime/lib/khufu-runtime/index.js

A runtime support library for khufu template engine

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});
exports.text = exports.elementVoid = exports.elementClose = exports.elementOpen = exports.SuppressedError = exports.item = exports.add_style = exports.CANCEL = undefined;

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };

exports.attach = attach;

var _stores = require('./stores');

var _stores2 = _interopRequireDefault(_stores);

var _incrementalDom = require('incremental-dom');

var _style = require('./style');

var _dom = require('./dom');

var _errors = require('./errors');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

exports.CANCEL = _stores.CANCEL;
exports.add_style = _style.add_style;
exports.item = _dom.item;
exports.SuppressedError = _errors.SuppressedError;
exports.elementOpen = _incrementalDom.elementOpen;
exports.elementClose = _incrementalDom.elementClose;
exports.elementVoid = _incrementalDom.elementVoid;
exports.text = _incrementalDom.text;

/// Things that can only be assigned as properties

var PROPERTIES = {
    "value": "value"

    // This is different from incremental-dom default, because it sets boolean
    // attributes as property instead of attribute. This works better for
    // properties like `checked`. May need better heuristics though.
    //
    // Also some things like "value" do nothing when not applied as properties
};function applyAttribute(el, name, value) {
    var type = typeof value === 'undefined' ? 'undefined' : _typeof(value);
    var prop = PROPERTIES[name];
    if (prop) {
        (0, _incrementalDom.applyProp)(el, prop, value);
    } else if (type === 'object' || type === 'function' || type == 'boolean') {
        (0, _incrementalDom.applyProp)(el, name, value);
    } else {
        (0, _incrementalDom.applyAttr)(el, name, value);
    }
}

function set_global_state(params) {
    var old = {
        stores: _incrementalDom.attributes.__stores,
        applyAttr: _incrementalDom.attributes[_incrementalDom.symbols.default],
        deleted: _incrementalDom.notifications.nodesDeleted
    };
    _incrementalDom.attributes.__stores = (0, _stores.store_handler)(params);
    _incrementalDom.attributes[_incrementalDom.symbols.default] = applyAttribute;
    _incrementalDom.notifications.nodesDeleted = _stores.cleanup_stores;
    return old;
}

function clean_global_state(old) {
    _incrementalDom.notifications.nodesDeleted = old.deleted;
    _incrementalDom.attributes[_incrementalDom.symbols.default] = old.applyAttr;
    _incrementalDom.attributes.__stores = old.stores;
}

function attach(element, template, settings) {
    if (typeof settings.store !== 'function') {
        throw Error("Third argument to khufu must be a settings object " + "and has `store` function (see http://bit.ly/store_cons)");
    }

    var params = _extends({}, settings, { render: queue_render });

    var queued = false;
    function queue_render() {
        if (!queued) {
            queued = true;
            window.requestAnimationFrame(render);
        }
    }
    function render() {
        queued = false;
        var obj = set_global_state(params);
        try {
            (0, _incrementalDom.patch)(element, template);
        } catch (e) {
            if (e instanceof _errors.SuppressedError) {
                console.error("Render error (suppressed)", e.original);
                try {
                    (0, _incrementalDom.patch)(element, template);
                } catch (e) {
                    console.error("Successive render error", e);
                }
            } else {
                console.error("Render error", e);
            }
        }
        clean_global_state(obj);
    }
    render(); // Immediate render works better with hot reload
    return {
        queue_render: queue_render
    };
}