(function () {
'use strict';
+/* global superagent */
+/* global Vue */
+/* global $ */
+/* global filesize */
+
// poor man's async
function asyncForEach(items, handler, callback) {
var cur = 0;
})();
}
-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;
app.folderListingEnabled = !!result.body.folderListingEnabled;
- callback();
+ loadDirectory(decode(window.location.hash.slice(1)));
+
+ app.refreshAccessTokens();
});
});
}
text: [ '.txt', '.md' ],
pdf: [ '.pdf' ],
html: [ '.html', '.htm', '.php' ],
- video: [ '.mp4', '.mpg', '.mpeg', '.ogg', '.mkv' ]
+ video: [ '.mp4', '.mpg', '.mpeg', '.ogg', '.mkv', '.avi', '.mov' ]
};
function getPreviewUrl(entry, basePath) {
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;
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;
});
}
-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) {
return;
}
- window.open(encode(path));
+ app.activeEntry = row;
+ app.activeEntry.fullPath = encode(sanitize(app.path + '/' + row.filePath));
+ app.previewDrawerVisible = true
+
+ // window.open(encode(path));
}
function uploadFiles(files) {
app.uploadStatus.busy = true;
app.uploadStatus.count = files.length;
+ app.uploadStatus.size = 0;
app.uploadStatus.done = 0;
app.uploadStatus.percentDone = 0;
+ for (var i = 0; i < files.length; ++i) {
+ app.uploadStatus.size += files[i].size;
+ }
+
asyncForEach(files, function (file, callback) {
- var path = encode(sanitize(app.path + '/' + file.name));
+ var path = encode(sanitize(app.path + '/' + (file.webkitRelativePath || file.name)));
var formData = new FormData();
formData.append('file', file);
- superagent.post('/api/files' + path).query({ access_token: localStorage.accessToken }).send(formData).end(function (error, result) {
+ var finishedUploadSize = app.uploadStatus.done;
+
+ superagent.post('/api/files' + path)
+ .query({ access_token: localStorage.accessToken })
+ .send(formData)
+ .on('progress', function (event) {
+ // only handle upload events
+ if (!(event.target instanceof XMLHttpRequestUpload)) return;
+
+ app.uploadStatus.done = finishedUploadSize + event.loaded;
+ 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);
if (error) return callback(error);
- app.uploadStatus.done += 1;
- app.uploadStatus.percentDone = Math.round(app.uploadStatus.done / app.uploadStatus.count * 100);
-
callback();
});
}, function (error) {
app.uploadStatus.busy = false;
app.uploadStatus.count = 0;
+ app.uploadStatus.size = 0;
app.uploadStatus.done = 0;
app.uploadStatus.percentDone = 100;
}
function dragOver(event) {
+ event.stopPropagation();
event.preventDefault();
+ event.dataTransfer.dropEffect = 'copy';
}
function drop(event) {
+ event.stopPropagation();
event.preventDefault();
- uploadFiles(event.dataTransfer.files || []);
+
+ if (!event.dataTransfer.items[0]) return;
+
+ // figure if a folder was dropped on a modern browser, in this case the first would have to be a directory
+ var folderItem;
+ try {
+ folderItem = event.dataTransfer.items[0].webkitGetAsEntry();
+ if (folderItem.isFile) return uploadFiles(event.dataTransfer.files);
+ } catch (e) {
+ return uploadFiles(event.dataTransfer.files);
+ }
+
+ // if we got here we have a folder drop and a modern browser
+ // now traverse the folder tree and create a file list
+ app.uploadStatus.busy = true;
+ app.uploadStatus.uploadListCount = 0;
+
+ var fileList = [];
+ function traverseFileTree(item, path, callback) {
+ if (item.isFile) {
+ // Get file
+ item.file(function (file) {
+ fileList.push(file);
+ ++app.uploadStatus.uploadListCount;
+ callback();
+ });
+ } else if (item.isDirectory) {
+ // Get folder contents
+ var dirReader = item.createReader();
+ dirReader.readEntries(function (entries) {
+ asyncForEach(entries, function (entry, callback) {
+ traverseFileTree(entry, path + item.name + '/', callback);
+ }, callback);
+ });
+ }
+ }
+
+ traverseFileTree(folderItem, '', function (error) {
+ app.uploadStatus.busy = false;
+ app.uploadStatus.uploadListCount = 0;
+
+ if (error) return console.error(error);
+
+ uploadFiles(fileList);
+ });
}
var app = new Vue({
data: {
ready: false,
busy: false,
+ origin: window.location.origin,
uploadStatus: {
busy: false,
count: 0,
done: 0,
- percentDone: 50
+ percentDone: 50,
+ uploadListCount: 0
},
path: '/',
pathParts: [],
password: '',
busy: false
},
- entries: []
+ previewDrawerVisible: false,
+ activeEntry: {},
+ entries: [],
+ accessTokens: [],
+ accessTokensDialogVisible: false
},
methods: {
onLogin: function () {
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);
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) {
var that = this;
$(this.$refs.upload).on('change', function () {
-
// detach event handler
$(that.$refs.upload).off('change');
-
uploadFiles(that.$refs.upload.files || []);
});
this.$refs.upload.value = '';
this.$refs.upload.click();
},
+ onUploadFolder: function () {
+ var that = this;
+
+ $(this.$refs.uploadFolder).on('change', function () {
+ // detach event handler
+ $(that.$refs.uploadFolder).off('change');
+ uploadFiles(that.$refs.uploadFolder.files || []);
+ });
+
+ // reset the form first to make the change handler retrigger even on the same file selected
+ this.$refs.uploadFolder.value = '';
+ this.$refs.uploadFolder.click();
+ },
onDelete: function (entry) {
var that = this;
refresh();
});
- }).catch(function () {
- console.log('delete error:', arguments);
+ }).catch(function () {});
+ },
+ 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('.');
+ }
});
},
- onRename: function (entry) {
+ 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 (error) {
- that.$message.error(error.message);
+ 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 () {
refresh();
});
- }).catch(function (error) {
- that.$message.error(error.message);
+ }).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),
}
});
-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)));
});
})();
projects / perso / Immae / Projets / Nodejs / Surfer.git / blobdiff