Fix editor auto-expansion (#293)

This commit is contained in:
Baptiste Gelez 2018-10-30 18:16:24 +01:00 committed by GitHub
parent e26a150164
commit 2e072affb5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 10 additions and 12 deletions

View File

@ -1,9 +1,7 @@
function autosize () { const articleContent = document.querySelector('#plume-editor')
const el = this const offset = articleContent.offsetHeight - articleContent.clientHeight
el.style.height = 'auto'
el.style.height = `${el.scrollHeight}px`
}
const articleContent = document.querySelector('#content') articleContent.addEventListener('keydown', () => {
autosize.bind(articleContent)() articleContent.style.height = 'auto'
articleContent.addEventListener('keyup', autosize) articleContent.style.height = `${articleContent.scrollHeight - offset}px`
})

View File

@ -104,12 +104,12 @@
{% if account %} {% if account %}
<form method="post" action="{{ article.url }}comment"> <form method="post" action="{{ article.url }}comment">
<label for="content">{{ "Your comment" | _ }}</label> <label for="plume-editor">{{ "Your comment" | _ }}</label>
{% if previous %} {% if previous %}
<input type="hidden" name="responding_to" value="{{ previous.id }}"/> <input type="hidden" name="responding_to" value="{{ previous.id }}"/>
{% endif %} {% endif %}
{# Ugly, but we don't have the choice if we don't want weird paddings #} {# Ugly, but we don't have the choice if we don't want weird paddings #}
<textarea id="content" name="content">{% filter trim %}{% if previous %}{% if previous.author.fqn != user_fqn %}@{{ previous.author.fqn }} {% endif %}{% for mention in previous.mentions %}{% if mention != user_fqn %}@{{ mention }} {% endif %}{% endfor %}{% endif %}{% endfilter %}</textarea> <textarea id="plume-editor" name="content">{% filter trim %}{% if previous %}{% if previous.author.fqn != user_fqn %}@{{ previous.author.fqn }} {% endif %}{% for mention in previous.mentions %}{% if mention != user_fqn %}@{{ mention }} {% endif %}{% endfor %}{% endif %}{% endfilter %}</textarea>
<input type="submit" value="{{ "Submit comment" | _ }}" /> <input type="submit" value="{{ "Submit comment" | _ }}" />
</form> </form>
{% endif %} {% endif %}

View File

@ -27,8 +27,8 @@
{% endfor %} {% endfor %}
{% endif %} {% endif %}
<label for="content">{{ "Content" | _ }}<small>{{ "Markdown is supported" | _ }}</small></label> <label for="plume-editor">{{ "Content" | _ }}<small>{{ "Markdown is supported" | _ }}</small></label>
<textarea id="content" name="content" rows="20">{{ form.content | default(value="") }}</textarea> <textarea id="plume-editor" name="content" rows="20">{{ form.content | default(value="") }}</textarea>
{{ macros::input(name="tags", label="Tags, separated by commas", errors=errors, form=form, optional=true) }} {{ macros::input(name="tags", label="Tags, separated by commas", errors=errors, form=form, optional=true) }}