shift setup multi uploads

This commit is contained in:
Pierre Dubouilh
2018-09-21 15:48:53 +02:00
parent c78d70c438
commit ba252e5f8d
3 changed files with 52 additions and 64 deletions
+8 -16
View File
@@ -34,6 +34,7 @@ var initPath = ""
var css = `css_will_be_here` // js will be embedded here var css = `css_will_be_here` // js will be embedded here
var jsTag = `js_will_be_here` // id. var jsTag = `js_will_be_here` // id.
var units = [8]string{"k", "M", "G", "T", "P", "E", "Z", "Y"} var units = [8]string{"k", "M", "G", "T", "P", "E", "Z", "Y"}
var icon = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwBAMAAAClLOS0AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAHlBMVEUAAAAAAACAgIDAwMD///8AAIAAAP8A//+AgAD//wACp+eHAAAAAXRSTlMAQObYZgAAAAFiS0dEBI9o2VEAAAAHdElNRQfiBhoALCQijt0NAAAAuElEQVQ4y92TQRKCMAxF0w4HCC5c18oJxAMwDEfAK+g52OkN9LYqbTRJ6Uyd0Y1vU+DlT0kJAAED+oJAtYKqTAJUiqkwmUAoxiVhMoFnOS4LkwZ8YBVXR89tK9hvSGyl6EnYQeJJNDLQlgjPaLioGSMX6+ObQnH6nvh88z8RB4YQYhaKvnlGeA3Ndq3Rw/6qVNjdz8X5wcTunY0vfxlu14k6cRa6Kh7RLOi8ugrQxK5mQS0i+4FVz3dvYZO5KVb6VAAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAxOC0wNi0yNlQwMDo0NDozNi0wNDowMNQdHpQAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMTgtMDYtMjZUMDA6NDQ6MzYtMDQ6MDClQKYoAAAAAElFTkSuQmCC"
type rpcCall struct { type rpcCall struct {
Call string `json:"call"` Call string `json:"call"`
@@ -95,16 +96,16 @@ func replyList(w http.ResponseWriter, path string) {
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<title>` + html.EscapeString(path) + `</title> <title>` + html.EscapeString(path) + `</title>
<link href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwBAMAAAClLOS0AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAHlBMVEUAAAAAAACAgIDAwMD///8AAIAAAP8A//+AgAD//wACp+eHAAAAAXRSTlMAQObYZgAAAAFiS0dEBI9o2VEAAAAHdElNRQfiBhoALCQijt0NAAAAuElEQVQ4y92TQRKCMAxF0w4HCC5c18oJxAMwDEfAK+g52OkN9LYqbTRJ6Uyd0Y1vU+DlT0kJAAED+oJAtYKqTAJUiqkwmUAoxiVhMoFnOS4LkwZ8YBVXR89tK9hvSGyl6EnYQeJJNDLQlgjPaLioGSMX6+ObQnH6nvh88z8RB4YQYhaKvnlGeA3Ndq3Rw/6qVNjdz8X5wcTunY0vfxlu14k6cRa6Kh7RLOi8ugrQxK5mQS0i+4FVz3dvYZO5KVb6VAAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAxOC0wNi0yNlQwMDo0NDozNi0wNDowMNQdHpQAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMTgtMDYtMjZUMDA6NDQ6MzYtMDQ6MDClQKYoAAAAAElFTkSuQmCC" rel="icon" type="image/png"/> <link href="` + icon + `" rel="icon" type="image/png"/>
<script>window.onload = function(){` + jsTag + `}</script> <script>window.onload = function(){` + jsTag + `}</script>
<style type="text/css">` + css + `</style> <style type="text/css">` + css + `</style>
</head> </head>
<body> <body>
<div id="drop-grid"> Drop here to upload </div>
<h1>.` + html.EscapeString(path) + `</h1>
<div class="icHolder"><div style="display:none;" class="ic icon-large-images" onclick="window.picsToggle()"></div> <div class="icHolder"><div style="display:none;" class="ic icon-large-images" onclick="window.picsToggle()"></div>
<div class="ic icon-large-folder" onclick="window.mkdirBtn()"></div>` + extraFolder("/hols/aaa") + `</div> <div class="ic icon-large-folder" onclick="window.mkdirBtn()"></div>` + extraFolder("/hols/aaa") + `</div>
<div id="pics" style="display:none;"> <div onclick="window.picsToggle()" id="picsToggleCinema"></div> <img onclick="window.picsNav()" id="picsHolder"/> <span id="picsLabel"></span> </div> <div id="pics" style="display:none;"> <div onclick="window.picsToggle()" id="picsToggleCinema"></div> <img onclick="window.picsNav()" id="picsHolder"/> <span id="picsLabel"></span> </div>
<div id="drop-grid"> Drop here to upload </div>
<h1>.` + html.EscapeString(path) + `</h1>
<table>` <table>`
_files, err := ioutil.ReadDir(initPath + path) _files, err := ioutil.ReadDir(initPath + path)
@@ -132,23 +133,14 @@ func replyList(w http.ResponseWriter, path string) {
} }
} }
var resp = head + dirs + files + `</table> w.Write([]byte(head + dirs + files + `</table>
<div id="progressBars"></div> <br><address><a href="https://github.com/pldubouilh/gossa">Gossa 🎶</a></address>
<div id="progress" style="display:none;"><span id="dlBarName"></span><div id="dlBarPc">1%</div></div>
<br><address><a href="https://github.com/pldubouilh/gossa">Gossa 🎶</a></address> </body></html>`))
</body></html>`
w.Write([]byte(resp))
} }
func doContent(w http.ResponseWriter, r *http.Request) { func doContent(w http.ResponseWriter, r *http.Request) {
path := html.UnescapeString(r.URL.Path) path := html.UnescapeString(r.URL.Path)
if strings.Contains(path, "/favicon.ico") {
w.Write([]byte(" "))
return
}
fullPath, errPath := checkPath(path) fullPath, errPath := checkPath(path)
stat, errStat := os.Stat(fullPath) stat, errStat := os.Stat(fullPath)
+33 -37
View File
@@ -12,7 +12,6 @@ function rpcFs (call, args, cb) {
// Prefix path with pwd if not absolute // Prefix path with pwd if not absolute
const decodedPath = decodeURI(location.pathname) const decodedPath = decodeURI(location.pathname)
args = args.map(a => a.startsWith('/') ? a : decodedPath + a) args = args.map(a => a.startsWith('/') ? a : decodedPath + a)
// args = args.map(a => encodeURIComponent(a))
console.log('RPC', call, args) console.log('RPC', call, args)
const xhr = new window.XMLHttpRequest() const xhr = new window.XMLHttpRequest()
@@ -44,25 +43,6 @@ function warning (e) {
return 'Leaving will interrupt transfer\nAre you sure you want to leave?' return 'Leaving will interrupt transfer\nAre you sure you want to leave?'
} }
// File upload
function newBar (name) {
const id = Math.random().toString(36).substring(7)
document.getElementById('progressBars').innerHTML += '\
<div id="' + id + '" class="barBackground">\
<span> ' + name.split('/').pop() + ' <span>\
<div class="barForeground">1%</div>\
</div>'
return id
}
function updatePercent (id, percent) {
const el = document.getElementById(id).querySelectorAll('div.barForeground')[0]
const width = Math.floor(100 * percent).toString() + '%'
el.innerText = width
el.style.width = width
}
function shouldRefresh () { function shouldRefresh () {
totalDone += 1 totalDone += 1
if (totalUploads === totalDone) { if (totalUploads === totalDone) {
@@ -70,33 +50,52 @@ function shouldRefresh () {
console.log('Done uploading ' + totalDone + ' files') console.log('Done uploading ' + totalDone + ' files')
totalDone = 0 totalDone = 0
totalUploads = 0 totalUploads = 0
document.getElementById('progressBars').innerHTML = '' totalUploadsSize = 0
totalUploadedSize = []
barDiv.style.display = 'none'
refresh() refresh()
} }
} }
const checkDupes = test => allA.find(a => a.innerText.replace('/', '') === test) const checkDupes = test => allA.find(a => a.innerText.replace('/', '') === test)
const barName = document.getElementById('dlBarName')
const barPc = document.getElementById('dlBarPc')
const barDiv = document.getElementById('progress')
let totalDone = 0
let totalUploads = 0
let totalUploadsSize = 0
let totalUploadedSize = []
function updatePercent (ev) {
totalUploadedSize[ev.target.id] = ev.loaded
const ttlDone = totalUploadedSize.reduce((s, x) => s + x)
const pc = Math.floor(100 * ttlDone / totalUploadsSize) + '%'
barPc.innerText = pc
barPc.style.width = pc
}
function postFile (file, path) { function postFile (file, path) {
totalUploads += 1 path = decodeURI(location.pathname).slice(0, -1) + path
window.onbeforeunload = warning window.onbeforeunload = warning
const xhr = new window.XMLHttpRequest() barDiv.style.display = 'block'
path = decodeURI(location.pathname).slice(0, -1) + path totalUploads += 1
totalUploadsSize += file.size
xhr.open('POST', location.origin + '/post') barName.innerText = totalUploads > 1 ? totalUploads + ' files' : file.name
xhr.setRequestHeader('gossa-path', encodeURIComponent(path))
xhr.upload.id = newBar(path)
const formData = new window.FormData() const formData = new window.FormData()
formData.append(file.name, file) formData.append(file.name, file)
xhr.upload.addEventListener('progress', a => { const xhr = new window.XMLHttpRequest()
updatePercent(a.target.id, a.loaded / a.total) xhr.open('POST', location.origin + '/post')
}) xhr.setRequestHeader('gossa-path', encodeURIComponent(path))
xhr.upload.addEventListener('load', shouldRefresh) xhr.upload.addEventListener('load', shouldRefresh)
xhr.upload.addEventListener('progress', updatePercent)
xhr.upload.id = totalUploads
xhr.send(formData) xhr.send(formData)
} }
@@ -190,9 +189,6 @@ document.ondrop = (e) => {
return false return false
} }
let totalUploads = 0
let totalDone = 0
const getArrowSelected = () => document.querySelectorAll('i.arrow-selected')[0] const getArrowSelected = () => document.querySelectorAll('i.arrow-selected')[0]
function getASelected () { function getASelected () {
@@ -218,7 +214,7 @@ function restoreCursorPos () {
if (!a) { if (!a) {
if (allA[0].innerText === '../') { if (allA[0].innerText === '../') {
a = allA[1] a = allA[1] || allA[0]
} else { } else {
a = allA[0] a = allA[0]
} }
+11 -11
View File
@@ -34,12 +34,16 @@ td.display-name {
width: 100%; width: 100%;
} }
h1 {
display: inline-block;
margin-top: 10px;
}
.icHolder { .icHolder {
position: fixed; display: inline-block;
right: 20px; right: 15px;
top: 20px; top: 25px;
position: absolute;
} }
.ic { .ic {
@@ -69,7 +73,7 @@ td.display-name {
zoom: 1 !important; zoom: 1 !important;
} }
#progressBars { #progress {
background-color: white; background-color: white;
width: 99%; width: 99%;
left: 0.5%; left: 0.5%;
@@ -80,18 +84,14 @@ td.display-name {
max-height: 50%; max-height: 50%;
overflow-y: scroll; overflow-y: scroll;
overflow-x: hidden; overflow-x: hidden;
}
#progressBars::-webkit-scrollbar {
display: none;
} }
.barBackground { #dlBarName {
width: 100%; width: 100%;
margin-top: 15px; margin-top: 15px;
} }
.barForeground { #dlBarPc {
width: 1%; width: 1%;
height: 30px; height: 30px;
text-align: center; text-align: center;