Archive for the 'Library' Category

innerShiv: Make innerHTML + HTML5 Work in IE

(Various Shivs)
Via JD Bartlett comes HTML5 innerShiv for IE. Before innerShiv, the following would not work in IE:
PLAIN TEXT
HTML:

var s = document.createElement(’div’);
s.innerHTML = "<section>Hi!</section>";
document.body.appendChild(s);
 

For example, let’s imagine we have some CSS that defines the following for the HTML5 elements footer, header, and section:
PLAIN TEXT
CSS:

footer, header, section {
  border:1px solid #ccc;
  display:block;
  padding:10px;
}
 

Unfortunately, even if [...]

Glimmer: Visual Builder for JQuery Animations

From Tim Aidlin over at Microsoft comes a tutorial on using JQuery to do animation. The tutorial is focused on using a new library they have designed called Glimmer that allows designers and developers to create interactive elements and animations on web pages using JQuery. Using Glimmer you setup your HTML and CSS and then [...]

Canto.js: An Improved Canvas API

Javascript author extraordinaire David Flanagan released Canto.js recently, a lightweight wrapper API for canvas, introduced here and documented at the top of the source code. Example:
PLAIN TEXT
JAVASCRIPT:

canto(”canvas_id”).moveTo(100,100).lineTo(200,200,100,200).closePath().stroke();
 

Notice three things:

canto() returns an abstraction of the canvas - a “Canto” object.

As with jQuery and similar libraries, there’s method chaining; each method called on a Canto [...]

YUI 3.2.0 preview release 1 – touch events support, transitions and browser-specific loading

Over at the the YUI blog the team just announced the preview release of YUI 3.2.0. YUI3 now has some interesting new features that the team wants you to try and tell them if they work out for you. The changes to the already very powerful library are quite ambitious:

Touch event support for mobile interfaces [...]

Inline content assist for text fields and areas

Sergey Chikuyonok has created a really nice, easy to use, and good looking content assist library for input text fields and text areas:

It calculates precise position of characters in or
tag and places completion proposals popup under it. You can explicitly call popup window to assist/replace word (depends on caret position) with Ctrl+Space (buggy [...]

Sencha Touch: The end of native; A new touch framework for the Web

As I walked around Moscone last week, I saw some prophets speaking of a future that isn’t all Native. A future where the Web is the platform. Others saw it too:

I pondered who would be behind the act and smiled as I had a good idea. The group behind this all is the newly named [...]

Modernizr: Point and see how modern you are

Modernizr detects feature support across JS APIs and CSS. Now, there is a simple
page that shows you what Modernizr thinks of your browser:

A/B testing your Cohorts with Google Analytics result views

PLAIN TEXT
JAVASCRIPT:

var header_test = new Cohorts.Test({
    name: ‘big_vs_small_header’,
    sample: 1, // we want to include all visitors in the test
    cohorts: {
        big: {
            onChosen: function() {
                $(’#big’).show();
            }
        [...]

Stomple: Stomping to the server via WebSockets

Karl Krukow has created Stomple, a library that “enables using the browser as a reliable messaging client, e.g. for JMS.” It is trivially simple to now have a browser (that supports this new WebSockets world) to join in with JMS backends, and start to consume.
To get going it is as simple as:
PLAIN TEXT
JAVASCRIPT:

var client = [...]

Two JS solutions to run SQL-like statements on Arrays and Objects

Thomas Frank released SQLike a script that allows you to filter arrays and objects in JavaScript with a SQL-like syntax.
Query:
PLAIN TEXT
JAVASCRIPT:

SQLike.q(
    {
        Select: [’firstName’,'|count|’,'firstName’,'|sum|’,’salary’,'|min|’,’salary’,'|max|’,’salary’,'|avg|’,’salary’],
        From: dataArray,
        GroupBy: [’firstName’],
        Having: function(){return this.count_firstName>1},
        OrderBy: [’sum_salary’,'|desc|’]
   }
)

Results:
PLAIN TEXT
JAVASCRIPT:

[{”firstName”:”Stuart”, “count_firstName”:3, “sum_salary”:180000, [...]