[ Unified UI ] Settings

scripts/system/settings/qml_widgets/HeaderElement.qml

@@ -0,0 +1,45 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Item {
+	height: 60
+	width: parent.width
+	id: root
+	z: 1 // FIXME: Layout issue? Shouldn't need to adjust the z-index but I do.
+
+	Rectangle {
+		anchors.fill: parent;
+		color: "black"
+	}
+
+	Image {
+		source: "../img/back_arrow.png"
+		anchors.verticalCenter: parent.verticalCenter
+		height: 40
+		width: 40
+		x: current_page == "Settings" ? -40 : 10
+
+		Behavior on x {
+			NumberAnimation {
+				duration: 200
+				easing.type: Easing.InOutCubic
+			}
+		}
+
+		MouseArea {
+			anchors.fill: parent
+			onClicked: {
+				current_page = "Settings";
+			}
+		}
+	}
+
+	Text {
+		text: current_page
+		color: "white"
+		font.pointSize: 18
+		anchors.horizontalCenter: parent.horizontalCenter
+		anchors.verticalCenter: parent.verticalCenter
+		horizontalAlignment: Text.AlignHCenter
+	}
+}

scripts/system/settings/qml_widgets/SettingCenterContainer.qml

@@ -0,0 +1,24 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.3
+
+ScrollView {
+	width: parent.width
+	height:parent.height
+	y: header.height
+	id: root
+
+	ColumnLayout {
+		width: parent.width
+		anchors.horizontalCenter: parent.horizontalCenter
+		spacing: 0
+	}
+
+	// For each child of index not of 0, append as child of index of 0. 
+	// Append children of the custom element to the ColumnLayout.
+	Component.onCompleted: {
+		for (var i = 1; i < root.contentChildren.length; i++) {
+			root.contentChildren[i].parent = root.contentChildren[0]
+        }
+	}
+}

scripts/system/settings/qml_widgets/SettingSubviewListElement.qml

@@ -0,0 +1,28 @@
+import QtQuick 2.15
+
+Item {
+	width: parent.width
+	height: 60
+
+	Rectangle {
+		width: parent.width
+		height: parent.height
+		color: index % 2 === 0 ? Qt.rgba(0,0,0,0) : Qt.rgba(0.15,0.15,0.15,1)
+		anchors.fill: parent
+	}
+
+	Text {
+		text: page_name
+		color: "white"
+		font.pointSize: 16
+		anchors.verticalCenter: parent.verticalCenter
+		x: 10
+	}
+
+	MouseArea {
+		anchors.fill: parent
+		onClicked: {
+			current_page = page_name;
+		}
+	}
+}

scripts/system/settings/settings.js

@@ -0,0 +1,80 @@
+//
+//  settings.js
+//
+//  App to configure Overte
+//
+//  Created by Armored Dragon, 2024.
+//  Copyright 2024 Overte e.V.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+
+/* global Script Tablet */
+
+// TODO: Bind Target frame Rate to Graphics Preset
+// TODO: Fullscreen display? 
+
+(() => {
+	"use strict";
+	var tablet;
+	var appButton;
+	var active = false;
+	const url = Script.resolvePath("./settings.qml")
+
+	tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
+	appButton = tablet.addButton({
+		icon: Script.resolvePath("./img/icon_white.png"),
+		activeIcon: Script.resolvePath("./img/icon_black.png"),
+		text: "SETTINGS",
+		isActive: active,
+	});
+
+	// When script ends, remove itself from tablet
+	Script.scriptEnding.connect(function () {
+		console.log("Shutting Down");
+		tablet.removeButton(appButton);
+	});
+
+	// Overlay button toggle
+	appButton.clicked.connect(toolbarButtonClicked);
+	tablet.fromQml.connect(fromQML);
+	tablet.screenChanged.connect(onTabletScreenChanged);
+
+	function toolbarButtonClicked() {
+		if (active) tablet.gotoHomeScreen();
+		else tablet.loadQMLSource(url);
+
+		active = !active;
+		appButton.editProperties({
+			isActive: active,
+		});
+	}
+
+	function onTabletScreenChanged(type, new_url){
+		if (url == new_url) active = true;
+		else active = false;
+
+		appButton.editProperties({
+			isActive: active,
+		});
+	}
+
+	// Communication
+	function fromQML(event) {
+		console.log(`New QML event:\n${JSON.stringify(event)}`);
+
+		switch (event.type) {
+		case "initialized":
+			getActivePolls();
+			break;
+		}
+	}
+	/**
+	 * Emit a packet to the HTML front end. Easy communication!
+	 * @param {Object} packet - The Object packet to emit to the HTML
+	 * @param {("show_message"|"clear_messages"|"notification"|"initial_settings")} packet.type - The type of packet it is
+	 */
+	// function _emitEvent(packet = { type: "" }) {
+	// 	tablet.sendToQml(packet);
+	// }
+})();