Skip to content

Commit

Permalink
Update UI
Browse files Browse the repository at this point in the history
  • Loading branch information
beavailable committed Mar 22, 2022
1 parent 980034e commit 9babbf5
Showing 1 changed file with 21 additions and 10 deletions.
31 changes: 21 additions & 10 deletions share.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -342,7 +342,8 @@ def build_html(self, path, dirs, files):
builder.append('.container{height: 100%; display: flex; flex-direction: column; padding: 0 8px; overflow-wrap: break-word;}')
builder.append('.header{display: flex; justify-content: space-between; padding: 8px 0; font-size: x-large;}')
builder.append('hr{width: 100%;}')
builder.append('.main{flex: auto; display: flex; flex-direction: column; padding: 16px 0;}')
builder.append('.main{flex: auto; padding: 16px 0;}')
builder.append('.content{width: 100%; height: 100%;}')
builder.append('.list-item{display: flex; justify-content: space-between; padding: 2px 0; word-break: break-all;}')
builder.append('.list-item:nth-child(even){background-color: #f8f8f8;}')
builder.append('.item-left{display: flex}')
Expand All @@ -355,7 +356,8 @@ def build_html(self, path, dirs, files):
builder.append('a:hover{color: #ff5500;}')
if self._upload:
builder.append('.upload{background-color: #76797b; border-color: #76797b; color: white; border-radius: 16px;}')
builder.append('.upload:hover, .dragging{background-color: #565e64; border-color: #565e64;}')
builder.append('.upload:hover{background-color: #565e64; border-color: #565e64;}')
builder.append('.dragging{border: 4px dashed #cccccc; border-radius: 4px;}')
builder.append('button{cursor: pointer; border: 1px solid #cccccc; color: #333333; background-color: white; border-radius: 4px;}')
builder.append('button:hover{background-color: #e6e6e6;}')
builder.append('button:disabled{opacity: .65; pointer-events: none; user-select: none;}')
Expand All @@ -381,19 +383,25 @@ def build_html(self, path, dirs, files):
builder.append(' document.getElementById("upload").setAttribute("disabled", "");')
builder.append(' document.getElementById("form").submit();')
builder.append('}')
builder.append('let drag_counter = 0;')
builder.append('function on_dragenter(e){')
builder.append(' e.preventDefault();')
builder.append(' drag_counter++;')
builder.append(' e.currentTarget.classList.add("dragging");')
builder.append('}')
builder.append('function on_dragover(e){')
builder.append(' e.preventDefault();')
builder.append('}')
builder.append('function on_dragleave(e){')
builder.append(' e.preventDefault();')
builder.append(' e.currentTarget.classList.remove("dragging");')
builder.append(' drag_counter--;')
builder.append(' if (drag_counter === 0) {')
builder.append(' e.currentTarget.classList.remove("dragging");')
builder.append(' }')
builder.append('}')
builder.append('function on_drop(e){')
builder.append(' e.preventDefault();')
builder.append(' drag_counter = 0;')
builder.append(' e.currentTarget.classList.remove("dragging");')
builder.append(' if (e.dataTransfer.files.length == 0) {return;}')
builder.append(' document.getElementById("file").files = e.dataTransfer.files;')
Expand All @@ -407,10 +415,11 @@ def build_html(self, path, dirs, files):
if self._upload:
builder.append('let upload = document.getElementById("upload");')
builder.append('upload.onclick = on_upload_click;')
builder.append('upload.ondragenter = on_dragenter;')
builder.append('upload.ondragover = on_dragover;')
builder.append('upload.ondragleave = on_dragleave;')
builder.append('upload.ondrop = on_drop;')
builder.append('let content = document.getElementById("content");')
builder.append('content.ondragenter = on_dragenter;')
builder.append('content.ondragover = on_dragover;')
builder.append('content.ondragleave = on_dragleave;')
builder.append('content.ondrop = on_drop;')
builder.append('let file = document.getElementById("file");')
builder.append('file.onchange = on_upload;')
builder.append('}')
Expand All @@ -436,7 +445,8 @@ def build_html(self, path, dirs, files):
builder.append('</div>')
builder.append('<hr>')
builder.append('<div class="main">')
builder.append('<ul id="content">')
builder.append('<div id="content" class="content">')
builder.append('<ul>')
for d, hidden, items in dirs:
builder.append('<li class="list-item">')
builder.append(f'<a class="item-left{" hidden" if hidden else ""}" href="{html.escape(parse.quote(d))}/">')
Expand All @@ -460,6 +470,7 @@ def build_html(self, path, dirs, files):
builder.append('</ul>')
builder.append('</div>')
builder.append('</div>')
builder.append('</div>')
builder.end_body()
return builder.build()

Expand Down Expand Up @@ -689,10 +700,10 @@ def build_html(self):
builder.end_title()
builder.start_style()
builder.append('.container{height: 80%; padding: 0 8px; display: flex; align-items: center; justify-content: center;}')
builder.append('.upload{width: 100%; height: 60%; border: 2px dashed #cccccc; border-radius: 8px; cursor: pointer; background-color: white; color: #333333; font-size: x-large;}')
builder.append('.upload{width: 100%; height: 60%; border: 1px solid #cccccc; border-radius: 16px; cursor: pointer; background-color: white; color: #333333; font-size: x-large;}')
builder.append('.upload:hover{background-color: #e6e6e6;}')
builder.append('.upload:disabled{opacity: .65; pointer-events: none; user-select: none;}')
builder.append('.dragging{background-color: #cccccc;}')
builder.append('.dragging{border: 4px dashed #cccccc;}')
builder.end_style()
builder.start_script()
builder.append('function on_upload_click(){')
Expand Down

0 comments on commit 9babbf5

Please sign in to comment.