book/es6tutorial
1
0
Fork 0
mirror of https://github.com/ruanyf/es6tutorial.git synced 2025-05-25 11:12:21 +00:00
Code Issues Releases Wiki Activity

Merge pull request #8 from wenzhixin/gh-pages

Browse Source 
增加保存阅读进度功能
This commit is contained in:
ruanyf 2014-05-07 22:27:14 +08:00
commit 8c7635e698
3 changed files with 98 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
index.html
View File

@ -8,6 +8,7 @@
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script> <script src="//code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<script src="js/marked.js"></script> <script src="js/marked.js"></script>
<script src="js/store.js"></script>
<script src="js/ditto.js"></script> <script src="js/ditto.js"></script>
<script src="js/prism.js"></script> <script src="js/prism.js"></script>
<link rel="stylesheet" href="app/bower_components/normalize-css/normalize.css"> <link rel="stylesheet" href="app/bower_components/normalize-css/normalize.css">
@ -34,7 +35,7 @@
ditto.sidebar_file = "sidebar.md", ditto.sidebar_file = "sidebar.md",
ditto.document_title = "ECMAScript 6入门", ditto.document_title = "ECMAScript 6入门",
// where the docs are actually stored on github - so you can edit // where the docs are actually stored on github - so you can edit
ditto.base_url = "https://github.com/ruanyf/es6tutorial/edit/gh-pages/"; // <------- EDIT ME!! ditto.base_url = "https://github.com/ruanyf/es6tutorial/edit/gh-pages"; // <------- EDIT ME!!
// run // run
ditto.run(); ditto.run();

179
js/ditto.js
View File

@ -11,13 +11,14 @@ var ditto = {
sidebar: true, sidebar: true,
edit_button: true, edit_button: true,
back_to_top_button: true, back_to_top_button: true,
save_progress: true, // 保存阅读进度
// initialize function // initialize function
run: initialize run: initialize
}; };
var disqusCode = '<h3>留言</h3><div id="disqus_thread"></div>'; var disqusCode = '<h3>留言</h3><div id="disqus_thread"></div>';
var menu=new Array(); var menu = new Array();
function initialize() { function initialize() {
// initialize sidebar and buttons // initialize sidebar and buttons
@ -41,27 +42,27 @@ function initialize() {
function init_sidebar_section() { function init_sidebar_section() {
$.get(ditto.sidebar_file, function(data) { $.get(ditto.sidebar_file, function(data) {
$(ditto.sidebar_id).html(marked(data)); $(ditto.sidebar_id).html(marked(data));
// 初始化内容数组 // 初始化内容数组
var menuOL = $(ditto.sidebar_id+' ol'); var menuOL = $(ditto.sidebar_id + ' ol');
menuOL.attr('start',0); menuOL.attr('start', 0);
menuOL.find('li a').map(function(){ menuOL.find('li a').map(function() {
menu.push(this.href.slice(this.href.indexOf('#'))); menu.push(this.href.slice(this.href.indexOf('#')));
}); });
$('#pageup').on('click',function (){ $('#pageup').on('click', function() {
for (var i=0;i<menu.length;i++){ for (var i = 0; i < menu.length; i++) {
if (location.hash==='') break; if (location.hash === '') break;
if (menu[i]===location.hash) break; if (menu[i] === location.hash) break;
} }
location.hash = menu[i-1] location.hash = menu[i - 1]
}); });
$('#pagedown').on('click',function (){ $('#pagedown').on('click', function() {
for (var i=0;i<menu.length;i++){ for (var i = 0; i < menu.length; i++) {
if (location.hash==='') break; if (location.hash === '') break;
if (menu[i]===location.hash) break; if (menu[i] === location.hash) break;
} }
location.hash = menu[i+1]; location.hash = menu[i + 1];
}); });
}, "text").fail(function() { }, "text").fail(function() {
alert("Opps! can't find the sidebar file to display!"); alert("Opps! can't find the sidebar file to display!");
}); });
@ -139,20 +140,20 @@ function create_page_anchors() {
$('#content h' + i).map(function() { $('#content h' + i).map(function() {
headers.push($(this).text()); headers.push($(this).text());
$(this).addClass(replace_symbols($(this).text())); $(this).addClass(replace_symbols($(this).text()));
this.id = 'h'+i+'-'+replace_symbols($(this).text()); this.id = 'h' + i + '-' + replace_symbols($(this).text());
}); });
if ((i === 2) && headers.length !== 0){ if ((i === 2) && headers.length !== 0) {
var ul_tag = $('<ol></ol>') var ul_tag = $('<ol></ol>')
.insertAfter('#content h1') .insertAfter('#content h1')
.addClass("content-toc") .addClass("content-toc")
.attr('id','content-toc'); .attr('id', 'content-toc');
for (var j = 0; j < headers.length; j++) { for (var j = 0; j < headers.length; j++) {
var li_tag = $('<li></li>').text(headers[j]); var li_tag = $('<li></li>').text(headers[j]);
ul_tag.append(li_tag); ul_tag.append(li_tag);
li_create_linkage(li_tag, i); li_create_linkage(li_tag, i);
} }
} }
} }
} }
@ -195,6 +196,11 @@ function router() {
var path = location.hash.replace("#", "./"); var path = location.hash.replace("#", "./");
if (ditto.save_progress && store.get('menu-progress') !== location.hash) {
store.set('menu-progress', location.hash);
store.set('page-progress', 0);
}
// default page if hash is empty // default page if hash is empty
if (location.pathname === "/index.html") { if (location.pathname === "/index.html") {
path = location.pathname.replace("index.html", ditto.index); path = location.pathname.replace("index.html", ditto.index);
@ -208,79 +214,80 @@ function router() {
// otherwise get the markdown and render it // otherwise get the markdown and render it
var loading = show_loading(); var loading = show_loading();
$.get(path , function(data) { $.get(path, function(data) {
$(ditto.error_id).hide(); $(ditto.error_id).hide();
$(ditto.content_id).html(marked(data)+disqusCode); $(ditto.content_id).html(marked(data) + disqusCode);
if ($(ditto.content_id+" h1").text() === ditto.document_title){ if ($(ditto.content_id + " h1").text() === ditto.document_title) {
document.title = ditto.document_title; document.title = ditto.document_title;
} else { } else {
document.title = $(ditto.content_id+" h1").text() + " - " + ditto.document_title; document.title = $(ditto.content_id + " h1").text() + " - " + ditto.document_title;
} }
normalize_paths(); normalize_paths();
create_page_anchors(); create_page_anchors();
// 完成代码高亮 // 完成代码高亮
$('#content code').map(function() { $('#content code').map(function() {
Prism.highlightElement(this); Prism.highlightElement(this);
}); });
// 加载disqus // 加载disqus
(function () { (function() {
// http://docs.disqus.com/help/2/ // http://docs.disqus.com/help/2/
window.disqus_shortname = 'es6'; window.disqus_shortname = 'es6';
window.disqus_identifier = (location.hash?location.hash.replace("#", ""):'READEME'); window.disqus_identifier = (location.hash ? location.hash.replace("#", "") : 'READEME');
window.disqus_title =$(ditto.content_id+" h1").text(); window.disqus_title = $(ditto.content_id + " h1").text();
window.disqus_url = 'http://es6.ruanyifeng.com/' + (location.hash?location.hash.replace("#", ""):'README'); window.disqus_url = 'http://es6.ruanyifeng.com/' + (location.hash ? location.hash.replace("#", "") : 'README');
// http://docs.disqus.com/developers/universal/ // http://docs.disqus.com/developers/universal/
(function() { (function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true; var dsq = document.createElement('script');
dsq.src = 'http://'+window.disqus_shortname+'.disqus.com/embed.js'; dsq.type = 'text/javascript';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); dsq.async = true;
})(); dsq.src = 'http://' + window.disqus_shortname + '.disqus.com/embed.js';
})(); (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
})();
if(location.hash !== ''){ if (location.hash === '' || location.hash === menu[0]) {
$('html, body').animate({ $('#pageup').css('display', 'none');
scrollTop: $('#content').offset().top } else {
}, 200); $('#pageup').css('display', 'inline-block');
} }
if(location.hash==='' || location.hash===menu[0]){ if (location.hash === menu[(menu.length - 1)]) {
$('#pageup').css('display','none'); $('#pagedown').css('display', 'none');
}else{ } else {
$('#pageup').css('display','inline-block'); $('#pagedown').css('display', 'inline-block');
} }
if (location.hash===menu[(menu.length-1)]){ (function() {
$('#pagedown').css('display','none'); var $w = $(window);
}else{ var $prog2 = $('.progress-indicator-2');
$('#pagedown').css('display','inline-block'); var wh = $w.height();
} var h = $('body').height();
var sHeight = h - wh;
var perc = ditto.save_progress ? store.get('page-progress') || 0 : 0;
(function(){ $w.off('scroll').on('scroll', function() {
var $w = $(window); var perc = Math.max(0, Math.min(1, $w.scrollTop() / sHeight));
var $prog2 = $('.progress-indicator-2'); updateProgress(perc);
var wh = $w.height(); });
var h = $('body').height();
var sHeight = h - wh;
$w.off('scroll');
$w.on('scroll', function(){
var perc = Math.max(0, Math.min(1, $w.scrollTop()/sHeight));
updateProgress(perc);
});
function updateProgress(perc){ function updateProgress(perc) {
$prog2.css({width : perc*100 + '%'}); $prog2.css({width: perc * 100 + '%'});
} ditto.save_progress && store.set('page-progress', perc);
}
}()); updateProgress(perc);
$('html, body').animate({
scrollTop: sHeight * perc
}, 200);
}());
}).fail(function() { }).fail(function() {
show_error(); show_error();
}).always(function() { }).always(function() {
clearInterval(loading); clearInterval(loading);
$(ditto.loading_id).hide(); $(ditto.loading_id).hide();
}); });
} }

2
js/store.js Normal file
View File

File diff suppressed because one or more lines are too long