February 23, 2009

Another note to myself to check out iWidgets.

Apparently this is a “PowerPoint-like” widget builder that takes strong design cues from Yahoo! Pipes.

Joining with the Web 2.0 “go-meta” business model , iWidgets provides a service that lets you build widgets once and deploy them to various popular widget APIs and platforms.

Peter Yared (CEO of iWidgets) says:

I wrote the initial builder in [another framework] and found it obtuse. After spending literally a week trying to turn the date picker into a color picker, I threw in the towel. A friend of mine turned me on to jQuery and I fell in love with how clean and fast it was, the way it separates the HTML from JavaScript is beautiful. So I rewrote the builder we had at the time in jQuery in a two week coding session! Soon after that I got funding from Opus Capital, and when I looked to hire people, I found 3 out of 4 of our engineers through the jQuery mailing list. It’s funny how things like that work out; I ended up finding total rockstars because they were playing with a cool new library.


the sliding date-picker

January 30, 2009

A very cool new idea for a date picker. Check out the demo here

This element enables you to pick dates with a simple slider bar. By dragging the bar over the time-line, the dates change instantly. Besides this, when the user decides to manually change the dates, the bar is automatically adjusted to the corresponding dates. As you are used to from us, the script is based on Prototype/Scriptaculous, but now combined with the very sexy DateJs library.

Tested in Firefox 2.x, and IE6/7 and very very sexy.

The joint effort of the W3C HTML WG and WHATWG resulted in publication of two documents in the W3C Technical Report space: HTML 5 and HTML 5 differences from HTML 4. I think I can safely say that the WHATWG community is very happy with the W3C publishing HTML 5 as a First Public Working Draft. Many thanks to all involved!

Some cool elements there like <dialog>, <command>, <meter> and being able to do things like input type=”datetime|datetime-local|date|month|week|time|number|range|email|url”.

Bill Orcutt recently announced the release of Lily. I can’t get into the demos at work so this is just a note to check this out later.

I’m happy to announce the first beta release of Lily, an open source, Mozilla based visual programming environment written in Javascript. Lily is a modular framework that allows you to wire together Javascript library components graphically. Currently there are Lily modules that wrap components from the YUI, JQuery & Scriptaculous libraries. There are also modules that provide access to the file system, browser storage, network & graphics. Lily programs can be
saved as standalone XULRunner applications or as Firefox addons.

Have a look at the demo applications below to get a feel for some of what Lily can do:


Javascript Rocks!

January 30, 2008

Loved this article by Michael Morrison in CIO Mag – You used Javascript to write what?

The other side of the coin is the mentality of viewing a Web application as a program, as opposed to a page. In this scenario, the application is utterly dependent on the active functionality made possible by JavaScript, which means it’s okay to forego users who lack JavaScript support. Google has embraced this philosophy in several marquee products, two of which are extremely popular: Gmail and Google Maps. Both applications make extensive use of Ajax (JavaScript), and neither apologizes to users who can’t run them due to a lack of JavaScript. If this article had been written just a few short years ago, I might have used an e-mail application as the ridiculous example of when not to use JavaScript, instead of Halo. But Gmail has pushed through that barrier.

Even if JavaScript-powered, web-based e-mail ultimately takes hold, surely there are other stand-alone applications that will just never make sense in Web form. Two such applications that come to mind are video and photo editing. Similar to games, these are such media-intensive applications that they just can’t make sense in JavaScript, right? Yet Adobe has already released Premiere Express for online video editing and is putting the finishing touches on Photoshop Express for Web-based photo editing. What’s interesting about these applications is that they aren’t technically built in JavaScript; they’re built in ActionScript, a close cousin of JavaScript used in Adobe’s Flex development environment. But the ActionScript in these applications is compiled, so the net effect is more akin to a native application. Adobe may be foreshadowing the future of Web scripting to some degree, at least in terms of building more feature-rich applications. And in doing so, they’re forcing us to rethink just what is possible with scripting languages.

Don’t forget “You used PHP to write what?” and read Jesse Donat comment about PHP “Not Scalable? Ever hear of a little something called Facebook?”

Wii API’s

December 24, 2007

I have been standing in line for a while now to get a chance to try out the Wii at Makro. Unfortunately so are quite a few children. I may just have to buy one untried now that I have seen the Wii Opera SDK. This includes:

Wii Remote detectionRemote Demo, VR Head Tracking Demo

Receive status Wii Remote buttons, pointer coordinates, sensor bar distance, and Z-axis roll.
3D rotationsCube Demo, Rippling Water Demo
Rotate polygons in 3D space then translate them to z-sorted 2D to add that extra dimension to graphics.
Drawing effectsShip Demo, Wall Demo, Floor Demo

Draw lines, circles, rectangles, tiles, texture-mapped walls, and more.
Multiuser Communication
Allow multiple players/users to take part in the same of software.

Download the SDK: Wii Remote, Graphics, 3D Math (General | FPS)

View the documentation.

also check out the wii remote api which the Opera folk have released. Allowing you to be able to monitor all of the remotes that are connected with The Wii Remote API.

  2. //Obtaining the roll of the third Wii remote in degrees
  4. var remote, roll = 0;
  5. //check if the browser provides access to the Wii Remote data
  6. if( window.opera && opera.wiiremote ) {
  7.   //get the KpadStatus object for the third Wii Remote
  8.   remote = opera.wiiremote.update(2);
  9.   //check that the remote is enabled
  10.   if( remote.isEnabled ) {
  11.     //get the roll angle in radians
  12.     roll = Math.atan2( remote.dpdRollY, remote.dpdRollX );
  13.     //convert the roll to degrees
  14.     roll = roll * ( 180 / Math.PI );
  15.   }
  16. }
  18. // Checking what buttons are pressed on the second remote
  19. var remote, buttons = {};
  20. //check if the browser provides access to the Wii Remote data
  21. if( window.opera && opera.wiiremote ) {
  22.   //get the KpadStatus object for the third Wii Remote
  23.   remote = opera.wiiremote.update(1);
  24.   //check that the remote is enabled
  25.   if( remote.isEnabled ) {
  26.     //use the bitwise AND operator to compare against the bitmasks
  27.     buttons.pressedLeft = remote.hold & 1;
  28.     buttons.pressedRight = remote.hold & 2;
  29.     buttons.pressedDown = remote.hold & 4;
  30.     buttons.pressedUp = remote.hold & 8;
  31.     buttons.pressedPlus = remote.hold & 16;
  32.     buttons.pressed2 = remote.hold & 256;
  33.     buttons.pressed1 = remote.hold & 512;
  34.     buttons.pressedB = remote.hold & 1024;
  35.     buttons.pressedA = remote.hold & 2048;
  36.     buttons.pressedMinus = remote.hold & 4096;
  37.     buttons.pressedZ = remote.hold & 8192;
  38.     buttons.pressedC = remote.hold & 16384;
  39.   }
  40. }


YSlow 0.9

December 7, 2007

I’ve mentioned YSlow – the firebug add-on that allows you to monitor what is slowing down your site. using YSlow I have found the most horrendous code in ‘free’ wordpress plugins that download all sorts of things your mother wouldn’t like, SEO tools that stuff cookies, unscrupulous developers using your site to boost their own stats. Its a tool that is essential if you’re doing any kind of forensic investigation into a site’s usability, speed and accessibility, for SEO or any other purpose. The good news is that they’ve just released version 0.9.

There are two big features in this release. By integrating more tightly with Firebug’s Net Panel, YSlow now finds non-DOM components such as Ajax requests and image beacons. And YSlow now crawls frames and iframes and analyzes those resources as well. There are several other new features and bug fixes described in the release notes including highlighting 404s, better detection of CSS expressions and JavaScript minification, and searching within the YSlow panel.

These features make YSlow stronger at identifying performance improvements for Web 2.0 applications. It’s great that YSlow does even better performance analysis of pages, but be forewarned that your previous YSlow scores will drop if these new-found components exhibit bad performance characteristics. As mentioned in Rule 14 – Make Ajax Cacheable, some of the performance improvements that are readily applied to static content (far future Expires header, gzip compression, minification) can also be applied to Ajax responses. Whether it’s Web 1.0 or Web 2.0, YSlow 0.9 helps you figure out what to fix to make your pages faster for your users.