From 729f7deb0d40ae97ded197a5b58f13cc767d0385 Mon Sep 17 00:00:00 2001
From: Alex Thomassen <alex@thomassen.xyz>
Date: Tue, 4 Jul 2017 10:37:26 +0200
Subject: [PATCH] Fix proper bot example support with localStorage use

---
 .eslintrc.js                    |  1 +
 src/components/EndpointList.vue | 49 +++++++++++++++++++++++++--------
 2 files changed, 39 insertions(+), 11 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 7676c62..12ec10a 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -24,6 +24,7 @@ module.exports = {
   },
   // add your custom rules here
   'rules': {
+    'arrow-body-style': ['error', 'always'],
     'indent': ['error', 4],
     'no-param-reassign': [2, {
         "props": false,
diff --git a/src/components/EndpointList.vue b/src/components/EndpointList.vue
index cb147d0..4541a13 100644
--- a/src/components/EndpointList.vue
+++ b/src/components/EndpointList.vue
@@ -10,11 +10,11 @@
                 </button>
 
                 <ul class="dropdown-menu">
-                    <li><a><input type="checkbox" v-model="bots.nightbot"> Nightbot</a></li>
-                    <li><a><input type="checkbox" v-model="bots.ankhbot"> Ankhbot</a></li>
-                    <li><a><input type="checkbox" v-model="bots.deepbot"> Deepbot</a></li>
-                    <li><a><input type="checkbox" v-model="bots.phantombot"> PhantomBot</a></li>
-                    <li><a><input type="checkbox" v-model="bots.ohbot"> Ohbot</a></li>
+                    <li v-for="bot in Object.keys(bots)">
+                        <a v-on:click="bots[bot] = !bots[bot]; updateBotStore()">
+                            <input type="checkbox" v-bind:checked="bots[bot]"> {{ botNames[bot] }}
+                        </a>
+                    </li>
                 </ul>
             </div>
         </h2>
@@ -145,18 +145,26 @@
     import config from '../config';
 
     const $ = jQuery;
+    const bots = {
+        ankhbot: false,
+        deepbot: false,
+        nightbot: false,
+        ohbot: false,
+        phantombot: false,
+    };
 
     export default {
         name: 'EndpointList',
         data() {
             return {
                 basePath: '',
-                bots: {
-                    ankhbot: false,
-                    deepbot: false,
-                    nightbot: false,
-                    ohbot: false,
-                    phantombot: false,
+                bots,
+                botNames: {
+                    ankhbot: 'Ankhbot',
+                    deepbot: 'Deepbot',
+                    nightbot: 'Nightbot',
+                    ohbot: 'Ohbot',
+                    phantombot: 'PhantomBot',
                 },
                 config,
                 // Endpoint data
@@ -199,6 +207,9 @@
                     $('#endpoint').modal('toggle');
                 });
             },
+            updateBotStore() {
+                localStorage.setItem('bots', JSON.stringify(bots));
+            },
         },
 
         mounted() {
@@ -229,11 +240,27 @@
                 });
             });
 
+            let getBots = localStorage.getItem('bots');
+
+            if (getBots) {
+                getBots = JSON.parse(getBots);
+
+                Object.keys(getBots).forEach((name) => {
+                    bots[name] = getBots[name];
+                });
+            }
+
             $('#endpoint').on('hidden.bs.modal', () => {
                 this.$router.push({
                     query: {},
                 });
             });
+
+            $('.dropdown-menu').on({
+                click: (e) => {
+                    e.stopPropagation();
+                },
+            });
         },
     };
 </script>