function ImageGalleryControl($div)
{
    var that = this;
    var $selectedImage = $div.children(".selected-image");
    var $thumbnails = $div.children(".gallery").children(".thumbnail");
    $thumbnails.mouseenter(function()
    {
        $selectedImage.html($(this).html());
    });
    $thumbnails.children("a").click(function()
    {
        // Some devices don't have mouseenter so in that case just switch the selected image when clicked
        if ($selectedImage.children("a").attr("href") != $(this).attr("href"))
        {
            $selectedImage.html($(this).parent().html());
            return false;
        }
    });
    // Set initial image to first
    $selectedImage.html($thumbnails.html());
}

function TabControl($div)
{
    var that = this;
    
    this.tabClicked = function($a)
    {
        $a.parent().addClass("selected");
        $a.parent().siblings().removeClass("selected");
        
        var panelId = $a.attr("href");
        $div.children("div:visible").fadeOut(100, function() {
            $div.children(panelId).fadeIn();
        });
    };
    
    $div.children("ul").find("li a").click(function() { that.tabClicked($(this)); return false; });
    $div.children("ul").children("li:first").addClass("selected");
    $div.children("div").not(":first").hide();
}

function SlideShowControl($div)
{
    this.$div = $div;
    this.$img = this.$div.children("img");
    this.curImage = 0;
    this.imageCount = 0;
    this.pause = false;
    var that = this;
    
    this.nextImage = function()
    {
        if (!this.pause)
        {
            this.curImage = (++this.curImage % this.imageCount);
            var pos = -this.curImage * this.$div.width();
            this.$img.animate({ "margin-left": pos}, 500);
        }
    };
    
    this.init = function()
    {
        this.imageCount = Math.floor(this.$img.width() / this.$div.width());
        setInterval(function() { that.nextImage(); }, 5000);
    };
    
    this.$img.load(function() { that.init() });
    this.$img.mouseover(function() { that.pause = true; });
    this.$img.mouseout(function() { that.pause = false; });
}

Wts =
{
    localStorageSupported: (('localStorage' in window) && window['localStorage']),

    setCookieValue: function(key, value)
    {
        document.cookie = key + "=" + escape(value);
    },
    
    getCookieValue: function(key)
    {
        var cookies = document.cookie.split(";");
        for (var i in cookies)
        {
            var c = cookies[i];
            if (c.slice(0, c.indexOf("=")) == key)
            {
                return unescape(c.slice(c.indexOf("=")));
            }
            
            return undefined;
        }
    },
    
    setTheme: function(css)
    {
        if (!css)
        {
            // Try to get from storage
            if (this.localStorageSupported) css = localStorage.getItem("theme");
            else css = this.getCookieValue("theme");
        }
        $("#theme-style").attr("href", css);

        return css;
    },
    
    changeTheme: function()
    {
        var css = $("#select-theme option:selected").val();
        
        if (this.localStorageSupported) localStorage.setItem("theme", css);
        else this.setCookieValue("theme", css);
        
        this.setTheme(css);
    },
    
    browserWarning: function()
    {
        this.setTheme("css/nohtml5.css");
    },
    
    init: function()
    {
        if ($("html.no-rgba, html.no-opacity").length > 0) this.browserWarning();
        else  $("#select-theme").val(this.setTheme());
        
        $("#content").hide();
        
        var tabs = $(".tab-control");
        if (tabs.length > 0) new TabControl(tabs);
        
        var slides = $(".slide-show");
        if (slides.length > 0) new SlideShowControl(slides);
        
        var images = $(".image-gallery");
        if (images.length > 0) new ImageGalleryControl(images);
        
        $("#select-theme").change(function() { Wts.changeTheme(); });
        $(document).unload(function() { $("#content").fadeOut(); });
        
        $("#content").fadeIn(500);
    }
};

$(document).ready(function()
{
    Wts.init();
});