Skip to content

Instantly share code, notes, and snippets.

@andersonFaro9
Created October 27, 2023 11:08
Show Gist options
  • Save andersonFaro9/c6932a725aaf53897716a2ead9a03303 to your computer and use it in GitHub Desktop.
Save andersonFaro9/c6932a725aaf53897716a2ead9a03303 to your computer and use it in GitHub Desktop.
// app.js
import Clock from './deps/clock.js';
import View from './views.js';
const view = new View();
const clock = new Clock()
let took = ''
view.configureOnFileChange (file=> {
clock.start((time) => {
took = time;
view.updateElapsedTime(`Proceed started ${time}`)
})
setTimeout(()=> {
clock.stop()
view.updateElapsedTime(`Process took ${took.replace('ago', '')}`)
}, 5000)
})
// view.js
export default class View {
#fileUpload = document.getElementById('fileUpload')
#btnUploadVideo = document.getElementById('btnUploadVideos')
#fileSize = document.getElementById('fileSize')
#fileInfo = document.getElementById('fileInfo')
#txtfileName = document.getElementById('fileName')
#fileUploadWrapper = document.getElementById('fileUploadWrapper')
#elapsed = document.getElementById('elapsed')
#canvas = document.getElementById('preview-144p')
constructor() {
this.configureBtnUpUploadClick()
}
parseBytesIntoMBAndGB(bytes) {
const mb = bytes / (1024 * 1024)
// if mb is greater than 1024, then convert to GB
if (mb > 1024) {
// rount to 2 decimal places
return `${Math.round(mb / 1024)}GB`
}
return `${Math.round(mb)}MB`
}
configureBtnUpUploadClick() {
this.#btnUploadVideo.addEventListener('click', () => {
// trigger file input
this.#fileUpload.click()
})
}
onChange(fn) {
return (e) => {
const file = e.target.files[0]
const { name, size } = file
fn(file)
this.#txtfileName.innerText = name
this.#fileSize.innerText = this.parseBytesIntoMBAndGB(size)
this.#fileInfo.classList.remove('hide')
this.#fileUploadWrapper.classList.add('hide')
}
}
updateElapsedTime(text) {
this.#elapsed.innerText = text
}
configureOnFileChange(fn) {
fileUpload.addEventListener('change', this.onChange(fn))
}
}
@rodovalhog
Copy link

linha 75
configureOnFileChange(fn) {
fileUpload.addEventListener('change', this.onChange(fn))
}
trocar fileUpload para this.#fileUpload

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment