☕MORGLOG

After being completely annoyed by SimpleXML earlier I decided it was time to look at DBXML again. This time I ran across a forum posting saying that DBXML 2.4.11 had a bug in it preventing updating. After upgrading to 2.4.13 I was able to update documents in a container. So I made some update to the project but realized that this was more of an out of control experiment than a real project. Already started redoing it, all the PHP is going to be new but I have managed to reuse most of the Javascript.

I also found this site DBXML With PHP, it is a small wiki for, as the name says, using DBXML with PHP. It has not been updated in a while (until today) but I will keep adding things as I progress on DBXML. Hopefully other will help out too, right now there are few resources for DBXML in PHP.

I am doing some work today on the DBXML Admin adding editable tag names, attributes and values like in Firebug. The way the HTML was laid out, the attributes each had a tag around them for styling. I was working on returning the LI/SPAN representation of the XML as an XML string for updating the server. The problem I was running into was in the way the selector was ordering the elements to be returned. The right way. What I wanted was different.

$('li:eq(1)').find('span.tagName,span.tagAttr,span.tagAttrValue,span.tagValue');

This worked fine if the node only had one or no attributes. But if there was more than one, it would group attribute names together and then group their values together. I know this could be solved with a bit of mapping or checking the tags while eaching, but making a new selector sounded funner.
So this is what I came up with. First I changed around the attribute tags. The span.tagAttr was a wrapper for the new span.tagAttrName and the original span.tagAttrValue. And the new subselector allow grabbing multiple descendant rather then just one ($(’ascendant descendant‘))

$('li:eq(1)'.find('span.tagName,span.tagAttr(span.tagAttrName,span.tagAttrValue),span.tagValue');

Simple as that and I have everything in the order it was supposed to be. I know this could be accomplished several different way. It was more of an exercise in selectors, but in the end I think it addition to the selector engine.
Here is a link to the patch for the current SVN.

While trying to sort out a problem with overflows and floats for work, I came up with am interesting CSS hack. I created right and left pointing, right triangles in pure css.

Yay CSS Arrow

So it is pretty simple. Those two arrow are just divs with float left or right, 1px width, and 1px solid red borders. By embedding these divs into each other over and over again, each one grows larger to accommodate the 1px border of the next child, creating a right triangle. Then I put each in a different div to position them. I have not put too much into this so far, but see some neat uses right away.
I have not tested this in anything but Firefox 3 Beta 4. My guess is IE will totally freak out, but who know, I do not actually care to test it.

This bug, is really bugging me. Have you noticed that in FF3 you cannot get a right click menu on most form elements? I made a patch to add a user option to allow you to enable or disable this behavior and let you actually use the menus the way they where intended. Not based on some idiotic MS behavior model. The patch is in the bug report.

I whipped up this selector after having the problem described in my last post with :contains(’16F88′) returning 16F88, 16F883, 16F886, etc.


jQuery.extend(jQuery.expr[":"],
{
content: “(a.textContent||a.innerText||”) == m[3]”
});


This will add the :content selector, that will return only exact matches.

So I pretty much use jQuery for everything. I have used it with Rhino and jetty to parse web pages in data mining. While doing CSS or design for work I regularly use jQuery and the Firebug console to make alterations before making changes to XSL or any other backend. Sometimes while on other sites, something will either just really bug me, like flash or bad element positioning. Firebug takes great care of this, inspect element, delete element. Done. But in a situation like doing a chip comparison on website for piklab. But they do not use jQuery.

The Bookmarklet.
The idea of a bookmarklet is too add the link to your favorites and when it is clicked the Javascript is executed in the pages scope. This script create a new script element, sets the src attribute to the latest version of jQuery and adds it to the current page. Now you can start choppin’ up anyones pages with jQuery.

The Problem.
So like I said. I was trying to look up info on piklabs website. They have headers on a really long data set and I am lazy. The chip I was looking at was near the bottom, and I cannot remember what those headers said by the time I got there, so those checks and x’s mean nothing. Inspect Element… We have some tr.headers (only at the top). tr.odd_row and tr.even_row for the zebra striping.

The Selector.
The chip I want is the 16F88 in the Midrange Family. First I get the row elements
$('tr.odd_row,tr.even_row')
This get all the non header row, now I want to remove all the element not containing 16F88, this is where jQuery really sets itself apart from other framework because of the way selectors can be stacked even within a single string.
$('tr.odd_row,tr_even_row').filter(':visible:not(:contains("16F88"))')
Because :not is a selector function that takes another selector, I can invert the :contains string removing all the other chips in the list. Yay. The one short coming here is that the :contains selector is a non-exact selector, so this match F88, F883, F886. This is not so much a problem of this selector, but that there is not an exact content selector in jQuery yet, unlike the attribute =, !=, ^=, $= (equal, not equal, starts with, ends with) selectors. And even with that, jQuery is still my favorite framework, and this is a nice little out of the normal use for it.

My laptop broke while I was out of town last week. I thought it was just the power adapter because I was using it when it just turned off. But nope. It is totally dead. Just bought it too, hope I do not get shanghai’d on the warranty.

One of the big problems in web design I have seen is trying to lay out divs in columns. Here is a cool hint on making nice subdivided columns that flow with screen width changes.

x
x


x

x
x

The really nice thing about this is that you can just continue to nest these pairs into each other and get as many nice divisions as you want. Hope this is useful.

I am really exited about recent talks I have had with the Erlycomet team, and now they are including an early version of the jQuery cometd plugin as one of their demo options! I am working now to include some code they contributed in the main distribution. I also setup a Google Code project with the latest SVN. I am really exited about all of this, and hope to see more interest and contributions to the project.

Yesterday was my first official UCI sanctioned race. And I won! No clue when I will be doing another, as unfortunately, there are only so many races I can get to on the BART.