<template>
  <v-dialog
    :model-value="show"
    @update:model-value="$emit('update:show', $event)"
    persistent
    max-width="100%"
    scrollable
    max-height="90vh"
  >
    <v-card dark flat v-bind:ripple="false">
      <v-card-title>
        <div class="text-h5" style="width: 100%; font-size: 1.17em">
          {{ $t("Scan Media") }}
        </div>
      </v-card-title>
      <v-card-text>
        <v-alert type="warning" variant="tonal" border="start" v-if="showMediaInfoWarning" density="compact">
          {{ $t("Warning: Mediainfo CLI Path cannot be found_ Please go to") }}
          <a v-on:click="openSettings">{{ $t("Settings") }}</a>
          {{ $t("and provide one_ You can get Mediainfo CLI from") }}
          <a v-on:click="openMediaArea">www.mediaarea.net</a>.
        </v-alert>

        <v-radio-group v-model="radioGroup">
          <v-radio v-bind:label="$t('Quick Scan')" v-bind:value="1" color="mk-dark-grey"></v-radio>
          <v-radio v-bind:label="$t('Complete Rescan')" v-bind:value="2" color="mk-dark-grey"></v-radio>
        </v-radio-group>

        <div style="margin-left: 32px; margin-top: 8px">
          <div v-if="radioGroup == 1">
            <ul>
              <li>{{ $t("Filescan in every Source Path") }}</li>
              <li>
                {{
                  $t(
                    "If a file is missing, remove it from the collection (depending on the setting of the Source Path)"
                  )
                }}
              </li>
              <li>
                <strong>{{ $t("If a new file is found, gather IMDB and mediainfo metadata") }}</strong>
              </li>
              <li>
                <strong>{{
                  $t("If a file is already known, don't gather any metadata (except the previous scan had errors)")
                }}</strong>
              </li>
            </ul>
          </div>

          <div v-if="radioGroup == 2">
            <ul>
              <li>{{ $t("Filescan in every Source Path") }}</li>
              <li>
                {{
                  $t(
                    "If a file is missing, remove it from the collection (depending on the setting of the Source Path)"
                  )
                }}
              </li>
              <li>
                <strong>{{ $t("If a file is new or already known, gather IMDB and mediainfo metadata") }}</strong>
              </li>
              <li>
                <strong>{{ $t("This can take a while depending on your collection and internet connection") }}</strong>
              </li>
            </ul>
          </div>
        </div>

        <v-expansion-panels accordion style="margin-top: 16px">
          <v-expansion-panel style="padding: 0px !important">
            <v-expansion-panel-title style="padding: 8px !important"
              >{{ $t("IMDB Scraper Options") }} {{ imdbOptionsTitle }}</v-expansion-panel-title
            >
            <v-expansion-panel-text>
              <div style="display: flex">
                <v-spacer></v-spacer>
                <v-tooltip location="bottom" style="z-index: 21">
                  <template v-slot:activator="{ props }">
                    <span v-bind="props">
                      <v-btn class="mk-filter-action-btn" variant="text" v-on:click="setAllIMDBScraperOptions(false)">
                        <v-icon>mdi-checkbox-multiple-blank-outline</v-icon>
                      </v-btn>
                    </span>
                  </template>
                  <span>{{ $t("Clear Selection") }}</span>
                </v-tooltip>
                <v-tooltip location="bottom" style="z-index: 21">
                  <template v-slot:activator="{ props }">
                    <span v-bind="props">
                      <v-btn class="mk-filter-action-btn" variant="text" v-on:click="setAllIMDBScraperOptions(true)">
                        <v-icon>mdi-check-box-multiple-outline</v-icon>
                      </v-btn>
                    </span>
                  </template>
                  <span>{{ $t("Select All") }}</span>
                </v-tooltip>
              </div>

              <v-col>
                <v-checkbox
                  v-for="userScanOption in $shared.userScanOptions"
                  v-bind:key="userScanOption.key"
                  v-model="userScanOption.enabled"
                  v-bind:label="$t(userScanOption.description)"
                  style="margin: 0px"
                  color="mk-dark-grey"
                ></v-checkbox>
              </v-col>
            </v-expansion-panel-text>
          </v-expansion-panel>
        </v-expansion-panels>

        <v-tooltip location="bottom">
          <template v-slot:activator="{ props }">
            <span v-bind="props">
              <v-checkbox
                v-model="performCheck"
                v-bind:label="$t('Perform an IMDB Scraper Check before Scan')"
                color="mk-dark-grey"
              ></v-checkbox>
            </span>
          </template>
          <span>{{
            $t(
              "{appName} scrapes imdb_com website data in order to build up the database_ If imdb_com changes their website this process may fail in some aspects_ This scraper check will identify potential problems_",
              { appName: $shared.appName }
            )
          }}</span>
        </v-tooltip>

        <div style="height: 16px"></div>

        <v-alert
          type="warning"
          variant="tonal"
          border="start"
          v-if="missingSourcePaths && missingSourcePaths.length > 0"
          density="compact"
        >
          {{
            $t(
              "Warning: the following source paths are currently not available and all entries will be removed! (check Settings)"
            )
          }}:
          <ul>
            <li v-for="msp in missingSourcePaths" v-bind:key="msp.id_SourcePaths">
              {{ msp.Path }}
            </li>
          </ul>
        </v-alert>
      </v-card-text>

      <v-card-actions>
        <v-btn class="xs-fullwidth" variant="tonal" color="secondary" v-on:click="onCloseClick">{{
          $t("Cancel")
        }}</v-btn>
        <v-btn
          class="xs-fullwidth"
          variant="tonal"
          v-bind:color="missingSourcePaths && missingSourcePaths.length > 0 ? 'red' : 'primary'"
          v-on:click="onOKClick"
          v-bind:loading="isLoading"
        >
          <span v-if="!missingSourcePaths || missingSourcePaths.length == 0">{{ $t("OK") }}</span>
          <span v-if="missingSourcePaths && missingSourcePaths.length > 0">{{ $t("OK, I take the risk") }}</span>
        </v-btn>
      </v-card-actions>
    </v-card>
  </v-dialog>
</template>

<script>
import logger from "@helpers/logger.js";

import * as helpers from "@helpers/helpers.js";
import * as store from "@/store.js";
import i18n from "@renderer/i18n.js";
const $t = i18n.global.t;

import { shell } from "@electron/remote";

// import { eventBus } from "@/main";

export default {
  props: ["show"],

  emits: ["update:show", "cancel", "ok"],

  data() {
    return {
      isLoading: true,
      radioGroup: 1,
      missingSourcePaths: [],
      showMediaInfoWarning: false,
      performCheck: true,
    };
  },

  computed: {
    imdbOptionsTitle() {
      if (this.$shared.userScanOptions.findIndex((scanOption) => !scanOption.enabled) === -1) {
        return `(${$t("ALL")})`;
      }

      if (this.$shared.userScanOptions.findIndex((scanOption) => scanOption.enabled) === -1) {
        return `(${$t("NONE")})`;
      }

      return (
        "(" +
        this.$shared.userScanOptions.filter((scanOption) => scanOption.enabled).length +
        "/" +
        this.$shared.userScanOptions.length +
        ")"
      );
    },
  },

  methods: {
    onCloseClick() {
      this.$emit("cancel");
    },

    onOKClick() {
      this.$emit("ok", {
        radioGroup: this.radioGroup,
        performCheck: this.performCheck,
      });
    },

    async init() {
      this.isLoading = true;

      store.resetUserScanOptions();

      this.missingSourcePaths = await store.findMissingSourcePaths();

      logger.log("[init] this.missingSourcePaths:", this.missingSourcePaths);

      const mediaInfoPath = await store.getSetting("MediainfoPath");

      if (!(await helpers.existsAsync(mediaInfoPath))) {
        this.showMediaInfoWarning = true;
      } else {
        this.showMediaInfoWarning = false;
      }

      this.isLoading = false;
    },

    openSettings() {
      this.$emit("cancel");
      store.routeTo(this.$router, "/settings");
    },

    openMediaArea() {
      shell.openExternal(`https://mediaarea.net/en/MediaInfo`);
    },

    setAllIMDBScraperOptions(enabled) {
      for (let i = 0; i < this.$shared.userScanOptions.length; i++) {
        this.$shared.userScanOptions[i].enabled = enabled;
      }
    },
  },

  // ### Lifecycle Hooks ###
  created() {},
};
</script>

<style scoped>
.btn {
  margin: 2px;
}

.input-group--text-field {
  padding-left: 16px;
  /* padding-top: 0px; */
}
</style>
