index.php 6.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
  1. <?PHP
  2. include "../pcdl/html_head.php";
  3. ?>
  4. <body>
  5. <?php
  6. require_once("../pcdl/head_bar.php");
  7. ?>
  8. <style>
  9. #main_video_win iframe{
  10. width:100%;
  11. height:100%;
  12. }
  13. #main_tag span{
  14. margin: 2px;
  15. padding: 2px 12px;
  16. font-weight: 500;
  17. transition-duration: 0.2s;
  18. cursor: pointer;
  19. display: inline-flex;
  20. align-items: center;
  21. flex-wrap: nowrap;
  22. justify-content: center;
  23. font-size:110%;
  24. border: unset;
  25. border-radius: 0;
  26. border-bottom: 2px solid var(--nocolor);
  27. }
  28. #main_tag span:hover{
  29. background-color:unset;
  30. color:unset;
  31. border-color: var(--link-hover-color);
  32. }
  33. #main_tag .select{
  34. border-bottom: 2px solid var(--link-color);
  35. }
  36. tag{
  37. background-color: var(--btn-color);
  38. margin: 0 0.5em;
  39. padding: 3px 10px;
  40. border-radius: 4px;
  41. }
  42. </style>
  43. <?php
  44. //
  45. require_once "../path.php";
  46. require_once "../public/_pdo.php";
  47. require_once '../media/function.php';
  48. require_once '../public/function.php';
  49. echo "<div id='course_head_bar' style='background-color:var(--tool-bg-color1);padding:1em 10px 10px 10px;'>";
  50. echo "<div class='index_inner '>";
  51. echo "<div style='font-size:140%'>";
  52. echo "</div>";
  53. echo '<div id="main_tag" style="">';
  54. echo '<span tag="sutta">Sutta</span><span tag="vinaya">Vinaya</span><span tag="abhidhamma">Abhidhamma</span>';
  55. echo '<span tag="mula">Mula</span><span tag="atthakatha">Aṭṭhakathā</span><span tag="tika">ṭīkā</span><span tag="anna">anna</span>';
  56. echo '</div>';
  57. echo '<div id="tag_selected" class="summary" style="padding-bottom:5px;margin:0.5em 0;"></div>';
  58. echo '<div id="tag_others" class="summary" style="padding-bottom:5px;"></div>';
  59. echo "</div>";
  60. echo '</div>';
  61. ?>
  62. <div id ="book_list" class='index_inner' style='display: flex;flex-wrap: wrap;'>
  63. </div>
  64. <script>
  65. var main_tag="";
  66. var list_tag=new Array();
  67. $("span[tag]").click(function(){
  68. $(this).siblings().removeClass("select");
  69. $(this).addClass("select");
  70. main_tag = $(this).attr("tag");
  71. list_tag=new Array();
  72. tag_changed();
  73. render_tag_list();
  74. /*
  75. const tagSelected = document.getElementsByClassName("select");
  76. if(tagSelected){
  77. let tagList = new Array();
  78. for (const iterator of tagSelected) {
  79. tagList.push(iterator.getAttributeNode("tag").value);
  80. }
  81. main_tag = tagList[0];
  82. tag_changed();
  83. }
  84. */
  85. });
  86. var allTags = new Array();
  87. function tag_changed(){
  88. let strTags = "";
  89. if(list_tag.length>0){
  90. strTags = main_tag + "," + list_tag.join();
  91. }
  92. else{
  93. strTags = main_tag;
  94. }
  95. console.log(strTags);
  96. $.get("book_tag.php",
  97. {
  98. tag:strTags
  99. },
  100. function(data,status){
  101. let arrBookList = JSON.parse(data);
  102. let html="";
  103. allTags = new Array();
  104. for (const iterator of arrBookList) {
  105. html += "<div style='width:25%;padding:0.5em;'>";
  106. html += "<div class='card' style='padding:10px;'>";
  107. html += "<div style='font-weight:700'><a href='../pcdl/reader.php?view=chapter&book="+iterator[0].book+"&para="+iterator[0].para+"' target = '_blank'>"+iterator[0].title+"</a></div>";
  108. html += "<div style=''>book:"+iterator[0].book+" para:"+iterator[0].para+"</div>";
  109. html += "<div style=''>tag:"+ iterator[0].tag+"</div>";
  110. html += "</div>";
  111. html += "</div>";
  112. let tags = iterator[0].tag.split("::");
  113. let currTag = new Array();
  114. currTag[main_tag] = 1;
  115. for (const scondTag of list_tag) {
  116. currTag[scondTag] = 1;
  117. }
  118. for (let tag of tags) {
  119. if(tag.slice(0,1)==":"){
  120. tag = tag.slice(1);
  121. }
  122. if(tag.slice(-1)==":"){
  123. tag = tag.slice(0,-1);
  124. }
  125. if(!currTag.hasOwnProperty(tag)){
  126. if(allTags.hasOwnProperty(tag) ){
  127. allTags[tag] += 1;
  128. }
  129. else{
  130. allTags[tag] = 1;
  131. }
  132. }
  133. }
  134. }
  135. allTags.sort(sortNumber);
  136. tag_render_others();
  137. $("#book_list").html(html);
  138. });
  139. }
  140. $("#tag_input").keypress(function(){
  141. tag_render_others();
  142. });
  143. function tag_render_others(){
  144. let strOthersTag = "";
  145. for (const key in allTags) {
  146. if (allTags.hasOwnProperty(key)) {
  147. if($("#tag_input").val().length>0){
  148. if(key.indexOf($("#tag_input").val())>=0){
  149. strOthersTag += "<button onclick =\"tag_click('"+key+"')\" >"+key+"</button>";
  150. }
  151. }
  152. else{
  153. strOthersTag += "<button onclick =\"tag_click('"+key+"')\" >"+key+"</button>";
  154. }
  155. }
  156. }
  157. $("#tag_others").html(strOthersTag);
  158. }
  159. function tag_click(tag){
  160. list_tag.push(tag);
  161. render_tag_list();
  162. tag_changed();
  163. }
  164. function render_tag_list(){
  165. let strListTag = "已经选择:";
  166. for (const iterator of list_tag) {
  167. strListTag +="<tag>"+iterator+"<span onclick =\"tag_remove('"+iterator+"')\">X</span></tag>";
  168. }
  169. strListTag += "<div style='display:inline-block;width:20em;'><input id='tag_input' type='input' placeholder='tag' size='20' /></div>";
  170. $("#tag_selected").html(strListTag);
  171. }
  172. function tag_remove(tag){
  173. for(let i=0; i<list_tag.length;i++){
  174. if(list_tag[i]==tag){
  175. list_tag.splice(i,1);
  176. }
  177. }
  178. render_tag_list();
  179. tag_changed();
  180. }
  181. function sortNumber(a, b)
  182. {
  183. return b -a;
  184. }
  185. </script>
  186. <?php
  187. include "../pcdl/html_foot.php";
  188. ?>