Google launches JavaScript API that allows you to write back

Design, Photography No Comments »

I am pretty excited about this one. We have long been able to use a JavaScript API to do read only work on GData feeds from Google. That is all well and good, but sometimes you want to be able to access feeds that require authentication, or be able to write and update data in feeds.

Well, now you can. The GData team has released a GData JavaScript Client Library. The first service available is Google Calendar, and we can hope for more to come.

This cross-domain, secure, access seems similar to Subspace, but it is actually live right now. Having a service such as Google Calendar using this is a great step forward, as you know it has been through a thorough security review.

Authentication happens via AuthSub, and you end up using new APIs such as:

PLAIN TEXT
JAVASCRIPT:
  1. function logMeIn() {
  2.   scope = "http://www.google.com/calendar/feeds";
  3.   var token = google.accounts.user.login(scope);
  4. }
  5. function setupMyService() {
  6.   var myService =
  7.     new google.gdata.calendar.CalendarService('exampleCo-exampleApp-1');
  8.   logMeIn();
  9.   return myService;
  10. }

When google.accounts.user.login(..) occurs, it will send you to Google to authenticate. A best practice is to provide a login button or other user input mechanism to prompt the user to start the login process manually. If, instead, you call google.accounts.user.login() immediately after loading, without waiting for user interaction, then the first thing the user sees on arrival at your page is a Google login page. If the user decides not to log in, then Google does not direct them back to your page; so from the user's point of view, they tried to visit your page but were sent away and never sent back. This scenario may be confusing and frustrating to users. Note that the example code above does call google.accounts.user.login() immediately after loading, to keep the example simple, but we don't recommend this approach for real-world client applications.

I am excited about this, as it means that you can write a rich Ajax client that doesn't need server-side proxies to do these things, which traditional was the only solution. Now the server-less model can grow even more.

I got to sit down with Jun Yang, who worked on this code, and got his take:

 

[via Ajaxian]

Project Pier (opensource project tracking app)

Application Review No Comments »

projectpier2.gifProjectPier.org is a fork of the open source activeCollab project, which can be found at www.activecollab.com. Kudos to Ilija Studen for producing such a wonderful masterpiece!

The goal of the ProjectPier.org project is to create a new project fork, picking up the code after activeCollab 0.7.1. The code will remain open source under the Honest Public License. Ilija has indicated on his website that activeCollab is being rewritten and the new version 1.0, while it may remain open source, will only be developed by his new company. ProjectPier.org should not detract in any way from what Ilija is doing and I sincerely hope Ilija succeeds in creating a successful commercial version of activeCollab.

This project is not about Ilija’s decision to go commercial and I do not wish to debate that issue here. We simply wish to create a new project based on the open source activeCollab 0.7.1. The immediate goal is to provide users new features and bug fixes without changing the underlying database structure so that when activeCollab 1.0 is released, users can upgrade to that commerical product if they wish, when Ilija releases it.

We hope that by supporting the user base in this way, we can take the pressure off of Ilija and he can take as much time as he needs to make activeCollab 1.0 as wonderful as possible.

FusionCharts (nice)

Javascript, flash No Comments »

here are some nice free charting flash and js scripts. enjoy.

livedemo11.jpglivedemojs1.gif

LINK

Creating a maintainable, unobtrusive JavaScript slideshow

Ajax No Comments »

Slideshow UI controls can be found everywhere nowadays and usually come included, in some form, in most JavaScript libraries. Every now and then, though, its great to take a step back and actually learn how something like a slideshow widget is built.

JavaScript expert Christian Heilmann does just that in a multi-step tutorial that shows you how to build a maintainable, unobtrusive JavaScript slideshow component.

Slideshow Asset

While the end result isn’t as robust as other controls, it is a nice way to get your hands dirty and understand the underpinnings of some of the cool widgets others are creating.

[via Ajaxian]

Proto.Menu: Prototype-based Context Menu Solution

Ajax No Comments »

To round off the weekend, here’s a very cool Prototype-based solution for creating context menus:

Description

Proto.Menu is a simple and lightweight prototype-based solution for context menu functionality on your page
Features:

  • Lightweight: ~2 KB (~1.5 KB minified)
  • Unobtrusive: Plays nice with JS turned off, uses its own namespace
  • Cross-browser: Full A-Graded browsers support (Opera is supported through Ctrl + Left Click)
  • Fully customizable: Menu styling can (and is intended to) be easily defined in external stylesheet
  • Fast: Menu container is rendered on page load, and only changes position on click

Specification

  • Requires: prototype.js 1.6.0_rc0
  • Tested browsers: Firefox 1.5+, Internet Explorer 6+, Safari 3+, Opera 9+, Netscape Navigator 9+
  • Last modified on: 8/22/07
  • Latest version: 0.5
  • Author: kangax

It’s lightweight, cross-browser and looks very easy to implement. If kangax can throw in some more default themes, that would be very sweet! Overall, me likey! :)

[via Ajaxian]

Create your own iGoogle with Prototype

Ajax No Comments »

Sébastien Gruhier, AKA Mr. Proto, is at it again coming up with a new Portal class for Prototype which gives you that ability to create a UI like NetVibes or iGoogle. For those that don't know, Sébastien is also the author of the very sweet and popular Prototype Window and Carousel classes.

The Prototype Portal Class continues along the same lines providing a straightforward method of adding portlets and styling them. The portlets include DnD and selectables functionality making them fall neatly into place when dragging them around. The code to implement this is VERY easy to understand:

You need to instanciate a Portal class with those columns:

var portal = new Xilinus.Portal("#page div")

Add widgets to this portal. There is a Widget class, fully CSS skinnable (there is a default theme), just create a new Widget instance and add it to the portal by specifying the column index. For example:

portal.add(new Xilinus.Widget(), 0)

// Or with title and content
portal.add(new Xilinus.Widget().setTitle("Widget Title").setContent("bla bla bla"), 1);

While you still have to do the advanced legwork to build a Netvibe-like application, the Prototype Portal class gives you the foundation to build upon.

You can an example here and download the code here.

[via Ajaxian]

AjaxRain.com gets a facelift, tops 600+ Ajax/JS/RIA controls

Ajax No Comments »

AjaxRain.com, the site dedicated to aggregating Ajax, JavaScript and RIA controls & libraries, has gotten a cool facelift and some much needed features. On top of that, they continue to post controls at an amazing rate with 638 submissions at last count.

Some of the new nuggets include:

  • Storing favorites
  • Comments
  • Voting on entries
  • Date that a submission was posted
  • Enhanced search
  • Expansion into posting RIA components based on SilverLight & Flex

MiniAjax.com, a site that was doing the same thing and started off with a bang, has since gone stale and it looks like AjaxRain now leads the pack. Are there other sites like these? If so, post the links in the comments.

nice livevalidation script

[via Ajaxian]

DatePicker using Prototype and Scriptaculous

Javascript No Comments »

Until we get into the browsers, we will need to create data pickers.

DatePicker is a simple one that users Prototype and Script.aculo.us, and does the basics well (although the fade can be a touch annoying to me).

Read the rest of this entry »

10 Monochrome Websites

Web Design No Comments »

Monochrome websites can be very effective, especially when combined with a solid grid layout, continuing our color series today we take a look at 10 of the best …


Stefan Persson

116.jpg

Read the rest of this entry »

10 Websites with Wood

Web Design No Comments »

Natural elements lend themselves well to websites, they bring something that we can all relate to to our screens and soften what can otherwise be a sterile and lifeless environment. Wood is one natural element that has been used frequently, today we’re going to look at some of the best examples in recent web design …


Electric Pulp - I’ve been a big fan of this design since it launched - it blends faux-water color techniques with a dark wooden background

117.jpg

Read the rest of this entry »

Entries RSS Comments RSS Login