Just ran into an interesting problem with an external hard drive that was being used as a time machine backup for laptop. Someone tried to connect this drive to their windows machine and it evidently screwed up the boot bits so not only would windows not recognize it, Macs wouldn’t recognize the disk either.

Tried running it through Disk Utility but received a message saying “Disk cannot be repaired.”

So I loaded up TestDisk and took it for a spin. Here is a photo gallery outlining the steps that I took.

Disclaimer: To my regular readers (if there are any) this post is entirely technical in nature so if you’re not looking for the solution to this particular problem (e.g. from Google) you’re probably not interested in this post.

I run a few sites that use PHP as a reverse proxy for other sites. The PHP script loads a specific webpage, then sub-requests for resources like stylesheets, images, and javascripts, are also processed by the same PHP script. For most of these other resources the script simply passes the content through unchanged.

Problem:

When a page is loaded that includes a large amount of supporting resources like CSS and javascript files, it seems to take a long time to load some of the CSS and javascript files. Some of the scripts were taking upwards of 15 seconds to load when loaded as part of the page (although if loaded on their own through the PHP script, they load instantly).

Short Term Solution

The investigation of the problem determined that the problem lies in the KeepAlive setting in Apache. Turning Keep Alive off fixes the issue and yields excellent load times consistently for all resources. But WHY??

Long Term Solution

Keep Alive is generally a good thing and it is supposed to boost performance. So why is it a bad thing in this context? (I really don’t know the answer yet). I would like to find a PHP solution to this problem that will work with KeepAlive, but I can only speculate at this point as to why this might be happening.

Possible reasons that I’ve considered:

1. I need to do something more than “exit” at the end of the PHP script to declare that I’m done with the request – as Apache could be keeping the connection open for longer than necessary and preventing subsequent requests from happening.
2. Perhaps there is some setting that I am unaware of in PHP that limits the number of simultaneous requests it can handle from the same client… (I find this unlikely – at least at the level that we’re talking about here).

Edit:

I found that simply adding the ‘Connection:close’ header in the PHP script resolves this issue.
But i’m still not satisfied. This shouldn’t be necessary IMHO. If you set the Connection-Length properly then flush that content to the browser, there’s no reason why PHP should be making the browser wait around indefinitely.

So maybe we’re missing a few performance points here – but at least it’s not hanging like it was.

I’ve been playing around with iPhone and iPad web app development for the past week or so (I’m working up to building a native app, as there are benefits to playing both sides of the field here). Given my familiarity with jQuery, I felt inclined to try out the jQTouch framework to start with. After some successes and failures, I then decided to take Apple’s Dashcode development environment for a spin. Here are my initial impressions:

My adventures began by modifying the demo jQTouch application to do what I wanted. I was impressed by the capabilities of this framework out of the box. It looks good on both the iPhone and the iPad – and feels just like a native app. The user can add the page to their “home screen” to load it up just like a native app also. My first stumbling block came when I faced the iPhone’s “no multi-tasking” limitation. If the user spent some time browsing to a particular place in my app, then left the app for any reason (e.g. to take a call or check their email), then they would be sent back to the start screen of the app and lose where they were altogether. I tried a number of workarounds the involved things like local storage, session storage, cookies, sessions and the like, but all were a little klunky. I realize that this problem will be fixed in iPhone 4 with the advent of multi-tasking, but many iPhone’s don’t qualify for this upgrade so it was important to me to at least be able to retain state.

Rather than hack jQTouch to pieces to try to implement this functionality (believe me, I tried), I decided to see what else was on the web app development landscape. That led me to Dashcode.

So I started the project more-or-less from scratch using Dashcode. I was impressed most by the Dashcode interface – how it allows you to drag and drop GUI widgets, or code snippets. It really is a model to follow if you want to develop an IDE. With Dashcode, you are almost completely insulated from the HTML markup. Instead you work with the visual WYSIWYG pallettes or with the javascript API to update the model. Rendering is done using MVC, and the performance of the resulting app is noticeably (on my older iPhone 3G) snappier than with jQTouch..

Unfortunately, I ended up hitting the same wall as with jQTouch: saving and restoring application state is a bit of a bitch. It involves more than just recording “where you are” in the app, because of the way the “back” buttons are set up, you have to recreate the entire environment, history and all. This is more than I really wanted to do right now.

So at this point I had 2 nearly complete, and almost identical apps. One using jQTouch. The other using Dashcode.

But now that I had climbed the learning curve in both of these frameworks, I knew I could do better. So I started, more-or-less, from scratch with a new project using jQTouch that will incorporate all that I had learned. I’ll be releasing the app in a few weeks.

Here is a brief comparison of these two ways of building iPhone/iPad apps:

1. Dashcode produces an app that is a little snappier and a little more native (on the iPhone).
2. jQTouch seemed to allow me more flexibility since I have direct control over the markup. In addition the development cycle seemed to be a bit faster using jQTouch. (However I’m sure you could improve the dev time on Dashcode if you used jQuery and other productivity libraries on the javascript side of things… I had been trying to use its API directly).
3. Dashcode doesn’t seem to scale up to the iPad larger screen as easily as jQTouch. The extra flexibility in jQTouch with markup etc, makes me feel better equipped to customize the interface for the device.
4. Dashcode is a fantastic IDE.

A client wants all email addresses and urls to be clickable in an application. I would like to develop a javascript solution for this.

I found this article that shows some example code for doing this on a particular piece of text, however, fixing the links on an entire page is a little bit more involved as it would require us to only convert the URLs that are static text – and leave the URLs, already inside an <a> tag, or appearing as tag attributes, alone.

My Solution

/**
 * A function that makes all static urls and email addresses in given DOM 
 * element's subtree to be converted to links.
 *
 * @param el DOM Element that we are checking
 *
 * This will recursively call itself until the entire subtree has been walked.
 * @author Steve Hannah .
 *
 * Some parts were adapted from http://www.arstdesign.com/articles/autolink.html
 */
function makeLinksClickable(el){

    //If no element is provided, then we will traverse the entire document.
    if ( el == null ) el = document.body;
    
    
    if ( el.nodeType == 3 /* text node */ ){
        // We only want to replace urls in text nodes
        var s = el.nodeValue;
        
        if ( s.replace(/^\s+|\s+$/g, '').length == 0) return;
            // If there is no text in this text node, we will just return and do
            // nothing.
        
        var hlink = /\b(ht|f)tp:\/\/([^ \,\;\:\!\)\(\"\'\< \>\f\n\r\t\v])+/g;
            // regex for URLs
        var mlink = /\b([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+\b/g;
            // regex for e-mail addresses
            // Copied from http://www.quirksmode.org/js/mailcheck.html
        
        var frag = document.createElement('span');
            // Because we are having difficulty putting just the A tag into
            // the document after conversion, we create a wrapper <span> tag
            // that will hold the resulting <a> tag.  Then we will 
            // insert the <span> tag into the document.

        
        // Replace URLs in this text node.
        var new_s = s.replace(hlink, 
                        function($0,$1,$2){ 
                            //s = $0.substring(1,$0.length); 
                                // remove trailing dots, if any
                            s = $0;
                            while (s.length>0 && s.charAt(s.length-1)=='.') 
                                s=s.substring(0,s.length-1);
                                // add hlink
                                                   
                            return " " + s.link(s); 
                        }
                     ) ;
                     
        // Replace Email addresses in this text node.
        new_s = new_s.replace(mlink,
                    function($0,$1,$2){ 
                            //s = $0.substring(1,$0.length); 
                                // remove trailing dots, if any
                            s = $0;
                            while (s.length>0 && s.charAt(s.length-1)=='.') 
                                s=s.substring(0,s.length-1);
                                // add hlink
                                                
                            return " " + s.link('mailto:'+s); 
                        }
                     ) ;
        
        if ( new_s != s ){
            // We only want to perform the switch if a change was made
            frag.innerHTML = new_s;
            
            var parent = el.parentNode;
            parent.replaceChild(frag, el);
            
        }
    } else {
        // This is not a text node, so we will loop through all of its child
        // nodes and recursively change the urls and email addresses in them.
        for ( var i=0, len=el.childNodes.length; i<len ; i++ ){
            if ( !el.childNodes[i] ) continue;
                // If for some reason this node is not set we skip it
            if ( el.childNodes[i].tagName == 'A' ) continue;
                // We don't want to change anything that is already inside
                // an <a> tag
            if ( el.childNodes[i].tagName == 'SCRIPT' ) continue;
                // We leave scripts alone because we don't want to screw up
                // any javascripts.
            
        
            makeLinksClickable(el.childNodes[i]);
                // Now we recursively call ourselves.
        }
    }

}


// Now we register this function to be called as soon as the document is finished
// loading.
registerOnloadHandler(makeLinksClickable);

But Safari has trouble with string.replace() callbacks:

Apparently Safari has some trouble with the string.replace() method when it comes to passing a function as the second parameter, as we have done in our solution above. See This post for information on how to beat this problem. Then we have a fully-workable, cross-browser solution for converting static URLs and email addresses to links using javascript.

I have been attempting to incorporate dhtmlxGrid into Dataface to spice up the editing of related data on web forms. Since Dataface is open source under GPL, any library that I choose to include must also be open source and compatible with GPL. dhtmlxGrid standard edition fits this criterion so I decided to take it for a spin.

Unfortunately the standard edition appears to be no more than a trial version of the software as it does not contain any ability to extract data from the grid (that I can see). Without this ability, it is impossible to actually save, submit, or send data from the grid to a database or a form. What good is a grid like this if it cannot be saved? All of the features that would enable saving data are reserved for the professional edition which has quite a restrictive commercial license which is, safe to say, not compatible with GPL.

I do however give them props for releasing the standard edition under GPL. They could have just released a trial version with no distribution rights at all. As it is, at least I can dig into the code and add the necessary functionality myself.

I am working with the Firefox Javascript debugger to try to see where the data is hidden. This will be a little time consuming, but the end result will be worth it, I think.