# HG changeset patch # User casties # Date 1562335557 -7200 # Node ID 719475ad09238dec79927ce6a0a7b09d055183f5 # Parent 81f761f9c015c3e8370ddb95eef7dd8efc981908 more work on new diva.js in imageServer diff -r 81f761f9c015 -r 719475ad0923 src/main/webapp/imageServer/displayDigi.jsp --- a/src/main/webapp/imageServer/displayDigi.jsp Mon Jul 01 15:05:05 2019 +0200 +++ b/src/main/webapp/imageServer/displayDigi.jsp Fri Jul 05 16:05:57 2019 +0200 @@ -15,7 +15,7 @@ - + @@ -182,17 +182,17 @@ } } - $("#diva-wrapper").diva( +// $("#diva-wrapper").diva( + window.divaInstance = new Diva('diva-wrapper', { - enableAutoHeight: true, enableAutoTitle: false, enableGotoPage: false, fixedHeightGrid: false, - contained: true, - iipServerURL: divaGlobal.iipServerURL, - digiId: "<%=digiBean.getDigiId()%>", - objectData: divaGlobal.rest_url + "/rest/diva/proxy/json/<%=digiBean.getDigiLabel()%>", - imageDir: "/<%=digiBean.getDigiLabel()%>", +// iipServerURL: divaGlobal.iipServerURL, +// digiId: "<%=digiBean.getDigiId()%>", +// objectData: divaGlobal.rest_url + "/rest/diva/proxy/json/<%=digiBean.getDigiLabel()%>", + objectData: "https://ismi-imageserver-cc.mpiwg-berlin.mpg.de/iiif/manifests/<%=digiBean.getDigiLabel()%>.json", +// imageDir: "/<%=digiBean.getDigiLabel()%>", onSetCurrentPage : handlePageSwitch, onDocumentLoaded : handleDocumentLoaded, zoomLevel: 1, diff -r 81f761f9c015 -r 719475ad0923 src/main/webapp/imageServer/resources/css/diva.min.css --- a/src/main/webapp/imageServer/resources/css/diva.min.css Mon Jul 01 15:05:05 2019 +0200 +++ b/src/main/webapp/imageServer/resources/css/diva.min.css Fri Jul 05 16:05:57 2019 +0200 @@ -1,1 +1,554 @@ -.hidden{display:none}.grab{cursor:url("../img/openhand.cur"),pointer}.grabbing{cursor:url("../img/closedhand.cur"),move !important}.loading{background:url("../img/loading.gif") no-repeat center}.full-width{width:100% !important;max-width:100% !important}.full-height{height:100% !important;max-height:100% !important}.prevent-selection{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.button{cursor:pointer;height:32px;width:32px;background-color:#f1f1f1;background-repeat:no-repeat;background-position:center;border:1px solid #99bbe8}@media screen and (min-device-width:769px){.button:hover{background-color:#fdfdfd}}.diva-title{text-align:center;font-weight:bold;font-size:2em}.diva-tools{margin-top:5px}.diva-tools .diva-tools-left{float:left}.diva-tools .diva-tools-left .diva-slider-label{display:none;padding:8px;float:left}.diva-tools .diva-tools-left .diva-zoom-buttons-label{display:none;padding:8px;float:left}.diva-tools .diva-tools-left .diva-zoom-out-button{display:none;float:left;background-image:url("../img/zoomout.png")}.diva-tools .diva-tools-left .diva-zoom-in-button{display:none;float:left;background-image:url("../img/zoomin.png");margin-left:-1px}.diva-tools .diva-tools-left .diva-grid-out-button{display:none;float:left;background-image:url("../img/zoomout.png")}.diva-tools .diva-tools-left .diva-grid-in-button{display:none;float:left;background-image:url("../img/zoomin.png");margin-left:-1px}.diva-tools .diva-tools-left .diva-buttons-label{display:none;padding:8px;float:left}.diva-tools .diva-tools-left.in-fullscreen{float:left;clear:none}.diva-tools .diva-tools-right{float:right;height:42px}.diva-tools .diva-tools-right .diva-grid-icon{float:right;background-image:url("../img/grid.png")}.diva-tools .diva-tools-right .diva-grid-icon.diva-in-grid{background-image:url("../img/document.png")}.diva-tools .diva-tools-right .diva-download-icon{float:right;background-image:url("../img/download.png")}.diva-link-icon{float:right;background-image:url("../img/link.png")}.diva-tools .diva-tools-right .diva-page-nav{float:left;text-align:right;padding-right:4px;white-space:nowrap;line-height:32px}.diva-tools .diva-tools-right .diva-page-nav .diva-page-label{float:left;padding-top:1px;padding-right:.5em;line-height:32px}.diva-tools .diva-tools-right .diva-page-nav .diva-goto-form{float:right}.diva-tools .diva-tools-right .diva-page-nav .diva-goto-form .diva-input{width:30px;outline:none;margin:0;padding-top:0}.diva-tools.diva-fullscreen-tools{position:fixed;top:0;right:30px;z-index:101;width:230px;height:73px;padding:15px;border:1px solid #ddd;background:#fff;-webkit-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);-moz-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5)}.diva-tools.diva-fullscreen-tools .diva-buttons-label{margin-top:5px;padding:0;clear:both}.diva-tools.diva-fullscreen-tools .diva-page-nav{float:none;line-height:1em}.diva-tools.diva-fullscreen-tools .diva-page-nav .diva-goto-form{margin-top:9px}.diva-tools.diva-fullscreen-tools .diva-page-nav .diva-page-label{float:none;clear:both;line-height:1em}.diva-outer{clear:both;background:#f1f1f1;border:1px solid #99bbe8;position:relative;min-height:100px;min-width:200px;height:700px;overflow:auto}.diva-outer .diva-inner{position:relative;overflow:hidden;margin:0 auto}.diva-outer .diva-inner .diva-page{-webkit-box-shadow:2px 2px 6px 0 rgba(0,0,0,0.5);-moz-box-shadow:2px 2px 6px 0 rgba(0,0,0,0.5);box-shadow:2px 2px 6px 0 rgba(0,0,0,0.5);background:url("../img/loading.gif") no-repeat center;position:absolute}.diva-outer .diva-inner .diva-document-page{-webkit-box-shadow:2px 2px 6px 0 rgba(0,0,0,0.5);-moz-box-shadow:2px 2px 6px 0 rgba(0,0,0,0.5);box-shadow:2px 2px 6px 0 rgba(0,0,0,0.5);background:url("../img/loading.gif") no-repeat center;position:absolute;left:0;right:0}.diva-outer .diva-inner .diva-document-page .diva-page-tools{position:absolute;top:-25px;left:0;height:25px;z-index:3}.diva-outer .diva-inner .diva-document-page .diva-page-tools div{display:inline-block;height:25px;width:25px;cursor:pointer}.diva-outer .diva-inner .diva-page-vertical{margin:0 auto;display:inline-block}.diva-outer .diva-inner .diva-page-horizontal{vertical-align:middle;display:inline-block;top:50%;transform:translate(0, -50%);-webkit-transform:translate(0, -50%);-moz-transform:translate(0, -50%);-ms-transform:translate(0, -50%)}.diva-outer .diva-inner .diva-row{position:absolute;width:100%}.diva-outer .diva-inner.diva-grab{cursor:url("../img/openhand.cur"),pointer}.diva-outer .diva-inner.diva-grabbing{cursor:url("../img/closedhand.cur"),move !important}.diva-outer.diva-fullscreen{width:100% !important;max-width:100% !important;height:100% !important;max-height:100% !important;z-index:100;position:fixed !important;top:0;left:0;margin:0;border:0}.diva-fullscreen-icon{background-image:url("../img/fullscreen.png");border-left:0;float:right}.diva-popup{background:#fff;border:1px solid #99bbe8;padding:.6em;z-index:101;position:absolute;-webkit-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);-moz-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5)}.diva-link-popup{font-size:10pt}.diva-link-popup input{width:15em}.diva-link-popup input:focus{outline:none}.diva-link-popup.in-fullscreen{top:150px;right:30px}.diva-download-popup{font-size:10pt}.diva-download-popup input{width:15em}.diva-download-popup input:focus{outline:none}.diva-download-popup.in-fullscreen{top:150px;right:30px}.diva-hide-scrollbar{overflow:hidden !important}.diva-relative-position{position:relative}.zoom-slider{position:relative;top:.6em;display:none;float:left}@media (max-width:480px){.zoom-slider{width:100px}}.grid-slider{position:relative;top:.6em;display:none;float:left}@media (max-width:480px){.grid-slider{width:100px}}.diva-throbber{display:none;position:absolute;width:50px;height:50px;background:url("../img/loading.gif") no-repeat center;background-color:#fff;border:1px solid #ddd;-webkit-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);-moz-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);top:50%;left:50%;margin-left:-25px;margin-top:-25px}.diva-error{position:absolute;width:400px;height:200px;background-color:#fff;border:1px solid #ddd;-webkit-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);-moz-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);top:50%;left:50%;margin-left:-220px;margin-top:-120px;z-index:120;padding:0 1em}.diva-canvas-icon{background:url('../img/plugins/canvas.png') no-repeat;background-position:left center}.diva-canvas-icon:hover{background-position:-25px center}.diva-canvas-icon.new{background-position:-50px center}.diva-canvas-icon.new:hover{background-position:-75px center}#diva-canvas-backdrop{z-index:105;position:fixed;top:0;left:0;bottom:0;right:0;display:none;background:rgba(50,50,50,0.9)}#diva-canvas-tools{color:#333;position:fixed;top:10px;left:10px;width:230px;z-index:108;background:#fff;padding-bottom:10px;-webkit-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);-moz-box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5);box-shadow:2px 2px 4px 0 rgba(0,0,0,0.5)}#diva-canvas-tools .action-buttons{clear:both;margin-bottom:5px;text-align:right}#diva-canvas-tools .action-buttons a{color:#333;text-decoration:none;background:#f1f1f1;padding:5px;border:1px solid #99bbe8}#diva-canvas-tools .action-buttons a:last-child{border-left:0}#diva-canvas-tools .action-buttons a:hover{background:#fdfdfd}#diva-canvas-toolbar{height:16px;padding:10px;padding-bottom:0}#diva-canvas-toolbar div{height:18px;width:18px;background-repeat:no-repeat;cursor:pointer;z-index:109;display:inline-block;margin-right:5px;background-image:url("../img/actions.png")}#diva-canvas-toolbar span{vertical-align:top;float:right}#diva-canvas-toolwindow{position:relative;margin:10px}#diva-canvas-close:hover{background-position:-20px 0}#diva-canvas-minimise{background-position:-40px 0}#diva-canvas-minimise:hover{background-position:-60px 0}#diva-canvas-buttons div{cursor:pointer;background-image:url("../img/plugins/canvas-buttons.png");background-repeat:no-repeat;width:20px;height:20px;padding:5px;display:inline-block}#diva-canvas-buttons div.clicked{background-color:#ddd}#diva-canvas-buttons .contrast{background-position:5px 5px}#diva-canvas-buttons .contrast:hover,#diva-canvas-buttons .contrast.clicked{background-position:5px -25px}#diva-canvas-buttons .brightness{background-position:-25px 5px}#diva-canvas-buttons .brightness:hover,#diva-canvas-buttons .brightness.clicked{background-position:-25px -25px}#diva-canvas-buttons .rotation{background-position:-55px 5px}#diva-canvas-buttons .rotation:hover,#diva-canvas-buttons .rotation.clicked{background-position:-55px -25px}#diva-canvas-buttons .zoom{background-position:-85px 5px}#diva-canvas-buttons .zoom:hover,#diva-canvas-buttons .zoom.clicked{background-position:-85px -25px}#diva-canvas-buttons .red{background-position:-115px 5px}#diva-canvas-buttons .red:hover,#diva-canvas-buttons .red.clicked{background-position:-115px -25px}#diva-canvas-buttons .green{background-position:-145px 5px}#diva-canvas-buttons .green:hover,#diva-canvas-buttons .green.clicked{background-position:-145px -25px}#diva-canvas-buttons .blue{background-position:-175px 5px}#diva-canvas-buttons .blue:hover,#diva-canvas-buttons .blue.clicked{background-position:-175px -25px}#diva-canvas-pane{background:#ddd;padding-bottom:10px}#diva-canvas-pane p{margin-left:10px;padding-top:10px}#diva-canvas-pane p .link{cursor:pointer}#diva-canvas-pane p .link:hover{text-decoration:underline}#diva-canvas-mode{text-transform:capitalize}#diva-canvas-slider{width:188px;margin:0 auto;display:block}#diva-canvas-slider .handle{margin-left:-6px}#diva-canvas-minimap{height:210px;width:210px;cursor:crosshair;margin-bottom:10px;background:#000}#diva-canvas{position:absolute;left:0;right:0;margin:0 auto;z-index:107;cursor:url("../img/openhand.cur"),pointer}#diva-map-viewbox{border:2px solid #99bbe8;position:absolute;top:10px;left:10px;cursor:crosshair;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:none}.overflow-hidden{overflow:hidden !important}#diva-canvas-wrapper{z-index:106;position:absolute;top:0;left:0;bottom:0;right:0;overflow:scroll}.canvas-throbber{z-index:110;position:fixed}.diva-download-icon{background:url('../img/plugins/download.png') no-repeat;background-position:left center}.diva-download-icon:hover{background-position:-25px center}.diva-autoscroll-icon{float:right;border-right:none;background-image:url("../img/plugins/play.png")}.diva-autoscroll-prefs{display:none;margin-right:.6em}.diva-autoscroll-prefs-text{float:left}.diva-autoscroll-prefs-input{float:right;margin-left:.6em}.diva-autoscroll-pps{width:5em} \ No newline at end of file +.diva-wrapper { + min-height: 95vh; + width: 100%; + flex-grow: 1; } + .diva-wrapper.diva-wrapper-flexbox { + display: flex; + flex-direction: column; } + .diva-wrapper > *:not(.diva-outer) { + flex-shrink: 0; } + +.diva-title { + text-align: center; + font-weight: bold; + font-size: 1.3em; + max-width: 50em; + margin: 0 auto; } + +.diva-button, .diva-input { + box-sizing: border-box; + outline: none; + border-radius: 0; + font: inherit; + vertical-align: middle; } + .diva-button::-moz-focus-inner, .diva-input::-moz-focus-inner { + padding: 0; } + +.diva-button { + display: inline-block; + cursor: pointer; + height: 34px; + width: 34px; + line-height: 34px; + -webkit-appearance: none; + padding: 3px; + background-color: #F1F1F1; + background-repeat: no-repeat; + background-position: center; + border: 1px solid #AAA; } + .diva-button:hover, .diva-button:focus { + background-color: #FDFDFD; } + .diva-button.diva-button-text { + width: auto; + padding: 0 0.5em; } + +.diva-input { + height: 34px; + border: 1px solid #AAA; + padding: 0 0.5em; } + .diva-input:focus { + border-color: #919191; } + +.diva-label { + margin: 0 1em; + line-height: 34px; + vertical-align: top; + white-space: nowrap; + text-overflow: ellipsis; } + +.diva-tools-left, .diva-tools-right { + margin-bottom: 1em; } + +.diva-tools-left { + float: left; + user-select: none; } + +.diva-zoom-in-button, .diva-grid-in-button { + margin-left: -1px; } + +.diva-tools-right { + float: right; } + .diva-tools-right .diva-button { + margin-left: -1px; + user-select: none; } + +.diva-page-nav { + white-space: nowrap; + margin-right: 1em; } + +.diva-goto-form { + display: inline-block; + position: relative; } + +.diva-goto-page-input { + width: 5em; } + +.diva-input-suggestions { + display: none; + box-sizing: border-box; + position: absolute; + width: 100%; + background-color: white; + border: solid 1px #aaa; + border-top: none; + z-index: 1; } + +.diva-input-suggestion { + box-sizing: border-box; + width: 100%; + margin-top: 3px; + padding: 2px; + padding-left: 5px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + cursor: pointer; } + +.diva-input-suggestion.active, .diva-input-suggestion:hover { + background-color: #dfefff; } + +.diva-view-menu { + display: inline-block; + position: relative; } + +.diva-view-options { + position: absolute; + top: 34px; + z-index: 1; + display: none; + box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.1); } + +.diva-view-options .diva-button { + margin-top: -1px; + display: block; } + +.diva-zoom-label, .diva-grid-label, .diva-page-label { + display: inline-block; } + +.diva-fullscreen-tools { + position: fixed; + top: 15px; + right: 30px; + z-index: 101; + padding: 15px; + border: 1px solid #DDD; + background: #FFF; + transition: opacity 0.5s; + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); + /* prevent variable number of digits in labels from resizing .diva-fullscreen-tools */ } + .diva-fullscreen-tools .diva-tools-left, .diva-fullscreen-tools .diva-tools-right { + margin-bottom: 0; } + .diva-fullscreen-tools .diva-tools-right { + margin-left: 2em; } + .diva-fullscreen-tools .diva-label, .diva-fullscreen-tools .diva-page-label { + margin: 0; } + .diva-fullscreen-tools .diva-zoom-label, .diva-fullscreen-tools .diva-grid-label, .diva-fullscreen-tools .diva-page-label { + width: 8em; + display: block; } + .diva-fullscreen-tools .diva-page-nav { + margin-right: 0; } + +.diva-outer { + display: flex; + clear: both; + background: #F1F1F1; + border: 1px solid #AAA; + position: relative; + overflow: hidden; + min-height: 100px; + min-width: 200px; + flex-grow: 1; } + +.diva-viewer-canvas { + position: absolute; + top: 0; + left: 0; } + +.diva-viewport { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + overflow: auto; } + +.diva-inner { + cursor: move; + /* fallback if grab cursor is unsupported */ + cursor: grab; + cursor: -moz-grab; + cursor: -webkit-grab; + position: relative; + overflow: hidden; + margin: 0 auto; } + .diva-inner.diva-grabbing { + cursor: grabbing; + cursor: -moz-grabbing; + cursor: -webkit-grabbing; } + +.diva-page { + box-shadow: 7px 7px 6px -6px rgba(0, 0, 0, 0.3); + position: absolute; + background-color: #FDFDFD; } + +.diva-page-tools-wrapper { + position: absolute; + z-index: 3; } + +.diva-page-tools { + position: relative; + top: -27px; + height: 20px; } + .diva-page-tools div { + display: inline-block; + height: 20px; + width: 20px; + cursor: pointer; + padding: 3px; } + .diva-page-tools div svg:hover .diva-pagetool-icon { + fill: #006ebc; } + +.diva-page-labels-wrapper { + position: absolute; + z-index: 3; } + +.diva-page-labels { + position: relative; + top: -20px; + height: 20px; + font-size: 0.8em; } + +.diva-fullscreen { + width: 100% !important; + max-width: 100% !important; + height: 100% !important; + max-height: 100% !important; + z-index: 100; + position: fixed !important; + top: 0; + left: 0; + margin: 0; + border: 0; } + +.diva-popup { + background: #FFF; + border: 1px solid #AAA; + padding: .6em; + z-index: 101; + position: absolute; + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); } + +.diva-link-popup { + font-size: 10pt; } + .diva-link-popup input { + width: 18em; } + .diva-link-popup input:focus { + outline: none; } + .diva-link-popup.in-fullscreen { + top: 150px; + right: 30px; } + +.diva-hide-scrollbar { + overflow: hidden !important; } + +.diva-slider { + position: relative; + top: 0.6em; + float: left; } + @media (max-width: 480px) { + .diva-slider { + width: 100px; } } + +.diva-throbber { + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); + width: 40px; + height: 40px; + margin: auto auto; + padding: 20px; + background-color: #fff; + /* + * Spinner positions + * 1 2 3 + * 4 5 6 + * 7 8 9 + */ } + .diva-throbber .cube { + width: 33.33%; + height: 33.33%; + background-color: #333; + float: left; + animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; } + .diva-throbber .cube1 { + animation-delay: 0.2s; } + .diva-throbber .cube2 { + animation-delay: 0.3s; } + .diva-throbber .cube3 { + animation-delay: 0.4s; } + .diva-throbber .cube4 { + animation-delay: 0.1s; } + .diva-throbber .cube5 { + animation-delay: 0.2s; } + .diva-throbber .cube6 { + animation-delay: 0.3s; } + .diva-throbber .cube7 { + animation-delay: 0.0s; } + .diva-throbber .cube8 { + animation-delay: 0.1s; } + .diva-throbber .cube9 { + animation-delay: 0.2s; } + +@keyframes sk-cubeGridScaleDelay { + 0%, 70%, 100% { + transform: scale3D(1, 1, 1); } + 35% { + transform: scale3D(0, 0, 1); } } + +.diva-error { + position: absolute; + width: 400px; + height: 200px; + background-color: #fff; + border: 1px solid #ddd; + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); + top: 50%; + left: 50%; + margin-left: -220px; + margin-top: -120px; + z-index: 120; + padding: 0 1em; } + +.diva-error-close { + width: 18px; + height: 18px; + border: none; + position: absolute; + top: 1em; + right: 1em; } + .diva-error-close:hover { + cursor: hand; } + +.diva-modal { + position: absolute; + width: 32em; + max-height: 26em; + background-color: #fff; + border: 1px solid #ddd; + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + z-index: 120; + word-wrap: break-word; } + +.manipulation-fullscreen { + width: 100% !important; + max-width: 100% !important; + height: 100% !important; + max-height: 100% !important; + z-index: 100; + position: fixed !important; + top: 0; + left: 0; + margin: 0; + border: 0; + background-color: rgba(0, 0, 0, 0.9); + display: flex; } + +.manipulation-sidebar { + width: 15%; + overflow: scroll; + text-align: center; + padding: 10px; } + .manipulation-sidebar .manipulation-sidebar-primary-image, + .manipulation-sidebar .manipulation-sidebar-secondary-image { + margin: 10px 0; + padding-bottom: 10px; + border-bottom: 1px solid #fff; + color: #fff; } + +.manipulation-sidebar-mobile { + width: 50%; + text-align: center; + padding: 10px; + display: none; } + .manipulation-sidebar-mobile .manipulation-sidebar-primary-image, + .manipulation-sidebar-mobile .manipulation-sidebar-secondary-image { + margin: 10px 0; + padding-bottom: 10px; + border-bottom: 1px solid #fff; + color: #fff; } + +.manipulation-main-area { + width: 70%; + flex: 1 1 auto; + background-color: rgba(255, 255, 255, 0.5); + overflow: scroll; + text-align: center; + cursor: move; + /* fallback if grab cursor is unsupported */ + cursor: grab; + cursor: -moz-grab; + cursor: -webkit-grab; } + .manipulation-main-area.grabbing { + cursor: grabbing; + cursor: -moz-grabbing; + cursor: -webkit-grabbing; } + .manipulation-main-area canvas { + margin: 0 auto; } + +.manipulation-main-area-mobile { + width: 100%; + background-color: rgba(255, 255, 255, 0.5); + overflow: scroll; + text-align: center; + cursor: move; + /* fallback if grab cursor is unsupported */ + cursor: grab; + cursor: -moz-grab; + cursor: -webkit-grab; } + .manipulation-main-area-mobile.grabbing { + cursor: grabbing; + cursor: -moz-grabbing; + cursor: -webkit-grabbing; } + .manipulation-main-area-mobile canvas { + margin: 0 auto; } + +.manipulation-tools { + width: 15%; + flex: 1 1 auto; + overflow: auto; } + .manipulation-tools .manipulation-tools-text { + color: #FBF7F6; + margin-bottom: 0.7em; } + +.manipulation-tools-mobile { + width: 50%; + flex: 1 1 auto; + overflow: auto; + display: none; } + .manipulation-tools-mobile .manipulation-tools-text { + color: #FBF7F6; + margin-bottom: 0.7em; } + +.burger-menu { + position: fixed; + top: 0.5em; + left: 0.5em; + cursor: pointer; } + .burger-menu .stripe { + width: 2em; + height: 0.3em; + background-color: #fff5ef; + margin: 0.2em 0; } + +input[type=range] { + -webkit-appearance: none; + width: 100%; + margin: 4.5px 0; } + +input[type=range]:focus { + outline: none; } + +input[type=range]::-webkit-slider-runnable-track { + width: 100%; + height: 5px; + cursor: pointer; + box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); + background: rgba(255, 255, 255, 0.66); + border-radius: 25px; + border: 0px solid rgba(1, 1, 1, 0); } + +input[type=range]::-webkit-slider-thumb { + box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66); + border: 0.9px solid rgba(0, 0, 30, 0.42); + height: 13px; + width: 13px; + border-radius: 10px; + background: #ffffff; + cursor: pointer; + -webkit-appearance: none; + margin-top: -4.5px; } + +input[type=range]:focus::-webkit-slider-runnable-track { + background: rgba(253, 133, 243, 0.66); } + +input[type=range]::-moz-range-track { + width: 100%; + height: 5px; + cursor: pointer; + box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); + background: rgba(255, 255, 255, 0.66); + border-radius: 25px; + border: 0px solid rgba(1, 1, 1, 0); } + +input[type=range]::-moz-range-thumb { + box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66); + border: 0.9px solid rgba(0, 0, 30, 0.42); + height: 13px; + width: 13px; + border-radius: 10px; + background: #ffffff; + cursor: pointer; } + +input[type=range]::-ms-track { + width: 100%; + height: 4px; + cursor: pointer; + background: transparent; + border-color: transparent; + color: transparent; } + +input[type=range]::-ms-fill-lower { + background: rgba(251, 83, 239, 0.66); + border: 0px solid rgba(1, 1, 1, 0); + border-radius: 50px; + box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); } + +input[type=range]::-ms-fill-upper { + background: rgba(252, 108, 241, 0.66); + border: 0px solid rgba(1, 1, 1, 0); + border-radius: 50px; + box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); } + +input[type=range]::-ms-thumb { + box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66); + border: 0.9px solid rgba(0, 0, 30, 0.42); + height: 13px; + width: 13px; + border-radius: 10px; + background: #ffffff; + cursor: pointer; + height: 4px; } + +input[type=range]:focus::-ms-fill-lower { + background: rgba(252, 108, 241, 0.66); } + +input[type=range]:focus::-ms-fill-upper { + background: rgba(253, 133, 243, 0.66); } + +#metadata-content { + overflow-y: auto; + max-height: 20em; + padding: 2em; } + +#metadata-content dl dt { + font-weight: bold; } + +#metadata-content dl dd { + margin-left: 0; + margin-bottom: 1em; } + +#metadata-title { + margin: 0; + text-align: center; } + +.close-button { + position: absolute; + right: 1em; + top: 1em; } + +.close-button:hover { + color: tomato; } + + +/*# sourceMappingURL=diva.css.map*/ \ No newline at end of file diff -r 81f761f9c015 -r 719475ad0923 src/main/webapp/imageServer/resources/js/.DS_Store Binary file src/main/webapp/imageServer/resources/js/.DS_Store has changed diff -r 81f761f9c015 -r 719475ad0923 src/main/webapp/imageServer/resources/js/diva.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/main/webapp/imageServer/resources/js/diva.css Fri Jul 05 16:05:57 2019 +0200 @@ -0,0 +1,554 @@ +.diva-wrapper { + min-height: 95vh; + width: 100%; + flex-grow: 1; } + .diva-wrapper.diva-wrapper-flexbox { + display: flex; + flex-direction: column; } + .diva-wrapper > *:not(.diva-outer) { + flex-shrink: 0; } + +.diva-title { + text-align: center; + font-weight: bold; + font-size: 1.3em; + max-width: 50em; + margin: 0 auto; } + +.diva-button, .diva-input { + box-sizing: border-box; + outline: none; + border-radius: 0; + font: inherit; + vertical-align: middle; } + .diva-button::-moz-focus-inner, .diva-input::-moz-focus-inner { + padding: 0; } + +.diva-button { + display: inline-block; + cursor: pointer; + height: 34px; + width: 34px; + line-height: 34px; + -webkit-appearance: none; + padding: 3px; + background-color: #F1F1F1; + background-repeat: no-repeat; + background-position: center; + border: 1px solid #AAA; } + .diva-button:hover, .diva-button:focus { + background-color: #FDFDFD; } + .diva-button.diva-button-text { + width: auto; + padding: 0 0.5em; } + +.diva-input { + height: 34px; + border: 1px solid #AAA; + padding: 0 0.5em; } + .diva-input:focus { + border-color: #919191; } + +.diva-label { + margin: 0 1em; + line-height: 34px; + vertical-align: top; + white-space: nowrap; + text-overflow: ellipsis; } + +.diva-tools-left, .diva-tools-right { + margin-bottom: 1em; } + +.diva-tools-left { + float: left; + user-select: none; } + +.diva-zoom-in-button, .diva-grid-in-button { + margin-left: -1px; } + +.diva-tools-right { + float: right; } + .diva-tools-right .diva-button { + margin-left: -1px; + user-select: none; } + +.diva-page-nav { + white-space: nowrap; + margin-right: 1em; } + +.diva-goto-form { + display: inline-block; + position: relative; } + +.diva-goto-page-input { + width: 5em; } + +.diva-input-suggestions { + display: none; + box-sizing: border-box; + position: absolute; + width: 100%; + background-color: white; + border: solid 1px #aaa; + border-top: none; + z-index: 1; } + +.diva-input-suggestion { + box-sizing: border-box; + width: 100%; + margin-top: 3px; + padding: 2px; + padding-left: 5px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + cursor: pointer; } + +.diva-input-suggestion.active, .diva-input-suggestion:hover { + background-color: #dfefff; } + +.diva-view-menu { + display: inline-block; + position: relative; } + +.diva-view-options { + position: absolute; + top: 34px; + z-index: 1; + display: none; + box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.1); } + +.diva-view-options .diva-button { + margin-top: -1px; + display: block; } + +.diva-zoom-label, .diva-grid-label, .diva-page-label { + display: inline-block; } + +.diva-fullscreen-tools { + position: fixed; + top: 15px; + right: 30px; + z-index: 101; + padding: 15px; + border: 1px solid #DDD; + background: #FFF; + transition: opacity 0.5s; + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); + /* prevent variable number of digits in labels from resizing .diva-fullscreen-tools */ } + .diva-fullscreen-tools .diva-tools-left, .diva-fullscreen-tools .diva-tools-right { + margin-bottom: 0; } + .diva-fullscreen-tools .diva-tools-right { + margin-left: 2em; } + .diva-fullscreen-tools .diva-label, .diva-fullscreen-tools .diva-page-label { + margin: 0; } + .diva-fullscreen-tools .diva-zoom-label, .diva-fullscreen-tools .diva-grid-label, .diva-fullscreen-tools .diva-page-label { + width: 8em; + display: block; } + .diva-fullscreen-tools .diva-page-nav { + margin-right: 0; } + +.diva-outer { + display: flex; + clear: both; + background: #F1F1F1; + border: 1px solid #AAA; + position: relative; + overflow: hidden; + min-height: 100px; + min-width: 200px; + flex-grow: 1; } + +.diva-viewer-canvas { + position: absolute; + top: 0; + left: 0; } + +.diva-viewport { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + overflow: auto; } + +.diva-inner { + cursor: move; + /* fallback if grab cursor is unsupported */ + cursor: grab; + cursor: -moz-grab; + cursor: -webkit-grab; + position: relative; + overflow: hidden; + margin: 0 auto; } + .diva-inner.diva-grabbing { + cursor: grabbing; + cursor: -moz-grabbing; + cursor: -webkit-grabbing; } + +.diva-page { + box-shadow: 7px 7px 6px -6px rgba(0, 0, 0, 0.3); + position: absolute; + background-color: #FDFDFD; } + +.diva-page-tools-wrapper { + position: absolute; + z-index: 3; } + +.diva-page-tools { + position: relative; + top: -27px; + height: 20px; } + .diva-page-tools div { + display: inline-block; + height: 20px; + width: 20px; + cursor: pointer; + padding: 3px; } + .diva-page-tools div svg:hover .diva-pagetool-icon { + fill: #006ebc; } + +.diva-page-labels-wrapper { + position: absolute; + z-index: 3; } + +.diva-page-labels { + position: relative; + top: -20px; + height: 20px; + font-size: 0.8em; } + +.diva-fullscreen { + width: 100% !important; + max-width: 100% !important; + height: 100% !important; + max-height: 100% !important; + z-index: 100; + position: fixed !important; + top: 0; + left: 0; + margin: 0; + border: 0; } + +.diva-popup { + background: #FFF; + border: 1px solid #AAA; + padding: .6em; + z-index: 101; + position: absolute; + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); } + +.diva-link-popup { + font-size: 10pt; } + .diva-link-popup input { + width: 18em; } + .diva-link-popup input:focus { + outline: none; } + .diva-link-popup.in-fullscreen { + top: 150px; + right: 30px; } + +.diva-hide-scrollbar { + overflow: hidden !important; } + +.diva-slider { + position: relative; + top: 0.6em; + float: left; } + @media (max-width: 480px) { + .diva-slider { + width: 100px; } } + +.diva-throbber { + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); + width: 40px; + height: 40px; + margin: auto auto; + padding: 20px; + background-color: #fff; + /* + * Spinner positions + * 1 2 3 + * 4 5 6 + * 7 8 9 + */ } + .diva-throbber .cube { + width: 33.33%; + height: 33.33%; + background-color: #333; + float: left; + animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; } + .diva-throbber .cube1 { + animation-delay: 0.2s; } + .diva-throbber .cube2 { + animation-delay: 0.3s; } + .diva-throbber .cube3 { + animation-delay: 0.4s; } + .diva-throbber .cube4 { + animation-delay: 0.1s; } + .diva-throbber .cube5 { + animation-delay: 0.2s; } + .diva-throbber .cube6 { + animation-delay: 0.3s; } + .diva-throbber .cube7 { + animation-delay: 0.0s; } + .diva-throbber .cube8 { + animation-delay: 0.1s; } + .diva-throbber .cube9 { + animation-delay: 0.2s; } + +@keyframes sk-cubeGridScaleDelay { + 0%, 70%, 100% { + transform: scale3D(1, 1, 1); } + 35% { + transform: scale3D(0, 0, 1); } } + +.diva-error { + position: absolute; + width: 400px; + height: 200px; + background-color: #fff; + border: 1px solid #ddd; + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); + top: 50%; + left: 50%; + margin-left: -220px; + margin-top: -120px; + z-index: 120; + padding: 0 1em; } + +.diva-error-close { + width: 18px; + height: 18px; + border: none; + position: absolute; + top: 1em; + right: 1em; } + .diva-error-close:hover { + cursor: hand; } + +.diva-modal { + position: absolute; + width: 32em; + max-height: 26em; + background-color: #fff; + border: 1px solid #ddd; + box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + z-index: 120; + word-wrap: break-word; } + +.manipulation-fullscreen { + width: 100% !important; + max-width: 100% !important; + height: 100% !important; + max-height: 100% !important; + z-index: 100; + position: fixed !important; + top: 0; + left: 0; + margin: 0; + border: 0; + background-color: rgba(0, 0, 0, 0.9); + display: flex; } + +.manipulation-sidebar { + width: 15%; + overflow: scroll; + text-align: center; + padding: 10px; } + .manipulation-sidebar .manipulation-sidebar-primary-image, + .manipulation-sidebar .manipulation-sidebar-secondary-image { + margin: 10px 0; + padding-bottom: 10px; + border-bottom: 1px solid #fff; + color: #fff; } + +.manipulation-sidebar-mobile { + width: 50%; + text-align: center; + padding: 10px; + display: none; } + .manipulation-sidebar-mobile .manipulation-sidebar-primary-image, + .manipulation-sidebar-mobile .manipulation-sidebar-secondary-image { + margin: 10px 0; + padding-bottom: 10px; + border-bottom: 1px solid #fff; + color: #fff; } + +.manipulation-main-area { + width: 70%; + flex: 1 1 auto; + background-color: rgba(255, 255, 255, 0.5); + overflow: scroll; + text-align: center; + cursor: move; + /* fallback if grab cursor is unsupported */ + cursor: grab; + cursor: -moz-grab; + cursor: -webkit-grab; } + .manipulation-main-area.grabbing { + cursor: grabbing; + cursor: -moz-grabbing; + cursor: -webkit-grabbing; } + .manipulation-main-area canvas { + margin: 0 auto; } + +.manipulation-main-area-mobile { + width: 100%; + background-color: rgba(255, 255, 255, 0.5); + overflow: scroll; + text-align: center; + cursor: move; + /* fallback if grab cursor is unsupported */ + cursor: grab; + cursor: -moz-grab; + cursor: -webkit-grab; } + .manipulation-main-area-mobile.grabbing { + cursor: grabbing; + cursor: -moz-grabbing; + cursor: -webkit-grabbing; } + .manipulation-main-area-mobile canvas { + margin: 0 auto; } + +.manipulation-tools { + width: 15%; + flex: 1 1 auto; + overflow: auto; } + .manipulation-tools .manipulation-tools-text { + color: #FBF7F6; + margin-bottom: 0.7em; } + +.manipulation-tools-mobile { + width: 50%; + flex: 1 1 auto; + overflow: auto; + display: none; } + .manipulation-tools-mobile .manipulation-tools-text { + color: #FBF7F6; + margin-bottom: 0.7em; } + +.burger-menu { + position: fixed; + top: 0.5em; + left: 0.5em; + cursor: pointer; } + .burger-menu .stripe { + width: 2em; + height: 0.3em; + background-color: #fff5ef; + margin: 0.2em 0; } + +input[type=range] { + -webkit-appearance: none; + width: 100%; + margin: 4.5px 0; } + +input[type=range]:focus { + outline: none; } + +input[type=range]::-webkit-slider-runnable-track { + width: 100%; + height: 5px; + cursor: pointer; + box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); + background: rgba(255, 255, 255, 0.66); + border-radius: 25px; + border: 0px solid rgba(1, 1, 1, 0); } + +input[type=range]::-webkit-slider-thumb { + box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66); + border: 0.9px solid rgba(0, 0, 30, 0.42); + height: 13px; + width: 13px; + border-radius: 10px; + background: #ffffff; + cursor: pointer; + -webkit-appearance: none; + margin-top: -4.5px; } + +input[type=range]:focus::-webkit-slider-runnable-track { + background: rgba(253, 133, 243, 0.66); } + +input[type=range]::-moz-range-track { + width: 100%; + height: 5px; + cursor: pointer; + box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); + background: rgba(255, 255, 255, 0.66); + border-radius: 25px; + border: 0px solid rgba(1, 1, 1, 0); } + +input[type=range]::-moz-range-thumb { + box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66); + border: 0.9px solid rgba(0, 0, 30, 0.42); + height: 13px; + width: 13px; + border-radius: 10px; + background: #ffffff; + cursor: pointer; } + +input[type=range]::-ms-track { + width: 100%; + height: 4px; + cursor: pointer; + background: transparent; + border-color: transparent; + color: transparent; } + +input[type=range]::-ms-fill-lower { + background: rgba(251, 83, 239, 0.66); + border: 0px solid rgba(1, 1, 1, 0); + border-radius: 50px; + box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); } + +input[type=range]::-ms-fill-upper { + background: rgba(252, 108, 241, 0.66); + border: 0px solid rgba(1, 1, 1, 0); + border-radius: 50px; + box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); } + +input[type=range]::-ms-thumb { + box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66); + border: 0.9px solid rgba(0, 0, 30, 0.42); + height: 13px; + width: 13px; + border-radius: 10px; + background: #ffffff; + cursor: pointer; + height: 4px; } + +input[type=range]:focus::-ms-fill-lower { + background: rgba(252, 108, 241, 0.66); } + +input[type=range]:focus::-ms-fill-upper { + background: rgba(253, 133, 243, 0.66); } + +#metadata-content { + overflow-y: auto; + max-height: 20em; + padding: 2em; } + +#metadata-content dl dt { + font-weight: bold; } + +#metadata-content dl dd { + margin-left: 0; + margin-bottom: 1em; } + +#metadata-title { + margin: 0; + text-align: center; } + +.close-button { + position: absolute; + right: 1em; + top: 1em; } + +.close-button:hover { + color: tomato; } + + +/*# sourceMappingURL=diva.css.map*/ \ No newline at end of file diff -r 81f761f9c015 -r 719475ad0923 src/main/webapp/imageServer/resources/js/diva.css.map --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/main/webapp/imageServer/resources/js/diva.css.map Fri Jul 05 16:05:57 2019 +0200 @@ -0,0 +1,1 @@ +{"version":3,"file":"diva.css","sources":["webpack:///./source/css/diva.scss"],"sourcesContent":[".diva-wrapper {\n min-height: 95vh;\n width: 100%;\n flex-grow: 1; }\n .diva-wrapper.diva-wrapper-flexbox {\n display: flex;\n flex-direction: column; }\n .diva-wrapper > *:not(.diva-outer) {\n flex-shrink: 0; }\n\n.diva-title {\n text-align: center;\n font-weight: bold;\n font-size: 1.3em;\n max-width: 50em;\n margin: 0 auto; }\n\n.diva-button, .diva-input {\n box-sizing: border-box;\n outline: none;\n border-radius: 0;\n font: inherit;\n vertical-align: middle; }\n .diva-button::-moz-focus-inner, .diva-input::-moz-focus-inner {\n padding: 0; }\n\n.diva-button {\n display: inline-block;\n cursor: pointer;\n height: 34px;\n width: 34px;\n line-height: 34px;\n -webkit-appearance: none;\n padding: 3px;\n background-color: #F1F1F1;\n background-repeat: no-repeat;\n background-position: center;\n border: 1px solid #AAA; }\n .diva-button:hover, .diva-button:focus {\n background-color: #FDFDFD; }\n .diva-button.diva-button-text {\n width: auto;\n padding: 0 0.5em; }\n\n.diva-input {\n height: 34px;\n border: 1px solid #AAA;\n padding: 0 0.5em; }\n .diva-input:focus {\n border-color: #919191; }\n\n.diva-label {\n margin: 0 1em;\n line-height: 34px;\n vertical-align: top;\n white-space: nowrap;\n text-overflow: ellipsis; }\n\n.diva-tools-left, .diva-tools-right {\n margin-bottom: 1em; }\n\n.diva-tools-left {\n float: left;\n user-select: none; }\n\n.diva-zoom-in-button, .diva-grid-in-button {\n margin-left: -1px; }\n\n.diva-tools-right {\n float: right; }\n .diva-tools-right .diva-button {\n margin-left: -1px;\n user-select: none; }\n\n.diva-page-nav {\n white-space: nowrap;\n margin-right: 1em; }\n\n.diva-goto-form {\n display: inline-block;\n position: relative; }\n\n.diva-goto-page-input {\n width: 5em; }\n\n.diva-input-suggestions {\n display: none;\n box-sizing: border-box;\n position: absolute;\n width: 100%;\n background-color: white;\n border: solid 1px #aaa;\n border-top: none;\n z-index: 1; }\n\n.diva-input-suggestion {\n box-sizing: border-box;\n width: 100%;\n margin-top: 3px;\n padding: 2px;\n padding-left: 5px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n cursor: pointer; }\n\n.diva-input-suggestion.active, .diva-input-suggestion:hover {\n background-color: #dfefff; }\n\n.diva-view-menu {\n display: inline-block;\n position: relative; }\n\n.diva-view-options {\n position: absolute;\n top: 34px;\n z-index: 1;\n display: none;\n box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.1); }\n\n.diva-view-options .diva-button {\n margin-top: -1px;\n display: block; }\n\n.diva-zoom-label, .diva-grid-label, .diva-page-label {\n display: inline-block; }\n\n.diva-fullscreen-tools {\n position: fixed;\n top: 15px;\n right: 30px;\n z-index: 101;\n padding: 15px;\n border: 1px solid #DDD;\n background: #FFF;\n transition: opacity 0.5s;\n box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5);\n /* prevent variable number of digits in labels from resizing .diva-fullscreen-tools */ }\n .diva-fullscreen-tools .diva-tools-left, .diva-fullscreen-tools .diva-tools-right {\n margin-bottom: 0; }\n .diva-fullscreen-tools .diva-tools-right {\n margin-left: 2em; }\n .diva-fullscreen-tools .diva-label, .diva-fullscreen-tools .diva-page-label {\n margin: 0; }\n .diva-fullscreen-tools .diva-zoom-label, .diva-fullscreen-tools .diva-grid-label, .diva-fullscreen-tools .diva-page-label {\n width: 8em;\n display: block; }\n .diva-fullscreen-tools .diva-page-nav {\n margin-right: 0; }\n\n.diva-outer {\n display: flex;\n clear: both;\n background: #F1F1F1;\n border: 1px solid #AAA;\n position: relative;\n overflow: hidden;\n min-height: 100px;\n min-width: 200px;\n flex-grow: 1; }\n\n.diva-viewer-canvas {\n position: absolute;\n top: 0;\n left: 0; }\n\n.diva-viewport {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: auto; }\n\n.diva-inner {\n cursor: move;\n /* fallback if grab cursor is unsupported */\n cursor: grab;\n cursor: -moz-grab;\n cursor: -webkit-grab;\n position: relative;\n overflow: hidden;\n margin: 0 auto; }\n .diva-inner.diva-grabbing {\n cursor: grabbing;\n cursor: -moz-grabbing;\n cursor: -webkit-grabbing; }\n\n.diva-page {\n box-shadow: 7px 7px 6px -6px rgba(0, 0, 0, 0.3);\n position: absolute;\n background-color: #FDFDFD; }\n\n.diva-page-tools-wrapper {\n position: absolute;\n z-index: 3; }\n\n.diva-page-tools {\n position: relative;\n top: -27px;\n height: 20px; }\n .diva-page-tools div {\n display: inline-block;\n height: 20px;\n width: 20px;\n cursor: pointer;\n padding: 3px; }\n .diva-page-tools div svg:hover .diva-pagetool-icon {\n fill: #006ebc; }\n\n.diva-page-labels-wrapper {\n position: absolute;\n z-index: 3; }\n\n.diva-page-labels {\n position: relative;\n top: -20px;\n height: 20px;\n font-size: 0.8em; }\n\n.diva-fullscreen {\n width: 100% !important;\n max-width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n z-index: 100;\n position: fixed !important;\n top: 0;\n left: 0;\n margin: 0;\n border: 0; }\n\n.diva-popup {\n background: #FFF;\n border: 1px solid #AAA;\n padding: .6em;\n z-index: 101;\n position: absolute;\n box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5); }\n\n.diva-link-popup {\n font-size: 10pt; }\n .diva-link-popup input {\n width: 18em; }\n .diva-link-popup input:focus {\n outline: none; }\n .diva-link-popup.in-fullscreen {\n top: 150px;\n right: 30px; }\n\n.diva-hide-scrollbar {\n overflow: hidden !important; }\n\n.diva-slider {\n position: relative;\n top: 0.6em;\n float: left; }\n @media (max-width: 480px) {\n .diva-slider {\n width: 100px; } }\n\n.diva-throbber {\n box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5);\n width: 40px;\n height: 40px;\n margin: auto auto;\n padding: 20px;\n background-color: #fff;\n /*\n * Spinner positions\n * 1 2 3\n * 4 5 6\n * 7 8 9\n */ }\n .diva-throbber .cube {\n width: 33.33%;\n height: 33.33%;\n background-color: #333;\n float: left;\n animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; }\n .diva-throbber .cube1 {\n animation-delay: 0.2s; }\n .diva-throbber .cube2 {\n animation-delay: 0.3s; }\n .diva-throbber .cube3 {\n animation-delay: 0.4s; }\n .diva-throbber .cube4 {\n animation-delay: 0.1s; }\n .diva-throbber .cube5 {\n animation-delay: 0.2s; }\n .diva-throbber .cube6 {\n animation-delay: 0.3s; }\n .diva-throbber .cube7 {\n animation-delay: 0.0s; }\n .diva-throbber .cube8 {\n animation-delay: 0.1s; }\n .diva-throbber .cube9 {\n animation-delay: 0.2s; }\n\n@keyframes sk-cubeGridScaleDelay {\n 0%, 70%, 100% {\n transform: scale3D(1, 1, 1); }\n 35% {\n transform: scale3D(0, 0, 1); } }\n\n.diva-error {\n position: absolute;\n width: 400px;\n height: 200px;\n background-color: #fff;\n border: 1px solid #ddd;\n box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5);\n top: 50%;\n left: 50%;\n margin-left: -220px;\n margin-top: -120px;\n z-index: 120;\n padding: 0 1em; }\n\n.diva-error-close {\n width: 18px;\n height: 18px;\n border: none;\n position: absolute;\n top: 1em;\n right: 1em; }\n .diva-error-close:hover {\n cursor: hand; }\n\n.diva-modal {\n position: absolute;\n width: 32em;\n max-height: 26em;\n background-color: #fff;\n border: 1px solid #ddd;\n box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5);\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 120;\n word-wrap: break-word; }\n\n.manipulation-fullscreen {\n width: 100% !important;\n max-width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n z-index: 100;\n position: fixed !important;\n top: 0;\n left: 0;\n margin: 0;\n border: 0;\n background-color: rgba(0, 0, 0, 0.9);\n display: flex; }\n\n.manipulation-sidebar {\n width: 15%;\n overflow: scroll;\n text-align: center;\n padding: 10px; }\n .manipulation-sidebar .manipulation-sidebar-primary-image,\n .manipulation-sidebar .manipulation-sidebar-secondary-image {\n margin: 10px 0;\n padding-bottom: 10px;\n border-bottom: 1px solid #fff;\n color: #fff; }\n\n.manipulation-sidebar-mobile {\n width: 50%;\n text-align: center;\n padding: 10px;\n display: none; }\n .manipulation-sidebar-mobile .manipulation-sidebar-primary-image,\n .manipulation-sidebar-mobile .manipulation-sidebar-secondary-image {\n margin: 10px 0;\n padding-bottom: 10px;\n border-bottom: 1px solid #fff;\n color: #fff; }\n\n.manipulation-main-area {\n width: 70%;\n flex: 1 1 auto;\n background-color: rgba(255, 255, 255, 0.5);\n overflow: scroll;\n text-align: center;\n cursor: move;\n /* fallback if grab cursor is unsupported */\n cursor: grab;\n cursor: -moz-grab;\n cursor: -webkit-grab; }\n .manipulation-main-area.grabbing {\n cursor: grabbing;\n cursor: -moz-grabbing;\n cursor: -webkit-grabbing; }\n .manipulation-main-area canvas {\n margin: 0 auto; }\n\n.manipulation-main-area-mobile {\n width: 100%;\n background-color: rgba(255, 255, 255, 0.5);\n overflow: scroll;\n text-align: center;\n cursor: move;\n /* fallback if grab cursor is unsupported */\n cursor: grab;\n cursor: -moz-grab;\n cursor: -webkit-grab; }\n .manipulation-main-area-mobile.grabbing {\n cursor: grabbing;\n cursor: -moz-grabbing;\n cursor: -webkit-grabbing; }\n .manipulation-main-area-mobile canvas {\n margin: 0 auto; }\n\n.manipulation-tools {\n width: 15%;\n flex: 1 1 auto;\n overflow: auto; }\n .manipulation-tools .manipulation-tools-text {\n color: #FBF7F6;\n margin-bottom: 0.7em; }\n\n.manipulation-tools-mobile {\n width: 50%;\n flex: 1 1 auto;\n overflow: auto;\n display: none; }\n .manipulation-tools-mobile .manipulation-tools-text {\n color: #FBF7F6;\n margin-bottom: 0.7em; }\n\n.burger-menu {\n position: fixed;\n top: 0.5em;\n left: 0.5em;\n cursor: pointer; }\n .burger-menu .stripe {\n width: 2em;\n height: 0.3em;\n background-color: #fff5ef;\n margin: 0.2em 0; }\n\ninput[type=range] {\n -webkit-appearance: none;\n width: 100%;\n margin: 4.5px 0; }\n\ninput[type=range]:focus {\n outline: none; }\n\ninput[type=range]::-webkit-slider-runnable-track {\n width: 100%;\n height: 5px;\n cursor: pointer;\n box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32);\n background: rgba(255, 255, 255, 0.66);\n border-radius: 25px;\n border: 0px solid rgba(1, 1, 1, 0); }\n\ninput[type=range]::-webkit-slider-thumb {\n box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66);\n border: 0.9px solid rgba(0, 0, 30, 0.42);\n height: 13px;\n width: 13px;\n border-radius: 10px;\n background: #ffffff;\n cursor: pointer;\n -webkit-appearance: none;\n margin-top: -4.5px; }\n\ninput[type=range]:focus::-webkit-slider-runnable-track {\n background: rgba(253, 133, 243, 0.66); }\n\ninput[type=range]::-moz-range-track {\n width: 100%;\n height: 5px;\n cursor: pointer;\n box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32);\n background: rgba(255, 255, 255, 0.66);\n border-radius: 25px;\n border: 0px solid rgba(1, 1, 1, 0); }\n\ninput[type=range]::-moz-range-thumb {\n box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66);\n border: 0.9px solid rgba(0, 0, 30, 0.42);\n height: 13px;\n width: 13px;\n border-radius: 10px;\n background: #ffffff;\n cursor: pointer; }\n\ninput[type=range]::-ms-track {\n width: 100%;\n height: 4px;\n cursor: pointer;\n background: transparent;\n border-color: transparent;\n color: transparent; }\n\ninput[type=range]::-ms-fill-lower {\n background: rgba(251, 83, 239, 0.66);\n border: 0px solid rgba(1, 1, 1, 0);\n border-radius: 50px;\n box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); }\n\ninput[type=range]::-ms-fill-upper {\n background: rgba(252, 108, 241, 0.66);\n border: 0px solid rgba(1, 1, 1, 0);\n border-radius: 50px;\n box-shadow: 0.4px 0.4px 2.4px rgba(0, 0, 0, 0.32), 0px 0px 0.4px rgba(13, 13, 13, 0.32); }\n\ninput[type=range]::-ms-thumb {\n box-shadow: 1px 1px 6.2px rgba(0, 0, 49, 0.66), 0px 0px 1px rgba(0, 0, 75, 0.66);\n border: 0.9px solid rgba(0, 0, 30, 0.42);\n height: 13px;\n width: 13px;\n border-radius: 10px;\n background: #ffffff;\n cursor: pointer;\n height: 4px; }\n\ninput[type=range]:focus::-ms-fill-lower {\n background: rgba(252, 108, 241, 0.66); }\n\ninput[type=range]:focus::-ms-fill-upper {\n background: rgba(253, 133, 243, 0.66); }\n\n#metadata-content {\n overflow-y: auto;\n max-height: 20em;\n padding: 2em; }\n\n#metadata-content dl dt {\n font-weight: bold; }\n\n#metadata-content dl dd {\n margin-left: 0;\n margin-bottom: 1em; }\n\n#metadata-title {\n margin: 0;\n text-align: center; }\n\n.close-button {\n position: absolute;\n right: 1em;\n top: 1em; }\n\n.close-button:hover {\n color: tomato; }\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;","sourceRoot":""} \ No newline at end of file diff -r 81f761f9c015 -r 719475ad0923 src/main/webapp/imageServer/resources/js/diva.js --- a/src/main/webapp/imageServer/resources/js/diva.js Mon Jul 01 15:05:05 2019 +0200 +++ b/src/main/webapp/imageServer/resources/js/diva.js Fri Jul 05 16:05:57 2019 +0200 @@ -1,2592 +1,9 @@ -window.divaPlugins = []; - -// this pattern was taken from http://www.virgentech.com/blog/2009/10/building-object-oriented-jquery-plugin.html -(function ($) -{ - var Diva = function (element, options) - { - // These are elements that can be overridden upon instantiation - // See https://github.com/DDMAL/diva.js/wiki/Code-documentation for more details - var defaults = { - adaptivePadding: 0.05, // The ratio of padding to the page dimension - blockMobileMove: true, // Prevent moving or scrolling the page on mobile devices - contained: false, // Determines the location of the fullscreen icon - objectData: '', // URL to the JSON file that provides the object dimension data - *MANDATORY* - enableAutoHeight: false, // Automatically adjust height based on the window size - enableAutoTitle: true, // Shows the title within a div of id diva-title - enableAutoWidth: true, // Automatically adjust width based on the window size - enableCanvas: true, // Used for the canvas plugin - enableDownload: true, // Used for the download plugin - enableFilename: true, // Uses filenames and not page numbers for links (i=bm_001.tif, not p=1) - enableFullscreen: true, // Enable or disable fullscreen icon (mode still available) - enableGotoPage: true, // A "go to page" jump box - enableGridIcon: true, // A grid view of all the pages - enableGridSlider: true, // Slider to control the pages per grid row - enableKeyScroll: true, // Scrolling using the page up/down keys - enableLinkIcon: true, // Controls the visibility of the link icon - enableSpaceScroll: false, // Scrolling down by pressing the space key - enableToolbar: true, // Enables the toolbar. Note that disabling this means you have to handle all controls yourself. - enableZoomSlider: true, // Enable or disable the zoom slider (for zooming in and out) - fixedPadding: 10, // Fallback if adaptive padding is set to 0 - fixedHeightGrid: true, // So each page in grid view has the same height (only widths differ) - goDirectlyTo: 0, // Default initial page to show (0-indexed) - iipServerURL: '', // The URL to the IIPImage installation, including the `?FIF=` - *MANDATORY* - inFullscreen: false, // Set to true to load fullscreen mode initially - inGrid: false, // Set to true to load grid view initially - imageDir: '', // Image directory, either absolute path or relative to IIP's FILESYSTEM_PREFIX - *MANDATORY* - maxPagesPerRow: 8, // Maximum number of pages per row, grid view - maxZoomLevel: -1, // Optional; defaults to the max zoom returned in the JSON response - minPagesPerRow: 2, // 2 for the spread view. Recommended to leave it - minZoomLevel: 0, // Defaults to 0 (the minimum zoom) - onDocumentLoaded: null, // Callback function for when the document is fully loaded - onModeToggle: null, // Callback for toggling fullscreen mode - onViewToggle: null, // Callback for switching between grid and document view - onJump: null, // Callback function for jumping to a specific page (using the gotoPage feature) - onPageLoad: null, // Callback function for loading pages - onPageLoaded: null, // Callback function for after the page has been loaded - onReady: null, // Callback function for initial load - onScroll: null, // Callback function for scrolling - onScrollDown: null, // Callback function for scrolling down, only - onScrollUp: null, // Callback function for scrolling up only - onSetCurrentPage: null, // Callback function for when the current page is set - onZoom: null, // Callback function for zooming in general - onZoomIn: null, // Callback function for zooming in only - onZoomOut: null, // Callback function for zooming out only - pageLoadTimeout: 200, // Number of milliseconds to wait before loading pages - pagesPerRow: 5, // The default number of pages per row in grid view - rowLoadTimeout: 50, // Number of milliseconds to wait before loading a row - throbberTimeout: 100, // Number of milliseconds to wait before showing throbber - tileHeight: 256, // The height of each tile, in pixels; usually 256 - tileWidth: 256, // The width of each tile, in pixels; usually 256 - toolbarParentSelector: null, // The toolbar parent selector. If null, it defaults to the primary diva element. Must be a jQuery selector (leading '#') - viewerHeightPadding: 15, // Vertical padding when resizing the viewer, if enableAutoHeight is set - viewerWidthPadding: 30, // Horizontal padding when resizing the viewer, if enableAutoHeight is set - viewportMargin: 200, // Pretend tiles +/- 200px away from viewport are in - zoomLevel: 2 // The initial zoom level (used to store the current zoom level) - }; - - // Apply the defaults, or override them with passed-in options. - var settings = $.extend({}, defaults, options); - - // Things that cannot be changed because of the way they are used by the script - // Many of these are declared with arbitrary values that are changed later on - var globals = { - allTilesLoaded: [], // A boolean for each page, indicating if all tiles have been loaded - averageHeights: [], // The average page height for each zoom level - averageWidths: [], // The average page width for each zoom level - currentPageIndex: 0, // The current page in the viewport (center-most page) - dimAfterZoom: 0, // Used for storing the item dimensions after zooming - firstPageLoaded: -1, // The ID of the first page loaded (value set later) - firstRowLoaded: -1, // The index of the first row loaded - gridPageWidth: 0, // Holds the max width of each row in grid view. Calculated in loadGrid() - hashParamSuffix: '', // Used when there are multiple document viewers on a page - heightAbovePages: [], // The height above each page at the current zoom level - horizontalOffset: 0, // Used in documentScroll for scrolling more precisely - horizontalPadding: 0, // Either the fixed padding or adaptive padding - ID: null, // The prefix of the IDs of the elements (usually 1-diva-) - innerSelector: '', // settings.selector + 'inner', for selecting the .diva-inner element - itemTitle: '', // The title of the document - lastPageLoaded: -1, // The ID of the last page loaded (value set later) - lastRowLoaded: -1, // The index of the last row loaded - leftScrollSoFar: 0, // Current scroll from the left edge of the pane - loaded: false, // A flag for when everything is loaded and ready to go. - maxWidths: [], // The width of the widest page for each zoom level - maxRatio: 0, // The max height/width ratio (for grid view) - minHeight: 0, // Minimum height of the .diva-outer element, as defined in the CSS - minRatio: 0, // The minimum height/width ratio for a page - minWidth: 0, // Minimum width of the .diva-outer element, as defined in the CSS - mobileWebkit: false, // Checks if the user is on a touch device (iPad/iPod/iPhone/Android) - numPages: 0, // Number of pages in the array - numRows: 0, // Number of rows - oldPagesPerRow: 0, // Holds the previous number of pages per row after it is changed - oldZoomLevel: -1, // Holds the previous zoom level after zooming in or out - orientationChange: false, // For handling device orientation changes for touch devices - originalHeight: 0, // Stores the original height of the .diva-outer element - originalWidth: 0, // Stores the original width of the .diva-outer element - outerSelector: '', // settings.selector + 'outer', for selecting the .diva-outer element - pages: [], // An array containing the data for all the pages - pageLeftOffsets: [], // Offset from the left side of the pane to the edge of the page - pageTimeouts: [], // Stack to hold the loadPage timeouts - pageTools: '', // The string for page tools - panelHeight: 0, // Height of the document viewer pane - panelWidth: 0, // Width of the document viewer pane - plugins: [], // Filled with the enabled plugins from window.divaPlugins - previousTopScroll: 0, // Used to determine vertical scroll direction - preZoomOffset: null, // Holds the offset prior to zooming when double-clicking - realMaxZoom: -1, // To hold the true max zoom level of the document (needed for calculations) - resizeTimer: -1, // Holds the ID of the timeout used when resizing the window (for clearing) - rowHeight: 0, // Holds the max height of each row in grid view. Calculated in loadGrid() - scaleWait: false, // For preventing double-zoom on touch devices (iPad, etc) - selector: '', // Uses the generated ID prefix to easily select elements - singleClick: false, // Used for catching ctrl+double-click events in Firefox in Mac OS - scrollbarWidth: 0, // Set to the actual scrollbar width in init() - throbberTimeoutID: -1, // Holds the ID of the throbber loading timeout - toolbar: null, // Holds an object with some toolbar-related functions - topScrollSoFar: 0, // Holds the number of pixels of vertical scroll - totalHeights: [], // The total height of all pages (stacked together) for each zoom level - totalHeight: 0, // The total height for the current zoom level (including padding) - verticalOffset: 0, // See horizontalOffset - verticalPadding: 0, // Either the fixed padding or adaptive padding - viewerXOffset: 0, // Distance between left edge of viewer and document left edge - viewerYOffset: 0 // Like viewerXOffset but for the top edges - }; - - $.extend(settings, globals); - - // Executes a callback function with the diva instance set as the context - // Can take an unlimited number to arguments to pass to the callback function - var self = this; - - var executeCallback = function (callback) - { - var args, i, length; - - if (typeof callback === "function") - { - args = []; - for (i = 1, length = arguments.length; i < length; i++) - { - args.push(arguments[i]); - } - - callback.apply(self, args); - - return true; - } - - return false; - }; - - var getPageData = function (pageIndex, attribute) - { - return settings.pages[pageIndex].d[settings.zoomLevel][attribute]; - }; - - // Returns the page index associated with the given filename; must called after settings settings.pages - var getPageIndex = function (filename) - { - var i, - np = settings.numPages; - - for (i = 0; i < np; i++) - { - if (settings.pages[i].f === filename) - { - return i; - } - } - - return -1; - }; - - // Checks if a tile is within the viewport horizontally - var isHorizontallyInViewport = function (left, right) - { - var panelWidth = settings.panelWidth; - var leftOfViewport = settings.leftScrollSoFar - settings.viewportMargin; - var rightOfViewport = leftOfViewport + panelWidth + settings.viewportMargin * 2; - - var leftVisible = left >= leftOfViewport && left <= rightOfViewport; - var rightVisible = right >= leftOfViewport && right <= rightOfViewport; - var middleVisible = left <= leftOfViewport && right >= rightOfViewport; - - return (leftVisible || middleVisible || rightVisible); - }; - - // Checks if a page or tile is within the viewport vertically - var isVerticallyInViewport = function (top, bottom) - { - var panelHeight = settings.panelHeight; - var topOfViewport = settings.topScrollSoFar - settings.viewportMargin; - var bottomOfViewport = topOfViewport + panelHeight + settings.viewportMargin * 2; - - var topVisible = top >= topOfViewport && top <= bottomOfViewport; - var middleVisible = top <= topOfViewport && bottom >= bottomOfViewport; - var bottomVisible = bottom >= topOfViewport && bottom <= bottomOfViewport; - - return (topVisible || middleVisible || bottomVisible); - }; - - // Check if a tile is near the viewport and thus should be loaded - var isTileVisible = function (pageIndex, tileRow, tileCol) - { - var tileTop = settings.heightAbovePages[pageIndex] + (tileRow * settings.tileHeight) + settings.verticalPadding; - var tileBottom = tileTop + settings.tileHeight; - var tileLeft = settings.pageLeftOffsets[pageIndex] + (tileCol * settings.tileWidth); - var tileRight = tileLeft + settings.tileWidth; - - return isVerticallyInViewport(tileTop, tileBottom) && isHorizontallyInViewport(tileLeft, tileRight); - }; - - // Check if a tile has been appended to the DOM - var isTileLoaded = function (pageIndex, tileIndex) - { - return document.getElementById(settings.ID + 'tile-' + pageIndex + '-' + tileIndex) === false; - }; - - // Check if a page index is valid - var isPageValid = function (pageIndex) - { - return pageIndex >= 0 && pageIndex < settings.numPages; - }; - - // Check if a page is in or near the viewport and thus should be loaded - var isPageVisible = function (pageIndex) - { - var topOfPage = settings.heightAbovePages[pageIndex]; - var bottomOfPage = topOfPage + getPageData(pageIndex, 'h') + settings.verticalPadding; - - return isVerticallyInViewport(topOfPage, bottomOfPage); - }; - - // Check if a page has been appended to the DOM - var isPageLoaded = function (pageIndex) - { - return $(document.getElementById(settings.ID + 'page-' + pageIndex)).length > 0; - }; - - // Appends the page directly into the document body, or loads the relevant tiles - var loadPage = function (pageIndex) - { - // If the page and all of its tiles have been loaded, exit - if (isPageLoaded(pageIndex) && settings.allTilesLoaded[pageIndex]) - { - return; - } - - // Load some data for this page - var filename = settings.pages[pageIndex].f; - var width = getPageData(pageIndex, 'w'); - var height = getPageData(pageIndex, 'h'); - var heightFromTop = settings.heightAbovePages[pageIndex] + settings.verticalPadding; - var pageSelector = settings.selector + 'page-' + pageIndex; - var plugin; - - // If the page has not been loaded yet, append the div to the DOM - if (!isPageLoaded(pageIndex)) - { - $(document.getElementById(settings.ID + "inner")).append('
Error
Invalid objectData. Error code: '+b+" "+d+"
";0===a.objectData.lastIndexOf("http", -0)&&""===d&&(d=a.objectData.replace(/https?:\/\//i,"").split(/[/?#]/)[0],location.hostname!==d&&(c+='Attempted to access cross-origin data without CORS.
You may need to update your server configuration to support CORS. For help, see the cross-site request documentation.
'));a.outerObject.append(c+"You may need to update your server configuration in order to use the image manipulation tools. For help, see the canvas cross-site data documentation.
'; -b("#diva-canvas-backdrop").append(m);B()}void 0===h&&(m=a,f.canvas=document.getElementById("diva-canvas-minimap"),f.size=d.mapSize,f.canvas.width=f.size,f.canvas.height=f.size,f.context=f.canvas.getContext("2d"),f.context.fillRect(0,0,f.size,f.size),f.scaleFactor=d.mapSize/e.size,f.cornerX=e.cornerX*f.scaleFactor,f.cornerY=e.cornerY*f.scaleFactor,f.width=m.width*f.scaleFactor,f.height=m.height*f.scaleFactor,f.context.drawImage(m,f.cornerX,f.cornerY,f.width,f.height),f.data=f.context.getImageData(0, -0,d.mapSize,d.mapSize),b("#diva-map-viewbox").show(),k());u();p(e);B();"function"===typeof h&&h.call(h)}},L=function(){var a=g[h],d=a.current,a=a.transform?a.transform(d):d;b("#diva-canvas-value").html(a)},y=function(){b("#diva-canvas-slider").val(g[h].current)},v=function(a){a=d.zoomWidthRatio*Math.pow(2,a);return d.proxyURL?d.proxyURL+"?f="+d.filename+"&w="+a:d.iipServerURL+"?FIF="+(d.imageDir+"/")+d.filename+"&WID="+a+"&CVT=JPEG"},A=function(){(0contrast: 0 (Reset)
Error
Invalid objectData. Error code: '+b+" "+d+"
";0===a.objectData.lastIndexOf("http", +0)&&""===d&&(d=a.objectData.replace(/https?:\/\//i,"").split(/[/?#]/)[0],location.hostname!==d&&(c+='Attempted to access cross-origin data without CORS.
You may need to update your server configuration to support CORS. For help, see the cross-site request documentation.
'));a.outerObject.append(c+"You may need to update your server configuration in order to use the image manipulation tools. For help, see the canvas cross-site data documentation.
'; +b("#diva-canvas-backdrop").append(m);B()}void 0===h&&(m=a,f.canvas=document.getElementById("diva-canvas-minimap"),f.size=d.mapSize,f.canvas.width=f.size,f.canvas.height=f.size,f.context=f.canvas.getContext("2d"),f.context.fillRect(0,0,f.size,f.size),f.scaleFactor=d.mapSize/e.size,f.cornerX=e.cornerX*f.scaleFactor,f.cornerY=e.cornerY*f.scaleFactor,f.width=m.width*f.scaleFactor,f.height=m.height*f.scaleFactor,f.context.drawImage(m,f.cornerX,f.cornerY,f.width,f.height),f.data=f.context.getImageData(0, +0,d.mapSize,d.mapSize),b("#diva-map-viewbox").show(),k());u();p(e);B();"function"===typeof h&&h.call(h)}},L=function(){var a=g[h],d=a.current,a=a.transform?a.transform(d):d;b("#diva-canvas-value").html(a)},y=function(){b("#diva-canvas-slider").val(g[h].current)},v=function(a){a=d.zoomWidthRatio*Math.pow(2,a);return d.proxyURL?d.proxyURL+"?f="+d.filename+"&w="+a:d.iipServerURL+"?FIF="+(d.imageDir+"/")+d.filename+"&WID="+a+"&CVT=JPEG"},A=function(){(0contrast: 0 (Reset)