annotate src/DML/MainVisBundle/Resources/assets/marionette/modules/ContextModule/ContextModule.10-ConfigGrid.js @ 0:493bcb69166c

added public content

"use strict";

App.module("ContextModule", function(ContextModule, App, Backbone, Marionette, $, _, Logger) {

    // Define private variables
    var logger = null;

    ContextModule.addInitializer(function(options){

        logger = Logger.get("ContextModule.ConfigGrid");
        logger.setLevel(Logger.WARN);

        /**
         * ConfigGrid stores the configuration of a grid that consists of entityConfigs and viewConfigs
         * (both are Backbone.Collection of Config)
         *
         * In real situation entityConfigs are music collection configs and music recording configs
         *
         * two sub-collections can be interacted directly (without proxy methods)
         *
         * The grid can be given a read-only type on creation in order to easily to distinguish between collection and recording grid later
         * getType() method is available for this purpose. The type of the grid is not being serialized or unserialized
         *
         * The following events are triggered:
         *
         *      change_layout
         *          when both or any of the two collections of Config gets new objects, looses objects or shuffles
         *          (but not when parameters in individual parameter bags change)
         *
         *      change_entity:c123
         *      change_view:c123
         *          when a particular parameter bag changes (c123 is replaced with a corresponding client id of an entity or a view)
         *
         *      change_entity_neighbours:c123
         *      change_view_neighbours:c123
         *          when a Config, which is right before or right after the given parameter bag, changes
         *          This includes cases when neighbours are added or removed
         *
         *      change_selection
         *          when selectedEntityConfigClientId or (and) selectedViewConfigClientId change
         *
         *      change
         *          this event is triggered together with any of the above ones, but
         *          maximum once during a complex operation such as unserialize
         */
        ContextModule.ConfigGrid = Backbone.Model.extend({
            defaults: {
                entityConfigs: null,
                viewConfigs: null,
                selectedEntityConfigClientId: null,
                selectedViewConfigClientId: null
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            initialize: function(type) {

                this.type = type;

                this.attributes.entityConfigs = new ContextModule.ConfigCollection(null, {
                    comparator: false,
                    configGridType: type,
                    dimension: "entity",
                });
                this.attributes.viewConfigs = new ContextModule.ConfigCollection(null, {
                    comparator: false,
                    configGridType: type,
                    dimension: "view",
                });

                // Shortcuts for entity configs and view configs (for quicker access)
                this.entityConfigs = this.attributes.entityConfigs;
                this.viewConfigs = this.attributes.viewConfigs;

                this._modificationPropagationEnabled = true;
                this._configCollectionsWereModified = false;
                this._configsWereModified = false;
                this._modifiedEntityConfigClientIds = [];
                this._modifiedViewConfigClientIds = [];
                this._lastSavedOrderedEntityClientIds = _.pluck(this.attributes.entityConfigs.models, "cid");
                this._lastSavedOrderedViewClientIds = _.pluck(this.attributes.viewConfigs.models, "cid");
                this._lastSavedSelectedEntityConfigClientId = this.attributes.selectedEntityConfigClientId;
                this._lastSavedSelectedViewConfigClientId = this.attributes.selectedViewConfigClientId;

                this.entityConfigs.bind("add remove reset sort", this._registerModificationOfConfigCollectionForEntities, this);
                this.viewConfigs.bind("add remove reset sort", this._registerModificationOfConfigCollectionForViews, this);

                this.entityConfigs.bind("change", this._registerModificationOfConfig, this);
                this.viewConfigs.bind("change", this._registerModificationOfConfig, this);

                this.bind("change:selectedEntityConfigClientId", this._registerModificationOfAtomicProperty);
                this.bind("change:selectedViewConfigClientId", this._registerModificationOfAtomicProperty);
                this.bind("change:entityWidth", this._registerModificationOfStandardAtomicProperty);
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            getType: function() {
                return this.type;
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            getPrevEntityNeighbour: function(entityConfig) {
                return this._getNeighbour(this.attributes.entityConfigs, entityConfig, -1);
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            getNextEntityNeighbour: function(entityConfig) {
                return this._getNeighbour(this.attributes.entityConfigs, entityConfig, 1);
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            getPrevViewNeighbour: function(viewConfig) {
                return this._getNeighbour(this.attributes.viewConfigs, viewConfig, -1);
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            getNextViewNeighbour: function(viewConfig) {
                return this._getNeighbour(this.attributes.viewConfigs, viewConfig, 1);
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            relocateEntityConfig: function(entityConfig, indexOrNextConfigOrNextConfigClientId) {
                return this._relocate(this.attributes.entityConfigs, entityConfig, indexOrNextConfigOrNextConfigClientId);
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            relocateViewConfig: function(viewConfig, indexOrNextConfigOrNextConfigClientId) {
                return this._relocate(this.attributes.viewConfigs, viewConfig, indexOrNextConfigOrNextConfigClientId);
            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            serialize: function() {
                logger.debug("method called: ConfigGrid::serialize");
                var _this = this;

                var result = {
                        entityConfigs: this.attributes.entityConfigs.map(function(config){ return config.serialize(); }),
                        viewConfigs: this.attributes.viewConfigs.map(function(config){ return config.serialize(); })
                };

                if (this.attributes.selectedEntityConfigClientId) {
                    result.selectedEntityConfigClientId = this.attributes.selectedEntityConfigClientId;
                }
                if (this.attributes.selectedViewConfigClientId) {
                    result.selectedViewConfigClientId = this.attributes.selectedViewConfigClientId;
                }
                if (this.attributes.entityWidth) {
                    result.entityWidth = this.attributes.entityWidth;
                }

                return result;
            },

            getSelectedEntityConfig: function() {
                return this.attributes.entityConfigs.get(this.attributes.selectedEntityConfigClientId);
            },

            getSelectedViewConfig: function() {
                return this.attributes.viewConfigs.get(this.attributes.selectedViewConfigClientId);
            },

//            getSelectedConfigAtGivenDimension: function(dimension) {
//                if (dimension == "entity") {
//                    return this.getSelectedEntityConfig();
//                } else if (dimension == "view") {
//                    return this.getSelectedViewConfig();
//                }
//            },
//
            addEntityAndSelectIt: function(entityConfig, indexOrNextConfigOrNextConfigClientId) {
                this._addAndSelect(this.attributes.entityConfigs, entityConfig, _.isUndefined(indexOrNextConfigOrNextConfigClientId) ? null : indexOrNextConfigOrNextConfigClientId);
            },

            addViewAndSelectIt: function(viewConfig, indexOrNextConfigOrNextConfigClientId) {
                this._addAndSelect(this.attributes.viewConfigs, viewConfig, _.isUndefined(indexOrNextConfigOrNextConfigClientId) ? null : indexOrNextConfigOrNextConfigClientId);
            },

            removeEntityAndSelectNeighbour: function(entityConfig) {
                this._removeAndSelectNeighbour(this.attributes.entityConfigs, entityConfig);
            },

            removeViewAndSelectNeighbour: function(viewConfig) {
                this._removeAndSelectNeighbour(this.attributes.viewConfigs, viewConfig);
            },

            _addAndSelect: function(configCollection, config, indexOrNextConfigOrNextConfigClientId) {
                this._modificationPropagationEnabled = false;

                configCollection.add(config);
                if (configCollection == this.attributes.entityConfigs) {
                    this.attributes.selectedEntityConfigClientId = config.getClientId();
                } else {
                    this.attributes.selectedViewConfigClientId = config.getClientId();
                }
                this._relocate(configCollection, config, indexOrNextConfigOrNextConfigClientId);

                this._triggerModificationEventsIfNeeded();
                this._modificationPropagationEnabled = true;

            },

            _removeAndSelectNeighbour: function(configCollection, config) {
                this._modificationPropagationEnabled = false;

                var neighbourToSelect = this._getNeighbour(configCollection, config, 1);
                if (!neighbourToSelect) {
                    neighbourToSelect = this._getNeighbour(configCollection, config, -1);
                }
                configCollection.remove(config);
                if (configCollection == this.attributes.entityConfigs) {
                    this.attributes.selectedEntityConfigClientId = neighbourToSelect ? neighbourToSelect.getClientId() : null;
                } else {
                    this.attributes.selectedViewConfigClientId = neighbourToSelect ? neighbourToSelect.getClientId() : null;
                }

                this._triggerModificationEventsIfNeeded();
                this._modificationPropagationEnabled = true;

            },

            /**
             * @memberOf App.ContextModule.ConfigGrid
             */
            unserialize: function(serializedAttributes) {
                logger.debug("method called: ConfigGrid::unserialize");

                this._modificationPropagationEnabled = false;

                var fixedSerializedAttributes = serializedAttributes;
                if (!_.isSimpleObject(serializedAttributes)) {
                    logger.warn("ConfigGrid::unserialize called for not an object: ", serializedAttributes);
                    fixedSerializedAttributes = {};
                }

                // entityConfigs
                var newConfigs = [];
                var fixedSerializedConfigs = fixedSerializedAttributes.entityConfigs;
                if (!_.isArray(fixedSerializedConfigs)) {
                    if (_.isSimpleObject(serializedAttributes)) {
                        logger.warn("ConfigGrid::unserialize called for an object with faulty entityConfigs: ", fixedSerializedConfigs);
                    }
                    fixedSerializedConfigs = [];
                };
                for (var i = 0; i < fixedSerializedConfigs.length; i++) {
                    var serializedConfig = fixedSerializedConfigs[i];
                    var config = this.attributes.entityConfigs.get(serializedConfig.clientId);
                    if (!config) {
                        config = new App.ContextModule.Config(serializedConfig);
                    } else {
                        config.unserialize(serializedConfig);
                    }
                    newConfigs.push(config);
                }
                this.attributes.entityConfigs.reset(newConfigs);

                // viewConfigs
                var newConfigs = [];
                var fixedSerializedConfigs = fixedSerializedAttributes.viewConfigs;
                if (!_.isArray(fixedSerializedConfigs)) {
                    if (_.isSimpleObject(serializedAttributes)) {
                        logger.warn("ConfigGrid::unserialize called for an object with faulty viewConfigs: ", fixedSerializedConfigs);
                    }
                    fixedSerializedConfigs = [];
                };
                for (var i = 0; i < fixedSerializedConfigs.length; i++) {
                    var serializedConfig = fixedSerializedConfigs[i];
                    var config = this.attributes.viewConfigs.get(serializedConfig.clientId);
                    if (!config) {
                        config = new App.ContextModule.Config(serializedConfig);
                    } else {
                        config.unserialize(serializedConfig);
                    }
                    newConfigs.push(config);
                }
                this.attributes.viewConfigs.reset(newConfigs);

                // selectedEntityConfigClientId, selectedViewConfigClientId
                this.attributes.selectedEntityConfigClientId = fixedSerializedAttributes.selectedEntityConfigClientId;
                this.attributes.selectedViewConfigClientId = fixedSerializedAttributes.selectedViewConfigClientId;

                this.attributes.entityWidth = fixedSerializedAttributes.entityWidth;

                this._triggerModificationEventsIfNeeded();
                this._modificationPropagationEnabled = true;
            },

            _getNeighbour: function(configCollection, config, offset) {
                var index = configCollection.indexOf(config);
                if (index === -1) {
                    throw _.str.sprintf("Can't find config %s", JSON.stringify(config.serialize()));
                }
                return configCollection.at(index + offset);
            },

            _relocate: function(configCollection, config, indexOrNextConfigOrNextConfigClientId) {
                var clientIds = _.pluck(configCollection.models, "cid");
                var nextConfigClientId = null;

                if (_.isNumber(indexOrNextConfigOrNextConfigClientId) && indexOrNextConfigOrNextConfigClientId != clientIds.length) {
                    nextConfigClientId = clientIds[indexOrNextConfigOrNextConfigClientId];
                }
                if (_.isObject(indexOrNextConfigOrNextConfigClientId)) {
                    nextConfigClientId = indexOrNextConfigOrNextConfigClientId.getClientId();
                }
                if (_.isString(indexOrNextConfigOrNextConfigClientId)) {
                    if (clientIds.indexOf(indexOrNextConfigOrNextConfigClientId) !== -1) {
                        nextConfigClientId = indexOrNextConfigOrNextConfigClientId;
                    }
                }
                if (!nextConfigClientId && !_.isNull(indexOrNextConfigOrNextConfigClientId) && indexOrNextConfigOrNextConfigClientId != configCollection.size()) {
                    throw _.str.sprintf("Wrong value for indexOrNextConfigOrNextConfigClientId %s", indexOrNextConfigOrNextConfigClientId);
                }

                var configClientId = config.getClientId();
                if (!configClientId || clientIds.indexOf(configClientId) == -1) {
                    var flattenedConfig = config;
                    if (_.isObject(flattenedConfig)) {
                        flattenedConfig = JSON.stringify(flattenedConfig);
                    }
                    throw _.str.sprintf("Config %s with cid %s is either not a Config or does not belong to a corresponding configCollection with cids [%s]", flattenedConfig, _.isObject(config ) ? config.getClientId() : undefined, clientIds.join(", "));
                }
                if (configCollection.get(configClientId) !== config) {
                    throw _.str.sprintf("Config %s with cid %s is is a clone of what is stored in the grid. Relocation is not possible.", JSON.stringify(config), config.cid);
                }
                var newClientIds = _.without(clientIds, configClientId);
                if (_.isNull(nextConfigClientId)) {
                    newClientIds.push(configClientId);
                } else {
                    var nextConfigIndex = newClientIds.indexOf(nextConfigClientId);
                    //if (nextConfigIndex)
                    var tempClientIds = newClientIds.slice(0, nextConfigIndex);
                    tempClientIds.push(configClientId);
                    newClientIds = tempClientIds.concat(newClientIds.slice(nextConfigIndex));
                }

                var oldComparator = configCollection.comparator;
                configCollection.comparator = function(model) {
                    return newClientIds.indexOf(model.getClientId());
                };
                configCollection.sort();
                configCollection.comparator = oldComparator;
            },

            _registerModificationOfConfigCollectionForEntities: function(modelOrModels, options) {
                if (!_.isEqual(this._lastSavedOrderedEntityClientIds, _.pluck(this.attributes.entityConfigs.models, "cid"))) {
                    this._configCollectionsWereModified = true;
                    if (this._modificationPropagationEnabled) {
                        this._triggerModificationEventsIfNeeded();
                    };
                }
            },

            _registerModificationOfConfigCollectionForViews: function(modelOrModels, options) {
                if (!_.isEqual(this._lastSavedOrderedViewClientIds, _.pluck(this.attributes.viewConfigs.models, "cid"))) {
                    this._configCollectionsWereModified = true;
                    if (this._modificationPropagationEnabled) {
                        this._triggerModificationEventsIfNeeded();
                    };
                }
            },

            _registerModificationOfConfig: function() {
                for (var i = 0; i < this.attributes.entityConfigs.length; i++) {
                    if(this.attributes.entityConfigs.at(i).hasChanged()) {
                        this._configsWereModified = true;
                        this._modifiedEntityConfigClientIds.push(this.attributes.entityConfigs.at(i).getClientId());
                    }
                }
                for (var i = 0; i < this.attributes.viewConfigs.length; i++) {
                    if(this.attributes.viewConfigs.at(i).hasChanged()) {
                        this._configsWereModified = true;
                        this._modifiedViewConfigClientIds.push(this.attributes.viewConfigs.at(i).getClientId());
                    }
                }
                if (this._modificationPropagationEnabled) {
                    this._triggerModificationEventsIfNeeded();
                };
            },

            _registerModificationOfAtomicProperty: function() {
                if (this._modificationPropagationEnabled) {
                    this._triggerModificationEventsIfNeeded(true);
                };
            },

            _registerModificationOfStandardAtomicProperty: function() {
                if (this._modificationPropagationEnabled) {
                    this._triggerModificationEventsIfNeeded();
                };
            },

            _triggerModificationEventsIfNeeded: function(specialCaseForRegisterModificationOfSelection) {

                var triggeredAtLeastSomething = false;
                if (this._configCollectionsWereModified) {
                    triggeredAtLeastSomething = true;
                    this.trigger("change_layout");
                }

                var newOrderedEntityClientIds = null;
                var newOrderedViewClientIds = null;
                if (this._configCollectionsWereModified || this._modifiedEntityConfigClientIds.length || this._modifiedViewConfigClientIds.length) {
                    newOrderedEntityClientIds = _.pluck(this.attributes.entityConfigs.models, "cid");
                    newOrderedViewClientIds = _.pluck(this.attributes.viewConfigs.models, "cid");

                    // change_entity:c123
                    if (this._modifiedEntityConfigClientIds.length) {
                        for (var i = 0; i < newOrderedEntityClientIds.length; i++) {
                            if (_.indexOf(this._modifiedEntityConfigClientIds, newOrderedEntityClientIds[i]) !== -1) {
                                triggeredAtLeastSomething = true;
                                this.trigger("change_entity:" + newOrderedEntityClientIds[i]);
                            }
                        }
                    }
                    // change_view:c123
                    if (this._modifiedViewConfigClientIds.length) {
                        for (var i = 0; i < newOrderedViewClientIds.length; i++) {
                            if (_.indexOf(this._modifiedViewConfigClientIds, newOrderedViewClientIds[i]) !== -1) {
                                triggeredAtLeastSomething = true;
                                this.trigger("change_view:" + newOrderedViewClientIds[i]);
                            }
                        }
                    }

                    // change_entity_neighbours:c123
                    for (var i = 0; i < newOrderedEntityClientIds.length; i++) {
                        var entityClientId = newOrderedEntityClientIds[i];
                        var oldEntityIndex = this._lastSavedOrderedEntityClientIds.indexOf(entityClientId);
                        if (oldEntityIndex == -1) {
                            continue;
                        }
                        var newPrevEntityClientId = newOrderedEntityClientIds[i - 1];
                        var newNextEntityClientId = newOrderedEntityClientIds[i + 1];
                        var oldPrevEntityClientId = this._lastSavedOrderedEntityClientIds[oldEntityIndex - 1];
                        var oldNextEntityClientId = this._lastSavedOrderedEntityClientIds[oldEntityIndex + 1];

                        if (newPrevEntityClientId != oldPrevEntityClientId
                         || newNextEntityClientId != oldNextEntityClientId
                         || this._modifiedEntityConfigClientIds.indexOf(newPrevEntityClientId) !== -1
                         || this._modifiedEntityConfigClientIds.indexOf(newNextEntityClientId) !== -1
                         ) {
                            triggeredAtLeastSomething = true;
                            this.trigger("change_entity_neighbours:" + entityClientId);
                        };
                    }

                    // change_view_neighbours:c123
                    for (var i = 0; i < newOrderedViewClientIds.length; i++) {
                        var viewClientId = newOrderedViewClientIds[i];
                        var oldViewIndex = this._lastSavedOrderedViewClientIds.indexOf(viewClientId);
                        if (oldViewIndex == -1) {
                            continue;
                        }
                        var newPrevViewClientId = newOrderedViewClientIds[i - 1];
                        var newNextViewClientId = newOrderedViewClientIds[i + 1];
                        var oldPrevViewClientId = this._lastSavedOrderedViewClientIds[oldViewIndex - 1];
                        var oldNextViewClientId = this._lastSavedOrderedViewClientIds[oldViewIndex + 1];

                        if (newPrevViewClientId != oldPrevViewClientId
                         || newNextViewClientId != oldNextViewClientId
                         || this._modifiedViewConfigClientIds.indexOf(newPrevViewClientId) !== -1
                         || this._modifiedViewConfigClientIds.indexOf(newNextViewClientId) !== -1
                         ) {
                            triggeredAtLeastSomething = true;
                            this.trigger("change_view_neighbours:" + viewClientId);
                        };
                    };
                }

                this._lastSavedOrderedEntityClientIds = _.pluck(this.attributes.entityConfigs.models, "cid");
                this._lastSavedOrderedViewClientIds = _.pluck(this.attributes.viewConfigs.models, "cid");

                // Fix selection
                if (!this.attributes.entityConfigs.get(this.attributes.selectedEntityConfigClientId)) {
                    this.attributes.selectedEntityConfigClientId = null;
                }
                if (!this.attributes.viewConfigs.get(this.attributes.selectedViewConfigClientId)) {
                    this.attributes.selectedViewConfigClientId = null;
                }
                if (this._lastSavedSelectedEntityConfigClientId  != this.attributes.selectedEntityConfigClientId
                 || this._lastSavedSelectedViewConfigClientId  != this.attributes.selectedViewConfigClientId
                    ) {
                    if (!specialCaseForRegisterModificationOfSelection) {
                        triggeredAtLeastSomething = true;
                    }
                    this.trigger("change_selection");
                }

                if (this._lastSavedEntityWidth  != this.attributes.entityWidth) {
                    triggeredAtLeastSomething = true;
                }

                this._configCollectionsWereModified = false;
                this._configsWereModified = false;
                this._selectionWasModified = false;
                this._modifiedEntityConfigClientIds = [];
                this._modifiedViewConfigClientIds = [];
                this._lastSavedSelectedEntityConfigClientId  = this.attributes.selectedEntityConfigClientId;
                this._lastSavedSelectedViewConfigClientId    = this.attributes.selectedViewConfigClientId;
                this._lastSavedEntityWidth    = this.attributes.entityWidth;

                if (triggeredAtLeastSomething) {
                    this.trigger("change");
                }
            },
        });
    });
}, Logger);