Using MapQuest OSM Tiles in OpenLayers

With the recent launch of Open.Mapquest U.S, people now have one more way to view and contribute to OpenStreetMap data. Among those cool things of new Open Mapquest initiative, my favorite is the look and feel of those tiles generated from OSM data:

In my own opinion, it has much better looking than the original OSM Mapnik or Osmarender style. Since the structure of Open.Mapquest tiles are exactly the same as OSM tiles except for the base url, it can not be easier to use them as base layer in an OpenLayers application. Here is how to do it:

1: ...
2: // in place where you use to add OSM layer 
3: // var osm = new OpenLayers.Layer.OSM();
4: // map.addLayers([osm]);
5: 
6: // create a new class for Open.Mapquest tiles
7: OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
8:     name: "MapQuestOSM",
9:     //attribution: "Data CC-By-SA by <a href='http://openstreetmap.org/'>OpenStreetMap</a>",
10:     sphericalMercator: true,
11:     url: ' http://otile1.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png',
12:     clone: function(obj) {
13:         if (obj == null) {
14:             obj = new OpenLayers.Layer.OSM(
15:             this.name, this.url, this.getOptions());
16:         }
17:         obj = OpenLayers.Layer.XYZ.prototype.clone.apply(this, [obj]);
18:         return obj;
19:     },
20:     CLASS_NAME: "OpenLayers.Layer.MapQuestOSM"
21: });
22:     
23: var mapquestosm = new OpenLayers.Layer.MapQuestOSM();
24: // map.addLayers([mapquestosm]);
25: ...

This is a screen shot of how Open.Mapquest tiles look like in OpenLayers app