From bce9a624d7a6251c857784a29059b7d80d65128b Mon Sep 17 00:00:00 2001
From: kl <chenkailing@xd.com>
Date: Mon, 28 Dec 2020 14:50:05 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0XML=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E9=A2=84=E8=A7=88UI=E9=A3=8E=E6=A0=BC=EF=BC=8C=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4=E7=B1=BB=E6=96=87=E6=9C=AC=E9=A2=84=E8=A7=88=E6=9E=B6?=
 =?UTF-8?q?=E6=9E=84=EF=BC=8C=E6=9B=B4=E6=96=B9=E4=BE=BF=E6=89=A9=E5=B1=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/main/config/freemarker_implicit.ftl   |   2 +
 .../java/cn/keking/service/FilePreview.java   |   2 +
 .../service/impl/MarkdownFilePreviewImpl.java |   6 +-
 .../service/impl/SimTextFilePreviewImpl.java  |   6 -
 .../service/impl/XmlFilePreviewImpl.java      |   6 +-
 .../controller/OnlinePreviewController.java   |   1 +
 server/src/main/resources/web/index.ftl       |   2 +-
 server/src/main/resources/web/markdown.ftl    | 118 ++++++++++++++++++
 server/src/main/resources/web/txt.ftl         |  82 +-----------
 server/src/main/resources/web/xml.ftl         |  97 ++++++++++++++
 10 files changed, 230 insertions(+), 92 deletions(-)
 create mode 100644 server/src/main/resources/web/markdown.ftl
 create mode 100644 server/src/main/resources/web/xml.ftl

diff --git a/server/src/main/config/freemarker_implicit.ftl b/server/src/main/config/freemarker_implicit.ftl
index 5de6e4a4..0a088830 100644
--- a/server/src/main/config/freemarker_implicit.ftl
+++ b/server/src/main/config/freemarker_implicit.ftl
@@ -1,5 +1,7 @@
 [#ftl]
 [#-- @implicitly included --]
+[#-- @ftlvariable name="file" type="cn.keking.model.FileAttribute" --]
+[#-- @ftlvariable name="fileName" type="java.lang.String" --]
 [#-- @ftlvariable name="fileTree" type="java.lang.String" --]
 [#-- @ftlvariable name="baseUrl" type="java.lang.String" --]
 [#-- @ftlvariable name="imgUrls" type="String" --]
diff --git a/server/src/main/java/cn/keking/service/FilePreview.java b/server/src/main/java/cn/keking/service/FilePreview.java
index a795992e..db749d47 100644
--- a/server/src/main/java/cn/keking/service/FilePreview.java
+++ b/server/src/main/java/cn/keking/service/FilePreview.java
@@ -17,6 +17,8 @@ public interface FilePreview {
     String OFFICE_PICTURE_FILE_PREVIEW_PAGE = "officePicture";
     String TXT_FILE_PREVIEW_PAGE = "txt";
     String EXEL_FILE_PREVIEW_PAGE = "html";
+    String XML_FILE_PREVIEW_PAGE = "xml";
+    String MARKDOWN_FILE_PREVIEW_PAGE = "markdown";
     String NOT_SUPPORTED_FILE_PAGE = "fileNotSupported";
 
     String filePreviewHandle(String url, Model model, FileAttribute fileAttribute);
diff --git a/server/src/main/java/cn/keking/service/impl/MarkdownFilePreviewImpl.java b/server/src/main/java/cn/keking/service/impl/MarkdownFilePreviewImpl.java
index b1a4fbcf..c55d9776 100644
--- a/server/src/main/java/cn/keking/service/impl/MarkdownFilePreviewImpl.java
+++ b/server/src/main/java/cn/keking/service/impl/MarkdownFilePreviewImpl.java
@@ -5,8 +5,6 @@ import cn.keking.service.FilePreview;
 import org.springframework.stereotype.Service;
 import org.springframework.ui.Model;
 
-import static cn.keking.service.impl.SimTextFilePreviewImpl.TEXT_TYPE;
-
 /**
  * @author kl (http://kailing.pub)
  * @since 2020/12/25
@@ -23,7 +21,7 @@ public class MarkdownFilePreviewImpl implements FilePreview {
 
     @Override
     public String filePreviewHandle(String url, Model model, FileAttribute fileAttribute) {
-        model.addAttribute(TEXT_TYPE,"markdown");
-        return simTextFilePreview.filePreviewHandle(url, model, fileAttribute);
+         simTextFilePreview.filePreviewHandle(url, model, fileAttribute);
+         return MARKDOWN_FILE_PREVIEW_PAGE;
     }
 }
diff --git a/server/src/main/java/cn/keking/service/impl/SimTextFilePreviewImpl.java b/server/src/main/java/cn/keking/service/impl/SimTextFilePreviewImpl.java
index a89232f5..f5f31f7f 100644
--- a/server/src/main/java/cn/keking/service/impl/SimTextFilePreviewImpl.java
+++ b/server/src/main/java/cn/keking/service/impl/SimTextFilePreviewImpl.java
@@ -20,9 +20,6 @@ import java.nio.charset.StandardCharsets;
 @Service
 public class SimTextFilePreviewImpl implements FilePreview {
 
-    public static final String TEXT_TYPE = "textType";
-    public static final String DEFAULT_TEXT_TYPE = "simText";
-
     private final OtherFilePreviewImpl otherFilePreview;
 
     public SimTextFilePreviewImpl(OtherFilePreviewImpl otherFilePreview) {
@@ -43,9 +40,6 @@ public class SimTextFilePreviewImpl implements FilePreview {
         } catch (IOException e) {
             return otherFilePreview.notSupportedFile(model, fileAttribute, e.getLocalizedMessage());
         }
-        if (!model.containsAttribute(TEXT_TYPE)) {
-            model.addAttribute(TEXT_TYPE, DEFAULT_TEXT_TYPE);
-        }
         return TXT_FILE_PREVIEW_PAGE;
     }
 
diff --git a/server/src/main/java/cn/keking/service/impl/XmlFilePreviewImpl.java b/server/src/main/java/cn/keking/service/impl/XmlFilePreviewImpl.java
index 068849fd..9c592681 100644
--- a/server/src/main/java/cn/keking/service/impl/XmlFilePreviewImpl.java
+++ b/server/src/main/java/cn/keking/service/impl/XmlFilePreviewImpl.java
@@ -5,8 +5,6 @@ import cn.keking.service.FilePreview;
 import org.springframework.stereotype.Service;
 import org.springframework.ui.Model;
 
-import static cn.keking.service.impl.SimTextFilePreviewImpl.TEXT_TYPE;
-
 /**
  * @author kl (http://kailing.pub)
  * @since 2020/12/25
@@ -22,7 +20,7 @@ public class XmlFilePreviewImpl implements FilePreview {
 
     @Override
     public String filePreviewHandle(String url, Model model, FileAttribute fileAttribute) {
-        model.addAttribute(TEXT_TYPE,"xml");
-        return simTextFilePreview.filePreviewHandle(url, model, fileAttribute);
+        simTextFilePreview.filePreviewHandle(url, model, fileAttribute);
+        return XML_FILE_PREVIEW_PAGE;
     }
 }
diff --git a/server/src/main/java/cn/keking/web/controller/OnlinePreviewController.java b/server/src/main/java/cn/keking/web/controller/OnlinePreviewController.java
index 81e5110b..4bce2066 100644
--- a/server/src/main/java/cn/keking/web/controller/OnlinePreviewController.java
+++ b/server/src/main/java/cn/keking/web/controller/OnlinePreviewController.java
@@ -57,6 +57,7 @@ public class OnlinePreviewController {
             return otherFilePreview.notSupportedFile(model, errorMsg);
         }
         FileAttribute fileAttribute = fileHandlerService.getFileAttribute(fileUrl, req);
+        model.addAttribute("file", fileAttribute);
         FilePreview filePreview = previewFactory.get(fileAttribute);
         logger.info("预览文件url：{}，previewType：{}", fileUrl, fileAttribute.getType());
         return filePreview.filePreviewHandle(fileUrl, model, fileAttribute);
diff --git a/server/src/main/resources/web/index.ftl b/server/src/main/resources/web/index.ftl
index 0e9992a7..12666538 100644
--- a/server/src/main/resources/web/index.ftl
+++ b/server/src/main/resources/web/index.ftl
@@ -61,7 +61,7 @@
             <div style="padding: 10px">
                 <form enctype="multipart/form-data" id="fileUpload">
                     <input type="file" name="file"/>
-                    <input type="button" id="btnubmit" value=" 上 传 "/>
+                    <input type="button" id="btnSubmit" value=" 上 传 "/>
                 </form>
             </div>
             <div>
diff --git a/server/src/main/resources/web/markdown.ftl b/server/src/main/resources/web/markdown.ftl
new file mode 100644
index 00000000..e61ff772
--- /dev/null
+++ b/server/src/main/resources/web/markdown.ftl
@@ -0,0 +1,118 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8"/>
+    <meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
+    <title>普通文本预览</title>
+</head>
+<body>
+<input hidden id="textData" value="${textData}"/>
+
+<div class="container">
+    <div class="panel panel-default">
+        <div id="markdown_btn" class="panel-heading">
+            <h4 class="panel-title">
+                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
+                    ${file.name}
+                </a>
+            </h4>
+        </div>
+        <div id="text_btn" class="panel-heading">
+            <h4 class="panel-title">
+                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
+                    ${file.name}
+                </a>
+            </h4>
+        </div>
+        <div class="panel-body">
+            <div id="markdown"></div>
+        </div>
+    </div>
+</div>
+
+<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
+
+<script src="js/jquery-3.0.0.min.js" type="text/javascript"></script>
+<script src="js/jquery.form.min.js" type="text/javascript"></script>
+<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
+<script src="js/watermark.js" type="text/javascript"></script>
+<script src="js/marked.min.js" type="text/javascript"></script>
+<script src="js/base64.min.js" type="text/javascript"></script>
+
+<script>
+    /**
+     * 初始化
+     */
+    window.onload = function () {
+        $("#markdown_btn").hide()
+        initWaterMark();
+        loadMarkdown();
+    }
+
+    /**
+     * 初始化水印
+     */
+    function initWaterMark() {
+        let watermarkTxt = '${watermarkTxt}';
+        if (watermarkTxt !== '') {
+            watermark.init({
+                watermark_txt: '${watermarkTxt}',
+                watermark_x: 0,
+                watermark_y: 0,
+                watermark_rows: 0,
+                watermark_cols: 0,
+                watermark_x_space: ${watermarkXSpace},
+                watermark_y_space: ${watermarkYSpace},
+                watermark_font: '${watermarkFont}',
+                watermark_fontsize: '${watermarkFontsize}',
+                watermark_color: '${watermarkColor}',
+                watermark_alpha: ${watermarkAlpha},
+                watermark_width: ${watermarkWidth},
+                watermark_height: ${watermarkHeight},
+                watermark_angle: ${watermarkAngle},
+            });
+        }
+    }
+
+
+    /**
+     * 加载markdown
+     */
+    function loadMarkdown() {
+        var textData = Base64.decode($("#textData").val())
+        window.textPreData = "<pre style='background-color: #FFFFFF;border:none'>" + textData + "</pre>";
+        window.textMarkdownData = marked(textData);
+        $("#markdown").html(window.textMarkdownData);
+    }
+
+
+    $(function () {
+        $("#markdown_btn").click(function () {
+            $("#markdown").html(window.textMarkdownData);
+            $("#text_btn").show()
+            $("#markdown_btn").hide()
+        });
+
+        $("#text_btn").click(function () {
+            $("#markdown_btn").show()
+            $("#text_btn").hide();
+            $("#markdown").html(window.textPreData);
+        });
+    });
+
+</script>
+<style>
+    * {
+        margin: 0;
+        padding: 0;
+    }
+
+    html, body {
+        height: 100%;
+        width: 100%;
+    }
+
+</style>
+</body>
+
+</html>
diff --git a/server/src/main/resources/web/txt.ftl b/server/src/main/resources/web/txt.ftl
index a3643441..adc28f50 100644
--- a/server/src/main/resources/web/txt.ftl
+++ b/server/src/main/resources/web/txt.ftl
@@ -6,46 +6,18 @@
     <title>普通文本预览</title>
 </head>
 <body>
-<input hidden id="textType" value="${textType}"/>
 <input hidden id="textData" value="${textData}"/>
 
 <div class="container">
-    <#if textType?? && textType == "markdown">
-        <div class="panel panel-default">
-            <div id="markdown_btn" class="panel-heading">
-                <h4 class="panel-title">
-                    <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
-                        切换markdown
-                    </a>
-                </h4>
-            </div>
-            <div id="text_btn" class="panel-heading">
-                <h4 class="panel-title">
-                    <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
-                        切换text
-                    </a>
-                </h4>
-            </div>
-            <div class="panel-body">
-                <div id="markdown"></div>
-            </div>
-        </div>
-    <#elseif textType?? && textType == "xml" >
-        <div id="xml" style="padding: 18px;"></div>
-    <#else>
-        <div id="text"></div>
-    </#if>
+    <div id="text"></div>
 </div>
 
-<link rel="stylesheet" href="css/xmlTreeViewer.css"/>
 <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
 
 <script src="js/jquery-3.0.0.min.js" type="text/javascript"></script>
 <script src="js/jquery.form.min.js" type="text/javascript"></script>
 <script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
 <script src="js/watermark.js" type="text/javascript"></script>
-<script src="js/marked.min.js" type="text/javascript"></script>
-<script src="js/xmlTreeViewer.js" type="text/javascript"></script>
 <script src="js/base64.min.js" type="text/javascript"></script>
 
 <script>
@@ -53,12 +25,8 @@
      * 初始化
      */
     window.onload = function () {
-        $("#markdown_btn").hide()
         initWaterMark();
-        fetchData();
         loadText();
-        loadXmlData()
-        loadMarkdown();
     }
 
     /**
@@ -86,56 +54,16 @@
         }
     }
 
-    /**
-     * 获取文本数据
-     */
-    function fetchData() {
-        window.textData = Base64.decode($("#textData").val())
-        window.textPreData = "<pre style='background-color: #FFFFFF;border:none'>" + window.textData + "</pre>";
-    }
-
     /**
      *加载普通文本
      */
     function loadText() {
-        $("#text").html(window.textPreData);
+        var textData = Base64.decode($("#textData").val())
+        var textPreData = "<pre style='background-color: #FFFFFF;border:none'>" + textData + "</pre>";
+
+        $("#text").html(textPreData);
     }
 
-    /**
-     * 加载markdown
-     */
-    function loadMarkdown() {
-        if ($("#textType").val() === "markdown") {
-            window.textMarkdownData = marked(window.textData);
-            $("#markdown").html(window.textMarkdownData);
-        }
-    }
-
-    /**
-     * 加载xml数据
-     */
-    function loadXmlData() {
-        if ($("#textType").val() === "xml") {
-            var xmlNode = xmlTreeViewer.parseXML(window.textData);
-            var retNode = xmlTreeViewer.getXMLViewerNode(xmlNode.xml);
-            $("#xml").html(retNode);
-        }
-    }
-
-    $(function () {
-        $("#markdown_btn").click(function () {
-            $("#markdown").html(window.textMarkdownData);
-            $("#text_btn").show()
-            $("#markdown_btn").hide()
-        });
-
-        $("#text_btn").click(function () {
-            $("#markdown_btn").show()
-            $("#text_btn").hide();
-            $("#markdown").html(window.textPreData);
-        });
-    });
-
 </script>
 <style>
     * {
diff --git a/server/src/main/resources/web/xml.ftl b/server/src/main/resources/web/xml.ftl
new file mode 100644
index 00000000..6eff5aa2
--- /dev/null
+++ b/server/src/main/resources/web/xml.ftl
@@ -0,0 +1,97 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8"/>
+    <meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">
+    <title>普通文本预览</title>
+</head>
+<body>
+<input hidden id="textData" value="${textData}"/>
+<div class="container">
+    <div class="panel panel-default">
+        <div class="panel-heading">
+            <h4 class="panel-title">
+                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
+                     ${file.name}
+                </a>
+            </h4>
+        </div>
+        <div class="panel-body">
+            <div id="xml"></div>
+        </div>
+    </div>
+</div>
+
+<link rel="stylesheet" href="css/xmlTreeViewer.css"/>
+<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
+
+<script src="js/jquery-3.0.0.min.js" type="text/javascript"></script>
+<script src="js/jquery.form.min.js" type="text/javascript"></script>
+<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
+<script src="js/watermark.js" type="text/javascript"></script>
+<script src="js/marked.min.js" type="text/javascript"></script>
+<script src="js/xmlTreeViewer.js" type="text/javascript"></script>
+<script src="js/base64.min.js" type="text/javascript"></script>
+
+<script>
+    /**
+     * 初始化
+     */
+    window.onload = function () {
+        initWaterMark();
+        loadXmlData()
+    }
+
+    /**
+     * 初始化水印
+     */
+    function initWaterMark() {
+        let watermarkTxt = '${watermarkTxt}';
+        if (watermarkTxt !== '') {
+            watermark.init({
+                watermark_txt: '${watermarkTxt}',
+                watermark_x: 0,
+                watermark_y: 0,
+                watermark_rows: 0,
+                watermark_cols: 0,
+                watermark_x_space: ${watermarkXSpace},
+                watermark_y_space: ${watermarkYSpace},
+                watermark_font: '${watermarkFont}',
+                watermark_fontsize: '${watermarkFontsize}',
+                watermark_color: '${watermarkColor}',
+                watermark_alpha: ${watermarkAlpha},
+                watermark_width: ${watermarkWidth},
+                watermark_height: ${watermarkHeight},
+                watermark_angle: ${watermarkAngle},
+            });
+        }
+    }
+
+
+    /**
+     * 加载xml数据
+     */
+    function loadXmlData() {
+        var textData = Base64.decode($("#textData").val())
+        var xmlNode = xmlTreeViewer.parseXML(textData);
+        var retNode = xmlTreeViewer.getXMLViewerNode(xmlNode.xml);
+        $("#xml").html(retNode);
+
+    }
+
+</script>
+<style>
+    * {
+        margin: 0;
+        padding: 0;
+    }
+
+    html, body {
+        height: 100%;
+        width: 100%;
+    }
+
+</style>
+</body>
+
+</html>