CRM-19769 - Show title and more colors for tags

civicrm · Jan 8, 2017 · eb98e02 · eb98e02
1 parent b212d4a
commit eb98e02
Show file tree

Hide file tree

Showing 7 changed files with 18 additions and 45 deletions.
diff --git a/CRM/Contact/Form/Edit/TagsAndGroups.php b/CRM/Contact/Form/Edit/TagsAndGroups.php
@@ -175,6 +175,7 @@ public static function buildQuickForm(
       $form->assign('tag', $tree);
       $form->assign('entityID', $contactId);
       $form->assign('entityTable', 'civicrm_contact');
+      $form->assign('allTags', CRM_Core_BAO_Tag::getTagsUsedFor('civicrm_contact', FALSE));
 
       if ($isRequired) {
         $form->addRule($fName, ts('%1 is a required field.', array(1 => $tagName)), 'required');

diff --git a/CRM/Core/BAO/Tag.php b/CRM/Core/BAO/Tag.php
@@ -172,6 +172,7 @@ public static function getTagsUsedFor(
           $tags[$tag->id]['parent_id'] = $tag->parent_id;
           $tags[$tag->id]['is_tagset'] = $tag->is_tagset;
           $tags[$tag->id]['used_for'] = $tag->used_for;
+          $tags[$tag->id]['description'] = $tag->description;
           $tags[$tag->id]['color'] = !empty($tag->color) ? $tag->color : NULL;
         }
       }

diff --git a/templates/CRM/Contact/Form/Edit/Tagtree.tpl b/templates/CRM/Contact/Form/Edit/Tagtree.tpl
@@ -29,8 +29,7 @@
     <li id="tagli_{$id}">
       <input name="tag[{$id}]" id="tag_{$id}" class="form-checkbox" type="checkbox" value="1" {if $node.is_selectable EQ 0}disabled=""{/if} {if $form.tag.value.$id EQ 1}checked="checked"{/if}/>
       <span>
-        <label for="tag_{$id}" id="tagLabel_{$id}">{$node.name}</label>
-        {if $node.description}{help id=$id title=$node.name file="CRM/Tag/Form/Tagtree"}{/if}
+        <label for="tag_{$id}" id="tagLabel_{$id}" class="crm-tag-item" {if !empty($allTags.$id.color)}style="background-color: {$allTags.$id.color}; color: {$allTags.$id.color|colorContrast};"{/if} title="{$node.description}">{$node.name}</label>
       </span>
       {if $node.children}
         {* Recurse... *}

diff --git a/templates/CRM/Contact/Page/View/Summary.tpl b/templates/CRM/Contact/Page/View/Summary.tpl
@@ -166,7 +166,7 @@
                       </div>
                       <div class="crm-content" id="tags">
                         {foreach from=$contactTag item=tagName key=tagId}
-                          <span class="crm-tag-item" {if !empty($allTags.$tagId.color)}style="background-color: {$allTags.$tagId.color}; color: {$allTags.$tagId.color|colorContrast};"{/if}>
+                          <span class="crm-tag-item" {if !empty($allTags.$tagId.color)}style="background-color: {$allTags.$tagId.color}; color: {$allTags.$tagId.color|colorContrast};"{/if} title="{$allTags.$tagId.description}">
                             {$tagName}
                           </span>
                         {/foreach}

diff --git a/templates/CRM/Tag/Form/Tag.tpl b/templates/CRM/Tag/Form/Tag.tpl
@@ -26,11 +26,13 @@
 {* this template is used for adding/editing tags  *}
 {literal}
 <style>
-  #tagtree .highlighted {
-    background-color: #fefca6;
+  #tagtree,
+  #tagtree li.highlighted ul {
+    background-color: white;
   }
-  #tagtree .helpicon ins {
-    display: none;
+  #tagtree li.highlighted,
+  #tagtree li.highlighted-child.jstree-closed {
+    background-color: #fefcb0;
   }
   #tagtree ins.jstree-icon {
     cursor: pointer;
@@ -45,12 +47,11 @@
     CRM.updateContactSummaryTags = function() {
       var tags = [];
       $('#tagtree input:checkbox:checked+span label').each(function() {
-        tags.push('<span class="crm-tag-item" style="' + $(this).attr('style') + '">' + $(this).text() + '</span>');
+        tags.push('<span class="crm-tag-item" style="' + $(this).attr('style') + '" title="' + ($(this).attr('title') || '') + '">' + $(this).text() + '</span>');
       });
       $('input.crm-contact-tagset').each(function() {
-        var setTags = _.pluck($(this).select2('data'), 'label');
-        $.each(setTags, function (i, item) {
-          tags.push('<span class="crm-tag-item">' + item + '</span>');
+        $.each($(this).select2('data'), function (i, tag) {
+          tags.push('<span class="crm-tag-item" title="' + (tag.description || '') + '"' + (tag.color ? 'style="color: #fff; background-color: ' + tag.color + ';"' : '') + '>' + tag.label + '</span>');
         });
       });
       // contact summary tabs and search forms both listen for this event
@@ -62,10 +63,11 @@
     $(function() {
       function highlightSelected() {
         $("ul input:not(:checked)", '#tagtree').each(function () {
-          $(this).closest("li").removeClass('highlighted');
+          $(this).closest("li").removeClass('highlighted highlighted-child');
         });
         $("ul input:checked", '#tagtree').each(function () {
-          $(this).parents("li[id^=tag]").addClass('highlighted');
+          $(this).closest("li").addClass('highlighted');
+          $(this).parents("li[id^=tag]").addClass('highlighted-child');
         });
       }
       highlightSelected();
@@ -82,6 +84,7 @@
         //load js tree.
         $("#tagtree").jstree({
           plugins : ["themes", "html_data"],
+          core: {animation: 100},
           themes: {
             "theme": 'classic',
             "dots": false,

diff --git a/templates/CRM/Tag/Form/Tagtree.hlp b/templates/CRM/Tag/Form/Tagtree.hlp
diff --git a/templates/CRM/Tag/Form/Tagtree.tpl b/templates/CRM/Tag/Form/Tagtree.tpl
@@ -29,10 +29,9 @@
     <li id="tag_{$id}">
       <input name="tagList[{$id}]" id="check_{$id}" type="checkbox" {if $node.is_selectable EQ 0}disabled=""{/if} {if $tagged[$id]}checked="checked"{/if}/>
       <span>
-        <label for="check_{$id}" id="tagLabel_{$id}" {if !empty($allTags.$id.color)}style="background-color: {$allTags.$id.color}; color: {$allTags.$id.color|colorContrast};"{/if}>
+        <label for="check_{$id}" id="tagLabel_{$id}" class="crm-tag-item" {if !empty($allTags.$id.color)}style="background-color: {$allTags.$id.color}; color: {$allTags.$id.color|colorContrast};"{/if} title="{$node.description}">
           {$node.name}
         </label>
-        {if $node.description}{help id=$id title=$node.name file="CRM/Tag/Form/Tagtree"}{/if}
       </span>
       {if $node.children}
         {* Recurse... *}