Cookie Notice

As far as I know, and as far as I remember, nothing in this page does anything with Cookies.

2009/12/10

Annotated jQuery, or pass me the crack pipe

Here's some code. This is what is on my mind today.


$( '<div/>' ) // We create a DIV tag
.attr( 'id' , 'e_solid' ) // give it a unique identifier
.text( 'solid' ) // put text into it
.appendTo('#head') // give it a unique identifier
.click( function() { // and set what happens when you click it
var ajax = a_dir + '2g_slide_formats.cgi' + '?e=solid' ; // which is, set a URL
$( '#e_454' ).css( 'color' , '#abc' ) ; // do some CSS stuff
$( '#e_solid' ).css( 'color' , '#000' ) ; // that won't work by
// setting it in the CSS file
$( '#run' ).empty() ; // clear some other
$( '#slide' ).empty() ; // subordinate tags
$( '<div/>') // We create a new DIV tag
.text('Slide Type') // fill it
.appendTo('#run') // put it into another tag
;
$( '<select/>') // we create a select box
.attr('id','holder') // give it an id
.appendTo('#run') // put it in the same tag
.wrap(document.createElement("div")) // put a DIV tag around it
.change( function() { // and an action for when
// the select changes
var value = $(this).val() ;
$( '#slide' ).empty() ; // empty '#slide' again
for ( var i = 1 ; i <= value ; i++ ) { // and figure the number of
// regions from the select value
var div_name = 'region_' + i ; // and make a name
$( '<div/>' )
.attr( 'id' , div_name ) // which we use to name a new DIV
.text( 'Region ' + i ) // which we fill
.addClass( 'region' ) // class
.appendTo( '#slide' ) // and append to the emptied #slide
;
$( '<span/>') // then add a SPAN
.appendTo( '#' + div_name ) // which we append to that new DIV
.text( 'Add barcode' )
.click( function() { // and when you click it ...
var accession = prompt( // you're prompted for one field
'Set Accession Number'
) ;
var barcode = prompt( // and then another
'Set Barcode, or Make Blank' , 'MID'
) ;
var strID = 'div_' + div_count ++ ;
alert( div_name ) ; // this is a bit of debugging.
$( '<div/>' ) // yet another DIV
.attr( 'id' , strID )
.appendTo( '#' + div_name + ' .body' )
; // which should go to the .body
// but doesn't, which is why I'm writing
$( '<span/>' )
.appendTo( '#' + strID)
.text( accession )
.addClass( 'accession' ) // and we add SPANs to that DIV
;
$( '<span/>' )
.appendTo( '#' + strID)
.text( barcode )
.addClass( 'barcode' ) // which are the data we are
; // prompted for
$( '<span/>' )
.appendTo( '#' + strID)
.text( 'delete' )
.addClass( 'delete')
.click(function(){ // and another SPAN
$( '#' + strID ).remove() ;
}) ; // that you click to remove
}) ; // this whole DIV and all in it
}
}) ; // It looks like we're done but that's just the end
// of the definition of the SELECT
// which we fill with AJAX and JSON
$.getJSON( ajax , function(data){ // we get a data chunk from JSON
var objD = eval( data ) ; // convert it to an object
for ( var i = 0 ; i < 100 ; i++ ) { // The shotgun approach saves me
if ( objD[i] != undefined ) { // from having to be clever
$( '<option/>') // and we add all the OPTIONS
.attr('value', objD[i].max_regions )
.text( objD[i].format ) // to the previously mentioned SELECT
.appendTo('#holder') // Remember the SELECT?
;
}
}
}) ;
}) // And here we end it. That was all one "line"
; // and it isn't quite correct.


My brain hurts.