diff --git a/README.md b/README.md index aa1cbb5..f7bed35 100644 --- a/README.md +++ b/README.md @@ -100,7 +100,6 @@ FP.Hooks.register("beforeChapterDisplay").example = function(callback, chapter){ if(callback) callback(); - } ``` diff --git a/annotator.html b/annotator.html index 8fb4de1..bf304a8 100755 --- a/annotator.html +++ b/annotator.html @@ -55,7 +55,7 @@ - + diff --git a/css/main.css b/css/main.css index 4e1debe..d731fde 100755 --- a/css/main.css +++ b/css/main.css @@ -55,8 +55,10 @@ body { #area { width: 80%; height: 80%; - margin: 0 auto; + margin-left: 10%; max-width: 1250px; + z-index: 2; + position: absolute; } #area iframe { @@ -175,7 +177,7 @@ input:-moz-placeholder { width: 1px; border-right: 1px #000 solid; height: 80%; - z-index: 10; + z-index: 1; left: 50%; top: 10%; opacity: .15; @@ -294,9 +296,11 @@ input:-moz-placeholder { #settingsPanel .large { font-size:large; } #settingsPanel .xlarge { font-size:x-large; } + @media only screen and (max-width: 1040px) { #area{ width: 50%; + margin-left: 25%; } #divider, @@ -308,6 +312,7 @@ input:-moz-placeholder { @media only screen and (max-width: 900px) { #area{ width: 60%; + margin-left: 20%; } #prev { @@ -322,6 +327,7 @@ input:-moz-placeholder { @media only screen and (max-width: 550px) { #area{ width: 80%; + margin-left: 10%; } #prev { @@ -371,3 +377,5 @@ input:-moz-placeholder { } } + + diff --git a/css/popup.css b/css/popup.css new file mode 100644 index 0000000..c41aac7 --- /dev/null +++ b/css/popup.css @@ -0,0 +1,96 @@ +/* http://davidwalsh.name/css-tooltips */ +/* base CSS element */ +.popup { + background: #eee; + border: 1px solid #ccc; + padding: 10px; + border-radius: 8px; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); + position: fixed; + max-width: 300px; + font-size: 12px; + + display: none; + margin-left: 2px; + + margin-top: 30px; +} + +.popup.above { + margin-top: -10px; +} + +.popup.left { + margin-left: -20px; +} + +.popup.right { + margin-left: 40px; +} + +.pop_content { + max-height: 225px; + overflow-y: auto; +} + +.pop_content > p { + margin-top: 0; +} + +/* below */ +.popup:before { + position: absolute; + display: inline-block; + border-bottom: 10px solid #eee; + border-right: 10px solid transparent; + border-left: 10px solid transparent; + border-bottom-color: rgba(0, 0, 0, 0.2); + left: 50%; + top: -10px; + margin-left: -6px; + content: ''; +} + +.popup:after { + position: absolute; + display: inline-block; + border-bottom: 9px solid #eee; + border-right: 9px solid transparent; + border-left: 9px solid transparent; + left: 50%; + top: -9px; + margin-left: -5px; + content: ''; +} + +/* above */ +.popup.above:before { + border-bottom: none; + border-top: 10px solid #eee; + border-top-color: rgba(0, 0, 0, 0.2); + top: 100%; +} + +.popup.above:after { + border-bottom: none; + border-top: 9px solid #eee; + top: 100%; +} + +.popup.left:before, +.popup.left:after +{ + left: 20px; +} + +.popup.right:before, +.popup.right:after +{ + left: auto; + right: 20px; +} + + +.popup.show, .popup.on { + display: block; +} \ No newline at end of file diff --git a/dev.html b/dev.html index 5007e0e..cb072b5 100755 --- a/dev.html +++ b/dev.html @@ -47,6 +47,8 @@ + + @@ -77,10 +79,11 @@   –   +
-
+
diff --git a/dist/hooks/hooks.min.js b/dist/hooks/hooks.min.js new file mode 100644 index 0000000..0cfa9b3 --- /dev/null +++ b/dist/hooks/hooks.min.js @@ -0,0 +1,2 @@ +/*! FuturePress - v0.1.0 - 2013-03-26 */ +FP.Hooks.register("beforeChapterDisplay").endnotes=function(e,t){var n=t.doc.querySelectorAll("a[href]"),r=Array.prototype.slice.call(n),i="epub:type",s="noteref",o={};FP.core.addCss("css/popup.css",!1,t.doc.head),r.forEach(function(e){function d(){var n,r=t.iframe.height,i=t.iframe.width,s,f,d=225;p||(f=a.cloneNode(!0),p=f.querySelector("p")),o[u]||(o[u]=document.createElement("div"),o[u].setAttribute("class","popup"),pop_content=document.createElement("div"),o[u].appendChild(pop_content),pop_content.appendChild(p),pop_content.setAttribute("class","pop_content"),t.bodyEl.appendChild(o[u]),o[u].addEventListener("mouseover",v,!1),o[u].addEventListener("mouseout",m,!1),t.book.listenUntil("book:pageChanged","book:chapterDestroy",g),t.book.listenUntil("book:pageChanged","book:chapterDestroy",m)),f=o[u],l=e.getBoundingClientRect(),c=l.left,h=l.top,f.classList.add("show"),f.style.left=c-f.offsetWidth/2+"px",f.style.top=h+"px",n=f.getBoundingClientRect(),d>r/2.5&&(d=r/2.5,pop_content.style.maxHeight=d+"px"),n.height+h>=r-25?(f.style.top=h-n.height+"px",f.classList.add("above")):f.classList.remove("above"),c-n.width<=0?(f.style.left=c+"px",f.classList.add("left")):f.classList.remove("left"),c+n.width/2>=i?(console.log("right"),f.style.left=c-300+"px",n=f.getBoundingClientRect(),f.style.left=c-n.width+"px",n.height+h>=r-25?(f.style.top=h-n.height+"px",f.classList.add("above")):f.classList.remove("above"),f.classList.add("right")):f.classList.remove("right")}function v(){o[u].classList.add("on")}function m(){o[u].classList.remove("on")}function g(){setTimeout(function(){o[u].classList.remove("show")},100)}var n=e.getAttribute(i),r,u,a,f,l,c,h,p;if(n!=s)return;r=e.getAttribute("href"),u=r.replace("#",""),a=t.doc.getElementById(u),e.addEventListener("mouseover",d,!1),e.addEventListener("mouseout",g,!1)}),e&&e()},FP.Hooks.register("beforeChapterDisplay").smartimages=function(e,t){var n=t.doc.querySelectorAll("img"),r=Array.prototype.slice.call(n),i=t.iframe.height,s;r.forEach(function(e){function n(){var n=e.offsetHeight,r=e.offsetTop;i=t.iframe.height,n+r>=i?rt.colWidth&&(f=t.colWidth/u,u=t.colWidth,a*=f),r.width=u,r.height=a}var n=e.getAttribute("ref"),r=document.createElement("iframe"),i=e.getAttribute("width"),s=e.getAttribute("height"),o=e.parentNode,u=i,a=s,f;l(),t.book.listenUntil("book:resized","book:chapterDestroy",l),r.src=n,o.replaceChild(r,e)}),e&&e()}; \ No newline at end of file diff --git a/dist/reader.min.js b/dist/reader.min.js index d23ab66..a539477 100644 --- a/dist/reader.min.js +++ b/dist/reader.min.js @@ -1,2 +1,2 @@ -/*! FuturePress - v0.1.0 - 2013-03-25 */ +/*! FuturePress - v0.1.0 - 2013-03-26 */ var FPR=FPR||{};FPR.app={},FPR.app.init=function(e){"use strict";function s(n){var s=window.location.search.match(/book=(.*)/),n=n||(s?s[1]:"moby-dick");FP.core.crossBrowserColumnCss(),i=e(window).width(),i>550?e("#main").width(i-r):e("#main").width(i),a(),t=new FP.Book("area"),t.listen("book:metadataReady",o),t.listen("book:tocReady",u),t.listen("book:bookReady",l),t.listen("book:chapterReady",p),t.listen("book:online",c),t.listen("book:offline",h),t.start(n),e(function(){d()})}function o(){var n=t.getTitle(),r=t.getCreator(),i=e("#book-title"),s=e("#chapter-title"),o=e("#title-seperator");document.title=n+" – "+r,i.html(n),s.html(r),o.show()}function u(){var n=t.getTOC(),r=e("#toc"),i,s;r.empty(),s=f(n,1),r.append(s),i=e(".toc_link"),i.on("click",function(n){var r=e(this),i=r.data("url");e(".openChapter").removeClass("openChapter"),r.parents("li").addClass("openChapter"),t.useHash||(t.show(i),n.preventDefault())})}function a(){var n="";localStorage.getItem("fontSize")?n=localStorage.getItem("fontSize"):(n="medium",localStorage.setItem("fontSize",n));var r=e("#settingsPanel");r.append("");var i=e("
  • "),s=e("Extra Small
    Small
    Medium
    Large
    Extra Large");i.find("h3").text("Font Size").after(s),r.find("ul").append(i);var o=e('input[name="fontSize"]');o.each(function(){e(this).attr("value")==n&&e(this).attr("checked","checked"),e(this).on("click",function(){localStorage.setItem("fontSize",e(this).attr("value")),t.iframe.contentDocument.location.reload(!0)})})}function f(t,n){var r=e("