diff options
Diffstat (limited to 'reader.html')
| -rwxr-xr-x | reader.html | 20 |
1 files changed, 8 insertions, 12 deletions
diff --git a/reader.html b/reader.html index 41e2409..7ff1640 100755 --- a/reader.html +++ b/reader.html @@ -1,7 +1,7 @@ <!DOCTYPE html> <html> <head> - <title>Pow! Comics Reader</title> + <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"> @@ -9,6 +9,7 @@ <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="shortcut icon" type="image/png" href="img/favicon.png"/> <link rel="icon" type="image/png" sizes="512x512" href="img/web_hi_res_512.png"/> <meta name="mobile-web-app-capable" content="yes"> @@ -73,8 +74,7 @@ <div class="form-group"> <label class="col-sm-3 control-label">Sync account:</label> <div class="col-sm-9"> - <input disabled="disabled" class="form-control" placeholder="Not set, sync disabled" - value=""> + <input type="email" class="form-control sync-account" placeholder="Not set, sync disabled" data-bind="value: syncAccount"> </div> </div> @@ -118,23 +118,19 @@ </div> <div class="container"> - <div id="loading" style="display : none"><img src="img/spinning-circles.svg"></div> - <div id="left"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span></div> <div id="right"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></div> - <div id="reader"> - <img class="left-page"> - <img style="display : none" class="right-page hidden-xs hidden-sm hidden-md hidden-portrait"> + <div id="reader" class="single-column fit-size"> + <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> - <img class="preload-left" style="display : none"> - <img class="preload-right" style="display : none"> - <div class="footer"> <div class="spacer"></div> <div class="location"> - <span class="current-page">?</span> / <span class="total-pages">?</span> (<span class="progress-percentage">?</span>) + <span data-bind="html: currentPageDisp"></span> / <span data-bind="html: totalPages"></span> + (<span data-bind="html: progressPct"></span>) </div> </div> </div> |