From 4500dcc1e44d0c8b3fffb8b730ca016b2c313a43 Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:02:40 +0000 Subject: [PATCH 01/14] refactor: remove css and js from html doc, put into own folders --- compariscope.html | 417 +-------------------------------------- js/compariscope.js | 378 +++++++++++++++++++++++++++++++++++ styling/compariscope.css | 32 +++ 3 files changed, 412 insertions(+), 415 deletions(-) create mode 100644 js/compariscope.js create mode 100644 styling/compariscope.css diff --git a/compariscope.html b/compariscope.html index 8c2b22a..7216751 100644 --- a/compariscope.html +++ b/compariscope.html @@ -11,41 +11,8 @@ + IIIF Compariscope - @@ -69,386 +36,6 @@
- - + diff --git a/js/compariscope.js b/js/compariscope.js new file mode 100644 index 0000000..d5962e9 --- /dev/null +++ b/js/compariscope.js @@ -0,0 +1,378 @@ +(function(){ + function getComputed(el,style){ var s; if( style=='width' ){ s=el.getBoundingClientRect().right-el.getBoundingClientRect().left; }else if( style=='height' ){ s=el.getBoundingClientRect().bottom-el.getBoundingClientRect().top }else if(window.getComputedStyle){ s=document.defaultView.getComputedStyle(el,null).getPropertyValue(style); }else if(el.currentStyle){ s=el.currentStyle[style] } return parseFloat(s); } + function getPgOffset(el){ var o=[0,0]; if( el.offsetParent ){ do{ o=[o[0]+el.offsetLeft,o[1]+el.offsetTop]; }while( el=el.offsetParent ) } return [o[0]+document.body.scrollLeft,o[1]+document.body.scrollTop]; } + function getXY(e){ var xy=[]; if( e.touches && e.touches.length ){ if( e.touches.length>1 ){ xy[0] = (e.touches[0].pageX+e.touches[0].pageX)/2; xy[1] = (e.touches[0].pageY+e.touches[0].pageY)/2;}else{ xy[0] = e.touches[0].pageX; xy[1] = e.touches[0].pageY; } }else{ xy[0] = e.pageX; xy[1] = e.pageY; } return xy; } + + var compariscope = document.getElementById('cs-editor'), + viewer = document.getElementById('cs-viewer'), + wrapper = document.getElementById('cs-wrapper'), + css = document.getElementById('cs-css'), + fader = document.getElementById('cs-fader'), + range = document.getElementById('cs-range'), + imgSrc = document.getElementById('cs-iiif-src'), + imgAdd = document.getElementById('cs-img-add'), + imgRemove = document.getElementById('cs-img-remove'), + imgShift = document.getElementById('cs-img-shift'), + imgLock = document.getElementById('cs-img-lock'), + imgSnap = document.getElementById('cs-img-snap'), + mode = document.getElementById('cs-mode'), + mixer = document.getElementById('cs-mixer'), + opURL = document.getElementById('cs-op-url'); + compariscope.imgs = []; + compariscope.css = css; + compariscope.style.height = 'calc(100vh - 160px)'; + compariscope.style.width = getComputed(compariscope,'height')+'px'; + + compariscope.reSize = function(){ + var img, i, + xyP = getPgOffset(this); + for( i=0; i0) || (x===1 && opacity!==1) ) opacity = 1; + this.css.innerHTML = ' \ + #'+this.id+' :nth-child(-n+'+vis+'){ opacity:1 } \ + #'+this.id+' :nth-child(n+'+(vis+1)+'){ opacity:0; z-index:-999 } \ + #'+this.id+' :nth-child('+vis+'){ opacity:'+opacity+' } \ + '; + if(vis>0) imgSrc.value = this.imgs[vis-1].src; + fader.value = x; + } + + compariscope.range = function(){ + var arcs = this.imgs.length, + rangeHTML = ''; + for( i=1; i<=arcs; ++i ){ + rangeHTML += '
'+i+'
'; + } + range.innerHTML = rangeHTML; + } + + compariscope.onmousedown = function(e){ + if( e.target === this ) this.rsReset = 1; + }; + + compariscope.onmousemove = function(e){ + if( e.target === this ){ + if( this.rsReset ){ + this.rsReset = 0; + setTimeout(function(){ compariscope.style.width = '400px'; compariscope.style.height = '400px'; }, 0); + } + window.requestAnimationFrame(function(){ compariscope.reSize() }); + } + }; + + /* utility for shrinking viewer to fixed size set by CSS, e.g. height: 60vw; */ + viewer.size = function(){ + const img = viewer.getElementsByTagName('img')[0]; + if (img.naturalHeight) { + clearTimeout(img.timer); + viewer.style.height = ''; + const cH = Math.ceil(img.naturalHeight * img.width / img.naturalWidth) + 'px'; + viewer.style.height = cH; + } else { + img.timer = setTimeout(function(){ viewer.size(); }, 50); + } + }; + + window.onload = function(e){ imgSrc.focus(); } + + imgAdd.onclick = function(e){ + if( imgSrc.value.indexOf('/full/full/') < 0 ){ + alert('Expects a IIIF API URL for the full size & full region of an image.'); + return false; + } + var img = document.createElement('img'); + img.src = imgSrc.value; + compariscope.appendChild(img); + img.onload = function() { + if( compariscope.imgs.length===1 ){ + compariscope.style.width = Math.round(getComputed(compariscope,'height') * this.naturalWidth/this.naturalHeight)+'px'; + } + if( this.naturalWidth > this.naturalHeight ){ + this.style.width = '100%'; this.style.height = 'auto'; + }else{ + this.style.width = 'auto'; this.style.height = '100%'; + } + setTimeout(function(){ dragZoom.init(img, {'zoom':1, 'siblings':compariscope.imgs}) }, 0); + compariscope.fade(1); + } + compariscope.imgs.push(img); + compariscope.range(); + }; + + imgShift.onclick = function(e){ + var i = compariscope.index, + img = compariscope.imgs[i]; + if( i===compariscope.imgs.length-1 ) return; + compariscope.imgs[i] = img.nextSibling; + compariscope.imgs[i+1] = img; + compariscope.insertBefore(img.nextSibling, img); + compariscope.fade(parseFloat(fader.value) + (1/compariscope.imgs.length)); + }; + + imgRemove.onclick = function(e){ + var i = compariscope.index; + compariscope.removeChild(compariscope.imgs[i]); + compariscope.fade(1); + compariscope.imgs.splice(i, 1); + compariscope.range(); + }; + + imgLock.onclick = function(e){ + this.classList.toggle('active'); + for( i=0; i0 || img.xy[1]>0 || img.xy[0]+img.wh[0]0 ) srcset += ', '; + srcset += (src.replace('full', variants[v]+',') + ' '+variants[v]+'w'); + } + viewer.opURLs.push(src); + src = src.replace('full', variant1+','); + html += ''; + } + console.log(logs); + viewer.innerHTML = html; + viewer.classList.remove('cs-split'); + viewer.classList.remove('cs-unsplit'); + mixer.classList.add('display-none'); + mixer.classList.remove('cs-splitter'); + wrapper.classList.toggle('cs-preview'); + if( wrapper.classList.contains('cs-preview') ){ + if( duo ){ + viewer.classList.add('cs-split'); + mixer.classList.remove('display-none'); + }else{ + iFader.init(viewer); + } + }else{ + iFader.uninit(viewer); + } + }; + + mixer.onclick = function(e){ + var mixing = viewer.classList.contains('cs-split') + this.classList.toggle('cs-splitter'); + viewer.classList.toggle('cs-split'); + viewer.classList.toggle('cs-unsplit'); + if( mixing ){ setTimeout(function(){ iFader.init(viewer) }, 1500) } + else{ iFader.uninit(viewer) } + }; + + var iFader = { + id:0, + size: function(el){ + el.w = Math.ceil(el.childNodes[0].width); + el.x = Math.ceil((getComputed(document.body,'width')-el.w)/2); + }, + init: function(el){ + el.arcs = el.getElementsByTagName('img').length-1; + if( !el.fade ){ + el.id = el.id || el.className+(++iFader.id); + el.css = el.appendChild(document.createElement('style')); + el.onmousemove = iFader.touch; + el.ontouchmove = iFader.touch; + el.fade = function(x){ + x = 1-x; + var vis = Math.ceil(x*this.arcs)+1, + opacity = (x%(1/this.arcs))*this.arcs; + if( x===0 || (opacity===0 && x>0) || (x===1 && opacity!==1) ){ opacity = 1; } + this.css.innerHTML = ' \ + #'+el.id+' :nth-child(-n+'+vis+'){ opacity:1 } \ + #'+el.id+' :nth-child(n+'+(vis+1)+'){ opacity:0; z-index:-999 } \ + #'+el.id+' :nth-child('+vis+'){ opacity:'+opacity+' } \ + '; + opURL.innerHTML = viewer.opURLs[Math.round(x*this.arcs+1)-1]; + } + } + }, + touch: function(e){ + e = e || window.event; + if( !this.w ){ iFader.size(this); } + var xyE = getXY(e); + if( xyE[0]>this.x && xyE[0]2 ){ return; } + dragZoom.el = this; + dragZoom.xy0 = dragZoom.el.xy; + dragZoom.xyT = getXY(e); + if( e.type==='touchstart' ){ + if( dragZoom.el.zoomer && e.touches && e.touches.length===2 ){ + dragZoom.d0 = Math.sqrt(Math.pow(e.touches[0].pageX-e.touches[1].pageX,2)+Math.pow(e.touches[0].pageY-e.touches[1].pageY,2)); + dragZoom.el.ontouchmove = dragZoom.zoom; + }else{ + dragZoom.el.ontouchmove = dragZoom.drag; + } + dragZoom.el.onmousedown = null; + dragZoom.el.ontouchend = function(){ + dragZoom.el.ontouchmove = null; + dragZoom.el.ontouchend = null; + dragZoom.release(); + }; + }else{ + if( e.type==='DOMMouseScroll' || e.type==='mousewheel' ){ + if( dragZoom.el.zoomer ){ dragZoom.zoom(e); } + }else{ + document.onmousemove = dragZoom.drag; + document.onmouseup = function(){ + document.onmousemove = null; + document.onmouseup = null; + dragZoom.release(); + }; + } + } + return false; + }, + drag: function(e){ + e = e || window.event; + dragZoom.xyE = getXY(e); + var xy = [dragZoom.xy0[0]+dragZoom.xyE[0]-dragZoom.xyT[0], dragZoom.xy0[1]+dragZoom.xyE[1]-dragZoom.xyT[1]]; + dragZoom.el.move(xy); + return false; + }, + release: function(){ + dragZoom.el = dragZoom.xyE = dragZoom.d0 = null; + }, + zoom: function(e){ + e = e || window.event; + if( e.preventDefault ){ e.preventDefault(); }else{ e.returnValue=false; } + var z, d1, tD = e.timeStamp-dragZoom.el.zT; + zZ = tD<10 ? 25 : 1; + if( e.touches ){ + d1 = Math.sqrt(Math.pow(e.touches[0].pageX-e.touches[1].pageX,2)+Math.pow(e.touches[0].pageY-e.touches[1].pageY,2)); + z = 1+((d1-dragZoom.d0>0?(d1/dragZoom.el.whP[0]):-0.5)*0.1); + dragZoom.d0 = d1; + }else{ + z = (e.detail? e.detail*-1 : e.wheelDelta/40); + z = 1+((z>0?1:-1)*0.005*zZ); + } + dragZoom.el.zT = e.timeStamp; + dragZoom.el.zoom(z); + return false; + } + }; +})(); \ No newline at end of file diff --git a/styling/compariscope.css b/styling/compariscope.css new file mode 100644 index 0000000..ab073f4 --- /dev/null +++ b/styling/compariscope.css @@ -0,0 +1,32 @@ +html, body, #cs-wrapper { height:100%; margin:0; text-align:center; } +body { background:#333; color:#000; font:10px/1 courier,monospace; } +.display-none { display:none!important; } +#cs-editor { background:#fff url(img/compariscope/cross-hairs.png) 50% 50% no-repeat; height:400px; width:400px; margin:5px auto 20px; outline:2px dashed #f54007; overflow:hidden; position:relative; resize:both; } +#cs-editor::after { content:"❖"; cursor:pointer; font-size:20px; background:#f54007; line-height:16px; height:16px; width:16px; text-align:center; position:absolute; bottom:0; right:0; } +#cs-editor img { cursor:pointer; outline:4px dashed #f54007; position:absolute; left:0; top:0; } +#cs-viewer { height:100%; position:relative; width:100%; } +#cs-viewer img { cursor:pointer; margin:auto; max-height:100%; max-width:100%; position:absolute; top:0; bottom:0; left:0; right:0; user-select:none; } +#cs-viewer, +.cs-preview #cs-editor, .cs-preview .cs-ctrl { display:none; } +.cs-preview #cs-viewer { display:block; } +.cs-ctrl { width:800px; max-width:90%; margin:0 auto 20px; text-align:center; } +.cs-btn { background:#f54007; border-radius:10px; box-shadow:inset 0 0 2px #000; cursor:pointer; display:inline-block; font-size:20px; font-weight:600; height:24px; line-height:24px; text-align:center; width:24px; vertical-align:middle; } +.cs-btn:active { margin:1px 0 0 1px; } +.cs-btn.active { background:#000; color:#f54007; } +#cs-iiif-src { border:0; box-sizing:border-box; display:inline-block; padding:4px; height:24px; width:calc(100% - 160px); text-align:right; } +#cs-fader, #cs-range { width:100%; } +#cs-range { background:#fff; } +#cs-range div { border-right:1px solid #fff; box-sizing:border-box; color:#f54007; float:left; font-weight:600; padding-right:4px; text-align:right; } +#cs-mode { width:6em; z-index:1; } +#cs-mode::after { content:'Preview'; } +.cs-preview #cs-mode { position:fixed; right:5%; top:5%; } +.cs-preview #cs-mode::after { content:'Edit'; } +#cs-mixer { display:inline-block; position:fixed; left:5%; top:5%; width:6em; z-index:1; } +#cs-mixer::after { content:'Meld'; } +#cs-mixer.cs-splitter::after { content:'Split'; } +#cs-viewer.cs-split img { max-width:50%; right:50%; } +#cs-viewer.cs-split img:nth-child(2) { left:50%; right:0; } +#cs-viewer.cs-unsplit img { max-width:50%; } +#cs-viewer.cs-split img, +#cs-viewer.cs-unsplit img { transition:left 1s, right 1s; } +#cs-op-url { background:#fff; font-size:18px; height:22px; line-height:22px; white-space:nowrap; } \ No newline at end of file From b3a3ff78441fff1385febc19865b6f2cc480b836 Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:05:09 +0000 Subject: [PATCH 02/14] fix: correct my css file path, rename the page to mine --- compariscope.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/compariscope.html b/compariscope.html index 7216751..6c6baca 100644 --- a/compariscope.html +++ b/compariscope.html @@ -11,7 +11,7 @@ - + IIIF Compariscope From 6816aaf249016b258308b865ed321e7b5fd86f99 Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:06:58 +0000 Subject: [PATCH 03/14] fix: correct my css file path, rename the page to mine --- compariscope.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/compariscope.html b/compariscope.html index 6c6baca..a5d2925 100644 --- a/compariscope.html +++ b/compariscope.html @@ -12,7 +12,7 @@ - IIIF Compariscope + James's IIIF Compariscope From 31391a4b653fa16383710142e8f6e5bbe3f97bae Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:15:50 +0000 Subject: [PATCH 04/14] feat: adds the camel image link as value to the input box, adds instructions on how to use it --- compariscope.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/compariscope.html b/compariscope.html index a5d2925..375a912 100644 --- a/compariscope.html +++ b/compariscope.html @@ -24,7 +24,8 @@
- +

We've added an example image link below - just press + to insert (or add your link instead!)

+ + - > From e05eba18b24a4382ea9abebbfdb5ef13df09d00d Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:16:26 +0000 Subject: [PATCH 05/14] style: sets the p text to white and font size 14 --- styling/compariscope.css | 1 + 1 file changed, 1 insertion(+) diff --git a/styling/compariscope.css b/styling/compariscope.css index ab073f4..bb36722 100644 --- a/styling/compariscope.css +++ b/styling/compariscope.css @@ -1,6 +1,7 @@ html, body, #cs-wrapper { height:100%; margin:0; text-align:center; } body { background:#333; color:#000; font:10px/1 courier,monospace; } .display-none { display:none!important; } +#img-src-input-text { color: #fff; font-size: 14px; } #cs-editor { background:#fff url(img/compariscope/cross-hairs.png) 50% 50% no-repeat; height:400px; width:400px; margin:5px auto 20px; outline:2px dashed #f54007; overflow:hidden; position:relative; resize:both; } #cs-editor::after { content:"❖"; cursor:pointer; font-size:20px; background:#f54007; line-height:16px; height:16px; width:16px; text-align:center; position:absolute; bottom:0; right:0; } #cs-editor img { cursor:pointer; outline:4px dashed #f54007; position:absolute; left:0; top:0; } From 37c3d73f6b7d1118424d25cbae55a0d2feca171e Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:31:13 +0000 Subject: [PATCH 06/14] fix: corrects the type of file needed to be inserted --- compariscope.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/compariscope.html b/compariscope.html index 375a912..8c73af6 100644 --- a/compariscope.html +++ b/compariscope.html @@ -24,7 +24,7 @@
-

We've added an example image link below - just press + to insert (or add your link instead!)

+

We've added an example image link below - just press + to insert (or add your IIIF API URL instead!)

+ - From f00bc742a12052d1de7634ec06889ed40887437c Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:31:45 +0000 Subject: [PATCH 07/14] style: makes the cs viewer slightly smaller --- styling/compariscope.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styling/compariscope.css b/styling/compariscope.css index bb36722..bba8697 100644 --- a/styling/compariscope.css +++ b/styling/compariscope.css @@ -5,7 +5,7 @@ body { background:#333; color:#000; font:10px/1 courier,monospace; } #cs-editor { background:#fff url(img/compariscope/cross-hairs.png) 50% 50% no-repeat; height:400px; width:400px; margin:5px auto 20px; outline:2px dashed #f54007; overflow:hidden; position:relative; resize:both; } #cs-editor::after { content:"❖"; cursor:pointer; font-size:20px; background:#f54007; line-height:16px; height:16px; width:16px; text-align:center; position:absolute; bottom:0; right:0; } #cs-editor img { cursor:pointer; outline:4px dashed #f54007; position:absolute; left:0; top:0; } -#cs-viewer { height:100%; position:relative; width:100%; } +#cs-viewer { height:75%; position:relative; width:75%; } #cs-viewer img { cursor:pointer; margin:auto; max-height:100%; max-width:100%; position:absolute; top:0; bottom:0; left:0; right:0; user-select:none; } #cs-viewer, .cs-preview #cs-editor, .cs-preview .cs-ctrl { display:none; } From 886d10f54ac1a81dc4f5bcc2a58edab957c7a89d Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:35:05 +0000 Subject: [PATCH 08/14] style: updates the name of the input text id so it's uniform with other id's --- compariscope.html | 2 +- styling/compariscope.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/compariscope.html b/compariscope.html index 8c73af6..9591153 100644 --- a/compariscope.html +++ b/compariscope.html @@ -24,7 +24,7 @@
-

We've added an example image link below - just press + to insert (or add your IIIF API URL instead!)

+

We've added an example image link below - just press + to insert (or add your IIIF API URL instead!)

+ - diff --git a/styling/compariscope.css b/styling/compariscope.css index bba8697..5fd741d 100644 --- a/styling/compariscope.css +++ b/styling/compariscope.css @@ -1,7 +1,7 @@ html, body, #cs-wrapper { height:100%; margin:0; text-align:center; } body { background:#333; color:#000; font:10px/1 courier,monospace; } .display-none { display:none!important; } -#img-src-input-text { color: #fff; font-size: 14px; } +#cs-input-text { color: #fff; font-size: 14px; } #cs-editor { background:#fff url(img/compariscope/cross-hairs.png) 50% 50% no-repeat; height:400px; width:400px; margin:5px auto 20px; outline:2px dashed #f54007; overflow:hidden; position:relative; resize:both; } #cs-editor::after { content:"❖"; cursor:pointer; font-size:20px; background:#f54007; line-height:16px; height:16px; width:16px; text-align:center; position:absolute; bottom:0; right:0; } #cs-editor img { cursor:pointer; outline:4px dashed #f54007; position:absolute; left:0; top:0; } From dc0ee493de7d7a24315f50cc48b728e234e50b30 Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:35:33 +0000 Subject: [PATCH 09/14] style: updates the name of the input text id so it's uniform with other id's --- compariscope.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/compariscope.html b/compariscope.html index 9591153..4fa6ef9 100644 --- a/compariscope.html +++ b/compariscope.html @@ -24,7 +24,7 @@
-

We've added an example image link below - just press + to insert (or add your IIIF API URL instead!)

+

We've added an example image link below - just press + to insert (or add your IIIF API URL instead!)

+ - From 792d894f155d254edd14de36447384963b470c3f Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:45:37 +0000 Subject: [PATCH 10/14] text: updates the instructions to fit one line --- compariscope.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/compariscope.html b/compariscope.html index 4fa6ef9..2072895 100644 --- a/compariscope.html +++ b/compariscope.html @@ -12,7 +12,7 @@ - James's IIIF Compariscope + IIIF Compariscope @@ -24,7 +24,7 @@
-

We've added an example image link below - just press + to insert (or add your IIIF API URL instead!)

+

We've added an example image link below. Click '+' to insert (or add your IIIF API URL)

+ - From 778d1a52416ca95122605cfefa638cda76b971eb Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:46:25 +0000 Subject: [PATCH 11/14] styling: moves the text up to the slider to allow the preview button to stay visible on macbook pro --- styling/compariscope.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styling/compariscope.css b/styling/compariscope.css index 5fd741d..a4310c6 100644 --- a/styling/compariscope.css +++ b/styling/compariscope.css @@ -1,7 +1,7 @@ html, body, #cs-wrapper { height:100%; margin:0; text-align:center; } body { background:#333; color:#000; font:10px/1 courier,monospace; } .display-none { display:none!important; } -#cs-input-text { color: #fff; font-size: 14px; } +#cs-input-text { color: #fff; font-size: 14px; margin-top: -20px; } #cs-editor { background:#fff url(img/compariscope/cross-hairs.png) 50% 50% no-repeat; height:400px; width:400px; margin:5px auto 20px; outline:2px dashed #f54007; overflow:hidden; position:relative; resize:both; } #cs-editor::after { content:"❖"; cursor:pointer; font-size:20px; background:#f54007; line-height:16px; height:16px; width:16px; text-align:center; position:absolute; bottom:0; right:0; } #cs-editor img { cursor:pointer; outline:4px dashed #f54007; position:absolute; left:0; top:0; } From 4d701b6e5ea3a7bd104ce21626c0068015edd9c6 Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 15:50:12 +0000 Subject: [PATCH 12/14] fix: renames css folder --- {styling => css}/compariscope.css | 2 +- js/compariscope.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) rename {styling => css}/compariscope.css (98%) diff --git a/styling/compariscope.css b/css/compariscope.css similarity index 98% rename from styling/compariscope.css rename to css/compariscope.css index a4310c6..fc09d04 100644 --- a/styling/compariscope.css +++ b/css/compariscope.css @@ -30,4 +30,4 @@ body { background:#333; color:#000; font:10px/1 courier,monospace; } #cs-viewer.cs-unsplit img { max-width:50%; } #cs-viewer.cs-split img, #cs-viewer.cs-unsplit img { transition:left 1s, right 1s; } -#cs-op-url { background:#fff; font-size:18px; height:22px; line-height:22px; white-space:nowrap; } \ No newline at end of file +#cs-op-url { background:#fff; font-size:18px; height:22px; line-height:22px; white-space:nowrap; } diff --git a/js/compariscope.js b/js/compariscope.js index d5962e9..7e6af58 100644 --- a/js/compariscope.js +++ b/js/compariscope.js @@ -375,4 +375,4 @@ return false; } }; -})(); \ No newline at end of file +})(); From 871cea482cbe41e8e16372eae5d62571ae0730b7 Mon Sep 17 00:00:00 2001 From: jdm79 Date: Tue, 18 Dec 2018 16:01:02 +0000 Subject: [PATCH 13/14] fix: updates new name of css folder in the html link --- compariscope.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/compariscope.html b/compariscope.html index 2072895..56bbc5f 100644 --- a/compariscope.html +++ b/compariscope.html @@ -11,7 +11,7 @@ - + IIIF Compariscope From fb97d95885b0d41f5cd2d97894881ece69872d53 Mon Sep 17 00:00:00 2001 From: methodog Date: Thu, 27 Jun 2019 16:32:30 +0100 Subject: [PATCH 14/14] renames --- README.md | 2 +- frameAnimator.html => flickBook.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) rename frameAnimator.html => flickBook.html (99%) diff --git a/README.md b/README.md index 68f2e9a..9439f4c 100644 --- a/README.md +++ b/README.md @@ -9,7 +9,7 @@ Useful for the alignment of overlayed images, served by the IIIF Image API, and Try it out by pasting in some full IIIF Image URIs, such as [framemark.vam.ac.uk/collections/2018KU6176/full/full/0/default.jpg](https://framemark.vam.ac.uk/collections/2018KU6176/full/full/0/default.jpg) -## [Stop-motion viewer](https://vanda.github.io/iiif-features/frameAnimator.html) +## [Stop-motion viewer](https://vanda.github.io/iiif-features/flickBook.html) A prototype viewer for interacting with stop-motion image sets, such as Edweard Muybridge produced in his work Animal Locomotion. **Drag** the image! diff --git a/frameAnimator.html b/flickBook.html similarity index 99% rename from frameAnimator.html rename to flickBook.html index 7432d0e..e544c49 100644 --- a/frameAnimator.html +++ b/flickBook.html @@ -5,7 +5,7 @@ - iiif Flick Viewer + iiif Flick Book