carlmw

// Renders a React component within rootEl
var handlers = [];
Fave.render = function (React, NS, rootEl, module) {
  var component = NS[module](_.extend({}, Fave.broker, {
      on: function (name, fn) {
        handlers.push({ name: name, fn: fn });
        return Fave.broker.on(name, fn);
      }
    })
    return Fave.broker

carlmw

[
  {
    "label": "Account",
    "type": "select",
    "name": "account",
  },
  {
    "label": "Website",
    "type": "select",
    "dependsOn": "account",

carlmw

function WidgetConfig() {}
WidgetConfig.prototype.__fields__ = [];
WidgetConfig.addFields = function (newFields) {
  var Super = this;
  function Child() {
    return Super.apply(this, arguments);
  }
  _.extend(Child, Super);
  Child.prototype = Object.create(Super.prototype);
  Child.prototype.__fields__ = Super.prototype.__fields__.concat(newFields)

carlmw

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="125px" height="58px" viewBox="0 0 125 58" version="1.1" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <clipPath id="goal">
      <rect fill="#000" width="125" height="100" transform="translate(0, -42) rotate(45, 62.5, 100)"></rect>
    </clipPath>
  </defs>
  <path d="M125,57 C124.566028,25.4163617 97.1359808,0 63.5,0 C29.6818981,0 2.13711516,25.6923392 1.03431465,57.7846048 L8.04760666,57.7846154 C9.26371578,29.5409323 33.6253316,7 63.5,7 C93.2118368,7 117.470555,29.2958837 118.930447,57 L125,57 Z" fill="rgb(0,255,0)"></path>
  <path d="M125,57 C124.566028,25.4163617 97.1359808,0 63.5,0 C29.6818981,0 2.13711516,25.6923392 1.03431465,57.7846048 L8.04760666,57.7846154 C9.26371578,29.5409323 33.6253316,7 63.5,7 C93.2118368,7 117.470555,29.2958837 118.930447,57 L125,57 Z" fill="rgb(255,0,0)" clip-path="url(#goal)"></path>
</svg>

carlmw

Greetings Front-end hopeful.

We would like you to spend no more than 4 hours of happy fun time turning a payload like this:

{
  "value": 34,
  "min": 0,
  "max": 200,
 "format": "currency",

carlmw

function clamp(val, min, max) {
  return Math.max(min, Math.min(max, val));
}

function colorShift(hex, amount) {
  const colour = parseInt(hex.slice(1), 16);
  let r = (colour >> 16) + amount;
  let g = (colour & 0x0000FF) + amount;
  let b = ((colour >> 8) & 0x00FF) + amount;
  r = clamp(r, 0, 255);