Tags: javascript

diesel, learning, evil, sweeti

AJAXy vs RESTian

There is, it seems, a Soloman-esque dilemma that faces those who wish to be buzzword compliant.

Obviously a meaningful RESTian URL is important. EventQueue already has this

    # Show a year
    http://thegestalt.org/simon/eq/2005/ 
    # Show a month
    http://thegestalt.org/simon/eq/2005/12
    # Show a day
    http://thegestalt.org/simon/eq/2005/12/15
    # Show an event
    http://thegestalt.org/simon/eq/event/palm-datebook-007f9a18-000076

However certain aspects of navigation - moving between days, weeks and months and years would certainly benefit from some AJAX which would leave the url inconsistent with the display.

Week in particular would benefit from the ability to slide left and right by one day.

I suspect, however, that a meaningful URL is more important.

One solution, from Tom Insam, is to have

    http://thegestalt.org/simon/eq/#2005/12/15

etc and parse the parts in Javascript which seems a bit icky but might just work. Especially since it will allow the same URL to be shared whether the handler is mod_perl or cgi without the need for mod_rewrite.

diesel, learning, evil, sweeti

Aesthetically challenged

What's actually been the biggest problem is the design and usability - because I suck at that and I suck at DHTML and Javascript and CSS and AJAX and for all the pissing and moaning you get about Open Source stuff looking horrible there's no coherent resource for getting usability and designery type people to work on your open source stuff.

To be honest, I don't know who's to blame, per se - the programmers for being usability hostile or the designers for not getting involved. Chicken and Egg problem I suspect.

diesel, learning, evil, sweeti

all the cool kids are AJAXing - why can't I?

We have some user images on a server (let's call it 'a') at work and I wanted to automatically inline them on another page on another server (which, for demonstration purposes we shall call 'b') if they exist. This, I felt, was a job for this AJAX malarkey that I'd heard so much about.

This

    <html>                                                                              
    <head>                                                                              
    <script type="text/javascript">                                                     
    function picture(name)                                                              
    {                                                                                   
        var xmlhttp=false;                                                              
    /*@cc_on @*/                                                                        
    /*@if (@_jscript_version >= 5)                                                      
        // JScript gives us Conditional compilation                                     
        // so we can cope with old IE versions.                                         
        // and security blocked creation of the objects.                                
        try {                                                                           
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");                              
        } catch (e) {                                                                   
            try {                                                                       
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");                       
            } catch (E) {                                                               
                xmlhttp = false;                                                        
            }                                                                           
        }                                                                               
    @end @*/                                                                            
        if (!xmlhttp && typeof XMLHttpRequest!='undefined') {                           
            xmlhttp = new XMLHttpRequest();                                             
        }                                                                               
                                                                                    
        var url     = "http://a/"+name+".jpg";                                
        xmlhttp.open("HEAD", url,true);                                                 
        xmlhttp.onreadystatechange=function() {                                         
            if (xmlhttp.readyState==4) {                                                
                if (xmlhttp.status==200) {                                              
                    document.write("<img src='"+url+"'>");                              
                }                                                                       
            }                                                                           
        }                                                                               
        xmlhttp.send(null);                                                             
    }                                                                                   
    </script>                                                                           
    </head>                                                                             
    <body>                                                                              
                                                                                    
    <div>                                                                               
          <script type="text/javascript">                                                   
            picture('foobar')                                                           
          </script>                                                                         
    </div>                                                                              
                                                                                    
    <div>                                                                               
          <script type="text/javascript">                                                   
              picture('doesnt exist')                                                       
          </script>                                                                         
    </div>                                     
    </body>
    </html>

didn't work, throwing up errors like

    "uncaught exception: Permission denied to call method XMLHTTRequest.open"

To get round the security thing I had to stick a script on b

    #!/usr/bin/perl -w                                                                  
                                                                                    
    use strict;                                                                         
    use CGI;                                                                            
    use LWP::Simple;                                                                    
                                                                                    
    $|++;                                                                               
                                                                                    
    my $q = CGI->new;                                                                   
    my $n = $q->param('url');                                                          
    my $u = "http://a/${n}.jpg";                                              
    if (head($u)) {                                                                     
        print $q->header('text/html');                                              
    } else {                                                                            
        print $q->header('text/html', '404 Not Found');                             
    }                                                                                   
                                                                                    
    print "\n";                                                                         
    exit 0; 

And change the line in the javascript to be

    xmlhttp.open("HEAD", "/proxy_check?url="+url,true); 

And lo! It worked. Huzzah!