72 lines
1.9 KiB
TypeScript
72 lines
1.9 KiB
TypeScript
import m from "mithril"
|
|
import {BaseView} from "./base"
|
|
|
|
export enum ModalType {
|
|
'MESSAGE',
|
|
'ERROR'
|
|
}
|
|
|
|
export interface iModalView {
|
|
title: string
|
|
subtitle: string
|
|
topposition: string
|
|
width: string
|
|
type: ModalType
|
|
}
|
|
export class ModalView extends BaseView implements iModalView{
|
|
title:string
|
|
subtitle:string
|
|
topposition:string
|
|
width:string
|
|
type:ModalType
|
|
|
|
constructor (vnode) {
|
|
super()
|
|
this.title = super.getattr(vnode, "title", "Modal")
|
|
this.subtitle = super.getattr(vnode, "subtitle", "")
|
|
this.topposition = super.getattr(vnode, "topposition", "10%")
|
|
this.width = super.getattr(vnode, "width", 'max-content')
|
|
this.type = super.getattr(vnode, 'type', ModalType.MESSAGE)
|
|
}
|
|
view (vnode) {
|
|
return m("div.w3-modal", {style: {display:'block'}},
|
|
m("div.w3-modal-content.w3-card-4", {style: {width: this.width, top: this.topposition}},
|
|
[
|
|
m(modalHeader, {type: this.type},
|
|
[
|
|
m(title, this.title),
|
|
(this.subtitle ? m(subtitle, this.subtitle) : null)
|
|
]
|
|
),
|
|
m(modalContent, vnode.children)
|
|
]
|
|
)
|
|
)
|
|
}
|
|
}
|
|
|
|
const title = {
|
|
view: (vnode) => {
|
|
return m("h1", vnode.children)
|
|
}
|
|
}
|
|
const subtitle = {
|
|
view: (vnode) => {
|
|
return m("h3", vnode.children)
|
|
}
|
|
}
|
|
const modalHeader = {
|
|
view: (vnode) => {
|
|
let color = ".w3-theme"
|
|
if (vnode.attrs["type"] == ModalType.ERROR) {
|
|
color = ".w3-red"
|
|
}
|
|
return m("header.w3-container" + color, vnode.children)
|
|
}
|
|
}
|
|
const modalContent = {
|
|
view: (vnode) => {
|
|
return m("div.w3-container.w3-theme-l1", vnode.children)
|
|
}
|
|
}
|