js/workflow.js

   1
   2 // JavaScript for mason/util/workflow.mas
   3 var Workflow = {
   4
   5   "init": function(init_target){ //Initializes a workflow with a given ID
   6     var wf = document.querySelector(init_target);
   7     var prog_steps = document.querySelectorAll(init_target+'>.workflow-prog>li');
   8     prog_steps.forEach(function(ele,i){
   9       ele.onclick = Workflow.prog_click(i);
  10     });
  11     Workflow.focus(wf,0);
  12   },
  13
  14   "prog_click": function(step_index){ // onclick for progress markers
  15     //on progress marker click, change the focus to show that page
  16     function click(){
  17       var wf = this;
  18       while (!wf.classList.contains('workflow')){
  19         wf = wf.parentNode;
  20       }
  21
  22       //if the previous workflows have not been complete, do not do anything!
  23       if (!this.classList.contains('workflow-complete')
  24           && this!==wf.querySelector('.workflow-prog>li:not(.workflow-complete)')){
  25         return;
  26       }
  27
  28       //change focus and check for completion
  29       Workflow.focus(wf,step_index);
  30       Workflow.check_complete(wf);
  31     }
  32     return click
  33   },
  34
  35   "focus":function(wf,step_index){ // changes workflow focus page
  36     wf = wf instanceof Element ? wf : document.querySelector(wf);
  37     function change_focus(ele,i){
  38       if (i===step_index){
  39         ele.classList.add('workflow-focus');
  40       } else {
  41         ele.classList.remove('workflow-focus');
  42       }
  43
  44     }
  45
  46     var progs = wf.querySelectorAll('.workflow-prog>li');
  47     var conts = wf.querySelectorAll('.workflow-content>li');
  48
  49     progs.forEach(change_focus);
  50     conts.forEach(change_focus);
  51   },
  52
  53   "check_complete":function(wf){ // checks if the endscreens should be shown and acts accordingly
  54     wf = wf instanceof Element ? wf : document.querySelector(wf);
  55     var progs = wf.querySelectorAll('.workflow-prog>li');
  56     var conts = wf.querySelectorAll('.workflow-content>li');
  57
  58     var all_complete = Array.prototype.every.call(progs, function(ele){
  59       return ele.classList.contains('workflow-complete');
  60     });
  61     var any_pending = Array.prototype.some.call(progs, function(ele){
  62       return ele.classList.contains('workflow-pending');
  63     });
  64     var any_focused = Array.prototype.some.call(progs, function(ele){
  65       return ele.classList.contains('workflow-focus');
  66     });
  67
  68     if(all_complete && any_pending && !any_focused){
  69       wf.querySelector(".workflow-pending-message").classList.add("workflow-message-show");
  70     }
  71     else if (all_complete && !any_focused){
  72       wf.querySelector(".workflow-pending-message").classList.remove("workflow-message-show");
  73       wf.querySelector(".workflow-complete-message").classList.add("workflow-message-show");
  74     } else {
  75       wf.querySelector(".workflow-pending-message").classList.remove("workflow-message-show");
  76       wf.querySelector(".workflow-complete-message").classList.remove("workflow-message-show");
  77     }
  78   },
  79
  80   "complete":function(wf_child,set_focus,status){ // completes a step
  81     set_focus = set_focus===false?false:true;
  82     wf_child = wf_child instanceof Element ? wf_child : document.querySelector(wf_child);
  83     var wf = wf_child;
  84     var content_li = wf_child;
  85     while (!wf.classList.contains('workflow')){
  86       if(wf.parentNode.classList.contains('workflow-content')){
  87         content_li = wf;
  88       }
  89       wf = wf.parentNode;
  90     }
  91     var step_index = Array.prototype.indexOf.call(wf.querySelectorAll('.workflow-content>li'),content_li);
  92     var all_steps = wf.querySelectorAll('.workflow-prog>li');
  93     var prog = all_steps[step_index];
  94
  95     content_li.classList.add('workflow-complete');
  96     prog.classList.add('workflow-complete');
  97
  98
  99     if (status=="skipped"){
 100       content_li.classList.add('workflow-skipped');
 101       prog.classList.add('workflow-skipped');
 102
 103     } else {
 104       content_li.classList.remove('workflow-skipped');
 105       prog.classList.remove('workflow-skipped');
 106     }
 107
 108     if (status=="pending"){
 109       content_li.classList.add('workflow-pending');
 110       prog.classList.add('workflow-pending');
 111
 112     } else {
 113       content_li.classList.remove('workflow-pending');
 114       prog.classList.remove('workflow-pending');
 115     }
 116
 117     if (set_focus){
 118       Workflow.focus(wf,step_index+1);
 119     }
 120     Workflow.check_complete(wf);
 121
 122   },
 123
 124   "skip":function(wf_child,set_focus){ //completes a step with skipped status
 125     Workflow.complete(wf_child,set_focus,"skipped");
 126   },
 127
 128   "pending":function(wf_child,set_focus){ //completes a step with pending status
 129     Workflow.complete(wf_child,set_focus,"pending");
 130   }
 131
 132 }