优化体验

static/css/main.css

@@ -492,6 +492,7 @@ textarea{
     background-color: #f9f9f9;
     border: 1px solid #fff;
     cursor: pointer;
+    color: #333;
 }
 .manager .dashboard-item:hover{
     background-color: #563D7C;

static/css/markdown.css

@@ -215,6 +215,7 @@ body{
     margin-left: 10px;
     cursor: pointer;
 }
+/***************附件管理的样式*******************/
 .attach-drop-panel{
     display: block;
     position: relative;
@@ -286,20 +287,80 @@ body{
 .attach-list .attach-item .close:hover {
     color: #333;
 }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+/***********选择模板时的样式**************/
+.template-list .container{
+    margin-top: 60px;
+    margin-bottom: 40px;
+    padding: 0 15px;
+    box-sizing: border-box;
+}
+.template-list .container .section{
+    position: relative;
+    margin: 0 15px;
+    padding-top: 60px;
+    float: left;
+    width: 150px;
+    height: 236px;
+    background: #fdfefe;
+    border: 1px solid #ddddd9;
+    text-align: center
+}
+.template-list .container .section>h3 a{
+    font-size: 20px;
+    font-weight: 200;
+    text-decoration: none;
+    color: #5d606b
+}
+.template-list .container .section>a {
+    display: inline-block;
+    position: absolute;
+    left: 50%;
+    top: -28px;
+    width: 56px;
+    height: 56px;
+    margin-left: -28px
+}
+.template-list .container .section>a .fa {
+    display: inline-block;
+    width: 56px;
+    height: 56px;
+    background-color: #fbfefe;
+    border: 1px solid #ddddd9;
+    border-radius: 50%;
+    line-height: 54px;
+    font-size: 24px;
+    color: #ddddd9
+}
+.template-list .container .section:hover {
+    border-color: #44b035
+}
+
+.template-list .container .section:hover>a {
+    background-color: #44b035;
+    padding: 5px;
+    border-radius: 50%;
+    width: 66px;
+    height: 66px;
+    margin-left: -33px;
+    top: -33px
+}
+.template-list .container .section:hover>a .fa {
+    background-color: #78c56d;
+    color: #fff;
+    border: 0;
+    line-height: 54px
+}
+.template-list .container .section ul {
+    margin-top: 35px;
+    padding-left: 0;
+    list-style: none
+}
+.template-list .container .section ul li {
+    margin-bottom: 10px;
+    padding: 0 10px;
+    line-height: 1.2;
+    color: #8e8d8d
+}
 
 
 

static/css/markdown.preview.css

@@ -0,0 +1,33 @@
+/*************表格样式****************/
+
+.editormd-preview-container table thead tr{
+    background-color: #0088CC;
+    color: #ffffff;
+}
+.editormd-preview-container table tr:nth-child(2n) {
+    background-color: #f8f8f8
+}
+.editormd-preview-container-body blockquote,.editormd-preview-container blockquote p {
+    font-size: 14px;
+    color: #999
+}
+/***********代码样式*****************/
+.markdown-body .highlight pre, .markdown-body pre{
+    padding: 0;
+    font-size: 12px;
+    border-radius:0;
+    line-height: 1.4em;
+}
+.editormd-preview-container pre.prettyprint, .editormd-html-preview pre.prettyprint{
+    padding: 0;
+}
+.editormd-preview-container ol.linenums, .editormd-html-preview ol.linenums{
+    color: #999;
+}
+.editormd-preview-container ol.linenums>li:first-child,.editormd-html-preview ol.linenums>li:first-child{
+    padding-top: 10px;
+}
+.editormd-preview-container ol.linenums>li:last-child ,.editormd-html-preview ol.linenums>li:last-child{
+    padding-bottom: 10px;
+}
+

static/js/jquery.highlight.js

@@ -0,0 +1,27 @@
+jQuery.fn.highlight = function(pat) {
+    function innerHighlight(node, pat) {
+        var skip = 0;
+        if (node.nodeType === 3) {
+            var pos = node.data.toUpperCase().indexOf(pat);
+            if (pos >= 0) {
+                var spannode = document.createElement('em');
+                spannode.className = 'search-highlight';
+                var middlebit = node.splitText(pos);
+                var endbit = middlebit.splitText(pat.length);
+                var middleclone = middlebit.cloneNode(true);
+                spannode.appendChild(middleclone);
+                middlebit.parentNode.replaceChild(spannode, middlebit);
+                skip = 1;
+            }
+        }
+        else if (node.nodeType === 1 && node.childNodes && !/(script|style)/i.test(node.tagName)) {
+            for (var i = 0; i < node.childNodes.length; ++i) {
+                i += innerHighlight(node.childNodes[i], pat);
+            }
+        }
+        return skip;
+    }
+    return this.each(function() {
+        innerHighlight(this, pat.toUpperCase());
+    });
+};

static/js/kancloud.js

@@ -0,0 +1,207 @@
+/***
+ * 加载文档到阅读区
+ * @param $url
+ * @param $id
+ * @param $callback
+ */
+function loadDocument($url,$id,$callback) {
+    $.ajax({
+        url : $url,
+        type : "GET",
+        beforeSend :function (xhr) {
+            var body = events.data('body_' + $id);
+            var title = events.data('title_' + $id);
+            var doc_title = events.data('doc_title_' + $id);
+
+            if(body && title && doc_title){
+
+                if (typeof $callback === "function") {
+                    body = $callback(body);
+                }
+                $("#page-content").html(body);
+                $("title").text(title);
+                $("#article-title").text(doc_title);
+
+                events.trigger('article.open',{ $url : $url, $init : false , $id : $id });
+
+                return false;
+            }
+            NProgress.start();
+        },
+        success : function (res) {
+            if(res.errcode === 0){
+                var body = res.data.body;
+                var doc_title = res.data.doc_title;
+                var title = res.data.title;
+
+                $body = body;
+                if (typeof $callback === "function" ){
+                    $body = $callback(body);
+                }
+                $("#page-content").html($body);
+                $("title").text(title);
+                $("#article-title").text(doc_title);
+
+                events.data('body_' + $id,body);
+                events.data('title_' + $id,title);
+                events.data('doc_title_' + $id,doc_title);
+
+                events.trigger('article.open',{ $url : $url, $init : true, $id : $id });
+
+            }else{
+                layer.msg("加载失败");
+            }
+        },
+        complete : function () {
+            NProgress.done();
+        }
+    });
+}
+
+function initHighlighting() {
+    $('pre code').each(function (i, block) {
+        hljs.highlightBlock(block);
+    });
+
+    hljs.initLineNumbersOnLoad();
+}
+
+var events = $("body");
+
+$(function () {
+    $(".view-backtop").on("click", function () {
+        $('.manual-right').animate({ scrollTop: '0px' }, 200);
+    });
+    $(".manual-right").scroll(function () {
+        var top = $(".manual-right").scrollTop();
+        if(top > 100){
+            $(".view-backtop").addClass("active");
+        }else{
+            $(".view-backtop").removeClass("active");
+        }
+    });
+    window.isFullScreen = false;
+
+    initHighlighting();
+
+    window.jsTree = $("#sidebar").jstree({
+        'plugins':["wholerow","types"],
+        "types": {
+            "default" : {
+                "icon" : false  // 删除默认图标
+            }
+        },
+        'core' : {
+            'check_callback' : true,
+            "multiple" : false ,
+            'animation' : 0
+        }
+    }).on('select_node.jstree',function (node,selected,event) {
+        $(".m-manual").removeClass('manual-mobile-show-left');
+        var url = selected.node.a_attr.href;
+
+        if(url === window.location.href){
+            return false;
+        }
+        loadDocument(url,selected.node.id);
+
+    });
+
+    $("#slidebar").on("click",function () {
+        $(".m-manual").addClass('manual-mobile-show-left');
+    });
+    $(".manual-mask").on("click",function () {
+        $(".m-manual").removeClass('manual-mobile-show-left');
+    });
+
+    /**
+     * 关闭侧边栏
+     */
+    $(".manual-fullscreen-switch").on("click",function () {
+        isFullScreen = !isFullScreen;
+        if (isFullScreen) {
+            $(".m-manual").addClass('manual-fullscreen-active');
+        } else {
+            $(".m-manual").removeClass('manual-fullscreen-active');
+        }
+    });
+
+    //处理打开事件
+    events.on('article.open', function (event, $param) {
+
+        if ('pushState' in history) {
+            if ($param.$init === false) {
+                window.history.replaceState($param , $param.$id , $param.$url);
+            } else {
+                window.history.pushState($param, $param.$id , $param.$url);
+            }
+
+        } else {
+            window.location.hash = $param.$url;
+        }
+        initHighlighting();
+        $(".manual-right").scrollTop(0);
+    });
+
+    $(".navg-item[data-mode]").on("click",function () {
+        var mode = $(this).data('mode');
+        $(this).siblings().removeClass('active').end().addClass('active');
+        $(".m-manual").removeClass("manual-mode-view manual-mode-collect manual-mode-search").addClass("manual-mode-" + mode);
+    });
+
+    /**
+     * 项目内搜索
+     */
+    $("#searchForm").ajaxForm({
+        beforeSubmit : function () {
+            var keyword = $.trim($("#searchForm").find("input[name='keyword']").val());
+            if(keyword === ""){
+                $(".search-empty").show();
+                $("#searchList").html("");
+                return false;
+            }
+            $("#btnSearch").attr("disabled","disabled").find("i").removeClass("fa-search").addClass("loading");
+            window.keyword = keyword;
+        },
+        success :function (res) {
+            var html = "";
+            if(res.errcode === 0){
+                for(var i in res.data){
+                    var item = res.data[i];
+                    html += '<li><a href="javascript:;" title="'+ item.doc_name +'" data-id="'+ item.doc_id+'"> '+ item.doc_name +' </a></li>';
+                }
+            }
+            if(html !== ""){
+                $(".search-empty").hide();
+            }else{
+                $(".search-empty").show();
+            }
+            $("#searchList").html(html);
+        },
+        complete : function () {
+            $("#btnSearch").removeAttr("disabled").find("i").removeClass("loading").addClass("fa-search");
+        }
+    });
+
+    window.onpopstate = function (e) {
+
+        var $param = e.state;
+        console.log($param);
+        if($param.hasOwnProperty("$url")) {
+            window.jsTree.jstree().deselect_all();
+
+            window.jsTree.jstree().select_node({ id : $param.$id });
+            $param.$init = false;
+            //events.trigger('article.open', $param );
+        }else{
+            console.log($param);
+        }
+    };
+
+    // var $node = window.jsTree.jstree().get_selected();
+    //
+    // if(typeof $node === "object") {
+    //     $node = window.jsTree.jstree().get_node({ id : $node[0] });
+    //     events.trigger('article.open',{ $url : $node.a_attr.href , $init : false, $id : $node.a_attr.id });
+    // }
+});

static/js/markdown.js

@@ -64,7 +64,8 @@ $(function () {
            window.documentHistory();
        }else if(name === "save"){
             saveDocument(false);
-
+       }else if(name === "template"){
+           $("#documentTemplateModal").modal("show");
        }else if(name === "sidebar"){
             $("#manualCategory").toggle(0,"swing",function () {
 
@@ -151,7 +152,7 @@ $(function () {
             layer.close(index);
             layer.msg("文档加载失败");
         });
-    }
+    };
 
     /**
      * 保存文档到服务器
@@ -341,4 +342,17 @@ $(function () {
         loadDocument(selected);
 
     }).on("move_node.jstree",jstree_save);
+
+    $("#documentTemplateModal").on("click",".section>a[data-type]",function () {
+        var $this = $(this).attr("data-type");
+        var body = $("#template-" + $this).html();
+        if (body) {
+            window.isLoad = true;
+            window.editor.clear();
+            window.editor.insertValue(body);
+            window.editor.setCursor({line: 0, ch: 0});
+            resetEditorChanged(true);
+        }
+        $("#documentTemplateModal").modal('hide');
+    });
 });

static/prettify/themes/atelier-estuary-dark.min.css

@@ -0,0 +1,2 @@
+/*! Color themes for Google Code Prettify | MIT License | github.com/jmblog/color-themes-for-google-code-prettify */
+.prettyprint{background:#22221b;font-family:Menlo,Bitstream Vera Sans Mono,DejaVu Sans Mono,Monaco,Consolas,monospace;border:0!important}.pln{color:#f4f3ec}ol.linenums{margin-top:0;margin-bottom:0;color:#6c6b5a}li.L0,li.L1,li.L2,li.L3,li.L4,li.L5,li.L6,li.L7,li.L8,li.L9{padding-left:1em;background-color:#22221b;list-style-type:decimal}@media screen{.str{color:#7d9726}.kwd{color:#5f9182}.com{color:#6c6b5a}.typ{color:#36a166}.lit{color:#ae7313}.pun{color:#f4f3ec}.opn{color:#f4f3ec}.clo{color:#f4f3ec}.tag{color:#ba6236}.atn{color:#ae7313}.atv{color:#5b9d48}.dec{color:#ae7313}.var{color:#ba6236}.fun{color:#36a166}}