Commit cb1a5334 authored by Romain Courteaud's avatar Romain Courteaud

[erp5_web_renderjs_ui] Add a search input in the panel

parent 322d3223
......@@ -108,7 +108,7 @@
<value> <string encoding="cdata"><![CDATA[
CACHE MANIFEST\n
# generated on Thu, 07 Feb 2017 15:00:00 GMT\n
# generated on Wed, 01 Mar 2017 15:00:00 GMT\n
# XXX + fonts\n
# images/ajax-loader.gif\n
CACHE:\n
......@@ -369,7 +369,7 @@ NETWORK:\n
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>957.20616.7427.7406</string> </value>
<value> <string>957.46857.4036.21879</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -387,7 +387,7 @@ NETWORK:\n
</tuple>
<state>
<tuple>
<float>1487069372.52</float>
<float>1488385456.73</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -484,6 +484,16 @@ div[data-gadget-scope='panel'] div[data-role="header"] a::before {
display: none;
}
}
div[data-gadget-scope='panel'] div[data-gadget-scope='erp5_searchfield'] {
padding: 3pt 12pt;
}
div[data-gadget-scope='panel'] div[data-gadget-scope='erp5_searchfield'] button {
color: #FFFFFF;
}
div[data-gadget-scope='panel'] div[data-gadget-scope='erp5_searchfield'] input[type="search"] {
color: #FFFFFF !important;
background-color: #777777 !important;
}
div[data-gadget-scope='panel'] img {
text-align: left;
height: 100%;
......
......@@ -242,7 +242,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>957.40793.17925.62225</string> </value>
<value> <string>957.46743.737.30583</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -260,7 +260,7 @@
</tuple>
<state>
<tuple>
<float>1488280785.24</float>
<float>1488377833.8</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -26,6 +26,15 @@
<script id="panel-template-body" type="text/x-handlebars-template">
<div class="ui-content">
<form class="dialog_form">
<button type="submit" class="ui-btn ui-btn-b ui-btn-inline
ui-icon-action ui-btn-icon-right ui-screen-hidden">Submit</button>
<div data-gadget-url="gadget_erp5_searchfield.html"
data-gadget-scope="erp5_searchfield"
data-gadget-sandbox="public"></div>
</form>
<ul data-role="listview" class="ui-listview" data-enhanced="true">
<li class="ui-first-child"><a href="#" class="ui-btn ui-btn-icon-left ui-icon-home" data-i18n="Home">Home</a></li>
<li><a href="{{module_href}}" class="ui-btn ui-btn-icon-left ui-icon-puzzle-piece" data-i18n="Modules" accesskey="m">Modules</a></li>
......
......@@ -234,7 +234,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>957.39718.21180.26828</string> </value>
<value> <string>957.46848.56526.7116</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -252,7 +252,7 @@
</tuple>
<state>
<tuple>
<float>1488215553.05</float>
<float>1488384141.54</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -29,6 +29,7 @@
//////////////////////////////////////////////
.declareAcquiredMethod("getUrlFor", "getUrlFor")
.declareAcquiredMethod("translateHtml", "translateHtml")
.declareAcquiredMethod("redirect", "redirect")
/////////////////////////////////////////////////////////////////
// declared methods
......@@ -73,7 +74,8 @@
.onStateChange(function (modification_dict) {
var context = this,
gadget = this,
queue = new RSVP.Queue();
queue = new RSVP.Queue(),
tmp_element;
if (modification_dict.hasOwnProperty("visible")) {
if (this.state.visible) {
......@@ -114,7 +116,20 @@
);
})
.push(function (my_translated_or_plain_html) {
context.element.querySelector("div").innerHTML = my_translated_or_plain_html;
tmp_element = document.createElement('div');
tmp_element.innerHTML = my_translated_or_plain_html;
return context.declareGadget('gadget_erp5_searchfield.html', {
scope: "erp5_searchfield",
element: tmp_element.querySelector('[data-gadget-scope="erp5_searchfield"]')
});
})
.push(function (search_gadget) {
return search_gadget.render({
focus: false
});
})
.push(function () {
context.element.querySelector("div").appendChild(tmp_element);
return context.listenResize();
});
}
......@@ -223,6 +238,40 @@
event.initEvent('resize', true, true);
window.dispatchEvent(event);
return result;
});
})
.allowPublicAcquisition('notifyChange', function () {
// Typing a search query should not modify the header status
return;
})
.onEvent('submit', function () {
var gadget = this;
return gadget.getDeclaredGadget("erp5_searchfield")
.push(function (search_gadget) {
return search_gadget.getContent();
})
.push(function (data) {
var options = {
page: "search"
};
if (data.search) {
options.extended_search = data.search;
}
// Remove focus from the search field
document.activeElement.blur();
return gadget.redirect({command: 'display', options: options});
});
}, false, true)
.onEvent('blur', function (evt) {
// XXX Horrible hack to clear the search when focus is lost
// This does not follow renderJS design, as a gadget should not touch
// another gadget content
if (evt.target.type === 'search') {
evt.target.value = "";
}
}, true, false);
}(window, document, rJS, Handlebars, RSVP, Node, loopEventListener));
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>957.41111.56434.58897</string> </value>
<value> <string>957.46809.34243.17971</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1488299408.27</float>
<float>1488381715.57</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -9,7 +9,8 @@
/////////////////////////////////////////////////////////////////
.declareMethod('render', function (options) {
var state_dict = {
extended_search: options.extended_search || ""
extended_search: options.extended_search || "",
focus: options.focus
};
return this.changeState(state_dict);
......@@ -20,8 +21,13 @@
return gadget.getDeclaredGadget('input')
.push(function (input_gadget) {
var focus = false;
if (!gadget.state.extended_search) {
focus = true;
var focus;
if (gadget.state.focus === undefined) {
if (gadget.state.extended_search) {
focus = false;
} else {
focus = true;
}
}
return input_gadget.render({
type: "search",
......
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>954.17336.1268.55074</string> </value>
<value> <string>956.58742.58866.48708</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1476194269.08</float>
<float>1488381059.63</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -576,6 +576,17 @@ div[data-gadget-scope='panel'] {
}
}
div[data-gadget-scope='erp5_searchfield'] {
padding: @half-margin-size @double-margin-size;
button {
color: @white;
}
input[type="search"] {
color: @white !important;
background-color: @grey !important;
}
}
img {
text-align: left;
height: 100%;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment