Better big form handling (#430)

* Allow customizing max form size from env vars

* Add error page for unprocessable entities

And change default http port to 7878

* Improve char counter: under the editor, more discrete, and give it a default value

plume-front/src/main.rs

@@ -1,16 +1,17 @@
+#![recursion_limit="128"]
 #[macro_use]
 extern crate stdweb;
 
-use stdweb::{unstable::TryFrom, web::{*, event::*}};
+use stdweb::{unstable::{TryFrom, TryInto}, web::{*, event::*}};
 
 fn main() {
-    auto_expand();
+    editor_loop();
     menu();
     search();
 }
 
-/// Auto expands the editor when adding text
-fn auto_expand() {
+/// Auto expands the editor when adding text and count chars
+fn editor_loop() {
     match document().query_selector("#plume-editor") {
         Ok(Some(x)) => HtmlElement::try_from(x).map(|article_content| {
             let offset = article_content.offset_height() - (article_content.get_bounding_client_rect().get_height() as i32);
@@ -19,7 +20,33 @@ fn auto_expand() {
                 js! {
                     @{&article_content}.style.height = "auto";
                     @{&article_content}.style.height = @{&article_content}.scrollHeight - @{offset} + "px";
-                }
+                };
+                window().set_timeout(|| {match document().query_selector("#post-form") {
+                    Ok(Some(form)) => HtmlElement::try_from(form).map(|form| {
+                        if let Some(len) = form.get_attribute("content-size").and_then(|s| s.parse::<i32>().ok()) {
+                            let consumed: i32 = js!{
+                                var len = - 1;
+                                for(var i = 0; i < @{&form}.length; i++) {
+                                    if(@{&form}[i].name != "") {
+                                        len += @{&form}[i].name.length + encodeURIComponent(@{&form}[i].value)
+                                            .replace(/%20/g, "+")
+                                            .replace(/%0A/g, "%0D%0A")
+                                            .replace(new RegExp("[!'*()]", "g"), "XXX") //replace exceptions of encodeURIComponent with placeholder
+                                            .length + 2;
+                                    }
+                                }
+                                return len;
+                            }.try_into().unwrap_or_default();
+                            match document().query_selector("#editor-left") {
+                                Ok(Some(e)) => HtmlElement::try_from(e).map(|e| {
+                                    js!{@{e}.innerText = (@{len-consumed})};
+                                }).ok(),
+                                _ => None,
+                            };
+                           }
+                        }).ok(),
+                    _ => None,
+                };}, 0);
             });
         }).ok(),
         _ => None