jviz-queue.html

<!--
@license
Copyright (c) 2016 The Jviz Project Authors. All rights reserved.
The Jviz Project is under the MIT License. See https://github.com/jviz/jviz/blob/dev/LICENSE
-->

<!-- Import dependencies -->
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../jviz/jviz.html">
<link rel="import" href="../jviz-styles/jviz-styles.html">

<!-- Import queue elements -->
<link rel="import" href="./jviz-queue-item.html">

<!-- Queue element -->
<dom-module id="jviz-queue">
  <template>
    <style>
      :host
      {
        display: block;
      }
      :host .header
      {
        display: block;
        @apply --jviz-heading-3;
        line-height: 50px !important;
        height: 50px !important;
        margin: 0px !important;
      }
    </style>
    <template is="dom-if" if="{{ header }}">
      <div class="header">{{ header }}</div>
    </template>
    <div id="tasks">
      <template id="list" is="dom-repeat" items="{{ tasks }}" index-as="index">
        <jviz-queue-item id$="{{ index }}" header$="{{ value(item, index, tasks, numTasks) }}"></jviz-queue-item>
      </template>
    </div>
  </template>
</dom-module>

<!-- Queue logic -->
<script>
  //Initialize the queue object
  var jviz_queue = { is: 'jviz-queue' };

  //Initialize the queue properties
  jviz_queue.properties = {};
  jviz_queue.properties.visible = { type: Boolean, reflectToAttribute: true, value: true };
  jviz_queue.properties.header = { type: String, reflectToAttribute: true, value: '' };
  jviz_queue.properties.running = { type: Boolean, reflectToAttribute: true, value: false };
  jviz_queue.properties.parse = { type: Function };
  jviz_queue.properties.numTasks = { type: Number, value: 0 };
  jviz_queue.properties.tasks = { type: Array, value: [], observer: 'reload' };

  //Reload method
  jviz_queue.reload = function()
  {
    //Update the number of tasks
    this.numTasks = this.tasks.length;

    //Render the tasks list again
    this.$.list.render();
  };

  //Reset method
  jviz_queue.reset = function()
  {
    //Reset the tasks list
    this.tasks = [];

    //Reload the element
    this.reload();
  };

  //Display the task name
  jviz_queue.value = function(item, index)
  {
    //Check the parse method
    return (typeof this.parse === 'function') ? this.parse(item, index) : item.toString();
  };

  //Run the queue
  jviz_queue.run = function(handler)
  {
    //Check the callback element
    if(typeof handler !== 'function'){ return console.error('No tasks handler method provided. Queue aborted.'); }

    //Save this
    var self = this;

    //Reload the element
    this.reload();

    //Set the time out
    //This will give time to initialize all jviz-queue-items elements
    return jviz.time_out(100, function()
    {
      //Check if the queue is running
      if(self.running === true){ return console.warn('Queue is running'); }

      //Check the number of tasks
      if(self.numTasks === 0){ return console.warn('No tasks to run'); }

      //Update the running value
      self.running = true;

      //Get the tasks elements list
      var tasks = self.$.tasks.querySelectorAll('jviz-queue-item');

      //Reset all tasks to waiting status
      tasks.forEach(function(el){ el.status = 'waiting'; });

      //Emit the queue start event
      self.fire('queue-started', {});

      //Read the tasks recursive
      var tasks_read = function(index)
      {
        //Check the index
        if(index >= tasks.length)
        {
          //Set running as false
          self.running = false;

          //Display done in console
          //console.info('Queue completed');

          //Trigger the completed event
          return self.fire('queue-completed', {});
        }

        //Get the task object
        var item = self.tasks[index];

        //Run this tasks
        return handler(index, item, tasks[index], function(cont)
        {
          //Check no continue value
          if(typeof cont === 'Boolean' && cont === false)
          {
            //Set queue running as false
            self.running = false;

            //Display queue aborted in console
            //console.warn('Queue aborted');

            //Trigger the queue aborted event
            return self.fire('queue-aborted', {});
          }

          //Continue with the next task on the queue
          return tasks_read(index + 1);
        });
      };

      //Read and run the tasks
      return tasks_read(0);
    });
  };

  //Register the queue element
  Polymer(jviz_queue);
</script>