re-add vue.config.js, update to dist, separate BASE_URL and API_URL for permalink calculation

client/.env.development

@@ -1 +1,2 @@
-VUE_APP_BASE_APP_URL=http://192.168.2.35:5000
+VUE_APP_API_URL=http://192.168.2.35:5000
+VUE_APP_BASE_URL=http://192.168.2.35:8080

client/.env.production

@@ -1 +1,2 @@
-VUE_APP_BASE_APP_URL=
+VUE_APP_API_URL=http://192.168.2.35:5000
+VUE_APP_BASE_URL=http://192.168.2.35:5000

client/src/components/QuoteList.vue

@@ -1,15 +1,24 @@
 <template>
     <table class="quote-list px-3 w-100">
-        <tr v-for="(quote, index) in quotes" :key="`quote-${index}`" :id="`${sceneIndex}-${index}`"
-            :class="$route.hash !== null && $route.hash.substring(1) === `${sceneIndex}-${index}` ? 'highlight' : ''">
+        <tr
+            v-for="(quote, index) in quotes"
+            :key="`quote-${index}`"
+            :id="`${sceneIndex}-${index}`"
+            :class="
+        $route.hash !== null &&
+        $route.hash.substring(1) === `${sceneIndex}-${index}`
+          ? 'highlight'
+          : ''
+      "
+        >
             <td class="quote-speaker pl-3" v-if="quote.speaker">
-                <span class="my-3">
-                    {{ quote.speaker }}
-                </span>
+        <span class="my-3">
+          {{ quote.speaker }}
+        </span>
             </td>
             <td class="quote-text w-100 pr-3">{{ quote.text }}</td>
             <td class="px-1 pl-2">
-                <a :href="quote_link(index)" class="no-link">
+                <a :href="quote_link(index)" @click="copy(index)" class="no-link">
                     <b-icon icon="link45deg"></b-icon>
                 </a>
             </td>
@@ -19,12 +28,14 @@
 
 <style lang="scss">
 @import "../assets/scss/_variables";
+
 .quote-list > tr {
     white-space: nowrap;
 
     &:hover {
         background-color: $grey-4;
     }
+
     &.highlight {
         background-color: $grey-5 !important;
     }
@@ -41,39 +52,47 @@
     font-weight: 600;
     vertical-align: text-top;
     text-align: right;
-    font-family: 'Montserrat', sans-serif;
+    font-family: "Montserrat", sans-serif;
 }
 
 table.quote-list tr td:last-child {
     height: 100%;
-    a { height: 100%; }
+
+    a {
+        height: 100%;
+    }
+
     svg {
         font-size: 1.35em;
         opacity: 0;
         transition: opacity 0.1s ease-in;
     }
 }
+
 table.quote-list tr:hover td:last-child svg {
-    opacity: 100%;
+    opacity: 1;
 }
 </style>
 
 <script>
 export default {
-  props: {
-    sceneIndex: {
-      required: true,
-      type: Number,
+    props: {
+        sceneIndex: {
+            required: true,
+            type: Number,
+        },
+        quotes: {
+            required: true,
+            type: Array,
+        },
     },
-    quotes: {
-      required: true,
-      type: Array,
+    methods: {
+        quote_link(quoteIndex) {
+            return `/${this.$route.params.season}/${this.$route.params.episode}#${this.sceneIndex}-${quoteIndex}`;
+        },
+        copy(quoteIndex) {
+            this.$copyText(process.env.VUE_APP_BASE_URL + this.quote_link(quoteIndex))
+        }
     },
-  },
-  methods: {
-    quote_link(quoteIndex) {
-      return `/${this.$route.params.season}/${this.$route.params.episode}#${this.sceneIndex}-${quoteIndex}`;
-    },
-  },
 };
 </script>

client/src/router.js

@@ -1,51 +1,51 @@
-import Vue from 'vue';
-import Router from 'vue-router';
-import Home from './components/Home.vue';
-import Episode from './components/Episode.vue';
-import SearchResults from './components/SearchResults.vue';
-import Character from './components/Character.vue';
+import Vue from "vue";
+import Router from "vue-router";
+import Home from "./components/Home.vue";
+import Episode from "./components/Episode.vue";
+import SearchResults from "./components/SearchResults.vue";
+import Character from "./components/Character.vue";
 
 Vue.use(Router);
 
 export default new Router({
-  mode: 'history',
-  base: process.env.BASE_URL,
-  routes: [
-    {
-      path: '/',
-      name: 'Home',
-      component: Home,
+    mode: "history",
+    base: process.env.VUE_APP_BASE_URL,
+    routes: [
+        {
+            path: "/",
+            name: "Home",
+            component: Home,
+        },
+        {
+            path: "/character/:character",
+            name: "Character",
+            component: Character,
+        },
+        {
+            path: "/:season/:episode",
+            name: "Episode",
+            component: Episode,
+        },
+        {
+            path: "/search_results",
+            name: "SearchResults",
+            component: SearchResults,
+        },
+        {
+            path: "*",
+        },
+    ],
+    scrollBehavior(to, from, savedPosition) {
+        // https://router.vuejs.org/guide/advanced/scroll-behavior.html
+        if (to.hash) {
+            return {selector: to.hash};
+        }
+        if (savedPosition) {
+            return savedPosition;
+        }
+        return {
+            x: 0,
+            y: 0,
+        };
     },
-    {
-      path: '/character/:character',
-      name: 'Character',
-      component: Character,
-    },
-    {
-      path: '/:season/:episode',
-      name: 'Episode',
-      component: Episode,
-    },
-    {
-      path: '/search_results',
-      name: 'SearchResults',
-      component: SearchResults,
-    },
-    {
-      path: '*',
-    },
-  ],
-  scrollBehavior(to, from, savedPosition) {
-    // https://router.vuejs.org/guide/advanced/scroll-behavior.html
-    if (to.hash) {
-      return { selector: to.hash };
-    }
-    if (savedPosition) {
-      return savedPosition;
-    }
-    return {
-      x: 0,
-      y: 0,
-    };
-  },
 });

client/vue.config.js

@@ -0,0 +1,4 @@
+module.exports = {
+  outputDir: '../dist/',
+  assetsDir: './static',
+};