Järjestelmäviesti:Gadget-kartta.js

Huomautus: Selaimen välimuisti pitää tyhjentää asetusten tallentamisen jälkeen, jotta muutokset tulisivat voimaan.

• Firefox ja Safari: Napsauta Shift-näppäin pohjassa Päivitä, tai paina Ctrl-F5 tai Ctrl-R (⌘-R Macilla)
• Google Chrome: Paina Ctrl-Shift-R (⌘-Shift-R Macilla)
• Internet Explorer ja Edge: Napsauta Ctrl-näppäin pohjassa Päivitä tai paina Ctrl-F5
• Opera: Paina Ctrl-F5.

(function ( $ ) {
	
	$( document ).ready( function () {
		var i;
		var $target = $( '.maakuntakartta' );
		
		if ( !$target.length ) {
			return;
		}
		
		var $svg = $( '<object>' ).prop( {
			id: 'kartta',
			type: 'image/svg+xml',
			data: '/static/maakunnat.svg',
			tabindex: -1
		} );
		
		$svg[0].onload = function () {

			// Get the SVG document inside the Object tag
			var svgDoc = document.getElementById( 'kartta' ).contentDocument;
			
			// Get one of the SVG items by ID;
			var svgItem = svgDoc.getElementById("maakunnat_rannatta");
			var maakunnatContainer = svgItem.getElementsByTagName("g")[0];
			var maakunnat = maakunnatContainer.getElementsByTagName("g");
			
			// Inject styles
			var styleElement = svgDoc.createElementNS("http://www.w3.org/2000/svg", "style");
			styleElement.textContent = "svg { fill: #3ba4cb; stroke: #fff; stroke-width: 2; } g.akp-highlight { fill: #0a8ebf; cursor: pointer }";
			svgItem.insertBefore(styleElement, maakunnatContainer);
			
			
			for (i = 0; i < maakunnat.length; i++) {
				var maakunta = maakunnat[i];
				
				maakunta.onclick = function () {
					location.href= $( "#label-" + this.id + " a" ).prop( 'href' );
				};

				maakunta.onmouseover = function () { 
					this.setAttribute("class", "akp-highlight");
					if (document.getElementById("label-"+this.id)) {
						document.getElementById("label-"+this.id).setAttribute("class", "akp-highlight");
					}
				};
				
				maakunta.onmouseout = function () {

				this.removeAttribute("class");
				if (document.getElementById("label-"+this.id)) {
						document.getElementById("label-"+this.id).removeAttribute("class");
					}
				};
			}
			
			var maakuntaLabels = document.getElementById("maakuntalista").getElementsByTagName("li");
			for (i = 0; i < maakuntaLabels.length ; i++) {
				maakuntaLabels[i].onmouseover=function(){
					var svgItemId = this.id.replace("label-", "");
					svgDoc.getElementById(svgItemId).setAttribute("class", "akp-highlight");
					this.setAttribute("class", "akp-highlight");
				};
				
				maakuntaLabels[i].onmouseout = function() {
					var svgItemId = this.id.replace("label-", "");
					svgDoc.getElementById(svgItemId).removeAttribute("class");
					this.removeAttribute("class");
				};
			}
		};
		
		$target.append( $svg );
		
	} );
}( jQuery ) );