Toluu : Ajaxian

Ajaxian

Cleaning up the web with Ajax

“The need is obvious for a cross-device mobile javascript library supporting iphone, palm, and android. blackberry browser still blows” — Joe Hewitt

Joe of course created the popular iUI framework that mimics the native iPhone look and feel and gives you nice simple iPhone features via JavaScript.

Palm is on his list, because it is back in the game with their CES announcement of the Palm Pre, an offering that has an SDK that makes me happy. No Objective-C, no Java, just a Web stack!

Announcing Palm WebOS, Palm Mojo Application Framework, and Palm Mojo SDK

Palm WebOS, Palm’s next generation operating system, integrates the power of a window-based operating system with the simplicity of a browser. The user experience is designed around multitasking, and makes it easy to run background applications, switch between applications in a single step, and handle interruptions and events without losing context. Using WebOS, you’ll be able to develop fast (and beautiful) applications.

The Palm Mojo Application Framework

Palm WebOS applications are easy to write using Mojo, a new application framework based on the HTML5, CSS, and JavaScript standards th

jQuery pageSlide: throwing content aroundYesterday

Scott Robbin (Songza co-founder) has created a very cool jQuery plugin for pageSlide, an interaction based off of Aza's prototypes for Firefox Mobile and Ubiquity mouse gestures. The plugin wraps body content into a container and shifts it off of the page whenever a click event is fired, revealing a secondary interaction pane.

This plugin allows any developer to recreate a similar interaction on their own website using a few simple lines of Javascript. By attaching the method to an anchor tag, pageSlide wraps the original body content into a wrapper and creates an additional block for the secondary content load. The slide is animated whenever the click event is invoked.

PLAIN TEXT

HTML:

<script type="text/javascript">

$(document).ready(function() {

$('a.pageslide').pageSlide({

width: "300px"

});

});

</script>

AddressChooser: address picker in real-timeJanuary 7

Sébastein Gruhier has released a new address component that integrated a map with the address that you are filling. The UX is interesting as when you first get typing it doesn’t really narrow down the address so you are seeing maps of bizarre places.

As well as a basic version, you can also tie in auto complete.

Features include:

Javascript framework-agnostic. You can use it as is or with any great frameworks like Prototype, JQuery …
Mapping system independent. The current implementation is based on Google Map using a Google Map proxy object.
Interactive map display location while you arex typing an address.
Center map on user location (based on its IP) if mapping system allows it.
Fully customizable.
Fully documented with pdoc.
Works on Safari, Firefox, IE 6/7, Chrome and Opera.
…

Technical Details Behind iWork.comJanuary 7

As soon as I heard about the new iWork.com site launched yesterday, I knew I wanted to know more about how it was made. iWork.com is a web-based way to share and collaborate over your iWork documents. I searched around the blogosphere seeing if anyone knew any technical details, but didn't find anything, so I had to crack open Firebug and see what was under the covers. I really wanted to know whether the apps were built with Flash or Ajax or something else.

I downloaded a trial version of iWork 2009 and published a Keynote presentation. The new Sharing function unfortunately requires you to configure and use the Apple Mail program, which I did before I could test out to see how the iWork.com shared documents work.

Looking at the JavaScript files, I see SproutCore and Prototype being pulled in, so everything is built with Ajax and web technologies. It's also using WebDAV to pull in the metadata about the document, which is interesting (though it's piping the WebDAV over some kind of proxy):

http://publish.iwork.com/iw/p159985190/.iWork/Share/Untitled.pages/Metadata/?webdav-method=PROPFIND

That URL returns an XML WebDAV document w

Detecting twitter users with JavaScript - handy or evil?January 7

Earlier this week I blogged about a proof of concept that you can detect if a user is logged in to twitter and display their data with a few lines of JavaScript. This could be used to show for example "tweet this" buttons in a blog application.

The trick is easy: use the user_timeline to get the correct data back and provide it with a callback:

PLAIN TEXT

JAVASCRIPT:

function hasTwitter(data){
// gets the user's real name
alert(data[0].user.name);
// other data is .screen_name, .location and
// data[0].text is the latest update
}

PLAIN TEXT

HTML:

<script type="text/javascript"
src="'http://twitter.com/statuses/user_timeline.json&count=1&callback=hasTwitter">