summaryrefslogtreecommitdiff
path: root/assets/js/core
diff options
context:
space:
mode:
Diffstat (limited to 'assets/js/core')
-rw-r--r--assets/js/core/base.js70
-rw-r--r--assets/js/core/dom.js45
-rw-r--r--assets/js/core/html.js25
-rw-r--r--assets/js/core/http.js66
-rw-r--r--assets/js/core/kb.js58
-rw-r--r--assets/js/core/utils.js13
6 files changed, 213 insertions, 64 deletions
diff --git a/assets/js/core/base.js b/assets/js/core/base.js
new file mode 100644
index 00000000..7346575c
--- /dev/null
+++ b/assets/js/core/base.js
@@ -0,0 +1,70 @@
+var KB = {
+ components: {},
+ utils: {},
+ html: {},
+ http: {},
+ listeners: {
+ clicks: {},
+ internals: {}
+ }
+};
+
+KB.on = function (eventType, callback) {
+ if (! this.listeners.internals.hasOwnProperty(eventType)) {
+ this.listeners.internals[eventType] = [];
+ }
+
+ this.listeners.internals[eventType].push(callback);
+};
+
+KB.trigger = function (eventType, eventData) {
+ if (this.listeners.internals.hasOwnProperty(eventType)) {
+ for (var i = 0; i < this.listeners.internals[eventType].length; i++) {
+ if (! this.listeners.internals[eventType][i](eventData)) {
+ break;
+ }
+ }
+ }
+};
+
+KB.onClick = function (selector, callback) {
+ this.listeners.clicks[selector] = callback;
+};
+
+KB.listen = function () {
+ var self = this;
+
+ function onClick(e) {
+ for (var selector in self.listeners.clicks) {
+ if (self.listeners.clicks.hasOwnProperty(selector) && e.target.matches(selector)) {
+ e.preventDefault();
+ self.listeners.clicks[selector](e);
+ }
+ }
+ }
+
+ document.addEventListener('click', onClick, false);
+};
+
+KB.component = function (name, object) {
+ this.components[name] = object;
+};
+
+KB.getComponent = function (name, containerElement, options) {
+ var object = this.components[name];
+ return new object(containerElement, options);
+};
+
+KB.render = function () {
+ for (var name in this.components) {
+ var elementList = document.querySelectorAll('.js-' + name);
+
+ for (var i = 0; i < elementList.length; i++) {
+ if (this.components.hasOwnProperty(name)) {
+ var component = KB.getComponent(name, elementList[i], JSON.parse(elementList[i].dataset.params));
+ component.render();
+ elementList[i].className = elementList[i].className + '-rendered';
+ }
+ }
+ }
+};
diff --git a/assets/js/core/dom.js b/assets/js/core/dom.js
index 821a1d2f..33039285 100644
--- a/assets/js/core/dom.js
+++ b/assets/js/core/dom.js
@@ -1,4 +1,3 @@
-
KB.dom = function (tag) {
function DomManipulation(tag) {
@@ -31,19 +30,33 @@ KB.dom = function (tag) {
return this;
};
- this.click = function (callback) {
- element.onclick = function (e) {
+ this.on = function (eventName, callback) {
+ element.addEventListener(eventName, function (e) {
e.preventDefault();
- callback();
- };
+ callback(e.target);
+ });
+
return this;
};
+ this.click = function (callback) {
+ return this.on('click', callback);
+ };
+
+ this.change = function (callback) {
+ return this.on('change', callback);
+ };
+
this.add = function (node) {
element.appendChild(node);
return this;
};
+ this.replace = function (node) {
+ element.parentNode.replaceChild(node, element);
+ return this;
+ };
+
this.html = function (html) {
element.innerHTML = html;
return this;
@@ -73,6 +86,16 @@ KB.dom = function (tag) {
return element.classList.contains(className);
};
+ this.disable = function () {
+ element.disabled = true;
+ return this;
+ };
+
+ this.enable = function () {
+ element.disabled = false;
+ return this;
+ };
+
this.parent = function (selector) {
for (; element && element !== document; element = element.parentNode) {
if (element.matches(selector)) {
@@ -83,7 +106,7 @@ KB.dom = function (tag) {
return null;
};
- this.child = function (selector) {
+ this.find = function (selector) {
return element.querySelector(selector);
};
@@ -118,3 +141,13 @@ KB.dom = function (tag) {
return new DomManipulation(tag);
};
+
+KB.find = function (selector) {
+ var element = document.querySelector(selector);
+
+ if (element) {
+ return KB.dom(element);
+ }
+
+ return null;
+};
diff --git a/assets/js/core/html.js b/assets/js/core/html.js
new file mode 100644
index 00000000..f49a629c
--- /dev/null
+++ b/assets/js/core/html.js
@@ -0,0 +1,25 @@
+KB.html.label = function (label, id) {
+ return KB.dom('label').attr('for', id).text(label).build();
+};
+
+KB.html.radio = function (label, name, value) {
+ return KB.dom('label')
+ .add(KB.dom('input')
+ .attr('type', 'radio')
+ .attr('name', name)
+ .attr('value', value)
+ .build()
+ )
+ .text(label)
+ .build();
+};
+
+KB.html.radios = function (items) {
+ var html = KB.dom('div');
+
+ for (var item in items) {
+ if (items.hasOwnProperty(item)) {
+ html.add(KB.html.radio(item.label, item.name, item.value));
+ }
+ }
+};
diff --git a/assets/js/core/http.js b/assets/js/core/http.js
new file mode 100644
index 00000000..b965ad23
--- /dev/null
+++ b/assets/js/core/http.js
@@ -0,0 +1,66 @@
+KB.http.request = function (method, url, headers, body) {
+ var successCallback = function() {};
+ var errorCallback = function() {};
+
+ function parseResponse(request) {
+ try {
+ return JSON.parse(request.responseText);
+ } catch (e) {
+ return request.responseText;
+ }
+ }
+
+ this.execute = function () {
+ var request = new XMLHttpRequest();
+ request.open(method, url, true);
+ request.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+
+ for (var header in headers) {
+ if (headers.hasOwnProperty(header)) {
+ request.setRequestHeader(header, headers[header]);
+ }
+ }
+
+ request.onerror = function() {
+ errorCallback();
+ };
+
+ request.onreadystatechange = function() {
+ if (request.readyState === XMLHttpRequest.DONE) {
+ var response = parseResponse(request);
+
+ if (request.status === 200) {
+ successCallback(response);
+ } else {
+ errorCallback(response);
+ }
+ }
+ };
+
+ request.send(body);
+ return this;
+ };
+
+ this.success = function (callback) {
+ successCallback = callback;
+ return this;
+ };
+
+ this.error = function (callback) {
+ errorCallback = callback;
+ return this;
+ };
+};
+
+KB.http.get = function (url) {
+ return (new KB.http.request('GET', url)).execute();
+};
+
+KB.http.postJson = function (url, body) {
+ var headers = {
+ 'Content-Type': 'application/json',
+ 'Accept': 'application/json'
+ };
+
+ return (new KB.http.request('POST', url, headers, JSON.stringify(body))).execute();
+};
diff --git a/assets/js/core/kb.js b/assets/js/core/kb.js
deleted file mode 100644
index 8ed0e41c..00000000
--- a/assets/js/core/kb.js
+++ /dev/null
@@ -1,58 +0,0 @@
-var KB = {
- components: {},
- utils: {},
- clickEvents: {}
-};
-
-KB.onClick = function (selector, callback) {
- this.clickEvents[selector] = callback;
-};
-
-KB.listen = function () {
- var self = this;
-
- function onClick(e) {
- for (var selector in self.clickEvents) {
- if (self.clickEvents.hasOwnProperty(selector) && e.target.matches(selector)) {
- e.preventDefault();
- self.clickEvents[selector](e);
- }
- }
- }
-
- document.addEventListener('click', onClick, false);
-};
-
-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++) {
- if (this.components.hasOwnProperty(name)) {
- 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.utils.formatDuration = function (d) {
- if (d >= 86400) {
- return Math.round(d/86400) + "d";
- }
- else if (d >= 3600) {
- return Math.round(d/3600) + "h";
- }
- else if (d >= 60) {
- return Math.round(d/60) + "m";
- }
-
- return d + "s";
-};
diff --git a/assets/js/core/utils.js b/assets/js/core/utils.js
new file mode 100644
index 00000000..7d631526
--- /dev/null
+++ b/assets/js/core/utils.js
@@ -0,0 +1,13 @@
+KB.utils.formatDuration = function (d) {
+ if (d >= 86400) {
+ return Math.round(d/86400) + "d";
+ }
+ else if (d >= 3600) {
+ return Math.round(d/3600) + "h";
+ }
+ else if (d >= 60) {
+ return Math.round(d/60) + "m";
+ }
+
+ return d + "s";
+};