try
{
    wedebug.addLogger("navMenu", "NavigationMenu");
}
catch(e)
{
    alert(e.message);
}

var NavigationMenuController = Class.create();
NavigationMenuController.prototype = {
    m_mapController : null,

    //m_btn_toggle_left_menu: null,
//    m_btn_arrow_up: null,
//    m_btn_arrow_left: null,
//    m_btn_arrow_right: null,
//    m_btn_arrow_down: null,
//    m_btn_arrow_center: null,
    
    //m_btn_stort: null,
    
    //m_btn_radio1_flytt: null,
    //m_btn_radio1_zoom: null,
    
    m_mapStyleButtons : ["btn_radio2_normal", "btn_radio2_ortofoto", "btn_radio2_hybrid", "btn_radio2_skraafoto"],
    
//    m_btn_slider_zoom : null,
//    m_btn_slider_expand : null,
    
    m_sliderHandle : null,
    m_slider : null,
    m_sliderPanel : null,
    m_sliderAnnotated : null,
    
//    m_annotationFadeOut : null,
    m_annotationFadeIn : null,
    
    m_zoomLevels : null,
    m_sliderLevels : null,
    
    m_panelOffset : -4, // used to be -4   
    m_handle_min_y : 0,
    m_handle_max_y : 0,
    
    m_slider : null,
    
    m_birdseyeOrientation : null,
    
    initialize : function(t_mapController, t_menuController, t_slider, t_birdseyeOrientation)
    {
        wedebug.log("navMenu", "-> initialize");
        
        if( typeof t_slider != "undefined" )
        {
            this.m_slider = t_slider;
        }
        
        this.m_mapController = t_mapController;
        
        try
        {
            var style = this.m_mapController.getMapStyle();
            $(this.m_mapStyleButtons[style]).radio.select();                
            
        }
        catch(e)
        {}
        
//        this.m_btn_toggle_left_menu = $("btn_toggle_left_menu");
//        
        var btn_arrow_up = $("btn_arrow_up");
        var btn_arrow_left = $("btn_arrow_left");
        var btn_arrow_right = $("btn_arrow_right");
        var btn_arrow_down = $("btn_arrow_down");
        
        Event.observe(btn_arrow_up, "click", 
            (function()
            {
                this.m_mapController.pan(0, -300);    
            }).bind(this)
        );
        
        Event.observe(btn_arrow_down, "click", 
            (function()
            {
                this.m_mapController.pan(0, 300);    
            }).bind(this)
        );
        
        Event.observe(btn_arrow_left, "click", 
            (function()
            {
                this.m_mapController.pan(-300, 0);    
            }).bind(this)
        );
        
        Event.observe(btn_arrow_right, "click", 
            (function()
            {
                this.m_mapController.pan(300, 0);    
            }).bind(this)
        );
        
        var btn_arrow_center = $("btn_arrow_center");
        Event.observe(btn_arrow_center, "click", 
            (function()
            {
                this.m_mapController.reset();    
            }).bind(this)
        );
        
        if( this.m_slider != null && this.m_slider.enabled )
        {
            try
            {      
                this._initSlider(
                    this.m_mapController.getZoomLevel()
                ); 
            }catch(e){
                alert("NavigationMenuController.initiate - slider initiation failed.");
            }
        }
        
        this._initSliderButtons();
        
        //Listen to map navigation event
        this.m_mapController.addEventListener("onchangeview", this._evtMapChangeView.bind(this));
        
        try
        {
            this.m_mapController.addEventListener("onbirdseyezoomlevelchange", this._evtZoomLevel.bind(this));  
        }
        catch(e)
        {
            //ignore.
        }
        
        this.m_mapController.addEventListener("onmapstylechange", this._evtMapStyleChange.bind(this));
        
        if( t_menuController != null )
        {
            t_menuController.addEventListener("onmenuexpand", this._setMenuExpaned );
            t_menuController.addEventListener("onmenutruncate", this._setMenuTruncated );
        }
        
        t_mapController.addEventListener("onresize", this._toggleFullscreenButton );
        t_mapController.addEventListener("onchangeview", this._toggleBirdseyeButton.bind(this) );  
        this._toggleBirdseyeButton();
        
        if( typeof t_birdseyeOrientation != "undefined" &&
            t_birdseyeOrientation == true )
        {
            try
            {
                this.m_mapController.addEventListener("onmapstylechange", this._resetOrientation.bind(this));
            
                var t_north = $("orientationNorth");
                var t_west = $("orientationWest");
                var t_east = $("orientationEast");
                var t_south = $("orientationSouth");
            
                this.m_birdseyeOrientation = [
                    {
                        element : t_north,
                        selected : false,
                        value : MapController.BirdseyeOrientations.SOUTH
                    },
                    {
                        element : t_west,
                        selected : false,
                        value : MapController.BirdseyeOrientations.EAST
                    },
                    {
                        element : t_east,
                        selected : false,
                        value : MapController.BirdseyeOrientations.WEST
                    },
                    {
                        element : t_south,
                        selected : true,
                        value : MapController.BirdseyeOrientations.NORTH
                    },
                ];
                
                Event.observe(
                    t_north, 
                    "click", 
                    (function(){
                        this._setBirdseyeOrientation(0);
                    }).bind(this)
                );
                
                Event.observe(
                    t_west, 
                    "click", 
                    (function(){
                        this._setBirdseyeOrientation(1);
                    }).bind(this)
                );
                
                Event.observe(
                    t_east, 
                    "click", 
                    (function(){
                        this._setBirdseyeOrientation(2);
                    }).bind(this)
                );
                
                Event.observe(
                    t_south, 
                    "click", 
                    (function(){
                        this._setBirdseyeOrientation(3);
                    }).bind(this)
                );
            }
            catch(e){alert(e.message);}            
        }
    },
    
    _resetOrientation : function(style)
    {
        if( style != MapController.Styles.BIRDS_EYE )
        {
            this.m_birdseyeOrientation[3].element.addClassName("selectedOrientation");                
            for(var i=0; i<3; i++)
            {
                this.m_birdseyeOrientation[i].element.removeClassName("selectedOrientation");                
            } 
        }
    },
    
    _setBirdseyeOrientation : function(t_orientation)
    {
        var t_element = this.m_birdseyeOrientation[t_orientation];
        
        if( this.m_mapController.setBirdseyeOrientation(t_element.value) )
        {
            t_element.element.addClassName("selectedOrientation");
            
            for(var i=0; i<4; i++)
            {
                if( i != t_orientation )
                {
                    this.m_birdseyeOrientation[i].element.removeClassName("selectedOrientation");
                }
            } 
        }       
    },
    
    _setMenuExpaned : function()
    {
        try
        {
            $("btn_toggle_left_menu").radio.unselect();
            
            //move annotation div.
            var t_annotation = $("annotation");
            t_annotation.style.left = "425px";
        }
        catch(e){}
    },
    
    _setMenuTruncated : function()
    {
        try
        {
            $("btn_toggle_left_menu").radio.select();
            
            //move annotation div.
            var t_annotation = $("annotation");
            t_annotation.style.left = "80px";
        }
        catch(e){}
    },
    
    _toggleFullscreenButton : function(t_fullscreen)
    {
        try
        {
            if( t_fullscreen )
            {
                $("btn_stort").radio.select();
            }
            else
            {
                $("btn_stort").radio.unselect();
            }
        }
        catch(e){}
    },
    
    _toggleBirdseyeButton : function()
    {
        try
        {
            var btn = $("btn_radio2_skraafoto");
            if( btn != null )
            {
                if( this.m_mapController.isBirdseyeAvailable() )
                {
                    btn.radio.enable();
                }
                else
                {
                    btn.radio.disable();
                }
            }
        }
        catch(e){alert(e.message);}
    },
    
    _initSlider : function(t_level)
    {
        this.m_zoomLevels = mapController.getZoomLevels();
        
        this.m_sliderHandle = $("sliderHandle");        
        this.m_sliderPanel = $("sliderPanel");
        this.m_sliderAnnotated = $("sliderAnnotated");
        
        //Slider annotation animation fade
//        this.m_annotationFadeOut = new YAHOO.util.Anim(this.m_sliderAnnotated, { opacity: { to: 0 } }, 1, YAHOO.util.Easing.easeOut);
        this.m_annotationFadeIn = new YAHOO.util.Anim(this.m_sliderAnnotated, { opacity: { to: 1 } }, 1, YAHOO.util.Easing.easeIn);
        
        Event.observe(this.m_sliderPanel, "mousedown", this._panelMouseDown.bind(this));
        Event.observe(this.m_sliderPanel, "mouseover", this._panelMouseOver.bind(this));
        Event.observe(this.m_sliderPanel, "mouseup", this._panelMouseUp.bind(this));
        Event.observe(this.m_sliderPanel, "mouseout", this._panelMouseOut.bind(this));  
        Event.observe(this.m_sliderPanel, "mousemove", this._panelMouseMove.bind(this));
        
        this.m_handle_max_y = Element.getHeight(this.m_sliderPanel) - Element.getHeight(this.m_sliderHandle);
                
        var min = 0;        
        var panelHeight = Element.getHeight(this.m_sliderPanel);
        var sliderHeight = Element.getHeight(this.m_sliderHandle);
        var max = panelHeight-sliderHeight;
                        
        var i, length = this.m_zoomLevels.length;
        var intervalSize = (max + 6)/ length; //TODO:Why 6??
        
        this.m_sliderLevels = new Array();
        for(i=0; i<length; i++)
        {
            if( i!= length-1 )
            {
                this.m_sliderLevels.push(Math.floor(min + intervalSize*i));
            }
            else //last level, snap to last pixel
            {
                this.m_sliderLevels.push(Math.ceil(min + intervalSize*i));                
            }
        }   
        
        this._setSliderPosition(t_level);
    },
    
    _initSliderButtons : function()
    {
        //Init slider buttons
        var t_btn_slider_zoom = $("btn_slider_zoom");
        var t_btn_slider_expand = $("btn_slider_expand");
        
        if( this.m_zoomLevels.first() < this.m_zoomLevels.last() )
        {        
            Event.observe(t_btn_slider_expand, "click", this._onSliderButtonExpand.bind(this));
            Event.observe(t_btn_slider_zoom, "click", this._onSliderButtonZoom.bind(this));
        }
        else
        {
            Event.observe(t_btn_slider_zoom, "click", this._onSliderButtonExpand.bind(this));
            Event.observe(t_btn_slider_expand, "click", this._onSliderButtonZoom.bind(this));
        }
    },
    
    _onSliderButtonExpand : function(t_event)
    {        
        var t_level = this.m_mapController.getZoomLevel() + 1;
        
        if( this.m_zoomLevels.indexOf(t_level) != -1 )
        {
            //alert(this.m_mapController.setZoomLevel);
            this.m_mapController.setZoomLevel(
                t_level, false
            );
        }
    },
    
    _onSliderButtonZoom : function(t_event)
    {
        var t_level = this.m_mapController.getZoomLevel() - 1;
    
        if( this.m_zoomLevels.indexOf(t_level) != -1 )
        {
            this.m_mapController.setZoomLevel(
                this.m_mapController.getZoomLevel() - 1, false
            );
        }
    },
    
    _mousedown : false,
    _startY : 0,
    _handleStartPosition : 0,
    _handlePosition : 0,
    _handleOffset : -18,
    _sliderStartY : 0,
    
    _panelMouseOver : function(t_event)
    {        
        if( this.m_mapController.getMapStyle() != MapController.Styles.BIRDS_EYE )
        {
            //this.m_sliderAnnotated.style.display = "block";
            //this.m_sliderAnnotated.addClassName("panelMouseDown");
            //this.m_annotationFadeIn.animate();
        }
    },
    
    _panelMouseDown : function(t_event)
    {
        this._startY = Event.pointerY(t_event);   
        this._mousedown = true;
        
        var posY = this._getDivPosY(t_event);     
        wedebug.log("navMenu", "_panelMouseDown: handle.y: " + Position.realOffset(this.m_sliderHandle)[1] + " divposY: " + posY);
        
        var styleTop = this.m_sliderHandle.getStyle("top");
        if( styleTop != null )
        {
            this._handleStartPosition = parseInt(this.m_sliderHandle.getStyle("top").replace(/px/g, ""));
        }
        
        //Move handle to mouse position        
        var top = this._setSliderHandlePosition(posY);
        this._sliderStartY = top;
        
        Event.stop(t_event);
        
        Element.addClassName(this.m_sliderPanel, "updown");             
    },
    
    _setSliderHandlePosition : function(panelY)
    {        
        wedebug.log("navMenu", "panelY: " + panelY + " maxy: " + this.m_handle_max_y);
        var top = panelY + this._handleOffset;
        if( top < this.m_handle_min_y )
        {
            top = this.m_handle_min_y;
        }
        else if( top > this.m_handle_max_y + 400 )
        {
            top = this.m_handle_max_y;
        }
        wedebug.log("navMenu", "handle top: " + top);
        this.m_sliderHandle.setStyle({top: top + "px"});
        this._handlePosition = top;
        return top - this._handleOffset;        
    },
    
    _getDivPosY : function(t_event)
    {
        //alert([this._startY,(Position.cumulativeOffset(Event.element(event))[1] + this._panelOffset)]);
        return this._startY - Position.cumulativeOffset(Event.element(t_event))[1] + this.m_panelOffset;
    },
    
    _panelMouseOut : function(t_event)
    {
        wedebug.log("navMenu", "_panelMouseOut this._mousedown: " + this._mousedown);
        this.m_sliderAnnotated.style.display = "none";
        //this.m_annotationFadeOut.animate();
//        this.m_annotationFadeOut.onComplete.subscribe(
//            (function()
//            {
//                this.m_sliderAnnotated.removeClassName("panelMouseDown");            
//            }).bind(this)
//        );
        
            
        if( this._mousedown )
        {  
            
            /* Reset handle position */
            Element.removeClassName(this.m_sliderPanel, "updown");        
            
            this._setSliderHandlePosition(this._handleStartPosition);
            
            Event.stop(t_event); 
            
            this._mousedown = false; 
                       
        }      
    },   
    
    _panelMouseUp : function(t_event)
    {
        /* change zoom level */
        Element.removeClassName(this.m_sliderPanel, "updown");        
        this._mousedown = false;
        
        Event.stop(t_event);    
        
        this._setLevelAndSnap();
    },    
    
    _panelMouseMove : function(t_event)
    {
        if( this._mousedown )
        {   
            var currentY = Event.pointerY(t_event);
            var move = currentY - this._startY;
            this._setSliderHandlePosition(this._sliderStartY + move);
            //this.m_sliderHandle.setStyle({top: (this._sliderStartY + move) + "px"});
            wedebug.log("navMenu", "style.top: " + this.m_sliderHandle.style.top);
            
            Event.stop(t_event);
        }
    },
    
    _setLevelAndSnap : function()
    {
        var index = -1;
        var diff = 1000;
        var i, length = this.m_sliderLevels.length;
        for(i=0; i<length; i++)
        {
            var currDiff = Math.abs(this.m_sliderLevels[i] - this._handlePosition);
            if( currDiff < diff )
            {
                diff = currDiff;
                index = i;
            }
            else if( currDiff > diff )
            {
                //We have found smallest diff
                break;
            }
        }
        
        this.m_sliderHandle.setStyle({top:this.m_sliderLevels[index] + "px"}); //position slider
        
        //Set map level
        this.m_mapController.setZoomLevel(this.m_zoomLevels[index]);
    },
    
    _setSliderPosition : function(t_level)
    {
        if( this.m_slider != null && this.m_slider.enabled)
        {
            //A bit heavy to do this, but considering that zoom levels doesn't necessarily 
            //start on index 0 and is added by one, we do it..
            var i, index, length = this.m_zoomLevels.length;
            for(i=0; i<length; i++)
            {
                if( this.m_zoomLevels[i] == t_level )
                {
                    index = i;
                    break;
                }
            }
            
            wedebug.log("navMenu", "-> _setSliderPosition: " + [t_level, index]);
            //alert(index);
            this.m_sliderHandle.setStyle({top:this.m_sliderLevels[index] + "px"}); //position slider
        }
    },
    
    _evtMapChangeView : function(t_center, t_style, t_level)
    {
        wedebug.log("navMenu", "-> _evtMapChangeView: " + [t_center,t_style,t_level]);
        
        if( t_style != MapController.Styles.BIRDS_EYE )
        {
            this._setSliderPosition(t_level);
        }
    },
    
    _evtZoomLevel : function(t_level)
    {
        this._setSliderPosition(t_level);
    },
    
    _evtMapStyleChange : function(t_style)
    {
        $(this.m_mapStyleButtons[t_style]).radio.select();
    }
}