screen-setup
Version:
Setup screens position from saved profiles
515 lines (509 loc) • 32.3 kB
JavaScript
;
(() => {
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __commonJS = (cb, mod) => function __require() {
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
// node_modules/.pnpm/dom-proxy@2.3.0/node_modules/dom-proxy/core.js
var require_core = __commonJS({
"node_modules/.pnpm/dom-proxy@2.3.0/node_modules/dom-proxy/core.js"(exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.appendChild = exports.createSVGElement = exports.createHTMLElement = exports.genCreateSVGElement = exports.genCreateHTMLElement = exports.createProxy = exports.watch = exports.createText = exports.fragment = exports.svg = exports.s = exports.html = exports.h = exports.text = exports.t = void 0;
function fragment2(nodes) {
const fragment3 = document.createDocumentFragment();
for (const node of nodes) {
appendChild(fragment3, node);
}
return fragment3;
}
exports.fragment = fragment2;
function createText(value = "") {
const node = document.createTextNode(value);
return createProxy(node);
}
exports.createText = createText;
exports.t = createText;
exports.text = createText;
var watchFn;
var watchOptions;
function watch(fn, options) {
watchFn = fn;
watchOptions = options;
fn();
watchFn = void 0;
watchOptions = void 0;
}
exports.watch = watch;
var resetTimer = null;
var resetFns = /* @__PURE__ */ new Set();
function resetTimeout() {
for (let fn of resetFns) {
try {
fn();
} catch (error) {
console.error(error);
}
}
resetFns.clear();
resetTimer = null;
}
var proxySymbol = Symbol("proxy");
function toPropertyKey(p2) {
return p2 === "value" || p2 === "valueAsNumber" || p2 === "valueAsDate" ? "value" : p2;
}
function createProxy(node) {
if (proxySymbol in node) {
return node[proxySymbol];
}
const deps = /* @__PURE__ */ new Map();
const proxy = new Proxy(node, {
get(target, p2, receiver) {
var _a, _b;
const listenEventType = (_a = watchOptions === null || watchOptions === void 0 ? void 0 : watchOptions.listen) !== null && _a !== void 0 ? _a : "input";
if (listenEventType && watchFn && typeof p2 === "string") {
const key = toPropertyKey(p2);
const fn = watchFn;
if (key === "value" || key === "checked") {
target.addEventListener(
listenEventType,
// wrap the function to avoid the default behavior be cancelled
// if the inline-function returns false
() => fn()
);
(_b = target.form) === null || _b === void 0 ? void 0 : _b.addEventListener("reset", () => {
resetFns.add(fn);
if (resetTimer)
return;
resetTimer = setTimeout(resetTimeout);
});
}
let fns = deps.get(key);
if (!fns) {
fns = /* @__PURE__ */ new Set();
deps.set(key, fns);
}
fns.add(fn);
}
const value = target[p2];
if (typeof value === "function") {
return value.bind(target);
}
return value;
},
set(target, p2, value, receiver) {
target[p2] = value;
if (typeof p2 === "string") {
const key = toPropertyKey(p2);
const fns = deps.get(key);
if (fns) {
for (const fn of fns) {
fn();
}
}
}
return true;
}
});
return node[proxySymbol] = Object.assign(proxy, { node });
}
exports.createProxy = createProxy;
function genCreateHTMLElement(tagName) {
return (props_or_children, children) => Array.isArray(props_or_children) ? createHTMLElement(tagName, void 0, props_or_children) : createHTMLElement(tagName, props_or_children, children);
}
exports.genCreateHTMLElement = genCreateHTMLElement;
function genCreateSVGElement(tagName) {
return (props_or_children, children) => Array.isArray(props_or_children) ? createSVGElement(tagName, void 0, props_or_children) : createSVGElement(tagName, props_or_children, children);
}
exports.genCreateSVGElement = genCreateSVGElement;
function createHTMLElement(tagName, props, children) {
const node = document.createElement(tagName);
applyAttrs(node, props, children);
return createProxy(node);
}
exports.createHTMLElement = createHTMLElement;
exports.h = createHTMLElement;
exports.html = createHTMLElement;
function createSVGElement(tagName, props, children) {
const node = document.createElementNS("http://www.w3.org/2000/svg", tagName);
applyAttrs(node, props, children);
return createProxy(node);
}
exports.createSVGElement = createSVGElement;
exports.s = createSVGElement;
exports.svg = createSVGElement;
function applyAttrs(node, props, children) {
if (props) {
for (let p2 in props) {
let value = props[p2];
if (value !== null && typeof value === "object" && p2 in node) {
Object.assign(node[p2], value);
} else {
;
node[p2] = value;
}
}
}
if (children) {
for (const child of children) {
appendChild(node, child);
}
}
if (node instanceof HTMLSelectElement && children && children.length > 0 && props && "value" in props) {
node.value = props.value;
}
}
function appendChild(parent, child) {
if (typeof child == "string") {
parent.appendChild(document.createTextNode(child));
} else if (typeof child == "number") {
parent.appendChild(document.createTextNode(String(child)));
} else if ("node" in child) {
parent.appendChild(child.node);
} else {
parent.appendChild(child);
}
}
exports.appendChild = appendChild;
}
});
// node_modules/.pnpm/dom-proxy@2.3.0/node_modules/dom-proxy/helpers.js
var require_helpers = __commonJS({
"node_modules/.pnpm/dom-proxy@2.3.0/node_modules/dom-proxy/helpers.js"(exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.hr = exports.hgroup = exports.header = exports.head = exports.h6 = exports.h5 = exports.h4 = exports.h3 = exports.h2 = exports.h1 = exports.form = exports.footer = exports.figure = exports.figcaption = exports.embed = exports.em = exports.dt = exports.dl = exports.div = exports.dialog = exports.dfn = exports.details = exports.del = exports.dd = exports.datalist = exports.data = exports.colgroup = exports.col = exports.code = exports.cite = exports.caption = exports.canvas = exports.button = exports.br = exports.body = exports.blockquote = exports.bdo = exports.bdi = exports.base = exports.b = exports.audio = exports.aside = exports.article = exports.area = exports.address = exports.abbr = exports.a = exports.createElementFunctions = exports.createSVGElementFunctions = exports.createHTMLElementFunctions = void 0;
exports.template = exports.td = exports.tbody = exports.table = exports.sup = exports.summary = exports.sub = exports.styleElement = exports.strong = exports.span = exports.source = exports.small = exports.slot = exports.select = exports.section = exports.scriptElement = exports.samp = exports.sElement = exports.ruby = exports.rt = exports.rp = exports.q = exports.progress = exports.pre = exports.picture = exports.p = exports.output = exports.option = exports.optgroup = exports.ol = exports.object = exports.noscript = exports.nav = exports.meter = exports.meta = exports.menu = exports.mark = exports.map = exports.main = exports.link = exports.li = exports.legend = exports.label = exports.kbd = exports.ins = exports.input = exports.img = exports.iframe = exports.i = exports.htmlElement = void 0;
exports.g = exports.foreignObject = exports.filter = exports.feTurbulence = exports.feTile = exports.feSpotLight = exports.feSpecularLighting = exports.fePointLight = exports.feOffset = exports.feMorphology = exports.feMergeNode = exports.feMerge = exports.feImage = exports.feGaussianBlur = exports.feFuncR = exports.feFuncG = exports.feFuncB = exports.feFuncA = exports.feFlood = exports.feDropShadow = exports.feDistantLight = exports.feDisplacementMap = exports.feDiffuseLighting = exports.feConvolveMatrix = exports.feComposite = exports.feComponentTransfer = exports.feColorMatrix = exports.feBlend = exports.ellipse = exports.desc = exports.defs = exports.clipPath = exports.circle = exports.animateTransform = exports.animateMotion = exports.animate = exports.aSVG = exports.wbr = exports.video = exports.varElement = exports.ul = exports.u = exports.track = exports.tr = exports.titleElement = exports.time = exports.thead = exports.th = exports.tfoot = exports.textarea = void 0;
exports.view = exports.use = exports.tspan = exports.titleSVG = exports.textPath = exports.textSVG = exports.symbol = exports.switchSVG = exports.svgSVG = exports.styleSVG = exports.stop = exports.set = exports.scriptSVG = exports.rect = exports.radialGradient = exports.polyline = exports.polygon = exports.pattern = exports.path = exports.mpath = exports.metadata = exports.mask = exports.marker = exports.linearGradient = exports.line = exports.image = void 0;
var core_1 = require_core();
exports.createHTMLElementFunctions = new Proxy({}, {
get(target, p2, receiver) {
return (0, core_1.genCreateHTMLElement)(p2);
}
});
exports.createSVGElementFunctions = new Proxy({}, {
get(target, p2, receiver) {
return (0, core_1.genCreateSVGElement)(p2);
}
});
exports.createElementFunctions = {
html: exports.createHTMLElementFunctions,
svg: exports.createSVGElementFunctions
};
exports.a = exports.createHTMLElementFunctions.a, exports.abbr = exports.createHTMLElementFunctions.abbr, exports.address = exports.createHTMLElementFunctions.address, exports.area = exports.createHTMLElementFunctions.area, exports.article = exports.createHTMLElementFunctions.article, exports.aside = exports.createHTMLElementFunctions.aside, exports.audio = exports.createHTMLElementFunctions.audio, exports.b = exports.createHTMLElementFunctions.b, exports.base = exports.createHTMLElementFunctions.base, exports.bdi = exports.createHTMLElementFunctions.bdi, exports.bdo = exports.createHTMLElementFunctions.bdo, exports.blockquote = exports.createHTMLElementFunctions.blockquote, exports.body = exports.createHTMLElementFunctions.body, exports.br = exports.createHTMLElementFunctions.br, exports.button = exports.createHTMLElementFunctions.button, exports.canvas = exports.createHTMLElementFunctions.canvas, exports.caption = exports.createHTMLElementFunctions.caption, exports.cite = exports.createHTMLElementFunctions.cite, exports.code = exports.createHTMLElementFunctions.code, exports.col = exports.createHTMLElementFunctions.col, exports.colgroup = exports.createHTMLElementFunctions.colgroup, exports.data = exports.createHTMLElementFunctions.data, exports.datalist = exports.createHTMLElementFunctions.datalist, exports.dd = exports.createHTMLElementFunctions.dd, exports.del = exports.createHTMLElementFunctions.del, exports.details = exports.createHTMLElementFunctions.details, exports.dfn = exports.createHTMLElementFunctions.dfn, exports.dialog = exports.createHTMLElementFunctions.dialog, exports.div = exports.createHTMLElementFunctions.div, exports.dl = exports.createHTMLElementFunctions.dl, exports.dt = exports.createHTMLElementFunctions.dt, exports.em = exports.createHTMLElementFunctions.em, exports.embed = exports.createHTMLElementFunctions.embed, exports.figcaption = exports.createHTMLElementFunctions.figcaption, exports.figure = exports.createHTMLElementFunctions.figure, exports.footer = exports.createHTMLElementFunctions.footer, exports.form = exports.createHTMLElementFunctions.form, exports.h1 = exports.createHTMLElementFunctions.h1, exports.h2 = exports.createHTMLElementFunctions.h2, exports.h3 = exports.createHTMLElementFunctions.h3, exports.h4 = exports.createHTMLElementFunctions.h4, exports.h5 = exports.createHTMLElementFunctions.h5, exports.h6 = exports.createHTMLElementFunctions.h6, exports.head = exports.createHTMLElementFunctions.head, exports.header = exports.createHTMLElementFunctions.header, exports.hgroup = exports.createHTMLElementFunctions.hgroup, exports.hr = exports.createHTMLElementFunctions.hr, exports.htmlElement = exports.createHTMLElementFunctions.html, exports.i = exports.createHTMLElementFunctions.i, exports.iframe = exports.createHTMLElementFunctions.iframe, exports.img = exports.createHTMLElementFunctions.img, exports.input = exports.createHTMLElementFunctions.input, exports.ins = exports.createHTMLElementFunctions.ins, exports.kbd = exports.createHTMLElementFunctions.kbd, exports.label = exports.createHTMLElementFunctions.label, exports.legend = exports.createHTMLElementFunctions.legend, exports.li = exports.createHTMLElementFunctions.li, exports.link = exports.createHTMLElementFunctions.link, exports.main = exports.createHTMLElementFunctions.main, exports.map = exports.createHTMLElementFunctions.map, exports.mark = exports.createHTMLElementFunctions.mark, exports.menu = exports.createHTMLElementFunctions.menu, exports.meta = exports.createHTMLElementFunctions.meta, exports.meter = exports.createHTMLElementFunctions.meter, exports.nav = exports.createHTMLElementFunctions.nav, exports.noscript = exports.createHTMLElementFunctions.noscript, exports.object = exports.createHTMLElementFunctions.object, exports.ol = exports.createHTMLElementFunctions.ol, exports.optgroup = exports.createHTMLElementFunctions.optgroup, exports.option = exports.createHTMLElementFunctions.option, exports.output = exports.createHTMLElementFunctions.output, exports.p = exports.createHTMLElementFunctions.p, exports.picture = exports.createHTMLElementFunctions.picture, exports.pre = exports.createHTMLElementFunctions.pre, exports.progress = exports.createHTMLElementFunctions.progress, exports.q = exports.createHTMLElementFunctions.q, exports.rp = exports.createHTMLElementFunctions.rp, exports.rt = exports.createHTMLElementFunctions.rt, exports.ruby = exports.createHTMLElementFunctions.ruby, exports.sElement = exports.createHTMLElementFunctions.s, exports.samp = exports.createHTMLElementFunctions.samp, exports.scriptElement = exports.createHTMLElementFunctions.script, exports.section = exports.createHTMLElementFunctions.section, exports.select = exports.createHTMLElementFunctions.select, exports.slot = exports.createHTMLElementFunctions.slot, exports.small = exports.createHTMLElementFunctions.small, exports.source = exports.createHTMLElementFunctions.source, exports.span = exports.createHTMLElementFunctions.span, exports.strong = exports.createHTMLElementFunctions.strong, exports.styleElement = exports.createHTMLElementFunctions.style, exports.sub = exports.createHTMLElementFunctions.sub, exports.summary = exports.createHTMLElementFunctions.summary, exports.sup = exports.createHTMLElementFunctions.sup, exports.table = exports.createHTMLElementFunctions.table, exports.tbody = exports.createHTMLElementFunctions.tbody, exports.td = exports.createHTMLElementFunctions.td, exports.template = exports.createHTMLElementFunctions.template, exports.textarea = exports.createHTMLElementFunctions.textarea, exports.tfoot = exports.createHTMLElementFunctions.tfoot, exports.th = exports.createHTMLElementFunctions.th, exports.thead = exports.createHTMLElementFunctions.thead, exports.time = exports.createHTMLElementFunctions.time, exports.titleElement = exports.createHTMLElementFunctions.title, exports.tr = exports.createHTMLElementFunctions.tr, exports.track = exports.createHTMLElementFunctions.track, exports.u = exports.createHTMLElementFunctions.u, exports.ul = exports.createHTMLElementFunctions.ul, exports.varElement = exports.createHTMLElementFunctions.var, exports.video = exports.createHTMLElementFunctions.video, exports.wbr = exports.createHTMLElementFunctions.wbr;
exports.aSVG = exports.createSVGElementFunctions.a, exports.animate = exports.createSVGElementFunctions.animate, exports.animateMotion = exports.createSVGElementFunctions.animateMotion, exports.animateTransform = exports.createSVGElementFunctions.animateTransform, exports.circle = exports.createSVGElementFunctions.circle, exports.clipPath = exports.createSVGElementFunctions.clipPath, exports.defs = exports.createSVGElementFunctions.defs, exports.desc = exports.createSVGElementFunctions.desc, exports.ellipse = exports.createSVGElementFunctions.ellipse, exports.feBlend = exports.createSVGElementFunctions.feBlend, exports.feColorMatrix = exports.createSVGElementFunctions.feColorMatrix, exports.feComponentTransfer = exports.createSVGElementFunctions.feComponentTransfer, exports.feComposite = exports.createSVGElementFunctions.feComposite, exports.feConvolveMatrix = exports.createSVGElementFunctions.feConvolveMatrix, exports.feDiffuseLighting = exports.createSVGElementFunctions.feDiffuseLighting, exports.feDisplacementMap = exports.createSVGElementFunctions.feDisplacementMap, exports.feDistantLight = exports.createSVGElementFunctions.feDistantLight, exports.feDropShadow = exports.createSVGElementFunctions.feDropShadow, exports.feFlood = exports.createSVGElementFunctions.feFlood, exports.feFuncA = exports.createSVGElementFunctions.feFuncA, exports.feFuncB = exports.createSVGElementFunctions.feFuncB, exports.feFuncG = exports.createSVGElementFunctions.feFuncG, exports.feFuncR = exports.createSVGElementFunctions.feFuncR, exports.feGaussianBlur = exports.createSVGElementFunctions.feGaussianBlur, exports.feImage = exports.createSVGElementFunctions.feImage, exports.feMerge = exports.createSVGElementFunctions.feMerge, exports.feMergeNode = exports.createSVGElementFunctions.feMergeNode, exports.feMorphology = exports.createSVGElementFunctions.feMorphology, exports.feOffset = exports.createSVGElementFunctions.feOffset, exports.fePointLight = exports.createSVGElementFunctions.fePointLight, exports.feSpecularLighting = exports.createSVGElementFunctions.feSpecularLighting, exports.feSpotLight = exports.createSVGElementFunctions.feSpotLight, exports.feTile = exports.createSVGElementFunctions.feTile, exports.feTurbulence = exports.createSVGElementFunctions.feTurbulence, exports.filter = exports.createSVGElementFunctions.filter, exports.foreignObject = exports.createSVGElementFunctions.foreignObject, exports.g = exports.createSVGElementFunctions.g, exports.image = exports.createSVGElementFunctions.image, exports.line = exports.createSVGElementFunctions.line, exports.linearGradient = exports.createSVGElementFunctions.linearGradient, exports.marker = exports.createSVGElementFunctions.marker, exports.mask = exports.createSVGElementFunctions.mask, exports.metadata = exports.createSVGElementFunctions.metadata, exports.mpath = exports.createSVGElementFunctions.mpath, exports.path = exports.createSVGElementFunctions.path, exports.pattern = exports.createSVGElementFunctions.pattern, exports.polygon = exports.createSVGElementFunctions.polygon, exports.polyline = exports.createSVGElementFunctions.polyline, exports.radialGradient = exports.createSVGElementFunctions.radialGradient, exports.rect = exports.createSVGElementFunctions.rect, exports.scriptSVG = exports.createSVGElementFunctions.script, exports.set = exports.createSVGElementFunctions.set, exports.stop = exports.createSVGElementFunctions.stop, exports.styleSVG = exports.createSVGElementFunctions.style, exports.svgSVG = exports.createSVGElementFunctions.svg, exports.switchSVG = exports.createSVGElementFunctions.switch, exports.symbol = exports.createSVGElementFunctions.symbol, exports.textSVG = exports.createSVGElementFunctions.text, exports.textPath = exports.createSVGElementFunctions.textPath, exports.titleSVG = exports.createSVGElementFunctions.title, exports.tspan = exports.createSVGElementFunctions.tspan, exports.use = exports.createSVGElementFunctions.use, exports.view = exports.createSVGElementFunctions.view;
}
});
// node_modules/.pnpm/dom-proxy@2.3.0/node_modules/dom-proxy/selector.js
var require_selector = __commonJS({
"node_modules/.pnpm/dom-proxy@2.3.0/node_modules/dom-proxy/selector.js"(exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.queryElementProxies = exports.queryElements = exports.queryAllElementProxies = exports.queryAllElements = exports.queryElementProxy = exports.queryElement = void 0;
var core_1 = require_core();
function queryElement(selector, parent = document.body) {
let element = parent.querySelector(selector);
if (!element)
throw new Error("failed to find element, selector: " + selector);
return element;
}
exports.queryElement = queryElement;
function queryElementProxy(selector, parent) {
return (0, core_1.createProxy)(queryElement(selector, parent));
}
exports.queryElementProxy = queryElementProxy;
function queryAllElements(selector, parent = document.body) {
let elements = parent.querySelectorAll(selector);
return Array.from(elements);
}
exports.queryAllElements = queryAllElements;
function queryAllElementProxies(selector, parent = document.body) {
let elements = parent.querySelectorAll(selector);
return Array.from(elements, (element) => (0, core_1.createProxy)(element));
}
exports.queryAllElementProxies = queryAllElementProxies;
function queryElements(selectors, parent = document.body) {
let object = {};
for (let [key, selector] of Object.entries(selectors)) {
object[key] = queryElement(selector, parent);
}
return object;
}
exports.queryElements = queryElements;
function queryElementProxies(selectors, parent = document.body) {
let object = {};
for (let [key, selector] of Object.entries(selectors)) {
object[key] = queryElementProxy(selector, parent);
}
return object;
}
exports.queryElementProxies = queryElementProxies;
}
});
// node_modules/.pnpm/dom-proxy@2.3.0/node_modules/dom-proxy/index.js
var require_dom_proxy = __commonJS({
"node_modules/.pnpm/dom-proxy@2.3.0/node_modules/dom-proxy/index.js"(exports) {
"use strict";
var __createBinding = exports && exports.__createBinding || (Object.create ? function(o, m, k, k2) {
if (k2 === void 0)
k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() {
return m[k];
} };
}
Object.defineProperty(o, k2, desc);
} : function(o, m, k, k2) {
if (k2 === void 0)
k2 = k;
o[k2] = m[k];
});
var __exportStar = exports && exports.__exportStar || function(m, exports2) {
for (var p2 in m)
if (p2 !== "default" && !Object.prototype.hasOwnProperty.call(exports2, p2))
__createBinding(exports2, m, p2);
};
Object.defineProperty(exports, "__esModule", { value: true });
__exportStar(require_core(), exports);
__exportStar(require_helpers(), exports);
__exportStar(require_selector(), exports);
}
});
// public/index.ts
var import_dom_proxy = __toESM(require_dom_proxy(), 1);
var configList = (0, import_dom_proxy.div)();
var configListMessage = (0, import_dom_proxy.p)();
var configs;
async function applyConfig(config, applyMessage) {
try {
let res = await fetch("/config/apply", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(config)
});
let json = await res.json();
applyMessage.textContent = `Applied config (${(/* @__PURE__ */ new Date()).toLocaleTimeString()})`;
} catch (error) {
applyMessage.textContent = String(error);
}
}
function ConfigNode(config) {
let totalHeight = 0;
let totalWidth = 0;
config.screens.forEach((screen) => {
totalHeight = Math.max(totalHeight, screen.y + screen.h);
totalWidth = Math.max(totalWidth, screen.x + screen.w);
});
let scale = 1 / 10;
let applyMessage = (0, import_dom_proxy.p)();
return (0, import_dom_proxy.div)(
{
style: {
display: "inline-block",
border: "1px solid black",
padding: "0.5rem",
margin: "0.5rem"
}
},
[
(0, import_dom_proxy.h3)(
{
textContent: "Profile: ",
style: {
marginTop: "0.5rem",
marginBottom: "0.5rem"
}
},
[
(0, import_dom_proxy.input)({
value: config.profile_name,
oninput: (e) => config.profile_name = e.currentTarget.value
})
]
),
(0, import_dom_proxy.div)({}, [
(0, import_dom_proxy.button)({
textContent: "Save",
onclick: saveConfigs,
style: {
marginLeft: "0.5rem",
marginRight: "0.5rem",
color: "darkgreen"
}
}),
(0, import_dom_proxy.button)({
textContent: "Delete",
onclick: () => {
if (!configs)
return;
let index = configs.indexOf(config);
if (index === -1)
return;
configs.splice(index, 1);
saveConfigs();
},
style: {
color: "red"
}
})
]),
...config.screens.map(({ name, w, h, x, y }) => {
return (0, import_dom_proxy.div)(
{
style: {
display: "inline-block",
border: "1px solid black",
padding: "0.5rem",
paddingTop: "0",
margin: "0.5rem"
}
},
[
(0, import_dom_proxy.h4)({
textContent: "Screen: " + name,
style: { margin: "0.5rem 0" }
}),
(0, import_dom_proxy.div)({ textContent: `${w}x${h}+${x}+${y}` })
]
);
}),
(0, import_dom_proxy.h4)({ textContent: "Preview", style: { margin: "0.5rem 0" } }),
(0, import_dom_proxy.button)({
textContent: "Apply",
onclick: () => applyConfig(config, applyMessage)
}),
applyMessage,
(0, import_dom_proxy.div)(
{
style: {
border: "1px solid black",
margin: "0.5rem",
width: totalWidth * scale + "px",
height: totalHeight * scale + "px",
position: "relative",
backgroundColor: "#666666"
}
},
config.screens.map((screen) => {
return (0, import_dom_proxy.div)(
{
style: {
position: "absolute",
width: screen.w * scale + "px",
height: screen.h * scale + "px",
top: screen.y * scale + "px",
left: screen.x * scale + "px",
border: "1px solid black",
display: "flex",
justifyContent: "center",
alignItems: "center",
fontSize: "2rem",
backgroundColor: "#ffffff88",
userSelect: "none"
}
},
[screen.name]
);
})
)
]
);
}
function showConfigs(configs2) {
configListMessage.textContent = configs2.length + " saved configs";
configList.textContent = "";
configList.appendChild((0, import_dom_proxy.fragment)(configs2.map(ConfigNode)));
}
async function loadConfigList() {
try {
let res = await fetch("/configs");
let json = await res.json();
configs = json.configs;
showConfigs(configs);
} catch (error) {
configList.textContent = String(error);
}
}
loadConfigList();
async function loadCurrentConfig() {
try {
if (!configs) {
throw new Error("Configs not loaded yet");
}
let res = await fetch("/current-config");
let json = await res.json();
configs.push(json.config);
configListMessage.textContent = configs.length + " saved configs";
configList.prepend(ConfigNode(json.config).node);
} catch (error) {
configList.textContent = String(error);
}
}
var saveMessage = (0, import_dom_proxy.p)();
async function saveConfigs() {
try {
if (!configs) {
throw new Error("Configs not loaded yet");
}
let res = await fetch("/configs", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(configs)
});
let json = await res.json();
saveMessage.textContent = `Saved configs (${(/* @__PURE__ */ new Date()).toLocaleTimeString()})`;
showConfigs(configs);
} catch (error) {
saveMessage.textContent = String(error);
}
}
var stopServerMessage = (0, import_dom_proxy.p)();
async function stopServer() {
stopServerMessage.textContent = "stopping server...";
let res = await fetch("/server/stop", { method: "POST" });
let json = await res.json();
stopServerMessage.textContent = "stopped server.";
window.close();
}
document.body.appendChild(
(0, import_dom_proxy.fragment)([
(0, import_dom_proxy.h1)({ textContent: "Screen Setup" }),
(0, import_dom_proxy.button)({ textContent: "Stop Server", onclick: stopServer }),
stopServerMessage,
(0, import_dom_proxy.h2)({ textContent: "Config List" }, [
(0, import_dom_proxy.button)({
style: { marginInlineStart: "0.5rem" },
textContent: "Save Configs",
onclick: saveConfigs
})
]),
saveMessage,
(0, import_dom_proxy.button)({ textContent: "Load Current Config", onclick: loadCurrentConfig }),
configListMessage,
configList
])
);
})();