diff options
author | Kaarle Ritvanen <kaarle.ritvanen@datakunkku.fi> | 2013-05-20 01:08:25 +0300 |
---|---|---|
committer | Kaarle Ritvanen <kaarle.ritvanen@datakunkku.fi> | 2013-05-20 01:08:25 +0300 |
commit | 1480d39187e4552ea0f71c94c90638a29777a663 (patch) | |
tree | e1598b6322cee0295e4f2b7ab4174dfe06127b4e /web | |
parent | 50fe38acfb7a67758c080aa9d96c169fc29f112e (diff) | |
download | aconf-1480d39187e4552ea0f71c94c90638a29777a663.tar.bz2 aconf-1480d39187e4552ea0f71c94c90638a29777a663.tar.xz |
web client: top and 2nd level menus
Diffstat (limited to 'web')
-rw-r--r-- | web/client.html | 2 | ||||
-rw-r--r-- | web/client.js | 127 |
2 files changed, 119 insertions, 10 deletions
diff --git a/web/client.html b/web/client.html index 55ff445..9433de7 100644 --- a/web/client.html +++ b/web/client.html @@ -15,6 +15,8 @@ </head> <body> <p id="status"></p> + <ul id="modules"></ul> + <ul id="tabs"></ul> <div id="content"></div> </body> </html> diff --git a/web/client.js b/web/client.js index 668e4a9..f5a50c3 100644 --- a/web/client.js +++ b/web/client.js @@ -122,17 +122,96 @@ $(function() { function render() { var path = $.param.fragment(); - objRequest(path).done(function(data) { - var content = $("#content"); + function isTreeNode(meta) { + return _.contains(["collection", "model", "set"], meta.type); + } + + function split(path) { + var res = []; + while (path && path != "/") { + var comp = path.match(/^\/([^\\\/]|\\.)+/)[0]; + res.push(comp.substring(1)); + path = path.substring(comp.length); + } + return res; + } + + function getStatus(path, data) { + if (path == "/") path = ""; + + var res = {}; + _.map(data.data, function(path) { res[path] = null; }); + + function scan(objs, label) { + var level = split(path).length; + _.map(_.filter(_.keys(objs), function(obj) { + return !obj.indexOf(path + "/"); + }), function(obj) { + res[path + "/" + split(obj)[level]] = label; + }); + } + + scan(changed, "changed"); + scan(invalid, "invalid"); + + return res; + } + + function setStatus(el, status) { + if (status) el.text("[" + status + "]"); + else el.empty(); + } + + function renderMenu(target, path, current, selectFirst) { + var def = $.Deferred(); + + objRequest(path).done(function(data) { + if (data.meta.type != "model" || _.filter( + data.meta.fields, function(field) { + return !isTreeNode(field); + } + ).length) { + def.reject(data); + return; + } + + var status = getStatus(path, data); + var first = _.values(data.data)[0]; + if (current) + status[ + (path == "/" ? "" : path) + "/" + current + ] = "current"; + else if (selectFirst) status[first] = "current"; + + _.each(data.data, function(path) { + var el = $("<li>"); + el.append(Path.format(path)); + + var statusEl = $("<div>"); + setStatus(statusEl, status[path]); + + el.append(statusEl); + target.append(el); + }); + + def.resolve(first); + }); + + return def; + } + + + var content = $("#content").empty(); + + function renderContent(path, data) { content.html($("<h1>").text(path)); - if (!_.contains([ - "collection", "model", "set" - ], data.meta.type)) { + if (!isTreeNode(data.meta)) { content.append(JSON.stringify(data)); return; } + var status = getStatus(path, data); var table = $("<table>"); function renderField( @@ -149,9 +228,12 @@ $(function() { var td = $("<td>"); + var statusEl = $("<div>"); + setStatus(statusEl, status[path]); + td.append(statusEl); + var msg = $("<div>"); - if (path in changed) msg.text("[changed]"); - td.html(msg); + td.append(msg); if (meta.widget in widgets) { var widget = widgets[meta.widget]; @@ -239,8 +321,11 @@ $(function() { }).click(abortTxn)); task.done(function() { - if (path in changed) msg.text("[changed]"); - else msg.empty(); + msg.empty(); + setStatus( + statusEl, + path in changed ? "changed" : null + ); delete invalid[path]; if (!(_.size(invalid))) @@ -248,6 +333,7 @@ $(function() { }).fail(function(xhr) { showError(msg, "Error", xhr); + setStatus(statusEl, "invalid"); }); }); @@ -290,7 +376,28 @@ $(function() { }); content.append(table); - }); + } + + function renderObj(path) { + objRequest(path).done(function(data) { + renderContent(path, data); + }); + } + + + var comps = split(path); + renderMenu($("#modules").empty(), "/", comps[0], false); + var tabs = $("#tabs").empty(); + + if (path == "/") return; + var topLevel = comps.length == 1; + + renderMenu(tabs, "/" + comps[0], comps[1], true) + .done(function(first) { renderObj(topLevel ? first : path); }) + .fail(function(data) { + if (topLevel) renderContent(path, data) + else renderObj(path); + }); } startTxn().done(function() { |