Yesterday we have a visit to the office and we wanted to show an application on a development server on a customer facilities. They opened for us the port to access the app, but they forgot to open the TileCache web server so our OpenLayers map was full of pink tiles and we cannot open the service.
What to do? Well we didn’t have the time to catch de sys admins so I figured that changing somehow the map Base Layer by any other suitable WMS layer from our national SDI, precisely our great ortophoto service (called PNOA) would be enough to not get the embarrassing pink tiles.
So I ended up writing an small User Script (my very first one) that could be easily added to the Chrome/Chromium browser using the Tampermonkey extension (similar to the Greasemonkey extension of Mozilla Firefox). The script looks for a layer called “Base” and changes its url and the layer name of the parameters object. It also does the same task on the overview map.
// ==UserScript==
// @name Dirty OL Hack
// @namespace http://www.prodevelop.es
// @description Changes the OL base map
// @include http://my-great-ol-app/path/*
// ==/UserScript==
window.addEventListener("load", function(e) {
Ext.onReady(function(){
map = path.to.my.map;
l = map.getLayersByName("Base")[0]
l.params.LAYERS = "pnoa";
l.url = "http://www.idee.es/wms/PNOA/PNOA";
map[map.getLayerIndex(l)] = l;
c = map.getControlsByClass("OpenLayers.Control.OverviewMap")[0];
c.layers[0] = l;
c.ovmap.layers[0].url[0] = c.layers[0].url
c.ovmap.layers[0].params.LAYERS = c.layers[0].params.LAYERS
l.redraw();
c.ovmap.layers[0].redraw()
});
}, false);
The point is that this code has to run when all the Ext.JS layout and OpenLayers code has been initialized.
It has more holes than an emmental cheese for sure, but as dirty as is, it worked fine for the demo. I have no idea why it doesn’t work on Firefox but works on Chrome and in Opera but who cares? :-).
