{% if permissions.alert_user or permissions.ban_user or permissions.manage_user or permissions.reset_user %}
<div class="modal fade" id="allModal" tabindex="-1" role="dialog" aria-labelledby="allModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Manage User</h4>
			</div>

			<div class="modal-body" style="text-align: center">
				{% if permissions.alert_user %}
				<button type="button" class="btn btn-success" data-toggle="modal" data-target="#alertModal" data-username="">Alert</button>
				{%endif %}
				{% if permissions.ban_user %}
				<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#banModal" data-username="">Ban</button>
				{%endif %}
				{% if permissions.reset_user %}
				<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#resetModal" data-username="">Reset</button>
				{% endif %}
				{% if permissions.manage_user %}
				<button type="button" class="btn btn-info" data-toggle="modal" data-target="#checkModal" data-username="">Check</button>
				{% endif %}
				<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
			</div>


		</div>
	</div>
</div>
<script>
	var targetName;

	$('#allModal').on('show.bs.modal', function (event) {
		const modal = $(this),
				button = $(event.relatedTarget),
				username = button.data('username');

		targetName = username;

		modal.find(".modal-body input[name=username]").val(username);
	});
</script>
{% endif %}
{% if permissions.alert_user %}
<div class="modal fade" id="alertModal" tabindex="-1" role="dialog" aria-labelledby="alertModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Alert User</h4>
			</div>

			<form action="{{hkpath}}/api/alert" method="post">
				<div class="modal-body">
					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="username" class="form-control" placeholder="Username..." required>

					</div>

					<div class="form-group">
						<select name="reason" class="form-control" required>
							{% for row in alert_messages %}
							<option value="{{row.id}}">{{row.title}}</option>
							{% endfor %}
						</select>
					</div>

					<div class="form-group">
						<select name="action" class="form-control" required>
							<option value="0">None</option>
							<option value="1">Disconnect</option>
							<option value="2">Kick</option>
							<option value="3">Mute</option>
						</select>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-success">Alert User</button>
				</div>
			</form>
		</div>
	</div>
</div>
<script>
	$('#alertModal').on('show.bs.modal', function() {
		const modal = $(this);

		modal.find(".modal-body input[name=username]").val(targetName);
	});
</script>
{% endif %}

{% if permissions.ban_user %}
<div class="modal fade" id="banModal" tabindex="-1" role="dialog" aria-labelledby="banModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Ban User</h4>
			</div>

			<form action="{{hkpath}}/api/ban" method="post">
				<div class="modal-body">
					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="username" class="form-control" placeholder="Username..." required>
					</div>

					<div class="form-group">
						<select name="reason" class="form-control" required>
							{% for row in ban_messages %}
							<option value="{{row.id}}">{{row.message}}</option>
							{% endfor %}
						</select>
					</div>

					<div class="form-group">
						<select name="expire" class="form-control" required>
							{% for row in ban_types %}
							<option value="{{row.id}}">{{row.message}}</option>
							{% endfor %}
						</select>
					</div>

					<div class="form-group">
						<select name="type" class="form-control" required>
							<option value="user">User Ban</option>
							<option value="ip">IP Ban</option>
						</select>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-danger">Ban User</button>
				</div>
			</form>
		</div>
	</div>
</div>
<script>
	$('#banModal').on('show.bs.modal', function() {
		const modal = $(this);

		modal.find(".modal-body input[name=username]").val(targetName);
	});
</script>
{% endif %}

{% if permissions.manage_user %}
<div class="modal fade" id="checkModal" tabindex="-1" role="dialog" aria-labelledby="banModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Check User</h4>
			</div>

			<form action="{{hkpath}}/manage" method="post">
				<div class="modal-body">
					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="username" class="form-control tagsinput" placeholder="Username..." data-role="tagsinput" required>
					</div>

					<div class="form-group">
						<select name="action" class="form-control" required>
							<option value="all">All Info</option>
							<option value="chatlogs">Chat logs</option>
							{% if player.rank > 4 %}
							<option value="clonelogs">Clone logs</option>
							{% endif %}
							{% if player.rank > 4 %}
							<option value="emaillogs">Mail Logs</option>
							{% endif %}
							<option value="namelogs">Name Logs</option>
							<option value="stafflogs">Sanctie logs</option>
							<option value="tradelogs">Trade logs</option>

						</select>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-info">Check User</button>
				</div>
			</form>
		</div>
	</div>
</div>
<script>
	$('#checkModal').on('show.bs.modal', function() {
		const modal = $(this);

		modal.find('.tagsinput').tagsinput('add', targetName);

		$('#allModal').modal('hide');
	});
</script>
{% endif %}

{% if permissions.reset_user %}
<div class="modal fade" id="resetModal" tabindex="-1" role="dialog" aria-labelledby="resetModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Reset User</h4>
			</div>

			<form action="{{hkpath}}/api/reset" method="post">
				<div class="modal-body">
					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="username" class="form-control" placeholder="Username..." required>
					</div>

					<div class="form-group">
						<select name="action" class="form-control" required>
							<option value="figure">Figure</option>
							<option value="motto">Motto</option>
							<option value="relationships">Relationships</option>
						</select>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Reset User</button>
				</div>
			</form>
		</div>
	</div>
</div>
<script>
	$('#resetModal').on('show.bs.modal', function() {
		const modal = $(this);

		modal.find(".modal-body input[name=username]").val(targetName);
	});
</script>
{% endif %}

{% if page == "news" %}
{% if permissions.news %}
<style>
.file {
	visibility: hidden;
	position: absolute
}
</style>
<div class="modal fade" id="createModal" tabindex="-1" role="dialog" aria-labelledby="createModalLabel"
	 aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Create News</h4>
			</div>

			<form action="{{hkpath}}/news/create" method="post" id="image-form" enctype="multipart/form-data">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputTitle">Title</label>
						<input type="text" name="title" class="form-control" id="inputTitle">
					</div>

					<div class="form-group">
						<input type="file" name="header" class="file" accept="image/*">
						<div class="input-group my-3">
							<input type="text" class="form-control" disabled placeholder="Image..." id="file">
							<div class="input-group-append">
								<button type="button" class="browse btn btn-primary">Browse</button>
							</div>
						</div>

						<img src="https://placehold.it/1000X250" id="preview" class="img-thumbnail">
					</div>

					<div class="form-group">
						<label for="inputHeaderColor">Header Color (<i>not required</i>!)</label>
						<input type="text" name="header_color" placeholder="#4caf50" class="form-control" id="inputHeaderColor">
					</div>

					<div class="form-group">
						<label for="inputHeaderImage">Header Image (<i>not required</i>!)</label>
						<input type="text" name="header_image" class="form-control" id="inputHeaderImage">
					</div>

					<div class="form-group">
						<label for="inputShortStory">Short Story</label>
						<input type="text" name="short_story" class="form-control" id="inputShortStory">
					</div>

					<div class="form-group">
						<label for="inputFullStory">Full Story</label>
						<textarea id="inputFullStory" class="form-control" name="full_story" style="height: 200px;"></textarea>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
					<input type="submit" class="btn btn-primary" value="Create Article" />
				</div>
			</form>
		</div>
	</div>
</div>
<script>
$(document).on("click", ".browse", function() {
	var file = $(this)
			.parent()
			.parent()
			.parent()
			.find(".file");
	file.trigger("click");
});
$('input[type="file"]').change(function(e) {
	var fileName = e.target.files[0].name;
	$("#file").val(fileName);

	var reader = new FileReader();
	reader.onload = function(e) {
		// get loaded data and render thumbnail.
		document.getElementById("preview").src = e.target.result;
	};
	// read the image file as a data URL.
	reader.readAsDataURL(this.files[0]);
});

$(document).on('focusin', function(e) {
  if ($(e.target).closest(".mce-window").length) {
    e.stopImmediatePropagation();
  }
});
</script>
{% endif %}
{% endif %}

{% if permissions.vpn %}
{% if page == "vpn" %}
<div class="modal fade" id="ipBlockModal" tabindex="-1" role="dialog" aria-labelledby="ipBlockModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Ban by IP Address</h4>
			</div>

			<form action="{{hkpath}}/vpn/ip/add" method="post">
				<div class="modal-body">
					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="ip_address" class="form-control" placeholder="IP Address..." required>
					</div>

					<div class="form-group">
						<input type="text" name="host" class="form-control" placeholder="Host (not required)...">
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Ban VPN</button>
				</div>
			</form>
		</div>
	</div>
</div>

<div class="modal fade" id="userBlockModal" tabindex="-1" role="dialog" aria-labelledby="userBlockModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Ban by Username</h4>
			</div>

			<form action="{{hkpath}}/vpn/user/add" method="post">
				<div class="modal-body">
					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="username" class="form-control" placeholder="Username..." required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Ban VPN</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "notes" %}
{% if permissions.notes %}
<div class="modal fade" id="newNoteModal" tabindex="-1" role="dialog" aria-labelledby="newNoteModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Notification</h4>
			</div>

			<form action="{{hkpath}}/notes/add" method="post">
				<div class="modal-body">
					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="username" class="form-control" placeholder="Username..." required>
					</div>

					<div class="form-group">
						<input type="text" name="message" class="form-control" placeholder="Note...">
					</div>

					<div class="form-group">
						<select name="type" class="form-control" required>
							<option value="PRIVATE">PRIVATE</option>
							<option value="PUBLIC">PUBLIC</option>
						</select>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add Note</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "polls" or page == "edit" %}
{% if permissions.polls %}
<style>
	.bootstrap-tagsinput input {
		width: 100% !important;
		padding: 0 0 !important;
	}
</style>
<div class="modal fade" id="createNewsPollModal" tabindex="-1" role="dialog" aria-labelledby="createNewsPollModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Create Poll</h4>
			</div>

			<form action="{{hkpath}}/polls/create" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputQuestion">Question</label>
						<input type="text" name="question" class="form-control" id="inputQuestion">
					</div>

					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="options" class="form-control tagsinput" placeholder="Options" data-role="tagsinput">
					</div>

					<div class="form-group">
						<label for="typeSelect">Type</label>
						<select name="type" class="form-control" id="typeSelect">
							<option value="text">Text</option>
							<option value="textarea">Textarea</option>
							<option value="list">List</option>
							<option value="options">Options</option>
							<option value="3digit">Digits</option>
						</select>
					</div>

					<div class="form-group">
						<label for="newsSelect">News Article</label>
						<select name="news_id" class="form-control" id="newsSelect">
							{% for row in data.news %}
							<option value="{{row.id}}">{{row.title}}</option>
							{% endfor %}
						</select>
					</div>

					<div class="form-group">
						<label for="timeInput">Expire</label>
						<input name="expire" class="form-control" type="datetime-local" value="{{date().timestamp|date("Y-m-d")}}T{{date().timestamp|date("H:i:s")}}" id="timeInput">
					</div>

					<hr>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
					<input type="submit" class="btn btn-primary" value="Create Poll" />
				</div>
			</form>
		</div>
	</div>
</div>

<div class="modal fade" id="createRoomPollModal" tabindex="-1" role="dialog" aria-labelledby="createRoomPollModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Create Room Poll</h4>
			</div>

			<form action="{{hkpath}}/polls/create" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputTitle">Title</label>
						<input type="text" name="title" class="form-control" id="inputTitle">
					</div>

					<div class="collapse" id="collapseExample">
						<hr>

						<div class="form-group">
							<label for="inputShortStory">Form Title</label>
							<input type="text" name="form_title" class="form-control" id="inputFormTitle">
						</div>

						<div class="form-group">
							<label for="inputShortStory">Form Type</label>
							<input type="text" name="form_title" class="form-control" id="inputFormType">
						</div>
					</div>
				</div>

				<div class="modal-footer">
					<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
						Add Form
					</button>

					<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
					<input type="submit" class="btn btn-primary" value="Create Poll" />
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "wordfilter" %}
{% if permissions.wordfilter %}
<div class="modal fade" id="addWordModal" tabindex="-1" role="dialog" aria-labelledby="addWordModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Wordfilter</h4>
			</div>

			<form action="{{hkpath}}/wordfilter/add" method="post">
				<div class="modal-body">
					<div class="form-group input-group">
						<span class="input-group-addon">@</span>

						<input type="text" name="word" class="form-control" placeholder="Word..." required>
					</div>

					<div class="form-group">
						<label for="isStrictLabel">Is strict</label>
						<select name="is_strict" id="isStrictLabel" class="form-control" required>
							<option value="1">Yes</option>
							<option value="0">No</option>
						</select>
					</div>

					<div class="form-group">
						<label for="isSeparateLabel">Is separate</label>
						<select name="is_separate" id="isSeparateLabel" class="form-control" required>
							<option value="0">No</option>
							<option value="1">Yes</option>
						</select>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "quests" %}
{% if permissions.quests %}
<div class="modal fade" id="addQuest" tabindex="-1" role="dialog" aria-labelledby="addQuestModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Quests</h4>
			</div>

			<form action="{{hkpath}}/quests/add" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputTitle">Title</label>
						<input type="text" name="title" class="form-control" id="inputTitle" required>
					</div>

					<div class="form-group">
						<label for="inputDescription">Description</label>
						<input type="text" name="description" class="form-control" id="inputDescription" required>
					</div>

					<div class="form-group">
						<label for="inputBadge">Badge</label>
						<input type="text" name="badge" class="form-control" id="inputBadge" required>
					</div>

					<div class="form-group">
						<label for="inputBadge">Points</label>
						<input type="number" name="points" class="form-control" id="inputPoints" placeholder="0" required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>

<div class="modal fade" id="addQuestStore" tabindex="-1" role="dialog" aria-labelledby="addQuestStoreModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Quests Item</h4>
			</div>

			<form action="{{hkpath}}/quests/addItem" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputTitle">Title</label>
						<input type="text" name="title" class="form-control" id="inputTitle" required>
					</div>

					<div class="form-group">
						<label for="inputDescription">Description</label>
						<input type="text" name="description" class="form-control" id="inputDescription" required>
					</div>

					<div class="form-group">
						<label for="inputCurrency">Currency</label>
						<select class="form-control" name="currency" id="inputCurrency">
							<option value="badges">Badges</option>
							<option value="furni">Furni</option>
							<option value="score">Score</option>
						</select>
					</div>

					<div class="form-group">
						<label for="inputValue">Value</label>
						<input type="text" name="value" class="form-control" id="inputValue" placeholder="Badge, FurniID or Score Amount" required>
					</div>

					<div class="form-group">
						<label for="inputPoints">Points</label>
						<input type="number" name="points" class="form-control" id="inputPoints" placeholder="0" required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "help" or page == "help_edit" %}
{% if permissions.helptool %}
<div class="modal fade" id="addFAQ" tabindex="-1" role="dialog" aria-labelledby="addFAQModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add FAQ</h4>
			</div>

			<form action="{{hkpath}}/helptool/add" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputTitle">Title</label>
						<input type="text" name="title" class="form-control" id="inputTitle" required>
					</div>

					<div class="form-group">
						<label for="inputCategory">Category</label>
						<select class="form-control" name="category" id="inputCategory">
							{% for row in data.categories %}
							<option value="{{row.id}}">{{row.category}}</option>
							{% endfor %}
						</select>
					</div>

					<div class="form-group">
						<label for="inputMessage">Message</label>
						<textarea id="inputMessage" class="form-control" name="desc" style="height: 200px;">{{data.faq.desc}}</textarea>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>

<script src="https://cloud.tinymce.com/stable/tinymce.min.js?apiKey=ximwo5y97dtfrnc60p0d3bt43tgla29a83es2owf5uwib1v2"></script>
<script>
	tinymce.init({
		selector: '#inputMessage',
		plugins: "advlist autolink lists link image charmap print preview hr anchor pagebreak searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking save table contextmenu directionality emoticons template paste textcolor colorpicker textpattern imagetools codesample",
		statusbar: true,
		menubar: true,
		toolbar: "undo redo | insert | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
	});
</script>
{% endif %}
{% endif %}

{% if page == 'help_categories' %}
{% if permissions.helptool %}
<div class="modal fade" id="addCategory" tabindex="-1" role="dialog" aria-labelledby="addCategoryModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add FAQ Category</h4>
			</div>

			<form action="{{hkpath}}/helptool/categories/add" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputCategory">Category</label>
						<input type="text" name="category" class="form-control" id="inputCategory" required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "rooms" %}
{% if permissions.manage_rooms %}
<div class="modal fade" id="addRoom" tabindex="-1" role="dialog" aria-labelledby="addRoomModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Public Room</h4>
			</div>

			<form action="{{hkpath}}/rooms/add" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputTitle">Caption</label>
						<input type="text" name="caption" class="form-control" id="inputCaption" placeholder="Welcome Lounge" required>
					</div>

					<div class="form-group">
						<label for="inputRoomId">Room ID</label>
						<input type="number" name="room_id" class="form-control" id="inputRoomId" placeholder="0" required>
					</div>

					<div class="form-group">
						<label for="inputTitle">Image URL</label>
						<input type="text" name="image_url" class="form-control" id="inputImage" placeholder="reception/***" required>
					</div>

					<div class="form-group">
						<label for="inputOrderNum">Order Num</label>
						<input type="number" name="order_num" class="form-control" id="inputOrderNum" placeholder="0" required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>

<div class="modal fade" id="searchRoomId" tabindex="-1" role="dialog" aria-labelledby="searchRoomIdModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Search Room by ID</h4>
			</div>

			<form action="{{hkpath}}/rooms/search/id" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputRoomId">Room ID</label>
						<input type="number" name="room_id" class="form-control" id="inputRoomId" placeholder="0" required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Search</button>
				</div>
			</form>
		</div>
	</div>
</div>

<div class="modal fade" id="searchRoomOwner" tabindex="-1" role="dialog" aria-labelledby="searchRoomOwnerModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Search Room by Owner</h4>
			</div>

			<form action="{{hkpath}}/rooms/search/owner" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputRoomId">Username</label>
						<input type="text" name="room_owner" class="form-control" id="inputRoomOwner" placeholder="Username..." required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Search</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "fansites" %}
{% if permissions.fansites %}
<div class="modal fade" id="addFansite" tabindex="-1" role="dialog" aria-labelledby="addFansiteModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Fansite</h4>
			</div>

			<form action="{{hkpath}}/fansites/add" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputTitle">Name</label>
						<input type="text" name="name" class="form-control" id="inputName" maxlength="50" required>
					</div>

					<div class="form-group">
						<label for="inputUrl">URL</label>
						<input type="text" name="url" class="form-control" id="inputUrl" placeholder="{{path}}" maxlength="255" required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "locale" %}
{% if permissions.locale %}
<div class="modal fade" id="addReasonAlert" tabindex="-1" role="dialog" aria-labelledby="addReasonAlertModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Alert Reason</h4>
			</div>

			<form action="{{hkpath}}/locale/alert/add" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputTitle">Title</label>
						<input type="text" name="title" class="form-control" id="inputTitle" placeholder="Unacceptable" maxlength="100" required>
					</div>

					<div class="form-group">
						<label for="inputMessage">Message</label>
						<input type="text" name="message" class="form-control" id="inputMessage" placeholder="Unacceptable to the Hotel Management..." maxlength="150" required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>

<div class="modal fade" id="addReasonBan" tabindex="-1" role="dialog" aria-labelledby="addReasonBanModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Ban Reason</h4>
			</div>

			<form action="{{hkpath}}/locale/ban/add" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputMessage">Message</label>
						<input type="text" name="message" class="form-control" id="inputMessage" placeholder="Username in violation of the Rules...." maxlength="150" required>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "badges" %}
{% if permissions.badges %}
<style>
	.file, #file {
		visibility: hidden;
		position: absolute
	}
</style>
<div class="modal fade" id="addBadge" tabindex="-1" role="dialog" aria-labelledby="addBadgeModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Badge</h4>
			</div>

			<form action="{{hkpath}}/badges/add" method="post" id="image-form" enctype="multipart/form-data">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputName">Title</label>
						<input type="text" name="title" class="form-control" id="inputName" placeholder="We love you! ..." maxlength="35" required>
					</div>

					<div class="form-group">
						<label for="inputDescription">Description</label>
						<input type="text" name="description" class="form-control" id="inputDescription" placeholder="Just because we love you <3..." maxlength="75" required>
					</div>

					<div class="form-group">
						<input type="file" name="badge" class="file" accept="image/*">
						<div class="input-group my-3">
							<input type="text" class="form-control" disabled placeholder="Image..." id="file">
							<div class="input-group-append">
								<button type="button" class="browse btn btn-primary">Browse</button>
							</div>
						</div>

						<img src="{{cpath}}/c_images/album1584/ADM.gif" id="preview" class="img-thumbnail">
						<strong>40x40 (.png or .gif)</strong>
					</div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>
<script>
	$(document).on("click", ".browse", function() {
		var file = $(this)
				.parent()
				.parent()
				.parent()
				.find(".file");
		file.trigger("click");
	});
	$('input[type="file"]').change(function(e) {
		var fileName = e.target.files[0].name;
		$("#file").val(fileName);

		var reader = new FileReader();
		reader.onload = function(e) {
			// get loaded data and render thumbnail.
			document.getElementById("preview").src = e.target.result;
		};
		// read the image file as a data URL.
		reader.readAsDataURL(this.files[0]);
	});

	$(document).on('focusin', function(e) {
		if ($(e.target).closest(".mce-window").length) {
			e.stopImmediatePropagation();
		}
	});
</script>
{% endif %}
{% endif %}
{% if page == "badges_edit" %}
{% if permissions.badges %}
<div class="modal fade" id="deleteBadge" tabindex="-1" role="dialog" aria-labelledby="deleteBadgeModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Are you sure?</h4>
			</div>

			<form action="{{hkpath}}/badges/delete" method="post">
				<div class="modal-body">
					Do you want to delete the badge: <strong>{{data.badge.code}}</strong>?
				</div>

				<div class="modal-footer">
					{% if data.badge.count %}
					<div class="checkbox float-left">
						<label>
							<input type="checkbox" name="delete" value="1">Delete badge for <strong>{{data.badge.count}}</strong> players
						</label>
					</div>
					{% endif %}

					<input type="hidden" name="badge_code" value="{{data.badge.code}}">

					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-danger">Delete</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}
{% if page == "catalog" %}
{% if permissions.manage_catalog %}
<div class="modal fade" id="addCatalogPage" tabindex="-1" role="dialog" aria-labelledby="addCatalogPageModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Catalog Page</h4>
			</div>

			<form method="post" action="{{hkpath}}/catalog/page/save">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputName">Page Name</label>
						<input type="text" name="caption" class="form-control" id="inputName" placeholder="Catalog..." maxlength="100" required>
					</div>

					<div class="form-group">
						<label for="inputTexts">Page Texts</label>
						<input type="text" name="page_texts" class="form-control" id="inputTexts" maxlength="2000">
					</div>

					<div class="form-group">
						<label for="inputImages">Page Images</label>
						<input type="text" name="page_images" class="form-control" id="inputImages" maxlength="2000">
					</div>

					<div class="form-group">
						<label for="inputParent">Page</label>
						<select name="parent_id" class="form-control" id="inputParent">
							{% for row in data.catalog_pages %}
							<option value="{{row.id}}">{{row.id}} - {{row.caption}}</option>
							{% endfor %}
						</select>
					</div>

					<div class="form-group">
						<label for="inputRank">Rank</label>
						<select name="min_rank" class="form-control" id="inputRank">
							{% for row in data.ranks %}
							<option value="{{row.id}}">{{row.id}} - {{row.name}}</option>
							{% endfor %}
						</select>
					</div>

					<div class="form-group">
						<label for="inputPageLayout">Page Layout</label>
						<select name="page_layout" class="form-control" id="inputPageLayout">
							<option value="default_3x3">Default</option>
							<option value="badge_display">Badge Display</option>
							<option value="bots">Bots</option>
							<option value="frontpage4">Frontpage</option>
							<option value="guild_custom_furni">Group Furni</option>
							<option value="guild_forum">Group Forum</option>
							<option value="guild_frontpage">Group Frontpage</option>
							<option value="info_duckets">Info page (Duckets)</option>
							<option value="info_loyalty">Info page (Loyalty)</option>
							<option value="pets">Pets 1</option>
							<option value="pets2">Pets 2</option>
							<option value="roomads">Room Ads</option>
							<option value="single_bundle">Single Bundle</option>
							<option value="soundmachine">Soundmachine</option>
							<option value="spaces_new">Spaces</option>
							<option value="trophies">Trophies</option>
						</select>
					</div>

					<div class="form-group">
						<div class="row">
							<div class="col-xs-4">
								<label>Icon</label>
								<input type="number" name="icon_image" class="form-control" placeholder="1" required>
							</div>

							<div class="col-xs-4">
								<label>Order Num</label>
								<input type="number" name="order_num" class="form-control" placeholder="1" required>
							</div>

							<div class="col-xs-4">
								<label>Enabled</label>
								<select name="enabled" class="form-control" id="inputEnabled">
									<option value="1">Yes</option>
									<option value="0">No</option>
								</select>
							</div>
						</div>
					</div>

					<div class="form-group">
						<div class="row">
							<div class="col-xs-3">
								<label>VIP Only</label>
								<select name="vip_only" class="form-control" id="inputVipOnly">
									<option value="0">No</option>
									<option value="1">Yes</option>
								</select>
							</div>

							<div class="col-xs-3">
								<label>Builder Team Only</label>
								<select name="builder_only" class="form-control" id="inputBuilderOnly">
									<option value="0">No</option>
									<option value="1">Yes</option>
								</select>
							</div>

							<div class="col-xs-3">
								<label>Flash</label>
								<select name="nitro_only" class="form-control" id="inputNitroOnly">
									<option value="0">Yes</option>
									<option value="1">No</option>
								</select>
							</div>

							<div class="col-xs-3">
								<label>BETA</label>
								<select name="is_nitro" class="form-control" id="inputIsNitro">
									<option value="1">Yes</option>
									<option value="0">No</option>
								</select>
							</div>
						</div>
					</div>

					<div class="box-footer">
						<input type="hidden" name="page_id" value="0">
						<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
						<button type="submit" class="btn btn-info pull-right">Add</button>
					</div>
				</div>
			</form>
		</div>
	</div>
</div>

<div class="modal fade" id="addCatalogItem" tabindex="-1" role="dialog" aria-labelledby="addCatalogItemModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title">Add Catalog Item</h4>
			</div>

			<form action="{{hkpath}}/catalog/item/save" method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="inputName">Name</label>
						<input type="text" name="public_name" class="form-control" id="inputName" placeholder="Typingmachine" maxlength="100" required>
					</div>

					<div class="form-group">
						<label for="inputDescription">Description</label>
						<input type="text" name="public_description" class="form-control" id="inputDescription" placeholder="Write your best sellers here" maxlength="100">
					</div>

					<div class="form-group">
						<label for="inputSWF">SWF</label>
						<input type="text" name="item_name" class="form-control" id="inputSWF" placeholder="typingmachine" maxlength="100" required>
					</div>

					<div class="form-group">
						<label for="inputParent">Page</label>
						<select name="page_id" class="form-control" id="inputParent">
							{% for row in data.catalog_pages %}
							<option value="{{row.id}}"{% if row.id == data.page_id %} selected{% endif %}>{{row.caption}}</option>
							{% endfor %}
						</select>
					</div>

					<div class="form-group">
						<div class="row">
							<div class="col-xs-3">
								<label>Credits</label>
								<input type="number" name="cost_credits" class="form-control" value="1" required>
							</div>
							<div class="col-xs-3">
								<label>Duckets</label>
								<input type="number" name="cost_pixels" class="form-control" value="0" required>
							</div>
							<div class="col-xs-3">
								<label>Diamonds</label>
								<input type="number" name="cost_diamonds" class="form-control" value="0" required>
							</div>
							<div class="col-xs-3">
								<label>Bel-Credits</label>
								<input type="number" name="cost_belcredits" class="form-control" value="0" required>
							</div>
						</div>
					</div>

					<div class="form-group">
						<div class="row">
							<div class="col-xs-6">
								<label for="inputActiveOffer">Buy Multiple in Catalog?</label>
								<select name="offer_active" class="form-control" id="inputActiveOffer">
									<option value="1">Yes</option>
									<option value="0">No</option>
								</select>
							</div>
							<div class="col-xs-6">
								<label for="inputActiveOffer">Buy button when click on furni?</label>
								<select name="offer_button" class="form-control" id="inputFlatOffer">
									<option value="1">Yes</option>
									<option value="0">No</option>
								</select>
							</div>
						</div>
					</div>

					<div class="form-group">
						<div class="row">
							<div class="col-xs-6">
								<label for="inputType">Item Type</label>
								<select name="type" class="form-control" id="inputType">
									<option value="s">Floor Item</option>
									<option value="i">Wall Item</option>
									<option value="r">Bot</option>
								</select>
							</div>

							<div class="col-xs-6">
								<label for="inputInteractionType">Interaction Type</label>
								<select name="interaction_type" class="form-control" id="inputInteractionType">
									<option value="default">default</option>
									<option value="bed">bed</option>
									<option value="teleport">teleport</option>
									<option value="trophy">trophy</option>
									<option value="roller">roller</option>
									<option value="gate">gate</option>
									<option value="ball">ball</option>
									<option value="dice">dice</option>
									<option value="gift">gift</option>
									<option value="bottle">bottle</option>
									<option value="postit">postit</option>
									<option value="scoreboard">scoreboard</option>
									<option value="pest_nest">pet_nest</option>
									<option value="pet_food">pet_food</option>
									<option value="pet_toy">pet_toy</option>
									<option value="pet_food">pet_food</option>
									<option value="horse_jump">horse_jump</option>
									<option value="wf_pressureplate">wf_pressureplate</option>
									<option value="pressureplate_seat">pressureplate_seat</option>
									<option value="adjustable_height">adjustable_height</option>
									<option value="loveshuffler">loveshuffler</option>
									<option value="vendingmachine">vendingmachine</option>
								</select>
							</div>
						</div>
					</div>

					<div class="form-group">
						<div class="row">
							<div class="col-xs-3">
								<label>Width</label>
								<input type="number" name="width" class="form-control" value="1" required>
							</div>
							<div class="col-xs-3">
								<label>Length</label>
								<input type="number" name="length" class="form-control" value="1" required>
							</div>
							<div class="col-xs-3">
								<label>Stack Height</label>
								<input type="number" name="stack_height" class="form-control" value="0" required>
							</div>
							<div class="col-xs-3">
								<label>Interaction Count</label>
								<input type="number" name="interaction_modes_count" class="form-control" value="1" required>
							</div>
						</div>
					</div>

					<div class="form-group">
						<div class="row">
							<div class="col-xs-4">
								<label for="inputCanSit">Can Sit</label>
								<select name="can_sit" class="form-control" id="inputCanSit">
									<option value="0">No</option>
									<option value="1">Yes</option>
								</select>
							</div>
							<div class="col-xs-4">
								<label for="inputCanStack">Can Stack</label>
								<select name="can_stack" class="form-control" id="inputCanStack">
									<option value="0">No</option>
									<option value="1">Yes</option>
								</select>
							</div>
							<div class="col-xs-4">
								<label for="inputIsWalkable">Is Walkable</label>
								<select name="is_walkable" class="form-control" id="inputIsWalkable">
									<option value="0">No</option>
									<option value="1">Yes</option>
								</select>
							</div>
						</div>
					</div>
				</div>

				<div class="modal-footer">
					<input type="hidden" name="item_id" value="0">

					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="submit" class="btn btn-primary">Add</button>
				</div>
			</form>
		</div>
	</div>
</div>
{% endif %}
{% endif %}