Improve frontend and add "How to use" (#3)
This commit is contained in:
parent
8252be8fed
commit
96cd7b18f6
17
front.php
17
front.php
@ -8,11 +8,26 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class=dragndrop ondrop="upload_file(event);" ondragover="return false" >
|
||||
<h1>File Transfer</h1>
|
||||
<div id=dragzone class=dragndrop ondrop="upload_file(event);" ondragover="return false" ondragenter="change_color_ondrag('ondragenter');" ondragleave="change_color_ondrag('ondragleave');" >
|
||||
Drag and Drop your file or <input type="button" value="Select File" onclick="file_explorer();">
|
||||
<input type="file" id="uploadfile" hidden>
|
||||
<br><br><br><br>
|
||||
<div id=divresponse></div><button id=copytoclipboard style="visibility: hidden;" onclick="copytoclipboard();">Copy to clipboard</button>
|
||||
</div>
|
||||
<div class=infobox>
|
||||
This tool is usable with <b>curl</b> or <b>wget</b>.<br><br>
|
||||
|
||||
To upload : <br>
|
||||
<li> curl --upload-file ./hello.txt <?php print(_HTTP_PROTO . '://' . _HTTP_DOMAIN . _HTTP_PATH . 'index.php');?><br>
|
||||
<li> wget -q --body-file='./hello.txt' --method=PUT -O - <?php print(_HTTP_PROTO . '://' . _HTTP_DOMAIN . _HTTP_PATH . 'index.php');?><br><br>
|
||||
|
||||
To download file :<br>
|
||||
<li> curl -o hello.txt <?php print(_HTTP_PROTO . '://' . _HTTP_DOMAIN . _HTTP_PATH . _DATA_DIR . '/99999/file');?><br>
|
||||
<li> wget -O hello.txt <?php print(_HTTP_PROTO . '://' . _HTTP_DOMAIN . _HTTP_PATH . _DATA_DIR . '/99999/file');?>
|
||||
|
||||
</div>
|
||||
<div class=footer>
|
||||
File transfer was created by <a href="https://twitter.com/AmazingBeu">@AmazingBeu</a>. You can find sources <a href="https://git.virtit.fr/VirtIT/web-ft">here</a>.
|
||||
</div>
|
||||
</body>
|
||||
|
@ -46,7 +46,7 @@
|
||||
// Informations for user
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'GET')
|
||||
{
|
||||
if (stristr($_SERVER["HTTP_USER_AGENT"], 'curl'))
|
||||
if (stristr($_SERVER["HTTP_USER_AGENT"], 'curl') or stristr($_SERVER["HTTP_USER_AGENT"], 'Wget'))
|
||||
{
|
||||
print("To upload file, use # curl --upload-file my_file " . _HTTP_PROTO . '://' . _HTTP_DOMAIN . _HTTP_PATH . "index.php\n");
|
||||
}
|
||||
|
19
script.js
19
script.js
@ -1,6 +1,7 @@
|
||||
var fileobj;
|
||||
function upload_file(e)
|
||||
{
|
||||
console.log("droped")
|
||||
e.preventDefault();
|
||||
fileobj = e.dataTransfer.files[0];
|
||||
ajax_file_upload(fileobj);
|
||||
@ -8,7 +9,7 @@ function upload_file(e)
|
||||
|
||||
function file_explorer() {
|
||||
document.getElementById('uploadfile').click();
|
||||
document.getElementById('uploadfile').onchange = function()
|
||||
document.getElementById('uploadfile').onchange = function()
|
||||
{
|
||||
fileobj = document.getElementById('uploadfile').files[0];
|
||||
ajax_file_upload(fileobj);
|
||||
@ -45,3 +46,19 @@ function ajax_file_upload(file_obj)
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
function change_color_ondrag(event)
|
||||
{
|
||||
if (event === "ondragenter")
|
||||
{
|
||||
var element = document.getElementById('dragzone');
|
||||
element.classList.add("dragover");
|
||||
}
|
||||
else if (event === "ondragleave")
|
||||
{
|
||||
var element = document.getElementById('dragzone');
|
||||
element.classList.remove("dragover");
|
||||
}
|
||||
}
|
||||
|
||||
|
31
style.css
31
style.css
@ -9,7 +9,8 @@ html {
|
||||
|
||||
.dragndrop {
|
||||
margin: 20%;
|
||||
margin-top: 10%;
|
||||
margin-top: 5%;
|
||||
margin-bottom: 3%;
|
||||
background-color: #a3a3a3;
|
||||
padding: 1px;
|
||||
padding-top: 5%;
|
||||
@ -20,8 +21,30 @@ html {
|
||||
border-radius: 20px;
|
||||
|
||||
}
|
||||
.dragndrop:hover {
|
||||
|
||||
.dragover {
|
||||
background-color: #888888;
|
||||
}
|
||||
.dragndrop:hover {
|
||||
background-color: #888888;
|
||||
}
|
||||
|
||||
}
|
||||
.infobox {
|
||||
text-align: left;
|
||||
background: #eeeeee;
|
||||
margin-left: 20%;
|
||||
margin-right:20%;
|
||||
height: 20%;
|
||||
border-radius: 20px;
|
||||
border: 4px solid #a3a3a3;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: fixed;
|
||||
padding: 1%;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background-color: #eeeeee;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user