blob: 29bd8e9bfb0d3120a6214eaee332e4747096e534 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
|
<!DOCTYPE html>
<html>
<head>
<title data-bind="text: documentTitle">Pow! Comics Reader</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="lib/bootstrap/v3/css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="lib/bootstrap/v3/css/bootstrap-theme.min.css" rel="stylesheet" media="screen">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="lib/bootstrap/v3/js/jquery.js"></script>
<script src="lib/bootstrap/v3/js/bootstrap.min.js"></script>
<script src="lib/localforage.min.js"></script>
<script src="lib/knockout.js"></script>
<link rel="stylesheet" type="text/css" href="reader.css"/>
<script type="text/javascript" src="reader.js"></script>
</head>
<body data-bind="css: themeName">
<div class="modal fade" id="settings-modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Options</h4>
</div>
<div class="modal-body">
<form name="settings-form" onsubmit="return false" class="form-horizontal">
<div class="form-group">
<label class="col-sm-3 control-label">Theme:</label>
<div class="col-sm-9">
<select class="theme-select form-control" data-bind="value: themeName">
<option value="default">Default</option>
<option value="dark">Dark</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">Reading:</label>
<div class="col-sm-9">
<div class="checkbox">
<label><input class="fit-to-width-cb" type="checkbox" data-bind="attr: { checked: fitToWidth }"> Fit to width</label>
</div>
<div class="checkbox">
<label title="Applies for active file"><input class="single-column-cb" type="checkbox" data-bind="attr: { checked: singleColumn }">
Single column</label>
</div>
<div class="checkbox">
<label title="Applies for active file"><input class="flip-columns-cb" type="checkbox" data-bind="attr: { checked: flipColumns }">
Mirror (manga mode)</label>
</div>
</div>
</div>
<hr/>
<div class="form-group">
<label class="col-sm-3 control-label">Sync account:</label>
<div class="col-sm-9">
<input type="email" class="form-control sync-account" placeholder="Not set, sync disabled" data-bind="value: syncAccount">
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="container">
<div id="splash" class="splash text-muted" data-bind="visible: !fileName(), html: errorMessage"></div>
<div id="loading" class="splash text-muted" data-bind="visible: isLoading()"><img src="img/spinning-circles.svg"></div>
<div id="left">
<div class="top">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
</div>
<div class="separator">
</div>
<div class="bottom">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
</div>
</div>
<div id="right">
<div class="top">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
</div>
<div class="separator">
</div>
<div class="bottom">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
</div>
</div>
<div id="reader" data-bind="css: { 'fit-width': fitToWidth, 'fit-size': fitSize, 'flip-columns': flipColumns, 'single-column': singleColumn }">
<img class="left-page" data-bind="attr: { src: getLeftPage }">
<img style="display : none" data-bind="attr: { src: getRightPage }" class="right-page hidden-xs hidden-sm hidden-md hidden-portrait">
</div>
</div>
</body>
</html>
|
