tab-webview-subpage-first.html 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>书吧</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
  7. <meta name="apple-mobile-web-app-capable" content="yes">
  8. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  9. <link rel="stylesheet" href="css/mui.min.css">
  10. <style>
  11. html,
  12. body {
  13. background-color: #efeff4;
  14. }
  15. </style>
  16. </head>
  17. <body>
  18. <div id="pullrefresh" class="mui-content mui-scroll-wrapper">
  19. <div class="mui-scroll" style="margin-top: 15px;">
  20. <ul id="books-id" class="mui-table-view mui-table-view-chevron">
  21. <li id="loading-id" class="mui-table-view-cell mui-media">
  22. <div style="text-align: center;margin-right: -60px;">加载中...</div>
  23. </li>
  24. </ul>
  25. </div>
  26. </div>
  27. <script id="book-temp-id" type="text/html">
  28. <!--<li class="mui-table-view-cell mui-media">-->
  29. <a data-id='{id}' data-is-dowanload='{isDownload}' download-start='false' data-html-name='{htmlName}'>
  30. <img id="img-{id}" class="mui-media-object mui-pull-left">
  31. <div class="mui-media-body">
  32. {name}
  33. <p class='mui-ellipsis'>{desc}</p>
  34. </div>
  35. </a>
  36. <!--</li>-->
  37. </script>
  38. <!--
  39. 作者:HZC
  40. 时间:2015-09-04
  41. 描述:首页书吧
  42. -->
  43. <script type="text/javascript" src="js/jquery.min.js" type="text/javascript" charset="UTF-8"></script>
  44. <script type="text/javascript" src="http://182.92.109.194:8080/rpc/helper.js" type="text/javascript" charset="UTF-8"></script>
  45. <script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
  46. <script src="js/routes.js" type="text/javascript" charset="utf-8"></script>
  47. <script src="js/app.js" type="text/javascript" charset="utf-8"></script>
  48. <script src="js/db/service.js" type="text/javascript" charset="utf-8"></script>
  49. <script src="js/hzc.rpc.js" type="text/javascript" charset="utf-8"></script>
  50. <script type="text/javascript" charset="UTF-8">
  51. mui.init({
  52. swipeBack: false,
  53. pullRefresh: {
  54. container: '#pullrefresh',
  55. up: {
  56. contentrefresh: '正在加载...',
  57. callback: pullupRefresh
  58. }
  59. }
  60. });
  61. mui.plusReady(function() {
  62. plus.screen.lockOrientation("portrait");
  63. loadBooks(1);
  64. openBook();
  65. saveBookIds();
  66. })
  67. window.count = 0;
  68. //分页查询我的book
  69. window.start = 0;
  70. /**
  71. * 上拉加载具体业务实现
  72. */
  73. function pullupRefresh() {
  74. setTimeout(function() {
  75. mui('#pullrefresh').pullRefresh().endPullupToRefresh((++window.count > 50)); //参数为true代表没有更多数据了。
  76. loadBooks(2);
  77. }, 1000);
  78. }
  79. /**
  80. * 加载图书
  81. * @param {Object} source:来源:1,初始化,2,上拉刷新
  82. */
  83. function loadBooks(source) {
  84. getMyBooks(window.start, function(data) {
  85. // console.log(data.length)
  86. toastNetworkInfo('当前网络不可用');
  87. if (data.length < 1) {
  88. mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
  89. if (source == 1) {
  90. $id('books-id').innerHTML = '<li class="mui-table-view-cell mui-media"><div style="text-align: center;margin-right: -60px;">没有相关图书</div></li>';
  91. } else {
  92. mui.toast('没有更多数据了');
  93. }
  94. return;
  95. }
  96. window.start += 5;
  97. var tempHtml = $id('book-temp-id').innerHTML;
  98. $id('loading-id').style.display = 'none';
  99. if (toastNetworkInfo('当前网络不可用')) {
  100. listDelPdfId(function(delData) {
  101. var delDataStr = delData.toString();
  102. // console.log(delDataStr)
  103. for (var i = 0; i < data.length; i++) {
  104. var book = data[i];
  105. if (delDataStr && !delDataStr.indexOf(book.id)>0) {
  106. updateBookStatus(book.id, '0',function(){});
  107. continue;
  108. }
  109. var li = document.createElement('li');
  110. li.className = 'mui-table-view-cell mui-media';
  111. li.innerHTML = render(tempHtml, book);
  112. $id('books-id').appendChild(li);
  113. book.imgPath = Routes.urls.book.bookUrl + book.imgPath;
  114. setImg('img-' + book.id, book.imgPath);
  115. }
  116. });
  117. }else{
  118. for (var i = 0; i < data.length; i++) {
  119. var book = data[i];
  120. var li = document.createElement('li');
  121. li.className = 'mui-table-view-cell mui-media';
  122. li.innerHTML = render(tempHtml, book);
  123. $id('books-id').appendChild(li);
  124. book.imgPath = Routes.urls.book.bookUrl + book.imgPath;
  125. setImg('img-' + book.id, book.imgPath);
  126. }
  127. }
  128. });
  129. }
  130. /**
  131. * 打开书
  132. */
  133. function openBook() {
  134. mui('#books-id').on('tap', 'a', function() {
  135. var self = this;
  136. var htmlName = self.getAttribute('data-html-name');
  137. var bookPath = DOWNLOADPATH + htmlName;
  138. var absoluteBookPath = convertToAbsoluteURL(bookPath);
  139. mui.openWindow({
  140. id: 'book-id',
  141. url: 'app/book.html',
  142. extras: {
  143. href: absoluteBookPath
  144. },
  145. show: {
  146. duration: 200
  147. }
  148. })
  149. });
  150. }
  151. </script>
  152. </body>
  153. </html>