diff options
8 files changed, 296 insertions, 182 deletions
diff --git a/pdf-as-web/src/main/webapp/assets/css/style.css b/pdf-as-web/src/main/webapp/assets/css/style.css index 751396fe..4b49b238 100644 --- a/pdf-as-web/src/main/webapp/assets/css/style.css +++ b/pdf-as-web/src/main/webapp/assets/css/style.css @@ -12,14 +12,75 @@ footer { iframe { border: none; + min-width:10em; +} + +.methodChooseContainer { + width: 80px; + height: 130px; + text-align: center; +} + +.methodChooseContainer div button { + margin-top:1em; +} + +#methodContainer { + margin: 2em; +} + +#ImageBox { + width: 80px; + height: 85px; +} + +.BKUImage { + margin-top: 12px; } #navBar { margin: 2em; + min-width: 25em; +} + +#ViewerExternToolbar { + margin-bottom: 2em !important; + min-width: 25em; +} + +#ViewerExternToolbar button { + margin-left:0.5em; + margin-right:0.5em; + width: 3em; + height: 3em; } -#placeContinue { - margin: 1em; +#ViewerExternToolbar div { + margin-left:0.5em; + margin-right:0.5em; + width: 3em; + height: 3em; + text-align: center; + font-size: 1em; +} + +#ViewerExternToolbar img { + width: 3em; + height: 3em; +} + +#ViewerExternToolbar img:hover { + cursor: hand; + cursor: pointer; +} + +#ViewerExternToolbar span { + font-size: 2em; +} + +#ViewerExternToolbar span:hover { + cursor: hand; + cursor: pointer; } #fileSelector { @@ -60,6 +121,10 @@ iframe { margin-bottom: 5em; } +#noSignatureWarning { + text-align:center; +} + #btnSign { border-top-left-radius: 15px; border-top-right-radius: 15px; @@ -88,26 +153,22 @@ iframe { } .container { - border-top-left-radius: 1em; - border-top-right-radius: 1em; border: 0.125em solid; border-color: #66A3FF; background: #E8F4FF; box-shadow: 0em 0em 1em #333333; - margin-bottom: 1em; + margin-bottom: 0em; margin-left: 5em; margin-right: 5em; width: 100%; } .container h3 { - border-top-left-radius: 0.5em; - border-top-right-radius: 0.5em; - background: #66A3FF; - color: #FFFFFF; + font-style: bold; + color: #204a87; text-align: center; margin: -0.125em; - margin-left: -0.7em; + margin-left: -0.6em; margin-right: -0.7em; height: 2em; } diff --git a/pdf-as-web/src/main/webapp/assets/img/federohne.svg b/pdf-as-web/src/main/webapp/assets/img/federohne.svg new file mode 100644 index 00000000..1d050a7c --- /dev/null +++ b/pdf-as-web/src/main/webapp/assets/img/federohne.svg @@ -0,0 +1,30 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="145pt" height="145pt" viewBox="0 0 145 145" version="1.1"> +<defs> +<clipPath id="clip1"> + <path d="M 74 28 L 115 28 L 115 122 L 74 122 Z M 74 28 "/> +</clipPath> +<clipPath id="clip2"> + <path d="M 73.972656 121.53125 L 111.453125 122.707031 L 114.414062 28.527344 L 76.929688 27.347656 Z M 73.972656 121.53125 "/> +</clipPath> +<clipPath id="clip3"> + <path d="M 89 30 L 112 30 L 112 66 L 89 66 Z M 89 30 "/> +</clipPath> +<clipPath id="clip4"> + <path d="M 73.972656 121.53125 L 111.453125 122.707031 L 114.414062 28.527344 L 76.929688 27.347656 Z M 73.972656 121.53125 "/> +</clipPath> +</defs> +<g id="surface1"> +<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;" d="M 37.535156 85.148438 C 37.40625 91.328125 37.429688 97.476562 36.8125 103.632812 C 36.234375 109.375 36.253906 117.410156 33.601562 122.550781 C 34.300781 122.363281 35 122.175781 35.699219 121.992188 C 28.667969 114.699219 46.378906 106.246094 48.644531 115.476562 C 49.132812 117.476562 49.570312 119.027344 51.023438 120.511719 C 51.375 120.875 52.753906 120.367188 53.03125 120.058594 C 54.832031 118.042969 55.421875 115.289062 57.777344 113.746094 C 57.136719 113.835938 56.496094 113.921875 55.859375 114.011719 C 56.644531 115.292969 57.691406 119.519531 59.90625 119.28125 C 63.667969 118.875 64.910156 116.777344 68.234375 120.617188 C 68.585938 121.023438 70.609375 120.257812 70.285156 119.882812 C 68.855469 118.234375 67.300781 116.464844 64.875 116.902344 C 59.835938 117.8125 61.121094 118.457031 58.03125 113.429688 C 57.742188 112.960938 56.4375 113.480469 56.117188 113.695312 C 53.207031 115.597656 52.082031 120.527344 50.816406 114.894531 C 50.035156 111.425781 48.324219 110.425781 44.890625 110.4375 C 38.964844 110.457031 27.242188 116.078125 33.648438 122.726562 C 34.007812 123.097656 35.535156 122.566406 35.746094 122.164062 C 37.875 118.035156 37.800781 112.523438 38.40625 107.992188 C 39.453125 100.183594 39.542969 92.421875 39.707031 84.566406 C 39.714844 84.238281 37.546875 84.523438 37.535156 85.148438 "/> +<g clip-path="url(#clip1)" clip-rule="nonzero"> +<g clip-path="url(#clip2)" clip-rule="nonzero"> +<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;" d="M 87.488281 91.382812 C 86.628906 90.953125 85.796875 90.332031 84.691406 90.929688 C 83.625 92.703125 82.304688 95.023438 80.804688 97.390625 C 79.773438 98.996094 77.558594 101.054688 77.023438 103.191406 C 76.691406 104.390625 76.875 106.03125 76.90625 107.128906 C 76.90625 107.128906 76.472656 114.117188 77.050781 115.496094 C 77.710938 113.933594 78.875 108.464844 79.769531 107.035156 C 76.859375 101.03125 85.867188 100.644531 83.671875 106.21875 C 81.363281 107.960938 79.457031 112.851562 79.5 115.105469 C 80.972656 112.957031 84.394531 109.191406 85.5 107.304688 C 86.027344 106.375 86.140625 104.722656 86.320312 103.382812 C 86.859375 99.363281 87.46875 95.039062 87.488281 91.382812 M 100.15625 72.550781 C 100.753906 70.890625 102.378906 67.378906 101.84375 66.128906 C 101.386719 65.03125 98.671875 63.386719 96.5 62.558594 C 94.128906 61.648438 91.597656 61.429688 90.003906 61.957031 C 87.84375 68.277344 85.386719 74.769531 83.589844 80.964844 C 83.015625 83 82.109375 85.207031 82.414062 87.375 C 85.917969 87.65625 89.136719 89.320312 92.316406 91.09375 C 94.976562 86 97.921875 78.667969 100.15625 72.550781 M 111.300781 42.328125 C 111.6875 39.671875 112.492188 36.453125 111.011719 34.085938 C 109.527344 31.722656 105.527344 30.265625 102.96875 31.101562 C 99.695312 32.1875 98.539062 35.773438 97.164062 38.5 C 93.859375 45.101562 90.363281 53.363281 89.160156 59.375 C 94.789062 58.609375 99.777344 60.640625 104.265625 65.125 C 105.640625 62.796875 106.527344 60.242188 107.351562 57.824219 C 109.113281 52.65625 110.503906 47.910156 111.300781 42.328125 M 113.304688 32.90625 C 114.707031 35.257812 114.011719 39.726562 113.570312 42.847656 C 112.300781 52.148438 108.453125 62.28125 105.25 70.132812 C 104.429688 70.851562 103.773438 70.777344 102.957031 71.308594 C 101.023438 76.203125 98.785156 83.152344 96.175781 88.886719 C 94.863281 91.875 93.945312 95.671875 89.933594 95.1875 C 88.835938 99.25 89.511719 103.757812 88.96875 107.96875 C 85.222656 111.261719 81.609375 114.785156 79.039062 118.46875 C 78.265625 119.589844 77.558594 120.996094 76.34375 121.605469 C 74.316406 121.082031 74.921875 118.855469 75.03125 117.390625 C 75.40625 112.910156 75.578125 107.675781 74.558594 102.828125 C 76.542969 99.164062 79.246094 95.675781 81.230469 92.039062 C 77.9375 90.011719 79.375 86.28125 80.167969 83.441406 C 81.859375 77.476562 84.371094 70.546875 86.378906 65.398438 C 86.261719 64.5 85.285156 64.40625 85.40625 63.480469 C 85.515625 60.507812 86.882812 57.703125 87.917969 54.855469 C 89.996094 49.191406 91.667969 44.140625 94.699219 38.140625 C 96.652344 34.265625 97.601562 31.136719 102.363281 28.410156 C 104.507812 27.734375 110.773438 28.609375 113.304688 32.90625 "/> +</g> +</g> +<g clip-path="url(#clip3)" clip-rule="nonzero"> +<g clip-path="url(#clip4)" clip-rule="nonzero"> +<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;" d="M 111.011719 34.089844 C 112.492188 36.453125 111.6875 39.671875 111.300781 42.328125 C 110.503906 47.914062 109.113281 52.65625 107.351562 57.824219 C 106.527344 60.242188 105.640625 62.800781 104.265625 65.121094 C 99.777344 60.640625 94.789062 58.609375 89.160156 59.375 C 90.363281 53.363281 93.859375 45.101562 97.160156 38.5 C 98.539062 35.773438 99.695312 32.1875 102.972656 31.101562 C 105.527344 30.265625 109.527344 31.722656 111.011719 34.089844 "/> +</g> +</g> +</g> +</svg> diff --git a/pdf-as-web/src/main/webapp/assets/js/dragNdrop.js b/pdf-as-web/src/main/webapp/assets/js/dragNdrop.js index edfc1e2e..dc420ecf 100644 --- a/pdf-as-web/src/main/webapp/assets/js/dragNdrop.js +++ b/pdf-as-web/src/main/webapp/assets/js/dragNdrop.js @@ -86,11 +86,22 @@ function registerEventListeners() { $("#PlaceStepButton").click(); }); + $("#placeContinue").bind("click", function(evt) { - + $("#SignStepButton").click(); }); + $("#placeSignatureExtern").bind("click", function(evt) { + + $("#iFrame").contents().find("#placeSignature").click(); + }); + + $("#delSignatureExtern").bind("click", function(evt) { + + $("#iFrame").contents().find("#delSignature").click(); + }) + function toggleView(input) { console.log("toggleView : " + input); @@ -153,25 +164,6 @@ function registerEventListeners() { } } -/* $("#main").bind("drop", function(evt) { - evt.preventDefault(); - evt.stopPropagation(); - var files = evt.originalEvent.dataTransfer.files; - if(files == null || files.length === 0) { - return; - } - else if(files[0].name.indexOf(".pdf") < 0) - { - window.alert("The file type must be PDF"); - return; - } - - file = files[0]; - previewFile(); - }); */ - - - $("#pdf-file").bind("change", function(evt) { file_event = evt; var files = evt.target.files; diff --git a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/app.js b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/app.js index da71e83d..47720d42 100644 --- a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/app.js +++ b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/app.js @@ -121,6 +121,12 @@ function displayPdf() { fileReader.readAsArrayBuffer(file); } +/*$("#placeSignatureExtern").bind("click", function(evt) { + console.log("PLACE SIGNATURE EXTERN"); + $("#placeSignature").click(); + +}); */ + // //Attaches event handlers to the signature placement icons // diff --git a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.css b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.css index 84e0f073..2eff3912 100644 --- a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.css +++ b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.css @@ -36,8 +36,8 @@ } .textLayer .highlight { - margin: -1px; - padding: 1px; + margin: -0.063em; + padding: -0.063em; background-color: rgb(180, 0, 170); border-radius: 4px; @@ -68,9 +68,9 @@ .pdfViewer .page { direction: ltr; - width: 816px; - height: 1056px; - margin: 1px auto -8px auto; + width: 51em; + height: 66em; + margin: 0.063em auto -0.5em auto; position: relative; overflow: visible; border: 9px solid transparent; @@ -80,7 +80,7 @@ } .pdfViewer.removePageBorders .page { - margin: 0px auto 10px auto; + margin: 0px auto 0.625em auto; border: none; } @@ -102,7 +102,7 @@ .pdfViewer .page .annotLink > a:hover { opacity: 0.2; background: #ff0; - box-shadow: 0px 2px 10px #ff0; + box-shadow: 0px 0.125em 0.625em #ff0; } :-webkit-full-screen .pdfViewer .page { @@ -140,8 +140,8 @@ float: left; max-width: 20em; background-color: #FFFF99; - box-shadow: 0px 2px 5px #333; - border-radius: 2px; + box-shadow: 0px 0.125em 0.313em #333; + border-radius: 0.125em; padding: 0.6em; cursor: pointer; } @@ -178,7 +178,7 @@ html { height: 100%; /* Font size is needed to make the activity bar the correct size. */ - font-size: 10px; + font-size: 0.625em; } body { @@ -320,7 +320,7 @@ html[dir='rtl'] .innerCenter { position: absolute; top: 0; bottom: 0; - width: 200px; + width: 12.5em; visibility: hidden; -webkit-transition-duration: 200ms; -webkit-transition-timing-function: ease; @@ -331,12 +331,12 @@ html[dir='rtl'] .innerCenter { html[dir='ltr'] #sidebarContainer { -webkit-transition-property: left; transition-property: left; - left: -200px; + left: -12.5em; } html[dir='rtl'] #sidebarContainer { -webkit-transition-property: right; transition-property: right; - right: -200px; + right: -12.5em; } #outerContainer.sidebarMoving > #sidebarContainer, @@ -356,7 +356,7 @@ html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer { right: 0; bottom: 0; left: 0; - min-width: 320px; + min-width: 10em; -webkit-transition-duration: 200ms; -webkit-transition-timing-function: ease; transition-duration: 200ms; @@ -365,47 +365,47 @@ html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer { html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer { -webkit-transition-property: left; transition-property: left; - left: 200px; + left: 12.5em; } html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer { -webkit-transition-property: right; transition-property: right; - right: 200px; + right: 12.5em; } #sidebarContent { - top: 32px; + top: 2em; bottom: 0; overflow: auto; -webkit-overflow-scrolling: touch; position: absolute; - width: 200px; + width: 12.5em; background-color: hsla(0,0%,0%,.1); } html[dir='ltr'] #sidebarContent { left: 0; - box-shadow: inset -1px 0 0 hsla(0,0%,0%,.25); + box-shadow: inset -0.063em 0 0 hsla(0,0%,0%,.25); } html[dir='rtl'] #sidebarContent { right: 0; - box-shadow: inset 1px 0 0 hsla(0,0%,0%,.25); + box-shadow: inset 0.063em 0 0 hsla(0,0%,0%,.25); } #viewerContainer { overflow: auto; -webkit-overflow-scrolling: touch; position: absolute; - top: 32px; + top: 2em; right: 0; bottom: 0; left: 0; outline: none; } html[dir='ltr'] #viewerContainer { - box-shadow: inset 1px 0 0 hsla(0,0%,100%,.05); + box-shadow: inset 0.063em 0 0 hsla(0,0%,100%,.05); } html[dir='rtl'] #viewerContainer { - box-shadow: inset -1px 0 0 hsla(0,0%,100%,.05); + box-shadow: inset -0.063em 0 0 hsla(0,0%,100%,.05); } .toolbar { @@ -421,57 +421,58 @@ html[dir='rtl'] #viewerContainer { } #toolbarSidebar { - width: 200px; - height: 32px; + width: 12.5em; + height: 2em; background-color: #424242; /* fallback */ background-image: url(images/texture.png), linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95)); } html[dir='ltr'] #toolbarSidebar { - box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25), - inset 0 -1px 0 hsla(0,0%,100%,.05), - 0 1px 0 hsla(0,0%,0%,.15), - 0 0 1px hsla(0,0%,0%,.1); + box-shadow: inset -0.063em 0 0 rgba(0, 0, 0, 0.25), + inset 0 -0.063em 0 hsla(0,0%,100%,.05), + 0 0.063em 0 hsla(0,0%,0%,.15), + 0 0 0.063em hsla(0,0%,0%,.1); } html[dir='rtl'] #toolbarSidebar { - box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25), - inset 0 1px 0 hsla(0,0%,100%,.05), - 0 1px 0 hsla(0,0%,0%,.15), - 0 0 1px hsla(0,0%,0%,.1); + box-shadow: inset 0.063em 0 0 rgba(0, 0, 0, 0.25), + inset 0 0.063em 0 hsla(0,0%,100%,.05), + 0 0.063em 0 hsla(0,0%,0%,.15), + 0 0 0.063em hsla(0,0%,0%,.1); } #toolbarContainer, .findbar, .secondaryToolbar { position: relative; - height: 32px; + height: 2em; background-color: #474747; /* fallback */ background-image: url(images/texture.png), linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95)); } html[dir='ltr'] #toolbarContainer, .findbar, .secondaryToolbar { - box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08), - inset 0 1px 1px hsla(0,0%,0%,.15), - inset 0 -1px 0 hsla(0,0%,100%,.05), - 0 1px 0 hsla(0,0%,0%,.15), - 0 1px 1px hsla(0,0%,0%,.1); + box-shadow: inset 0.063em 0 0 hsla(0,0%,100%,.08), + inset 0 0.063em 0.063em hsla(0,0%,0%,.15), + inset 0 -0.063em 0 hsla(0,0%,100%,.05), + 0 0.063em 0 hsla(0,0%,0%,.15), + 0 0.063em 0.063em hsla(0,0%,0%,.1); } html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar { - box-shadow: inset -1px 0 0 hsla(0,0%,100%,.08), - inset 0 1px 1px hsla(0,0%,0%,.15), - inset 0 -1px 0 hsla(0,0%,100%,.05), - 0 1px 0 hsla(0,0%,0%,.15), - 0 1px 1px hsla(0,0%,0%,.1); + box-shadow: inset -0.063em 0 0 hsla(0,0%,100%,.08), + inset 0 0.063em 0.063em hsla(0,0%,0%,.15), + inset 0 -0.063em 0 hsla(0,0%,100%,.05), + 0 0.063em 0 hsla(0,0%,0%,.15), + 0 0.063em 0.063em hsla(0,0%,0%,.1); } #toolbarViewer { - height: 32px; + height: 2em; + min-width: 5em; } #loadingBar { position: relative; width: 100%; - height: 4px; + height: 0.25em; background-color: #333; - border-bottom: 1px solid #333; + border-bottom: 0.063em solid #333; } #loadingBar .progress { @@ -509,7 +510,7 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar { top: 0; left: 0; height: 100%; - width: 50px; + width: 3.125em; background-image: linear-gradient(to right, #999 0%, #fff 50%, #999 100%); background-size: 100% 100%; @@ -520,27 +521,27 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar { } .findbar, .secondaryToolbar { - top: 32px; + top: 2em; position: absolute; z-index: 10000; - height: 32px; + height: 2em; - min-width: 16px; - padding: 0px 6px 0px 6px; - margin: 4px 2px 4px 2px; + min-width: 1em; + padding: 0px 0.375em 0px 0.375em; + margin: 0.25em 0.125em 0.25em 0.125em; color: hsl(0,0%,85%); - font-size: 12px; - line-height: 14px; + font-size: 0.75em; + line-height: 0.875em; text-align: left; cursor: default; } html[dir='ltr'] .findbar { - left: 68px; + left: 4.25em; } html[dir='rtl'] .findbar { - right: 68px; + right: 4.25em; } .findbar label { @@ -558,23 +559,23 @@ html[dir='rtl'] #findInput[data-status="pending"] { } .secondaryToolbar { - padding: 6px; + padding: 0.375em; height: auto; z-index: 30000; } html[dir='ltr'] .secondaryToolbar { - right: 4px; + right: 0.25em; } html[dir='rtl'] .secondaryToolbar { - left: 4px; + left: 0.25em; } #secondaryToolbarButtonContainer { - max-width: 200px; - max-height: 400px; + max-width: 12.5em; + max-height: 25em; overflow-y: auto; -webkit-overflow-scrolling: touch; - margin-bottom: -4px; + margin-bottom: -0.25em; } .doorHanger, @@ -1260,7 +1261,7 @@ html[dir='rtl'] .verticalToolbarSeparator { } .toolbarLabel { - min-width: 16px; + min-width: 5em; padding: 3px 6px 3px 2px; margin: 4px 2px 4px 0; border: 1px solid transparent; @@ -1564,7 +1565,7 @@ html[dir='rtl'] .attachmentsItem > button { text-align: left; } #documentPropertiesOverlay .row > * { - min-width: 100px; + min-width: 5em; } html[dir='ltr'] #documentPropertiesOverlay .row > * { text-align: left; @@ -1948,14 +1949,14 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { @media all and (max-width: 770px) { #sidebarContainer { - top: 32px; + top: 2em; z-index: 100; } .loadingInProgress #sidebarContainer { - top: 37px; + top: 2.313em; } #sidebarContent { - top: 32px; + top: 2em; background-color: hsla(0,0%,0%,.7); } @@ -1968,11 +1969,11 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { html[dir='ltr'] .outerCenter { float: left; - left: 205px; + left: 12.813em; } html[dir='rtl'] .outerCenter { float: right; - right: 205px; + right: 12.813em; } #outerContainer .hiddenLargeView, @@ -2013,12 +2014,12 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { html[dir='ltr'] #outerContainer.sidebarMoving .outerCenter, html[dir='ltr'] #outerContainer.sidebarOpen .outerCenter, html[dir='ltr'] .outerCenter { - left: 156px; + left: 9.750em; } html[dir='rtl'] #outerContainer.sidebarMoving .outerCenter, html[dir='rtl'] #outerContainer.sidebarOpen .outerCenter, html[dir='rtl'] .outerCenter { - right: 156px; + right: 9.750em; } .toolbarButtonSpacer { width: 0; @@ -2030,3 +2031,9 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { display: none; } } + + @media all and (max-width: 320px) { + #toolbarContainer { + width: 21.5em; + } + } diff --git a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.html b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.html index 1f8a6a44..6db3039e 100644 --- a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.html +++ b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.html @@ -24,7 +24,7 @@ http://sourceforge.net/adobe/cmap/wiki/License/ <meta name="google" content="notranslate"> <title>PDF.js viewer</title> - <link rel="stylesheet" href="viewer.css"/> + <link rel="stylesheet" href="viewer.css"/> <script src="compatibility.js"></script> @@ -42,7 +42,7 @@ http://sourceforge.net/adobe/cmap/wiki/License/ <script src="app.js"></script> <style> .black_overlay{ - display: block; + display: inline-block; position: fixed; top: 0%; left: 0%; @@ -62,7 +62,7 @@ http://sourceforge.net/adobe/cmap/wiki/License/ left: 32%; width: 36%; height: 30%; - padding: 16px; + padding: 1em; border: 4px solid orange; background-color: white; z-index:1002; @@ -219,29 +219,59 @@ http://sourceforge.net/adobe/cmap/wiki/License/ <input type="number" id="pageNumber" class="toolbarField pageNumber" value="1" size="4" min="1" tabindex="15"> <span id="numPages" class="toolbarLabel"></span> </div> + <div id="toolbarViewerRight"> + + <div class="splitToolbarButton"> + <button id="zoomOut" class="toolbarButton zoomOut" title="Zoom Out" tabindex="21" data-l10n-id="zoom_out"> + <span data-l10n-id="zoom_out_label">Zoom Out</span> + </button> + <div class="splitToolbarButtonSeparator"></div> + <button id="zoomIn" class="toolbarButton zoomIn" title="Zoom In" tabindex="22" data-l10n-id="zoom_in"> + <span data-l10n-id="zoom_in_label">Zoom In</span> + </button> + </div> + <span id="scaleSelectContainer" class="dropdownToolbarButton"> + <select id="scaleSelect" title="Zoom" tabindex="23" data-l10n-id="zoom"> + <option id="pageAutoOption" title="" value="auto" selected="selected" data-l10n-id="page_scale_auto">Automatic Zoom</option> + <option id="pageActualOption" title="" value="page-actual" data-l10n-id="page_scale_actual">Actual Size</option> + <option id="pageFitOption" title="" value="page-fit" data-l10n-id="page_scale_fit">Fit Page</option> + <option id="pageWidthOption" title="" value="page-width" data-l10n-id="page_scale_width">Full Width</option> + <option id="customScaleOption" title="" value="custom"></option> + <option title="" value="0.5" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 50 }'>50%</option> + <option title="" value="0.75" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 75 }'>75%</option> + <option title="" value="1" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 100 }'>100%</option> + <option title="" value="1.25" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 125 }'>125%</option> + <option title="" value="1.5" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 150 }'>150%</option> + <option title="" value="2" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 200 }'>200%</option> + <option title="" value="3" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 300 }'>300%</option> + <option title="" value="4" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 400 }'>400%</option> + </select> + </span> + <button id="presentationMode" style="display:none;" class="toolbarButton presentationMode hiddenLargeView" title="Switch to Presentation Mode" tabindex="29" data-l10n-id="presentation_mode"> <span data-l10n-id="presentation_mode_label">Presentation Mode</span> </button> - <!-- ADDED --> - <button id="placeSignature" class="toolbarButton placeSignature hiddenLargeView" title="Place Signature on current Page" tabindex="30" data-l10n-id="place_signature"> + <button style="display:none;" id="placeSignature" class="toolbarButton placeSignature hiddenLargeView" title="Place Signature on current Page" tabindex="30" data-l10n-id="place_signature"> <span data-l10n-id="place_signature_label">Place Signature</span> - </button> + </button> + - <!-- ADDED --> - <button id="delSignature" class="toolbarButton delSignature hiddenLargeView" title="Remove Signature (If no Signature gets placed, one will be appended at the end of the document)" tabindex="31" data-l10n-id="del_signature"> + <button style="display:none;" id="delSignature" class="toolbarButton delSignature hiddenLargeView" title="Remove Signature (If no Signature gets placed, one will be appended at the end of the document)" tabindex="31" data-l10n-id="del_signature"> <span data-l10n-id="place_signature_label">Remove Signature</span> - </button> + </button> + - <button id="openFile" class="toolbarButton openFile hiddenLargeView" title="Open File" tabindex="32" data-l10n-id="open_file"> + <button style="display:none;" id="openFile" class="toolbarButton openFile hiddenLargeView" title="Open File" tabindex="30" data-l10n-id="open_file"> <span data-l10n-id="open_file_label">Open</span> - </button> + </button> - <button id="print" class="toolbarButton print hiddenMediumView" title="Print" tabindex="33" data-l10n-id="print"> + + <button style="display:none;" id="print" class="toolbarButton print hiddenMediumView" title="Print" tabindex="33" data-l10n-id="print"> <span data-l10n-id="print_label">Print</span> - </button> + </button> <button id="download" style="display:none;" class="toolbarButton download hiddenMediumView" title="Download" tabindex="34" data-l10n-id="download"> <span data-l10n-id="download_label">Download</span> @@ -255,35 +285,11 @@ http://sourceforge.net/adobe/cmap/wiki/License/ <button id="secondaryToolbarToggle" style="display: none;" class="toolbarButton" title="Tools" tabindex="36" data-l10n-id="tools"> <span data-l10n-id="tools_label">Tools</span> </button> - </div> + </div> <div class="outerCenter"> <div class="innerCenter" id="toolbarViewerMiddle"> - <div class="splitToolbarButton"> - <button id="zoomOut" class="toolbarButton zoomOut" title="Zoom Out" tabindex="21" data-l10n-id="zoom_out"> - <span data-l10n-id="zoom_out_label">Zoom Out</span> - </button> - <div class="splitToolbarButtonSeparator"></div> - <button id="zoomIn" class="toolbarButton zoomIn" title="Zoom In" tabindex="22" data-l10n-id="zoom_in"> - <span data-l10n-id="zoom_in_label">Zoom In</span> - </button> - </div> - <span id="scaleSelectContainer" class="dropdownToolbarButton"> - <select id="scaleSelect" title="Zoom" tabindex="23" data-l10n-id="zoom"> - <option id="pageAutoOption" title="" value="auto" selected="selected" data-l10n-id="page_scale_auto">Automatic Zoom</option> - <option id="pageActualOption" title="" value="page-actual" data-l10n-id="page_scale_actual">Actual Size</option> - <option id="pageFitOption" title="" value="page-fit" data-l10n-id="page_scale_fit">Fit Page</option> - <option id="pageWidthOption" title="" value="page-width" data-l10n-id="page_scale_width">Full Width</option> - <option id="customScaleOption" title="" value="custom"></option> - <option title="" value="0.5" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 50 }'>50%</option> - <option title="" value="0.75" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 75 }'>75%</option> - <option title="" value="1" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 100 }'>100%</option> - <option title="" value="1.25" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 125 }'>125%</option> - <option title="" value="1.5" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 150 }'>150%</option> - <option title="" value="2" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 200 }'>200%</option> - <option title="" value="3" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 300 }'>300%</option> - <option title="" value="4" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 400 }'>400%</option> - </select> - </span> + + </div> </div> </div> diff --git a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.js b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.js index af4fcd8d..7abe3a52 100644 --- a/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.js +++ b/pdf-as-web/src/main/webapp/assets/js/pdf.js/web/viewer.js @@ -3182,8 +3182,8 @@ var PDFPageView = (function PDFPageViewClosure() { cssTransform: function PDFPageView_transform(canvas, redrawAnnotations) { // Scale canvas, canvas wrapper, and page container. - var width = this.viewport.width; - var height = this.viewport.height; + var width = this.viewport.width / 50; + var height = this.viewport.height / 50; var div = this.div; canvas.style.width = canvas.parentNode.style.width = div.style.width = Math.floor(width) + 'px'; diff --git a/pdf-as-web/src/main/webapp/index.jsp b/pdf-as-web/src/main/webapp/index.jsp index 05bf379c..2272662e 100644 --- a/pdf-as-web/src/main/webapp/index.jsp +++ b/pdf-as-web/src/main/webapp/index.jsp @@ -107,12 +107,13 @@ </div> --> - <!-- Header --> <div class="container"> + <!-- Header --> +<div class="center"> <div class="center" id="navBar"> <ul class="nav nav-wizard"> <li class="active" id="UploadStepButton"><a href="#"><span class="glyphicon glyphicon-open-file" aria-hidden="true"></span><span id="uploadNavText"> Upload</span></a></li> - <li id="PlaceStepButton" style="pointer-events:none;"><a href="#"><span class="glyphicon glyphicon-screenshot" aria-hidden="true"></span><span id="placeNavText" style="display:none;"> Place</span></a></li> + <li id="PlaceStepButton" style="pointer-events:none;"><a href="#"><span class="glyphicon glyphicon-move" aria-hidden="true"></span><span id="placeNavText" style="display:none;"> Place</span></a></li> <li id="SignStepButton" style="pointer-events:none;"><a href="#"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span><span id="signNavText" style="display:none;"> Sign</span></a></li> <li id="FinishStepButton" style="pointer-events:none;"><a href="#"><span class="glyphicon glyphicon-save-file" aria-hidden="true"></span><span id="downloadNavText" style="display:none;"> Download</span></a></li> </ul> @@ -125,7 +126,7 @@ <div class="col-md-12"> - <div id="DropContainer" class="container"> + <div id="DropContainer"> <h3 class="center">Upload your Document</h3> <div class="center"> <div id="borderBox" class="center"> @@ -157,72 +158,81 @@ </div> </div> - <div id="ViewContainer" class="container" style="display: none;"> - <h3 class="center">Place your Signature<small></h3> - <h6 class="center">(If no Signature is placed, one will be appended at the end of the Document)</h6> - <div class="pull-right"> - <button id="placeContinue" class="btn btn-lg btn-primary">Continue</button> - </div> + <div id="ViewContainer" style="display: none;"> + <h3 class="center">Place your Signature</h3> + <h6 class="center" id="noSignatureWarning">(If no Signature is placed, one will be appended at the end of the Document)</h6> + <div class="center"> + <div id="ViewerExternToolbar" class="center"> + <div id="placeSignatureExtern"> + <span class="glyphicon glyphicon-pencil"></span><!--<img src="assets/img/federohne.svg" title="Place Signature on current Page"> --><caption>Add</caption> + </div> + <div id="delSignatureExtern"> + <span class="glyphicon glyphicon-ban-circle"></span><!-- <img src="assets/img/federohne.svg" title="Remove Signature from current Page"> --><caption>Remove</caption> + </div> + <div id="placeContinue"> + <span class="glyphicon glyphicon-ok"></span><!-- <img src="assets/img/federohne.svg" title="Continue"> --><caption>Continue</caption> + </div> + </div> + </div> <div id="content" class="center"> Loading your PDF, please wait... </div> </div> - <div id="SignContainer" class="container" style="display: none;"> + <div id="SignContainer" style="display: none;"> <h3 class="center">Choose your Sign Method</h3> <fieldset> - <table> + <div class="center"> + <div id="methodContainer" class="row center"> <% if (WebConfiguration.getHandyBKUURL() != null) { %> - <tr> - <td><input type="radio" id="mobileBKU" name="connector" value="mobilebku" checked></td> - <td><label for="mobileBKU">Handy</td> - <td><label for="mobileBKU"><img src="assets/img/mobileBKU.png" alt="Sign via mobile BKU"/></td> - - </tr> + + <div class="methodChooseContainer"> + <div id="ImageBox"><img src="assets/img/mobileBKU.png" alt="Sign via mobile BKU"/></div> + <div><button class="btn btn-primary">Mobile<br>Phone</button></div> + <div style="display:none;"><input type="radio" id="mobileBKU" name="connector" value="mobilebku" checked></div> + </div> <% } %> <% if (WebConfiguration.getLocalBKUURL() != null) { %> - <tr> - <td><input type="radio" id="localBKU" name="connector" value="bku"></td> - <td><label for="localBKU">Lokale BKU</label></td> - <td><label for="localBKU"><img src="assets/img/onlineBKU.png" alt="Sign via local BKU" /></label></td> - - </tr> + <div class="methodChooseContainer"> + <div id="ImageBox"><img class="BKUImage" src="assets/img/onlineBKU.png" alt="Sign via local BKU" /></div> + <div><button class="btn btn-primary">Lokale<br>BKU</button></div> + <div style="display:none;"><input type="radio" id="localBKU" name="connector" value="bku"></div> + </div> <% } %> <% if (WebConfiguration.getOnlineBKUURL() != null) { %> - <tr> - <td><input type="radio" id="onlineBKU" name="connector" value="onlinebku"></td> - <td><label for="onlineBKU">Online BKU</label></td> - <td><label for="onlineBKU"><img src="assets/img/onlineBKU.png" alt="Sign via online BKU"/></label></td> - - </tr> + <div class="methodChooseContainer"> + <div id="ImageBox"><img class="BKUImage" src="assets/img/onlineBKU.png" alt="Sign via online BKU"/></div> + <div><button class="btn btn-primary">Online<br>BKU</button></div> + <div style="display:none;"><input type="radio" id="onlineBKU" name="connector" value="onlinebku"></div> + </div> <% } %> - <% + <!--<% if(WebConfiguration.getKeystoreDefaultEnabled()) { %> - <tr> - <td><input type="radio" id="jks" name="connector" value="jks"></td> - <td><label for="jks">Server Keystore</label></td> - <td><label for="jks"><img src="assets/img/onlineBKU.png" alt="Sign via Server Keystore"/></label></td> - </tr> + <div id="ImageBox"><img class="BKUImage" src="assets/img/onlineBKU.png" alt="Sign via Server Keystore"/></div> + <div><button class="btn btn-primary">Server<br>Keystore</button></div> + <div style="display:none;"><input type="radio" id="jks" name="connector" value="jks"></div> + </div> --> <% } - %> - </table> + %> + </div> + </div> </fieldset> </div> - <div id="DownloadContainer" class="container" style="display: none;"> + <div id="DownloadContainer" style="display: none;"> <h3 class="center">Download your Document</h3> <div id="btnSign"> @@ -233,6 +243,8 @@ </div> </div> + +</div> |
