$(document).ready(function() {

	initNavigation();

	$("#side-nav").addClass("accordion");
	$("ul > li > ul", "#side-menu").addClass("slide").parents().filter("li").addClass("sub").find("a:first").addClass("link").end().prepend("<span class='opener'>+</span>");

	$("#accordion").accordion({ active: false, autoHeight: false });

	$("li", "#menu").wrapInner("<div></div>");

	// Navigation highlights

	// Using the current path (e.g. /Section/Page)
	var path = location.pathname;

	$("input.inputtext", "#search-box").Watermark("Search", "#34B2FE");

	// Handle links to the current path
	if (path) {
		// Main Nav
		$('a[href="' + path + '"]', "#nav").parents().filter('li').addClass("active");

		// Sub Nav
		$('a[href$="' + path + '"]', "#side-nav").parents().filter('li').children().filter('ul').css("display", "block").parents().filter("ul").css("display", "block");
		$('a[href$="' + path + '"]', "#side-nav").parents().filter('li:first').addClass("active");
	}

	var pageTitle = $("div.content h1").text();
	if (pageTitle.length) {
		$("input[id$='ClassTitle']").val(pageTitle).attr("readonly", "readonly").parents().filter("tr").hide();
	}
});

function initNavigation() {
    // First, fix markup: submenus need a wrapper div, need to be unhidden, and the parent list item needs a new class
    $("ul > li > ul", "#nav").wrap("<div></div>").css("display", "block").parents().filter("li").addClass("sub");
    
    var _slideSpeed = 125;
    var _stayTime = 250;
    var _menu = $('#nav > ul');
    var _dropLinks = _menu.find(' > li');
    var _subDrop = _dropLinks.find('li');

    // hover function
    _menu.find('li').hover(function() {
        $(this).addClass('hover');
    }, function() {
        $(this).removeClass('hover');
    });

    _dropLinks.each(function() {
        var _timer;
        var _opener = $(this);
        var _drop = _opener.find(' > div');
        if (_drop.length) {
            _opener.addClass('hover');
            var _slide = _drop.find(' > ul');
            var _dropHeight = _slide.height();
            _drop.hide();
            _slide.css({ marginTop: -_dropHeight });
            _opener.removeClass('hover');

            _opener.hover(function() {
                if (_timer) clearTimeout(_timer);
                _drop.show().css({ overflow: 'hidden' });
                _slide.animate({ marginTop: 0 }, { duration: _slideSpeed, queue: false, complete: function() {
                    _drop.css({ overflow: 'visible' });
                } 
                })
            }, function() {
                _opener.addClass('hover');
                _timer = setTimeout(function() { collapseDropdowns(); }, _stayTime);
            });
        }
        setTimeout(function() { _opener.removeClass('hover'); }, 100);

        function collapseDropdowns() {
            var _openedDrops = _opener.find('div:visible');
            var _lastDrop = _openedDrops.eq(_openedDrops.length - 1);
            if (_openedDrops.length > 0) {
                var _dropWidth = _lastDrop.width();
                var _dropSlide = _lastDrop.find(' > ul');

                _lastDrop.css({ overflow: 'hidden' });
                _lastDrop.parent().find(' > a').removeClass('selected');

                if (_openedDrops.length == 1) {
                    _dropSlide.animate({ marginTop: -_dropHeight }, { duration: _slideSpeed, queue: true, complete: function() {
                        _lastDrop.hide().css({ overflow: 'visible' });
                        _lastDrop.parent().removeClass('hover');
                    } 
                    });
                } else {
                    _dropSlide.animate({ marginLeft: -_dropWidth }, { duration: _slideSpeed, queue: true, complete: function() {
                        _lastDrop.hide().css({ overflow: 'visible' });
                        collapseDropdowns();
                    } 
                    });
                }
            }
        }
    });

    // submenu items
    _subDrop.each(function() {
        var _opener = $(this);
        var _drop = _opener.find(' > div');

        var _dropWidth = parseInt(_drop.css('width'));
        var _slide = _drop.find(' > ul');
        _drop.hide();
        _slide.css({ marginLeft: -_dropWidth })

        _opener.hover(function() {
            // hide others
            var _items = $(this).parent().find('div:visible');
            if (_items.length) {
                _items.each(function() {
                    var _cdrop = $(this);
                    var _cslide = _cdrop.find(' > ul');
                    var _dropWidth = parseInt(_cdrop.css('width'));

                    _cdrop.parent().find(' > a').removeClass('selected');

                    _cdrop.css({ overflow: 'hidden' });
                    _cslide.stop().animate({ marginLeft: -_dropWidth }, { duration: _slideSpeed, queue: false, complete: function() {
                        _cdrop.hide().css({ overflow: 'visible' });
                    } 
                    });
                });
            }

            // show selected
            _slide.stop();
            _drop.show().css({ overflow: 'hidden' });
            _slide.animate({ marginLeft: 0 }, { duration: _slideSpeed, queue: false, complete: function() {
                _opener.find(' > a').addClass('selected');
                _drop.css({ overflow: 'visible' });
            } 
            })
        });

    });

}

// **************************************************************************************
// Adds points to the map
// **************************************************************************************
function addPoints() {
    if (GBrowserIsCompatible()) {
        var hPoints = new Hashtable();
        var bounds = new GLatLngBounds();

        // Add a marker for each point using the indicated lat/long/icon/etc...
        // Store the marker in a hashtable so we can get at it later
        $("ul.points li.point").hide().each(function() {
            var lat = $(this).find("ul li.lat").text();
            var lng = $(this).find("ul li.lng").text();
            var htmlContent = $(this).find("div.popup").html();
            var pinIcon = $(this).find("img.icon").attr("src");
            var point = new GLatLng(lat, lng);
            var marker = createMarker(point, pinIcon, htmlContent);
            hPoints.put($(this).attr("id"), marker);
            map.addOverlay(marker);
            bounds.extend(point);
        });

        map.setCenter(bounds.getCenter());
        map.setZoom(map.getBoundsZoomLevel(bounds));

        // Add a click event to each of the location points so the info window is displayed
        $("ul.pointslist li.location").each(function() {
            $(this).click(function() {
                var marker = hPoints.get($(this).attr("id").replace("loc_", "point_"));
                map.setCenter(marker.getLatLng(), 15);
                marker.openInfoWindowHtml($(this).find("div.popup").html());
            }).find("div.popup").hide();
        });
    }
}

// **************************************************************************************
// Creates a map marker object
// **************************************************************************************
function createMarker(point, pinIcon, htmlContent) {
    // Create a custom icon for this point using our icon class
    var customIcon = new GIcon(G_DEFAULT_ICON);
    if (pinIcon != null) {
        customIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
        customIcon.image = pinIcon;
        customIcon.iconSize = new GSize(34, 34);
        //customIcon.shadowSize = new GSize(54, 30);
        //customIcon.iconAnchor = new GPoint(9, 34);
        //customIcon.infoWindowAnchor = new GPoint(16, 2)
        //customIcon.infoShadowAnchor = new GPoint(18, 25);
    }

    // Set up our GMarkerOptions object
    markerOptions = { icon: customIcon };
    var marker = new GMarker(point, markerOptions);

    // Hook up event for the info window
    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(htmlContent);
    });

    return marker;
}