javascript updates. I'm starting to <3 JS

pull/144/head
Henrique Dias 2016-06-21 14:23:16 +01:00
parent 8dd42a284b
commit 0078658c39
2 changed files with 161 additions and 84 deletions

View File

@ -9,45 +9,49 @@ Array.prototype.removeElement = function(element) {
} }
} }
Document.prototype.sendCostumEvent = function(text) {
document.dispatchEvent(new CustomEvent(text));
}
var viewEvent = function(event) { var viewEvent = function(event) {
var cookie = getCookie("view-list"); let cookie = getCookie('view-list');
var listing = document.getElementById("listing"); let listing = document.getElementById('listing');
if (cookie != "true") { if (cookie != 'true') {
document.cookie = "view-list=true"; document.cookie = 'view-list=true';
} else { } else {
document.cookie = "view-list=false"; document.cookie = 'view-list=false';
} }
handleViewType(getCookie("view-list")); handleViewType(getCookie('view-list'));
return false; return false;
} }
var handleViewType = function(viewList) { var handleViewType = function(viewList) {
var listing = document.getElementById("listing"); let listing = document.getElementById('listing');
var button = document.getElementById("view"); let button = document.getElementById('view');
if (viewList == "true") { if (viewList == "true") {
listing.classList.add("list"); listing.classList.add('list');
button.innerHTML = "<i class=\"material-icons\">view_module</i>"; button.innerHTML = '<i class="material-icons">view_module</i>';
return false;
}
button.innerHTML = '<i class="material-icons">view_list</i>';
listing.classList.remove('list');
return false; return false;
}
button.innerHTML = "<i class=\"material-icons\">view_list</i>";
listing.classList.remove("list");
return false;
} }
var getCookie = function(name) { var getCookie = function(name) {
var re = new RegExp("(?:(?:^|.*;\\s*)" + name + "\\s*\\=\\s*([^;]*).*$)|^.*$"); var re = new RegExp("(?:(?:^|.*;\\s*)" + name + "\\s*\\=\\s*([^;]*).*$)|^.*$");
return document.cookie.replace(re, "$1"); return document.cookie.replace(re, "$1");
} }
var changeToLoading = function(element) { var changeToLoading = function(element) {
var originalText = element.innerHTML; var originalText = element.innerHTML;
element.style.opacity = 0; element.style.opacity = 0;
setTimeout(function() { setTimeout(function() {
element.innerHTML = "<i class=\"material-icons spin\">autorenew</i>"; element.innerHTML = '<i class="material-icons spin">autorenew</i>';
element.style.opacity = 1; element.style.opacity = 1;
}, 200); }, 200);
@ -56,29 +60,34 @@ var changeToLoading = function(element) {
var changeToDone = function(element, error, html) { var changeToDone = function(element, error, html) {
element.style.opacity = 0; element.style.opacity = 0;
setTimeout(function() {
let thirdStep = () => {
element.innerHTML = html;
element.style.opacity = 1;
if (selectedItems.length == 0) {
document.sendCostumEvent('changed-selected');
}
}
let secondStep = () => {
element.style.opacity = 0;
setTimeout(thirdStep, 200);
}
let firstStep = () => {
if (error) { if (error) {
element.innerHTML = "<i class=\"material-icons\">close</i>"; element.innerHTML = '<i class="material-icons">close</i>';
} else { } else {
element.innerHTML = "<i class=\"material-icons\">done</i>"; element.innerHTML = '<i class="material-icons">done</i>';
} }
element.style.opacity = 1; element.style.opacity = 1;
setTimeout(function() { setTimeout(secondStep, 1000);
element.style.opacity = 0; }
setTimeout(function() { setTimeout(firstStep, 200);
element.innerHTML = html;
element.style.opacity = 1;
if (selectedItems.length == 0) {
var event = new CustomEvent('changed-selected');
document.dispatchEvent(event);
}
}, 200);
}, 1000);
}, 200);
return false; return false;
} }
@ -105,41 +114,107 @@ var backEvent = function(event) {
} }
var deleteEvent = function(event) { var deleteEvent = function(event) {
if (selectedItems.length) { if (selectedItems.length) {
Array.from(selectedItems).forEach(item => { Array.from(selectedItems).forEach(item => {
var html = changeToLoading(document.getElementById("delete")); let html = changeToLoading(document.getElementById("delete"));
var request = new XMLHttpRequest(); let request = new XMLHttpRequest();
request.open("DELETE", item); request.open("DELETE", item);
request.send(); request.send();
request.onreadystatechange = function() { request.onreadystatechange = function() {
if (request.readyState == 4) { if (request.readyState == 4) {
if (request.status == 200) { if (request.status == 200) {
document.getElementById(item).remove(); document.getElementById(item).remove();
selectedItems.removeElement(item); console.log(selectedItems);
} selectedItems.removeElement(item);
}
changeToDone(document.getElementById("delete"), (request.status != 200), html); changeToDone(document.getElementById("delete"), (request.status != 200), html);
}
} }
});
return false;
}
let request = new XMLHttpRequest();
request.open("DELETE", window.location);
request.send();
request.onreadystatechange = function() {
if (request.readyState == 4) {
if (request.status == 200) {
window.location.pathname = RemoveLastDirectoryPartOf(window.location.pathname);
}
changeToDone(document.getElementById("delete"), (request.status != 200), html);
} }
}); }
return false; return false;
} }
var request = new XMLHttpRequest(); var preventDefault = function(event) {
request.open("DELETE", window.location); event.preventDefault();
request.send(); }
request.onreadystatechange = function() {
if (request.readyState == 4) {
if (request.status == 200) {
window.location.pathname = RemoveLastDirectoryPartOf(window.location.pathname);
}
changeToDone(document.getElementById("delete"), (request.status != 200), html); var renameEvent = function(event) {
} if (selectedItems.length) {
} Array.from(selectedItems).forEach(link => {
let item = document.getElementById(link);
let span = item.getElementsByTagName('span')[0];
let name = span.innerHTML;
return false; item.addEventListener('click', preventDefault);
item.removeEventListener('click', itemClickEvent);
span.setAttribute('contenteditable', 'true');
span.focus();
let keyDownEvent = (event) => {
if (event.keyCode == 13) {
let newName = span.innerHTML;
let html = changeToLoading(document.getElementById('rename'));
let request = new XMLHttpRequest();
request.open('PATCH', link);
request.setRequestHeader('Rename-To', newName);
request.send();
request.onreadystatechange = function() {
if (request.readyState == 4) {
if (request.status != 200) {
span.innerHTML = name;
} else {
span.innerHTML = newName;
}
changeToDone(document.getElementById('rename'), (request.status != 200), html);
}
}
}
if (event.KeyCode == 27) {
span.innerHTML = name;
}
if (event.keyCode == 13 || event.keyCode == 27) {
span.setAttribute('contenteditable', 'false');
span.removeEventListener('keydown', keyDownEvent);
item.removeEventListener('click', preventDefault);
item.addEventListener('click', itemClickEvent);
event.preventDefault();
}
}
span.addEventListener('keydown', keyDownEvent);
span.addEventListener('blur', (event) => {
span.innerHTML = name;
span.setAttribute('contenteditable', 'false');
span.removeEventListener('keydown', keyDownEvent);
item.removeEventListener('click', preventDefault);
});
});
return false;
}
return false;
} }
var downloadEvent = function(event) { var downloadEvent = function(event) {
@ -157,7 +232,7 @@ var downloadEvent = function(event) {
var RemoveLastDirectoryPartOf = function(url) { var RemoveLastDirectoryPartOf = function(url) {
var arr = url.split('/'); var arr = url.split('/');
arr.pop(); arr.pop();
return( arr.join('/') ); return (arr.join('/'));
} }
document.addEventListener("changed-selected", function(event) { document.addEventListener("changed-selected", function(event) {
@ -186,25 +261,27 @@ document.addEventListener("changed-selected", function(event) {
return false; return false;
}); });
var itemClickEvent = function(event) {
var url = this.getElementsByTagName('a')[0].getAttribute('href');
if (selectedItems.length != 0) event.preventDefault();
if (selectedItems.indexOf(url) == -1) {
this.classList.add('selected');
selectedItems.push(url);
} else {
this.classList.remove('selected');
selectedItems.removeElement(url);
}
var event = new CustomEvent('changed-selected');
document.dispatchEvent(event);
return false;
}
document.addEventListener("DOMContentLoaded", function(event) { document.addEventListener("DOMContentLoaded", function(event) {
var items = document.getElementsByClassName('item'); var items = document.getElementsByClassName('item');
Array.from(items).forEach(link => { Array.from(items).forEach(link => {
link.addEventListener('click', function(event) { link.addEventListener('click', itemClickEvent);
var url = link.getElementsByTagName('a')[0].getAttribute('href');
if (selectedItems.length != 0) event.preventDefault();
if (selectedItems.indexOf(url) == -1) {
link.classList.add('selected');
selectedItems.push(url);
} else {
link.classList.remove('selected');
selectedItems.removeElement(url);
}
var event = new CustomEvent('changed-selected');
document.dispatchEvent(event);
return false;
});
}); });
document.getElementById("open").addEventListener("click", openEvent); document.getElementById("open").addEventListener("click", openEvent);
@ -216,6 +293,7 @@ document.addEventListener("DOMContentLoaded", function(event) {
document.getElementById("view").addEventListener("click", viewEvent) document.getElementById("view").addEventListener("click", viewEvent)
}; };
document.getElementById("delete").addEventListener("click", deleteEvent); document.getElementById("delete").addEventListener("click", deleteEvent);
document.getElementById("rename").addEventListener("click", renameEvent);
document.getElementById("download").addEventListener("click", downloadEvent); document.getElementById("download").addEventListener("click", downloadEvent);
/* var drop = document.getElementById("listing"); /* var drop = document.getElementById("listing");

View File

@ -135,8 +135,7 @@ func (fi FileInfo) Rename(w http.ResponseWriter, r *http.Request) (int, error) {
return ErrorToHTTPCode(err), err return ErrorToHTTPCode(err), err
} }
http.Redirect(w, r, strings.Replace(r.URL.Path, fi.Name, newname, 1), http.StatusTemporaryRedirect) return http.StatusOK, nil
return 0, nil
} }
// ServeAsHTML is used to serve single file pages // ServeAsHTML is used to serve single file pages