soundcloak/templates/preferences.templ

package templates

import "git.maid.zone/stuff/soundcloak/lib/cfg"

templ checkbox(name string, checked bool) {
	if checked {
		<input name={ name } type="checkbox" autocomplete="off" checked/>
	} else {
		<input name={ name } type="checkbox" autocomplete="off"/>
	}
}

type option struct {
	value    string
	desc     string
	disabled bool
}

// i hate this
// ^ outdated, i no longer hate this
templ sel(name string, options []option, selected string) {
	<select name={ name } autocomplete="off">
		for _, opt := range options {
			if opt.value == selected {
				<option value={ opt.value } selected>{ opt.desc }</option>
			} else {
				<option value={ opt.value } disabled?={ opt.disabled }>{ opt.desc }</option>
			}
		}
	</select>
}

templ sel_audio(name string, selected string, noOpus bool) {
	@sel(name, []option{
		{cfg.AudioBest, "Best", noOpus},
		{cfg.AudioAAC, "M4A AAC 160kb/s", false},
		{cfg.AudioOpus, "OGG Opus 72kb/s", noOpus},
		{cfg.AudioMP3, "MP3 128kb/s", false},
	}, selected)
}

templ Preferences(prefs cfg.Preferences) {
	<h1>Preferences</h1>
	<form method="post" autocomplete="off">
		<label>
			Parse descriptions:
			@checkbox("ParseDescriptions", *prefs.ParseDescriptions)
		</label>
		<label>
			Show current audio:
			@checkbox("ShowAudio", *prefs.ShowAudio)
		</label>
		if cfg.ProxyImages {
			<label>
				Proxy images:
				@checkbox("ProxyImages", *prefs.ProxyImages)
			</label>
		}
		if cfg.Restream {
			<label>
				Download audio:
				@sel_audio("DownloadAudio", *prefs.DownloadAudio, false)
			</label>
		}
		<label>
			Autoplay next track in playlists:
			@checkbox("AutoplayNextTrack", *prefs.AutoplayNextTrack)
			(requires JS; you need to allow autoplay from this domain!!)
		</label>
		if *prefs.AutoplayNextTrack {
			<label>
				Default autoplay mode (in playlists):
				@sel("DefaultAutoplayMode", []option{
					{"normal", "Normal (play songs in order)", false},
					{"random", "Random (play random song)", false},
				}, *prefs.DefaultAutoplayMode)
			</label>
		}
		<label>
			Autoplay next related track:
			@checkbox("AutoplayNextRelatedTrack", *prefs.AutoplayNextRelatedTrack)
			(requires JS; you need to allow autoplay from this domain!!)
		</label>
		<label>
			Fetch search suggestions:
			@checkbox("SearchSuggestions", *prefs.SearchSuggestions)
			(requires JS)
		</label>
		<label>
			Dynamically load comments:
			@checkbox("DynamicLoadComments", *prefs.DynamicLoadComments)
			(requires JS)
		</label>
		<label>
			Player:
			@sel("Player", []option{
				{cfg.RestreamPlayer, "Restream Player", !cfg.Restream},
				{cfg.HLSPlayer, "HLS Player (requires JS)", false},
				{cfg.NonePlayer, "None", false},
			}, *prefs.Player)
		</label>
		switch *prefs.Player {
			case cfg.HLSPlayer:
				<h1>Player-specific preferences</h1>
				if cfg.ProxyStreams {
					<label>
						Proxy song streams:
						@checkbox("ProxyStreams", *prefs.ProxyStreams)
					</label>
				}
				<label>
					Fully preload track:
					@checkbox("FullyPreloadTrack", *prefs.FullyPreloadTrack)
				</label>
				<label>
					Streaming audio:
					@sel_audio("HLSAudio", *prefs.HLSAudio, true)
				</label>
			case cfg.RestreamPlayer:
				<h1>Player-specific preferences</h1>
				<label>
					Streaming audio:
					@sel_audio("RestreamAudio", *prefs.RestreamAudio, false)
				</label>
		}
		<input type="submit" value="Update" class="btn" style="margin-top: 1rem;"/>
		<p>These preferences get saved in a cookie.</p>
	</form>
	<h1>Management</h1>
	<h2>Preferences</h2>
	<div style="display: flex; gap: 1rem;">
		<a class="btn" href="/_/preferences/export" download="soundcloak_preferences.json">Export</a>
		<a class="btn" href="/_/preferences/reset">Reset</a>
	</div>
	<br/>
	<form method="post" action="/_/preferences/import" autocomplete="off" style="display: grid; gap: 1rem;" enctype="multipart/form-data">
		<input class="btn" type="file" autocomplete="off" name="prefs"/>
		<input type="submit" value="Import" class="btn"/>
	</form>

	<style>label{display:flex;gap:.5rem;align-items:center;margin-bottom:.35rem}</style>
}