Commit ef4e6927 authored by Vincent Bechu's avatar Vincent Bechu

[erp5_web_renderjs_ui][erp5_web_renderjs_ui_test] Add maximize feature

parent 6b4eabcf
<!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 File Field</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="gadget_button_maximize.js" type="text/javascript"></script>
</head>
<body>
<button class="ui-icon-expand ui-btn-icon-notext" type="button">Maximize</button>
</body>
</html>
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="Web Page" module="erp5.portal_type"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>_Access_contents_information_Permission</string> </key>
<value>
<tuple>
<string>Anonymous</string>
<string>Assignee</string>
<string>Assignor</string>
<string>Associate</string>
<string>Auditor</string>
<string>Manager</string>
<string>Owner</string>
</tuple>
</value>
</item>
<item>
<key> <string>_Add_portal_content_Permission</string> </key>
<value>
<tuple>
<string>Assignee</string>
<string>Assignor</string>
<string>Manager</string>
</tuple>
</value>
</item>
<item>
<key> <string>_Change_local_roles_Permission</string> </key>
<value>
<tuple>
<string>Assignor</string>
<string>Manager</string>
</tuple>
</value>
</item>
<item>
<key> <string>_Modify_portal_content_Permission</string> </key>
<value>
<tuple>
<string>Assignee</string>
<string>Assignor</string>
<string>Manager</string>
</tuple>
</value>
</item>
<item>
<key> <string>_View_Permission</string> </key>
<value>
<tuple>
<string>Anonymous</string>
<string>Assignee</string>
<string>Assignor</string>
<string>Associate</string>
<string>Auditor</string>
<string>Manager</string>
<string>Owner</string>
</tuple>
</value>
</item>
<item>
<key> <string>categories</string> </key>
<value>
<tuple/>
</value>
</item>
<item>
<key> <string>content_md5</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>content_type</string> </key>
<value> <string>text/html</string> </value>
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>gadget_button_maximize.html</string> </value>
</item>
<item>
<key> <string>description</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>id</string> </key>
<value> <string>rjs_gadget_button_maximize_html</string> </value>
</item>
<item>
<key> <string>language</string> </key>
<value> <string>en</string> </value>
</item>
<item>
<key> <string>portal_type</string> </key>
<value> <string>Web Page</string> </value>
</item>
<item>
<key> <string>short_title</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>title</string> </key>
<value> <string>Gadget Button Maximize</string> </value>
</item>
<item>
<key> <string>version</string> </key>
<value> <string>001</string> </value>
</item>
<item>
<key> <string>workflow_history</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAI=</string> </persistent>
</value>
</item>
</dictionary>
</pickle>
</record>
<record id="2" aka="AAAAAAAAAAI=">
<pickle>
<global name="PersistentMapping" module="Persistence.mapping"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>data</string> </key>
<value>
<dictionary>
<item>
<key> <string>document_publication_workflow</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAM=</string> </persistent>
</value>
</item>
<item>
<key> <string>edit_workflow</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAQ=</string> </persistent>
</value>
</item>
<item>
<key> <string>processing_status_workflow</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAU=</string> </persistent>
</value>
</item>
</dictionary>
</value>
</item>
</dictionary>
</pickle>
</record>
<record id="3" aka="AAAAAAAAAAM=">
<pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
</pickle>
<pickle>
<tuple>
<none/>
<list>
<dictionary>
<item>
<key> <string>action</string> </key>
<value> <string>publish_alive</string> </value>
</item>
<item>
<key> <string>actor</string> </key>
<value> <string>vincent</string> </value>
</item>
<item>
<key> <string>comment</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>error_message</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>time</string> </key>
<value>
<object>
<klass>
<global name="DateTime" module="DateTime.DateTime"/>
</klass>
<tuple>
<none/>
</tuple>
<state>
<tuple>
<float>1510755209.9</float>
<string>UTC</string>
</tuple>
</state>
</object>
</value>
</item>
<item>
<key> <string>validation_state</string> </key>
<value> <string>published_alive</string> </value>
</item>
</dictionary>
</list>
</tuple>
</pickle>
</record>
<record id="4" aka="AAAAAAAAAAQ=">
<pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
</pickle>
<pickle>
<tuple>
<none/>
<list>
<dictionary>
<item>
<key> <string>action</string> </key>
<value> <string>edit</string> </value>
</item>
<item>
<key> <string>actor</string> </key>
<value> <string>vincent</string> </value>
</item>
<item>
<key> <string>comment</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>error_message</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>964.10046.23984.2525</string> </value>
</item>
<item>
<key> <string>state</string> </key>
<value> <string>current</string> </value>
</item>
<item>
<key> <string>time</string> </key>
<value>
<object>
<klass>
<global name="DateTime" module="DateTime.DateTime"/>
</klass>
<tuple>
<none/>
</tuple>
<state>
<tuple>
<float>1513355549.82</float>
<string>UTC</string>
</tuple>
</state>
</object>
</value>
</item>
</dictionary>
</list>
</tuple>
</pickle>
</record>
<record id="5" aka="AAAAAAAAAAU=">
<pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
</pickle>
<pickle>
<tuple>
<none/>
<list>
<dictionary>
<item>
<key> <string>action</string> </key>
<value> <string>detect_converted_file</string> </value>
</item>
<item>
<key> <string>actor</string> </key>
<value> <string>vincent</string> </value>
</item>
<item>
<key> <string>comment</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>error_message</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>external_processing_state</string> </key>
<value> <string>converted</string> </value>
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>0.0.0.0</string> </value>
</item>
<item>
<key> <string>time</string> </key>
<value>
<object>
<klass>
<global name="DateTime" module="DateTime.DateTime"/>
</klass>
<tuple>
<none/>
</tuple>
<state>
<tuple>
<float>1510750152.4</float>
<string>UTC</string>
</tuple>
</state>
</object>
</value>
</item>
</dictionary>
</list>
</tuple>
</pickle>
</record>
</ZopeData>
/*global window, rJS */
/*jslint indent: 2, maxerr: 3 */
(function (window, rJS) {
"use strict";
rJS(window)
.declareAcquiredMethod('triggerMaximize', 'triggerMaximize')
.onEvent('click', function (event) {
if (event.target.tagName === "BUTTON") {
return this.callMaximize(true);
}
})
.declareJob('callMaximize', function () {
return this.triggerMaximize(true);
});
}(window, rJS));
\ No newline at end of file
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="Web Script" module="erp5.portal_type"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>_Access_contents_information_Permission</string> </key>
<value>
<tuple>
<string>Anonymous</string>
<string>Assignee</string>
<string>Assignor</string>
<string>Associate</string>
<string>Auditor</string>
<string>Manager</string>
<string>Owner</string>
</tuple>
</value>
</item>
<item>
<key> <string>_Add_portal_content_Permission</string> </key>
<value>
<tuple>
<string>Assignee</string>
<string>Assignor</string>
<string>Manager</string>
</tuple>
</value>
</item>
<item>
<key> <string>_Change_local_roles_Permission</string> </key>
<value>
<tuple>
<string>Assignor</string>
<string>Manager</string>
</tuple>
</value>
</item>
<item>
<key> <string>_Modify_portal_content_Permission</string> </key>
<value>
<tuple>
<string>Assignee</string>
<string>Assignor</string>
<string>Manager</string>
</tuple>
</value>
</item>
<item>
<key> <string>_View_Permission</string> </key>
<value>
<tuple>
<string>Anonymous</string>
<string>Assignee</string>
<string>Assignor</string>
<string>Associate</string>
<string>Auditor</string>
<string>Manager</string>
<string>Owner</string>
</tuple>
</value>
</item>
<item>
<key> <string>categories</string> </key>
<value>
<tuple>
<string>classification/collaborative/team</string>
</tuple>
</value>
</item>
<item>
<key> <string>content_md5</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>gadget_button_maximize.js</string> </value>
</item>
<item>
<key> <string>description</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>id</string> </key>
<value> <string>rjs_gadget_button_maximize_js</string> </value>
</item>
<item>
<key> <string>language</string> </key>
<value> <string>en</string> </value>
</item>
<item>
<key> <string>portal_type</string> </key>
<value> <string>Web Script</string> </value>
</item>
<item>
<key> <string>short_title</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>title</string> </key>
<value> <string>Gadget Button Maximize JS</string> </value>
</item>
<item>
<key> <string>version</string> </key>
<value> <string>001</string> </value>
</item>
<item>
<key> <string>workflow_history</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAI=</string> </persistent>
</value>
</item>
</dictionary>
</pickle>
</record>
<record id="2" aka="AAAAAAAAAAI=">
<pickle>
<global name="PersistentMapping" module="Persistence.mapping"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>data</string> </key>
<value>
<dictionary>
<item>
<key> <string>document_publication_workflow</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAM=</string> </persistent>
</value>
</item>
<item>
<key> <string>edit_workflow</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAQ=</string> </persistent>
</value>
</item>
<item>
<key> <string>processing_status_workflow</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAU=</string> </persistent>
</value>
</item>
</dictionary>
</value>
</item>
</dictionary>
</pickle>
</record>
<record id="3" aka="AAAAAAAAAAM=">
<pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
</pickle>
<pickle>
<tuple>
<none/>
<list>
<dictionary>
<item>
<key> <string>action</string> </key>
<value> <string>publish_alive</string> </value>
</item>
<item>
<key> <string>actor</string> </key>
<value> <string>vincent</string> </value>
</item>
<item>
<key> <string>comment</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>error_message</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>time</string> </key>
<value>
<object>
<klass>
<global name="DateTime" module="DateTime.DateTime"/>
</klass>
<tuple>
<none/>
</tuple>
<state>
<tuple>
<float>1510755215.61</float>
<string>UTC</string>
</tuple>
</state>
</object>
</value>
</item>
<item>
<key> <string>validation_state</string> </key>
<value> <string>published_alive</string> </value>
</item>
</dictionary>
</list>
</tuple>
</pickle>
</record>
<record id="4" aka="AAAAAAAAAAQ=">
<pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
</pickle>
<pickle>
<tuple>
<none/>
<list>
<dictionary>
<item>
<key> <string>action</string> </key>
<value> <string>edit</string> </value>
</item>
<item>
<key> <string>actor</string> </key>
<value> <string>vincent</string> </value>
</item>
<item>
<key> <string>comment</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>error_message</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>964.19801.1069.24644</string> </value>
</item>
<item>
<key> <string>state</string> </key>
<value> <string>current</string> </value>
</item>
<item>
<key> <string>time</string> </key>
<value>
<object>
<klass>
<global name="DateTime" module="DateTime.DateTime"/>
</klass>
<tuple>
<none/>
</tuple>
<state>
<tuple>
<float>1514902384.55</float>
<string>UTC</string>
</tuple>
</state>
</object>
</value>
</item>
</dictionary>
</list>
</tuple>
</pickle>
</record>
<record id="5" aka="AAAAAAAAAAU=">
<pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
</pickle>
<pickle>
<tuple>
<none/>
<list>
<dictionary>
<item>
<key> <string>action</string> </key>
<value> <string>detect_converted_file</string> </value>
</item>
<item>
<key> <string>actor</string> </key>
<value> <string>vincent</string> </value>
</item>
<item>
<key> <string>comment</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>error_message</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>external_processing_state</string> </key>
<value> <string>converted</string> </value>
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>0.0.0.0</string> </value>
</item>
<item>
<key> <string>time</string> </key>
<value>
<object>
<klass>
<global name="DateTime" module="DateTime.DateTime"/>
</klass>
<tuple>
<none/>
</tuple>
<state>
<tuple>
<float>1510750245.63</float>
<string>UTC</string>
</tuple>
</state>
</object>
</value>
</item>
</dictionary>
</list>
</tuple>
</pickle>
</record>
</ZopeData>
...@@ -248,6 +248,8 @@ gadget_translation.js\n ...@@ -248,6 +248,8 @@ gadget_translation.js\n
gadget_translation_data.js\n gadget_translation_data.js\n
gadget_editor.html\n gadget_editor.html\n
gadget_editor.js\n gadget_editor.js\n
gadget_button_maximize.html\n
gadget_button_maximize.js\n
handlebars.js\n handlebars.js\n
jiodev.js\n jiodev.js\n
renderjs.js\n renderjs.js\n
...@@ -370,7 +372,7 @@ NETWORK:\n ...@@ -370,7 +372,7 @@ NETWORK:\n
</item> </item>
<item> <item>
<key> <string>actor</string> </key> <key> <string>actor</string> </key>
<value> <string>zope</string> </value> <value> <string>vincent</string> </value>
</item> </item>
<item> <item>
<key> <string>comment</string> </key> <key> <string>comment</string> </key>
...@@ -384,7 +386,7 @@ NETWORK:\n ...@@ -384,7 +386,7 @@ NETWORK:\n
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>964.28371.30938.25275</string> </value> <value> <string>964.36992.30924.10700</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -402,7 +404,7 @@ NETWORK:\n ...@@ -402,7 +404,7 @@ NETWORK:\n
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1514476860.44</float> <float>1514975259.77</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -92,6 +92,7 @@ ...@@ -92,6 +92,7 @@
.declareAcquiredMethod("translateHtml", "translateHtml") .declareAcquiredMethod("translateHtml", "translateHtml")
.declareAcquiredMethod("triggerSubmit", "triggerSubmit") .declareAcquiredMethod("triggerSubmit", "triggerSubmit")
.declareAcquiredMethod("triggerPanel", "triggerPanel") .declareAcquiredMethod("triggerPanel", "triggerPanel")
.declareAcquiredMethod("triggerMaximize", "triggerMaximize")
///////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////
// declared methods // declared methods
...@@ -130,6 +131,12 @@ ...@@ -130,6 +131,12 @@
modified: true modified: true
}); });
}) })
.declareMethod('setButtonTitle', function (options) {
return this.changeState({
title_button_icon: options.icon,
title_button_name: options.action
});
})
/* /*
.declareMethod('notifyUpdate', function () { .declareMethod('notifyUpdate', function () {
return this.render(this.stats.options); return this.render(this.stats.options);
...@@ -227,6 +234,7 @@ ...@@ -227,6 +234,7 @@
default_title_icon = "", default_title_icon = "",
default_right_icon = "", default_right_icon = "",
title_link, title_link,
title_button,
promise_list = []; promise_list = [];
// Main title // Main title
if (modification_dict.hasOwnProperty('error') || if (modification_dict.hasOwnProperty('error') ||
...@@ -234,7 +242,8 @@ ...@@ -234,7 +242,8 @@
modification_dict.hasOwnProperty('submitted') || modification_dict.hasOwnProperty('submitted') ||
modification_dict.hasOwnProperty('title_text') || modification_dict.hasOwnProperty('title_text') ||
modification_dict.hasOwnProperty('title_icon') || modification_dict.hasOwnProperty('title_icon') ||
modification_dict.hasOwnProperty('title_url')) { modification_dict.hasOwnProperty('title_url') ||
modification_dict.hasOwnProperty('title_button_name')) {
if (gadget.state.error) { if (gadget.state.error) {
default_title_icon = "exclamation"; default_title_icon = "exclamation";
} else if (!gadget.state.loaded) { } else if (!gadget.state.loaded) {
...@@ -249,7 +258,14 @@ ...@@ -249,7 +258,14 @@
icon: default_title_icon || gadget.state.title_icon, icon: default_title_icon || gadget.state.title_icon,
url: gadget.state.title_url url: gadget.state.title_url
}; };
if (title_link.url === undefined) { if (gadget.state.title_button_name) {
title_button = {
title: gadget.state.title_text,
icon: default_title_icon || gadget.state.title_button_icon,
name: gadget.state.title_button_name
};
promise_list.push(gadget.translateHtml(header_button_template(title_button)));
} else if (title_link.url === undefined) {
promise_list.push(gadget.translateHtml(header_title_template(title_link))); promise_list.push(gadget.translateHtml(header_title_template(title_link)));
} else { } else {
promise_list.push(gadget.translateHtml(header_title_link_template(title_link))); promise_list.push(gadget.translateHtml(header_title_link_template(title_link)));
...@@ -352,6 +368,9 @@ ...@@ -352,6 +368,9 @@
if (name === "submit") { if (name === "submit") {
return this.triggerSubmit(); return this.triggerSubmit();
} }
if (name === "maximize") {
return this.triggerMaximize();
}
throw new Error("Unsupported button " + name); throw new Error("Unsupported button " + name);
}); });
......
...@@ -216,7 +216,7 @@ ...@@ -216,7 +216,7 @@
</item> </item>
<item> <item>
<key> <string>actor</string> </key> <key> <string>actor</string> </key>
<value> <string>zope</string> </value> <value> <string>vincent</string> </value>
</item> </item>
<item> <item>
<key> <string>comment</string> </key> <key> <string>comment</string> </key>
...@@ -230,7 +230,7 @@ ...@@ -230,7 +230,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>961.19028.47293.9045</string> </value> <value> <string>964.8363.33749.28962</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>1502270945.98</float> <float>1513343430.33</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -182,6 +182,30 @@ ...@@ -182,6 +182,30 @@
} }
} }
function triggerMaximize(gadget, maximize) {
if (gadget.props.deferred_minimize !== undefined) {
gadget.props.deferred_minimize.resolve();
gadget.props.deferred_minimize = undefined;
}
hideDesktopPanel(gadget, maximize);
if (maximize) {
return route(gadget, 'header', 'setButtonTitle', [{
icon: "compress",
action: "maximize"
}])
.push(function () {
gadget.props.deferred_minimize = RSVP.defer();
return gadget.props.deferred_minimize.promise;
})
.push(undefined, function (error) {
if (error instanceof RSVP.CancellationError) {
return triggerMaximize(gadget, false);
}
});
}
return route(gadget, 'header', 'setButtonTitle', [{}]);
}
////////////////////////////////////////// //////////////////////////////////////////
// Page rendering // Page rendering
////////////////////////////////////////// //////////////////////////////////////////
...@@ -486,6 +510,9 @@ ...@@ -486,6 +510,9 @@
return main_gadget.triggerSubmit.apply(main_gadget, param_list); return main_gadget.triggerSubmit.apply(main_gadget, param_list);
}); });
}) })
.allowPublicAcquisition("triggerMaximize", function (param_list) {
return triggerMaximize(this, param_list[0]);
})
///////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////
// declared methods // declared methods
///////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////
......
...@@ -216,7 +216,7 @@ ...@@ -216,7 +216,7 @@
</item> </item>
<item> <item>
<key> <string>actor</string> </key> <key> <string>actor</string> </key>
<value> <string>zope</string> </value> <value> <string>vincent</string> </value>
</item> </item>
<item> <item>
<key> <string>comment</string> </key> <key> <string>comment</string> </key>
...@@ -230,7 +230,7 @@ ...@@ -230,7 +230,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>964.29808.29957.65314</string> </value> <value> <string>964.44144.54943.18056</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>1514543212.43</float> <float>1515401365.21</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -824,30 +824,43 @@ div[data-gadget-scope='header'] .ui-header h1 > span::before { ...@@ -824,30 +824,43 @@ div[data-gadget-scope='header'] .ui-header h1 > span::before {
margin-right: 6pt; margin-right: 6pt;
} }
} }
div[data-gadget-scope='header'] .ui-header h1 a { div[data-gadget-scope='header'] .ui-header h1 form {
height: 100%;
}
div[data-gadget-scope='header'] .ui-header h1 form button {
text-align: left;
height: 100%;
width: 100%;
}
div[data-gadget-scope='header'] .ui-header h1 a,
div[data-gadget-scope='header'] .ui-header h1 button {
display: block; display: block;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
div[data-gadget-scope='header'] .ui-header h1 a::before { div[data-gadget-scope='header'] .ui-header h1 a::before,
div[data-gadget-scope='header'] .ui-header h1 button::before {
display: inline-block; display: inline-block;
width: 42pt; width: 42pt;
} }
@media only screen and (min-width: 45em) and (max-width: 85em), not screen and (min-width: 45em) { @media only screen and (min-width: 45em) and (max-width: 85em), not screen and (min-width: 45em) {
div[data-gadget-scope='header'] .ui-header h1 a::before { div[data-gadget-scope='header'] .ui-header h1 a::before,
div[data-gadget-scope='header'] .ui-header h1 button::before {
text-align: center; text-align: center;
} }
} }
@media not screen and (max-width: 85em) { @media not screen and (max-width: 85em) {
div[data-role='page']:not(.desktop-panel-hidden) div[data-gadget-scope='header'] .ui-header h1 a::before { div[data-role='page']:not(.desktop-panel-hidden) div[data-gadget-scope='header'] .ui-header h1 a::before,
div[data-role='page']:not(.desktop-panel-hidden) div[data-gadget-scope='header'] .ui-header h1 button::before {
width: 12pt; width: 12pt;
margin-left: 24pt; margin-left: 24pt;
margin-right: 6pt; margin-right: 6pt;
} }
} }
@media not screen and (min-width: 45em) { @media not screen and (min-width: 45em) {
div[data-gadget-scope='header'] .ui-header h1 a::before { div[data-gadget-scope='header'] .ui-header h1 a::before,
div[data-gadget-scope='header'] .ui-header h1 button::before {
width: 30pt; width: 30pt;
} }
} }
...@@ -1523,7 +1536,8 @@ div[data-gadget-scope='notification'] button.error { ...@@ -1523,7 +1536,8 @@ div[data-gadget-scope='notification'] button.error {
.desktop-panel-hidden div[data-gadget-scope="header"] .ui-header h1 > span::before { .desktop-panel-hidden div[data-gadget-scope="header"] .ui-header h1 > span::before {
margin-right: 14pt; margin-right: 14pt;
} }
.desktop-panel-hidden div[data-gadget-scope="header"] .ui-header h1 a::before { .desktop-panel-hidden div[data-gadget-scope="header"] .ui-header h1 a::before,
.desktop-panel-hidden div[data-gadget-scope="header"] .ui-header h1 button::before {
text-align: center; text-align: center;
} }
.desktop-panel-hidden div[data-gadget-scope="header"] .ui-header > .ui-btn-right button, .desktop-panel-hidden div[data-gadget-scope="header"] .ui-header > .ui-btn-right button,
...@@ -1571,38 +1585,27 @@ div[data-gadget-scope='notification'] button.error { ...@@ -1571,38 +1585,27 @@ div[data-gadget-scope='notification'] button.error {
} }
} }
/********************************************** /**********************************************
* Class * Maximize
**********************************************/ **********************************************/
.content-iframe-maximize { div[data-gadget-scope='maximize'] button {
position: fixed; padding: 6pt;
border: 1px solid rgba(0, 0, 0, 0.14);
border-radius: 0.325em;
} }
@media not screen and (max-width: 85em) { div[data-gadget-scope='maximize'] button::before {
.content-iframe-maximize { margin-right: 6pt;
left: 180pt;
top: 60pt;
}
.content-iframe-maximize iframe {
width: calc(100vw - 180pt );
height: calc(100vh - 60pt );
}
} }
@media only screen and (min-width: 45em) and (max-width: 85em) { div[data-gadget-scope='maximize'] button:hover,
.content-iframe-maximize { div[data-gadget-scope='maximize'] button:active {
left: 0; background-color: #e0e0e0;
top: 73pt;
}
.content-iframe-maximize iframe {
height: calc(100vh - 73pt );
}
} }
@media not screen and (min-width: 45em) { .editor-maximize div[data-gadget-scope='editor'] {
.content-iframe-maximize { position: fixed;
z-index: 1500;
left: 0; left: 0;
top: 67pt; top: 30pt;
} width: 100vw;
.content-iframe-maximize iframe { height: calc(100vh - 30pt );
height: calc(100vh - 67pt );
}
} }
/********************************************** /**********************************************
* Icons * Icons
......
...@@ -242,7 +242,7 @@ ...@@ -242,7 +242,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>964.44210.47735.47906</string> </value> <value> <string>964.44237.61138.34884</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>1515405865.26</float> <float>1515407011.06</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>actor</string> </key> <key> <string>actor</string> </key>
<value> <string>zope</string> </value> <value> <string>vincent</string> </value>
</item> </item>
<item> <item>
<key> <string>comment</string> </key> <key> <string>comment</string> </key>
...@@ -600,7 +600,7 @@ ...@@ -600,7 +600,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>958.41530.20774.12100</string> </value> <value> <string>964.35843.45404.42990</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -618,7 +618,7 @@ ...@@ -618,7 +618,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1492085998.14</float> <float>1515401763.58</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -1003,8 +1003,16 @@ div[data-gadget-scope='header'] .ui-header { ...@@ -1003,8 +1003,16 @@ div[data-gadget-scope='header'] .ui-header {
} }
} }
} }
// Clickable title // Clickable title and button
a { form {
height: 100%;
button {
text-align: left;
height: 100%;
width: 100%;
}
}
a, button {
display: block; display: block;
// Do not put link on multi line in case of small screen // Do not put link on multi line in case of small screen
...@@ -1758,7 +1766,7 @@ div[data-gadget-scope='notification'] { ...@@ -1758,7 +1766,7 @@ div[data-gadget-scope='notification'] {
& > span { & > span {
.renderTabletNotALinkTitle(); .renderTabletNotALinkTitle();
} }
a { a, button {
&::before { &::before {
text-align: center; text-align: center;
} }
...@@ -1801,32 +1809,20 @@ div[data-gadget-scope='notification'] { ...@@ -1801,32 +1809,20 @@ div[data-gadget-scope='notification'] {
} }
} }
/********************************************** /**********************************************
* Class * Maximize
**********************************************/ **********************************************/
.content-iframe-maximize {
div[data-gadget-scope='maximize'] button {
.button();
}
.editor-maximize div[data-gadget-scope='editor'] {
position: fixed; position: fixed;
@media @desktop { z-index: 1500;
left: @panelwidth;
top: 2 * @headerheight;
iframe {
width: ~"calc(100vw - "@panelwidth~")";
height: ~"calc(100vh - "2 * @headerheight~")";
}
}
@media @tablet {
left: 0; left: 0;
top: @headerheight-tablet; top: @headerheight;
iframe { width: 100vw;
height: ~"calc(100vh - "@headerheight-tablet~")"; height: ~"calc(100vh - "@headerheight~")";
}
}
@media @smartphone {
left: 0;
top: @headerheight-smartphone;
iframe {
height: ~"calc(100vh - "@headerheight-smartphone~")";
}
}
} }
/********************************************** /**********************************************
......
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="Zuite" module="Products.Zelenium.zuite"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>_objects</string> </key>
<value>
<tuple/>
</value>
</item>
<item>
<key> <string>id</string> </key>
<value> <string>renderjs_ui_editor_gadget_zuite</string> </value>
</item>
<item>
<key> <string>title</string> </key>
<value> <string></string> </value>
</item>
</dictionary>
</pickle>
</record>
</ZopeData>
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="ZopePageTemplate" module="Products.PageTemplates.ZopePageTemplate"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>_bind_names</string> </key>
<value>
<object>
<klass>
<global name="NameAssignments" module="Shared.DC.Scripts.Bindings"/>
</klass>
<tuple/>
<state>
<dictionary>
<item>
<key> <string>_asgns</string> </key>
<value>
<dictionary>
<item>
<key> <string>name_subpath</string> </key>
<value> <string>traverse_subpath</string> </value>
</item>
</dictionary>
</value>
</item>
</dictionary>
</state>
</object>
</value>
</item>
<item>
<key> <string>content_type</string> </key>
<value> <string>text/html</string> </value>
</item>
<item>
<key> <string>expand</string> </key>
<value> <int>0</int> </value>
</item>
<item>
<key> <string>id</string> </key>
<value> <string>testMaximize</string> </value>
</item>
<item>
<key> <string>output_encoding</string> </key>
<value> <string>utf-8</string> </value>
</item>
<item>
<key> <string>title</string> </key>
<value> <unicode></unicode> </value>
</item>
</dictionary>
</pickle>
</record>
</ZopeData>
<html xmlns:tal="http://xml.zope.org/namespaces/tal"
xmlns:metal="http://xml.zope.org/namespaces/metal">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test Form View Editable Save Action</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">Test Default Module View</td></tr>
</thead><tbody>
<tal:block metal:use-macro="here/PTZuite_CommonTemplate/macros/init" />
<tr>
<td>open</td>
<td>${base_url}/web_site_module/renderjs_runner/#/web_page_module/rjs_gadget_erp5_launcher_html?editable=true</td>
<td></td>
</tr>
<!-- Wait for gadget to be loaded -->
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-gadget-url='${base_url}/web_site_module/renderjs_runner/gadget_erp5_pt_form_view_editable.html']</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-gadget-scope='header']//a[@data-i18n='Views']</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//div[@data-gadget-scope='header']//a[@data-i18n='Views']</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-gadget-scope='m']//a[@data-i18n='Edit']</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//div[@data-gadget-scope='m']//a[@data-i18n='Edit']</td>
<td></td>
</tr>
<!-- Wait for Maximize button -->
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-gadget-scope='maximize']//button[text()='Maximize' and @type='button']</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//div[@data-gadget-scope='maximize']//button[text()='Maximize' and @type='button']</td>
<td></td>
</tr>
<!-- Wait For full screen -->
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-role='page' and @class='desktop-panel-hidden']</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>//div[@data-gadget-scope='header']//button[@name='maximize' and @type='submit']</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>//div[@data-gadget-scope='field']//div[@data-gadget-scope='field_my_text_content' and @class='editor-maximize']</td>
<td></td>
</tr>
<!-- minimize with header button -->
<tr>
<td>click</td>
<td>//div[@data-gadget-scope='header']//button[@name='maximize' and @type='submit']</td>
<td></td>
</tr>
<!-- Check is minimize -->
<tr>
<td>waitForElementNotPresent</td>
<td>//div[@data-role='page' and @class='desktop-panel-hidden']</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>//div[@data-gadget-scope='header']//button[@name='maximize' and @type='submit']</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>//div[@data-gadget-scope='field']//div[@data-gadget-scope='field_my_text_content' and @class='editor-maximize']</td>
<td></td>
</tr>
<!-- Re maximize -->
<tr>
<td>click</td>
<td>//div[@data-gadget-scope='maximize']//button[text()='Maximize' and @type='button']</td>
<td></td>
</tr>
<!-- Wait For full screen -->
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-role='page' and @class='desktop-panel-hidden']</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-gadget-scope='header']//button[@name='maximize' and @type='submit']</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-gadget-scope='field']//div[@data-gadget-scope='field_my_text_content' and @class='editor-maximize']</td>
<td></td>
</tr>
<!-- make some change in url -->
<tr>
<td>open</td>
<td>${base_url}/web_site_module/renderjs_runner/</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[@data-gadget-scope='m']</td>
<td></td>
</tr>
<!-- Check is minimize -->
<tr>
<td>assertElementNotPresent</td>
<td>//div[@data-role='page' and @class='desktop-panel-hidden']</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>//div[@data-gadget-scope='header']//button[@name='maximize' and @type='submit']</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>//div[@data-gadget-scope='field']//div[@data-gadget-scope='field_my_text_content' and @class='editor-maximize']</td>
<td></td>
</tr>
</tbody></table>
</body>
</html>
\ No newline at end of file
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="Zuite" module="Products.Zelenium.zuite"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>_objects</string> </key>
<value>
<tuple/>
</value>
</item>
<item>
<key> <string>id</string> </key>
<value> <string>renderjs_ui_form_editor_zuite</string> </value>
</item>
<item>
<key> <string>title</string> </key>
<value> <string></string> </value>
</item>
</dictionary>
</pickle>
</record>
</ZopeData>
##############################################################################
#
# Copyright (c) 2011 Nexedi SARL and Contributors. All Rights Reserved.
# Kazuhiko <kazuhiko@nexedi.com>
# Rafael Monnerat <rafael@nexedi.com>
#
# WARNING: This program as such is intended to be used by professional
# programmers who take the whole responsability of assessing all potential
# consequences resulting from its eventual inadequacies and bugs
# End users who are looking for a ready-to-use solution with commercial
# garantees and support are strongly adviced to contract a Free Software
# Service Company
#
# This program is Free Software; you can redistribute it and/or
# modify it under the terms of the GNU General Public License
# as published by the Free Software Foundation; either version 2
# of the License, or (at your option) any later version.
#
# This program is distributed in the hope that it will be useful,
# but WITHOUT ANY WARRANTY; without even the implied warranty of
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
# GNU General Public License for more details.
#
# You should have received a copy of the GNU General Public License
# along with this program; if not, write to the Free Software
# Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
#
##############################################################################
import unittest
from Products.ERP5Type.tests.ERP5TypeFunctionalTestCase import ERP5TypeFunctionalTestCase
class TestRenderJSUIEditorGadget(ERP5TypeFunctionalTestCase):
foreground = 0
run_only = "renderjs_ui_editor_gadget_zuite"
def getBusinessTemplateList(self):
return (
'erp5_web_renderjs_ui',
'erp5_web_renderjs_ui_test',
'erp5_ui_test_core',
'erp5_test_result',
)
def test_suite():
suite = unittest.TestSuite()
suite.addTest(unittest.makeSuite(TestRenderJSUIEditorGadget))
return suite
\ No newline at end of file
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="Test Component" module="erp5.portal_type"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>_recorded_property_dict</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAI=</string> </persistent>
</value>
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>testFunctionalRJSEditorGadget</string> </value>
</item>
<item>
<key> <string>description</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>id</string> </key>
<value> <string>test.erp5.testFunctionalRJSEditorGadget</string> </value>
</item>
<item>
<key> <string>portal_type</string> </key>
<value> <string>Test Component</string> </value>
</item>
<item>
<key> <string>sid</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>text_content_error_message</string> </key>
<value>
<tuple/>
</value>
</item>
<item>
<key> <string>text_content_warning_message</string> </key>
<value>
<tuple/>
</value>
</item>
<item>
<key> <string>version</string> </key>
<value> <string>erp5</string> </value>
</item>
<item>
<key> <string>workflow_history</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAM=</string> </persistent>
</value>
</item>
</dictionary>
</pickle>
</record>
<record id="2" aka="AAAAAAAAAAI=">
<pickle>
<global name="PersistentMapping" module="Persistence.mapping"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>data</string> </key>
<value>
<dictionary/>
</value>
</item>
</dictionary>
</pickle>
</record>
<record id="3" aka="AAAAAAAAAAM=">
<pickle>
<global name="PersistentMapping" module="Persistence.mapping"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>data</string> </key>
<value>
<dictionary>
<item>
<key> <string>component_validation_workflow</string> </key>
<value>
<persistent> <string encoding="base64">AAAAAAAAAAQ=</string> </persistent>
</value>
</item>
</dictionary>
</value>
</item>
</dictionary>
</pickle>
</record>
<record id="4" aka="AAAAAAAAAAQ=">
<pickle>
<global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
</pickle>
<pickle>
<tuple>
<none/>
<list>
<dictionary>
<item>
<key> <string>action</string> </key>
<value> <string>validate</string> </value>
</item>
<item>
<key> <string>validation_state</string> </key>
<value> <string>validated</string> </value>
</item>
</dictionary>
</list>
</tuple>
</pickle>
</record>
</ZopeData>
...@@ -2,6 +2,8 @@ portal_tests/renderjs_ui_check_box_field_zuite ...@@ -2,6 +2,8 @@ portal_tests/renderjs_ui_check_box_field_zuite
portal_tests/renderjs_ui_check_box_field_zuite/** portal_tests/renderjs_ui_check_box_field_zuite/**
portal_tests/renderjs_ui_date_time_field_zuite portal_tests/renderjs_ui_date_time_field_zuite
portal_tests/renderjs_ui_date_time_field_zuite/** portal_tests/renderjs_ui_date_time_field_zuite/**
portal_tests/renderjs_ui_editor_gadget_zuite
portal_tests/renderjs_ui_editor_gadget_zuite/**
portal_tests/renderjs_ui_float_field_zuite portal_tests/renderjs_ui_float_field_zuite
portal_tests/renderjs_ui_float_field_zuite/** portal_tests/renderjs_ui_float_field_zuite/**
portal_tests/renderjs_ui_form_box_zuite portal_tests/renderjs_ui_form_box_zuite
......
...@@ -18,3 +18,4 @@ test.erp5.testFunctionalRJSTranslation ...@@ -18,3 +18,4 @@ test.erp5.testFunctionalRJSTranslation
test.erp5.testFunctionalRJSLogoutTranslation test.erp5.testFunctionalRJSLogoutTranslation
test.erp5.testFunctionalRJSNotification test.erp5.testFunctionalRJSNotification
test.erp5.testFunctionalRJSMatrixbox test.erp5.testFunctionalRJSMatrixbox
test.erp5.testFunctionalRJSEditorGadget
\ No newline at end of file
...@@ -157,7 +157,7 @@ ...@@ -157,7 +157,7 @@
<dictionary> <dictionary>
<item> <item>
<key> <string>_text</string> </key> <key> <string>_text</string> </key>
<value> <string>python: [(\'editor\', context.Base_getEditorFieldPreferredTextEditor()), (\'portal_type\', context.getPortalType()), ]</string> </value> <value> <string>python: [(\'editor\', context.Base_getEditorFieldPreferredTextEditor()), (\'portal_type\', context.getPortalType()), (\'maximize\', True)]</string> </value>
</item> </item>
</dictionary> </dictionary>
</pickle> </pickle>
......
...@@ -18,12 +18,26 @@ ...@@ -18,12 +18,26 @@
*/ */
rJS(window) rJS(window)
.declareAcquiredMethod('triggerMaximize', 'triggerMaximize')
.allowPublicAcquisition('triggerMaximize', function (param_list) {
var gadget = this;
if (!this.element.classList.contains('editor-maximize')) {
this.element.classList.toggle('editor-maximize');
}
return this.triggerMaximize.apply(this, param_list)
.push(function () {
if (gadget.element.classList.contains('editor-maximize')) {
gadget.element.classList.remove('editor-maximize');
}
});
})
.declareMethod('render', function (options) { .declareMethod('render', function (options) {
var state_dict = { var state_dict = {
value: options.value || "", value: options.value || "",
editor: options.editor, editor: options.editor,
content_type: options.content_type, content_type: options.content_type,
maximize: options.maximize,
portal_type: options.portal_type, portal_type: options.portal_type,
editable: options.editable || false, editable: options.editable || false,
key: options.key key: options.key
...@@ -40,6 +54,7 @@ ...@@ -40,6 +54,7 @@
gadget = this, gadget = this,
url, url,
div = document.createElement('div'), div = document.createElement('div'),
div_max = document.createElement('div'),
queue = new RSVP.Queue(); queue = new RSVP.Queue();
if ((modification_dict.hasOwnProperty('editable')) || if ((modification_dict.hasOwnProperty('editable')) ||
...@@ -48,6 +63,28 @@ ...@@ -48,6 +63,28 @@
while (element.firstChild) { while (element.firstChild) {
element.removeChild(element.firstChild); element.removeChild(element.firstChild);
} }
if (modification_dict.hasOwnProperty('maximize')) {
if (gadget.state.maximize && gadget.state.editable) {
element.appendChild(div_max);
queue
.push(function () {
return gadget.triggerMaximize(false);
})
.push(function () {
return gadget.declareGadget("gadget_button_maximize.html", {
scope: 'maximize',
element: div_max,
sandbox: 'public'
});
}, function (error) {
// Check Acquisition, old erp5 ui don't have triggerMaximize
if (error.name !== "AcquisitionError") {
throw error;
}
});
}
}
element.appendChild(div); element.appendChild(div);
if (gadget.state.editable && if (gadget.state.editable &&
......
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