Bugzilla – Attachment 6523 Details for
Bug 6836
jQuery plugin Datatables integration http://wiki.koha-community.org/wiki/DataTables_HowTo
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Follow-up CSS work
0002-Bug-6836-followup-CSS-work.patch (text/plain), 19.52 KB, created by
Julian Maurice
on 2011-12-02 09:58:51 UTC
(
hide
)
Description:
Follow-up CSS work
Filename:
MIME Type:
Creator:
Julian Maurice
Created:
2011-12-02 09:58:51 UTC
Size:
19.52 KB
patch
obsolete
>From ee69266b61f02963619bfbedbd8ed485541695d6 Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Fri, 2 Dec 2011 10:25:50 +0100 >Subject: [PATCH 2/4] Bug 6836: followup CSS work > >--- > koha-tmpl/intranet-tmpl/prog/en/css/datatables.css | 157 +++++++++++++++++++- > koha-tmpl/intranet-tmpl/prog/en/js/datatables.js | 105 +++++++++++++- > koha-tmpl/opac-tmpl/prog/en/css/datatables.css | 157 +++++++++++++++++++- > koha-tmpl/opac-tmpl/prog/en/js/datatables.js | 105 +++++++++++++- > 4 files changed, 516 insertions(+), 8 deletions(-) > >diff --git a/koha-tmpl/intranet-tmpl/prog/en/css/datatables.css b/koha-tmpl/intranet-tmpl/prog/en/css/datatables.css >index e069b93..e7b11bd 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/css/datatables.css >+++ b/koha-tmpl/intranet-tmpl/prog/en/css/datatables.css >@@ -3,15 +3,15 @@ input.search_init { > } > .sorting_asc { > padding-right: 19px; >- background: url("../../img/datatables/sort_asc.png") no-repeat scroll right center #EEEEEE; >+ background: url("../../img/asc.gif") no-repeat scroll right center #EEEEEE; > } > .sorting_desc { > padding-right: 19px; >- background: url("../../img/datatables/sort_desc.png") no-repeat scroll right center #EEEEEE; >+ background: url("../../img/desc.gif") no-repeat scroll right center #EEEEEE; > } > .sorting { > padding-right: 19px; >- background: url("../../img/datatables/sort_both.png") no-repeat scroll right center #EEEEEE; >+ background: url("../../img/ascdesc.gif") no-repeat scroll right center #EEEEEE; > } > .sorting_asc_disabled { > padding-right: 19px; >@@ -26,6 +26,157 @@ input.search_init { > background-color: #EEEEEE; > } > >+div.top {clear : both; } >+ >+div.top.pager, >+div.bottom.pager { >+ background-color : #E5E5E5; >+ padding : 0; >+} >+ >+div.bottom.pager div.dataTables_paginate.paging_full_numbers, >+div.bottom.pager div.dataTables_paginate.paging_four_button { >+ border-right-width : 0; >+} >+ >+div.dataTables_filter, >+div.dataTables_length, >+div.dataTables_info, >+div.dataTables_paginate { >+ float: left; >+ padding : .3em .5em .3em .5em; >+ >+} >+div.dataTables_length { >+ border-right : 1px solid #686868; >+ line-height:1.9em; >+} >+div.dataTables_info { >+ border-right : 1px solid #AAA; >+ line-height:1.9em; >+} >+div.dataTables_length, >+div.dataTables_filter { >+ border-left : 1px solid #FFF; >+} >+div.dataTables_filter { >+ line-height : 1.9em; >+} >+div.dataTables_paginate { >+ background-color : #F4F4F4; >+ font-size: 110%; >+ padding : 0; >+} >+ >+.paging_full_numbers span.paginate_button, >+.paging_full_numbers span.paginate_active { >+ border-right : 1px solid #AAA; >+ border-left : 1px solid #FFF; >+ display : block; >+ float : left; >+ line-height:1.6em; >+ padding: .3em .7em; >+ cursor: pointer; >+} >+ >+.paging_full_numbers span.paginate_button { >+ color : #0000CC; >+} >+.paging_full_numbers span.paginate_button.first { >+ background-image : url('../../img/first.png'); >+ background-repeat: no-repeat; >+ background-position : 2px center; >+ padding-left : 2em; >+} >+.paging_full_numbers span.paginate_button.previous { >+ background-image : url('../../img/prev.png'); >+ background-repeat: no-repeat; >+ background-position : 2px center; >+ padding-left : 2em; >+} >+.paging_full_numbers span.paginate_button.next { >+ background-image : url('../../img/next.png'); >+ background-repeat: no-repeat; >+ background-position : right center; >+ padding-right : 2em; >+} >+.paging_full_numbers span.paginate_button.last { >+ background-image : url('../../img/last.png'); >+ background-repeat: no-repeat; >+ background-position : right center; >+ border-right : 1px solid #686868; >+ padding-right : 2em; >+} >+div.bottom.pager .paging_full_numbers span.paginate_button.last { >+ border-right-width : 0; >+} >+.paging_full_numbers span.paginate_active { >+ background-color : #FFFFEA; >+ color : #000; >+ font-weight: bold; >+} >+ >+.paging_full_numbers span.paginate_button:hover { >+ background-color: #FFC; >+} >+ >+.paging_full_numbers span.paginate_button.paginate_button_disabled { >+ color : #666; >+} >+ >+/* Two-button version */ >+ >+div.dataTables_paginate.paging_two_button, >+div.dataTables_paginate.paging_four_button { >+ background-color : transparent; >+ border-right : 1px solid #686868; >+ border-left : 1px solid #FFF; >+ line-height : 1.8em; >+} >+.paginate_disabled_first, >+.paginate_enabled_first, >+.paginate_disabled_previous, >+.paginate_enabled_previous, >+.paginate_disabled_next, >+.paginate_enabled_next, >+.paginate_disabled_last, >+.paginate_enabled_last { >+ float: left; >+ height: 16px; >+ margin: .5em; >+ width: 16px; >+} >+.paginate_disabled_first { >+ background-image: url("../../img/first-disabled.png"); >+} >+.paginate_enabled_first { >+ background-image: url("../../img/first.png"); >+ cursor: pointer; >+} >+.paginate_disabled_previous { >+ background-image: url("../../img/prev-disabled.png"); >+} >+.paginate_enabled_previous { >+ background-image: url("../../img/prev.png"); >+ cursor: pointer; >+} >+.paginate_disabled_next { >+ background-image: url("../../img/next-disabled.png"); >+} >+.paginate_enabled_next { >+ background-image: url("../../img/next.png"); >+ cursor: pointer; >+} >+.paginate_disabled_last { >+ background-image: url("../../img/last-disabled.png"); >+} >+.paginate_enabled_last { >+ background-image: url("../../img/last.png"); >+ cursor: pointer; >+} >+ >+ >+/* > table.display { > width: 100%; > } >diff --git a/koha-tmpl/intranet-tmpl/prog/en/js/datatables.js b/koha-tmpl/intranet-tmpl/prog/en/js/datatables.js >index 38dd1d5..e0cc888 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/js/datatables.js >+++ b/koha-tmpl/intranet-tmpl/prog/en/js/datatables.js >@@ -22,7 +22,8 @@ var dataTablesDefaults = { > "sProcessing" : window.MSG_DT_PROCESSING || "Processing...", > "sSearch" : window.MSG_DT_SEARCH || "Search:", > "sZeroRecords" : window.MSG_DT_ZERO_RECORDS || "No matching records found" >- } >+ }, >+ "sDom": '<"top pager"ilpf>t<"bottom pager"ip>' > }; > > >@@ -279,3 +280,105 @@ function replace_html_date( original_node, id, format ) { > script.text = script_content; > $(original_node).append( script ); > } >+ >+$.fn.dataTableExt.oPagination.four_button = { >+ /* >+ * Function: oPagination.four_button.fnInit >+ * Purpose: Initalise dom elements required for pagination with a list of the pages >+ * Returns: - >+ * Inputs: object:oSettings - dataTables settings object >+ * node:nPaging - the DIV which contains this pagination control >+ * function:fnCallbackDraw - draw function which must be called on update >+ */ >+ "fnInit": function ( oSettings, nPaging, fnCallbackDraw ) >+ { >+ nFirst = document.createElement( 'span' ); >+ nPrevious = document.createElement( 'span' ); >+ nNext = document.createElement( 'span' ); >+ nLast = document.createElement( 'span' ); >+ >+/* nFirst.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sFirst ) ); >+ nPrevious.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sPrevious ) ); >+ nNext.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sNext ) ); >+ nLast.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sLast ) );*/ >+ >+ nFirst.className = "paginate_button first"; >+ nPrevious.className = "paginate_button previous"; >+ nNext.className="paginate_button next"; >+ nLast.className = "paginate_button last"; >+ >+ nPaging.appendChild( nFirst ); >+ nPaging.appendChild( nPrevious ); >+ nPaging.appendChild( nNext ); >+ nPaging.appendChild( nLast ); >+ >+ $(nFirst).click( function () { >+ oSettings.oApi._fnPageChange( oSettings, "first" ); >+ fnCallbackDraw( oSettings ); >+ } ); >+ >+ $(nPrevious).click( function() { >+ oSettings.oApi._fnPageChange( oSettings, "previous" ); >+ fnCallbackDraw( oSettings ); >+ } ); >+ >+ $(nNext).click( function() { >+ oSettings.oApi._fnPageChange( oSettings, "next" ); >+ fnCallbackDraw( oSettings ); >+ } ); >+ >+ $(nLast).click( function() { >+ oSettings.oApi._fnPageChange( oSettings, "last" ); >+ fnCallbackDraw( oSettings ); >+ } ); >+ >+ /* Disallow text selection */ >+ $(nFirst).bind( 'selectstart', function () { return false; } ); >+ $(nPrevious).bind( 'selectstart', function () { return false; } ); >+ $(nNext).bind( 'selectstart', function () { return false; } ); >+ $(nLast).bind( 'selectstart', function () { return false; } ); >+ }, >+ >+ /* >+ * Function: oPagination.four_button.fnUpdate >+ * Purpose: Update the list of page buttons shows >+ * Returns: - >+ * Inputs: object:oSettings - dataTables settings object >+ * function:fnCallbackDraw - draw function which must be called on update >+ */ >+ "fnUpdate": function ( oSettings, fnCallbackDraw ) >+ { >+ if ( !oSettings.aanFeatures.p ) >+ { >+ return; >+ } >+ >+ /* Loop over each instance of the pager */ >+ var an = oSettings.aanFeatures.p; >+ for ( var i=0, iLen=an.length ; i<iLen ; i++ ) >+ { >+ var buttons = an[i].getElementsByTagName('span'); >+ if ( oSettings._iDisplayStart === 0 ) >+ { >+ buttons[0].className = "paginate_disabled_first"; >+ buttons[1].className = "paginate_disabled_previous"; >+ } >+ else >+ { >+ buttons[0].className = "paginate_enabled_first"; >+ buttons[1].className = "paginate_enabled_previous"; >+ } >+ >+ if ( oSettings.fnDisplayEnd() == oSettings.fnRecordsDisplay() ) >+ { >+ buttons[2].className = "paginate_disabled_next"; >+ buttons[3].className = "paginate_disabled_last"; >+ } >+ else >+ { >+ buttons[2].className = "paginate_enabled_next"; >+ buttons[3].className = "paginate_enabled_last"; >+ } >+ } >+ } >+}; >diff --git a/koha-tmpl/opac-tmpl/prog/en/css/datatables.css b/koha-tmpl/opac-tmpl/prog/en/css/datatables.css >index e069b93..e7b11bd 100644 >--- a/koha-tmpl/opac-tmpl/prog/en/css/datatables.css >+++ b/koha-tmpl/opac-tmpl/prog/en/css/datatables.css >@@ -3,15 +3,15 @@ input.search_init { > } > .sorting_asc { > padding-right: 19px; >- background: url("../../img/datatables/sort_asc.png") no-repeat scroll right center #EEEEEE; >+ background: url("../../img/asc.gif") no-repeat scroll right center #EEEEEE; > } > .sorting_desc { > padding-right: 19px; >- background: url("../../img/datatables/sort_desc.png") no-repeat scroll right center #EEEEEE; >+ background: url("../../img/desc.gif") no-repeat scroll right center #EEEEEE; > } > .sorting { > padding-right: 19px; >- background: url("../../img/datatables/sort_both.png") no-repeat scroll right center #EEEEEE; >+ background: url("../../img/ascdesc.gif") no-repeat scroll right center #EEEEEE; > } > .sorting_asc_disabled { > padding-right: 19px; >@@ -26,6 +26,157 @@ input.search_init { > background-color: #EEEEEE; > } > >+div.top {clear : both; } >+ >+div.top.pager, >+div.bottom.pager { >+ background-color : #E5E5E5; >+ padding : 0; >+} >+ >+div.bottom.pager div.dataTables_paginate.paging_full_numbers, >+div.bottom.pager div.dataTables_paginate.paging_four_button { >+ border-right-width : 0; >+} >+ >+div.dataTables_filter, >+div.dataTables_length, >+div.dataTables_info, >+div.dataTables_paginate { >+ float: left; >+ padding : .3em .5em .3em .5em; >+ >+} >+div.dataTables_length { >+ border-right : 1px solid #686868; >+ line-height:1.9em; >+} >+div.dataTables_info { >+ border-right : 1px solid #AAA; >+ line-height:1.9em; >+} >+div.dataTables_length, >+div.dataTables_filter { >+ border-left : 1px solid #FFF; >+} >+div.dataTables_filter { >+ line-height : 1.9em; >+} >+div.dataTables_paginate { >+ background-color : #F4F4F4; >+ font-size: 110%; >+ padding : 0; >+} >+ >+.paging_full_numbers span.paginate_button, >+.paging_full_numbers span.paginate_active { >+ border-right : 1px solid #AAA; >+ border-left : 1px solid #FFF; >+ display : block; >+ float : left; >+ line-height:1.6em; >+ padding: .3em .7em; >+ cursor: pointer; >+} >+ >+.paging_full_numbers span.paginate_button { >+ color : #0000CC; >+} >+.paging_full_numbers span.paginate_button.first { >+ background-image : url('../../img/first.png'); >+ background-repeat: no-repeat; >+ background-position : 2px center; >+ padding-left : 2em; >+} >+.paging_full_numbers span.paginate_button.previous { >+ background-image : url('../../img/prev.png'); >+ background-repeat: no-repeat; >+ background-position : 2px center; >+ padding-left : 2em; >+} >+.paging_full_numbers span.paginate_button.next { >+ background-image : url('../../img/next.png'); >+ background-repeat: no-repeat; >+ background-position : right center; >+ padding-right : 2em; >+} >+.paging_full_numbers span.paginate_button.last { >+ background-image : url('../../img/last.png'); >+ background-repeat: no-repeat; >+ background-position : right center; >+ border-right : 1px solid #686868; >+ padding-right : 2em; >+} >+div.bottom.pager .paging_full_numbers span.paginate_button.last { >+ border-right-width : 0; >+} >+.paging_full_numbers span.paginate_active { >+ background-color : #FFFFEA; >+ color : #000; >+ font-weight: bold; >+} >+ >+.paging_full_numbers span.paginate_button:hover { >+ background-color: #FFC; >+} >+ >+.paging_full_numbers span.paginate_button.paginate_button_disabled { >+ color : #666; >+} >+ >+/* Two-button version */ >+ >+div.dataTables_paginate.paging_two_button, >+div.dataTables_paginate.paging_four_button { >+ background-color : transparent; >+ border-right : 1px solid #686868; >+ border-left : 1px solid #FFF; >+ line-height : 1.8em; >+} >+.paginate_disabled_first, >+.paginate_enabled_first, >+.paginate_disabled_previous, >+.paginate_enabled_previous, >+.paginate_disabled_next, >+.paginate_enabled_next, >+.paginate_disabled_last, >+.paginate_enabled_last { >+ float: left; >+ height: 16px; >+ margin: .5em; >+ width: 16px; >+} >+.paginate_disabled_first { >+ background-image: url("../../img/first-disabled.png"); >+} >+.paginate_enabled_first { >+ background-image: url("../../img/first.png"); >+ cursor: pointer; >+} >+.paginate_disabled_previous { >+ background-image: url("../../img/prev-disabled.png"); >+} >+.paginate_enabled_previous { >+ background-image: url("../../img/prev.png"); >+ cursor: pointer; >+} >+.paginate_disabled_next { >+ background-image: url("../../img/next-disabled.png"); >+} >+.paginate_enabled_next { >+ background-image: url("../../img/next.png"); >+ cursor: pointer; >+} >+.paginate_disabled_last { >+ background-image: url("../../img/last-disabled.png"); >+} >+.paginate_enabled_last { >+ background-image: url("../../img/last.png"); >+ cursor: pointer; >+} >+ >+ >+/* > table.display { > width: 100%; > } >diff --git a/koha-tmpl/opac-tmpl/prog/en/js/datatables.js b/koha-tmpl/opac-tmpl/prog/en/js/datatables.js >index 38dd1d5..e0cc888 100644 >--- a/koha-tmpl/opac-tmpl/prog/en/js/datatables.js >+++ b/koha-tmpl/opac-tmpl/prog/en/js/datatables.js >@@ -22,7 +22,8 @@ var dataTablesDefaults = { > "sProcessing" : window.MSG_DT_PROCESSING || "Processing...", > "sSearch" : window.MSG_DT_SEARCH || "Search:", > "sZeroRecords" : window.MSG_DT_ZERO_RECORDS || "No matching records found" >- } >+ }, >+ "sDom": '<"top pager"ilpf>t<"bottom pager"ip>' > }; > > >@@ -279,3 +280,105 @@ function replace_html_date( original_node, id, format ) { > script.text = script_content; > $(original_node).append( script ); > } >+ >+$.fn.dataTableExt.oPagination.four_button = { >+ /* >+ * Function: oPagination.four_button.fnInit >+ * Purpose: Initalise dom elements required for pagination with a list of the pages >+ * Returns: - >+ * Inputs: object:oSettings - dataTables settings object >+ * node:nPaging - the DIV which contains this pagination control >+ * function:fnCallbackDraw - draw function which must be called on update >+ */ >+ "fnInit": function ( oSettings, nPaging, fnCallbackDraw ) >+ { >+ nFirst = document.createElement( 'span' ); >+ nPrevious = document.createElement( 'span' ); >+ nNext = document.createElement( 'span' ); >+ nLast = document.createElement( 'span' ); >+ >+/* nFirst.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sFirst ) ); >+ nPrevious.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sPrevious ) ); >+ nNext.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sNext ) ); >+ nLast.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sLast ) );*/ >+ >+ nFirst.className = "paginate_button first"; >+ nPrevious.className = "paginate_button previous"; >+ nNext.className="paginate_button next"; >+ nLast.className = "paginate_button last"; >+ >+ nPaging.appendChild( nFirst ); >+ nPaging.appendChild( nPrevious ); >+ nPaging.appendChild( nNext ); >+ nPaging.appendChild( nLast ); >+ >+ $(nFirst).click( function () { >+ oSettings.oApi._fnPageChange( oSettings, "first" ); >+ fnCallbackDraw( oSettings ); >+ } ); >+ >+ $(nPrevious).click( function() { >+ oSettings.oApi._fnPageChange( oSettings, "previous" ); >+ fnCallbackDraw( oSettings ); >+ } ); >+ >+ $(nNext).click( function() { >+ oSettings.oApi._fnPageChange( oSettings, "next" ); >+ fnCallbackDraw( oSettings ); >+ } ); >+ >+ $(nLast).click( function() { >+ oSettings.oApi._fnPageChange( oSettings, "last" ); >+ fnCallbackDraw( oSettings ); >+ } ); >+ >+ /* Disallow text selection */ >+ $(nFirst).bind( 'selectstart', function () { return false; } ); >+ $(nPrevious).bind( 'selectstart', function () { return false; } ); >+ $(nNext).bind( 'selectstart', function () { return false; } ); >+ $(nLast).bind( 'selectstart', function () { return false; } ); >+ }, >+ >+ /* >+ * Function: oPagination.four_button.fnUpdate >+ * Purpose: Update the list of page buttons shows >+ * Returns: - >+ * Inputs: object:oSettings - dataTables settings object >+ * function:fnCallbackDraw - draw function which must be called on update >+ */ >+ "fnUpdate": function ( oSettings, fnCallbackDraw ) >+ { >+ if ( !oSettings.aanFeatures.p ) >+ { >+ return; >+ } >+ >+ /* Loop over each instance of the pager */ >+ var an = oSettings.aanFeatures.p; >+ for ( var i=0, iLen=an.length ; i<iLen ; i++ ) >+ { >+ var buttons = an[i].getElementsByTagName('span'); >+ if ( oSettings._iDisplayStart === 0 ) >+ { >+ buttons[0].className = "paginate_disabled_first"; >+ buttons[1].className = "paginate_disabled_previous"; >+ } >+ else >+ { >+ buttons[0].className = "paginate_enabled_first"; >+ buttons[1].className = "paginate_enabled_previous"; >+ } >+ >+ if ( oSettings.fnDisplayEnd() == oSettings.fnRecordsDisplay() ) >+ { >+ buttons[2].className = "paginate_disabled_next"; >+ buttons[3].className = "paginate_disabled_last"; >+ } >+ else >+ { >+ buttons[2].className = "paginate_enabled_next"; >+ buttons[3].className = "paginate_enabled_last"; >+ } >+ } >+ } >+}; >-- >1.7.7.3 >
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 6836
:
5284
|
5291
|
5294
|
6340
|
6387
|
6467
|
6468
|
6522
|
6523
|
6524
|
7112
|
7120
|
7121
|
7122
|
7123
|
7124
|
7243
|
7244
|
7298
|
7299
|
7300
|
7301
|
7302