/*
 * SPDX-FileCopyrightText: 2023 Sascha Nitsch (@grumpydevelop@contentnation.net) https://contentnation.net/en/grumpydevelop
 *
 * SPDX-License-Identifier: GPL-3.0-or-later
 */

/// <reference path="view.ts" />
/// <reference path="cameratrigger.ts" />
class PinMappingView extends View {
  public form: any;
  constructor(app: CameraTrigger) {
    super(app);
    if (!this.app.pinMapping) {
      this.app.getPinMapping(this, this.render);
    } else {
      this.render();
    }
  }

  finish() {
    this.root.find("input[type=submit]").off("click", this.saveEdit);
  }

  render() {
    var template = $("#tplPinMapping").html();
    var data:any = {};
    data.l = this.app.lang;
    data.pinmapping = [];
    var keys = Object.keys(this.app.pinMapping);
    keys.forEach(function(key){
      var pin = this.app.pinMapping[key];
      data.pinmapping.push({pin: key, name: pin[0], type: pin[1], inverted: pin[2]});
    });
    var html = Mustache.render(template, data);
    this.root.html(html);
    this.root.find("input[type=submit]").on("click", this, this.saveEdit);
    // set select boxes
    for (var i = 0; i < 8; ++i) {
      this.root.find("select[name=type_d" + i + "]").val(this.app.pinMapping["d" + i][1]);
    }
  }

  saveEdit(event?: JQuery.TriggeredEvent) {
    if (event && event.data) {
      event.preventDefault();
      event.data.saveEdit();
      return;
    }
    var data = {};
    var keys = Object.keys(this.app.pinMapping);
    var root = this.root;
    keys.forEach(function(key){
      var pin = this.app.pinMapping[key];
      data[key] = [root.find("input[name=name_" + key + "]").val(), root.find("#type_" + key).val(), root.find("input[name=inverted_" + key + "]").prop("checked")===true];
    });
    Api.post("pinmapping", JSON.stringify(data), this, this.success, this.app.error);
  }

  success(data: PinMappings) {
    this.app.setPinMapping(data);
    $.toast({
      text: this.app.lang.generic.savesuccess,
      position: 'top-right',
      icon: 'success'
    });
  }
}