index.php 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246
  1. <?php
  2. include_once '../auth.php';
  3. if (isset($_GET['filepath'])){
  4. header("Location: embedded.php?filepath=" . $_GET['filepath'] . "&filename=" . $_GET['filename']);
  5. }
  6. ?>
  7. <html>
  8. <head>
  9. <link rel="stylesheet" href="../script/tocas/tocas.css">
  10. <script src="../script/tocas/tocas.js"></script>
  11. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  12. <script src="../script/jquery.min.js"></script>
  13. <script src="../script/ao_module.js"></script>
  14. <style>
  15. body{
  16. background-color:#0c0c0c;
  17. color:white;
  18. }
  19. .white{
  20. color:white !important;
  21. }
  22. .bottom{
  23. position:fixed;
  24. width:100%;
  25. height:35px;
  26. left:0px;
  27. bottom:0px;
  28. padding-bottom:5px;
  29. padding: 5px;
  30. }
  31. </style>
  32. </head>
  33. <?php
  34. $rid = rand(1000,9999);
  35. ?>
  36. <body>
  37. <br>
  38. </body>
  39. <script>
  40. //may need update after iPadOS update.
  41. var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);
  42. var currDisplay = "idle";
  43. var video = document.getElementById("video");
  44. var audio = new Audio("");
  45. loadScreen();
  46. var rid = $("#rid").text().trim();
  47. ao_module_setWindowSize(385,520);
  48. ao_module_setWindowTitle("RemotePlay");
  49. ao_module_setWindowIcon("feed");
  50. if (ao_module_virtualDesktop){
  51. $(".dirModeOnly").hide();
  52. }
  53. setInterval(check,1000);
  54. function check(){
  55. $.get("check.php?rid=" + rid,function(data){
  56. if (data.includes("ERROR") == false){
  57. if (data[0] == false){
  58. //Nothing is found
  59. }else{
  60. //There is content. Read it from JSON
  61. var fileinfo = data[1];
  62. console.log(fileinfo[1]);
  63. if (fileinfo[0] == "fopen"){
  64. audio.pause();
  65. audio.currentTime = 0;
  66. //open the given filepath
  67. if(fileinfo[1].indexOf(".jpg") > 0){
  68. $("body").html('<img src="' + fileinfo[1] + '" style="height: 100%;display: block;margin-left: auto;margin-right: auto;"></img');
  69. currDisplay = "image";
  70. }else if(fileinfo[1].indexOf(".mp4") > 0){
  71. $("body").html('<video autoplay loop id="video" style="height: 100%;display: block;margin-left: auto;margin-right: auto;"><source src="' + fileinfo[1] + '" type="video/mp4"></video><div class="ts snackbar"><div class="content"></div></div>');
  72. video = document.querySelector('video');
  73. var promise = video.play();
  74. if (promise !== undefined) {
  75. promise.then(_ => {
  76. }).catch(error => {
  77. video.muted = true;
  78. video.play();
  79. ts('.snackbar').snackbar({
  80. content: 'Due to browser restricton, this video has been muted.',
  81. action: '',
  82. actionEmphasis: 'negative',
  83. });
  84. });
  85. }
  86. currDisplay = "video";
  87. video = document.getElementById("video");
  88. }else{
  89. loadScreen();
  90. audio.volume = localStorage.getItem("global_volume");
  91. audio.loop = true;
  92. audio.pause();
  93. audio.currentTime = 0;
  94. audio.src = fileinfo[1];
  95. audio.play();
  96. var promise = audio.play();
  97. if (promise !== undefined) {
  98. promise.then(_ => {
  99. }).catch(error => {
  100. audio.muted = true;
  101. audio.play();
  102. ts('.snackbar').snackbar({
  103. content: 'Due to browser restricton, audio can\'t stream to this device',
  104. action: '',
  105. actionEmphasis: 'negative',
  106. });
  107. //alert("Error");
  108. });
  109. }
  110. currDisplay = "audio";
  111. }
  112. ao_module_setWindowSize(800,800);
  113. }else if (fileinfo[0] == "setVol"){
  114. localStorage.setItem("global_volume",fileinfo[1]);
  115. if(currDisplay == "audio"){
  116. audio.volume = localStorage.getItem("global_volume");
  117. }else if(currDisplay == "video"){
  118. video.volume = localStorage.getItem("global_volume");
  119. }
  120. }else if (fileinfo[0] == "volup"){
  121. if(currDisplay == "audio"){
  122. audio.volume = audio.volume + 0.1
  123. }else if(currDisplay == "video"){
  124. video.volume = video.volume + 0.1
  125. }
  126. }else if (fileinfo[0] == "voldown"){
  127. if(currDisplay == "audio"){
  128. audio.volume = audio.volume - 0.1
  129. }else if(currDisplay == "video"){
  130. video.volume = video.volume - 0.1
  131. }
  132. }else if (fileinfo[0] == "play"){
  133. if(currDisplay == "audio"){
  134. audio.play();
  135. }else if(currDisplay == "video"){
  136. video.play();
  137. }
  138. }else if (fileinfo[0] == "pause"){
  139. if(currDisplay == "audio"){
  140. audio.pause();
  141. }else if(currDisplay == "video"){
  142. video.pause();
  143. }
  144. }else if (fileinfo[0] == "fwd"){
  145. if(currDisplay == "audio"){
  146. audio.currentTime = audio.currentTime + 15;
  147. }else if(currDisplay == "video"){
  148. video.currentTime = video.currentTime + 15;
  149. }
  150. }else if (fileinfo[0] == "bwd"){
  151. if(currDisplay == "audio"){
  152. audio.currentTime = audio.currentTime - 15;
  153. }else if(currDisplay == "video"){
  154. video.currentTime = video.currentTime - 15;
  155. }
  156. }else if (fileinfo[0] == "stop"){
  157. if(currDisplay == "audio"){
  158. audio.pause();
  159. audio.currentTime = 0;
  160. }else if(currDisplay == "video"){
  161. video.pause();
  162. video.currentTime = 0;
  163. }
  164. }else if(fileinfo[0] == "reset"){
  165. loadScreen();
  166. }else if(fileinfo[0] == "newsession"){
  167. location.reload();
  168. }
  169. }
  170. /* end */
  171. }
  172. });
  173. }
  174. function loadScreen(){
  175. $("body").html(`
  176. <br><br>
  177. <div class="ts container" style="color:white;">
  178. <h3 class="ts center aligned icon header" style="color:white;">
  179. <i class="feed icon"></i>ArOZ Remote Play
  180. <div class="sub header" style="color:white;">Use this devices as a remote player or player remote!</div>
  181. <hr>
  182. </h3>
  183. <div align="center">
  184. <div class="white" style="font-size:2em;padding-top:10px;"><i class="hashtag icon"></i>Remote ID: <?php echo $rid;?></div>
  185. <p class="white" style="font-size:80%;">To use ArOZ Remote Play function, use the OpenWith from your active device and enter the above ID to play with this window.<br><!--<i class="caution sign icon"></i>Warning! Only support Audio files.</p>-->
  186. </div>
  187. <br>
  188. </div>
  189. <div class="white bottom" align="right">
  190. <div class="ts breadcrumb">
  191. <a class="white section" href="remote.php">Toggle Remote</a>
  192. <div class="divider"> / </div>
  193. <a class="white section" href="">Refresh</a>
  194. <div class="divider"> / </div>
  195. <a class="white section">Clear Sessions</a>
  196. <div class="divider dirModeOnly"> / </div>
  197. <a class="white active section dirModeOnly" href="../">Exit</a>
  198. </div>
  199. </div>
  200. <div class="ts snackbar"><div class="content"></div></div>
  201. <div id="rid" style="display:none;"><?php echo $rid;?></div>
  202. `);
  203. }
  204. </script>
  205. </html>