nfp_sites/nfp_moe/app/widgets/fileupload.js
2022-08-02 08:00:57 +00:00

64 lines
1.5 KiB
JavaScript

const FileUpload = {
fileChanged: function(vnode, event) {
if (!event.target.files[0]) return
let preview = null
if (event.target.files[0].type.startsWith('image')) {
preview = URL.createObjectURL(event.target.files[0])
}
if (this.preview) {
this.preview.clear()
}
let out = {
file: event.target.files[0],
preview: preview,
clear: function() {
URL.revokeObjectURL(preview)
}
}
this.preview = out
vnode.attrs.onfile(out)
},
oninit: function(vnode) {
this.loading = false
this.preview = null
},
view: function(vnode) {
let media = vnode.attrs.media
return m('fileupload', {
class: vnode.attrs.class || null,
}, [
this.preview || media
? vnode.attrs.useimg
? [ m('img', { src: this.preview && this.preview.preview || media }), m('div.showicon')]
: m('a.display.inside', {
href: this.preview && this.preview.preview || media,
style: {
'background-image': 'url("' + (this.preview && this.preview.preview || media) + '")',
},
}, m('div.showicon'))
: m('div.inside.showbordericon')
,
m('input', {
accept: 'image/*',
type: 'file',
onchange: this.fileChanged.bind(this, vnode),
}),
media && vnode.attrs.ondelete
? m('button.remove', { onclick: vnode.attrs.ondelete })
: null,
this.loading
? m('div.loading-spinner')
: null,
])
},
}
module.exports = FileUpload