/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
function StreetViewControl() {
    this.pegManMarker = null;
    this.guyIcon = null;
    this.latlng = null;
    this.map = null;
    this.moving = false;
    this.mousePressed = false;
    this.active = false;
    this.street = null;
    this.lastMarkerLocation = null;
    this.contentNode = null;
    this.panorama = null;
    this.overlayInstance = null;
    this.client = null;
}

StreetViewControl.prototype = new GControl();

StreetViewControl.prototype.initialize = function(map) {
    this.map = map;
    this.dir= new GDirections();
    this.contentNode = document.createElement('div');
    this.contentNode.style.textAlign = 'center';
    this.contentNode.style.width = '500px';
    this.contentNode.style.height = '300px';
    this.contentNode.id = 'pano';
    this.client = new GStreetviewClient();
    this.guyIcon = new GIcon(G_DEFAULT_ICON);
    this.guyIcon.image = "images/manstreet.png";
    this.guyIcon.shadow = null;
    this.guyIcon.dragCrossSize = new GSize(0,0);
    this.guyIcon.transparent = "images/manpick.png";
    this.guyIcon.imageMap = [
        26,13, 30,14, 32,28, 27,28, 28,36, 18,35, 18,27, 16,26,
        16,20, 16,14, 19,13, 22,8
    ];
    this.guyIcon.iconSize = new GSize(49, 52);
    this.guyIcon.iconAnchor = new GPoint(25, 35);  // near base of guy's feet
    this.guyIcon.infoWindowAnchor = new GPoint(25, 5);  // top of guy's head
    var container = document.createElement("div");
    var imgPreload = new Image();
    imgPreload.src = "images/zoom_streetview.png";
    imgPreload = new Image();
    imgPreload.src = "images/zoom_streetview_On.png";

    this.street = document.createElement("img");
    this.street.src = "images/zoom_streetview.png";
    this.street.style.position = 'absolute';
    this.street.style.cursor = "pointer";
    this.street.style.top = "0px";
    this.street.style.left = "0px";
    var streetCtrlTmp = this;
    document.onmouseup = function(){if(streetCtrlTmp.moving){streetCtrlTmp.deactivate()}};
    this.street.onmouseover = function(){streetCtrlTmp.street.src =  "images/zoom_streetview_On.png";};
    this.street.onmouseout = function(evt){streetCtrlTmp.mouseOut(evt)};
    this.street.onmousedown = function(evt){streetCtrlTmp.mouseDown(evt)};
    this.street.ondragstart = function(){return false;};
    this.map.getContainer().onmouseup = function(evt){streetCtrlTmp.mouseUp(evt)};
    this.map.getContainer().onmousemove = function(evt){streetCtrlTmp.mouseMove(evt)};
    
    this.street.title = bqc.locale.streetview.street;
    container.appendChild(this.street);
    this.map.getContainer().appendChild(container);

    //Hack to prevent a bug on IE on the first setLocationandPOV if the page was cached before.
    var latlng = new GLatLng(46.80393714261957, -71.22539520263672);
    var pegManMarker = new GMarker(latlng, {icon: this.guyIcon, draggable: true, clickable:true, bouncy: false, dragCrossMove: true});
    this.panorama = new GStreetviewPanorama(this.contentNode);
    this.panorama.setLocationAndPOV(pegManMarker.getLatLng(), null);

    return container;
}

StreetViewControl.prototype.mouseDown = function(evt){
    if (evt && evt.preventDefault){
        evt.preventDefault();
    }
    if(this.active){
        this.deactivate();
    }else{
        this.mousePressed = true;
    }
}

StreetViewControl.prototype.deactivate = function(){
    this.removePano();
    this.pegManMarker.closeInfoWindow();
    this.pegManMarker.hide();
    if(this.overlayInstance){
        this.map.removeOverlay(this.overlayInstance);
    }
    this.lastMarkerLocation = null;
    this.overlayInstance = null;
    this.street.src = "images/zoom_streetview.png";
    this.active = false;
    this.mousePressed = false;
    this.moving = false;
}

StreetViewControl.prototype.removePano = function(){
    if(this.panorama){
        this.panorama.remove();
    }
    this.contentNode.innerHTML="";
}

StreetViewControl.prototype.getRelativePos = function(evt){
    var posx = 0;
    var posy = 0;
    if (!evt) var evt = window.event;
    if (evt.pageX || evt.pageY) 	{
            posx = evt.pageX;
            posy = evt.pageY;
    }
    else if (evt.clientX || evt.clientY) 	{
            posx = evt.clientX + document.body.scrollLeft
                    + document.documentElement.scrollLeft;
            posy = evt.clientY + document.body.scrollTop
                    + document.documentElement.scrollTop;
    }
    posy = posy - Element.cumulativeOffset($(this.map.getContainer())).top;
    posx = posx - Element.cumulativeOffset($(this.map.getContainer())).left;
    return {"x": posx, "y": posy};
}

StreetViewControl.prototype.mouseOut = function(evt){
    var pos = this.getRelativePos(evt);
    var posx = pos.x;
    var posy = pos.y;

    if(this.mousePressed && this.pegManMarker == null){
        this.overlayInstance = new GStreetviewOverlay();
        this.map.addOverlay(this.overlayInstance);
        this.latlng = this.map.fromContainerPixelToLatLng(new GPoint(posx, posy));
        this.pegManMarker = new GMarker(this.latlng, {icon: this.guyIcon, draggable: true, clickable:true, bouncy: false, dragCrossMove: true});
        this.map.addOverlay(this.pegManMarker);
        var streetCtrlTmp = this;
        GEvent.bind(streetCtrlTmp.pegManMarker, "dragend", streetCtrlTmp, streetCtrlTmp.mapEvent);
        GEvent.bind(streetCtrlTmp.pegManMarker, "click", streetCtrlTmp, streetCtrlTmp.mapEvent);
        GEvent.bind(streetCtrlTmp.pegManMarker, "infowindowbeforeclose", streetCtrlTmp, streetCtrlTmp.removePano);
        this.moving = true;
        this.active = true;
    }else if(this.mousePressed){
        if(this.overlayInstance == null){
            this.overlayInstance = new GStreetviewOverlay();
            this.map.addOverlay(this.overlayInstance);
        }
        this.latlng = this.map.fromContainerPixelToLatLng(new GPoint(posx, posy));
        this.pegManMarker.setLatLng(this.latlng);
        this.moving = true;
        this.active = true;
        this.pegManMarker.show();
    }
    if(this.active){
        this.street.src =  "images/zoom_streetview_On.png";
    }else{
        this.street.src =  "images/zoom_streetview.png";
    }
}

StreetViewControl.prototype.mouseMove = function(evt){
    if(this.moving){
        var pos = this.getRelativePos(evt);
        var posx = pos.x;
        var posy = pos.y;
        this.pegManMarker.setLatLng(this.map.fromContainerPixelToLatLng(new GPoint(posx, posy)));
    }
}

StreetViewControl.prototype.mapEvent = function(evt){
    var streetCtrlTmp = this;
    this.dir.loadFromWaypoints([this.pegManMarker.getLatLng().toUrlValue(6),this.pegManMarker.getLatLng().toUrlValue(6)],{getPolyline:true});
     var that=this;
      GEvent.addListener(this.dir,"load", function() {
        GEvent.clearListeners(that.dir,"load");
        var p=that.dir.getPolyline().getVertex(0);
        //that.map.addOverlay(new GMarker(p))
        that.client.getNearestPanorama(p, function(response){streetCtrlTmp.preparePano(response)});

      });
   // this.client.getNearestPanorama(this.pegManMarker.getLatLng(), function(response){streetCtrlTmp.preparePano(response)});
}

StreetViewControl.prototype.mouseUp = function(evt){

    if(this.mousePressed && this.moving){
        var streetCtrlTmp = this;
        

        //this.client.getNearestPanorama(this.pegManMarker.getLatLng(), function(response){streetCtrlTmp.preparePano(response)});
        this.dir.loadFromWaypoints([this.pegManMarker.getLatLng().toUrlValue(6),this.pegManMarker.getLatLng().toUrlValue(6)],{getPolyline:true});
        var that=this;
      GEvent.addListener(this.dir,"load", function() {
        GEvent.clearListeners(that.dir,"load");
        //that.removePano();

        var p=that.dir.getPolyline().getVertex(0);
        //#that.map.addOverlay(new GMarker(p))
        that.client.getNearestPanorama(p, function(response){streetCtrlTmp.preparePano(response)});

      });


    }

    this.mousePressed = false;
    this.moving = false;
}

StreetViewControl.prototype.preparePano = function(response){
    var streetViewTmp = this;
    GEvent.clearListeners(streetViewTmp.pegManMarker, "infowindowopen");
    if (response.code != 200) {
        if(this.lastMarkerLocation){
            this.pegManMarker.setLatLng(this.lastMarkerLocation);
        }else{
            this.deactivate();
        }
    } else {
        var latlng = new GLatLng(response.Location.lat, response.Location.lng);
        this.pegManMarker.setLatLng(latlng);
        this.lastMarkerLocation = latlng;

        if(this.panorama){
            this.panorama.remove();
        }

        this.contentNode.innerHTML="";
        GEvent.bind(streetViewTmp.pegManMarker, "infowindowopen", streetViewTmp, function(){streetViewTmp.buildPano()});
        bqc.gaLogger.log(bqc.params.p_mode_org, bqc.GAnalyticsStrings.level2.streetView, bqc.GAnalyticsStrings.level3.map);
        this.pegManMarker.openInfoWindow(this.contentNode);
    }
}

StreetViewControl.prototype.buildPano = function(){
    this.panorama = new GStreetviewPanorama(this.contentNode);
    this.panorama.setLocationAndPOV(this.pegManMarker.getLatLng());
}

StreetViewControl.prototype.getDefaultPosition = function() {
    return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(25, 76));
}

