sharelist.html 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. <html>
  2. <head>
  3. <title locale="title/title">Share Entry List</title>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no">
  6. <link rel="stylesheet" href="../../script/semantic/semantic.css">
  7. <script type="text/javascript" src="../../script/jquery.min.js"></script>
  8. <script type="text/javascript" src="../../script/semantic/semantic.min.js"></script>
  9. <script type="text/javascript" src="../../script/ao_module.js"></script>
  10. <script type="text/javascript" src="../../script/applocale.js"></script>
  11. <script type="text/javascript" src="../../script/clipboard.min.js"></script>
  12. <style>
  13. .backgroundIcon{
  14. position: fixed;
  15. bottom: 0px;
  16. right: 0px;
  17. opacity: 0.4;
  18. margin-right: -5em;
  19. margin-bottom: -5em;
  20. }
  21. </style>
  22. </head>
  23. <body id="filePropertiesWindow">
  24. <div class="backgroundIcon">
  25. <img class="ui medium image" src="../../img/system/share.svg">
  26. </div>
  27. <br>
  28. <div class="ui container">
  29. <h3 class="ui header">
  30. <i class="share alternate icon"></i>
  31. <div class="content">
  32. <span locale="title/title">Share Entries</span> <span id="vrootname"></span>
  33. <div class="sub header" locale="title/desc">Shared files in this drive</div>
  34. </div>
  35. </h3>
  36. <div class="ui divider"></div>
  37. <div id="succ" style="display:none;" class="ui green message">
  38. <i class="ui checkmark icon"></i> <span id="msg" locale="message/removed">Share Removed</span>
  39. </div>
  40. <div style="max-height: calc(100vh - 120px); overflow-y: auto;">
  41. <table class="ui very basic fluid celled compact table unstackable">
  42. <tbody id="shares">
  43. <tr>
  44. <td>
  45. <h4 class="ui header">
  46. <div class="content">
  47. <span locale="message/noshare/title">No Shares</span>
  48. <div locale="message/noshare/desc" class="sub header">Try select a file using File Manager and right click share</div>
  49. </div>
  50. </h4>
  51. </td>
  52. </tr>
  53. </tbody>
  54. </table>
  55. </div>
  56. <br>
  57. </div>
  58. <script>
  59. //Get fsh id from hash if exists
  60. let fshId = "";
  61. if (window.location.hash.length > 1){
  62. var fshIds = window.location.hash.substr(1);
  63. fshIds = JSON.parse(decodeURIComponent(fshIds));
  64. fshId = fshIds[0];
  65. $("#vrootname").text("(" + fshId + ")");
  66. }
  67. applocale.init("../../SystemAO/locale/sharelist.json", function(){
  68. applocale.translate();
  69. listSharedItems();
  70. });
  71. function listSharedItems(){
  72. $("#shares").html("");
  73. $.get("../../system/file_system/share/list?fsh=" + fshId, function(data){
  74. console.log(data);
  75. data.forEach(function(entry){
  76. let filename = entry.FileVirtualPath.split("/").pop();
  77. let port = window.location.port;
  78. if (window.location.port == ""){
  79. port = "";
  80. }
  81. let openShareButton = ` <a title="Open Share" href="/share/${entry.UUID}" target="_blank" class="ui icon basic button"><i class="external icon"></i></a>`;
  82. if (!entry.CanAccess){
  83. openShareButton = "";
  84. }
  85. let openButton = `<button title="Open in File Manager" path="${entry.FileVirtualPath}" isfolder="${entry.IsFolder}" onclick="openThis(this);" class="ui icon basic button"><i class="folder open icon"></i></button>`;
  86. if (!entry.CanOpenInFileManager){
  87. openButton = "";
  88. }
  89. let deleteButton = `<button title="Delete Share" uuid="${entry.UUID}" onclick="deleteShare(this);" class="ui red icon button"><i class="trash icon"></i></button>`;
  90. if (!entry.CanDelete){
  91. deleteButton = "";
  92. }
  93. $("#shares").append(`
  94. <tr>
  95. <td>
  96. <h4 class="ui header">
  97. <div class="content">
  98. <span>${filename} </span>
  99. <div class="sub header">${applocale.getString("item/creator", "Creator: ")} ${entry.Owner} / ${applocale.getString("item/perm", "Permission: ")} ${entry.Permission} / <span class="linkCopier" style="cursor:pointer; color: #3452eb;" title="Copy Link" data-clipboard-text="${window.location.protocol + '//' + window.location.hostname + ":" + port + "/share/" + entry.UUID}"><i class="linkify icon"></i></span>
  100. </div>
  101. </h4>
  102. </td>
  103. <td style="padding-right: 0.6em;">
  104. <div class="ui small vertical buttons">
  105. ${openShareButton}
  106. ${openButton}
  107. ${deleteButton}
  108. </div>
  109. </td>
  110. </tr>`);
  111. });
  112. var clipboard = new ClipboardJS('.linkCopier');
  113. clipboard.on('success', function(e) {
  114. //console.info('Action:', e.action);
  115. // console.info('Text:', e.text);
  116. // console.info('Trigger:', e.trigger);
  117. let originalContent = $(e.trigger).html();
  118. $(e.trigger).html(`<i class="ui green checkmark icon"></i>`);
  119. $(e.trigger).css("pointer-events", "none");
  120. setTimeout(function(){
  121. $(e.trigger).html(originalContent);
  122. $(e.trigger).css("pointer-events", "auto");
  123. }, 1500);
  124. e.clearSelection();
  125. });
  126. if (data.length == 0){
  127. $("#shares").html(`<tr>
  128. <td>
  129. <h4 class="ui header">
  130. <div class="content">
  131. <span locale="message/noshare/title">No Shares</span>
  132. <div locale="message/noshare/desc" class="sub header">Try select a file using File Manager and right click share</div>
  133. </div>
  134. </h4>
  135. </td>
  136. </tr>`);
  137. }
  138. applocale.translate();
  139. });
  140. }
  141. function openThis(object){
  142. var vpath = $(object).attr("path");
  143. var isFolder = $(object).attr("isfolder") == "true";
  144. let openingPath = vpath;
  145. if (isFolder){
  146. ao_module_openPath(vpath);
  147. }else{
  148. let c = vpath.split("/");
  149. let filename = c.pop();
  150. let folderpath = c.join("/");
  151. ao_module_openPath(folderpath, filename);
  152. }
  153. }
  154. function deleteShare(object){
  155. let deleteUUID = $(object).attr("uuid");
  156. if (confirm(applocale.getString("message/delwarning", "All collaborators will lose access to this file via File Share interface. Confirm?"))){
  157. $.ajax({
  158. url: "../../system/file_system/share/delete",
  159. method: "POST",
  160. data: {uuid: deleteUUID},
  161. success: function(data){
  162. console.log(data);
  163. listSharedItems();
  164. $("#succ").stop().finish().slideDown("fast").delay(3000).slideUp("fast");
  165. }
  166. });
  167. }
  168. }
  169. </script>
  170. </body>
  171. </html>