﻿  // variation on the elabel code
  // http://econym.org.uk/gmap/elabel.htm

       function ThumbMarker(point, thumbInfo, numberOfItems, key) {
        this.point = point;
        this.key = key;
        this.thumbInfo = thumbInfo;
        this.numberOfItems = numberOfItems;
        this.title = thumbInfo.title;
        var html =  '<div class="ic ic' + thumbInfo.type + '" title="' + thumbInfo.title + '">';
        
        
        html += '</div>';
        
        if (this.numberOfItems > 1)
        {
          html += '<span>' +   this.numberOfItems + ' scholen</span>'
        }
        else
        {
            var t =  this.thumbInfo.title;
            if (t.length > 24)
            {
                t = t.substring(0,24) + '...';
            }
          html += '<span>' + t + '</span>';
        }
        this.html = html;
        this.pixelOffset = this.numberOfItems == 1 ? new GSize(-14,-1) :  new GSize(-14,-1);  
        this.openInfoWindowHtml = function(htmlContent)        
        {

             this.map_.openInfoWindowHtml(this.point, htmlContent, {pixelOffset : new GSize(14,-20)}) 
          
           
        };    
        this.openInfoWindowTabsHtml = function(tabs, opts)        
        {
              opts = opts || new Object();
              opts.pixelOffset  = new GSize(0,-52);
             this.map_.openInfoWindowTabsHtml(this.point, tabs, opts) 
          
           
        };    
        this.onClick= function(event)
        {
            if (thumbInfo.js)
            {
                eval(thumbInfo.js);
            }
        };

         // Optional parameters
        this.classname = numberOfItems == 1 ? 'smark' : 'mmark';
        this.hidden = false;
             
         } 
      
      ThumbMarker.prototype = new GOverlay();

      ThumbMarker.prototype.initialize = function(map) {
          var div = document.createElement("div");
          div.style.position = "absolute";
          div.innerHTML = '<div id="gmngmt' + this.key + '" class="' + this.classname + '">' + this.html + '</div>';
          map.getPane(G_MAP_MARKER_PANE).appendChild(div);
          this.map_ = map;
          this.div_ = div;
          this.w = 132;
          this.h = 32;
          //<img class="gmnoprint" style="border: 0px none ; margin: 0px; padding: 0px; position: absolute; left: 857px; top: 427px; width: 16px; height: 25px; -moz-user-select: none; z-index: -166573024;" src="http://maps.gstatic.com/intl/en_ALL/mapfiles/markerTransparent.png" usemap="#gmimap328"/>
          var cimg = document.createElement("img");
          cimg.setAttribute('title', this.title);
          cimg.id = 'gmicimg' + this.key;
          cimg.src = 'include/images/map/markerTransparent.png';
          cimg.setAttribute('class', 'gmnoprint gmcimg');
          cimg.setAttribute('usemap', '#gmimap' + this.key);

          map.getPane(G_MAP_MARKER_MOUSE_TARGET_PANE).appendChild(cimg);
          cimg.style.position = 'absolute';
          cimg.style.border = '0px none';
          cimg.style.margin = '0px';
          cimg.style.padding = '0px';
          cimg.style.width = this.w+ 'px';
          cimg.style.height = this.h + 'px';

          this.cimg_ = cimg;
          this.cimg_.onclick = this.onClick.bind(this);


          if (this.percentOpacity) {
              if (typeof (div.style.filter) == 'string') { div.style.filter = 'alpha(opacity:' + this.percentOpacity + ')'; }
              if (typeof (div.style.KHTMLOpacity) == 'string') { div.style.KHTMLOpacity = this.percentOpacity / 100; }
              if (typeof (div.style.MozOpacity) == 'string') { div.style.MozOpacity = this.percentOpacity / 100; }
              if (typeof (div.style.opacity) == 'string') { div.style.opacity = this.percentOpacity / 100; }
          }
          if (this.overlap) {
              var z = GOverlay.getZIndex(this.point.lat());
              this.div_.style.zIndex = z;
          }
          if (this.hidden) {
              this.hide();
          }

      }

      ThumbMarker.prototype.remove = function() {
        this.div_.parentNode.removeChild(this.div_);
        this.cimg_.parentNode.removeChild(this.cimg_);
      }

      ThumbMarker.prototype.copy = function() {
        return new ThumbMarker(this.point, this.thumbInfo, this.numberOfItems);
      }

      ThumbMarker.prototype.redraw = function(force) {
          var p = this.map_.fromLatLngToDivPixel(this.point);
          var h = parseInt(this.div_.clientHeight);
          this.div_.style.left = (p.x + this.pixelOffset.width) + "px";
          this.div_.style.top = (p.y + this.pixelOffset.height - h) + "px";
          this.cimg_.style.left = (p.x + this.pixelOffset.width) + "px";
          
          this.cimg_.style.top = (p.y + this.pixelOffset.height - h) + "px";
      }

      ThumbMarker.prototype.show = function() {
        if (this.div_) {
          this.div_.style.display="";
          this.cimg_.style.display="";
          this.redraw();
        }
        this.hidden = false;
      }
      
      ThumbMarker.prototype.hide = function() {
        if (this.div_) {
          this.div_.style.display="none";
        }
        if (this.cimg_) {
          this.cimg_.style.display="none";
        }
        this.hidden = true;
      }
      
      ThumbMarker.prototype.isHidden = function() {
        return this.hidden;
      }
      
      ThumbMarker.prototype.setContents = function(html) {
        this.html = html;
        this.div_.innerHTML = '<div class="' + this.classname + '">' + this.html + '</div>' ;
        this.redraw(true);
      }
      
      ThumbMarker.prototype.setPoint = function(point) {
        this.point = point;
        if (this.overlap) {
          var z = GOverlay.getZIndex(this.point.lat());
          this.div_.style.zIndex = z;
        }
        this.redraw(true);
      }
      
      ThumbMarker.prototype.setOpacity = function(percentOpacity) {
        if (percentOpacity) {
          if(percentOpacity<0){percentOpacity=0;}
          if(percentOpacity>100){percentOpacity=100;}
        }        
        this.percentOpacity = percentOpacity;
        if (this.percentOpacity) {        
          if(typeof(this.div_.style.filter)=='string'){this.div_.style.filter='alpha(opacity:'+this.percentOpacity+')';}
          if(typeof(this.div_.style.KHTMLOpacity)=='string'){this.div_.style.KHTMLOpacity=this.percentOpacity/100;}
          if(typeof(this.div_.style.MozOpacity)=='string'){this.div_.style.MozOpacity=this.percentOpacity/100;}
          if(typeof(this.div_.style.opacity)=='string'){this.div_.style.opacity=this.percentOpacity/100;}
        }
      }

      ThumbMarker.prototype.getPoint = function() {
        return this.point;
      }
 
       ThumbMarker.prototype.getLatLng = function() {
        return this.point;
      }