A photo manager for VRChat.
phaz.uk
1import { createEffect, createSignal, Setter } from "solid-js";
2
3export class ConfirmationBoxManager{
4 private _confirmationBoxCallback = () => {};
5 private _setConfirmationBoxText: Setter<string>
6
7 constructor(){
8 let [ confirmationBoxText, setConfirmationBoxText ] = createSignal('');
9 this._setConfirmationBoxText = setConfirmationBoxText;
10
11 let confirmationBox: HTMLElement;
12
13 document.body.appendChild(<div class="confirmation-box" ref={( el ) => confirmationBox = el}>
14 <div class="confirmation-box-container">
15 { confirmationBoxText() }<br /><br />
16
17 <div class="button-danger" onClick={() => { this._confirmationBoxCallback(); setConfirmationBoxText('') }}>Confirm</div>
18 <div class="button" onClick={() => setConfirmationBoxText('') }>Deny</div>
19 </div>
20 </div> as HTMLElement);
21
22 createEffect(() => {
23 if(confirmationBoxText() !== ''){
24 confirmationBox.style.display = 'block';
25
26 setTimeout(() => {
27 confirmationBox.style.opacity = '1';
28 }, 1);
29 } else{
30 confirmationBox.style.opacity = '0';
31
32 setTimeout(() => {
33 confirmationBox.style.display = 'none';
34 }, 250);
35 }
36 })
37 }
38
39 public SetConfirmationBox( text: string, cb: () => void ){
40 this._setConfirmationBoxText(text);
41 this._confirmationBoxCallback = cb;
42 }
43}