﻿// Timer functions
// Used to queue the different animations on the site
timers = new Array();
oldSetTimeout = window.setTimeout;
window.setTimeout = function(code, interval) {
    timers.push(oldSetTimeout(code, interval));
};

function resetTimeouts() {
    timers = new Array();
}

function clearTimeouts() {
    for (var i = 0; i < timers.length; i++) {
        clearTimeout(timers[i]);
    }
    resetTimeouts();
}

s = { };

s.util = {
    startPage: 0,
    currentId: 0,
    secondsToTextFadeIn: 0,
    currentImage: null,
    topImage: null,
    count: 0,
    left: -350,
    makeMeScrollable: null,
    scrollableArea: null,
    thumbnails: null,
    prevButton: null,
    nextButton: null,

    SmoothScroll: function (number) {
        this.makeMeScrollable.smoothDivScroll("moveToElement", "number", number);
    },

    SetupPrevNextButtons: function () {
        this.HandlePrevNextClick(this.prevButton, "prev");
        this.HandlePrevNextClick(this.nextButton, "next");
        this.HandlePrevNextHover(this.prevButton, "prev");
        this.HandlePrevNextHover(this.nextButton, "next");
    },

    HandlePrevNextHover: function (elem, direction) {
        elem.hover(function () {
            $(this).attr("src", "/images/" + direction + "_over.jpg");
        }, function () {
            $(this).attr("src", "/images/" + direction + ".jpg");
        });
    },

    HandlePrevNextClick: function (elem, direction) {
        var t = this;
        elem.click(function () {
            var img = t.currentImage;

            for (var i = 0; i < t.thumbnails.length; i++) {
                if (t.thumbnails[i].attr("id") == img.attr("id")) {
                    if (direction === "prev") {
                        if (i == 0) {
                            img = t.thumbnails[t.thumbnails.length - 1];
                            t.SmoothScroll(t.thumbnails.length);
                        }
                        else {
                            img = t.thumbnails[i - 1];
                            t.SmoothScroll(i);
                        }
                    }
                    else if (direction === "next") {
                        if (i == t.thumbnails.length - 1) {
                            img = t.thumbnails[0];
                            t.SmoothScroll(1);
                        }
                        else {
                            img = t.thumbnails[i + 1];
                            t.SmoothScroll(i);
                        }
                    }
                    break;
                }
            }

            var imgId = img.attr("id");

            t.AnimateThumbnail(t.currentImage, "down");
            t.currentId = imgId;
            t.currentImage = img;
            t.AnimateThumbnail(t.currentImage, "up");

            s.data.setImagePage(imgId);

        });
    },

    AnimateThumbnail: function (elem, direction) {
        if (direction === "up")
            elem.animate({ 'top': '-10px', 'opacity': '1', 'filter': 'alpha(opacity=100)' }, { duration: 400, queue: false });
        else if (direction === "down") {
            elem.animate({ 'top': '0px', 'opacity': '0.4', 'filter': 'alpha(opacity=40)' }, { duration: 400, queue: false });
        }
    },

    removeFilter: function (obj) {
        $(obj).removeAttr("style");
        $(obj).removeClass("opacity");
    },

    //Buttons to move forwards and backwards in the slider
    setPrevNext: function (layout) {
        $('#prev').css('left', -9).css({ 'opacity': '1', 'filter': 'alpha(opacity=100)' });
        if ($.browser.msie)
            $('#next').css('left', 70 + $('.big').width()).css({ 'opacity': '1', 'filter': 'alpha(opacity=100)' });
        else
            $('#next').css('left', 109 + $('.big').width()).css({ 'opacity': '1', 'filter': 'alpha(opacity=100)' });
    },

    setFacebook: function () {
        var fallbackLink = "http://www.facebook.com/hellethorningschmidt?sk=wall";
        $.getJSON('https://graph.facebook.com/11060438851/posts?access_token=AAABwZBT8XwYMBAPZAj6Phl8NlFbPUjZBk6ZCIU1Cafwjf2uUIvHg5GnrxZCAC9TGMyh168ZCE8FmEjX84YwmvjRk0jmZAPWtbsZD&callback=?', {}, function (response) {
            if (response.data) {
                var fbStatus = $("#fb-status");
                var fbLink = fbStatus.children("a");
                var fbMessage = fbLink.children("span");
                var fbText = fbMessage.children("span");

                var post;

                for (var i = 0; i < response.data.length; i++) {
                    var entry = response.data[i];
                    if (entry.type == "status" || entry.type == "link") {
                        post = entry;
                        break;
                    }
                }

                if (post.type == "status" || post.type == "link") {
                    fbText.text(post.message || post.description);
                    fbLink.attr("href", fallbackLink);

                    var textwidth = fbText.width();
                    var counter = parseInt(fbText.css("text-indent"), 10);

                    var areawidth = fbMessage.width();
                    var width = textwidth - textwidth - textwidth;

                    setTimeout(function() {
                        setInterval(function() {
                            if (counter > width)
                                fbText.css("text-indent", (counter - 1) + "px");
                            else {
                                fbText.css("text-indent", areawidth + "px");
                                counter = areawidth;
                            }
                            counter--;
                        }, 40);
                    }, 5000);
                }
            }
        });
    },

    //Common styles for all contents in the bottom (ie: infopages and newspages)
    setBottom: function () {
        clearTimeouts();
        var duration = 800;
        $('#bg-menu ul').html('');
        $('.big, .empty, .small-right, .small-left').hide();
        $('#prev').css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
        $('#next').css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
        $("#scroll-bottom").animate({ 'bottom': '-86px' }, duration);
        $("#bar-timer").animate({ 'bottom': '-86px' }, duration);
        $("#right-border").animate({ 'height': '86px' }, duration);
        $("#left-border").animate({ 'height': '86px' }, duration);
        $("#scroll-bottom-right").animate({ 'bottom': '-90px' }, duration);
        $("#scroll-bottom-left").animate({ 'bottom': '-90px' }, duration);
        $("#makeMeScrollable").animate({ 'bottom': '-86px' }, duration);
        $(".quote").hide();
        $("#pictures").animate({ 'height': '86px' }, duration);
        if (!$.browser.msie) {
            $(".big-bg, .small-left-bg, .small-right-bg").animate({ 'opacity': '0' }, duration);
        }
        else {
            $(".big-bg, .small-left-bg, .small-right-bg").css({ 'filter': 'alpha(opacity=0)' });
        }

        $('#bg-menu').show();
        $('#bg-menu').stop(true);
    },

    initialize: function (startPage, secondsToTextFadeIn) {
        if (startPage === 0)
            this.startPage = 1053;
        else
            this.startPage = startPage;

        this.currentId = this.startPage;

        this.makeMeScrollable = $("#makeMeScrollable");
        this.scrollableArea = $(".scrollableArea", this.makeMeScrollable);

        this.topImage = $('#top_img').hover(function () { $(this).css('cursor', 'pointer'); }, function () { $(this).css('cursor', ''); });
        this.prevButton = $("#prev");
        this.nextButton = $("#next");

        this.secondsToTextFadeIn = secondsToTextFadeIn;

        var t = this;

        //Load the startpage
        s.data.setImagePage(startPage);

        //Background image switcher
        window.setInterval(function () {
            if (t.currentId == null)
                t.currentId = t.startPage;

            var id = t.currentId;

            if (id != '') {
                $.ajax({
                    type: "POST",
                    url: "/Services/DataService.asmx/GetPageText",
                    data: "{" + "pageId: '" + id + "'" + "}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        var pics = response.d.Pictures;
                        var len = pics.length;
                        var picture;
                        var i = 0;
                        if (pics.length > 1) {
                            while (i < 20) {
                                picture = pics[Math.floor(Math.random() * (len + 1))];
                                if (picture != $("#bg-1").attr('src') && picture != null)
                                    break;
                                i++;
                            }
                            $("#bg-2").css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });

                            $("#bg-2").attr('src', picture);
                            $("#bg-2").animate({ 'opacity': '1', 'filter': 'alpha(opacity=100)' }, { duration: 1000, queue: false });
                            setTimeout(function () {
                                $("#bg-1").attr('src', picture);
                            }, 1000);
                        }
                    }
                });
            }
        }, 60000 * 2);

        //Top menu
        $('#forside, #top_img').click(function () {
            if (t.currentId != t.startPage) {
                t.AnimateThumbnail(t.currentImage, "down");
                t.currentId = t.startPage;
                t.currentImage = $("#" + t.currentId);
                t.AnimateThumbnail(t.currentImage, "up");
                t.SmoothScroll(1);
            }
            else {
                t.currentId = t.startPage;
                t.currentImage = $("#" + t.currentId);
            }

            s.data.setImagePage(t.currentId);
        });

        $.ajax({
            type: "POST",
            url: "/Services/DataService.asmx/GetInfoPages",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {

                var arr = response.d;

                for (var i = 0; i < arr.length; i++) {
                    var id = arr[i].Id;
                    var $a = $('<a />');
                    $('#minimenu p').append($a);
                    $('#minimenu p').append($('<br />'));
                    $a.text(arr[i].Title);
                    $a.attr('id', id);
                    if (arr[i].ExternalUrl != "") {
                        $a.attr("href", arr[i].ExternalUrl);
                        $a.attr("target", "_blank");
                    }
                    else {
                        $a.attr('href', '#');
                        $a.attr('mode', arr[i].HasNewsChildren ? 'news' : '');
                        $a.click(function () {
                            if ($(this).attr('mode') == 'news') {
                                s.data.setNewsPage($(this).attr('id'), 0);
                            }
                            else {
                                s.data.setInfoPage($(this).attr('id'), 0);
                            }
                            return false;
                        });
                    }
                }
            }
        });

        //Generates the slider, ie the tumbnails and tooltips
        $.ajax({
            type: "POST",
            url: "/Services/DataService.asmx/GetPageTexts",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                var arr = response.d;

                var thumbnailsArray = new Array();

                for (var i = 0; i < arr.length; i++) {
                    var id = arr[i].Id;

                    var thumbnailWrapper = $("<div>", {
                        "class": "thumbnailWrapper"
                    });

                    var img = $("<img>", {
                        id: id,
                        width: 180,
                        height: 80,
                        src: arr[i].Thumbnail,
                        "class": "thumbnail"
                    });

                    var tooltipWrapper = $("<div>", {
                        id: "div" + id,
                        "class": "info-box"
                    });

                    var tooltip = $("<div>", {
                        "class": "text",
                        html: arr[i].Title.replace(/(\r\n|\n|\r)/gm, "")
                    });

                    tooltip.appendTo(tooltipWrapper);

                    tooltipWrapper.appendTo(thumbnailWrapper);
                    img.appendTo(thumbnailWrapper);

                    t.scrollableArea.append(thumbnailWrapper);

                    if (t.currentImage == null)
                        t.currentImage = $("#" + startPage);

                    if (t.currentImage.length === 0)
                        t.currentImage = $("#" + startPage);

                    img.hover(function () {
                        if (t.currentId != $(this).attr("id"))
                            t.AnimateThumbnail($(this), "up");
                    },
                    function () {
                        if (t.currentId != $(this).attr("id")) {
                            $(this).stop(true, true);
                            t.AnimateThumbnail($(this), "down");
                        }
                    });

                    img.click(function () {
                        var thisId = $(this).attr("id");
                        if (t.currentId != thisId) {
                            t.AnimateThumbnail(t.currentImage, "down");
                            t.currentId = thisId;
                            t.currentImage = $("#" + t.currentId);
                            s.data.setImagePage(t.currentId);
                        }
                    });

                    if (t.currentId === id)
                        t.AnimateThumbnail(img, "up");

                    thumbnailsArray.push(img);
                }

                //create the scrolling image frieze
                t.makeMeScrollable.smoothDivScroll({
                    autoScroll: "onStart",
                    autoScrollDirection: "backandforth",
                    autoScrollStep: 0,
                    autoScrollInterval: 6000,
                    visibleHotSpots: ""
                });

                t.thumbnails = thumbnailsArray;
                t.SetupPrevNextButtons();
            }
        });
    }
};

s.data = {

    //Sets an imagepage based on an id. an imagepage is one of the toppages that is shown by clicking in the slider.
    setImagePage: function (pageId) {
        clearTimeouts();
        var duration = 800;
        $('.big, .small-right, .small-left').css('background', 'none');
        $('#bg-menu').hide();
        $('#prev').css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
        $('#next').css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
        $(".small-left h2.title, .small-right h2.title, .big h2.title").css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
        $(".small-left p.start, .small-right p.start, .big p.start").css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
        $(".small-left p.after, .small-right p.after, .big p.after").css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
        $(".small-left p.text, .small-right p.text, .big p.text").css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
        $('.small-left p.text, .small-right p.text, .big p.text').text('&nbsp;');
        //$('.small-left p.movie, .small-right p.movie, .big p.movie').html('&nbsp;');
        $('#bottom-header').text('');
        $('#bottom-text').html('');
        $("#pictures").animate({ 'height': '500px' }, duration);
        $("#makeMeScrollable").animate({ 'bottom': '-500px' }, duration);
        $("#left-border").animate({ 'height': '500px' }, duration);
        $("#right-border").animate({ 'height': '500px' }, duration);
        $("#scroll-bottom").animate({ 'bottom': '-500px' }, duration);
        $("#bar-timer").animate({ 'bottom': '-500px' }, duration);
        $("#scroll-bottom-right").animate({ 'bottom': '-504px' }, duration);
        $("#scroll-bottom-left").animate({ 'bottom': '-504px' }, duration);

        $(".small-left-bg, .small-right-bg, .big-bg").css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });

        setTimeout(function () {

            //$(".small-left, .small-right, .big").animate({ 'height': '600px' }, { duration: 0, queue: true });

            //Fetch data from umbraco based on pageId
            $.ajax({
                type: "POST",
                url: "/Services/DataService.asmx/GetPageText",
                data: "{" + "pageId: '" + pageId + "'" + "}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {                    
                    var picture = response.d.Pictures[0];
                    $("#bg-2").css({ 'opacity': '0', 'filter': 'alpha(opacity=0)' });
                    $("#bg-2").attr('src', picture);
                    $("#bg-2").animate({ 'opacity': '1' }, { duration: 1000, queue: false });
                    setTimeout(function () {
                        $("#bg-1").attr('src', picture);
                        var container = '';
                        var rest = '';
                        switch (response.d.Layout) {
                            case 6:
                                container = '.big';
                                rest = '.empty, .small-right, .small-left';
                                break;
                            case 8:
                                container = '.small-right';
                                rest = '.empty, .big, .small-left';
                                break;
                            default:
                                container = '.small-left';
                                rest = '.empty, .small-right, .big';
                                break;
                        }

                        var $container = $(container);
                        var $containerBg = $(container + "-bg");

                        $(rest).hide();
                        $(rest).css('z-index', '0');
                        $container.show();
                        $container.css('z-index', '3');

                        var text = response.d.Text;
                        if (!response.d.Movie) {
                            $('h2.title').show();
                            //looks for [start] and [stop] in the body of the item, and if its found it fades that part in before the rest of the text/title/prev next buttons
                            if (text.indexOf("[start]") > -1 && text.indexOf("[stop]") > -1) {
                                if (!text.startsWith("[start]"))
                                    text = '<div class="after opacity">' + text;

                                text = text.substring(0, text.indexOf("[start]")) + "</div>" + text.substring(text.indexOf("[start]"));
                                text = text.substring(0, text.indexOf("[stop]") + 6) + "<div class='after opacity'>" + text.substring(text.indexOf("[stop]") + 6) + "</div>";
                                text = text.replace('[start]', '<div class="start opacity">');
                                text = text.replace('[stop]', '</div>');

                                $(container + ' .text').html(text);

                                s.util.setPrevNext(response.d.Layout);
                                $(container + ' h2.title').html(response.d.Title.replace(/(\r\n|\n|\r)/gm, "<br />"));
                                $(container + ' .text').css({ 'opacity': '1', 'filter': 'alpha(opacity=100)' });
                                s.util.removeFilter($(container + ' .text'));

                                var extra = 20;
                                var diff = s.data.CalculateHeightDiff($containerBg, $container, extra);

                                if (diff > 0) {
                                    // Shrink width                                    
                                    while (diff > 0) {
                                        s.data.SetWidth(container, $container, $containerBg, -1);
                                        diff = s.data.CalculateHeightDiff($containerBg, $container, extra);
                                    }
                                }
                                else if (diff < 0) {
                                    // Expand width                                                                       
                                    while (diff < 0) {
                                        s.data.SetWidth(container, $container, $containerBg, 1);
                                        diff = s.data.CalculateHeightDiff($containerBg, $container, extra);
                                    }
                                }
                                
                                s.data.EnsureMinWidth(container, $container, $containerBg);

                                //IE SPECIFIC CODE
                                if ($.browser.msie) {
                                    $(container + "-bg").animate({ 'opacity': '0.7', 'filter': 'alpha(opacity=70)' }, { duration: 0, queue: false });
                                } else {
                                    $(container + "-bg").animate({ 'opacity': '0.7', 'filter': 'alpha(opacity=70)' }, { duration: 500, queue: false });
                                }

                                //setTimeout(function () {
                                $(container).css('background', 'url(/images/quoter.png) no-repeat 15px ' + ($('.start').position().top) + 'px');

                                if ($.browser.msie)
                                    $(container + ' .start').animate({ 'opacity': '1', 'filter': 'alpha(opacity=100)' }, 0, function () { s.util.removeFilter(this); });
                                else
                                    $(container + ' .start').animate({ 'opacity': '1', 'filter': 'alpha(opacity=100)' }, 500, function () { s.util.removeFilter(this); });
                                setTimeout(function () {
                                    if ($.browser.msie)
                                        $(container + ' .after').animate({ 'opacity': '1', 'filter': 'alpha(opacity=100)' }, 0, function () { s.util.removeFilter(this); });
                                    else
                                        $(container + ' .after').animate({ 'opacity': '1', 'filter': 'alpha(opacity=100)' }, 500, function () { s.util.removeFilter(this); });

                                    if ($.browser.msie)
                                        $(container + ' h2.title').animate({ 'opacity': '1', 'filter': 'alpha(opacity=100)' }, 0, function () { s.util.removeFilter(this); });
                                    else
                                        $(container + ' h2.title').animate({ 'opacity': '1', 'filter': 'alpha(opacity=100)' }, 500, function () { s.util.removeFilter(this); });
                                }, (s.util.secondsToTextFadeIn * 1000));
                                //}, 1000);
                            }
                            else {
                                $(container + ' h2.title').html(response.d.Title.replace(/(\r\n|\n|\r)/gm, "<br />"));
                                $(container + ' .text').css({ 'opacity': '1', 'filter': 'alpha(opacity=100)' });
                                s.util.removeFilter($(container + ' .text'));
                                $(container + ' h2.title').css({ 'opacity': '1', 'filter': 'alpha(opacity=100)' });
                                s.util.removeFilter($(container + ' h2.title'));
                                $(container + ' .text').html(text);
                                s.util.setPrevNext(response.d.Layout);
                            }

                        }
                        else {
                            $(container + ' .text').css({ 'opacity': '1', 'filter': 'alpha(opacity=100)' });
                            $('h2.title').hide();
                            $(container + ' p.text').html(text);
                            s.util.setPrevNext(response.d.Layout);
                            clearTimeouts();
                        }
                    }, 1000);
                }
            });
        }, 500);
    },

    SetWidth: function (type, elem, bg, incrementer) {
        // We are running in Quirksmode (I know....), so IE will calculate width including padding.
        // To accommodate this, we use the innerWidth() to get the width including padding, when in IE.
        if ($.browser.msie)
            elem.width(elem.innerWidth() + incrementer);
        else
            elem.width(elem.width() + incrementer);

        if (type === ".small-right") {
            elem.css("margin-left", parseInt(elem.css("margin-left"), 10) + (-incrementer));
            if ($.browser.msie)
                bg.width(bg.innerWidth() + incrementer);
            else
                bg.width(bg.width() + incrementer);
        }
        else if (type === ".small-left") {
            if ($.browser.msie)
                bg.width(bg.innerWidth() + incrementer);
            else
                bg.width(bg.width() + incrementer);
        }
    },

    CalculateHeightDiff: function (elem1, elem2, extra) {
        return elem1.height() - (elem2.height() + extra);
    },
    
    EnsureMinWidth: function(type, elem, bg) {
        var width = parseInt(elem.css("width"), 10);        
        if(width < 250) {
            if ($.browser.msie) {
                elem.css("width", "340px");
                bg.css("width", "340px");
            }
            else {
                elem.css("width", "250px");
                bg.css("width", "220px");
            }
            
            if(type === ".small-right")
                elem.css("margin-left", "640px");
        }
    },

    //Sets an infopage based on an id and the nr of the page (starts with the first one in the submenu).
    //an infopage is a page that gets show in the bottom
    setInfoPage: function (id, pageNr) {
        $.ajax({
            type: "POST",
            url: "/Services/DataService.asmx/GetInfoPage",
            data: "{"
                    + "pageId: '" + id + "'" + ", "
                    + "pageNr: '" + pageNr + "'" +
                  "}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {

                if (response.d.ExternalUrl != '')
                    window.location.href = response.d.ExternalUrl;
                else {
                    var children = response.d.ChildPages;
                    if (children[response.d.PageNr].ExternalUrl != '') {
                        window.location.href = children[response.d.PageNr].ExternalUrl;
                    } else {
                        s.util.setBottom();
                        $('#bottom-header').hide();

                        var $holder = $('<div />');
                        var $title = $('<h2 />');
                        var $text = $('<div />');

                        $holder.append($title);
                        $holder.append($text);
                        $('#bottom-text').html('');
                        $('#bottom-text').append($holder);

                        $title.attr('class', 'title');
                        $text.attr('class', 'text');
                        $title.html(children[response.d.PageNr].Title)
                        $text.html(children[response.d.PageNr].Text.replace('~/media/', '/media/'));
                        $('#bg-menu').addClass('small');

                        for (var i = 0; i < children.length; i++) {
                            var $li = $('<li />');
                            if (i + 1 == children.length)
                                $li.addClass('lastOne');
                            $('#bg-menu ul').append($li);
                            //                            var $div = $('<div />');
                            var $a = $("<a>", {
                                id: i
                            });
                            //$div.attr('id', i);
                            //                            $li.append($div);
                            $li.append($a);
                            if (response.d.PageNr == i) {
                                var $icon = $('<img />');
                                $icon.attr('alt', '');
                                $icon.attr('src', '/images/submenu-mo.png');
                                $icon.attr('class', 'menu-arrow');
                                $li.append($icon);
                            }

                            //                            $div.html(children[i].Title);
                            $a.html(children[i].Title);

                            if (children[i].ExternalUrl != "") {
                                $a.attr("href", children[i].ExternalUrl);
                                $a.attr("target", "_blank");
                            }
                            else {
                                $a.click(function () {
                                    s.data.setInfoPage(id, $(this).attr('id'));
                                    return false;
                                });
                            }
                        }
                    }
                }
            }
        });
    },

    //Sets a newspage based on an id and a nr (starts with the first on in the submenu).
    //A newspage is a page shown in the bottom based on the newsitem template in umbraco    
    setNewsPage: function (id, newsNr) {
        s.util.setBottom();
        $.ajax({
            type: "POST",
            url: "/Services/DataService.asmx/GetNews",
            data: "{"
                    + "pageId: '" + id + "'" + ", "
                    + "newsNr: '" + newsNr + "'" +
                  "}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                $('#bottom-header').hide();
                var news = response.d.NewsItems;

                var $holder = $('<div />');
                var $title = $('<h2 />');
                var $date = $('<div />');
                var $text = $('<div />');

                var $img = $('<img />');
                $holder.append($img);
                $img.attr('alt', '');
                $img.attr('src', news[0].BigImage);

                $holder.append($date);
                $holder.append($title);
                $holder.append($text);
                $('#bottom-text').html('');
                $('#bottom-text').append($holder);

                $title.attr('class', 'title');
                $date.attr('class', 'date');
                $text.attr('class', 'text');

                $title.html(news[response.d.NewsNr].Title);
                $date.html(news[response.d.NewsNr].PublishedDate);
                $text.html(news[response.d.NewsNr].Text.replace('~/media/', '/media/'));

                $('#bg-menu').removeClass('small');

                for (var i = 0; i < news.length; i++) {
                    var $li = $('<li />');

                    $('#bg-menu ul').append($li);
                    var $img = $('<img />');
                    var $div = $('<div />');
                    $li.append($img);
                    $li.append($div);
                    $div.attr('id', i);
                    $img.attr('src', news[i].MenuImage);

                    if (response.d.NewsNr == i) {
                        var $icon = $('<img />');
                        $icon.attr('alt', '');
                        $icon.attr('src', '/images/menu-arrow.png');
                        $icon.attr('class', 'menu-arrow');
                        $li.append($icon);
                    }

                    $div.html(news[i].Title);

                    //Mouseover effects for the image
                    $img.hover(function () {
                        $(this).animate({ 'opacity': '1', 'filter': 'alpha(opacity=100)' }, { duration: 500, queue: false });
                    }, function () {
                        $(this).animate({ 'opacity': '0.7', 'filter': 'alpha(opacity=70)' }, { duration: 500, queue: false });
                    });
                    $img.click(function () {
                        s.data.setNewsPage(id, $(this).parent().find('div').attr('id'));
                    });
                    $div.click(function () {
                        s.data.setNewsPage(id, $(this).attr('id'));
                    });
                }
            }
        });
    }
}

String.prototype.startsWith = function (str)
{ return (this.match("^" + str) == str) }
