summaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorRoland Stigge <stigge@antcom.de>2018-01-07 22:00:50 +0100
committerRoland Stigge <stigge@antcom.de>2018-01-07 22:00:50 +0100
commitab42bc98c5b84d36ae4d8e77ea59128781120b86 (patch)
tree896188db8dedb0c2cb88aaf11c94143a1591bcdc
parentae248732206b6b04dd476cef03f08c427c333b14 (diff)
Separate menu, don't select ".."
-rw-r--r--TODO2
-rw-r--r--html/index.html31
-rw-r--r--html/webbox.css39
-rw-r--r--html/webbox.js27
4 files changed, 83 insertions, 16 deletions
diff --git a/TODO b/TODO
index 5dac9ce..7d69bdb 100644
--- a/TODO
+++ b/TODO
@@ -1,9 +1,7 @@
Prio 1 (for next version)
======
-Icons: menu, refresh, file, directory
debian/
-handle spaces/umlauts
Prio 2 (for future versions)
======
diff --git a/html/index.html b/html/index.html
index 49dafef..db60e7a 100644
--- a/html/index.html
+++ b/html/index.html
@@ -8,19 +8,17 @@
</head>
<body onload="initMainpage();">
<div>
- <h1 class="title">&nbsp;</h1>
+ <table>
+ <tr>
+ <td class="title">&nbsp;</td>
+ <td class="menusymbol" onclick="showMenu();"><img src="menu.png"/></td>
+ </tr>
+ </table>
<input id="uploadfile" type="file" onchange="onUploadFile();" hidden/>
<table class="menu">
<tr>
<td class="firsttd"></td>
- <td class="entry" onclick="createDir();">New folder</td>
- <td class="entry" onclick="download();">Download</td>
- <td class="entry" onclick="upload();">Upload</td>
- <td class="entry" onclick="deleteItems();">Delete</td>
- <td class="entry" onclick="move();">Move</td>
- <td class="entry" onclick="info();">Info</td>
- <td class="entry" onclick="selectAll();">Select All</td>
- <td class="entry" onclick="refresh();">Refresh</td>
+ <td class="entry" onclick="refresh();"><img src="refresh-inverted.png"/></td>
</tr>
</table>
</div>
@@ -40,6 +38,18 @@
<button class="button rightbutton" id="okbutton">OK</button>
</div>
+ <div class="menuwindow" id="menuwindow" hidden>
+ <table class="menudialog">
+ <tr><td class="entry" onclick="hideMenu(); createDir();">New Folder</td></tr>
+ <tr><td class="entry" onclick="hideMenu(); download();">Download</td></tr>
+ <tr><td class="entry" onclick="hideMenu(); upload();">Upload</td></tr>
+ <tr><td class="entry" onclick="hideMenu(); deleteItems();">Delete</td></tr>
+ <tr><td class="entry" onclick="hideMenu(); move();">Move</td></tr>
+ <tr><td class="entry" onclick="hideMenu(); info();">Info</td></tr>
+ <tr><td class="entry" onclick="hideMenu(); selectAll();">Select/Unselect All</td></tr>
+ </table>
+ </div>
+
<div id="create-dir-dialog" hidden>
New folder:<br>
<input type="text" id="newdir" class="textinput"></input>
@@ -58,10 +68,11 @@
<div id="movefiles"></div>
</div>
- <a download="webbox-download.zip" id="download-a" hidden/>
+ <a download="webbox-download.zip" id="download-a" hidden></a>
<div class="footer">
</div>
+
</body>
</html>
diff --git a/html/webbox.css b/html/webbox.css
index 39551e0..46f46ec 100644
--- a/html/webbox.css
+++ b/html/webbox.css
@@ -4,6 +4,7 @@ div, td, h1 {
.title {
font-size: 16pt;
+ width: 100%;
}
.greyout {
@@ -37,6 +38,27 @@ div, td, h1 {
bottom: 20px;
}
+.menuwindow {
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ width: 400px;
+ height: 400px;
+ margin-top: -200px;
+ margin-left: -200px;
+ background-color: #FFFFFF;
+ opacity: 1;
+ z-index: 10;
+ border-width: 3px;
+ border-style: solid;
+ border-color: #808080;
+ padding: 10pt;
+}
+
+.menusymbol {
+ cursor: pointer;
+}
+
.dialogwindow {
position: fixed;
top: 50%;
@@ -54,8 +76,21 @@ div, td, h1 {
padding: 10pt;
}
+table.menudialog {
+ width: 100%;
+}
+
+table.menudialog td.entry {
+ cursor: pointer;
+ width: 100%;
+ border-width: 0;
+ border-bottom-width: 1px;
+ border-style: solid;
+ border-color: #808080;
+ padding: 10px;
+}
+
.dialog {
- /*width: 100%;*/
}
.textinput {
@@ -78,7 +113,6 @@ div.footer {
}
table.menu {
- width: 100%;
border: 0; /* 1px solid #000000; */
border-collapse: collapse;
margin: 0;
@@ -102,7 +136,6 @@ table.menu td.firsttd {
}
table.menu td.entry {
- width: 60px;
border: 0; /* 1px solid #000000; */
color: #FFFFFF;
background-color: #404070;
diff --git a/html/webbox.js b/html/webbox.js
index 58b04fb..52e8563 100644
--- a/html/webbox.js
+++ b/html/webbox.js
@@ -22,6 +22,13 @@ function loadContents(dir) {
} else {
for (var i = 0; i < listElements.length; i++) {
var type = listElements[i].getAttribute("type");
+ if (type == "file") {
+ type = "<img src=\"file.png\"/>";
+ } else if (type == "dir") {
+ type = "<img src=\"directory.png\"/>";
+ } else {
+ type = "";
+ }
result += "<tr " +
"onmousedown=\"entryMouseDown('" + listElements[i].childNodes[0].nodeValue + "')\" " +
@@ -123,6 +130,10 @@ function clearSelection(filename) {
}
function setSelection(filename) {
+ if (filename == "..") { // don't select ".."
+ return;
+ }
+
var row = getRow(filename);
if (!row.classList.contains("selectedrow")) {
@@ -132,6 +143,10 @@ function setSelection(filename) {
}
function toggleSelection(filename) {
+ if (filename == "..") { // don't select ".."
+ return;
+ }
+
var row = getRow(filename);
if (row.classList.contains("selectedrow")) {
@@ -207,6 +222,16 @@ function hideDialog() {
document.getElementById("dialogwindow").style.display = 'none';
}
+function showMenu() {
+ document.getElementById("greyout").style.display = 'block';
+ document.getElementById("menuwindow").style.display = 'block';
+}
+
+function hideMenu() {
+ document.getElementById("greyout").style.display = 'none';
+ document.getElementById("menuwindow").style.display = 'none';
+}
+
function initMainpage() {
setCurrentDir("/");
@@ -525,7 +550,7 @@ function selectAll() {
var allSelected = true;
for (var i = 0; i < files.length; i++) {
- if (getSelection(files[i]) == false) {
+ if (getSelection(files[i]) == false && files[i] != "..") {
allSelected = false;
}
}