add cancel buttons

This commit is contained in:
Emily 2018-07-31 15:19:18 -07:00
parent c9ae76b209
commit 4c64593262
9 changed files with 72 additions and 31 deletions

View file

@ -13,6 +13,7 @@ module.exports = function(state, emit) {
const optionClass = state.uploading ? 'uploadOptions--faded' : '';
const btnUploading = state.uploading ? 'btn--stripes' : '';
const cancelVisible = state.uploading ? '' : 'noDisplay';
const faded = files.length > 0 ? 'uploadArea--faded' : '';
const selectFileClass = files.length > 0 ? 'btn--hidden' : '';
const sendFileClass = files.length > 0 ? '' : 'btn--hidden';
@ -81,6 +82,11 @@ module.exports = function(state, emit) {
${btnText}
</button>
<button class="btn--cancel uploadCancel ${cancelVisible}"
onclick=${cancel}>
${state.translate('uploadingPageCancel')}
</button>
</div>
`;
@ -102,6 +108,14 @@ module.exports = function(state, emit) {
event.target.classList.remove('inputFile--focused');
}
function cancel(event) {
if (state.uploading) {
emit('cancel');
const cancelBtn = document.querySelector('.uploadCancel');
cancelBtn.innerHTML = state.translate('uploadCancelNotification');
}
}
async function addFiles(event) {
event.preventDefault();
const target = event.target;