{#
 Copyright 2008 Steven Barth <steven@midlink.org>
 Copyright 2012 David Menting <david@nut-bolt.nl>
 Copyright 2008-2022 Jo-Philipp Wich <jo@mein.io>
 Licensed to the public under the Apache License 2.0.
-#}

{%
	import { getuid, getspnam } from 'luci.core';

	const boardinfo = ubus.call('system', 'board');
	const darkpref = (theme == 'bootstrap-dark' ? 'true' : (theme == 'bootstrap-light' ? 'false' : null));

	http.prepare_content('text/html; charset=UTF-8');
-%}

<!DOCTYPE html>
<html lang="{{ dispatcher.lang }}" {{ darkpref ? `data-darkmode="${darkpref}"` : '' }}>
	<head>
		<meta charset="utf-8">
		<title>{{ striptags(`${boardinfo.hostname ?? '?'}${node ? ` - ${node.title}` : ''}`) }} - LuCI</title>
		{% if (!darkpref): %}
			<script>
				var mediaQuery = window.matchMedia('(prefers-color-scheme: dark)'),
				    rootElement = document.querySelector(':root'),
				    setDarkMode = function(match) { rootElement.setAttribute('data-darkmode', match.matches) };

				mediaQuery.addEventListener('change', setDarkMode);
				setDarkMode(mediaQuery);
			</script>
		{% endif %}
		<meta name="viewport" content="initial-scale=1.0">
		<link rel="stylesheet" href="{{ media }}/cascade.css?v=26.205.85413~cac97ed">
		<link rel="stylesheet" media="only screen and (max-device-width: 854px)" href="{{ media }}/mobile.css?v=26.205.85413~cac97ed" />
		<link rel="icon" href="{{ media }}/logo_48.png" sizes="48x48">
		<link rel="icon" href="{{ media }}/logo.svg" sizes="any">
		{% if (node?.css): %}
		<link rel="stylesheet" href="{{ resource }}/{{ node.css }}">
		{% endif %}
		{% if (css): %}
		<style title="text/css">{{ css }}</style>
		{% endif %}
		<script src="{{ dispatcher.build_url('admin/translations', dispatcher.lang) }}"></script>
		<script src="{{ resource }}/cbi.js?v=26.205.85413~cac97ed"></script>
	</head>

	<body class="lang_{{ dispatcher.lang }} {{ entityencode(striptags(node?.title ?? ''), true) }}" data-page="{{ entityencode(join('-', ctx.request_path), true) }}">
		{% if (!blank_page): %}
		<header>
			<a class="brand" href="/">{{ striptags(boardinfo.hostname ?? '?') }}</a>
			<ul class="nav" id="topmenu" style="display:none"></ul>
			<div id="indicators" class="pull-right"></div>
		</header>

		<div id="maincontent" class="container">
			{% if (getuid() == 0 && getspnam('root')?.pwdp === ''): %}
				<div class="alert-message warning">
					<h4>{{ _('No password set!') }}</h4>
					<p>{{ _('There is no password set on this router. Please configure a root password to protect the web interface.') }}</p>
					{% if (dispatcher.lookup("admin/system/admin")): %}
					  <div class="right"><a class="btn" href="{{ dispatcher.build_url("admin/system/admin") }}">{{ _('Go to password configuration...') }}</a></div>
					{% endif %}
				</div>
			{% endif %}

			{% if (boardinfo.rootfs_type == "initramfs"): %}
				<div class="alert-message warning">
					<h4>{{ _('System running in recovery (initramfs) mode.') }}</h4>
					<p>{{ _('No changes to settings will be stored and are lost after rebooting. This mode should only be used to install a firmware upgrade') }}</p>
					{% if (dispatcher.lookup("admin/system/flash")): %}
					  <div class="right"><a class="btn" href="{{ dispatcher.build_url("admin/system/flash") }}">{{ _('Go to firmware upgrade...') }}</a></div>
					{% endif %}
				</div>
			{% endif %}

			<noscript>
				<div class="alert-message warning">
					<h4>{{ _('JavaScript required!') }}</h4>
					<p>{{ _('You must enable JavaScript in your browser or LuCI will not work properly.') }}</p>
				</div>
			</noscript>

			<div id="tabmenu" style="display:none"></div>
		{% endif %}
