[TASK] Add a small jQuery-style dashboard api module.
This commit is contained in:
parent
1819d03598
commit
dc0a10b506
|
@ -5,12 +5,11 @@
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||||
<meta name="robots" content="noindex,nofollow" />
|
<meta name="robots" content="noindex,nofollow" />
|
||||||
<link rel="stylesheet" type="text/css" href="style/main.css" />
|
<link rel="stylesheet" type="text/css" href="style/main.css" />
|
||||||
<!-- jQuery -->
|
|
||||||
<script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>
|
|
||||||
<!-- jQuery ui smoothness theme -->
|
|
||||||
<link rel="stylesheet" type="text/css" href="jquery-ui-1.10.3.custom/css/smoothness/jquery-ui-1.10.3.custom.min.css" />
|
<link rel="stylesheet" type="text/css" href="jquery-ui-1.10.3.custom/css/smoothness/jquery-ui-1.10.3.custom.min.css" />
|
||||||
<!-- jQuery ui -->
|
<script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>
|
||||||
<script type="text/javascript" src="jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
|
<script type="text/javascript" src="jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
|
||||||
|
<script type="text/javascript" src="js/jquery.mustache.js"></script>
|
||||||
|
<script type="text/javascript" src="js/jquery.dashboard.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="wallpaper"></div>
|
<div id="wallpaper"></div>
|
||||||
|
|
|
@ -0,0 +1,79 @@
|
||||||
|
(function($) {
|
||||||
|
//define dashboard namespace
|
||||||
|
$.dashboard = {};
|
||||||
|
$.fn.dashboard = {};
|
||||||
|
|
||||||
|
//wrap ajax method
|
||||||
|
function ajax(method, url, data, callback) {
|
||||||
|
$.ajax({
|
||||||
|
"async": true,
|
||||||
|
"cache": false,
|
||||||
|
"data": data,
|
||||||
|
"type": method,
|
||||||
|
"url": url
|
||||||
|
})
|
||||||
|
.always(function(data, textStatus, jqXHR) {
|
||||||
|
if(textStatus == "success") {
|
||||||
|
callback(data);
|
||||||
|
} else {
|
||||||
|
console.error(["ajaxResult", arguments]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
$.dashboard.doLogin = function(username, password, callback) {
|
||||||
|
if(arguments.length < 2 || username == "" || password == "") {
|
||||||
|
throw {"error": "username or password is empty!"};
|
||||||
|
}
|
||||||
|
ajax("PUT", "/session", {
|
||||||
|
"username": username,
|
||||||
|
"password": password
|
||||||
|
}, function(data) {
|
||||||
|
if(typeof(callback) == "function") callback(data);
|
||||||
|
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
$.dashboard.doLogout = function(callback) {
|
||||||
|
ajax("DELETE", "/session", null, function(data) {
|
||||||
|
if(typeof(callback) == "function") callback(data);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
$.dashboard.getLogin = function(callback) {
|
||||||
|
ajax("GET", "/session", null, function(data) {
|
||||||
|
if(typeof(callback) == "function") callback(data);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
$.dashboard.createUser = function(username, password, callback) {
|
||||||
|
ajax("PUT", "/user", {
|
||||||
|
"username": username,
|
||||||
|
"password": password
|
||||||
|
}, function(data) {
|
||||||
|
if(typeof(callback) == "function") callback(data);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
$.dashboard.getUser = function(callback) {
|
||||||
|
ajax("GET", "/user", null, function(data) {
|
||||||
|
if(typeof(callback) == "function") callback(data);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
$.dashboard.updateUser = function(data, callback) {
|
||||||
|
ajax("POST", "/user", data, function(data) {
|
||||||
|
if(typeof(callback) == "function") callback(data);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
$.dashboard.deleteUser = function(username, password, callback) {
|
||||||
|
ajax("DELETE", "/user", {
|
||||||
|
"username": username,
|
||||||
|
"password": password
|
||||||
|
}, function(data) {
|
||||||
|
if(typeof(callback) == "function") callback(data);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery);
|
|
@ -0,0 +1,346 @@
|
||||||
|
/*
|
||||||
|
Shameless port of a shameless port
|
||||||
|
@defunkt => @janl => @aq
|
||||||
|
|
||||||
|
See http://github.com/defunkt/mustache for more info.
|
||||||
|
*/
|
||||||
|
|
||||||
|
;(function($) {
|
||||||
|
|
||||||
|
/*
|
||||||
|
mustache.js — Logic-less templates in JavaScript
|
||||||
|
|
||||||
|
See http://mustache.github.com/ for more info.
|
||||||
|
*/
|
||||||
|
|
||||||
|
var Mustache = function() {
|
||||||
|
var Renderer = function() {};
|
||||||
|
|
||||||
|
Renderer.prototype = {
|
||||||
|
otag: "{{",
|
||||||
|
ctag: "}}",
|
||||||
|
pragmas: {},
|
||||||
|
buffer: [],
|
||||||
|
pragmas_implemented: {
|
||||||
|
"IMPLICIT-ITERATOR": true
|
||||||
|
},
|
||||||
|
context: {},
|
||||||
|
|
||||||
|
render: function(template, context, partials, in_recursion) {
|
||||||
|
// reset buffer & set context
|
||||||
|
if(!in_recursion) {
|
||||||
|
this.context = context;
|
||||||
|
this.buffer = []; // TODO: make this non-lazy
|
||||||
|
}
|
||||||
|
|
||||||
|
// fail fast
|
||||||
|
if(!this.includes("", template)) {
|
||||||
|
if(in_recursion) {
|
||||||
|
return template;
|
||||||
|
} else {
|
||||||
|
this.send(template);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
template = this.render_pragmas(template);
|
||||||
|
var html = this.render_section(template, context, partials);
|
||||||
|
if(in_recursion) {
|
||||||
|
return this.render_tags(html, context, partials, in_recursion);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.render_tags(html, context, partials, in_recursion);
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
Sends parsed lines
|
||||||
|
*/
|
||||||
|
send: function(line) {
|
||||||
|
if(line != "") {
|
||||||
|
this.buffer.push(line);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
Looks for %PRAGMAS
|
||||||
|
*/
|
||||||
|
render_pragmas: function(template) {
|
||||||
|
// no pragmas
|
||||||
|
if(!this.includes("%", template)) {
|
||||||
|
return template;
|
||||||
|
}
|
||||||
|
|
||||||
|
var that = this;
|
||||||
|
var regex = new RegExp(this.otag + "%([\\w-]+) ?([\\w]+=[\\w]+)?" +
|
||||||
|
this.ctag);
|
||||||
|
return template.replace(regex, function(match, pragma, options) {
|
||||||
|
if(!that.pragmas_implemented[pragma]) {
|
||||||
|
throw({message:
|
||||||
|
"This implementation of mustache doesn't understand the '" +
|
||||||
|
pragma + "' pragma"});
|
||||||
|
}
|
||||||
|
that.pragmas[pragma] = {};
|
||||||
|
if(options) {
|
||||||
|
var opts = options.split("=");
|
||||||
|
that.pragmas[pragma][opts[0]] = opts[1];
|
||||||
|
}
|
||||||
|
return "";
|
||||||
|
// ignore unknown pragmas silently
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
Tries to find a partial in the curent scope and render it
|
||||||
|
*/
|
||||||
|
render_partial: function(name, context, partials) {
|
||||||
|
name = this.trim(name);
|
||||||
|
if(!partials || partials[name] === undefined) {
|
||||||
|
throw({message: "unknown_partial '" + name + "'"});
|
||||||
|
}
|
||||||
|
if(typeof(context[name]) != "object") {
|
||||||
|
return this.render(partials[name], context, partials, true);
|
||||||
|
}
|
||||||
|
return this.render(partials[name], context[name], partials, true);
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
Renders inverted (^) and normal (#) sections
|
||||||
|
*/
|
||||||
|
render_section: function(template, context, partials) {
|
||||||
|
if(!this.includes("#", template) && !this.includes("^", template)) {
|
||||||
|
return template;
|
||||||
|
}
|
||||||
|
|
||||||
|
var that = this;
|
||||||
|
// CSW - Added "+?" so it finds the tighest bound, not the widest
|
||||||
|
var regex = new RegExp(this.otag + "(\\^|\\#)\\s*(.+)\\s*" + this.ctag +
|
||||||
|
"\n*([\\s\\S]+?)" + this.otag + "\\/\\s*\\2\\s*" + this.ctag +
|
||||||
|
"\\s*", "mg");
|
||||||
|
|
||||||
|
// for each {{#foo}}{{/foo}} section do...
|
||||||
|
return template.replace(regex, function(match, type, name, content) {
|
||||||
|
var value = that.find(name, context);
|
||||||
|
if(type == "^") { // inverted section
|
||||||
|
if(!value || that.is_array(value) && value.length === 0) {
|
||||||
|
// false or empty list, render it
|
||||||
|
return that.render(content, context, partials, true);
|
||||||
|
} else {
|
||||||
|
return "";
|
||||||
|
}
|
||||||
|
} else if(type == "#") { // normal section
|
||||||
|
if(that.is_array(value)) { // Enumerable, Let's loop!
|
||||||
|
return that.map(value, function(row) {
|
||||||
|
return that.render(content, that.create_context(row),
|
||||||
|
partials, true);
|
||||||
|
}).join("");
|
||||||
|
} else if(that.is_object(value)) { // Object, Use it as subcontext!
|
||||||
|
return that.render(content, that.create_context(value),
|
||||||
|
partials, true);
|
||||||
|
} else if(typeof value === "function") {
|
||||||
|
// higher order section
|
||||||
|
return value.call(context, content, function(text) {
|
||||||
|
return that.render(text, context, partials, true);
|
||||||
|
});
|
||||||
|
} else if(value) { // boolean section
|
||||||
|
return that.render(content, context, partials, true);
|
||||||
|
} else {
|
||||||
|
return "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
Replace {{foo}} and friends with values from our view
|
||||||
|
*/
|
||||||
|
render_tags: function(template, context, partials, in_recursion) {
|
||||||
|
// tit for tat
|
||||||
|
var that = this;
|
||||||
|
|
||||||
|
var new_regex = function() {
|
||||||
|
return new RegExp(that.otag + "(=|!|>|\\{|%)?([^\\/#\\^]+?)\\1?" +
|
||||||
|
that.ctag + "+", "g");
|
||||||
|
};
|
||||||
|
|
||||||
|
var regex = new_regex();
|
||||||
|
var tag_replace_callback = function(match, operator, name) {
|
||||||
|
switch(operator) {
|
||||||
|
case "!": // ignore comments
|
||||||
|
return "";
|
||||||
|
case "=": // set new delimiters, rebuild the replace regexp
|
||||||
|
that.set_delimiters(name);
|
||||||
|
regex = new_regex();
|
||||||
|
return "";
|
||||||
|
case ">": // render partial
|
||||||
|
return that.render_partial(name, context, partials);
|
||||||
|
case "{": // the triple mustache is unescaped
|
||||||
|
return that.find(name, context);
|
||||||
|
default: // escape the value
|
||||||
|
return that.escape(that.find(name, context));
|
||||||
|
}
|
||||||
|
};
|
||||||
|
var lines = template.split("\n");
|
||||||
|
for(var i = 0; i < lines.length; i++) {
|
||||||
|
lines[i] = lines[i].replace(regex, tag_replace_callback, this);
|
||||||
|
if(!in_recursion) {
|
||||||
|
this.send(lines[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if(in_recursion) {
|
||||||
|
return lines.join("\n");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
set_delimiters: function(delimiters) {
|
||||||
|
var dels = delimiters.split(" ");
|
||||||
|
this.otag = this.escape_regex(dels[0]);
|
||||||
|
this.ctag = this.escape_regex(dels[1]);
|
||||||
|
},
|
||||||
|
|
||||||
|
escape_regex: function(text) {
|
||||||
|
// thank you Simon Willison
|
||||||
|
if(!arguments.callee.sRE) {
|
||||||
|
var specials = [
|
||||||
|
'/', '.', '*', '+', '?', '|',
|
||||||
|
'(', ')', '[', ']', '{', '}', '\\'
|
||||||
|
];
|
||||||
|
arguments.callee.sRE = new RegExp(
|
||||||
|
'(\\' + specials.join('|\\') + ')', 'g'
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return text.replace(arguments.callee.sRE, '\\$1');
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
find `name` in current `context`. That is find me a value
|
||||||
|
from the view object
|
||||||
|
*/
|
||||||
|
find: function(name, context) {
|
||||||
|
name = this.trim(name);
|
||||||
|
|
||||||
|
// Checks whether a value is thruthy or false or 0
|
||||||
|
function is_kinda_truthy(bool) {
|
||||||
|
return bool === false || bool === 0 || bool;
|
||||||
|
}
|
||||||
|
|
||||||
|
var value;
|
||||||
|
if(is_kinda_truthy(context[name])) {
|
||||||
|
value = context[name];
|
||||||
|
} else if(is_kinda_truthy(this.context[name])) {
|
||||||
|
value = this.context[name];
|
||||||
|
}
|
||||||
|
|
||||||
|
if(typeof value === "function") {
|
||||||
|
return value.apply(context);
|
||||||
|
}
|
||||||
|
if(value !== undefined) {
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
// silently ignore unkown variables
|
||||||
|
return "";
|
||||||
|
},
|
||||||
|
|
||||||
|
// Utility methods
|
||||||
|
|
||||||
|
/* includes tag */
|
||||||
|
includes: function(needle, haystack) {
|
||||||
|
return haystack.indexOf(this.otag + needle) != -1;
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
Does away with nasty characters
|
||||||
|
*/
|
||||||
|
escape: function(s) {
|
||||||
|
s = String(s === null ? "" : s);
|
||||||
|
return s.replace(/&(?!\w+;)|["<>\\]/g, function(s) {
|
||||||
|
switch(s) {
|
||||||
|
case "&": return "&";
|
||||||
|
case "\\": return "\\\\";
|
||||||
|
case '"': return '\"';
|
||||||
|
case "<": return "<";
|
||||||
|
case ">": return ">";
|
||||||
|
default: return s;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// by @langalex, support for arrays of strings
|
||||||
|
create_context: function(_context) {
|
||||||
|
if(this.is_object(_context)) {
|
||||||
|
return _context;
|
||||||
|
} else {
|
||||||
|
var iterator = ".";
|
||||||
|
if(this.pragmas["IMPLICIT-ITERATOR"]) {
|
||||||
|
iterator = this.pragmas["IMPLICIT-ITERATOR"].iterator;
|
||||||
|
}
|
||||||
|
var ctx = {};
|
||||||
|
ctx[iterator] = _context;
|
||||||
|
return ctx;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
is_object: function(a) {
|
||||||
|
return a && typeof a == "object";
|
||||||
|
},
|
||||||
|
|
||||||
|
is_array: function(a) {
|
||||||
|
return Object.prototype.toString.call(a) === '[object Array]';
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
Gets rid of leading and trailing whitespace
|
||||||
|
*/
|
||||||
|
trim: function(s) {
|
||||||
|
return s.replace(/^\s*|\s*$/g, "");
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
Why, why, why? Because IE. Cry, cry cry.
|
||||||
|
*/
|
||||||
|
map: function(array, fn) {
|
||||||
|
if (typeof array.map == "function") {
|
||||||
|
return array.map(fn);
|
||||||
|
} else {
|
||||||
|
var r = [];
|
||||||
|
var l = array.length;
|
||||||
|
for(var i = 0; i < l; i++) {
|
||||||
|
r.push(fn(array[i]));
|
||||||
|
}
|
||||||
|
return r;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return({
|
||||||
|
name: "mustache.js",
|
||||||
|
version: "0.3.1-dev",
|
||||||
|
|
||||||
|
/*
|
||||||
|
Turns a template and view into HTML
|
||||||
|
*/
|
||||||
|
to_html: function(template, view, partials, send_fun) {
|
||||||
|
var renderer = new Renderer();
|
||||||
|
if(send_fun) {
|
||||||
|
renderer.send = send_fun;
|
||||||
|
}
|
||||||
|
renderer.render(template, view, partials);
|
||||||
|
if(!send_fun) {
|
||||||
|
return renderer.buffer.join("\n");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
escape : function(text) {
|
||||||
|
return new Renderer().escape(text);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}();
|
||||||
|
|
||||||
|
$.mustache = function(template, view, partials) {
|
||||||
|
return Mustache.to_html(template, view, partials);
|
||||||
|
};
|
||||||
|
|
||||||
|
$.mustache.escape = function(text) {
|
||||||
|
return Mustache.escape(text);
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery);
|
Loading…
Reference in New Issue