shares.html 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Share Manager</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1" >
  7. <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  8. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" />
  9. <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js"></script>
  10. <style>
  11. body{
  12. background-color: rgb(243, 243, 243);
  13. }
  14. </style>
  15. </head>
  16. <body>
  17. <br>
  18. <div class="ui container">
  19. <div class="ui segment">
  20. <h3 class="ui header">
  21. <img src="img/opr/share.svg">
  22. <div class="content">
  23. Shares Manager
  24. <div class="sub header">All the shared files on the SD card</div>
  25. </div>
  26. </h3>
  27. <table class="ui celled striped table">
  28. <thead>
  29. <tr><th colspan="4">
  30. List of shares on this WebStick
  31. </th>
  32. </tr>
  33. </thead>
  34. <tbody id="sharesListTable">
  35. <tr>
  36. <td colspan="4">
  37. <i class="ui loading spinner icon"></i> Loading
  38. </td>
  39. </tr>
  40. </tbody>
  41. </table>
  42. <button onclick="initShareList();" class="ui basic button"><i class="ui green refresh icon"></i>Refresh List</button>
  43. <div class="ui divider"></div>
  44. <b>Share Entry Cleaning</b>
  45. <p>Some share links might point to files that no longer exists on the SD card. <br>
  46. Click the "Clean Shares" button below to remove broken share links and regenerate the shared link table.</p>
  47. <button onclick="runShareCleaning();" class="ui basic button"><i class="ui green recycle icon"></i>Clean Shares</button>
  48. </div>
  49. </div>
  50. <script>
  51. function initShareList(){
  52. $("#sharesListTable").html(`<tr>
  53. <td colspan="4">
  54. <i class="ui loading spinner icon"></i> Loading
  55. </td>
  56. </tr>`);
  57. $.get("/api/share/list", function(data){
  58. if (data.error != undefined){
  59. alert(data.error);
  60. }else{
  61. $("#sharesListTable").html("");
  62. data.forEach(share => {
  63. $("#sharesListTable").append(`<tr>
  64. <td class="collapsing">
  65. <i class="grey file outline icon"></i> ${share.filename}
  66. </td>
  67. <td><i class="yellow folder icon"></i> ${share.filepath}</td>
  68. <td>${share.shareid}</td>
  69. <td class="right aligned collapsing">
  70. <a class="ui basic icon button" href="/share?id=${share.shareid}&download" target="_blank" download="" title="Download"><i class="ui blue download icon"></i></a>
  71. <a class="ui basic icon button" href="/share?id=${share.shareid}" target="_blank" title="Open Share"><i class="ui linkify green icon"></i></a>
  72. <button class="ui basic icon button" onclick="removeShareFromList('${share.filename}', '${share.filepath}', '${share.shareid}');" title="Remove Share"><i class="ui red trash icon"></i></button>
  73. </td>
  74. </tr>`);
  75. });
  76. if (data.length == 0){
  77. $("#sharesListTable").append(`<tr>
  78. <td colspan="4">
  79. <i class="green check circle icon"></i> No shared files on this WebStick
  80. </td>
  81. </tr>`);
  82. }
  83. }
  84. });
  85. }
  86. initShareList();
  87. //Remove a share from the share list
  88. function removeShareFromList(filename, filepath, uuid){
  89. if (confirm("Confirm share for " + filename + " ?")){
  90. $.post("/api/share/del?filename=" + filepath, function(data){
  91. if (data.error != undefined){
  92. alert(data.error);
  93. }else{
  94. initShareList();
  95. }
  96. })
  97. }
  98. }
  99. function runShareCleaning(){
  100. $.get("/api/share/clean", function(data){
  101. if (data.error != undefined){
  102. alert(data.error);
  103. }else{
  104. initShareList();
  105. alert("Share cleaning completed");
  106. }
  107. })
  108. }
  109. </script>
  110. </body>
  111. </html>