lsm/mindoc
1
0
Fork 0
mirror of https://github.com/mindoc-org/mindoc.git synced 2025-04-05 20:17:53 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat:优化文档TOC显示效果

Browse Source
This commit is contained in:
lifei6671 2018-09-11 18:36:42 +08:00
parent 68e9002986
commit 7e05c18c29
4 changed files with 97 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
models/DocumentModel.go
View File

@ -256,7 +256,7 @@ func (item *Document) ReleaseContent() error {
if conf.BaseUrl != "" && !strings.HasPrefix(src, conf.BaseUrl) { if conf.BaseUrl != "" && !strings.HasPrefix(src, conf.BaseUrl) {
contentSelection.SetAttr("target", "_blank") contentSelection.SetAttr("target", "_blank")
if html, err := content.Html(); err == nil { if html, err := content.Html(); err == nil {
item.Release = html item.Release = strings.TrimSuffix(strings.TrimPrefix(strings.TrimSpace(html),"<html><head></head><body>"),"</body></html>")
} }
} }
} }
@ -305,7 +305,15 @@ func (doc *Document) AppendInfo() *Document {
docCreator, err := NewMember().Find(doc.MemberId,"real_name","account") docCreator, err := NewMember().Find(doc.MemberId,"real_name","account")
if strings.TrimSpace(doc.Release) != "" { doc.Release = strings.TrimSuffix(strings.TrimPrefix(strings.TrimSpace(doc.Release),"<html><head></head><body>"),"</body></html>")
suffix := ""
if doc.Release != "" {
beego.Info(doc.Release)
if strings.HasPrefix(doc.Release,"<div class=\"markdown-toc") {
doc.Release = strings.TrimSuffix(doc.Release,"</div>")
suffix = "</div>"
}
doc.Release += "<div class=\"wiki-bottom\">文档更新时间: " + doc.ModifyTime.Local().Format("2006-01-02 15:04") + " &nbsp;&nbsp;作者："; doc.Release += "<div class=\"wiki-bottom\">文档更新时间: " + doc.ModifyTime.Local().Format("2006-01-02 15:04") + " &nbsp;&nbsp;作者：";
if err == nil && docCreator != nil { if err == nil && docCreator != nil {
if docCreator.RealName != "" { if docCreator.RealName != "" {
@ -314,7 +322,8 @@ func (doc *Document) AppendInfo() *Document {
doc.Release += docCreator.Account doc.Release += docCreator.Account
} }
} }
doc.Release += "</div>" doc.Release += "</div>" + suffix
} }
return doc return doc
} }

1
static/css/kancloud.css
View File

@ -486,6 +486,7 @@ table>tbody>tr:hover{
list-style: none; list-style: none;
border-top: 1px solid #DDDDDD; border-top: 1px solid #DDDDDD;
padding-top: 15px; padding-top: 15px;
clear: both;
} }
.manual-article .wiki-bottom{ .manual-article .wiki-bottom{
border-top: 1px solid #E5E5E5; border-top: 1px solid #E5E5E5;

71
static/css/markdown.preview.css
View File

@ -32,9 +32,74 @@
} }
/**************TOC*******************/ /**************TOC*******************/
.markdown-toc{ .editormd-preview-container{
padding: 16px 11px 4px; position: relative;
border: 1px solid #f0f0f0; height: auto;
width: 100%;
}
.article-body .markdown-toc{
position: fixed;
right: 0;
width: 260px;
font-size: 12px;
}
.markdown-toc ul{
list-style:none;
}
.markdown-toc .markdown-toc-list>li{
padding: 3px 10px 3px 16px;
line-height: 18px;
border-left: 2px solid #e8e8e8;
color: #595959;
}
.markdown-toc .markdown-toc-list>li.active{
border-right: 2px solid #25b864;
}
.article-body .markdown-article{
margin-right: 200px;
}
.markdown-toc-list .directory-item {
padding: 3px 10px 3px 16px;
line-height: 18px;
border-left: 2px solid #e8e8e8;
color: #595959;
}
.markdown-toc-list .directory-item-link {
width: 100%;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #595959;
}
.markdown-toc-list .directory-item-link:hover {
color: #8C8C8C;
}
.markdown-toc-list .directory-item-link-1 {
padding-left: 0;
}
.markdown-toc-list .directory-item-link-2 {
padding-left: 1.2em;
}
.markdown-toc-list .directory-item-link-3 {
padding-left: 2.4em;
}
.markdown-toc-list .directory-item-link-4 {
padding-left: 3.6em;
}
.markdown-toc-list .directory-item-link-5 {
padding-left: 4.8em;
}
.markdown-toc-list .directory-item-active {
border-left: 2px solid #25b864;
}
.markdown-toc-list .directory-item-active a {
color: #25b864;
}
.markdown-toc-list .directory-item-active a:hover {
color: #7CD4A2;
} }
/***********代码样式*****************/ /***********代码样式*****************/
.markdown-body .highlight pre, .markdown-body pre{ .markdown-body .highlight pre, .markdown-body pre{

26
static/editor.md/editormd.js
View File

@ -3713,20 +3713,24 @@
text = trim(text); text = trim(text);
var escapedText = text.toLowerCase().replace(/[^\w]+/g, "-"); var escapedText = text.toLowerCase().replace(/[^\w]+/g, "-");
// var isChinese = /^[\u4e00-\u9fa5]+$/.test(text);
// var id = (isChinese) ? escape(text).replace(/\%/g, "") : text.toLowerCase().replace(/[^\w]+/g, "-");
var id = Math.floor(Math.random() * 1000000000 ).toString(36);
var toc = { var toc = {
text : text, text : text,
level : level, level : level,
slug : escapedText slug : escapedText,
id : id
}; };
var isChinese = /^[\u4e00-\u9fa5]+$/.test(text);
var id = (isChinese) ? escape(text).replace(/\%/g, "") : text.toLowerCase().replace(/[^\w]+/g, "-");
markdownToC.push(toc); markdownToC.push(toc);
var headingHTML = "<h" + level + " id=\"h"+ level + "-" + this.options.headerPrefix + id +"\">"; var headingHTML = "<h" + level + " id=\"" + id +"\" class=\"markdown-heading\">";
headingHTML += "<a name=\"" + text + "\" class=\"reference-link\"></a>"; headingHTML += "<a name=\"" + id + "\" class=\"reference-link\"></a>";
headingHTML += "<span class=\"header-link octicon octicon-link\"></span>"; headingHTML += "<span class=\"header-link octicon octicon-link\"></span>";
headingHTML += (hasLinkReg) ? this.atLink(this.emoji(linkText)) : this.atLink(this.emoji(text)); headingHTML += (hasLinkReg) ? this.atLink(this.emoji(linkText)) : this.atLink(this.emoji(text));
headingHTML += "</h" + level + ">"; headingHTML += "</h" + level + ">";
@ -3761,7 +3765,7 @@
text = (isTeXLine) ? text.replace(/\$/g, "") : text; text = (isTeXLine) ? text.replace(/\$/g, "") : text;
} }
var tocHTML = "<div class=\"markdown-toc editormd-markdown-toc\">" + text + "</div>"; var tocHTML = "<div class=\"markdown-toc editormd-markdown-toc\">" + text + "</div><div class=\"markdown-article\">";
return (isToC) ? ( (isToCMenu) ? "<div class=\"editormd-toc-menu\">" + tocHTML + "</div><br/>" : tocHTML ) return (isToC) ? ( (isToCMenu) ? "<div class=\"editormd-toc-menu\">" + tocHTML + "</div><br/>" : tocHTML )
: ( (pageBreakReg.test(text)) ? this.pageBreak(text) : "<p" + isTeXAddClass + ">" + this.atLink(this.emoji(text)) + "</p>\n" ); : ( (pageBreakReg.test(text)) ? this.pageBreak(text) : "<p" + isTeXAddClass + ">" + this.atLink(this.emoji(text)) + "</p>\n" );
@ -3849,6 +3853,7 @@
{ {
var text = toc[i].text; var text = toc[i].text;
var level = toc[i].level; var level = toc[i].level;
var id = toc[i].id;
if (level < startLevel) { if (level < startLevel) {
continue; continue;
@ -3860,16 +3865,17 @@
} }
else if (level < lastLevel) else if (level < lastLevel)
{ {
html += (new Array(lastLevel - level + 2)).join("</ul></li>"); // html += (new Array(lastLevel - level + 2)).join("</ul></li>");
} }
else else
{ {
html += "</ul></li>"; // html += "</ul></li>";
} }
html += "<li><a class=\"toc-level-" + level + "\" href=\"#" + text + "\" level=\"" + level + "\">" + text + "</a><ul>"; html += "<li class=\"directory-item\"><a class=\"directory-item-link directory-item-link-" + level + "\" href=\"#" + id + "\" level=\"" + level + "\">" + text + "</a></li>";
lastLevel = level; lastLevel = level;
} }
console.log(html);
var tocContainer = container.find(".markdown-toc"); var tocContainer = container.find(".markdown-toc");