Tag: hacks
A DRY abomination
by David on Jan.30, 2010, under Uncategorized
One of my habits when presented with a new framework/platform is to implement a problem I know like the back of my hand. Usually the user interface isn’t of concern so I haven’t done much to improve on the logic there. I decided to try something different with this implementation of Tic-Tac-Toe:
Given the following
<table border="1" style="height:100%; width:100%" > <tr class="x0"> <td class="y0"> </td> <td class="y1"> </td> <td class="y2"> </td> </tr> <tr class="x1"> <td class="y0"> </td> <td class="y1"> </td> <td class="y2"> </td> </tr> <tr class="x2"> <td class="y0"> </td> <td class="y1"> </td> <td class="y2"> </td> </tr> </table>
I used the following logic to determine the coordinates from a user click
var clickHandler = function(e){ //Recieves a plan/jQuery managed event object var element = e.target; var parent = element.parentNode; var x,y; //Below is fine for 0-9 scenario's but will need to be refactored for more //advanced/larger grids. try{ y = element.classNames().detect(function(cls) { if( /y\d/.match(cls)){ return true; }})[1]; x = parent.classNames().detect(function(cls) { if( /x\d/.match(cls)){ return true;}})[1]; }catch(e){ console.debug(e); return; } console.log("Coordinate " + x + "," + y); };
The cool thing about this, is that with jQuery I can do jQuery(“#myTable tr.x2 td.y0″) and get the exact cell I am looking for… or even crazier stuff like:
“#myTable td.y0″ to select vertically down a row
OR
“#myTable tr.x0″ to select horizontally.