Geekly Articles each Day
📜 ⬆️ ⬇️

We filter by jQuery a large amount of data

image I have a very large darling of favorites in Habré. There it was very difficult to find something, but if you still don’t remember how and what, then it will be too hard. According to this, I decided to write on jQuery a filter of all this good by tags. In order to grab the bookmarks, ukko made a simple grabber last spring. As a result, we got a huge htm in the format of NETSCAPE Bookmarks and xml.

The principle of operation is simple, we set ourselves a grabber, we get the coveted habrabookmarks.htm, and just run my sorting file side by side.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html xmlns= "http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv= "content-type" content= "text/html; charset=UTF-8" />
<title>Sort Bookmarks</title>
<script type= "text/javascript" src= "http://code.jquery.com/jquery-1.4.2.js" ></script>
<script type= "text/javascript" >
//
getUniqueValues = function (arr) {
var hash = new Object();
for (j = 0; j < arr.length; j++) {hash[arr[j]] = true }
var array = new Array();
for (value in hash) {array.push(value)};
return array;
}

// php
function nl2br (str, is_xhtml) {
var breakTag = (is_xhtml || typeof is_xhtml === 'undefined' ) ? '<br />' : '<br>' ;
return (str + '' ).replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1' + breakTag + '$2' );
}

// .

/*
* 1
* strg (String)
*/

function _sort (strg) {
//
$( ".sat" ).show();
//
$( "#tagz .tgs" ).hide().next().hide();
// strg,
$( "#tagz .tgs[rel^=" +strg+ "]" ).show().next().show();
return false ;
}

/*
*
*/

function C_sort() {$( ".sat" ).hide();$( "#tagz .tgs" ).show().next().show(); return false ;}

/*
*
* strg (String)
*/

function _filter (strg) {
//
$( ".sabm" ).show();
//
$( "DL A" ).parent().hide().next().hide();
// strg,
$( "DL A[tags*=" +strg+ "]" ).parent().show().next().show();
return false ;
}

/*
*
*/

function C_filter () {$( ".sabm" ).hide();$( "DL A" ).parent().show().next().show(); return false ;}

//
$.get( 'habrabookmarks.htm' , function (data) {
$( 'body' ).html(data);

// ,
$( "<div>" )
.attr( "id" , "tagz" )
.css({
"float" : "right" ,
"padding" : "10px" ,
"width" : "310px" ,
"height" : "auto" ,
"overflow" : "auto"
})
.insertBefore($( "h1:eq(0)" ));

//
$( "h1:eq(0)" ).append( " <a href='javascript:' class='sabm' style='display: none; color: green;' onclick='C_filter();'><small>(show all)</small></a>" );

//
var
allTags = aT = curSA = [],
abc = ".-1234567890qwertyuiopasdfghjklzxcvbnm" ,
j = 0;

//
abc = abc.split( '' ).sort();
//
for ( var i in abc)
curSA[i] = "<a href='javascript:' onclick='_sort($(this).text())'>" +abc[i]+ "</a>" ;
// +
$( "#tagz" ).append(curSA.join( ", " ) + " <a href='javascript:' class='sat' style='display: none; color: red;' onclick='C_sort();'>x</a> <br><br> " );

//
// tags
$( "DL A" ).each( function (){
//
allTags = $( this ).attr( "tags" ).split( ',' );
//
var curTDA = $( this ).parent().next();
//
curTDA.html(nl2br(curTDA.html()));
// ,
if (allTags.length > 0) {
var curA = [];
for ( var i in allTags) {
// - ,
aT[j] = curA[i] = "<a class='tgs' rel='" +allTags[i]+ "' href='javascript:' onclick='_filter($(this).text())'>" +allTags[i]+ "</a>"
j++;
}
// ( )
curTDA.append( "<br>" + curA.join( ', ' ) + "<hr>" );
}
}).attr( "target" , "_blank" ); //
// ,
$( "#tagz" ).append(getUniqueValues(aT).sort().join( '<span>, </span>' ));
// ,
});

</script>
</head>
<body>
</body>
</html>


-
Bookmark demo and source file
Arch willow

')

Source: https://habr.com/ru/post/93876/

More articles:


All Articles