Permalink
Browse files

The icon selector is now happily howsted on GH Pages, remove the code…

… from my site and link out
  • Loading branch information...
1 parent 01e618d commit 7dd12237490af6db40230ec60128c306cda24382 @dsingleton committed Mar 8, 2013
@@ -1,79 +0,0 @@
-
-/** Filter */
-.filter {
-}
-
-.filter h2 {
-}
-
-.filter input {
- position: relative;
- top: -4px;
- width: 8em;
-}
-
-/** Preview */
-.preview {
-
-}
-
-.preview h2 {
- margin-left: 60px;
-}
-.preview #preview {
- height: 64px;
- float: left;
- width: 64px;
- padding: 4px;
- border: 1px solid #ddd;
- text-align: center;
- vertical-align: bottom;
- color: #ccc;
-
- position: relative;
- left: 180px;
- top: -30px;
-}
-
-/** Icons */
-
-div#iconSelector {
- float: left;
- width: 100%;
- padding: 0 0 40px 0;
-}
-
-ol {
- margin: 1em 0 2em;
- padding: 20px 0 4em;
-}
-
-ol li {
- list-style: none;
- display: inline;
- float: left;
- margin: 0;
-}
-
-ol li a {
- display: block;
- float: left;
- padding: 2px;
-}
-
-ol li a:hover {
- background: none;
-}
-
-ol li img {
- border: 1px solid #eee;
- padding: 2px;
- width: 16px;
- height: 16px;
- float: left;
-}
-
-ol li a:hover img {
- border: 1px solid #0063DC;
- background: #eee;
-}
@@ -1,64 +0,0 @@
-
-$(document).ready(function() {
-
- // Add Form
- $('div.primary').after(
- '<div class="secondary"> \
- <form action="" class="filter" autocomplete="off"> \
- <h2><label for="search">Filter</label></h2> \
- <input type="text" class="text" name="search" id="search" /> \
- </form> \
- </div>'
- );
-
- // Add preview
- $('div.secondary').after(
- '<div class="tertiary preview"> \
- <h2>Preview</h2> \
- <img id="preview" alt="Hover on icon " /> \
- </div>'
- );
- $('.preview').hide().fadeIn(1500);
-
-
- $('.filter').hide().fadeIn(1500);
-
- // All the icons, we'll be using this a lot
- var icons = $('ol.icons li a');
-
- // Add hover previews (doesn't work on filtered out icons)
- icons.hover(function() {
-
- if ($(this).css('opacity') > .5) {
- $('img#preview').attr('src', this.href);
- }
- return false;
-
- }, function() {
- // Remove hover afterwards
- if ($(this).css('opacity') > .5) {
- $('img#preview').removeAttr('src');
- }
- });
-
- // Filtering search (with delay)
- var search_timer = false;
- $('#search').keyup(function() {
-
- // Clear timed events if we've have another key press
- if (search_timer) {
- window.clearTimeout(search_timer);
- }
-
- var filter = this.value;
- search_timer = window.setTimeout(function () {
- // If we match the filter word anywhere then full opacity,
- // otherwise greyed out
- icons.each(function() {
- var opacity = (this.title.indexOf(filter) >= 0) ? 1 : 0.1;
- $(this).css('opacity', opacity);
- });
- }, 300);
- return false;
- });
-});
@@ -1,37 +0,0 @@
-<?php require_once '../../../init.php'; ?>
-<?php
-
-$icons = glob('icons/*.png');
-// $icons = array_slice($icons, 0, 100);
-
-$title = "Icon Selector";
-$extra_css = array('icons.css', '/static/css/slim.css');
-$extra_js = array('/static/js/jquery.js', 'icons.js');
-
-?>
-<?php require '../../_inc/header.inc.php'; ?>
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-
- <div class="l-3col">
- <div class="primary">
- <h1>Icon Selector</h1>
- <p class="tagline">For the <a href="http://www.famfamfam.com/">Silk Icon</a> set, <a href="/blog/fun-with-famfamfam-icons-and-jquery">find out more</a></p>
- </div>
- </div>
-
- <div id="iconSelector">
- <ol class="icons">
-<?php foreach($icons as $file) { ?>
- <li>
- <a title="<?php h(str_replace('_', ' ', basename($file, '.png'))) ?>" href="<?php h($file) ?>">
- <img src="<?php h($file) ?>" alt="<?php h($file) ?>" />
- </a>
- </li>
-<?php } ?>
- </ol>
- </div>
-
-
-<?php require '../../_inc/footer.inc.php'; ?>
View
@@ -25,7 +25,7 @@
<dt><a href="/code/firefox-plugin-test-suite">Firefox plugin detection test-suite</a></dt>
<dd>A set of heuristic test to detect certain plugins, like NoScript, FlashBlock and AdBlock.</dd>
- <dt><a href="/code/icon-selector">Icon Selector</a></dt>
+ <dt><a href="http://dsingleton.github.com/icon-selector">Icon Selector</a></dt>
<dd>An interface to searching for icons within the excellent FamFamFam icon set, powered by jQuery. Provides a live search, with immediate visual feedback highlight matching icons.</dd>
<dt><a href="/code/1bit">1bit Player</a></dt>

0 comments on commit 7dd1223

Please sign in to comment.