luci-base: rework filebrowser initialization

Do not call cbi_init() from the browser field template but lazily initialize
the field, like it is being done for all other widgets as well.

Fixes: #2398
Signed-off-by: Jo-Philipp Wich <jo@mein.io>

diff --git a/modules/luci-base/htdocs/luci-static/resources/cbi.js b/modules/luci-base/htdocs/luci-static/resources/cbi.js
index 6feb9fb35158a4d0d706d8541ffeb6901e43fb75..f93c9351a784d30799074172acf842d1ba287e12 100644 (file)
--- a/modules/luci-base/htdocs/luci-static/resources/cbi.js
+++ b/modules/luci-base/htdocs/luci-static/resources/cbi.js
@@ -808,9 +808,8 @@ function cbi_init() {
                                   node.getAttribute('data-type'));
        }
 
-       document.querySelectorAll('.cbi-dropdown').forEach(function(s) {
-               cbi_dropdown_init(s);
-       });
+       document.querySelectorAll('.cbi-dropdown').forEach(cbi_dropdown_init);
+       document.querySelectorAll('[data-browser]').forEach(cbi_browser_init);
 
        document.querySelectorAll('.cbi-tooltip:not(:empty)').forEach(function(s) {
                s.parentNode.classList.add('cbi-tooltip-container');
@@ -872,30 +871,26 @@ function cbi_combobox_init(id, values, def, man) {
 }
 
 function cbi_filebrowser(id, defpath) {
-       var field   = document.getElementById(id);
+       var field   = L.dom.elem(id) ? id : document.getElementById(id);
        var browser = window.open(
-               cbi_strings.path.browser + ( field.value || defpath || '' ) + '?field=' + id,
+               cbi_strings.path.browser + (field.value || defpath || '') + '?field=' + field.id,
                "luci_filebrowser", "width=300,height=400,left=100,top=200,scrollbars=yes"
        );
 
        browser.focus();
 }
 
-function cbi_browser_init(id, resource, defpath)
+function cbi_browser_init(field)
 {
-       function cbi_browser_btnclick(e) {
-               cbi_filebrowser(id, defpath);
-               return false;
-       }
-
-       var field = document.getElementById(id);
-
-       var btn = document.createElement('img');
-       btn.className = 'cbi-image-button';
-       btn.src = (resource || cbi_strings.path.resource) + '/cbi/folder.gif';
-       field.parentNode.insertBefore(btn, field.nextSibling);
-
-       btn.addEventListener('click', cbi_browser_btnclick);
+       field.parentNode.insertBefore(
+               E('img', {
+                       'src': L.resource('cbi/folder.gif'),
+                       'class': 'cbi-image-button',
+                       'click': function(ev) {
+                               cbi_filebrowser(field, field.getAttribute('data-browser'));
+                               ev.preventDefault();
+                       }
+               }), field.nextSibling);
 }
 
 CBIDynamicList = {

diff --git a/modules/luci-base/luasrc/view/cbi/browser.htm b/modules/luci-base/luasrc/view/cbi/browser.htm
index 362c40bec197d28d25501997a6df5dc3f7bd9bd8..eb47ffafe6944a548b5152d1c0175f7edbb49143 100644 (file)
--- a/modules/luci-base/luasrc/view/cbi/browser.htm
+++ b/modules/luci-base/luasrc/view/cbi/browser.htm
@@ -1,8 +1,10 @@
-<% local v = self:cfgvalue(section) or self.default -%>
 <%+cbi/valueheader%>
-       <input class="cbi-input-text" type="text"<%= attr("value", v) .. attr("name", cbid) .. attr("id", cbid) %> />
-       <script type="text/javascript">
-cbi_init()
-cbi_browser_init('<%=cbid%>', '<%=resource%>', '<%=url('admin/filebrowser')%>'<%=self.default_path and ", '"..self.default_path.."'"%>);
-       </script>
+
+<input class="cbi-input-text" type="text"<%=
+       attr("id", cbid) ..
+       attr("name", cbid) ..
+       attr("value", self:cfgvalue(section) or self.default) ..
+       attr("data-browser", self.default_path or "")
+%> />
+
 <%+cbi/valuefooter%>