From d3312ed1aace3c72570f60be56d846fb9ecbc584 Mon Sep 17 00:00:00 2001 From: Johannes Zellner Date: Tue, 1 Mar 2016 15:10:25 +0100 Subject: Make directory listing navigatable --- app/css/style.css | 4 ++++ app/index.html | 31 ++++++++++++++++++++++--------- app/js/app.js | 51 +++++++++++++++++++++++++++++++++++++++++++++++---- 3 files changed, 73 insertions(+), 13 deletions(-) diff --git a/app/css/style.css b/app/css/style.css index c75e038..b7e5742 100644 --- a/app/css/style.css +++ b/app/css/style.css @@ -29,3 +29,7 @@ pre { [v-cloak] { display: none; } + +.hand { + cursor: hand; +} \ No newline at end of file diff --git a/app/index.html b/app/index.html index 5807724..773b5cf 100644 --- a/app/index.html +++ b/app/index.html @@ -2,6 +2,7 @@ Cloudron Surfer + @@ -63,27 +64,39 @@
    -
  1. Home
    2. -
  2. Library
    3. -
  3. Data
    4. +
  4.  
    5. +
  5. + {{ part }} +
- +
+ - - - - - + + + + + + + + + + + +
Type Name Size ModifiedAction
TypeNameSizeModified
..
+ + + {{ entry.filePath }}{{ entry.size }}{{ entry.mtime }}
diff --git a/app/js/app.js b/app/js/app.js index 55153d4..10a489c 100644 --- 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,61 @@ function logout() { delete localStorage.password; } +function sanitize(filePath) { + filePath = '/' + filePath; + return filePath.replace(/\/+/g, '/'); +} + +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; }); + console.log(app.pathParts) + }); +} + +function open(entry) { + var path = sanitize(app.path + '/' + entry.filePath); + + if (entry.isDirectory) return loadDirectory(path); + + window.location.href = window.location.origin + path; +} + +function up() { + loadDirectory(app.path.split('/').slice(0, -1).filter(function (p) { return !!p; }).join('/')); +} + var app = new Vue({ el: '#app', data: { busy: true, + path: '/', + pathParts: [], session: { valid: false }, - loginData: { - - } + loginData: {}, + entries: [] }, methods: { login: login, - logout: logout + logout: logout, + loadDirectory: loadDirectory, + open: open, + up: up } }); -- cgit v1.2.3