Daniel@0: "use strict";
Daniel@0: 
Daniel@0: App.module("MainRegionModule", function (MainRegionModule, App, Backbone, Marionette, $, _, Logger) {
Daniel@0: 
Daniel@0:     MainRegionModule.ConfigGridPanelView = MainRegionModule.ConfigGridChildView.extend({
Daniel@0: 
Daniel@0:         options: {
Daniel@0:             dimension: null, // entity | view
Daniel@0:             configGrid: null,
Daniel@0:             parentState: null,
Daniel@0:             parentConfigGridView: null
Daniel@0:         },
Daniel@0: 
Daniel@0:         _cachedConfigGridType: null,
Daniel@0:         _cachedConfig: null,
Daniel@0:         _cachedBorderRadiusFixerSize: null,
Daniel@0: 
Daniel@0:         initialize: function(options) {
Daniel@0:             var _this = this;
Daniel@0:             _this.options = _.defaults(options || {}, this.options);;
Daniel@0: 
Daniel@0:             _this.listenTo(_this.options.configGrid, "change_selection", _this.renderIfParentConfigGridIsVisible);
Daniel@0: 
Daniel@0:             // Cached attributes
Daniel@0:             _this._cachedConfigGridType = this.options.configGrid.getType();
Daniel@0: 
Daniel@0:             // Init border radius fixer (sits under the background and fills white space if the currently selected entity / view is near the corner)
Daniel@0:             _this._$borderRadiusFixer = $.bem.generateElement("config-grid-panel", "border-radius-fixer");
Daniel@0:             _this._$borderRadiusFixerContainer = $.bem.generateElement("config-grid-panel", "border-radius-fixer-container");
Daniel@0:             _this._$borderRadiusFixerContainer.append(_this._$borderRadiusFixer);
Daniel@0:             _this.$el.prepend(_this._$borderRadiusFixerContainer);
Daniel@0:             _this._cachedBorderRadiusFixerSize = _this._$borderRadiusFixerContainer.width();
Daniel@0:             _this.updateRadiusFixer(null, null);
Daniel@0: 
Daniel@0:             // Init main area
Daniel@0:             _this._$mainAreaWrapper = $.bem.generateElement("config-grid-panel", "main-area-wrapper");
Daniel@0:             _this._$mainArea = $.bem.generateElement("config-grid-panel", "main-area");
Daniel@0:             _this._$mainArea.addClass("cgpma"); // this element is also a block
Daniel@0:             _this._$mainArea.appendTo(_this._$mainAreaWrapper);
Daniel@0:             _this._$mainAreaWrapper.appendTo(_this.$el);
Daniel@0: 
Daniel@0:             // Init commands
Daniel@0:             _this._$commands = _this.$(".config-grid-panel__commands");
Daniel@0:             _this._$commandClone   = _this.$(".config-grid-panel__command_action_clone");
Daniel@0:             _this._$commandDelete  = _this.$(".config-grid-panel__command_action_delete");
Daniel@0:             _this._$commandApply   = _this.$(".config-grid-panel__command_action_apply");
Daniel@0:             _this._$commandDiscard = _this.$(".config-grid-panel__command_action_discard");
Daniel@0: 
Daniel@0:             // Assign functions to the commands
Daniel@0:             _this._$commandClone.click(function() {
Daniel@0:                 if (_this._cachedConfig && _this._$commandClone.hasClass("config-grid-panel__command_state_enabled")) {
Daniel@0:                     var clonedConfig = _this._cachedConfig.clone();
Daniel@0:                     if (_this.options.dimension == "entity") {
Daniel@0:                         _this.options.configGrid.addEntityAndSelectIt(clonedConfig, _this.options.configGrid.getNextEntityNeighbour(_this._cachedConfig));
Daniel@0:                     } else {
Daniel@0:                         _this.options.configGrid.addViewAndSelectIt(clonedConfig, _this.options.configGrid.getNextViewNeighbour(_this._cachedConfig));
Daniel@0:                     }
Daniel@0:                 }
Daniel@0:             });
Daniel@0:             _this._$commandDelete.click(function() {
Daniel@0:                 if (_this._cachedConfig && _this._$commandDelete.hasClass("config-grid-panel__command_state_enabled")) {
Daniel@0:                     if (_this.options.dimension == "entity") {
Daniel@0:                         _this.options.configGrid.removeEntityAndSelectNeighbour(_this._cachedConfig);
Daniel@0:                     } else {
Daniel@0:                         _this.options.configGrid.removeViewAndSelectNeighbour(_this._cachedConfig);
Daniel@0:                     }
Daniel@0:                 }
Daniel@0:             });
Daniel@0: 
Daniel@0:             _this._$commandApply.click(function() {
Daniel@0:                 if (_this._cachedConfig && _this._$commandApply.hasClass("config-grid-panel__command_state_enabled")) {
Daniel@0:                     _this._masterBehindMainArea.cleanConfigPlannedParameterValuesAndApplyThem(_this._cachedConfig);
Daniel@0:                 }
Daniel@0:             });
Daniel@0: 
Daniel@0:             _this._$commandDiscard.click(function() {
Daniel@0:                 if (_this._cachedConfig && _this._$commandDiscard.hasClass("config-grid-panel__command_state_enabled")) {
Daniel@0:                     _this._cachedConfig.cancelPlannedParameterUpdates();
Daniel@0:                 }
Daniel@0:             });
Daniel@0: 
Daniel@0:             _this._$commandClone  .attr("title", " ");
Daniel@0:             _this._$commandDelete .attr("title", " ");
Daniel@0:             _this._$commandApply  .attr("title", " ");
Daniel@0:             _this._$commandDiscard.attr("title", " ");
Daniel@0:             App.TooltipModule.convertTitlesToTooltips(_this.$el);
Daniel@0:             _this._updateTooltips();
Daniel@0: 
Daniel@0:             _this._$commands.disableSelection();
Daniel@0:         },
Daniel@0: 
Daniel@0:         render: function (deep, instant) {
Daniel@0:             var _this = this;
Daniel@0: 
Daniel@0:             var selectedConfig = null;
Daniel@0:             if (_this.options.dimension == "entity") {
Daniel@0:                 selectedConfig = _this.options.configGrid.getSelectedEntityConfig();
Daniel@0:             } else {
Daniel@0:                 selectedConfig = _this.options.configGrid.getSelectedViewConfig();
Daniel@0:             }
Daniel@0: 
Daniel@0:             var configWasReplaced = false;
Daniel@0:             if (_this._cachedConfig != selectedConfig) {
Daniel@0: 
Daniel@0:                 if (_this._cachedConfig) {
Daniel@0:                     _this.stopListening(_this._cachedConfig, "change", _this.renderIfParentConfigGridIsVisible);
Daniel@0:                 };
Daniel@0: 
Daniel@0:                 _this._cachedConfig = selectedConfig;
Daniel@0: 
Daniel@0:                 if (_this._cachedConfig) {
Daniel@0:                     _this.listenTo(_this._cachedConfig, "change", _this.renderIfParentConfigGridIsVisible);
Daniel@0:                 };
Daniel@0: 
Daniel@0:                 configWasReplaced = true;
Daniel@0:                 _this._updateTooltips();
Daniel@0:             }
Daniel@0: 
Daniel@0:             var dynamicDerivedConfigData = App.dynamicDerivedConfigDataProvider.get(_this._cachedConfig);
Daniel@0:             if (_this._cachedDynamicDerivedConfigData != dynamicDerivedConfigData) {
Daniel@0:                 if (_this._cachedDynamicDerivedConfigData) {
Daniel@0:                     this.stopListening(_this._cachedDynamicDerivedConfigData, "change", _this.renderIfParentConfigGridIsVisible);
Daniel@0:                 }
Daniel@0: 
Daniel@0:                 _this._cachedDynamicDerivedConfigData = dynamicDerivedConfigData;
Daniel@0: 
Daniel@0:                 if (_this._cachedDynamicDerivedConfigData) {
Daniel@0:                     _this.listenTo(_this._cachedDynamicDerivedConfigData, "change", _this.renderIfParentConfigGridIsVisible);
Daniel@0:                 };
Daniel@0:             }
Daniel@0: 
Daniel@0:             _this._setupMainArea(deep, instant);
Daniel@0: 
Daniel@0:             var hashForData = null;
Daniel@0:             if (_this._cachedConfig) {
Daniel@0:                 hashForData = _this._cachedConfig.getHash()
Daniel@0:                     + _this._cachedDynamicDerivedConfigData.getHash();
Daniel@0:             }
Daniel@0:             if (configWasReplaced || _this._cachedHashForData !== hashForData) {
Daniel@0:                 _this._cachedHashForData = hashForData;
Daniel@0:                 if (_this._masterBehindMainArea) {
Daniel@0:                     _this._masterBehindMainArea.syncConfigGridPanelMainArea(_this, instant);
Daniel@0:                 }
Daniel@0:                 _this._renderApplyDiscardCommands(deep, instant);
Daniel@0:             }
Daniel@0: 
Daniel@0:             if (configWasReplaced || deep) {
Daniel@0:                 _this._renderCloneDeleteCommands(deep, instant);
Daniel@0:             }
Daniel@0:         },
Daniel@0: 
Daniel@0:         updateRadiusFixer: function(selectedConfigGridOffsetStart, selectedConfigGridSize) {
Daniel@0:             var _this = this;
Daniel@0:             var coordinate = selectedConfigGridOffsetStart;
Daniel@0:             var size = selectedConfigGridSize;
Daniel@0: 
Daniel@0:             if (_.isNumber(size) && !_.isNaN(size) && size > 0) {
Daniel@0:                 if (coordinate + size <= 0) {
Daniel@0:                     coordinate = null;
Daniel@0:                 }
Daniel@0:                 if (coordinate > _this._cachedBorderRadiusFixerSize) {
Daniel@0:                     coordinate = null;
Daniel@0:                 } else if (coordinate < 0) {
Daniel@0:                     coordinate = 0;
Daniel@0:                 } else if (coordinate + size > _this._cachedBorderRadiusFixerSize) {
Daniel@0:                     size = _this._cachedBorderRadiusFixerSize - coordinate;
Daniel@0:                 }
Daniel@0:             } else {
Daniel@0:                 coordinate = null;
Daniel@0:                 size = null;
Daniel@0:             }
Daniel@0:             if (coordinate !== null) {
Daniel@0:                 if (_this.options.dimension == "entity") {
Daniel@0:                     _this._$borderRadiusFixer.css({"left": coordinate, "width": size});
Daniel@0:                 } else {
Daniel@0:                     _this._$borderRadiusFixer.css({"top": coordinate, "height": size});
Daniel@0:                 }
Daniel@0:             } else {
Daniel@0:                 if (_this.options.dimension == "entity") {
Daniel@0:                     _this._$borderRadiusFixer.css({"left": 0, "width": 0});
Daniel@0:                 } else {
Daniel@0:                     _this._$borderRadiusFixer.css({"top": 0, "height": 0});
Daniel@0:                 }
Daniel@0:             }
Daniel@0:         },
Daniel@0: 
Daniel@0:         _updateTooltips: function() {
Daniel@0:             var _this = this;
Daniel@0:             if (! this._cachedConfig) {
Daniel@0:                 _this._$commandClone  .attr("tooltip-title", "");
Daniel@0:                 _this._$commandDelete .attr("tooltip-title", "");
Daniel@0:                 _this._$commandApply  .attr("tooltip-title", "");
Daniel@0:                 _this._$commandDiscard.attr("tooltip-title", "");
Daniel@0:             } else {
Daniel@0:                 var tooltipTemplate = null;
Daniel@0:                 try {
Daniel@0:                     tooltipTemplate = Marionette.TemplateCache.get("#config-grid-panel__command-titles_" + _this._cachedConfigGridType + "_" + this._cachedConfig.getDimension() + "_" + _.str.trim(this._cachedConfig.getParameterValue("kind")));
Daniel@0:                 } catch (e) {
Daniel@0:                     tooltipTemplate = Marionette.TemplateCache.get("#config-grid-panel__command-titles_" + _this._cachedConfigGridType + "_" + this._cachedConfig.getDimension());
Daniel@0:                 }
Daniel@0:                 var tooltips = tooltipTemplate().split("|");
Daniel@0:                 _this._$commandClone  .attr("tooltip-title", tooltips[0]);
Daniel@0:                 _this._$commandDelete .attr("tooltip-title", tooltips[1]);
Daniel@0:                 _this._$commandApply  .attr("tooltip-title", tooltips[2]);
Daniel@0:                 _this._$commandDiscard.attr("tooltip-title", tooltips[3]);
Daniel@0:             }
Daniel@0:         },
Daniel@0: 
Daniel@0:         _renderCloneDeleteCommands: function(deep, instant) {
Daniel@0:             var _this = this;
Daniel@0:             //var cloneEnabled  = !!(_this._cachedConfig && !(_this.options.dimension == "entity" && _this._cachedConfigGridType == "recording"));
Daniel@0:             var cloneEnabled  = !! _this._cachedConfig;
Daniel@0:             var deleteEnabled = !! _this._cachedConfig;
Daniel@0:             _this._$commandClone .toggleClass("config-grid-panel__command_state_enabled", cloneEnabled);
Daniel@0:             _this._$commandDelete.toggleClass("config-grid-panel__command_state_enabled", deleteEnabled);
Daniel@0:         },
Daniel@0: 
Daniel@0:         _renderApplyDiscardCommands: function(deep, instant) {
Daniel@0:             var _this = this;
Daniel@0:             var enabled = !!(_this._cachedConfig && _this._cachedConfig.hasPlannedParameterUpdates());
Daniel@0:             _this._$commandApply  .toggleClass("config-grid-panel__command_state_enabled", enabled);
Daniel@0:             _this._$commandDiscard.toggleClass("config-grid-panel__command_state_enabled", enabled);
Daniel@0:         },
Daniel@0: 
Daniel@0: 
Daniel@0: 
Daniel@0:         _setupMainArea: function(deep, instant) {
Daniel@0:             var _this = this;
Daniel@0: 
Daniel@0:             var master = null;
Daniel@0:             if (_this._cachedConfig) {
Daniel@0:                 master = App.RepresentationModule.getMasterForConfig(_this._cachedConfig, true);
Daniel@0:             }
Daniel@0: 
Daniel@0:             var configHasChanged = _this._configBehindMainArea !== _this._cachedConfig;
Daniel@0:             var masterHasChanged = _this._masterBehindMainArea !== master;
Daniel@0: 
Daniel@0:             if (configHasChanged || masterHasChanged) {
Daniel@0:                 if (_this._masterBehindMainArea) {
Daniel@0:                     _this._masterBehindMainArea.destroyConfigGridPanelMainArea(this);
Daniel@0:                 }
Daniel@0: 
Daniel@0:                 if (!_this._cachedConfig) {
Daniel@0:                     _this._configBehindMainArea = null;
Daniel@0:                     _this._masterBehindMainArea = null;
Daniel@0:                     _this._$mainArea.html(Backbone.Marionette.TemplateCache.get("#cgpma_" + _this._cachedConfigGridType + "_" + this.options.dimension + "__empty"));
Daniel@0:                 } else {
Daniel@0: 
Daniel@0:                     _this._configBehindMainArea = _this._cachedConfig;
Daniel@0:                     _this._masterBehindMainArea = master;
Daniel@0: 
Daniel@0:                     _this._$mainArea.empty();
Daniel@0:                     _this._$mainArea.removeData();
Daniel@0: 
Daniel@0:                     try {
Daniel@0:                         _this._$mainArea.html(Backbone.Marionette.TemplateCache.get("#cgpma_" + _this._cachedConfigGridType + "_" + this.options.dimension + "_" + master.id.split(".")[2]));
Daniel@0:                     } catch (e) {
Daniel@0:                         _this._$mainArea.html(Backbone.Marionette.TemplateCache.get("#cgpma_" + _this._cachedConfigGridType + "_" + this.options.dimension + "__unknown"));
Daniel@0:                     }
Daniel@0:                     _this._masterBehindMainArea.prepareConfigGridPanelMainArea(_this);
Daniel@0:                 }
Daniel@0: 
Daniel@0:                 var masterKind = undefined;
Daniel@0:                 if (_this._masterBehindMainArea) {
Daniel@0:                     masterKind = _this._masterBehindMainArea.id.split(".")[2];
Daniel@0:                 }
Daniel@0:                 this.$el.setMod("config-grid-panel", "master-kind", masterKind ? masterKind : false);
Daniel@0:             }
Daniel@0:         },
Daniel@0:     });
Daniel@0: }, Logger);