Color factory

Color Factory is a class, that assists in generating sequential or random colors defined by design system.

Usage

Each instance of Color Factory ensures that it will return unique color until color set is depleted. Once all colors are used out - factory resets used-out color list and will loop through used colors again. Behavior can be overriden to throw exception in this case (see Constructor Options section for details)

Used colors are stored in internal state of class instance, therefore you can instantiate multiple factories for different needs.

Default set of colors can be overwritten using constructor options

Sample

<template>
  <div>
    <ci-button @click="getNext">Get next color</ci-button>
    <ci-button @click="reset">Reset</ci-button>
    <ci-button @click="getRandom">Get random color</ci-button>
    <div class="block-container">
      <div v-for="block in blocks" :style="block" class="block"></div>
    </div>
  </div>
</template>
<script>

export default {
  data() {
    return {
      factory: new Utils.Colors.ColorFactory(),
      blocks: []
    };
  },

  mounted () {
    for (let i = 0; i < this.factory.count; ++i) {
      this.getNext()
    }
  },

  methods: {
    getNext () {
      this.blocks.push({ 'background': this.factory.next() })
    },
    getRandom () {
      this.blocks.push({ 'background': this.factory.rnd() })
    },
    reset () {
      this.factory.reset()
    }
  }
}
</script>

<style>
.block-container {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
}

.block {
  width: 50px;
  height: 50px;
}
</style>

Constructor options

Name	Type	Default	Description
colorSet	string[]	[creativeBlue800, creativeBlue300, limeGreen500, limeGreen200, orange400, orange200, winePurple500, winePurple300]	Overrides default color set, specified in design system. Must be at least 2 strings.
loop	boolean	true	When true, the factory will reset its internal state and will start over once all colors are used. Otherwise ColorFactoryException will be thrown with ExceptionType.OutOfColors.

Factory methods

reset

Resets list of used out colors to start loop from begining.

next

Returns next unused color from colorSet and marks it as used.

rnd

Returns random unused color from colorSet and marks it as used.

Factory getters

count

Returns total size of color set

available

Returns remaning color count