frontend-dali/source/widgets/mode_switcher/logic.ts

/*
This file is part of »dali«.

Copyright 2025 'kcf' <fenris@folksprak.org>

»dali« is free software: you can redistribute it and/or modify
it under the terms of the GNU Lesser General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

»dali« is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Lesser General Public License for more details.

You should have received a copy of the GNU Lesser General Public License
along with »dali«. If not, see <http://www.gnu.org/licenses/>.
 */


namespace _dali.widgets
{
	
	/**
	 */
	type type_option = {
		mode : _dali.enum_view_mode;
		label : string,
	};
	
	
	/**
	 */
	export class class_widget_mode_switcher implements lib_plankton.zoo_widget.interface_widget
	{
		
		/**
		 */
		private options : Array<type_option>;
		
		
		/**
		 */
		private initial_selection : (null | _dali.enum_view_mode);
		
		
		/**
		 */
		private action_change : (null | ((mode : _dali.enum_view_mode) => void));
		
		
		/**
		 */
		public constructor(
			options : Array<type_option>,
			{
				"initial_selection": initial_selection = null,
				"action_change": action_change = null,
			}
			:
			{
				initial_selection ?: (null | _dali.enum_view_mode),
				action_change ?: (null | ((mode : _dali.enum_view_mode) => void))
			}
			=
			{
			}
		)
		{
			this.options = options;
			this.initial_selection = initial_selection;
			this.action_change = action_change;
		}
		
		
		/**
		 * [implementation]
		 */
		public async load(
			target_element : Element
		)
		: Promise<void>
		{
			target_element.innerHTML = await _dali.helpers.template_coin(
				"widget-mode_switcher",
				"main",
				{
					"options": (await lib_plankton.call.promise_condense(
						this.options.map(
							option => () => _dali.helpers.template_coin(
								"widget-mode_switcher",
								"option",
								{
									"rel": _dali.view_mode_encode(option.mode),
									"value": _dali.view_mode_encode(option.mode),
									"label": option.label,
								}
							)
						)
					)).join(""),
				}
			);
			// initial selection
			{
				if (this.initial_selection !== null)
				{
					const selector : string = lib_plankton.string.coin(
						".widget-mode_switcher-option[rel=\"{{rel}}\"] > input",
						{
							"rel": _dali.view_mode_encode(this.initial_selection)
						}
					);
					(target_element.querySelector(selector) as HTMLInputElement).checked = true;
				}
			}
			// set listeners
			{
				if (this.action_change !== null)
				{
					target_element.querySelectorAll(".widget-mode_switcher-option").forEach(
						element => {
							const view_mode_encoded : string = element.getAttribute("rel");
							const mode : _dali.enum_view_mode = _dali.view_mode_decode(view_mode_encoded);
							element.querySelector("input").addEventListener(
								"change",
								(event) => {
									this.action_change(mode);
								}
							);
						}
					);
				}
			}
			return Promise.resolve<void>(undefined);
		}
			
	}
	
}