Emojis \o/ and fix threads

This commit is contained in:
Thomas Sileo
2019-04-10 22:50:36 +02:00
parent e01891d364
commit c100796c86
5 changed files with 71 additions and 17 deletions

View File

@@ -11,7 +11,11 @@
{% if not request.args.get("older_than") and not request.args.get("previous_than") %}<link rel="canonical" href="https://{{ config.DOMAIN }}{{ request.path }}">{% endif %}
{% block links %}{% endblock %}
{% if config.THEME_COLOR %}<meta name="theme-color" content="{{ config.THEME_COLOR }}">{% endif %}
<style>{{ config.CSS | safe }}</style>
<style>{{ config.CSS | safe }}
.emoji {
width: 20px;
}
</style>
{% block headers %}{% endblock %}
</head>
<body>
@@ -39,5 +43,15 @@
Powered by <a href="https://microblog.pub">microblog.pub</a> <small class="microblogpub-version"><code>{{ microblogpub_version }}</code></small> (<a href="https://github.com/tsileo/microblog.pub">source code</a>) and the <a href="https://activitypub.rocks/">ActivityPub</a> protocol
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/twemoji@12.0.0/2/twemoji.min.js"></script>
<script>
window.onload = function() {
twemoji.base = "https://cdn.jsdelivr.net/npm/twemoji@12.0.0/2/";
twemoji.parse(document.body, {
folder: 'svg',
ext: '.svg'
});
}
</script>
</body>
</html>

View File

@@ -1,6 +1,9 @@
{% extends "layout.html" %}
{% import 'utils.html' as utils %}
{% block title %}New - {{ config.NAME }}{% endblock %}
{% block headers %}
{% endblock %}
{% block content %}
<div id="container">
{% include "header.html" %}
@@ -15,7 +18,14 @@
<input type="hidden" name="redirect" value="/">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
{% if reply %}<input type="hidden" name="reply" value="{{reply}}">{% endif %}
<textarea name="content" rows="10" cols="50" autofocus="autofocus">{{ content }}</textarea>
<p>
{% for emoji in emojis %}
<span class="ji">{{ emoji }}</span>
{% endfor %}
</p>
<textarea name="content" rows="10" cols="50" autofocus="autofocus" designMode="on">{{ content }}</textarea>
<input type="file" name="file">
<div style="margin-top:20px;">
<input type="submit" value="post">
@@ -24,4 +34,26 @@
</div>
</div>
{% endblock %}
<script>
var ta = document.getElementsByTagName("textarea")[0];
function insertAtCursor (textToInsert) {
// 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;
}
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));
}
var items = document.getElementsByClassName("ji")
for (var i = 0; i < items.length; i++) {
items[i].addEventListener('click', ji);
}
</script>{% endblock %}