From: Thierry Parmentelat Date: Tue, 26 Mar 2013 13:51:54 +0000 (+0100) Subject: forget about jquery-ui altogether, use bootstrap for consistency X-Git-Tag: myslice-django-0.1-3~37 X-Git-Url: http://git.onelab.eu/?p=myslice.git;a=commitdiff_plain;h=8bd7506149ec3e26a194fcc6e596781e0b399b0f forget about jquery-ui altogether, use bootstrap for consistency the tables clearly look different --- diff --git a/Makefile b/Makefile index ab0a822d..652f6dbd 100644 --- a/Makefile +++ b/Makefile @@ -30,7 +30,8 @@ THIRD-PARTY-RESOURCES = THIRD-PARTY-RESOURCES += $(shell ls third-party/bootstrap/*/*) # just the single js as identified with a symlink THIRD-PARTY-RESOURCES += $(shell ls third-party/datatables/js/dataTables.js) -THIRD-PARTY-RESOURCES += $(shell ls third-party/datatables/js/DT_bootstrap.js) +THIRD-PARTY-RESOURCES += $(shell ls third-party/datatables/js/dataTables.bootstrap.js) +THIRD-PARTY-RESOURCES += $(shell ls third-party/datatables/css/dataTables.bootstrap.css) # likewise THIRD-PARTY-RESOURCES += $(shell ls third-party/jquery/js/jquery{,.min}.js) # for storing the visible status of plugins diff --git a/plugins/hazelnut/demo_table.css b/plugins/hazelnut/demo_table.css deleted file mode 100644 index 6b6fb342..00000000 --- a/plugins/hazelnut/demo_table.css +++ /dev/null @@ -1,546 +0,0 @@ -/* - * File: demo_table.css - * CVS: $Id$ - * Description: CSS descriptions for DataTables demo pages - * Author: Allan Jardine - * Created: Tue May 12 06:47:22 BST 2009 - * Modified: $Date$ by $Author$ - * Language: CSS - * Project: DataTables - * - * Copyright 2009 Allan Jardine. All Rights Reserved. - * - * *************************************************************************** - * DESCRIPTION - * - * The styles given here are suitable for the demos that are used with the standard DataTables - * distribution (see www.datatables.net). You will most likely wish to modify these styles to - * meet the layout requirements of your site. - * - * Common issues: - * 'full_numbers' pagination - I use an extra selector on the body tag to ensure that there is - * no conflict between the two pagination types. If you want to use full_numbers pagination - * ensure that you either have "example_alt_pagination" as a body class name, or better yet, - * modify that selector. - * Note that the path used for Images is relative. All images are by default located in - * ../images/ - relative to this CSS file. - */ - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables features - */ - -/* -.dataTables_wrapper { - padding-bottom: 0em; - padding-top: 0em; - position: relative; - min-height: 302px; - clear: both; - _height: 302px; - zoom: 1; / Feeling sorry for IE / -} -*/ -.dataTables_processing { - position: absolute; - top: 50%; - left: 50%; - width: 250px; - height: 30px; - margin-left: -125px; - margin-top: -15px; - padding: 14px 0 2px 0; - border: 1px solid #ddd; - text-align: center; - color: #999; - font-size: 14px; - background-color: white; -} - -.dataTables_length { - width: 40%; - float: left; -} - -.dataTables_filter { - width: 50%; - float: right; - text-align: right; -} - -.dataTables_info { -/* width: 45%; - float: left; - padding-top: 1.2em; - padding-left: 1em; -} - -.dataTables_paginate { - /* width: 44px; - width: 50px; - float: right; - text-align: right; -} -*/ - -/* Pagination nested */ -.paginate_disabled_previous, .paginate_enabled_previous, .paginate_disabled_next, .paginate_enabled_next { - height: 19px; - width: 19px; - margin-left: 3px; - /*float: left;*/ -} - -.paginate_disabled_previous { - background-image: url('images/back_disabled.jpg'); -} - -.paginate_enabled_previous { - background-image: url('images/back_enabled.jpg'); -} - -.paginate_disabled_next { - background-image: url('images/forward_disabled.jpg'); -} - -.paginate_enabled_next { - background-image: url('images/forward_enabled.jpg'); -} - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables display - */ -table.display { - margin: 0 auto; - clear: both; - width: 100%; - - /* Note Firefox 3.5 and before have a bug with border-collapse - * ( https://bugzilla.mozilla.org/show%5Fbug.cgi?id=155955 ) - * border-spacing: 0; is one possible option. Conditional-css.com is - * useful for this kind of thing - * - * Further note IE 6/7 has problems when calculating widths with border width. - * It subtracts one px relative to the other browsers from the first column, and - * adds one to the end... - * - * If you want that effect I'd suggest setting a border-top/left on th/td's and - * then filling in the gaps with other borders. - */ -} - -table.display thead th { - padding: 3px 18px 3px 10px; - border-bottom: 1px solid black; - font-weight: bold; - cursor: pointer; - * cursor: hand; -} - -table.display tfoot th { - padding: 3px 18px 3px 10px; - border-top: 1px solid black; - font-weight: bold; -} - -table.display tr.heading2 td { - border-bottom: 1px solid #aaa; -} - -table.display td { - padding: 3px 10px; -} - -table.display td.center { - text-align: center; -} - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables sorting - */ - -.sorting_asc { - background: url('images/sort_asc.png') no-repeat center right; -} - -.sorting_desc { - background: url('images/sort_desc.png') no-repeat center right; -} - -.sorting { - background: url('images/sort_both.png') no-repeat center right; -} - -.sorting_asc_disabled { - background: url('images/sort_asc_disabled.png') no-repeat center right; -} - -.sorting_desc_disabled { - background: url('images/sort_desc_disabled.png') no-repeat center right; -} - - - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables row classes - */ -table.display tr.odd.gradeA { - background-color: #ddffdd; -} - -table.display tr.even.gradeA { - background-color: #eeffee; -} - -table.display tr.odd.gradeC { - background-color: #ddddff; -} - -table.display tr.even.gradeC { - background-color: #eeeeff; -} - -table.display tr.odd.gradeX { - background-color: #ffdddd; -} - -table.display tr.even.gradeX { - background-color: #ffeeee; -} - -table.display tr.odd.gradeU { - background-color: #ddd; -} - -table.display tr.even.gradeU { - background-color: #eee; -} - - -tr.odd { - background-color: #E2E4FF; -} - -tr.even { - background-color: white; -} - - - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * Misc - */ -.dataTables_scroll { -/* clear: both; JORDAN */ -} - -.dataTables_scrollBody { - *margin-top: -1px; -} -/* -.top, .bottom { - padding: 15px; - background-color: #F5F5F5; - border: 1px solid #CCCCCC; -} - -.top .dataTables_info { - float: none; -} -*/ -.clear { - clear: both; -} - -.dataTables_empty { - text-align: center; -} - -tfoot input { - margin: 0.5em 0; - width: 100%; - color: #444; -} - -tfoot input.search_init { - color: #999; -} - -td.group { - background-color: #d1cfd0; - border-bottom: 2px solid #A19B9E; - border-top: 2px solid #A19B9E; -} - -td.details { - background-color: #d1cfd0; - border: 2px solid #A19B9E; -} - - -.example_alt_pagination div.dataTables_info { - width: 40%; -} - -.paging_full_numbers { - width: 45%; - height: 22px; - line-height: 22px; - padding-top: 1em; - padding-right: 1em; -} - -.paging_full_numbers a.paginate_button, - .paging_full_numbers a.paginate_active { - border: 1px solid #aaa; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - padding: 2px 5px; - margin: 0 3px; - cursor: pointer; - *cursor: hand; -} - -.paging_full_numbers a.paginate_button { - background-color: #ddd; -} - -.paging_full_numbers a.paginate_button:hover { - background-color: #ccc; -} - -.paging_full_numbers a.paginate_active { - background-color: #99B3FF; -} - -table.display tr.even.row_selected td { - background-color: #B0BED9; -} - -table.display tr.odd.row_selected td { - background-color: #9FAFD1; -} - - -/* - * Sorting classes for columns - */ -/* For the standard odd/even */ -tr.odd td.sorting_1 { - background-color: #D3D6FF; -} - -tr.odd td.sorting_2 { - background-color: #DADCFF; -} - -tr.odd td.sorting_3 { - background-color: #E0E2FF; -} - -tr.even td.sorting_1 { - background-color: #EAEBFF; -} - -tr.even td.sorting_2 { - background-color: #F2F3FF; -} - -tr.even td.sorting_3 { - background-color: #F9F9FF; -} - - -/* For the Conditional-CSS grading rows */ -/* - Colour calculations (based off the main row colours) - Level 1: - dd > c4 - ee > d5 - Level 2: - dd > d1 - ee > e2 - */ -tr.odd.gradeA td.sorting_1 { - background-color: #c4ffc4; -} - -tr.odd.gradeA td.sorting_2 { - background-color: #d1ffd1; -} - -tr.odd.gradeA td.sorting_3 { - background-color: #d1ffd1; -} - -tr.even.gradeA td.sorting_1 { - background-color: #d5ffd5; -} - -tr.even.gradeA td.sorting_2 { - background-color: #e2ffe2; -} - -tr.even.gradeA td.sorting_3 { - background-color: #e2ffe2; -} - -tr.odd.gradeC td.sorting_1 { - background-color: #c4c4ff; -} - -tr.odd.gradeC td.sorting_2 { - background-color: #d1d1ff; -} - -tr.odd.gradeC td.sorting_3 { - background-color: #d1d1ff; -} - -tr.even.gradeC td.sorting_1 { - background-color: #d5d5ff; -} - -tr.even.gradeC td.sorting_2 { - background-color: #e2e2ff; -} - -tr.even.gradeC td.sorting_3 { - background-color: #e2e2ff; -} - -tr.odd.gradeX td.sorting_1 { - background-color: #ffc4c4; -} - -tr.odd.gradeX td.sorting_2 { - background-color: #ffd1d1; -} - -tr.odd.gradeX td.sorting_3 { - background-color: #ffd1d1; -} - -tr.even.gradeX td.sorting_1 { - background-color: #ffd5d5; -} - -tr.even.gradeX td.sorting_2 { - background-color: #ffe2e2; -} - -tr.even.gradeX td.sorting_3 { - background-color: #ffe2e2; -} - -tr.odd.gradeU td.sorting_1 { - background-color: #c4c4c4; -} - -tr.odd.gradeU td.sorting_2 { - background-color: #d1d1d1; -} - -tr.odd.gradeU td.sorting_3 { - background-color: #d1d1d1; -} - -tr.even.gradeU td.sorting_1 { - background-color: #d5d5d5; -} - -tr.even.gradeU td.sorting_2 { - background-color: #e2e2e2; -} - -tr.even.gradeU td.sorting_3 { - background-color: #e2e2e2; -} - - -/* - * Row highlighting example - */ -.ex_highlight #example tbody tr.even:hover, #example tbody tr.even td.highlighted { - background-color: #ECFFB3; -} - -.ex_highlight #example tbody tr.odd:hover, #example tbody tr.odd td.highlighted { - background-color: #E6FF99; -} - -.ex_highlight_row #example tr.even:hover { - background-color: #ECFFB3; -} - -.ex_highlight_row #example tr.even:hover td.sorting_1 { - background-color: #DDFF75; -} - -.ex_highlight_row #example tr.even:hover td.sorting_2 { - background-color: #E7FF9E; -} - -.ex_highlight_row #example tr.even:hover td.sorting_3 { - background-color: #E2FF89; -} - -.ex_highlight_row #example tr.odd:hover { - background-color: #E6FF99; -} - -.ex_highlight_row #example tr.odd:hover td.sorting_1 { - background-color: #D6FF5C; -} - -.ex_highlight_row #example tr.odd:hover td.sorting_2 { - background-color: #E0FF84; -} - -.ex_highlight_row #example tr.odd:hover td.sorting_3 { - background-color: #DBFF70; -} - - -/* - * KeyTable - */ -table.KeyTable td { - border: 3px solid transparent; -} - -table.KeyTable td.focus { - border: 3px solid #3366FF; -} - -table.display tr.gradeA { - background-color: #eeffee; -} - -table.display tr.gradeC { - background-color: #ddddff; -} - -table.display tr.gradeX { - background-color: #ffdddd; -} - -table.display tr.gradeU { - background-color: #ddd; -} - -div.box { - height: 100px; - padding: 10px; - overflow: auto; - border: 1px solid #8080FF; - background-color: #E5E5FF; -} diff --git a/plugins/hazelnut/demo_table_jui.css b/plugins/hazelnut/demo_table_jui.css deleted file mode 100644 index 69f908bc..00000000 --- a/plugins/hazelnut/demo_table_jui.css +++ /dev/null @@ -1,532 +0,0 @@ -/* - * File: demo_table_jui.css - * CVS: $Id$ - * Description: CSS descriptions for DataTables demo pages - * Author: Allan Jardine - * Created: Tue May 12 06:47:22 BST 2009 - * Modified: $Date$ by $Author$ - * Language: CSS - * Project: DataTables - * - * Copyright 2009 Allan Jardine. All Rights Reserved. - * - * *************************************************************************** - * DESCRIPTION - * - * The styles given here are suitable for the demos that are used with the standard DataTables - * distribution (see www.datatables.net). You will most likely wish to modify these styles to - * meet the layout requirements of your site. - * - * Common issues: - * 'full_numbers' pagination - I use an extra selector on the body tag to ensure that there is - * no conflict between the two pagination types. If you want to use full_numbers pagination - * ensure that you either have "example_alt_pagination" as a body class name, or better yet, - * modify that selector. - * Note that the path used for Images is relative. All images are by default located in - * ../images/ - relative to this CSS file. - */ - - -/* - * jQuery UI specific styling - */ - -.paging_two_button .ui-button { - float: left; - cursor: pointer; - * cursor: hand; -} - -.paging_full_numbers .ui-button { - padding: 2px 6px; - margin: 0; - cursor: pointer; - * cursor: hand; - color: #333 !important; -} - -.dataTables_paginate .ui-button { - margin-right: -0.1em !important; -} - -.paging_full_numbers { - width: 350px !important; -} - -.dataTables_wrapper .ui-toolbar { - padding: 5px; -} - -.dataTables_paginate { - width: auto; -} - -.dataTables_info { - padding-top: 3px; -} - -table.display thead th { - padding: 3px 0px 3px 10px; - cursor: pointer; - * cursor: hand; -} - -div.dataTables_wrapper .ui-widget-header { - font-weight: normal; -} - - -/* - * Sort arrow icon positioning - */ -table.display thead th div.DataTables_sort_wrapper { - position: relative; - padding-right: 20px; -} - -table.display thead th div.DataTables_sort_wrapper span { - position: absolute; - top: 50%; - margin-top: -8px; - right: 0; -} - - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * - * Everything below this line is the same as demo_table.css. This file is - * required for 'cleanliness' of the markup - * - * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables features - */ - -.dataTables_wrapper { - position: relative; - clear: both; -} - -.dataTables_processing { - position: absolute; - top: 0px; - left: 50%; - width: 250px; - margin-left: -125px; - border: 1px solid #ddd; - text-align: center; - color: #999; - font-size: 11px; - padding: 2px 0; -} - -.dataTables_length { - width: 40%; - float: left; -} - -.dataTables_filter { - width: 50%; - float: right; - text-align: right; -} - -.dataTables_info { - width: 45%; - float: left; -} - -.dataTables_paginate { - float: right; - text-align: right; -} - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables display - */ -table.display { - margin: 0 auto; - width: 100%; - clear: both; - border-collapse: collapse; -} - -table.display tfoot th { - padding: 3px 0px 3px 10px; - font-weight: bold; - font-weight: normal; -} - -table.display tr.heading2 td { - border-bottom: 1px solid #aaa; -} - -table.display td { - padding: 3px 10px; -} - -table.display td.center { - text-align: center; -} - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables sorting - */ - -.sorting_asc { - background: url('images/sort_asc.png') no-repeat center right; -} - -.sorting_desc { - background: url('images/sort_desc.png') no-repeat center right; -} - -.sorting { - background: url('images/sort_both.png') no-repeat center right; -} - -.sorting_asc_disabled { - background: url('images/sort_asc_disabled.png') no-repeat center right; -} - -.sorting_desc_disabled { - background: url('images/sort_desc_disabled.png') no-repeat center right; -} - - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * DataTables row classes - */ -table.display tr.odd.gradeA { - background-color: #ddffdd; -} - -table.display tr.even.gradeA { - background-color: #eeffee; -} - - - - -table.display tr.odd.gradeA { - background-color: #ddffdd; -} - -table.display tr.even.gradeA { - background-color: #eeffee; -} - -table.display tr.odd.gradeC { - background-color: #ddddff; -} - -table.display tr.even.gradeC { - background-color: #eeeeff; -} - -table.display tr.odd.gradeX { - background-color: #ffdddd; -} - -table.display tr.even.gradeX { - background-color: #ffeeee; -} - -table.display tr.odd.gradeU { - background-color: #ddd; -} - -table.display tr.even.gradeU { - background-color: #eee; -} - - -tr.odd { - background-color: #E2E4FF; -} - -tr.even { - background-color: white; -} - - - - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * Misc - */ -.dataTables_scroll { - clear: both; -} - -.dataTables_scrollBody { - -webkit-overflow-scrolling: touch; -} - -/* -.top, .bottom { - padding: 15px; - background-color: #F5F5F5; - border: 1px solid #CCCCCC; -} - -.top .dataTables_info { - float: none; -} -*/ -.clear { - clear: both; -} - -.dataTables_empty { - text-align: center; -} - -tfoot input { - margin: 0.5em 0; - width: 100%; - color: #444; -} - -tfoot input.search_init { - color: #999; -} - -td.group { - background-color: #d1cfd0; - border-bottom: 2px solid #A19B9E; - border-top: 2px solid #A19B9E; -} - -td.details { - background-color: #d1cfd0; - border: 2px solid #A19B9E; -} - - -.example_alt_pagination div.dataTables_info { - width: 40%; -} - -.paging_full_numbers a.paginate_button, - .paging_full_numbers a.paginate_active { - border: 1px solid #aaa; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - padding: 2px 5px; - margin: 0 3px; - cursor: pointer; - *cursor: hand; - color: #333 !important; -} - -.paging_full_numbers a.paginate_button { - background-color: #ddd; -} - -.paging_full_numbers a.paginate_button:hover { - background-color: #ccc; - text-decoration: none !important; -} - -.paging_full_numbers a.paginate_active { - background-color: #99B3FF; -} - -table.display tr.even.row_selected td { - background-color: #B0BED9; -} - -table.display tr.odd.row_selected td { - background-color: #9FAFD1; -} - - -/* - * Sorting classes for columns - */ -/* For the standard odd/even */ -tr.odd td.sorting_1 { - background-color: #D3D6FF; -} - -tr.odd td.sorting_2 { - background-color: #DADCFF; -} - -tr.odd td.sorting_3 { - background-color: #E0E2FF; -} - -tr.even td.sorting_1 { - background-color: #EAEBFF; -} - -tr.even td.sorting_2 { - background-color: #F2F3FF; -} - -tr.even td.sorting_3 { - background-color: #F9F9FF; -} - - -/* For the Conditional-CSS grading rows */ -/* - Colour calculations (based off the main row colours) - Level 1: - dd > c4 - ee > d5 - Level 2: - dd > d1 - ee > e2 - */ -tr.odd.gradeA td.sorting_1 { - background-color: #c4ffc4; -} - -tr.odd.gradeA td.sorting_2 { - background-color: #d1ffd1; -} - -tr.odd.gradeA td.sorting_3 { - background-color: #d1ffd1; -} - -tr.even.gradeA td.sorting_1 { - background-color: #d5ffd5; -} - -tr.even.gradeA td.sorting_2 { - background-color: #e2ffe2; -} - -tr.even.gradeA td.sorting_3 { - background-color: #e2ffe2; -} - -tr.odd.gradeC td.sorting_1 { - background-color: #c4c4ff; -} - -tr.odd.gradeC td.sorting_2 { - background-color: #d1d1ff; -} - -tr.odd.gradeC td.sorting_3 { - background-color: #d1d1ff; -} - -tr.even.gradeC td.sorting_1 { - background-color: #d5d5ff; -} - -tr.even.gradeC td.sorting_2 { - background-color: #e2e2ff; -} - -tr.even.gradeC td.sorting_3 { - background-color: #e2e2ff; -} - -tr.odd.gradeX td.sorting_1 { - background-color: #ffc4c4; -} - -tr.odd.gradeX td.sorting_2 { - background-color: #ffd1d1; -} - -tr.odd.gradeX td.sorting_3 { - background-color: #ffd1d1; -} - -tr.even.gradeX td.sorting_1 { - background-color: #ffd5d5; -} - -tr.even.gradeX td.sorting_2 { - background-color: #ffe2e2; -} - -tr.even.gradeX td.sorting_3 { - background-color: #ffe2e2; -} - -tr.odd.gradeU td.sorting_1 { - background-color: #c4c4c4; -} - -tr.odd.gradeU td.sorting_2 { - background-color: #d1d1d1; -} - -tr.odd.gradeU td.sorting_3 { - background-color: #d1d1d1; -} - -tr.even.gradeU td.sorting_1 { - background-color: #d5d5d5; -} - -tr.even.gradeU td.sorting_2 { - background-color: #e2e2e2; -} - -tr.even.gradeU td.sorting_3 { - background-color: #e2e2e2; -} - - -/* - * Row highlighting example - */ -.ex_highlight #example tbody tr.even:hover, #example tbody tr.even td.highlighted { - background-color: #ECFFB3; -} - -.ex_highlight #example tbody tr.odd:hover, #example tbody tr.odd td.highlighted { - background-color: #E6FF99; -} - - - - - - -/* jordan */ -/* .dataTables_info { padding-top: 0; }*/ - .dataTables_paginate { padding-top: 0; } - .css_right { float: right; } - #example_wrapper .fg-toolbar { font-size: 0.8em } - #theme_links span { float: left; padding: 2px 10px; } - -.ui-widget-header { - background: none; - border: none; -} - -.ui-tabs-nav { - /*border-bottom: 1px solid #AAA*//*{borderColorHeader}*/ -} - -.ui-tabs { - border: none; - padding: 0; -} - -.ui-tabs-panel { - border: 1px solid #AAA/*{borderColorContent}*/ !important; -} diff --git a/plugins/hazelnut/hazelnut.css b/plugins/hazelnut/hazelnut.css index 9e1674fe..5b21e904 100644 --- a/plugins/hazelnut/hazelnut.css +++ b/plugins/hazelnut/hazelnut.css @@ -1,27 +1,4 @@ -.tophat-datatables { - margin-top: 1em; - background: #F5F5F5; +div.spacer { + height:20px; + clear: both; } -/* -.dataTables_wrapper { - border: 1px solid #999999; - padding-top: 1em; - / padding-bottom: 3.5em; / - margin-bottom: 3.5em; -} -.dataTables_scroll { - border-top: 1px solid #999999; - border-bottom: 1px solid #999999; -} -*/ - -.dataTables_length { - padding-left: 1em; - padding-bottom: 1em; -} - -.dataTables_filter { - padding-right: 1em; - padding-bottom: 1em; -} - diff --git a/plugins/hazelnut/hazelnut.html b/plugins/hazelnut/hazelnut.html index 196a387b..19b30a6d 100644 --- a/plugins/hazelnut/hazelnut.html +++ b/plugins/hazelnut/hazelnut.html @@ -1,7 +1,13 @@ - +
+
{% for column in columns %} {% endfor %} {% if checkboxes %}{% endif %} - + + {% for column in columns %} +{% endfor %} {% if checkboxes %}{% endif %} +
{{ column }}+/-
{{ column }}+/-
+ +
diff --git a/plugins/hazelnut/hazelnut.js b/plugins/hazelnut/hazelnut.js index 4c741b31..a5a9ad8e 100644 --- a/plugins/hazelnut/hazelnut.js +++ b/plugins/hazelnut/hazelnut.js @@ -121,20 +121,20 @@ // http://datatables.net/release-datatables/examples/advanced_init/dom_toolbar.html // http://www.datatables.net/forums/discussion/3914/adding-buttons-to-header-or-footer/p1 //"sDom": 'lf<"#datatableSelectAll-'+ options.plugin_uuid+'">rtip', - sDom: '<"H"Tfr>t<"F"ip>', - bJQueryUI: true, + sDom: "<'row-fluid'<'span6'T><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>", sPaginationType: 'bootstrap', // Handle the null values & the error : Datatables warning Requested unknown parameter // http://datatables.net/forums/discussion/5331/datatables-warning-...-requested-unknown-parameter/p2 aoColumnDefs: [{sDefaultContent: '',aTargets: [ '_all' ]}], - bRetrieve: true, +// bRetrieve: true, // WARNING: this one causes tables in a 'tabs' that are not exposed at the time this is run to show up empty // sScrollX: '100%', /* Horizontal scrolling */ bProcessing: true, /* Loading */ - fnRowCallback: function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) { - $(nRow).attr('id', unfold.get_value(aData[3])); - return nRow; - }, +// this looks like just another ugly hack +// fnRowCallback: function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) { +// $(nRow).attr('id', unfold.get_value(aData[3])); +// return nRow; +// }, fnDrawCallback: function() { hazelnut_draw_callback.call(object, options); } }); diff --git a/plugins/hazelnut/hazelnut.py b/plugins/hazelnut/hazelnut.py index 26ce6285..b69bcc93 100644 --- a/plugins/hazelnut/hazelnut.py +++ b/plugins/hazelnut/hazelnut.py @@ -27,13 +27,12 @@ class Hazelnut (Plugin): reqs = { 'js_files' : [ "js/hazelnut.js", "js/manifold.js", "js/manifold-query.js", - "js/dataTables.js", "js/DT_bootstrap.js", "js/with-datatables.js", + "js/dataTables.js", "js/dataTables.bootstrap.js", "js/with-datatables.js", "js/spin.presets.js", "js/spin.min.js", "js/jquery.spin.js", "js/unfold-helper.js", ] , 'css_files': [ "css/hazelnut.css" , - "css/demo_table.css", "css/demo_table_jui.css", -# "css/jquery-ui.css", + "css/dataTables.bootstrap.css", ], } return reqs diff --git a/plugins/hazelnut/img/sort_asc.png b/plugins/hazelnut/img/sort_asc.png new file mode 100644 index 00000000..a56d0e21 Binary files /dev/null and b/plugins/hazelnut/img/sort_asc.png differ diff --git a/plugins/hazelnut/img/sort_asc_disabled.png b/plugins/hazelnut/img/sort_asc_disabled.png new file mode 100644 index 00000000..b7e621ef Binary files /dev/null and b/plugins/hazelnut/img/sort_asc_disabled.png differ diff --git a/plugins/hazelnut/img/sort_both.png b/plugins/hazelnut/img/sort_both.png new file mode 100644 index 00000000..839ac4bb Binary files /dev/null and b/plugins/hazelnut/img/sort_both.png differ diff --git a/plugins/hazelnut/img/sort_desc.png b/plugins/hazelnut/img/sort_desc.png new file mode 100644 index 00000000..90b29515 Binary files /dev/null and b/plugins/hazelnut/img/sort_desc.png differ diff --git a/plugins/hazelnut/img/sort_desc_disabled.png b/plugins/hazelnut/img/sort_desc_disabled.png new file mode 100644 index 00000000..2409653d Binary files /dev/null and b/plugins/hazelnut/img/sort_desc_disabled.png differ diff --git a/plugins/hazelnut/img/sort_none.png b/plugins/hazelnut/img/sort_none.png new file mode 100644 index 00000000..0b92c376 Binary files /dev/null and b/plugins/hazelnut/img/sort_none.png differ diff --git a/third-party/datatables/js/DT_bootstrap.js b/third-party/datatables/js/DT_bootstrap.js deleted file mode 100644 index 328733f2..00000000 --- a/third-party/datatables/js/DT_bootstrap.js +++ /dev/null @@ -1,159 +0,0 @@ -/* Set the defaults for DataTables initialisation */ -$.extend( true, $.fn.dataTable.defaults, { - "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>", - "sPaginationType": "bootstrap", - "oLanguage": { - "sLengthMenu": "_MENU_ records per page" - } -} ); - - -/* Default class modification */ -$.extend( $.fn.dataTableExt.oStdClasses, { - "sWrapper": "dataTables_wrapper form-inline" -} ); - - -/* API method to get paging information */ -$.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings ) -{ - return { - "iStart": oSettings._iDisplayStart, - "iEnd": oSettings.fnDisplayEnd(), - "iLength": oSettings._iDisplayLength, - "iTotal": oSettings.fnRecordsTotal(), - "iFilteredTotal": oSettings.fnRecordsDisplay(), - "iPage": oSettings._iDisplayLength === -1 ? - 0 : Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ), - "iTotalPages": oSettings._iDisplayLength === -1 ? - 0 : Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength ) - }; -}; - - -/* Bootstrap style pagination control */ -$.extend( $.fn.dataTableExt.oPagination, { - "bootstrap": { - "fnInit": function( oSettings, nPaging, fnDraw ) { - var oLang = oSettings.oLanguage.oPaginate; - var fnClickHandler = function ( e ) { - e.preventDefault(); - if ( oSettings.oApi._fnPageChange(oSettings, e.data.action) ) { - fnDraw( oSettings ); - } - }; - - $(nPaging).addClass('pagination').append( - '' - ); - var els = $('a', nPaging); - $(els[0]).bind( 'click.DT', { action: "previous" }, fnClickHandler ); - $(els[1]).bind( 'click.DT', { action: "next" }, fnClickHandler ); - }, - - "fnUpdate": function ( oSettings, fnDraw ) { - var iListLength = 5; - var oPaging = oSettings.oInstance.fnPagingInfo(); - var an = oSettings.aanFeatures.p; - var i, ien, j, sClass, iStart, iEnd, iHalf=Math.floor(iListLength/2); - - if ( oPaging.iTotalPages < iListLength) { - iStart = 1; - iEnd = oPaging.iTotalPages; - } - else if ( oPaging.iPage <= iHalf ) { - iStart = 1; - iEnd = iListLength; - } else if ( oPaging.iPage >= (oPaging.iTotalPages-iHalf) ) { - iStart = oPaging.iTotalPages - iListLength + 1; - iEnd = oPaging.iTotalPages; - } else { - iStart = oPaging.iPage - iHalf + 1; - iEnd = iStart + iListLength - 1; - } - - for ( i=0, ien=an.length ; i'+j+'') - .insertBefore( $('li:last', an[i])[0] ) - .bind('click', function (e) { - e.preventDefault(); - oSettings._iDisplayStart = (parseInt($('a', this).text(),10)-1) * oPaging.iLength; - fnDraw( oSettings ); - } ); - } - - // Add / remove disabled classes from the static elements - if ( oPaging.iPage === 0 ) { - $('li:first', an[i]).addClass('disabled'); - } else { - $('li:first', an[i]).removeClass('disabled'); - } - - if ( oPaging.iPage === oPaging.iTotalPages-1 || oPaging.iTotalPages === 0 ) { - $('li:last', an[i]).addClass('disabled'); - } else { - $('li:last', an[i]).removeClass('disabled'); - } - } - } - } -} ); - - -/* - * TableTools Bootstrap compatibility - * Required TableTools 2.1+ - */ -if ( $.fn.DataTable.TableTools ) { - // Set the classes that TableTools uses to something suitable for Bootstrap - $.extend( true, $.fn.DataTable.TableTools.classes, { - "container": "DTTT btn-group", - "buttons": { - "normal": "btn", - "disabled": "disabled" - }, - "collection": { - "container": "DTTT_dropdown dropdown-menu", - "buttons": { - "normal": "", - "disabled": "disabled" - } - }, - "print": { - "info": "DTTT_print_info modal" - }, - "select": { - "row": "active" - } - } ); - - // Have the collection use a bootstrap compatible dropdown - $.extend( true, $.fn.DataTable.TableTools.DEFAULTS.oTags, { - "collection": { - "container": "ul", - "button": "li", - "liner": "a" - } - } ); -} - - -/* Table initialisation */ -$(document).ready(function() { - $('#example').dataTable( { - "sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>", - "sPaginationType": "bootstrap", - "oLanguage": { - "sLengthMenu": "_MENU_ records per page" - } - } ); -} ); \ No newline at end of file