Message Queue

---

Html

JavaScript

/* Options */
var options = {
  // Bar height number.
  barHeight: 20,
  // Vertical space between two bars.
  space: 5,
  // Bar scolling speed.
  speed: 5,
  // The maximum number of elements can be hold in the queue.
  maxQueueCapacity: 30
};

/* Constructor */
var messageQueue = new zeu.MessageQueue('message-queue', options);

/* Getter */
// Get the number of elements in the queue.
var queueSize = messageQueue.queueSize;

/* Function */
// Push one element into the queue.
messageQueue.push({
  // Element color.
  color: '#17a2b9',
  // Control the size of the element. 0 is the largest.
  space: 0,
});

// Pop one element.
messageQueue.pop();

More examples

Increase view width to 200, view height to 600 and push messages in random color and size.