From 5188ed8cfe347ee2d4521aca242d250ebcbae6bd Mon Sep 17 00:00:00 2001 From: Frederic Guillot Date: Mon, 21 Nov 2016 21:53:30 -0500 Subject: Rewrite markdown editor in vanilla Javascript --- assets/js/src/Namespace.js | 108 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 108 insertions(+) (limited to 'assets/js/src/Namespace.js') diff --git a/assets/js/src/Namespace.js b/assets/js/src/Namespace.js index 6b4b0543..e6ca1ed3 100644 --- a/assets/js/src/Namespace.js +++ b/assets/js/src/Namespace.js @@ -1,3 +1,111 @@ 'use strict'; var Kanboard = {}; + +var KB = { + components: {} +}; + +KB.component = function (name, object) { + this.components[name] = object; +}; + +KB.render = function () { + for (var name in this.components) { + var elementList = document.querySelectorAll('.js-' + name); + + for (var i = 0; i < elementList.length; i++) { + var object = this.components[name]; + var component = new object(elementList[i], JSON.parse(elementList[i].dataset.params)); + component.render(); + elementList[i].className = elementList[i].className + '-rendered'; + } + } +}; + +KB.el = function (tag) { + + function DOMBuilder(tag) { + var element = typeof tag === 'string' ? document.createElement(tag) : tag; + + this.attr = function (attribute, value) { + if (value !== null) { + element.setAttribute(attribute, value); + } + return this; + }; + + this.hide = function () { + element.style.display = 'none'; + return this; + }; + + this.show = function () { + element.style.display = 'block'; + return this; + }; + + this.toggle = function () { + if (element.style.display === 'none') { + this.show(); + } else{ + this.hide(); + } + + return this; + }; + + this.click = function (callback) { + element.onclick = function (e) { + e.preventDefault(); + callback(); + }; + return this; + }; + + this.add = function (node) { + element.appendChild(node); + return this; + }; + + this.html = function (html) { + element.innerHTML = html; + return this; + }; + + this.text = function (text) { + element.appendChild(document.createTextNode(text)); + return this; + }; + + this.for = function (tag, list) { + for (var i = 0; i < list.length; i++) { + var dict = list[i]; + + if (typeof dict !== 'object') { + element.appendChild(KB.el(tag).text(dict).build()); + } else { + var node = KB.el(tag); + + for (var attribute in dict) { + if (attribute in this && typeof this[attribute] === 'function') { + node[attribute](dict[attribute]); + } else { + node.attr(attribute, dict[attribute]); + } + } + + element.appendChild(node.build()); + } + } + + return this; + }; + + this.build = function () { + return element; + }; + } + + return new DOMBuilder(tag); +}; -- cgit v1.2.3