﻿/// <reference path="../Scripts/jquery-1.4.1.js" />
$(document).ready(LoadPageContent);

function GenericAjax(dataVar, serviceMethod, successFunction, errorFunction) {
    var myHost = window.location.hostname;
    if (myHost == "localhost")
        myHost += ":" + window.location.port;
    var myUrl = "http://" + myHost + "/TLLService.svc/" + serviceMethod;
    $.ajax({
        type: "POST",
        url: myUrl,
        data: YAHOO.lang.JSON.stringify(dataVar),
        contentType: "application/json;charset=utf-8",
        dataType: "json",
        processdata: true,
        cache: false,
        async: true,
        success: successFunction,
        error: errorFunction
    });
}
function AjaxCallError(e) {
    alert("Error: " + e.statusText);
}
function LoadPageContent() {
    AddNewLink.newLinkStatus = false;
    LoadMainContent.viewMode = "h";
    LoadMainContent.contentType = "toplinks";
    LoadMainContent.category_id = "0";
    LoadLeftSide();
    LoadAdds();
    WireEvents();
    PrepareLinks();
}
function WireEvents() {
    $('#topLinks').click(PrepareLinks);
    $('#myLinks').click(PrepareLinks);
    $('#sharedLinks').click(PrepareLinks);
    $('#NewLink').click(ShowNewLink);
    $('#myViewMode').click(ViewModeChanged);
    $('#submitNewLink').mouseover(SubmitNewLink);
    $('#submitNewLink').click(AddNewLink);
    $('div.Links').live('mouseenter', MouseEnterOnLink);
    $('.linkIconThumb').live('mouseenter', MouseEnterOnLink);
    $('div.Links').live('mouseleave', MouseLeaveOnLink);
    $('.linkIconThumb').live('mouseleave', MouseLeaveOnLink);
    $('.LinkAction').live('click', LinkAction);
    $('#topLinks').live('click', RefreshTopLinks);
    $('#myLinks').live('click', RefreshFavoriteLinks);
    $('#sharedLinks').live('click', RefreshSharedLinks);
    $('#submitMyComment').live('click', SubmitMyComment);
    $('#submitShareLink').live('click', SubmitShareLink);
    $('#categoryShared').live('click', CategoryShareChanged);
    $('#searchStr').change(PrepareLinks);
}
function ViewModeChanged () {
    if (LoadMainContent.viewMode == "i") {
        $('#myViewModeImage').attr("src", "images/IconView.png");
        LoadMainContent.viewMode = "h";
    }
    else {
        $('#myViewModeImage').attr("src", "images/HorizontalView.png");
        LoadMainContent.viewMode = "i";
    }
    LoadMainContent(0, true);
}
function SubmitNewLink() {
    $('#submitNewLink').css("cursor", "pointer");
}
function RefreshTopLinks() {
    LoadMainContent.contentType = "toplinks";
    $('#publicCategories').css('display', '');
    $('#myCategories').css('display', 'none');
    LoadMainContent(0, false);
}
function RefreshFavoriteLinks() {
    LoadMainContent.contentType = "mylinks";
    $('#publicCategories').css('display', 'none');
    $('#myCategories').css('display', '');
    LoadMainContent(0, false);
}
function RefreshSharedLinks() {
    LoadMainContent.contentType = "sharedlinks";
    $('#publicCategories').css('display', 'none');
    $('#myCategories').css('display', 'none');
    LoadMainContent(0, false);
}
function MouseEnterOnLink() {
    var obj = $(this).children('.fadedFeatures');
    obj.fadeTo(0, 1);
}
function MouseLeaveOnLink() {
    var obj = $(this).children('.fadedFeatures');
    obj.fadeTo(0, 0);
}
function ShowNewLink() {
    if (AddNewLink.newLinkStatus)
        $('#addNewLinkDiv').hide(250);
    else {
        $('#addNewLinkDiv').show(400);
        $('#linkUrl').focus();

        var dataVar = {
            "linkKey": ''
        };
        GenericAjax(dataVar, "GetCategories", function (data) {
            var i = 0;
            var col = 0;
            var options = "<table border='0'>";
            for (i = 0; i < data.GetCategoriesResult.CategoryList.length; i++) {
                if (col == 0)
                    options += "<tr>";
                col++;
                options += "<td><input id='newLinkOption_" + i + "' type='checkbox' value='" + data.GetCategoriesResult.CategoryList[i].ID + "' " + (LoadMainContent.loadedCategory == data.GetCategoriesResult.CategoryList[i].ID ? "checked='true'" : "") + " />" + data.GetCategoriesResult.CategoryList[i].Name + "</td>";
                if (col == 4) {
                    options += "</tr>";
                    col = 0;
                }
            }
            if (col > 0)
                options += "</tr>";
            options += "</table>";
            options += "<input id='newLinkShareOptionsCount' type='hidden' value='" + data.GetCategoriesResult.CategoryList.length + "'>";
            $('#NewLinkCategories').html(options);
        }, AjaxCallError);
    }
    AddNewLink.newLinkStatus = !AddNewLink.newLinkStatus;
}
function AddNewLink() {
    var linkVal = $('#linkUrl').val();
    var commentVal = $('#linkComment').val();
    if (linkVal == '') {
        alert("Please enter a link!");
        return;
    }
    var opts = "";
    var _shareOptionsCount = $('#newLinkShareOptionsCount').val();
    var checkedCategories = 0;
    var i = 0;
    for (i = 0; i < _shareOptionsCount; i++) {
        opts += $('#newLinkOption_' + i).val() + "," + $('#newLinkOption_' + i).attr("checked") + ";";
        if ($('#newLinkOption_' + i).attr("checked"))
            checkedCategories++;
    }
    if (checkedCategories == 0) {
        alert("please select at least one cotegory to share this link!");
        return;
    }
    var dataVar = {
        "link": linkVal,
        "comments": commentVal,
        "categoryList": opts
    };
    GenericAjax(dataVar, "AddNewLink", function (data) {
        if (data.AddNewLinkResult != "")
            alert(data.AddNewLinkResult);
        else {
            LoadMainContent(0, true);
            $('#linkUrl').val("");
            $('#linkComment').val("");
            $('#NewLink').click();
        }
    }, AjaxCallError);
}
function PrepareLinks() {
    var iconName = this.id;
    if (!iconName)
        iconName = LoadMainContent.contentType;
    else if (iconName == "searchStr") {
        iconName = LoadMainContent.contentType;
        LoadMainContent(0, true);
    }
    iconName = iconName.toLowerCase();
    if (iconName != "mylinks" && iconName != "toplinks" && iconName != "sharedlinks")
        return;
    $('#myLinks').fadeTo(0, 0.3);
    $('#topLinks').fadeTo(0, 0.3);
    $('#sharedLinks').fadeTo(0, 0.3);
    if (iconName == "mylinks")
        $('#myLinks').fadeTo(200, 1);
    else if (iconName == "toplinks")
        $('#topLinks').fadeTo(200, 1);
    else if (iconName == "sharedlinks")
        $('#sharedLinks').fadeTo(200, 1);
}
function LoadLeftSide() {
    GenericAjax('{}', "GetLeftSide", function (data) {
        $('#leftPart').html(data.GetLeftSideResult);
        $('#publicCategories').css('display', 'none');
        $('#myCategories').css('display', 'none');
        if (LoadMainContent.contentType == "toplinks") {
            $('#publicCategories').css('display', '');
            $('#publicCategory_' + LoadMainContent.loadedCategory).attr('checked', true);
            RefreshTopLinks();
        }
        else if (LoadMainContent.contentType == "mylinks") {
            $('#myCategories').css('display', '');
            $('#myCategory_' + LoadMainContent.loadedCategory).attr('checked', true);
            RefreshFavoriteLinks();
        }
        else {
            RefreshSharedLinks();
        }
    }, AjaxCallError);
}
function LinkAction() {
    var obj = $(this);
    var myCommand = obj.attr('value');
    var myCommandText = myCommand.split(':')[0];
    var myCommandKey = myCommand.split(':')[1];
    switch (myCommandText) {
        case "comments":
            CommentsLink(this, myCommandKey);
            break;
        case "react":
            ReactLink(this, myCommandKey);
            break;
        case "delete":
            DeleteLink(this, myCommandKey);
            break;
        case "share":
            ShareLink(this, myCommandKey);
            break;
        case "sendto":
            SendToLink(this, myCommandKey);
            break;
        default:
            break;
    }
}
function CommentsLink(obj, linkKey) {
    if ($('#commandLinkKey').val() == linkKey && $('#commandType').val() == "comment") {
        $('#commandDiv').remove();
        return;
    }
    $('#commandDiv').remove();
    var commentContent = "<div id='commandDiv' class='CommandAction'>";
    commentContent += "<input id='commandLinkKey' type='hidden' value='" + linkKey + "'>";
    commentContent += "<input id='commandType' type='hidden' value='comment'>";
    commentContent += "your comment:<br /> <textarea id='myComment' cols='70' rows='2'></textarea>";
    commentContent += "&nbsp;&nbsp;&nbsp;";
    commentContent += "<img id='submitMyComment' style='cursor:pointer;' src='images/addlink.png' alt='add my comment' />";
    commentContent += "</div>";
    var myObject = $(obj);
    myObject.parent().parent().parent().append(commentContent);
    $('#myComment').focus();
}
function SubmitMyComment() {
    if ($('#myComment').val() == '') {
        alert('please enter a comment...');
        return;
    }
    var dataVar = {
        "linkKey": $('#commandLinkKey').val(),
        "comment": $('#myComment').val()
    };
    GenericAjax(dataVar, "AddMyComment", function (data) {
        if (data.GetMainContentResult == "login")
            window.location("login.aspx");
        else {
            if (data.AddMyCommentResult != "")
                alert(data.AddMyCommentResult);
            else {
                LoadMainContent(0, true);
            } 
        }
    }, AjaxCallError);

    $('#commandDiv').remove();
}
function ShareLink(obj, linkKey) {
    if ($('#commandLinkKey').val() == linkKey && $('#commandType').val() == "share") {
        $('#commandDiv').remove();
        return;
    }
    $('#commandDiv').remove();

    var dataVar = {
        "linkKey": linkKey
    };
    GenericAjax(dataVar, "GetCategories", function (data) {
        var i = 0;
        var col = 0;
        var options = "<table border='0'>";
        for (i = 0; i < data.GetCategoriesResult.CategoryList.length; i++) {
            if (col == 0)
                options += "<tr>";
            col++;
            options += "<td><input id='option_" + i + "' type='checkbox' value='" + data.GetCategoriesResult.CategoryList[i].ID + "' " + (data.GetCategoriesResult.CategoryList[i].IsSet ? "checked='checked'" : "") + "/>" + data.GetCategoriesResult.CategoryList[i].Name + "</td>";
            if (col == 4) {
                options += "</tr>";
                col = 0;
            }
        }
        if (col > 0)
            options += "</tr>";
        options += "</table>";
        var shareContent = "<div id='commandDiv' class='CommandAction'>";
        shareContent += "<input id='commandLinkKey' type='hidden' value='" + linkKey + "'>";
        shareContent += "<input id='commandType' type='hidden' value='share'>";
        shareContent += "<input id='shareOptionsCount' type='hidden' value='" + data.GetCategoriesResult.CategoryList.length + "'>";
        shareContent += "Please check the categories you want to share this link: <br />";
        shareContent += "<table border='0' width='100%'>";
        shareContent += "<tr>";
        shareContent += "<td width='94%'>" + options + "</td>";
        shareContent += "<td>";
        shareContent += "<img id='submitShareLink' style='cursor:pointer;' src='images/addlink.png' alt='share link' />";
        shareContent += "</td>";
        shareContent += "</tr>";
        shareContent += "</table>";
        shareContent += "</div>";
        var myObject = $(obj);
        myObject.parent().parent().parent().append(shareContent);
    }, AjaxCallError);
}
function SubmitShareLink() {
    var opts = "";
    var _shareOptionsCount = $('#shareOptionsCount').val();
    var checkedCategories = 0;
    var i = 0;
    for (i = 0; i < _shareOptionsCount; i++) {
        opts += $('#option_' + i).val()+ "," + $('#option_' + i).attr("checked") + ";";
        if ($('#option_' + i).attr("checked"))
            checkedCategories++;
    }
    if (checkedCategories == 0) {
        if (!confirm("are you sure you want to remove this link from all categories?"))
            return;
    }
    var dataVar = {
        "linkKey": $('#commandLinkKey').val(),
        "categoryList": opts
    };
    GenericAjax(dataVar, "ShareLink", function (data) {
        if (data.ShareLinkResult != "")
            alert(data.ShareLinkResult);
    }, AjaxCallError);

    $('#commandDiv').remove();
}
function ReactLink(obj, linkKey) {
    var myObject = $(obj);
}
function DeleteLink(obj, linkKey) {
    var dataVar = {
        "linkKey": linkKey
    };
    GenericAjax(dataVar, "DeleteLink", function (data) {
        if (data.DeleteLinkResult != '')
            alert(data.DeleteLinkResult);
        else {
            var _mainDiv = $(obj).parent().parent().parent().remove();
        }
    }, AjaxCallError);
}
function AddToLink(obj, linkKey) {
    var myObject = $(obj);
}
function LoadAdds() {
    GenericAjax('{}', "GetAdds", function (data) {
        $('#rightPart').html(data.GetAddsResult);
    }, AjaxCallError);
}
function LoadMainContent(startIndex, forceLoad) {
    var category_id = 0;
    if (LoadMainContent.contentType == 'toplinks')
        category_id = $('#selectedPublicCategory').val();
    else if (LoadMainContent.contentType == 'mylinks')
        category_id = $('#selectedMyCategory').val();

    if (!forceLoad && LoadMainContent.loadedContent == LoadMainContent.contentType && LoadMainContent.loadedCategory == category_id)
        return;
    if (LoadMainContent.category_id != category_id) {
        if (LoadMainContent.contentType == 'toplinks') {
            $('#cat_' + LoadMainContent.category_id).toggleClass("category", true);
            $('#cat_' + LoadMainContent.category_id).toggleClass("selectedCategory", false);

            $('#cat_' + category_id).toggleClass("category", false);
            $('#cat_' + category_id).toggleClass("selectedCategory", true);
        }
        else {
            $('#myCat_' + LoadMainContent.category_id).toggleClass("category", true);
            $('#myCat_' + LoadMainContent.category_id).toggleClass("selectedCategory", false);

            $('#myCat_' + category_id).toggleClass("category", false);
            $('#myCat_' + category_id).toggleClass("selectedCategory", true);
        }
        LoadMainContent.category_id = category_id;
    }
    var dataVar = {
        "type": LoadMainContent.contentType,
        "format": LoadMainContent.viewMode,
        "startNo": startIndex,
        "sortExpression": $('#mySortBy').val(),
        "searchStr": $('#searchStr').val(),
        "category_id": category_id
    };
    GenericAjax(dataVar, "GetMainContent", function (data) {
        if (data.GetMainContentResult == "login")
            document.location.href = '/login.aspx'
        else {
            if (startIndex == 0)
                $('#MainLinks').html(data.GetMainContentResult);
            else
                $('#extendDiv' + startIndex).html(data.GetMainContentResult);
            SetColumnSizes();
            LoadMainContent.loadedContent = LoadMainContent.contentType;
            LoadMainContent.loadedCategory = category_id;
        }
    }, AjaxCallError);
}
function SetColumnSizes() {
    var laftHeight = $('#leftPart').height();
    var centerHeight = $('#MainLinks').height() + 100;
    var rightHeight = $('#rightPart').height();
    var maxHeight = Math.max(laftHeight, centerHeight);
    maxHeight = Math.max(maxHeight, rightHeight);
    $('#leftPart').height(maxHeight);
    $('#centerPart').height(maxHeight);
    $('#rightPart').height(maxHeight);
}
function DisplayAddMyCategory() {
    if ($('#div_newCategory').css('display') != 'none') {
        $('#div_newCategory').css('display', 'none');
        return;
    }

    $('#editCategoryDiv').remove();
    var newDivExists = $('#newCategory').val();
    if (newDivExists == undefined)
    {
        var newCategoryContent = "";
        newCategoryContent += "<input type='text' id='newCategory' style='width:143px;'/>";
        newCategoryContent += "<input type='checkbox' id='categoryShared' /> share";
        newCategoryContent += "<div id='categoryGroupsDiv'></div>";
        newCategoryContent += "<div style='float:right; margin-left:5px;'><a href='javascript:AddMyCategory();' title='add' style='text-decoration: none;'><img alt=' save ' border='0' src='images/save.gif'/></a></div>";
        newCategoryContent += "<hr />";

        $('#div_newCategory').append(newCategoryContent);
        CategoryShareChanged.groupsLoaded = false;
    }
    $('#div_newCategory').css('display', '');
    $('#newCategory').focus();
}
function AddMyCategory() {
    if ($('#newCategory').val() == '') {
        alert('please enter new category name...');
        return;
    }

    var groupOpts = "";
    var _shareOptionsCount = $('#groupOptionsCount').val();
    var i = 0;
    for (i = 0; i < _shareOptionsCount; i++) {
        groupOpts += $('#groupOption_' + i).val() + "," + $('#groupOption_' + i).attr("checked") + ";";
    }

    var dataVar = {
        "categoryName": $('#newCategory').val(),
        "categoryShared": $('#categoryShared').attr('checked'),
        "shareGroupList": groupOpts
    };
    GenericAjax(dataVar, "AddCategory", function (data) {
        if (data.AddCategoryResult != "") {
            alert(data.AddCategoryResult);
            $('#newCategory').focus();
        }
        else {
            LoadLeftSide();
        }
    }, AjaxCallError);
}
function EditMyCategory(id) {
    $('#div_newCategory').css('display', 'none');
    $('#div_newCategory').html("");

    var dataVar = {
        "id": id
    };
    GenericAjax(dataVar, "GetCategory", function (data) {
        if (!data.GetCategoryResult.ID || data.GetCategoryResult.ID != id) {
            alert('system error!');
            return;
        }
        var editObj = $('#editCategoryDiv');
        if (editObj.html()) {
            var editingCategory_id = $('#editCategory_id').val();
            editObj.remove();
            if (editingCategory_id == id)
                return;
        }
        var htmlContent = "";
        htmlContent += "<div id='editCategoryDiv' class='editCategory' style='float:left; width:100%;'>";
        htmlContent += "<input id='editCategory_id' type='hidden' value='" + id + "' />";
        htmlContent += "<input type='text' id='editCategoryName' value='" + data.GetCategoryResult.Name + "' style='width:143px;' />";
        htmlContent += "<input type='checkbox' id='categoryShared' " + (data.GetCategoryResult.IsSet ? "checked='checked'" : "") + "/> share <a href='javascript:AddUserGroup();' title='add new group' style='text-decoration: none;'><img alt='add new group' border='0' src='images/group_xs.png'/></a><br />";
        htmlContent += "<div id='categoryGroupsDiv'></div>";
        htmlContent += "<div style='float:right; margin-left:5px;'><a href='javascript:DeleteCategory(" + id + ");' title='delete' style='text-decoration: none;'><img alt='delete' border='0' src='images/delete.gif'/></a></div>";
        htmlContent += "<div style='float:right; margin-left:5px;'><a href='javascript:UpdateCategory(" + id + ");' title='save'   style='text-decoration: none;'><img alt=' save ' border='0' src='images/save.gif'  /></a></div>";
        htmlContent += "<hr />";
        htmlContent += "</div>";
        $('#myCat_' + id).append(htmlContent);
        $('#editCategoryName').focus();
        CategoryShareChanged.groupsLoaded = false;
        if (data.GetCategoryResult.IsSet)
            CategoryShareChanged();
        else
            $('#categoryGroupsDiv').hide();
    }, AjaxCallError);
}
function UpdateCategory(id) {
    if ($('#editCategoryName').val() == '') {
        alert('please enter category name...');
        return;
    }

    var groupOpts = "";
    var _shareOptionsCount = $('#groupOptionsCount').val();
    var i = 0;
    for (i = 0; i < _shareOptionsCount; i++) {
        groupOpts += $('#groupOption_' + i).val() + "," + $('#groupOption_' + i).attr("checked") + ";";
    }

    var dataVar = {
        "id": id,
        "categoryName": $('#editCategoryName').val(),
        "categoryShared": $('#categoryShared').attr('checked'),
        "shareGroupList": groupOpts
    };
    GenericAjax(dataVar, "UpdateCategory", function (data) {
        if (data.UpdateCategoryResult != "") {
            alert(data.UpdateCategoryResult);
            $('#editCategoryName').focus();
        }
        else {
            LoadLeftSide();
        }
    }, AjaxCallError);
}
function DeleteCategory(id) {
    var dataVar = {
        "id": id
    };
    GenericAjax(dataVar, "DeleteCategory", function (data) {
        if (data.DeleteCategoryResult != "") {
            alert(data.DeleteCategoryResult);
            $('#editCategoryName').focus();
        }
        else {
            LoadLeftSide();
        }
    }, AjaxCallError);

}
function SwitchPublicCategory(id) {
    $('#selectedPublicCategory').val(id);
    RefreshTopLinks();
}
function SwitchMyCategory(id) {
    $('#selectedMyCategory').val(id);
    RefreshFavoriteLinks();
}
function CategoryShareChanged() {
    var isChecked = $('#categoryShared').attr("checked");
    if (!isChecked)
        $('#categoryGroupsDiv').hide();
    else {
        $('#categoryGroupsDiv').show();
        if (!CategoryShareChanged.groupsLoaded) {
            CategoryShareChanged.groupsLoaded = true;
            var category_id = $('#editCategory_id').val();
            var dataVar = {
                "category_id": category_id
            };
            GenericAjax(dataVar, "GetGroups", function (data) {
                var i = 0;
                var groupOptions = "<input type='hidden' id='groupOptionsCount' value='" + data.GetGroupsResult.GroupList.length + "'>";
                groupOptions += "<table border='0'>";
                for (i = 0; i < data.GetGroupsResult.GroupList.length; i++) {
                    groupOptions += "<tr><td><input id='groupOption_" + i + "' type='checkbox' value='" + data.GetGroupsResult.GroupList[i].ID + "' " + (data.GetGroupsResult.GroupList[i].IsSet ? "checked='checked'" : "") + "/>" + data.GetGroupsResult.GroupList[i].Name + "</td></tr>";
                }
                groupOptions += "</table>";
                $('#categoryGroupsDiv').append(groupOptions);
            }, AjaxCallError);
        }
    }
}
function AddUserGroup() {
}
