WMS OpenLayers click on thumbnail image to show Layer

by Thomas B.

HTML

<script src="http://maps.google.com/maps/api/js?v=3.5&amp;sensor=false"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/openlayers/2.13.1/OpenLayers.js"></script>
<body onload="init()">
     <h1></h1>

    <div id="map-canvas" class="smallmap"></div>

    
</body>

CSS

#map-canvas {
    width: 100%;
    height: 400px;
    border: 1px solid #dddddd;
    margin-top:10px;
}
.vorschau {
    width: 150px;
    height:80px;

    cursor:pointer;
    border: 1px solid #00008B;
}
#thumbnails
{
    
   margin-bottom: 15px;
}

JavaScript

var map;

function init() {
    var google_layer=new OpenLayers.Layer.Google(
        "Google Physical",
        {type: google.maps.MapTypeId.TERRAIN}
    );
    //console.log(google_layer);
    
    map = new OpenLayers.Map('map-canvas', {
        projection: 'EPSG:3857',
        layers: [google_layer
			,
		 new OpenLayers.Layer.Google(
            		"SAT",
            		{type: google.maps.MapTypeId.SATELLITE, visibility:false, isBaseLayer:true}
            ),
						new OpenLayers.Layer.WMS("Idrografia",
					"http://geomap.reteunitaria.piemonte.it/ws/siti/aipo-01/sitiwms/wms_aipo_dati_base?", 
					{layers: 'Idrografia,IdrografiaLabel', transparent: true},
					{isBaseLayer: false, singleTile: true, queryLayers: 'Idrografia', visibility: true}
			),
			new OpenLayers.Layer.WMS("Limiti amministrativi",
					"http://geomap.reteunitaria.piemonte.it/ws/siti/aipo-01/sitiwms/wms_aipo_dati_base?", 
					{layers: 'Regioni,Province,Comuni,ComuniLabel', transparent: true},
					{isBaseLayer: false, singleTile: true, queryLayers: 'Comuni', visibility: false}
			),
			new OpenLayers.Layer.WMS("Bacini idrografici",
					"http://geomap.reteunitaria.piemonte.it/ws/siti/aipo-01/sitiwms/wms_aipo_dati_base?", 
					{layers: 'Bacino,BacinoLabel', transparent: true},
					{isBaseLayer: false, singleTile: true, visibility: false}
			), 
			new OpenLayers.Layer.WMS("Carta Fiume Po 1:50.000",
					"http://geomap.reteunitaria.piemonte.it/ws/siti/aipo-01/sitiwms/wms_aipo_cartafiumepo?", 
					{layers: '2011_CT50_Po', transparent: true},
					{isBaseLayer: false, singleTile: true, visibility: false}
			),
			new OpenLayers.Layer.WMS("Competenza AIPo",
					"http://geomap.reteunitaria.piemonte.it/ws/siti/aipo-01/sitiwms/wms_aipo_competenza_aipo?", 
					{layers: 'AIPO-Competenza', transparent: true},
					{isBaseLayer: false, singleTile: true, queryLayers: 'Competenza_AIPo_pol,Competenza_AIPo_lin', visibility: false}
			),		
			new OpenLayers.Layer.WMS("Sezioni...