Gray's Matter
Justice Gray - North America's Favorite Metrosexual Urban Legend
   by Justice~! DasBlog | Technical  
As you might have heard, DasBlog 1.9 is almost out and with it comes a pretty nifty feature - the ability to autosave drafts of your blog posts!  

I really didn't want to come out and say this publically, but Scott Hanselman is a liarSteven Rockarts and I actually had nothing to do with the autosave feature.   I've been under a lot of pressure to reveal the *true* authors of the autosave code and tell their story...the guilt has been too much for me, and so I'm coming clean.  I hinted at their identities in my last Dasblog post on previousEntry and nextEntry, but now I am just coming out and saying it so that no matter what Scott says, *you* know the real story.

Without further adieu, the Dasblog autosave team:  Denzel Washington, Spider-Man, and Jesus Christ!!!

DasblogAutosavePanel01.jpg
The beginning of great things

Denzel and Spider-Man start with the page that has our textbox edit control in question: EditEntry.ascx.  They make two changes here.

1) Adding a label underneath the textbox control in EditEntry.ascx named AutoSaveLabel (this comes into play later).
2) Adding a new method in the code-behind called SetupAutoSave().  SetupAutoSave uses a StringBuilder to write a block of Javascript to the EditEntry page, consisting of 3 different functions:

  • StartInterval() - sets a timer to call AutosaveTimer() once a minute.
  • AutosaveTimer() - this is where the "heavy lifting" happens (detailed later).  
  • AutoSaveResult() - this is our callback function, which will activate on the completion of the Fetch() call of the AjaxDelegate.  The only thing this does is output a message to the AutoSaveLabel.
To save an entry, they need the following information:
  • The text of the post (obviously)
  • The ID of the post (needed to use the DataService SaveData() in DasBlog).
  • The author of the post
  • The title of the entry

To get at the values of the textbox controls for Title and post text in Javascript, they write the following:

sb.AppendFormat("var editTextBox = document.getElementById('{0}');", this.editControl.Control.ClientID);
sb.AppendFormat("var titleBox = document.getElementById('{0}');", this.entryTitle.ClientID);

                
This then ensures that the javascript variables for editTextBox and titleBox refer to those controls.  

At the tail end of the code, they create a new AjaxDelegate that takes the arguments we've listed above, and a couple of others:
* the url we're going to hit asynchronously (in this case, "AutoSaveEntry.ashx")
* our callback function

sb.AppendFormat("var ajax = new AjaxDelegate(url, AutoSaveResult, '{0}', titleBox.value, '{1}', editTextBox.value, label);", CurrentEntry.EntryId, this.Context.User.Identity.Name);

At this point, things got a little ugly...

DasblogAutosavePanel02.jpg
To be continued...

Comments

#1 Antony Trupe  on 6/1/2009 3:27:49 AM

Antony Trupe

Working on a jQuery autosave extension.
Follow stackoverflow.com/questions/931252/ajax-autosave for updates.

Reply

trackback

It's Not Stealing If You Say Thank You - The Story of the Greatest Blog Rearchitecture in Recorded History

It's Not Stealing If You Say Thank You - The Story of the Greatest Blog Rearchitecture in Recorded History

Reply

Add comment

If you're going to leave a comment, please use your real name rather than a business name; otherwise it'll likely get blocked by my spam filter (or in the rare case it gets through, deleted by me manually). Thanks!


(will not be published)

  Country flag

Click to change captcha
biuquote
  • Comment
  • Preview
Loading