some editor updates

resources/assets/typescript/Sakura/Config.ts

@@ -7,6 +7,10 @@ namespace Sakura
         public static LoggedIn: boolean = false;
         public static ChangelogUrl: string = "https://sakura.flash.moe/";
         public static ChangelogApi: string = "api.php/";
+        public static ForumTitleMin: number = 0;
+        public static ForumTitleMax: number = 0;
+        public static ForumTextMin: number = 0;
+        public static ForumTextMax: number = 0;
 
         public static Set(config: Object): void
         {

resources/assets/typescript/Sakura/Editor.ts

@@ -0,0 +1,62 @@
+namespace Sakura
+{
+    export class Editor
+    {
+        private static UpdateTimeout: number = 0;
+        private static PreviewClient: AJAX;
+        private static PostClient: AJAX;
+
+        public static Prepare(): void
+        {
+            this.PostClient = new AJAX;
+            this.PreviewClient = new AJAX;
+            this.PreviewClient.SetUrl("/helper/bbcode/parse");
+            this.PreviewClient.Form();
+        }
+
+        public static Preview(target: HTMLElement, text: HTMLTextAreaElement): void
+        {
+            this.PreviewClient.SetSend({"text": text.value});
+            this.PreviewClient.AddCallback(200, (client: AJAX) => {
+                target.innerHTML = client.Response();
+            });
+            this.PreviewClient.Start(HTTPMethod.POST);
+        }
+
+        public static QuotePost(id: number, username: string, target: HTMLTextAreaElement): void
+        {
+            this.PostClient.SetUrl("/forum/post/1/raw".replace('1', id.toString()));
+            this.PostClient.AddCallback(200, (client: AJAX) => {
+                DOM.EnterAtCursor(target, "[quote=" + username + "]" + client.Response() + "[/quote]");
+                target.focus();
+            });
+            this.PostClient.Start(HTTPMethod.GET);
+        }
+
+        public static InsertBBCode(target: HTMLTextAreaElement, code: string, param: boolean): void
+        {
+            var start: string = "[" + code + (param ? "=" : "") + "]",
+                end: string = "[/" + code + "]",
+                selectionLength = DOM.GetSelectionLength(target);
+
+            DOM.EnterAtCursor(target, start);
+            DOM.SetPosition(target, DOM.GetPosition(target) + selectionLength + start.length);
+            DOM.EnterAtCursor(target, end);
+            DOM.SetPosition(target, DOM.GetPosition(target) - selectionLength);
+            DOM.SetPosition(target, DOM.GetPosition(target) + selectionLength, true);
+        }
+
+        public static PreviewTimeout(target: HTMLElement, text: HTMLTextAreaElement): void
+        {
+            if (this.UpdateTimeout !== 0) {
+                return;
+            }
+
+            this.UpdateTimeout = setTimeout(() => {
+                Editor.Preview(target, text);
+                clearTimeout(Editor.UpdateTimeout);
+                Editor.UpdateTimeout = 0;
+            }, 500);
+        }
+    }
+}

resources/assets/typescript/Yuuno/Editor.ts

@@ -1,20 +0,0 @@
-/// <reference path="../Sakura.ts" />
-
-namespace Yuuno
-{
-    export class Editor
-    {
-        public static InsertBBCode(target: HTMLTextAreaElement, code: string, param: boolean): void
-        {
-            var start: string = "[" + code + (param ? "=" : "") + "]",
-                end: string = "[/" + code + "]",
-                selectionLength = Sakura.DOM.GetSelectionLength(target);
-
-            Sakura.DOM.EnterAtCursor(target, start);
-            Sakura.DOM.SetPosition(target, Sakura.DOM.GetPosition(target) + selectionLength + start.length);
-            Sakura.DOM.EnterAtCursor(target, end);
-            Sakura.DOM.SetPosition(target, Sakura.DOM.GetPosition(target) - selectionLength);
-            Sakura.DOM.SetPosition(target, Sakura.DOM.GetPosition(target) + selectionLength, true);
-        }
-    }
-}

resources/views/yuuno/forum/elements/replyForm.twig

@@ -24,7 +24,7 @@
         <div class="posting-buttons">
             <div style="float: left;">
                 {% for code,meta in bbcode %}
-                    <button onclick="Yuuno.Editor.InsertBBCode(Sakura.DOM.ID('postingText'), '{{ code }}'{% if meta[2] %}, true{% endif %});" type="button"{% if meta[0] %} title="{{ meta[0] }}"{% endif %} class="forumbtn{% if meta[1] %} fa fa-{{ meta[1] }}{% endif %}">{% if not meta[1] %}{{ code }}{% endif %}</button>
+                    <button onclick="Sakura.Editor.InsertBBCode(Sakura.DOM.ID('postingText'), '{{ code }}'{% if meta[2] %}, true{% endif %});" type="button"{% if meta[0] %} title="{{ meta[0] }}"{% endif %} class="forumbtn{% if meta[1] %} fa fa-{{ meta[1] }}{% endif %}">{% if not meta[1] %}{{ code }}{% endif %}</button>
                 {% endfor %}
             </div>
             <div style="float: right;">
@@ -37,11 +37,15 @@
 </div>
 
 <script type="text/javascript">
-    var titleMax = {{ config('forum.max_title_length') }},
+    Sakura.Config.Set({
-        titleMin = {{ config('forum.min_title_length') }},
+        ForumTitleMin: {{ config('forum.min_title_length') }},
-        textMax = {{ config('forum.max_post_length') }},
+        ForumTitleMax: {{ config('forum.max_title_length') }},
-        textMin = {{ config('forum.min_post_length') }},
+        ForumTextMin: {{ config('forum.min_post_length') }},
-        preview = document.getElementById('postingPreview'),
+        ForumTextMax: {{ config('forum.max_post_length') }},
+    });
+    Sakura.Editor.Prepare();
+
+    var preview = document.getElementById('postingPreview'),
         pTitle = document.getElementById('postingTitle'),
         pTitleCont = document.getElementById('postingTitleContainer'),
         pText = document.getElementById('postingText'),
@@ -51,17 +55,11 @@
         tTitle = document.getElementById('topicTitle'),
         rTitle = document.getElementById('previewTitle'),
         rText = document.getElementById('previewText'),
-        lastParsed = Date.now(),
-        lastKeystroke = Date.now(),
-        parser = new Sakura.AJAX(),
         postFetch = new Sakura.AJAX(),
         parserActive = false,
         op = {{ topic is defined ? topic.firstPost.id : 0 }},
         topicName = "{{ topic is defined ? topic.firstPost.subject : '' }}";
 
-    parser.SetUrl("{{ route('helper.bbcode.parse') }}");
-    parser.ContentType("application/x-www-form-urlencoded");
-
     pText.addEventListener("focus", function () {
         preview.style.display = null;
     });
@@ -72,7 +70,7 @@
         }
     });
 
-    setInterval(function () {
+    /*setInterval(function () {
         if (lastParsed < Date.now() - 1000
             && lastKeystroke > Date.now() - 1000
             && parserActive !== true) {
@@ -108,11 +106,9 @@
                 parser.Start(Sakura.HTTPMethod.POST);
             }
         }
-    }, 1000);
+    }, 1000);*/
 
     pText.addEventListener("keydown", function (e) {
-        lastKeystroke = Date.now();
-
         if (e.keyCode == 9) {
             e.preventDefault();
             insertText('postingText', '    ');
@@ -121,6 +117,8 @@
         if (e.keyCode == 13 && e.ctrlKey) {
             pForm.submit();
         }
+
+        Sakura.Editor.PreviewTimeout(rText, pText);
     });
 
     pTitle.addEventListener("keyup", function (e) {
@@ -128,12 +126,12 @@
 
         if (title.length == 0) {
             title = "";
-        } else if (title.length < titleMin) {
+        } else if (title.length < Sakura.Config.ForumTitleMin) {
             title = "<span style='color: red;'>Too short!</span>";
             tTitle.innerHTML = title;
             rTitle.innerHTML = title;
             return;
-        } else if (title.length > titleMax) {
+        } else if (title.length > Sakura.Config.ForumTitleMax) {
             title = "<span style='color: red;'>Too long!</span>";
             tTitle.innerHTML = title;
             rTitle.innerHTML = title;
@@ -144,11 +142,6 @@
         rTitle.innerText = title;
     });
 
-    function quotePost(id) {
-        pText.value = pText.value + "[quote=#" + id + "][/quote]";
-        pText.focus();
-    }
-
     function editPost(id) {
         pText.disabled = true;
         pTitleCont.style.display = 'none';

resources/views/yuuno/forum/topic.twig

@@ -100,7 +100,7 @@
                                             <a class="fa fa-user-{% if user.isFriends(post.poster.id) == 0 %}plus{% else %}times{% endif %} forum-friend-toggle friend-{{ post.poster.id }}-toggle" title="{% if user.isFriends(post.poster.id) == 0 %}Add {{ post.poster.username }} as a friend{% else %}Remove friend{% endif %}" href="javascript:void(0);" onclick="Sakura.Friend.{% if user.isFriends(post.poster.id) == 0 %}Add({{ post.poster.id }}){% else %}Remove({{ post.poster.id }}){% endif %}"></a>
                                             <a class="fa fa-flag" title="Report {{ post.poster.username }}" href="{{ route('user.report', post.poster.id) }}"></a>
                                         {% endif %}
-                                        <a class="fa fa-reply" title="Quote this post" href="javascript:void(0);" onclick="quotePost({{ post.id }});"></a>
+                                        <a class="fa fa-reply" title="Quote this post" href="javascript:void(0);" onclick="Sakura.Editor.QuotePost({{ post.id }}, '{{ post.poster.username }}', pText);"></a>
                                     </div>
                                     {% endif %}
                                 </div>