Merge pull request #24 from AndrewBastin/master

Added Clear History button

Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>

index.html

@@ -225,6 +225,11 @@
     <fieldset class="history">
       <legend v-on:click="collapse">History ↕</legend>
       <div class="collapsible">
+        <ul>
+          <li>
+            <button v-bind:class="{ disabled: noHistoryToClear }" v-on:click="clearHistory">Clear History</button>
+          </li>
+        </ul>
         <ul v-for="entry in history">
           <li>
             <label for="time">Time</label>

script.js

@@ -29,6 +29,11 @@ const app = new Vue({
     history: window.localStorage.getItem('history') ? JSON.parse(window.localStorage.getItem('history')) : []
   },
   computed: {
+
+    noHistoryToClear() {
+      return this.history.length === 0;
+    },
+
     urlNotValid() {
       const pattern = new RegExp('^(https?:\\/\\/)?' +
         '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|' +
@@ -79,6 +84,12 @@ const app = new Vue({
       this.history.splice(this.history.indexOf(entry), 1)
       window.localStorage.setItem('history', JSON.stringify(this.history))
     },
+
+    clearHistory() {
+      this.history = []
+      window.localStorage.setItem('history', JSON.stringify(this.history))
+    },
+
     useHistory({
       method,
       url,