Embedded version

- Embedded version now working with soundcloud-player
This commit is contained in:
Kasper Rynning-Tønnesen
2018-05-03 15:45:34 +02:00
parent 9a4fdda011
commit 7747e29158
4 changed files with 23 additions and 4 deletions

View File

@@ -13,6 +13,14 @@
transition: all .3s !important; transition: all .3s !important;
} }
#player_overlay {
position: absolute;
height: calc(100% - 32px);
top: 0px;
left: 0px;
width: 50vw;
}
.card { .card {
cursor:pointer; cursor:pointer;
background-color: rgba(255, 255, 255, 0.04) !important; background-color: rgba(255, 255, 255, 0.04) !important;

View File

@@ -8,6 +8,7 @@ var startTime = 0;
var socket_connected = false; var socket_connected = false;
var dynamicListeners = {}; var dynamicListeners = {};
var player_ready = false; var player_ready = false;
var firstLoad = "";
var list_html = document.getElementById("list-song-html").innerHTML; var list_html = document.getElementById("list-song-html").innerHTML;
var w_p = true; var w_p = true;
var lazy_load = false; var lazy_load = false;
@@ -85,6 +86,7 @@ window.addEventListener("DOMContentLoaded", function() {
}); });
color = "#" + hash[1]; color = "#" + hash[1];
add = "https://zoff.me"; add = "https://zoff.me";
if(window.location.hostname == "localhost") add = "localhost";
//add = "localhost"; //add = "localhost";
socket = io.connect(''+add+':8080', connection_options); socket = io.connect(''+add+':8080', connection_options);
@@ -299,6 +301,10 @@ addListener("click", ".prev_page", function(e) {
List.dynamicContentPage(-1); List.dynamicContentPage(-1);
}); });
addListener("click", "#player_overlay", function(event) {
if(videoSource == "soundcloud") Playercontrols.play_pause();
});
addListener("click", ".next_page", function(e) { addListener("click", ".next_page", function(e) {
event.preventDefault(); event.preventDefault();
List.dynamicContentPage(1); List.dynamicContentPage(1);

View File

@@ -251,7 +251,7 @@ var Player = {
empty_clear = false; empty_clear = false;
} }
try { try {
document.getElementById("play").focus(); //document.getElementById("play").focus();
console.log("focused"); console.log("focused");
if(videoSource == "soundcloud") { if(videoSource == "soundcloud") {
Player.player.stopVideo(); Player.player.stopVideo();
@@ -453,7 +453,7 @@ var Player = {
show_user:false, show_user:false,
callback: function() { callback: function() {
Player.stopVideo(); Player.stopVideo();
SC.Widget(Player.soundcloud_player).setVolume(Crypt.get_volume()); SC.Widget(Player.soundcloud_player).setVolume(embed ? 100 : Crypt.get_volume());
console.log(start, seekTo); console.log(start, seekTo);
if(start == undefined) start = 0; if(start == undefined) start = 0;
if(seekTo == undefined) seekTo = 0; if(seekTo == undefined) seekTo = 0;
@@ -498,7 +498,7 @@ var Player = {
download:false, download:false,
show_user:false, show_user:false,
callback: function() { callback: function() {
SC.Widget(Player.soundcloud_player).setVolume(Crypt.get_volume()); SC.Widget(Player.soundcloud_player).setVolume(embed ? 100 : Crypt.get_volume());
console.log(start, seekTo); console.log(start, seekTo);
if(start == undefined) start = 0; if(start == undefined) start = 0;
if(seekTo == undefined) seekTo = 0; if(seekTo == undefined) seekTo = 0;

View File

@@ -10,6 +10,11 @@
<div id="container" style="display:inline-flex;"> <div id="container" style="display:inline-flex;">
<div id="player-container"> <div id="player-container">
<div id="player"></div> <div id="player"></div>
<div id="player_overlay" class="hide valign-wrapper">
</div>
<iframe width="100%" id="soundcloud_player" height="166" scrolling="no" frameborder="no" style="top: 0px; left:0px; visibility: hidden;z-index: -999;position: absolute;pointer-events: none;"
src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/undefined&amp;{ auto_play: false, buying:false, sharing:false, download:false, show_user:false, }">
</iframe>
<div id="zoffbutton" title="Visit the channel!"></div> <div id="zoffbutton" title="Visit the channel!"></div>
<div id="controls" class="noselect"> <div id="controls" class="noselect">
<div id="playpause"> <div id="playpause">