From c3f8cad09df7ee135936d05143de34189f09819f Mon Sep 17 00:00:00 2001 From: Sven Franck <sven.franck@nexedi.com> Date: Tue, 21 Oct 2014 09:33:27 +0000 Subject: [PATCH] erp5_web_renderjs_ui: converted search field into handlebars template --- .../rjs_gadget_erp5_searchfield_html.xml | 39 ++++++++++--------- .../rjs_gadget_erp5_searchfield_js.xml | 38 +++++++++++++++--- 2 files changed, 52 insertions(+), 25 deletions(-) diff --git a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_searchfield_html.xml b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_searchfield_html.xml index e90e234445..d66f5bd7c8 100644 --- a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_searchfield_html.xml +++ b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_searchfield_html.xml @@ -115,29 +115,30 @@ <!-- renderjs -->\n <script src="RSVP.js"></script>\n <script src="renderjs.js"></script>\n - <!-- <script src="handlebars.js"></script> -->\n + <script src="handlebars.js"></script>\n \n <!-- custom script -->\n <script src="gadget_erp5_searchfield.js"></script>\n \n - </head>\n - <body>\n -\n - <form class="save_form document_form">\n - <div class="center">\n - <div class="ui-field-contain">\n - <!-- XXX needs a theme set for now -->\n - <div class="ui-input-text ui-body-c ui-corner-all ui-shadow-inset ui-input-has-clear">\n - <input type="text" data-enhanced="true" value="" name="search" />\n - <div class="ui-btn ui-input-clear ui-input-btn ui-corner-all ui-icon-search ui-btn-icon-notext">\n - Submit<input data-enhanced="true" type="submit" value="Submit">\n + <!-- XXX widget-status is bad! -->\n + <script id="panel-template" type="text/x-handlebars-template">\n + <form class="save_form document_form">\n + <div class="center">\n + <div class="ui-field-contain">\n + <div class="ui-input-text ui-body-{{widget_theme}} ui-corner-all ui-shadow-inset ui-input-has-clear {{widget_status_class}}">\n + <input type="text" data-enhanced="true" value="{{widget_value}}" name="search" {{widget_status_attribute}} />\n + <div class="ui-btn ui-input-clear ui-input-btn ui-corner-all ui-icon-search ui-btn-icon-notext">\n + Submit<input data-enhanced="true" type="submit" value="Submit" {{widget_status_attribute}} />\n + </div>\n + </div>\n + <a href="#" class="ui-btn ui-btn-{{widget_theme}} ui-btn-icon-notext ui-icon-filter ui-override-theme ui-disabled">Filters</a>\n </div>\n </div>\n - <!-- XXX needs a theme set for now -->\n - <a href="#" class="ui-btn ui-btn-c ui-btn-icon-notext ui-icon-filter ui-override-theme">Filters</a>\n - </div>\n - </div>\n - </form>\n + </form>\n + </script>\n + \n + </head>\n + <body>\n </body>\n </html> @@ -276,7 +277,7 @@ </item> <item> <key> <string>serial</string> </key> - <value> <string>938.24471.49375.27665</string> </value> + <value> <string>938.25792.30699.44322</string> </value> </item> <item> <key> <string>state</string> </key> @@ -294,7 +295,7 @@ </tuple> <state> <tuple> - <float>1413799940.71</float> + <float>1413879096.17</float> <string>GMT</string> </tuple> </state> diff --git a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_searchfield_js.xml b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_searchfield_js.xml index beef725c79..43903e17b8 100644 --- a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_searchfield_js.xml +++ b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_searchfield_js.xml @@ -104,7 +104,17 @@ (function (window, rJS, RSVP, loopEventListener) {\n "use strict";\n \n - rJS(window)\n + /////////////////////////////////////////////////////////////////\n + // Handlebars\n + /////////////////////////////////////////////////////////////////\n + // Precompile the templates while loading the first gadget instance\n + var gadget_klass = rJS(window),\n + source = gadget_klass.__template_element\n + .getElementById("panel-template")\n + .innerHTML,\n + panel_template = Handlebars.compile(source);\n +\n + gadget_klass\n /////////////////////////////////////////////////////////////////\n // ready\n /////////////////////////////////////////////////////////////////\n @@ -126,8 +136,24 @@ /////////////////////////////////////////////////////////////////\n // declared methods\n /////////////////////////////////////////////////////////////////\n - .declareMethod(\'render\', function (options) {\n - this.props.element.querySelector("input").value = options.extended_search || "";\n + .declareMethod(\'render\', function (option_dict) {\n + var append_class,\n + append_attribute,\n + placeholder = "",\n + is_disabled = option_dict.disabled,\n + search_gadget = this;\n +\n + if (is_disabled) {\n + append_class = " ui-disabled";\n + append_attribute = \' disabled="disabled\';\n + }\n +\n + search_gadget.props.element.innerHTML = panel_template({\n + widget_value: option_dict.extended_search || placeholder,\n + widget_theme: option_dict.theme || "c",\n + widget_status_attribute: append_attribute || placeholder,\n + widget_status_class: append_class || placeholder\n + });\n })\n \n .declareMethod(\'getContent\', function () {\n @@ -286,7 +312,7 @@ </item> <item> <key> <string>actor</string> </key> - <value> <string>romain</string> </value> + <value> <string>sven</string> </value> </item> <item> <key> <string>comment</string> </key> @@ -300,7 +326,7 @@ </item> <item> <key> <string>serial</string> </key> - <value> <string>937.42848.57946.4044</string> </value> + <value> <string>938.24816.20339.61866</string> </value> </item> <item> <key> <string>state</string> </key> @@ -318,7 +344,7 @@ </tuple> <state> <tuple> - <float>1411056079.35</float> + <float>1413819887.51</float> <string>GMT</string> </tuple> </state> -- 2.30.9