diff --git a/files/amWiki.css b/files/amWiki.css index 09cd09f..c2d7be9 100644 --- a/files/amWiki.css +++ b/files/amWiki.css @@ -106,18 +106,30 @@ body{position:relative;background:#e7e8eb;} .main-sibling a:not([href]){color:#333;} .main-sibling a:not([href]):hover{text-decoration:none;} -/* ---------- footer ---------- */ -footer{position:relative;width:100%;height:15px;} -.signature{position:absolute;right:40px;bottom:17px;color:#999;} +/* ---------- contents ---------- */ +aside .contents{position:fixed;bottom:137px;right:7px;z-index:9900;height:38px;width:38px;background:#f4f5f9;border:1px solid #ccc;} +aside .contents .btn{cursor:pointer;} +aside .contents .btn svg{position:absolute;top:7px;left:7px;width:22px;height:22px;color:#aaa;} +aside .contents:hover .btn svg,aside .contents.on .btn svg{display:none;} +aside .contents .btn span{display:none;padding:12px 0;font-family:Microsoft YaHei,STXihei,STHeiti,Verdana,Arial,Helvetica,sans-serif;line-height:14px;text-align:center;color:#aaa;} +aside .contents:hover .btn span,aside .contents.on .btn span{display:block;} +aside .contents-list{display:none;position:absolute;right:36px;bottom:-1px;width:270px;max-height:500px;padding:18px;overflow:hidden;overflow-y:scroll;background:#f4f5f9;border:1px solid #ccc;} +aside .contents:hover .contents-list,aside .contents.on .contents-list{display:block;} +aside .contents-list p{padding-bottom:5px;margin-bottom:8px;border-bottom:#ccc 1px solid;} +aside .contents-list ol{padding-left:20px;} /* ---------- backTop ---------- */ -.back-top{position:fixed;bottom:100px;right:7px;z-index: 9900;height:38px;width:38px;background:#f4f5f9;border:1px solid #ccc;} -.back-icon{display:block;position:relative;width:32px;margin:2px auto;} -.back-icon svg{position:absolute;top:6px;left:5px;width:22px;height:22px;color:#aaa;} -.back-text{display:none;position:absolute;top:0;left:0;z-index:99;margin:4px;font-family:Microsoft YaHei,STXihei,STHeiti,Verdana,Arial,Helvetica,sans-serif;font-size:11px;text-align:center;letter-spacing:2px;line-height:14px;background-color:#f4f5f9;cursor:pointer;} -.back-text:hover{text-decoration:none;} -.back-top:hover .back-icon{border:none;} -.back-top:hover .back-text{display:block;color:#aaa;} +aside .back-top{position:fixed;bottom:100px;right:7px;z-index: 9900;height:38px;width:38px;background:#f4f5f9;border:1px solid #ccc;} +aside .back-icon{display:block;position:relative;width:32px;margin:2px auto;} +aside .back-icon svg{position:absolute;top:6px;left:5px;width:22px;height:22px;color:#aaa;} +aside .back-text{display:none;position:absolute;top:0;left:0;z-index:99;padding:4px;font-family:Microsoft YaHei,STXihei,STHeiti,Verdana,Arial,Helvetica,sans-serif;font-size:11px;text-align:center;letter-spacing:2px;line-height:14px;background-color:#f4f5f9;cursor:pointer;} +aside .back-text:hover{text-decoration:none;} +aside .back-top:hover .back-icon{border:none;} +aside .back-top:hover .back-text{display:block;color:#aaa;} + +/* ---------- footer ---------- */ +footer{position:relative;width:100%;height:15px;} +footer .signature{position:absolute;right:40px;bottom:17px;color:#999;} /* ---------- lowBrowser ---------- */ #lowBrowser{position:fixed;top:0;left:0;z-index:9999999;width:100%;height:100%;} diff --git a/files/amWiki.docs.js b/files/amWiki.docs.js index e04e034..7bc4b0f 100644 --- a/files/amWiki.docs.js +++ b/files/amWiki.docs.js @@ -19,7 +19,9 @@ this.$e = { win: $(win), //markdown文档内容容器 - view: $('#view') + view: $('#view'), + title: $('title'), + contentsTitle: $('#contentsTitle') }; this.data = { pageWidth: 0 @@ -64,11 +66,24 @@ }); }; + //转换链接文本 + Docs.prototype._tramsformLinkText = function (str) { + return str + .replace(/^\s+|\s+$/g, '') //去除首尾空格 + .replace(/'/g, ''') //转义单引号 + .replace(/"/g, '"') //转义双引号，由于双引号无法正确传递给html属性，当作为hash时将删除处理 + .replace(/\(/g, '(') //转义左圆括号 + .replace(/\)/g, ')') //转义右圆括号 + .replace(/\[/g, '[') //转义左中括号 + .replace(/\]/g, ']'); //转义右中括号 + }; + //设置文档h1、h2、h3描记 - Docs.prototype.setTitlesAnchor = function () { + Docs.prototype._setTitlesAnchor = function () { var that = this; var $titles = null; var hash = ''; + var contentsMd = ''; //提取目录为markdown字符串 if (location.hash && location.hash.length > 1) { hash = location.hash.split('#')[1]; } @@ -77,11 +92,18 @@ $titles = that.$e.view.find('h1,h2,h3'); $titles.each(function (index, element) { var $this = $(element); - var text = $.trim($this.text()).replace('"', ''); + var text1 = that._tramsformLinkText($this.text()); + var text2 = text1.replace(/"/g, ''); //删除双引号 + //提取目录 + if ($this.is('h2')) { + contentsMd += '1. [' + text1 + '](#' + text2 + ' "' + text2 + '")\n'; + } else if ($this.is('h3')) { + contentsMd += '\t1. [' + text1 + '](#' + text2 + ' "' + text2 + '")\n'; + } //设置描记 - $this.prepend(anchorHtml.replace(/\{title\}/g, text)); + $this.prepend(anchorHtml.replace(/\{title\}/g, text2)); //首次打开页面滚动位置修正 - if (hash == text) { + if (hash == $this.text().replace(/"/g, '')) { if (that.data.pageWidth <= 720) { that.$e.win.scrollTop($this.offset().top - 55); } else { @@ -89,6 +111,10 @@ } } }); + if (contentsMd.indexOf('\t') == 0) { + contentsMd = '1. 　\n' + contentsMd; + } + return contentsMd; }; //设置js注释隐藏 @@ -171,8 +197,10 @@ Docs.prototype.renderDoc = function (content) { var that = this; this.cleanView(); + var html = marked(content) + .replace(/\[(TOC|MENU)]/g, '
'); this.$e.view - .html(marked(content)) + .html(html) .find('pre code').each(function (i, element) { var $elm = $(element); var className = $elm.attr('class') || ''; @@ -191,9 +219,13 @@ } }); //设置网页title - $('title').text(this.$e.view.find('h1').eq(0).text()); + var title = this.$e.view.find('h1').eq(0).text(); + this.$e.title.text(title); + this.$e.contentsTitle.text(title).attr('href', '#' + title.replace(/"/g, '')); //设置描点 - this.setTitlesAnchor(); + var contents = this._setTitlesAnchor(); + //设置目录 + $('.markdown-contents').html(marked(contents)); }; //读取文档 diff --git a/files/amWiki.js b/files/amWiki.js index 429dff2..35c76af 100644 --- a/files/amWiki.js +++ b/files/amWiki.js @@ -9,6 +9,10 @@ $(function () { 'use strict'; + /* + 引入 + */ + //工具集 var tools = window.tools; //文档管理器 @@ -24,9 +28,21 @@ $(function () { //是否支持history.state的API (IE9不支持) var HISTORY_STATE = 'pushState' in history; + /* + 页面基本 + */ + + //页面元素 + var $menuBar = $('#menuBar'), + $mainSibling = $('#mainSibling'), + $nav = $('.nav'), + $menuIcon = $('.menu_icon'), + $filter = $('#menuFilter'), + $filterClean = $filter.next('i'), + $contents = $('#contents'); + //页面基本显示与操作 - var $menuBar = $('#menuBar'); - var pageBase = function () { + (function () { //菜单折叠 $menuBar.on('click', 'h5', function () { var $this = $(this), @@ -58,20 +74,7 @@ $(function () { $next.slideDown(200); } }); - //展开折叠所有导航栏位按钮 - /*$('.menu-fold').on('click', function () { - var $this = $(this); - if ($this.hasClass('on')) { - $this.removeClass('on').find('use').attr('xlink:href', '#navFolder1'); - $menuBar.find('h5').removeClass('on').next('ul').hide(); - } else { - $this.addClass('on').find('use').attr('xlink:href', '#navFolder2'); - $menuBar.find('h5').addClass('on').next('ul').show(); - } - });*/ //响应式菜单 - var $nav = $('.nav'), - $menuIcon = $('.menu_icon'); $menuIcon.on('click', function () { var $this = $(this); if ($this.hasClass('close')) { @@ -91,8 +94,6 @@ $(function () { $nav.removeClass('on'); }); //页面筛选 - var $filter = $('#menuFilter'); - var $filterClean = $filter.next('i'); $filter.on('blur change input propertychange', function () { var value = $filter.val(); if (value != '') { @@ -141,10 +142,18 @@ $(function () { $('#svgSymbols').append(svg); }, 'text'); } - }; + //目录锁定 + $contents.children('.btn').on('click', function(){ + $contents.toggleClass('on'); + }); + + })(); + + /* + 业务操作函数 + */ //改变底部上下篇目 - var $mainSibling = $('#mainSibling'); var changeSibling = function ($item) { //如果未传导航项进来，隐藏上下篇目栏位 if (!$item) { @@ -251,7 +260,8 @@ $(function () { testing && testing.crawlContent(); } //如果服务器文档与本地缓存一致，不进行任何操作 - else {} + else { + } //记录文档打开数 storage.increaseOpenedCount(path); } @@ -296,14 +306,39 @@ $(function () { }, 'text'); }; + /* + 启动应用 + */ + //解析地址参数 var path = tools.getURLParameter('file'); - if (!path) { - path = '首页'; - } else { - path = decodeURI(path); + path = !path ? '首页' : decodeURI(path); + + //加载导航 + loadNav(function (list) { + //核对本地存储 + storage.checkLibChange(list); + //首次打开改变导航 + changeNav(path); + //首次打开改变页面 + changePage(path, true); + }); + + //history api 浏览器前进后退操作响应 + if (HISTORY_STATE) { + $(window).on('popstate', function (e) { + var path = e.originalEvent.state.path; + //改变导航 + changeNav(path); + //改变页面 + changePage(path, true); + }); } + /* + 回调中转 + */ + //重建缓存 search.onNeedRebuildStorage = function (callback) { storage.clearLibraries(); @@ -330,29 +365,6 @@ $(function () { } }; - //页面基本 - pageBase(); - //加载导航 - loadNav(function (list) { - //核对本地存储 - storage.checkLibChange(list); - //首次打开改变导航 - changeNav(path); - //首次打开改变页面 - changePage(path, true); - }); - - //history api 浏览器前进后退操作响应 - if (HISTORY_STATE) { - $(window).on('popstate', function (e) { - var path = e.originalEvent.state.path; - //改变导航 - changeNav(path); - //改变页面 - changePage(path, true); - }); - } - }); diff --git a/files/amWiki.tpl b/files/amWiki.tpl index 1b97c1a..a56f2cd 100644 --- a/files/amWiki.tpl +++ b/files/amWiki.tpl @@ -43,11 +43,6 @@ -
@@ -73,7 +68,7 @@

全库搜索

- +
@@ -83,9 +78,7 @@
  • - {{title}} - {{api}} - {{content}} + {{title}} {{api}} {{content}}

    位置：{{path}}

    @@ -102,23 +95,38 @@ {{amWiki.testing.tpl}}
    • - - - +