From d47007b4f36541b76af9ea08ce97c47e6114e818 Mon Sep 17 00:00:00 2001
From: Adam Procter <adamprocter@researchnot.es>
Date: Wed, 23 Dec 2020 12:32:22 +0000
Subject: [PATCH] focus input now works as expected

---
 CHANGELOG.md                      | 10 ++++++++++
 app/src/components/CardsLayer.vue |  1 +
 app/src/components/ListLayer.vue  | 10 ++++++++++
 app/src/components/NodesLayer.vue |  2 ++
 app/src/main.js                   |  9 +++++++++
 5 files changed, 32 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ee086e7..211cdc7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,13 @@
+# 0.1.47
+
+_23rd December 2020_
+
+### Changed
+
+- Hiding shortcut tips now will stay hidden per session. (n.b this hides them on all views)
+- Focusses input when creating new node enabling fasting entry.
+  - in Collect view press n, instantly type in ideas, press tab, press n for next idea (SO FAST!)
+
 # 0.1.46
 
 _18th Decemeber 2020_
diff --git a/app/src/components/CardsLayer.vue b/app/src/components/CardsLayer.vue
index c228e75..b0f9d10 100644
--- a/app/src/components/CardsLayer.vue
+++ b/app/src/components/CardsLayer.vue
@@ -22,6 +22,7 @@
                 @focus="editTrue(true)"
                 @blur="editTrue(false)"
                 autofocus
+                v-focus
                 v-model="nodes.node_text"
                 @input="editNode"
                 :id="nodes.node_id"
diff --git a/app/src/components/ListLayer.vue b/app/src/components/ListLayer.vue
index 9a6e87f..792f441 100644
--- a/app/src/components/ListLayer.vue
+++ b/app/src/components/ListLayer.vue
@@ -15,6 +15,8 @@
             v-model="nodes.node_text"
             @input="editNode"
             :id="nodes.node_id"
+            v-focus
+            ref="textentry"
             placeholder="Type your thoughts and ideas here! (auto saved every keystroke)"
           ></textarea>
           <p class="info">*markdown supported &amp; autosaves</p>
@@ -125,6 +127,7 @@ export default {
     const unwatch = this.$watch('nodes_filtered', (value) => {
       this.$options.myArray = this.nodes_filtered
       this.$forceUpdate()
+      // this.focusInput()
       // ignore falsy values
       if (!value) return
 
@@ -153,6 +156,13 @@ export default {
   },
 
   methods: {
+    // focusInput() {
+    //   console.log('focus')
+    //   this.nextTick(() => {
+    //     this.$refs.textentry.$el.focus()
+    //   })
+    // },
+
     chooseColor(color, nodeid) {
       this.$store.dispatch('colorNode', { nodeid, color })
       this.$options.myArray = this.nodes_filtered
diff --git a/app/src/components/NodesLayer.vue b/app/src/components/NodesLayer.vue
index 6896240..fd38c4a 100644
--- a/app/src/components/NodesLayer.vue
+++ b/app/src/components/NodesLayer.vue
@@ -34,6 +34,7 @@
                   @blur="editTrue(false)"
                   autofocus
                   v-model="nodes.node_text"
+                  v-focus
                   @input="editNode"
                   :id="nodes.node_id"
                   placeholder="Type your thoughts and ideas here! (auto saved every keystroke)"
@@ -110,6 +111,7 @@
                   @focus="editTrue(true)"
                   @blur="editTrue(false)"
                   autofocus
+                  v-focus
                   v-model="nodes.node_text"
                   @input="editNode"
                   :id="nodes.node_id"
diff --git a/app/src/main.js b/app/src/main.js
index c554968..db32d0b 100644
--- a/app/src/main.js
+++ b/app/src/main.js
@@ -17,6 +17,15 @@ Vue.component('Icon', Icon)
 
 Vue.config.productionTip = false
 
+// Register a global custom directive called `v-focus`
+Vue.directive('focus', {
+  // When the bound element is inserted into the DOM...
+  inserted: function (el) {
+    // Focus the element
+    el.focus()
+  },
+})
+
 new Vue({
   router,
   store,
-- 
GitLab