Compare commits

...

2 commits

Author SHA1 Message Date
8f488f48bd Adjust SuiWeb according to the standards
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
2022-12-15 21:53:30 +01:00
dedf7886e5 Nest function parameters into objects 2022-12-15 21:42:21 +01:00
2 changed files with 44 additions and 20 deletions

View file

@ -67,7 +67,7 @@ export function App(game)
}, },
[ [
Board, Board,
game.board { board: game.board }
], ],
[ [
"div", "div",
@ -83,13 +83,13 @@ export function App(game)
/** /**
* Renders an element which represents the specified {@link board `board`}. * Renders an element which represents the specified {@link board `board`}.
* *
* @param {Board} board * @param {{ board: Board }} board
* The board represented in this element. * The board represented in this element.
* *
* @returns {NodeDescriptor} * @returns {NodeDescriptor}
* The rendered element. * The rendered element.
*/ */
export function Board(board) export function Board({ board })
{ {
let fields = board.flatMap((row) => row); let fields = board.flatMap((row) => row);
@ -99,7 +99,7 @@ export function Board(board)
...fields.map( ...fields.map(
(field) => (field) =>
{ {
return /** @type {NodeDescriptor} */([Field, field]); return /** @type {NodeDescriptor} */([Field, { field }]);
}), }),
["div", { style: "clear: both;" }] ["div", { style: "clear: both;" }]
]; ];
@ -108,13 +108,13 @@ export function Board(board)
/** /**
* Renders an element which represents the specified {@link field `field`}. * Renders an element which represents the specified {@link field `field`}.
* *
* @param {CellOwner} field * @param {{ field: CellOwner }} field
* The field to represent. * The field to represent.
* *
* @returns {NodeDescriptor} * @returns {NodeDescriptor}
* The rendered element. * The rendered element.
*/ */
export function Field(field) export function Field({ field })
{ {
return [ return [
"div", "div",
@ -143,23 +143,23 @@ export function MenuBar()
return [ return [
"div", "div",
{ className: "menu-bar" }, { className: "menu-bar" },
[Button, ["New Game", { className: newGameClass }]], [Button, { content: ["New Game", { className: newGameClass }] }],
[Button, ["Save Game", { className: saveGameClass }]], [Button, { content: ["Save Game", { className: saveGameClass }] }],
[Button, ["Load Game", { className: loadGameClass }]], [Button, { content: ["Load Game", { className: loadGameClass }] }],
[Button, ["Undo Last Move", { className: undoClass }]] [Button, { content: ["Undo Last Move", { className: undoClass }] }]
]; ];
} }
/** /**
* Renders a button. * Renders a button.
* *
* @param {...ElementDescriptor[1][]} content * @param {{ content: ElementDescriptor[1][] }} content
* The settings of the button. * The settings of the button.
* *
* @returns {NodeDescriptor} * @returns {NodeDescriptor}
* The rendered element. * The rendered element.
*/ */
export function Button(content) export function Button({ content })
{ {
return [ return [
"button", "button",

View file

@ -11,6 +11,9 @@ export class SuiWeb
* *
* @param {HTMLElement} element * @param {HTMLElement} element
* The element to add the rendered node to. * The element to add the rendered node to.
*
* @returns {Node}
* The resulting element.
*/ */
static render(data, element) static render(data, element)
{ {
@ -19,14 +22,33 @@ export class SuiWeb
let descriptor = data[0]; let descriptor = data[0];
let args = data.slice(1); let args = data.slice(1);
if (typeof descriptor === "function" || typeof descriptor === "string")
{
/**
* @type {HTMLElement}
*/
let result;
if (typeof descriptor === "function") if (typeof descriptor === "function")
{ {
SuiWeb.render(descriptor(...args), element); /**
} * @type {any[]}
else if (typeof descriptor === "string") */
let arg = [];
if (typeof args[0] === "object" && !Array.isArray(args[0]))
{ {
let result = element.ownerDocument.createElement(descriptor); arg = [args[0]];
args = args.slice(1);
}
result = /** @type {HTMLElement} */ (SuiWeb.render(descriptor(...arg), element));
}
else
{
result = element.ownerDocument.createElement(descriptor);
element.appendChild(result); element.appendChild(result);
}
for (let arg of args) for (let arg of args)
{ {
@ -39,6 +61,8 @@ export class SuiWeb
SuiWeb.render(arg, result); SuiWeb.render(arg, result);
} }
} }
return result;
} }
else else
{ {
@ -47,7 +71,7 @@ export class SuiWeb
} }
else if (typeof data === "string") else if (typeof data === "string")
{ {
element.appendChild(element.ownerDocument.createTextNode(data)); return element.appendChild(element.ownerDocument.createTextNode(data));
} }
else else
{ {