Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse code

set the color as background on color hint

  • Loading branch information...
commit dacdf095abef41acdf990616d24b4cceede2a501 1 parent 1796dee
Mariano Guerra authored

Showing 2 changed files with 90 additions and 1 deletion. Show diff stats Hide diff stats

  1. +15 0 js/demos.js
  2. +75 1 src/addons/color/color.js
15 js/demos.js
@@ -174,6 +174,21 @@
174 174 }
175 175 ],
176 176 [
  177 + "color hint with default (addon)",
  178 + "",
  179 + {
  180 + "order": ["color"],
  181 + "properties": {
  182 + "color": {
  183 + "type": "string",
  184 + "title": "Color",
  185 + "je:hint": "color",
  186 + "default": "cc0000"
  187 + }
  188 + }
  189 + }
  190 + ],
  191 + [
177 192 "date hint (addon)",
178 193 "",
179 194 {
76 src/addons/color/color.js
@@ -22,13 +22,87 @@
22 22
23 23 formatHints.string = formatHints.string || {};
24 24
  25 + function normalizeRGB(c) {
  26 + var
  27 + red, green, blue,
  28 + rnum, gnum, bnum;
  29 +
  30 + // remove the # if it's there
  31 + c = (c.charAt(0) === "#") ? c.slice(1) : c;
  32 +
  33 + if (c.length === 3) {
  34 + c = c[0] + c[0] + c[1] + c[1] + c[2] + c[2];
  35 + } else if (c.length !== 6) {
  36 + return {
  37 + str: c,
  38 + hex: {},
  39 + num: {},
  40 + ok: false
  41 + };
  42 + }
  43 +
  44 + red = c[0] + c[1];
  45 + green = c[2] + c[3];
  46 + blue = c[4] + c[5];
  47 +
  48 + rnum = parseInt(red, 16);
  49 + gnum = parseInt(green, 16);
  50 + bnum = parseInt(blue, 16);
  51 +
  52 + return {
  53 + str: c,
  54 + hex: {
  55 + red: red,
  56 + green: green,
  57 + blue: blue
  58 + },
  59 + num: {
  60 + red: rnum,
  61 + green: gnum,
  62 + blue: bnum
  63 + },
  64 + // check if some of the numbers is NaN
  65 + ok: rnum === rnum && gnum === gnum && bnum === bnum
  66 + };
  67 + }
  68 +
  69 + function contrastTextColor(red, green, blue) {
  70 + var brightness;
  71 +
  72 + brightness = (red * 299) + (green * 587) + (blue * 114);
  73 + brightness = brightness / 255000;
  74 +
  75 + // values range from 0 to 1
  76 + // anything greater than 0.5 should be bright enough for dark text
  77 + if (brightness >= 0.5) {
  78 + return "#333";
  79 + } else {
  80 + return "#f5f5f5";
  81 + }
  82 + }
  83 +
25 84 formatHints.string.color = function (name, type, id, opts, required, priv, util) {
26 85 util.events.rendered.handleOnce(function () {
  86 + var content, color, contrastColor, input = $("#" + id);
27 87
28   - $("#" + id).click(function (event) {
  88 + input.click(function (event) {
29 89 mColorPicker.size = 3;
30 90 mColorPicker(event);
31 91 });
  92 +
  93 + content = $.trim(input.val());
  94 + if (content !== "") {
  95 + color = normalizeRGB(content);
  96 +
  97 + if (color.ok) {
  98 + contrastColor = contrastTextColor(color.num.red,
  99 + color.num.green,
  100 + color.num.blue);
  101 +
  102 + input.css({"background-color": "#" + color.str, "color": contrastColor});
  103 + }
  104 + }
  105 +
32 106 });
33 107
34 108 return JsonEdit.defaults.formatters.default_(name, type, id, opts, required, util);

0 comments on commit dacdf09

Please sign in to comment.
Something went wrong with that request. Please try again.