app/js/app.js

   1 (function () {
   2 'use strict';
   3
   4 function 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;
  23
  24         loadDirectory(app.path);
  25     });
  26 }
  27
  28 function logout() {
  29     app.session.valid = false;
  30     app.session.username = username;
  31     app.session.password = password;
  32
  33     delete localStorage.username;
  34     delete localStorage.password;
  35 }
  36
  37 function sanitize(filePath) {
  38     filePath = '/' + filePath;
  39     return filePath.replace(/\/+/g, '/');
  40 }
  41
  42 function encode(filePath) {
  43     return filePath.split('/').map(encodeURIComponent).join('/');
  44 }
  45
  46 function refresh() {
  47     loadDirectory(app.path);
  48 }
  49
  50 function loadDirectory(filePath) {
  51     app.busy = true;
  52
  53     filePath = filePath ? sanitize(filePath) : '/';
  54
  55     console.log(filePath);
  56
  57     superagent.get('/api/files/' + filePath).query({ username: app.session.username, password: app.session.password }).end(function (error, result) {
  58         app.busy = false;
  59
  60         if (error) return console.error(error);
  61         if (result.statusCode === 401) return logout();
  62
  63         app.entries = result.body.entries;
  64         app.path = filePath;
  65         app.pathParts = filePath.split('/').filter(function (e) { return !!e; });
  66     });
  67 }
  68
  69 function open(entry) {
  70     var path = sanitize(app.path + '/' + entry.filePath);
  71
  72     if (entry.isDirectory) return loadDirectory(path);
  73
  74     window.open(path);
  75 }
  76
  77 function up() {
  78     loadDirectory(app.path.split('/').slice(0, -1).filter(function (p) { return !!p; }).join('/'));
  79 }
  80
  81 function upload() {
  82     $(app.$els.upload).on('change', function () {
  83         app.busy = true;
  84
  85         // detach event handler
  86         $(app.$els.upload).off('change');
  87
  88         var file = app.$els.upload.files[0];
  89         var path = encode(sanitize(app.path + '/' + file.name));
  90
  91         var formData = new FormData();
  92         formData.append('file', file);
  93
  94         superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password }).send(formData).end(function (error, result) {
  95             app.busy = false;
  96
  97             if (error) return console.error(error);
  98             if (result.statusCode !== 201) return console.error('Error uploading file: ', result.statusCode);
  99
 100             refresh();
 101         });
 102     });
 103
 104     app.$els.upload.click();
 105 }
 106
 107 function delAsk(entry) {
 108     $('#modalDelete').modal('show');
 109     app.deleteData = entry;
 110 }
 111
 112 function del(entry) {
 113     app.busy = true;
 114
 115     var path = encode(sanitize(app.path + '/' + entry.filePath));
 116
 117     superagent.del('/api/files' + path).query({ username: app.session.username, password: app.session.password, recursive: true }).end(function (error, result) {
 118         app.busy = false;
 119
 120         if (error) return console.error(error);
 121         if (result.statusCode !== 200) return console.error('Error deleting file: ', result.statusCode);
 122
 123         refresh();
 124
 125         $('#modalDelete').modal('hide');
 126     });
 127 }
 128
 129 function createDirectoryAsk() {
 130     $('#modalcreateDirectory').modal('show');
 131     app.createDirectoryData = '';
 132 }
 133
 134 function createDirectory(name) {
 135     app.busy = true;
 136
 137     var path = encode(sanitize(app.path + '/' + name));
 138
 139     superagent.put('/api/files' + path).query({ username: app.session.username, password: app.session.password, directory: true }).end(function (error, result) {
 140         app.busy = false;
 141
 142         if (error) return console.error(error);
 143         if (result.statusCode !== 201) return console.error('Error creating directory: ', result.statusCode);
 144
 145         app.createDirectoryData = '';
 146         refresh();
 147
 148         $('#modalcreateDirectory').modal('hide');
 149     });
 150 }
 151
 152 var app = new Vue({
 153     el: '#app',
 154     data: {
 155         busy: true,
 156         path: '/',
 157         pathParts: [],
 158         session: {
 159             valid: false
 160         },
 161         loginData: {},
 162         deleteData: {},
 163         createDirectoryData: '',
 164         entries: []
 165     },
 166     methods: {
 167         login: login,
 168         logout: logout,
 169         loadDirectory: loadDirectory,
 170         open: open,
 171         up: up,
 172         upload: upload,
 173         delAsk: delAsk,
 174         del: del,
 175         createDirectoryAsk: createDirectoryAsk,
 176         createDirectory: createDirectory
 177     }
 178 });
 179
 180 window.app = app;
 181
 182 login(localStorage.username, localStorage.password);
 183
 184 })();