templates/CRM/common/TabHeader.js

   1 // https://civicrm.org/licensing
   2 /**
   3  * By default this simply loads tabs via ajax CRM.loadPage method
   4  * Tabs with class 'ajaxForm' will use CRM.loadForm instead, suitable for most forms
   5  * Tabs with class 'livePage' will get popup action links, suitable for crud tables
   6  */
   7 cj(function($) {
   8   var tabSettings = CRM.tabSettings || {};
   9   tabSettings.active = tabSettings.active ? $('#tab_' + tabSettings.active).prevAll().length : 0;
  10   $("#mainTabContainer")
  11     .on('tabsbeforeactivate', function(e, ui) {
  12       // Warn of unsaved changes - requires formNavigate.tpl to be included in each tab
  13       if (!global_formNavigate) {
  14         CRM.alert(ts('Your changes in the <em>%1</em> tab have not been saved.', {1: ui.oldTab.text()}), ts('Unsaved Changes'), 'warning');
  15         global_formNavigate = true;
  16       }
  17     })
  18     .on('tabsbeforeload', function(e, ui) {
  19       // Use civicrm ajax wrappers rather than the default $.load
  20       if (!ui.panel.data("civiCrmSnippet")) {
  21         var method = ui.tab.hasClass('ajaxForm') ? 'loadForm' : 'loadPage';
  22         var params = {target: ui.panel};
  23         if (method === 'loadForm') {
  24           params.autoClose = params.openInline = params.cancelButton = params.refreshAction = false;
  25           ui.panel.on('crmFormLoad', function() {
  26             // Hack: "Save and done" and "Cancel" buttons submit without ajax
  27             $('.cancel.form-submit, input[name$=upload_done]', this).on('click', function(e) {
  28               $(this).closest('form').ajaxFormUnbind();
  29             })
  30           });
  31         }
  32         if (ui.tab.hasClass('livePage')) {
  33           ui.panel
  34             .off('click.crmLivePage')
  35             .on('click.crmLivePage', 'a.button, a.action-item', function() {
  36               var url = $(this).attr('href');
  37               // only follow real links not javascript buttons
  38               if (url === '#' || $(this).attr('onclick') || $(this).hasClass('no-popup')) {
  39                 return;
  40               }
  41               CRM.loadForm(url, {
  42                 openInline: 'a:not("[href=#], .no-popup")'
  43               }).on('crmFormSuccess', function(e, data) {
  44                   // Refresh when form completes
  45                   ui.panel.crmSnippet('refresh');
  46                 });
  47               return false;
  48             });
  49         }
  50         ui.panel
  51           .off('.tabInfo')
  52           .on('crmLoad.tabInfo crmFormSuccess.tabInfo', function(e, data) {
  53             if (data) {
  54               if (typeof(data.tabCount) !== 'undefined') {
  55                 CRM.tabHeader.updateCount(ui.tab, data.tabCount);
  56               }
  57               if ($.isPlainObject(data.updateTabs)) {
  58                 $.each(data.updateTabs, CRM.tabHeader.updateCount);
  59                 $.each(data.updateTabs, CRM.tabHeader.resetTab);
  60               }
  61               if (typeof(data.tabValid) !== 'undefined') {
  62                 var method = data.tabValid ? 'removeClass' : 'addClass';
  63                 ui.tab[method]('disabled');
  64               }
  65             }
  66           });
  67         CRM[method]($('a', ui.tab).attr('href'), params);
  68       }
  69       e.preventDefault();
  70     })
  71     .tabs(tabSettings);
  72 });
  73 (function($) {
  74   // Utility functions
  75   CRM.tabHeader = CRM.tabHeader || {};
  76
  77   /**
  78    * @param tab jQuery selector
  79    * @returns panel jQuery object
  80    */
  81   CRM.tabHeader.getTabPanel = function(tab) {
  82     return $('#' + $(tab).attr('aria-controls'));
  83   };
  84
  85   /**
  86    * Update the counter in a tab
  87    * @param tab jQuery selector
  88    * @param count number
  89    */
  90   CRM.tabHeader.updateCount = function(tab, count) {
  91     var oldClass = $(tab).attr('class').match(/(crm-count-\d+)/);
  92     if (oldClass) {
  93       $(tab).removeClass(oldClass[0]);
  94     }
  95     $(tab)
  96       .addClass('crm-count-' + count)
  97       .find('a em').html('' + count);
  98   };
  99
 100   /**
 101    * Clears tab content so that it will be refreshed next time the user clicks on it
 102    * @param tab
 103    */
 104   CRM.tabHeader.resetTab = function(tab) {
 105     var $panel = CRM.tabHeader.getTabPanel(tab);
 106     if ($(tab).hasClass('ui-tabs-active')) {
 107       $panel.crmSnippet('refresh');
 108     } else {
 109       $panel.data("civiCrmSnippet") && $panel.crmSnippet('destroy');
 110     }
 111   };
 112 })(cj);