Merge pull request #161 from mozilla/ui

Hide table header on empty list
This commit is contained in:
Danny Coates 2017-07-05 07:14:47 -07:00 committed by GitHub
commit ccd8c2995e
2 changed files with 35 additions and 22 deletions

View File

@ -13,10 +13,14 @@ $(document).ready(function() {
$('#upload-progress').hide();
$('#share-link').hide();
for (let i = 0; i < localStorage.length; i++) {
const id = localStorage.key(i);
//check if file exists before adding to list
checkExistence(id, true);
if (localStorage.length === 0) {
toggleHeader();
} else {
for (let i = 0; i < localStorage.length; i++) {
const id = localStorage.key(i);
//check if file exists before adding to list
checkExistence(id, true);
}
}
// copy link to clipboard
@ -55,7 +59,7 @@ $(document).ready(function() {
} else {
file = event.target.files[0];
}
const expiration = 2 * 60 * 1000; //will eventually come from a field
const expiration = 24 * 60 * 60 * 1000; //will eventually come from a field
const fileSender = new FileSender(file);
fileSender.on('progress', percentComplete => {
@ -196,6 +200,7 @@ $(document).ready(function() {
FileSender.delete(file.fileId, file.deleteToken).then(() => {
$(e.target).parents('tr').remove();
localStorage.removeItem(file.fileId);
toggleHeader();
});
});
@ -224,5 +229,14 @@ $(document).ready(function() {
function toggleShow() {
$popupText.toggleClass('show');
}
toggleHeader();
}
function toggleHeader() {
//hide table header if empty list
if (document.querySelector('tbody').childNodes.length === 1) {
$('#file-list').hide();
} else {
$('#file-list').show();
}
}
});

View File

@ -36,24 +36,23 @@
</div>
</div>
</div>
</div>
<div id="file-list">
<table id="uploaded-files">
<thead>
<tr>
<!-- htmllint attr-bans="false" -->
<th width="30%">File</th>
<th width="45%">Copy URL</th>
<th width="18%">Expires in</th>
<th width="7%">Delete</th>
<!-- htmllint tag-bans="$previous" -->
</tr>
</thead>
<tbody>
<div id="file-list">
<table id="uploaded-files">
<thead>
<tr>
<!-- htmllint attr-bans="false" -->
<th width="30%">File</th>
<th width="45%">Copy URL</th>
<th width="18%">Expires in</th>
<th width="7%">Delete</th>
<!-- htmllint tag-bans="$previous" -->
</tr>
</thead>
<tbody>
</tbody>
</table>
</tbody>
</table>
</div>
</div>
<div id="upload-progress">