{% extends "base.html" %}

{% block title %}
	Options for "{{ world }}" | Our World of Text
{% endblock %}

{% block endhead %}
<link rel="stylesheet" type="text/css" href="/static/css/autocomplete.css">
<script>
	function closestClassName(element, className) {
		var currentElm = element;
		while(currentElm) {
			if(currentElm?.className == className) return currentElm;
			currentElm = currentElm.parentNode;
		}
		return null;
	}

	var actionMethod = "";
	var writeintCustom;
	// rate limit toggles
	var rl_0; // no rate limit
	var rl_512; // 512 chars/sec
	var rl_32; // 32 chars/sec
	var rl_x; // custom (the actual form input)
	window.onload = function() {
		var miscform = document.getElementById("miscform");
		rl_0 = document.getElementById("rl_0");
		rl_512 = document.getElementById("rl_512");
		rl_32 = document.getElementById("rl_32");
		rl_x = document.getElementById("rl_x");

		unclaim.onclick = function() { actionMethod = "unclaim" };
		clear_public.onclick = function() { actionMethod = "clear_public" };
		clear_all.onclick = function() { actionMethod = "clear_all" };
		clear_chat_hist.onclick = function() { actionMethod = "clear_chat_hist" };

		updateMemkeyBox();
		memkey_enabled.onclick = updateMemkeyBox;

		var writeint = document.getElementById("writeinterval_val");
		document.getElementsByName("writeinterval").forEach(function(elm) {
			elm.onclick = updateWriteIntBox;
			if(elm.value == "custom") {
				writeintCustom = elm;
			} else if(elm.value == writeint.value) {
				elm.checked = true;
			}
		});
		updateWriteIntBox();

		rl_0.onclick = updateRatelimBox;
		rl_512.onclick = updateRatelimBox;
		rl_32.onclick = updateRatelimBox;
		rl_x.onclick = updateRatelimBox;
		updateRatelimBox();

		miscform.onsubmit = function() {
			var writeint = document.getElementById("writeinterval_val");
			var ratelimVal = document.getElementById("ratelim_val");
			var ratelimPer = document.getElementById("ratelim_per");
			writeint.disabled = false;
			ratelimVal.disabled = false;
			ratelimPer.disabled = false;
		}
		
		var color_palette_enabled = document.getElementById("color_palette_enabled");
		color_palette_enabled.onclick = updateColorPaletteTableInputsEnabled;
		var bg_color_palette_enabled = document.getElementById("bg_color_palette_enabled");
		bg_color_palette_enabled.onclick = updateBgColorPaletteTableInputsEnabled;
		updateColorPaletteTableInputsEnabled();
		updateBgColorPaletteTableInputsEnabled();
	}
	function action_confirm() {
		var msg = "";
		if(actionMethod == "unclaim") {
			msg = "Are you sure you want to unclaim this world? This action cannot be undone if someone else reclaims the world.";
		}
		if(actionMethod == "clear_public") {
			msg = "Are you sure you want to clear all public areas? This action cannot be undone.";
		}
		if(actionMethod == "clear_all") {
			msg = "Are you sure you want to clear this world entirely? This action cannot be undone.";
		}
		if(actionMethod == "clear_chat_hist") {
			msg = "Are you sure you want to clear the chat history? This action cannot be undone.";
		}
		return confirm(msg);
	}
	var advancedMiscVisible = false;
	function showAdvancedMisc() {
		var advElm = document.getElementById("advanced");
		if(!advancedMiscVisible) {
			advElm.style.display = "";
			advancedMiscVisible = true;
		} else {
			advElm.style.display = "none";
			advancedMiscVisible = false;
		}
	}

	function updateRatelimBox(e) {
		var ratelimVal = document.getElementById("ratelim_val");
		var ratelimPer = document.getElementById("ratelim_per");

		if(!e) {
			if(ratelimVal.value == "0" && ratelimPer.value == "0") {
				rl_0.checked = true;
			} else if(ratelimVal.value == "512" && ratelimPer.value == "1000") {
				rl_512.checked = true;
			} else if(ratelimVal.value == "32" && ratelimPer.value == "1000") {
				rl_32.checked = true;
			} else {
				rl_x.checked = true;
			}
		} else {
			var type = e.target.value;
			if(type == "off") {
				ratelimVal.value = "0";
				ratelimPer.value = "0";
			} else if(type == "p512") {
				ratelimVal.value = "512";
				ratelimPer.value = "1000";
			} else if(type == "p32") {
				ratelimVal.value = "32";
				ratelimPer.value = "1000";
			} else if(type == "custom") {
				if(ratelimPer.value == "0") {
					ratelimVal.value = "512";
					ratelimPer.value = "1000";
				}
			}
		}

		if(!rl_x.checked) {
			ratelimVal.disabled = true;
			ratelimPer.disabled = true;
		} else {
			ratelimVal.disabled = false;
			ratelimPer.disabled = false;
		}
	}

	function updateMemkeyBox() {
		var memkey_enabled = document.getElementById("memkey_enabled");
		var memkey_value = document.getElementById("memkey_value");
		memkey_value.disabled = !memkey_enabled.checked;
	}

	function updateWriteIntBox(e) {
		var custom = document.getElementById("writeinterval_val");
		custom.disabled = !writeintCustom.checked;
		if(e) {
			var val = e.target.value;
			if(val != "custom") {
				custom.value = val;
			}
		}
	}

	function updateColorPaletteTableInputsEnabled() {
		var isEnabled = document.getElementsByName("color_palette_enabled")[0];
		if(!isEnabled) return;
		var checked = isEnabled.checked;

		function update(elm) {
			elm.disabled = !checked;
		}

		for(let elm of document.getElementsByName("color_palette_value")) {
			update(elm);
		}
		for(let elm of document.getElementsByClassName("color_palette_add")) {
			update(elm);
		}
		for(let elm of document.getElementsByClassName("color_palette_rem")) {
			update(elm);
		}
	}

	function updateBgColorPaletteTableInputsEnabled() {
		var isEnabled = document.getElementsByName("bg_color_palette_enabled")[0];
		if(!isEnabled) return;
		var checked = isEnabled.checked;

		function update(elm) {
			elm.disabled = !checked;
		}

		for(let elm of document.getElementsByName("bg_color_palette_value")) {
			update(elm);
		}
		for(let elm of document.getElementsByClassName("bg_color_palette_add")) {
			update(elm);
		}
		for(let elm of document.getElementsByClassName("bg_color_palette_rem")) {
			update(elm);
		}
	}

	function colorPaletteRemoveRow(evt, type) {
		var elm = evt.target;
		var row;
		if(type == 'fg') {
			row = closestClassName(elm, "color_palette_value_row");
		} else if(type == 'bg') {
			row = closestClassName(elm, "bg_color_palette_value_row");
		}
		if(row) {
			row.remove();
		}
	}

	function colorPaletteAddRow(type) {
		let valueRows;
		var color_palette_table;
		var newRowIndicator;
		if(type == 'fg') {
			valueRows = document.getElementsByClassName("color_palette_value_row");
			color_palette_table = document.getElementById("color_palette_table");
			newRowIndicator = document.getElementById("color_palette_add_row");
		} else if(type == 'bg') {
			valueRows = document.getElementsByClassName("bg_color_palette_value_row");
			color_palette_table = document.getElementById("bg_color_palette_table");
			newRowIndicator = document.getElementById("bg_color_palette_add_row");
		}

		if(valueRows.length >= 300) {
			return alert("Cannot add more than 300 palette values");
		}

		if(newRowIndicator) newRowIndicator.remove();

		let newRow = document.createElement("tr");
		let newRowBtnCnt = document.createElement("td");
		let newRowBtn = document.createElement("button");
		let newRowBtnLab = document.createElement("code");
		let newRowValCnt = document.createElement("td");
		let newRowVal = document.createElement("input");

		newRow.appendChild(newRowBtnCnt);
		newRow.appendChild(newRowValCnt);
		newRowBtnCnt.appendChild(newRowBtn);
		newRowValCnt.appendChild(newRowVal);
		newRowBtn.appendChild(newRowBtnLab);

		newRowBtn.onclick = (evt) => colorPaletteRemoveRow(evt, type);
		newRowBtn.type = "button";
		newRowBtnLab.innerText = "-";
		newRowVal.value = "#";

		if(type == 'fg') {
			newRow.className = "color_palette_value_row";
			newRowBtn.className = "color_palette_rem";
			newRowVal.name = "color_palette_value";
		} else if(type == 'bg') {
			newRow.className = "bg_color_palette_value_row";
			newRowBtn.className = "bg_color_palette_rem";
			newRowVal.name = "bg_color_palette_value";
		}

		color_palette_table.appendChild(newRow);
		color_palette_table.appendChild(newRowIndicator);
	}
</script>
{% endblock %}

{% block header %}
	<h1>Options for "<a href="/{{ world }}">{{ world }}</a>"</h1>
	<span><a href="/accounts/profile/">« Back to profile</a></span>
{% endblock %}

{% block content %}
	{% if user.superuser %}
		<div class="content_set">
			<div class="content_set_title">This world is owned by:</div>
			<div class="content_set_content" id="owned_by">
				&nbsp;&nbsp;&nbsp;&nbsp;
				{% if owner_name %}
					<a href="/administrator/users/by_username/{{owner_name}}" style="background-color: aqua; min-width: 70px;">
						{{ owner_name }}
					</a>
				{% else %}
					<b>[ No Owner ]</b>
				{% endif %}
			</div>
		</div>
	{% endif %}

	<div class="content_set">
		<div class="content_set_title">Access</div>
		<div class="content_set_content" id="world_access">
			<p class="set_description">
				Who can visit and write on this world, by default.
				You can designate members below.
				Write-permissions can be overridden for particular sections of your world: visit your world, then click the "More" menu for options.
			</p>
			<form method="POST" action="">
				<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrftoken }}" />
				<p>
					Who can visit this world?
					<select name="readability">
						<option value="0"{%if readability == 0%} selected{%endif%}>anyone</option>
						<option value="1"{%if readability == 1%} selected{%endif%}>me and members</option>
						<option value="2"{%if readability == 2%} selected{%endif%}>only me</option>
					</select>
				</p>
				<p>
					Who can write on it?
					<select name="writability">
						<option value="0"{%if writability == 0%} selected{%endif%}>anyone</option>
						<option value="1"{%if writability == 1%} selected{%endif%}>me and members</option>
						<option value="2"{%if writability == 2%} selected{%endif%}>only me</option>
					</select>
				</p>
				<input type="hidden" name="form" value="access_perm">
				<input type="submit" value="Submit">
			</form>
			{% if is_memkey_enabled %}
			<a style="color: red; font-weight: bold;" href="/{{world}}?key={{memkey_value}}">This world has a membership key enabled</a>
			{% endif %}
		</div>
	</div>

	<div class="content_set">
		<div class="content_set_title">Features</div>
		<div class="content_set_content" id="world_features">
			<p class="set_description">
				Who can use what features on this world.
			</p>
			<form method="POST" action="">
				<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrftoken }}" />
				<table class="config_table">
					<tr>
						<td class="feature_name">Go to coordinates</td>
						<td>
							<select name="go_to_coord">
								<option value="0"{%if go_to_coord==0%} selected{%endif%}>anyone</option>
								<option value="1"{%if go_to_coord==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if go_to_coord==2%} selected{%endif%}>only me</option>
							</select>
						</td>
						<td class="feature_description">
							Transports you to any given coordinates on a world.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Create link to coordinates</td>
						<td>
							<select name="coord_link">
								<option value="0"{%if coord_link==0%} selected{%endif%}>anyone</option>
								<option value="1"{%if coord_link==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if coord_link==2%} selected{%endif%}>only me</option>
							</select>
						</td>
						<td class="feature_description">
							Make a letter be a link to a different part of the world.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Create link to URL</td>
						<td>
							<select name="url_link">
								<option value="0"{%if url_link==0%} selected{%endif%}>anyone</option>
								<option value="1"{%if url_link==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if url_link==2%} selected{%endif%}>only me</option>
							</select>
						</td>
						<td class="feature_description">
							Make a letter be a link to a URL.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Paste text</td>
						<td>
							<select name="paste">
								<option value="0"{%if paste==0%} selected{%endif%}>anyone</option>
								<option value="1"{%if paste==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if paste==2%} selected{%endif%}>only me</option>
							</select>
						</td>
						<td class="feature_description">
							Paste a lot of text at once.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Create members-only areas</td>
						<td>
							<select name="membertiles_addremove">
								<option value="true"{%if membertiles_addremove==1%} selected{%endif%}>me and members</option>
								<option value="false"{%if membertiles_addremove==0%} selected{%endif%}>only me</option>
							</select>
						</td>
						<td class="feature_description">
							Allows members to create and remove members-only protected areas.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Erase areas rapidly</td>
						<td>
							<select name="quick_erase">
								<option value="1"{%if quick_erase==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if quick_erase==2%} selected{%endif%}>only me</option>
							</select>
						</td>
						<td class="feature_description">
							Wipe an area as fast as possible.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Chat</td>
						<td>
							<select name="chat">
								<option value="0"{%if chat_permission==0%} selected{%endif%}>anyone</option>
								<option value="1"{%if chat_permission==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if chat_permission==2%} selected{%endif%}>only me</option>
								<option value="-1"{%if chat_permission==-1%} selected{%endif%}>disabled</option>
							</select>
						</td>
						<td class="feature_description">
							Allows users to chat using the chatbox.
						</td>
					</tr>
					<tr>
						<td class="feature_name">No anonymous chat</td>
						<td>
							<input type="checkbox" name="no_anon_chat" value="1"{%if no_anon_chat%} checked{%endif%}>
						</td>
						<td class="feature_description">
							Prevent anonymous (unregistered) users from chatting. Registered users can always chat.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Change text color</td>
						<td>
							<select name="color_text">
								<option value="0"{%if color_text==0%} selected{%endif%}>anyone</option>
								<option value="1"{%if color_text==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if color_text==2%} selected{%endif%}>only me</option>
							</select>
						</td>
						<td class="feature_description">
							Change the color of your text.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Change cell background color</td>
						<td>
							<select name="color_cell">
								<option value="0"{%if color_cell==0%} selected{%endif%}>anyone</option>
								<option value="1"{%if color_cell==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if color_cell==2%} selected{%endif%}>only me</option>
								<option value="-1"{%if color_cell==-1%} selected{%endif%}>disabled</option>
							</select>
						</td>
						<td class="feature_description">
							Change the background color of a cell.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Show cursor to everyone</td>
						<td>
							<select name="show_cursor">
								<option value="0"{%if show_cursor==0%} selected{%endif%}>anyone</option>
								<option value="1"{%if show_cursor==1%} selected{%endif%}>me and members</option>
								<option value="2"{%if show_cursor==2%} selected{%endif%}>only me</option>
								<option value="-1"{%if show_cursor==-1%} selected{%endif%}>disabled</option>
							</select>
						</td>
						<td class="feature_description">
							Make your cursor visible to others.
						</td>
					</tr>
				</table>
				<input type="hidden" name="form" value="features">
				<input type="submit" value="Submit">
			</form>
		</div>
	</div>

	<div class="content_set">
		<div class="content_set_title">Style</div>
		<div class="content_set_content" id="world_style">
			<p class="set_description">
				Custom colors for your world.
			</p>
			<form method="POST" action="">
				<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrftoken }}" />
				<table class="config_table">
					<tr>
						<td class="feature_name">Text color</td>
						<td>
							<input name="color" value="{{ color }}" maxlength="20">
						</td>
						<td class="feature_description">
							Use any <a href="https://en.wikipedia.org/wiki/Web_colors">CSS color</a>, such as "#40E0D0".
							This only applies to black (#000000) text.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Text color (public areas)</td>
						<td>
							<input name="public_text_color" value="{{ public_text_color }}" maxlength="20">
						</td>
						<td class="feature_description">
							Public area text color.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Text color (member areas)</td>
						<td>
							<input name="member_text_color" value="{{ member_text_color }}" maxlength="20">
						</td>
						<td class="feature_description">
							Member area text color.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Text color (owner areas)</td>
						<td>
							<input name="owner_text_color" value="{{ owner_text_color }}" maxlength="20">
						</td>
						<td class="feature_description">
							Owner area text color.
						</td>
					</tr>
					<tr>
						<td class="feature_name">Cursor color</td>
						<td>
							<input name="cursor_color" value="{{ cursor_color }}" maxlength="20">
						</td>
						<td class="feature_description">
						</td>
					</tr>
					<tr>
						<td class="feature_name">Guest cursor color</td>
						<td>
							<input name="cursor_guest_color" value="{{ cursor_guest_color }}" maxlength="20">
						</td>
						<td class="feature_description">
						</td>
					</tr>
					<tr>
						<td class="feature_name">Background color</td>
						<td>
							<input name="bg" value="{{ bg }}" maxlength="20">
						</td>
						<td class="feature_description">
						</td>
					</tr>
					<tr>
						<td class="feature_name">Owner area color</td>
						<td>
							<input name="owner_color" value="{{ owner_color }}" maxlength="20">
						</td>
						<td class="feature_description"></td>
					</tr>
					<tr>
						<td class="feature_name">Member area color</td>
						<td>
							<input name="member_color" value="{{ member_color }}" maxlength="20">
						</td>
						<td class="feature_description"></td>
					</tr>
					<tr>
						<td class="feature_name">Menu color</td>
						<td>
							<input name="menu_color" value="{{ menu_color }}" maxlength="20">
						</td>
						<td class="feature_description"></td>
					</tr>
				</table>
				<input type="hidden" name="form" value="style">
				<input type="submit" value="Submit">
			</form>
		</div>
	</div>

	<div class="content_set">
		<div class="content_set_title">Color Palette</div>
		<div class="content_set_content">
			{% if color_palette_message %}
				<span style="font-size:80%"><i>{{ color_palette_message }}</i></span>
			{% endif %}
			<p class="set_description">
				Limited color palette for your world (max 300). Use color formats such as #04D3D3, #FE0, or rgb(4, 211, 211).
			</p>
			<form method="POST" action="">
				<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrftoken }}" />
				<div>
					<input type="checkbox" id="color_palette_enabled" name="color_palette_enabled"{%if color_palette_enabled%} checked{%endif%}>
					Use custom text color palette
				</div>
				<div>
					<input type="checkbox" id="bg_color_palette_enabled" name="bg_color_palette_enabled"{%if bg_color_palette_enabled%} checked{%endif%}>
					Use custom background color palette
				</div>
				
				<div style="display: flex">
					<fieldset>
						<legend>Text color list</legend>
						<table id="color_palette_table">
							<tbody>
								{% for color in color_palette %}
								<tr class="color_palette_value_row">
									<td>
										<button class="color_palette_rem" onclick="colorPaletteRemoveRow(event, 'fg')" type="button"><code>-</code></button>
									</td>
									<td>
										<input name="color_palette_value" value="{{color}}">
									</td>
								</tr>
								{% endfor %}
								<tr id="color_palette_add_row">
									<td>
										<button class="color_palette_add" onclick="colorPaletteAddRow('fg')" type="button"><code>+</code></button>
									</td>
									<td>
										<span>New text color</span>
									</td>
								</tr>
							</tbody>
						</table>
					</fieldset>

					<fieldset>
						<legend>Background color list</legend>
						<table id="bg_color_palette_table">
							<tbody>
								{% for color in bg_color_palette %}
								<tr class="bg_color_palette_value_row">
									<td>
										<button class="bg_color_palette_rem" onclick="colorPaletteRemoveRow(event, 'bg')" type="button"><code>-</code></button>
									</td>
									<td>
										<input name="bg_color_palette_value" value="{{color}}">
									</td>
								</tr>
								{% endfor %}
								<tr id="bg_color_palette_add_row">
									<td>
										<button class="bg_color_palette_add" onclick="colorPaletteAddRow('bg')" type="button"><code>+</code></button>
									</td>
									<td>
										<span>New background color</span>
									</td>
								</tr>
							</tbody>
						</table>
					</fieldset>
				</div>


				<input type="hidden" name="form" value="color_palette">
				<input type="submit" value="Submit">
			</form>
		</div>
	</div>

	<div class="content_set">
		<div class="content_set_title">Miscellaneous</div>
		<div class="content_set_content" id="misc">
			{% if misc_message %}
				<span style="font-size:80%"><i>{{ misc_message }}</i></span>
			{% endif %}
			<p class="set_description">
				Other features that may not meet the categories.
			</p>
			<form method="POST" action="" id="miscform">
				<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrftoken }}" />
				<p>
					Name of this world:
					<input name="new_world_name" value="{{ world }}">
				</p>
				{% if user.superuser %}
					<p>
						Current Background:
						<input name="world_background" value="{{ background_path }}">
					</p>
					<p>
						Background offset X:
						<input name="world_background_x" value="{{ background_x }}">
						<br>
						Background offset Y:
						<input name="world_background_y" value="{{ background_y }}">
					</p>
					<p>
						<span class="set_description">Use 0 to automatically find the width.</span>
						<br>
						Background Width:
						<input name="world_background_w" value="{{ background_w }}">
						<br>
						Background Height:
						<input name="world_background_h" value="{{ background_h }}">
					</p>
					<p>
						Background repeat mode:
						<select name="background_repeat_mode">
							<option value="0"{%if background_rmod==0%} selected{%endif%}>Tiled</option>
							<option value="1"{%if background_rmod==1%} selected{%endif%}>Center</option>
							<option value="2"{%if background_rmod==2%} selected{%endif%}>Singular</option>
						</select>
					</p>
					<p>
						<span class="set_description">Use -1 for no transparency</span>
						<br>
						Background Alpha Multiplier:
						<input name="background_alpha" value="{{ background_alpha }}">
					</p>
					<p>
						Default Script Path:
						<input name="default_script_path" value="{{ default_script_path }}">
					</p>
				{% endif %}
				<a href="javascript: showAdvancedMisc();" style="display: block; margin-bottom: 7px;">Advanced...</a>
				<div id="advanced" style="display: none; background-color: #EEEEEE; padding: 3px; margin-bottom: 4px;">
					<div>
						<b>Cell Dimensions</b>
						<div>
							<input type="radio" name="charsize" value="default"{%if !half_chars && !square_chars%} checked{%endif%}>
							Default (10x18)
						</div>
						<div>
							<input type="radio" name="charsize" value="square"{%if square_chars%} checked{%endif%}>
							Square (18x18)
						</div>
						<div>
							<input type="radio" name="charsize" value="half"{%if half_chars%} checked{%endif%}>
							Half (10x20)
						</div>
						<div>
							<input type="radio" name="charsize" value="mixed"{%if mixed_chars%} checked{%endif%}>
							Mixed (18x20)
						</div>
					</div>
					<div>
						<b>Write Interval</b>
						<div>
							<input type="radio" name="writeinterval" value="66">
							1/15 seconds
						</div>
						<div>
							<input type="radio" name="writeinterval" value="500">
							1/2 seconds
						</div>
						<div>
							<input type="radio" name="writeinterval" value="1000">
							1 second (default)
						</div>
						<div>
							<input type="radio" name="writeinterval" value="2000">
							2 seconds
						</div>
						<div>
							<input type="radio" name="writeinterval" value="custom" checked>
							Custom:
							<input name="writeinterval_val" id="writeinterval_val" style="width:60px" value="{{writeinterval_val}}"> ms
						</div>
					</div>
					<div>
						<b>Meta Description</b>
						<br><textarea name="meta_desc" style="width: 400px; height: 32px;" maxlength="600">{{meta_desc}}</textarea>
					</div>
					<div>
						<b>Private World Note</b>
						<br><textarea name="priv_note" style="width: 400px; height: 32px;" maxlength="600">{{priv_note}}</textarea>
					</div>
					<div>
						<b>Options</b>
						<br>
						<div>
							<input name="nsfw_page" type="checkbox"{%if page_is_nsfw%} checked{%endif%}>
							This page is NSFW
						</div>
						<div>
							<input name="no_log_edits" type="checkbox"{%if no_log_edits%} checked{%endif%}>
							Do not log edits
						</div>
						<div>
							<input name="no_chat_global" type="checkbox"{%if no_chat_global%} checked{%endif%}>
							Disable Global tab in chat
						</div>
						<div>
							<input name="no_copy" type="checkbox"{%if no_copy%} checked{%endif%}>
							Limit text copying
						</div>
					</div>
					<div>
						<b>Rate Limit</b>
						<div>
							<input type="radio" name="ratelim" id="rl_0" value="off">
							Disabled
						</div>
						<div>
							<input type="radio" name="ratelim" id="rl_512" value="p512">
							512 characters per second
						</div>
						<div>
							<input type="radio" name="ratelim" id="rl_32" value="p32">
							32 characters per second
						</div>
						<div>
							<input type="radio" name="ratelim" id="rl_x" value="custom">
							Custom:
							<input id="ratelim_val" name="ratelim_val" value="{{ratelim_val}}" style="width: 60px;">
							per
							<input id="ratelim_per" name="ratelim_per" value="{{ratelim_per}}" style="width: 60px;">
							ms 
						</div>
					</div>
					<div>
						<b>Membership Key</b>
						<br>
						<div>
							<input id="memkey_enabled" name="memkey_enabled" type="checkbox"{%if is_memkey_enabled%} checked{%endif%}>
							Enabled
						</div>
						<div>
							Key:
							<input id="memkey_value" name="memkey_value" type="input" maxlength="64" value={{memkey_value}}>
						</div>
					</div>
				</div>
				<input type="hidden" name="form" value="misc">
				<input type="submit" value="Submit">
			</form>
		</div>
	</div>

	<div class="content_set">
		<div class="content_set_title">Members</div>
		<div class="content_set_content">
			{% if members %}
				<ul>
					<form method="POST" action="">
						<div style="display:none"><input type="hidden" name="csrfmiddlewaretoken" value="{{ csrftoken }}" /></div>
						<input type="hidden" name="form" value="remove_member">
						{% for member in members %}
							<li>{{ member.member_name }} <input type="submit" name="remove_{{ member.member_name }}" value="Remove {{ member.member_name }}">
						{% endfor %}
					</form>
				</ul>
			{% else %}
				<span style="margin-left:1em">None</span>
			{% endif %}
			{% if add_member_message %}<div><i>{{ add_member_message }}</i></div>{% endif %}
			<div style="margin-top:.3em">
				<form method="POST" action="">
					<div style="display:none"><input type="hidden" name="csrfmiddlewaretoken" value="{{ csrftoken }}" /></div>
					<label for="choose_member">Add a member: </label>
					<input id="choose_member" type="text" name="add_member" value="">
					<input type="hidden" name="form" value="add_member">
					<input type="submit" value="Submit">
				</form>
			</div>
		</div>
	</div>

	<div class="content_set">
		<div class="content_set_title">Download Your World</div>
		<div class="content_set_content">
			<span style="margin-left:1em"><a href="/accounts/download/{{ world }}/">Download</a></span>
		</div>
	</div>

	<form method="POST" action="" id="action_form" onsubmit="return action_confirm();">
		<input type="hidden" name="form" value="action">
		<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrftoken }}" />
		<table>
			<tbody>
				<tr>
					<td>
						<button name="unclaim" class="action_btn" id="unclaim">Unclaim this world</button>
					</td>
					<td class="action_desc">
						Give up ownership of this world.
					</td>
				</tr>
				<tr>
					<td>
						<button name="clear_public" class="action_btn" id="clear_public">Clear all public areas</button>
					</td>
					<td class="action_desc">
						Clear all areas that are public (areas anyone can edit, regardless of rank). Text in protected areas will remain.
					</td>
				</tr>
				<tr>
					<td>
						<button name="clear_all" class="action_btn" id="clear_all">Clear everything</button>
					</td>
					<td class="action_desc">
						Clear the entire world. All text will be completely gone including protected areas.
					</td>
				</tr>
				<tr>
					<td>
						<button name="clear_chat_hist" class="action_btn" id="clear_chat_hist">Clear chat history</button>
					</td>
				</tr>
			</tbody>
		</table>
	</form>
{% endblock %}
{% block endbody %}
<script type="text/javascript" src="/static/autocomplete.js"></script>
<script type="text/javascript">
	autocomplete({
		element: document.getElementById("choose_member"),
		url: "/accounts/member_autocomplete/",
		delay: 50
	});
</script>
{% endblock %}