From ce289b79fa987b252683146ed34e4ae48e7157f3 Mon Sep 17 00:00:00 2001
From: "Kevin \"Ilphrin\" Pellet" <ilphrin@autistici.org>
Date: Thu, 30 Aug 2018 22:47:25 +0200
Subject: [PATCH] 151 - Make the editor bigger and autosize it

---
 static/js/autoExpand.js       | 14 ++++++++++++++
 static/main.css               |  3 +++
 templates/posts/new.html.tera |  3 ++-
 3 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 static/js/autoExpand.js

diff --git a/static/js/autoExpand.js b/static/js/autoExpand.js
new file mode 100644
index 00000000..33fb32e1
--- /dev/null
+++ b/static/js/autoExpand.js
@@ -0,0 +1,14 @@
+function autosize(){
+  const el = this;
+  el.style.height = 'auto';
+  el.style.height = (el.scrollHeight ) + 'px';
+}
+
+const articleContent = document.querySelector('#content');
+let offset = 0;
+let style = window.getComputedStyle(articleContent, null);
+
+offset += parseInt(style['paddingTop']) + parseInt(style['paddingBottom']);
+autosize.bind(articleContent)();
+articleContent.addEventListener('keyup', autosize);
+
diff --git a/static/main.css b/static/main.css
index 0ed247d8..d2c05baf 100644
--- a/static/main.css
+++ b/static/main.css
@@ -422,6 +422,9 @@ form.new-post .title {
 }
 form.new-post textarea {
 	min-height: 20em;
+	overflow-y: hidden;
+	resize: none;
+	box-sizing: content-box;
 }
 form.new-post input[type="submit"] {
 	background: #ECECEC;
diff --git a/templates/posts/new.html.tera b/templates/posts/new.html.tera
index 9a4b2972..1892f2f9 100644
--- a/templates/posts/new.html.tera
+++ b/templates/posts/new.html.tera
@@ -17,11 +17,12 @@
     {% endif %}
 
     <label for="content">{{ "Content" | _ }}<small>{{ "Markdown is supported" | _ }}</small></label>
-    <textarea id="content" name="content" value="{{ form.content | default(value="") }}"></textarea>
+    <textarea id="content" name="content" value="{{ form.content | default(value="") }}" rows="20"></textarea>
 
     {% set license_infos = "Default license will be {{ instance.default_license }}" | _(instance=instance) %}
     {{ macros::input(name="license", label="License", errors=errors, form=form, optional=true, details=license_infos) }}
 
     <input type="submit" value="{{ "Publish" | _ }}" />
 </form>
+<script src="/static/js/autoExpand.js"></script>
 {% endblock content %}