KevinMidboe/zoff
1
0
Fork 0
mirror of https://github.com/KevinMidboe/zoff.git synced 2025-10-29 18:00:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Animated chromecast-icon

Browse Source
This commit is contained in:
Kasper Rynning-Tønnesen
2017-06-07 01:27:34 +02:00
parent 9a57ad1b59
commit b992baf136
6 changed files with 53 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
server/public/assets/css/style.css
View File

@@ -1459,7 +1459,21 @@ ul #chat-log{
} }
.castButton{ .castButton{
display:none !important; /* display: none; !important*/
width: 32px;
margin-top: 4px;
background: transparent;
border: none;
float: right;
--disconnected-color: white;
}
.castButton:focus {
background: transparent;
}
.castButton-white-active {
--connected-color: white !important;
} }
.castButton-unactive, .castButton-unactive:active, .castButton-unactive:focus, .castButton-unactive:hover, .castButton-active, .castButton-active:active, .castButton-active:hover, .castButton-active:focus { .castButton-unactive, .castButton-unactive:active, .castButton-unactive:focus, .castButton-unactive:hover, .castButton-active, .castButton-active:active, .castButton-active:hover, .castButton-active:focus {

2
server/public/assets/dist/embed.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
server/public/assets/dist/main.min.js vendored
View File

File diff suppressed because one or more lines are too long

52
server/public/assets/js/listeners.js
View File

@@ -307,17 +307,17 @@ function init(){
Helper.sample(); Helper.sample();
$('.castButton-unactive').tooltip({ $('.castButton').tooltip({
delay: 5, delay: 5,
position: "top", position: "top",
tooltip: "Cast Zoff to TV" tooltip: "Cast Zoff to TV"
}); });
$('.castButton-active').tooltip({ /*$('.castButton-active').tooltip({
delay: 5, delay: 5,
position: "top", position: "top",
tooltip: "Stop casting" tooltip: "Stop casting"
}); });*/
$("#results" ).hover( function() { $("div.result").removeClass("hoverResults"); i = 0; }, function(){ }); $("#results" ).hover( function() { $("div.result").removeClass("hoverResults"); i = 0; }, function(){ });
$("#search").focus(); $("#search").focus();
@@ -326,7 +326,7 @@ function init(){
$("#search").attr("placeholder", "Find song on YouTube..."); $("#search").attr("placeholder", "Find song on YouTube...");
if(!/chrom(e|ium)/.test(navigator.userAgent.toLowerCase()) && !Helper.mobilecheck()){ if(!/chrom(e|ium)/.test(navigator.userAgent.toLowerCase()) && !Helper.mobilecheck()){
$(".castButton-unactive").css("display", "none"); $(".castButton").css("display", "none");
} }
Helper.log("chromecastAvailable" + chromecastAvailable); Helper.log("chromecastAvailable" + chromecastAvailable);
@@ -421,7 +421,7 @@ initializeCastApi = function() {
autoJoinPolicy: chrome.cast.AutoJoinPolicy.ORIGIN_SCOPED autoJoinPolicy: chrome.cast.AutoJoinPolicy.ORIGIN_SCOPED
}); });
var context = cast.framework.CastContext.getInstance(); var context = cast.framework.CastContext.getInstance();
chromecastReady = true chromecastReady = true;
context.addEventListener(cast.framework.CastContextEventType.SESSION_STATE_CHANGED, function(event) { context.addEventListener(cast.framework.CastContextEventType.SESSION_STATE_CHANGED, function(event) {
Helper.log("session state"); Helper.log("session state");
Helper.log(event.sessionState); Helper.log(event.sessionState);
@@ -447,7 +447,6 @@ initializeCastApi = function() {
chromecast_specs_sent = true; chromecast_specs_sent = true;
castSession.sendMessage("urn:x-cast:zoff.me", {type: "mobilespecs", guid: guid, socketid: socket.id, adminpass: adminpass == "" ? "" : Crypt.crypt_pass(adminpass), channel: chan.toLowerCase(), userpass: embed ? '' : Crypt.crypt_pass(Crypt.get_userpass(chan.toLowerCase()))}) castSession.sendMessage("urn:x-cast:zoff.me", {type: "mobilespecs", guid: guid, socketid: socket.id, adminpass: adminpass == "" ? "" : Crypt.crypt_pass(adminpass), channel: chan.toLowerCase(), userpass: embed ? '' : Crypt.crypt_pass(Crypt.get_userpass(chan.toLowerCase()))})
} }
hide_native(1); hide_native(1);
break; break;
case cast.framework.SessionState.SESSION_RESUMED: case cast.framework.SessionState.SESSION_RESUMED:
@@ -481,33 +480,42 @@ initializeCastApi = function() {
Helper.log("cast state"); Helper.log("cast state");
Helper.log(event.castState); Helper.log(event.castState);
if(event.castState == "NOT_CONNECTED"){ if(event.castState == "NOT_CONNECTED"){
$(".castButton-unactive").css("display", "block"); $(".castButton").css("display", "block");
cast_ready_connect = true; cast_ready_connect = true;
if(!localStorage.getItem("_chSeen") || localStorage.getItem("_chSeen") != "seen") { if(!localStorage.getItem("_chSeen") || localStorage.getItem("_chSeen") != "seen") {
$(".castButton-unactive").css("display", "block"); $(".castButton").css("display", "block");
showDiscovery = true; showDiscovery = true;
$('.tap-target').tapTarget('open'); $('.tap-target').tapTarget('open');
tap_target_timeout = setTimeout(function() { tap_target_timeout = setTimeout(function() {
$('.tap-target').tapTarget('close'); $('.tap-target').tapTarget('close');
}, 4000); }, 4000);
localStorage.setItem("_chSeen", "seen"); localStorage.setItem("_chSeen", "seen");
$('.castButton').removeClass('castButton-white-active');
} }
} else if(event.castState == "NO_DEVICES_AVAILABLE"){ } else if(event.castState == "NO_DEVICES_AVAILABLE"){
$(".castButton-unactive").css("display", "none");
cast_ready_connect = false; cast_ready_connect = false;
} }
}); });
if(context.getCastState() == "NOT_CONNECTED") { if(context.getCastState() == "NOT_CONNECTED") {
$(".castButton-unactive").css("display", "block"); $(".castButton").css("display", "block");
$('.castButton').removeClass('castButton-white-active');
cast_ready_connect = true; cast_ready_connect = true;
} }
}; };
function hide_native(way){ function hide_native(way){
$(".castButton-unactive").toggleClass("hide");
$(".castButton-active").toggleClass("hide");
if(way == 1){ if(way == 1){
$('.castButton').tooltip('remove');
if(!$('.castButton').hasClass('castButton-white-active')) {
$('.castButton').addClass('castButton-white-active');
}
$('.castButton').tooltip({
delay: 5,
position: "top",
tooltip: "Stop casting"
});
$("#duration").toggleClass("hide"); $("#duration").toggleClass("hide");
$("#fullscreen").toggleClass("hide"); $("#fullscreen").toggleClass("hide");
try{ try{
@@ -538,6 +546,14 @@ function hide_native(way){
$("#player_overlay_text").toggleClass("hide"); $("#player_overlay_text").toggleClass("hide");
} else if(way == 0){ } else if(way == 0){
$('.castButton').tooltip('remove');
$('.castButton').removeClass('castButton-white-active');
$('.castButton').tooltip({
delay: 5,
position: "top",
tooltip: "Cast Zoff to TV"
});
$("#duration").toggleClass("hide"); $("#duration").toggleClass("hide");
$("#fullscreen").toggleClass("hide"); $("#fullscreen").toggleClass("hide");
Player.player.playVideo(); Player.player.playVideo();
@@ -995,7 +1011,7 @@ $(document).on("click", "#playpause-overlay", function(){
} }
}); });
$(document).on("click", ".castButton-unactive", function(e){ /*$(document).on("click", ".castButton-unactive", function(e){
$(".castButton").trigger("click"); $(".castButton").trigger("click");
}); });
@@ -1003,7 +1019,7 @@ $(document).on("click", ".castButton-active", function(e){
e.preventDefault(); e.preventDefault();
var castSession = cast.framework.CastContext.getInstance().getCurrentSession(); var castSession = cast.framework.CastContext.getInstance().getCurrentSession();
castSession.endSession(true); castSession.endSession(true);
}); });*/
$(document).on('click', '#cookieok', function() { $(document).on('click', '#cookieok', function() {
$(this).fadeOut(function(){ $(this).fadeOut(function(){
@@ -1117,9 +1133,9 @@ $(document).on("click", ".close-user-password", function() {
if(user_auth_started) { if(user_auth_started) {
Player.stopInterval = true; Player.stopInterval = true;
user_auth_avoid = true; user_auth_avoid = true;
$('.castButton-active').tooltip("remove"); $('.castButton').tooltip("remove");
$("#viewers").tooltip("remove"); $("#viewers").tooltip("remove");
$('.castButton-unactive').tooltip("remove"); //$('.castButton-unactive').tooltip("remove");
$("#offline-mode").tooltip("remove"); $("#offline-mode").tooltip("remove");
$('#chan_thumbnail').tooltip("remove"); $('#chan_thumbnail').tooltip("remove");
$('#admin-lock').tooltip("remove"); $('#admin-lock').tooltip("remove");
@@ -1753,9 +1769,9 @@ function onepage_load(){
durationBegun = false; durationBegun = false;
$("#embed-button").css("display", "none"); $("#embed-button").css("display", "none");
$('.castButton-active').tooltip("remove"); $('.castButton').tooltip("remove");
$("#viewers").tooltip("remove"); $("#viewers").tooltip("remove");
$('.castButton-unactive').tooltip("remove"); //$('.castButton-unactive').tooltip("remove");
$("#offline-mode").tooltip("remove"); $("#offline-mode").tooltip("remove");
$('#chan_thumbnail').tooltip("remove"); $('#chan_thumbnail').tooltip("remove");
$('#admin-lock').tooltip("remove"); $('#admin-lock').tooltip("remove");

8
server/public/layouts/channel.handlebars
View File

@@ -186,13 +186,7 @@
<div id="fullscreen" class="hide-on-small-only"> <div id="fullscreen" class="hide-on-small-only">
<i class="material-icons">fullscreen</i> <i class="material-icons">fullscreen</i>
</div> </div>
<button class="castButton-unactive tooltipped" id="google-cast-button" style="display:none;"> <button class="castButton" id="castButton" is="google-cast-button">
<i class="material-icons">cast</i>
</button>
<button class="castButton" is="google-cast-button">
</button>
<button class="castButton-active hide tooltipped">
<i class="material-icons">cast_connected</i>
</button> </button>
<div id="volume-button"> <div id="volume-button">
<i id="v-mute" class="material-icons">volume_off</i> <i id="v-mute" class="material-icons">volume_off</i>

2
server/public/layouts/main.handlebars
View File

@@ -54,7 +54,7 @@
</head> </head>
<body class="noselect"> <body class="noselect">
{{{body}}} {{{body}}}
<div class="tap-target" data-activates="google-cast-button"> <div class="tap-target" data-activates="castButton">
<div class="tap-target-content"> <div class="tap-target-content">
<h5>Chromecast</h5> <h5>Chromecast</h5>
<p>This site supports chromecasting!</p> <p>This site supports chromecasting!</p>