/* jQuery plugin themeswitcher
---------------------------------------------------------------------*/
$.fn.themeswitcher = function (settings) {
    var options = jQuery.extend({
        loadTheme: 'Abtour',
        initialText: 'Switch Theme',
        width: 150,
        height: 370,
        buttonPreText: 'Theme: ',
        closeOnSelect: true,
        buttonHeight: 14,
        cookieName: 'jquery-ui-theme',
        onOpen: function () { },
        onClose: function () { },
        onSelect: function () { }
    }, settings);

    //markup 
    var button = $('<a href="#" class="jquery-ui-themeswitcher-trigger"><span class="jquery-ui-themeswitcher-icon"></span><span class="jquery-ui-themeswitcher-title">' + options.initialText + '</span></a>');
    var switcherpane = $('<div class="jquery-ui-themeswitcher">' +
    '<div id="themeGallery">' +
    '<ul>' +
	'<li><a href="/Content/Themes/Abtour/jquery-ui.custom.css"><span class="themeName">Abtour</span></a></li>' +
    '<li><a href="/Content/Themes/Simple/jquery-ui.custom.css"><span class="themeName">Simple</span></a></li>' +
    '<li><a href="/Content/Themes/Cupertino/jquery-ui.custom.css"><span class="themeName">Cupertino</span></a></li>' +
    '<li><a href="/Content/Themes/Redmond/jquery-ui.custom.css"><span class="themeName">Redmond</span></a></li>' +
    '<li><a href="/Content/Themes/Lightness/jquery-ui.custom.css"><span class="themeName">Lightness</span></a></li>' +
    '<li><a href="/Content/Themes/Start/jquery-ui.custom.css"><span class="themeName">Start</span></a></li>' +
    '<li><a href="/Content/Themes/DarkHive/jquery-ui.custom.css"><span class="themeName">DarkHive</span></a></li>' +
    '<li><a href="/Content/Themes/DotLuv/jquery-ui.custom.css"><span class="themeName">DotLuv</span></a></li>' +
    '<li><a href="/Content/Themes/LeFrog/jquery-ui.custom.css"><span class="themeName">LeFrog</span></a></li>' +
    '<li><a href="/Content/Themes/Trontastic/jquery-ui.custom.css"><span class="themeName">Trontastic</span></a></li>' +
    '<li><a href="/Content/Themes/Darkness/jquery-ui.custom.css"><span class="themeName">Darkness</span></a></li>' +
    '</ul>' +
    '</div></div>').find('div').removeAttr('id');

    //button events
    button.click(
		function () {
		    if (switcherpane.is(':visible')) { switcherpane.spHide(); }
		    else { switcherpane.spShow(); }


		    return false;
		}
	);

    //menu events (mouseout didn't work...)
    switcherpane.hover(
		function () { },
		function () { if (switcherpane.is(':visible')) { $(this).spHide(); } }
	);

    //show/hide panel functions
    $.fn.spShow = function () { $(this).css({ top: button.offset().top + options.buttonHeight + 6, left: button.offset().left }).slideDown(50); button.css(button_active); options.onOpen(); }
    $.fn.spHide = function () { $(this).slideUp(50, function () { options.onClose(); }); button.css(button_default); }


    /* Theme Loading
    ---------------------------------------------------------------------*/
    switcherpane.find('a').click(function () {
        updateCSS($(this).attr('href'));
        var themeName = $(this).find('span').text();

        var test = window.location.href.indexOf('abtour') < 0;
        if (test) {
            $("#header").css("background-image", "url(/Content/img/testsite-banner.png)");
        } else {

            $("#header").css("background-image", "url(/Content/img/" + themeName + ".png)");
        }
        button.find('.jquery-ui-themeswitcher-title').text(options.buttonPreText + themeName);
        $.cookie(options.cookieName, themeName, { path: '/' });
        options.onSelect();
        if (options.closeOnSelect && switcherpane.is(':visible')) { switcherpane.spHide(); }



        return false;
    });

    //function to append a new theme stylesheet with the new style changes
    function updateCSS(locStr) {


        var cssLink = $('<link href="' + locStr + '" type="text/css" rel="Stylesheet" class="ui-theme" />');
        $("head").append(cssLink);


        if ($("link.ui-theme").size() > 3) {
            $("link.ui-theme:first").remove();
        }


    }

    /* Inline CSS 
    ---------------------------------------------------------------------*/

    var button_default = {
        fontFamily: 'Trebuchet MS, Verdana, sans-serif',
        fontSize: '11px',
        color: '#666',
        background: '#eee url(/Content/img/buttonbg.png) 50% 50% repeat-x',
        border: '1px solid #ccc',
        '-moz-border-radius': '6px',
        '-webkit-border-radius': '6px',
        textDecoration: 'none',
        padding: '3px 3px 3px 8px',
        width: options.width - 11, //minus must match left and right padding 
        display: 'block',
        height: options.buttonHeight,
        outline: '0'
    };
    var button_hover = {
        'borderColor': '#bbb',
        'background': '#f0f0f0',
        cursor: 'pointer',
        color: '#444'
    };
    var button_active = {
        color: '#aaa',
        background: '#000',
        border: '1px solid #ccc',
        borderBottom: 0,
        '-moz-border-radius-bottomleft': 0,
        '-webkit-border-bottom-left-radius': 0,
        '-moz-border-radius-bottomright': 0,
        '-webkit-border-bottom-right-radius': 0,
        outline: '0'
    };



    //button css
    button.css(button_default)
	.hover(
		function () {
		    $(this).css(button_hover);
		},
		function () {
		    if (!switcherpane.is(':animated') && switcherpane.is(':hidden')) { $(this).css(button_default); }
		}
	)
	.find('.jquery-ui-themeswitcher-icon').css({
	    float: 'right',
	    width: '16px',
	    height: '16px',
	    background: 'url(/Content/img/icon_color_arrow.gif) 50% 50% no-repeat'
	});
    //pane css
    switcherpane.css({
        position: 'absolute',
        float: 'left',
        fontFamily: 'Trebuchet MS, Verdana, sans-serif',
        fontSize: '12px',
        background: '#000',
        color: '#fff',
        padding: '8px 3px 3px',
        border: '1px solid #ccc',
        '-moz-border-radius-bottomleft': '6px',
        '-webkit-border-bottom-left-radius': '6px',
        '-moz-border-radius-bottomright': '6px',
        '-webkit-border-bottom-right-radius': '6px',
        borderTop: 0,
        zIndex: 999999,
        width: options.width - 6//minus must match left and right padding
    })
	.find('ul').css({
	    listStyle: 'none',
	    margin: '0',
	    padding: '0',
	    overflow: 'auto',
	    height: options.height
	}).end()
	.find('li').hover(
		function () {
		    $(this).css({
		        'borderColor': '#555',
		        'background': 'url(/Content/img/menuhoverbg.png) 50% 50% repeat-x',
		        cursor: 'pointer'
		    });
		},
		function () {
		    $(this).css({
		        'borderColor': '#111',
		        'background': '#000',
		        cursor: 'auto'
		    });
		}
	).css({
	    width: options.width - 30,
	    height: '',
	    padding: '2px',
	    margin: '1px',
	    border: '1px solid #111',
	    '-moz-border-radius': '4px',
	    clear: 'left',
	    float: 'left'
	}).end()
	.find('a').css({
	    color: '#aaa',
	    textDecoration: 'none',
	    float: 'left',
	    width: '100%',
	    outline: '0'
	}).end()
	.find('img').css({
	    float: 'left',
	    border: '1px solid #333',
	    margin: '0 2px'
	}).end()
	.find('.themeName').css({
	    float: 'left',
	    margin: '3px 0'
	}).end();



    $(this).append(button);
    $('body').append(switcherpane);
    switcherpane.hide();
    if ($.cookie(options.cookieName) || options.loadTheme) {
        var themeName = $.cookie(options.cookieName) || options.loadTheme;
        switcherpane.find('a:contains(' + themeName + ')').trigger('click');
    }

    return this;
};