Trey Runcie

http://iplay4e.appspot.com/characters/agdpcGxheTRlchMLEgtDaGFyYWN0ZXJWMhieijMM

Item Selector is a Javascript list multi-select UI component similar to a multiple select form element. It allows the user to click, shift+click, and crtl/option+click the elements to make a selection. It also has a few custom events which can be subscribed to. It uses the YUI Global Object, YUI Dom object, and the YUI Event object available from the Yahoo! User Interface Library.

Item Selector example

The mark up is a simple ul:

<ul id="selectable-container">
    <li><a href="#">dog</a></li>
    <li><a href="#">cat</a></li>
    <li><a href="#">bird</a></li>
    <li><a href="#">whale</a></li>
    <li><a href="#">frog</a></li>
    <li><a href="#">monkey</a></li>
    <li><a href="#">mouse</a></li>
</ul>

The reason for the “<a>” tags is to keep the browser from selecting the text during a shift+click.

To create an instance of ItemSelector:

var selectContainer = new ItemSelector.selectList('selectable-container',{css:{selectedClass: 'selected-item'}});

The first argument to the selectList method is the id of the ul and the second argument is a config object containing a class to apply to the selected li’s.

Here are a few events which can be subscribed to:

• hasSelection – fires whenever the selection is modified and there is still a selection
• noSelection – fires when the selection is cleared or the selection length becomes zero
• noItems – fires when all list elements have been removed
• lengthChanged – fires whenever the selection length changes
• itemDoubleClick – fires if an item has been double clicked

Justin Hook’s blog came to my attention today through my friend Ed. The subject of his post is “My first experience with Microsoft Speech Recognition” Which apparently was James Hook pumping Will Smith’s “The Fresh Prince of Bel Air” theme song into MS Vista’s speech recognition. Which Ed then took the text from and put it through OS X’s text to speech engine, which then was mixed with a version of the Fresh Prince theme by another friend, Brad. Finally Ed  finally mixed it with the opening video from the show… What did I do? I laughed my ass off because I work with some funny people.

Here’s the outcome.

This is a method of working on a project locally and saving to a remote staging server.

You will need to be able to rsync to the remote computer without using a password. For this you will need to set up an ssh key.

Add the following shell script to Textmate as a command with input is set to none, output is set to Show as tooltip and my key equivalent is set to control+command+s (or whatever you like)

RSYNC_USER=${RSYNC_USER:-defaultUsername}
RSYNC_HOST=${RSYNC_HOST:-defaultHost}
if [ "${RSYNC_DIR}"  ]; then
	rsync -av --exclude "CVS*" --exclude "*.kpf" --exclude ".DS_Store" $RSYNC_DIR $RSYNC_USER@$RSYNC_HOST:$RSYNC_REMOTE
fi

Textmate can accept variables for this script on a per project basis. To do this open your project, make sure no files are hi-lighted in the project drawer then click on the “i” info icon at the bottom of the project drawer. Here you can add your required variables.
RSYNC_USER The user
RSYNC_DIR The local directory from which the rsync will be made. eg. “/User/me/Sites/myProject/”
RSYNC_REMOTE The remote directory in which to rsync. eg. “/var/www/myProject”
RSYNC_HOST The host name of the remote server.

Tip: It is always a good idea to echo out the rsync command and have a look at what it is doing before you let it run.

The HTML Builder is for creating markup structure with javascript in a concise nested structure. It uses the YUI Global Object and the YUI Dom object available from the Yahoo! User Interface Library.

There are four public functions.

1. contentTag: a function for creating html elements with child nodes.
2. tag: a function for creating self closing html elements like img, input or br.
3. write: a function for rendering the html elements to the DOM.
4. addEvent: a function that adds an event to an element and returns that element for rendering in the Dom.

HTML Builder Demo

Sample Usage

var HTML = YAHOO.treyruncie.html;
HTML.write(HTML.contentTag('a',{'href':'somelink'},'text node'));

var HTML = YAHOO.treyruncie.html;
HTML.write(
    HTML.contentTag('div',{'class':'divFromScript'},
        'DIV and input from script',
        HTML.tag('br'),
        HTML.contentTag('label',{'for':'sample'},
            'label for sample',
            HTML.tag('input',{'value':'hello world','name':'sample'})
        ),
        HTML.tag('br'),
        'DIV and input from script'
    ),
    'targetID','insertAfter'
);