Commit 3bd5a1cc authored by Romain Courteaud's avatar Romain Courteaud

[erp5_web_renderjs_ui] Display portal_status_message notification

parent ef1100d9
...@@ -108,7 +108,7 @@ ...@@ -108,7 +108,7 @@
<value> <string encoding="cdata"><![CDATA[ <value> <string encoding="cdata"><![CDATA[
CACHE MANIFEST\n CACHE MANIFEST\n
# generated on Thu, 01 Dec 2016 15:00:00 GMT\n # generated on Thu, 20 Dec 2016 15:00:00 GMT XXX\n
# XXX + fonts\n # XXX + fonts\n
# images/ajax-loader.gif\n # images/ajax-loader.gif\n
CACHE:\n CACHE:\n
...@@ -171,6 +171,8 @@ gadget_erp5_jio.html\n ...@@ -171,6 +171,8 @@ gadget_erp5_jio.html\n
gadget_erp5_jio.js\n gadget_erp5_jio.js\n
gadget_erp5_label_field.html\n gadget_erp5_label_field.html\n
gadget_erp5_label_field.js\n gadget_erp5_label_field.js\n
gadget_erp5_notification.html\n
gadget_erp5_notification.js\n
gadget_erp5_page_action.html\n gadget_erp5_page_action.html\n
gadget_erp5_page_action.js\n gadget_erp5_page_action.js\n
gadget_erp5_page_form.html\n gadget_erp5_page_form.html\n
...@@ -366,7 +368,7 @@ NETWORK:\n ...@@ -366,7 +368,7 @@ NETWORK:\n
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>955.43982.28112.56149</string> </value> <value> <string>956.4318.43275.52838</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -384,7 +386,7 @@ NETWORK:\n ...@@ -384,7 +386,7 @@ NETWORK:\n
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1480609455.33</float> <float>1482249891.22</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -36,6 +36,10 @@ ...@@ -36,6 +36,10 @@
data-gadget-scope="router" data-gadget-scope="router"
data-gadget-sandbox="public"></div> data-gadget-sandbox="public"></div>
<div data-gadget-url="gadget_erp5_notification.html"
data-gadget-scope="notification"
data-gadget-sandbox="public"></div>
<div data-gadget-url="${translation_gadget}" <div data-gadget-url="${translation_gadget}"
data-gadget-scope="translation_gadget" data-gadget-scope="translation_gadget"
data-gadget-sandbox="public"></div> data-gadget-sandbox="public"></div>
......
...@@ -236,7 +236,7 @@ ...@@ -236,7 +236,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>954.5916.8255.62617</string> </value> <value> <string>955.55192.19343.33109</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>1475848425.64</float> <float>1482240206.37</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -42,14 +42,14 @@ ...@@ -42,14 +42,14 @@
}; };
} }
function route(my_root_gadget, my_scope, my_method, my_param_list) { function route(my_root_gadget, my_scope, my_method, argument_list) {
return RSVP.Queue() return RSVP.Queue()
.push(function () { .push(function () {
return my_root_gadget.getDeclaredGadget(my_scope); return my_root_gadget.getDeclaredGadget(my_scope);
}) })
.push(function (my_gadget) { .push(function (my_gadget) {
if (my_param_list) { if (argument_list) {
return my_gadget[my_method].apply(my_gadget, my_param_list); return my_gadget[my_method].apply(my_gadget, argument_list);
} }
return my_gadget[my_method](); return my_gadget[my_method]();
}); });
...@@ -296,14 +296,23 @@ ...@@ -296,14 +296,23 @@
// XXX Those methods may be directly integrated into the header, // XXX Those methods may be directly integrated into the header,
// as it handles the submit triggering // as it handles the submit triggering
.allowPublicAcquisition('notifySubmitting', function () { .allowPublicAcquisition('notifySubmitting', function (argument_list) {
return route(this, "header", 'notifySubmitting'); return RSVP.all([
route(this, "header", 'notifySubmitting'),
route(this, "notification", 'notify', argument_list)
]);
}) })
.allowPublicAcquisition('notifySubmitted', function () { .allowPublicAcquisition('notifySubmitted', function (argument_list) {
return route(this, "header", "notifySubmitted"); return RSVP.all([
route(this, "header", 'notifySubmitted'),
route(this, "notification", 'notify', argument_list)
]);
}) })
.allowPublicAcquisition('notifyChange', function () { .allowPublicAcquisition('notifyChange', function (argument_list) {
return route(this, "header", 'notifyChange'); return RSVP.all([
route(this, "header", 'notifyChange'),
route(this, "notification", 'notify', argument_list)
]);
}) })
.allowPublicAcquisition('refresh', function () { .allowPublicAcquisition('refresh', function () {
...@@ -491,7 +500,7 @@ ...@@ -491,7 +500,7 @@
}); });
}) })
// Render the page // Render the page
.declareMethod('render', function (route_result) { .declareMethod('render', function (route_result, keep_message) {
var gadget = this; var gadget = this;
// Reinitialize the loading counter // Reinitialize the loading counter
...@@ -504,16 +513,14 @@ ...@@ -504,16 +513,14 @@
return increaseLoadingCounter(gadget); return increaseLoadingCounter(gadget);
}) })
.push(function () { .push(function () {
return gadget.getDeclaredGadget('panel'); var promise_list = [
}) route(gadget, 'panel', 'close'),
.push(function (panel_gadget) { route(gadget, 'editor_panel', 'close')
return panel_gadget.close(); ];
}) if (keep_message !== true) {
.push(function () { promise_list.push(route(gadget, 'notification', 'close'));
return gadget.getDeclaredGadget('editor_panel'); }
}) return RSVP.all(promise_list);
.push(function (editor_panel) {
return editor_panel.close();
}) })
.push(function () { .push(function () {
return gadget.changeState({url: route_result.url, return gadget.changeState({url: route_result.url,
......
...@@ -230,7 +230,7 @@ ...@@ -230,7 +230,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>955.51095.28081.35481</string> </value> <value> <string>956.5832.50053.43878</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -248,7 +248,7 @@ ...@@ -248,7 +248,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1481033822.43</float> <float>1482250162.82</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -1214,6 +1214,33 @@ div[data-gadget-scope='erp5_searchfield'] button { ...@@ -1214,6 +1214,33 @@ div[data-gadget-scope='erp5_searchfield'] button {
} }
} }
/********************************************** /**********************************************
* Notification
**********************************************/
div[data-gadget-scope='notification'] {
position: fixed;
z-index: 99999;
bottom: 12pt;
right: -192pt;
transition: transform 200ms ease-out;
transform: translate3d(0, 0, 0);
}
div[data-gadget-scope='notification'].visible {
transform: translate3d(-216pt, 0, 0);
}
@media only screen and (max-width: 45em) {
div[data-gadget-scope='notification'].visible {
transform: translate3d(-198pt, 0, 0);
}
}
div[data-gadget-scope='notification'] button {
text-align: left;
width: 180pt;
padding: 12pt;
background-color: #FF6600;
color: #f8fff3;
border-radius: 0.325em;
}
/**********************************************
* JQM * JQM
**********************************************/ **********************************************/
.ui-disabled { .ui-disabled {
......
...@@ -242,7 +242,7 @@ ...@@ -242,7 +242,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>955.33777.42224.15633</string> </value> <value> <string>956.4331.30558.53367</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -260,7 +260,7 @@ ...@@ -260,7 +260,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1480337940.73</float> <float>1482165005.75</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
<!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>ERP5 Notification</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="gadget_erp5_notification.js" type="text/javascript"></script>
</head>
<body>
<button type="submit"></button>
</body>
</html>
\ No newline at end of file
/*jslint nomen: true, indent: 2, maxerr: 3 */
/*global window, Node, rJS */
(function (window, Node, rJS) {
"use strict";
rJS(window)
/////////////////////////////////////////////////////////////////
// declared methods
/////////////////////////////////////////////////////////////////
.declareMethod('notify', function (message) {
if (typeof message === "string") {
// alertify.log(message);
return this.changeState({
visible: true,
message: message
});
}
return this.changeState({
visible: false
});
})
.declareMethod('close', function () {
return this.changeState({
visible: false
});
})
.onStateChange(function (modification_dict) {
if (modification_dict.hasOwnProperty('visible')) {
if (this.state.visible) {
if (!this.element.classList.contains('visible')) {
this.element.classList.toggle('visible');
}
} else {
if (this.element.classList.contains('visible')) {
this.element.classList.remove('visible');
}
}
}
if (modification_dict.hasOwnProperty('message')) {
var button = this.element.querySelector('button');
button.textContent = this.state.message;
}
})
.onEvent('click', function (evt) {
if ((evt.target.nodeType === Node.ELEMENT_NODE) &&
(evt.target.tagName === 'BUTTON')) {
return this.close();
}
}, false, false);
}(window, Node, rJS));
\ No newline at end of file
...@@ -150,8 +150,13 @@ ...@@ -150,8 +150,13 @@
.push(function (evt) { .push(function (evt) {
var location = evt.target.getResponseHeader("X-Location"), var location = evt.target.getResponseHeader("X-Location"),
jio_key, jio_key,
list = []; list = [],
list.push(form_gadget.notifySubmitted()); message;
try {
message = JSON.parse(evt.target.response).portal_status_message;
} catch (ignore) {
}
list.push(form_gadget.notifySubmitted(message));
if (redirect_to_parent) { if (redirect_to_parent) {
list.push(form_gadget.redirect({command: 'history_previous'})); list.push(form_gadget.redirect({command: 'history_previous'}));
......
...@@ -230,7 +230,7 @@ ...@@ -230,7 +230,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>955.61270.41903.7850</string> </value> <value> <string>956.5836.52322.40960</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -248,7 +248,7 @@ ...@@ -248,7 +248,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1481644270.46</float> <float>1482747274.44</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -133,7 +133,14 @@ ...@@ -133,7 +133,14 @@
) )
]); ]);
}) })
.push(form_gadget.notifySubmitted.bind(form_gadget)) .push(function (result_list) {
var message;
try {
message = JSON.parse(result_list[1].target.responseText).portal_status_message;
} catch (ignore) {
}
return form_gadget.notifySubmitted(message);
})
.push(function () { .push(function () {
return form_gadget.redirect({command: 'reload'}); return form_gadget.redirect({command: 'reload'});
}) })
......
...@@ -230,7 +230,7 @@ ...@@ -230,7 +230,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>954.25821.46431.41233</string> </value> <value> <string>956.14116.17826.62532</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -248,7 +248,7 @@ ...@@ -248,7 +248,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1476194167.31</float> <float>1482747207.41</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -836,6 +836,8 @@ ...@@ -836,6 +836,8 @@
.declareMethod('redirect', function (options) { .declareMethod('redirect', function (options) {
this.props.form_content = options.form_content; this.props.form_content = options.form_content;
// XXX Should we make it a second method parameter
this.props.keep_message = true;
delete options.form_content; delete options.form_content;
return this.getCommandUrlFor(options) return this.getCommandUrlFor(options)
.push(function (hash) { .push(function (hash) {
...@@ -867,7 +869,11 @@ ...@@ -867,7 +869,11 @@
}) })
.push(function (route_result) { .push(function (route_result) {
if ((route_result !== undefined) && (route_result.url !== undefined)) { if ((route_result !== undefined) && (route_result.url !== undefined)) {
return gadget.renderApplication(route_result); return gadget.renderApplication(route_result, gadget.props.keep_message)
.push(function (result) {
gadget.props.keep_message = false;
return result;
});
} }
}); });
}) })
......
...@@ -232,7 +232,7 @@ ...@@ -232,7 +232,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>955.30668.10467.53777</string> </value> <value> <string>956.5821.18325.27016</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -250,7 +250,7 @@ ...@@ -250,7 +250,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1479894490.37</float> <float>1482251886.14</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -586,7 +586,7 @@ ...@@ -586,7 +586,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>955.19449.23623.5273</string> </value> <value> <string>955.51162.4768.35123</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -604,7 +604,7 @@ ...@@ -604,7 +604,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1479222772.09</float> <float>1482249905.69</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -1413,6 +1413,34 @@ div[data-gadget-scope='erp5_searchfield'] { ...@@ -1413,6 +1413,34 @@ div[data-gadget-scope='erp5_searchfield'] {
} }
} }
/**********************************************
* Notification
**********************************************/
div[data-gadget-scope='notification'] {
position: fixed;
z-index: 99999;
bottom: @double-margin-size;
right: -@panelwidth - @double-margin-size;
transition: transform 200ms ease-out;
transform: translate3d(0, 0, 0);
&.visible {
transform: translate3d(-@panelwidth - @double-margin-size - @main-margin-size-desktop, 0, 0);
@media @smartphone {
transform: translate3d(-@panelwidth - @double-margin-size - @main-margin-size-smartphone, 0, 0);
}
}
button {
text-align: left;
width: @panelwidth;
padding: @double-margin-size;
background-color: @coloraccent;
color: @colorsubheaderlink;
border-radius: @border-radius;
}
}
/********************************************** /**********************************************
* JQM * JQM
**********************************************/ **********************************************/
......
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