From 127c36f364e856caef9f2de24c836a6cbac4d9c7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adolfo=20G=C3=B3mez?= Date: Thu, 21 Nov 2013 11:01:30 +0000 Subject: [PATCH] * Added template "preload" ability * Added caching templates as "compiled" templates * moved table description panel to template --- .../adm/js/{templates.js => api-templates.js} | 46 +++++++---- server/src/uds/static/adm/js/gui-elements.js | 10 ++- server/src/uds/static/adm/js/gui-fields.js | 62 +++++++------- server/src/uds/static/adm/js/gui.js | 21 ++--- server/src/uds/templates/uds/admin/index.html | 14 ++-- .../uds/templates/uds/admin/tmpl/table.html | 16 ++++ .../uds/templates/uds/admin/tmpl/test.html | 82 +------------------ server/src/uds/templatetags/REST.py | 13 ++- 8 files changed, 115 insertions(+), 149 deletions(-) rename server/src/uds/static/adm/js/{templates.js => api-templates.js} (60%) create mode 100644 server/src/uds/templates/uds/admin/tmpl/table.html diff --git a/server/src/uds/static/adm/js/templates.js b/server/src/uds/static/adm/js/api-templates.js similarity index 60% rename from server/src/uds/static/adm/js/templates.js rename to server/src/uds/static/adm/js/api-templates.js index 7b445e797..8cada6096 100644 --- a/server/src/uds/static/adm/js/templates.js +++ b/server/src/uds/static/adm/js/api-templates.js @@ -3,33 +3,37 @@ // Inserted into api // for the admin app // ------------------------------- -(function(templates, $) { - templates.cache = {}; // Will cache templates locally. If name contains +(function(api, $) { + api.templates = {}; + + api.templates.cache = new api.cache('tmpls'); // Will cache templates locally. If name contains // '?', data will not be cached and always // re-requested. We do not care about lang, because page will reload on language change - templates.get = function(name, success_fnc) { + api.templates.get = function(name, success_fnc) { var $this = this; + success_fnc = success_fnc || function(){}; api.doLog('Getting tempkate ' + name); if (name.indexOf('?') == -1) { - if ($this.cache[name] !== undefined) { - if (success_fnc !== undefined) { - success_fnc($this.cache[name]); - } + if ($this.cache.get(name) ) { + success_fnc($this.cache.get(name)); + return; + // Let's check if a "preloaded template" exists + } else if( document.getElementById('tmpl_' + name) ) { + success_fnc('tmpl_' + name); return; } } $.ajax({ - url : '/adm/tmpl/' + name, + url : api.template_url + name, type : "GET", dataType : "text", success : function(data) { - $this.cache[name] = data; + var cachedId = name; + $this.cache.put('_' + cachedId, $this.evaluate(data)); + $this.cache.put(name, cachedId); api.doLog('Success getting template "' + name + '".'); api.doLog('Received: ' + data); - if (success_fnc !== undefined) { - api.doLog('Executing success method'); - success_fnc(data); - } + success_fnc(cachedId); }, fail: function( jqXHR, textStatus, errorThrown ) { api.doLog(jqXHR); @@ -41,10 +45,20 @@ // Simple JavaScript Templating // Based on John Resig - http://ejohn.org/ - MIT Licensed - templates.evaluate = function tmpl(str, data) { + api.templates.evaluate = function (str, data) { // Figure out if we're getting a template, or if we need to // load the template - and be sure to cache the result. - var fn = + var cached; + if( !/\W/.test(str) ) { + cached = this.cache.get('_'+str); + if( cached === undefined ) { + cached = api.templates.evaluate(document.getElementById(str).innerHTML); + this.cache.put('_'+str, cached); + } + + } + // If cached, get cached first + var fn = cached || // Generate a reusable function that will serve as a template // generator (and which will be cached). new Function("obj", "var p=[],print=function(){p.push.apply(p,arguments);};" + @@ -60,4 +74,4 @@ // Provide some basic currying to the user return data ? fn(data) : fn; }; -}(api.templates = api.templates || {}, jQuery)); +}(window.api = window.api || {}, jQuery)); diff --git a/server/src/uds/static/adm/js/gui-elements.js b/server/src/uds/static/adm/js/gui-elements.js index 36dba8448..1dc8b1a08 100644 --- a/server/src/uds/static/adm/js/gui-elements.js +++ b/server/src/uds/static/adm/js/gui-elements.js @@ -34,10 +34,12 @@ gui.providers.link = function(event) { var tableId = gui.providers.table({ rowSelect : 'multi', - rowSelectFnc : function(data) { - gui.doLog(data); - gui.doLog(this); - gui.doLog(this.fnGetSelectedData()); + onEdit: function(value, event, table) { + gui.providers.rest.gui(value.type, { + success: function(data){ + gui.fields(data); + }, + }); }, buttons : [ 'edit', 'delete', 'xls' ], }); diff --git a/server/src/uds/static/adm/js/gui-fields.js b/server/src/uds/static/adm/js/gui-fields.js index e897dac2d..66c91ee88 100644 --- a/server/src/uds/static/adm/js/gui-fields.js +++ b/server/src/uds/static/adm/js/gui-fields.js @@ -1,42 +1,44 @@ /* jshint strict: true */ (function(gui, $, undefined) { "use strict"; - + // Returns a form that will manage a gui description (new or edit) gui.fields = function(item_description) { $.each(item_description, function(index, field){ gui.doLog(field); }); }; + + gui.fields.config = { + text: { + css: 'form-control' + + }, + textbox: { + css: 'form-control' + }, + numeric: { + css: 'form-control' + }, + password: { + css: 'form-control' + }, + hidden: { + css: '' + }, + choice: { + css: '' + }, + multichoice: { + css: '' + }, + editlist: { + css: '' + }, + checkbox: { + css: 'form-control' + }, + }; }(window.gui = window.gui || {}, jQuery)); -gui.fields.options = { - text: { - css: 'form-control' - }, - textbox: { - - }, - numeric: { - css: 'form-control' - }, - password: { - css: 'form-control' - }, - hidden: { - css: '' - }, - choice: { - css: '' - }, - multichoice: { - css: '' - }, - editlist: { - css: '' - }, - checkbox: { - css: 'form-control' - }, -}; \ No newline at end of file diff --git a/server/src/uds/static/adm/js/gui.js b/server/src/uds/static/adm/js/gui.js index 5ff77a769..19cad9e68 100644 --- a/server/src/uds/static/adm/js/gui.js +++ b/server/src/uds/static/adm/js/gui.js @@ -9,7 +9,6 @@ } catch (e) { // nothing can be logged } - } }; @@ -59,20 +58,16 @@ gui.table = function(title, table_id, options) { options = options || {}; var size = options.size || 12; - var icon = options.icon || 'table'; var panelId = 'panel-' + table_id; return { - text: '
' + - '
' + - '

' + title + - ' ' + - ' ' + - ' ' + - '

' + - '
' + - '
', + text: api.templates.evaluate('tmpl_table', { + panelId: panelId, + icon: options.icon || 'table', + size: options.size || 12, + title: title, + table_id: table_id + }), panelId: panelId, refreshSelector: '#' + panelId + ' span.fa-refresh' }; @@ -350,7 +345,7 @@ GuiElement.prototype = { if (options.buttons) { var clickHandlerFor = function(handler, action) { - var handleFnc = handler || function(val, action, tbl, tbltools) {gui.doLog('Default handler called for ' + action + ': ' + JSON.stringify(val));}; + var handleFnc = handler || function(val, action, tbl) {gui.doLog('Default handler called for ' + action + ': ' + JSON.stringify(val));}; return function(btn) { var tbl = $('#' + tableId).dataTable(); var val = this.fnGetSelectedData()[0]; diff --git a/server/src/uds/templates/uds/admin/index.html b/server/src/uds/templates/uds/admin/index.html index a09b38e6b..16a566a70 100644 --- a/server/src/uds/templates/uds/admin/index.html +++ b/server/src/uds/templates/uds/admin/index.html @@ -65,6 +65,7 @@ api.token = "{% auth_token %}"; api.auth_header = "{% auth_token_header %}"; api.base_url = "{% url 'REST' '' %}"; + api.template_url = "{% url 'uds.admin.views.tmpl' '' %}"; api.img_url = "{% get_static_prefix %}adm/img/"; api.url_for = function(path) { @@ -81,13 +82,11 @@ - + - - @@ -96,13 +95,16 @@ - - {% block js %}{% endblock %} + + {% js_template_path 'uds/admin/tmpl' %} + {% js_template 'dashboard' %} + {% js_template 'authenticators' %} + {% js_template 'table' %} \ No newline at end of file diff --git a/server/src/uds/templates/uds/admin/tmpl/table.html b/server/src/uds/templates/uds/admin/tmpl/table.html new file mode 100644 index 000000000..1872ea290 --- /dev/null +++ b/server/src/uds/templates/uds/admin/tmpl/table.html @@ -0,0 +1,16 @@ +
+
+

<%= title %> + + + +

+
+
+ +
+
+
diff --git a/server/src/uds/templates/uds/admin/tmpl/test.html b/server/src/uds/templates/uds/admin/tmpl/test.html index a33f4c8fb..90f20ff26 100644 --- a/server/src/uds/templates/uds/admin/tmpl/test.html +++ b/server/src/uds/templates/uds/admin/tmpl/test.html @@ -1,79 +1,3 @@ - - - - - Darl McBride - Bill Gates - 2007-03-15T23:04:04Z - SCO Group, Inc. - 11.8036 - - - 6795 - 8460 - 120 - 15 - False - False - - - - - - - - - - Texto en celda A1 - - - - - Texto en negrita en celda A2 - - - - - 43 - - - - - 21.5 - - -
- - - - 600 - 600 - - - - - 3 - 5 - 1 - - - False - False - -
-
+
+

pepito

+
\ No newline at end of file diff --git a/server/src/uds/templatetags/REST.py b/server/src/uds/templatetags/REST.py index 6ff93941f..862bc6570 100644 --- a/server/src/uds/templatetags/REST.py +++ b/server/src/uds/templatetags/REST.py @@ -51,4 +51,15 @@ def auth_token(context): @register.simple_tag(name='auth_token_header') def auth_token_header(): - return AUTH_TOKEN_HEADER \ No newline at end of file + return AUTH_TOKEN_HEADER + +@register.simple_tag(name='js_template_path', takes_context=True) +def js_template_path(context, path): + context['template_path'] = path + return '' + +@register.simple_tag(name='js_template', takes_context=True) +def js_template(context, template_name, template_id = None): + template_id = template_id or 'tmpl_' + template_name + tmpl = template.loader.get_template(context['template_path'] + '/' + template_name + '.html') + return ''