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

Merge pull request #438 from zoff-music/feature/intelligent-list

Browse Source 
Intelligent list
This commit is contained in:
Kasper Rynning-Tønnesen
2018-10-29 14:31:55 +01:00
committed by GitHub
parent 4dcd03d042 d315851667
commit 3998817b62
9 changed files with 274 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -2036,7 +2036,7 @@ nav ul li:hover, nav ul li.active {
transition: all .1s ease;
}
.vote-container{
.vote-container, .deleted-vote-container{
height: 100%;
width: 90%;
}
@@ -2766,6 +2766,11 @@ nav ul li:hover, nav ul li.active {
border: none;
}
.disabled-vote{
cursor: not-allowed !important;
background: rgba(255,255,255,.2);
}
.hide
{
display:none !important;

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

@@ -117,9 +117,6 @@ var Channel = {
draggable: Helper.mobilecheck(),
onOpenStart: function(el) {
Helper.addClass(".hamburger-sidenav", "open");
try {
M.Collapsible.getInstance(document.querySelector(".settings-collapsible")).open(1);
} catch(e) {}
},
onCloseStart: function(el) {
Helper.removeClass(".hamburger-sidenav", "open");
@@ -182,6 +179,7 @@ var Channel = {
}
if(!Helper.mobilecheck() && (document.querySelectorAll("#alreadychannel").length === 0 || !Hostcontroller.old_id || document.getElementById("code-text").innerText.toUpperCase() == "ABBADUR")) setup_host_initialization();
setup_suggested_listener();
if(!Helper.mobilecheck()) Helper.removeClass(".intelligent-accordion", "hide-on-small-only");
if(document.querySelectorAll("#alreadychannel").length === 0 || Helper.mobilecheck()){
setup_now_playing_listener();
get_list_listener();

16
server/public/assets/js/crypt.js
View File

@@ -22,11 +22,27 @@ var Crypt = {
}
if(window.location.pathname != "/") {
change_intelligent(Crypt.get_intelligent_list_enabled());
Hostcontroller.change_enabled(conf_arr.remote);
if(conf_arr.width != 100) Player.set_width(conf_arr.width);
}
},
get_intelligent_list_enabled: function() {
if(conf_arr.hasOwnProperty("intelligent")) {
return conf_arr.intelligent;
} else {
conf_arr.intelligent = false;
Crypt.encrypt(conf_arr, "_opt");
return false;
}
},
set_intelligent_list_enabled: function(enabled) {
conf_arr.intelligent = enabled;
Crypt.encrypt(conf_arr, "_opt");
},
decrypt: function(cookie, name) {
if(Crypt.getCookie(name) === undefined) {
cookie = Crypt.create_cookie(name);

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

@@ -3,6 +3,7 @@ var timed_remove_check;
var gotten_np = false;
var song_title = "";
var paused = false;
var intelligentList = false;
var client = false;
var _VERSION;
try {
@@ -19,6 +20,8 @@ if(window.location.hostname == "localhost" || window.location.hostname == "clien
}
var SC_player;
var durationTimeout;
var intelligentQueue = [];
var deleted_elements = 0;
var sc_need_initialization = true;
var sc_initialized = false;
var startTime = 0;

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

@@ -611,6 +611,44 @@ function loadChromecastVideo() {
});
}
function enable_intelligent_list() {
if(Crypt.get_intelligent_list_enabled()) {
intelligentList = true;
}
}
function change_intelligent(enabled) {
document.querySelector(".intelligent_switch_class").checked = enabled;
}
function clearIntelligentQueue() {
intelligentList = false;
for(var i = 0; i < intelligentQueue.length; i++) {
var currentElement = intelligentQueue[i];
if(currentElement.type == "vote") {
Helper.removeElement("#"+currentElement.element.id);
List.insertAtIndex(currentElement.element, false);
} else if(currentElement.type == "delete") {
List.deleted_song(currentElement.element.id, false, true, currentElement.index);
deleted_elements += 1;
} else if(currentElement.type == "add") {
List.insertAtIndex(currentElement.element, true);
Helper.css(document.querySelector("#wrapper").children[List.page + List.can_fit], "display", "none");
if(document.querySelector("#wrapper").children.length > List.page + List.can_fit){
Helper.css(".next_page_hide", "display", "none");
Helper.removeClass(".next_page", "hide");
Helper.css(".last_page_hide", "display", "none");
Helper.css(".next_page", "display", "inline-flex");
Helper.css(".last_page", "display", "inline-flex");
} else {
Helper.css(".next_page_hide", "display", "inline-flex");
Helper.css(".next_page", "display", "none");
}
}
}
intelligentQueue = [];
}
function updateChromecastMetadata() {
if(!chromecastAvailable) return;
var image = {url:'https://img.youtube.com/vi/'+video_id+'/mqdefault.jpg', heigth: 180, width: 320};

6
server/public/assets/js/hostcontroller.js
View File

@@ -35,7 +35,7 @@ var Hostcontroller = {
host_on_action: function(arr) {
if(client) return;
if(enabled){
if(Hostcontroller.enabled){
if(arr.type == "volume") {
try {
Playercontrols.visualVolume(arr.value);
@@ -75,9 +75,9 @@ var Hostcontroller = {
change_enabled:function(val){
if(client) return;
enabled = val;
Hostcontroller.enabled = val;
try {
document.querySelector(".remote_switch_class").checked = enabled;
document.querySelector(".remote_switch_class").checked = Hostcontroller.enabled;
}catch(e) {}
}
};

87
server/public/assets/js/list.js
View File

@@ -121,8 +121,9 @@ var List = {
insertAtIndex: function(song_info, transition, change) {
if(document.querySelector("#wrapper") == null) return;
var i = List.getIndexOfSong(song_info.id);
var display = "none";
if(i == -1) return;
if(!song_info.now_playing){
var display = "none";
if(i >= List.page && i < List.page + (List.can_fit)) display = "inline-flex"
var add = List.generateSong(song_info, transition, false, true, false, display, false);
if(i === 0) {
@@ -397,6 +398,12 @@ var List = {
if(document.querySelectorAll("#empty-channel-message").length > 0) {
document.querySelector("#empty-channel-message").remove();
}
if(intelligentList) {
intelligentQueue.push({
type: "add",
element: added,
});
} else {
List.insertAtIndex(added, true);
Helper.css(document.querySelector("#wrapper").children[List.page + List.can_fit], "display", "none");
if(document.querySelector("#wrapper").children.length > List.page + List.can_fit){
@@ -410,13 +417,30 @@ var List = {
Helper.css(".next_page", "display", "none");
}
}
}
},
deleted_song: function(deleted, removed) {
deleted_song: function(deleted, removed, intelligentSecond, deleted_index) {
try{
var index = List.getIndexOfSong(deleted);
if(intelligentList && !intelligentSecond) {
intelligentQueue.push({
type: "delete",
element: full_playlist[index],
index: index,
});
if(index != -1) full_playlist.splice(index, 1);
var this_element = document.getElementById(deleted);
Helper.addClass(this_element, "disabled-vote");
this_element.querySelector(".vote-span").innerText = "Deleted";
Helper.addClass(this_element.querySelector(".vote-container"), "deleted-vote-container");
Helper.removeClass(this_element.querySelector(".vote-container"), "clickable");
Helper.removeClass(this_element.querySelector(".vote-container"), "vote-container");
return;
} else {
//if(!removed) to_delete.style.height = 0;
var nextToChange;
if(index == -1) index = deleted_index;
if(index < List.page && document.querySelector("#wrapper").children.length - (List.page + 2) >= 0){
//Helper.css(document.querySelector("#wrapper").children[List.page], "height", 0 + "px");
nextToChange = document.querySelector("#wrapper").children[List.page];
@@ -464,12 +488,15 @@ var List = {
Helper.css(nextToChange, "height", List.element_height + "px");
}
}
full_playlist.splice(List.getIndexOfSong(deleted), 1);
var index = List.getIndexOfSong(deleted);
if(index != -1) full_playlist.splice(index, 1);
Player.sendNext({title: full_playlist[0].title, videoId: full_playlist[0].id, source: full_playlist[0].source, thumbnail: full_playlist[0].thumbnail});
//}
}
} catch(err) {
full_playlist.splice(List.getIndexOfSong(deleted), 1);
var index = List.getIndexOfSong(deleted);
if(index != -1) full_playlist.splice(index, 1);
if(!List.empty){
try {
document.getElementById(deleted).remove();
@@ -503,14 +530,25 @@ var List = {
voted_song: function(voted, time) {
var index_of_song = List.getIndexOfSong(voted);
if(index_of_song == -1) return;
var song_voted_on = full_playlist[index_of_song];
full_playlist[index_of_song].votes += 1;
full_playlist[index_of_song].added = time;
if(intelligentList) {
document.getElementById(voted).querySelector(".list-votes").innerText = full_playlist[index_of_song].votes;
intelligentQueue.push({
type: "vote",
element: song_voted_on
});
List.sortList();
} else {
List.sortList();
Helper.removeElement("#"+voted);
List.insertAtIndex(song_voted_on, false);
}
},
song_change_prev: function(time) {
@@ -537,16 +575,29 @@ var List = {
song_change: function(time, remove) {
try{
var length = full_playlist.length - 1;
document.querySelector("#wrapper").children[0].remove();
if(full_playlist.length <= 1) {
List.empty = true;
Helper.setHtml("#wrapper", "<span id='empty-channel-message'>The playlist is empty.</span>");
}
var newLast = full_playlist[0];
full_playlist[0].now_playing = true;
full_playlist[0].votes = 0;
full_playlist[0].guids = [];
full_playlist[0].added = time;
var i = intelligentQueue.length
while (i--) {
var current = intelligentQueue[i];
if (current.type == "delete") {
intelligentQueue.splice(i, 1);
Helper.removeElement("#" + current.element.id);
deleted_elements += 1;
}
}
try {
document.getElementById(full_playlist[0].id).remove();
} catch(e) {};
if(!remove){
full_playlist[length].now_playing = false;
} else {
@@ -559,13 +610,21 @@ var List = {
full_playlist.push(full_playlist.shift());
if(!remove){
List.insertAtIndex(full_playlist[document.querySelector("#wrapper").children.length], false, true);
if(full_playlist.length >= 2) {
var index = full_playlist.length - 2;
List.insertAtIndex(full_playlist[index], false, true);
}
}
var wrapperChildren = [].slice.call(document.querySelector("#wrapper").children);
if(wrapperChildren.length >= List.can_fit && deleted_elements > 0) {
for(var i = 0; i < deleted_elements + 1; i++) {
//Helper.css(wrapperChildren[List.can_fit - 2], "display", "inline-flex");
Helper.css(wrapperChildren[List.page + List.can_fit - 1 - i], "display", "inline-flex");
}
}
deleted_elements = 0;
} catch(e) {
}
/*var wrapperChildren = [].slice.call(document.querySelector("#wrapper").children);
if(wrapperChildren.length > List.can_fit) {
//Helper.css(wrapperChildren[List.can_fit], "display", "inline-flex");
}*/
} catch(e) {}
},
vote: function(id, vote) {
@@ -1276,7 +1335,7 @@ var List = {
for(var i = 0; i < full_playlist.length; i++) {
if(full_playlist[i].id == id) return i;
}
} catch(e) {}
return -1;
} catch(e) {return -1;}
}
};

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

@@ -17,6 +17,9 @@ var scUsingWidget = false;
var SC_player;
var previewing = false;
var sc_initialized = false;
var intelligentQueue = [];
var intelligentList = false;
var deleted_elements = 0;
var soundcloud_enabled = true;
var local_new_channel = false;
var sc_need_initialization = true;
@@ -902,10 +905,23 @@ function addDynamicListeners() {
addListener("change", '.remote_switch_class', function()
{
Hostcontroller.change_enabled(document.getElementsByName("remote_switch")[0].checked);
var enabled = document.getElementsByName("remote_switch")[0].checked;
Hostcontroller.change_enabled(enabled);
Crypt.set_remote(enabled);
});
addListener("change", '.intelligent_switch_class', function()
{
var enabled = document.getElementsByName("intelligent_switch")[0].checked;
change_intelligent(enabled);
Crypt.set_intelligent_list_enabled(enabled);
if(enabled) {
toast("Enabled intelligent playlist!");
} else {
toast("Disabled intelligent playlist.");
}
});
addListener("change", '.offline_switch_class', function()
{
offline = document.getElementsByName("offline_switch")[0].checked;
@@ -1853,6 +1869,31 @@ function addDynamicListeners() {
image_timeout = setTimeout(function(){
that.querySelector(".card-reveal").setAttribute("style", "display: none;");
}, 100);
} else if(!Helper.mobilecheck() && Crypt.get_intelligent_list_enabled()){
try {
if(event.target.id == "wrapper" && event.relatedTarget.id != "context-menu-overlay" && event.relatedTarget.className.indexOf("context-menu-list") == -1 && event.relatedTarget.className.indexOf("context-menu-item") == -1) {
clearIntelligentQueue();
} else if(event.target.id == "context-menu-overlay" || event.relatedTarget.className.indexOf("context-menu-list") >= 0 || event.relatedTarget.className.indexOf("context-menu-item") >= 0) {
var related = event.relatedTarget;
if(related.id == "wrapper" || related.className.indexOf("context-menu-list") >= 0 || related.className.indexOf("context-menu-item") >= 0) {
enable_intelligent_list();
return;
}
var parent = related.parentElement;
while(parent != null) {
try {
if(parent.id == "wrapper" || parent.className.indexOf("context-menu-list") >= 0 || parent.className.indexOf("context-menu-item") >= 0) {
enable_intelligent_list();
return;
}
} catch(e){}
try {
parent = parent.parentElement;
} catch(e){break;}
}
clearIntelligentQueue();
}
} catch(e) {}
}
}, true);
@@ -1865,6 +1906,8 @@ function addDynamicListeners() {
image_timeout = setTimeout(function(){
that.querySelector(".card-reveal").setAttribute("style", "display: block;transform: translateY(-100%);");
}, 50);
} else if(event.target.id == "wrapper") {
enable_intelligent_list();
}
}, true);

30
server/public/partials/channel/panel.handlebars
View File

@@ -4,7 +4,7 @@
</div>
<ul class="collapsible collapsible-accordion settings-collapsible">
{{> channel/settings}}
<li class="no-padding">
<li class="no-padding active">
<div class="collapsible-header bold waves-effect">Channel Info
<i class="material-icons">info_outline</i>
</div>
@@ -25,6 +25,34 @@
</ul>
</div>
</li>
<li class="no-padding hide-on-small-only intelligent-accordion">
<div class="collapsible-header bold waves-effect">Intelligent Playlist
<i class="material-icons">sentiment_satisfied_alt</i>
</div>
<div class="collapsible-body info_collapsible">
<ul>
<li>
<span class="switch-text">
Intelligent
</span>
<div class="switch">
<label>
Disabled
<input name="intelligent_switch" type="checkbox" class="intelligent_switch_class" checked /><span class="lever"></span>
Enabled
</label>
</div>
<div class="row">
<div class="col s10 offset-s1">
<p class="initial-line-height">
When enabling intelligent playlist, playlist elements are not updated and moved around when the playlist is in focus. If things are jumping too much around in the playlist when voting, you should enable this.
</p>
</div>
</div>
</li>
</ul>
</div>
</li>
{{#unless client}}
<li class="no-padding remote-panel hide-on-small-only">
<div class="collapsible-header bold waves-effect">Remote Control