define([ "require", "backbone", "hbs!tmpl/glossary/GlossaryLayoutView_tmpl", "utils/Utils", "utils/Messages", "utils/Globals", "utils/UrlLinks", "utils/CommonViewFunction", "jstree" ], function(require, Backbone, GlossaryLayoutViewTmpl, Utils, Messages, Globals, UrlLinks, CommonViewFunction) { "use strict"; var GlossaryLayoutView = Backbone.Marionette.LayoutView.extend({ _viewName: "GlossaryLayoutView", template: GlossaryLayoutViewTmpl, regions: {}, templateHelpers: function() { return { isAssignView: this.isAssignView, importTmplUrl: UrlLinks.glossaryImportTempUrl(), isAssignAttributeRelationView: this.isAssignAttributeRelationView }; }, ui: { createGlossary: "[data-id='createGlossary']", refreshGlossary: "[data-id='refreshGlossary']", searchTerm: "[data-id='searchTerm']", searchCategory: "[data-id='searchCategory']", glossaryView: 'input[name="glossaryView"]', termTree: "[data-id='termTree']", categoryTree: "[data-id='categoryTree']", importGlossary: "[data-id='importGlossary']", glossaryTreeLoader: "[data-id='glossaryTreeLoader']", glossaryTreeView: "[data-id='glossaryTreeView']" }, events: function() { var events = {}; return events["change " + this.ui.glossaryView] = "glossaryViewToggle", events["click " + this.ui.createGlossary] = function(e) { var that = this; e && $(e.currentTarget).attr("disabled", "true"), CommonViewFunction.createEditGlossaryCategoryTerm({ isGlossaryView: !0, collection: this.glossaryCollection, callback: function() { that.ui.createGlossary.removeAttr("disabled"), that.getGlossary(); }, onModalClose: function() { that.ui.createGlossary.removeAttr("disabled"); } }); }, events["click " + this.ui.refreshGlossary] = function() { this.ui.refreshGlossary.attr("disabled", !0), this.getGlossary(); }, events["click " + this.ui.importGlossary] = "onClickImportGlossary", events["keyup " + this.ui.searchTerm] = function() { this.ui.termTree.jstree("search", _.escape(this.ui.searchTerm.val())); }, events["keyup " + this.ui.searchCategory] = function() { this.ui.categoryTree.jstree("search", this.ui.searchCategory.val()); }, events; }, initialize: function(options) { _.extend(this, _.pick(options, "associatedTerms", "guid", "value", "glossaryCollection", "glossary", "isAssignTermView", "isAssignCategoryView", "isAssignEntityView", "isAssignAttributeRelationView", "importVent")), this.viewType = "term", this.isAssignView = this.isAssignTermView || this.isAssignCategoryView || this.isAssignEntityView || this.isAssignAttributeRelationView, this.bindEvents(), this.query = { term: {}, category: {} }, Utils.getUrlState.isGlossaryTab() && this.value && this.value.viewType && (this.viewType = this.value.viewType, this.query[this.viewType] = _.extend({}, this.value, { guid: this.guid })); }, bindEvents: function() { var that = this; this.listenTo(this.glossaryCollection.fullCollection, "reset add change", function(skip) { this.generateTree(), this.setValues(), this.changeLoaderState(!1), this.ui.refreshGlossary.attr("disabled", !1); }, this), this.listenTo(this.glossaryCollection, "update:details", function(options) { var isGlossaryUpdate = options.isGlossaryUpdate; if (isGlossaryUpdate) this.ui.termTree.jstree(!0).refresh && this.ui.termTree.jstree(!0).refresh(), this.ui.categoryTree.jstree(!0).refresh && this.ui.categoryTree.jstree(!0).refresh(); else { var $tree = this.ui["term" == this.viewType ? "termTree" : "categoryTree"]; $tree.jstree(!0).refresh && ($tree.jstree(!0).refresh(), this.setValues({ trigger: !1 })); } this.changeLoaderState(!1); }, this), this.isAssignView || $("body").on("click", ".termPopoverOptions li, .categoryPopoverOptions li", function(e) { that.$(".termPopover,.categoryPopover").popover("hide"), that[$(this).find("a").data("fn")](e); }), this.importVent && this.importVent.on("Import:Glossary:Update", function(options) { that.getGlossary(); }); }, onRender: function() { this.changeLoaderState(!0), this.isAssignCategoryView && (this.$(".category-view").show(), this.$(".term-view").hide()), this.isAssignView && this.glossaryCollection.fullCollection.length ? (this.generateTree(), this.disableNodesList = this.getDisableNodes()) : this.getGlossary(); }, changeLoaderState: function(showLoader) { showLoader ? (this.ui.glossaryTreeLoader.show(), this.ui.glossaryTreeView.hide()) : (this.ui.glossaryTreeLoader.hide(), this.ui.glossaryTreeView.show()); }, setValues: function(options) { "category" == this.viewType ? this.ui.glossaryView.prop("checked") || this.ui.glossaryView.prop("checked", !0).trigger("change", options) : this.ui.glossaryView.prop("checked") && this.ui.glossaryView.prop("checked", !1).trigger("change", options); }, glossaryViewToggle: function(e, options) { var that = this; e.currentTarget.checked ? (this.$(".category-view").show(), this.$(".term-view").hide(), this.viewType = "category", this.$(".dropdown-toggle").attr("disabled", "disabled")) : (this.$(".term-view").show(), this.$(".category-view").hide(), this.viewType = "term", this.$(".dropdown-toggle").removeAttr("disabled")); var setDefaultSelector = function() { if (that.value) { var model = null; model = that.value.gId ? that.glossaryCollection.fullCollection.get(that.value.gId) : that.glossaryCollection.fullCollection.first(), model = model.toJSON ? model.toJSON() : model, that.glossary.selectedItem = { type: "Glossary", guid: model.guid, id: model.guid, model: model, text: model.name, gType: "glossary" }; } }; if (Utils.getUrlState.isGlossaryTab()) { var obj = this.query[this.viewType], $tree = this.ui["term" == this.viewType ? "termTree" : "categoryTree"]; if (obj.gId = that.value.gId, obj.guid) { var node = $tree.jstree(!0).get_node(obj.guid); node && (this.glossary.selectedItem = node.original, $tree.jstree("activate_node", obj.guid)); } else that.glossaryCollection.fullCollection.length && (setDefaultSelector(), $tree.jstree("activate_node", that.glossary.selectedItem.guid)); this.query[this.viewType] = _.extend(obj, _.pick(this.glossary.selectedItem, "model", "guid", "gType", "type"), { viewType: this.viewType, isNodeNotFoundAtLoad: this.query[this.viewType].isNodeNotFoundAtLoad }); var url = _.isEmpty(this.glossary.selectedItem) ? "#!/glossary" : "#!/glossary/" + this.glossary.selectedItem.guid; Utils.setUrl({ url: url, urlParams: _.extend({}, _.omit(obj, "guid", "model", "type", "isNodeNotFoundAtLoad")), mergeBrowserUrl: !1, trigger: !(options && !_.isUndefined(options.trigger)) || options.trigger, updateTabState: !0 }); } }, getGlossary: function() { this.changeLoaderState(!0), this.glossaryCollection.fetch({ reset: !0 }); }, generateCategoryData: function(options) { return _.map(options.data, function(obj) { return { text: _.escape(obj.displayText), icon: "fa fa-files-o", guid: obj.categoryGuid, id: obj.categoryGuid, glossaryId: options.node.glossaryId, glossaryName: options.node.glossaryName, model: obj, type: "GlossaryCategory", gType: "category", children: !0 }; }); }, getCategory: function(options) { var that = this; this.glossaryCollection.getCategory({ guid: options.node.guid, related: !0, ajaxOptions: { success: function(data) { data && data.children ? options.callback(that.generateCategoryData(_.extend({}, { data: data.children }, options))) : options.callback([]); }, cust_error: function() { options.callback([]); } } }); }, generateData: function(opt) { var that = this, associatedTerms = (that.guid, that.associatedTerms), type = opt.type; opt.type == this.viewType && (this.query[opt.type].isNodeNotFoundAtLoad = !0); var getSelectedState = function(options) { var objGuid = options.objGuid, node = options.node, index = options.index; if (that.isAssignView) return { opened: !0 }; if (that.guid) { if (that.guid == objGuid) return that.query[that.viewType].isNodeNotFoundAtLoad = !1, that.glossary.selectedItem = node, that.query[that.viewType].model = node.model, that.query[that.viewType].type = node.type, { opened: !0, selected: !0 }; } else { that.query[that.viewType].isNodeNotFoundAtLoad = !1; var selectedItem = { type: "Glossary", gType: "glossary", model: that.glossaryCollection.fullCollection.first().toJSON() }; if (selectedItem.text = selectedItem.model.name, selectedItem.guid = selectedItem.model.guid, 0 == index && selectedItem.guid == objGuid) return that.glossary.selectedItem = selectedItem, that.query[that.viewType].model = selectedItem.model, that.query[that.viewType].type = selectedItem.type, { opened: !0, selected: !0 }; } }; return this.glossaryCollection.fullCollection.map(function(model, i) { var obj = model.toJSON(), parent = { text: _.escape(obj.name), icon: "fa fa-folder-o", guid: obj.guid, id: obj.guid, model: obj, type: obj.typeName ? obj.typeName : "Glossary", gType: "glossary", children: [] }; if (parent.state = getSelectedState({ index: i, node: parent, objGuid: obj.guid }), "category" == type && obj.categories) { var isSelected = !1, categoryList = (obj.guid, []), catrgoryRelation = []; _.each(obj.categories, function(category) { that.options.value && (isSelected = !!that.options.value.guid && that.options.value.guid == category.categoryGuid); var typeName = category.typeName || "GlossaryCategory", guid = category.categoryGuid, categoryObj = { id: guid, guid: guid, text: _.escape(category.displayText), type: typeName, gType: "category", glossaryId: obj.guid, glossaryName: obj.name, children: [], model: category, icon: "fa fa-files-o" }; categoryObj.state = getSelectedState({ index: i, node: categoryObj, objGuid: guid }), category.parentCategoryGuid && catrgoryRelation.push({ parent: category.parentCategoryGuid, child: guid }), categoryList.push(categoryObj); }), _.each(categoryList, function(category) { var getRelation = _.find(catrgoryRelation, function(catrgoryObj) { if (catrgoryObj.child == category.guid) return catrgoryObj; }); getRelation ? _.map(categoryList, function(catrgoryObj) { catrgoryObj.guid == getRelation.parent && catrgoryObj.children.push(category); }) : parent.children.push(category); }); } return "term" == type && obj.terms && _.each(obj.terms, function(term) { if (associatedTerms) { var associatedTermFound = _.find(associatedTerms, function(obj, index) { if ((obj.termGuid ? obj.termGuid : obj.guid) == term.termGuid) return obj; }); if (associatedTermFound) return; } var typeName = term.typeName || "GlossaryTerm", guid = term.termGuid, termObj = { text: _.escape(term.displayText), type: typeName, gType: "term", guid: guid, id: guid, parent: obj, glossaryName: obj.name, glossaryId: obj.guid, model: term, icon: "fa fa-file-o" }; termObj.state = getSelectedState({ index: i, node: termObj, objGuid: guid }), parent.children.push(termObj); }), parent; }); }, manualRender: function(options) { if (_.extend(this, _.omit(options, "isTrigger")), this.value && this.value.viewType && (this.viewType = this.value.viewType), this.guid && this.value && (this.value.fromView && this.value.fromView || this.value.updateView)) { var $tree = this.ui["term" == this.viewType ? "termTree" : "categoryTree"], node = $tree.jstree(!0).get_node(this.guid); node && ($tree.jstree("activate_node", this.guid, { skipTrigger: !0 }), delete this.value.fromView, delete this.value.updateView, this.glossary.selectedItem = node.original, this.query[this.viewType] = _.extend({}, _.pick(this.glossary.selectedItem, "model", "guid", "gType", "type"), { viewType: this.viewType }), Utils.setUrl({ url: "#!/glossary/" + this.guid, urlParams: this.value, mergeBrowserUrl: !1, trigger: !1, updateTabState: !0 }), this.glossaryCollection.trigger("update:details", { isGlossaryUpdate: "glossary" == this.value.gType })); } else this.setValues(); options.isTrigger && this.triggerUrl(); }, getDisableNodes: function() { var disableNodesSelection = []; if (this.options && this.options.isAssignAttributeRelationView) { var disableTerms = this.options.termData && this.options.selectedTermAttribute ? this.options.termData[this.options.selectedTermAttribute] : null; disableNodesSelection = _.map(disableTerms, function(obj) { return obj.termGuid; }), disableNodesSelection.push(this.options.termData.guid); } return disableNodesSelection; }, generateTree: function() { var $termTree = this.ui.termTree, $categoryTree = this.ui.categoryTree, that = this, getTreeConfig = (that.guid, function(options) { return { plugins: [ "search", "themes", "core", "wholerow", "sort", "conditionalselect" ], conditionalselect: function(node) { var obj = node && node.original && node.original.type; if (obj) { if (that.isAssignView) { var isDisableNode = !1; return that.disableNodesList && (isDisableNode = that.disableNodesList.indexOf(node.original.guid) > -1), "Glossary" != obj && !isDisableNode; } return "NoAction" != obj; } }, search: { show_only_matches: !0 }, core: { data: function(node, cb) { "#" === node.id ? cb(that.generateData(options)) : that.getCategory({ node: node.original, callback: cb }); }, themes: { name: that.isAssignView ? "default" : "default-dark", dots: !0 } } }; }), treeLoaded = function(options) { if (1 == that.query[options.type].isNodeNotFoundAtLoad) { var id = that.glossary.selectedItem.guid; id && options.$el.jstree("activate_node", id); } that.changeLoaderState(!1); }, createAction = function(options) { var $el = options.el, type = options.type, popoverClassName = "term" == type ? "termPopover" : "categoryPopover"; if (!that.isAssignView) { var wholerowEl = $el.find("li[role='treeitem'] > .jstree-wholerow:not(:has(>div.tools))"); wholerowEl.append('