Merge pull request #23763 from eileenmcnaughton/act_test
[civicrm-core.git] / js / crm.ajax.js
1 // https://civicrm.org/licensing
2 /**
3 * @see https://docs.civicrm.org/dev/en/latest/api/interfaces/#ajax
4 * @see https://docs.civicrm.org/dev/en/latest/framework/ajax/
5 */
6 (function($, CRM, _, undefined) {
7 /**
8 * @param string path
9 * @param string|object query
10 * @param string mode - optionally specify "front" or "back"
11 */
12 var tplURL;
13 CRM.url = function (path, query, mode) {
14 if (typeof path === 'object') {
15 tplURL = path;
16 return path;
17 }
18 if (!tplURL) {
19 CRM.console('error', 'Error: CRM.url called before initialization');
20 }
21 if (!mode) {
22 mode = CRM.config && CRM.config.isFrontend ? 'front' : 'back';
23 }
24 query = query || '';
25 var url, frag, hash = '';
26 if (path.indexOf('#') > -1) {
27 hash = '#' + path.split('#')[1];
28 path = path.split('#')[0];
29 }
30 frag = path.split('?');
31 // Remove basepage as it can be changed on some CMS eg. WordPress frontend.
32 frag[0] = frag[0].replace('civicrm/', '/');
33 // Encode url path only if slashes in placeholder were also encoded
34 if (tplURL[mode].indexOf('/crmajax-placeholder-url-path') >= 0) {
35 url = tplURL[mode].replace('/crmajax-placeholder-url-path', frag[0]);
36 } else {
37 url = tplURL[mode].replace('%2Fcrmajax-placeholder-url-path', encodeURIComponent(frag[0]));
38 }
39
40 if (_.isEmpty(query)) {
41 url = url.replace(/[?&]civicrm-placeholder-url-query=1/, '');
42 } else {
43 url = url.replace('civicrm-placeholder-url-query=1', typeof query === 'string' ? query : $.param(query));
44 }
45 if (frag[1]) {
46 url += (url.indexOf('?') < 0 ? '?' : '&') + frag[1];
47 }
48 return url + hash;
49 };
50
51 $.fn.crmURL = function () {
52 return this.each(function() {
53 if (this.href) {
54 this.href = CRM.url(this.href);
55 }
56 });
57 };
58
59 // result is an array, but in js, an array is also an object
60 // Assign all the metadata properties to it, mirroring the results arrayObject in php
61 function arrayObject(data) {
62 var result = data.values || [];
63 if (_.isArray(result)) {
64 delete(data.values);
65 _.assign(result, data);
66 }
67 return result;
68 }
69
70 // https://docs.civicrm.org/dev/en/latest/api/interfaces/#ajax
71 CRM.api4 = function(entity, action, params, index) {
72 return new Promise(function(resolve, reject) {
73 if (typeof entity === 'string') {
74 $.post(CRM.url('civicrm/ajax/api4/' + entity + '/' + action), {
75 params: JSON.stringify(params),
76 index: index
77 })
78 .done(function (data) {
79 resolve(arrayObject(data));
80 })
81 .fail(function (data) {
82 reject(data.responseJSON);
83 });
84 } else {
85 $.post(CRM.url('civicrm/ajax/api4'), {
86 calls: JSON.stringify(entity)
87 })
88 .done(function(data) {
89 _.each(data, function(item, key) {
90 data[key] = arrayObject(item);
91 });
92 resolve(data);
93 })
94 .fail(function (data) {
95 reject(data.responseJSON);
96 });
97 }
98 });
99 };
100
101 /**
102 * AJAX api
103 * @link https://docs.civicrm.org/dev/en/latest/api/interfaces/#ajax
104 */
105 CRM.api3 = function(entity, action, params, status) {
106 if (typeof(entity) === 'string') {
107 params = {
108 entity: entity,
109 action: action.toLowerCase(),
110 json: JSON.stringify(params || {})
111 };
112 } else {
113 params = {
114 entity: 'api3',
115 action: 'call',
116 json: JSON.stringify(entity)
117 };
118 status = action;
119 }
120 var ajax = $.ajax({
121 url: CRM.url('civicrm/ajax/rest'),
122 dataType: 'json',
123 data: params,
124 type: params.action.indexOf('get') === 0 ? 'GET' : 'POST'
125 });
126 if (status) {
127 // Default status messages
128 if (status === true) {
129 status = {success: params.action === 'delete' ? ts('Removed') : ts('Saved')};
130 if (params.action.indexOf('get') === 0) {
131 status.start = ts('Loading...');
132 status.success = null;
133 }
134 }
135 var messages = status === true ? {} : status;
136 CRM.status(status, ajax);
137 }
138 return ajax;
139 };
140
141 /**
142 * @deprecated
143 * AJAX api
144 */
145 CRM.api = function(entity, action, params, options) {
146 // Default settings
147 var settings = {
148 context: null,
149 success: function(result, settings) {
150 return true;
151 },
152 error: function(result, settings) {
153 $().crmError(result.error_message, ts('Error'));
154 return false;
155 },
156 callBack: function(result, settings) {
157 if (result.is_error == 1) {
158 return settings.error.call(this, result, settings);
159 }
160 return settings.success.call(this, result, settings);
161 },
162 ajaxURL: 'civicrm/ajax/rest'
163 };
164 action = action.toLowerCase();
165 // Default success handler
166 switch (action) {
167 case "update":
168 case "create":
169 case "setvalue":
170 case "replace":
171 settings.success = function() {
172 CRM.status(ts('Saved'));
173 return true;
174 };
175 break;
176 case "delete":
177 settings.success = function() {
178 CRM.status(ts('Removed'));
179 return true;
180 };
181 }
182 params = {
183 entity: entity,
184 action: action,
185 json: JSON.stringify(params)
186 };
187 // Pass copy of settings into closure to preserve its value during multiple requests
188 (function(stg) {
189 $.ajax({
190 url: stg.ajaxURL.indexOf('http') === 0 ? stg.ajaxURL : CRM.url(stg.ajaxURL),
191 dataType: 'json',
192 data: params,
193 type: action.indexOf('get') < 0 ? 'POST' : 'GET',
194 success: function(result) {
195 stg.callBack.call(stg.context, result, stg);
196 }
197 });
198 })($.extend({}, settings, options));
199 };
200
201 $.widget('civi.crmSnippet', {
202 options: {
203 url: null,
204 block: true,
205 post: null,
206 crmForm: null
207 },
208 _originalContent: null,
209 _originalUrl: null,
210 isOriginalUrl: function() {
211 var
212 args = {},
213 same = true,
214 newUrl = this._formatUrl(this.options.url),
215 oldUrl = this._formatUrl(this._originalUrl);
216 // Compare path
217 if (newUrl.split('?')[0] !== oldUrl.split('?')[0]) {
218 return false;
219 }
220 // Compare arguments
221 $.each((newUrl.split('?')[1] || '').split('&'), function(k, v) {
222 var arg = v.split('=');
223 args[arg[0]] = arg[1];
224 });
225 $.each((oldUrl.split('?')[1] || '').split('&'), function(k, v) {
226 var arg = v.split('=');
227 if (args[arg[0]] !== undefined && arg[1] !== args[arg[0]]) {
228 same = false;
229 }
230 });
231 return same;
232 },
233 resetUrl: function() {
234 this.options.url = this._originalUrl;
235 },
236 _create: function() {
237 this.element.addClass('crm-ajax-container');
238 if (!this.element.is('.crm-container *')) {
239 this.element.addClass('crm-container');
240 }
241 this._handleOrderLinks();
242 // Set default if not supplied
243 this.options.url = this.options.url || document.location.href;
244 this._originalUrl = this.options.url;
245 },
246 _onFailure: function(data, status) {
247 var msg, title = ts('Network Error');
248 if (this.options.block) this.element.unblock();
249 this.element.trigger('crmAjaxFail', data);
250 switch (status) {
251 case 'Forbidden':
252 title = ts('Access Denied');
253 msg = ts('Ensure you are still logged in and have permission to access this feature.');
254 break;
255 default:
256 msg = ts('Unable to reach the server. Please refresh this page in your browser and try again.');
257 }
258 CRM.alert(msg, title, 'error');
259 },
260 _onError: function(data) {
261 this.element.attr('data-unsaved-changes', 'false').trigger('crmAjaxError', data);
262 if (this.options.crmForm && this.options.crmForm.autoClose && this.element.data('uiDialog')) {
263 this.element.dialog('close');
264 }
265 },
266 _formatUrl: function(url, snippetType) {
267 // Strip hash
268 url = url.split('#')[0];
269 // Add snippet argument to url
270 if (snippetType) {
271 if (url.search(/[&?]snippet=/) < 0) {
272 url += (url.indexOf('?') < 0 ? '?' : '&') + 'snippet=' + snippetType;
273 } else {
274 url = url.replace(/snippet=[^&]*/, 'snippet=' + snippetType);
275 }
276 }
277 return url;
278 },
279 // Hack to deal with civicrm legacy sort functionality
280 _handleOrderLinks: function() {
281 var that = this;
282 $('a.crm-weight-arrow', that.element).click(function(e) {
283 if (that.options.block) that.element.block();
284 $.getJSON(that._formatUrl(this.href, 'json')).done(function() {
285 that.refresh();
286 });
287 e.stopImmediatePropagation();
288 return false;
289 });
290 },
291 _ajax: function(url) {
292 if (!this.options.post || !this.isOriginalUrl()) {
293 return $.getJSON(url);
294 }
295 return $.post({
296 url: url,
297 dataType: 'json',
298 data: this.options.post
299 });
300 },
301 refresh: function() {
302 var that = this;
303 var url = this._formatUrl(this.options.url, 'json');
304 if (this.options.crmForm) $('form', this.element).ajaxFormUnbind();
305 if (this.options.block) this.element.block();
306 this._ajax(url).then(function(data) {
307 if (data.status === 'redirect') {
308 that.options.url = data.userContext;
309 return that.refresh();
310 }
311 if (that.options.block) that.element.unblock();
312 if (!$.isPlainObject(data)) {
313 that._onFailure(data);
314 return;
315 }
316 if (data.status === 'error') {
317 that._onError(data);
318 return;
319 }
320 data.url = url;
321 that.element.trigger('crmUnload').trigger('crmBeforeLoad', data);
322 that._beforeRemovingContent();
323 that.element.html(data.content);
324 that._handleOrderLinks();
325 that.element.trigger('crmLoad', data);
326 if (that.options.crmForm) that.element.trigger('crmFormLoad', data);
327 // This is only needed by forms that load via ajax but submit without ajax, e.g. configure contribution page tabs
328 // TODO: remove this when those forms have been converted to use ajax submit
329 if (data.status === 'form_error' && $.isPlainObject(data.errors)) {
330 that.element.trigger('crmFormError', data);
331 $.each(data.errors, function(formElement, msg) {
332 $('[name="'+formElement+'"]', that.element).crmError(msg);
333 });
334 }
335 }, function(data, msg, status) {
336 that._onFailure(data, status);
337 });
338 },
339 // Perform any cleanup needed before removing/replacing content
340 _beforeRemovingContent: function() {
341 var that = this;
342 // Save original content to be restored if widget is destroyed
343 if (this._originalContent === null) {
344 $('.blockUI', this.element).remove();
345 this._originalContent = this.element.contents().detach();
346 }
347 if (this.options.crmForm) $('form', this.element).ajaxFormUnbind();
348 },
349 _destroy: function() {
350 this.element.removeClass('crm-ajax-container').trigger('crmUnload');
351 this._beforeRemovingContent();
352 if (this._originalContent !== null) {
353 this.element.empty().append(this._originalContent);
354 }
355 }
356 });
357
358 var dialogCount = 0,
359 exclude = '[href^=#], [href^=javascript], [onclick], .no-popup, .cancel';
360
361 CRM.loadPage = function(url, options) {
362 var settings = {
363 target: '#crm-ajax-dialog-' + (dialogCount++),
364 dialog: (options && options.target) ? false : {}
365 };
366 if (options) $.extend(true, settings, options);
367 settings.url = url;
368 // Create new dialog
369 if (settings.dialog) {
370 settings.dialog = CRM.utils.adjustDialogDefaults(settings.dialog);
371 $('<div id="' + settings.target.substring(1) + '"></div>')
372 .dialog(settings.dialog)
373 .parent().find('.ui-dialog-titlebar')
374 .append($('<a class="crm-dialog-titlebar-print ui-dialog-titlebar-close" title="'+ts('Print window')+'" target="_blank" style="right:3.8em;"/>')
375 .button({icons: {primary: 'fa-print'}, text: false}));
376 }
377 // Add handlers to new or existing dialog
378 if ($(settings.target).data('uiDialog')) {
379 $(settings.target)
380 .on('dialogclose', function() {
381 if (settings.dialog && $(this).attr('data-unsaved-changes') !== 'true') {
382 $(this).crmSnippet('destroy').dialog('destroy').remove();
383 }
384 })
385 .on('crmLoad', function(e, data) {
386 // Set title
387 if (e.target === $(settings.target)[0] && data && !settings.dialog.title && data.title) {
388 $(this).dialog('option', 'title', data.title);
389 }
390 // Update print url
391 $(this).parent().find('a.crm-dialog-titlebar-print').attr('href', $(this).data('civiCrmSnippet')._formatUrl($(this).crmSnippet('option', 'url'), '2'));
392 });
393 }
394 $(settings.target).crmSnippet(settings).crmSnippet('refresh');
395 return $(settings.target);
396 };
397 CRM.loadForm = function(url, options) {
398 var formErrors = [], settings = {
399 crmForm: {
400 ajaxForm: {},
401 autoClose: true,
402 validate: true,
403 refreshAction: ['next_new', 'submit_savenext', 'upload_new'],
404 cancelButton: '.cancel',
405 openInline: 'a.open-inline, a.button, a.action-item, a.open-inline-noreturn',
406 onCancel: function(event) {}
407 }
408 };
409 // Move options that belong to crmForm. Others will be passed through to crmSnippet
410 if (options) $.each(options, function(key, value) {
411 if (typeof(settings.crmForm[key]) !== 'undefined') {
412 settings.crmForm[key] = value;
413 }
414 else {
415 settings[key] = value;
416 }
417 });
418
419 var widget = CRM.loadPage(url, settings).off('.crmForm');
420
421 // CRM-14353 - Warn of unsaved changes for all forms except those which have opted out
422 function cancelAction() {
423 var dirty = CRM.utils.initialValueChanged($('form:not([data-warn-changes=false])', widget));
424 widget.attr('data-unsaved-changes', dirty ? 'true' : 'false');
425 if (dirty) {
426 var id = widget.attr('id') + '-unsaved-alert',
427 title = widget.dialog('option', 'title'),
428 alert = CRM.alert('<p>' + ts('%1 has not been saved.', {1: title}) + '</p><p><a href="#" id="' + id + '">' + ts('Restore') + '</a></p>', ts('Unsaved Changes'), 'alert unsaved-dialog', {expires: 60000});
429 $('#' + id).button({icons: {primary: 'fa-undo'}}).click(function(e) {
430 widget.attr('data-unsaved-changes', 'false').dialog('open');
431 e.preventDefault();
432 });
433 }
434 }
435
436 if (widget.data('uiDialog')) widget.on('dialogbeforeclose', function(e) {
437 // CRM-14353 - Warn unsaved changes if user clicks close button or presses "esc"
438 if (e.originalEvent) {
439 cancelAction();
440 }
441 });
442
443 widget.on('crmFormLoad.crmForm', function(event, data) {
444 var $el = $(this).attr('data-unsaved-changes', 'false'),
445 settings = $el.crmSnippet('option', 'crmForm');
446 if (settings.cancelButton) $(settings.cancelButton, this).click(function(e) {
447 e.preventDefault();
448 var returnVal = settings.onCancel.call($el, e);
449 if (returnVal !== false) {
450 $el.trigger('crmFormCancel', e);
451 if ($el.data('uiDialog') && settings.autoClose) {
452 cancelAction();
453 $el.dialog('close');
454 }
455 else if (!settings.autoClose) {
456 $el.crmSnippet('resetUrl').crmSnippet('refresh');
457 }
458 }
459 });
460 if (settings.validate) {
461 $("form", this).crmValidate();
462 }
463 $("form:not('[data-no-ajax-submit=true]')", this).ajaxForm($.extend({
464 url: data.url.replace(/reset=1[&]?/, ''),
465 dataType: 'json',
466 success: function(response) {
467 if (response.content === undefined) {
468 $el.trigger('crmFormSuccess', response);
469 // Reset form for e.g. "save and new"
470 if (response.userContext && (response.status === 'redirect' || (settings.refreshAction && $.inArray(response.buttonName, settings.refreshAction) >= 0))) {
471 // Force reset of original url
472 $el.data('civiCrmSnippet')._originalUrl = response.userContext;
473 $el.crmSnippet('resetUrl').crmSnippet('refresh');
474 }
475 // Close if we are on the original url or the action was "delete" (in which case returning to view may be inappropriate)
476 else if ($el.data('uiDialog') && (settings.autoClose || response.action === 8)) {
477 $el.dialog('close');
478 }
479 else if (settings.autoClose === false) {
480 $el.crmSnippet('resetUrl').crmSnippet('refresh');
481 }
482 }
483 else {
484 if ($el.crmSnippet('option', 'block')) $el.unblock();
485 response.url = data.url;
486 $el.html(response.content).trigger('crmLoad', response).trigger('crmFormLoad', response);
487 if (response.status === 'form_error') {
488 formErrors = [];
489 $el.trigger('crmFormError', response);
490 $.each(response.errors || [], function(formElement, msg) {
491 formErrors.push($('[name="'+formElement+'"]', $el).crmError(msg));
492 });
493 }
494 }
495 },
496 beforeSubmit: function(submission) {
497 $.each(formErrors, function() {
498 if (this && this.close) this.close();
499 });
500 if ($el.crmSnippet('option', 'block')) $el.block();
501 $el.trigger('crmFormSubmit', submission);
502 }
503 }, settings.ajaxForm));
504 if (settings.openInline) {
505 settings.autoClose = $el.crmSnippet('isOriginalUrl');
506 $(this).off('.openInline').on('click.openInline', settings.openInline, function(e) {
507 if ($(this).is(exclude + ', .crm-popup, [target=crm-popup]')) {
508 return;
509 }
510 if ($(this).hasClass('open-inline-noreturn')) {
511 // Force reset of original url
512 $el.data('civiCrmSnippet')._originalUrl = $(this).attr('href');
513 }
514 $el.crmSnippet('option', 'url', $(this).attr('href')).crmSnippet('refresh');
515 e.preventDefault();
516 });
517 }
518 if ($el.data('uiDialog')) {
519 // Show form buttons as part of the dialog
520 var buttonContainers = '.crm-submit-buttons, .action-link',
521 buttons = [],
522 added = [];
523 $(buttonContainers, $el).find('.crm-form-submit, .crm-form-xbutton, a.button, button').each(function() {
524 var $el = $(this),
525 label = $el.is('input') ? $el.attr('value') : $el.text(),
526 identifier = $el.attr('name') || $el.attr('href');
527 $el.attr('tabindex', '-1');
528 if (!identifier || identifier === '#' || $.inArray(identifier, added) < 0) {
529 var $icon = $el.find('.icon, .crm-i'),
530 button = {'data-identifier': identifier, text: label, click: function() {
531 $el[0].click();
532 }};
533 if ($icon.length) {
534 button.icons = {primary: $icon.attr('class')};
535 } else {
536 var action = $el.attr('crm-icon') || ($el.hasClass('cancel') ? 'fa-times' : 'fa-check');
537 button.icons = {primary: action};
538 }
539 buttons.push(button);
540 added.push(identifier);
541 }
542 // display:none causes the form to not submit when pressing "enter"
543 $el.parents(buttonContainers).css({height: 0, padding: 0, margin: 0, overflow: 'hidden'}).attr('aria-hidden', 'true');
544 });
545 $el.dialog('option', 'buttons', buttons);
546 }
547 // Allow a button to prevent ajax submit
548 $('input[data-no-ajax-submit=true], button[data-no-ajax-submit=true]').click(function() {
549 $(this).closest('form').ajaxFormUnbind();
550 });
551 // For convenience, focus the first field
552 $('input[type=text], textarea, select', this).filter(':visible').first().not('.dateplugin').focus();
553 });
554 return widget;
555 };
556 /**
557 * Handler for jQuery click event e.g. $('a').click(CRM.popup);
558 */
559 CRM.popup = function(e) {
560 var $el = $(this).first(),
561 url = $el.attr('href'),
562 popup = $el.data('popup-type') === 'page' ? CRM.loadPage : CRM.loadForm,
563 settings = $el.data('popup-settings') || {},
564 formData = false;
565 settings.dialog = settings.dialog || {};
566 if (e.isDefaultPrevented() || !CRM.config.ajaxPopupsEnabled || !url || $el.is(exclude + ', .open-inline, .open-inline-noreturn')) {
567 return;
568 }
569 // Sized based on css class
570 if ($el.hasClass('small-popup')) {
571 settings.dialog.width = 400;
572 settings.dialog.height = 300;
573 }
574 else if ($el.hasClass('medium-popup')) {
575 settings.dialog.width = settings.dialog.height = '50%';
576 }
577 var dialog = popup(url, settings);
578 // Trigger events from the dialog on the original link element
579 $el.trigger('crmPopupOpen', [dialog]);
580 // Listen for success events and buffer them so we only trigger once
581 dialog.on('crmFormSuccess.crmPopup crmPopupFormSuccess.crmPopup', function(e, data) {
582 formData = data;
583 });
584 dialog.on('dialogclose.crmPopup', function(e, data) {
585 if (formData) {
586 $el.trigger('crmPopupFormSuccess', [dialog, formData]);
587 }
588 $el.trigger('crmPopupClose', [dialog, data]);
589 });
590 e.preventDefault();
591 };
592 /**
593 * An event callback for CRM.popup or a standalone function to refresh the content around a given element
594 * @param e {event|selector}
595 */
596 CRM.refreshParent = function(e) {
597 // Use e.target if input smells like an event, otherwise assume it's a jQuery selector
598 var $el = (e.stopPropagation && e.target) ? $(e.target) : $(e),
599 $table = $el.closest('.dataTable');
600 // Call native refresh method on ajax datatables
601 if ($table.length && $.fn.DataTable.fnIsDataTable($table[0]) && $table.dataTable().fnSettings().sAjaxSource) {
602 // Refresh ALL datatables - needed for contact relationship tab
603 $.each($.fn.dataTable.fnTables(), function() {
604 if ($(this).dataTable().fnSettings().sAjaxSource) $(this).unblock().dataTable().fnDraw();
605 });
606 }
607 // Otherwise refresh the nearest crmSnippet
608 else {
609 $el.closest('.crm-ajax-container, #crm-main-content-wrapper').crmSnippet().crmSnippet('refresh');
610 }
611 };
612
613 $(function($) {
614 $('body')
615 .on('click', 'a.crm-popup, a[target=crm-popup]', CRM.popup)
616 // Close unsaved dialog messages
617 .on('dialogopen', function(e) {
618 $('.alert.unsaved-dialog .ui-notify-cross', '#crm-notification-container').click();
619 })
620 // Destroy old unsaved dialog
621 .on('dialogcreate', function(e) {
622 $('.ui-dialog-content.crm-ajax-container:hidden[data-unsaved-changes=true]').crmSnippet('destroy').dialog('destroy').remove();
623 })
624 // Ensure wysiwyg content is updated prior to ajax submit
625 .on('form-pre-serialize', function(e) {
626 $('.crm-wysiwyg-enabled', e.target).each(function() {
627 CRM.wysiwyg.updateElement(this);
628 });
629 })
630 // Auto-resize dialogs when loading content
631 .on('crmLoad dialogopen', 'div.ui-dialog.ui-resizable.crm-container', function(e) {
632 var
633 $wrapper = $(this),
634 $dialog = $wrapper.children('.ui-dialog-content');
635 // small delay to allow contents to render
636 window.setTimeout(function() {
637 var currentHeight = $wrapper.outerHeight(),
638 padding = currentHeight - $dialog.height(),
639 newHeight = $dialog.prop('scrollHeight') + padding,
640 menuHeight = $('#civicrm-menu').outerHeight();
641 if ($('body').hasClass('crm-menubar-below-cms-menu')) {
642 menuHeight += $('#civicrm-menu').offset().top;
643 }
644 var maxHeight = $(window).height() - menuHeight;
645 newHeight = newHeight > maxHeight ? maxHeight : newHeight;
646 if (newHeight > (currentHeight + 15)) {
647 $dialog.dialog('option', {
648 position: {my: 'center', at: 'center center+' + (menuHeight / 2), of: window},
649 height: newHeight
650 });
651 }
652 }, 500);
653 });
654 });
655
656 }(jQuery, CRM, _));