wcfsetup/install/files/js/WoltLabSuite/Core/ColorUtil.js

   1 /**
   2  * Helper functions to convert between different color formats.
   3  *
   4  * @author      Alexander Ebert
   5  * @copyright   2001-2018 WoltLab GmbH
   6  * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
   7  * @module      WoltLabSuite/Core/ColorUtil
   8  */
   9 define([], function () {
  10         "use strict";
  11
  12         /**
  13          * @exports     WoltLabSuite/Core/ColorUtil
  14          */
  15         var ColorUtil = {
  16                 /**
  17                  * Converts a HSV color into RGB.
  18                  *
  19                  * @see https://secure.wikimedia.org/wikipedia/de/wiki/HSV-Farbraum#Transformation_von_RGB_und_HSV
  20                  *
  21                  * @param       {int}           h
  22                  * @param       {int}           s
  23                  * @param       {int}           v
  24                  * @return      {Object}
  25                  */
  26                 hsvToRgb: function(h, s, v) {
  27                         var rgb = { r: 0, g: 0, b: 0 };
  28                         var h2, f, p, q, t;
  29
  30                         h2 = Math.floor(h / 60);
  31                         f = h / 60 - h2;
  32
  33                         s /= 100;
  34                         v /= 100;
  35
  36                         p = v * (1 - s);
  37                         q = v * (1 - s * f);
  38                         t = v * (1 - s * (1 - f));
  39
  40                         if (s == 0) {
  41                                 rgb.r = rgb.g = rgb.b = v;
  42                         }
  43                         else {
  44                                 switch (h2) {
  45                                         case 1:
  46                                                 rgb.r = q;
  47                                                 rgb.g = v;
  48                                                 rgb.b = p;
  49                                                 break;
  50
  51                                         case 2:
  52                                                 rgb.r = p;
  53                                                 rgb.g = v;
  54                                                 rgb.b = t;
  55                                                 break;
  56
  57                                         case 3:
  58                                                 rgb.r = p;
  59                                                 rgb.g = q;
  60                                                 rgb.b = v;
  61                                                 break;
  62
  63                                         case 4:
  64                                                 rgb.r = t;
  65                                                 rgb.g = p;
  66                                                 rgb.b = v;
  67                                                 break;
  68
  69                                         case 5:
  70                                                 rgb.r = v;
  71                                                 rgb.g = p;
  72                                                 rgb.b = q;
  73                                                 break;
  74
  75                                         case 0:
  76                                         case 6:
  77                                                 rgb.r = v;
  78                                                 rgb.g = t;
  79                                                 rgb.b = p;
  80                                                 break;
  81                                 }
  82                         }
  83
  84                         return {
  85                                 r: Math.round(rgb.r * 255),
  86                                 g: Math.round(rgb.g * 255),
  87                                 b: Math.round(rgb.b * 255)
  88                         };
  89                 },
  90
  91                 /**
  92                  * Converts a RGB color into HSV.
  93                  *
  94                  * @see https://secure.wikimedia.org/wikipedia/de/wiki/HSV-Farbraum#Transformation_von_RGB_und_HSV
  95                  *
  96                  * @param       {int}           r
  97                  * @param       {int}           g
  98                  * @param       {int}           b
  99                  * @return      {Object}
 100                  */
 101                 rgbToHsv: function(r, g, b) {
 102                         var h, s, v;
 103                         var max, min, diff;
 104
 105                         r /= 255;
 106                         g /= 255;
 107                         b /= 255;
 108
 109                         max = Math.max(Math.max(r, g), b);
 110                         min = Math.min(Math.min(r, g), b);
 111                         diff = max - min;
 112
 113                         h = 0;
 114                         if (max !== min) {
 115                                 switch (max) {
 116                                         case r:
 117                                                 h = 60 * ((g - b) / diff);
 118                                                 break;
 119
 120                                         case g:
 121                                                 h = 60 * (2 + (b - r) / diff);
 122                                                 break;
 123
 124                                         case b:
 125                                                 h = 60 * (4 + (r - g) / diff);
 126                                                 break;
 127                                 }
 128
 129                                 if (h < 0) {
 130                                         h += 360;
 131                                 }
 132                         }
 133
 134                         if (max === 0) {
 135                                 s = 0;
 136                         }
 137                         else {
 138                                 s = diff / max;
 139                         }
 140
 141                         v = max;
 142
 143                         return {
 144                                 h: Math.round(h),
 145                                 s: Math.round(s * 100),
 146                                 v: Math.round(v * 100)
 147                         };
 148                 },
 149
 150                 /**
 151                  * Converts HEX into RGB.
 152                  *
 153                  * @param       {string}        hex
 154                  * @return      {Object}
 155                  */
 156                 hexToRgb: function(hex) {
 157                         if (/^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(hex)) {
 158                                 // only convert #abc and #abcdef
 159                                 var parts = hex.split('');
 160
 161                                 // drop the hashtag
 162                                 if (parts[0] === '#') {
 163                                         parts.shift();
 164                                 }
 165
 166                                 // parse shorthand #xyz
 167                                 if (parts.length === 3) {
 168                                         return {
 169                                                 r: parseInt(parts[0] + '' + parts[0], 16),
 170                                                 g: parseInt(parts[1] + '' + parts[1], 16),
 171                                                 b: parseInt(parts[2] + '' + parts[2], 16)
 172                                         };
 173                                 }
 174                                 else {
 175                                         return {
 176                                                 r: parseInt(parts[0] + '' + parts[1], 16),
 177                                                 g: parseInt(parts[2] + '' + parts[3], 16),
 178                                                 b: parseInt(parts[4] + '' + parts[5], 16)
 179                                         };
 180                                 }
 181                         }
 182
 183                         return Number.NaN;
 184                 },
 185
 186                 /**
 187                  * Converts a RGB into HEX.
 188                  *
 189                  * @see http://www.linuxtopia.org/online_books/javascript_guides/javascript_faq/rgbtohex.htm
 190                  *
 191                  * @param       {int}           r
 192                  * @param       {int}           g
 193                  * @param       {int}           b
 194                  * @return      {string}
 195                  */
 196                 rgbToHex: function(r, g, b) {
 197                         var charList = "0123456789ABCDEF";
 198
 199                         if (g === undefined) {
 200                                 if (r.toString().match(/^rgba?\((\d+), ?(\d+), ?(d\+)(?:, ?[0-9.]+)?\)$/)) {
 201                                         r = RegExp.$1;
 202                                         g = RegExp.$2;
 203                                         b = RegExp.$3;
 204                                 }
 205                         }
 206
 207                         return (charList.charAt((r - r % 16) / 16) + '' + charList.charAt(r % 16)) + '' + (charList.charAt((g - g % 16) / 16) + '' + charList.charAt(g % 16)) + '' + (charList.charAt((b - b % 16) / 16) + '' + charList.charAt(b % 16));
 208                 }
 209         };
 210
 211         // WCF.ColorPicker compatibility (color format conversion)
 212         window.__wcf_bc_colorUtil = ColorUtil;
 213
 214         return ColorUtil;
 215 });