]> git.immae.eu Git - perso/Immae/Projets/Nodejs/Surfer.git/blame - frontend/js/app.js
Rename app/ to frontend/
[perso/Immae/Projets/Nodejs/Surfer.git] / frontend / js / app.js
CommitLineData
6eb72d64
JZ
1(function () {
2'use strict';
3
4function login(username, password) {
5 username = username || app.loginData.username;
6 password = password || app.loginData.password;
7
8 app.busy = true;
9
10 superagent.get('/api/files/').query({ username: username, password: password }).end(function (error, result) {
11 app.busy = false;
12
13 if (error) return console.error(error);
14 if (result.statusCode === 401) return console.error('Invalid credentials');
15
16 app.session.valid = true;
17 app.session.username = username;
18 app.session.password = password;
19
20 // clearly not the best option
21 localStorage.username = username;
22 localStorage.password = password;
d3312ed1 23
04bc2989 24 loadDirectory(window.location.hash.slice(1));
6eb72d64
JZ
25 });
26}
27
28function logout() {
29 app.session.valid = false;
95c627bf
JZ
30 app.session.username = null;
31 app.session.password = null;
6eb72d64
JZ
32
33 delete localStorage.username;
34 delete localStorage.password;
35}
36
d3312ed1
JZ
37function sanitize(filePath) {
38 filePath = '/' + filePath;
39 return filePath.replace(/\/+/g, '/');
40}
41
537bfb04
JZ
42function encode(filePath) {
43 return filePath.split('/').map(encodeURIComponent).join('/');
44}
45
04bc2989
JZ
46function decode(filePath) {
47 return filePath.split('/').map(decodeURIComponent).join('/');
48}
49
a26d1f9b
JZ
50var mimeTypes = {
51 images: [ '.png', '.jpg', '.jpeg', '.tiff', '.gif' ],
52 text: [ '.txt', '.md' ],
53 pdf: [ '.pdf' ],
54 html: [ '.html', '.htm', '.php' ],
55 video: [ '.mp4', '.mpg', '.mpeg', '.ogg', '.mkv' ]
56};
57
58function getPreviewUrl(entry, basePath) {
59 var path = '/_admin/img/';
60
61 if (entry.isDirectory) return path + 'directory.png';
62 if (mimeTypes.images.some(function (e) { return entry.filePath.endsWith(e); })) return sanitize(basePath + '/' + entry.filePath);
63 if (mimeTypes.text.some(function (e) { return entry.filePath.endsWith(e); })) return path +'text.png';
64 if (mimeTypes.pdf.some(function (e) { return entry.filePath.endsWith(e); })) return path + 'pdf.png';
65 if (mimeTypes.html.some(function (e) { return entry.filePath.endsWith(e); })) return path + 'html.png';
66 if (mimeTypes.video.some(function (e) { return entry.filePath.endsWith(e); })) return path + 'video.png';
67
68 return path + 'unknown.png';
69}
70
537bfb04
JZ
71function refresh() {
72 loadDirectory(app.path);
73}
74
d3312ed1
JZ
75function loadDirectory(filePath) {
76 app.busy = true;
77
78 filePath = filePath ? sanitize(filePath) : '/';
79
51723cdf 80 superagent.get('/api/files/' + encode(filePath)).query({ username: app.session.username, password: app.session.password }).end(function (error, result) {
d3312ed1
JZ
81 app.busy = false;
82
9209abec 83 if (result && result.statusCode === 401) return logout();
d3312ed1 84 if (error) return console.error(error);
d3312ed1 85
04bc2989 86 result.body.entries.sort(function (a, b) { return a.isDirectory && b.isFile ? -1 : 1; });
a26d1f9b
JZ
87 app.entries = result.body.entries.map(function (entry) {
88 entry.previewUrl = getPreviewUrl(entry, filePath);
89 return entry;
90 });
d3312ed1 91 app.path = filePath;
51723cdf
J
92 app.pathParts = decode(filePath).split('/').filter(function (e) { return !!e; }).map(function (e, i, a) {
93 return {
94 name: e,
95 link: '#' + sanitize('/' + a.slice(0, i).join('/') + '/' + e)
96 };
97 });
04bc2989
JZ
98
99 // update in case this was triggered from code
100 window.location.hash = app.path;
3e98fb0c
JZ
101
102 Vue.nextTick(function () {
103 $(function () {
104 $('[data-toggle="tooltip"]').tooltip();
105 });
106 });
d3312ed1
JZ
107 });
108}
109
110function open(entry) {
5f43935e 111 var path = sanitize(app.path + '/' + entry.filePath);
d3312ed1 112
04bc2989
JZ
113 if (entry.isDirectory) {
114 window.location.hash = path;
115 return;
116 }
d3312ed1 117
5f43935e 118 window.open(encode(path));
d3312ed1
JZ
119}
120
121function up() {
5f43935e 122 window.location.hash = sanitize(app.path.split('/').slice(0, -1).filter(function (p) { return !!p; }).join('/'));
d3312ed1
JZ
123}
124
537bfb04 125function upload() {
403359cf 126 $(app.$els.upload).on('change', function () {
537bfb04
JZ
127 app.busy = true;
128
403359cf
JZ
129 // detach event handler
130 $(app.$els.upload).off('change');
131
ecfbca9f
J
132 var length = app.$els.upload.files.length;
133 var done = 0;
537bfb04 134
ecfbca9f
J
135 function uploadFile(file) {
136 var path = encode(sanitize(app.path + '/' + file.name));
537bfb04 137
ecfbca9f
J
138 var formData = new FormData();
139 formData.append('file', file);
537bfb04 140
ecfbca9f
J
141 superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password }).send(formData).end(function (error, result) {
142 if (result && result.statusCode === 401) return logout();
143 if (result && result.statusCode !== 201) console.error('Error uploading file: ', result.statusCode);
144 if (error) console.error(error);
537bfb04 145
ecfbca9f
J
146 ++done;
147
148 if (done >= length) {
149 app.busy = false;
150 refresh();
151 }
152 });
153 }
154
155 for(var i = 0; i < length; i++) {
156 uploadFile(app.$els.upload.files[i]);
157 }
537bfb04
JZ
158 });
159
e41fd8d8
JZ
160 // reset the form first to make the change handler retrigger even on the same file selected
161 $('#fileUploadForm')[0].reset();
162
537bfb04
JZ
163 app.$els.upload.click();
164}
165
9138d7d4
JZ
166function delAsk(entry) {
167 $('#modalDelete').modal('show');
168 app.deleteData = entry;
169}
170
171function del(entry) {
172 app.busy = true;
173
174 var path = encode(sanitize(app.path + '/' + entry.filePath));
175
176 superagent.del('/api/files' + path).query({ username: app.session.username, password: app.session.password, recursive: true }).end(function (error, result) {
177 app.busy = false;
178
9209abec
JZ
179 if (result && result.statusCode === 401) return logout();
180 if (result && result.statusCode !== 200) return console.error('Error deleting file: ', result.statusCode);
9138d7d4 181 if (error) return console.error(error);
9138d7d4
JZ
182
183 refresh();
184
185 $('#modalDelete').modal('hide');
186 });
187}
188
403359cf
JZ
189function createDirectoryAsk() {
190 $('#modalcreateDirectory').modal('show');
191 app.createDirectoryData = '';
9209abec 192 app.createDirectoryError = null;
403359cf
JZ
193}
194
195function createDirectory(name) {
196 app.busy = true;
9209abec 197 app.createDirectoryError = null;
403359cf
JZ
198
199 var path = encode(sanitize(app.path + '/' + name));
200
201 superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password, directory: true }).end(function (error, result) {
202 app.busy = false;
203
9209abec
JZ
204 if (result && result.statusCode === 401) return logout();
205 if (result && result.statusCode === 403) {
206 app.createDirectoryError = 'Name not allowed';
207 return;
208 }
209 if (result && result.statusCode === 409) {
210 app.createDirectoryError = 'Directory already exists';
211 return;
212 }
213 if (result && result.statusCode !== 201) return console.error('Error creating directory: ', result.statusCode);
403359cf 214 if (error) return console.error(error);
403359cf
JZ
215
216 app.createDirectoryData = '';
217 refresh();
218
219 $('#modalcreateDirectory').modal('hide');
220 });
221}
222
235212c4
JZ
223Vue.filter('prettyDate', function (value) {
224 var d = new Date(value);
225 return d.toDateString();
226});
227
8fce52f8
JZ
228Vue.filter('prettyFileSize', function (value) {
229 return filesize(value);
230});
231
6eb72d64
JZ
232var app = new Vue({
233 el: '#app',
234 data: {
235 busy: true,
d3312ed1
JZ
236 path: '/',
237 pathParts: [],
6eb72d64
JZ
238 session: {
239 valid: false
240 },
d3312ed1 241 loginData: {},
9138d7d4 242 deleteData: {},
403359cf 243 createDirectoryData: '',
9209abec 244 createDirectoryError: null,
d3312ed1 245 entries: []
6eb72d64
JZ
246 },
247 methods: {
248 login: login,
d3312ed1
JZ
249 logout: logout,
250 loadDirectory: loadDirectory,
251 open: open,
537bfb04 252 up: up,
9138d7d4
JZ
253 upload: upload,
254 delAsk: delAsk,
403359cf
JZ
255 del: del,
256 createDirectoryAsk: createDirectoryAsk,
257 createDirectory: createDirectory
6eb72d64
JZ
258 }
259});
260
9209abec
JZ
261window.app = app;
262
6eb72d64
JZ
263login(localStorage.username, localStorage.password);
264
04bc2989
JZ
265$(window).on('hashchange', function () {
266 loadDirectory(window.location.hash.slice(1));
267});
268
9209abec
JZ
269// setup all the dialog focus handling
270['modalcreateDirectory'].forEach(function (id) {
271 $('#' + id).on('shown.bs.modal', function () {
272 $(this).find("[autofocus]:first").focus();
273 });
274});
275
6eb72d64 276})();