Kiosk Container - Revision history

Wikisailor: /* JavaScript: Initial Setup and Configuration Loading */

2025-06-04T10:05:59Z

JavaScript: Initial Setup and Configuration Loading

← Older revision		Revision as of 10:05, 4 June 2025
Line 624:		Line 624:
	// Start the main kiosk initialization process, which will load the config and then set up other intervals.		// Start the main kiosk initialization process, which will load the config and then set up other intervals.
	initializeKiosk();		initializeKiosk();
	//syntaxhighlight>		</syntaxhighlight>

Wikisailor: /* JavaScript: Initial Setup and Configuration Loading */

2025-06-04T10:05:39Z

JavaScript: Initial Setup and Configuration Loading

← Older revision		Revision as of 10:05, 4 June 2025
Line 624:		Line 624:
	// Start the main kiosk initialization process, which will load the config and then set up other intervals.		// Start the main kiosk initialization process, which will load the config and then set up other intervals.
	initializeKiosk();		initializeKiosk();
	~~<~~/syntaxhighlight>		//syntaxhighlight>

Wikisailor: /* JavaScript: Initial Setup and Configuration Loading */

2025-06-04T10:04:56Z

JavaScript: Initial Setup and Configuration Loading

← Older revision		Revision as of 10:04, 4 June 2025
Line 616:		Line 616:
	pictureCyclingIntervalId = setInterval(updatePicture, kioskSettings.pictureDisplayInterval);		pictureCyclingIntervalId = setInterval(updatePicture, kioskSettings.pictureDisplayInterval);
	setInterval(updateAllTimes, 1000);		setInterval(updateAllTimes, 1000);
	}		}
	}		}

	// Initial calls that kick off the entire process when script.js first loads in the browser.		// Initial calls that kick off the entire process when script.js first loads in the browser.
	// Update times immediately so they show up quickly before the main config loads.		// Update times immediately so they show up quickly before the main config loads.
	updateAllTimes();		updateAllTimes();
	// Start the main kiosk initialization process, which will load the config and then set up other intervals.		// Start the main kiosk initialization process, which will load the config and then set up other intervals.
	initializeKiosk();		initializeKiosk();
	</syntaxhighlight>		</syntaxhighlight>

Wikisailor: /* JavaScript: Initial Setup and Configuration Loading */

2025-06-04T10:04:01Z

JavaScript: Initial Setup and Configuration Loading

Wikisailor: /* Introduction */

2025-06-04T10:02:27Z

Introduction

← Older revision		Revision as of 10:02, 4 June 2025
Line 1:		Line 1:
	==Introduction==		==Introduction==

	The main purpose of the Kiosk container is to serve webpages in the form of pictures. The kiosk tablet or screen points at the index.html and the admin is done from admin_index.html. Most of		The main purpose of the Kiosk container is to serve webpages in the form of pictures. The kiosk tablet or screen points at the index.html and the admin is done from admin_index.html. Most of the page layout was created by Gemini and nearly all of the this description page in was also generated by Gemini.
	===Status Monitoring===		===Status Monitoring===
	As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs.This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.		As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs.This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.

Wikisailor: /* Introduction */

2025-06-04T09:59:42Z

Introduction

← Older revision		Revision as of 09:59, 4 June 2025
Line 5:		Line 5:
	As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs.This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.		As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs.This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.
	===Other services===		===Other services===
	In addition to the display of pictures we can display basic reminders, next birthday and time. To set these extra display items there is an Kiosk Management Panel at admin_index.html. The Kiosk Management Panel is a switchboard to the actual configuration pages.		In addition to the display of pictures we can display basic reminders, next birthday and time. To set these extra display items there is a Kiosk Management Panel at admin_index.html. The Kiosk Management Panel is a switchboard to the actual configuration pages.
	* Manage Photos is used to upload and remove images used on the kiosk with a preview of the images		* '''Manage Photos''' is used to upload and remove images used on the kiosk with a preview of the images
	* Manage Reminders is used to add or remove up to 20 possible reminders that will be shown at the top of the kiosk screen		* '''Manage Reminders''' is used to add or remove up to 20 possible reminders that will be shown at the top of the kiosk screen
	* Manage Birthdays is an odd one but useful. What it does is compiles a list of all of the birthdays of family and friends and it will display in the "Info and Times" section the next birthday so there is plenty of warning about the birthday to get a present for them.		* '''Manage Birthdays''' is an odd one but useful. What it does is compiles a list of all of the birthdays of family and friends and it will display in the "Info and Times" section the next birthday so there is plenty of warning about the birthday to get a present for them.
	* Configure Kiosk Display allows refresh timings and colour setting of the Kiosk screen. Note that if the colours are changed they may not show on the actual kiosk until it is refreshed but the timings should take effect immediately.		* '''Configure Kiosk Display''' allows refresh timings and colour setting of the Kiosk screen. Note that if the colours are changed they may not show on the actual kiosk until it is refreshed but the timings should take effect immediately.
	* View Kiosk Display is a link to the index.html page to give a preview of what is going to be served to the actual kiosk. It would be better if the preview was opened in an incognito window so that any js or css will be fresh.		* '''View Kiosk Display''' is a link to the index.html page to give a preview of what is going to be served to the actual kiosk. It would be better if the preview was opened in an incognito window so that any js or css will be fresh.

	== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==		== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==

Wikisailor: /* Introduction */

2025-05-29T15:35:09Z

Introduction

← Older revision		Revision as of 15:35, 29 May 2025
Line 1:		Line 1:
	==Introduction==		==Introduction==

	The main purpose of the Kiosk container is to serve webpages in the form of pictures. The kiosk tablet or screen points at the index.html and the admin is done from admin_index.html.		The main purpose of the Kiosk container is to serve webpages in the form of pictures. The kiosk tablet or screen points at the index.html and the admin is done from admin_index.html. Most of
	===Status Monitoring===		===Status Monitoring===
	As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs.This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.		As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs.This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.
			===Other services===
			In addition to the display of pictures we can display basic reminders, next birthday and time. To set these extra display items there is an Kiosk Management Panel at admin_index.html. The Kiosk Management Panel is a switchboard to the actual configuration pages.
			* Manage Photos is used to upload and remove images used on the kiosk with a preview of the images
			* Manage Reminders is used to add or remove up to 20 possible reminders that will be shown at the top of the kiosk screen
			* Manage Birthdays is an odd one but useful. What it does is compiles a list of all of the birthdays of family and friends and it will display in the "Info and Times" section the next birthday so there is plenty of warning about the birthday to get a present for them.
			* Configure Kiosk Display allows refresh timings and colour setting of the Kiosk screen. Note that if the colours are changed they may not show on the actual kiosk until it is refreshed but the timings should take effect immediately.
			* View Kiosk Display is a link to the index.html page to give a preview of what is going to be served to the actual kiosk. It would be better if the preview was opened in an incognito window so that any js or css will be fresh.

	== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==		== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==

Wikisailor: /* Introduction */

2025-05-29T14:35:32Z

Introduction

← Older revision		Revision as of 14:35, 29 May 2025
Line 1:		Line 1:
	==Introduction==		==Introduction==

	The main purpose of the Kiosk container is to serve webpages in the form of pictures. As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs. This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.		The main purpose of the Kiosk container is to serve webpages in the form of pictures. The kiosk tablet or screen points at the index.html and the admin is done from admin_index.html.
			===Status Monitoring===
			As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs.This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.

	== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==		== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==

Wikisailor: /* Introduction */

2025-05-29T14:31:06Z

Introduction

← Older revision		Revision as of 14:31, 29 May 2025
Line 2:		Line 2:

	The main purpose of the Kiosk container is to serve webpages in the form of pictures. As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs. This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.		The main purpose of the Kiosk container is to serve webpages in the form of pictures. As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs. This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.
	.

	== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==		== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==

Wikisailor: /* Introduction */

2025-05-29T14:30:49Z

Introduction

← Older revision		Revision as of 14:30, 29 May 2025
Line 1:		Line 1:
	==Introduction==		==Introduction==

	The main purpose of the Kiosk container is to serve webpages in the form of pictures. As an addition the pages also		The main purpose of the Kiosk container is to serve webpages in the form of pictures. As an addition the pages also have some basic functionality showing the status of some of the services offered by Pear's VMs. This is not intended to replace a proper service monitoring application but it has been noted that sometimes during reconfiguring Pear that some services don't restart properly (mainly if Pear is shutdown so the guests don't shutdown gracefully), most often it is Raisin that does not restart Nginx so there is no reverse proxy so no websites served externally (the webservers are running but with no reverse proxy they only listen to the LAN inside Pfsense). I will at some point soon be installing a Prometheus + Grafana stack and possibly a Zabbix server as well.
			.

	== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==		== Kiosk Webserver Setup Guide (Ubuntu 22.04 LXC) ==

← Older revision		Revision as of 10:04, 4 June 2025
Line 544:		Line 544:
	<syntaxhighlight lang="javascript">		<syntaxhighlight lang="javascript">
	// --- INITIAL SETUP (Load Config First) ---		// --- INITIAL SETUP (Load Config First) ---
	// This asynchronous function is called once to initialize the entire kiosk display.		// This asynchronous function is called once to initialize the entire kiosk display.
	async function initializeKiosk() {		async function initializeKiosk() {
	try {		try {
	// Attempt to fetch the config.json file from the same web server.		// Attempt to fetch the config.json file from the same web server.
	const response = await fetch('http://' + window.location.hostname + '/config.json');		const response = await fetch('http://' + window.location.hostname + '/config.json');
	if (!response.ok) {		if (!response.ok) {
	// If the fetch operation itself fails (e.g., file not found, network error),		// If the fetch operation itself fails (e.g., file not found, network error),
	// throw an error to immediately jump to the catch block for fallback.		// throw an error to immediately jump to the catch block for fallback.
	throw new Error('Failed to load config.json: ' + response.statusText);		throw new Error('Failed to load config.json: ' + response.statusText);
	}		}
	// Parse the JSON response into the global kioskSettings object.		// Parse the JSON response into the global kioskSettings object.
	kioskSettings = await response.json();		kioskSettings = await response.json();
	console.log('Kiosk settings loaded:', kioskSettings);		console.log('Kiosk settings loaded:', kioskSettings);

	// Apply colors from the loaded settings to CSS variables.		// Apply colors from the loaded settings to CSS variables.