OpenServer/SecureNotes
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

witching to UIKit 3

Browse Source
This commit is contained in:
Fabian
2019-04-30 12:22:09 -04:00
parent 8b6c71247f
commit 595f2be1fb
26 changed files with 774 additions and 499 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/modals/Modal.tsx
View File

@ -13,6 +13,7 @@ export default abstract class Modal<T> {
// Private
private onResult: (result: T | null) => void;
private closeOnResult: boolean;
private noClose: boolean = false;
// Protected
protected result(value: T | null) {
@ -25,9 +26,10 @@ export default abstract class Modal<T> {
//Public
/**
* This function shows the modal
* Do not cell when using getResult()
* Do not call when using getResult()
*/
public async show() {
public show(noClose = true) {
this.noClose = noClose;
Modal.modalObservableServer.send({ modal: this, close: false });
}
@ -38,7 +40,7 @@ export default abstract class Modal<T> {
*/
public async getResult(close = true) {
this.closeOnResult = close;
this.show();
this.show(false);
return new Promise<T | null>((yes) => this.onResult = yes);
}
@ -50,17 +52,11 @@ export default abstract class Modal<T> {
public static BaseModal = class BaseModal<T> extends Component<{ modal: Modal<T> }, {}> {
render() {
return <div class="modal_container" onClick={(evt) => {
return <div class="modal-container" onClick={(evt) => {
let path = evt.composedPath();
if (!path.find(e => {
let res = false;
let s = (e as Element);
if (s) {
if (s.classList) {
res = s.classList.contains("card")
}
}
return res;
return s.id === "ModalContent";
})) {
this.props.modal.result(null)
}
@ -69,12 +65,15 @@ export default abstract class Modal<T> {
this.props.modal.result(null)
}
}}>
<div class="card" >
<div class="section" style="display:flex;justify-content:space-between;">
<div id="ModalContent" class="uk-card uk-card-body uk-card-body" >
<div class="modal-title uk-card-title" style="">
<h3>{this.props.modal.title}</h3>
<h3>
<CloseIcon onClick={() => this.props.modal.result(null)} width={undefined} height={undefined} style="height:calc(1rem * var(--heading-ratio) * var(--heading-ratio))" />
</h3>
{/* <div> */}
{!this.props.modal.noClose ?
<CloseIcon onClick={() => this.props.modal.result(null)} width={undefined} height={undefined} />
: undefined
}
{/* </div> */}
</div>
{this.props.children}
</div>