|
|
(21 intermediate revisions by 2 users not shown) |
Line 1: |
Line 1: |
| | {{#get_db_data: db=DATA |
| | |query=now_playing |
| | |data=video_id=video_id |
| | }} |
| <templatestyles src="Home/NowPlaying/styles.css" /> | | <templatestyles src="Home/NowPlaying/styles.css" /> |
| <div id="now-playing"> | | <div id="now-playing" style="box-shadow: 0px 0px 14px rgb(192 14 170 / 75%), inset 0 0 14px rgb(246 21 115);"> |
| <h2>Now Playing</h2> | | <h2>Now Playing</h2> |
| <ul class="videolist">
| | {{#widget:YouTube|id=tfcf5pv3VfA|}} |
| <li>{{#widget:YouTube|id=tfcf5pv3VfA}}</li>
| |
| <li>{{#widget:YouTube|id=EQ7ZgdSlQRs}}</li>
| |
| <li>{{#widget:YouTube|id=aQYTuk-_hKg}}</li>
| |
| <li>{{#widget:YouTube|id=0UMeJpjvV5k}}</li>
| |
| <li>{{#widget:YouTube|id=1p9I-No9HEo}}</li>
| |
| <li>{{#widget:YouTube|id=48mKhSfcJ60}}</li>
| |
| <li>{{#widget:YouTube|id=5_oQb7GWKTU}}</li>
| |
| <li>{{#widget:YouTube|id=5f4Xt_QYxTc}}</li>
| |
| <li>{{#widget:YouTube|id=5lmm3sSr7nY}}</li>
| |
| <li>{{#widget:YouTube|id=BSJpTMTyxUM}}</li>
| |
| <li>{{#widget:YouTube|id=DE0I-rey15k}}</li>
| |
| <li>{{#widget:YouTube|id=GXoOjRoF0nc}}</li>
| |
| <li>{{#widget:YouTube|id=G_KgZqd8b2k}}</li>
| |
| <li>{{#widget:YouTube|id=HLa1T9f0hy4}}</li>
| |
| <li>{{#widget:YouTube|id=JXbdSsjOYn8}}</li>
| |
| <li>{{#widget:YouTube|id=KAce42mgj84}}</li>
| |
| <li>{{#widget:YouTube|id=KRXUYAFdKX4}}</li>
| |
| <li>{{#widget:YouTube|id=N90Utrsfwz8}}</li>
| |
| <li>{{#widget:YouTube|id=O69bZUNgEas}}</li>
| |
| <li>{{#widget:YouTube|id=PPap3u_cWVw}}</li>
| |
| <li>{{#widget:YouTube|id=R8RTLW9SOlc}}</li>
| |
| <li>{{#widget:YouTube|id=RTNljh1RLdM}}</li>
| |
| <li>{{#widget:YouTube|id=RvgYj1dVg14}}</li>
| |
| <li>{{#widget:YouTube|id=T-sDOO4L42U}}</li>
| |
| <li>{{#widget:YouTube|id=UHppQLgcC_8}}</li>
| |
| <li>{{#widget:YouTube|id=Ura1IgHRlgg}}</li>
| |
| <li>{{#widget:YouTube|id=W_Yh2-MHATo}}</li>
| |
| <li>{{#widget:YouTube|id=W_Yh2-MHATo}}</li>
| |
| <li>{{#widget:YouTube|id=Z__E97Wo2yw}}</li>
| |
| <li>{{#widget:YouTube|id=Zc9HsPx0rN8}}</li>
| |
| <li>{{#widget:YouTube|id=Zc9HsPx0rN8}}</li>
| |
| <li>{{#widget:YouTube|id=Zw7PEVEBuwY}}</li>
| |
| <li>{{#widget:YouTube|id=_LWj3TSbDRo}}</li>
| |
| <li>{{#widget:YouTube|id=_r47zds9ajg}}</li>
| |
| <li>{{#widget:YouTube|id=apNnmCBiKv4}}</li>
| |
| <li>{{#widget:YouTube|id=fTgo466hG1c}}</li>
| |
| <li>{{#widget:YouTube|id=jFW7BdHTRdY}}</li>
| |
| <li>{{#widget:YouTube|id=mtZA_k174VM}}</li>
| |
| <li>{{#widget:YouTube|id=sxXaPow0qig}}</li>
| |
| <li>{{#widget:YouTube|id=wYwf1HdBlkQ}}</li>
| |
| <li>{{#widget:YouTube|id=xV88777nyOA}}</li>
| |
| <li>{{#widget:YouTube|id=ydxQlqpkX8E}}</li>
| |
| <li>{{#widget:YouTube|id=yeF-QesNdto}}</li>
| |
| </ul>
| |
| <html> | | <html> |
| <head> | | <br> |
| | <div id="button-wrap"> |
| | <button id="ytButton">Click to change Tape</button> |
| | </div> |
| | <!-- Put Your javascript here--> |
| <script> | | <script> |
| $(".videolist> li").hide();
| | var videoIdList = [ |
| randomItem();
| | </html> |
| | {{#for_external_table: |
| | "{{{video_id}}}", |
| | }} |
| | <html> |
| | ]; |
| | var youtubeLink = "https://www.youtube.com/embed/"; |
| | var shuffledList = videoIdList.sort(() => Math.random() - 0.5); |
| | var button = document.querySelector("#ytButton"); |
| | var player = document.querySelector("#ytPlayer"); |
| | button.addEventListener("click", playNext); |
|
| |
|
| function randomItem(){ | | function playNext() { |
| for (var i = 0; i < 1; i++){
| | var justPlayedVideo = shuffledList.shift(); |
| var length = $(".videolist> li:not(:visible)").length;
| | shuffledList.push(justPlayedVideo); |
| var random = Math.floor(Math.random() * length);
| | |
| $(".videolist> li:not(:visible)").eq(random).show();
| | player.src = youtubeLink + shuffledList[0]; |
| }
| |
| } | | } |
| | |
| | player.src = youtubeLink + shuffledList[0]; |
| </script> | | </script> |
| | </html> |
| </div> | | </div> |
| </head>
| |
| </html>
| |