{% extends "layout.html" %} {% import 'utils.html' as utils %} {% block title %}New - {{ config.NAME }}{% endblock %} {% block header %} {% endblock %} {% block content %} <div id="container"> <div id="new"> {% if thread %} <h3 style="padding-bottom: 30px">Replying to {{ content }}</h3> {{ utils.display_thread(thread) }} {% else %} <div class="tabbar"> {% if request.args.get("question") == "1" %} <a href="{{ url_for('admin.admin_new') }}" class="tab">Note</a><a href="{{ url_for('admin.admin_new') }}?question=1" class="tab selected">Question</a> {% else %} <a href="{{ url_for('admin.admin_new') }}" class="tab selected">Note</a><a href="{{ url_for('admin.admin_new') }}?question=1" class="tab">Question</a> {% endif %} </div> {% endif %} <form action="/api/new_{% if request.args.get("question") == "1" %}question{%else%}note{%endif%}" method="POST" enctype="multipart/form-data"> <input type="hidden" name="redirect" value="/"> <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"> <select name="visibility" style="padding:8px 10px;"> {% for v in visibility %} <option value="{{v.name}}" {% if v == default_visibility %}selected="selected"{% endif %}>{{ v.value }}</option> {% endfor %} </select> {% if reply %}<input type="hidden" name="reply" value="{{reply}}">{% endif %} <p><input type="text" name="summary" placeholder="summary/CW (optional)"></p> <p> {% for emoji in emojis %} <span class="ji">{{ emoji | emojify | safe }}</span> {% endfor %} {% for emoji in custom_emojis.values() %} <span class="ji"><img src="{{emoji.get_icon_url()}}" alt="{{emoji.name}}" title="{{emoji.name}}" class="custom-emoji"></span> {% endfor %} </p> <textarea name="content" rows="10" cols="50" autofocus="autofocus" designMode="on" style="font-size:1.2em;width:95%;">{{ content }}</textarea> <p> <input type="file" name="file"> <p> <p> <input type="text" name="file_description" placeholder="attachment description (optional)"> </p> {% if request.args.get("question") == "1" %} <div style="margin-top:20px;"> <p>Open for: <select name="open_for"> <option value="5">5 minutes</option> <option value="10">10 minutes</option> <option value="15">15 minutes</option> <option value="30">30 minutes</option> <option value="60">1 hour</option> <option value="360">6 hour</option> <option value="1440" selected>1 day</option> <option value="4320">3 days</option> <option value="10080">7 days</option> </select></p> <p><select name="of"> <option value="oneOf">Single choice</option> <option value="anyOf">Multiple choices</option> </select></p> {% for i in range(4) %} <p><input type="text" name="answer{{i}}" placeholder="Answer #{{i+1}}"></p> {% endfor %} </div> {% endif %} <input type="submit" value="post"> </div> </form> </div> </div> <script> // The new post textarea var ta = document.getElementsByTagName("textarea")[0]; // Helper for inserting text (emojis) in the textarea function insertAtCursor (textToInsert) { ta.focus(); const isSuccess = document.execCommand("insertText", false, textToInsert); // Firefox (non-standard method) if (!isSuccess) { // Credits to https://www.everythingfrontend.com/posts/insert-text-into-textarea-at-cursor-position.html // get current text of the input const value = ta.value; // save selection start and end position const start = ta.selectionStart; const end = ta.selectionEnd; // update the value with our text inserted ta.value = value.slice(0, start) + textToInsert + value.slice(end); // update cursor to be at the end of insertion ta.selectionStart = ta.selectionEnd = start + textToInsert.length; } } // Emoji click callback func var ji = function (ev) { insertAtCursor(ev.target.attributes.alt.value + " "); ta.focus() //console.log(document.execCommand('insertText', false /*no UI*/, ev.target.attributes.alt.value)); } // Enable the click for each emojis var items = document.getElementsByClassName("ji") for (var i = 0; i < items.length; i++) { items[i].addEventListener('click', ji); } </script>{% endblock %}