Fix #1115 (comic reader not working under iOS, maybe invalid issue)

Improvement for #925 (Next/Prev buttons are bigger)
pull/1117/head
Ozzieisaacs 5 years ago
parent 7098d08888
commit b586a32843

@ -152,39 +152,6 @@ body {
max-width: 70%; max-width: 70%;
} }
#left {
left: 40px;
}
#right {
right: 40px;
}
.arrow {
position: absolute;
top: 50%;
margin-top: -32px;
font-size: 64px;
color: #E2E2E2;
font-family: arial, sans-serif;
font-weight: bold;
cursor: pointer;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.arrow:hover {
color: #777;
}
.arrow:active,
.arrow.active {
color: #000;
}
th, td { th, td {
padding: 5px; padding: 5px;
} }

@ -65,28 +65,6 @@
right: 40px; right: 40px;
} }
.arrow {
position: absolute;
top: 50%;
margin-top: -32px;
font-size: 64px;
color: #E2E2E2;
font-family: arial, sans-serif;
font-weight: bold;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.arrow:hover {
color: #777;
}
.arrow:active {
color: #000;
}
xmp, xmp,
pre, pre,
plaintext { plaintext {
@ -111,4 +89,4 @@
-moz-column-gap: 20px; -moz-column-gap: 20px;
-webkit-column-gap: 20px; -webkit-column-gap: 20px;
position: relative; position: relative;
} }

@ -15,16 +15,10 @@ body {
} }
#main { #main {
/* height: 500px; */
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
right: 0; right: 0;
/* left: 40px; */
/* -webkit-transform: translate(40px, 0);
-moz-transform: translate(40px, 0); */
/* border-radius: 5px 0px 0px 5px; */
border-radius: 5px; border-radius: 5px;
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
@ -114,18 +108,20 @@ body {
border: none; border: none;
} }
#prev { #left,#prev {
left: 40px; left: 40px;
padding-right:80px;
} }
#next { #right,#next {
right: 40px; right: 40px;
padding-left:80px;
} }
.arrow { .arrow {
position: absolute; position: absolute;
top: 50%; top: 50%;
margin-top: -32px; margin-top: -192px;
font-size: 64px; font-size: 64px;
color: #E2E2E2; color: #E2E2E2;
font-family: arial, sans-serif; font-family: arial, sans-serif;
@ -136,6 +132,8 @@ body {
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
user-select: none; user-select: none;
padding-top: 160px;
padding-bottom: 160px;
} }
.arrow:hover { .arrow:hover {
@ -753,9 +751,9 @@ input:-ms-placeholder {
} }
}*/ }*/
@media only screen @media only screen
and (min-device-width : 768px) and (min-device-width : 768px)
and (max-device-width : 1024px) and (max-device-width : 1024px)
and (orientation : landscape) and (orientation : landscape)
/*and (-webkit-min-device-pixel-ratio: 2)*/ { /*and (-webkit-min-device-pixel-ratio: 2)*/ {
#viewer{ #viewer{

@ -9,10 +9,18 @@
/** /**
* CRC Implementation. * CRC Implementation.
*/ */
/* global Uint8Array, Uint32Array, bitjs, DataView */ /* global Uint8Array, Uint32Array, bitjs, DataView, mem */
/* exported MAXWINMASK, UnpackFilter */ /* exported MAXWINMASK, UnpackFilter */
var CRCTab = new Array(256).fill(0); function emptyArr(n, v) {
var arr = [];
for (var i = 0; i < n; i += 1) {
arr[i] = v;
}
return arr;
}
var CRCTab = emptyArr(256, 0);
function initCRC() { function initCRC() {
for (var i = 0; i < 256; ++i) { for (var i = 0; i < 256; ++i) {

@ -1,12 +1,14 @@
/* global $, calibre, EPUBJS, ePubReader */ /* global $, calibre, EPUBJS, ePubReader */
var reader;
(function() { (function() {
"use strict"; "use strict";
EPUBJS.filePath = calibre.filePath; EPUBJS.filePath = calibre.filePath;
EPUBJS.cssPath = calibre.cssPath; EPUBJS.cssPath = calibre.cssPath;
var reader = ePubReader(calibre.bookUrl, { reader = ePubReader(calibre.bookUrl, {
restore: true, restore: true,
bookmarks: calibre.bookmark ? [calibre.bookmark] : [] bookmarks: calibre.bookmark ? [calibre.bookmark] : []
}); });

@ -7,7 +7,7 @@
<meta name="description" content=""> <meta name="description" content="">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}" type="text/css"/>
<!-- EPUBJS Renderer --> <!-- EPUBJS Renderer -->
<!--<script src="../build/epub.js"></script>--> <!--<script src="../build/epub.js"></script>-->
@ -16,10 +16,10 @@
<style type="text/css"> <style type="text/css">
body { body {
overflow: hidden; background: white;
} }
#main { #readmain {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -36,35 +36,6 @@
border: none; border: none;
} }
#prev {
left: 40px;
}
#next {
right: 40px;
}
.arrow {
position: absolute;
top: 50%;
margin-top: -32px;
font-size: 64px;
color: #E2E2E2;
font-family: arial, sans-serif;
font-weight: bold;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.arrow:hover {
color: #777;
}
.arrow:active {
color: #000;
}
xmp, pre, plaintext { xmp, pre, plaintext {
display: block; display: block;
font-family: -moz-fixed; font-family: -moz-fixed;
@ -90,16 +61,13 @@
<script> <script>
"use strict"; "use strict";
//var Book = ePub("https://s3.amazonaws.com/moby-dick/");
</script> </script>
</head> </head>
<body> <body>
<div id="main"> <div id="readmain">
<div id="prev" class="arrow" ></div> <div id="left" class="arrow" ></div>
<div id="area"><pre id="content" class="content"></pre></div> <div id="area"><pre id="content" class="content"></pre></div>
<div id="next" class="arrow"></div> <div id="right" class="arrow"></div>
</div> </div>
<script> <script>
@ -123,10 +91,10 @@
} }
}); });
//click //click
$( "#prev" ).click(function() { $( "#left" ).click(function() {
prevPage(); prevPage();
}); });
$( "#next" ).click(function() { $( "#right" ).click(function() {
nextPage(); nextPage();
}); });
//bind mouse //bind mouse
@ -156,6 +124,7 @@
function nextPage(){ function nextPage(){
leftoff = $("#content").offset().left; leftoff = $("#content").offset().left;
leftoff = leftoff-origwidth-gap; leftoff = leftoff-origwidth-gap;
if ( leftoff + $("#content")[0].scrollWidth < 0) { return;}
$("#content").offset({left:leftoff}); $("#content").offset({left:leftoff});
} }
}); });

Loading…
Cancel
Save