JavaScript Weblog Editor Demo

Just for jazz, and because I think it’s cool, I put up a demo of the weblog editor I use for this site and for ranchero.com.

It doesn’t actually let you change anything in the database, but otherwise it works.

It uses JavaScript to do a couple things I think are neat.

One is the Preview button. When you click it, it shows you a preview of the post you’re working on, formatted as it will appear on the home page. No round trip to the server required.

Another is the expanding/collapsing chevrons. I use those so I can glance at the titles to find the post I want to edit. Then I click the chevron to expand it.

When a post is expanded, then there are Delete and Edit links. If I click Edit, then the editing field at the top of the page is filled in—again, via JavaScript. No round trip to the server.

Anyway, you’re free to view source of course and lift any of the JavaScript code.

There’s also a search field, so I can search previous posts and edit or delete any. (It’s not a JavaScript thing; I’m just pointing it out.)

One thing you can’t see: when I submit a new post, the CMS pings Weblogs.com, and I see the text returned from Weblogs.com right there in the page. It’s a friendly little confirmation that the ping worked. Of course, sometimes Weblogs.com reminds it would be a good idea to take a break...

Note: the JavaScript code may not work in your browser. It works in mine.