Skip to content

erp5
erp5
Commit 006fdd96 authored by Romain Courteaud's avatar Romain Courteaud
Browse files
Options

[erp5_web_renderjs_ui] WIP: html5 element gadgets

parent 1f31f7a6
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 2225 additions and 2 deletions
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_appcache.xml
View file @ 006fdd96
......@@ -212,6 +212,12 @@ gadget_erp5_searchfield.js\n
gadget_erp5_sort_editor.html\n
gadget_erp5_sort_editor.js\n
gadget_global.js\n
gadget_html5_element.html\n
gadget_html5_element.js\n
gadget_html5_input.html\n
gadget_html5_input.js\n
gadget_html5_textarea.html\n
gadget_html5_textarea.js\n
gadget_erp5_global.js\n
gadget_jio.html\n
gadget_jio.js\n
......@@ -355,7 +361,7 @@ NETWORK:\n
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>954.17206.22181.11161</string> </value>
<value> <string>954.17323.35854.26743</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -373,7 +379,7 @@ NETWORK:\n
</tuple>
<state>
<tuple>
<float>1475244194.36</float>
<float>1475498938.82</float>
<string>UTC</string>
</tuple>
</state>
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_html5_element_html.html 0 → 100644
View file @ 006fdd96
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>HTML5 Element</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="gadget_html5_element.js" type="text/javascript"></script>
</head>
<body></body>
</html>
\ No newline at end of file
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_html5_element_js.js 0 → 100644
View file @ 006fdd96
/*global window, document, rJS */
/*jslint indent: 2, maxerr: 3 */
(function (window, document, rJS) {
"use strict";
rJS(window)
.setState({
tag: 'div',
text_content: ''
})
.declareMethod('render', function (options) {
var state_dict = {
text_content: options.text_content || "",
tag: options.tag || 'div'
};
return this.changeState(state_dict);
})
.declareMethod('updateDOM', function () {
var element = this.element,
new_element = document.createElement(this.state.tag);
new_element.textContent = this.state.text_content;
// Clear first to DOM, append after to reduce flickering/manip
while (element.firstChild) {
element.removeChild(element.firstChild);
}
element.appendChild(new_element);
});
}(window, document, rJS));
\ No newline at end of file
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_html5_input_html.html 0 → 100644
View file @ 006fdd96
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>HTML5 Input</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="gadget_html5_input.js" type="text/javascript"></script>
</head>
<body><input /></body>
</html>
\ No newline at end of file
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_html5_input_js.js 0 → 100644
View file @ 006fdd96
/*global window, rJS, RSVP */
/*jslint indent: 2, maxerr: 3 */
(function (window, rJS, RSVP) {
"use strict";
rJS(window)
.setState({
editable: false,
value: '',
title: '',
type: 'text',
required: false
})
.declareMethod('render', function (options) {
var state_dict = {
value: options.value || "",
editable: options.editable,
required: options.required,
name: options.name,
type: options.type || 'text',
title: options.title,
focus: options.focus
};
return this.changeState(state_dict);
})
.declareMethod('updateDOM', function () {
var textarea = this.element.querySelector('input');
textarea.value = this.state.value;
textarea.setAttribute('name', this.state.name);
textarea.setAttribute('type', this.state.type);
if (this.state.title) {
textarea.setAttribute('title', this.state.title);
}
if (this.state.required) {
textarea.required = true;
} else {
textarea.required = false;
}
if (this.state.editable) {
textarea.readonly = true;
} else {
textarea.readonly = false;
}
if (this.state.focus === true) {
textarea.autofocus = true;
textarea.focus();
}
})
.declareService(function () {
if (this.state.focus === true) {
this.element.querySelector('input').focus();
}
})
.declareMethod('getContent', function () {
var result = {},
input;
if (this.state.editable) {
input = this.element.querySelector('input');
result[input.getAttribute('name')] = input.value;
}
return result;
})
.declareAcquiredMethod("notifyValid", "notifyValid")
.declareMethod('checkValidity', function () {
var result = this.element.querySelector('input').checkValidity();
if (result) {
return this.notifyValid()
.push(function () {
return result;
});
}
return result;
})
.declareAcquiredMethod("notifyChange", "notifyChange")
.onEvent('change', function () {
return RSVP.all([
this.checkValidity(),
this.notifyChange()
]);
}, false, false)
.onEvent('input', function () {
return RSVP.all([
this.checkValidity(),
this.notifyChange()
]);
}, false, false)
.declareAcquiredMethod("notifyInvalid", "notifyInvalid")
.onEvent('invalid', function (evt) {
// invalid event does not bubble
return this.notifyInvalid(evt.target.validationMessage);
}, true, true);
}(window, rJS, RSVP));
\ No newline at end of file
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_html5_textarea_html.html 0 → 100644
View file @ 006fdd96
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>HTML5 Textarea</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="gadget_html5_textarea.js" type="text/javascript"></script>
</head>
<body><textarea></textarea></body>
</html>
\ No newline at end of file
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_html5_textarea_js.js 0 → 100644
View file @ 006fdd96
/*global window, rJS, RSVP, navigator */
/*jslint indent: 2, maxerr: 3 */
(function (window, rJS, RSVP, navigator) {
"use strict";
function checkChange() {
var gadget = this;
return gadget.changeState({value: gadget.element.querySelector('textarea').value})
.push(function () {
return RSVP.all([
gadget.checkValidity(),
gadget.notifyChange()
]);
});
}
rJS(window)
.setState({
editable: false,
focused: false,
value: ''
})
.declareMethod('render', function (options) {
var state_dict = {
value: options.value,
editable: options.editable,
name: options.name,
title: options.title
};
return this.changeState(state_dict);
})
.declareMethod('updateDOM', function () {
var textarea = this.element.querySelector('textarea');
textarea.value = this.state.value;
textarea.setAttribute('name', this.state.name);
textarea.setAttribute('title', this.state.title);
textarea.setAttribute('wrap', 'off');
if (this.state.required) {
textarea.setAttribute('required', 'required');
} else {
textarea.removeAttribute('required');
}
if (this.state.editable) {
textarea.removeAttribute('readonly');
} else {
textarea.setAttribute('readonly', 'readonly');
}
if (this.state.focused) {
textarea.setAttribute('rows', this.state.value.split('\n').length);
} else {
textarea.setAttribute('rows', 2);
}
})
.declareMethod('getContent', function () {
var result = {},
input;
if (this.state.editable) {
input = this.element.querySelector('textarea');
result[input.getAttribute('name')] = input.value;
}
return result;
})
.declareAcquiredMethod("notifyValid", "notifyValid")
.declareMethod('checkValidity', function () {
var result = this.element.querySelector('textarea').checkValidity();
if (result) {
return this.notifyValid()
.push(function () {
return result;
});
}
return result;
})
.declareAcquiredMethod("notifyChange", "notifyChange")
.onEvent('change', checkChange, false, true)
.onEvent('input', checkChange, false, true)
.declareAcquiredMethod("notifyInvalid", "notifyInvalid")
.onEvent('invalid', function (evt) {
// invalid event does not bubble
return this.notifyInvalid(evt.target.validationMessage);
}, true, true)
.onEvent('focus', function () {
return this.changeState({focused: true, value: this.element.querySelector('textarea').value});
}, true, false)
.onEvent('blur', function () {
return this.changeState({focused: false, value: this.element.querySelector('textarea').value});
}, true, false)
.declareAcquiredMethod("notifySubmit", "notifySubmit")
.onEvent('keydown', function (evt) {
if (evt.keyCode === 83 && (navigator.platform.match("Mac") ? evt.metaKey : evt.ctrlKey)) {
evt.preventDefault();
return this.notifySubmit();
}
}, false, false);
}(window, rJS, RSVP, navigator));
\ No newline at end of file
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7