From 60b29d0893f0df88e65368b4f34bfeae9a91c2d7 Mon Sep 17 00:00:00 2001 From: Manuel Thalmann Date: Mon, 5 Dec 2022 18:47:05 +0100 Subject: [PATCH] Add template files --- .eslintrc.cjs | 1 + src/index.html | 78 +++++++++++++++++++++++++++++++++++++++++--------- src/js/elt.js | 39 +++++++++++++++++++++++++ src/js/main.js | 3 ++ 4 files changed, 108 insertions(+), 13 deletions(-) create mode 100644 src/js/elt.js diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 04ef7eb..a31d111 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -7,6 +7,7 @@ module.exports = { ], env: { node: true, + web: true, es6: true }, parserOptions: { diff --git a/src/index.html b/src/index.html index 085e960..9227ccb 100644 --- a/src/index.html +++ b/src/index.html @@ -1,13 +1,65 @@ - - - - - Connect Four - - - - - -

Welcome to ConnectForce

- - + + + + + Vier gewinnt + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + \ No newline at end of file diff --git a/src/js/elt.js b/src/js/elt.js new file mode 100644 index 0000000..a8cc1d1 --- /dev/null +++ b/src/js/elt.js @@ -0,0 +1,39 @@ +/** + * Creates a new element based on the provided data. + * + * @param {string} type + * The type of the element to create. + * + * @param {Record} attrs + * The attributes to add. + * + * @param {...(Node | string)} children + * The children to add to the element. + * + * @returns {HTMLElement} + * The newly created element. + */ +export function elt(type, attrs, ...children) +{ + let node = document.createElement(type); + + Object.keys(attrs).forEach( + key => + { + node.setAttribute(key, attrs[key]); + }); + + for (let child of children) + { + if (typeof child != "string") + { + node.appendChild(child); + } + else + { + node.appendChild(document.createTextNode(child)); + } + } + + return node; +} diff --git a/src/js/main.js b/src/js/main.js index e69de29..97e3c49 100644 --- a/src/js/main.js +++ b/src/js/main.js @@ -0,0 +1,3 @@ +import { elt } from "./elt.js"; + +elt("a", { href: "https://startpage.com/" }, "This is a test");