<template>
  <div
    :class="[
      'box ui-element rounded bg-white text-nowrap',
      { expanded: showPdfTool }
    ]"
  >
    <div style="width: 20rem">
      <h6 class="mb-0 py-2 px-3 border-bottom d-flex align-items-center">
        <font-awesome-icon icon="file-pdf" class="mr-2"></font-awesome-icon
        ><translate>Generate PDF</translate>
        <font-awesome-icon
          icon="times"
          class="ml-auto text-muted"
          @click="$store.commit('application/showPdfTool', false)"
        ></font-awesome-icon>
      </h6>
      <div class="p-3">
        <b><translate>Chose format:</translate></b>
        <select v-model="form.format" class="form-control d-block w-100">
          <option value="landscape"><translate>landscape</translate></option>
          <option value="portrait"><translate>portrait</translate></option>
        </select>
        <select v-model="form.paperSize" class="form-control d-block w-100">
          <option value="a3"><translate>ISO A3</translate></option>
          <option value="a4"><translate>ISO A4</translate></option>
        </select>
        <small class="d-block my-2">
          <input
            type="radio"
            id="pdfexport-downloadtype-download"
            value="download"
            v-model="form.downloadType"
            selected
          />
          <label for="pdfexport-downloadtype-download" class="ml-1 mr-2"
            ><translate>Download</translate></label
          >
          <input
            type="radio"
            id="pdfexport-downloadtype-open"
            value="open"
            v-model="form.downloadType"
          />
          <label for="pdfexport-downloadtype-open" class="ml-1"
            ><translate>Open in new window</translate></label
          >
        </small>
        <button
          @click="download"
          type="button"
          class="btn btn-sm btn-info d-block w-100"
        >
          <translate>Generate PDF</translate>
        </button>
      </div>
    </div>
  </div>
</template>

<script>
/* This is Free Software under GNU Affero General Public License v >= 3.0
 * without warranty, see README.md and license for details.
 *
 * SPDX-License-Identifier: AGPL-3.0-or-later
 * License-Filename: LICENSES/AGPL-3.0.txt
 *
 * Copyright (C) 2018 by via donau
 *   – Österreichische Wasserstraßen-Gesellschaft mbH
 * Software engineering by Intevation GmbH
 *
 * Author(s):
 * * Markus Kottländer <markus.kottlaender@intevation.de>
 * * Bernhard E. Reiter <bernhard@intevation.de>
 */
import { mapState } from "vuex";

var paperSizes = {
  // in millimeter, landscape [width, height]
  a3: [420, 297],
  a4: [297, 210]
};

export default {
  name: "pdftool",
  data() {
    return {
      form: {
        format: "landscape",
        paperSize: "a4",
        downloadType: "download"
      }
    };
  },
  computed: {
    ...mapState("application", ["showPdfTool"]),
    ...mapState("bottlenecks", ["selectedSurvey"])
  },
  methods: {
    isLandscape() {
      return this.form.format !== "portrait";
    },
    download() {
      /* eslint-disable no-unused-vars */
      const width = this.isLandscape()
        ? paperSizes[this.form.paperSize][0]
        : paperSizes[this.form.paperSize][1];
      const height = this.isLandscape()
        ? paperSizes[this.form.paperSize][1]
        : paperSizes[this.form.paperSize][0];

      // TODO: replace this src with an API reponse after actually generating PDFs
      let src = !this.isLandscape()
        ? "/img/PrintTemplate-Var2-Landscape.pdf"
        : "/img/PrintTemplate-Var2-Portrait.pdf";

      let a = document.createElement("a");
      a.href = src;

      if (this.form.downloadType === "download")
        a.download = src.substr(src.lastIndexOf("/") + 1);
      else a.target = "_blank";

      document.body.appendChild(a);
      a.click();
      document.body.removeChild(a);
    }
  }
};
</script>