Commit 17995f8e authored by Romain Courteaud's avatar Romain Courteaud

[erp5_web_renderjs_ui] Autoresize textarea and support keyboard shortcut to save

parent 8b35f466
...@@ -368,7 +368,6 @@ select:-moz-focusring { ...@@ -368,7 +368,6 @@ select:-moz-focusring {
color: transparent; color: transparent;
} }
textarea { textarea {
height: 15em;
width: 100%; width: 100%;
margin: 0; margin: 0;
} }
......
...@@ -236,7 +236,7 @@ ...@@ -236,7 +236,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>952.57378.47936.47257</string> </value> <value> <string>954.17329.52209.1706</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -254,7 +254,7 @@ ...@@ -254,7 +254,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1469798919.15</float> <float>1475500541.53</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -234,7 +234,7 @@ ...@@ -234,7 +234,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>948.41883.489.3805</string> </value> <value> <string>954.3930.47193.19268</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -252,7 +252,7 @@ ...@@ -252,7 +252,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1453477484.04</float> <float>1475500198.61</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
/*global window, rJS, document, RSVP, loopEventListener */ /*global window, rJS */
/*jslint indent: 2, maxerr: 3 */ /*jslint indent: 2, maxerr: 3 */
(function (window, rJS, document, RSVP, loopEventListener) { (function (window, rJS) {
"use strict"; "use strict";
rJS(window) rJS(window)
.ready(function (gadget) { .setState({
gadget.property_dict = { tag: 'pre'
textarea_deferred: RSVP.defer()
};
return gadget.getElement()
.push(function (element) {
gadget.property_dict.element = element;
});
}) })
.declareMethod('render', function (options) { .declareMethod('render', function (options) {
var new_element, var field_json = options.field_json || {},
field_json = options.field_json || {}, state_dict = {
value = field_json.value || field_json.default || ""; value: field_json.value || field_json.default || "",
editable: field_json.editable,
this.property_dict.editable = (field_json.editable === 1); name: field_json.key,
this.property_dict.name = field_json.key; title: field_json.title
if (this.property_dict.editable) { };
new_element = document.createElement('textarea'); state_dict.text_content = state_dict.value;
return this.changeState(state_dict);
})
new_element.value = value; .declareMethod('updateDOM', function () {
new_element.setAttribute('name', this.property_dict.name); var element = this.element,
new_element.setAttribute('title', field_json.title); gadget = this,
if (field_json.required === 1) { url;
new_element.setAttribute('required', 'required'); if (gadget.state.editable) {
} url = 'gadget_html5_textarea.html';
/*
if (field_json.editable !== 1) {
textarea.setAttribute('readonly', 'readonly');
textarea.className += "ui-state-readonly";
// textarea.setAttribute('disabled', 'disabled');
}
*/
this.property_dict.textarea_deferred.resolve(new_element);
} else { } else {
new_element = document.createElement('pre'); url = 'gadget_html5_element.html';
new_element.setAttribute("class", "ui-content-non-editable");
new_element.textContent = value;
} }
this.property_dict.element.appendChild(new_element); return this.declareGadget(url, {scope: 'sub'})
.push(function (input) {
// Clear first to DOM, append after to reduce flickering/manip
while (element.firstChild) {
element.removeChild(element.firstChild);
}
element.appendChild(input.element);
return input.render(gadget.state);
});
}) })
.declareMethod('getContent', function () { .declareMethod('getContent', function () {
var field, if (this.state.editable) {
value, return this.getDeclaredGadget('sub')
result = {}; .push(function (gadget) {
if (this.property_dict.editable) { return gadget.getContent();
field = this.property_dict.element.querySelector('textarea'); });
value = field.value;
} else {
field = this.property_dict.element.querySelector('pre');
value = field.textContent;
} }
result[this.property_dict.name] = value; return {};
return result;
}); });
}(window, rJS, document, RSVP, loopEventListener)); }(window, rJS));
\ No newline at end of file \ No newline at end of file
...@@ -63,6 +63,12 @@ ...@@ -63,6 +63,12 @@
</tuple> </tuple>
</value> </value>
</item> </item>
<item>
<key> <string>categories</string> </key>
<value>
<tuple/>
</value>
</item>
<item> <item>
<key> <string>content_md5</string> </key> <key> <string>content_md5</string> </key>
<value> <value>
...@@ -230,7 +236,7 @@ ...@@ -230,7 +236,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>952.10031.38084.59682</string> </value> <value> <string>954.15897.25014.42086</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -248,7 +254,7 @@ ...@@ -248,7 +254,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1467032882.44</float> <float>1475163059.77</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -431,7 +431,6 @@ select { ...@@ -431,7 +431,6 @@ select {
} }
textarea { textarea {
height: 15em;
width: 100%; width: 100%;
margin: 0; margin: 0;
// font-family: @monospace; // font-family: @monospace;
......
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