{% title = BigGlobe.cfg.sitename .. " - generic object database inspired by imageboards" %}

{% function content() %}
<div style="text-align:center;height:50%;margin-top:25%;">
	<div style="max-width:15cm;display:inline-block;">
		<h1>{{ Escapes.htmlescape(BigGlobe.cfg.sitename) }}</h1>
		<form action="/search" method="GET" id="searchform">
			<input type="text" name="n" placeholder="Filter by name..." style="position:relative;width:100%;" />
			
			{% if BigGlobe.cfg.enable18plus then %}
				<ul class="over18">
					<li>
						<input type="radio" name="a" value="-1" id="o18h" onchange="upd(-1)" checked />
						<label for="o18h">Hide 18+</label>
					</li><li>
						<input type="radio" name="a" value="0" id="o18s" onchange="upd(0)" />
						<label for="o18s">Show 18+</label>
					</li><li>
						<input type="radio" name="a" value="1" id="o18o" onchange="upd(1)" />
						<label for="o18o">Only 18+</label>
					</li>
				</ul>
			{% end %}
			
			<input type="hidden" id="tparam" name="t" value="" />
			<div data-formid="searchform" data-formparaminputid="tparam" style="position:relative;width:100%;margin-top:1em;" class="tagbox">
				<p>Filter by tags...</p>
				<span style="position:relative;min-width:4px;left:0;" contenteditable></span>
			</div>
			<div class="autocomplete" style="visibility:hidden;width:100%;"></div>
			
			<input type="submit" value="Search" style="margin-top:1em;" />
			
			<p>Hosting <a href="/search?n=&a=0&t=&hpl">{{DB.getobjcount()}} objects</a> and <a href="#" onclick="showalltags()">{{DB.gettagcount()}} tags</a>.</p>
			
			<div id="alltags"></div>
		</form>
	</div>
</div>

<script defer src="/static/tagbox.js"></script>
<script defer>
	{% if BigGlobe.cfg.enable18plus then %}
		function upd(over18) {
			document.querySelector(".tagbox").setAttribute("data-over18", +over18 != -1)
			window.localStorage.setItem("o18", over18)
		}
		var activeo18 = "-1"
		if(window.localStorage.getItem("o18")) {
			activeo18 = window.localStorage.getItem("o18")
		}
		upd(activeo18)
		document.querySelector("ul.over18 input[type=\"radio\"][value=\"" + activeo18 + "\"]").checked = true
	{% end %}
	
	function showalltags() {
		var ajax = new XMLHttpRequest()
		ajax.open("GET", "/autocomp?q=" + (document.querySelector("div.tagbox").getAttribute("data-over18") == "true" ? "&a=" : ""), true)
		ajax.onreadystatechange = function() {
			if(ajax.readyState == 4 && ajax.status == 200) {
				var box = document.getElementById("alltags")
				var datags = []
				ajax.responseText.split("\n").slice(0, -1).forEach(function(line) {
					var newtag = document.createElement("div")
					newtag.classList.toggle("tag")
					newtag.classList.toggle("tc" + line.split(",")[2])
					newtag.setAttribute("data-tagid", line.split(",")[0])
					newtag.setAttribute("data-tc", line.split(",")[2])
					newtag.innerText = line.split(",")[1]
					datags.push(newtag)
				})
				datags.sort(function(a, b) {return a.getAttribute("data-tc") - b.getAttribute("data-tc")})
				datags.forEach(function(x) { box.insertBefore(x, null) })
			}
		}
		ajax.send()
		
		showalltags = function() {}
	}
</script>

{% end %}

{# base.inc