/dev/null

Controlling iTunes remotely

So I just got this shiny new MacBook Pro. Absolutely love the thing. I’ve been away from the Macintosh platform for far too long…

Anyway – I’m sitting in my office listening to music and realized that the speakers, while okay for what they are, suck by most standards. So I pop over to my PC and fire up iTunes, hit play, and use my sound system that’s hooked up to it. Sounds great. But, I’m lazy and I got tired of switching over to it change tracks, stop, pause, etc. I figured there had to be a way to control iTunes remotely from the Mac. Doing a bit of research, I found some stuff for the Mac and a PHP script that did me no good.

Finally I came across a Perl script (can’t remember where…) that simply runs a Daemon. Everything that I needed was already there! All I needed to do, was point a browser at the box and it had a nice simple stripped down interface for play, pause, stop, next, etc…

After some time, I realized I hated having to keep the browser window open. Enter MacOS dashboard widgets.

After some quick fiddling with Dashcode, I came up with this little dashboard widget to send the requests to the PC. The current track name only updates after a command is sent, so it isn’t updated dynamically.

Now my iTunes controls are at my fingertips, and I don’t have to spend the time moving my hands the whole 24 some inches to the right to do it on the PC.

gZip your JavaScript

Most browsers these days (with the exception of Safari, I think?) will accept gzip encoded content. This means you can drastically reduce the size of all those bloated javascript libraries you might be using on your web site.

So how do you serve gzipped js files?

There a few methods out there. I chose the one below since it was fast, easy and I’m hella freakin’ lazy.

The first step is to gzip all of the javascript files that you might be serving up. The fastest way I found was to just telnet into the server, and execute the following bash command:

gzip -cr <javascript directory>

Of course you’ll need to replace <javascript directory> with the correct directory that your javascript files are located in. The -c option tells gzip to keep the originals. This is important so that you can still serve non gzipped versions to browsers that don’t handle gzip! The -r option tells it to recurse through the directory. Now you should have a directory full of javascript files and their gzipped counterparts.

init.js
init.js.gz
jquery-ui.js
jquery-ui.js.gz
jquery.easing.js
jquery.easing.js.gz
jquery.history.js
jquery.history.js.gz
jquery.js
jquery.js.gz
swfobject.js
swfobject.js.gz

Yay. How exiciting, no?

The next step is to modify .htaccess to do some URL rewriting.

AddEncoding gzip .gz
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{HTTP_USER_AGENT} !Safari
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)$ $1.gz [QSA,L]

Essentially your telling the web server to server up gzip files, if the browser accepts them and the user is not on Safari and if there is a compressed version of the file available.

That’s really about it.

Here’s the difference in file sizes:

Pretty significant size difference!

IE and responseXML issues

After working on a small AJAX library, I decided to test it in IE. Everything worked great, except when requesting XML. The responseXML property of the XHR was null. I’ve had this issue in the past where the server isn’t returning the appropriate Content-Type (text/xml). But that wasn’t the issue this time. I checked my resin config and everything was correct.

So, I uploaded to a remote server and tried again. Blammo. Chit just worked the way it was supposed to. This left me scratching my head however.

I installed Charles (www.charlesproxy.com), which is a great debugging HTTP proxy/monitor, to see what was going on. Everything worked as it should in FireFox, but still no dice in IE.

Then I noticed that traffic wasn’t being captured for Localhost when using IE. After a bit of stumbling around the net I found that if you add a period right after localhost, Charles will capture the traffic.

http://localhost:8080/ajaxTest.html
becomes:
http://localhost.:8080/ajaxTest.html

When I reloaded the page, I got a very nice surprise. Not only did Charles capture the traffic, but the XHR returned with a proper responseXML property!

I’m no network engineer, so I’m not even going to try and guess as to WTF. But, I’m happy it works as expected and thought I’d post about it in case someone else ever runs into this issue.

Force directed node interface 2

Here’s an example of the force directed node interface that I’ve been talking about. It’s not complete. It’s just a working prototype. You still cannot load project details, but I’m waiting to add that if I decide I want to take this any further.

Since the dimensions of the interface have been reduced to fit in this blog post, things might be a bit small (try zooming in). You can also drag nodes around. Helpful when things get pushed off the screen. Nodes can be opened and closed by clicking on them.

Force directed node interface

I’ve been working on the experimental Flash front-end I spoke about in the last post. The idea is to use a force directed or force based system for displaying categories, keywords, projects and their relationships. I was curious about what kind of user experience that would create.

Here’s a video of the force directed layout interface in action.

So, what is a force directed layout?

It is a method for positioning nodes of a graph in a way that is aesthetically pleasing as well as easy to digest. This is accomplished by creating a simulated physical system where all nodes are like electrically charged particles (Coulomb’s law) and the connections or associations are like springs (Hooke’s law). After running through thousands of iterations, the entire system begins to become stable until all the forces are in somewhat of an equilibrium.

Fig. 1 Interface with only the category and technology nodes expanded.

Fig. 1 is a screenshot of the layout. In this example there are only a few nodes expanded, but it gives you an idea of how things end up looking. There are two base nodes: “Category” and “Technology”. Clicking these returns the appropriate set of subnodes. The association of these subnodes is shown with a line connecting the child and parent node. When clicking on a specific technology keyword or category, that category/keyword subnode expands into another set of nodes which are projects.

Fig. 2 Interface with more nodes expanded

Fig. 2 shows the cross associations between categories and keywords.

So far it’s been a cool and somewhat successful little experiment. I’m not sure it would work as an interface as the node labels overlap too much and when there a lot of cross associations, things don’t look as organized and it’s much harder to read.

I still need to add node collapsing and make it so projects can be viewed. I’ll try to post a working example soon.

PHP5 + JSON + as3corelib = a beautiful thing

I’ve decided to play around with an experimental front end for viewing projects in Flash. Since I OOPified (yes, that’s a technical term) the site and modeled the data, all of my objects can be easily serialized into JSON strings and passed back to the front end. Then using the as3corelib’s JSON classes, I can deserialize those objects and blammo. So much easier than having PHP output XML, then parsing that XML in flash, and then creating objects from… yeah, that sucks.

So I’ve got all of my stuff coming back into Flash in a format that’s really easy to consume and use and did it with very little work. I like that.

If I wanted to pass back a project object to the front end. I would make a request that would execute something like the following in PHP:

$prj = Alien109DAO::getProjectByPageRef($_REQUEST['p']);
$key = Alien109DAO::getKeywordsByProjectId($prj['id']);
$results = ProjectFactory::createProject($prj, $key);
print_r(json_encode($results));

First I get the project from the database. Then I get all of the associated keywords for that project. I then pass both of those results as arguments to my ProjectFactory which is a static class whose primary job is to just return a full Project object. Then the object is serialized, and returned in the response.

In Flash, in my event listener, I simply deserialize the JSON string back into an ActionScript object using the as3corelib’s JSON decoder class.

private function dataLoaded(e:DataReadyEvent):void
{
var projectObject:Object = JSON.decode(e.data);
...

w00t!

Wordpress XML Parsing Error

XML Parsing Error: XML or text declaration not at start of entity

> Warning: MagpieRSS: Failed to parse RSS file. (Reserved XML Name at
> line 3, column 38) in [...]
>
> Warning: Invalid argument supplied for foreach() in [...]

Yesterday it was called to my attention that the RSS parser that was pulling the feed from my blog into my web site was throwing some rather nasty errors. Upon further investigation I discovered that the feed itself was the culprit.

Something was throwing in extra white space before the document declaration in the XML file. Some people have found that old plug-ins or themes can cause this problem. I searched through every PHP file and finally found the issue in my config (wp-conifg.php) file.

I just updated to the latest version of WordPress yesterday and when updating the config with the most recent settings, I accidentally added two empty lines before the opening PHP tag.

Ooops. Thanks to Jared over at ShareBrained Technologies for noticing!

Free web based imaging software

Aviary has recently released another web-based application. Raven, which is still in beta (all of their applications are. that’s so web 2.0!), is a web-based vector editor. Their product suite consists of four applications at the moment:

• Peacock – a visual laboratory
• Raven – vector editor
• Phoenix – image editor
• Toucan – colors watches

Peacock is kinda cool. Image generation is done by patching together generators, effects, controllers and resources. Fun to play with, I must say. Pretty amazing use of Flash. Pretty cool to have this sort of development going out there…

The products, at the moment, are all free to play with. Go check ‘em out: http://aviary.com/

Flash is (or is not) coming to the iPhone

Somewhat of a sore spot for Flash and iPhone developers, the hope that the Flash player would make its way to the iPhone is still very much up for debate. A recent quote from Adobe CEO, Shantanu Narayen, has some left some believing it’s very much on its way and others thinking it’ll never make it.

“It’s a hard technical challenge, and that’s part of the reason Apple and Adobe are collaborating,” [Adobe CEO Shantanu] Narayen told Bloomberg Television at the World Economic Forum in Davos, Switzerland. “The ball is in our court. The onus is on us to deliver.”

Some claim the Flash Player could never be written in a way that would sit well with the ARM processor. The power requirements of running such an app would be too much for a mobile device. Others have said it’s a political/business decision on Apple’s part.

Who knows. I just hope it finally makes its way to the iPhone platform. I think it would open development up to a lot more people that don’t feel like trying to wrap their brain around Objective C. Apple still has very strict control over what applications make it to the iTunes store, so the concern about quality of apps shouldn’t be an issue.

I personally feel that it’s more political than anything else. But, I’m a cynic.

Rewriting the back-end, again…

I’ve decided to rewrite the back end for alien109.com again, taking advantage of OOP in PHP. Man, such a difference. Everything is so much easier to maintain and follow now. Plus, I’ve implemented more of an MVC pattern. Seemed like overkill for such a small site, but proved to be educational, if nothing else.

Site updates!

So I’ve finally updated my web site.
www.alien109.com

• Ported all of the javascript over to jQuery and ditched those ancient JavaScript libraries I’d written years ago
• Implemented some keyword searching on projects so you can see projects based on languages or technologies.
• Reworked the backend so that everything was a little more search engine friendly (url rewritting for prettier urls and hidden javascript calls)
• Added a bunch of new (and old) work into the mix.

Creating a search engine friendly ajax app is a pain in the butt, if it’s an after thought

WordPress for iPhone

Just testing WordPress for iPhone…

Automated webcam capture/image downloader

The other day I was checking out a webcam at a local ski resort, and wanted to see what an entire day’s worth of shots looked like played in a movie. I’m sure there are apps out there that do this sort of thing, and might even be an easier way of doing this. Regardless, I decided to have a play.

Below is a simple VB Script file (sorry windowless folks) that will download and save an image to your hard drive. It will save the images in the same directory the script is running.


Dim imageURL
imageURL = "http://www.mtbachelor.com/@@/cams/wvskycam.jpg"
Function SaveBinaryData(FileName, ByteArray)
Const adTypeBinary = 1
Const adSaveCreateOverWrite = 2
Dim BinaryStream
Set BinaryStream = CreateObject("ADODB.Stream")
BinaryStream.Type = adTypeBinary
BinaryStream.Open
BinaryStream.Write ByteArray
BinaryStream.SaveToFile FileName, adSaveCreateOverWrite
End Function
Function BinaryGetURL(URL)
Dim Http
Set Http = CreateObject("WinHttp.WinHttpRequest.5.1")
Http.Open "GET", URL, False
Http.Send
BinaryGetURL = Http.ResponseBody
End Function
Function doSave()
Dim image, fName, p_month, p_day, p_hour, p_minute, p_second
image = BinaryGetURL(imageURL)
p_month = padZero(Month(Now))
p_day = padZero(Day(Now))
p_hour = padZero(Hour(Now))
p_minute = padZero(Minute(Now))
p_second = padZero(Second(Now))
fName = p_month & "_" & p_day & "_" & Year(Now) & "-" & p_hour & "_" & p_minute & "_" & p_second & ".jpg"
SaveBinaryData fName,image
End Function
Function padZero(val)
If(Len(val) < 2) Then
val = "0" & val
End If
padZero = val
End Function
doSave()


Copy and paste the above script into an empty text file. Go find a webcam you'd like to capture. When viewing the webcam image, right click and copy the images URL. Change the imageURL variable at the top of the script. Save the script (.vbs extension). Next you'll need to set up an automated task to run the script. For help on how to set up tasks, check out this KB article. You'll want to schedule it run somewhat frequently, but no more frequent than the webcam updates.

That's pretty much all you need to do. If everything goes right, image files should start appearing in the directory that the script is located.

To create a movie from the sequence, you'll need to find some software to do that. Out of sheer laziness, I just use QuickTime Pro, but there's a bunch of shareware/freeware options available out there.

Have fun...

Accordion 2.0

Kevin Miller has updated his accordion control. The new version includes:

• Open/Close functionality added (Click on an active accordion)
• Nested Vertical Accordions
• Accordions will dynamically resize on content added REAL TIME!

One of the better accordion widgets out there I must say.

Check it out!

CSSVista: Tweak CSS and see it in IE and Firefox at the same time

CSSVista is a free Windows application for web developers which lets you edit your CSS code live in both Internet Explorer and Firefox simultaneously.

CSSVista is from the folks who gaves us Litmus

RegexPal – JavaScript Regular Expressions Tester

RegexPal is a great little utility for testing JavaScript regular expressions. It’s fast and quite helpful to those learning regular expressions.

Some note features include:

• Real-time regex syntax highlighting with backwards and forwards context awareness.
• Lightning-fast match highlighting with alternating styles.
• Inverted matches (match any text not matched by the regex).

Visit RegexPal here : http://regexpal.com/

Development, JavaScript

dsHistory – Back button management with JavaScript

dsHistory internally works somewhat similar to the other history solutions that exist, but it is implemented more like dojo’s bind than anything else. It requires no supporting libraries, it checks in at just over 7kb when compressed, and it is easy to use. The history is thought of as a series of events that have functions attached to them, and the bookmarkable window hash data is designed to be controlled independently from the events (if it is even utilized at all, which I’ve found isn’t desired at times).

See dsHistory in action
Read the full article

@tomic XML-RPC JavaScript Client

Jon Brisbin has created an XML-RPC JavaScript client called @tomic:

The @tomic XML-RPC client requires ExtJS 1.1, but has no other external requirements. It’s designed to be easy-to-use, flexible, and robust enough for anything you might throw at it. Since this is an initial release, I’m putting it out as a beta (under the GPL).

Ext.onReady( function()
{
    var xmlrpc = new Atomic.util.XMLRPC( {
        url: "xmlrpc.php",
        method: "blogger.getUsersBlogs"
    } );
    // Add parameters to the RPC call
    xmlrpc.addParameter( "0123456789ABCDEF" );
    xmlrpc.addParameter( "MyUsername" );
    xmlrpc.addParameter( "mypassword" );

    // Subscribe to events
    xmlrpc.addListener( "success", function( xhr, xml ) {
        // Handle the response from the XML-RPC service, which is in the 'xml' object
        console.log( xml );
    } );
    xmlrpc.addListener( "fault", function( xhr, fault ) {
        // Handle any faults issued by the XML-RPC server
        Ext.MessageBox.alert( "XML-RPC fault #" + fault.code, fault.message );
    } );

    // make the call
    xmlrpc.call( {
        method: "blogger.getUsersBlogs",
        params: [
             "0123456789ABCDEF",
             "MyUsername",
             "mypassword"
        ]
    } );
}

8BitBoy – Andre Michelle

http://8bitboy.popforge.de/

Karsten Obarski invented 1987 – twenty years ago – the MOD format for his Ultimate Tracker running on Amiga computers. Since then, countless songs are created, especially for the demoscene.

MODs have special attributes. All samples are stored in 8bits and the number of voices is limited to four. To have something similarly to chords, the three notes of it are repeated very fast. This makes MODs sound so freaky.

Finally 8BitBoy brings those songs back online.

Installing Apache, PHP and MySQL on Vista

I was expecting the worst, but got everything up and running in about 30 minutes due to some damn easy to follow tutorials. I guess I probably could have figured it out myself, but it’s nice to just get it done.

Installing Apache on Vista
Installing PHP on Vista

Installing MySQL is a no-brainer. Hell, even I could do it.