/** * mapper.js 2.2 (10-Jun-2008) * (c) by Christian Effenberger * All Rights Reserved * Source: mapper.netzgesta.de * Distributed under Netzgestade Software License Agreement * http://www.netzgesta.de/cvi/LICENSE.txt * License permits free of charge * use on non-commercial and * private web sites only **/ var canvascheck = document.createElement('canvas'); var isIE = window.navigator.systemLanguage?1:0; var isVM = document.namespaces?1:0; var isJG = 0; var isCV = canvascheck.getContext?1:0; var jg = new Array(); if(isVM) { if(document.namespaces['v'] == null) { var stl = document.createStyleSheet(); stl.addRule("v\\:*", "behavior: url(#default#VML); antialias: true;"); document.namespaces.add("v", "urn:schemas-microsoft-com:vml"); } } function showCoords(map,ele,x,y,w,h) {} function getClasses(classes,string){ var temp = ''; for (var j=0;j=1) { mapid = document.getElementsByName(mapname[1]); if(mapid) {elements.push(child); break;} } } } } return elements; } function fadeCanvas(id,opac) { var obj = document.getElementById(id); if(obj.fading==1 && opac<=100) { obj.style.opacity = opac/100; opac += 10; window.setTimeout("fadeCanvas('"+id+"',"+opac+")",10); } } function setAreaOver(obj,id,bd,co,op,nb,f,z) { var a, i, j, d, c, o, b, n, l, r, v, u, x, y, p, k = 0, t = '', r = obj.getAttribute('rel'), context, canvas = document.getElementById(id); if(r!=null) {d = r.split(","); v = d.unshift(obj.id); }else {d = new Array(obj.id); } function setAttr() { if(l.indexOf('forcegroup')!=-1) {k = getClassAttribute(u,"forcegroup");}else {k=0;} if(l.indexOf('iopacity')!=-1) {o = getClassValue(u,"iopacity")/100;}else {o=op;} if(l.indexOf('iborder')!=-1) {b = getClassRGBColor(u,"iborder",bd);}else {b=bd;} if(l.indexOf('icolor')!=-1) {c = getClassRGBColor(u,"icolor",co);}else {c=co;} if(l.indexOf('noborder')!=-1) {n = getClassAttribute(u,"noborder");}else {n=nb;} } if(isVM) { for(a=0;a'; }else if(obj.shape.toLowerCase()=='circle') { t += ''; }else { for(j=2;j'; } } canvas.innerHTML = t; }else if(isCV) { if(f<1) {canvas.fading = 0; canvas.style.opacity = 0;} context = canvas.getContext("2d"); for(a=0;a0 && px==ex) {ex -= ox; } oy = self.pageYOffset; if(oy>0 && py==ey) {ey -= oy; } }else if(document.documentElement) { ox = document.documentElement.scrollLeft; oy = document.documentElement.scrollTop; }else if(document.body) { ox = document.body.scrollLeft; oy = document.body.scrollTop; } if(document.body.scrollHeight!=ph||document.body.scrollWidth!=pw) { var o = document.getElementById(i); var t = findPosXY(o); x = t.x; y = t.y; } cx = Math.min(Math.max(ex+ox-x,0),w); cy = Math.min(Math.max(ey+oy-y,0),h); showCoords(n,a,cx,cy,w,h); } function findPosXY(ele) { var t; var d = {x:ele.offsetLeft, y:ele.offsetTop }; if(ele.offsetParent) { t = findPosXY(ele.offsetParent); d.x += t.x; d.y += t.y;} return d; } function roundedRect(ctx,x,y,width,height,radius,nopath){ if (!nopath) ctx.beginPath(); ctx.moveTo(x,y+radius); ctx.lineTo(x,y+height-radius); ctx.quadraticCurveTo(x,y+height,x+radius,y+height); ctx.lineTo(x+width-radius,y+height); ctx.quadraticCurveTo(x+width,y+height,x+width,y+height-radius); ctx.lineTo(x+width,y+radius); ctx.quadraticCurveTo(x+width,y,x+width-radius,y); ctx.lineTo(x+radius,y); ctx.quadraticCurveTo(x,y,x,y+radius); if (!nopath) ctx.closePath(); } function getRadius(radius,width,height){ var part = (Math.min(width,height)/100); radius = Math.max(Math.min(100,radius/part),0); return radius + '%'; } function addMapper() { var themaps = getMaps('mapper'); var image, object, bgrnd, canvas, blind, context, mapid, mname, ele, atr; var classes = '', newClasses = '', func = '', tmp, i, j, o, b, c, d, r, t, n, f, x, y, w, h, pw, ph; for(i=0;i'].join('')); }else {canvas = document.createElement('div');} canvas.id = image.id+'_canvas'; classes = image.className.split(' '); r = getClassValue(classes,"iradius"); o = getClassValue(classes,"iopacity"); b = getClassRGBColor(classes,"iborder",'0000ff'); c = getClassRGBColor(classes,"icolor",'000000'); n = getClassAttribute(classes,"noborder"); f = getClassAttribute(classes,"nofade"); d = getClassAttribute(classes,"showcoords"); o = o==0?0.33:o/100; r = parseInt(Math.min(Math.min(image.width/4,image.height/4),r)); newClasses = getClasses(classes,"mapper"); image.className = newClasses; mname = image.useMap.split("#"); mname = mname[1]; mapid = document.getElementsByName(mname); if(mapid.length>0) { for(j=0;j0) {bgrnd = document.createElement('canvas');}else if(isVM && r>0) { bgrnd = document.createElement([''].join('')); }else {bgrnd = document.createElement('img'); bgrnd.src = image.src;} bgrnd.id = image.id+'_image'; bgrnd.left = 0; bgrnd.top = 0; bgrnd.style.position = 'absolute'; bgrnd.style.height = image.height+'px'; bgrnd.style.width = image.width+'px'; bgrnd.style.left = 0+'px'; bgrnd.style.top = 0+'px'; object.insertBefore(canvas,image); blind = document.createElement('div'); blind.id = mname+'_blind'; blind.className = "blind_area"; blind.left = 0; blind.top = 0; blind.style.position = 'absolute'; blind.style.height = image.height+'px'; blind.style.width = image.width+'px'; blind.style.left = 0+'px'; blind.style.top = 0+'px'; blind.innerHTML = " "; object.insertBefore(blind,image); if(isCV) { context = canvas.getContext("2d"); context.clearRect(0,0,canvas.width,canvas.height); }else if(!isVM && !isCV) {if(isIE) { canvas.style.filter = "Alpha(opacity="+(o*100)+")"; }else { canvas.style.opacity = o; canvas.style.MozOpacity = o; canvas.style.KhtmlOpacity = o;} if(typeof(window['jsGraphics']) !== 'undefined') { jg[i] = new jsGraphics(canvas); isJG = 1; } } object.insertBefore(bgrnd,canvas); if(isCV && r>0) { bgrnd.height = image.height; bgrnd.width = image.width; context = bgrnd.getContext("2d"); context.clearRect(0,0,bgrnd.width,bgrnd.height); roundedRect(context,0,0,bgrnd.width,bgrnd.height,r); context.clip(); context.fillStyle = 'rgba(0,0,0,0)'; context.fillRect(0,0,bgrnd.width,bgrnd.height); context.drawImage(image,0,0,bgrnd.width,bgrnd.height); }else if(isVM && r>0) { bgrnd.height = image.height; bgrnd.width = image.width; r = getRadius(r,bgrnd.width,bgrnd.height); bgrnd.innerHTML = ''; } if(d>0) { ele = document.getElementById(image.id); w = parseInt(image.width); h = parseInt(image.height); t = findPosXY(ele); x = t.x; y = t.y; ph = document.body.scrollHeight; pw = document.body.scrollWidth; if(isVM||isIE) { func = image.onmousemove; if(func!=null) {tmp=String(func); func=tmp.substr(23,tmp.length-25);} image.onmousemove = new Function('getCoords(event,"'+mname+'",0,"'+image.id+'",'+x+','+y+','+w+','+h+','+pw+','+ph+');'+func); }else { func = image.getAttribute("onmousemove"); image.setAttribute("onmousemove","getCoords(event,'"+mname+"',0,'"+image.id+"',"+x+","+y+","+w+","+h+","+pw+","+ph+");"+func); } if(mapid.length>0) { for(j=0;j