Extracts a word which starts with a given substring

// extracts js_* class
$(anySelector).attr('class').match(/\bjs_[^\b]*?\b/)[0]; 

Remove duplicates in an array

[1,1,2,2,3,3,4].reduce(function (a,b) { if (a.indexOf(b) < 0) a.push(b); return a;},[]);

will return [1,2,3,4]

In case of arrays composed of JSON objects use this expression for the "if"clause:

(JSON.stringify(a).indexOf(JSON.stringify(b))

Brackground-color transitions

With a tiny jQuery plugin and CSS3 is possible to create programmatic background color transitions.

See this page for "easing" possible values.

Filter a list with Highlight

For this user filtered I've used two tiny jQuery plugins to keep in mind.

The first is called "MyCaseInsensitiveContains" (by Eric Best. Found in stackoverflow.com) which does the same as jQuery built-in ":contains" but not case sensitive.

The second plugin ("highlight", by Bartek Szopka) allows to highlight texts, wrapping them in a span with ".highlight" CSS class.

Note: This post uses different techniques used in the post "Filter list by typed text".
 

PURE - Javascript Template Engine

Write your templates in pure HTML

Clean of any inline logic or special tags
CSS selectors are used to bridge the HTML with Javascript actions
Providing a radical separation between the representation and the logicHere we explain why we did PURE back in 2008
And you can ask your questions to the user group

Download pure.js on Github

Where to use PURE?

PURE can be used where Javascript and DOM are available
It can be run server side, but shines client side

If a Javascript library is present in the page( jQuery, dojo, domassistant, mootools, prototype, sizzle or sly )

PURE will automatically extend it with the methods described here: http://beebole.com/pure/

I've written myself a demo. Pay special attention to auxiliar function tmplHandle().

Bing Maps API

Bing Maps is a web service created by Microsoft Corporation which allows end users to search and view maps from any part of the world. It has an API with allows to embed Maps in web pages. This post is an starting point to develop Bing Maps.

In the website http://www.bingmapsportal.com/isdk/ajaxv7 there is all the information about this API and live examples. This library is highly configurable to adjust your website look requirements.

The JavaScript library to include is the following:

http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0

To create a map there are a couple of required elements: the target DIV of the map and a JSON with the Map settings. This JSON at least has to have a property called "credentials" with the developer/company credentials to use the library on any website. There are other properties that may be useful to setup the map. For example:

var mapOptions = {
      credentials: "your credentials",
      width: 490,
      height: 370,
      zoom: 10,
      showMapTypeSelector: false,
      disableBirdseye: true,
      enableSearchLogo: false
}

To create the map, and put it in a <div> with id="mapContentDiv" the code could be:

var _map = new Microsoft.Maps.Map(document.getElementById(mapContentDiv), mapOptions);

To set a pin on a map (also called "Pushpin") you must create a Pushpin object. Example:

var _mapCenter = new Microsoft.Maps.Location(47.5, -122.33), // Latitude, Longitude
    _pushpinOptions = { draggable: false }, // optional setting. Just as an example
    _pushpin = new Microsoft.Maps.Pushpin(_mapCenter, _pushpinOptions);

_map.entities.push(_pushpin); // To set it on the previously created map

You may include all the Pushpins you need.

There's a particularly interesting point at inserting several Pushpins not too far from each other and set a zoom level which permits to view them all. To do this, the code may be:

var _mapLocation1 = new Microsoft.Maps.Location(47.5, -122.33), 
    _mapLocation2 = new Microsoft.Maps.Location(47.51, -122.33);
    _pushpinOptions = { draggable: false }, // optional setting. Just as an example
    _pushpin = new Microsoft.Maps.Pushpin(_mapLocation1 , _pushpinOptions);
_map.entities.push(_pushpin); 
_pushpin = new Microsoft.Maps.Pushpin(_mapLocation2 , _pushpinOptions);
_map.entities.push(_pushpin); 

_map.setView({ bounds: Microsoft.Maps.LocationRect.fromLocations(_mapLocation1, _mapLocation2) }); // As many locations as needed

The next code produces a map like the one below.

var _mapLocation1 = new Microsoft.Maps.Location(47.5, -122.33),
      _mapLocation2 = new Microsoft.Maps.Location(47.51, -122.33),
      _pushpinOptions = { draggable: false },
      _pushpin = new Microsoft.Maps.Pushpin(_mapLocation1, _pushpinOptions);
 map.entities.push(_pushpin);
_pushpin = new Microsoft.Maps.Pushpin(_mapLocation2, _pushpinOptions);
 map.entities.push(_pushpin);

map.setView({ bounds: Microsoft.Maps.LocationRect.fromLocations(_mapLocation1 , _mapLocation2) });

For more information I encourage you to look up on the mentioned API website.