mapstats

Subversion Repositories:
[/] [mapstats.js] - Rev 2 Go to most recent revision
Compare with Previous - Blame - Download
// --------------------------------------------------------
// This script made JKLIR as. Unreal][ [http://jklir.net]
// Map originally from Emcee Lam [http://sjsutech.com]
// Licence: GNU/GPL
// (c) 2008 All rights reserved
// --------------------------------------------------------

      var mainMap;
      var magnifier;
      imgon = new Image();
      imgon.src = 'on.png';
      var imgoff = new Image();
      imgoff.src = 'off.png';
      var imginfo = new Image();
      imginfo.src = 'info.png';
      var imgap = new Image();
      imgap.src = 'ap.png';
      var imgcn = new Image();
      imgcn.src = 'client.png';
      var imgsw = new Image();
      imgsw.src = 'switch.png';

      var node = new Array();
      var pozdrav8 = new Array();
      var pomocna = new Array();
      var pomocna1 = new Array();
      var pomocna2 = new Array();
      var pomocna3 = new Array();
      var pomocna4 = new Array();
      var ann;
      var m1;
      var m2;
      var m3;
      var m4;
      var m5;
      var m6;
      var m7;
      var m8;
      var m9;
      var m1_a;
      var m2_a;
      var m3_a;
      var m4_a;
      var m5_a;
      var m6_a;
      var m7_a;
      var m8_a;
      var m9_a;
      var cntm;

      function mapInit(startzoom) {
        magnifier = new Magnifier();
        mainMap = new MainMap(startzoom);

        var miniMapDiv = document.getElementById("miniMapInner");
        miniMapDiv.onmousedown
          = function (event) { return magnifier.startMove(event) };
        miniMapDiv.onmousemove
          = function (event) { return magnifier.processMove(event) };
        miniMapDiv.onmouseup
          = function (event) { return magnifier.stopMove(event) };
        miniMapDiv.ondragstart = function() { return false; } // for IE
      }

      function Magnifier () {
        var this1 = this;
        this.f_dragging = false;
        this.div = document.getElementById("magnifier");
        this.div.ondragstart = function() { return false; }  // for IE
        this.div.onmousedown
          = function (event) { return this1.startMove(event) };
        this.div.onmousemove
          = function (event) { return this1.processMove(event) };
        this.div.onmouseup
          = function (event) { return this1.stopMove(event) };
      }

      Magnifier.prototype.startMove =
        function (event) {
          // for IE
          if (!event)
            event = window.event;
  
          //var magnifierDiv = document.getElementById("magnifier");
          var magnifierDiv = this.div;
          this.dragStartLeft = event.clientX;
          this.dragStartTop  = event.clientY;
          magnifierDiv.style.cursor = "move";
  
          this.top  = magnifierDiv.offsetTop;
          this.left = magnifierDiv.offsetLeft;
  
          this.f_dragging = true;
          return false;
        }

      /* As you drag the mouse in the mini map, the magnifier responds by
         moving. Likewise, the main map will show the current area
         enclosed by the magnifier. */
      Magnifier.prototype.processMove =
        function (event) {
          var magnifierDiv = this.div;
  
          if (!event) event = window.event;  // for IE
          if (this.f_dragging) {
  
            var minX = 0;
            var maxX = magres_x  - magnifierDiv.offsetWidth;
            var minY = 0;
            var maxY = magres_y - magnifierDiv.offsetHeight;
  
            var shiftedLeft = this.left + (event.clientX - this.dragStartLeft);
            if (shiftedLeft < minX) shiftedLeft = minX; // map is not infinite
            if (shiftedLeft > maxX) shiftedLeft = maxX;
            magnifierDiv.style.left = shiftedLeft + "px";
  
            var shiftedTop = this.top + (event.clientY - this.dragStartTop);
            if (shiftedTop < minY) shiftedTop = minY; // map is not infinite
            if (shiftedTop > maxY) shiftedTop = maxY;
            magnifierDiv.style.top = shiftedTop + "px";
  
            mainMap.setViewPort();
          }
        }

      Magnifier.prototype.stopMove =
        function (event) {
          this.div.style.cursor = "";
          this.f_dragging = false;
        }

      Magnifier.prototype.setSize =
        function (innerDivWidth, innerDivHeight) {
          var magnifierWidth = Math.round((magres_x * inres_x) / innerDivWidth) - 2;  // 200 * 700px
            /* We subtract 2 because the borders are 1 pixel each */
          var magnifierHeight = Math.round((magres_y * inres_y) / innerDivHeight) - 2;  // 141 * 500px
            /* We subtract 2 because the borders are 1 pixel each */
          var magnifierDiv = document.getElementById("magnifier");
          magnifierDiv.style.width  = magnifierWidth  + "px";
          magnifierDiv.style.height = magnifierHeight + "px";
        }

      Magnifier.prototype.setPosition =
        function () {
          var innerDiv = document.getElementById("innerDiv");
          var innerDivWidth  = innerDiv.clientWidth;
          var innerDivHeight = innerDiv.clientHeight;
          var innerDivLeft   = innerDiv.offsetLeft;
          var innerDivTop    = innerDiv.offsetTop;
          this.left
            = Math.round(Math.abs(innerDivLeft) * magres_x / innerDivWidth);
          this.top
            = Math.round(Math.abs(innerDivTop) * magres_y / innerDivHeight);

          // alter magnifier
          var magnifierDiv = this.div;
          magnifierDiv.style.left = this.left + "px";
          magnifierDiv.style.top  = this.top  + "px";
        }

      function MainMap (zoomfirst) {
        var this1 = this;

        // constants
        // view port is the visible portion of the main map
        this.viewPortWidth  = inres_x; //500
        this.viewPortHeight = inres_y; //400

        this.tileSize = 256;
        this.f_dragging = false;
        this.innerDiv = document.getElementById("innerDiv");

        var outerDiv = document.getElementById("outerDiv");
        this.outerDiv = outerDiv;
        outerDiv.style.width = inres_x + "px";
        outerDiv.style.height = inres_y + "px";
        var underMap = document.getElementById("underMap");
        underMap.style.width = (inres_x - 4) + "px";

        outerDiv.onmousedown
          = function(event) { return this1.startMove(event) };
        outerDiv.onmousemove
          = function(event) { return this1.processMove(event) };
        outerDiv.onmouseup
          = function(event) { return this1.stopMove(event) };
        outerDiv.ondblclick
          = function(event) { return this1.doubleClick() };
        outerDiv.ondragstart = function() { return false; }  // for IE

        var zf = 0;
        if(zoomfirst==eq_mini) { zf = 0; }
        if(zoomfirst==eq_medi) { zf = 1; }
        if(zoomfirst==eq_high) { zf = 2; }
        if(zoomfirst==eq_orig) { zf = 3; }

        this.zoom = zf;
        this.zoomDim = [
            {
              width:parseInt(full_x * eq_mini),
              height:parseInt(full_y * eq_mini),
              size:1
            },
            {
              width:parseInt(full_x * eq_medi),
              height:parseInt(full_y * eq_medi),
              size:2
            },
            {
              width:parseInt(full_x * eq_high),
              height:parseInt(full_y * eq_high),
              size:3
            },
            {
              width:parseInt(full_x * eq_orig),
              height:parseInt(full_y * eq_orig),
              size:4
            },
        ]

        var zoomElt = this.zoomDim[this.zoom];
        this.setInnerDivSize (zoomElt.width, zoomElt.height, zoomElt.size, (parseInt(start_mul*1000)/10));

        var innerDiv = document.getElementById("innerDiv");
        innerDiv.style.left = -(start_left) + "px";
        innerDiv.style.top = -(start_top) + "px";

        magnifier.setPosition();
        this.checkTiles();
      }

      MainMap.prototype.startMove =
        function (event) {
          // for IE
          if (!event) event = window.event;
  
          this.dragStartLeft = event.clientX;
          this.dragStartTop  = event.clientY;
          var innerDiv = this.innerDiv;
          innerDiv.style.cursor = "move";
  
          this.top  = innerDiv.offsetTop;
          this.left = innerDiv.offsetLeft;
  
          this.f_dragging = true;
          return false;
        }

      MainMap.prototype.processMove =
        function (event) {
          var zoomElt = this.zoomDim[this.zoom];
          var maxY = 0;
          var minY = -(zoomElt.height - this.viewPortHeight);
          var maxX = 0;
          var minX = -(zoomElt.width  - this.viewPortWidth);
  
          if (!event) event = window.event;  // for IE
          var innerDiv = this.innerDiv;
          if (this.f_dragging) {
            var shiftedTop = this.top + (event.clientY - this.dragStartTop);
            if (shiftedTop > maxY) shiftedTop = maxY;  // map is not infinite
            if (shiftedTop < minY) shiftedTop = minY;
            innerDiv.style.top = shiftedTop + "px";
  
            var shiftedLeft = this.left + (event.clientX - this.dragStartLeft);
            if (shiftedLeft > maxX) shiftedLeft = maxX; // map is not infinite
            if (shiftedLeft < minX) shiftedLeft = minX;
            innerDiv.style.left = shiftedLeft + "px";
  
            this.checkTiles();
            magnifier.setPosition();
          }

          var nasobek;
          var konst = 0;
          if(this.zoom==0) { nasobek = eq_mini; }
          if(this.zoom==1) { nasobek = eq_medi; }
          if(this.zoom==2) { nasobek = eq_high; }
          if(this.zoom==3) { nasobek = eq_orig; }
          if (navigator.appName=="Microsoft Internet Explorer") { konst = -2; }
          var outerDiv = document.getElementById("outerDiv");
          var infoDiv = document.getElementById("infoDiv");
          infoDiv.innerHTML = parseInt((Math.abs(parseInt(innerDiv.style.left)) + event.clientX - outerDiv.offsetLeft + konst)/nasobek) + " x " + parseInt((Math.abs(parseInt(innerDiv.style.top)) + event.clientY - outerDiv.offsetTop + konst)/nasobek);
        }

      MainMap.prototype.checkZoom =
        function () {
          var zoomElt = this.zoomDim[this.zoom];
          var maxY = 0;
          var minY = -(zoomElt.height - this.viewPortHeight);
          var maxX = 0;
          var minX = -(zoomElt.width  - this.viewPortWidth);
          var chcky = 0;
          var chckx = 0;
  
          var innerDiv = this.innerDiv;
            var shiftedTop = innerDiv.offsetTop;
            if (shiftedTop > maxY) { shiftedTop = maxY; chcky = 1; } // map is not infinite
            if (shiftedTop < minY) { shiftedTop = minY; chcky = 1; }
            if (chcky == 1) innerDiv.style.top = shiftedTop + "px";
  
            var shiftedLeft = innerDiv.offsetLeft;
            if (shiftedLeft > maxX) { shiftedLeft = maxX; chckx = 1; }// map is not infinite
            if (shiftedLeft < minX) { shiftedLeft = minX; chckx = 1; }
            if (chcky == 1) innerDiv.style.left = shiftedLeft + "px";

            magnifier.setPosition();
        }

      MainMap.prototype.checkTiles =
        function () {
          var innerDiv = this.innerDiv;
          var tileSize = this.tileSize;
          var visibleTiles = this.getVisibleTiles();
          var visibleTilesMap = {};
          var i;
  
          var size = this.zoomDim[this.zoom].size;
          for (i=0;i<visibleTiles.length; i++) {
            var tile = visibleTiles[i];
            var xy = "x" + tile.x + "y" + tile.y;
            var tileName
              =  xy + "z" + this.zoom;
            visibleTilesMap[tileName] = true;
            var img = document.getElementById (tileName);
            if (!img) {
              img = document.createElement("img");
              img.src 
                = "size" + size + "/" + xy + ".jpg";
              img.style.position = "absolute";
              img.style.left = (tile.x * tileSize) + "px";
              img.style.top = (tile.y * tileSize) + "px";
              img.setAttribute("id", tileName);
              img.setAttribute("galleryimg", "no");
              innerDiv.appendChild(img);
            }
          }
  
          var imgs = innerDiv.getElementsByTagName("img");
          for (i = 0; i < imgs.length; i++) {
            var id = imgs[i].getAttribute("id");
            if (!visibleTilesMap[id]) {
              innerDiv.removeChild(imgs[i]);
              i--;
            }
          }
        }

      MainMap.prototype.getVisibleTiles =
        function () {
          var innerDiv = this.innerDiv;
          var mapX = innerDiv.offsetLeft;
          var mapY = innerDiv.offsetTop;
          var tileSize = this.tileSize;
  
          var startX = Math.abs(Math.floor(mapX / tileSize)) - 1;
          if (startX < 0) startX = 0;
          var startY = Math.abs(Math.floor(mapY / tileSize)) - 1;
          if (startY < 0) startY = 0;
          var tilesX = Math.ceil(this.viewPortWidth / tileSize) + 1;
          var tilesY = Math.ceil(this.viewPortHeight / tileSize) + 1;
  
          var visibleTiles = [];
          var counter = 0;
          for (x = startX; x < (tilesX + startX); x++) {
            for (y = startY; y < (tilesY + startY); y++) {
              var tile = {};
              tile.x = x;
              tile.y = y;
              visibleTiles[counter++] = tile;
            }
          }
          return visibleTiles;
        }

      MainMap.prototype.stopMove =
        function (event) {
          this.innerDiv.style.cursor = "";
          this.f_dragging = false;
        }

      // movement in the magnifier moves main map's view port
      MainMap.prototype.setViewPort =
        function () {
          var magDiv   = document.getElementById("magnifier");
          var innerDiv = this.innerDiv;
          var magLeft        = magDiv.offsetLeft;
          var magTop         = magDiv.offsetTop;
          var innerDivWidth  = innerDiv.clientWidth;
          var innerDivHeight = innerDiv.clientHeight;
  
          /* set innerDivLeft */
          var innerDivLeftMin = inres_x - innerDivWidth;  //500
          var innerDivLeft
            = Math.round((-magLeft) * innerDivWidth  / magres_x);
          if (innerDivLeft < innerDivLeftMin) innerDivLeft = innerDivLeftMin;
          innerDiv.style.left = innerDivLeft + "px";

          /* set innerDivTop */
          var innerDivTopMin = inres_y - innerDivHeight; //400
          var innerDivTop
            = Math.round((-magTop)  * innerDivHeight / magres_y);
          if (innerDivTop < innerDivTopMin) innerDivTop = innerDivTopMin;
          innerDiv.style.top  = innerDivTop  + "px";
  
          this.checkTiles();
        }

      MainMap.prototype.setInnerDivSize =
        function (width, height, size, percent) {
          var innerDiv = this.innerDiv;
          innerDiv.style.width  = width  + "px";
          innerDiv.style.height = height + "px";
          magnifier.setPosition();
          magnifier.setSize (width, height);

          var resolutionInfo = document.getElementById("resolutionInfo");
          resolutionInfo.innerHTML = percent + "%, " +  width + " x " + height + "px";
        }

      MainMap.prototype.setZoom =
        function (newZoom) {
          if (this.zoom == newZoom) return;
          var oldZ = this.zoomDim[this.zoom];
          var newZ = this.zoomDim[newZoom];
          var innerDiv = this.innerDiv;
          var imgs = innerDiv.getElementsByTagName("img");
          while (imgs.length > 0) {
            innerDiv.removeChild(imgs[0]);
          }

          var oldLeft   = innerDiv.offsetLeft;
          var oldTop    = innerDiv.offsetTop;
          var wdth = Math.round(((magres_x * inres_x) / newZ.width) - 2);  // 200 * 700px
          var hght = Math.round(((magres_y * inres_y) / newZ.height) - 2);  // 141 * 500px
          var wdth2 = Math.round(((magres_x * inres_x) / oldZ.width) - 2);  // 200 * 700px
          var hght2 = Math.round(((magres_y * inres_y) / oldZ.height) - 2);  // 141 * 500px

          var newLeft = Math.round(newZ.width  * oldLeft / oldZ.width);
          var newTop  = Math.round(newZ.height * oldTop  / oldZ.height);

          if (this.zoom < newZoom) {
                  newLeft = Math.round(newLeft + ((wdth-wdth2)*4));
                  newTop = Math.round(newTop + ((hght-hght2)*4));
          }
          if (this.zoom > newZoom) {
                  newLeft = Math.round(newLeft + ((wdth-wdth2)*4));
                  newTop = Math.round(newTop + ((hght-hght2)*4));
          }

          innerDiv.style.left = newLeft + "px";
          innerDiv.style.top = newTop + "px";
          this.zoom = newZoom;  // set the global zoom
          var nasobek;
          if(this.zoom==0) { nasobek = eq_mini; }
          if(this.zoom==1) { nasobek = eq_medi; }
          if(this.zoom==2) { nasobek = eq_high; }
          if(this.zoom==3) { nasobek = eq_orig; }
          this.setInnerDivSize(newZ.width, newZ.height, newZ.size, (parseInt(nasobek*1000)/10));

          this.checkZoom();
          this.checkTiles();

          titulek1 = document.getElementById("mapstats_infopoint");
          titulek1.innerHTML = "";
          titulek2 = document.getElementById("mapstats_name");
          titulek2.innerHTML = "";
          titulek3 = document.getElementById("mapstats_ip");
          titulek3.innerHTML = "";
          titulek4 = document.getElementById("mapstats_status");
          titulek4.innerHTML = "";
          titulek5 = document.getElementById("mapstats_legend");
          titulek5.innerHTML = "";

          canvasInit(nasobek);

        }

      MainMap.prototype.doubleClick =
        function () {
          if (this.zoom == 3) return;

          var stara = this.zoom;
          stara = stara + 1;
          this.setZoom(stara);

        }

        function canvasInit(nasobek) {

                var canvas_id1 = document.getElementById("paint");
                canvas_id1.width = parseInt(full_x*nasobek);
                canvas_id1.height = parseInt(full_y*nasobek);

                var canvas_id2 = document.getElementById("paint2");
                canvas_id2.width = parseInt(full_x*nasobek);
                canvas_id2.height = parseInt(full_y*nasobek);

                ann = nasobek;
                var pozdrav = new Array();
                var pozdrav1 = new Array();
                var pozdrav2 = new Array();
                var pozdr = new Array();
                pozdrav = pomocna.split('\n');
                pozdrav1 = pomocna1.split('\n');
                var a_cnt = 0;

                for(a=0;a<pozdrav.length;a++){
                 if(pozdrav[a]!="") {
                   node[a] = new Array();
                   pozdrav2 = pozdrav[a].split(';');
                   for(b=0;b<pozdrav2.length;b++){
                        node[a][b] = pozdrav2[b];
                   }
                   a_cnt++;
                 }
                }
                for(e=0;e<pozdrav1.length;e++) {
                 if(pozdrav1[e]!="") {
                   node[(e+a_cnt)] = new Array();
                   pozdr = pozdrav1[e].split(';');
                   for(f=0;f<pozdr.length;f++){
                        node[(e+a_cnt)][f] = pozdr[f];
                   }
                 }
                }

                var pozdrav3 = new Array();
                var pozdrav4 = new Array();
                var size;
                var clrlnk;
                m1 = 0;
                m2 = 0;
                m3 = 0;
                m4 = 0;
                m5 = 0;
                m6 = 0;
                m7 = 0;
                m8 = 0;
                m9 = 0;
                m1_a = 0;
                m2_a = 0;
                m3_a = 0;
                m4_a = 0;
                m5_a = 0;
                m6_a = 0;
                m7_a = 0;
                m8_a = 0;
                m9_a = 0;
                cntm = 0;

                if(pomocna2.length>0) {
                pozdrav3 = pomocna2.split('\n');
                for(a=0;a<pozdrav3.length;a++){
                 if(pozdrav3[a]!="") {
                   pozdrav4 = pozdrav3[a].split(';');
                   if(pozdrav4[1].toLowerCase()=="backbone") { size = 4.5; } else { size = 3; }
                   if(pozdrav4[2].toLowerCase()=="inp") {
                        if(pozdrav4[3]==1) { clrlnk = wifi_client_a; m1_a = 1; }
                        else if(pozdrav4[3]==2) { clrlnk = wifi_backbone_a; m2_a = 1; }
                        else if(pozdrav4[3]==3) { clrlnk = eth_100_a; m3_a = 1; }
                        else if(pozdrav4[3]==4) { clrlnk = fso_a; m4_a = 1; }
                        else if(pozdrav4[3]==5) { clrlnk = fso_backup_a; m5_a = 1; }
                        else if(pozdrav4[3]==6) { clrlnk = ghz5_a; m6_a = 1; }
                        else if(pozdrav4[3]==7) { clrlnk = ghz10_a; m7_a = 1; }
                        else if(pozdrav4[3]==8) { clrlnk = fiber_a; m8_a = 1; }
                        else { clrlnk = other_a; m9_a = 1; }
                   } else {
                        if(pozdrav4[3]==1) { clrlnk = wifi_client; m1 = 1; }
                        else if(pozdrav4[3]==2) { clrlnk = wifi_backbone; m2 = 1; }
                        else if(pozdrav4[3]==3) { clrlnk = eth_100; m3 = 1; }
                        else if(pozdrav4[3]==4) { clrlnk = fso; m4 = 1; }
                        else if(pozdrav4[3]==5) { clrlnk = fso_backup; m5 = 1; }
                        else if(pozdrav4[3]==6) { clrlnk = ghz5; m6 = 1; }
                        else if(pozdrav4[3]==7) { clrlnk = ghz10; m7 = 1; }
                        else if(pozdrav4[3]==8) { clrlnk = fiber; m8 = 1; }
                        else { clrlnk = other; m9 = 1; }
                   }

                   // Vykreslime si nase linky
                   if(pozdrav4[2].toLowerCase()=="inp") {
                    if(ch_inp) {
                        drawINPLink(pozdrav4[0], size-1, nasobek, clrlnk);
                    }
                   } else {
                    if((ch_backbone) && (size==4.5)) {
                        drawLink(pozdrav4[0], size, nasobek, clrlnk);
                    }
                    if((ch_client) && (size==3)) {
                        drawLink(pozdrav4[0], size, nasobek, clrlnk);
                    }
                   }
                 }
                }
                }

                cntm = m1 + m2 + m3 + m4 + m5 + m6 + m7 + m8 + m9 + m1_a + m2_a + m3_a + m4_a + m5_a + m6_a + m7_a + m8_a + m9_a;

                var pozdrav5 = new Array();
                var pozdrav6 = new Array();
                if(ch_infopoint) {
                  if(pomocna3.length>0) {
                  pozdrav5 = pomocna3.split('\n');
                  for(d=0;d<pozdrav5.length;d++) {
                   if(pozdrav5[d]!="") {
                     pozdrav6 = pozdrav5[d].split(';');
                     // Vykreslime si infopointy
                     if(ch_name) {
                       drawInfo(pozdrav6[0],pozdrav6[1],pozdrav6[2],nasobek);
                     }
                       drawInfoPoint(pozdrav6[1],pozdrav6[2],nasobek);
                   }
                  }
                  }
                }

                for(e=0;e<pozdrav1.length;e++) {
                 if(pozdrav1[e]!="") {
                 if(ch_noping) {
                 if(node[(a_cnt+e)][3]==1) {
                    drawClient(node[(a_cnt+e)][1],node[(a_cnt+e)][2],nasobek);
                    if(ch_name) {
                       drawName(node[(a_cnt+e)][0],(node[(a_cnt+e)][1])-1,(node[(a_cnt+e)][2])-1,nasobek)
                    }
                 }
                 if(node[(a_cnt+e)][3]==2) {
                    drawSwitch(node[(a_cnt+e)][1],node[(a_cnt+e)][2],nasobek);
                 }
                 }
                 }
                }

                var pozdrav7 = new Array();
                pozdrav7 = pomocna4.split('\n');
                var clrpnt;
                var x_pos;
                var y_pos;
                var name_pos;
                var title_pos;

                for(c=0;c<pozdrav7.length;c++){
                 if(pozdrav7[c]!="") {
                   pozdrav8 = pozdrav7[c].split(';');
                   if(pozdrav8[1]==1) { clrpnt = imgon; pozdrav8[2] = pozdrav8[2] + ' ms'; } else { clrpnt = imgoff; pozdrav8[2] = "offline"; }
                   if(pozdrav8[0]!=node[c][4]) { x_pos = ip2sour(pozdrav8[0],1); y_pos = ip2sour(pozdrav8[0],2); name_pos = ip2sour(pozdrav8[0],0); title_pos = ip2sour(pozdrav8[0],3); } else { x_pos = node[c][1]; y_pos = node[c][2]; name_pos = node[c][0]; title_pos = node[c][3]; }  // check if the result doesnt replaced

                   if(title_pos.toLowerCase()=="ap") {
                    if(ch_ap) {
                        drawAP(x_pos,y_pos,nasobek);
                        drawNode(x_pos,y_pos,nasobek,clrpnt);
                     if(ch_name) {
                        drawName(name_pos,x_pos,y_pos,nasobek);
                     }
                     if((ch_ip) && (ch_status)) {
                        drawStatus(pozdrav8[2],x_pos,y_pos,nasobek);
                        drawIP(pozdrav8[0],x_pos,y_pos,nasobek);
                     } else if((!ch_ip) && (ch_status)) {
                        drawStatus(pozdrav8[2],x_pos,y_pos-parseInt(12/nasobek),nasobek);
                     } else if((ch_ip) && (!ch_status)) {
                        drawIP(pozdrav8[0],x_pos,y_pos,nasobek);
                     }
                    }
                   } else if(title_pos.toLowerCase()=="router") {
                     if(ch_router) {
                        drawNode(x_pos,y_pos,nasobek,clrpnt);
                      if(ch_name) {
                        drawName(name_pos,x_pos,y_pos,nasobek);
                      }
                      if(ch_status) {
                        drawStatus(pozdrav8[2],x_pos,y_pos-parseInt(12/nasobek),nasobek);
                      }
                     }
                   } else {
                     if(ch_node) {
                        drawNode(x_pos,y_pos,nasobek,clrpnt);
                      if(ch_name) {
                        drawName(name_pos,x_pos,y_pos,nasobek);
                      }
                     }
                   }
                 }
                }

                var legend = document.getElementById('legend');
                if((ch_legend) && (cntm>0)) {
                        drawLegend();
                        legend.style.display = "block";
                } else {
                        legend.style.display = "none";
                }

        }

        function drawLink(pos, size, nas, color) {
                var ctx = document.getElementById('paint').getContext('2d');
                var points = new Array();
                var posxy = new Array();
                var coordinates = new Array();
                points = pos.split('#');
                var reg=/(\d+)&(\d+)/;
                for(i=0;i<points.length;i++){
                   if (reg.test(points[i])) {
                        posxy = points[i].split('&');
                        coordinates[i*2] = parseInt(posxy[0]*nas); // checkni to....
                        coordinates[i*2+1] = parseInt(posxy[1]*nas);
                   } else {
                        coordinates[i*2] = parseInt(node2sour(points[i],1)*nas);
                        coordinates[i*2+1] = parseInt(node2sour(points[i],2)*nas);
                   }
                }

                ctx.lineJoin = "round";
                ctx.strokeStyle = "rgb(20, 20, 20)";
                ctx.lineWidth = size+1;
                ctx.beginPath();
                ctx.moveTo(coordinates[0],coordinates[1]);
                for(i=2;i<coordinates.length;i+=2){
                        ctx.lineTo(coordinates[i],coordinates[i+1]);
                }
                ctx.stroke();

                ctx.lineJoin = "round";
                ctx.strokeStyle = "rgb(0, 0, 0)";
                ctx.lineWidth = size;
                ctx.beginPath();
                ctx.moveTo(coordinates[0],coordinates[1]);
                for(i=2;i<coordinates.length;i+=2){
                        ctx.lineTo(coordinates[i],coordinates[i+1]);
                }
                ctx.stroke();

                ctx.lineJoin = "round";
                ctx.strokeStyle = color;
                ctx.lineWidth = size-1;
                ctx.beginPath();
                ctx.moveTo(coordinates[0],coordinates[1]);
                for(i=2;i<coordinates.length;i+=2){
                        ctx.lineTo(coordinates[i],coordinates[i+1]);
                }
                ctx.stroke();
        }

        function drawINPLink(pos, size, nas, color) {
                var ctx = document.getElementById('paint').getContext('2d');
                var points = new Array();
                var posxy = new Array();
                var coordinates = new Array();
                points = pos.split('#');
                var reg=/(\d+)&(\d+)/;
                for(i=0;i<points.length;i++){
                   if (reg.test(points[i])) {
                        posxy = points[i].split('&');
                        coordinates[i*2] = parseInt(posxy[0]*nas);
                        coordinates[i*2+1] = parseInt(posxy[1]*nas);
                   } else {
                        coordinates[i*2] = parseInt(node2sour(points[i],1)*nas);
                        coordinates[i*2+1] = parseInt(node2sour(points[i],2)*nas);
                   }
                }

                ctx.lineJoin = "round";
                ctx.strokeStyle = "rgba(0, 0, 0, 0.1)";
                ctx.lineWidth = size+1.5;
                ctx.beginPath();
                ctx.moveTo(coordinates[0],coordinates[1]);
                for(i=2;i<coordinates.length;i+=2){
                        ctx.lineTo(coordinates[i],coordinates[i+1]);
                }
                ctx.stroke();

                ctx.lineJoin = "round";
                ctx.strokeStyle = color;
                ctx.lineWidth = size+0.5;
                ctx.beginPath();
                ctx.moveTo(coordinates[0],coordinates[1]);
                for(i=2;i<coordinates.length;i+=2){
                        ctx.lineTo(coordinates[i],coordinates[i+1]);
                }
                ctx.stroke();
        }

        function drawNode(xo, yo, nas, img) {
                var ctx = document.getElementById('paint2').getContext('2d');
                ctx.drawImage(img,parseInt((xo*nas)-7),parseInt((yo*nas)-7));
        }

        function drawAP(xn, yn, nas) {
                var ctx = document.getElementById('paint').getContext('2d');
                ctx.drawImage(imgap,parseInt((xn*nas)-31),parseInt((yn*nas)-17));
        }

        function drawClient(xc, yc, nas) {
                var ctx = document.getElementById('paint').getContext('2d');
                ctx.drawImage(imgcn,parseInt((xc*nas)-7),parseInt((yc*nas)-7));
        }

        function drawSwitch(xs, ys, nas) {
                var ctx = document.getElementById('paint').getContext('2d');
                ctx.drawImage(imgsw,parseInt((xs*nas)-6),parseInt((ys*nas)-6));
        }

        function drawInfoPoint(xl, yl, nas) {
                var ctx = document.getElementById('paint').getContext('2d');
                ctx.drawImage(imginfo,parseInt((xl*nas)-7),parseInt((yl*nas)-7));
        }

        function drawLegend() {
                var epsilon;
                var cislo = 0;
                var name = "";
                var paintlegend = document.getElementById('paintlegend');
                paintlegend.height = (((cntm-1) * 12)+13);
                paintlegend.width = "25";
                var ctx = paintlegend.getContext('2d');
                ctx.clearRect(0,0,25,((cntm-1) * 12)+13);
                if(m1==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,wifi_client,3); name = name + name1 + "<br/>"; cislo++; }
                if(m2==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,wifi_backbone,4.5); name = name + name2 + "<br/>"; cislo++; }
                if(m3==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,eth_100,4.5); name = name + name3 + "<br/>"; cislo++; }
                if(m4==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,fso,4.5); name = name + name4 + "<br/>"; cislo++; }
                if(m5==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,fso_backup,4.5); name = name + name5 + "<br/>"; cislo++; }
                if(m6==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,ghz5,4.5); name = name + name6 + "<br/>"; cislo++; }
                if(m7==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,ghz10,4.5); name = name + name7 + "<br/>"; cislo++; }
                if(m8==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,fiber,4.5); name = name + name8 + "<br/>"; cislo++; }
                if(m9==1) { epsilon = ((cislo*12)+5); drawLegendLink(epsilon,other,4.5); name = name + name9 + "<br/>"; cislo++; }
                if(m1_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,wifi_client_a,3); name = name + name1 + " " + inp + "<br/>"; cislo++; }
                if(m2_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,wifi_backbone_a,4.5); name = name + name2 + " " + inp + "<br/>"; cislo++; }
                if(m3_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,eth_100_a,4.5); name = name + name3 + " " + inp + "<br/>"; cislo++; }
                if(m4_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,fso_a,4.5); name = name + name4 + " " + inp + "<br/>"; cislo++; }
                if(m5_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,fso_backup_a,4.5); name = name + name5 + " " + inp + "<br/>"; cislo++; }
                if(m6_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,ghz5_a,4.5); name = name + name6 + " " + inp + "<br/>"; cislo++; }
                if(m7_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,ghz10_a,4.5); name = name + name7 + " " + inp + "<br/>"; cislo++; }
                if(m8_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,fiber_a,4.5); name = name + name8 + " " + inp + "<br/>"; cislo++; }
                if(m9_a==1) { epsilon = ((cislo*12)+5); drawLegendINPLink(epsilon,other_a,4.5); name = name + name9 + " " + inp + "<br/>"; }
                drawLegendText(name);
        }

        function drawLegendLink(yg,color,size) {
                var ctx = document.getElementById('paintlegend').getContext('2d');
                ctx.strokeStyle = "rgb(20, 20, 20)";
                ctx.lineWidth = size+1;
                ctx.beginPath();
                ctx.moveTo(1,yg);
                ctx.lineTo(24,yg);
                ctx.stroke();

                ctx.strokeStyle = "rgb(0, 0, 0)";
                ctx.lineWidth = size;
                ctx.beginPath();
                ctx.moveTo(1,yg);
                ctx.lineTo(24,yg);
                ctx.stroke();

                ctx.strokeStyle = color;
                ctx.lineWidth = size-1;
                ctx.beginPath();
                ctx.moveTo(1,yg);
                ctx.lineTo(24,yg);
                ctx.stroke();

        }

        function drawLegendINPLink(yg,color,size) {
                var ctx = document.getElementById('paintlegend').getContext('2d');
                ctx.strokeStyle = "rgba(0, 0, 0, 0.1)";
                ctx.lineWidth = size;
                ctx.beginPath();
                ctx.moveTo(1,yg);
                ctx.lineTo(24,yg);
                ctx.stroke();

                ctx.strokeStyle = color;
                ctx.lineWidth = size-0.5;
                ctx.beginPath();
                ctx.moveTo(1,yg);
                ctx.lineTo(24,yg);
                ctx.stroke();
        }

        function clearMap(ann) {
                var ctx = document.getElementById('paint').getContext('2d');
                ctx.clearRect(0,0,parseInt(full_x * ann),parseInt(full_y * ann));
                var ctx2 = document.getElementById('paint2').getContext('2d');
                ctx2.clearRect(0,0,parseInt(full_x * ann),parseInt(full_y * ann));
        }

        function node2sour(name, pos) {
                var ok = 0;
                for(k=0;k<node.length;k++){
                   if(node[k][0]==name) {
                        ok = node[k][pos];
                   }
                   if(ok!=0) { return ok; }
                }
                return ok;
        }

        function ip2sour(ip, pos) {
                var ok = 0;
                for(k=0;k<node.length;k++){
                   if(node[k][4]==ip) {
                        ok = node[k][pos];
                   }
                   if(ok!=0) { return ok; }
                }
                return ok;
        }

        function nactiSoubory() {
                pomocna = getFile(nodes);
                pomocna1 = getFile(noping);
                pomocna2 = getFile(links);
                pomocna3 = getFile(infopoints);
                pomocna4 = getFile(state);
                redrawUpdate();
        }

        function getFile(url) {
                AJAX = (window.XMLHttpRequest ? new XMLHttpRequest() : (window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : false));
                if (AJAX) {
                   AJAX.open("GET", url, false);
                   AJAX.send(null);
                   return AJAX.responseText;                                         
                } else {
                   return false;
                }                                             
        }

        function timerMe() {
                // auto-downloading source files every 2 minutes
                setInterval("nactiSoubory()", 2 * 60 * 1000);
        }

        function nastavCheck() {
                document.form_map.ch_ap.checked = ch_ap;
                document.form_map.ch_router.checked = ch_router;
                document.form_map.ch_node.checked = ch_node;
                document.form_map.ch_infopoint.checked = ch_infopoint;
                document.form_map.ch_noping.checked = ch_noping;
                document.form_map.ch_legend.checked = ch_legend;
                document.form_map.ch_name.checked = ch_name;
                document.form_map.ch_ip.checked = ch_ip;
                document.form_map.ch_status.checked = ch_status;
                document.form_map.ch_backbone.checked = ch_backbone;
                document.form_map.ch_client.checked = ch_client;
                document.form_map.ch_inp.checked = ch_inp;
        }

        function reDraw() {
                if(document.form_map.ch_ap.checked) { ch_ap = true; } else { ch_ap = false; }
                if(document.form_map.ch_router.checked) { ch_router = true; } else { ch_router = false; }
                if(document.form_map.ch_node.checked) { ch_node = true; } else { ch_node = false; }
                if(document.form_map.ch_infopoint.checked) { ch_infopoint = true; } else { ch_infopoint = false; }
                if(document.form_map.ch_noping.checked) { ch_noping = true; } else { ch_noping = false; }
                if(document.form_map.ch_legend.checked) { ch_legend = true; } else { ch_legend = false; }
                if(document.form_map.ch_name.checked) { ch_name = true; } else { ch_name = false; }
                if(document.form_map.ch_ip.checked) { ch_ip = true; } else { ch_ip = false; }
                if(document.form_map.ch_status.checked) { ch_status = true; } else { ch_status = false; }
                if(document.form_map.ch_backbone.checked) { ch_backbone = true; } else { ch_backbone = false; }
                if(document.form_map.ch_client.checked) { ch_client = true; } else { ch_client = false; }
                if(document.form_map.ch_inp.checked) { ch_inp = true; } else { ch_inp = false; }
                titulek1 = document.getElementById("mapstats_infopoint");
                titulek1.innerHTML = "";
                titulek2 = document.getElementById("mapstats_name");
                titulek2.innerHTML = "";
                titulek3 = document.getElementById("mapstats_ip");
                titulek3.innerHTML = "";
                titulek4 = document.getElementById("mapstats_status");
                titulek4.innerHTML = "";
                titulek5 = document.getElementById("mapstats_legend");
                titulek5.innerHTML = "";
                clearMap(ann);
                canvasInit(ann);
        }

        function drawInfo(txt, xa, ya, nas) {
                xa = parseInt((xa*nas)+6);
                ya = parseInt((ya*nas)-13);
                var text = '<div style="position:absolute;white-space:nowrap;letter-spacing: 1px;left:' + xa + 'px;top:' + ya + 'px;font-family: arial;font-size: 9px;background-color: #000000;color: #ffffff;padding-left: 3px;padding-right: 2px;cursor: default;" unselectable = "on">' + txt + '</div>';

                titulek = document.getElementById("mapstats_infopoint");
                titulek.innerHTML = titulek.innerHTML + text;
        }

        function drawName(txt, xa, ya, nas) {
                xa = parseInt((xa*nas)+6);
                ya = parseInt((ya*nas)-13);
                var text = '<div style="position:absolute;white-space:nowrap;letter-spacing: 1px;left:' + xa + 'px;top:' + ya + 'px;font-family: arial;font-size: 9px;background-color: #000000;color: #ffffff;padding-left: 3px;padding-right: 2px;cursor: default;" unselectable = "on">' + txt + '</div>';

                titulek = document.getElementById("mapstats_name");
                titulek.innerHTML = titulek.innerHTML + text;
        }

        function drawIP(txt, xb, yb, nas) {
                xb = parseInt((xb*nas)+6);
                yb = parseInt((yb*nas)-1);
                var text = '<div style="position:absolute;white-space:nowrap;letter-spacing: 1px;left:' + xb + 'px;top:' + yb + 'px;font-family: arial;font-size: 9px;background-color: #000000;color: #ffffff;padding-left: 3px;padding-right: 2px;cursor: default;" unselectable = "on">' + txt + '</div>';

                titulek = document.getElementById("mapstats_ip");
                titulek.innerHTML = titulek.innerHTML + text;
        }

        function drawStatus(txt, xc, yc, nas) {
                xc = parseInt((xc*nas)+6);
                yc = parseInt((yc*nas)+11);
                var text = '<div style="position:absolute;white-space:nowrap;letter-spacing: 1px;left:' + xc + 'px;top:' + yc + 'px;font-family: arial;font-size: 9px;background-color: #000000;color: #ffffff;padding-left: 3px;padding-right: 2px;cursor: default;" unselectable = "on">' + txt + '</div>';

                titulek = document.getElementById("mapstats_status");
                titulek.innerHTML = titulek.innerHTML + text;
        }

        function drawLegendText(txt) {
                var text = '<div style="position:relative;white-space:nowrap;letter-spacing: 1px;font-family: arial;font-size: 9px;color: black;padding-left: 3px;padding-right: 2px;cursor: default;" unselectable = "on">' + txt + '</div>';

                titulek = document.getElementById("mapstats_legend");
                titulek.innerHTML = text;
        }

        function changeOpacity(opc) {
                var opcprc = opc / 100;
                var mapstats_update = document.getElementById("mapstats_update");

                if (navigator.appName=="Microsoft Internet Explorer") {
                   mapstats_update.style.filter = 'alpha(opacity=' + opc + ');';
                } else {
                   mapstats_update.style.setProperty("-moz-opacity",opcprc,null);
                   mapstats_update.style.setProperty("opacity",opcprc,null);
                }
        }

        function changeUpdate() {
                var promenna = new Date();
                var rok = promenna.getFullYear();
                var mesic = "" + (promenna.getMonth() + 1);
                var den = "" + (promenna.getDate());
                var hodin = "" + (promenna.getHours());
                var minut = "" + (promenna.getMinutes());
                var sekund = "" + (promenna.getSeconds());
                if(mesic.length==1) { mesic = "0" + mesic; }
                if(den.length==1) { den = "0" + den; }
                if(hodin.length==1) { hodin = "0" + hodin; }
                if(minut.length==1) { minut = "0" + minut; }
                if(sekund.length==1) { sekund = "0" + sekund; }
                var mapstats_update = document.getElementById("mapstats_update");
                mapstats_update.innerHTML = den + ". " + mesic + ". " + rok + " " + hodin + ":" + minut + ":" + sekund;
        }

        function redrawUpdate() {
                setTimeout("changeOpacity(90)",100);
                setTimeout("changeOpacity(80)",200);
                setTimeout("changeOpacity(70)",300);
                setTimeout("changeOpacity(60)",400);
                setTimeout("changeOpacity(50)",500);
                setTimeout("changeOpacity(40)",600);
                setTimeout("changeOpacity(30)",700);
                setTimeout("changeOpacity(20)",800);
                setTimeout("changeOpacity(10)",900);
                setTimeout("changeOpacity(0)",1000);
                setTimeout("changeUpdate()",1050);
                setTimeout("changeOpacity(10)",1100);
                setTimeout("changeOpacity(20)",1200);
                setTimeout("changeOpacity(30)",1300);
                setTimeout("changeOpacity(40)",1400);
                setTimeout("changeOpacity(50)",1500);
                setTimeout("changeOpacity(60)",1600);
                setTimeout("changeOpacity(70)",1700);
                setTimeout("changeOpacity(80)",1800);
                setTimeout("changeOpacity(90)",1900);
                setTimeout("changeOpacity(100)",2000);
        }