function ShowAreaMap(areaName) 
{
    $('#SingleAreaMap').attr("src", 'NewAreaMap/' + areaName + '.jpg');
    $('#SingleAreaMapDiv').dialog({width:600});
    
    $('#SingleAreaMapDiv').dialog('open');
    //$('#SingleAreaMapDiv').show();
}

function HideAreaMap(areaName) {
    //$('#SingleAreaMapDiv').hide();
    $('#SingleAreaMapDiv').dialog('close');
}

//function ShowSubmitForm(areaName) {

//    $('#SingleAreaMap').attr("src", 'maps/' + areaName + '.jpg');
//    $("#AreaName").val(areaName);
//    $("#errorMessage").text("");
//    $("#StreetLiveon").val("");
//    $("#NeighbourhoodName").val("");
//    $("#Why").val("");
//    $("#SuggestNameList").html("");
//    $("#SuggestNameList1").html("");
//    $($("#" + areaName + "Names").val().split(',')).each(function(i) {
//        //if (this.toString() != "")
//        //{
//            if (i % 2 == 0)
//            {
//                //$("#SuggestNameList").append("<div>" + $.trim(this.toString()) + "</div>");
//                $("#SuggestNameList").append("<div>" + $.trim(this.toString()) + "</div>");
//            }
//            else{
//                $("#SuggestNameList1").append("<div>" + $.trim(this.toString()) + "</div>");
//            }
//        //}
//    });
//    $('#SubmitFormDiv').dialog({
//    bgiframe: true,
//    autoOpen: false,
//    modal: true,
//    width: 600 });
//    $('#SubmitFormDiv').dialog('open');
//}

function ShowSubmitForm(areaName) {
    $('#SingleAreaMap').attr("src", 'maps/' + areaName + '.jpg');
    $("#AreaName").val(areaName);
    $("#errorMessage").text("");
    $("#StreetLiveon").val("");
    $("#NeighbourhoodName").find("option").remove();
    $("#Why").val("");
    $("#SuggestNameList").html("");
    $("#SuggestNameList1").html("");
    $($("#" + areaName + "Names").val().split(',')).each(function(i) {
        //if (this.toString() != "")
        //{
            if (i % 2 == 0)
            {
                //$("#SuggestNameList").append("<div>" + $.trim(this.toString()) + "</div>");
                $("#SuggestNameList").append("<div>" + $.trim(this.toString()) + "</div>");
            }
            else{
                $("#SuggestNameList1").append("<div>" + $.trim(this.toString()) + "</div>");
            }
        //}
        $("#NeighbourhoodName").append("<option>" + $.trim(this.toString()) + "</option>");
        //$("#NeighbourhoodName").append("<option value='" + $.trim(this.toString()) + "'>" + $.trim(this.toString()) + "</option>");
    });
    
    $('#SubmitFormDiv').dialog({
    bgiframe: true,
    autoOpen: false,
    modal: true,
    width: 600 });
    $('#SubmitFormDiv').dialog('open');
}

function ShowAreaMapForm(areaName) {
    $('#SingleAreaMap').attr("src", 'NewAreaMap/' + areaName + '.jpg');
    $('#ShowAreaMapDiv').dialog({
    bgiframe: true,
    autoOpen: false,
    modal: true,
    width: 640 });
    $('#ShowAreaMapDiv').dialog('open');
}

function ChangeSelectedArea(areaName) {
    $('#SingleAreaMap').attr("src", 'maps/' + areaName + '.jpg');
    $("#SuggestNameList").html("");
    $("#SuggestNameList1").html("");
    $("#NeighbourhoodName").find("option").remove();
    $($("#" + areaName + "Names").val().split(',')).each(function(i) {
        //if(this.toString()!="")
        //{
            if (i % 2 == 0)
            {
                //$("#SuggestNameList").append("<div>" + $.trim(this.toString()) + "</div>");
                    $("#SuggestNameList").append("<div>" + $.trim(this.toString()) + "</div>");
            }
            else{
                $("#SuggestNameList1").append("<div>" + $.trim(this.toString()) + "</div>");
            }
        //}
        $("#NeighbourhoodName").append("<option>" + $.trim(this.toString()) + "</option>");
        //$("#NeighbourhoodName").append("<option value='" + $.trim(this.toString()) + "'>" + $.trim(this.toString()) + "</option>");
    });
}

function SubmitName() {
    if (IsValidInput()) {
        $.post("nameyourneighbour.aspx",
            $("form").serialize(),
            function(data) {
                if (data == "Successful") {
                    alert("You submission is successful. Thanks for your particiption in Naming Your Neighbourhood");
                    $('#SubmitFormDiv').dialog('close');
                }
                else {
                    $("#errorMessage").text("The submission is not successful due to some technical issue, please try it again later!");
                }
            });
    }
}

function IsValidInput() {
    var isValid = true;
    $("#SubmitFormDiv").find("input").each(function(i) {
        if ($(this).attr("type") == "text" && $(this).attr("value") == "") {
            $("#errorMessage").text("Please fill information for all fields.");

            isValid = false;
        }
    });

    $("#SubmitFormDiv").find("textarea").each(function(i) {
        if ($(this).val() == "") {
            $("#errorMessage").text("Please fill information for all fields.");
            isValid = false;
        }
    });
    if (isValid)
        $("#errorMessage").text("");
    return isValid;
}

$(document).ready(function() {
    $("#navigationmenu").find("a").each(function() {

        if ($(this).attr("id") == $("#PageLink").val()) {
            $(this).find("img").attr("src", "images/" + $(this).attr("id").replace(/link/, "") + "_color.jpg");
        }
        else {
            $(this).find("img").attr("src", "images/" + $(this).attr("id").replace(/link/, "") + "_nocolor.jpg");

            $(this).bind("mouseover", function(e) {
                $(this).find("img").attr("src", "images/" + $(this).attr("id").replace(/link/, "") + "_color.jpg");
            });

            $(this).bind("mouseout", function(e) {
                $(this).find("img").attr("src", "images/" + $(this).attr("id").replace(/link/, "") + "_nocolor.jpg");
            });
        }

    });

    $(".FAQQuestion").each(function() {
        
        $(this).next().attr("style", "display:none");

        $(this).bind("mouseover", function(e) {
            $(this).next().attr("style", "display:block");
        });

        $(this).bind("mouseout", function(e) {
        $(this).next().attr("style", "display:none");
        });

    });
})

function ShowPhotos(areaName) {
    window.open("Photo_" + areaName + ".htm");
}

function ShowVideo(url){
    newwindow = window.open(url, 'name', 'width=435,height=340,left=300,top=200,resizable=yes,scrollbars=no');
    if (window.focus) {newwindow.focus()}
}