For many web developers, whenever JavaScript is mentioned it provokes a rye smile; JavaScript is one of those programming languages that is rather avoided than embraced. This is not the fault of the language itself, but rather the browsers. A few years ago, the landscape of client-side scripting was a bleak scene. Browser inconsistencies, particularly with the dominant Internet Explorer, implementation bugs and numerous target platforms made developing client-side JavaScript a tricky undertaking.

To the consternation of these same developers, the landscape changed and Web 2.0 hit the mainstream. Almost overnight, every website on the internet wanted to use or was using AJAX. Marketers joined the bandwaggon and every feature requested had to involve something dynamic and revolutionary. Thus JavaScript development quickly hit the forefront of peoples minds and became as important as any server-side technology available at the time.

Over the next few blog posts, I will be using the popular frameworks jQuery, Yahoo! User Interface Library (YUI), ExtJS and Adobe’s Spry with ColdFusion to demonstrate various techniques, such as autocomplete and form validation.

You’re a YouTube addict with a serious amount of uncut video footage that you want to upload. If you want to transform that footage into an Oscar winning video clip that will be viewed millions of times, you’ll need to do a little editing. But buying editing tools isn’t a cheap pasttime. However, all is not lost. Ever since the social video market boomed back in 2006, a number of online video services have matured and sought to differentiate themselves by adding editors.

If you’re already working with video on the web, an online editor is fast, easy and free. In theory, these services could bring video editing to people who would otherwise never engage in it. People already engaging in video editing can benefit from automatic software updates and the sharing made possible by online communities.

Here’s a brief look at some of the services out there in the ether.

JumpCut

Jumpcut, acquired by Yahoo in 2006, lets you upload video, photos, and audio, or import from Flickr or Facebook, and edit using a Flash interface. Jumpcut is the most developed of the editors, allowing you to add a long list of effects, transitions, and captions to the videos. It also incorporates fine grained control of trimming and audio levels (uploaded background audio and voice). The complexity of the interface makes it great for detailed edits and mashups, but borders on being too heavy an application for the internet.

Checkout the Jumpcut website.

Eyespot

Eyespot is a fully featured editor like Jumpcut. It has a drag-and-drop interface that lets you upload video, photos, and audio and then add transitions, effects, titles, and music. The editor isn’t as attractive and easy to use as Jumpcut’s, but Eyespot offers a good deal of free media sets from partners like The Colbert Report, Public Enemy, and Dreamworks Pictures. Eyespot’s white label editor is becoming available on more and more sites, with the NBA being a prime example.

Checkout the Eyespot website.

Cuts

Taking a slightly different tack, Cuts is a great example of a Web 2.0 “mash-up”, where two online applications are merged. In this case a video is taken from YouTube, MySpace or Google and you cut, loop, add preloaded sound effects, and insert captions to enhance the original. Editing is straightforward, consisting of changes to the sound, caption, and navigation levels for the video. Every edit can be re-cut, embedded, and emailed. In the future, Cuts will be expanding into simple editing for digital movies and TV shows.

Checkout the Cuts website.

Motionbox

Motionbox is best known for deep tagging videos, but they also have an editor that is ideal for trimming your Motionbox content and joining the videos together.

Checkout the Motionbox website.

Photobucket

Photobucket leverages the most recent Adobe Flash tools. Unlike other services, users can “mash up” video clips with audio files and photos, and add effects and transitions.

Checkout the Photobucket website.

Social network portability is one of several user-interface ideas and suggestions in the area of data-portability. As users, our identity, photos, videos and other forms of personal data should be discoverable by, and shared between our chosen (and trusted) tools or vendors. When you join a new site, you should be able to import or preferably subscribe to your profile information and your social network from any existing profile of yours. We need a DHCP for Identity. A distributed File System for data. The technologies already exist, we simply need a complete reference design to put the pieces together. This problem is solved by a number existing technologies and initiatives: Microformats, OpenID, OAuth, RDF, RSS, OPML and APML.

Data Portabilities mission is to put all existing technologies and initiatives in context to create a reference design for end-to-end Data Portability. To promote that design to the developer, vendor and end-user community.

This post serves a brief primer to each of these technologies.

Microformats

Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards. Instead of throwing away what works today, microformats intend to solve simpler problems first by adapting to current behaviours and usage patterns (e.g. XHTML, blogging).

Examples include:

People and Organizations

hCard

Calendars and Events

hCalendar

Opinions, Ratings and Reviews

VoteLinks, hReview

Social Networks

XFN

Licenses:

rel-license

Tags, Keywords, Categories

rel-tag

Lists and Outlines

XOXO

If you use Flickr, Technorati, Upcoming, Last.fm, Twitter, Cork’d or any number of other services, you can conceivably share data between the different services providers automatically.

More details can be found on the microformats website.

OpenID

OpenID is an open, decentralized framework for user-centric digital identity. OpenID takes advantage of already existing internet technology (URI, HTTP, SSL, Diffie-Hellman) and realizes that people are already creating identities for themselves whether it be at their blog, photostream, profile page, etc. With OpenID you can easily transform one of these existing URIs into an account which can be used at sites which support OpenID logins.

In other words, OpenID allows users to login using shared credentials across different services. It also allows users to decide what information to share between services. For example, you can allow the use of your address on one service, but not another. You can think of OpenID as an extension to the single sign on used by Google or Yahoo! to access their various services.

More details can be found on the OpenID website.

OAuth

The OAuth protocol is less about authentication, which is the realm of OpenID, but rather authorisation. OAuth is an open protocol to allow secure API authorisation in a simple and standard method from desktop and web applications. For consumer developers, OAuth is a method to publish and interact with protected data. For Service Provider developers, OAuth gives users access to their data while protecting their account credentials.

A number of services have already been implemented. These include Fire Eagle, Open Social, Pownce, Get Satisfaction and Magnolia.

More details can be found on the OAuth website.

Resource Description Framework (RDF)

RDF is a family of World Wide Web Consortium (W3C) specifications originally designed as a metadata model but which has come to be used as a general method of modeling information, through a variety of syntax formats.

The RDF metadata model is based upon the idea of making statements about resources in the form of subject-predicate-object expressions, called triples in RDF terminology. The subject denotes the resource, and the predicate denotes traits or aspects of the resource and expresses a relationship between the subject and the object. For example, one way to represent the notion “The sky has the color blue” in RDF is as the triple: a subject denoting “the sky”, a predicate denoting “has the color”, and an object denoting “blue”. RDF is an abstract model with several serialization formats (i.e. file formats), and so the particular way in which a resource or triple is encoded varies from format to format.

This mechanism for describing resources is a major component in what is proposed by the W3C’s Semantic Web activity: an evolutionary stage of the World Wide Web in which automated software can store, exchange, and use machine-readable information distributed throughout the web, in turn enabling users to deal with the information with greater efficiency and certainty. RDF’s simple data model and ability to model disparate, abstract concepts has also led to its increasing use in knowledge management applications unrelated to Semantic Web activity.

More details can be found on the W3C website.

Really Simple Syndication (RSS)

RSS is a family of Web feed formats used to publish frequently updated content including, but not limited to, blog entries, news headlines, and podcasts. An RSS document, which is called a “feed” or “web feed” or “channel”, contains either a summary of content from an associated web site or the full text. RSS makes it possible for people to keep up with web sites in an automated manner that can be piped into special programs or filtered displays.

RSS content can be read using software called an “RSS reader”, “feed reader” or an “aggregator”. The user subscribes to a feed by entering the feed’s link into the reader or by clicking an RSS icon in a browser that initiates the subscription process. The reader checks the user’s subscribed feeds regularly for new content, downloading any updates that it finds.

More details can be found on the RSS Board website.

Outline Processor Mark-up Language (OPML)

OPML is an XML format for outlines. Originally developed by Radio UserLand as a native file format for an outliner application, it has since been adopted for other uses, the most common being to exchange lists of web feeds between web feed aggregators.

The OPML specification defines an outline as a hierarchical, ordered list of arbitrary elements. The specification is fairly open which makes it suitable for many types of list data.

More details can be found on the OPML website.

Attention Profiling Mark-up Language (APML)

APML allows you to share your own personal Attention Profile in much the same way that OPML allows the exchange of reading lists between News Readers. The idea is to compress all forms of Attention Data into a portable file format containing a description of your ranked interests.

Services that have adopted APML include Bloglines, Cluztr, Dandelife, Engagd, Idiomag, OpenLink Data Spaces and Particls.

More details can be found on the APML website.

Securely transfering personal data around the web has become an increasingly important concept to not only users of the web, but service providers. Both Plaxo and Six Apart have been working on a system to allow the transferral of data. However, since Google announce Open Social and the Open Social API, the mantle has been handed over and there is now a strong commitment to realising data portability.

Douglas Crockford, in a four part series on Yahoo! Video, gives a great overview of the Javascript programming language and clears ups some misconceptions along the way.

Part 1:

Part 2:

Part 3:

Part 4:

Slides for the presentation can be downloaded from:

http://yuiblog.com/assets/crockford/javascript.zip

ColdFusion, a key technology behind rapid application development, has been a much maligned technology in the web development arena for sometime now. However, through the efforts of Ray Camden a ColdFusion Developer Center has been created on the Yahoo Developer Network. This is great news for ColdFusion and follows on the back of the integration of the Yahoo User Interface (YUI) Library into the version 8 release of ColdFusion codenamed Scorpio. The YUI is one of the best JavaScript libraries out there and includes great documentation.

In the words of Yahoo:

The Yahoo! User Interface (YUI) Library is a set of utilities and controls, written in JavaScript, for building richly interactive web applications using techniques such as DOM scripting, DHTML and AJAX. The YUI Library also includes several core CSS resources.

Interestingly ColdFusion 8 also supports Spry, which could be considered a rather anaemic AJAX library compared to the YUI library. Whether Spry progresses out of prerelease remains to be seen, however, which ever AJAX route is taken, ColdFusion will benefit from closer integration in its core tag set.

Peter Schirmer has brought a new, awesome, meaning to mashups. He has created the concept of a weather clock. Instead of telling the time, this clock tells the weather.

How did he do this?

He used a fake antique clock that he bought on eBay. The clock mechanism was removed and replaced with a servo and USB servo controller so that the clock could be controlled from his computer. The face of the clock was designed to incorporate 13 weather conditions (cold, hot, fog/haze, cloudy, partially cloudy, sunny/clear, clear at night, rain/showers, sleet/freezing rain, snow, windy, thunderstorms, hurricane/tornados). The clock was then connected to a flash application that interrogated the Yahoo! weather API based on a specified postal/zip code.

Take a look at his site: http://www.thisispete.com/weatherclock.html

Web 2.0 will alter the way that businesses develop and apply innovative ideas.

During the 1990s business leaders and venture capitalists grappled with how they would make money from the web. This was tipified by the two VCs, Kleiner Perkins and Sequoia Capital, investing $25 million in Google in the late 1990s; they new the search engine created by Sergey Brin and Larry Page was a winning formula, even though the pair had not yet monetised search. Bricks and mortar compaines were deemed “old hat” as the dotcom bubble was expanding. Companies such as eBay, Amazon and Yahoo! were at the forefront of every investors’ chequebook. Every company needed a 21st Century “Blue Sky” web strategy; every company needed to do e-commerce. However, the bubble burst and everyone was brought down with a bang. Boo.com is a classic example of the fallout from the over speculation.

Today, the reality has shifted from solely bricks and mortar or dotcom, to a balance between the real world and cyberspace, of traditional business operations complemented by the unversality provided by web-based technologies. The web has given businesses a greater understanding of their customers. With Web 2.0 a new type of web is emerging, further enhancing the understanding of a user or customer through the creation of online communities, where information is shared and new ideas evolve.

There are numerous examples of web communities from the early FriendsReunited to MySpace and the more specific Islandoo for the Channel4 TV progamme Shipwrecked. Web 2.0 is all about collaborative networks tipified by Flickr, del.icio.us, Wikipedia and YouTube. However, Web 2.0 has primarily been used in the consumer arena, as identified by the examples, but the use of such technologies has far reaching implications based on understanding how people interact with the technologies and behave online. Linking people across countries, time-zones and company boundaries will enable people to work together without hierarchical boundaries, bringing people together as one team to collate the best input. This is emphasised with the concept of a wiki whereby any end-user can make changes to the shared resource without the need for specialist software and expensive training. This makes sharing knowledge extremely easy.

Other areas of Web 2.0 is the technology identified by the term “folksonomy”. Simply, a folksonomy is defined on Wikipedia as:

… an Internet-based information retrieval methodology consisting of collaboratively generated, open-ended labels that categorize content such as Web pages, online photographs, and Web links. A folksonomy is most notably contrasted from a taxonomy in that the authors of the labeling system are often the main users (and sometimes originators) of the content to which the labels are applied. The labels are commonly known as tags and the labeling process is called tagging.

While it takes time for an expert to create a taxonomy specific to a particular organisation in order to categorise or define data, folksonomies do not require fixed taxonomies. Instead, users define their own descriptions of the data to be described by applying tags to the data, whether it is a bookmark in terms of del.icio.us, an image on Flickr, a video on YouTube or a document in a company repository. Over time, these tags can be amended by other users resulting in a definition that is more specific. This enables users to find information with relative ease, without having to type the exact keyword.

Web 2.0 will bring a whole host of issues into the business arena. While there are clear benefits from establishing communities and social networks, people with different views, be it political or religious, can drive the agenda. Further complications arise through the necessity to audit changes to the data and ensuring the data is indeed accurate (Wikipedia has had cases where people have maliciously altered data to either enhance their own profile or devalue the significance of historical events).

What is AJAX?

Asynchronous JavaScript and XML. It’s a whole new way of looking at the web where HTML page makes asynchronous calls to the server using JavaScript and loads the data in bits and pieces as needed. Ajax is not a new technology. It’s a new developing approach, based on the following existing technologies:

• XHTML and CSS for standard presentation,
• DOM (Document Object Model) for dynamic and interactive presentation,
• XML and XSLT for data exchange and manipulation, and
• XMLHttpRequest for asynchronous data retrieval

The term “AJAX” was first muted by Jesse James Garrett of AdaptivePath and has become synonymous with the ideas and concepts of Web 2.0. Ajax has been popularised by the likes of Google in their Gmail and Google Suggest applications, Flickr and del.icio.us, now both owned by Yahoo!.

Below I have listed a few of the frameworks available to the ColdFusion community. I will leave it up to you to decide which one is the best and easiest to implement. Please tell me your experiences.

AjaxCFC

AjaxCFC, created by Rob Gonda, is a ColdFusion framework meant to speed up Ajax application development and deployment by providing developers seamless integration between JavaScript and ColdFusion, and providing built-in functions, such as security and debugging, to quickly adapt to any type of environment and helping to overcome cross-browser compatibility problems.

• ColdFusion components following the best practices of object oriented programming and design patterns. Programming with ajaxCFC involves extending components and creating your own ajax façades.
• Intergration with Model-Glue, one of the most popular MVC frameworks widely used by the ColdFusion community.
• Works with ColdFusion MX 6.0, 6,1, 7.0 and Blue Dragon.
• Automatically handles complex object transmitted from the client to the server and vice versa.
• Server returns pure JavaScript code to the callback handler (instead of XML or JSON) to vastly improve performance.
• On-the-works: Built-in base64 and/or blowfish encryption.
• Licensed under the Apache License Version 2.0, by Rob Gonda.

The project can be downloaded from Rob Gonda’s website at the following address: http://www.robgonda.com/blog/projects/ajaxcfc/

JSMX

JSMX is a simple API available for connecting your Web Applications to an AJAX front end. The main difference between JSMX and other AJAX implementations is that JSMX allows you to pass either XML or JavaScript to the API. JSMX was originally created to be used with ColdFusion applications because of how easy it is to create JavaScript Strings natively within ColdFusion (using either the CFWDDX tag or the ToScript() function). However, because there is no server-side component to be installed, JSMX can really be used with any programming language.

• Using the CFWDDX tag, or the toScript() function, within ColdFusion makes converting your ColdFusion Objects to JavaScript a SNAP!
• Smaller Packet Sizes over the wire (JavaScript Vs. XML).
• Reduced latency due to less parsing of the responses.
• Parameters can be sent to the server in multiple formats including, strings, objects, and entire forms without having to build extra logic to handle each type.
• API has no Server Side components which makes it more portable.
• Extremely simple syntax shortens the learning curve and speeds up development.
• Open-source (Creative Commons Attribution-ShareAlike License).

JSMX is the creation of Todd Kingham at LaLaBird.com and can be downloaded from the following link: http://www.lalabird.com/?fa=JSMX.downloads

CFAjax

CFAjax is the AJAX implementation for coldfusion. It makes ColdFusion method calls on server directly from HTML page using JavaScript and return backs the result to the calling HTML page. CFAjax comes with simple to use JavaScript API and simple ColdFusion implementation that marshal’s the response between your ColdFusion methods and HTML page. Using CFAjax you can create highly interactive websites with greater performance and usability.

CFAjax can be downloaded at the following link: http://www.indiankey.com/cfajax/project.asp

SAJAX for ColdFusion

Sajax is an open source tool to make programming websites using the Ajax framework — also known as XMLHTTPRequest or remote scripting — as easy as possible. Sajax makes it easy to call PHP, Perl or Python functions from your webpages via JavaScript without performing a browser refresh. The toolkit does 99% of the work for you so you have no excuse to not use it.

Sajax for ColdFusion is the creation of Steve Smith at Ordered List and can be downloaded from the following link: http://www.orderedlist.com/downloads/SAJAX_ColdFusion.zip