nopaque/web/app/static/js/nopaque.InteractionElement.js

class InteractionElement {
  constructor(htmlId="",
              checkStatus=true,
              disabledBefore=true,
              disabledAfter=false,
              hideBefore=true,
              hideAfter=false) {
    this.htmlId = htmlId;
    this.element = (htmlId) => {this.element = document.getElementById(htmlId);}
    this.checkStatus = checkStatus;
    this.callbacks = {};
    this.disabledBefore = disabledBefore;
    this.disabledAfter = disabledAfter;
    this.hideBefore = hideBefore;
    this.hideAfter = hideAfter;
    this.element(this.htmlId);
  }

  setCallback(trigger, callback, bindThis, args=[]) {
    this.callbacks[trigger] = {
                                 "function": callback,
                                 "bindThis": bindThis,
                                 "args": args
                              };
  }

  bindThisToCallback(trigger) {
    let callback = this.callbacks[trigger];
    let boundedCallback = callback["function"].bind(callback.bindThis);
    return boundedCallback;
  }

  static onChangeExecute(interactionElements) {
    // checks if a change for every interactionElement happens and executes
    // the callbacks accordingly
    // TODO: This function scould be a static function of the Class InteractionElements
    // This class does not exist yet. The Class InteractionElements should hold
    // a list of InteractionElement objects. onChangeExecute loops over InteractionElements
    // and executes the callbacks as mentioned accordingly. An additional
    // InteractionElements Class is logically right but also makes things a little more
    // complex. It is not yet decided.
    for (let interaction of interactionElements) {
      if (interaction.checkStatus) {
        interaction.element.addEventListener("change", (event) => {
          if (event.target.checked) {
            let f_on = interaction.bindThisToCallback("on");
            let args_on = interaction.callbacks.on.args;
            f_on(...args_on);
          } else if (!event.target.checked){
            let f_off = interaction.bindThisToCallback("off");
            let args_off = interaction.callbacks.off.args;
            f_off(...args_off);
          }
        });
      } else {
        continue
      }
    };
  }
}