--- /dev/null
+/*
+Copyright (c) Igor Barma, Alexandre Desoubeaux, Christian Martel, Eric Brun, Mathieu Amblard, Gwenael Gevet, Pierre Guillot, 2012
+ * Copyright Alexandre Desoubeaux, Christian Martel, Cedric Lecarpentier, Alexandre Lefevre, Marc Salvat 2014-2016
+ * Copyright Alexandre Desoubeaux, Christian Martel, Cedric Lecarpentier, Marc Salvat, Marc Suarez, Harifetra Ramamonjy 2017
+For licensing, see README.txt or http://www.pentilanero.com (Cecill-C or AGPL or LGPL)
+*/
+Ext.ns("EntSavoie.MultiFieldSelector");
+
+//Definition du multiFieldContainerPanel
+EntSavoie.MultiFieldSelector.MultiFieldContainerPanel = function (config) {
+ Ext.apply(this, config);
+
+ // Ajoute le texte des erreurs
+ Ext.QuickTips.init();
+ // turn on validation errors beside the field globally
+ Ext.form.Field.prototype.msgTarget = 'side';
+
+ this.type = this.type || "user"; //Cette valeur peut etre : mail / user
+
+ this.multiFieldContainer = this.multiFieldContainer || new EntSavoie.MultiFieldSelector.MultiFieldContainer({
+ renderURLAjax: this.renderURLAjax,
+ mainContainer: this.mainContainer,
+ fieldLabel: this.fieldLabel,
+ height: this.height,
+ labelStyle: this.labelStyle,
+ type: this.type
+ });
+
+ this.addContactBouton = this.addContactBouton || new Ext.Button({
+ tooltip: this.i18n.MultiFieldSelector.MultiFieldContainerPanel.addContactBouton.tooltip,
+ handler: this.onAddContactBouton,
+ iconAlign: 'center',
+ iconCls: 'add-receiver',
+ scope: this
+ });
+
+ // on redefinit les destinataires
+ this.membreRecordCreator = Ext.data.Record.create(["type",
+ "orgId",
+ "roleId",
+ "listId",
+ "mail",
+ "id",
+ "displayText",
+ "admin"]);
+
+ this.membres_store = this.membres_store || new Ext.data.Store( {
+ fields : [ "id", "displayText", "mail", "type", "orgId", "roleId", "listId", "admin"],
+ sortInfo: {
+ field: 'displayText',
+ direction: 'ASC' // or 'DESC' (case sensitive for local sorting)
+ }
+ });
+
+ this.membresPaggingTB = this.membresPaggingTB || new Ext.PagingToolbar({
+ hidden: true,
+ pageSize: 18,
+ store: this.membres_store,
+ displayInfo: false,
+ displayMsg: '',
+ emptyMsg: "",
+ cls: "no-border-paging-toolbar",
+ items:[]
+ });
+
+ // the check column is created using a custom plugin
+ this.checkColumn = "no column";
+
+ this.title_membres_grid = this.title_membres_grid || new Ext.form.DisplayField({
+ value: this.i18n.MultiFieldSelector.MultiFieldContainerPanel.title_membres_grid.value,
+ cls: "title-membre-grid",
+ style: "color: #15428B"
+ });
+
+ this.retirerMembresBtn = this.retirerMembresBtn || new Ext.Button({
+ text: this.i18n.MultiFieldSelector.MultiFieldContainerPanel.retirerMembresBtn.text,
+ iconCls: 'remove-receiver',
+ handler: this.retirerMembres,
+ scope: this
+ });
+
+ this.membreGridTBar = this.membreGridTBar || new Ext.Toolbar({
+ items: [
+ this.title_membres_grid,
+ '->',
+ this.retirerMembresBtn
+ ]
+ });
+
+ this.membres_grid = this.membres_grid || new Ext.grid.GridPanel({
+ enableDragDrop: true,
+ border: false,
+ ddGroup : "retirerMembresDD",
+ ddText : this.membres_gridddText || this.i18n.MultiFieldSelector.MultiFieldContainerPanel.membres_grid.ddText ,
+ store : this.membres_store,
+ autoExpandColumn: 'nom',
+ columns :
+ [{ header : this.i18n.MultiFieldSelector.MultiFieldContainerPanel.membres_grid.columns.nom,
+ id: 'nom',
+ dataIndex : this.type=="mail"?"mail":"displayText",
+ sortable : false,
+ width: 165,
+ editable: false
+ }],
+ tbar: this.membreGridTBar,
+ /*tbar : [{
+ text : 'Retirer',
+ iconCls : 'remove-receiver',
+ handler : this.retirerMembres,
+ scope: this
+ }, '-' ],*/
+ bbar: [this.membresPaggingTB]
+ //title : this.membres_gridddTitle || "Destinataires"
+ });
+
+ // on definit maintenant le composant
+ this.destinatairesPanel = this.destinatairesPanel || new EntSavoie.Atelier.GestionMembres({
+ renderURLAjax: this.renderURLAjax,
+ userGroupId: this.userGroupId,
+ activeLocal: this.type=="mail"?true:false,
+ type: this.type,
+ width: 688,
+ height: 500,
+ border: false,
+ //bkdStyle: 'margin : Opx !important;',
+ membreRecordCreator: this.membreRecordCreator,
+ checkColumn: this.checkColumn,
+ membres_store: this.membres_store,
+ membresPaggingTB: this.membresPaggingTB,
+ membres_grid: this.membres_grid,
+ heightGridListContacts: 500,
+ heightGridListContactMembers: 500,
+ heightGridListGroupMembers: 500,
+ hideColumnStatut: true,
+ isGroupManagment: this.isGroupManagment,
+ hasDirectoryRights : this.hasDirectoryRights
+ });
+
+ this.addDestinataireBtn = this.addDestinataireBtn || new Ext.Button({
+ minWidth: 80,
+ text: this.i18n.MultiFieldSelector.MultiFieldContainerPanel.addDestinataireBtn.text,
+ handler: this.onAddDestFn,
+ scope: this
+ });
+
+ this.cancelDestinataireBtn = this.cancelDestinataireBtn || new Ext.Button({
+ minWidth: 80,
+ text: this.i18n.MultiFieldSelector.MultiFieldContainerPanel.cancelDestinataireBtn.text,
+ handler: this.onCancelDestFn,
+ scope: this
+ });
+
+
+ this.chooseWindow = this.chooseWindow || new Ext.Window({
+ title: this.chooseWindowTitle || this.i18n.MultiFieldSelector.MultiFieldContainerPanel.chooseWindow.title,
+ hidden: true,
+ border: false,
+ resizable: false,
+ modal: true,
+ closeAction: 'hide',
+ closable: false,
+ layout: "fit",
+ width: 695,
+ height: 564,
+ items: [this.destinatairesPanel],
+ buttons: [this.addDestinataireBtn, this.cancelDestinataireBtn]
+ });
+
+
+ EntSavoie.MultiFieldSelector.MultiFieldContainerPanel.superclass.constructor.call(this, {
+ height: this.height || 45,
+ layout: "hbox",
+ autoWidth: true,
+ autoScroll: true,
+ items: [
+ this.multiFieldContainer,
+ this.addContactBouton
+ ]
+ });
+
+};
+
+// Definition du multiFieldContainerPanel
+Ext.extend(EntSavoie.MultiFieldSelector.MultiFieldContainerPanel, Ext.Panel, {
+ initComponent: function () {
+ EntSavoie.MultiFieldSelector.MultiFieldContainerPanel.superclass.initComponent.call(this);
+ },
+
+ reset: function() {
+ this.multiFieldContainer.reset();
+ },
+
+ retirerMembres : function() {
+ var recListArray = this.membres_grid
+ .getSelectionModel().getSelections();
+
+ for (i = 0; i < recListArray.length; i++) {
+ var currRec = recListArray[i];
+ this.membres_store.remove(currRec);
+ }
+ },
+
+ onAddDestFn: function(btn) {
+ this.chooseWindow.hide();
+ this.reset();
+
+ var arrayValues = [];
+ for (i=0; i<this.membres_store.getCount(); i++) {
+ var rec = this.membres_store.getAt(i);
+
+ var val = null;
+ if (this.type == "mail") {
+ val = {displayValue: rec.get("mail"),
+ orgId: rec.get("orgId"),
+ roleId: rec.get("roleId"),
+ listId: rec.get("listId"),
+ itemValue: rec.get("mail"),
+ type: rec.get("type")};
+ }
+ else {
+ val = {displayValue: rec.get("displayText"),
+ orgId: rec.get("orgId"),
+ roleId: rec.get("roleId"),
+ listId: rec.get("listId"),
+ itemValue: rec.get("id"),
+ type: rec.get("type")};
+ }
+ arrayValues.push(val);
+ }
+
+ this.setValues(arrayValues);
+ },
+
+ onCancelDestFn: function(btn) {
+ this.chooseWindow.hide();
+ },
+
+ initializeFields: function() {
+ this.membres_store.removeAll();
+ var currentValues = this.getValues();
+
+
+ for (i=0; i<currentValues.length; i++) {
+
+ var val = currentValues[i];
+
+ if (this.type == "mail") {
+ this.membres_store.add(new this.membreRecordCreator({
+ type: val.type,
+ orgId: val.orgId,
+ roleId: val.roleId,
+ listId: val.listId,
+ mail: val.displayText,
+ id: val.id,
+ displayText: val.displayText,
+ admin: false
+ }));
+ }
+ else {
+ this.membres_store.add(new this.membreRecordCreator({
+ type: val.type,
+ orgId: val.orgId,
+ roleId: val.roleId,
+ listId: val.listId,
+ mail: "",
+ id: (val.type == "")?"2"+val.id:"1"+val.id,
+ displayText: val.displayText,
+ admin: false
+ }));
+ }
+ }
+ },
+
+ // methode pour obtenir les differents valeurs du champs
+ getValues: function() {
+ return this.multiFieldContainer.getValues();
+ },
+
+ setValues: function(values) {
+ this.multiFieldContainer.setValues(values);
+ },
+
+ onAddContactBouton: function() {
+ this.initializeFields();
+ this.chooseWindow.show();
+ }
+
+});
+
+
+EntSavoie.MultiFieldSelector.MultiFieldContainer = function (config) {
+ Ext.apply(this, config);
+
+ // Ajoute le texte des erreurs
+ Ext.QuickTips.init();
+ // turn on validation errors beside the field globally
+ Ext.form.Field.prototype.msgTarget = 'side';
+
+ this.type = this.type || "user";
+
+ EntSavoie.MultiFieldSelector.MultiFieldContainer.superclass.constructor.call(this, {
+ height: this.height || 45,
+ cls: "containerField-default",
+ width: 585,
+ autoScroll: true
+ });
+
+
+ // definition des listeners
+ this.on("render", this.onRenderContainer, this);
+
+
+};
+
+Ext.extend(EntSavoie.MultiFieldSelector.MultiFieldContainer, Ext.Panel, {
+ initComponent: function () {
+ EntSavoie.MultiFieldSelector.MultiFieldContainer.superclass.initComponent.call(this);
+ },
+
+ onRenderContainer: function (cmp) {
+ cmp.el.on("click", this.onClickContainer, this);
+ },
+
+ onClickContainer: function() {
+
+ var newField = new EntSavoie.MultiFieldSelector.PanelItemField({
+ renderURLAjax: this.renderURLAjax,
+ multiFieldContainer: this,
+ type: this.type
+ });
+ this.add(newField);
+ this.doLayout();
+ newField.itemField.focus(false, 100);
+ },
+
+ // methode pour obtenir les differents valeurs du champs
+ getValues: function() {
+
+ var result = [];
+ this.items.each(function(item, index) {
+ if (this.type == "mail") {
+ var rec = item.itemField.getStore().getById(item.itemField.getValue());
+ if (rec) {
+ var resTmp = {};
+ resTmp.type = rec.get("type");
+ resTmp.orgId = rec.get("orgId");
+ resTmp.roleId = rec.get("roleId");
+ resTmp.listId = rec.get("listId");
+ resTmp.displayText = rec.get("display");
+ resTmp.id = rec.get("value");
+ result.push(resTmp);
+ }
+ }
+ else {
+ var rec = item.itemField.getStore().getById(item.itemField.getValue());
+ if (rec) {
+ var resTmp = {};
+ resTmp.type = rec.get("type");
+ resTmp.orgId = rec.get("orgId");
+ resTmp.roleId = rec.get("roleId");
+ resTmp.listId = rec.get("listId");
+ resTmp.displayText = rec.get("display");
+ resTmp.id = rec.get("value").substring(1);
+ result.push(resTmp);
+ }
+ }
+
+ }, this);
+ return result;
+ },
+
+
+ reset: function() {
+ this.removeAll();
+ },
+
+ setValues: function(values) {
+ if (values) {
+
+ for (i=0; i<values.length; i++) {
+ var val = values[i];
+
+ var newField = new EntSavoie.MultiFieldSelector.PanelItemField({
+ renderURLAjax: this.renderURLAjax,
+ valueSet: val,
+ viewMode: 'label',
+ type: this.type,
+ multiFieldContainer: this
+ });
+ this.add(newField);
+ }
+
+ this.doLayout();
+ this.items.each(function(item, index) {
+
+ var elMetrics = Ext.util.TextMetrics.createInstance(item.labelItemField.getEl());
+
+ var regInfSup = new RegExp('[<>]', 'g');
+ item.toggleToLabel(false, elMetrics.getWidth(item.labelItemField.getValue().replace(regInfSup,"=")));
+ }, this);
+
+ this.doLayout();
+ }
+ }
+
+});
+
+
+
+//*************************** DEFINITION DU DOUBLE PANEL ***************************
+EntSavoie.MultiFieldSelector.PanelItemField = function (config) {
+ Ext.apply(this, config);
+
+ // Ajoute le texte des erreurs
+ Ext.QuickTips.init();
+ // turn on validation errors beside the field globally
+ Ext.form.Field.prototype.msgTarget = 'side';
+
+ this.valueSet = this.valueSet || {};
+
+ this.type = this.type || "user";
+
+ this.itemField = this.itemField || new EntSavoie.MultiFieldSelector.ItemField({
+ renderURLAjax: this.renderURLAjax,
+ valueSet: this.valueSet,
+ multiFieldContainer: this.multiFieldContainer,
+ panelItemField: this,
+ type: this.type
+ });
+
+ this.labelItemField = this.labelItemField || new Ext.form.DisplayField({
+ cls: "labelItemField",
+ hidden: true,
+ htmlEncode: true,
+ value: this.valueSet.displayValue
+ });
+
+ // Menu clic droit
+ this.rightClicMenu = this.rightClicMenu || new Ext.menu.Menu({
+ items: [
+ {
+ text: this.i18n.MultiFieldSelector.PanelItemField.rightClicMenu.items.ajout ,
+ handler: this.addToAdressBook,
+ iconCls: 'folder-add',
+ hidden: (this.type == "user" || (this.valueSet.type && this.valueSet.type != "")),
+ scope: this
+ },
+ {
+ text: this.i18n.MultiFieldSelector.PanelItemField.rightClicMenu.items.suppression ,
+ handler: this.destroy,
+ iconCls: 'delete',
+ scope: this
+ }
+ ]
+ });
+
+
+ EntSavoie.MultiFieldSelector.PanelItemField.superclass.constructor.call(this, {
+ cls: "panelItemField",
+ layout: "hbox",
+ height: this.height || 20,
+ width: 200,
+ items: [
+ this.itemField,
+ this.labelItemField
+ ]
+
+ });
+
+
+ // definition des listeners
+ this.labelItemField.on("render", this.onRenderLabelField, this);
+
+
+};
+
+Ext.extend(EntSavoie.MultiFieldSelector.PanelItemField, Ext.Panel, {
+ initComponent: function () {
+ EntSavoie.MultiFieldSelector.PanelItemField.superclass.initComponent.call(this);
+ },
+
+ onRenderLabelField: function(cmp) {
+ cmp.el.on("click", this.onClickLabel, this);
+ cmp.el.on("contextmenu", this.onLabelContextMenuGrid, this);
+ },
+
+ onClickLabel: function(event, cmp) {
+ event.stopPropagation();
+
+ if (this.type == "mail") { //Edition impossible des labels pour le type user
+
+ if (this.itemField.getStore().getById(this.itemField.getValue()).get("type") == "") {//Cas des user : editable
+ this.labelItemField.hide();
+ this.itemField.show();
+ this.itemField.focus(false, 100);
+ this.itemField.setWidth(200);
+ this.setWidth(200);
+ }
+ }
+ },
+
+ toggleToLabel: function(handleComboValue, textWidth) {
+ this.itemField.hide();
+ if (handleComboValue) {
+ this.labelItemField.setValue(this.itemField.valueSet.displayValue);
+ }
+
+ this.labelItemField.show();
+ var w = this.labelItemField.getWidth() + 7;
+ if (textWidth) {
+ w = textWidth + (textWidth/12) +3;
+ this.labelItemField.setWidth(w);
+ }
+ this.itemField.setWidth(w);
+ this.setWidth(w);
+
+ },
+
+ onLabelContextMenuGrid: function(event, cmp) {
+ event.stopEvent();
+ var coords = event.getXY();
+ this.rightClicMenu.showAt([coords[0], coords[1]]);
+ },
+
+ addToAdressBook: function() {
+ this.multiFieldContainer.mainContainer.addContactToAdressBook(this.itemField.valueSet.itemValue);
+ }
+
+});
+
+
+// ***************** DEFINITION DES ITEMS **********************************
+
+EntSavoie.MultiFieldSelector.ItemField = function (config) {
+ Ext.apply(this, config);
+
+ // Ajoute le texte des erreurs
+ Ext.QuickTips.init();
+ // turn on validation errors beside the field globally
+ Ext.form.Field.prototype.msgTarget = 'side';
+
+ this.valueSet = this.valueSet || {};
+
+ this.completionStore = this.completionStore || new Ext.data.Store({
+ // load using HTTP
+ proxy: new Ext.data.HttpProxy({
+ url: (this.type == "mail")?this.renderURLAjax+"&jspPage=%2Fajax%2FgestionMembres%2FmailCompletion.jsp":this.renderURLAjax+"&jspPage=%2Fajax%2FgestionMembres%2FuserCompletion.jsp"
+ }),
+
+ // the return will be XML, so lets set up a reader
+ reader: new Ext.data.XmlReader({
+ record: "completion",
+ id: "value"
+ }, ["value", "display", "type", "orgId", "roleId", "listId"])
+ });
+
+ // Custom rendering Template
+ var resultTpl = new Ext.XTemplate(
+ '<tpl for="."><div class="search-item">',
+ '{display:htmlEncode}',
+ '</div></tpl>'
+
+ );
+
+
+
+ EntSavoie.MultiFieldSelector.ItemField.superclass.constructor.call(this, {
+ cls: "itemField",
+ store: this.completionStore,
+ displayField:'display',
+ valueField: 'value',
+ typeAhead: false,
+ validateOnBlur: true,
+ loadingText: this.i18n.MultiFieldSelector.ItemField.loadFieldInProgress.loadingText,
+ width: 200,
+ //pageSize:10,
+ hideTrigger:true,
+ tpl: resultTpl,
+ itemSelector: 'div.search-item',
+ selectOnFocus:true,
+ forceSelection: true
+ });
+
+
+ // definition des listeners
+ this.on("render", this.onRenderItem, this);
+ this.on("select", this.onSelectItem, this);
+};
+
+
+Ext.extend(EntSavoie.MultiFieldSelector.ItemField, Ext.form.ComboBox, {
+ initComponent: function () {
+ EntSavoie.MultiFieldSelector.ItemField.superclass.initComponent.call(this);
+ },
+
+ onRenderItem: function (cmp) {
+ cmp.el.on("click", this.onClickItem, this);
+ cmp.el.on("blur", this.onBlurItem, this);
+ cmp.el.on("focus", this.onFocusItem, this);
+ cmp.el.on("keydown", this.onKeyDownItem, this);
+
+ if (this.valueSet!={}) {
+ //var defaultRec = null;
+ /*
+ if (this.type == "mail"){
+ defaultRec = new this.completionStore.recordType({
+ value: this.valueSet.itemValue,
+ display: this.valueSet.displayValue
+ }, this.valueSet.itemValue); // create new record
+
+ }
+ else {
+ defaultRec = new this.completionStore.recordType({
+ value: this.valueSet.itemValue,
+ display: this.valueSet.displayValue,
+ type: this.valueSet.type,
+ orgId: this.valueSet.orgId,
+ roleId: this.valueSet.roleId,
+ listId: this.valueSet.listId
+ }, this.valueSet.itemValue); // create new record
+ }
+ */
+ var defaultRec = new this.completionStore.recordType({
+ value: this.valueSet.itemValue,
+ display: this.valueSet.displayValue,
+ type: this.valueSet.type,
+ orgId: this.valueSet.orgId,
+ roleId: this.valueSet.roleId,
+ listId: this.valueSet.listId
+ }, this.valueSet.itemValue); // create new record
+
+
+ this.completionStore.add(defaultRec);
+ this.setValue(this.valueSet.itemValue);
+ }
+ },
+
+ itemValidator: function(value) {
+ if (this.getRawValue()!="") {
+ return (this.getStore().getById(value) != null);
+ }
+ else {
+ return true;
+ }
+ },
+
+ onClickItem: function(event, item) {
+
+ //this.itemField.removeClass("itemFieldView");
+ },
+
+ onFocusItem: function(item) {
+ },
+
+ onBlurItem: function(item) {
+
+ if (this.getRawValue()=="") {
+ this.multiFieldContainer.remove(this.panelItemField);
+ this.multiFieldContainer.doLayout();
+ }
+ else {
+
+ var elMetrics = Ext.util.TextMetrics.createInstance(this.panelItemField.labelItemField.getEl());
+
+ //alert(this.getValue());
+ if (this.getStore().getById(this.getValue()) != null) {
+ this.valueSet.displayValue = this.getStore().getById(this.getValue()).get("display");
+ this.valueSet.itemValue = this.getValue();
+
+ var regInfSup = new RegExp('[<>]', 'g');
+ this.panelItemField.toggleToLabel(true, elMetrics.getWidth(this.valueSet.displayValue.replace(regInfSup,"=")));
+ }
+ else {
+
+ if (this.type=="mail") {
+ this.valueSet.displayValue = this.getRawValue();
+ this.valueSet.itemValue = this.getRawValue();
+
+
+ var defaultRec = new this.completionStore.recordType({
+ value: this.valueSet.itemValue,
+ display: this.valueSet.displayValue,
+ type: "",
+ orgId: "",
+ roleId: "",
+ listId: ""
+ }, this.valueSet.itemValue); // create new record
+
+
+ this.completionStore.add(defaultRec);
+
+ var regInfSup = new RegExp('[<>]', 'g');
+ this.panelItemField.toggleToLabel(true, elMetrics.getWidth(this.valueSet.displayValue.replace(regInfSup,"=")));
+
+ }
+ else {
+ //this.multiFieldContainer.remove(this.panelItemField);
+ //this.multiFieldContainer.doLayout();
+ this.valueSet.displayValue = this.getRawValue();
+ this.panelItemField.labelItemField.addClass("invalid-field");
+ this.panelItemField.toggleToLabel(true);
+ }
+ }
+
+ }
+ },
+
+ onClickList: function() {
+ event.stopPropagation();
+ },
+
+ onSelectItem: function(combo, record, index) {
+
+ this.valueSet.displayValue = record.get("display");
+ this.valueSet.itemValue = record.get("value");
+
+ this.panelItemField.labelItemField.removeClass("invalid-field");
+
+ var elMetrics = Ext.util.TextMetrics.createInstance(this.panelItemField.labelItemField.getEl());
+
+ var regInfSup = new RegExp('[<>]', 'g');
+ this.panelItemField.toggleToLabel(true,elMetrics.getWidth(record.get("display").replace(regInfSup,"=")));
+
+
+
+ this.multiFieldContainer.onClickContainer();
+ },
+
+ onKeyDownItem: function(e) {
+ var k = e.getKey();
+ // Si l'événement clavier est la touche entrée
+ if (k=='13') {
+ this.multiFieldContainer.onClickContainer();
+ }
+ // Si l'événement clavier est suppr
+ if (k=='46') {
+ if (this.getValue()=="") {
+ this.multiFieldContainer.remove(this.panelItemField);
+ this.multiFieldContainer.doLayout();
+ }
+ }
+ if (k=='8') {
+ if (this.getRawValue()=="") {
+ var items = this.multiFieldContainer.items;
+ if(items.length > 1){
+ //-2 pour ne pas prendre l'item sur lequel on est
+ var lastItem = items.get(items.length - 2);
+ this.multiFieldContainer.remove(lastItem);
+ this.multiFieldContainer.doLayout();
+ }
+ e.stopEvent();
+ } else {
+ this.fireEvent('keydown', this, e);
+ }
+ }
+ }
+
+});