Add ui to create directories

[perso/Immae/Projets/Nodejs/Surfer.git] / app / js / app.js

diff --git a/app/js/app.js b/app/js/app.js
index 55153d44ef57c08938920c0919c3c01cc16ba1c1..c0ed6160afa430d5a70b0af33c328584e746eaa8 100644 (file)
--- a/app/js/app.js
+++ b/app/js/app.js
@@ -20,6 +20,8 @@ function login(username, password) {
         // clearly not the best option
         localStorage.username = username;
         localStorage.password = password;
+
+        loadDirectory(app.path);
     });
 }
 
@@ -32,20 +34,146 @@ function logout() {
     delete localStorage.password;
 }
 
+function sanitize(filePath) {
+    filePath = '/' + filePath;
+    return filePath.replace(/\/+/g, '/');
+}
+
+function encode(filePath) {
+    return filePath.split('/').map(encodeURIComponent).join('/');
+}
+
+function refresh() {
+    loadDirectory(app.path);
+}
+
+function loadDirectory(filePath) {
+    app.busy = true;
+
+    filePath = filePath ? sanitize(filePath) : '/';
+
+    console.log(filePath);
+
+    superagent.get('/api/files/' + filePath).query({ username: app.session.username, password: app.session.password }).end(function (error, result) {
+        app.busy = false;
+
+        if (error) return console.error(error);
+        if (result.statusCode === 401) return logout();
+
+        app.entries = result.body.entries;
+        app.path = filePath;
+        app.pathParts = filePath.split('/').filter(function (e) { return !!e; });
+    });
+}
+
+function open(entry) {
+    var path = sanitize(app.path + '/' + entry.filePath);
+
+    if (entry.isDirectory) return loadDirectory(path);
+
+    window.open(path);
+}
+
+function up() {
+    loadDirectory(app.path.split('/').slice(0, -1).filter(function (p) { return !!p; }).join('/'));
+}
+
+function upload() {
+    $(app.$els.upload).on('change', function () {
+        app.busy = true;
+
+        // detach event handler
+        $(app.$els.upload).off('change');
+
+        var file = app.$els.upload.files[0];
+        var path = encode(sanitize(app.path + '/' + file.name));
+
+        var formData = new FormData();
+        formData.append('file', file);
+
+        superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password }).send(formData).end(function (error, result) {
+            app.busy = false;
+
+            if (error) return console.error(error);
+            if (result.statusCode !== 201) return console.error('Error uploading file: ', result.statusCode);
+
+            refresh();
+        });
+    });
+
+    app.$els.upload.click();
+}
+
+function delAsk(entry) {
+    $('#modalDelete').modal('show');
+    app.deleteData = entry;
+}
+
+function del(entry) {
+    app.busy = true;
+
+    var path = encode(sanitize(app.path + '/' + entry.filePath));
+
+    superagent.del('/api/files' + path).query({ username: app.session.username, password: app.session.password, recursive: true }).end(function (error, result) {
+        app.busy = false;
+
+        if (error) return console.error(error);
+        if (result.statusCode !== 200) return console.error('Error deleting file: ', result.statusCode);
+
+        refresh();
+
+        $('#modalDelete').modal('hide');
+    });
+}
+
+function createDirectoryAsk() {
+    $('#modalcreateDirectory').modal('show');
+    app.createDirectoryData = '';
+}
+
+function createDirectory(name) {
+    app.busy = true;
+
+    var path = encode(sanitize(app.path + '/' + name));
+
+    superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password, directory: true }).end(function (error, result) {
+        app.busy = false;
+
+        if (error) return console.error(error);
+        if (result.statusCode !== 201) return console.error('Error creating directory: ', result.statusCode);
+
+        app.createDirectoryData = '';
+        refresh();
+
+        $('#modalcreateDirectory').modal('hide');
+    });
+}
+
 var app = new Vue({
     el: '#app',
     data: {
         busy: true,
+        path: '/',
+        pathParts: [],
         session: {
             valid: false
         },
-        loginData: {
-
-        }
+        loginData: {},
+        deleteData: {},
+        createDirectoryData: '',
+        entries: []
     },
     methods: {
         login: login,
-        logout: logout
+        logout: logout,
+        loadDirectory: loadDirectory,
+        open: open,
+        up: up,
+        upload: upload,
+        delAsk: delAsk,
+        del: del,
+        createDirectoryAsk: createDirectoryAsk,
+        createDirectory: createDirectory
     }
 });