bloggie comments work

Everyone, the comments now work in firefox. You don't know how happy I am to get this fixed, especially since I now know that that the reason I have no comments is because everyone in the world uses firefox. I expect a flood of comments now that it's working.

For those of you interested in why this happened, it's all very interesting. There was a small bug in the postRequest asynch function that only affected firefox.

The reason...

This site uses asynchronous calls (all post) for just about everything. Most of the asynch stuff you don't see, because it's all on the content management and configuration management screens. Comments is where you can see it. Bloggie takes each comment and breaks it up into small chunks to be sent off to big table. If you enter a really big comment like 5K or 6K, it might take 5 requests to get that content written. Eventually when all of the appending is done, the getComments callback is posted. The return of getComments places all of the comments for that entry at the bottom of the entry screen. All of these requests only take a few seconds to complete. The user just sees their pretty comment show up on the same screen that it was entered...nice...

Anyway, there was a bug in the postRequest function. We weren't properly setting the parameter length in the header. So every time firefox came along it complained and gave us a 411 error, invalid length. Other browsers, IE and Safari were much more forgiving. The corrected code is below.

This first function returns the proper XML HTTP Request object for the browser you are using. I'll admit it. I borrowed this code. I did have a convoluted set of try(s) and catch(s) to do this earlier, but this is much more clean.

function getXHR(){
try{return new ActiveXObject("Msxml2.XMLHTTP");}catch(e){}  
try{return new ActiveXObject("Microsoft.XMLHTTP");}catch(e){}  
try{return new XMLHttpRequest();}catch(e){}  
return null;
}

All of the asynch requests go through the postRequest function. If we get a good XMLHttpRequest, we set and open the URL, set the parameter heading and callback and send the parameters. Notice the processResponse function. All responses go through here.

function postRequest(url,params)
{
  debug_alert("postRequest\nparams=" params "\nurl=" url);
  var xhr;
  if((xhr = getXHR())!=null){
    xhr.open("POST", url,  true);
    //Send the proper header information along with the request
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.setRequestHeader("Content-length", params.length);
    xhr.setRequestHeader("Connection", "close");
    xhr.onreadystatechange  = function()
      {
        if(xhr.readyState  == 4)
          {
            if(xhr.status  == 200)
              processResponse(xhr.responseText);
            else
              debug_alert("Error code "   xhr.status);
          }
      };
    xhr.send(params);
    debug_alert("request sent");
  }else{
    debug_alert("request not sent");
  }
}

I didn't actually have to touch the processResponse to get firefox to work, but as long as we're talking about the asynch functions...

Process response takes the response from the server, parses it and performs the functions in the response. Each response includes a set of actions and each action can includes a name and value set.

The processResponse function can automatically display HTML in a div tag; populate any input field; populate and set a select field; send an alert; call a callback; or activate a tab if you use the tabber JavaScript library.

function processResponse(response)
{
  debug_alert("processResponse\nresponse=" response);
  var ra = parseResponse(response);
  var n,v;
  for(i=0;i    t = ra[i];
    i  ;
    n = ra[i];
    i  ;
    v = ra[i];
    //debug_alert("type=" t "\nname=" n "\nvalue=" v);
    switch(t){
      case "input":
        populateInput(n,v);
        break;
      case "div":
        populateDiv(n,v);
        break;
      case "select":
        populateSelect(n,v);
        break;
      case "tab": 
        // only relevant when using with tabber
        activateTab(n,v);
        break;
      case "delayCallback":
        setTimeout("performCallback(" n ",null)",v);
        break;
      case "callback":
        performCallback(n,v);
        break;


case "alert":
        alert(n "\n" v);
        break;
    }
  }
}

Let me know if you'd like to see more about asynch library. Those of you with skills can pull down the simpleAsynch.js file. The rest of you will just have to wonder what the heck I'm talking about.

0 comments 14 views