diff options
Diffstat (limited to 'backends/networking/wwwroot')
-rw-r--r-- | backends/networking/wwwroot/.files.html | 60 | ||||
-rw-r--r-- | backends/networking/wwwroot/.filesAJAX.html | 240 | ||||
-rw-r--r-- | backends/networking/wwwroot/.index.html | 18 | ||||
-rw-r--r-- | backends/networking/wwwroot/ajax.js | 48 | ||||
-rw-r--r-- | backends/networking/wwwroot/favicon.ico | bin | 0 -> 94081 bytes | |||
-rw-r--r-- | backends/networking/wwwroot/icons/7z.png | bin | 0 -> 166 bytes | |||
-rw-r--r-- | backends/networking/wwwroot/icons/dir.png | bin | 0 -> 150 bytes | |||
-rw-r--r-- | backends/networking/wwwroot/icons/txt.png | bin | 0 -> 156 bytes | |||
-rw-r--r-- | backends/networking/wwwroot/icons/unk.png | bin | 0 -> 142 bytes | |||
-rw-r--r-- | backends/networking/wwwroot/icons/up.png | bin | 0 -> 161 bytes | |||
-rw-r--r-- | backends/networking/wwwroot/icons/zip.png | bin | 0 -> 183 bytes | |||
-rw-r--r-- | backends/networking/wwwroot/logo.png | bin | 0 -> 132967 bytes | |||
-rw-r--r-- | backends/networking/wwwroot/style.css | 113 |
13 files changed, 479 insertions, 0 deletions
diff --git a/backends/networking/wwwroot/.files.html b/backends/networking/wwwroot/.files.html new file mode 100644 index 0000000000..f05c0113f8 --- /dev/null +++ b/backends/networking/wwwroot/.files.html @@ -0,0 +1,60 @@ +<!doctype html> +<html> + <head> + <title>ScummVM</title> + <meta charset="utf-8"/> + <link rel="stylesheet" type="text/css" href="style.css"/> + </head> + <body> + <div class="container"> + <div class='header'> + <center><img src="logo.png"/></center> + </div> + <div class="controls"> + <table class="buttons"><tr> + <td><a href="javascript:show('create_directory');">{create_directory_button}</a></td> + <td><a href="javascript:show('upload_file');">{upload_files_button}</a></td> + </tr></table> + <div id="create_directory" class="modal"> + <p>{create_directory_desc}</p> + <form action="create"> + <input type="hidden" name="path" value="{path}"/> + <input type="text" name="directory_name" value=""/> + <input type="submit" value="{create_directory_button}"/> + </form> + </div> + <div id="upload_file" class="modal"> + <p>{upload_file_desc}</p> + <form action="upload?path={path}" method="post" enctype="multipart/form-data"> + <!-- we don't need "[]" in the name, as our webserver is not using PHP --> + <!-- "allowdirs" is a proposal, not implemented yet --> + <input type="file" name="upload_file-f" allowdirs multiple/> + <br/><br/> + <p>{or_upload_directory_desc}</p> + <!-- "directory"/"webkitdirectory" works in Chrome only yet, "multiple" is just in case here --> + <input type="file" name="upload_file-d" directory webkitdirectory multiple/> + <input type="submit" value="{upload_file_button}"/> + </form> + </div> + </div> + <div class="content"> + <table class="files_list"> + <td></td><td><b class="directory_name">{index_of_directory}</b></td><td></td> + {content} + </table> + </div> + </div> + <script> + function show(id) { + var e = document.getElementById(id); + var visible = (e.style.display == "block"); + if (visible) id = ""; //hide + + e = document.getElementById("create_directory"); + e.style.display = (e.id == id ? "block" : "none"); + e = document.getElementById("upload_file"); + e.style.display = (e.id == id ? "block" : "none"); + } + </script> + </body> +</html>
\ No newline at end of file diff --git a/backends/networking/wwwroot/.filesAJAX.html b/backends/networking/wwwroot/.filesAJAX.html new file mode 100644 index 0000000000..d45c73069d --- /dev/null +++ b/backends/networking/wwwroot/.filesAJAX.html @@ -0,0 +1,240 @@ +<!doctype html> +<html> + <head> + <title>ScummVM</title> + <meta charset="utf-8"/> + <link rel="stylesheet" type="text/css" href="style.css"/> + </head> + <body> + <div class="container"> + <div class='header'> + <center><img src="logo.png"/></center> + </div> + <div class="controls"> + <table class="buttons"><tr> + <td><a href="javascript:show('create_directory');">{create_directory_button}</a></td> + <td><a href="javascript:show('upload_file');">{upload_files_button}</a></td> + </tr></table> + <div id="create_directory" class="modal"> + <p>{create_directory_desc}</p> + <form action="create" id="create_directory_form" onsubmit="return createDirectory();"> + <input type="hidden" name="path" value="{path}"/> + <input type="hidden" name="ajax" value="true"/> + <input type="text" name="directory_name" value=""/> + <input type="submit" value="{create_directory_button}"/> + </form> + </div> + <div id="upload_file" class="modal"> + <p>{upload_file_desc}</p> + <form action="upload?path={path}&ajax=true" method="post" enctype="multipart/form-data" id="files_upload_form"> + <!-- we don't need "[]" in the name, as our webserver is not using PHP --> + <!-- "allowdirs" is a proposal, not implemented yet --> + <input type="file" name="upload_file-f" allowdirs multiple/> + <br/><br/> + <p>{or_upload_directory_desc}</p> + <!-- "directory"/"webkitdirectory" works in Chrome only yet, "multiple" is just in case here --> + <input type="file" name="upload_file-d" directory webkitdirectory multiple/> + <input type="submit" value="{upload_file_button}"/> + </form> + </div> + </div> + <div class="content"> + <div id="loading_message">{loading}</div> + <div id="error_message">{error}</div> + <table class="files_list" id="files_list"> + </table> + </div> + </div> + <script> + function show(id) { + var e = document.getElementById(id); + var visible = (e.style.display == "block"); + if (visible) id = ""; //hide + + e = document.getElementById("create_directory"); + e.style.display = (e.id == id ? "block" : "none"); + e = document.getElementById("upload_file"); + e.style.display = (e.id == id ? "block" : "none"); + } + </script> + <script src="ajax.js"></script> + <script> + window.onload = function () { + showDirectory("{start_path}"); + } + + function showDirectory(path) { + if (isLoading) return; + showLoading(); + ajax.getAndParseJson("./list", {"path": path}, getCallback(path)); + } + + function getCallback(path) { + return function (jsonResponse) { + if (jsonResponse.type == "error") { + showError(); + return; + } + + openDirectory(path, jsonResponse.items); + hideLoading(); + }; + } + + function createDirectory() { + if (isLoading) return; + showLoading(); + + var data = {"answer_json": "true"}; + var elements = document.getElementById("create_directory_form").elements; + for (var el in elements) + data[elements[el].name] = elements[el].value; + + ajax.getAndParseJson("./create", data, getCreateDirectoryCallback(data["path"])); + show("create_directory"); + return false; // invalidate form, so it won't submit + } + + function getCreateDirectoryCallback(path) { + return function (jsonResponse) { + console.log(jsonResponse); + + if (jsonResponse.type == "error") { + showError(); + return; + } + + hideLoading(); + showDirectory(path); + }; + } + + var isLoading = false; + + function showLoading() { + isLoading = true; + var e = document.getElementById("loading_message"); + e.style.display = "block"; + e = document.getElementById("error_message"); + e.style.display = "none"; + } + + function showError() { + isLoading = false; + var e = document.getElementById("loading_message"); + e.style.display = "none"; + e = document.getElementById("error_message"); + e.style.display = "block"; + //TODO: pass the actual message there? + } + + function hideLoading() { + isLoading = false; + var e = document.getElementById("loading_message"); + e.style.display = "none"; + e = document.getElementById("error_message"); + e.style.display = "none"; + } + + function openDirectory(path, items) { + // update path + document.getElementById("create_directory_form").elements["path"].value = path; + document.getElementById("files_upload_form").action = "upload?path=" + path + "&ajax=true"; + + // update table contents + listDirectory(path, items); + } + + function makeBreadcrumb(name, path) { + var a = createElementWithContents("a", name); + a.onclick = function () { showDirectory(path); }; + a.href = "javascript:void(0);"; + return a; + } + + function makeBreadcrumbs(path) { + var b = document.createElement("b"); + b.className = "directory_name"; + + b.appendChild(createElementWithContents("span", "{index_of}")); + var slashes = true; + var crumb = ""; + var currentPath = ""; + path += ' '; //so the last slash is added + for (var i=0; i<path.length; ++i) { + if (path[i] == '/' || path[i] == '\\') { + if (!slashes) { + currentPath += crumb; + b.appendChild(makeBreadcrumb(crumb, currentPath+'/')); + slashes = true; + } + } else { + if (slashes) { + currentPath += "/"; + if (currentPath == "/") { //make special '/' crumb here + b.appendChild(makeBreadcrumb('/', '/')); + } else { + b.appendChild(createElementWithContents("span", "/")); + } + slashes = false; + crumb = ""; + } + crumb += path[i]; + } + } + return b; + } + + function listDirectory(path, items) { + // cleanup the list + var files_list = document.getElementById("files_list"); + while (files_list.hasChildNodes()) + files_list.removeChild(files_list.firstChild); + var tbody = document.createElement("tbody"); + + // add header item + var tr = document.createElement("tr"); + tr.appendChild(createElementWithContents("td", "")); + var td = document.createElement("td"); + td.appendChild(makeBreadcrumbs(path)); + tr.appendChild(td); + tr.appendChild(createElementWithContents("td", "")); + tbody.appendChild(tr); + + // add items + for (var i in items) + addItem(tbody, items[i]); + + files_list.appendChild(tbody); + } + + function addItem(tbody, item) { + var tr = document.createElement("tr"); + var td = document.createElement("td"); + var img = document.createElement("img"); + img.src = "./icons/" + item.icon; + td.appendChild(img); + tr.appendChild(td); + + td = document.createElement("td"); + var a = createElementWithContents("a", item.name); + if (item.isDirectory) { + a.onclick = function () { showDirectory(item.path); }; + a.href = "javascript:void(0);"; + } else + a.href = "./download?path=" + encodeURIComponent(item.path); + td.appendChild(a); + tr.appendChild(td); + + tr.appendChild(createElementWithContents("td", "")); + tbody.appendChild(tr); + } + + function createElementWithContents(type, innerHTML) { + var e = document.createElement(type); + e.innerHTML = innerHTML; + return e; + } + </script> + </body> +</html>
\ No newline at end of file diff --git a/backends/networking/wwwroot/.index.html b/backends/networking/wwwroot/.index.html new file mode 100644 index 0000000000..2a3d9d382d --- /dev/null +++ b/backends/networking/wwwroot/.index.html @@ -0,0 +1,18 @@ +<!doctype html> +<html> + <head> + <title>ScummVM</title> + <meta charset="utf-8"/> + <link rel="stylesheet" type="text/css" href="style.css"/> + </head> + <body> + <div class="container"> + <div class='header'> + <center><img src="logo.png"/></center> + </div> + <div class="content"> + <p>{message}</p> + </div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/backends/networking/wwwroot/ajax.js b/backends/networking/wwwroot/ajax.js new file mode 100644 index 0000000000..c01d7e93fc --- /dev/null +++ b/backends/networking/wwwroot/ajax.js @@ -0,0 +1,48 @@ +// the following is snippet from http://stackoverflow.com/a/18078705 +// I changed a few things though + +var ajax = {}; +ajax.x = function () { return new XMLHttpRequest(); }; // "no one uses IE6" + +ajax.send = function (url, callback, errorCallback, method, data, async) { + if (async === undefined) async = true; + + var x = ajax.x(); + x.open(method, url, async); + x.onreadystatechange = function () { + if (x.readyState == XMLHttpRequest.DONE) { + if (x.status == 200) + callback(x.responseText); + else + errorCallback(x); + } + }; + if (method == 'POST') { + x.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); + } + x.send(data) +}; + +ajax.get = function (url, data, callback, errorCallback, async) { + var query = []; + for (var key in data) { + query.push(encodeURIComponent(key) + '=' + encodeURIComponent(data[key])); + } + ajax.send(url + (query.length ? '?' + query.join('&') : ''), callback, errorCallback, 'GET', null, async) +}; + +ajax.post = function (url, data, callback, errorCallback, async) { + var query = []; + for (var key in data) { + query.push(encodeURIComponent(key) + '=' + encodeURIComponent(data[key])); + } + ajax.send(url, callback, errorCallback, 'POST', query.join('&'), async) +}; + +ajax.getAndParseJson = function (url, data, callback) { + ajax.get( + url, data, + function (responseText) { callback(JSON.parse(responseText)); }, + function (x) { console.log("error: " + x.status); } + ); +};
\ No newline at end of file diff --git a/backends/networking/wwwroot/favicon.ico b/backends/networking/wwwroot/favicon.ico Binary files differnew file mode 100644 index 0000000000..0283e8432e --- /dev/null +++ b/backends/networking/wwwroot/favicon.ico diff --git a/backends/networking/wwwroot/icons/7z.png b/backends/networking/wwwroot/icons/7z.png Binary files differnew file mode 100644 index 0000000000..656e7e7c62 --- /dev/null +++ b/backends/networking/wwwroot/icons/7z.png diff --git a/backends/networking/wwwroot/icons/dir.png b/backends/networking/wwwroot/icons/dir.png Binary files differnew file mode 100644 index 0000000000..bcdec04a57 --- /dev/null +++ b/backends/networking/wwwroot/icons/dir.png diff --git a/backends/networking/wwwroot/icons/txt.png b/backends/networking/wwwroot/icons/txt.png Binary files differnew file mode 100644 index 0000000000..023d2ee24a --- /dev/null +++ b/backends/networking/wwwroot/icons/txt.png diff --git a/backends/networking/wwwroot/icons/unk.png b/backends/networking/wwwroot/icons/unk.png Binary files differnew file mode 100644 index 0000000000..346eebecc3 --- /dev/null +++ b/backends/networking/wwwroot/icons/unk.png diff --git a/backends/networking/wwwroot/icons/up.png b/backends/networking/wwwroot/icons/up.png Binary files differnew file mode 100644 index 0000000000..2dc3df022b --- /dev/null +++ b/backends/networking/wwwroot/icons/up.png diff --git a/backends/networking/wwwroot/icons/zip.png b/backends/networking/wwwroot/icons/zip.png Binary files differnew file mode 100644 index 0000000000..cdfc5763dd --- /dev/null +++ b/backends/networking/wwwroot/icons/zip.png diff --git a/backends/networking/wwwroot/logo.png b/backends/networking/wwwroot/logo.png Binary files differnew file mode 100644 index 0000000000..9fdd2d0d1e --- /dev/null +++ b/backends/networking/wwwroot/logo.png diff --git a/backends/networking/wwwroot/style.css b/backends/networking/wwwroot/style.css new file mode 100644 index 0000000000..ba31587c4d --- /dev/null +++ b/backends/networking/wwwroot/style.css @@ -0,0 +1,113 @@ +html { + background: rgb(212, 117, 11); + background: linear-gradient(to bottom, rgb(212, 117, 11) 0%, rgb(212, 117, 11) 36%, rgb(239, 196, 24) 100%); + min-height: 100vh; +} + +.container { + width: 80%; + margin: 0 auto; +} + +.header { + padding: 10pt; + margin-bottom: 0; +} + +.content { + padding: 8pt; + background: rgb(251, 241, 206); + font-family: Tahoma; + font-size: 16pt; +} + +.content p { margin: 0 0 6pt 0; } + +.controls { + padding: 8pt; + background: #FFF; + font-family: Tahoma; + font-size: 16pt; +} + +.controls .buttons { + width: 100%; + max-width: 500pt; + margin: -8pt auto; + border: 0; + border-spacing: 0; +} + +.controls .buttons td { + width: 50%; + text-align: center; + margin: 0; + padding: 0; +} + +.controls .buttons a { + display: block; + height: 40pt; + line-height: 38pt; + vertical-align: middle; + color: #000; + text-decoration: none; +} + +.controls .buttons a:hover { + background: #F3F3F3; +} + +.modal { + margin-top: 10pt; + display: none; +} + +.modal p { margin: 0 0 6pt 0; } + +#create_directory input[type="text"], #upload_file input[type="file"] { + width: calc(100% - 2 * 5pt); +} + +.modal input { + border: 1px solid #EEE; + padding: 5pt; + font-size: 12pt; +} + +.modal input[type="submit"] { + display: block; + margin: 6pt auto; + background: #DDD; + border: 0; +} + +.modal input[type="submit"]:hover { + background: #F3F3F3; + cursor: pointer; +} + +td img { vertical-align: middle; height: 20px; } + +.directory_name { + display: block; + padding-bottom: 6px; +} + +.directory_name a { color: black; } +.directory_name a:hover { color: blue; } + +#loading_message, #error_message { + margin: -8pt; + margin-bottom: 5pt; + padding: 4pt; + text-align: center; +} + +#loading_message { + background: #99FF99; +} + +#error_message { + background: #FF9999; +} |