// shows the cuurent number of last shown post in the box
// for star will show 5 newst posts
currentPostsNum = 5;
totalPosts = 0;

// Image rotator
var Cycler = {
    cycleId: 0,
    cycleImages: ['#slika1', '#slika2', '#slika3'],
    timerId: null,
    displayImg: function(which) {
        Cycler.cycleId = which;
        //console.log('displayimg(' + which + ')');
        $('.mainImages').fadeOut('slow');
        $('.clickToShow img').css("border", "none");
        //console.log($('#clk_' + which + ' > img'));
        $('#clk_' + which + ' img').css("border", "solid 3px #259BB8");
        $(Cycler.cycleImages[which]).fadeIn('slow');
    },
    runCycle: function() {
        Cycler.cycleId += 1;
        if (Cycler.cycleId >= Cycler.cycleImages.length) {
            Cycler.cycleId = 0;
        }
        Cycler.displayImg(Cycler.cycleId);
    },
    startCycling: function() {
        clearInterval(Cycler.timerId);
        Cycler.timerId = setInterval(Cycler.runCycle, 7000);
    },

    displayImgInterrupt: function(which) {
        clearInterval(Cycler.timerId);
        Cycler.displayImg(which);
    },

    interupt: function() {
        clearInterval(Cycler.timerId);
    }
};

$(document).ready(function() {
    var lastTs = 0;
    var appendCompetitors = function() {
        $.getJSON("/Competition/NewestAfter", { cId: 1, ts: lastTs }, function(data) {
            var current = $(".competitor");
            if (current.length > 0) {
                setTimeout(function() {
                    for (var k = 0; k < data.users.length; ++k) {
                        var elem = current[current.length - k - 1];
                        $(elem).remove();
                    }
                }, 1000);
            }
            for (var k = data.users.length - 1; k >= 0; --k) {
                var cp = data.users[k];
                var elem = document.createElement("div");
                $(elem).addClass("competitor");
                $(elem).css("height", 0);
                var inHtml = ['<div class="competitor-image"><img src="',
                        cp.PhotoUrl, '" alt="" style="height: 30px;" /></div>',
                        '<div class="competitor-name"><a href="/Community/Profile/', cp.Id, '">',
                        cp.PalName, '</a></div>'];
                $(elem).html(inHtml.join(""));
                $("#competition-toplist").prepend(elem);
                $(elem).animate({ height: 35 }, 1000);
                lastTs = data.lastTs;
            }
        });
    }
    //setInterval(appendCompetitors, 15000);
    //appendCompetitors();


    $.getJSON("/Proxy/News", function(items) {
        newsHtml = [];
        for (var k = 0; k < items.length; ++k) {
            newsHtml.push('<li id="post_' + k + '">');
            newsHtml.push('<a href="');
            newsHtml.push(items[k].Link);
            newsHtml.push('">');
            newsHtml.push(items[k].Title);
            newsHtml.push('</a></li>');
        }
        $("#newPosts").html(newsHtml.join(""));

        totalPosts = $('#newPosts > li').children().size();
        //On start show 5 newest post and hide other
        for (var i = currentPostsNum; i < totalPosts; i++) {
            $('#post_' + i).hide();
        }

        $('#showOlderNews').click(function() {
            if (currentPostsNum < totalPosts) {
                $('#hideOlderNews').show();
                //hide the current shown posts
                var j = currentPostsNum;
                while (j != 0) {
                    $('#post_' + (currentPostsNum - j)).hide();
                    j--;
                }

                // show older
                var olderPosts = totalPosts - currentPostsNum;
                if (olderPosts < 5) {
                    for (var i = currentPostsNum; i < totalPosts; i++) {
                        $('#post_' + i).show();
                        currentPostsNum++;
                    }
                    $('#showOlderNews').hide();
                } else if (olderPosts >= 5) {
                    var currentPosts = currentPostsNum;
                    for (var i = currentPosts; i < (currentPosts + 5); i++) {
                        $('#post_' + i).show();
                        currentPostsNum++;
                    }
                }
            }
        });

        $('#hideOlderNews').click(function() {
            if (currentPostsNum > 5) {
                $('#showOlderNews').show();
                // hide currnet shown posts
                do {
                    $('#post_' + (--currentPostsNum)).hide();
                } while (((currentPostsNum % 5) != 0))

                //show newes 5 
                for (var i = currentPostsNum - 5; i < currentPostsNum; i++) {
                    $('#post_' + i).show();
                }

                if (currentPostsNum == 5) {
                    $('#showOlderNews').show();
                    $('#hideOlderNews').hide();
                }

            }
        });
    });
    
    $("#selBrand").change(function() {
        $.getJSON("/Home/Models", { brand: $("#selBrand").val() }, function(models) {
            $("#selModel").html();
            var selModelHtml = [];
            for (var k = 0; k < models.length; ++k) {
                selModelHtml.push('<option value="' + models[k].Platform + '">'
                            + models[k].Model + '</option>');
            }
            $("#selModel").html(selModelHtml.join(""));
        });
    });

    $("#runDownload").click(function() {
        if ($("#selModel").val() != "-1") {
            window.location = '/Phones/' + $("#selModel").val();
        }
    });


    $('.clickToShow').click(function(elem) {
        var which = Number(this.id.split('_')[1]);
        Cycler.displayImg(which);
        Cycler.interupt();
        Cycler.startCycling();
    });
    $('.slideshow').mouseout(function(elem) {
        Cycler.startCycling();

    });
    $('.slideshow').mouseover(function(elem) {
        Cycler.interupt();
    });
    
    Cycler.displayImg(0);
    Cycler.startCycling();
});