Libraries

Dojo Toolkit 1.3 Released

The 1.3 version of the Dojo toolkit is finally out. The main focus of this release has been browser compatibility (particularly IE 8 and Chrome) and speed. According to Dojo-reported numbers on the TaskSpeed benchmark, Dojo is the fastest JavaScript toolkit on common DOM operations, at least twice as fast as other JavaScript toolkits. Of course, all the usual caveats about micro-benchmarking apply, but the speed increase is nevertheless quite impressive.

Simultaneous with the Dojo 1.3 release is the release of the PlugD, a library allows Dojo developers to mimic some of the popular aspects of jQuery (method chaining, as well as many similarly-named convenience methods).

The full release notes can be found here. You can download the new release here.

Override alert() with a YUI Dialog

We all know that using alert in a finished application is not good design, but we often overlook this for the ease of using alert. Well, over at YUICoder they have put together a good post on replacing alert with a YUI dialog box.

Below is an excerpt from the post.

You know and I know and everyone knows the alert boxes generated by the browsers are OLD-SCHOOL and look like garbage. Well using YUI you can easily change that by just including a little code in you page. Simply add the code below to the bottom of your page just before the end body tag then add the body style to the begining body tag called “yui-skin-sam” and that’s it. Oh and don’t forget to include your YUI Framework base and the additional scripts “container”, “dragdrop” and “animation”. For an example on how to included the YUI Framework and load specific parts check out for a quick start guide for YUI Loader and Yahoo CDN.

AlertDialog = new YAHOO.widget.SimpleDialog("dlg1", {

  width: "200px",
  effect:{effect:YAHOO.widget.ContainerEffect.FADE,duration:0.15},

  fixedcenter:true,
  modal:true,
  visible:false,

  close: true,
  constraintoviewport: true,
  buttons: [ { text:"close", handler: function(){this.hide();}, isDefault:true }],

  draggable:false,
                effect: [
                      { effect:YAHOO.widget.ContainerEffect.FADE,duration:0.1 }]

});
 
AlertDialog.setHeader("Alert");      
AlertDialog.render(document.body);

window.alert = function(text) {
  AlertDialog.cfg.setProperty("text",text);

  AlertDialog.show();
};

You can read the full post here.

While this post was written for the Yahoo! User Interface library, it should be fairly easy to port it to a different framework as the concept is the same. So, now we have no excuse to use the standard alert.

40 Useful JavaScript Libraries

Over at Smashing Magazine they have put together a very good list of 40 useful JavaScript libraries.

Below is an excerpt from the list.

3. Visualization And Image Effects

JS charts
JS charts supports bar charts, pie charts and simple line graphs. It offers nice usability by simply inserting the library onto Web pages and calling the data from an XML file or a JavaScript array. Charts are created as PNG files and the library is compatible with all the major browsers.

JS Charts

Canvas 3D JS Library (C3DL)
C3DL makes writing 3D applications easy. It provides a set of math, scene and 3D object classes to make the canvas more accessible to developers who want to develop 3D content in a browser but not have to deal in depth with the 3D math needed to make it work.

C3DL

Processing.js
This is a JavaScript port to the Processing language (a language for programming images, animation and interactions). The library is feature-rich for creating 2D outputs. It provides methods for shape/image drawing, color manipulation, fonts, objects, math functions and more.

Processing.js

Raphaël
An amazing library that simplifies working with vector graphics on the Web. Raphaël uses SVG and VML for creating graphics that can be modified and event handlers that can be attached to them. The library is feature-rich in functions, including rotation, animation, scaling and drawing curves, rectangles and circles.

Raphael: Vectors With JavaScript

ImageFX
This is a JavaScript library for adding effects to images, like blur, sharpen, emboss, lighten and more. ImageFX uses canvas element for creating the effects. It is compatible with all major browsers (there is a compatibility chart on the script’s page). The library is so easy to use. Simply inserting the .js file in the Web page and calling a one-line function is enough.

Imagefx

Pixastic
Pixastic uses the HTML5 canvas element, which enables accessing raw pixel data. The effects supported include desaturation and grayscale, inverting, flipping, brightness and contrast adjustment, hue and saturation, embossing, blurring and much more. Because the canvas element is relatively new, the library does not have equal support in all browsers yet.

Reflection.js
An unobtrusive JavaScript to auto-create reflection effects. The height and opacity of the reflection can be defined. Using it is as easy as adding a “class” to the images. It works in all major browsers and is smaller than 5 KB.

Reflection.js

You can read the full post here.

Apache Ivy 2.0 Released

Tagged:  

The Apache Ivy project, now a subproject of Ant but formerly a product of Jayasoft, has released version 2.0 of its dependency management solution for Ant build files. It is the first stable release of Ivy since becoming a full-fledged subproject of Ant.

The release features increased compatibility with Maven 2.0, improved cache management, a new "packager" resolver, and better handling of relative paths. Ivy has become an excellent tool for those unable (or unwilling) to move to Maven, but unable to live without dependency management (though there is also Maven's own Ant tasks).

Ivy 2.0 is available for download here. The IvyDE Eclipse plug-in (essentially an editor for ivy.xml files and a classpath container for your dependencies) is also available through the update site:

http://www.apache.org/dist/ant/ivyde/updatesite

jQuery Patches for 1.3

Offering a sneak peak of what will be in the new version, John Resig has released the first in a series of patches to jQuery in preparation for the 1.3 beta release. They are:

  • A patch to the .domManip method to use DocumentFragments, resulting in manipulation code (append, prepend, etc.) that is about 15x faster.
  • Addition of a .closest(selector) method which starts with the current node and traverses the parents in the DOM tree to match the selector (think "first self or ancestor"):
    closest: function( selector ) {
              return this.map(function() {
                  var cur = this;
                  while ( cur && cur.ownerDocument ) {
                       if ( jQuery(cur).is(selector) )
                          return cur;
                       cur = cur.parentNode;
                  }
               });
    }
  • A patch to the seminal DOM ready() method that backs off attempting to detect the loading of stylesheets (apparently not possible according to Resig) to normal "document ready" functionality.
  • Addition of multiple-namespace support for events.
  • A new internal property that keeps track of the selector chain (mainly for use by plug-in authors).

The new jQuery 1.3 will also feature the Sizzle JavaScript CSS selector engine as well as revamped implementations of all the selector-based methods.

You can read all about the new patches in Resig's original post here.

Update: the new Sizzle engine has been added to the 1.3 trunk.

TIBCO GI 3.6.2 and GI 3.7.0 M1 Technology Preview Release

Tagged:  

Now available for download is TIBCO's General Interface 3.6.2 service pack release.

Here's a summary of what's new in 3.6.2 from the release notes:

General Interface Template Language
The new template language enables you to create custom, re-usable components by building on your knowledge of HTML and JavaScript. Using the template language, you can convert a single snippet of HTML—a widget—into a re-usable component. This means that if you’ve developed user interface components that combine HTML and JavaScript code, you can convert the functional user interface HTML elements into a General Interface template for custom usage.

CDF Form Mapping
General Interface 3.6.2 introduces a new CDF class that enables developers to map a CDF document in the local cache to on-screen form fields—without the need to author additional JavaScript code. The new class, jsx3.gui.CDF, is a container that knows how to bind the form fields it contains to values in a CDF document.

JSON Mapping
The General Interface Mapping utility now supports mapping to JSON-based services. Similar to mapping to WSDL and XML, the new JSON mapping feature provides a visual tree to which the developer can assign mapping rules. JSONP is supported by default, which gets around cross-domain security problems when accessing data from other sites.

Read the full release notes for more information

Also available is the General Interface 3.7.0 Milestone 1, technology preview release. Go to the TIBCO Developer Network site http://www.tibco.com/devnet/gi for downloads and more info.

New in 3.7

  • Asynchronous Modular Platform (AMP), the Eclipse inspired plug-in architecture for building advanced modular and high-performing enterprise AJAX application.
  • Extensible GI Builder IDE based on AMP
  • Syntax highlighting script editor
  • and More ...

Sizzle

Tagged:  

In August of 2008, John Resig started the Sizzle project, a new JavaScript CSS selector engine, with the goal of providing a small (about 4k) and fast core that could be leveraged by jQuery as well as other libraries (such as Dojo, MooTools, etc.). According to Resig, the new library is about 4 times faster than other selector engines in all major browsers. Resig has also been active in courting other framework designers, asking them to adopt Sizzle in their libraries.

While some have many have expressed great excitement at the idea of having a common selector engine, not all are enthusiastic about the idea. Valerio Proietti from the MooTools project has written a blog detailing why he won't be using Sizzle, and even going so far as to say it discourage competition in the JavaScript framework arena.

I’m not saying that John Resig seeks a monopoly over CSS selector engines, but that’s sure what it looks like. Competition and innovation will stop if everyone uses the same piece of code. Yes, competition and innovation[...]

So, if using one shared selector engine is ok, where do we draw the line? Is it ok to use a shared DOM manipulation library, or a shared event library? What makes our framework ours? If we start replacing core parts by outsourcing them to Dojo, our frameworks will just be a dull layer for code we didn’t even write, and we will lose credibility.

While one has to respect Valerio's decision to stick to his own code, I think that he misses some of the potential benefits of having a common selector core across multiple frameworks: elimination of code duplication, consistency of behavior, and robustness (if multiple libraries use a common core, bugs get squashed quicker). After over a decade, JavaScript is finally "growing up" as a language: frameworks like Dojo, Prototype, and jQuery have been a big part of this, allowing developers to get much more done in a much faster time frame than was possible before. It is only natural during this process that common pieces of infra-structure get built to allow framework designers to focus on other things.

If Resig does a great job with Sizzle, why should a new JavaScript library re-invent the wheel? Claiming Resig is somehow seeking a "monopoly" over JavaScript selector engines seems a bit silly and far-fetched. I think the real issue is an (understandable) pride is his own code, and a reluctance to throw it away in favor of someone else's...

jMaps - jQuery Google Maps Plugin

jQuery has quickly become one of the most used JavaScript libraries around. Google Maps is possibly the most popular mapping website on the web. Wouldn't it be nice to connect the two easily using a small library? Well, jMaps is a library that does just that and version r64 has just been released.

Below is a rundown of the main features as posted on the jMaps Google Code page.

jMaps is a jQuery plugin that provides a really easy API to create and manage multiple google maps on any page.

  • Geocode and reverse any valid address in the world via Google's geocoding API
  • Search for directions to and from any location
  • Add and remove Markers
  • Add and remove polygons and polylines
  • Add and remove graphic layers on the map
  • Add and remove Google adsense layers
  • Add and remove Traffic layers
  • Get information back such as map center, map size, map type, etc

You can go to the Google Code page here.

JS Strict Data Types - Beta 1.1 Released


JS Strict Data Types Beta version 1.1 has just been released. The new release fixes various bugs that where found in the initial release. The biggest fix was one that caused the string and integer data types to not be kept correctly in certain situations.

Any code that you may have written using the library should work with no code changes. So, we recommend that anybody using the initial release start using this new release.

You can go to our Google Code page here.

You can download the new version here.

JS Strict Data Types - Released

We at Ajaxonomy are happy to announce the release of the first library in the Ajaxonomy Developer's Toolkit. The library is called JS Strict Data Types and attempts to provide a way to maintain strict data types in JavaScript. Strict data types are proposed in the next version of JavaScript, however it is hard to say when you will actually be able to use it in all browsers. So, JS Strict Data Types is an attempt to allow the use of strict data types now.

The library is very easy to use. Simply include the small 7K (uncompressed) js file in your web page or application and then you can start defining variable data types strictly through the methods used in the below example.

MyVar1 = new Int(12); //Creates an Integer variable MyVar2 = new Float(2.54); //Creates a Float variable MyVar3 = new String("Some Text"); //Creates a Sting variable MyVar4 = new Boolean(true); //Creates a Boolean variable

The library uses various methods to maintain the strict data type (if you choose not to use the methods in the library strict data types may not continue to be maintained). The below shows a few of the mathematical methods that are available in the library.

MyVar1.add(5); MyVar1.sub(2); MyVar1.mult(10); MyVar1.div(7);

Since there are quite a few methods that are used to guarantee that strict data types it is recommended that you read the documentation before using the library.

This beta 1.0 release of the library is released under the GNU Lesser GPL. So, it can be used for personal and commercial use. Because of this go ahead and use the library in other libraries or any JavaScript project.

You can see a demo page that uses the library and displays the results here.

You can download the library here.

You can go to the projects Google Code page here.

You can read the projects documentation here.

Syndicate content