plug config module in

Author: everloste

index.html

@@ -32,25 +32,25 @@ <h3 class="name"></h3>
 				<form class="config-screen" id="config-screen">
 					<template id="text-widget-template">
 						<div class="widget text-widget">
-							<p>A text widget...</p>
+							<p class="widget-text">A text widget...</p>
 						</div>
 					</template>
 
 					<template id="title-widget-template">
 						<div class="widget title-widget">
-							<h3>A heading widget...</h3>
+							<h3 class="widget-text">A heading widget...</h3>
 						</div>
 					</template>
 
 					<template id="image-widget-template">
 						<div class="widget image-widget">
-							<p>⚠ Image widgets are not supported</p>
+							<p class="widget-text">⚠ Image widgets are not supported</p>
 						</div>
 					</template>
 
 					<template id="slider-widget-template">
 						<div class="widget slider-widget">
-							<label>A slider</label>
+							<label class="widget-text">A slider</label>
 							<input
 								type="range"
 								min="1"
@@ -63,15 +63,15 @@ <h3>A heading widget...</h3>
 
 					<template id="switch-widget-template">
 						<div class="widget switch-widget">
-							<label>A switch</label>
-							<input type="checkbox" class="widget-input widget-switch-input" />
+							<label class="widget-text">A switch</label>
+							<input type="checkbox" class="widget-input widget-switch-input"/>
 						</div>
 					</template>
 
 					<template id="number-widget-template">
 						<div class="widget number-widget">
-							<label>A number box</label>
-							<input type="number" class="widget-input widget-number-input" />
+							<label class="widget-text">A number box</label>
+							<input type="number" class="widget-input widget-number-input"/>
 						</div>
 					</template>
 				</form>

src/config.ts

@@ -65,21 +65,21 @@ export class ConfigClass {
 			let clone = template.content.cloneNode(true) as DocumentFragment;
 			(clone.querySelector(".widget-text") as HTMLElement).innerText = element.text;
 
-			if (type == "switch") {
-				if (element.default == "disabled") {
-					(clone.querySelector(".widget-switch-input") as HTMLInputElement).checked = false;
-				}
-				else if (element.default == "enabled") {
-					(clone.querySelector(".widget-switch-input") as HTMLInputElement).checked = true;
-				}
-			}
-			else if (type == "slider" || type == "number" || type == "value") {
-				(clone.querySelector(".widget-switch-input") as HTMLInputElement).valueAsNumber = element.value.default;
-				if (element.value.range) (clone.querySelector(".widget-switch-input") as HTMLInputElement).min = element.value.range[0].toString();
-				if (element.value.range) (clone.querySelector(".widget-switch-input") as HTMLInputElement).max = element.value.range[1].toString();
-			}
-
-			(clone.querySelector(".widget-switch-input") as HTMLInputElement).id = "input-widget-" + i.toString();
+			// if (type == "switch") {
+			// 	if (element.default == "disabled") {
+			// 		(clone.querySelector(".widget-switch-input") as HTMLInputElement).checked = false;
+			// 	}
+			// 	else if (element.default == "enabled") {
+			// 		(clone.querySelector(".widget-switch-input") as HTMLInputElement).checked = true;
+			// 	}
+			// 	(clone.querySelector(".widget-switch-input") as HTMLInputElement).id = "input-widget-" + i.toString();
+			// }
+			// else if (type == "slider" || type == "number" || type == "value") {
+			// 	(clone.querySelector(".widget-switch-input") as HTMLInputElement).valueAsNumber = element.value.default;
+			// 	if (element.value.range) (clone.querySelector(".widget-switch-input") as HTMLInputElement).min = element.value.range[0].toString();
+			// 	if (element.value.range) (clone.querySelector(".widget-switch-input") as HTMLInputElement).max = element.value.range[1].toString();
+			// }
+			
 			html_widgets.push(clone); i += 1;
 		});
 

src/datapack.ts

@@ -51,6 +51,8 @@ export async function loadDatapack(file: File): Promise<Datapack | string> {
 
 	let configObject = new ConfigClass(config);
 
+	writeConfigWidgetsToDocument(configObject);
+
 	return {
 		id: mcmeta.pack.id || file.name,
 		name: mcmeta.pack.name,
@@ -88,3 +90,11 @@ function detectModules(datapackZip: JSZip): Set<Module> {
 
 	return modules;
 }
+
+function writeConfigWidgetsToDocument(configObject: ConfigClass) {
+	const widgets: Array<DocumentFragment> = configObject.get_widgets_html();
+	const screen = document.getElementById("config-screen")!;
+	widgets.forEach(element => {
+		screen.appendChild(element);
+	});
+}