Oct/071
PHP: Mixing SimpleXML and json_encode
Recently, I've been doing a lot of work with XML and json. One small problem I ran into was assigning SimpleXML variables to a class variable and then running it through json_encode:
"pageLength":{"0":"10"}
The simple solution I came up with, but which were not readily apparent in the documentation is that you need to simply cast the SimpleXML variable to a string or int.
$object->pageLength = (int)$xml->element;
which produces this json:
"pageLength":0
Hope this helps someone else save some time.
Feb/072
Javascript IDE and Firefox
Where is the javascript IDE? I know that you can use Eclipse, TextMate, Notepad and other such programs to edit javascript, and that more often then not said javascript is generated in the context of another language (php, ruby, java, or even .NET). I think that there could be huge potential for a Firefox addon that acted as an editor. Firebug is already most of the way there at 1.0. Could we join the missing link between Firebug and Notepad? /drool
Feb/070
Prototype Website and Documentation
At the risk of repeating news, and reporting it late at that, in internet time at least, and using too many appositives in a sentence, prototype has finally gotten documentation!
According to their website:
Prototype is a JavaScript Framework that aims to ease development of dynamic web applications.
Basically, it aims to take a lot of the common functions that web developers use, finding elements on a page, making ajax calls, writing classes, etc and wrap them into a library that worries about the various browser implementations of javascript so that you don't have to.
Prototype has recently been officially released as version 1.5, up to now there had been a few release clients. As part of the release they have released a website at prototypejs.org that finally includes a central place to view API documentation and discuss how you use prototype with other developers! Additionally, the people at Global Moxie have made the documentation available as a pdf for easy printing and offline reference. Great work!
Oct/060
IE, Why must you persecute me!?
As the CSS at lijit.com evolves I find myself continually up against the uncompliant Internet Explorer. The flavor this week is min and max width height. As you may or may not be aware the truly standards compliant browsers allow you to set both min-width and max-width properties to give you the ability to have a fluid layout appropriate for multiple monitor sizes. After a little research I found out that IE does support javascript from within CSS of all things. This allows you to keep track of the size of the window and hack in changing the size of your element. The first solution I found was over at svendtofte.com showing this code:
[css]
#element {
width:expression(document.body.clientWidth < 800 ? "800px" : "auto");
}
[/css]
I thought this was a pain, but it worked, so I extended it to handle both min and max:
[css]
#element {
width:expression(document.body.clientWidth < 800 ? "800px" : document.body.clientWidth < 1200 ? "1200px" : "auto");
}
[/css]
I figured I was all set, then I played with it in IE and wham, it froze. After more research and I found a post at cameronmoll.com indicating that using this method can introduce a race condition and infinite loop in IE. The solution, change your math slightly!? *sigh* So, here's the final working CSS that will be introduced in the next Lijit release that will give you a fluid layout between 800 and 1200 pixels:
[css]
#element {
min-width: 800px;
max-width: 1200px;
width:expression(document.body.clientWidth < 800 ? "800px" : document.body.clientWidth < 1200 ? "1200px" : "auto");
}
[/css]
Sep/060
Taming Avatars
When developing in the social world of Web 2.0 you find yourself attatching avatars to users. These avatars not only allow the users to customize how the world sees them, but also to give you a way of identifying users without using text, conserving screen real estate.
After looking at the way that other sites allow you to upload your avatar, I know that I was going to have to do something similar. I thought about rolling my own, but who has the time. A short goole search later and I discovered Dave Spurr at defusion.org.uk had spent the time to create a javascript library built on Prototype and Script.aculo.us that allows you to crop images. He calls it Javascript Cropper UI. It's very slick and since it builds upon libraries I am already using it was an obvious choice.
Unfortunately, out of the box it didn't support multiple previews, something I wanted to include, so after a morning of hacking I have added the ability to pass in multiple individually sized preview windows. I also removed the dependecy on minimum widths and heights, as I pass in the size of each preview. You do need to constrain the ratio of your select box and previews equally however or your images will become distorted.
Check out a demo here.