//Cufon.set('fontFamily', 'StoneSanSem').replace('.quilt p');

$(document).ready(function () {
    var quiltTemplate =
"<div class=\"quilt-block\">" +
    "<% for ( var i = 0; i < Results.length; i++ ) { %>" +
        "<div class=\"quilt <%=Results[i].Layout%>\">" +
            "<table><tr><td><p><%=Results[i].Message%></p></td></tr></table>" +
        "</div>" +
    "<% } %>" +
"</div>";

    //var quiltMatrix = Array();
    var quiltPage = 0;

    var canvas = $("#container-canvas").scrollableCanvas({
        scrollBlock: function (event) {
            //var copy = $("#quilt-copy-source").clone();
            //copy.css("top", event.y);
            //copy.css("left", event.x);
            quiltPage++;

            /*
            var data = $.ajax({
            url: "/Home/GetQuilts",
            dataType: 'json',
            data: {
            Page: quiltPage
            },
            type: "GET",
            async: false
            }).responseText;
            data = $.parseJSON(data);
            var jq = $(tmpl(quiltTemplate, data));
            jq.appendTo($("#container"));
            */
            $.getJSON('/Home/GetQuilts',
                {
                    Page: quiltPage
                },
                function (data) {
                    var jq = $(tmpl(quiltTemplate, data));
                    jq.css("top", event.y);
                    jq.css("left", event.x);
                    jq.appendTo($("#container"));
                }
            );

            //            Cufon.refresh(".quilt p");
        },
        initializeBlocks: true,
        scrollSpeed: .2
    });

    $(".bouble_icon").click(function () {
        var jq = $(this);
        var posX = jq.position().left - 5;
        $("#icon_box").animate({ left: posX }, 500);

        jq.siblings().removeClass("selected");
        jq.addClass("selected");

        $("#post_box_bouble").css("background-image", "url('/images/bouble" + (jq.index() - 1) + "_big.png')");
    });

    /*
    $("#voice").keydown(function (event) {
    var jq = $(this);
    var text = jq.val();
    if ((text.length < 180) == false) {
    event.preventDefault();
    return false;
    }
    });
    */

    $("#voice").keyup(function () {
        var jq = $(this);
        var text = jq.val();
        if (text.length > 180) {
            text = text.substring(0, 180);
            jq.val(text);
        }
        $("#message_length").text("Du har nu angivet " + text.length + " ud af 180 karakterer");

        if (text.length > 180) {
            $("#message_length").css("color", "#ff0000");
        }
        else {
            $("#message_length").css("color", "#000000");
        }

        var previewHolder = $("#post_box_bouble");
        previewHolder.find("p").text(text);
        //showPreview();
        $("#show_preview_btn").click();
    });

    $("#close, #close2").click(function () {
        $("#recommend_box").hide();
        $("#logo").hide();
        $("#info_box").hide();
        $("#logo2").show();
    });

    function resetUI() {
        $("#info_box").hide();
        $("#recommend_box").show();
        $("#logo").show();
        $("#logo2").hide();

        $("#post_message").show();
        $("#tip_friend").hide();
        $("#wallpaper").hide();

        $("#email").val("");
        $("#voice").val("");
        $("#tip_email").val("");
        $("#tip_mess").val("");

        $("#message_length").text("Max. 180 karakterer");

        $("#post_box_text").show();
        $("#post_box_bouble").hide();

        $("#recommend_box_inner2 p").removeClass("current");
    }

    $(".new_post a").click(function (event) {
        event.preventDefault();

        resetUI();
    });

    $("#show_preview_btn").click(function (event) {
        //function showPreview() {
        //event.preventDefault();
        $("#post_box_text").hide();
        $("#post_box_bouble").show();
        $("#post_message").show();
        $("#tip_friend").hide();
        $("#wallpaper").hide();

        $("#recommend_box_inner2 p").removeClass("current");
        $(this).parent().addClass("current");
    });
    //}

    $(".tip_friend_btn").click(function (event) {
        event.preventDefault();

        resetUI();

        $("#post_box_text").show();
        $("#post_box_bouble").hide();
        $("#post_message").hide();
        $("#wallpaper").hide();
        $("#tip_friend").show();

        $("#recommend_box_inner2 p").removeClass("current");
        $(this).parent().addClass("current");
    });

    $(".download_wallpaper").click(function (event) {
        event.preventDefault();

        resetUI();

        $("#post_box_text").show();
        $("#post_box_bouble").hide();
        $("#post_message").hide();
        $("#tip_friend").hide();
        $("#wallpaper").show();
        $("#recommend_box_inner2 p").removeClass("current");
        $(this).parent().addClass("current");
    });

    $(".recommend_form1").submit(function (event) {
        event.preventDefault();

        var tip_email = $("#tip_email").val();
        var tip_name = $("#tip_name").val();
        var tip_mess = $("#tip_mess").val();

        if (tip_email == "") {
            alert("Husk at angive e-mail");
            return;
        }

        if (tip_name == "") {
            alert("Husk at angive navn");
            return;
        }

        if (tip_mess == "") {
            alert("Husk at angive en besked");
            return;
        }

        $.ajax({
            url: "/Home/TipFriend",
            dataType: 'json',
            data: {
                Email: tip_email,
                Name: tip_name,
                Content: tip_mess
            },
            type: "POST",
            success: function (data) {
                showInfoMessage(data);
            }
        });
    });

    $(".recommend_form2").submit(function (event) {
        event.preventDefault();

        var jq = $(this);

        var email = $("#email").val();
        var voice = $("#voice").val();

        if (email == "") {
            alert("Husk at angive e-mail");
            return;
        }
        if (voice == "" || voice.length > 180) {
            alert("Husk at angive en besked, og maks 180 tegn");
            return;
        }

        //        $("meta[name=description]").attr("content", voice);
        //        $("meta[name=keywords]").attr("content", voice);

        var template = "";
        var classes = $(".bouble_icon.selected").attr("class").split(' ');
        for (var i = 0; i < classes.length; i++) {
            var c = classes[i];
            if (c.substring(0, 6) == "bouble" && c.length == 7) {
                template = c;
            }
        }

        $.ajax({
            url: "/Home/AddQuilt",
            dataType: 'json',
            data: {
                Email: email,
                Content: voice,
                Template: template
            },
            type: "POST",
            success: function (data) {
                showInfoMessage(data);

                var o = {
                    Results: [{
                        Layout: template,
                        Message: voice
                    }]
                };

                var jq = $(tmpl(quiltTemplate, o));

                var quilt = jq.html();

                $('#container-canvas .quilt-block').each(function (i, e) {
                    $(this).find(".quilt:first").replaceWith(quilt);
                    $(this).find(".quilt:first")
                        .fadeOut(800)
                        .fadeIn(800)
                        .fadeOut(400)
                        .fadeIn(400)
                        .fadeOut(800)
                        .fadeIn(800)
                        .fadeOut(400)
                        .fadeIn(400);
                });
            }
        });
    });

    $(".download-button input").click(function (event) {
        event.preventDefault();
        //var resolution = $("#resolution").val();
        //window.open('/Home/GetWallpaper?resolution=' + resolution, '');
        window.open('/Home/GetWallpaper');
    });

    function showInfoMessage(infoMessage) {
        $("#info_box").show();
        $("#recommend_box").hide();
        $("#header").html(infoMessage.Header);
        $("#info").html(infoMessage.Info);
    }
});