From 72a728151319684955d98965eb61460e9fabbfc6 Mon Sep 17 00:00:00 2001
From: Liang Ding <d@b3log.org>
Date: Sun, 19 May 2019 01:53:31 +0800
Subject: [PATCH] =?UTF-8?q?:art:=20playground=20=E8=BE=93=E5=87=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 session/processes.go        |  2 +-
 static/js/playground.js     | 11 +++++++----
 views/playground/index.html |  4 +++-
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/session/processes.go b/session/processes.go
index 00ebab2..d4a06ee 100644
--- a/session/processes.go
+++ b/session/processes.go
@@ -179,7 +179,7 @@ func RunHandler(w http.ResponseWriter, r *http.Request, channel map[string]*util
 			cmd.Process.Kill()
 		}
 
-		channelRet["output"] = "<span class='stderr'>run program timeout in 5s</span>\n"
+		channelRet["output"] = "\n<span class='stderr'>run program timeout in 5s</span>\n"
 		kill = true
 	case <-done:
 		channelRet["output"] = "\n<span class='stderr'>run program complete</span>\n"
diff --git a/static/js/playground.js b/static/js/playground.js
index 7e5000a..cd00e3a 100644
--- a/static/js/playground.js
+++ b/static/js/playground.js
@@ -305,8 +305,11 @@ var playground = {
 
             playground.pid = data.pid;
 
-            var val = $("#output").val();
-            $("#output").val(val + data.output);
+            var output = data.output;
+            output = output.replace(/\r/g, '');
+            output = output.replace(/\n/g, '<br/>');
+            var oldOutput = $("#output").html();
+            $("#output").html(oldOutput + output);
         };
         playgroundWS.onclose = function (e) {
             console.log('[playground onclose] disconnected (' + e.code + ')');
@@ -424,7 +427,7 @@ var playground = {
         var request = newWideRequest();
         request.code = code;
 
-        $("#output").val("");
+        $("#output").html("");
 
         $.ajax({
             type: 'POST',
@@ -455,7 +458,7 @@ var playground = {
                         
                         var data = result.data;
 
-                        $("#output").val(data.output);
+                        $("#output").html(data.output);
 
                         if (!result.succ) {
                             return;
diff --git a/views/playground/index.html b/views/playground/index.html
index 20b5a38..f8c8957 100644
--- a/views/playground/index.html
+++ b/views/playground/index.html
@@ -64,7 +64,9 @@
                 <div id="editorDiv">
                     <textarea rows="20" id='editor' class="fn-none">{{.code}}</textarea>
                 </div>
-                <textarea id="output" rows="20" readonly="readonly" ></textarea>
+                <div class="bottom-window-group">
+                    <div id="output" class="output"></div>
+                </div>
             </div>
             <div class="fn-right" id="goNews"></div>
         </div>