Yury Delendik
13 years ago
15 changed files with 450 additions and 30 deletions
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 10 KiB |
@ -0,0 +1,282 @@ |
|||||||
|
/* Copyright 2012 Mozilla Foundation |
||||||
|
* |
||||||
|
* Licensed under the Apache License, Version 2.0 (the "License"); |
||||||
|
* you may not use this file except in compliance with the License. |
||||||
|
* You may obtain a copy of the License at |
||||||
|
* |
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0 |
||||||
|
* |
||||||
|
* Unless required by applicable law or agreed to in writing, software |
||||||
|
* distributed under the License is distributed on an "AS IS" BASIS, |
||||||
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||||
|
* See the License for the specific language governing permissions and |
||||||
|
* limitations under the License. |
||||||
|
*/ |
||||||
|
|
||||||
|
* { -moz-box-sizing: border-box; } |
||||||
|
|
||||||
|
* { |
||||||
|
padding: 0; |
||||||
|
margin: 0; |
||||||
|
} |
||||||
|
|
||||||
|
html { |
||||||
|
height: 100%; |
||||||
|
width: 100%; |
||||||
|
overflow: hidden; |
||||||
|
font-size: 10px; |
||||||
|
} |
||||||
|
|
||||||
|
body { |
||||||
|
background: url(images/document_bg.png); |
||||||
|
color: #fff; |
||||||
|
font-family: "MozTT", sans-serif; |
||||||
|
font-size: 10px; |
||||||
|
height: 100%; |
||||||
|
width: 100%; |
||||||
|
overflow: hidden; |
||||||
|
padding-bottom: 50px; |
||||||
|
} |
||||||
|
|
||||||
|
section { |
||||||
|
overflow: hidden; |
||||||
|
font-size: 10px; |
||||||
|
position: absolute; |
||||||
|
top: 0px; |
||||||
|
left: 0px; |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
overflow: hidden; |
||||||
|
font-size: 20px; |
||||||
|
} |
||||||
|
|
||||||
|
footer { |
||||||
|
background-image: url(images/toolbar_background.png); |
||||||
|
height: 40px; |
||||||
|
position: absolute; |
||||||
|
bottom: 0; |
||||||
|
left: 0; |
||||||
|
right: 0; |
||||||
|
z-index: 1; |
||||||
|
box-shadow: 0px -2px 5px rgba(50, 50, 50, 0.75); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.toolbarButton { |
||||||
|
display: block; |
||||||
|
padding: 0; |
||||||
|
margin: 0; |
||||||
|
border-width: 0; |
||||||
|
background-position: center center; |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-color: transparent; |
||||||
|
} |
||||||
|
|
||||||
|
.toolbarButton.pageUp { |
||||||
|
position: absolute; |
||||||
|
width: 18%; |
||||||
|
height: 100%; |
||||||
|
left: 0; |
||||||
|
background-image: url(images/icon_previous_page.png); |
||||||
|
} |
||||||
|
|
||||||
|
.toolbarButton.pageDown { |
||||||
|
position: absolute; |
||||||
|
width: 18%; |
||||||
|
height: 100%; |
||||||
|
left: 18%; |
||||||
|
background-image: url(images/icon_next_page.png); |
||||||
|
} |
||||||
|
|
||||||
|
#pageNumber { |
||||||
|
position: absolute; |
||||||
|
width: 28%; |
||||||
|
height: 100%; |
||||||
|
left: 36%; |
||||||
|
text-align: center; |
||||||
|
border: 0; |
||||||
|
background-color: transparent; |
||||||
|
font-size: 9pt; |
||||||
|
color: #FFF; |
||||||
|
background-image: url(images/div_line_left.png), url(images/div_line_right.png); |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-position: left, right; |
||||||
|
} |
||||||
|
|
||||||
|
.toolbarButton.zoomOut { |
||||||
|
position: absolute; |
||||||
|
width: 18%; |
||||||
|
height: 100%; |
||||||
|
left: 64%; |
||||||
|
background-image: url(images/icon_zoom_out.png); |
||||||
|
} |
||||||
|
|
||||||
|
.toolbarButton.zoomIn { |
||||||
|
position: absolute; |
||||||
|
width: 18%; |
||||||
|
height: 100%; |
||||||
|
left: 82%; |
||||||
|
background-image: url(images/icon_zoom_in.png); |
||||||
|
} |
||||||
|
|
||||||
|
.toolbarButton[disabled] { |
||||||
|
opacity: .3; |
||||||
|
} |
||||||
|
|
||||||
|
.hidden { |
||||||
|
display: none; |
||||||
|
} |
||||||
|
[hidden] { |
||||||
|
display: none !important; |
||||||
|
} |
||||||
|
|
||||||
|
#viewerContainer { |
||||||
|
position: absolute; |
||||||
|
overflow: auto; |
||||||
|
width: 100%; |
||||||
|
top: 50px; |
||||||
|
bottom: 40px; |
||||||
|
left: 0; |
||||||
|
right: 0; |
||||||
|
} |
||||||
|
|
||||||
|
canvas { |
||||||
|
margin: auto; |
||||||
|
display: block; |
||||||
|
} |
||||||
|
|
||||||
|
.page { |
||||||
|
direction: ltr; |
||||||
|
width: 816px; |
||||||
|
height: 1056px; |
||||||
|
margin: 10px auto; |
||||||
|
position: relative; |
||||||
|
overflow: hidden; |
||||||
|
background-color: white; |
||||||
|
} |
||||||
|
|
||||||
|
.page > a { |
||||||
|
display: block; |
||||||
|
position: absolute; |
||||||
|
} |
||||||
|
|
||||||
|
.loadingIcon { |
||||||
|
width: 2.9rem; |
||||||
|
height: 2.9rem; |
||||||
|
background: url("images/spinner.png") no-repeat scroll left top transparent; |
||||||
|
border: medium none; |
||||||
|
animation: 1s steps(10, end) 0s normal none infinite moveDefault; |
||||||
|
display: block; |
||||||
|
position: absolute; |
||||||
|
top: calc((100% - 2.9rem) / 2); |
||||||
|
left: calc((100% - 2.9rem) / 2); |
||||||
|
} |
||||||
|
|
||||||
|
@keyframes moveDefault { |
||||||
|
from { |
||||||
|
background-position: 0 top; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
background-position: -390px top; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
#loadingBox { |
||||||
|
position: absolute; |
||||||
|
top: 50%; |
||||||
|
margin-top: -25px; |
||||||
|
left: 0; |
||||||
|
right: 0; |
||||||
|
text-align: center; |
||||||
|
color: #ddd; |
||||||
|
font-size: 14px; |
||||||
|
} |
||||||
|
|
||||||
|
#loadingBar { |
||||||
|
display: inline-block; |
||||||
|
clear: both; |
||||||
|
margin: 0px; |
||||||
|
margin-top: 5px; |
||||||
|
line-height: 0; |
||||||
|
border-radius: 2px; |
||||||
|
width: 200px; |
||||||
|
height: 25px; |
||||||
|
|
||||||
|
background-color: hsla(0,0%,0%,.3); |
||||||
|
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0)); |
||||||
|
background-image: -webkit-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0)); |
||||||
|
border: 1px solid #000; |
||||||
|
box-shadow: 0 1px 1px hsla(0,0%,0%,.1) inset, |
||||||
|
0 0 1px hsla(0,0%,0%,.2) inset, |
||||||
|
0 0 1px 1px rgba(255, 255, 255, 0.1); |
||||||
|
} |
||||||
|
|
||||||
|
#loadingBar .progress { |
||||||
|
display: inline-block; |
||||||
|
float: left; |
||||||
|
|
||||||
|
background: #666; |
||||||
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2b2b2), color-stop(100%,#898989)); |
||||||
|
background: -webkit-linear-gradient(top, #b2b2b2 0%,#898989 100%); |
||||||
|
background: -moz-linear-gradient(top, #b2b2b2 0%,#898989 100%); |
||||||
|
background: -ms-linear-gradient(top, #b2b2b2 0%,#898989 100%); |
||||||
|
background: -o-linear-gradient(top, #b2b2b2 0%,#898989 100%); |
||||||
|
background: linear-gradient(top, #b2b2b2 0%,#898989 100%); |
||||||
|
|
||||||
|
border-top-left-radius: 2px; |
||||||
|
border-bottom-left-radius: 2px; |
||||||
|
|
||||||
|
width: 0%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
|
||||||
|
#loadingBar .progress.full { |
||||||
|
border-top-right-radius: 2px; |
||||||
|
border-bottom-right-radius: 2px; |
||||||
|
} |
||||||
|
|
||||||
|
#loadingBar .progress.indeterminate { |
||||||
|
width: 100%; |
||||||
|
height: 25px; |
||||||
|
background-image: -moz-linear-gradient( 30deg, #404040, #404040 15%, #898989, #404040 85%, #404040); |
||||||
|
background-image: -webkit-linear-gradient( 30deg, #404040, #404040 15%, #898989, #404040 85%, #404040); |
||||||
|
background-image: -ms-linear-gradient( 30deg, #404040, #404040 15%, #898989, #404040 85%, #404040); |
||||||
|
background-image: -o-linear-gradient( 30deg, #404040, #404040 15%, #898989, #404040 85%, #404040); |
||||||
|
background-size: 75px 25px; |
||||||
|
-moz-animation: progressIndeterminate 1s linear infinite; |
||||||
|
-webkit-animation: progressIndeterminate 1s linear infinite; |
||||||
|
} |
||||||
|
|
||||||
|
@-moz-keyframes progressIndeterminate { |
||||||
|
from { background-position: 0px 0px; } |
||||||
|
to { background-position: 75px 0px; } |
||||||
|
} |
||||||
|
|
||||||
|
#errorWrapper { |
||||||
|
background: none repeat scroll 0 0 #FF5555; |
||||||
|
color: white; |
||||||
|
left: 0; |
||||||
|
position: absolute; |
||||||
|
right: 0; |
||||||
|
top: 32px; |
||||||
|
z-index: 1000; |
||||||
|
padding: 3px; |
||||||
|
font-size: 0.8em; |
||||||
|
} |
||||||
|
|
||||||
|
#errorMessageLeft { |
||||||
|
float: left; |
||||||
|
} |
||||||
|
|
||||||
|
#errorMessageRight { |
||||||
|
float: right; |
||||||
|
} |
||||||
|
|
||||||
|
#errorMoreInfo { |
||||||
|
background-color: #FFFFFF; |
||||||
|
color: black; |
||||||
|
padding: 3px; |
||||||
|
margin: 3px; |
||||||
|
width: 98%; |
||||||
|
} |
||||||
@ -0,0 +1,162 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<!-- |
||||||
|
Copyright 2012 Mozilla Foundation |
||||||
|
|
||||||
|
Licensed under the Apache License, Version 2.0 (the "License"); |
||||||
|
you may not use this file except in compliance with the License. |
||||||
|
You may obtain a copy of the License at |
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0 |
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing, software |
||||||
|
distributed under the License is distributed on an "AS IS" BASIS, |
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||||
|
See the License for the specific language governing permissions and |
||||||
|
limitations under the License. |
||||||
|
--> |
||||||
|
<html dir="ltr"> |
||||||
|
<head> |
||||||
|
<meta charset="utf-8"> |
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> |
||||||
|
<title>PDF.js viewer</title> |
||||||
|
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="viewer.css"/> |
||||||
|
<link rel="resource" type="application/l10n" href="locale.properties"/> |
||||||
|
<link rel="stylesheet" href="/shared/style/headers.css" type="text/css" /> |
||||||
|
<link rel="stylesheet" href="viewer-b2g.css" type="text/css" /> |
||||||
|
<script type="text/javascript" src="l10n.js"></script> |
||||||
|
<script type="text/javascript" src="../build/pdf.js"></script> |
||||||
|
<script type="text/javascript" src="/shared/js/async_storage.js"></script> |
||||||
|
<script type="text/javascript"> |
||||||
|
// This specifies the location of the pdf.js file. |
||||||
|
PDFJS.workerSrc = "../build/pdf.js"; |
||||||
|
PDFJS.disableTextLayer = true; |
||||||
|
</script> |
||||||
|
|
||||||
|
<script type="text/javascript" src="viewer.js"></script> |
||||||
|
</head> |
||||||
|
|
||||||
|
|
||||||
|
<body> |
||||||
|
<section role="region" id="activityHeader" class="skin-organic"> |
||||||
|
<header> |
||||||
|
<button id="activityClose"><span class="icon icon-close"></span></button> |
||||||
|
<h1 id="activityTitle"></h1> |
||||||
|
</header> |
||||||
|
|
||||||
|
<footer id="open-toolbar"> |
||||||
|
<button class="toolbarButton pageUp" title="Previous Page" id="previous" data-l10n-id="previous"></button> |
||||||
|
<button class="toolbarButton pageDown" title="Next Page" id="next" data-l10n-id="next"></button> |
||||||
|
|
||||||
|
<input type="number" id="pageNumber" class="toolbarField pageNumber" value="1" size="4" min="1"> |
||||||
|
|
||||||
|
<button class="toolbarButton zoomOut" title="Zoom Out" data-l10n-id="zoom_out"></button> |
||||||
|
<button class="toolbarButton zoomIn" title="Zoom In" data-l10n-id="zoom_in"></button> |
||||||
|
</footer> |
||||||
|
</section> |
||||||
|
|
||||||
|
<div id="viewerContainer"> |
||||||
|
<div id="viewer"></div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div id="loadingBox"> |
||||||
|
<div id="loading"></div> |
||||||
|
<div id="loadingBar"><div class="progress"></div></div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div id="errorWrapper" hidden='true'> |
||||||
|
<div id="errorMessageLeft"> |
||||||
|
<span id="errorMessage"></span> |
||||||
|
<button id="errorShowMore" onclick="" oncontextmenu="return false;" data-l10n-id="error_more_info"> |
||||||
|
More Information |
||||||
|
</button> |
||||||
|
<button id="errorShowLess" onclick="" oncontextmenu="return false;" data-l10n-id="error_less_info" hidden='true'> |
||||||
|
Less Information |
||||||
|
</button> |
||||||
|
</div> |
||||||
|
<div id="errorMessageRight"> |
||||||
|
<button id="errorClose" oncontextmenu="return false;" data-l10n-id="error_close"> |
||||||
|
Close |
||||||
|
</button> |
||||||
|
</div> |
||||||
|
<div class="clearBoth"></div> |
||||||
|
<textarea id="errorMoreInfo" hidden='true' readonly="readonly"></textarea> |
||||||
|
</div> |
||||||
|
|
||||||
|
<!-- BEGIN STUBS --> |
||||||
|
<!-- |
||||||
|
Nothing below here is visible, the elements are just here |
||||||
|
to prevent the viewer from breaking until we refactor it. |
||||||
|
--> |
||||||
|
<div id="stubs" style="display: none;"> |
||||||
|
<div id="outerContainer"></div> |
||||||
|
<div id="sidebarContainer"> |
||||||
|
<div id="toolbarSidebar"> |
||||||
|
<button id="viewThumbnail"></button> |
||||||
|
<button id="viewOutline"></button> |
||||||
|
</div> |
||||||
|
<div id="sidebarContent"> |
||||||
|
<div id="thumbnailView"></div> |
||||||
|
<div id="outlineView"></div> |
||||||
|
</div> |
||||||
|
</div> <!-- sidebarContainer --> |
||||||
|
|
||||||
|
<div id="mainContainer"> |
||||||
|
<div id="findbar"> |
||||||
|
<input id="findInput"> |
||||||
|
<button id="findPrevious"></button> |
||||||
|
<button id="findNext"></button> |
||||||
|
<input type="checkbox" id="findHighlightAll"> |
||||||
|
<input type="checkbox" id="findMatchCase"> |
||||||
|
<span id="findMsg"></span> |
||||||
|
</div> |
||||||
|
<div id="toolbarContainer"> |
||||||
|
<div id="toolbarViewer"> |
||||||
|
<div id="toolbarViewerLeft"> |
||||||
|
<button id="sidebarToggle"></button> |
||||||
|
<button id="viewFind"></button> |
||||||
|
<span id="numPages"></span> |
||||||
|
</div> |
||||||
|
<div id="toolbarViewerRight"> |
||||||
|
<input id="fileInput" type="file" /> |
||||||
|
<button id="fullscreen"></button> |
||||||
|
<button id="openFile"></button> |
||||||
|
<button id="print"></button> |
||||||
|
<button id="download"></button> |
||||||
|
<!-- <div class="toolbarButtonSpacer"></div> --> |
||||||
|
<a href="#" id="viewBookmark"></a> |
||||||
|
</div> |
||||||
|
<div id="toolbarViewerMiddle"> |
||||||
|
<span id="scaleSelectContainer"> |
||||||
|
<select id="scaleSelect"> |
||||||
|
<option id="pageAutoOption" value="auto" selected="selected">Automatic Zoom</option> |
||||||
|
<option id="pageActualOption" value="page-actual">Actual Size</option> |
||||||
|
<option id="pageFitOption" value="page-fit">Fit Page</option> |
||||||
|
<option id="pageWidthOption" value="page-width">Full Width</option> |
||||||
|
<option id="customScaleOption" value="custom"></option> |
||||||
|
<option value="0.5">50%</option> |
||||||
|
<option value="0.75">75%</option> |
||||||
|
<option value="1">100%</option> |
||||||
|
<option value="1.25">125%</option> |
||||||
|
<option value="1.5">150%</option> |
||||||
|
<option value="2">200%</option> |
||||||
|
</select> |
||||||
|
</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<menu type="context" id="viewerContextMenu"> |
||||||
|
<menuitem id="first_page"></menuitem> |
||||||
|
<menuitem id="last_page"></menuitem> |
||||||
|
<menuitem id="page_rotate_ccw"></menuitem> |
||||||
|
<menuitem id="page_rotate_cw"></menuitem> |
||||||
|
</menu> |
||||||
|
|
||||||
|
</div> <!-- mainContainer --> |
||||||
|
<div id="printContainer"></div> |
||||||
|
</div> |
||||||
|
<!-- END STUBS --> |
||||||
|
</body> |
||||||
|
</html> |
||||||
|
|
||||||
@ -1,8 +0,0 @@ |
|||||||
html { |
|
||||||
/* Font size is needed to make the activity bar the corect size. */ |
|
||||||
font-size: 10px; |
|
||||||
} |
|
||||||
|
|
||||||
#outerContainer { |
|
||||||
position: relative; |
|
||||||
} |
|
||||||
@ -1,12 +0,0 @@ |
|||||||
<!-- This snippet is used in b2g, see Makefile --> |
|
||||||
<link rel="resource" type="application/l10n" href="locale.properties"/> |
|
||||||
<link rel="stylesheet" href="/shared/style/headers.css" type="text/css" /> |
|
||||||
<link rel="stylesheet" href="viewer-b2g.css" type="text/css" /> |
|
||||||
<script type="text/javascript" src="l10n.js"></script> |
|
||||||
<script type="text/javascript" src="../build/pdf.js"></script> |
|
||||||
<script type="text/javascript" src="/shared/js/async_storage.js"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// This specifies the location of the pdf.js file. |
|
||||||
PDFJS.workerSrc = "../build/pdf.js"; |
|
||||||
PDFJS.disableTextLayer = true; |
|
||||||
</script> |
|
||||||
Loading…
Reference in new issue