@using EnVisage.Code
@using EnVisage.Code.HtmlHelpers
@using Microsoft.AspNet.Identity
@model EnVisage.Models.CreateScenarioModel
<script type="text/javascript">
	var _detailsController;
	var _saveSuccessCallbackFn;
	var _scenarioDataChanged = false;
	function onScenarioDataChanged() {
	    _scenarioDataChanged = true;
	}
	function resetScenarioDataChanged() {
	    _scenarioDataChanged = false;
	}
	function isScenarioDataChanged() {
	    return _scenarioDataChanged;
	}

    @if (Model.CanSaveDraft)
	{
        <text>
        function saveAsDraft() {
            $("#@Html.ClientIdFor(model => model.SaveAsDraft)").val(true);
            @if (!Model.Step3.IsRevenueGenerating)
			{
                        <text>
            $('#finStep #ProjectedExpense').val(0);
            </text>
			}
            $('#@Html.ClientIdFor(m => m.Action)').val('Save');
            $('#generalStepForm').submit();
        }
        </text>
	}

    function moveToFinancials() {
        var curStep = $('#@Html.ClientIdFor(m => m.CurrentStep)').val();
        if ('Step1' == curStep) {
            if ($('#create-scenario-dialog-content #EndDate').val()) {
                $('#create-scenario-dialog-content #EndDate').trigger('changeDate');
            };
            $('#@Html.ClientIdFor(m => m.Action)').val('GoToFin');
            $('#generalStepForm').submit();
        } else if ('Step2a' == curStep) {
            if (!_detailsController.isValidAllocation()) {
                console.log('cannot save provided allocation');
                return;
            }
            displayStep3Blocks();
            refreshGraph(null, _detailsController.getTotalCostsByMonthes());
        }
    }

    function moveToDetails() {
        var curStep = $('#@Html.ClientIdFor(m => m.CurrentStep)').val();
        if ('Step1' == curStep) {
            $('#@Html.ClientIdFor(m => m.Action)').val('GoToDetails');
            $('#generalStepForm').submit();
        }
        else if ('Step2' == curStep) {
            $('#@Html.ClientIdFor(m => m.Action)').val('GoToDetails');
            $('#finStepForm').submit();
        }
    }

	function moveToGeneral() {
		$('#is-editable-general-step').val(!_detailsController.gridWasChanged());
		var scenarioDetailsData = _detailsController.getScenarioDetailsData();

		var curStep = $('#@Html.ClientIdFor(m => m.CurrentStep)').val();
        if (curStep == 'Step2a') {
            if (scenarioDetailsData) {
                if (scenarioDetailsData.AvailableExpenditures) {
                    var expCats = scenarioDetailsData.AvailableExpenditures.map(function (ec) {
                        return ec.Id;
                    });
                    $('#general-step-selected-expenditure-categories').val(JSON.stringify(expCats));
                    reloadEC(true);

                	// SA. ENV-1149. Shows fact team allocation on sliders
                    var slidersGroupContainer = $("#teamsContainer").find('*[data-slider-group]');
                    var slidersController = slidersGroupContainer ? angular.element(slidersGroupContainer.get(0)).scope() : undefined;

                    if (slidersController) {
                    	slidersController.$apply(function () {
                    		slidersController.addItems(scenarioDetailsData.TeamsInScenario);
                    	});
                    	
						slidersController.$apply(function () {
                    		slidersController.setAllocation(scenarioDetailsData.TeamsInScenario);
                    		slidersController.setReadonly();
                    	});
                    }
                }
            }
            displayStep1Blocks();
        } else if ('Step2' == curStep) {
            $('#@Html.ClientIdFor(m => m.Action)').val('GoToGeneral');
            $('#finStepForm').submit();

            if (scenarioDetailsData) {
            	if (scenarioDetailsData.AvailableExpenditures) {
            		// SA. ENV-1149. Shows fact team allocation on sliders
            		var slidersGroupContainer = $("#teamsContainer").find('*[data-slider-group]');
            		var slidersController = slidersGroupContainer ? angular.element(slidersGroupContainer.get(0)).scope() : undefined;

            		if (slidersController) {
            			slidersController.$apply(function () {
            				slidersController.addItems(scenarioDetailsData.TeamsInScenario);
            			});

            			slidersController.$apply(function () {
            				slidersController.setAllocation(scenarioDetailsData.TeamsInScenario);
            				slidersController.setReadonly();
            			});
            		}
				}
            }
		}
    }

    function onSaveScenario() {
        var curStep = $('#@Html.ClientIdFor(m => m.CurrentStep)').val();
        $("#@Html.ClientIdFor(model => model.SaveAsDraft)").val(false);
        if ('Step1' == curStep) {
            @if (!Model.Step3.IsRevenueGenerating)
			{
                <text>
            $('#finStep #ProjectedExpense').val(0);
            </text>
			}
            $('#Action').val('Save');
            $('#generalStepForm').submit();
        } else if ('Step2' == curStep) {
            $('#Action').val('Save');
            $('#finStepForm').submit();
        } else if ('Step2a' == curStep) {
            $('#Action').val('Save');
            stepSubmitCallback();
        }
    }

    function stepSubmitCallback() {
        var action = $('#Action').val();
        if ('Save' === action) {
            // gather all entered info from all steps
            var finInfo = $('#finStep #SerializedModel').val();
            var asDraft = $("#@Html.ClientIdFor(model => model.SaveAsDraft)").val();
            _detailsController.setFinInfo(finInfo);
            if (!!_saveSuccessCallbackFn && typeof _saveSuccessCallbackFn === 'function') {
                _saveSuccessCallbackFn(_detailsController.getData4Saving());
            }
            else {
                // 1 - save as new
                _detailsController.saveChanges(asDraft, 1);
            }
            //$('#createScenario').modal('hide');
        } else if ('GoToGeneral' === action) {
            displayStep1Blocks();
        } else if ('GoToDetails' === action) {
            displayStep2Blocks();
        } else if ('GoToFin' === action) {
            displayStep3Blocks();
        }

        $('#Action').val('');
        unblockUI();
    }

    function displayStep1Blocks() {
        $('#@Html.ClientIdFor(m => m.CurrentStep)').val('Step1');
        $('#@Html.ClientIdFor(m => m.Action)').val('');
        $("#fsGeneral").show();
        $("#fsCategories").show();
        $("#fsTeamAllocation").show();
        $("#fsFinancial").hide();
        $("#fsDetails").hide();
        $("#nextDetailsButton").show();

        $("#backButton").hide();
        $("#nextDetailsButton").show();
        $("#nextButton").show();
        @if (!Model.Step3.IsRevenueGenerating)
		{
            <text>
            $("#saveButton").show();
            </text>
		}
		else
		{
            <text>
            $("#saveButton").hide();
            </text>
		}
        $("#saveDraftButton").show();
        $("#backDetailsButton").hide();
        lockGeneralForm($('#is-editable-general-step').val() === 'false');
    }
    function displayStep2Blocks() {
        $('#@Html.ClientIdFor(m => m.CurrentStep)').val('Step2a');
        $('#@Html.ClientIdFor(m => m.Action)').val('');
        $("#fsGeneral").hide();
        $("#fsCategories").hide();
        $("#fsTeamAllocation").hide();
        $("#fsFinancial").hide();
        $("#fsDetails").show();

        //FIREFOX HACK - IT DOES NOT ADD SCROLL FOR OVERFLOW
        $("#details_grid").css("max-width", "880px");

        $("#backButton").show();
        $("#nextDetailsButton").hide();
        $("#nextButton").show();
        $("#saveButton").show();
        $("#saveDraftButton").hide();
        $("#backDetailsButton").hide();
    }
    function displayStep3Blocks() {
        $('#@Html.ClientIdFor(m => m.CurrentStep)').val('Step2');
        $('#@Html.ClientIdFor(m => m.Action)').val('');
        $("#fsGeneral").hide();
        $("#fsCategories").hide();
        $("#fsTeamAllocation").hide();
        $("#fsFinancial").show();
        $("#fsDetails").hide();

        $("#backButton").show();
        $("#nextDetailsButton").hide();
        $("#nextButton").hide();
        $("#saveButton").show();
        $("#saveDraftButton").hide();
        $("#backDetailsButton").show();
    }

    function initScenario(callbackFn) {
    	angular.bootstrap($("#details_grid")[0], ['app']);
        initMainJS();
        _detailsController = angular.element(document.getElementById('controller-details-grid')).scope();
        initStep1(false);
        initScenarioDetails();
        initStep3();
        displayStep1Blocks();

        _saveSuccessCallbackFn = callbackFn;
    }

    function initDatePickers() {
        var options = {
            format: 'mm/dd/yyyy',
            autoclose: true,
            orientation: $('body').hasClass('right-to-left') ? "auto right" : 'auto auto',
            startDate: '@Constants.MIN_SELECTABLE_DATE', // SA. ENV-1235. Disable incorrect dates input
            endDate: '@Constants.MAX_SELECTABLE_DATE'    // SA. ENV-1235. Disable incorrect dates input
        };

        $('#bs-datepicker-scenario-range').datepicker(options).on('changeDate', function (evt) {
        	if (evt.target.id == 'EndDate') {
        		var tmpValue = $("#generalStep").find("#bs-datepicker-scenario-range").find("#EndDate").val();

        		// SA: Set default dates to cost savings datepickers
        		var startDate = new Date(tmpValue);
        		var endDate = new Date(tmpValue);

        		startDate.setDate(startDate.getDate() + 1);
        		endDate.setDate(endDate.getDate() + 1);
        		endDate.setMonth(endDate.getMonth() + 1);

                $('#finStep #CostSavings_CostSavingStartDate').data('datepicker').setDate(startDate);
                $('#finStep #CostSavings_CostSavingEndDate').data('datepicker').setDate(endDate);
			}
        	else if (evt.target.id == 'StartDate') {
        		var tmpValue = $('#generalStep').find('#bs-datepicker-scenario-range').find('#StartDate').val();
        		var endDateValue = $('#generalStep').find('#bs-datepicker-scenario-range').find('#EndDate').val();

        		if (endDateValue == "") {
                    //AG: ENV-782. The API of this forked datepicker does not seem to work correct or we use it incorrectly in this particularly case -
                    //I cannot access datepicker methods by standard $(selector).datepicker('method', arg1, arg2, ...)
                    //Setting date value directly into the textbox does not work as it does not call inline calendar update
            		//so we need to use API method for that
            		
					// SA: We update datepicker component inner date (for scenario finish date) and then reset
					// the inner date. When inner date set, the calendar scrolls to this date and shows it,
					// when expanded. And when we reset inner date then, the control still shows the proper month
					// in its expandable panel
            		$('#bs-datepicker-scenario-range').data('datepicker').pickers[1].update(tmpValue);
    				$('#bs-datepicker-scenario-range').data('datepicker').pickers[1].update('');
                }

        		// SA: Set restrictions to cost savings datepickers
				var sDate = new Date(tmpValue);
        		$('#finStep #CostSavings_CostSavingStartDate').data('datepicker').setStartDate(sDate);
        		$('#finStep #CostSavings_CostSavingEndDate').data('datepicker').setStartDate(sDate);
			}
        });
        $('#bs-datepicker-scenario-range span.input-group-addon').hide();
	}
    $(function () {
        //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();
                }
            });
        };
    });
</script>
@Html.HiddenFor(m => m.SaveAsDraft)
@Html.HiddenFor(m => m.CurrentStep)
@Html.HiddenFor(m => m.Action)
<input type="hidden" id="is-editable-general-step" name="is-editable-general-step" value="true" />
<div id="wizard-container">
    <div class="modal-header" id="createScenarioHeader">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h4 class="modal-title">New Scenario</h4>
    </div>
    <div class="modal-body">
        <div id="generalStep">
            @{ Html.RenderPartial("_generalStep", Model.Step1); }
        </div>
        <fieldset id="fsDetails" style="display: none;">
            <legend class="text-bold small-bottom-margin">Scenario Details</legend>
            <div class="row" id="details_grid" data-section="scenarioCalendar">
                @{
                    var user = (new EnVisage.Code.Cache.UsersCache()).Value.FirstOrDefault(x => x.Id == new Guid(User.Identity.GetID()));
                    var detailsModel = (new EnVisage.Models.ScenarioDetailsCalendarModel((EnVisage.Models.ScenarioDetailModel)null, user, EnVisage.Models.ScenarioDetailsCalendarModel.ScenarioCalendarOpener.CreateScenarioWizard));
                    Html.RenderPartial("_scenarioCalendar", detailsModel);
                }
            </div>
        </fieldset>
        <div id="finStep">
            @{ Html.RenderPartial("_finStep", Model.Step3); }
        </div>
    </div>
    <div class="modal-footer">
        <div class="pull-left">
            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
        </div>
        <div class="pull-right">
            <button type="submit" class="btn btn-success lockable" id="backButton" onclick="moveToGeneral();"><i class="fa fa-backward"></i> Back to Scenario Info</button>
            @if (Model.CanSaveDraft)
			{
                <button type="submit" class="btn btn-warning lockable" id="saveDraftButton" onclick="saveAsDraft();"><i class="fa fa-save"></i> Save as Draft</button>
			}
            <button type="submit" class="btn btn-success lockable" id="nextDetailsButton" onclick="moveToDetails();"><i class="fa fa-forward"></i> Continue to Details</button>
            <button type="submit" class="btn btn-success lockable" id="backDetailsButton" onclick="moveToDetails();"><i class="fa fa-backward"></i> Back to Details</button>
            <button type="submit" class="btn btn-success lockable" id="nextButton" onclick="moveToFinancials();"><i class="fa fa-forward"></i> Continue to Financials</button>
            <button type="submit" class="btn btn-warning lockable" id="saveButton" onclick="onSaveScenario();"><i class="fa fa-save"></i> Save Scenario</button>
        </div>
    </div>
</div>
<div id="project_parts_@Model.ScenarioId" style="display:none;"></div>