2 if (!CRM
.ProfileSelector
) CRM
.ProfileSelector
= {};
4 CRM
.ProfileSelector
.Option
= Backbone
.Marionette
.ItemView
.extend({
5 template
: '#profile_selector_option_template',
8 'change:title': 'render'
10 onRender: function() {
11 this.$el
.attr('value', this.model
.get('id'));
15 CRM
.ProfileSelector
.Select
= Backbone
.Marionette
.CollectionView
.extend({
17 itemView
: CRM
.ProfileSelector
.Option
21 * Render a pane with 'Select/Preview/Edit/Copy/Create' functionality for profiles.
23 * Note: This view works with a ufGroupCollection, and it creates popups for a
24 * ufGroupModel. These are related but not facilely. The ufGroupModels in the
25 * ufGroupCollection are never passed to the popup, and the models from the
26 * popup are never added to the collection. This is because the popup works
27 * with temporary, local copies -- but the collection reflects the actual list
31 * - ufGroupId: int, the default selection
32 * - ufGroupCollection: the profiles which can be selected
33 * - ufEntities: hard-coded entity list used with any new/existing forms
34 * (this may be removed when the form-runtime is updated to support hand-picking
35 * entities for each form)
37 CRM
.ProfileSelector
.View
= Backbone
.Marionette
.Layout
.extend({
38 template
: '#profile_selector_template',
40 selectRegion
: '.crm-profile-selector-select'
43 'change .crm-profile-selector-select select': 'onChangeUfGroupId',
44 'click .crm-profile-selector-edit': 'doEdit',
45 'click .crm-profile-selector-copy': 'doCopy',
46 'click .crm-profile-selector-create': 'doCreate',
47 'click .crm-profile-selector-preview': 'doShowPreview',
48 // prevent interaction with preview form
49 'click .crm-profile-selector-preview-pane': false,
50 'crmLoad .crm-profile-selector-preview-pane': 'disableForm'
52 /** @var Marionette.View which specifically builds on jQuery-UI's dialog */
54 onRender: function() {
55 var view
= new CRM
.ProfileSelector
.Select({
56 collection
: this.options
.ufGroupCollection
58 this.selectRegion
.show(view
);
59 this.setUfGroupId(this.options
.ufGroupId
, {silent
: true});
61 this.$('.crm-profile-selector-select select').css('width', '25em').crmSelect2();
64 onChangeUfGroupId: function(event
) {
65 this.options
.ufGroupId
= $(event
.target
).val();
66 this.trigger('change:ufGroupId', this);
70 toggleButtons: function() {
71 this.$('.crm-profile-selector-edit,.crm-profile-selector-copy').prop('disabled', !this.hasUfGroupId());
73 hasUfGroupId: function() {
74 return (this.getUfGroupId() && this.getUfGroupId() !== '') ? true : false;
76 setUfGroupId: function(value
, options
) {
77 this.options
.ufGroupId
= value
;
78 this.$('.crm-profile-selector-select select').val(value
);
79 this.$('.crm-profile-selector-select select').select2('val', value
, (!options
|| !options
.silent
));
81 getUfGroupId: function() {
82 return this.options
.ufGroupId
;
84 doPreview: function() {
85 var $pane
= this.$('.crm-profile-selector-preview-pane');
86 if (!this.hasUfGroupId()) {
87 $pane
.html($('#profile_selector_empty_preview_template').html());
89 CRM
.loadPage(CRM
.url("civicrm/ajax/inline", {class_name
: 'CRM_UF_Form_Inline_PreviewById', id
: this.getUfGroupId()}), {target
: $pane
});
92 doShowPreview: function() {
93 var $preview
= this.$('.crm-profile-selector-preview');
94 var $pane
= this.$('.crm-profile-selector-preview-pane');
95 if ($preview
.hasClass('crm-profile-selector-preview-show')) {
96 $preview
.removeClass('crm-profile-selector-preview-show');
97 $preview
.find('.icon').removeClass('ui-icon-zoomin').addClass('ui-icon-zoomout');
100 $preview
.addClass('crm-profile-selector-preview-show');
101 $preview
.find('.icon').removeClass('ui-icon-zoomout').addClass('ui-icon-zoomin');
105 disableForm: function() {
106 this.$(':input', '.crm-profile-selector-preview-pane').not('.select2-input').prop('readOnly', true);
108 doEdit: function(e
) {
110 var profileSelectorView
= this;
111 var designerDialog
= new CRM
.Designer
.DesignerDialog({
112 findCreateUfGroupModel: function(options
) {
113 var ufId
= profileSelectorView
.getUfGroupId();
114 // Retrieve UF group and fields from the api
115 CRM
.api('UFGroup', 'getsingle', {id
: ufId
, "api.UFField.get": 1}, {
116 success: function(formData
) {
117 // Note: With chaining, API returns some extraneous keys that aren't part of UFGroupModel
118 var ufGroupModel
= new CRM
.UF
.UFGroupModel(_
.pick(formData
, _
.keys(CRM
.UF
.UFGroupModel
.prototype.schema
)));
119 ufGroupModel
.setUFGroupModel(ufGroupModel
.calculateContactEntityType(), profileSelectorView
.options
.ufEntities
);
120 ufGroupModel
.getRel('ufFieldCollection').reset(_
.values(formData
["api.UFField.get"].values
));
121 options
.onLoad(ufGroupModel
);
126 CRM
.designerApp
.vent
.on('ufSaved', this.onSave
, this);
127 this.setDialog(designerDialog
);
129 doCopy: function(e
) {
131 // This is largely the same as doEdit, but we ultimately pass in a deepCopy of the ufGroupModel.
132 var profileSelectorView
= this;
133 var designerDialog
= new CRM
.Designer
.DesignerDialog({
134 findCreateUfGroupModel: function(options
) {
135 var ufId
= profileSelectorView
.getUfGroupId();
136 // Retrieve UF group and fields from the api
137 CRM
.api('UFGroup', 'getsingle', {id
: ufId
, "api.UFField.get": 1}, {
138 success: function(formData
) {
139 // Note: With chaining, API returns some extraneous keys that aren't part of UFGroupModel
140 var ufGroupModel
= new CRM
.UF
.UFGroupModel(_
.pick(formData
, _
.keys(CRM
.UF
.UFGroupModel
.prototype.schema
)));
141 ufGroupModel
.setUFGroupModel(ufGroupModel
.calculateContactEntityType(), profileSelectorView
.options
.ufEntities
);
142 ufGroupModel
.getRel('ufFieldCollection').reset(_
.values(formData
["api.UFField.get"].values
));
143 options
.onLoad(ufGroupModel
.deepCopy());
148 CRM
.designerApp
.vent
.on('ufSaved', this.onSave
, this);
149 this.setDialog(designerDialog
);
151 doCreate: function(e
) {
153 var profileSelectorView
= this;
154 var designerDialog
= new CRM
.Designer
.DesignerDialog({
155 findCreateUfGroupModel: function(options
) {
156 // Initialize new UF group
157 var ufGroupModel
= new CRM
.UF
.UFGroupModel();
158 ufGroupModel
.getRel('ufEntityCollection').reset(profileSelectorView
.options
.ufEntities
);
159 options
.onLoad(ufGroupModel
);
162 CRM
.designerApp
.vent
.on('ufSaved', this.onSave
, this);
163 this.setDialog(designerDialog
);
166 CRM
.designerApp
.vent
.off('ufSaved', this.onSave
, this);
167 var ufGroupId
= this.activeDialog
.model
.get('id');
168 var modelFromCollection
= this.options
.ufGroupCollection
.get(ufGroupId
);
169 if (modelFromCollection
) {
170 // copy in changes to UFGroup
171 modelFromCollection
.set(this.activeDialog
.model
.toStrictJSON());
173 // add in new UFGroup
174 modelFromCollection
= new CRM
.UF
.UFGroupModel(this.activeDialog
.model
.toStrictJSON());
175 this.options
.ufGroupCollection
.add(modelFromCollection
);
177 this.setUfGroupId(ufGroupId
);
180 setDialog: function(view
) {
181 if (this.activeDialog
) {
182 this.activeDialog
.close();
184 this.activeDialog
= view
;