Commit 162f46b0 authored by Yusei Tahara's avatar Yusei Tahara Committed by Arnaud Fontaine

Improve listbox sort feature.

Now both ascending arrow and descending arrow are displayed in title column
and user can sort in specific order explicitly. User also can sort multiple
columns by click without using sort-on-dialog.
parent 01671fa5
No related merge requests found
...@@ -296,14 +296,35 @@ ...@@ -296,14 +296,35 @@
or \'Sort\';\n or \'Sort\';\n
listbox_field_id string:${field_id}.${sql};"> \n listbox_field_id string:${field_id}.${sql};"> \n
<!-- Button in normal view -->\n <!-- Button in normal view -->\n
<span tal:condition="is_gadget_mode" i18n:translate="" i18n:domain="ui" tal:content="title"/>\n
<span tal:condition="not:is_gadget_mode" class="listbox-table-header-column-title" i18n:translate="" i18n:domain="ui" tal:content="title"/>\n
<button tal:condition="not:is_gadget_mode"\n <button tal:condition="not:is_gadget_mode"\n
type="submit"\n type="submit"\n
name="setSelectionQuickSortOrder:method"\n name="setSelectionQuickSortOrder:method"\n
tal:attributes="title title;\n title="Ascending Display"\n
value listbox_field_id;\n class="sort-button sort-button-asc"\n
class bt_class;"\n tal:attributes="value python:test(sort_order==\'ascending\', listbox_field_id+\':none\', listbox_field_id+\':asc\')"\n
i18n:domain="ui" i18n:attributes="title">\n i18n:domain="ui" i18n:attributes="title">\n
<span i18n:translate="" i18n:domain="ui" tal:content="title"/>\n <img src="images/transparent-image.gif"\n
alt="Ascending Display"\n
title="Ascending Display"\n
tal:attributes="src string:${portal_url_string}/images/transparent-image.gif;\n
class python:test(sort_order==\'ascending\', \'sort-button sort-button-arrow sort-button-asc-selected\', \'sort-button sort-button-arrow sort-button-asc-not-selected\');"\n
i18n:domain="ui" i18n:attributes="title;alt" />\n
</button>\n
<button tal:condition="not:is_gadget_mode"\n
type="submit"\n
name="setSelectionQuickSortOrder:method"\n
title="Descending Display"\n
class="sort-button sort-button-desc"\n
tal:attributes="value python:test(sort_order==\'descending\', listbox_field_id+\':none\', listbox_field_id+\':desc\')"\n
i18n:domain="ui" i18n:attributes="title">\n
<img src="images/transparent-image.gif"\n
alt="Descending Display"\n
title="Descending Display"\n
tal:attributes="src string:${portal_url_string}/images/transparent-image.gif;\n
class python:test(sort_order==\'descending\', \'sort-button sort-button-arrow sort-button-desc-selected\', \'sort-button sort-button-arrow sort-button-desc-not-selected\');"\n
i18n:domain="ui" i18n:attributes="title;alt" />\n
</button>\n </button>\n
\n \n
<!-- Button in gadget mode -->\n <!-- Button in gadget mode -->\n
...@@ -318,7 +339,8 @@ ...@@ -318,7 +339,8 @@
</button>\n </button>\n
\n \n
<!-- Icon showing sort order -->\n <!-- Icon showing sort order -->\n
<img src="images/transparent-image.gif"\n <img tal:condition="is_gadget_mode"\n
src="images/transparent-image.gif"\n
tal:attributes="alt bt_title;\n tal:attributes="alt bt_title;\n
title bt_title;\n title bt_title;\n
class bt_class;\n class bt_class;\n
......
...@@ -502,6 +502,9 @@ div.listbox-header-box{\n ...@@ -502,6 +502,9 @@ div.listbox-header-box{\n
padding-right: 5px;\n padding-right: 5px;\n
}\n }\n
\n \n
table.listbox tr.listbox-label-line th.listbox-table-header-cell span.listbox-table-header-column-title{\n
float:left;\n
}\n
\n \n
/* Listbox Footer */\n /* Listbox Footer */\n
div.listbox-footer{\n div.listbox-footer{\n
...@@ -805,6 +808,13 @@ table.listbox th img.sort-button-asc{\n ...@@ -805,6 +808,13 @@ table.listbox th img.sort-button-asc{\n
padding:0;\n padding:0;\n
}\n }\n
\n \n
table.listbox th img.sort-button-arrow{\n
width: 13px;\n
height: 13px;\n
margin:0;\n
padding:0;\n
}\n
\n
table.listbox th img.sort-button-desc{\n table.listbox th img.sort-button-desc{\n
background: url(\'images/1toparrow.png\') no-repeat scroll 100% 100%;\n background: url(\'images/1toparrow.png\') no-repeat scroll 100% 100%;\n
}\n }\n
...@@ -813,7 +823,21 @@ table.listbox th img.sort-button-asc{\n ...@@ -813,7 +823,21 @@ table.listbox th img.sort-button-asc{\n
background: url(\'images/1bottomarrow.png\') no-repeat scroll 100% 100%;\n background: url(\'images/1bottomarrow.png\') no-repeat scroll 100% 100%;\n
}\n }\n
\n \n
table.listbox th img.sort-button-asc-not-selected{\n
background: url(\'images/1toparrow.png\') no-repeat scroll 100% 100%;\n
}\n
\n
table.listbox th img.sort-button-desc-not-selected{\n
background: url(\'images/1bottomarrow.png\') no-repeat scroll 100% 100%;\n
}\n
\n
table.listbox th img.sort-button-asc-selected{\n
background: url(\'images/1toparrow_red.png\') no-repeat scroll 100% 100%;\n
}\n
\n \n
table.listbox th img.sort-button-desc-selected{\n
background: url(\'images/1bottomarrow_red.png\') no-repeat scroll 100% 100%;\n
}\n
/* listbox table in thumbnail style \n /* listbox table in thumbnail style \n
In thumbnail style we usually have only one thumbnail colum which through CSS\n In thumbnail style we usually have only one thumbnail colum which through CSS\n
we show as floating box table row.\n we show as floating box table row.\n
......
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="Image" module="OFS.Image"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>_Cacheable__manager_id</string> </key>
<value> <string>http_cache</string> </value>
</item>
<item>
<key> <string>_EtagSupport__etag</string> </key>
<value> <string>ts47439176.01</string> </value>
</item>
<item>
<key> <string>__name__</string> </key>
<value> <string>1bottomarrow_red.png</string> </value>
</item>
<item>
<key> <string>content_type</string> </key>
<value> <string>image/png</string> </value>
</item>
<item>
<key> <string>data</string> </key>
<value> <string encoding="base64">iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6+R8AAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A
/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9wJDAglMC7XGs4AAAEHSURBVCjP
1ZC7LwRhAMR/du92wxbkZL0SiSCiVXg0motGQY5Gh0J1KolW7e9QKuQkOnR0EkFxWRfFnWSD5Yvb
y7L33b40JBsKLdPNZCaTGfjTaAPQYC0DpgK8A3HKMAQ4n1oLnmPYywDMwfxEb+dKT9cgL55NlEii
KEJVsui6jv0guJdgwX71K6RBMWyqHZuTywuuW+FMlnHlK2Z7P804RNQFjuSoBUUAFcAC35T+wWX1
enpxdn1kONBweKMRNLi4ueVcRMd1WKqB92NgAYyd7r5SuLqbXOXzyVYum8xAaRSMtE9NEwuCnO+d
VuzymFDi8ZPa4+ETbNyB++ulBTCmYHvgW8M/wQftc2Eom633qAAAAABJRU5ErkJggg==</string> </value>
</item>
<item>
<key> <string>height</string> </key>
<value> <int>13</int> </value>
</item>
<item>
<key> <string>precondition</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>size</string> </key>
<value> <int>391</int> </value>
</item>
<item>
<key> <string>title</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>width</string> </key>
<value> <int>13</int> </value>
</item>
</dictionary>
</pickle>
</record>
</ZopeData>
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="Image" module="OFS.Image"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>_Cacheable__manager_id</string> </key>
<value> <string>http_cache</string> </value>
</item>
<item>
<key> <string>_EtagSupport__etag</string> </key>
<value> <string>ts47439181.43</string> </value>
</item>
<item>
<key> <string>__name__</string> </key>
<value> <string>1toparrow_red.png</string> </value>
</item>
<item>
<key> <string>content_type</string> </key>
<value> <string>image/png</string> </value>
</item>
<item>
<key> <string>data</string> </key>
<value> <string encoding="base64">iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6+R8AAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A
/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9wJDAglCXHSksYAAAEDSURBVCjP
1ZG/SwJhAIYf767Lugg59RtcCu4IMeICy0CChjbrwKEgaug/aOpvcbaloS1oCZrdHMKiqylRaFCH
wPr8vO5oi+jHXu/4vDzDywv/LzmwSnBcBeunXv8KXEjPQf1gafFoNjYKqdfhVQDyV8kFKwP1kj1R
9Z0CO8X9/F33dsGWw4sAwm+SC6YN5xvC3Fr1HMJJjXmSbK7t5pv3jRWhRmcBRB9SDuw0nJZTVNaL
HpYxRU8+0Yn6iBfJtldxrtut5aySlwFIA8CEmgB/JKH10EYpRRSH6PqAZqJDZuYGIxn542dqwF4C
QINDE7IaIIDHTzs1YBqIgTfojeHkj5//DllxSeYRCrbiAAAAAElFTkSuQmCC</string> </value>
</item>
<item>
<key> <string>height</string> </key>
<value> <int>13</int> </value>
</item>
<item>
<key> <string>precondition</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>size</string> </key>
<value> <int>387</int> </value>
</item>
<item>
<key> <string>title</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>width</string> </key>
<value> <int>13</int> </value>
</item>
</dictionary>
</pickle>
</record>
</ZopeData>
2012-9-12 yusei
* Improve listbox sort feature. Now both ascending arrow and descending arrow are displayed in title column and user can sort in specific order explicitly. User also can sort multiple columns by click without using sort-on-dialog.
2013-01-28 Kazuhiko 2013-01-28 Kazuhiko
* update RequireJS 2.1.4. * update RequireJS 2.1.4.
......
1099 1100
\ No newline at end of file \ 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