<!DOCTYPE html>
<html lang="en">
<head>
	<meta name="description" content="{{'DESCRIPTION' | app_config}}">
		<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline'; connect-src 'self'; object-src 'none';">

		<script src="/static/assets/js/bootstrap.js?a=3"></script>

		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

		<meta name="author" content="">
		<link rel="icon" type="image/png" href="/static/assets/images/{{'SITE_NAME' | app_config}}/icon.webp?a=8">

		{% if request.host == 'pcmemes.net' %}
			{% set cc='Splash Mountain' %}
		{% else %}
			{% set cc='Country Club' %}
		{% endif %}

		{% block title %}
		<title>Create a post - {{'SITE_NAME' | app_config}}</title>
		{% endblock %}

		
		{% block stylesheets %}
		{% if v %}
			<style>:root{--primary:#{{v.themecolor}}}</style>
			<link rel="stylesheet" href="/static/assets/css/main.css?a=70"><link rel="stylesheet" href="/static/assets/css/{{v.theme}}.css?a=11">
			{% if v.agendaposter %}
				<style>
					html {
						cursor:url('https://i.ibb.co/4VZB08S/Image.webp'), auto;
					}
					.nav-item .text-small.font-weight-bold::before {
						content: "((("
					}
					.nav-item .text-small.font-weight-bold::after {
						content: ")))"
					}
					.nav-item .text-small-extra.text-primary {
						font-size: 0 !important
					}
					.nav-item .text-small-extra.text-primary i {
						font-size: 11px !important
					}
				</style>
			{% elif v.css %}
				<link rel="stylesheet" href="/@{{v.username}}/css">
			{% endif %}
		{% else %}
			<style>:root{--primary:#{{'DEFAULT_COLOR' | app_config}}</style>
			<link rel="stylesheet" href="/static/assets/css/main.css?a=70">
			<link rel="stylesheet" href="/static/assets/css/{{'DEFAULT_THEME' | app_config}}.css?a=3">
		{% endif %}
		{% endblock %}

<body id="submit" style="overflow-x: hidden; {% if v and v.background %} background:url(/static/assets/images/backgrounds/{{v.background}}) no-repeat center center fixed !important; background-size: cover!important; background-color: #000!important;{% endif %}display: block;">

				{% include "header.html" %}

		{% block form %}

		
		<div class="submit-grid-view">
			<form id="submitform" action="/submit" method="post" enctype="multipart/form-data" style="grid-column: 2">

				<div class="container">

						<div class="row justify-content-center mb-5">

								<div class="col p-3 py-md-0">

										<h1 class="d-none d-md-block mt-3">Create a post</h1>

										<h2 class="h3 d-md-none mt-5">Create a post</h2>

										<div class="body">

												<input autocomplete="off" type="hidden" name="formkey" value="{{v.formkey}}">

												<label for="title">Post Title</label>


												<input autocomplete="off" class="form-control" id="post-title" aria-describedby="titleHelpRegister" type="text" name="title" placeholder="Required" value="{{title}}" minlength="1" maxlength="500" required oninput="checkForRequired()">

												<label class="btn btn-secondary format d-inline-block m-0" for="emoji-reply-btn-2">
													<div id="emoji-reply-btn-2" onclick="loadEmojis('post-title')" aria-hidden="true" data-bs-toggle="modal" data-bs-target="#emojiModal" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-original-title="Add Emoji"><i class="fas fa-smile-beam"></i></div>
												</label>

												<div id="urlblock">
														<label for="URL" class="mt-3">URL</label>
														<input autocomplete="off" class="form-control" id="post-URL" aria-describedby="URLHelp" name="url" placeholder="Optional if you have text." value="{{request.values.get('url','')}}" required oninput="checkForRequired();hide_image()">
														<small class="form-text text-muted">To post an image, use a direct image link such as i.imgur.com</small>
												</div>
												<div id="image-upload-block">
													<div><label class="mt-3">Attachment Upload</label></div>

													<img loading="lazy" id="image-preview" class="w-100">
													<label class="btn btn-secondary m-0" for="file-upload">
														<div id="filename-show">Select File</div>
														<input autocomplete="off" id="file-upload" type="file" name="file" {% if request.headers.get('cf-ipcountry')=="T1" %}disabled{% endif %} accept="image/*, video/*" hidden>
													</label>
													<small class="form-text text-muted">Optional if you have text.</small>
													<small class="form-text text-muted">You can upload images or videos.</small>
												</div>
												</div>

												<label for="body" class="mt-3">Text<i class="fas fa-info-circle text-gray-400 ml-1" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-original-title="Uses markdown. Limited to 10000 characters."></i></label>

												<div>
													<textarea autocomplete="off" form="submitform" id="post-text" class="form-control rounded" aria-label="With textarea" placeholder="Optional if you have a link or an image." rows="7" name="body" oninput="markdown('post-text','preview');charLimit('post-text','character-count-submit-text-form');checkForRequired()" {% if v.longpost %}minlength="280"{% endif %} maxlength="{% if v.bird %}140{% else %}10000{% endif %}" required></textarea>

													<div class="btn btn-secondary fl-r mt-3" onclick="document.getElementById('preview').classList.toggle('d-none');">
														Toggle preview
													</div>

													<div class="text-small font-weight-bold mt-1" id="character-count-submit-text-form" style="right: 1rem; bottom: 0.5rem; z-index: 3;"></div>

													<div id="preview" class="my-3"></div>
												</div>

												<p></p>
												<small class="btn btn-secondary format d-inline-block m-0">
												<i class="fas fa-bold" aria-hidden="true" onclick="makeBold('post-text')" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-original-title="Bold"></i>
												</small>
												&nbsp; 
												<small class="btn btn-secondary format d-inline-block m-0">
												<i class="fas fa-italic" aria-hidden="true" onclick="makeItalics('post-text')" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-original-title="Italicize"></i>
												</small>
												&nbsp; 
												<small class="btn btn-secondary format d-inline-block m-0">
												<i class="fas fa-quote-right" aria-hidden="true" onclick="makeQuote('post-text')" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-original-title="Quote"></i>
												</small>
												&nbsp;
												<small class="btn btn-secondary format d-inline-block m-0"><span class="font-weight-bolder text-uppercase" aria-hidden="true" onclick="getGif();commentForm('post-text')" data-bs-toggle="modal" data-bs-target="#gifModal" data-bs-toggle="tooltip" data-bs-placement="bottom"  data-bs-original-title="Add GIF">GIF</span></small>
												&nbsp;
												<label class="btn btn-secondary format d-inline-block m-0" for="emoji-reply-btn">
													<div id="emoji-reply-btn" onclick="loadEmojis('post-text')" aria-hidden="true" data-bs-toggle="modal" data-bs-target="#emojiModal" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-original-title="Add Emoji"><i class="fas fa-smile-beam"></i></div>
												</label>
																
												<label class="format btn btn-secondary m-0 ml-1 {% if v %}d-inline-block{% else %}d-none{% endif %}" for="file-upload-submit">
													<div id="filename-show-submit"><i class="far fa-image"></i></div>
													<input autocomplete="off" id="file-upload-submit" type="file" name="file2" accept="image/*, video/*" {% if request.headers.get('cf-ipcountry')=="T1" %}disabled{% endif %} onchange="document.getElementById('filename-show-submit').innerHTML='image/video';" hidden>
												</label>		

												<pre></pre>
												<div class="form-text text-small"><a href="/formatting" {% if v and v.newtab and not g.webview %}target="_blank"{% endif %}>Formatting help</a></div>
												<pre></pre>

												<div class="custom-control custom-checkbox">
														<input autocomplete="off" type="checkbox" class="custom-control-input" id="nsfwCheck" name="over_18">
														<label class="custom-control-label" for="nsfwCheck">+18</label>
												</div>
												<div class="custom-control custom-checkbox">
														<input autocomplete="off" type="checkbox" class="custom-control-input" id="privateCheck" name="private">
														<label class="custom-control-label" for="privateCheck">Draft</label>
												</div>

												{% if v.club_allowed != False %}
													<div class="custom-control custom-checkbox">
														<input autocomplete="off" type="checkbox" class="custom-control-input" id="clubCheck" name="club">
														<label class="custom-control-label" for="clubCheck">{{cc}} thread</label>
													</div>
												{% endif %}
												<pre>






												</pre>
										</div>

								</div>

						</div>

				<div class="container">
						<div class="row fixed-bottom bg-white border-top p-3" id="" style="z-index: 100; bottom: 0px; transition: bottom 220ms cubic-bezier(0, 0, 0.2, 1) 0s;">
								<div class="col">
										<a href="/" class="btn btn-secondary">Cancel</a>
								</div>
								<div class="col text-right">
										{% if error %}<span class="text-danger mr-2">{{error}}</span>{% endif %}
										<button class="btn btn-outline-purple" id="create_button" type="submit" disabled>Post</button>
								</div>
						</div>
				</div>

			</form>

		</div>
		{% endblock %}

		<script src="/static/assets/js/marked.js?a=3"></script>
		<script src="/static/assets/js/formatting.js?a=3"></script>
		<script src="/static/assets/js/submit.js?a=3"></script>


		{% include "emoji_modal.html" %}
		{% include "gif_modal.html" %}

</body>

</html>