changeset 2385:279334be495c

client: cleaned up main.js
author Markus Kottlaender <markus@intevation.de>
date Mon, 25 Feb 2019 14:20:50 +0100
parents c06b001dc26b
children 24e3e86b8cb6
files client/src/main.js
diffstat 1 files changed, 24 insertions(+), 50 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/main.js	Mon Feb 25 13:11:30 2019 +0100
+++ b/client/src/main.js	Mon Feb 25 14:20:50 2019 +0100
@@ -13,21 +13,31 @@
  * Markus Kottländer <markus@intevation.de>
  */
 
+// 3rd-party
 import Vue from "vue";
 import App from "./components/App.vue";
+import VTooltip from "v-tooltip";
+import GetTextPlugin from "vue-gettext";
+import Snotify, { SnotifyPosition } from "vue-snotify";
+import VueClipboard from "vue-clipboard2";
+import ToggleButton from "vue-js-toggle-button";
+import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
+import { library } from "@fortawesome/fontawesome-svg-core";
+
+// local
 import router from "./router";
 import store from "./store";
-import GetTextPlugin from "vue-gettext";
 import translations from "./locale/translations.json";
-import locale2 from "locale2";
-import Snotify, { SnotifyPosition } from "vue-snotify";
+import { supportedLanguages, defaultLanguage } from "./locale/languages.js";
+
+// styles
 import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
 import "../node_modules/animate.css/animate.min.css";
 import "../node_modules/ol/ol.css";
 import "../node_modules/highlight.js/styles/paraiso-dark.css";
 import "../node_modules/vue-snotify/styles/material.css";
-import VTooltip from "v-tooltip";
-import { library } from "@fortawesome/fontawesome-svg-core";
+
+// fontawesome5 icons
 import {
   faAngleDown,
   faAngleLeft,
@@ -78,8 +88,6 @@
   faRedo
 } from "@fortawesome/free-solid-svg-icons";
 import { faAdn } from "@fortawesome/free-brands-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
-import VueClipboard from "vue-clipboard2";
 
 library.add(
   faAdn,
@@ -131,56 +139,22 @@
   faWrench,
   faRedo
 );
-import ToggleButton from "vue-js-toggle-button";
 
-Vue.use(ToggleButton);
-
-Vue.component("font-awesome-icon", FontAwesomeIcon);
-
-Vue.use(VTooltip);
-
-const options = {
-  toast: {
-    position: SnotifyPosition.centerBottom
-  }
-};
-
-Vue.use(Snotify, options);
-
-Vue.use(VueClipboard);
-
-let browserLanguage = locale2;
-
-// planned also RS, BiH, UA
-const supportedLanguages = {
-  en_GB: "British English",
-  de_AT: "Deutsch",
-  sk_SK: "slovenčina",
-  hu_HU: "Magyar",
-  hr_HR: "Hrvatska",
-  bg_BG: "български",
-  ro_RO: "Română"
-};
-
-let isAvailableLanguage = Object.keys(supportedLanguages).filter(language => {
-  return browserLanguage.replace("-", "_") === language;
-});
-
-if (isAvailableLanguage.length === 0) {
-  isAvailableLanguage = Object.keys(supportedLanguages).filter(language => {
-    return language.substr(0, 2) === browserLanguage.substr(0, 2);
-  });
-}
-
-let defaultLanguage =
-  isAvailableLanguage.length > 0 ? isAvailableLanguage[0] : "en_GB";
-
+// register plugins
 Vue.use(GetTextPlugin, {
   translations: translations,
   availableLanguages: supportedLanguages,
   defaultLanguage: defaultLanguage
 });
+Vue.use(Snotify, { toast: { position: SnotifyPosition.centerBottom } });
+Vue.use(ToggleButton);
+Vue.use(VTooltip);
+Vue.use(VueClipboard);
 
+// register global components
+Vue.component("font-awesome-icon", FontAwesomeIcon);
+
+// global vue config
 Vue.config.productionTip = false;
 
 const app = new Vue({