{{ define "base" }}
{{ $cf := .ClientFlags }}
{{ $ds := band $cf 1 }}
{{ $   := . }}
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">

		<title>{{ if .TitleBar }}{{ .T .TitleBar }} - {{ end }}Ripple</title>

		<link rel="stylesheet" type="text/css" href="/static/{{ if $ds }}dark/{{ end }}semantic.min.css?{{ unixNano }}">
		<link rel="stylesheet" type="text/css" href="/static/ripple.css?{{ unixNano }}">
		<link rel="stylesheet" type="text/css" href="/static/snow/snow.css?{{ unixNano }}">
	</head>
	<body {{ if $ds }} class="ds"{{ end }}>
		{{/*
			If we're asked to disable the hugeheading, but a KyutGrill is set, it will become the background of the page.
			This is mainly used in user profiles, allowing users to set their profile background.
			If we're asked to disable the hugeheading, and a KyutGrill is not set, navbar has the `dropped` class.
		*/}}
		<div class="ui full height main wrapper"
			{{ if and .DisableHH .KyutGrill }}
				style="background-image: url('{{ if .KyutGrillAbsolute }}{{ .KyutGrill }}{{ else }}/static/headers/{{ .KyutGrill }}{{ end }}');"
			{{ else if .SolidColour }}
				style="background-color: {{ .SolidColour }}"
			{{ end }}>
			{{ template "navbar" . }}
			{{ if not .DisableHH }}
				<div class="huge heading {{ if .HeadingOnRight }}right{{ end }} dropped"
					style="background-image: url('{{ if .KyutGrillAbsolute }}{{ .KyutGrill }}{{ else }}/static/headers/{{ or .KyutGrill "default.jpg" }}{{ end }}');">
					<div id="snow-container">
						<div>
							<div class="snow large"></div>
							<div class="snow large delayed"></div>
							
							<div class="snow medium"></div>
							<div class="snow medium delayed"></div>
							
							<div class="snow small"></div>
							<div class="snow small delayed"></div>
						</div>
					</div>
					<div class="ui container">
						<h1>{{ if .HeadingTitle }}{{ .T .HeadingTitle | html }}{{ else }}{{ .T .TitleBar }}{{ end }}</h1>
					</div>
				</div>
			{{ end }}

			<div class="h-container">
				<div class="ui margined container" id="messages-container">
				<noscript>Research has proven this website works 10000% better if you have JavaScript enabled.</noscript>
				{{ if and .Context.User.Username (not (has .Context.User.Privileges 1)) }}
					<div class="ui warning message">
						{{ $.T "Your account is currently in restricted mode. You will not be able to do certain actions, and your profile can only be seen by you and by Ripple's staff. If you believe we have mistaken putting you in restricted mode, or a month has passed since you first saw this, then you can send an appeal at <a href='https://support.ripple.moe'>support.ripple.moe</a>." | html }}
					</div>
				{{ end }}
				{{ if .Messages }}
						{{ range $i, $v := .Messages }}
							<div class="ui {{ $v.Type }} message">
								<i class="close icon"></i>
								{{ html $v.Content }}
							</div>
						{{ end }}
				{{ end }}
				{{ $settings := systemSettings "website_maintenance" "game_maintenance" "website_global_alert" }}
				{{ with $settings.website_global_alert.String }}
					<div class="ui warning message">
						{{ . | html }}
					</div>
				{{ end }}
				{{ with $settings.game_maintenance.Int }}
					<div class="ui warning message">
						{{ $.T "Ripple's score submission is currently in maintenance mode. You will not be allowed to submit scores for the time being." }}
					</div>
				{{ end }}
				{{ with $settings.website_maintenance.Int }}
					<div class="ui warning message">
						{{ $.T "The Ripple website is currently in maintenance mode. Only certain users are allowed to access the full website." }}
					</div>
				{{ end }}
				</div>
				{{ template "tpl" . }}
			</div>

		</div>

		<div class="footer">
			{{ .T "&copy; 2015-%d Ripple, using Hanayo %s." (curryear) (version) | html }}
			<a href="/team" title="{{ .T "Who is working on this thing?" }}"><i class="users icon"></i>{{ .T "Team" }}</a> |
			<a href="https://docs.ripple.moe" title="59 6f 75 27 72 65 20 73 6f 20 31 33 33 37 2e"><i class="wrench icon"></i>{{ .T "Developer docs" }}</a> |
			<a href="/changelog" title="{{ .T "See what changed!" }}"><i class="bug icon"></i>{{ .T "Changelog" }}</a> |
			<a href="https://blog.ripple.moe"><i class="anchor icon"></i>{{ .T "Blog" }}</a> |
			<a href="http://status.ripple.moe"><i class="signal icon"></i>{{ .T "Status" }}</a> |
			<a href="https://zxq.co/ripple" title="{{ .T "What's going on under the hood?"}}{{/*'"*/}}"><i class="git square icon"></i></a>
			<a href="https://twitter.com/_ripple" title="{{ .T "Follow us on Twitter!" }}"><i class="twitter icon"></i></a>
			<a href="https://reddit.com/r/osuripple" title="{{ .T "Share irrelevant opinions on reddit!" }}"><i class="reddit square icon"></i></a> |
			<div class="ui scrolling dropdown" style="margin-left: 5px;" id="language-selector">
				{{ $lang := .Context.Language }}
				{{ with $lang }}
					{{ $info := languageInformationByNameShort . }}
					<div class="text"><i class="{{ $info.CountryShort }} flag"></i>{{ $info.Name }}</div>
				{{ else }}
					<div class="default text">{{ .T "Language" }}</div>
				{{ end }}
				<i class="dropdown icon"></i>
				<div class="menu">
					{{ range languageInformation }}
						<div class="{{ if eq .NameShort $lang }}selected {{ end }}item" data-lang="{{ .NameShort }}"><i class="{{ .CountryShort }} flag"></i>{{ .Name }}</div>
					{{ end }}
				</div>
			</div>
		</div>
		<script>
			var hanayoConf = {
				avatars:   {{ .Conf.AvatarURL }},
				banchoAPI: {{ .Conf.BanchoAPI }},
				baseAPI:   {{ .Conf.BaseAPIPublic }},
				cheesegullAPI: {{ .Conf.CheesegullAPI }},
				language:  {{ with $lang }}{{ . }}{{ else }}"en"{{ end }},
			};
			var currentUserID = {{ .Context.User.ID }};
		</script>
		{{/* If we got some more scripts to print, print'em */}}
		<script src="//twemoji.maxcdn.com/2/twemoji.min.js?2.2"></script>
		<script src="/static/dist.min.js?{{ unixNano }}"></script>
		{{ with $lang }}
			<script src="/static/timeago-locale/jquery.timeago.{{ . }}.js"></script>
		{{ end }}
		{{ if .Scripts }}
			{{ range .Scripts }}
				<script src="{{ . }}?{{ unixNano }}"></script>
			{{ end }}
		{{ end }}
	</body>
</html>
{{ end }}
