Simple,
Place the php file under the glyphicons directory (not the halflings) and then add that to a webserver (I just symlink the glyphicons directory under /var/www)
And tada! :D
Created
April 12, 2012 19:48
-
-
Save kennydude/2370525 to your computer and use it in GitHub Desktop.
Glyphicons Index
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <title>Glyphicons</title> | |
| <style type="text/css"> | |
| body{font-family: "Lucida Grande", "Lucida Sans", "Ubuntu", sans-serif;} | |
| .about_to_filter{display: none;} | |
| </style> | |
| </head> | |
| <body> | |
| <h1>Glyphicons Index</h1> | |
| <input type="search" id="filter" placeholder="Filter" /><span class="about_to_filter">About to filter...</span> | |
| <table> | |
| <?php | |
| foreach (glob("png/*@2x.png") as $filename) { | |
| echo '<tr><td><img src="'; | |
| echo $filename; | |
| echo '" />'; | |
| echo '</td><td class="tag">'. substr($filename, strlen("png/glyphicons_000_"), -7) .'</td><td><a href="'.$filename.'">2X</a></td>'; | |
| $filename = substr($filename, 0, -7) . ".png"; | |
| echo '<td><a href="'.$filename.'">1X</a></td>'; | |
| echo '</tr>'; | |
| } | |
| ?> | |
| </table> | |
| <script type="text/javascript" src="http://code.jquery.com/jquery.js"></script> | |
| <script type="text/javascript"> | |
| function real_filter(){ | |
| console.log("filter..."); | |
| $(".about_to_filter").hide(); | |
| if($("#filter").val() == ""){ $("tr").show(); return; } | |
| $("tr").show().each(function(){ | |
| if($(".tag", this).text().indexOf($("#filter").val()) == -1 && $(".tag", this).text() != $("#filter").val()){ | |
| $(this).hide(); | |
| } | |
| }); | |
| } | |
| function filter(){ | |
| if(typeof window.filter_timeout == "number") { | |
| console.log("Clearing filter timeout"); | |
| clearTimeout(window.filter_timeout); | |
| delete window.filter_timeout; | |
| } | |
| $(".about_to_filter").show(); | |
| window.filter_timeout = setTimeout("real_filter();", 100); | |
| } | |
| $(document).ready(function(){ | |
| $("#filter").keyup(filter); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment