X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=frontend%2Fjs%2Fapp.js;h=d99a91e05f0b20bcb73ca1db072dc09f74614a93;hb=809fcf5dcaf1fad139ba55e412f5349863224fe0;hp=be5705f6a8eb962e6413a533992aa046d37f1ade;hpb=c66d70933dbd80ec734f4986f92369ff1e549bbb;p=perso%2FImmae%2FProjets%2FNodejs%2FSurfer.git diff --git a/frontend/js/app.js b/frontend/js/app.js index be5705f..d99a91e 100644 --- a/frontend/js/app.js +++ b/frontend/js/app.js @@ -1,6 +1,11 @@ (function () { 'use strict'; +/* global superagent */ +/* global Vue */ +/* global $ */ +/* global filesize */ + // poor man's async function asyncForEach(items, handler, callback) { var cur = 0; @@ -18,14 +23,14 @@ function asyncForEach(items, handler, callback) { })(); } -function getProfile(accessToken, callback) { +function initWithToken(accessToken) { superagent.get('/api/profile').query({ access_token: accessToken }).end(function (error, result) { app.ready = true; - if (error && !error.response) return callback(error); + if (error && !error.response) return console.error(error); if (result.statusCode !== 200) { delete localStorage.accessToken; - return callback('Invalid access token'); + return; } localStorage.accessToken = accessToken; @@ -37,7 +42,9 @@ function getProfile(accessToken, callback) { app.folderListingEnabled = !!result.body.folderListingEnabled; - callback(); + loadDirectory(decode(window.location.hash.slice(1))); + + app.refreshAccessTokens(); }); }); } @@ -86,6 +93,16 @@ function refresh() { loadDirectory(app.path); } +function logout() { + superagent.post('/api/logout').query({ access_token: localStorage.accessToken }).end(function (error) { + if (error) console.error(error); + + app.session.valid = false; + + delete localStorage.accessToken; + }); +} + function loadDirectory(filePath) { app.busy = true; @@ -101,6 +118,8 @@ function loadDirectory(filePath) { app.entries = result.body.entries.map(function (entry) { entry.previewUrl = getPreviewUrl(entry, filePath); entry.extension = getExtension(entry); + entry.rename = false; + entry.filePathNew = entry.filePath; return entry; }); app.path = filePath; @@ -116,7 +135,10 @@ function loadDirectory(filePath) { }); } -function open(row, event, column) { +function open(row, column, event) { + // ignore item open on row clicks if we are renaming this entry + if (row.rename) return; + var path = sanitize(app.path + '/' + row.filePath); if (row.isDirectory) { @@ -156,7 +178,8 @@ function uploadFiles(files) { if (!(event.target instanceof XMLHttpRequestUpload)) return; app.uploadStatus.done = finishedUploadSize + event.loaded; - app.uploadStatus.percentDone = Math.round(app.uploadStatus.done / app.uploadStatus.size * 100); + var tmp = Math.round(app.uploadStatus.done / app.uploadStatus.size * 100); + app.uploadStatus.percentDone = tmp > 100 ? 100 : tmp; }).end(function (error, result) { if (result && result.statusCode === 401) return logout(); if (result && result.statusCode !== 201) return callback('Error uploading file: ', result.statusCode); @@ -238,6 +261,7 @@ var app = new Vue({ data: { ready: false, busy: false, + origin: window.location.origin, uploadStatus: { busy: false, count: 0, @@ -256,7 +280,9 @@ var app = new Vue({ password: '', busy: false }, - entries: [] + entries: [], + accessTokens: [], + accessTokensDialogVisible: false }, methods: { onLogin: function () { @@ -270,16 +296,10 @@ var app = new Vue({ if (error && !result) return that.$message.error(error.message); if (result.statusCode === 401) return that.$message.error('Wrong username or password'); - getProfile(result.body.accessToken, function (error) { - if (error) return console.error(error); - - loadDirectory(window.location.hash.slice(1)); - }); + initWithToken(result.body.accessToken); }); }, onOptionsMenu: function (command) { - var that = this; - if (command === 'folderListing') { superagent.put('/api/settings').send({ folderListingEnabled: this.folderListingEnabled }).query({ access_token: localStorage.accessToken }).end(function (error) { if (error) console.error(error); @@ -295,13 +315,9 @@ var app = new Vue({ center: true }).then(function () {}).catch(function () {}); } else if (command === 'logout') { - superagent.post('/api/logout').query({ access_token: localStorage.accessToken }).end(function (error) { - if (error) console.error(error); - - that.session.valid = false; - - delete localStorage.accessToken; - }); + logout(); + } else if (command === 'apiAccess') { + this.accessTokensDialogVisible = true; } }, onDownload: function (entry) { @@ -350,22 +366,42 @@ var app = new Vue({ }); }).catch(function () {}); }, - onRename: function (entry) { + onRename: function (entry, scope) { + if (entry.rename) return entry.rename = false; + + entry.rename = true; + + Vue.nextTick(function () { + var elem = document.getElementById('filePathRenameInputId-' + scope.$index); + elem.focus(); + + if (typeof elem.selectionStart != "undefined") { + elem.selectionStart = 0; + elem.selectionEnd = entry.filePath.lastIndexOf('.'); + } + }); + }, + onRenameEnd: function (entry) { + entry.rename = false; + entry.filePathNew = entry.filePath; + }, + onRenameSubmit: function (entry) { var that = this; - var title = 'Rename ' + entry.filePath; - this.$prompt('', title, { confirmButtonText: 'Yes', cancelButtonText: 'No', inputPlaceholder: 'new filename', inputValue: entry.filePath }).then(function (data) { - var path = encode(sanitize(that.path + '/' + entry.filePath)); - var newFilePath = sanitize(that.path + '/' + data.value); + entry.rename = false; - superagent.put('/api/files' + path).query({ access_token: localStorage.accessToken }).send({ newFilePath: newFilePath }).end(function (error, result) { - if (result && result.statusCode === 401) return logout(); - if (result && result.statusCode !== 200) return that.$message.error('Error renaming file: ' + result.statusCode); - if (error) return that.$message.error(error.message); + if (entry.filePathNew === entry.filePath) return; - refresh(); - }); - }).catch(function () {}); + var path = encode(sanitize(this.path + '/' + entry.filePath)); + var newFilePath = sanitize(this.path + '/' + entry.filePathNew); + + superagent.put('/api/files' + path).query({ access_token: localStorage.accessToken }).send({ newFilePath: newFilePath }).end(function (error, result) { + if (result && result.statusCode === 401) return logout(); + if (result && result.statusCode !== 200) return that.$message.error('Error renaming file: ' + result.statusCode); + if (error) return that.$message.error(error.message); + + entry.filePath = entry.filePathNew; + }); }, onNewFolder: function () { var that = this; @@ -385,6 +421,42 @@ var app = new Vue({ }); }).catch(function () {}); }, + refreshAccessTokens: function () { + var that = this; + + superagent.get('/api/tokens').query({ access_token: localStorage.accessToken }).end(function (error, result) { + if (error && !result) return that.$message.error(error.message); + + that.accessTokens = result.body.accessTokens; + }); + }, + onCopyAccessToken: function (event) { + event.target.select(); + document.execCommand('copy'); + + this.$message({ type: 'success', message: 'Access token copied to clipboard' }); + }, + onCreateAccessToken: function () { + var that = this; + + superagent.post('/api/tokens').query({ access_token: localStorage.accessToken }).end(function (error, result) { + if (error && !result) return that.$message.error(error.message); + + that.refreshAccessTokens(); + }); + }, + onDeleteAccessToken: function (token) { + var that = this; + + this.$confirm('All actions from apps using this token will fail!', 'Really delete this access token?', { confirmButtonText: 'Yes Delete', cancelButtonText: 'No' }).then(function () { + superagent.delete('/api/tokens/' + token).query({ access_token: localStorage.accessToken }).end(function (error, result) { + if (error && !result) return that.$message.error(error.message); + + that.refreshAccessTokens(); + }); + }).catch(function () {}); + + }, prettyDate: function (row, column, cellValue, index) { var date = new Date(cellValue), diff = (((new Date()).getTime() - date.getTime()) / 1000), @@ -418,14 +490,10 @@ var app = new Vue({ } }); -getProfile(localStorage.accessToken, function (error) { - if (error) return console.error(error); - - loadDirectory(window.location.hash.slice(1)); -}); +initWithToken(localStorage.accessToken); $(window).on('hashchange', function () { - loadDirectory(window.location.hash.slice(1)); + loadDirectory(decode(window.location.hash.slice(1))); }); })();