`;
document.getElementById('error_wrapper').innerHTML = '';
- document.getElementById('error_wrapper').appendChild(error.firstChild);
+ document.getElementById('error_wrapper').appendChild(error);
+
+ setTimeout(function () {
+ if (typeof (document.getElementById(id)) != 'undefined' && document.getElementById(id) != null) {
+ document.getElementById(id).remove();
+ }
+ }, 10000);
}
function create_success_view(text) {
+ let id = get_random_id();
let error = document.createElement('div');
- error.innerHTML = `
+
+ error.innerHTML = `
${text}
`;
document.getElementById('error_wrapper').innerHTML = '';
document.getElementById('error_wrapper').appendChild(error.firstChild);
+
+ setTimeout(function () {
+ if (typeof (document.getElementById(id)) != 'undefined' && document.getElementById(id) != null) {
+ document.getElementById(id).remove();
+ }
+ }, 10000);
}
\ No newline at end of file
diff --git a/Frontend/static/js/callbacks.js b/Frontend/static/js/callbacks.js
deleted file mode 100644
index 8c8800b..0000000
--- a/Frontend/static/js/callbacks.js
+++ /dev/null
@@ -1,66 +0,0 @@
-function logout_callback(response, code) {
- if (code === 200) {
- sessionStorage.removeItem('authorization');
- location.reload();
- } else {
- create_error_view(response['error'] + `
Return to root directory`);
- }
-}
-
-function remove_callback(response, code) {
- if (code === 200) {
- create_success_view("Successfully deleted.");
- url_changed();
- } else {
- create_error_view(response);
- }
-}
-
-function save_file_callback(response, code) {
- if (code === 200) {
- create_success_view("Saved file successfully");
- } else {
- create_error_view(JSON.parse(response)['error']);
- }
-}
-
-
-function show_image_callback(response, code) {
- if (code === 200) {
- document.getElementsByClassName("modal_content")[0].innerHTML = `
`;
- } else {
- create_error_view(response['error'] + `
Return to root directory`);
- }
-}
-
-function show_text_callback(response, code) {
- if (code === 200) {
- document.getElementsByClassName("modal_content")[0].innerHTML = `
-
-
`;
- } else {
- create_error_view(response['error'] + `
Return to root directory`);
- }
-}
-
-function show_audio_callback(response, code) {
- if (code === 200) {
- document.getElementsByClassName("modal_content")[0].innerHTML = `
`;
- } else {
- create_error_view(response['error'] + `
Return to root directory`);
- }
-}
-
-function show_video_callback(response, code) {
- if (code === 200) {
- document.getElementsByClassName("modal_content")[0].innerHTML = `
`;
- } else {
- create_error_view(response['error'] + `
Return to root directory`);
- }
-}
\ No newline at end of file
diff --git a/Frontend/static/js/dropdown.js b/Frontend/static/js/dropdown.js
new file mode 100644
index 0000000..6a6fd93
--- /dev/null
+++ b/Frontend/static/js/dropdown.js
@@ -0,0 +1,30 @@
+function download_file(path, mimetype) {
+ let file = path.split('/');
+ let filename = file[file.length - 1];
+
+ httpGetAsync(base_url + path, null, function (response, code) {
+ if (code === 200) {
+ let element = document.createElement('a');
+ element.setAttribute('href', 'data:' + mimetype + ',' + encodeURIComponent(response));
+ element.setAttribute('download', filename);
+
+ element.style.display = 'none';
+ document.body.appendChild(element);
+ element.click();
+ document.body.removeChild(element);
+ } else {
+ create_error_view("Error " + response);
+ }
+ });
+}
+
+function remove_file(filename) {
+ httpDeleteAsync(base_url + filename, null, function (response, code) {
+ if (code === 200) {
+ create_success_view("Successfully deleted.");
+ path_changed();
+ } else {
+ create_error_view(response);
+ }
+ });
+}
\ No newline at end of file
diff --git a/Frontend/static/js/generate_directory_tree.js b/Frontend/static/js/generate_directory_tree.js
index 2f9221d..1cc9390 100644
--- a/Frontend/static/js/generate_directory_tree.js
+++ b/Frontend/static/js/generate_directory_tree.js
@@ -50,7 +50,7 @@ function create_tree_view() {
function tree_onclick(url) {
window.history.pushState('index', 'Filemanager', 'index.html?path=' + url);
- url_changed();
+ path_changed();
}
function create_list_view(dataRoot, elementRoot, url) {
diff --git a/Frontend/static/js/index.js b/Frontend/static/js/index.js
index b8657cf..b60f424 100644
--- a/Frontend/static/js/index.js
+++ b/Frontend/static/js/index.js
@@ -7,7 +7,7 @@ window.addEventListener('load', function () {
create_base_view();
create_logout_view();
create_tree_data('');
- url_changed();
+ path_changed();
} else {
console.log('Not logged in');
create_login_view();
@@ -15,49 +15,37 @@ window.addEventListener('load', function () {
});
window.addEventListener('popstate', function () {
- url_changed();
+ path_changed();
});
-function url_changed() {
- let curr_dir = get_path();
-
- if (curr_dir !== null) {
- if (curr_dir.startsWith('/') || curr_dir === '') {
- httpGetAsync(base_url + curr_dir, null, show_files);
- } else {
- // Malformed url if curr_dir does not start with /
- httpGetAsync(base_url + '/' + curr_dir, null, show_files);
- }
- } else {
- httpGetAsync(base_url, null, show_files);
- }
+function path_changed() {
+ let curr_dir = get_curr_path();
+ httpGetAsync(base_url + curr_dir, null, show_files);
}
function login() {
let username = document.getElementById("username").value;
let password = document.getElementById("password").value;
- const xmlHttp = new XMLHttpRequest();
- xmlHttp.onreadystatechange = function () {
- if (this.readyState === 4) {
- if (xmlHttp.status === 200) {
- sessionStorage.setItem("authorization", btoa(username + ':' + JSON.parse(xmlHttp.responseText)['token']));
+ httpPostAsync(base_url + '/login', 'username=' + username + '&password=' + password, function (response, code) {
+ if (code === 200) {
+ sessionStorage.setItem("authorization", btoa(username + ':' + JSON.parse(response)['token']));
- create_base_view();
- create_logout_view();
- create_tree_data('');
- url_changed();
- } else if (xmlHttp.status === 401) {
- create_error_view("Wrong username or password!");
- } else {
- create_error_view("Unknown error!");
+ create_base_view();
+ create_logout_view();
+ create_tree_data('');
+ path_changed();
+ } else if (code === 401) {
+ create_error_view("Wrong username or password!");
+ } else {
+ try {
+ response = JSON.parse(response);
+ create_error_view(response['error'] + `
Return to root directory`);
+ } catch (e) {
+ create_error_view(`Unrecoverable error!
Return to root directory`);
}
}
- }
-
- xmlHttp.open("POST", base_url + '/login', true);
- xmlHttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
- xmlHttp.send('username=' + username + '&password=' + password);
+ })
}
function show_files(response, code) {
@@ -72,15 +60,15 @@ function show_files(response, code) {
// Error
try {
response = JSON.parse(response);
- create_error_view(response['error'] + `
Return to root directory`);
+ create_error_view(response['error'] + `
Return to root directory`);
} catch (e) {
- create_error_view(`Unrecoverable error!
Return to root directory`);
+ create_error_view(`Unrecoverable error!
Return to root directory`);
}
}
}
function one_dir_back() {
- let curr_dir = get_path();
+ let curr_dir = get_curr_path();
if (curr_dir !== null) {
let dir = curr_dir.split('/');
@@ -94,48 +82,81 @@ function one_dir_back() {
}
function save_file(filename, content) {
- document.getElementById('modal').style.display = 'none';
- httpPostAsync(base_url + filename, content, save_file_callback);
-}
-
-function download_file(filename) {
- let file = filename.split('/');
- saveFile(base_url + filename, file[file.length - 1]);
-}
-
-function remove_file(filename) {
- httpDeleteAsync(base_url + filename, null, remove_callback);
+ remove_modal();
+ httpPostAsync(base_url + filename, 'content=' + btoa(content), function (response, code) {
+ if (code === 200) {
+ create_success_view("Saved file successfully");
+ } else {
+ create_error_view(JSON.parse(response)['error']);
+ }
+ });
}
function add_folder() {
- document.getElementById('modal_title').innerText = 'Create Folder';
-
- document.getElementsByClassName("modal_content")[0].innerHTML = `
-
-
`;
-
- document.getElementById('modal').style.display = 'block';
+ let content = `
`;
+ let footer = `
+
`;
+ create_modal('Create Folder', content, footer);
}
function add_file() {
- document.getElementById('modal_title').innerText = 'Create File';
-
- document.getElementsByClassName("modal_content")[0].innerHTML = `
-
-
-
-
- `;
-
- document.getElementById('modal').style.display = 'block';
+ let content = `
+
+
+
`;
+ let footer = `
+
`;
+ create_modal('Create File', content, footer);
}
-function create_text_file() {
- let path = get_path();
- if (path === null) path = '';
- save_file(path + '/' + document.getElementById('input').value.trim(), document.getElementById('textarea').value.trim());
+function upload_file() {
+ let content = `
`;
+ let footer = `
+
`;
+ create_modal('Upload File', content, footer);
}
-function get_path() {
- return findGetParameter('path');
+function api_create_folder(name) {
+ httpPostAsync(base_url + get_curr_path() + '/' + name, 'type=dir', function (response, code) {
+ remove_modal();
+ path_changed();
+
+ if (code === 200) {
+ create_success_view('Created directory successfully');
+ } else {
+ try {
+ response = JSON.parse(response);
+ create_error_view(response['error']);
+ } catch (e) {
+ create_error_view(`Unrecoverable error!
Return to root directory`);
+ }
+ }
+ });
+}
+
+function api_upload_file() { // TODO
+ let files = document.getElementById('modal_content').children[0].children[0].files[0];
+ console.log(files);
+
+ // let formData = new FormData();
+ // formData.append('local', files, files.name);
+ //
+ // httpPostAsync(base_url + get_curr_path() + '/' + files.name, 'newFile=' + formData, function (response, code) {
+ // console.log(code)
+ // console.log(response)
+ // })
+}
+
+function get_curr_path() {
+ let curr_dir = findGetParameter('path');
+ if (curr_dir === null) {
+ curr_dir = '';
+ }
+
+ if (!curr_dir.startsWith('/') && curr_dir !== '') {
+ // Malformed url if curr_dir does not start with /
+ curr_dir = '/' + curr_dir;
+ }
+
+ return curr_dir;
}
\ No newline at end of file
diff --git a/Frontend/static/js/modal.js b/Frontend/static/js/modal.js
new file mode 100644
index 0000000..24243ea
--- /dev/null
+++ b/Frontend/static/js/modal.js
@@ -0,0 +1,28 @@
+function create_modal(title, content, footer) {
+ let div = document.createElement('div');
+ div.innerHTML = `
+
+
+
+
+ ${content}
+
+
+
+
+
`
+ document.body.appendChild(div.firstChild);
+}
+
+function remove_modal() {
+ document.getElementById('modal').remove();
+}
+
+function change_modal_content(content) {
+ document.getElementById("modal_content").innerHTML = content;
+}
\ No newline at end of file
diff --git a/Frontend/static/js/tools.js b/Frontend/static/js/tools.js
index 13a85f6..b53c910 100644
--- a/Frontend/static/js/tools.js
+++ b/Frontend/static/js/tools.js
@@ -11,30 +11,6 @@ function httpGetAsync(url, data, callback) {
xmlHttp.send(null);
}
-function saveFile(url, filename, mimetype) {
- const xmlHttp = new XMLHttpRequest();
- xmlHttp.onreadystatechange = function () {
- if (this.readyState === 4) {
- if (xmlHttp.status === 200) {
- let element = document.createElement('a');
- element.setAttribute('href', 'data:' + mimetype + ',' + encodeURIComponent(xmlHttp.responseText));
- element.setAttribute('download', filename);
-
- element.style.display = 'none';
- document.body.appendChild(element);
- element.click();
- document.body.removeChild(element);
- } else {
- create_error_view("Error " + xmlHttp.status);
- }
- }
- }
-
- xmlHttp.open("GET", url, true);
- xmlHttp.setRequestHeader('Authorization', 'Basic ' + sessionStorage.getItem('authorization'));
- xmlHttp.send(null);
-}
-
function httpPostAsync(url, data, callback) {
const xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function () {
@@ -46,7 +22,7 @@ function httpPostAsync(url, data, callback) {
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader('Authorization', 'Basic ' + sessionStorage.getItem('authorization'));
xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
- xmlHttp.send('content=' + btoa(data));
+ xmlHttp.send(data);
}
function httpDeleteAsync(url, data, callback) {
@@ -73,4 +49,14 @@ function findGetParameter(parameterName) {
if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
});
return result;
+}
+
+function get_random_id() {
+ let s4 = function () {
+ return Math.floor((1 + Math.random()) * 0x10000)
+ .toString(16)
+ .substring(1);
+ }
+
+ return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
}
\ No newline at end of file
diff --git a/Frontend/static/js/views.js b/Frontend/static/js/views.js
index 57e3273..98d39e0 100644
--- a/Frontend/static/js/views.js
+++ b/Frontend/static/js/views.js
@@ -1,9 +1,27 @@
function create_base_view() {
- let tmp = document.createElement('div');
+ let tmp;
+ tmp = document.createElement('div');
tmp.innerHTML = `
`;
document.getElementById("wrapper").innerHTML = tmp.innerHTML;
+
+
+ tmp = document.createElement('div');
+ tmp.innerHTML = `
+
+
+
+
+
+
+
+
+
`
+ document.getElementsByTagName('main')[0].appendChild(tmp);
}
function create_login_view() {
@@ -25,22 +43,53 @@ function create_login_view() {