var Sui = { ready: (callback) => { document.addEventListener("DOMContentLoaded", function() { callback(); }, false); }, select: (selector) => { return document.querySelectorAll(selector); }, link: (node) => { return (actuator) => { let update = function(endpoint, method, props) { Sui.http.ajax({ method: method, endpoint: node.api[endpoint] + (props ? props.join('/') : ''), cache: false }, actuator.onResponse || null); }; Sui.select(actuator.selector).forEach( (domEl) =>{ let handle = function(event) { update.call(this, actuator.api, 'GET', actuator.data ? actuator.data.call(this) : [this.value] ); } $(domEl).on(actuator.event, handle) }); }; }, util: { /** * serialize a flat json object */ serialize: (obj) => { var str = []; for(var p in obj){ str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); } return str.join("&"); } }, http: { /** * ajax request * { * method: <'GET', 'POST', whatever >, * endpoint: , * async: , (default true) * data: , * cache: (default false) * } */ ajax: (config, callback) => { var cache = config.cache || false; var data = config.data || {}; if(!cache) { data['_'] = new Date().getTime(); } var serializedData = Sui.util.serialize(data); var endPointUrl = (config.method === 'GET' || config.method === 'DELETE') && data ? config.endpoint+'?'+serializedData : config.endpoint; var postData = config.method === 'POST' || config.method === 'PUT' ? serializedData : null; var request = new XMLHttpRequest(); request.open(config.method, endPointUrl, config.async || true); request.onreadystatechange = function () { // TODO handle response properly callback ? callback(request.responseText, request.status) : undefined; }; request.send(postData); } } };