rhet-butler 0.13.0 → 0.14.0

data/default-configuration/assets/javascript/rhet-butler/steps/group.js

@@ -0,0 +1,50 @@
+import ChildStep from "../child-step.js";
+
+export default class extends ChildStep {
+  constructor(parent, element, indexes){
+    super(parent, element, indexes);
+  }
+
+  addNextStep(step){
+    step.addPrevGroup(this);
+  }
+
+  addPrevStep(step){
+    step.addNextGroup(this);
+  }
+
+  addNextSlide(slide){
+    this.debugAssoc("gns", slide)
+
+    this.nextSlide = slide;
+    if(this.lastSlide){
+      this.lastSlide.addNextSlide(slide);
+    }
+  }
+
+  addPrevSlide(slide){
+    this.debugAssoc("gps", slide)
+    if(!this.lastSlide){
+      this.lastSlide = slide;
+    }
+    if(!this.lastItem){
+      this.lastItem = slide.lastChild();
+    }
+    this.prevSlide = slide;
+    this.prevItem = slide.lastChild();
+  }
+
+  addNextGroup(group){
+    this.debugAssoc("gng", group)
+    //
+  }
+
+  addPrevGroup(group){
+    this.debugAssoc("gpg", group)
+
+    this.prevSlide = group.lastSlide;
+
+    this.lastSlide = group.lastSlide;
+    this.lastItem = group.lastItem;
+  }
+}

data/default-configuration/assets/javascript/rhet-butler/steps/item.js

@@ -0,0 +1,60 @@
+import ChildStep from "../child-step.js";
+
+export default class extends ChildStep {
+  constructor(parent, element, indexes, cue){
+    super(parent, element, indexes);
+    this._cue = cue;
+  }
+
+  cue(){
+    return this._cue;
+  }
+
+  addChild(step){
+    this.parent.addChild(step);
+  }
+
+  joinParent(parent){
+    parent.lastItem = this;
+  }
+
+  addNextStep(step){
+    step.addPrevItem(this);
+  }
+
+  addPrevStep(step){
+    step.addNextItem(this);
+  }
+
+  addNextItem(item){
+    this.debugAssoc("ini", item)
+    this.nextItem = item;
+  }
+
+  addPrevItem(item){
+    this.debugAssoc("ipi", item)
+    this.prevItem = item;
+  }
+
+  beginDeparture(){
+    this.parent.addClass("prev-" + this.cue());
+    this.parent.removeClass(/^current-cue-.*/);
+    this.parent.beginDeparture();
+  }
+
+  completeDeparture(){
+    this.parent.removeClass("prev-" + this.cue());
+    this.parent.completeDeparture();
+  }
+
+  beginArrival(){
+    this.parent.addClass("next-" + this.cue());
+    this.parent.beginArrival();
+  }
+
+  completeArrival(){
+    this.parent.removeClass("next-" + this.cue());
+    this.parent.addClass("current-" + this.cue());
+    this.parent.completeArrival();
+  }
+}

data/default-configuration/assets/javascript/rhet-butler/steps/root.js

@@ -0,0 +1,41 @@
+import Step from "../step.js";
+
+export default class extends Step {
+  constructor(element, indexes){
+    super(element, indexes)
+  }
+
+  propagateDescendant(newChild){
+  }
+
+  addNextStep(step){
+    step.addPrevRoot(this);
+  }
+
+  addPrevStep(step){
+    step.addNextRoot(this);
+  }
+
+  beginTransition(stationList){
+    this.addClass("moving");
+    this.addClass(stationList.startElemId());
+    this.addClass(stationList.endElemId());
+    stationList.direction.forEach(function(dirPart){
+        this.addClass(dirPart);
+      }, this);
+  }
+
+  completeTransition(stationList){
+    this.removeClass("moving");
+    this.removeClass(stationList.startElemId());
+    this.removeClass(stationList.endElemId());
+    stationList.direction.forEach(function(dirPart){
+        this.removeClass(dirPart);
+      }, this);
+  }
+
+  beginArrival(){ }
+  completeArrival(){ }
+  beginDeparture(){ }
+  completeDeparture(){ }
+}

data/default-configuration/assets/javascript/rhet-butler/steps/slide.js

@@ -0,0 +1,96 @@
+import ChildStep from '../child-step.js';
+
+export default class extends ChildStep {
+  constructor(parent, element, indexes){
+    super(parent, element, indexes);
+    this.items = [];
+  }
+
+  addChild(newChild){
+    if(this.items.some(item => newChild.cue() == item.cue() )){
+      return;
+    }
+    this.items.push(newChild);
+  }
+
+  joinParent(parent){
+    parent.lastSlide = this;
+    if (parent.firstSlide == null) {
+      parent.firstSlide = this;
+      parent.firstItem = this;
+      if(parent.prevSlide != null){
+        parent.prevSlide.addNextSlide(this);
+        this.addPrevSlide(parent.prevSlide);
+      }
+    }
+  }
+
+  treeFinished(){
+    var cueRegex = /^cue-(\d+)/;
+    if(this.items.length == 0){
+      return;
+    };
+
+    this.items = this.items.sort(function(left, right){
+        var leftNum = parseInt(cueRegex.exec(left.cue())[1], 10);
+        var rightNum = parseInt(cueRegex.exec(right.cue())[1], 10);
+        if(leftNum == rightNum){
+          if(left.cue() < right.cue()){
+            return -1
+          } else {
+            return 1
+          }
+        } else if(leftNum < rightNum) {
+          return -1
+        } else {
+          return 1;
+        }
+      });
+
+    this.items[0].prevItem = this;
+    this.nextItem = this.items[0];
+
+    var itemIndex = Math.max.apply(undefined, this.items.map(function(item){return item.indexes.item}));
+    this.items.forEach(function(item){
+        item.indexes.item = itemIndex;
+        itemIndex++;
+      });
+
+    for(let newChild of this.items) {
+      newChild.prevSlide = this.prevSlide;
+      super.addChild(newChild);
+    }
+  }
+
+  addNextStep(step){
+    step.addPrevSlide(this);
+  }
+
+  addPrevStep(step){
+    step.addNextSlide(this);
+  }
+
+  addPrevGroup(group){
+    this.debugAssoc("spg", group)
+    if(group.lastSlide){
+      this.addPrevSlide(group.lastSlide)
+    }
+  }
+
+  addNextSlide(slide){
+    this.debugAssoc("sns", slide)
+
+    this.nextSlide = slide;
+    this.children.forEach(function(item){ item.nextSlide = slide; })
+    this.lastChild().nextItem = slide;
+  }
+
+  addPrevSlide(slide){
+    this.debugAssoc("sps", slide)
+    this.prevSlide = slide;
+    this.children.forEach(function(item){
+        item.prevSlide = slide;
+      })
+    this.prevItem = slide.lastChild();
+  }
+}

data/default-configuration/assets/javascript/rhet-butler/transition-states.js

@@ -0,0 +1,173 @@
+let states = {
+  preparing: {},
+  uphill: {},
+  downhill: {},
+  cancelled: {},
+  arrived: {}
+};
+
+export default states;
+
+for(name in states){
+  // states[name] should throw a buncha not-implemented or wrong-state
+  states[name].enter = function(){ };
+
+  states[name].start = function(){
+    //raise exception?
+  };
+
+  states[name].cancel = function(){
+    this.changeState("cancelled");
+  };
+
+  states[name].forceFinish = function(){
+    console.log("Force Finish");
+
+  };
+
+  states[name].finish = function(){
+    //
+  };
+
+  states[name].currentLeg = function(){
+    return [];
+  };
+
+  states[name].enterState = function(){ };
+
+  states[name].resumeStep = function(){
+    return this.firstStep;
+  };
+
+  states[name].currentStation = function(){
+    return null;
+  };
+
+  states[name].advanceStation = function(){ };
+
+  states[name].nextStation = function(){
+    this.currentStation().visit();
+    if(this.currentStation().checkIn){
+      return this.advanceStation();
+    } else {
+      var stationList = this;
+      var targetStation = this.currentStation();
+      this.currentStation().setArriveHandler( function(event){ stationList.arriveListener(targetStation, event); });
+      return false;
+    }
+  };
+}
+
+states.preparing.enterState = function(){
+  this.eachStation(function(station){ station.prepare(); })
+};
+
+states.preparing.start = function(){
+  this.changeState("uphill");
+  this.elementArrived(this.currentStep);
+  //Events + class changes
+};
+
+states.preparing.forceFinish = function(){
+  this.eachStation(function(station){ station.visited() });
+  this.changeState("arrived");
+}
+
+states.uphill.enterState = function(){
+  this.currentStep = this.uphill[0].step;
+
+  this.presenter.rootStep.beginTransition(this);
+
+  this.firstStep.beginDeparture();
+  this.lastStep.beginArrival();
+};
+
+states.uphill.finish = function(){
+  this.changeState("downhill");
+};
+
+states.uphill.currentLeg = function(){
+  return this.uphill;
+};
+
+states.uphill.currentStation = function(){
+  return this.uphill[this.uphillIndex];
+};
+
+states.uphill.advanceStation = function(){
+  this.uphillIndex++;
+  if(this.uphillIndex < this.uphill.length){
+    this.currentStep = this.currentStation().step;
+  } else {
+    this.changeState("downhill");
+  }
+  return true
+};
+
+states.downhill.currentLeg = function(){
+  return this.downhill;
+};
+
+states.downhill.enterState = function(){
+  this.currentStep = this.downhill[0].step;
+};
+
+states.downhill.currentStation = function(){
+  return this.downhill[this.downhillIndex];
+};
+
+states.downhill.advanceStation = function(){
+  this.downhillIndex++;
+  if(this.downhillIndex < this.downhill.length){
+    this.currentStep = this.currentStation().step;
+    return true;
+  } else {
+    this.changeState("arrived");
+    return false;
+  }
+};
+
+states.downhill.finish = function(){
+  this.changeState("arrived");
+};
+
+states.downhill.resumeStep = function(){
+  return this.lastStep;
+};
+
+states.cancelled.enterState = function(){
+  this.eachStation(function(station){
+      if(station.step == this.currentStep){ return; };
+      station.complete()
+    }, this)
+
+  this.presenter.rootStep.completeTransition(this);
+
+  this.firstStep.completeDeparture();
+  this.lastStep.cancelArrival();
+};
+
+states.arrived.enterState = function(){
+  this.eachStation(function(station){ station.complete() })
+
+  this.currentStep = this.lastStep;
+
+  this.presenter.rootStep.completeTransition(this);
+
+  this.firstStep.completeDeparture();
+  this.lastStep.completeArrival();
+
+  this.presenter.completeTransition();
+};
+
+states.arrived.resumeStep = function(){
+  return this.lastStep;
+};
+
+states.arrived.nextStation = function(){
+  return false;
+};
+
+states.arrived.cancel = function(){
+  return false;
+};

data/default-configuration/assets/javascript/rhet-butler/transition-station.js

@@ -0,0 +1,133 @@
+import {pfx} from '../utils.js';
+
+var motionStyles = [
+  "transition-duration",
+  "animation-name",
+  "animation-iteration-count",
+  "animation-play-state"
+];
+
+var motionCompleteEvents = []
+
+;(function(){
+    var events = ["TransitionEnd", "AnimationEnd"];
+    var prefixes = ["webkit", "o", "MS", ""];
+    prefixes.forEach(function(prefix){
+        events.forEach(function(event){
+            motionCompleteEvents.push(prefix + event);
+            motionCompleteEvents.push(prefix + event.toLowerCase());
+          });
+      });
+  })();
+
+export default class {
+  constructor(step){
+    this.step = step;
+    this.checkIn = false;
+    this.eventListener = null;
+  }
+
+  visit(){
+    var beforeStyles, afterStyles;
+
+    if(this.checkIn){ return true; }
+
+    beforeStyles = this.getMotionStyles();
+
+    this.step.addClass("am-at");
+    this.step.removeClass("to-come");
+    afterStyles = this.getMotionStyles();
+
+    this.checkIn = true;
+    for(name in afterStyles){
+      if(beforeStyles[name] != afterStyles[name]){
+        this.checkIn = false; };
+    }
+
+    if(!this.elementHasMotion()){ this.visited(); };
+
+    if(this.checkIn){ this.step.removeClass("am-at"); };
+
+    return this.checkIn;
+  }
+
+  setArriveHandler(funk){
+    this.removeListener();
+    this.eventListener = funk;
+    this.attachListener();
+  }
+
+  visited(){
+    this.step.removeClass("to-come");
+    this.step.addClass("has-gone");
+    this.checkIn = true;
+  }
+
+  prepare(){
+    this.step.addClass("to-come");
+    this.attachListener();
+  }
+
+  complete(){
+    this.step.removeClass("to-come");
+    this.step.removeClass("has-gone");
+    this.step.removeClass("am-at");
+    this.removeListener();
+  }
+
+
+  getMotionStyles(){
+    var style = window.getComputedStyle(document.getElementById(this.step.element.id));
+    var result = {}
+    motionStyles.map(function(styleName){
+        result[styleName] = style.getPropertyValue(pfx(styleName));
+      });
+    return result;
+  }
+
+  elementHasMotion(){
+    var style = this.getMotionStyles();
+    var durations = []
+    var states, counts;
+
+    if(style["transition-duration"]){
+      durations = style["transition-duration"].split(/\s*,\s*/); //there's a non-zero one
+    }
+    if(!durations.every(function(duration){ return (duration == "0s") })){
+      return true;
+    }
+
+    if(style["animation-name"] == null || style['animation-name'] == 'none'){
+      return false
+    };
+
+    states = style["animation-play-state"].split(/\s*,\s*/);
+    counts = style["animation-iteration-count"].split(/\s*,\s*/);
+
+    if(states.length < counts.length){
+      states = states.concat(states);
+    } else {
+      counts = counts.concat(counts);
+    }
+
+    return (states.some(function(state, index){
+          return (state != "paused" && counts[index] != "infinite")
+        }));
+  }
+
+  attachListener(){
+    if(this.eventListener){
+      motionCompleteEvents.forEach(function(eventName){
+          this.step.element.addEventListener(eventName, this.eventListener, true);
+        }, this)
+    }
+  }
+
+  removeListener(){
+    if(this.eventListener){
+      motionCompleteEvents.forEach(function(eventName){
+          this.step.element.removeEventListener(eventName, this.eventListener, true);
+        }, this)
+    }
+  }
+}