Focus subtask input automatically

src/components/Task.vue

@@ -84,10 +84,10 @@ License along with this library.  If not, see <http://www.gnu.org/licenses/>.
 				v-if="showSubtaskInput"
 				class="task-item add-subtask">
 				<form name="addTaskForm" @submit="addTask">
-					<input v-model="newTaskName"
+					<input v-focus
+						v-model="newTaskName"
 						:placeholder="subtasksCreationPlaceholder"
 						:disabled="isAddingTask"
-						class="transparent"
 						@keyup.27="showSubtaskInput = false">
 				</form>
 			</div>
@@ -107,6 +107,7 @@ License along with this library.  If not, see <http://www.gnu.org/licenses/>.
 import { overdue, valid } from '../store/storeHelper'
 import clickOutside from 'vue-click-outside'
 import { mapActions } from 'vuex'
+import focus from '../directives/focus'
 
 export default {
 	name: 'TaskBodyComponent',
@@ -114,7 +115,8 @@ export default {
 		clickOutside
 	},
 	directives: {
-		clickOutside
+		clickOutside,
+		focus
 	},
 	filters: {
 		formatDate: function(date) {

src/directives/focus.vue

@@ -0,0 +1,28 @@
+<!--
+Nextcloud - Tasks
+
+@author Raimund Schlüßler
+@copyright 2018 Raimund Schlüßler <raimund.schluessler@mailbox.org>
+
+This library is free software; you can redistribute it and/or
+modify it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE
+License as published by the Free Software Foundation; either
+version 3 of the License, or any later version.
+
+This library is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+
+You should have received a copy of the GNU Affero General Public
+License along with this library.  If not, see <http://www.gnu.org/licenses/>.
+
+-->
+
+<script>
+export default {
+	inserted: function(el) {
+		el.focus()
+	}
+}
+</script>