Merge pull request #9660 from colemanw/CRM-19769

CRM-19769 - Add colorContrast js function
civicrm · Jan 11, 2017 · f044c46 · f044c46
2 parents 0a0c2fc + 8cc4336
commit f044c46
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/js/Common.js b/js/Common.js
@@ -1673,4 +1673,15 @@ if (!CRM.vars) CRM.vars = {};
   CRM.utils.formatDate = function(input, outputFormat) {
     return input ? $.datepicker.formatDate(outputFormat || CRM.config.dateInputFormat, CRM.utils.makeDate(input)) : '';
   };
+
+  // Used to set appropriate text color for a given background
+  CRM.utils.colorContrast = function (hexcolor) {
+    hexcolor = hexcolor.replace(/[ #]/g, '');
+    var r = parseInt(hexcolor.substr(0, 2), 16),
+     g = parseInt(hexcolor.substr(2, 2), 16),
+     b = parseInt(hexcolor.substr(4, 2), 16),
+     yiq = ((r * 299) + (g * 587) + (b * 114)) / 1000;
+    return (yiq >= 128) ? 'black' : 'white';
+  };
+
 })(jQuery, _);
diff --git a/templates/CRM/Tag/Form/Tag.tpl b/templates/CRM/Tag/Form/Tag.tpl
@@ -51,7 +51,7 @@
       });
       $('input.crm-contact-tagset').each(function() {
         $.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>');
+          tags.push('<span class="crm-tag-item" title="' + (tag.description || '') + '"' + (tag.color ? 'style="color: ' + CRM.utils.colorContrast(tag.color) + '; background-color: ' + tag.color + ';"' : '') + '>' + tag.label + '</span>');
         });
       });
       // contact summary tabs and search forms both listen for this event