const tsvDirUrl = "../tsv/";
const eol = "\r\n";

//------------------------------------------------------------------------------

var tsvFileNames:  string[];

function onTsvDirGetComplete (html: string) {
   let page = $($.parseHTML(html));
   let AElements = page.find("a");
   tsvFileNames = [];
   for (let i = 0; i < AElements.length; i++) {
      let e = AElements.eq(i);
      let s = e.attr("href");
      if (s && s.match(/\.tsv$/)) {
         tsvFileNames.push(s); }}
   buildIndexPage(); }

// Input: yyyy-mm-dd-hhmm*
// Output: dd.mm.yyyy hh:mm
function formatFileNameTimestamp (s: string) : string {
   let r = s.match(/^(\d\d\d\d)-(\d\d)-(\d\d)-(\d\d)(\d\d)/);
   if (!r || r.length != 6) {
      return "(?)"; }
   return r[3] + "." + r[2] + "." + r[1] + " " + r[4] + ":" + r[5]; }

function buildIndexPage() {
   let html = "";
   html += "<h1>Messdaten-Index</h1>" + eol;
   html += '<div class="list-group tsvFilesList">';
   for (let fn of tsvFileNames) {
      let ts = formatFileNameTimestamp(fn);
      html += '<a href="#" class="list-group-item list-group-item-action tsvFileLink" data-tsv-file-name="' + fn + '">' + ts + "</a>" + eol; }
   html += "</div>";
   $("body").html(html);
   $(".tsvFileLink").click( function (this: Element, event: Event) {
      event.preventDefault();
      openTsvFile($(this).data("tsvFileName")); }); }

function requestTsvDirectory() {
   $("body").html("(requesting TSV directory)");
   $.get(tsvDirUrl, onTsvDirGetComplete, "text");
   $("body").html("(Ajax sent)"); }

//------------------------------------------------------------------------------

var currentTsvFileName: string;

function openTsvFile (tsvFileName: string) {
   currentTsvFileName = tsvFileName;
   $("body").html("(opening " + tsvFileName + ")");
   let tsvFileUrl = tsvDirUrl + tsvFileName;
   $.get(tsvFileUrl, onTsvFileGetComplete, "text"); }

function onTsvFileGetComplete (fileData: string) {
   let tsvFileRows = fileData.split(/\r?\n/);
   let fieldRows: string[][] = [];
   let columnCount = 0;
   for (let fileRow of tsvFileRows) {
      if (fileRow.length == 0) {
         continue; }
      const fields = fileRow.split(/\t/);
      columnCount = Math.max(columnCount, fields.length);
      fieldRows.push(fields); }
   buildMeterDataPage(fieldRows, columnCount); }

function buildMeterDataPage (fieldRows: string[][], columnCount: number) {
   let html = "";
   let ts = formatFileNameTimestamp(currentTsvFileName);
   html += "<h1>Messdaten " + ts + "</h1>" + eol;
   html += '<div class="meterTable"></div>';
   $("body").html(html);
   const firstValueColumn = 5;
   const meterValues = Math.floor((columnCount - firstValueColumn) / 2);
   let tableColumns = [
      {title: "Haus",            field: "busNo",       width: 40, sorter: "number" },
      {title: "M-Bus Adr.",      field: "meterAddr",   width: 40, align: "right", sorter: "number" },
      {title: "Z&auml;hler-Nr.", field: "meterId",     width: 80, sorter: "number"},
      {title: "Typ",             field: "productName", width: 80},
      {title: "Medium",          field: "medium",      width: 80} ];
   for (let i = 0; i < meterValues; i++) {
      tableColumns.push({
         title: "Messwert " + (i + 1),
         field: "value" + (i + 1),
         width: 85,
         align: "right",
         sorter: "number" });                              // Nicht alle Werte sind numerisch. Geht das trotzdem?
      tableColumns.push({
         title: "Einheit " + (i + 1),
         field: "unit" + (i + 1),
         width: 85 }); }
   let tableData = [];
   for (let rowNo = 0; rowNo < fieldRows.length; rowNo++) {
      let fields = fieldRows[rowNo];
      let r: any = {
         id:          rowNo,
         busNo:       fields[0],
         meterAddr:   fields[1],
         meterId:     fields[2],
         productName: fields[3],
         medium:      fields[4] };
      for (let i = 0; i < meterValues; i++) {
         let meterValue = fields[firstValueColumn + 2 * i];
         let meterUnit  = fields[firstValueColumn + 2 * i + 1];
         if (meterValue != null) {
            r["value" + (i + 1)] = meterValue;
            r["unit"  + (i + 1)] = meterUnit; }}
      tableData.push(r); }
   const tabulatorOptions = {
      columns:                 tableColumns,
      data:                    tableData,
      height:                  genMeterTableHeight(),      // height must be set for progressive rendering
      selectable:              false,
      progressiveRender:       true,
      progressiveRenderSize:   5,
      progressiveRenderMargin: 100
      };
   // console.log(JSON.stringify(tableColumns));
   // console.log(JSON.stringify(tableData));
   $(".meterTable").tabulator(tabulatorOptions); }

function genMeterTableHeight() {
   return ($(window).height() - 80) + "px"; }

function adjustMeterTableHeight() {
   let t = $(".meterTable");
   if (t.length == 0) {
      return; }
   let newHeight = genMeterTableHeight();
   let oldHeight = t.tabulator("option", "height");
   if (newHeight == oldHeight) {
      return; }
   t.css("height", newHeight);
   t.tabulator("option", "height", newHeight); }

//------------------------------------------------------------------------------

var delayedWindowResizeTimerId: number|undefined;

function delayedWindowResizeEvent() {
   delayedWindowResizeTimerId = undefined;
   adjustMeterTableHeight(); }

function windowResizeEvent() {
   if (delayedWindowResizeTimerId) {
      clearTimeout(delayedWindowResizeTimerId); }
   delayedWindowResizeTimerId = setTimeout(delayedWindowResizeEvent, 200); }

function init() {
   $(window).resize(windowResizeEvent);
   requestTsvDirectory(); }

$(init);