Commit 36537bcb authored by Romain Courteaud's avatar Romain Courteaud

[erp5_web_renderjs_ui] Allow to include/exclude some lines in the form list listbox.

When the listbox is in 'select' mode, lines are by default unselected.
Then, user can decide if he want to include/exclude selected lines.

Merge nearly identical listbox handlebars template.

Fix display of the selection checkbox on mobile.

Use label to render cell subgadget, so that clicking on the text modify the checkbox state.

Keep full text search at the end when including/excluding.

Use data- attribute to store the checkbox uid.

Change cursor for listbox line label.
parent 2bbcedec
...@@ -4,8 +4,9 @@ ...@@ -4,8 +4,9 @@
<!-- <!--
data-i18n=No records data-i18n=No records
data-i18n=Records data-i18n=Records
data-i18n=Hide Rows data-i18n=Select
data-i18n=Submit data-i18n=Include
data-i18n=Exclude
data-i18n=sample of data-i18n=sample of
--> -->
<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
...@@ -21,7 +22,7 @@ ...@@ -21,7 +22,7 @@
<!-- custom script --> <!-- custom script -->
<script src="gadget_erp5_field_listbox.js" type="text/javascript"></script> <script src="gadget_erp5_field_listbox.js" type="text/javascript"></script>
<script id="listbox-hidden-thead-template" type="text/x-handlebars-template"> <script id="listbox-thead-template" type="text/x-handlebars-template">
<table> <table>
<thead class="ui-bar-inherit head"> <thead class="ui-bar-inherit head">
<tr> <tr>
...@@ -29,10 +30,14 @@ ...@@ -29,10 +30,14 @@
<th data-i18n="Jump">Jump</th> <th data-i18n="Jump">Jump</th>
{{/if}} {{/if}}
{{#each head_value}} {{#each head_value}}
{{#if sort_link}} {{#if ../show_line_selector}}
<th class="{{class_value}}"><a href="{{sort_link}}">{{text}}</a></th> <th class="{{class_value}}">{{text}}</th>
{{else}} {{else}}
<th class="{{class_value}}">{{text}}</th> {{#if sort_link}}
<th class="{{class_value}}"><a href="{{sort_link}}">{{text}}</a></th>
{{else}}
<th class="{{class_value}}">{{text}}</th>
{{/if}}
{{/if}} {{/if}}
{{/each}} {{/each}}
{{#if line_icon}} {{#if line_icon}}
...@@ -43,71 +48,7 @@ ...@@ -43,71 +48,7 @@
</table> </table>
</script> </script>
<script id="listbox-show-thead-template" type="text/x-handlebars-template"> <script id="listbox-tbody-template" type="text/x-handlebars-template">
<table>
<thead class="ui-bar-inherit head">
<tr>
{{#if show_anchor}}
<th data-i18n="Jump">Jump</th>
{{/if}}
<th></th>
{{#each head_value}}
<th class="{{class_value}}">{{text}}</th>
{{/each}}
{{#if line_icon}}
<th></th>
{{/if}}
</tr>
</thead>
</table>
</script>
<script id="listbox-hidden-tbody-template" type="text/x-handlebars-template">
<table>
<tbody class="tbody">
{{#each row_list}}
<tr>
{{#if ../show_anchor}}
<th>
<a class="ui-link ui-btn ui-corner-all ui-icon-carat-r ui-btn-icon-notext" href="{{jump}}"></a>
</th>
{{/if}}
{{#each cell_list}}
<td>
{{#if type}}
{{#if editable}}
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div>
{{else}}
{{#if href}}
<a href="{{href}}" class="ui-link">
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div>
</a>
{{else}}
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div>
{{/if}}
{{/if}}
{{else}}
{{#if href}}
<a href="{{href}}" class="ui-link">{{default}}</a>
{{else}}
<p>{{default}}</p>
{{/if}}
{{/if}}
</td>
{{/each}}
{{#if line_icon}}
<th>
<a href="{{jump}}" class="ui-body-inherit ui-btn-icon-right ui-link ui-btn ui-corner-all ui-icon-sign-in"></a>
</th>
{{/if}}
</tr>
{{/each}}
</tbody>
</table>
</script>
<script id="listbox-show-tbody-template" type="text/x-handlebars-template">
<table> <table>
<tbody class="tbody"> <tbody class="tbody">
{{#each row_list}} {{#each row_list}}
...@@ -117,29 +58,40 @@ ...@@ -117,29 +58,40 @@
<a class="ui-link ui-btn ui-corner-all ui-icon-carat-r ui-btn-icon-notext" href="{{jump}}"> </a> <a class="ui-link ui-btn ui-corner-all ui-icon-carat-r ui-btn-icon-notext" href="{{jump}}"> </a>
</th> </th>
{{/if}} {{/if}}
<td>
<input value="{{uid}}" type="checkbox" checked="true" class="hide_element">
</td>
{{#each cell_list}} {{#each cell_list}}
<td> <td>
{{#if type}} {{#if ../../show_line_selector}}
{{#if editable}} {{#if @first}}
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div> <input data-uid="{{../uid}}" type="checkbox" class="hide_element" id="listbox_line_{{../uid}}">
{{/if}}
{{#if type}}
<label for="listbox_line_{{../uid}}" class="editable_div" data-column="{{column}}" data-line="{{line}}"></label>
{{else}} {{else}}
{{#if href}} <label for="listbox_line_{{../uid}}">{{default}}</label>
<a href="{{href}}" class="ui-link">
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div>
</a>
{{else}}
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div>
{{/if}}
{{/if}} {{/if}}
{{else}} {{else}}
{{#if href}}
<a href="{{href}}" class="ui-link">{{default}}</a> {{#if type}}
{{#if editable}}
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div>
{{else}}
{{#if href}}
<a href="{{href}}" class="ui-link">
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div>
</a>
{{else}}
<div class="editable_div" data-column="{{column}}" data-line="{{line}}"></div>
{{/if}}
{{/if}}
{{else}} {{else}}
<p>{{default}}</p> {{#if href}}
<a href="{{href}}" class="ui-link">{{default}}</a>
{{else}}
<p>{{default}}</p>
{{/if}}
{{/if}} {{/if}}
{{/if}} {{/if}}
</td> </td>
{{/each}} {{/each}}
...@@ -194,9 +146,15 @@ ...@@ -194,9 +146,15 @@
<script id="listbox-template" type="text/x-handlebars-template"> <script id="listbox-template" type="text/x-handlebars-template">
<div class="ui-table-header ui-header ui-bar-c ui-corner-all"> <div class="ui-table-header ui-header ui-bar-c ui-corner-all">
<h1 data-i18n="{{title}}" class="ui-title ui-override-theme">{{title}}<span> <span class="listboxloader ui-icon-spinner ui-btn-icon-left"></span></span></h1> <h1 data-i18n="{{title}}" class="ui-title ui-override-theme">{{title}}<span> <span class="listboxloader ui-icon-spinner ui-btn-icon-left"></span></span></h1>
<button {{disabled}} data-rel="hide" data-i18n="{{hide_button_text}}" name="{{hide_button_name}}" type="button" class="submit responsive ui-last-child ui-btn ui-icon-low-vision ui-btn-icon-left {{hide_class}}">{{hide_button_text}}</button> {{#if show_line_selector}}
<button {{disabled}} data-rel="configure_columns" data-i18n="Configure" name="Configure" type="button" class="submit responsive ui-last-child ui-btn ui-icon-wrench ui-btn-icon-left {{configure_class}}">Configure</button> <button data-rel="hide" data-i18n="Include" name="IncludeRows" type="button" class="submit responsive ui-last-child ui-btn ui-icon-eye ui-btn-icon-left {{hide_class}}">Include</button>
<button {{disabled}} data-rel="Sort" data-i18n="Sort" name="Sort" type="button" class="submit responsive ui-last-child ui-btn ui-icon-sort-amount-desc ui-btn-icon-left {{sort_class}}">Sort</button> <button data-rel="hide" data-i18n="Exclude" name="ExcludeRows" type="button" class="submit responsive ui-last-child ui-btn ui-icon-low-vision ui-btn-icon-left {{hide_class}}">Exclude</button>
{{else}}
<button {{disabled}} data-rel="hide" data-i18n="Select" name="Hide" type="button" class="submit responsive ui-last-child ui-btn ui-icon-check-square-o ui-btn-icon-left {{hide_class}}">Select</button>
<button {{disabled}} data-rel="configure_columns" data-i18n="Configure" name="Configure" type="button" class="submit responsive ui-last-child ui-btn ui-icon-wrench ui-btn-icon-left {{configure_class}}">Configure</button>
<button {{disabled}} data-rel="Sort" data-i18n="Sort" name="Sort" type="button" class="submit responsive ui-last-child ui-btn ui-icon-sort-amount-desc ui-btn-icon-left {{sort_class}}">Sort</button>
{{/if}}
</div> </div>
<table class="ui-responsive ui-body-c ui-table-inset"> <table class="ui-responsive ui-body-c ui-table-inset">
<thead class="ui-bar-inherit thead"></thead> <thead class="ui-bar-inherit thead"></thead>
......
...@@ -234,7 +234,7 @@ ...@@ -234,7 +234,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>966.44549.11438.13482</string> </value> <value> <string>969.29331.16354.12578</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -252,8 +252,8 @@ ...@@ -252,8 +252,8 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1523030835.06</float> <float>1533741353.34</float>
<string>GMT+2</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
</object> </object>
......
...@@ -5,23 +5,15 @@ ...@@ -5,23 +5,15 @@
SimpleQuery, ComplexQuery, Query, Handlebars, console, QueryFactory) { SimpleQuery, ComplexQuery, Query, Handlebars, console, QueryFactory) {
"use strict"; "use strict";
var gadget_klass = rJS(window), var gadget_klass = rJS(window),
listbox_hidden_thead_source = gadget_klass.__template_element listbox_thead_source = gadget_klass.__template_element
.getElementById("listbox-hidden-thead-template") .getElementById("listbox-thead-template")
.innerHTML, .innerHTML,
listbox_hidden_thead_template = Handlebars.compile(listbox_hidden_thead_source), listbox_thead_template = Handlebars.compile(listbox_thead_source),
listbox_show_thead_source = gadget_klass.__template_element
.getElementById("listbox-show-thead-template")
.innerHTML,
listbox_show_thead_template = Handlebars.compile(listbox_show_thead_source),
listbox_hidden_tbody_source = gadget_klass.__template_element listbox_tbody_source = gadget_klass.__template_element
.getElementById("listbox-hidden-tbody-template") .getElementById("listbox-tbody-template")
.innerHTML,
listbox_hidden_tbody_template = Handlebars.compile(listbox_hidden_tbody_source),
listbox_show_tbody_source = gadget_klass.__template_element
.getElementById("listbox-show-tbody-template")
.innerHTML, .innerHTML,
listbox_show_tbody_template = Handlebars.compile(listbox_show_tbody_source), listbox_tbody_template = Handlebars.compile(listbox_tbody_source),
listbox_tfoot_source = gadget_klass.__template_element listbox_tfoot_source = gadget_klass.__template_element
.getElementById("listbox-tfoot-template") .getElementById("listbox-tfoot-template")
...@@ -100,7 +92,8 @@ ...@@ -100,7 +92,8 @@
container.innerHTML = template({ container.innerHTML = template({
"row_list": row_list, "row_list": row_list,
"show_anchor": gadget.state.show_anchor, "show_anchor": gadget.state.show_anchor,
"column_list": column_list "column_list": column_list,
"show_line_selector": gadget.state.show_line_selector
}); });
return new RSVP.Queue() return new RSVP.Queue()
.push(function () { .push(function () {
...@@ -401,8 +394,7 @@ ...@@ -401,8 +394,7 @@
.push(function (column_sort_link_list) { .push(function (column_sort_link_list) {
// here we obtain links for sorting by columns // here we obtain links for sorting by columns
// so we can construct array of header objects to be rendered in the header template // so we can construct array of header objects to be rendered in the header template
var listbox_thead_template, var hide_button_text,
hide_button_text,
hide_button_name, hide_button_name,
head_value_list = column_list.map(function (column, index) { head_value_list = column_list.map(function (column, index) {
var current_sort = sort_list.find(hasSameFirstItem(column)), var current_sort = sort_list.find(hasSameFirstItem(column)),
...@@ -425,12 +417,10 @@ ...@@ -425,12 +417,10 @@
}); });
if (gadget.state.show_line_selector) { if (gadget.state.show_line_selector) {
listbox_thead_template = listbox_show_thead_template;
hide_button_text = 'Submit'; hide_button_text = 'Submit';
hide_button_name = 'SelectRows'; hide_button_name = 'SelectRows';
} else { } else {
listbox_thead_template = listbox_hidden_thead_template; hide_button_text = 'Select';
hide_button_text = 'Hide Rows';
hide_button_name = 'Hide'; hide_button_name = 'Hide';
} }
return RSVP.all([ return RSVP.all([
...@@ -441,12 +431,14 @@ ...@@ -441,12 +431,14 @@
title: gadget.state.title, title: gadget.state.title,
hide_button_text: hide_button_text, hide_button_text: hide_button_text,
hide_button_name: hide_button_name, hide_button_name: hide_button_name,
disabled: gadget.state.disabled ? 'disabled' : '' disabled: gadget.state.disabled ? 'disabled' : '',
show_line_selector: gadget.state.show_line_selector
})), })),
gadget.translateHtml(listbox_thead_template({ gadget.translateHtml(listbox_thead_template({
head_value: head_value_list, head_value: head_value_list,
show_anchor: gadget.state.show_anchor, show_anchor: gadget.state.show_anchor,
line_icon: gadget.state.line_icon line_icon: gadget.state.line_icon,
show_line_selector: gadget.state.show_line_selector
})) }))
]); ]);
}) })
...@@ -526,7 +518,6 @@ ...@@ -526,7 +518,6 @@
cell_list, cell_list,
url_value, url_value,
index = 0, index = 0,
listbox_tbody_template,
setNonEditable = function (cell) {cell.editable = false; }; setNonEditable = function (cell) {cell.editable = false; };
// reset list of UIDs of editable sub-documents // reset list of UIDs of editable sub-documents
gadget.props.listbox_uid_dict = { gadget.props.listbox_uid_dict = {
...@@ -596,12 +587,6 @@ ...@@ -596,12 +587,6 @@
}); });
} }
if (gadget.state.show_line_selector) {
listbox_tbody_template = listbox_show_tbody_template;
} else {
listbox_tbody_template = listbox_hidden_tbody_template;
}
return renderTablePart(gadget, listbox_tbody_template, row_list, "tbody"); return renderTablePart(gadget, listbox_tbody_template, row_list, "tbody");
}) })
.push(function () { .push(function () {
...@@ -852,7 +837,8 @@ ...@@ -852,7 +837,8 @@
sort_button = gadget.element.querySelector('button[name="Sort"]'), sort_button = gadget.element.querySelector('button[name="Sort"]'),
hide_button = gadget.element.querySelector('button[name="Hide"]'), hide_button = gadget.element.querySelector('button[name="Hide"]'),
configure_button = gadget.element.querySelector('button[name="Configure"]'), configure_button = gadget.element.querySelector('button[name="Configure"]'),
select_button = gadget.element.querySelector('button[name="SelectRows"]'), include_button = gadget.element.querySelector('button[name="IncludeRows"]'),
exclude_button = gadget.element.querySelector('button[name="ExcludeRows"]'),
url, url,
options = {}, options = {},
all_hide_element_list, all_hide_element_list,
...@@ -886,14 +872,14 @@ ...@@ -886,14 +872,14 @@
}); });
} }
if (evt.target === select_button) { if ((evt.target === include_button) || (evt.target === exclude_button)) {
evt.preventDefault(); evt.preventDefault();
//hide closed //hide closed
//maybe submit //maybe submit
all_hide_element_list = gadget.element.querySelectorAll(".hide_element"); all_hide_element_list = gadget.element.querySelectorAll(".hide_element");
for (i = 0; i < all_hide_element_list.length; i += 1) { for (i = 0; i < all_hide_element_list.length; i += 1) {
if (!all_hide_element_list[i].checked) { if (all_hide_element_list[i].checked) {
hide_element_list.push(all_hide_element_list[i]); hide_element_list.push(all_hide_element_list[i]);
} }
} }
...@@ -902,21 +888,50 @@ ...@@ -902,21 +888,50 @@
query_list.push(new SimpleQuery({ query_list.push(new SimpleQuery({
key: "catalog.uid", key: "catalog.uid",
type: "simple", type: "simple",
operator: "!=", operator: (evt.target === include_button) ? "=" : "!=",
value: hide_element_list[i].getAttribute("value") value: hide_element_list[i].getAttribute("data-uid")
})); }));
} }
if (gadget.state.extended_search) { if (gadget.state.extended_search) {
search_query = QueryFactory.create(gadget.state.extended_search); search_query = QueryFactory.create(gadget.state.extended_search);
} }
if (search_query) { if (evt.target === include_button) {
query_list.push(search_query); // Lines must match the existing query and be one of the selected
// line. Which means that is user change the query, one of the
// selected line could disappear.
if (search_query) {
search_query = new ComplexQuery({
operator: "AND",
query_list: [
new ComplexQuery({
operator: "OR",
query_list: query_list,
type: "complex"
}),
search_query
],
type: "complex"
});
} else {
search_query = new ComplexQuery({
operator: "OR",
query_list: query_list,
type: "complex"
});
}
} else {
// Lines must match the existing query and must not be one of the
// selected line.
if (search_query) {
query_list.push(search_query);
}
search_query = new ComplexQuery({
operator: "AND",
query_list: query_list,
type: "complex"
});
} }
search_query = new ComplexQuery({
operator: "AND",
query_list: query_list,
type: "complex"
});
return gadget.redirect({ return gadget.redirect({
command: 'store_and_change', command: 'store_and_change',
......
...@@ -236,7 +236,7 @@ ...@@ -236,7 +236,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>967.65060.33188.22937</string> </value> <value> <string>969.29026.17236.63829</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>1528107178.27</float> <float>1533741912.73</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -1457,7 +1457,9 @@ div[data-gadget-scope='erp5_searchfield'] div.search_parsed_value button { ...@@ -1457,7 +1457,9 @@ div[data-gadget-scope='erp5_searchfield'] div.search_parsed_value button {
width: 100%; width: 100%;
} }
.document_table table tbody tr td:first-child a, .document_table table tbody tr td:first-child a,
.document_table table tbody tr th:first-child a { .document_table table tbody tr th:first-child a,
.document_table table tbody tr td:first-child label,
.document_table table tbody tr th:first-child label {
position: absolute; position: absolute;
width: 100%; width: 100%;
top: 0; top: 0;
...@@ -1493,14 +1495,22 @@ div[data-gadget-scope='erp5_searchfield'] div.search_parsed_value button { ...@@ -1493,14 +1495,22 @@ div[data-gadget-scope='erp5_searchfield'] div.search_parsed_value button {
.document_table table tbody tr td:first-child ~ th a, .document_table table tbody tr td:first-child ~ th a,
.document_table table tbody tr th:first-child ~ th a, .document_table table tbody tr th:first-child ~ th a,
.document_table table tbody tr td:first-child ~ td a, .document_table table tbody tr td:first-child ~ td a,
.document_table table tbody tr th:first-child ~ td a { .document_table table tbody tr th:first-child ~ td a,
.document_table table tbody tr td:first-child ~ th label,
.document_table table tbody tr th:first-child ~ th label,
.document_table table tbody tr td:first-child ~ td label,
.document_table table tbody tr th:first-child ~ td label {
pointer-events: none; pointer-events: none;
color: #767676; color: #767676;
} }
.document_table table tbody tr td:first-child ~ th:not(:last-child) a:not(:empty):after, .document_table table tbody tr td:first-child ~ th:not(:last-child) a:not(:empty):after,
.document_table table tbody tr th:first-child ~ th:not(:last-child) a:not(:empty):after, .document_table table tbody tr th:first-child ~ th:not(:last-child) a:not(:empty):after,
.document_table table tbody tr td:first-child ~ td:not(:last-child) a:not(:empty):after, .document_table table tbody tr td:first-child ~ td:not(:last-child) a:not(:empty):after,
.document_table table tbody tr th:first-child ~ td:not(:last-child) a:not(:empty):after { .document_table table tbody tr th:first-child ~ td:not(:last-child) a:not(:empty):after,
.document_table table tbody tr td:first-child ~ th:not(:last-child) label:not(:empty):after,
.document_table table tbody tr th:first-child ~ th:not(:last-child) label:not(:empty):after,
.document_table table tbody tr td:first-child ~ td:not(:last-child) label:not(:empty):after,
.document_table table tbody tr th:first-child ~ td:not(:last-child) label:not(:empty):after {
content: " ~ "; content: " ~ ";
} }
} }
...@@ -1510,7 +1520,7 @@ div[data-gadget-scope='erp5_searchfield'] div.search_parsed_value button { ...@@ -1510,7 +1520,7 @@ div[data-gadget-scope='erp5_searchfield'] div.search_parsed_value button {
border-top: 2px solid rgba(0, 0, 0, 0.14902); border-top: 2px solid rgba(0, 0, 0, 0.14902);
} }
.document_table nav span { .document_table nav span {
opacity: .3; opacity: 0.3;
flex: 2; flex: 2;
text-align: right; text-align: right;
float: right; float: right;
...@@ -1548,6 +1558,24 @@ div[data-gadget-scope='erp5_searchfield'] div.search_parsed_value button { ...@@ -1548,6 +1558,24 @@ div[data-gadget-scope='erp5_searchfield'] div.search_parsed_value button {
text-indent: 6pt; text-indent: 6pt;
} }
} }
.document_table tbody tr td:first-child input.hide_element[type="checkbox"] {
display: none;
}
.document_table tbody tr td:first-child input.hide_element[type="checkbox"] + label::before {
width: 1em;
display: inline-block;
font-weight: bold;
content: '☐';
color: rgba(0, 0, 0, 0.3);
margin-right: 6pt;
}
.document_table tbody tr td:first-child input.hide_element[type="checkbox"]:checked + label::before {
color: #1F1F1F;
content: '☒';
}
.document_table tbody tr td label {
cursor: pointer;
}
/********************************************** /**********************************************
* Notification * Notification
**********************************************/ **********************************************/
...@@ -1608,7 +1636,7 @@ div[data-gadget-scope='notification'] button.error { ...@@ -1608,7 +1636,7 @@ div[data-gadget-scope='notification'] button.error {
* JQM * JQM
**********************************************/ **********************************************/
.ui-disabled { .ui-disabled {
opacity: .3; opacity: 0.3;
cursor: default; cursor: default;
pointer-events: none; pointer-events: none;
} }
...@@ -1791,7 +1819,7 @@ div[data-gadget-url$="gadget_erp5_page_front.html"] > ul > li li { ...@@ -1791,7 +1819,7 @@ div[data-gadget-url$="gadget_erp5_page_front.html"] > ul > li li {
} }
.ui-icon-spinner::before { .ui-icon-spinner::before {
content: "\f110"; content: "\f110";
animation: spin .5s infinite linear; animation: spin 0.5s infinite linear;
} }
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */ readers do not read off random characters that represent 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>968.25443.27134.59272</string> </value> <value> <string>969.29269.48025.33672</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>1529663033.9</float> <float>1533737913.65</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -1699,8 +1699,8 @@ div[data-gadget-scope='erp5_searchfield'] { ...@@ -1699,8 +1699,8 @@ div[data-gadget-scope='erp5_searchfield'] {
display: inline-block; display: inline-block;
width: 100%; width: 100%;
a { a, label {
// stretch first link to full width (positioned relative to <tr>) // stretch first link/label to full width (positioned relative to <tr>)
position: absolute; position: absolute;
width: 100%; width: 100%;
top: 0; top: 0;
...@@ -1710,24 +1710,25 @@ div[data-gadget-scope='erp5_searchfield'] { ...@@ -1710,24 +1710,25 @@ div[data-gadget-scope='erp5_searchfield'] {
text-overflow: ellipsis; text-overflow: ellipsis;
// Reduce the gap between the first and second visible lines // Reduce the gap between the first and second visible lines
padding-top: @margin-size; padding-top: @margin-size;
}
&:after { // In link mode, lines will display a icon on the right
// XXX copy/pasted // So that user knows he can goes to the document line
font-family: FontAwesome; a:after {
content: "\f0da"; // XXX copy/pasted
font-size: 1.25em; font-family: FontAwesome;
position: absolute; content: "\f0da";
right: @margin-size; font-size: 1.25em;
top: 50%; position: absolute;
margin-top: -0.75em; right: @margin-size;
top: 50%;
background-color: @colorbackground; margin-top: -0.75em;
border-radius: 0.5em;
width: 1em; background-color: @colorbackground;
text-align: center; border-radius: 0.5em;
line-height: 1em; width: 1em;
} text-align: center;
line-height: 1em;
} }
~ th, ~ td { ~ th, ~ td {
...@@ -1738,15 +1739,19 @@ div[data-gadget-scope='erp5_searchfield'] { ...@@ -1738,15 +1739,19 @@ div[data-gadget-scope='erp5_searchfield'] {
display: inline; display: inline;
word-break: break-word; word-break: break-word;
a { a, label {
pointer-events: none; pointer-events: none;
// Add contrast with the first column content // Add contrast with the first column content
color: @grey; color: @grey;
} }
&:not(:last-child) a:not(:empty):after { &:not(:last-child) {
// add tide a, label {
content: " ~ "; &:not(:empty):after {
// add tide
content: " ~ ";
}
}
} }
} }
} }
...@@ -1792,6 +1797,43 @@ div[data-gadget-scope='erp5_searchfield'] { ...@@ -1792,6 +1797,43 @@ div[data-gadget-scope='erp5_searchfield'] {
} }
} }
} }
tbody {
tr {
td {
// In select mode, hide the listbox line checkbox.
// Instead, display an icon before the first label
// (it is only to make the checkbox rendering nicer)
&:first-child {
input.hide_element[type="checkbox"] {
display: none;
& + label::before {
width: 1em;
display: inline-block;
font-weight: bold;
content: '☐';
color: @border-color;
margin-right: @margin-size;
}
&:checked + label {
// font-weight: bold;
&::before {
color: @colortextboxforeground;
content: '☒';
}
}
}
}
label {
// Show a pointer on top of label so that user knows he can click
// to change the checkbox
cursor: pointer;
}
}
}
}
} }
/********************************************** /**********************************************
......
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
<tr> <tr>
<td>click</td> <td>click</td>
<td>//button[@data-i18n="Hide Rows"]</td> <td>//button[@data-i18n="Select"]</td>
<td></td> <td></td>
</tr> </tr>
......
...@@ -42,7 +42,7 @@ ...@@ -42,7 +42,7 @@
</item> </item>
<item> <item>
<key> <string>id</string> </key> <key> <string>id</string> </key>
<value> <string>testHideItem</string> </value> <value> <string>testFormListExcludeItem</string> </value>
</item> </item>
<item> <item>
<key> <string>output_encoding</string> </key> <key> <string>output_encoding</string> </key>
......
<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 RenderJS UI</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
</thead><tbody>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
<!-- Clean Up -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/ListBoxZuite_reset</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Reset Successfully.</td>
<td></td>
</tr>
<!-- should create in new ui instead of using script -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/FooModule_createObjects</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Created Successfully.</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
<!-- Initialize and sort by ID -->
<tr>
<td>open</td>
<td>${base_url}/web_site_module/renderjs_runner/#/foo_module?field_listbox_sort_list%3Ajson=%5B%5B"id"%2C"ascending"%5D%5D&amp;page=form&amp;view=view</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_app_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_select" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<!-- Line checkbox -->
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tal:block tal:define="line_configuration python: {'line': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/select_listbox_line" />
</tal:block>
<tal:block tal:define="line_configuration python: {'line': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/select_listbox_line" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/exclude_selected_line" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/assert_listbox_not_selectable" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 8)', 'footer': 'Records 1 - 3 / 8'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementNotPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 3', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 4', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_filter_and" />
</tbody></table>
</body>
</html>
\ No newline at end of file
<?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>testFormListExcludeItemWithPreviousFilter</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 RenderJS UI</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
</thead><tbody>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
<!-- Clean Up -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/ListBoxZuite_reset</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Reset Successfully.</td>
<td></td>
</tr>
<!-- should create in new ui instead of using script -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/FooModule_createObjects</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Created Successfully.</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
<!-- Initialize and sort by ID -->
<tr>
<td>open</td>
<td>${base_url}/web_site_module/renderjs_runner/#/foo_module?extended_search=%20"title"&amp;field_listbox_sort_list%3Ajson=%5B%5B"id"%2C"ascending"%5D%5D&amp;page=form&amp;view=view</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_app_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_select" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<!-- Line checkbox -->
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tal:block tal:define="line_configuration python: {'line': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/select_listbox_line" />
</tal:block>
<tal:block tal:define="line_configuration python: {'line': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/select_listbox_line" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/exclude_selected_line" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/assert_listbox_not_selectable" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 8)', 'footer': 'Records 1 - 3 / 8'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementNotPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 3', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 4', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_filter_and" />
<tal:block tal:define="filter_section_configuration python: {'key': 'TEXT', 'value': 'title', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_filter_section" />
</tal:block>
</tbody></table>
</body>
</html>
\ No newline at end of file
<?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>testFormListExcludeItemWithoutSelecting</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>
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
<!-- Clean Up --> <!-- Clean Up -->
<tr> <tr>
<td>open</td> <td>open</td>
<td>${base_url}/bar_module/ListBoxZuite_reset</td> <td>${base_url}/foo_module/ListBoxZuite_reset</td>
<td></td> <td></td>
</tr> </tr>
...@@ -37,10 +37,10 @@ ...@@ -37,10 +37,10 @@
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" /> <tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
<!-- Initialize --> <!-- Initialize and sort by ID -->
<tr> <tr>
<td>open</td> <td>open</td>
<td>${base_url}/web_site_module/renderjs_runner/#/foo_module</td> <td>${base_url}/web_site_module/renderjs_runner/#/foo_module?extended_search=%20"title"&amp;field_listbox_sort_list%3Ajson=%5B%5B"id"%2C"ascending"%5D%5D&amp;page=form&amp;view=view</td>
<td></td> <td></td>
</tr> </tr>
...@@ -49,108 +49,7 @@ ...@@ -49,108 +49,7 @@
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" /> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block> </tal:block>
<!-- Sort by ID --> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_select" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_sort" />
<tr>
<td>waitForElementPresent</td>
<td>//button[@class='plus ui-btn-c ui-override-theme ui-btn ui-icon-plus ui-btn-icon-left ui-corner-all']</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//button[@class='plus ui-btn-c ui-override-theme ui-btn ui-icon-plus ui-btn-icon-left ui-corner-all']</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[@class='sort_item_container ui-controlgroup ui-corner_all']/div[1]</td>
<td></td>
</tr>
<tr>
<td>select</td>
<td>//div[@class='sort_item_container ui-controlgroup ui-corner_all']/div[1]//select[2]</td>
<td>index=0</td>
</tr>
<tr>
<td>click</td>
<td>//button[@class="submit responsive ui-last-child ui-btn ui-btn-icon-left ui-icon-check"]</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_content_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>assertElementPresent</td>
<td>link=Title 0</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 1</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 2</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 3</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 4</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//button[@data-i18n='Hide Rows']</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tr>
<td>assertText</td>
<td>//thead/tr/th[1]</td>
<td>ID</td>
</tr>
<tr>
<td>assertText</td>
<td>//thead/tr/th[2]</td>
<td>Title</td>
</tr>
<tr>
<td>assertText</td>
<td>//thead/tr/th[3]</td>
<td>Quantity</td>
</tr>
<tr>
<td>click</td>
<td>//button[@data-i18n='Hide Rows']</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" /> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}"> <tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" /> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
...@@ -163,170 +62,45 @@ ...@@ -163,170 +62,45 @@
</tr> </tr>
<!-- Check the listbox column header --> <!-- Check the listbox column header -->
<tr> <tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<td>assertText</td> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
<td>//thead/tr/th[1]</td> </tal:block>
<td></td> <tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
</tr> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
<tr> </tal:block>
<td>assertText</td> <tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<td>//thead/tr/th[2]</td> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
<td>ID</td>
</tr>
<tr>
<td>assertText</td>
<td>//thead/tr/th[3]</td>
<td>Title</td>
</tr>
<tr>
<td>assertText</td>
<td>//thead/tr/th[4]</td>
<td>Quantity</td>
</tr>
<!-- Line checkbox -->
<tr>
<td>verifyValue</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td>on</td>
</tr>
<tr>
<td>click</td>
<td>//tbody/tr[2]/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//tbody/tr[3]/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//button[@name='SelectRows']</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_content_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 8)', 'footer': 'Records 1 - 3 / 8'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block> </tal:block>
<tr> <!-- Check the listbox cell -->
<td>waitForElementNotPresent</td> <tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<td>//tbody/tr/td/input[@type="checkbox"]</td> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
<td></td> </tal:block>
</tr> <tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 1, 'index': 1}">
<tr> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
<td>waitForElementPresent</td> </tal:block>
<td>//tbody/tr/td</td> <tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 2, 'index': 1}">
<td></td> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tr> </tal:block>
<!-- Check the listbox column header -->
<tr>
<td>assertText</td>
<td>//thead/tr/th[1]</td>
<td>ID</td>
</tr>
<tr>
<td>assertText</td>
<td>//thead/tr/th[2]</td>
<td>Title</td>
</tr>
<tr>
<td>assertText</td>
<td>//thead/tr/th[3]</td>
<td>Quantity</td>
</tr>
<!-- only one element present -->
<tr>
<td>verifyElementPresent</td>
<td>//tbody/tr/td</td>
<td></td>
</tr>
<tr> <!-- Line checkbox -->
<td>verifyElementNotPresent</td> <tal:block tal:define="line_configuration python: {'value': 'off', 'line': 0}">
<td>//input[@value='1']</td> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
<td></td> </tal:block>
</tr> <tal:block tal:define="line_configuration python: {'value': 'off', 'line': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tr>
<td>verifyElementNotPresent</td>
<td>//input[@value='2']</td>
<td></td>
</tr>
<tr> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/exclude_selected_line" />
<td>assertElementPresent</td>
<td>link=Title 0</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 1</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 2</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 3</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 4</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//button[@data-i18n='Hide Rows']</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" /> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/assert_listbox_not_selectable" />
<tr> <tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<td>waitForElementPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<tr>
<td>verifyValue</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td>on</td>
</tr>
<tr>
<td>click</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//button[@name='SelectRows']</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_content_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 7)', 'footer': 'Records 1 - 3 / 7'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" /> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block> </tal:block>
...@@ -335,95 +109,33 @@ ...@@ -335,95 +109,33 @@
<td>//tbody/tr/td/input[@type="checkbox"]</td> <td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td> <td></td>
</tr> </tr>
<tr>
<td>waitForElementPresent</td>
<td>//tbody/tr/td</td>
<td></td>
</tr>
<tr>
<td>verifyElementNotPresent</td>
<td>//input[@value='0']</td>
<td></td>
</tr>
<tr>
<td>verifyElementNotPresent</td>
<td>//input[@value='1']</td>
<td></td>
</tr>
<tr>
<td>verifyElementNotPresent</td>
<td>//input[@value='2']</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 0</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 1</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 2</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 3</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 4</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 5</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/clear_query" /> <!-- Check the listbox cell -->
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}"> <tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" /> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block> </tal:block>
<tr> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_filter_and" />
<td>assertElementPresent</td> <tal:block tal:define="filter_section_configuration python: {'key': 'TEXT', 'value': 'title', 'index': 0}">
<td>link=Title 0</td> <tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_filter_section" />
<td></td> </tal:block>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 1</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>link=Title 2</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 3</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>link=Title 4</td>
<td></td>
</tr>
</tbody></table> </tbody></table>
......
<?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>testFormListIncludeItem</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 RenderJS UI</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
</thead><tbody>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
<!-- Clean Up -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/ListBoxZuite_reset</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Reset Successfully.</td>
<td></td>
</tr>
<!-- should create in new ui instead of using script -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/FooModule_createObjects</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Created Successfully.</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
<!-- Initialize and sort by ID -->
<tr>
<td>open</td>
<td>${base_url}/web_site_module/renderjs_runner/#/foo_module?field_listbox_sort_list%3Ajson=%5B%5B"id"%2C"ascending"%5D%5D&amp;page=form&amp;view=view</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_app_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_select" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<!-- Line checkbox -->
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tal:block tal:define="line_configuration python: {'line': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/select_listbox_line" />
</tal:block>
<tal:block tal:define="line_configuration python: {'line': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/select_listbox_line" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/include_selected_line" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/assert_listbox_not_selectable" />
<tal:block tal:define="pagination_configuration python: {'header': '(2)', 'footer': '2 Records'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementNotPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_filter_or" />
</tbody></table>
</body>
</html>
\ No newline at end of file
<?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>testFormListIncludeItemWithPreviousFilter</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 RenderJS UI</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
</thead><tbody>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
<!-- Clean Up -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/ListBoxZuite_reset</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Reset Successfully.</td>
<td></td>
</tr>
<!-- should create in new ui instead of using script -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/FooModule_createObjects</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Created Successfully.</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
<!-- Initialize and sort by ID -->
<tr>
<td>open</td>
<td>${base_url}/web_site_module/renderjs_runner/#/foo_module?extended_search=%20"title"&amp;field_listbox_sort_list%3Ajson=%5B%5B"id"%2C"ascending"%5D%5D&amp;page=form&amp;view=view</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_app_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_select" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<!-- Line checkbox -->
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tal:block tal:define="line_configuration python: {'line': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/select_listbox_line" />
</tal:block>
<tal:block tal:define="line_configuration python: {'line': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/select_listbox_line" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/include_selected_line" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/assert_listbox_not_selectable" />
<tal:block tal:define="pagination_configuration python: {'header': '(2)', 'footer': '2 Records'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementNotPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_filter_and" />
<tal:block tal:define="filter_section_configuration python: {'key': 'TEXT', 'value': 'title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_filter_section" />
</tal:block>
</tbody></table>
</body>
</html>
\ No newline at end of file
<?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>testFormListIncludeItemWithoutSelecting</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 RenderJS UI</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
</thead><tbody>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
<!-- Clean Up -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/ListBoxZuite_reset</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Reset Successfully.</td>
<td></td>
</tr>
<!-- should create in new ui instead of using script -->
<tr>
<td>open</td>
<td>${base_url}/foo_module/FooModule_createObjects</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>Created Successfully.</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
<!-- Initialize and sort by ID -->
<tr>
<td>open</td>
<td>${base_url}/web_site_module/renderjs_runner/#/foo_module?extended_search=%20"title"&amp;field_listbox_sort_list%3Ajson=%5B%5B"id"%2C"ascending"%5D%5D&amp;page=form&amp;view=view</td>
<td></td>
</tr>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_app_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_select" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<!-- Line checkbox -->
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/include_selected_line" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/wait_for_listbox_loaded" />
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/assert_listbox_not_selectable" />
<tal:block tal:define="pagination_configuration python: {'header': '(1 - 3 / 10)', 'footer': 'Records 1 - 3 / 10'}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_pagination_text" />
</tal:block>
<tr>
<td>waitForElementNotPresent</td>
<td>//tbody/tr/td/input[@type="checkbox"]</td>
<td></td>
</tr>
<!-- Check the listbox column header -->
<tal:block tal:define="header_configuration python: {'text': 'ID', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Title', 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<tal:block tal:define="header_configuration python: {'text': 'Quantity', 'index': 2}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_header" />
</tal:block>
<!-- Check the listbox cell -->
<tal:block tal:define="cell_configuration python: {'text': 'Title 0', 'line': 0, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 1', 'line': 1, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block tal:define="cell_configuration python: {'text': 'Title 2', 'line': 2, 'index': 1}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_cell_text" />
</tal:block>
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/triggle_filter_and" />
<tal:block tal:define="filter_section_configuration python: {'key': 'TEXT', 'value': 'title', 'index': 0}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_filter_section" />
</tal:block>
</tbody></table>
</body>
</html>
\ No newline at end of file
...@@ -58,7 +58,7 @@ ...@@ -58,7 +58,7 @@
<tr> <tr>
<td>verifyElementPresent</td> <td>verifyElementPresent</td>
<td>//button[text() = 'yanchanlie']</td> <td>//button[text() = 'xuanze']</td>
<td></td> <td></td>
</tr> </tr>
......
...@@ -47,7 +47,7 @@ param_dict = [ ...@@ -47,7 +47,7 @@ param_dict = [
{ 'message': 'Select Template', 'translation': 'xuanzhemoban', 'language': 'wo'}, { 'message': 'Select Template', 'translation': 'xuanzhemoban', 'language': 'wo'},
{ 'message': 'descending', 'translation': 'xiajiang', 'language': 'wo'}, { 'message': 'descending', 'translation': 'xiajiang', 'language': 'wo'},
{ 'message': 'Views', 'translation': 'shitu', 'language': 'wo'}, { 'message': 'Views', 'translation': 'shitu', 'language': 'wo'},
{ 'message': 'Hide Rows', 'translation': 'yanchanlie', 'language': 'wo'}, { 'message': 'Select', 'translation': 'xuanze', 'language': 'wo'},
{ 'message': 'Jump', 'translation': 'tiaozhuan', 'language': 'wo'}, { 'message': 'Jump', 'translation': 'tiaozhuan', 'language': 'wo'},
{ 'message': 'Export', 'translation': 'daochu', 'language': 'wo'}, { 'message': 'Export', 'translation': 'daochu', 'language': 'wo'},
{ 'message': 'At least one (OR)', 'translation': 'zhishaoyige', 'language': 'wo'}, { 'message': 'At least one (OR)', 'translation': 'zhishaoyige', 'language': 'wo'},
......
...@@ -1156,4 +1156,179 @@ ...@@ -1156,4 +1156,179 @@
</tr> </tr>
</tal:block> </tal:block>
<tal:block metal:define-macro="triggle_select">
<tr>
<td colspan="3"><b>Switch to select mode</b></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@data-i18n='Select']</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@data-i18n='Select']</td>
<td></td>
</tr>
<tr>
<td>waitForElementNotPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@data-i18n='Select' and @disabled]</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@data-i18n='Select']</td>
<td></td>
</tr>
<tr>
<td>waitForElementNotPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@data-i18n='Select']</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@data-i18n='Select']</td>
<td></td>
</tr>
<tr>
<td colspan="3"><p></p></td>
</tr>
</tal:block>
<tal:block metal:define-macro="check_listbox_cell_text">
<tr>
<td colspan="3"><b tal:content="python: 'Check the listbox cell %(line)i %(index)i' % cell_configuration"></b></td>
</tr>
<tr>
<td>verifyText</td>
<td tal:content="python: '//div[contains(@data-gadget-url, \'gadget_erp5_field_listbox.html\')]//tbody/tr[%i]/td[%i]' % (cell_configuration['line'] + 1, cell_configuration['index'] + 1)"></td>
<td tal:content="python: cell_configuration['text']"></td>
</tr>
<tr>
<td colspan="3"><p></p></td>
</tr>
</tal:block>
<tal:block metal:define-macro="check_listbox_line_selection">
<tr>
<td colspan="3"><b tal:content="python: 'Check the listbox line selection %(line)i' % line_configuration"></b></td>
</tr>
<tr>
<td>verifyValue</td>
<td tal:content="python: '//div[contains(@data-gadget-url, \'gadget_erp5_field_listbox.html\')]//tbody/tr[%i]/td/input[@type=\'checkbox\'][@class=\'hide_element\']' % (line_configuration['line'] + 1)"></td>
<td tal:content="python: line_configuration['value']"></td>
</tr>
<tr>
<td colspan="3"><p></p></td>
</tr>
</tal:block>
<tal:block metal:define-macro="select_listbox_line">
<tr>
<td colspan="3"><b tal:content="python: 'Select the listbox line %(line)i' % line_configuration"></b></td>
</tr>
<tal:block tal:define="line_configuration python: {'value': 'off', 'line': line_configuration['line']}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tr>
<td>click</td>
<td tal:content="python: '//div[contains(@data-gadget-url, \'gadget_erp5_field_listbox.html\')]//tbody/tr[%i]/td/label' % (line_configuration['line'] + 1)"></td>
<td></td>
</tr>
<tal:block tal:define="line_configuration python: {'value': 'on', 'line': line_configuration['line']}">
<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/check_listbox_line_selection" />
</tal:block>
<tr>
<td colspan="3"><p></p></td>
</tr>
</tal:block>
<tal:block metal:define-macro="include_selected_line">
<tr>
<td colspan="3"><b>Include selected lines</b></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='IncludeRows']</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='IncludeRows']</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='IncludeRows']</td>
<td></td>
</tr>
<tr>
<td>waitForElementNotPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='IncludeRows']</td>
<td></td>
</tr>
<tr>
<td colspan="3"><p></p></td>
</tr>
</tal:block>
<tal:block metal:define-macro="exclude_selected_line">
<tr>
<td colspan="3"><b>Exclude selected lines</b></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='ExcludeRows']</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='ExcludeRows']</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='ExcludeRows']</td>
<td></td>
</tr>
<tr>
<td>waitForElementNotPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='ExcludeRows']</td>
<td></td>
</tr>
<tr>
<td colspan="3"><p></p></td>
</tr>
</tal:block>
<tal:block metal:define-macro="assert_listbox_not_selectable">
<tr>
<td colspan="3"><b tal:content="python: 'Check the listbox is not in select mode'"></b></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='IncludeRows']</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@name='ExcludeRows']</td>
<td></td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>//div[contains(@data-gadget-url, 'gadget_erp5_field_listbox.html')]//button[@data-i18n='Select']</td>
<td></td>
</tr>
<tr>
<td>assertElementNotPresent</td>
<td tal:content="python: '//div[contains(@data-gadget-url, \'gadget_erp5_field_listbox.html\')]//tbody/tr/td/input[@type=\'checkbox\'][@class=\'hide_element\']'"></td>
<td></td>
</tr>
<tr>
<td colspan="3"><p></p></td>
</tr>
</tal:block>
</tal:block> </tal:block>
\ 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