mirror of https://github.com/mindoc-org/mindoc.git
1、格式化了 markdown.js 的代码；2、文档阅读页面中增加了分隔条功能。
Dandy Cheung
parent
87f7fd29ed
commit
d0a1c77c43
|
|
@ -0,0 +1,176 @@
|
|||
$(function () {
|
||||
var splitBar = {
|
||||
// 设置当前屏幕为 840px 时将分割条隐藏
|
||||
maxWidth: 840,
|
||||
|
||||
// 父元素选择器
|
||||
parentSelector: '.manual-body',
|
||||
|
||||
/**
|
||||
* 初始化分割条
|
||||
*/
|
||||
init: function () {
|
||||
var self = this;
|
||||
$(self.parentSelector)
|
||||
.append(
|
||||
$('\
|
||||
<div id="manual-vsplitbar" unselectable="on"\
|
||||
style="\
|
||||
z-index:301;\
|
||||
position: absolute;\
|
||||
user-select: none;\
|
||||
cursor: col-resize;\
|
||||
left: 275px;\
|
||||
height: 100%;\
|
||||
display: block;\
|
||||
width: 3px;\
|
||||
border-right: 1px solid #8f949a;">\
|
||||
<a href="javascript:void(0)" accesskey="" tabindex="0" title="vsplitbar"></a>\
|
||||
</div>\
|
||||
')
|
||||
.hover(
|
||||
function (event) {
|
||||
event.target.style.background = '#8f949ad8';
|
||||
},
|
||||
function (event) {
|
||||
event.target.style.background = '';
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
self.loadingHtml();
|
||||
|
||||
// 设置媒体查询
|
||||
mediaMatcher.set();
|
||||
},
|
||||
|
||||
/**
|
||||
* 加载页面时设置分割条是否显示
|
||||
*/
|
||||
loadingHtml: function () {
|
||||
var self = this;
|
||||
var htmlWidth = document.body.clientWidth;
|
||||
if (htmlWidth <= self.maxWidth) $('#manual-vsplitbar').css('display', 'none');
|
||||
},
|
||||
|
||||
/**
|
||||
* 在打开关闭菜单事初始化左右窗口和分割条
|
||||
*/
|
||||
reset: function () {
|
||||
if (isFullScreen) {
|
||||
// 关闭菜单时，初始化左右窗口
|
||||
$('#manual-vsplitbar').css('display', 'none');
|
||||
splitBar.inMaxWidthReset();
|
||||
$('.manual-left').css('width', '0px');
|
||||
} else {
|
||||
// 打开菜单时，初始化左右窗口
|
||||
$('#manual-vsplitbar').css('display', 'block');
|
||||
splitBar.outMaxWidthReset();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 屏幕小于等于 840px，重置左右窗口
|
||||
*/
|
||||
inMaxWidthReset: function () {
|
||||
$('#manual-vsplitbar').css('display', 'none');
|
||||
$('.m-manual.manual-reader .manual-right').css('left', '0');
|
||||
$('.manual-left').css('width', '280px');
|
||||
},
|
||||
|
||||
/**
|
||||
* 屏幕大于 840px，重置左右窗口
|
||||
*/
|
||||
outMaxWidthReset: function () {
|
||||
$('.manual-right').css('left', '279px');
|
||||
$('.manual-left').css('width', '279px');
|
||||
$('#manual-vsplitbar').css('left', '275px').css('display', 'block');
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置媒体查询
|
||||
* 分割条隐藏
|
||||
*/
|
||||
var mediaMatcher = {
|
||||
mql: window.matchMedia('(max-width:' + splitBar.maxWidth + 'px)'),
|
||||
|
||||
/**
|
||||
* 添加媒体查询监听事件
|
||||
*/
|
||||
set: function () {
|
||||
var self = this;
|
||||
self.mql.addListener(self.mqCallback);
|
||||
},
|
||||
|
||||
/**
|
||||
* 删除媒体查询监听事件
|
||||
*/
|
||||
remove: function () {
|
||||
var self = this;
|
||||
self.mql.removeListener(self.mqCallback);
|
||||
},
|
||||
|
||||
/**
|
||||
* 媒体查询回调函数
|
||||
*/
|
||||
mqCallback: function (event) {
|
||||
if (event.target.matches) { // 宽度小于等于 840 像素
|
||||
$(".m-manual").removeClass('manual-fullscreen-active');
|
||||
splitBar.inMaxWidthReset();
|
||||
} else { // 宽度大于 840 像素
|
||||
splitBar.outMaxWidthReset();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化分割条
|
||||
splitBar.init();
|
||||
|
||||
/**
|
||||
* 控制菜单宽度
|
||||
* 最小为 140px
|
||||
*/
|
||||
$('#manual-vsplitbar').on('mousedown', function (e) {
|
||||
var bodyEle = $('.manual-body')[0];
|
||||
|
||||
var leftPane = $('.manual-left')[0];
|
||||
var splitBar = $('#manual-vsplitbar')[0];
|
||||
var rightPane = $('.manual-right')[0];
|
||||
|
||||
var disX = (e || event).clientX;
|
||||
|
||||
splitBar.left = splitBar.offsetLeft;
|
||||
|
||||
var docMouseMove = document.onmousemove;
|
||||
var docMouseUp = document.onmouseup;
|
||||
|
||||
document.onmousemove = function (e) {
|
||||
var curPos = splitBar.left + ((e || event).clientX - disX);
|
||||
var maxPos = bodyEle.clientWidth - splitBar.offsetWidth;
|
||||
|
||||
curPos > maxPos && (curPos = maxPos);
|
||||
curPos < 140 && (curPos = 140);
|
||||
|
||||
leftPane.style.width = curPos + "px";
|
||||
splitBar.style.left = curPos - 3 + "px";
|
||||
rightPane.style.left = curPos + 3 + "px";
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = docMouseMove;
|
||||
document.onmouseup = docMouseUp;
|
||||
splitBar.releaseCapture && splitBar.releaseCapture();
|
||||
};
|
||||
|
||||
splitBar.setCapture && splitBar.setCapture();
|
||||
return false;
|
||||
});
|
||||
|
||||
/**
|
||||
* 关闭侧边栏时，同步分割条；
|
||||
*/
|
||||
$(".manual-fullscreen-switch").on("click", splitBar.reset);
|
||||
});
|
||||
|
|
@ -230,11 +230,12 @@
|
|||
<script src="{{cdnjs "/static/bootstrap/js/bootstrap.min.js"}}"></script>
|
||||
<script src="{{cdnjs "/static/js/jquery.form.js"}}" type="text/javascript"></script>
|
||||
<script src="{{cdnjs "/static/jstree/3.3.4/jstree.min.js"}}" type="text/javascript"></script>
|
||||
<script type="text/javascript" src="{{cdnjs "/static/nprogress/nprogress.js"}}"></script>
|
||||
<script type="text/javascript" src="{{cdnjs "/static/highlight/highlight.js"}}"></script>
|
||||
<script type="text/javascript" src="{{cdnjs "/static/highlight/highlightjs-line-numbers.min.js"}}"></script>
|
||||
<script type="text/javascript" src="/static/js/jquery.highlight.js"></script>
|
||||
<script type="text/javascript" src="/static/js/kancloud.js"></script>
|
||||
<script src="{{cdnjs "/static/nprogress/nprogress.js"}}" type="text/javascript"></script>
|
||||
<script src="{{cdnjs "/static/highlight/highlight.js"}}" type="text/javascript"></script>
|
||||
<script src="{{cdnjs "/static/highlight/highlightjs-line-numbers.min.js"}}" type="text/javascript"></script>
|
||||
<script src="/static/js/jquery.highlight.js" type="text/javascript"></script>
|
||||
<script src="/static/js/kancloud.js" type="text/javascript"></script>
|
||||
<script src="/static/js/splitbar.js" type="text/javascript"></script>
|
||||
<script type="text/javascript">
|
||||
active_book_id = {{.Model.Identify}};
|
||||
active_doc_id = {{.DocumentId}};
|
||||
|
|
|
|||
Loading…
Reference in New Issue