81 lines
2.1 KiB
JavaScript
81 lines
2.1 KiB
JavaScript
|
import { SFrame, _ } from "../../main.js";
|
||
|
import { fadein, fadeout, subCancel } from "../../utils.js";
|
||
|
|
||
|
const call = async (stear, { find, resolve, render, call, event }, { text, autoFill = "" }) => {
|
||
|
event.onloaded = () => {
|
||
|
fadein(find.main, 200, true);
|
||
|
console.log(find);
|
||
|
find.input._.focus();
|
||
|
}
|
||
|
event.onresolve = async () => await fadeout(find.main);
|
||
|
|
||
|
const cancel = subCancel(() => {
|
||
|
resolve(false);
|
||
|
});
|
||
|
|
||
|
return _({
|
||
|
find: "main",
|
||
|
class: "stear_prompt",
|
||
|
style: {
|
||
|
position: "fixed",
|
||
|
left: "0",
|
||
|
top: "0",
|
||
|
height: "100%",
|
||
|
width: "100%",
|
||
|
backgroundColor: "rgba(0,0,0,0.5)"
|
||
|
}
|
||
|
}, _({
|
||
|
style: {
|
||
|
left: "50%",
|
||
|
top: "50%",
|
||
|
transform: "translate(-50%, -50%)",
|
||
|
padding: "1rem",
|
||
|
paddingTop: "0",
|
||
|
position: "absolute",
|
||
|
backgroundColor: "#eee",
|
||
|
minHeight: "4rem",
|
||
|
minWidth: "8rem",
|
||
|
borderRadius: "1rem",
|
||
|
textAlign: "center",
|
||
|
display: "grid",
|
||
|
gridGap: "0.5rem"
|
||
|
}
|
||
|
}, [
|
||
|
_({ type: "p", style: { gridRow: "1", gridColumn: "1/3", marginBottom: "0" } }, text),
|
||
|
_({
|
||
|
type: "input",
|
||
|
find: "input",
|
||
|
attr: { type: "text" },
|
||
|
event: {
|
||
|
keydown: (e) => {
|
||
|
if(e.code=="Enter")find.btn._.click();
|
||
|
}
|
||
|
},
|
||
|
style: {
|
||
|
borderRadius: "0.5rem",
|
||
|
height: "1rem",
|
||
|
border: "2px solid",
|
||
|
borderRadius: "0.5rem",
|
||
|
gridRow: "2",
|
||
|
}
|
||
|
}, autoFill),
|
||
|
_({
|
||
|
type: "button",
|
||
|
find: "btn",
|
||
|
event: {
|
||
|
click: () => {
|
||
|
resolve(find.input._.value);
|
||
|
cancel();
|
||
|
}
|
||
|
},
|
||
|
style: {
|
||
|
borderRadius: "0.5rem",
|
||
|
gridRow: "2",
|
||
|
}
|
||
|
}, "OK"),
|
||
|
]));
|
||
|
};
|
||
|
|
||
|
export default new SFrame({
|
||
|
preRender: true, call
|
||
|
});
|