mirror of https://github.com/evilhero/mylar
replaced alphabetSearch.js with corrected one
This commit is contained in:
parent
0b394a7ba9
commit
8bdcb2f616
|
@ -101,7 +101,7 @@
|
||||||
|
|
||||||
<%def name="headIncludes()">
|
<%def name="headIncludes()">
|
||||||
<link rel="stylesheet" href="interfaces/default/css/data_table.css">
|
<link rel="stylesheet" href="interfaces/default/css/data_table.css">
|
||||||
<link type="text/css" href="css/alphabetSearch.css" rel="stylesheet">
|
<link rel="stylesheet" href="css/alphabetSearch.css">
|
||||||
</%def>
|
</%def>
|
||||||
|
|
||||||
<%def name="javascriptIncludes()">
|
<%def name="javascriptIncludes()">
|
||||||
|
@ -114,7 +114,7 @@
|
||||||
$.fn.DataTable.ext.pager.numbers_length = 3;
|
$.fn.DataTable.ext.pager.numbers_length = 3;
|
||||||
var table = $('#series_table').dataTable( {
|
var table = $('#series_table').dataTable( {
|
||||||
"destroy": true,
|
"destroy": true,
|
||||||
"sDom": '<"clear"Af><"clear"lp><"clear">rt<"clear"ip>',
|
"sDom": '<"clear"Af><"clear"lp><"clear">rt<"clear"ip>',
|
||||||
"columnDefs": [
|
"columnDefs": [
|
||||||
{ "orderable": false, "targets": [5, 7, 10] },
|
{ "orderable": false, "targets": [5, 7, 10] },
|
||||||
{ "visible": false, "targets": [5, 7, 10] },
|
{ "visible": false, "targets": [5, 7, 10] },
|
||||||
|
|
|
@ -4,9 +4,9 @@
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @summary AlphabetSearch
|
* @summary AlphabetSearch
|
||||||
* @description Show an alphabet aloneside a table providing search input options
|
* @description Show an alphabet aloneside a table providing search input options
|
||||||
* See http://datatables.net/blog/2014-09-22 for details
|
* See http://datatables.net/blog/2014-09-22 for details
|
||||||
* @version 1.0.0
|
* @version 1.0.0
|
||||||
* @file dataTables.alphabetSearch.js
|
* @file dataTables.alphabetSearch.js
|
||||||
* @author SpryMedia Ltd (www.sprymedia.co.uk)
|
* @author SpryMedia Ltd (www.sprymedia.co.uk)
|
||||||
* @contact www.sprymedia.co.uk/contact
|
* @contact www.sprymedia.co.uk/contact
|
||||||
|
@ -26,137 +26,137 @@
|
||||||
|
|
||||||
// Search function
|
// Search function
|
||||||
$.fn.dataTable.Api.register( 'alphabetSearch()', function ( searchTerm ) {
|
$.fn.dataTable.Api.register( 'alphabetSearch()', function ( searchTerm ) {
|
||||||
this.iterator( 'table', function ( context ) {
|
this.iterator( 'table', function ( context ) {
|
||||||
context.alphabetSearch = searchTerm;
|
context.alphabetSearch = searchTerm;
|
||||||
} );
|
} );
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
} );
|
} );
|
||||||
|
|
||||||
// Recalculate the alphabet display for updated data
|
// Recalculate the alphabet display for updated data
|
||||||
$.fn.dataTable.Api.register( 'alphabetSearch.recalc()', function ( searchTerm ) {
|
$.fn.dataTable.Api.register( 'alphabetSearch.recalc()', function ( searchTerm ) {
|
||||||
this.iterator( 'table', function ( context ) {
|
this.iterator( 'table', function ( context ) {
|
||||||
draw(
|
draw(
|
||||||
new $.fn.dataTable.Api( context ),
|
new $.fn.dataTable.Api( context ),
|
||||||
$('div.alphabet', this.table().container())
|
$('div.alphabet', this.table().container())
|
||||||
);
|
);
|
||||||
} );
|
} );
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
|
||||||
// Search plug-in
|
// Search plug-in
|
||||||
$.fn.dataTable.ext.search.push( function ( context, searchData ) {
|
$.fn.dataTable.ext.search.push( function ( context, searchData ) {
|
||||||
// Ensure that there is a search applied to this table before running it
|
// Ensure that there is a search applied to this table before running it
|
||||||
if ( ! context.alphabetSearch ) {
|
if ( ! context.alphabetSearch ) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
if ( context.alphabetSearch.match('nonalpha') && !(searchData[1].charAt(0).match(/^[a-zA-Z]/
|
if ( context.alphabetSearch.match('nonalpha') && !(searchData[1].charAt(0).match(/^[a-zA-Z]/)) ) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
if ( searchData[1].charAt(0) === context.alphabetSearch ) {
|
if ( searchData[1].charAt(0) === context.alphabetSearch ) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
|
||||||
// Private support methods
|
// Private support methods
|
||||||
function bin ( data ) {
|
function bin ( data ) {
|
||||||
var letter, bins = {};
|
var letter, bins = {};
|
||||||
var nonalpha = 0;
|
var nonalpha = 0;
|
||||||
bins['nonalpha'] = 0;
|
bins['nonalpha'] = 0;
|
||||||
for ( var i=0, ien=data.length ; i<ien ; i++ ) {
|
for ( var i=0, ien=data.length ; i<ien ; i++ ) {
|
||||||
letter = data[i].charAt(13).toUpperCase();
|
letter = data[i].charAt(13).toUpperCase();
|
||||||
if ( !letter.match(/^[A-Z]/) ) {
|
if ( !letter.match(/^[A-Z]/) ) {
|
||||||
bins['nonalpha']++;
|
bins['nonalpha']++;
|
||||||
}
|
}
|
||||||
else if ( bins[letter] ) {
|
else if ( bins[letter] ) {
|
||||||
bins[letter]++;
|
bins[letter]++;
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
bins[letter] = 1;
|
bins[letter] = 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return bins;
|
return bins;
|
||||||
}
|
}
|
||||||
|
|
||||||
function draw ( table, alphabet )
|
function draw ( table, alphabet )
|
||||||
{
|
{
|
||||||
alphabet.empty();
|
alphabet.empty();
|
||||||
alphabet.append( 'Search: ' );
|
alphabet.append( 'Search: ' );
|
||||||
|
|
||||||
var columnData = table.column(1).data();
|
var columnData = table.column(1).data();
|
||||||
var bins = bin( columnData );
|
var bins = bin( columnData );
|
||||||
|
|
||||||
$('<span class="clear active"/>')
|
$('<span class="clear active"/>')
|
||||||
.data( 'letter', '' )
|
.data( 'letter', '' )
|
||||||
.data( 'match-count', columnData.length )
|
.data( 'match-count', columnData.length )
|
||||||
.html( 'None' )
|
.html( 'None' )
|
||||||
.appendTo( alphabet );
|
.appendTo( alphabet );
|
||||||
|
|
||||||
$('<span class="clear active"/>')
|
$('<span class="clear active"/>')
|
||||||
.data( 'letter', 'nonalpha' )
|
.data( 'letter', 'nonalpha' )
|
||||||
.data( 'match-count', bins['nonalpha'] || 0 )
|
.data( 'match-count', bins['nonalpha'] || 0 )
|
||||||
.html( '0-9' )
|
.html( '0-9' )
|
||||||
.appendTo( alphabet );
|
.appendTo( alphabet );
|
||||||
|
|
||||||
for ( var i=0 ; i<26 ; i++ ) {
|
for ( var i=0 ; i<26 ; i++ ) {
|
||||||
var letter = String.fromCharCode( 65 + i );
|
var letter = String.fromCharCode( 65 + i );
|
||||||
|
|
||||||
$('<span/>')
|
$('<span/>')
|
||||||
.data( 'letter', letter )
|
.data( 'letter', letter )
|
||||||
.data( 'match-count', bins[letter] || 0 )
|
.data( 'match-count', bins[letter] || 0 )
|
||||||
.addClass( ! bins[letter] ? 'empty' : '' )
|
.addClass( ! bins[letter] ? 'empty' : '' )
|
||||||
.html( letter )
|
.html( letter )
|
||||||
.appendTo( alphabet );
|
.appendTo( alphabet );
|
||||||
}
|
}
|
||||||
|
|
||||||
$('<div class="alphabetInfo"></div>')
|
$('<div class="alphabetInfo"></div>')
|
||||||
.appendTo( alphabet );
|
.appendTo( alphabet );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
$.fn.dataTable.AlphabetSearch = function ( context ) {
|
$.fn.dataTable.AlphabetSearch = function ( context ) {
|
||||||
var table = new $.fn.dataTable.Api( context );
|
var table = new $.fn.dataTable.Api( context );
|
||||||
var alphabet = $('<div class="alphabet"/>');
|
var alphabet = $('<div class="alphabet"/>');
|
||||||
|
|
||||||
draw( table, alphabet );
|
draw( table, alphabet );
|
||||||
|
|
||||||
// Trigger a search
|
// Trigger a search
|
||||||
alphabet.on( 'click', 'span', function () {
|
alphabet.on( 'click', 'span', function () {
|
||||||
alphabet.find( '.active' ).removeClass( 'active' );
|
alphabet.find( '.active' ).removeClass( 'active' );
|
||||||
$(this).addClass( 'active' );
|
$(this).addClass( 'active' );
|
||||||
|
|
||||||
table
|
table
|
||||||
.alphabetSearch( $(this).data('letter') )
|
.alphabetSearch( $(this).data('letter') )
|
||||||
.draw();
|
.draw();
|
||||||
} );
|
} );
|
||||||
|
|
||||||
// Mouse events to show helper information
|
// Mouse events to show helper information
|
||||||
alphabet
|
alphabet
|
||||||
.on( 'mouseenter', 'span', function () {
|
.on( 'mouseenter', 'span', function () {
|
||||||
alphabet
|
alphabet
|
||||||
.find('div.alphabetInfo')
|
.find('div.alphabetInfo')
|
||||||
.css( {
|
.css( {
|
||||||
opacity: 1,
|
opacity: 1,
|
||||||
left: $(this).position().left,
|
left: $(this).position().left,
|
||||||
width: $(this).width()
|
width: $(this).width()
|
||||||
} )
|
} )
|
||||||
.html( $(this).data('match-count') );
|
.html( $(this).data('match-count') );
|
||||||
} )
|
} )
|
||||||
.on( 'mouseleave', 'span', function () {
|
.on( 'mouseleave', 'span', function () {
|
||||||
alphabet
|
alphabet
|
||||||
.find('div.alphabetInfo')
|
.find('div.alphabetInfo')
|
||||||
.css('opacity', 0);
|
.css('opacity', 0);
|
||||||
} );
|
} );
|
||||||
|
|
||||||
// API method to get the alphabet container node
|
// API method to get the alphabet container node
|
||||||
this.node = function () {
|
this.node = function () {
|
||||||
return alphabet;
|
return alphabet;
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
$.fn.DataTable.AlphabetSearch = $.fn.dataTable.AlphabetSearch;
|
$.fn.DataTable.AlphabetSearch = $.fn.dataTable.AlphabetSearch;
|
||||||
|
@ -164,12 +164,13 @@ $.fn.DataTable.AlphabetSearch = $.fn.dataTable.AlphabetSearch;
|
||||||
|
|
||||||
// Register a search plug-in
|
// Register a search plug-in
|
||||||
$.fn.dataTable.ext.feature.push( {
|
$.fn.dataTable.ext.feature.push( {
|
||||||
fnInit: function ( settings ) {
|
fnInit: function ( settings ) {
|
||||||
var search = new $.fn.dataTable.AlphabetSearch( settings );
|
var search = new $.fn.dataTable.AlphabetSearch( settings );
|
||||||
return search.node();
|
return search.node();
|
||||||
},
|
},
|
||||||
cFeature: 'A'
|
cFeature: 'A'
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
|
||||||
}());
|
}());
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue