1/** 2 * Replace default viewer with alternative viewer (OpenSeadragon) 3 */ 4(function () { 5 6 // configure and display image, highlighted terms in OpenSeadragon IIIF viewer 7 function CustomImageView(container, imgsrc, collectionId, imageId, objArray, highlightVal) { 8 9 var stopwords = ["a","also","an","and","any","are","as","at","be","been","but","by","etc","for","from","had","has","have","he","her","here","hers","him","his","how","if","in","into","its","not","of","on","onto","or","she","should","than","that","the","their","them","then","there","these","they","this","those","to","us","was","were","what","will","with","would"]; 10 11 // get the terms to highlight, if any 12 // e.g. /digital/api/singleitem/image/siebert/26871/default.jpg?highlightTerms=[terms] 13 var termsToHighlight = ""; 14 if (imgsrc.replace(/^.*highlightTerms=(.*)$/, "$1").length > 0) { 15 termsToHighlight = imgsrc.replace(/^.*highlightTerms=(.*)$/, "$1"); 16 } 17 if (highlightVal != "" && highlightVal.length > 0) { 18 termsToHighlight = highlightVal; 19 } 20 termsToHighlight = decodeURI(termsToHighlight).replace(/^\"(.*)\"/gm, '$1'); 21 termsToHighlight = termsToHighlight.replace(/\*/g, ''); 22 23 if (termsToHighlight.length > 0) { 24 var total = stopwords.length; 25 for (var i = 0; i < total; i++) { 26 var regex = new RegExp("(^|\\s)" + stopwords[i] + "($|\\s)", 'gi'); 27 if (termsToHighlight.match(regex)) { 28 termsToHighlight = termsToHighlight.replace(regex, ' '); 29 } 30 } 31 } 32 33 // get levels array for OpenSeadragon configuration 34 var levelsArray = []; 35 Object.keys(objArray.sizes).forEach(function(key,index) { 36 var levelsObject = { 37 url: 'https://ohiomemory.org/digital/iiif/' + collectionId + '/' + imageId + '/full/' + objArray.sizes[index].width + ',/0/default.jpg?highlightTerms=' + termsToHighlight, 38 height: objArray.sizes[index].height, 39 width: objArray.sizes[index].width 40 } 41 levelsArray.push(levelsObject); 42 }); 43 44 // load OpenSeadragon configuration, add to item view container 45 ScriptLoader('https://ohiomemory.org/customizations/global/pages/openseadragon_resources/openseadragon.min.js', function(){ 46 47 container.firstChild.className += ' hide'; 48 var zoomContainers = document.getElementsByClassName("zoomView"); 49 if (document.getElementsByClassName("zoomView").length > 0) { 50 // remove all instances of zoomView 51 Array.prototype.forEach.call(zoomContainers, function(el) { el.parentNode.removeChild(el); }); 52 document.getElementsByClassName("preview")[0].firstElementChild.removeAttribute("class"); 53 } 54 55 // build OpenSeadragon container 56 var openseadragonContainer = document.createElement("div"); 57 openseadragonContainer.setAttribute("id", "zoomDiv"); 58 openseadragonContainer.setAttribute("class", "zoomView"); 59 openseadragonContainer.setAttribute("style", "height:100vh;width:100%"); 60 61 container.parentNode.insertBefore(openseadragonContainer, container); 62 var viewer = OpenSeadragon({ 63 id: "zoomDiv", 64 prefixUrl: "https://ohiomemory.org/customizations/global/pages/openseadragon_resources/images/", 65 tileSources: [{ 66 type: 'legacy-image-pyramid', 67 levels: levelsArray, 68 }], 69 showRotationControl: true, 70 showNavigator: false 71 }); 72 var odcStyle = openseadragonContainer.firstChild.firstChild.getAttribute("style"); 73 openseadragonContainer.firstChild.firstChild.setAttribute("style", odcStyle + "outline:0"); 74 75 document.getElementsByClassName('ItemPreview-container')[0].style.visibility = 'visible'; 76 77 }); 78 79 } 80 81 function startEventListener(cdmEvent) { 82 document.addEventListener(cdmEvent, function(e){ 83 84 if (document.getElementsByClassName("zoomView").length > 0) { 85 var zoomContainers = document.getElementsByClassName("zoomView"); 86 Array.prototype.forEach.call(zoomContainers, function(el) { el.parentNode.removeChild(el); }); 87 } 88 // don't use openseadragon for mobile 89 if (window.innerWidth < 760) { 90 document.getElementsByClassName("ItemPreview-container")[0].style.visibility = "visible"; 91 return; 92 } 93 // don't use openseadragon for video 94 if (document.getElementsByClassName("field-type")[0] !== undefined && document.getElementsByClassName("field-type")[0].lastChild.lastChild.textContent == 'MovingImage') { 95 document.getElementsByClassName("ItemPreview-container")[0].style.visibility = "visible"; 96 return; 97 } 98 // don't use openseadragon for audio 99 if (document.getElementsByClassName("field-type")[0] !== undefined && document.getElementsByClassName("field-type")[0].lastChild.lastChild.textContent == 'Sound') { 100 document.getElementsByClassName("ItemPreview-container")[0].style.visibility = "visible"; 101 return; 102 } 103 // don't use openseadragon for PDFs 104 if (document.getElementsByClassName("ItemPDF-itemImage").length > 0) { 105 document.getElementsByClassName("ItemPreview-container")[0].style.visibility = "visible"; 106 return; 107 } 108 // don't use openseadragon for p267401ccp2 collection (State Library of Ohio Digital Collection) 109 if (e.detail.collectionId == 'p267401ccp2') { 110 document.getElementsByClassName("ItemPreview-container")[0].style.visibility = "visible"; 111 return; 112 } 113 /*if (e.detail.collectionId == 'p15005coll5') { 114 document.getElementsByClassName("ItemPreview-container")[0].style.visibility = "visible"; 115 return; 116 }*/ 117 118 var request = new XMLHttpRequest(); 119 // https://ohiomemory.org/digital/bl/dmwebservices/index.php?q=GetParent/p15005coll5/1466/json 120 // need to check whether item is at the record- or page-level 121 request.open('GET', location.protocol + '//' + location.hostname + '/digital/bl/dmwebservices/index.php?q=GetParent/' + e.detail.collectionId + '/' + e.detail.itemId + '/json', true); 122 request.onload = function() { 123 if (request.status >= 200 && request.status < 400) { 124 var imageId = e.detail.itemId; 125 var ret = JSON.parse(request.responseText); 126 // get the correct item pointer ID based on whether we found the parent to be "false" or not 127 if (ret.parent < 0 && document.getElementsByClassName("CompoundItemPagination-pageInput").length != 0) { 128 //imageId = e.detail.itemId - document.getElementsByClassName("CompoundItemPagination-pageInput")[0].getAttribute('max'); 129 imageId = document.getElementsByClassName("CompoundItemView-selectedCompoundItem")[0].firstChild.firstChild.src.replace(/^.*\/(\d*)\/thumbn
129ail/, "$1"); 130 } 131 // now we can get the IIIF data 132 var request2 = new XMLHttpRequest(); 133 request2.open('GET', 'https://ohiomemory.org/digital/iiif/' + e.detail.collectionId + '/' + imageId + '/info.json', true); 134 request2.onload = function() { 135 if (request2.status >= 200 && request2.status < 400) { 136 var objArray = JSON.parse(request2.responseText); 137 // send all args to CustomImageView rendering function 138 CustomImageView(document.getElementsByClassName("preview")[0], document.getElementsByClassName("ItemImage-expandButton")[0].parentElement.firstChild.src, e.detail.collectionId, imageId, objArray, ""); 139 } else { } // else: reached target but returned an error 140 }; 141 request2.onerror = function() { }; // connection error 142 request2.send(); 143 } else { } // else: reached target but returned an error 144 }; 145 request.onerror = function() { }; // connection error 146 request.send(); 147 148 // Add click event listener to compound "within search" button 149 document.getElementsByClassName("ItemSearch-itemHeaderButtonPadding")[2].addEventListener('click', event => { 150 151 // Get the collection alias and item ID 152 var coll = location.href.replace(/.*collection\/(.*?)\/id\/.*/, "$1"); 153 var id = location.href.replace(/.*collection\/.*?\/id\/(.*?)\/.*/, "$1"); 154 155 // compound can have one item and numbers would be the same, so we still need to check parent vs. page 156 var request = new XMLHttpRequest(); 157 // https://ohiomemory.org/digital/bl/dmwebservices/index.php?q=GetParent/p16007coll22/32/json 158 request.open('GET', location.protocol + '//' + location.hostname + '/digital/bl/dmwebservices/index.php?q=GetParent/' + coll + '/' + id + '/json', true); 159 request.onload = function() { 160 if (request.status >= 200 && request.status < 400) { 161 var imageId = id; 162 var ret = JSON.parse(request.responseText); 163 // get the correct item pointer ID based on whether we found the parent to be "false" or not 164 if (ret.parent < 0 && document.getElementsByClassName("CompoundItemPagination-pageInput").length != 0) { 165 imageId = document.getElementsByClassName("CompoundItemView-selectedCompoundItem")[0].firstChild.firstChild.src.replace(/^.*\/(\d*)\/thumbnail/, "$1"); 166 } 167 // now we can get the IIIF data 168 var request2 = new XMLHttpRequest(); 169 request2.open('GET', 'https://ohiomemory.org/digital/iiif/' + e.detail.collectionId + '/' + imageId + '/info.json', true); 170 request2.onload = function() { 171 if (request2.status >= 200 && request2.status < 400) { 172 var objArray = JSON.parse(request2.responseText); 173 // send all args to CustomImageView rendering function 174 CustomImageView( document.getElementsByClassName("preview")[0], document.getElementsByClassName("ItemImage-expandButton")[0].parentElement.firstChild.src, e.detail.collectionId, imageId, objArray, document.getElementsByClassName("ItemSearch-itemSearchInputControl")[1].value ); 175 document.getElementsByClassName("ItemImage-expandButton")[0].style.display = 'none'; 176 177 } else { } // else: reached target but returned an error 178 }; 179 request2.onerror = function() { }; // connection error 180 request2.send(); 181 } else { } // else: reached target but returned an error 182 }; 183 request.onerror = function() { }; // connection error 184 request.send(); 185 186 }); 187 188 // also, account for enter key 189 document.getElementsByClassName("ItemSearch-itemSearchInputControl")[1].addEventListener("keyup", function(event) { 190 if (event.keyCode === 13) { 191 var coll = location.href.replace(/.*collection\/(.*?)\/id\/.*/, "$1"); 192 var id = location.href.replace(/.*collection\/.*?\/id\/(.*?)\/.*/, "$1"); 193 194 var request = new XMLHttpRequest(); 195 // https://ohiomemory.org/digital/bl/dmwebservices/index.php?q=GetParent/p16007coll22/32/json 196 request.open('GET', location.protocol + '//' + location.hostname + '/digital/bl/dmwebservices/index.php?q=GetParent/' + coll + '/' + id + '/json', true); 197 request.onload = function() { 198 if (request.status >= 200 && request.status < 400) { 199 var imageId = id; 200 var ret = JSON.parse(request.responseText); 201 // get the correct item pointer ID based on whether we found the parent to be "false" or not 202 if (ret.parent < 0 && document.getElementsByClassName("CompoundItemPagination-pageInput").length != 0) { 203 //imageId = e.detail.itemId - document.getElementsByClassName("CompoundItemPagination-pageInput")[0].getAttribute('max'); 204 imageId = document.getElementsByClassName("CompoundItemView-selectedCompoundItem")[0].firstChild.firstChild.src.replace(/^.*\/(\d*)\/thumbn
204ail/, "$1"); 205 } 206 // now we can get the IIIF data 207 var request2 = new XMLHttpRequest(); 208 request2.open('GET', 'https://ohiomemory.org/digital/iiif/' + e.detail.collectionId + '/' + imageId + '/info.json', true); 209 request2.onload = function() { 210 if (request2.status >= 200 && request2.status < 400) { 211 var objArray = JSON.parse(request2.responseText); 212 // send all args to CustomImageView rendering function 213 CustomImageView( document.getElementsByClassName("preview")[0], document.getElementsByClassName("ItemImage-expandButton")[0].parentElement.firstChild.src, e.detail.collectionId, imageId, objArray, document.getElementsByClassName("ItemSearch-itemSearchInputControl")[1].value ); 214 document.getElementsByClassName("ItemImage-expandButton")[0].style.display = 'none'; 215 216 } else { } // else: reached target but returned an error 217 }; 218 request2.onerror = function() { }; // connection error 219 request2.send(); 220 } else { } // else: reached target but returned an error 221 }; 222 request.onerror = function() { }; // connection error 223 request.send(); 224 } 225 }); 226 227 }); 228 } 229 230 // Set mutation observer before page renders in image-based item vew to set css on normal item display to none 231 document.addEventListener('cdm-item-page:enter', function(e){ 232 var pageHead = (e.srcElement||e.target).head; 233 var script = document.createElement('script'); 234 var code = getObserverText() + 235 'function addNewStyle(newStyle) {' + 236 ' var styleElement = document.getElementById("styles_js");' + 237 ' if (!styleElement) {' + 238 ' styleElement = document.createElement("style");' + 239 ' styleElement.type = "text/css";' + 240 ' styleElement.id = "styles_js";' + 241 ' document.getElementsByTagName("head")[0].appendChild(styleElement);' + 242 ' }' + 243 ' styleElement.appendChild(document.createTextNode(newStyle));' + 244 '}' + 245 'addNewStyle(".ItemPreview-container {visibility:hidden;}");' + 246 'waitForElement("#zoomDiv").then(function(element) {' + 247 ' document.getElementById("zoomDiv").parentNode.setAttribute("style", "visibility:visible");' + 248 '});'; 249 script.appendChild(document.createTextNode(code)); 250 script.async = false; 251 pageHead.appendChild(script); 252 }); 253 254 // load for item page ready and update events 255 var cdmEvents = ['cdm-item-page:ready', 'cdm-item-page:update']; 256 cdmEvents.forEach(startEventListener); 257 258})();
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.