@using EnVisage.Code
@using Kendo.Mvc.UI
@model EnVisage.Models.ProjectModel
@{
    ViewBag.Title = Model.Id != Guid.Empty ? "Edit " + Model.Name : "Add New Project";
    var hasActualsAllocations = Model.TeamsUsage != null && Model.TeamsUsage.Any(t => t.Value.HasActualsResourceAllocations);
    if (Model.HasChildren && !hasActualsAllocations && Model.Parts != null && Model.Parts.Count > 0)
    {
        foreach (var part in Model.Parts)
        {
            if (part.TeamsUsage != null && part.TeamsUsage.Any(t => t.Value.HasActualsResourceAllocations))
            {
                hasActualsAllocations = true;
                break;
            }
        }
    }
    var editProjectSessionKey = Guid.NewGuid();
}
@section stylesheets
{
    @Styles.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_STYLES_KENDO_PATH, "kendo-commonstyles"))
    @Styles.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_STYLES_BASE_PATH, "prevu-projecteditstyles"))
}
@section Scripts
{
    @Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "flot-scripts"))
    @Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "kendo-grid"))
    @Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "prevu-angularservices"))
    @Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "prevu-scenariodetails"))
    @Scripts.Render(String.Format("{0}/{1}", Constants.C_BUNDLE_SCRIPTS_BASE_PATH, "prevu-projecteditpage"))

    <script type="text/javascript">
        $.validator.setDefaults({
            ignore: '.deleted .form-control, .deleted, :hidden'
        });
        emulateNavUrl = "/Project";
        var changesMade = false;
        function onDataChanged() {
            changesMade = true;
        }
        function onDataSaved() {
            changesMade = false;
        }

        var _noteDataChanged = false;
        function onNoteDataChanged() {
            _noteDataChanged = true;
        }
        function resetNoteDataChanged() {
            _noteDataChanged = false;
        }
        function isNoteDataChanged() {
            return _noteDataChanged;
        }

        function setupUnload() {
            $(window).on('beforeunload', function () {
                if (changesMade) {
                    return '@Resources.Messages.Project_Edit_UnsavedChanges';
                }
            });
        }
        init.push(function () {
            @if (Model.Id != Guid.Empty)
            {
                <text>
                setupUnload();

                $(document).on('hide.bs.modal', "div[id^='modalAddNote_']", function (e) {
                    if ($(e.target).attr('id').indexOf("modalAddNote_") < 0)
                        return true; // close modal form
                    if (typeof isNoteDataChanged === 'function')
                        if (isNoteDataChanged()) {
                            bootbox.confirm("@Resources.Messages.Note_Edit_UnsavedChanges", function (result) {
                                if (result) {
                                    if (typeof resetNoteDataChanged === 'function') {
                                        resetNoteDataChanged();
                                    }
                                    $("div[id^='modalAddNote_']").modal('hide');
                                }
                            });
                            return false; // DO NOT close modal form
                        }
                    return true; // close modal form
                });
                </text>
		    }
            var json = '@ViewBag.Statuses';
            if (json.length > 0) {
                json = json.replace(/&quot;/g, '"');
                statuses = $.parseJSON(json);
            }
            initControls('body');
            $('#input-color').minicolors({
                control: 'hue',
                position: 'bottom left',
                theme: 'bootstrap'
            });
            $(document).on('hide.bs.modal', '#createScenario', function (e) {
                // skip modal hide event from datepickers
                if ($(e.target).attr('id') !== 'createScenario')
                    return true; // close modal form
                // check that form has been changed
                if (typeof isScenarioDataChanged === 'function')
                // if form has been changed
                    if (isScenarioDataChanged()) {
                        // ask user for confirmation of form close
                        bootbox.confirm("@Resources.Messages.Scenario_Create_Confirm", function (result) {
                            if (result) {
                                if (typeof resetScenarioDataChanged === 'function') {
                                    resetScenarioDataChanged();
                                }
                                $('#createScenario').modal('hide');
                            }
                        });
                        return false; // DO NOT close modal form
                    }
                return true; // close modal form
            });
            $('#@Html.IdFor(t => t.HasChildren)').change(function () {
                if ($(this).is(':checked')) {
                    $('#detailsLegend').html('Project Part Details');
                    $('#fsProjectDetails .pm-container:gt(0)').show();
                    $('#divCopyParts').show();
                    $('#fsProjectDetails .pm-container').addClass('panel');
                    $('#fsProjectDetails .pm-container .panel-heading').show();
                    $('#fsProjectDetails .pm-container .pm-partName').removeClass('deleted');
                    $('#fsProjectDetails .pm-container .pm-partName').show();
                } else {
                    $('#detailsLegend').html('Project Details');
                    $('#fsProjectDetails .pm-container:gt(0)').hide();
                    $('#divCopyParts').hide();
                    $('#fsProjectDetails .pm-container').removeClass('panel');
                    $('#fsProjectDetails .pm-container .panel-heading').hide();
                    $('#fsProjectDetails .pm-container .pm-partName').addClass('deleted');
                    $('#fsProjectDetails .pm-container .pm-partName').hide();
                }
            });

            $("#@Html.IdFor(t => t.CompanyId)").change(loadInternalContacts);
            loadInternalContacts();
            $('.pm-container .pm-delete:eq(0)').hide();
            var tab = $.QueryString["ptab"];
            if (tab == "notes")
                $('#tabsProject a[href="#tabNotes"]').tab('show');
            else if (tab == "scenarios")
                $('#tabsProject a[href="#tabScenarios"]').tab('show');
            else if (tab == "newscenario") {
                $('#tabsProject a[href="#tabScenarios"]').tab('show');

                var scenarioToLoad = '@Model.PartForScenarioId';
                if (!scenarioToLoad) scenarioToLoad = '@Model.Id';
                loadScenario(scenarioToLoad);
            } else if (tab === 'addpart') {
                if (!$('#@Html.IdFor(t => t.HasChildren)').is(':checked')) {
                    $('#@Html.IdFor(t => t.HasChildren)').switcher('on');
                }
                addPart();
                @if (Model.Id != Guid.Empty)
                {
				    <text>
                    StartEdit('Project', '@Model.Id', "#btnDelete", "#btnsave", "erorMsgPlaceholder", '@Model.Timestamp');
                    </text>
                }
            }
            else if (tab == "history") {
                $('#tabsProject a[href="#tabHistory"]').tab('show');
            }
            else {
                    @if (Model.Id != Guid.Empty)
                    {
				        <text>
                        StartEdit('Project', '@Model.Id', "#btnDelete", "#btnsave", "erorMsgPlaceholder", '@Model.Timestamp');
                        </text>
                    }
                }
            $('#@Html.IdFor(t => t.HasChildren)').change();
            $('#fsProjectDetails .pm-container').each(function (i, obj) {
                $(obj).data('index', i);
            });
            $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
                if (e.target.hash == "#tabGeneral") {
                    @if (Model.Id != Guid.Empty)
                    {
                        <text>
                    StartEdit('Project', '@Model.Id', "#btnDelete", "#btnsave", "erorMsgPlaceholder", '@Model.Timestamp');
                    </text>
                    }
                } else {
                    StopEdit();
                    RemoveLock('Project', '@Model.Id');
                }
                @if (Model.HasChildren)
				{
					<text>
                if (e.target.hash == "#tabScenarios") {
                    resizeFreez('master-scenario-table');
                }
                </text>
				}
            });

            $('[id$=Teams].select2-container').each(function (index) {
                assignedTeams[$(this).attr('id')] = $(this).select2('val');
            });
            $('[id$=Goals].select2-container').each(function (index) {
                strategicGoals[$(this).attr('id')] = $(this).select2('val');
            });
            $('#tabGeneral').find('input[type=checkbox],input[type=text],select,textarea').not('.skip-change').on('change', function () {
                onDataChanged();
            });
            $("#scenarioslist_@Model.Id").scenarioComparer({
                compareUrl: "@Url.Action("Compare", "Scenarios")",
                minStartDate: '@Constants.MIN_SELECTABLE_DATE',
                maxEndDate: '@Constants.MAX_SELECTABLE_DATE',
            });
            $('[data-toggle="tooltip"]').tooltip({ placement: "top" });
            $('a[data-status-toggle-scenario]').scenarioStatusToggle({
                minStartDate: '@Constants.MIN_SELECTABLE_DATE',
                maxEndDate: '@Constants.MAX_SELECTABLE_DATE',
                success: function () {
                    var baseUrl = location.pathname;
                    var rUrl = baseUrl + $.query.SET("ptab", "scenarios").toString();
                    location.href = rUrl;
                },
                error: function() {
                    showErrorModal();
                },
            });
        });
        var val;
        var statuses;
        var assignedTeams = [];
        var strategicGoals = [];


        function initControls(obj) {
            $("#@Html.IdFor(model => model.Number)").autocomplete({
                source: '@Url.Action("ProjectNumberSearch", "Project")',
                minLength: 1
            });
            $(obj).find('.attachments').uploadFile({
                uploadUrl: '@Url.Action("Upload", "Attachments")',
                deleteUrl: '@Url.Action("Delete", "Attachments")',
                getContentUrl: '@Url.Action("Download", "Attachments")',
                uploadCallback: function () {
                    onDataChanged();
                },
                removeCallback: function () {
                    onDataChanged();
                }
            });
            var hasChildren = $('#@Html.IdFor(t=>t.HasChildren)').is(':checked');
            $.each($(obj).find('.pm-dependencies'), function (index, item) {
                $(item).projectDependency({
                    editCallback: function() {
                        onDataChanged();
                    },
                    removeCallback: function() {
                        onDataChanged();
                    },
                    projectId: hasChildren ? $(item).data('part-id') : $(item).data('parent-id'),
                    sessionKey: '@editProjectSessionKey',
                    minStartDate: '@Constants.MIN_SELECTABLE_DATE',
                    maxEndDate: '@Constants.MAX_SELECTABLE_DATE'
                });
            });
            $(obj).find(".datepicker").datepicker({
                autoclose: true,
                startDate: '@Constants.MIN_SELECTABLE_DATE',
                endDate: '@Constants.MAX_SELECTABLE_DATE'
            });
            $(obj).find(".forselect2").select2({
                allowClear: true
            }).on('change', function (e) {
                $(e.currentTarget).parents('form').validate().element($(e.currentTarget));
                if ($(e.currentTarget).hasClass('type')) {
                    var green = $($(e.currentTarget)[0].options[$(e.currentTarget)[0].selectedIndex]).data('green');
                    var yellow = $($(e.currentTarget)[0].options[$(e.currentTarget)[0].selectedIndex]).data('yellow');
                    var red = $($(e.currentTarget)[0].options[$(e.currentTarget)[0].selectedIndex]).data('red');
                    var greenTxt = $(e.currentTarget).parents('.panel-body').find('.ind-green');
                    var yellowTxt = $(e.currentTarget).parents('.panel-body').find('.ind-yellow');
                    var redTxt = $(e.currentTarget).parents('.panel-body').find('.ind-red');
                    if (redTxt != null && redTxt.val() != '') {
                        redTxt.val(red);
                    }
                    if (greenTxt != null && greenTxt.val() != '') {
                        greenTxt.val(green);
                    }
                    if (yellowTxt != null && yellowTxt.val() == '') {
                        yellowTxt.val(yellow);
                    }
                    reinitThresholds($(e.currentTarget), yellow, red);
                }
            });


            $(obj).find("select.pm-teams").select2({
                placeholder: "Select teams",
            });
            $(obj).find("select.int-workflowcontacts").select2({
                placeholder: "Select Workflow Contacts",
            });
            $(obj).find("select.singleforselect2").select2({

            });
            $(obj).find("select.pm-portfolio-tags").select2({
                placeholder: "Select Labels",
            }).on("select2-selecting", function (e) {
                if (e.val == "@Guid.Empty")
                    showAddTagModel(e.object.element[0].id);

            });
            $("select.pm-project-tags").select2({

                placeholder: "Select tags",
                formatSelection: function (result) {
                    var tagid = result.element[0].id;
                    return '<div id="tag_' + result.id + '" class="label label-success label-tag">' + result.text + '</div>';
                },
            }).on("select2-selecting", function (e) {
                if (e.val == "@Guid.Empty")
                    showAddTagModel(e.object.element[0].id);

            });

            $(obj).find('.slider-container').each(function (o, e) {
                var sl = $(this).slider({
                    'range': 'min',
                    'min': 0,
                    'max': 100,
                    'value': $(this).children('.sliderValue').val(),
                    change: onDependentChange,
                    slide: onDependentSlide
                });
                var txt = GetProbabText($(this).children('.sliderValue').val());
                sl.children('.sliderTitle').html($(this).find('.sliderValue').val() + '%' + txt);
            });
            $(obj).find('select.pm-status').each(function () {
                $(this).on('change', function () {
                    CheckProbability($(this));
                });
                CheckProbability($(this));
            });
            $(obj).find('.pm-revenue input.switcher').switcher({
                on_state_content: 'Yes',
                off_state_content: 'No'
            }).parent().css("width", "80px");
            $(obj).find('#@Html.IdFor(t=>t.HasChildren)').switcher({
                on_state_content: 'Yes',
                off_state_content: 'No'
            }).parent().css("width", "80px");
            if (!$(obj).is('body')) {
                var arr = [];
                var gls = [];
                var eContacts = $(obj).find("select.ext-contacts");
                var iContacts = $(obj).find("select.int-contacts");
                var sGoals = $(obj).find("select.pm-goals");

                if (eContacts.length > 0 && eContacts.val() != null && eContacts.val().length > 0)
                    arr = arr.concat(eContacts.val());
                $(obj).parents('.pm-container').data('ecurrentContacts', arr);
                if (iContacts.length > 0 && iContacts.val() != null && iContacts.val().length > 0)
                    arr = arr.concat(iContacts.val());
                $(obj).parents('.pm-container').data('icurrentContacts', arr);
                if (sGoals.length > 0 && sGoals.val() != null && sGoals.val().length > 0)
                    gls = gls.concat(sGoals.val());
                $(obj).parents('.pm-container').data('icurrentGoals', gls);
            } else {
                $('.pm-container').each(function () {
                    var eContacts = $(this).find("select.ext-contacts");
                    var iContacts = $(this).find("select.int-contacts");
                    var sGoals = $(this).find("select.pm-goals");
                    var arr = [];
                    var gls = [];
                    if (eContacts.length > 0 && eContacts.val() != null && eContacts.val().length > 0)
                        arr = arr.concat(eContacts.val());
                    $(this).data('ecurrentContacts', arr);
                    if (iContacts.length > 0 && iContacts.val() != null && iContacts.val().length > 0)
                        arr = arr.concat(iContacts.val());
                    $(this).data('icurrentContacts', arr);
                    if (sGoals.length > 0 && sGoals.val() != null && sGoals.val().length > 0)
                        gls = gls.concat(sGoals.val());
                    $(this).data('icurrentGoals', gls);
                });
            }
            $(obj).find("select.pm-clientId").each(function () {
                $(this).change(loadExternalContacts);
                loadExternalContacts($(this));
            });
            $(obj).find('.pm-threshold input.switcher').switcher({
                on_state_content: 'Yes',
                off_state_content: 'No'
            }).parent().css("width", "80px");

            // SA. ENV-789
            $(obj).find("div.row.pm-partName").find("input").each(function () {
                $(this).on("keyup", function () { partNameChanged(this); });
                $(this).on("blur", function () { partNameChanged(this); });
                partNameChanged(this);
            });

            loadInternalContacts();

            var expandedProjectPartId = '@(Model.ExpandedPartId.HasValue && !Model.ExpandedPartId.Value.Equals(Guid.Empty) ?
              Model.ExpandedPartId.Value.ToString("N") : String.Empty)';

            if (expandedProjectPartId && (expandedProjectPartId.length > 0) && (obj == "body")) {
                // expand the given project part
                expandProjectPart(expandedProjectPartId);
            }

            // Slider now is initalizing within $(obj) container
            $(obj).find(".threshold-container").each(function (i, o) {
                var parent = $(o);
                var valRed = parseFloat(parent.find("input[id*='@Html.IdFor(model=>model.PerformanceRedThreshold)']").val());
                var valYellow = parseFloat(parent.find("input[id*='@Html.IdFor(model=>model.PerformanceYellowThreshold)']").val());

                var classification = parent.parent().parent().parent().parent().parent().find("select.type").find(":selected");
                if (isNaN(valRed) || isNaN(valYellow)) {
                    valYellow = (classification.attr('data-yellow') == null || classification.attr('data-yellow') == '') ? 25 : classification.attr('data-yellow');
                    valRed = (classification.attr('data-red') == null || classification.attr('data-red') == '') ? 50 : classification.attr('data-red');
                    updatePerformanceThreshold(parent, valYellow, valRed);
                }
                parent.find(".amount-yellow").text(valYellow + '%');
                parent.find(".amount-red").text(valRed + '%');

                parent.find(".slider-range").slider({
                    range: true,
                    min: 0,
                    max: 100,
                    values: [valYellow, valRed],
                    slide: function (event, ui) {
                        onDataChanged();
                        var yellowVal = parseFloat(ui.values[0]);
                        var redVal = parseFloat(ui.values[1]);
                        var parent = $(event.target).parent().parent();
                        parent.find(".amount-yellow").text(yellowVal + '%');
                        parent.find(".amount-red").text(redVal + '%');
                        console.log(ui.values[1] + '%');
                        parent.find('.slider-red-strip').css('width', 100 - redVal + '%'); // SA. ENV-959. Fixed bug
                        updatePerformanceThreshold(parent, yellowVal, redVal);
                    }
                }).append('<div class="slider-red-strip" style="width: ' + (100 - valYellow) + '%"></div>');
            });

            $('.pm-threshold').change(function () {
                var parent = $(this).parent().parent();
                if ($(this).find("[id*='UseThreshold']").is(':checked')) {
                    parent.find(".threshold-container").show();
                } else { parent.find(".threshold-container").hide(); }
            });
            //project part links start
            var lb = $(obj).find(".Linkinput-button");
            $(lb).each(function () {
                var dsid = $(this).attr('dataid');
                var dsCntl = $("." + dsid);
                var ds = jQuery.parseJSON($(dsCntl).val());
                initLinkGrid($(this).attr('id'), ds);
            });

            initHistoryTab();

            //project part links end
        }

        function reinitThresholds(parent, yellowVal, redVal) {
            if (redVal == 0 || yellowVal == 0) {
                yellowVal = 25;
                redVal = 50;
            }
            var threshold = parent.parent().parent().parent().parent().find(".slider-range");
            threshold.slider({ values: [yellowVal, redVal], }).find(".slider-red-strip").css("width", (100 - redVal) + "%");
            threshold.parent().find(".amount-yellow").text(yellowVal + '%');
            threshold.parent().find(".amount-red").text(redVal + '%');
            updatePerformanceThreshold(threshold.parent(), yellowVal, redVal);
        }

        function updatePerformanceThreshold(parent, yellowVal, redVal) {
            parent.find("input[id*='@Html.IdFor(model=>model.PerformanceYellowThreshold)']").val(yellowVal);
            parent.find("input[id*='@Html.IdFor(model=>model.PerformanceRedThreshold)']").val(redVal);
        }

        function CheckProbability(statusField) {
            var value = $(statusField).val();

            var probability = false;
            for (var i = 0; i < statuses.length; i++) {
                if (statuses[i].Id === value) {
                    probability = statuses[i].Probability100;
                    break;
                }
            }
            var sldr = $(statusField).parents('.pm-container').find('.slider-container');
            sldr.slider({ 'disabled': probability });
            if (probability)
                sldr.slider({ 'value': 100 });
        }

        function onProjectSave(moveNext) {
            var confirmMessage = 'All the resources from removed teams will be unassigned, do you want to proceed?';
            @if (hasActualsAllocations)
            {
                <text>
                confirmMessage = 'All the resources from removed teams will be unassigned, but we cannot remove teams that already have actuals data in this Project so they will remain assigned to the Project. Do you want to proceed?';
                </text>
            }
            BuildLinkFieldsForReturn();
            if (teamsUnassigned()) {
                bootbox.confirm(confirmMessage, function (result) {
                    if (result) {
                        if ($('#frmEditProject').valid())
                            blockUI();
                        $('#@Html.IdFor(t => t.SaveAsCopy)').val(false);
                        $('#@Html.IdFor(t => t.ContinueToScenarios)').val(moveNext == true);
                        onDataSaved();
                        $('#frmEditProject').submit();
                    }
                });
                return false;
            }
            else {
                if ($('#frmEditProject').valid())
                    blockUI();
                $('#@Html.IdFor(t => t.SaveAsCopy)').val(false);
                $('#@Html.IdFor(t => t.ContinueToScenarios)').val(moveNext == true);
                onDataSaved();
                return true;
            }
        }

        function teamsUnassigned() {
            var result = false;
            $('[id$=Teams].select2-container').each(function (index) {
                var oldAssignments = assignedTeams[$(this).attr('id')];
                if (oldAssignments) {
                    var newAssignments = $(this).select2('val');
                    oldAssignments.forEach(function (entry) {
                        if ($.inArray(entry, newAssignments) < 0) {
                            result = true;
                            return;
                        }
                    });
                }
            });
            return result;
        }

        function createCopy() {
            if ($('#frmEditProject').valid())
                blockUI();
            $('#@Html.IdFor(t => t.SaveAsCopy)').val(true);
            BuildLinkFieldsForReturn();
            onDataSaved();
            $('#frmEditProject').submit();
            return true;
        }

        function onDependentSlide(event, ui) {
            var value = parseInt(ui.value);
            var txt = GetProbabText(value);
            $(this).children(".sliderValue").val(value);
            $(this).children(".sliderTitle").html(value + '%' + txt);
        }

        function onDependentChange(event, ui) {
            var value = parseInt(ui.value);
            var txt = GetProbabText(value);
            $(this).children(".sliderValue").val(value);
            $(this).children(".sliderTitle").html(value + '%' + txt);
        }

        function GetProbabText(value) {
            var txt = '';
            if (value > 0 && value <= 25)
                txt = " (Low)";
            if (value > 25 && value <= 75)
                txt = " (Medium)";
            if (value > 75 && value <= 99)
                txt = " (High)";
            if (value == 100)
                txt = " (Expected)";
            return txt;
        }

        function loadExternalContacts(obj) {
            var selClient = obj.target == null ? $(obj) : $(obj.target);
            var extContacts = selClient.parents('.pm-container').find('select.ext-contacts');
            $.ajax({
                url: "@Url.Action("LoadExternalContacts", "Project")",
                data: { clientId: selClient.val(), selectControlId: selClient.prop("id") },
                success: function (dt) {
                    var data = dt.contacts;
                    var markup = "<option value=''></option>";
                    for (var i = 0; i < data.length; i++) {
                        markup += "<option value=" + data[i].Id + ">" + data[i].FirstName + " " + data[i].LastName + "</option>";
                    }
                    extContacts.html(markup);
                    extContacts.select2("val", $("#" + dt.selectControlId).parents('.pm-container').data('ecurrentContacts'));
                },
                error: function (reponse) {
                    showErrorModal('Error.', reponse);
                }
            });
        }

        function loadInternalContacts() {
            $.ajax({
                url: "@Url.Action("LoadInternalContacts", "Project")",
                data: { companyId: $("#@Html.IdFor(t => t.CompanyId)").val(), selectControlId: $("#@Html.IdFor(t => t.CompanyId)").prop("id") },
                success: function (dt) {
                    var data = dt.contacts;
                    var markup = "<option value=''></option>";
                    for (var i = 0; i < data.length; i++) {
                        markup += "<option value=" + data[i].Id + ">" + data[i].FirstName + " " + data[i].LastName + "</option>";
                    }
                    $("select.int-contacts").each(function () {
                        $(this).html(markup);
                        $(this).select2("val", $(this).parents('.pm-container').data('icurrentContacts'));
                    });
                },
                error: function (reponse) {
                    showErrorModal('Error.', reponse);
                }
            });
            $.ajax({
                url: "@Url.Action("LoadCompanyGoals", "Project")",
                data: { companyId: $("#@Html.IdFor(t => t.CompanyId)").val(), selectControlId: $("#@Html.IdFor(t => t.CompanyId)").prop("id") },
                success: function (dt) {
                    var data = dt.goals;
                    var markup = "<option value=''></option>";
                    for (var i = 0; i < data.length; i++) {
                        markup += "<option value=" + data[i].Value + ">" + data[i].Text + "</option>";
                    }
                    $("select.pm-goals").each(function () {
                        $(this).html(markup);
                        $(this).select2("val", $(this).parents('.pm-container').data('icurrentGoals'));
                    });
                },
                error: function (reponse) {
                    showErrorModal('Error.', reponse);
                }
            });
        }

        $('#btnAddNote').click(function () {
            $('.divForCreate_@Model.Id').load('@Url.Action("AddNote", "Project", new { Model.Id })', function () {
                $('#btnSaveNote').click(function () {
                    if ($(this).parents('form').valid())
                        blockUI();
                });
                $(".innerForm input").removeData("validator");
                $(".innerForm input").removeData("unobtrusiveValidation");
                $.validator.unobtrusive.parseDynamicContent('.innerForm');
            });
            $('#modalAddNote_@Model.Id').modal("show");
        });

        function editNote(id) {
            if (id == null || id == "")
                return "";
            var text = "@Url.Action("EditNote", "Project", new { Id = "JSVar" })";
            text = text.replace("JSVar", id);
            $('.divForCreate_@Model.Id').load(text, function () {
                $("div[id^='modalAddNote_']").find('input[type=checkbox],input[type=text],select,textarea').on("change", function () {
                    if (typeof onNoteDataChanged === 'function')
                        onNoteDataChanged();
                });
                $('#btnSaveNote').click(function () {
                    if ($(this).parents('form').valid())
                        blockUI();
                });
                $(".innerForm input").removeData("validator");
                $(".innerForm input").removeData("unobtrusiveValidation");
                $.validator.unobtrusive.parseDynamicContent('.innerForm');
            });
            $('#modalAddNote_@Model.Id').modal("show");
        }

        function deleteNote(Id) {
            if (Id == null || Id == "")
                return "";
            bootbox.confirm({
                message: "Are you sure you want to delete this note?",
                callback: function (result) {
                    if (result) {
                        var text = "@Url.Action("DeleteNote", "Project", new { Id = "JSVar" })"
                        text = text.replace("JSVar", Id);
                        blockUI();
                        $('.divForCreate_@Model.Id').load(text, function (response, status, xhr) {
                            unblockUI();
                            if (status == "error") {
                                showErrorModal('Loading error', 'We are sorry but there was an error, please try again later.');
                            } else {
                                if (window.URI) {
                                    window.location = URI(window.location.href).setQuery("ptab", "notes");
                                } else
                                    window.location.reload();
                            }
                        });
                    }
                },
                className: "bootbox-sm"
            });
        }

        //fix modal force focus
        $.fn.modal.Constructor.prototype.enforceFocus = function () {
            var that = this;
            $(document).on('focusin.modal', function (e) {
                if ($(e.target).hasClass('select2-input')) {
                    return true;
                }

                if (that.$element[0] !== e.target && !that.$element.has(e.target).length) {
                    that.$element.focus();
                }
            });
        };

        function loadScenario(projectId) {
            var url = "?Id=" + projectId;
            $('#reloadForm').load('@Url.Action("LoadScenario", "Scenarios")' + url, function () {
                initScenario();
                $('#createScenario').modal('show');
            });
        }

        function addPart() {
            onDataChanged();
            var index = parseInt($('#@Html.IdFor(t => t.PartsCount)').val());
            var postData = {
                ParentProjectId: $('#@Html.IdFor(t => t.Id)').val(),
                count: index
            };
            if ($('#chkCopyPartDetails').is(':checked')) {
                var lastPanel = $('.pm-container:not(.deleted)').last();
                postData = {
                    ParentProjectId: $('#@Html.IdFor(t => t.Id)').val(),
                    TypeId: lastPanel.find('.pm-type select').val(),
                    ClientId: lastPanel.find('select.pm-clientId').val(),
                    CompanyId: $("#@Html.IdFor(t => t.CompanyId)").val(),
                    Deadline: lastPanel.find('.pm-deadline input').val(),
                    StatusId: lastPanel.find('select.pm-status').val(),
                    Probability: lastPanel.find('.pm-probability input').val(),
                    IsRevenueGenerating: lastPanel.find('.pm-revenue input').is(':checked'),
                    Priority: lastPanel.find('.pm-priority input').val(),
                    PortfolioTags: lastPanel.find('select.pm-portfolio-tags').val(),
                    ProjectTags: lastPanel.find('select.pm-project-tags').val(),
                    Details: lastPanel.find('.pm-details textarea').val(),
                    AssignedTeams: lastPanel.find('select.pm-teams').val(),
                    StrategicGoals: lastPanel.find('select.pm-goals').val(),
                    InternalContacts: lastPanel.find('select.int-contacts').val(),
                    ExternalContacts: lastPanel.find('select.ext-contacts').val(),
                    UseThreshold: lastPanel.find('input[id$=UseThreshold]').val(),
                    PerformanceRedThreshold: lastPanel.find('input[id$=PerformanceRedThreshold]').val(),
                    PerformanceYellowThreshold: lastPanel.find('input[id$=PerformanceYellowThreshold]').val(),
                    WorkFlowContacts: lastPanel.find('select.int-workflowcontacts').val(),
                    count: index
                };
            }
            $('#fsProjectDetails .pm-container .panel-title a').addClass('collapsed');
            $('#fsProjectDetails .pm-container .panel-collapse').removeClass('in');
            $.post('@Url.Action("AddPart", "Project")', postData, function (html) {
                var pattern = new RegExp(' id="', "gi");
                html = html.replace(pattern, ' id="Parts_' + index + '__', 'gi');
                pattern = new RegExp(' name="', "gi");
                html = html.replace(pattern, ' name="Parts[' + index + '].', 'gi');
                pattern = new RegExp(' data-toggle="collapse" data-target="#', "gi");
                html = html.replace(pattern, ' data-toggle="collapse" data-target="#Parts_' + index + '__', 'gi');
                pattern = new RegExp(' data-valmsg-for="', "gi");
                html = html.replace(pattern, ' data-valmsg-for="Parts[' + index + '].', 'gi');
                html = html.replace('showAddTagModel(\'PortfolioTags\'', 'showAddTagModel(\'Parts_' + index + '__PortfolioTags\'', 'gi');
                html = html.replace('showAddTagModel(\'ProjectTags\'', 'showAddTagModel(\'Parts_' + index + '__ProjectTags\'', 'gi');

                // SA. ENV-502. Attachments
                pattern = new RegExp('data-uf-name-template="Attachments"', "gi");
                html = html.replace(pattern, ' data-uf-name-template="Parts[' + index + '].Attachments"', 'gi');

                $(html).appendTo($('#fsProjectDetails'));
                $.validator.unobtrusive.parseDynamicContent($('#frmEditProject'));
                $('#fsProjectDetails .pm-container:eq(' + index + ')').data('index', index);
                $('#@Html.IdFor(t => t.PartsCount)').val(index + 1);
                initControls($('#Parts_' + index + '__Id_projectPart'));
                //hide "has parts" switcher
                $('#@Html.IdFor(t => t.HasChildren)').parent().parent().parent().hide();

            }).error(function (h, e) {
                console.log("h = " + h);
                console.log("e = " + e);
            });
        }

        function removePart(obj) {
            onDataChanged();
            var container = $(obj).parents('.pm-container');
            var index = container.data('index');
            container.find('#Parts_' + index + '__DeletedPart').val('True');
            container.addClass('deleted');
            container.hide();
            return false;
        }

        function partNameChanged(partNameInput) {
            var labelText = "Part Details";

            if (partNameInput.value && partNameInput.value.trim().length > 0)
                labelText = partNameInput.value.trim() + " - Details";

            var projectPartPanel = $(partNameInput).parents("div.panel.pm-container");

            if (projectPartPanel) {
                var partNameBlock = $(projectPartPanel).find("span.panel-title.ui-expander").children("a").children("span.partTitle");
                $(partNameBlock).text(labelText);
            }
        }

        function expandProjectPart(partId) {
            // Collapse all exeisting project parts
            $('#fsProjectDetails .pm-container .panel-title a').addClass('collapsed');
            $('#fsProjectDetails .pm-container .panel-collapse').removeClass('in');

            var partContainerId = "p_" + partId;
            $('#fsProjectDetails .pm-container#' + partContainerId + ' .panel-title a').removeClass('collapsed');
            $('#fsProjectDetails .pm-container#' + partContainerId + ' .panel-collapse').addClass('in');
        }

        //tag section start
        function showAddTagModel(newId, tagtype) {
            var url = "?Id=@Guid.Empty&TagType=" + tagtype;
            $('#creatTagModal').load('@Url.Action("Edit", "Tag")' + url, function () {
                initTag(TagCreated, newId);
                $('#createTag').modal('show');
            });
        }
        function TagCreated(data, partId) {
            $('#createTag').modal('hide');
            unblockUI();

            if (data) {
                if (data.Success) {
                    if (data.TagType > 1) {

                        $("#" + partId).append($("<option id=" + data.Id + "></option>")
                        .attr("value", data.Id)
                        .text(data.TagName)
                         .attr("selected", "selected")).change();
                    }
                    else {
                        $("#" + partId).append($("<option id=" + data.Id + "></option>")
                     .attr("value", data.Id)
                     .text(data.TagName)
                      .attr("selected", "selected"));
                    }
                } else {
                    showErrorModal('Error.', data.StatusMessage);
                }
            }
            $("#" + partId).change();
        }
        //tag section end
        //link section start
        function initLinkGrid(toolBarId, data) {

            var gridId = $("#" + toolBarId).attr("gridId");

            var ds = {
                data: data,
                pageSize: 10,
                schema: {
                    model: {
                        fields: {
                            Id: { type: 'string', editable: false, hidden: true, nullable: true },
                            Name: { type: 'string' },
                            IsNew: { type: 'bool', editable: false, hidden: true, nullable: true },
                            Link: {
                                type: 'string', width: 900, validation: {
                                    required: true
                                    //linkvalidation: function (input) {
                                    //    if (input.is("[name='Link']") && input.val() != "") {
                                    //        input.attr("data-linkvalidation-msg", "Please enter a valid URL link");
                                    //        return /^(http|https)?:/.test(input.val());
                                    //    }

                                    //     return true;
                                    // }
                                }
                            }
                        }
                    }
                }

            };
            var grid = $("." + gridId).kendoGrid({
                dataSource: ds,
                scrollable: false,
                selectable: false,
                dataBound: function (e) {
                    var grid = e.sender;

                    if (grid.dataSource.total() == 0) {
                        //Hide grid
                        $("#" + grid.element[0].id).hide();
                    }
                    else {
                        //Show grid
                        $("#" + grid.element[0].id).show();
                    }
                },
                editable: "inline",

                edit: function (e) {
                    if (e.model.isNew()) {

                        var title = $(e.container).parent().find(".k-window-title");
                        var update = $(e.container).parent().find(".k-grid-update");
                        var cancel = $(e.container).parent().find(".k-grid-cancel");
                        var lable = $("label[for='Name']")
                        $(lable).text("Name");
                        $(update).text("Add Link");
                        e.container.data("kendoWindow").title("Add Link ");
                        onDataChanged();
                    }
                },
                pageable: false,
                columns: [
                { field: "Name", title: "Link", template: '<a href="#=Link#" target="_blank" >#=Name#</a>' },
                { field: "Link", width: 900, hidden: true },
                {
                    command: [{
                        name: "Delete", removeClass: "k-button", addClass: "kendo-delete-button", click: function (e) {
                            e.preventDefault();
                            var dataItem = this.dataItem($(e.target).closest("tr"));
                            bootbox.confirm("Are you sure want to remove the link?", function (result) {
                                if (result) {
                                    var dataSource = $("." + gridId).data("kendoGrid").dataSource;
                                    dataSource.remove(dataItem);
                                    dataSource.sync();
                                    onDataChanged();
                                }
                            });
                        }
                    }], title: "Actions"
                }
                ]
            }).data("kendoGrid");



            $("#" + toolBarId).on("click", function () {
                var gridId = $(this).attr("gridId")
                var grid = $("." + gridId).data("kendoGrid");
                grid.options.editable = "popup";
                grid.addRow();
                grid.options.editable = "inline";
            });

        }

        function BuildLinkFieldsForReturn() {

            $('.Linkinput-button').each(function (index, item) {
                var projectPartPanel = $(item).parents(".links");
                var gridId = $(item).attr("gridId");
                var data = $("." + gridId).data().kendoGrid.dataSource.view();
                var i;
                var nameElement = $(item).attr('data-uf-link-name-template');
                for (i = 0; i < data.length; ++i) {
                    var Id = data[i].Id;
                    var isNew = data[i].IsNew;
                    if (isGuidEmpty(Id)) {
                        Id = Math.uuid();
                        isNew = true;
                    }
                    var LinkContainer = $('<div data-uf-link="' + Id + '"/>').appendTo(projectPartPanel);
                    $('<input type="hidden" name="' + nameElement + '[' + i + '].Id" data-uf-link-id value="' + Id + '">').appendTo(LinkContainer);
                    $('<input type="hidden" name="' + nameElement + '[' + i + '].Name" data-uf-link-name value="' + data[i].Name + '">').appendTo(LinkContainer);
                    $('<input type="hidden" name="' + nameElement + '[' + i + '].Link" data-uf-link-Link value="' + data[i].Link + '">').appendTo(LinkContainer);
                    $('<input type="hidden" name="' + nameElement + '[' + i + '].IsNew" data-uf-link-isnew value="' + isNew + '">').appendTo(LinkContainer);
                }
            });




        }
        var offsetMiliseconds = new Date().getTimezoneOffset() * 60000;
        function initHistoryTab() {
            jQuery("#projectHistoryGrid").kendoGrid(
            {
                "columns": [
                    {
                        "title": "Date",
                        "headerAttributes": { "data-field": "DateCreated", "data-title": "Date" },
                        "field": "DateCreated",
                        "format": "{0:MM/dd/yyyy HH:mm:ss}",
                        "encoded": true
                    },
                    {
                        "title": "Area",
                        "headerAttributes": { "data-field": "Area", "data-title": "Area" },
                        "field": "Area",
                        "sortable": false,
                        "encoded": true
                    },
                    {
                        "title": "User",
                        "headerAttributes": { "data-field": "UserName", "data-title": "User" },
                        "field": "UserName",
                        "sortable": false,
                        "encoded": true
                    },
                    {
                        "title": "Change Summary",
                        "headerAttributes": { "data-field": "EventDetails", "data-title": "Change Summary" },
                        "field": "EventDetails",
                        "sortable": false,
                        "encoded": true
                    },
                    {
                        "title": "Old Value",
                        "template": '<div title="#=(Comment||"")#">#=data.OldValue||""#</div>'
                    },
                    {
                        "title": "New Value",
                        "template": '<div title="#=(Comment||"")#">#=data.NewValue||""#</div>'
                    }
                ],
                "pageable": {
                    "autoBind": false,
                    "pageSizes": [20, 50, 100],
                    "buttonCount": 10
                },
                "sortable": true,
                "resizable": true,
                "reorderable": true,
                "scrollable": false,
                "noRecords": true,
                "messages": { "noRecords": "Event list is empty" },
                "autoBind": false,
                "dataSource": {
                    "type": "aspnetmvc-ajax",
                    "transport": {
                        "read": {
                            "url": "@Url.Action("GetProjectEvents", "Project")",
                            "data": getEntityId,
                            "type": "POST"
                        }
                    },
                    "pageSize": 20,
                    "page": 1,
                    "total": 0,
                    "serverPaging": true,
                    "serverSorting": true,
                    "schema": {
                        "model": {
                            "fields": {
                                "DateCreated": { "type": "date" },
                                "Area": { "type": "string" },
                                "UserName": { "type": "string" },
                                "EventDetails": { "type": "string" },
                                "OldValue": { "type": "string" },
                                "NewValue": { "type": "string" }
                            }
                        },
                        data: "Content.Data.Data", // records are returned in the "data" field of the response
                        total: "Content.Data.Total" // total number of records is in the "total" field of the response
                    },
                    requestEnd: function (e) {
                        var rows = e.response.Content.Data.Data;
                        for (var i = 0; i < rows.length; i++) {
                            rows[i].DateCreated = rows[i].DateCreated.replace(/\d+/,
                                function (n) {
                                    return parseInt(n) - offsetMiliseconds
                                }
                            );
                        }
                    }
                }
            });
        }

        function getEntityId(options) {
            return { entityId: '@Model.Id' };
        }

        function historyGreedDataRead() {
            var historyGrid = $("#projectHistoryGrid").data("kendoGrid");
            historyGrid.dataSource.read();
        }

        $(document).ready(function () {
            $("#tabsProject #historyTab").on("click", function () {
                historyGreedDataRead();
            });
        });

        //link section end
    </script>
}

<style type="text/css">
    div.threshold-container .ui-slider {
        background: green;
    }

    div.threshold-container .ui-slider-range {
        background: #ffd800;
    }

    div.threshold-container .slider-red-strip {
        float: right;
        height: 100%;
        background: red;
        border-radius: 0 4px 4px 0;
    }

    .pm-tag-label {
        margin-bottom: 3px !important;
    }

    .k-grid-Delete {
        background: none !important;
        border: none !important;
        color: #205f82 !important;
    }

        .k-grid-Delete:hover {
            background: none !important;
            border: none !important;
            color: #205f82 !important;
            text-align: center !important;
        }

    .k-alt {
        background-color: transparent !important;
    }
</style>

<div id="erorMsgPlaceholder"></div>
<div class="panel-body">
    <ul id="tabsProject" class="nav nav-tabs">
        <li class="active">
            <a href="#tabGeneral" data-toggle="tab">Project<span class="badge badge-primary"></span></a>
        </li>
        <li style="@(Model.Id != Guid.Empty ? "" : "display:none")">
            <a href="#tabScenarios" data-toggle="tab">Scenarios<span class="badge badge-primary"></span></a>
        </li>
        <li style="@(Model.Id != Guid.Empty ? "" : "display:none")">
            <a href="#tabNotes" data-toggle="tab">Notes<span class="badge badge-primary"></span></a>
        </li>
        <li style="@(Model.Id != Guid.Empty ? "" : "display:none")">
            <a href="#tabHistory" data-toggle="tab" id="historyTab">History<span class="badge badge-primary"></span></a>
        </li>
    </ul>
    <div class="tab-content no-padding tab-content-bordered">
        <div class="tab-pane fade in active" id="tabGeneral">

            @using (Html.BeginForm("Edit", "Project", FormMethod.Post, new { @class = "form-horizontal", id = "frmEditProject" }))
            {
                <div class="panel-body">
                    @Html.AntiForgeryToken()
                    @Html.HiddenFor(model => model.Id)
                    @Html.HiddenFor(model => model.PartForScenarioId)
                    @Html.HiddenFor(model => model.SaveAsCopy)
                    @Html.HiddenFor(model => model.ContinueToScenarios)
                    @Html.HiddenFor(model => model.PartsCount)
                    @Html.HiddenFor(model => model.InitialHasChildrenState)
                    <fieldset id="fsProjectGeneral" class="form-group-margin">
                        <legend class="text-bold small-bottom-margin">General Project Information</legend>
                        <div class="row">
                            <div class="col-sm-7 col-lg-5">
                                <div class="form-group no-margin-hr">
                                    @Html.LabelFor(model => model.Name, new { @class = "control-label" })
                                    @Html.TextBoxFor(model => model.Name, new { @class = "form-control input-required", id = "IDDDD" })
                                    @Html.ValidationMessageFor(model => model.Name)
                                </div>
                            </div>
                            <div class="col-sm-5 col-lg-4">
                                <div class="form-group no-margin-hr">
                                    @Html.LabelFor(model => model.Number, new { @class = "control-label text-normal text-italic" })
                                    @Html.TextBoxFor(model => model.Number, new { @class = "form-control" })
                                    @Html.ValidationMessageFor(model => model.Number)
                                </div>
                            </div>
                            <div class="clearfix hidden-xs hidden-lg visible-sm-block visible-md-block"></div>
                            <div class="col-sm-5 col-lg-3">
                                <div class="form-group no-margin-hr">
                                    @Html.LabelFor(model => model.Color, new { @class = "control-label text-normal text-italic" })
                                    @Html.TextBoxFor(model => model.Color, new { @class = "form-control", @id = "input-color" })
                                    @Html.ValidationMessageFor(model => model.Color)
                                </div>
                            </div>
                            <div class="clearfix hidden-xs hidden-sm hidden-md visible-lg-block"></div>
                            <div class="col-sm-7 col-lg-4">
                                <div class="form-group no-margin-hr">
                                    @Html.LabelFor(model => model.CompanyId, new { @class = "control-label" })
                                    @Html.DropDownListFor(model => model.CompanyId, Utils.GetAllCompanies(true), new { @class = "form-control forselect2 input-required" })
                                    @Html.ValidationMessageFor(model => model.CompanyId)
                                </div>
                            </div>
                            <div class="clearfix hidden-xs hidden-lg visible-sm-block visible-md-block"></div>
                            <div class="col-sm-3 col-lg-3" @(Model.Id != Guid.Empty && Model.HasChildren ? "style=display:none;" : string.Empty)>
                                <div class="form-group no-margin-hr switcher-block">
                                    @Html.LabelFor(model => model.HasChildren, new { @class = "control-label text-normal text-italic" })
                                    @Html.CheckBoxFor(model => model.HasChildren, new { @class = "switcher form-control" })
                                    @Html.ValidationMessageFor(model => model.HasChildren)
                                </div>
                            </div>
                            @if (Model.ShowProjectDates)
                            {
                                <div class="col-sm-9 col-lg-5">
                                    <label class="control-label">Project Dates</label>
                                    <div class="input-daterange input-group">
                                        <div class="input-daterange input-group date floatdaterange">
                                            @Html.TextBoxFor(model => model.ProjectMinStartDate, new { @class = "form-control", disabled = "disabled" })
                                        </div>
                                        <div class="pull-left floatdaterange-addon">To</div>
                                        <div class="input-daterange input-group date floatdaterange" id="scenario-calendar-endDate">
                                            @Html.TextBoxFor(model => model.ProjectMaxEndDate, new { @class = "form-control", disabled = "disabled" })
                                        </div>
                                    </div>
                                </div>
                            }
                        </div>
                    </fieldset>
                    <fieldset id="fsProjectDetails">
                        <legend class="text-bold small-bottom-margin" id="detailsLegend">Project Details</legend>
                        @Html.EditorFor(t => t.Parts)
                    </fieldset>
                    @{
                        if (Model.UserDefinedFields == null)
                        {
                            Model.UserDefinedFields = new List<EnVisage.Models.UDFValueCollection>();
                        }
                    }
                    @if (Model.UserDefinedFields.Count > 0)
                    {
                        <fieldset id="fsProjectUDFs">
                            <legend class="text-bold small-bottom-margin" id="detailsUdfLegend">User Defined Fields</legend>
                            <div class="row">
                                @Html.EditorFor(t => t.UserDefinedFields)
                            </div>
                        </fieldset>
                    }
                    @Html.ValidationSummary(false, "The project could not be saved due to the following errors:")

                    @if (Model == null || Model.Id == Guid.Empty)
                    {
                        <div class="alert alert-info">
                            <button type="button" class="close" data-dismiss="alert">×</button>
                            <strong>Please note!</strong> System will automatically give you and all contributors of teams selected the Full Access permissions for this project. Other permissions need to be manually set up through Administration.
                        </div>
                    }
                </div>
                <div class="panel-footer">
                    <a class="btn btn-default" href='@Model.BackUrl'><i class="fa fa-backward"></i> Back to @Model.BackName</a>
                    <div id="divCopyParts" style="display: inline;">
                        <a id="btnAddPart" class="btn btn-success" href="javascript:addPart();"><i class="fa fa-plus"></i> Add Next Part</a>
                        <input type="checkbox" id="chkCopyPartDetails" name="chkCopyPartDetails" class="skip-change" />
                        <label for="chkCopyPartDetails">Copy Part Details</label>
                    </div>
                    <button type="submit" class="btn btn-warning lockable" id="btnsave" href="javascript:void(0)" onclick="return onProjectSave(false);"><i class="fa fa-save"></i> Save</button>
                    @if (Model != null && Model.Id != Guid.Empty)
                    {
                        <a id="btncreateCopy" class="btn btn-primary lockable" href="javascript:createCopy();"><i class="fa fa-list"></i> Copy</a>
                        <a id="btnDelete" class="btn btn-danger" href="@Url.Action("Delete", "Project", new { @id = Model.Id })"><i class="fa fa-trash-o"></i> Delete</a>
                    }
                    else
                    {
                        <button type="submit" class="btn btn-warning lockable" id="nextButton" href="javascript:void(0)" onclick="return onProjectSave(true);"><i class="fa fa-forward"></i> Save & Continue to Scenario(s)</button>
                    }
                </div>
                        }

        </div>
        <div class="tab-pane fade" id="tabScenarios">
            <div class="panel-body" data-section="masterScenarioGrid">
                @if (SecurityManager.CheckSecurityObjectPermission(Areas.Scenarios, AccessLevel.Write))
                {
                    if (!Model.HasChildren)
                    {
                        <div>
                            <span class="tooltip-helper" data-toggle="tooltip" title="Select 2-4 scenarios to compare.">
                                <a class="btn btn-warning scenario-comparer" disabled href="javascript:;" data-project-id="@Model.Id"><i class="fa fa-check"></i> Compare</a>
                            </span>
                            <a class="btn btn-primary lockable" href="javascript:;" onclick="loadScenario('@Model.Id');"><i class="fa fa-plus"></i> Add Scenario</a>
                        </div>
                        <h1></h1>
                    }
                }
                <div class="table-light table-responsive no-margin" id="scenarioslist_@Model.Id">
                    <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered no-margin">
                        <thead>
                            <tr>
                                <th></th>
                                <th>Status</th>
                                <th>Name</th>
                                <th>Projected Revenue</th>
                                <th>Expected Gross Margin</th>
                                <th>Calculated Gross Margin</th>
                                <th>Start Date</th>
                                <th>End Date</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @if (Model.HasChildren)
                            {
                                foreach (EnVisage.Models.ProjectPartModel pm in Model.Parts)
                                {
                                    <text>
                                        <tr>
                                            <td colspan="10">
                                                @if (SecurityManager.CheckSecurityObjectPermission(Areas.Scenarios, AccessLevel.Write))
                                                {
                                                    <span class="tooltip-helper" data-toggle="tooltip" title="Select 2-4 scenarios to compare.">
                                                        <a class="btn btn-warning btn-xs scenario-comparer disabled" href="javascript:;" data-project-id="@pm.Id"><i class="fa fa-check"></i> Compare</a>
                                                    </span>
                                                    <a class="btn btn-primary btn-xs lockable" href="javascript:;" onclick="loadScenario('@pm.Id');"><i class="fa fa-plus"></i> Add Scenario</a>@Html.Raw("&nbsp;&nbsp;");
                                                }
                                                <strong>@pm.Name</strong>
                                            </td>
                                        </tr>
                                    </text>

                                    List<EnVisage.Models.ScenarioTabModel> partScenarios = new List<EnVisage.Models.ScenarioTabModel>();
                                    if (Model.Scenarios != null)
                                    {
                                        partScenarios = Model.Scenarios.Where(s => s.Type != ScenarioType.Actuals && s.ProjectId == pm.Id).OrderByDescending(s => s.Status).ThenBy(s => s.Name).ToList();
                                    }
                                    if (partScenarios.Count > 0)
                                    {
                                        foreach (var scenario in partScenarios)
                                        {
                                            @ScenarioRow(scenario, pm.Id)
                                        }
                                    }
                                }
                            }
                            else if (Model.Scenarios != null)
                            {
                                foreach (var scenario in Model.Scenarios.OrderByDescending(s => s.Status).ThenBy(s => s.Name))
                                {
                                    if (scenario.Type != ScenarioType.Actuals)
                                    {
                                        @ScenarioRow(scenario, Model.Id)
                                    }
                                }
                            }
                        </tbody>
                    </table>
                </div>
                @if (Model.HasChildren)
                {
                    <br />
                    @Html.Partial("../Scenarios/_masterScenarioCalendar", Model.Id)
                }
            </div>
        </div>
        <div class="tab-pane fade" id="tabNotes">
            <div class="panel-body">
                <a class="btn btn-primary lockable" id="btnAddNote" href="javascript:;"><i class="fa fa-plus"></i> Add Note</a>
                <h1></h1>
                <div class="table-light table-responsive no-margin" id="noteslist_@Model.Id">
                    <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered no-margin">
                        <thead>
                            <tr>
                                <th>Date</th>
                                <th>Author</th>
                                <th>Title</th>
                                <th>Details</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @if (Model.Notes.Count == 0)
                            {
                                <tr>
                                    <td colspan="5">There are no notes for this project</td>
                                </tr>
                            }
                            else
                            {
                                foreach (var note in Model.Notes)
                                {
                                    <tr>
                                        <td>@((note.DateAdded == null) ? "N/A" : note.DateAdded.ToString("d"))</td>
                                        <td>@(note.Author != null ? note.Author.UserName : String.Empty)</td>
                                        <td>@note.Title</td>
                                        <td>@(!string.IsNullOrEmpty(note.Details) ? (note.Details.Length < 200 ? note.Details : note.Details.Substring(0, 197) + "...") : "")</td>
                                        <td>
                                            <a href="javascript:void(0)" onclick="editNote('@note.Id');" class="btn btn-primary lockable"><i class="fa fa-edit"></i> Edit</a>
                                            <a href="javascript:void(0)" onclick="deleteNote('@note.Id');" class="btn btn-danger lockable"><i class="fa fa-trash-o"></i> Delete</a>
                                        </td>
                                    </tr>
                                }
                            }
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div class="tab-pane fade" id="tabHistory">
            <div class="panel-body">
                <div class="table-light table-responsive no-margin" id="historyList_@Model.Id">
                    <div id="projectHistoryGrid"></div>
                </div>
            </div>
        </div>

    </div>
</div>
<div id="modalAddNote_@Model.Id" class="modal fade" tabindex="-1" role="dialog" style="display: none;" data-backdrop="static">
    <div class="modal-dialog divForCreate_@Model.Id">
    </div>
</div>

<div id="createScenario" class="modal fade" data-width="900" tabindex="-1" role="dialog" data-backdrop="static">
    <div class="modal-content" id="reloadForm">
    </div>
    <!-- / .modal-content -->
</div>
<div id="createTag" class="modal fade" data-width="900" tabindex="-1" role="dialog" data-backdrop="static">
    <div class="modal-content" id="creatTagModal">
    </div>
    <!-- / .modal-content -->
</div>
<!-- / Modal -->
<div id="compare-scenarios-modal" class="modal fade" data-height="600px" tabindex="-1" role="dialog" data-backdrop="static">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h4 class="modal-title">Compare Scenarios</h4>
        </div>
        <div class="modal-body">
        </div>
    </div>
</div>

@helper ScenarioRow(EnVisage.Models.ScenarioTabModel scenario, Guid projectId)
{
var projectUrl = Url.Action("Edit", "Project", new { id = Model.Id });
var scenarioUrl = Url.Action("Details", "Scenarios", new { id = scenario.Id });
var scenarioHref = scenarioUrl + "?backUrl=" + Url.Encode(projectUrl) + "&backName=project";
var scenarioToggleStatusModel = new
{
    scenarioId = scenario.Id,
    projectId = scenario.ProjectId,
    startDate = scenario.StartDate.HasValue ? scenario.StartDate.Value.ToShortDateString() : null,
    endDate = scenario.EndDate.HasValue ? scenario.EndDate.Value.ToShortDateString() : null,
};
var actButtonClass = "";
var actButtonTitle = "";
var actButtonIconClass = "";
if (scenario.Status.HasValue)
{
    if (scenario.Status.Value == ScenarioStatus.Active)
    {
        actButtonClass = "btn-warning";
        actButtonTitle = "Deactivate";
        actButtonIconClass = "fa-times-circle-o";
    }
    else
    {
        actButtonClass = "btn-primary";
        actButtonTitle = "Activate";
        actButtonIconClass = "fa fa-check-circle-o";
    }
}
var isProtfolio = scenario.Type == ScenarioType.Portfolio;
var isDraft = scenario.Status == ScenarioStatus.Draft;
var isStarted = scenario.StartDate.HasValue && scenario.StartDate > DateTime.Today;
var isComparable = isProtfolio && isStarted && !isDraft;
var disabled = isComparable ? "" : "disabled";
var comparable = isComparable ? "comparable" : "";
var chkCompareTitle = "";
if (isDraft)
{
    chkCompareTitle = "Not able to compare draft scenarios.";
}

else if (!isStarted)
{
    chkCompareTitle = "Not able to compare scenarios with a Start Date in the past.";
}
    <tr>
        <td>
            <input type="checkbox" class="scenario-comparer" data-project-id="@projectId" data-scenario-id="@scenario.Id" @disabled @comparable title="@chkCompareTitle" />
        <td><span id="status_@scenario.Id">@scenario.Status</span></td>
        <td><a id="aDet_@scenario.Id" class="popover-warning popover-dark" onclick="return CheckLock(this.id, 'Scenario', '@scenario.Id')" href="@scenarioHref">@scenario.Name</a></td>
        <td>@(scenario.ProjectedRevenue.HasValue ? scenario.ProjectedRevenue.Value.ToString("#") : string.Empty) </td>
        <td>@(scenario.ExpectedGrossMargin.HasValue ? scenario.ExpectedGrossMargin.Value.ToString("p") : string.Empty) </td>
        <td>@(scenario.CalculatedGrossMargin.HasValue ? scenario.CalculatedGrossMargin.Value.ToString("p") : string.Empty) </td>
        <td>@(scenario.StartDate.HasValue ? scenario.StartDate.Value.ToShortDateString() : string.Empty)</td>
        <td>@(scenario.EndDate.HasValue ? scenario.EndDate.Value.ToShortDateString() : string.Empty) </td>
        <td style="white-space: nowrap;">
            <a id='@scenario.Id' data-status-toggle-scenario='@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(scenarioToggleStatusModel))' data-toggle="popover" data-placement="left" class="btn btn-xs @actButtonClass popover-warning popover-dark lockable" title="@actButtonTitle"><i class="fa @actButtonIconClass"></i></a>
            <a id="btnDelete_@scenario.Id" onclick="return CheckLock(this.id, 'Scenario', '@scenario.Id')" data-toggle="popover" data-placement="left" class="btn btn-sm btn-danger popover-warning popover-dark lockable" href="@Url.Action("Delete", "Scenarios" , new { @id=scenario.Id, @backUrl=Url.Action("Edit", "Project" , new { @id=Model.Id, @ptab="scenarios" }) })"><i class="fa fa-trash-o"></i> Delete</a>
        </td>
    </tr>

}