diff options
author | Johannes Zellner <johannes@nebulon.de> | 2016-03-01 19:15:52 +0100 |
---|---|---|
committer | Johannes Zellner <johannes@nebulon.de> | 2016-03-01 19:15:52 +0100 |
commit | 9209abecddcedfafdf816896168632289f510dbd (patch) | |
tree | 33400ca03d7e57de501166c79e56fd9853d35fa3 | |
parent | aa88a75382d0f5ff2929768a412d8ec64dfc6296 (diff) | |
download | Surfer-9209abecddcedfafdf816896168632289f510dbd.tar.gz Surfer-9209abecddcedfafdf816896168632289f510dbd.tar.zst Surfer-9209abecddcedfafdf816896168632289f510dbd.zip |
Set autofocus and add basic error handling
-rw-r--r-- | app/index.html | 5 | ||||
-rw-r--r-- | app/js/app.js | 31 |
2 files changed, 30 insertions, 6 deletions
diff --git a/app/index.html b/app/index.html index f6561a3..803568c 100644 --- a/app/index.html +++ b/app/index.html | |||
@@ -60,8 +60,9 @@ | |||
60 | </div> | 60 | </div> |
61 | <div class="modal-body"> | 61 | <div class="modal-body"> |
62 | <form v-on:submit.prevent="createDirectory(createDirectoryData)"> | 62 | <form v-on:submit.prevent="createDirectory(createDirectoryData)"> |
63 | <div class="form-group"> | 63 | <div class="form-group" v-bind:class="{ 'has-error': createDirectoryError }"> |
64 | <input type="text" class="form-control" v-model="createDirectoryData" placeholder="Name"> | 64 | <input type="text" class="form-control" v-model="createDirectoryData" id="inputDirectoryName" placeholder="Name" autofocus="true"> |
65 | <label class="control-label" for="inputDirectoryName">{{ createDirectoryError }}</label> | ||
65 | </div> | 66 | </div> |
66 | <button type="submit" style="display: none;"></button> | 67 | <button type="submit" style="display: none;"></button> |
67 | </form> | 68 | </form> |
diff --git a/app/js/app.js b/app/js/app.js index 228184d..6017d25 100644 --- a/app/js/app.js +++ b/app/js/app.js | |||
@@ -82,8 +82,8 @@ function loadDirectory(filePath) { | |||
82 | superagent.get('/api/files/' + filePath).query({ username: app.session.username, password: app.session.password }).end(function (error, result) { | 82 | superagent.get('/api/files/' + filePath).query({ username: app.session.username, password: app.session.password }).end(function (error, result) { |
83 | app.busy = false; | 83 | app.busy = false; |
84 | 84 | ||
85 | if (result && result.statusCode === 401) return logout(); | ||
85 | if (error) return console.error(error); | 86 | if (error) return console.error(error); |
86 | if (result.statusCode === 401) return logout(); | ||
87 | 87 | ||
88 | result.body.entries.sort(function (a, b) { return a.isDirectory && b.isFile ? -1 : 1; }); | 88 | result.body.entries.sort(function (a, b) { return a.isDirectory && b.isFile ? -1 : 1; }); |
89 | app.entries = result.body.entries.map(function (entry) { | 89 | app.entries = result.body.entries.map(function (entry) { |
@@ -135,8 +135,9 @@ function upload() { | |||
135 | superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password }).send(formData).end(function (error, result) { | 135 | superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password }).send(formData).end(function (error, result) { |
136 | app.busy = false; | 136 | app.busy = false; |
137 | 137 | ||
138 | if (result && result.statusCode === 401) return logout(); | ||
139 | if (result && result.statusCode !== 201) return console.error('Error uploading file: ', result.statusCode); | ||
138 | if (error) return console.error(error); | 140 | if (error) return console.error(error); |
139 | if (result.statusCode !== 201) return console.error('Error uploading file: ', result.statusCode); | ||
140 | 141 | ||
141 | refresh(); | 142 | refresh(); |
142 | }); | 143 | }); |
@@ -158,8 +159,9 @@ function del(entry) { | |||
158 | superagent.del('/api/files' + path).query({ username: app.session.username, password: app.session.password, recursive: true }).end(function (error, result) { | 159 | superagent.del('/api/files' + path).query({ username: app.session.username, password: app.session.password, recursive: true }).end(function (error, result) { |
159 | app.busy = false; | 160 | app.busy = false; |
160 | 161 | ||
162 | if (result && result.statusCode === 401) return logout(); | ||
163 | if (result && result.statusCode !== 200) return console.error('Error deleting file: ', result.statusCode); | ||
161 | if (error) return console.error(error); | 164 | if (error) return console.error(error); |
162 | if (result.statusCode !== 200) return console.error('Error deleting file: ', result.statusCode); | ||
163 | 165 | ||
164 | refresh(); | 166 | refresh(); |
165 | 167 | ||
@@ -170,18 +172,29 @@ function del(entry) { | |||
170 | function createDirectoryAsk() { | 172 | function createDirectoryAsk() { |
171 | $('#modalcreateDirectory').modal('show'); | 173 | $('#modalcreateDirectory').modal('show'); |
172 | app.createDirectoryData = ''; | 174 | app.createDirectoryData = ''; |
175 | app.createDirectoryError = null; | ||
173 | } | 176 | } |
174 | 177 | ||
175 | function createDirectory(name) { | 178 | function createDirectory(name) { |
176 | app.busy = true; | 179 | app.busy = true; |
180 | app.createDirectoryError = null; | ||
177 | 181 | ||
178 | var path = encode(sanitize(app.path + '/' + name)); | 182 | var path = encode(sanitize(app.path + '/' + name)); |
179 | 183 | ||
180 | superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password, directory: true }).end(function (error, result) { | 184 | superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password, directory: true }).end(function (error, result) { |
181 | app.busy = false; | 185 | app.busy = false; |
182 | 186 | ||
187 | if (result && result.statusCode === 401) return logout(); | ||
188 | if (result && result.statusCode === 403) { | ||
189 | app.createDirectoryError = 'Name not allowed'; | ||
190 | return; | ||
191 | } | ||
192 | if (result && result.statusCode === 409) { | ||
193 | app.createDirectoryError = 'Directory already exists'; | ||
194 | return; | ||
195 | } | ||
196 | if (result && result.statusCode !== 201) return console.error('Error creating directory: ', result.statusCode); | ||
183 | if (error) return console.error(error); | 197 | if (error) return console.error(error); |
184 | if (result.statusCode !== 201) return console.error('Error creating directory: ', result.statusCode); | ||
185 | 198 | ||
186 | app.createDirectoryData = ''; | 199 | app.createDirectoryData = ''; |
187 | refresh(); | 200 | refresh(); |
@@ -211,6 +224,7 @@ var app = new Vue({ | |||
211 | loginData: {}, | 224 | loginData: {}, |
212 | deleteData: {}, | 225 | deleteData: {}, |
213 | createDirectoryData: '', | 226 | createDirectoryData: '', |
227 | createDirectoryError: null, | ||
214 | entries: [] | 228 | entries: [] |
215 | }, | 229 | }, |
216 | methods: { | 230 | methods: { |
@@ -227,10 +241,19 @@ var app = new Vue({ | |||
227 | } | 241 | } |
228 | }); | 242 | }); |
229 | 243 | ||
244 | window.app = app; | ||
245 | |||
230 | login(localStorage.username, localStorage.password); | 246 | login(localStorage.username, localStorage.password); |
231 | 247 | ||
232 | $(window).on('hashchange', function () { | 248 | $(window).on('hashchange', function () { |
233 | loadDirectory(window.location.hash.slice(1)); | 249 | loadDirectory(window.location.hash.slice(1)); |
234 | }); | 250 | }); |
235 | 251 | ||
252 | // setup all the dialog focus handling | ||
253 | ['modalcreateDirectory'].forEach(function (id) { | ||
254 | $('#' + id).on('shown.bs.modal', function () { | ||
255 | $(this).find("[autofocus]:first").focus(); | ||
256 | }); | ||
257 | }); | ||
258 | |||
236 | })(); | 259 | })(); |