From 6e8d1c11f8d1b616776c8d4b2475cd319bf9b020 Mon Sep 17 00:00:00 2001
From: Coleman Watts <coleman@civicrm.org>
Date: Tue, 3 Jun 2014 22:17:13 +0100
Subject: [PATCH] CRM-12872 - Consolidate search js for ajax vs simple
 selections

---
 CRM/Contact/Form/Search.php                   | 33 +------
 js/crm.searchForm.js                          | 95 +++++++++++++++----
 templates/CRM/Contact/Form/Search/Custom.tpl  | 42 --------
 .../CRM/Contact/Form/Search/ResultTasks.tpl   |  6 +-
 templates/CRM/Contact/Form/Selector.tpl       | 55 +----------
 5 files changed, 89 insertions(+), 142 deletions(-)

diff --git a/CRM/Contact/Form/Search.php b/CRM/Contact/Form/Search.php
index 2b8a0d7714..2cd681aa92 100644
--- a/CRM/Contact/Form/Search.php
+++ b/CRM/Contact/Form/Search.php
@@ -337,6 +337,7 @@ class CRM_Contact_Form_Search extends CRM_Core_Form_Search {
    */
   function buildQuickForm() {
     parent::buildQuickForm();
+    $this->setAttribute('class', 'crm-search-form crm-ajax-selection-form');
     CRM_Core_Resources::singleton()
       // jsTree is needed for tags popup
       ->addScriptFile('civicrm', 'packages/jquery/plugins/jstree/jquery.jstree.js', 0, 'html-header', FALSE)
@@ -450,7 +451,6 @@ class CRM_Contact_Form_Search extends CRM_Core_Form_Search {
       $this->add('submit', $this->_actionButtonName, ts('Add Contacts to %1', array(1 => $this->_group[$this->_amtgID])),
         array(
           'class' => 'form-submit',
-          'onclick' => "return checkPerformAction('mark_x', '" . $this->getName() . "', 1);",
         )
       );
       $this->add('hidden', 'task', CRM_Contact_Task::GROUP_CONTACTS);
@@ -459,14 +459,6 @@ class CRM_Contact_Form_Search extends CRM_Core_Form_Search {
       $this->addTaskMenu($tasks);
     }
 
-    // need to perform tasks on all or selected items ? using radio_ts(task selection) for it
-    $selectedRowsRadio = $this->addElement('radio', 'radio_ts', NULL, '', 'ts_sel', array(
-      'checked' => 'checked',
-        'onclick' => 'toggleTaskAction( true );',
-      ));
-    $this->assign('ts_sel_id', $selectedRowsRadio->_attributes['id']);
-
-
     if ($qfKeyParam = CRM_Utils_Array::value('qfKey', $this->_formValues)) {
       $qfKeyParam = "civicrm search {$qfKeyParam}";
       $selectedContactIdsArr = CRM_Core_BAO_PrevNextCache::getSelection($qfKeyParam);
@@ -475,31 +467,10 @@ class CRM_Contact_Form_Search extends CRM_Core_Form_Search {
 
     $this->assign_by_ref('selectedContactIds', $selectedContactIds);
 
-    $allRowsRadio = $this->addElement('radio', 'radio_ts', NULL, '', 'ts_all', array('class' => 'select-rows', 'onclick' => $this->getName() . ".toggleSelect.checked = false; toggleTaskAction( true );toggleContactSelection( 'resetSel', '{$qfKeyParam}', 'reset' );"));
-    $this->assign('ts_all_id', $allRowsRadio->_attributes['id']);
-
-    /*
-     * add form checkboxes for each row. This is needed out here to conform to QF protocol
-     * of all elements being declared in builQuickForm
-     */
-
     $rows = $this->get('rows');
 
     if (is_array($rows)) {
-      $this->addElement('checkbox', 'toggleSelect', NULL, NULL, array('class' => 'select-rows', 'onclick' => "toggleTaskAction( true ); toggleContactSelection( 'toggleSelect', '" . $qfKeyParam . "' , 'multiple' );"));
-
-      $unselectedContactIds = array();
-      foreach ($rows as $row) {
-        $this->addElement('checkbox', $row['checkbox'],
-          NULL, NULL,
-          array('onclick' => "toggleContactSelection( '" . $row['checkbox'] . "', '" . $qfKeyParam . "' , 'single' );toggleTaskAction( true );", 'class' => 'select-row')
-        );
-
-        if (!in_array($row['contact_id'], $selectedContactIds)) {
-          $unselectedContactIds[] = $row['contact_id'];
-        }
-      }
-      $this->assign_by_ref('unselectedContactIds', $unselectedContactIds);
+      $this->addRowSelectors($rows);
     }
 
   }
diff --git a/js/crm.searchForm.js b/js/crm.searchForm.js
index 29e5bbea52..a89f8f6a6e 100644
--- a/js/crm.searchForm.js
+++ b/js/crm.searchForm.js
@@ -1,30 +1,93 @@
 // http://civicrm.org/licensing
-
-(function($, _) {
+(function($, _, undefined) {
   "use strict";
-  var form = 'form.crm-search-form';
+  var selected = 0,
+    form = 'form.crm-search-form';
 
-  function toggleTaskMenu() {
-    var $menu = $('select#task', form);
-    $menu.val('').select2('val', '');
-    if ($('[name=radio_ts][value=ts_all], .select-row', form).filter(':checked').length) {
-      $menu.prop('disabled', false).select2('enable');
-    } else {
-      $menu.prop('disabled', true).select2('disable');
+  function clearTaskMenu() {
+    $('select#task', form).val('').select2('val', '').prop('disabled', true).select2('disable');
+  }
+
+  function enableTaskMenu() {
+    if (selected || $('[name=radio_ts][value=ts_all]', form).is(':checked')) {
+      $('select#task', form).prop('disabled', false).select2('enable');
     }
   }
 
+  function displayCount() {
+    $('label[for*=ts_sel] span', form).text(selected);
+  }
+
   function countCheckboxes() {
-    $('label[for*=ts_sel] span', form).text($('input.select-row:checked', form).length);
+    return $('input.select-row:checked', form).length;
+  }
+
+  function usesAjax() {
+    return $(form).hasClass('crm-ajax-selection-form');
   }
 
+  function phoneHome(single, $el, event) {
+    var url = CRM.url('civicrm/ajax/markSelection');
+    var params = {qfKey: 'civicrm search ' + $('input[name=qfKey]', form).val()};
+    if (!$el.is(':checked')) {
+      params.action = 'unselect';
+      params.state = 'unchecked';
+    }
+    if (single) {
+      params.name = $el.attr('id');
+    } else {
+      params.variableType = 'multiple';
+      if ($el.is('a')) {
+        event.preventDefault();
+        $("input.select-row, input.select-rows", form).prop('checked', false).closest('tr').removeClass('crm-row-selected');
+      } else {
+        params.name = $('input.select-row').map(function() {return $(this).attr('id')}).get().join('-');
+      }
+    }
+    $.getJSON(url, params, function(data) {
+      if (data && data.getCount !== undefined) {
+        selected = data.getCount;
+        displayCount();
+        enableTaskMenu();
+      }
+    });
+  }
+
+  // Handle user interactions with search results
   $('#crm-container')
-    .on('change', '[name=radio_ts], .select-row', toggleTaskMenu)
-    .on('change', 'input.select-row', countCheckboxes)
-    .on('crmLoad', toggleTaskMenu)
-    .on('click', 'input.select-row, input.select-rows', function() {
-      $(this).closest('form').find('input[name=radio_ts][value=ts_sel]').prop('checked', true);
+    // When initially loading and reloading (paging) the results
+    .on('crmLoad', function(e) {
+      if ($(e.target).is('#crm-container') || $(e.target).is('#crm-main-content-wrapper')) {
+        clearTaskMenu();
+        selected = usesAjax() ? parseInt($('label[for*=ts_sel] span', form).text(), 10) : countCheckboxes();
+        enableTaskMenu();
+      }
+    })
+    // When toggling between "all records" and "selected records only"
+    .on('change', '[name=radio_ts]', function() {
+      clearTaskMenu();
+      enableTaskMenu();
+    })
+    // When making a selection
+    .on('click', 'input.select-row, input.select-rows, a.crm-selection-reset', function(event) {
+      var $el = $(this),
+        $form = $el.closest('form'),
+        single = $el.is('input.select-row');
+      clearTaskMenu();
+      $('input[name=radio_ts][value=ts_sel]', $form).prop('checked', true);
+      if (!usesAjax()) {
+        if (single) {
+          selected = countCheckboxes();
+        } else {
+          selected = $el.is(':checked') ? $('input.select-row', $form).length : 0;
+        }
+        displayCount();
+        enableTaskMenu();
+      } else {
+        phoneHome(single, $el, event);
+      }
     })
+    // When selecting a task
     .on('change', 'select#task', function() {
       $(this).siblings('input[type=submit]').click();
     });
diff --git a/templates/CRM/Contact/Form/Search/Custom.tpl b/templates/CRM/Contact/Form/Search/Custom.tpl
index 03c96bacef..9d28f55fdc 100644
--- a/templates/CRM/Contact/Form/Search/Custom.tpl
+++ b/templates/CRM/Contact/Form/Search/Custom.tpl
@@ -130,45 +130,3 @@
 
 </div>
 {/if}
-{literal}
-<script type="text/javascript">
-
-function toggleContactSelection( name, qfKey, selection ){
-  var Url  = "{/literal}{crmURL p='civicrm/ajax/markSelection' h=0}{literal}";
-
-  if ( selection == 'multiple' ) {
-    var rowArr = new Array( );
-    {/literal}{foreach from=$rows item=row  key=keyVal}
-      {literal}rowArr[{/literal}{$keyVal}{literal}] = '{/literal}{$row.checkbox}{literal}';
-    {/literal}{/foreach}{literal}
-    var elements = rowArr.join('-');
-
-    if ( cj('#' + name).is(':checked') ){
-      cj.post( Url, { name: elements , qfKey: qfKey , variableType: 'multiple' } );
-    }
-    else {
-      cj.post( Url, { name: elements , qfKey: qfKey , variableType: 'multiple' , action: 'unselect' } );
-    }
-  }
-  else if ( selection == 'single' ) {
-    if ( cj('#' + name).is(':checked') ){
-      cj.post( Url, { name: name , qfKey: qfKey } );
-    }
-    else {
-      cj.post( Url, { name: name , qfKey: qfKey , state: 'unchecked' } );
-    }
-  }
-  else if ( name == 'resetSel' && selection == 'reset' ) {
-    cj.post( Url, {  qfKey: qfKey , variableType: 'multiple' , action: 'unselect' } );
-    {/literal}
-    {foreach from=$rows item=row}{literal}
-      cj("#{/literal}{$row.checkbox}{literal}").prop('checked', false);{/literal}
-    {/foreach}
-    {literal}
-    cj("#toggleSelect").prop('checked', false);
-  }
-  return false;
-}
-</script>
-
-{/literal}
diff --git a/templates/CRM/Contact/Form/Search/ResultTasks.tpl b/templates/CRM/Contact/Form/Search/ResultTasks.tpl
index 011d94e6a5..b5bee8ac79 100644
--- a/templates/CRM/Contact/Form/Search/ResultTasks.tpl
+++ b/templates/CRM/Contact/Form/Search/ResultTasks.tpl
@@ -69,7 +69,11 @@
   <tr>
     <td class="font-size11pt"> {ts}Select Records{/ts}:</td>
     <td class="nowrap">
-        {$form.radio_ts.ts_all.html} <label for="{$ts_all_id}">{ts count=$pager->_totalItems plural='All %count records'}The found record{/ts}</label> &nbsp; {if $pager->_totalItems > 1} {$form.radio_ts.ts_sel.html} <label for="{$ts_sel_id}">{ts 1="<span></span>"}%1 Selected records only{/ts}</label>{/if}
+      {assign var="checked" value=$selectedContactIds|@count}
+      {$form.radio_ts.ts_all.html} <label for="{$ts_all_id}">{ts count=$pager->_totalItems plural='All %count records'}The found record{/ts}</label>
+      {if $pager->_totalItems > 1}
+        &nbsp; {$form.radio_ts.ts_sel.html} <label for="{$ts_sel_id}">{ts 1="<span>$checked</span>"}%1 Selected records only{/ts}</label>
+      {/if}
     </td>
   </tr>
   <tr>
diff --git a/templates/CRM/Contact/Form/Selector.tpl b/templates/CRM/Contact/Form/Selector.tpl
index 51e21fbc48..40b11f2ea8 100644
--- a/templates/CRM/Contact/Form/Selector.tpl
+++ b/templates/CRM/Contact/Form/Selector.tpl
@@ -26,7 +26,7 @@
 {include file="CRM/common/pager.tpl" location="top"}
 
 {include file="CRM/common/pagerAToZ.tpl"}
-<a href="#" onclick=" return toggleContactSelection( 'resetSel', 'civicrm search {$qfKey}', 'reset' );">{ts}Reset all selections{/ts}</a>
+<a href="#" class="crm-selection-reset crm-hover-button"><span class="icon close-icon"></span> {ts}Reset all selections{/ts}</a>
 
 <table summary="{ts}Search results listings.{/ts}" class="selector row-highlight">
   <thead class="sticky">
@@ -147,61 +147,12 @@
 <script type="text/javascript">
   {literal}
   CRM.$(function($) {
-    cj("#toggleSelect, input[id^=mark_x_]").prop('checked', false);
-    var cids = [];
-    var i = 0;
-    {/literal}
-    {foreach from=$selectedContactIds item=selectedContactId}
-      cids[i++] = "#mark_x_{$selectedContactId}";
-    {/foreach}
-    {literal}
-    $(cids.join(',')).prop('checked', true);
+    var cids = {/literal}{$selectedContactIds|@json_encode}{literal};
     if (cids.length > 0) {
+      $('#mark_x_' + cids.join(',#mark_x_')).prop('checked', true).closest('tr').addClass('crm-row-selected');
       $('input[name=radio_ts][value=ts_sel]').prop('checked', true);
     }
-    var params = {getCount: cids.length};
-    countSelections(params);
   });
-function countSelections(obj) {
-  var label = cj('label[for*=ts_sel]');
-  if (typeof(obj) == 'undefined') {
-    return parseInt(cj('span', label).text());
-  }
-  if (obj && typeof(obj.getCount) != 'undefined' && label.length > 0) {
-    if (cj('span', label).length < 1) {
-      label.prepend('<span>' + obj.getCount + '</span> ');
-    }
-    else {
-      cj('span', label).html(obj.getCount);
-    }
-    //toggleTaskAction(obj.getCount);
-  }
-}
-function toggleContactSelection(name, qfKey, selection) {
-  var url = CRM.url('civicrm/ajax/markSelection');
-  var params = {qfKey: qfKey};
-  if( cj('#' + name + ":checked").length == 0) {
-    params.action = 'unselect';
-    params.state = 'unchecked';
-  }
-  if (selection == 'multiple') {
-     var rowArr = new Array( );
-     {/literal}{foreach from=$rows item=row  key=keyVal}
-     {literal}rowArr[{/literal}{$keyVal}{literal}] = '{/literal}{$row.checkbox}{literal}';
-     {/literal}{/foreach}{literal}
-     params.name = rowArr.join('-');
-     params.variableType = 'multiple';
-  }
-  else if (name == 'resetSel' && selection == 'reset') {
-    params.variableType = 'multiple';
-    cj("#toggleSelect, input[id^=mark_x_]").prop('checked', false);
-  }
-  else {
-    params.name = name;
-  }
-  cj.getJSON(url, params, countSelections);
-  return false;
-}
 {/literal}
 </script>
 {include file="CRM/common/pager.tpl" location="bottom"}
-- 
2.25.1