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

Added video-only option for embedded channel

Browse Source
This commit is contained in:
Kasper Rynning-Tønnesen
2018-02-07 16:12:15 +01:00
parent 0449442783
commit 9f5159afb7
6 changed files with 18 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
server/public/assets/css/embed.css
View File

@@ -189,7 +189,7 @@
#zoffbutton{ #zoffbutton{
cursor:pointer; cursor:pointer;
position: absolute; position: absolute;
top: -47px; bottom: 35px;
left: 10px; left: 10px;
background-image: url('/assets/images/z.svg'); background-image: url('/assets/images/z.svg');
width: 50px; width: 50px;

2
server/public/assets/html/embed.html
View File

@@ -27,8 +27,8 @@
<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="zoffbutton" title="Visit the channel!"></div>
<div id="controls" class="noselect"> <div id="controls" class="noselect">
<div id="zoffbutton" title="Visit the channel!"></div>
<div id="playpause"> <div id="playpause">
<i id="play" class="material-icons hide">play_arrow</i> <i id="play" class="material-icons hide">play_arrow</i>
<i id="pause" class="material-icons">pause</i> <i id="pause" class="material-icons">pause</i>

1
server/public/assets/js/embed.js
View File

@@ -74,6 +74,7 @@ $(document).ready(function() {
$("#playlist").addClass("hide"); $("#playlist").addClass("hide");
$("#controls").addClass("hide"); $("#controls").addClass("hide");
$("#player").addClass("video_only"); $("#player").addClass("video_only");
$("#zoffbutton").css("bottom", "0px");
} }
$("#locked_channel").modal({ $("#locked_channel").modal({

4
server/public/assets/js/functions.js
View File

@@ -215,8 +215,8 @@ function disable_debug(){
localStorage.debug = false; localStorage.debug = false;
} }
function embed_code(autoplay, width, height, color){ function embed_code(autoplay, width, height, color, embed_code){
return '<iframe src="https://zoff.me/_embed#' + chan.toLowerCase() + '&' + color + autoplay + '" width="' + width + 'px" height="' + height + 'px"></iframe>'; return '<iframe src="https://zoff.me/_embed#' + chan.toLowerCase() + '&' + color + autoplay + embed_videoonly + '" width="' + width + 'px" height="' + height + 'px"></iframe>';
} }
function change_offline(enabled, already_offline){ function change_offline(enabled, already_offline){

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

@@ -53,6 +53,7 @@ var not_import_html = "";
var not_export_html = ""; var not_export_html = "";
var embed_height = 300; var embed_height = 300;
var embed_width = 600; var embed_width = 600;
var embed_videoonly = "";
var embed_autoplay = "&autoplay"; var embed_autoplay = "&autoplay";
var connect_error = false; var connect_error = false;
var access_token_data_youtube = {}; var access_token_data_youtube = {};
@@ -617,19 +618,19 @@ $(document).on('change', '#view_channels_select', function(e) {
$(document).on('keyup mouseup', '#width_embed', function(){ $(document).on('keyup mouseup', '#width_embed', function(){
var that = $(this); var that = $(this);
embed_width = that.val(); embed_width = that.val();
$("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color)); $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly));
}); });
$(document).on('keyup mouseup', '#height_embed', function(){ $(document).on('keyup mouseup', '#height_embed', function(){
var that = $(this); var that = $(this);
embed_height = that.val(); embed_height = that.val();
$("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color)); $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly));
}); });
$(document).on('input', '#color_embed', function(){ $(document).on('input', '#color_embed', function(){
var that = $(this); var that = $(this);
color = that.val().substring(1); color = that.val().substring(1);
$("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color)); $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly));
}); });
$(document).on('click', ".chan-link", function(e){ $(document).on('click', ".chan-link", function(e){
@@ -778,7 +779,13 @@ $(window).focus(function(){
$(document).on("change", "#autoplay", function() { $(document).on("change", "#autoplay", function() {
if(this.checked) embed_autoplay = "&autoplay"; if(this.checked) embed_autoplay = "&autoplay";
else embed_autoplay = ""; else embed_autoplay = "";
$("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color)); $("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly));
});
$(document).on("change", "#videoonly", function() {
if(this.checked) embed_videoonly = "&videoonly";
else embed_videoonly = "";
$("#embed-area").val(embed_code(embed_autoplay, embed_width, embed_height, color, embed_videoonly));
}); });
$(document).on("click", "#playbutton_remote", function(e) { $(document).on("click", "#playbutton_remote", function(e) {

2
server/public/partials/channel/modal.handlebars
View File

@@ -58,6 +58,8 @@
<input type="number" value="300" id="height_embed" class="settings_embed" min="1" /> <input type="number" value="300" id="height_embed" class="settings_embed" min="1" />
<label for="color_embed" class="padding_left_6 embed-label">Color</label> <label for="color_embed" class="padding_left_6 embed-label">Color</label>
<input type="text" id="color_embed" class="settings_embed" value="#808080" /> <input type="text" id="color_embed" class="settings_embed" value="#808080" />
<input type="checkbox" id="videoonly" />
<label for="videoonly" class="padding_right_26">Video-only</label>
</p> </p>
<textarea id="embed-area"></textarea> <textarea id="embed-area"></textarea>
</div> </div>