Permalink
Browse files

Fixed old close button and added left/right arroy key navigaiton

  • Loading branch information...
davidmerfield committed Jan 10, 2019
1 parent fa40d27 commit de873a9a75991fad2806874f4064799949ed0b03
Showing with 69 additions and 24 deletions.
  1. +20 −0 app/templates/photos/entry.html
  2. +49 −24 app/templates/photos/script.js
@@ -47,5 +47,25 @@
<a title="Next" {{#entry.previous.url}}href="{{entry.previous.url}}"{{/entry.previous.url}} class="arrow"><svg x="0px" y="0px" width="19.068px" height="35.308px" viewBox="0 0 19.068 35.308" enable-background="new 0 0 19.068 35.308" xml:space="preserve"><polyline fill="none" stroke="{{#entry.previous.url}}#000{{/entry.previous.url}}{{^entry.previous.url}}rgba(0,0,0,0.1){{/entry.previous.url}}" stroke-width="2" stroke-miterlimit="10" points="0.707,0.707 17.654,17.654 0.707,34.601"></polyline></svg></a>
</div>
{{/entry.page}}
<script type="text/javascript">
document.onkeydown = checkKey;
function checkKey(e) {
e = e || window.event;
var nextURL = "{{{entry.next.url}}}";
var previousURL = "{{{entry.previous.url}}}";
if (previousURL && e.keyCode == '39') {
window.location = previousURL
}
if (nextURL && e.keyCode == '37') {
window.location = nextURL
}
}
</script>
{{> footer}}
@@ -8,35 +8,60 @@ document.querySelectorAll('.page img').forEach(function(el){
+function(){"use strict";function e(e){var t=e.getBoundingClientRect(),n=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,o=window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0;return{top:t.top+n,left:t.left+o}}var t=80,n=function(){function n(){var e=document.createElement("img");e.onload=function(){d=Number(e.height),l=Number(e.width),o()},e.src=m.currentSrc||m.src}function o(){f=document.createElement("div"),f.className="zoom-img-wrap",f.style.position="absolute",f.style.top=e(m).top+"px",f.style.left=e(m).left+"px",v=m.cloneNode(),v.style.visibility="hidden",m.style.width=m.offsetWidth+"px",m.parentNode.replaceChild(v,m),document.body.appendChild(f),f.appendChild(m),m.classList.add("zoom-img"),m.setAttribute("data-action","zoom-out"),c=document.createElement("div"),c.className="zoom-overlay",document.body.appendChild(c),i(),r()}function i(){m.offsetWidth;var e=l,n=d,o=e/m.width,i=window.innerHeight-t,r=window.innerWidth-t,s=e/n,a=r/i;u=e<r&&n<i?o:s<a?i/n*o:r/e*o}function r(){m.offsetWidth;var t=e(m),n=window.pageYOffset,o=n+window.innerHeight/2,i=window.innerWidth/2,r=t.top+m.height/2,s=t.left+m.width/2,a=Math.round(o-r),d=Math.round(i-s),l="scale("+u+")",c="translate("+d+"px, "+a+"px) translateZ(0)";m.style.webkitTransform=l,m.style.msTransform=l,m.style.transform=l,f.style.webkitTransform=c,f.style.msTransform=c,f.style.transform=c,document.body.classList.add("zoom-overlay-open")}function s(){if(document.body.classList.remove("zoom-overlay-open"),document.body.classList.add("zoom-overlay-transitioning"),m.style.webkitTransform="",m.style.msTransform="",m.style.transform="",f.style.webkitTransform="",f.style.msTransform="",f.style.transform="",!1 in document.body.style)return a();f.addEventListener("transitionend",a),f.addEventListener("webkitTransitionEnd",a)}function a(){m.removeEventListener("transitionend",a),m.removeEventListener("webkitTransitionEnd",a),f&&f.parentNode&&(m.classList.remove("zoom-img"),m.style.width="",m.setAttribute("data-action","zoom"),v.parentNode.replaceChild(m,v),f.parentNode.removeChild(f),c.parentNode.removeChild(c),document.body.classList.remove("zoom-overlay-transitioning"))}var d=null,l=null,c=null,u=null,m=null,f=null,v=null;return function(e){return m=e,{zoomImage:n,close:s,dispose:a}}}();(function(){function e(){document.body.addEventListener("click",function(e){"zoom"===e.target.getAttribute("data-action")&&"IMG"===e.target.tagName&&t(e)})}function t(e){if(e.stopPropagation(),!document.body.classList.contains("zoom-overlay-open")){if(e.metaKey||e.ctrlKey)return o();i({forceDispose:!0}),m=n(e.target),m.zoomImage(),r()}}function o(){window.open(event.target.getAttribute("data-original")||event.target.currentSrc||event.target.src,"_blank")}function i(e){e=e||{forceDispose:!1},m&&(m[e.forceDispose?"dispose":"close"](),s(),m=null)}function r(){window.addEventListener("scroll",a),document.addEventListener("click",l),document.addEventListener("keyup",d),document.addEventListener("touchstart",c),document.addEventListener("touchend",l)}function s(){window.removeEventListener("scroll",a),document.removeEventListener("keyup",d),document.removeEventListener("click",l),document.removeEventListener("touchstart",c),document.removeEventListener("touchend",l)}function a(e){null===f&&(f=window.pageYOffset);var t=f-window.pageYOffset;Math.abs(t)>=40&&i()}function d(e){27==e.keyCode&&i()}function l(e){e.stopPropagation(),e.preventDefault(),i()}function c(e){v=e.touches[0].pageY,e.target.addEventListener("touchmove",u)}function u(e){Math.abs(e.touches[0].pageY-v)<=10||(i(),e.target.removeEventListener("touchmove",u))}var m=null,f=null,v=null;return{listen:e}})().listen()}();
//# sourceMappingURL=/dist/zoom-vanilla.min.js.map

var articles = [{{#allEntries}}"{{{url}}}"{{^last}},{{/last}}{{/allEntries}}];
var visitedPosts = sessionStorage.getItem("visitedPosts");

var localHistory = sessionStorage.getItem("localHistory");

if (localHistory) {
try {
localHistory = JSON.parse(localHistory);
} catch (e) {
localHistory = [];
}
} else {
localHistory = [];
try {
visitedPosts = JSON.parse(visitedPosts);
visitedPosts.push(window.location);
} catch (e) {
visitedPosts = [window.location];
}

localHistory = localHistory.slice(-50);
localHistory.push(window.location);
sessionStorage.setItem("localHistory", JSON.stringify(localHistory));
sessionStorage.setItem("visitedPosts", JSON.stringify(visitedPosts.slice(-100)));

var articles = [{{#all_entries}}'{{{url}}}'{{^last}},{{/last}}{{/all_entries}}];
var backIndex;
var articles;
function lastIndexPage () {
var backIndex = null;

localHistory.reverse().forEach(function(href, i) {
if (backIndex === undefined && articles.indexOf(href.pathname) === -1) {
backIndex = i;
return false;
}
});
visitedPosts.slice().reverse().forEach(function(item, i) {

// console.log(backIndex, item.pathname, articles.indexOf(item.pathname));

if (backIndex === null && articles.indexOf(item.pathname) === -1) {
backIndex = i;
return false;
}
});

// console.log('BACK INDEX', backIndex);

if (backIndex !== null)
window.history.go(-backIndex);
else
window.location = '/';

function lastIndexPage() {
window.history.go(-backIndex);
return false;
}

var candidates = sessionStorage.getItem("randomPostCandidates");

try {
candidates = JSON.parse(candidates);
candidates = candidates.filter(function(pathname){
return articles.indexOf(pathname) > -1 &&
pathname !== window.location
});
if (candidates.length === 0) candidates = articles;
} catch (e) {
candidates = articles.slice();
}

sessionStorage.setItem("randomPostCandidates", JSON.stringify(candidates));

function randomPost () {

window.location = candidates[Math.floor(Math.random() * candidates.length)];

return false;
}

0 comments on commit de873a9

Please sign in to comment.