Fix timeline dups bug, master remote layout
This commit is contained in:
parent
ce38295600
commit
6872e3f7ed
|
@ -65,7 +65,7 @@ async function update_sort_VLC_playlist(host) {
|
|||
// In VLC's playlist XML representation, the playlist node always gets id '1', so moving to that id
|
||||
// really means moving to the the very start of the playlist.
|
||||
send_ajax_cmd("/" + host + "/move/" + to_shift + "/1");
|
||||
await sleep(90);
|
||||
await sleep(200);
|
||||
}
|
||||
// Un-freeze timeline update flag
|
||||
currentUser.freeze_timeline_update = 0;
|
||||
|
@ -86,16 +86,17 @@ function get_child_by_id(id, parent_element, depth=0){
|
|||
}
|
||||
|
||||
async function update_delete_VLC_playlist(host, delete_element_id) {
|
||||
|
||||
// Delete item from timeline and send corresponding VLC command
|
||||
let current_timeline = document.getElementById("timeline_" + host);
|
||||
let delete_media = get_child_by_id(delete_element_id, current_timeline, 1);
|
||||
let delete_media_cont = delete_media.parentElement;
|
||||
let delete_media_id = delete_media.getAttribute("media_id");
|
||||
|
||||
current_timeline.removeChild(delete_media_cont);
|
||||
send_ajax_cmd("/" + host + "/delete/" + delete_media_id);
|
||||
await sleep(120);
|
||||
await sleep(200);
|
||||
adjust_timeline(host);
|
||||
currentUser.freeze_timeline_update = 0;
|
||||
//~ currentUser.freeze_timeline_update = 0;
|
||||
}
|
||||
|
||||
function find_target_index(element, index) {
|
||||
|
@ -145,9 +146,11 @@ function drag_over_bin(event) {
|
|||
let source_element = document.getElementById(source_id);
|
||||
let cont_element = get_child_by_id(dropped_id, source_element, 1);
|
||||
let current_host = source_id.split("_")[1];
|
||||
cont_element.style.opacity = .5;
|
||||
document.getElementById("delete_" + current_host).style.backgroundColor = "#f00";
|
||||
document.getElementById("delete_" + current_host).style.boxShadow = "0 0 10px #fff;";
|
||||
cont_element.style.opacity = 0.5;
|
||||
//~ document.getElement("delete_" + current_host).style.backgroundColor = "#f00";
|
||||
//~ document.getElementById("delete_" + current_host).style.boxShadow = "0 0 10px #fff;";
|
||||
document.getElementById("delete_btn").style.backgroundColor = "#f00";
|
||||
document.getElementById("delete_btn").style.boxShadow = "0 0 10px #fff;";
|
||||
}
|
||||
|
||||
|
||||
|
@ -159,7 +162,7 @@ function drag_leave_bin(event) {
|
|||
let cont_element = get_child_by_id(dropped_id, source_element, 1);
|
||||
let current_host = source_id.split("_")[1];
|
||||
cont_element.style.opacity = 1;
|
||||
document.getElementById("delete_" + current_host).style.backgroundColor = "#df7474";
|
||||
document.getElementById("delete_btn").style.backgroundColor = "#df7474";
|
||||
}
|
||||
|
||||
|
||||
|
@ -183,11 +186,14 @@ function drop(event, target_element) {
|
|||
source_element.style.border = "none";
|
||||
// Only shift if not dropping on self
|
||||
if (source_element.id != target_element.id) {
|
||||
if ( target_element.id.indexOf("delete_") > -1 ) {
|
||||
//~ if ( target_element.id.indexOf("delete_") > -1 ) {
|
||||
if ( target_element.id == "delete_btn") {
|
||||
update_delete_VLC_playlist(current_host, dropped_id);
|
||||
document.getElementById("delete_btn").style.backgroundColor = "#df7474";
|
||||
} else {
|
||||
dropped_element = get_child_by_id(dropped_id, source_element, 1);
|
||||
let dropTarget = shift_elements(dropped_element.parentElement, target_element);
|
||||
//~ console.log(target_element);
|
||||
//~ if (dropTarget) {
|
||||
// Append dropped element to drop target.
|
||||
//~ target_element.appendChild(source_element);
|
||||
|
@ -528,7 +534,6 @@ function parse_result(command, infos_array) {
|
|||
infos_array.forEach(update_status);
|
||||
|
||||
} else if (command.indexOf("/list") > -1 ) {
|
||||
console.log(currentUser.freeze_timeline_update);
|
||||
// Requests playlist of every instances
|
||||
if (!currentUser.freeze_timeline_update){
|
||||
infos_array.forEach(update_list);
|
||||
|
@ -567,8 +572,8 @@ function parse_result(command, infos_array) {
|
|||
//~ display_upload_status(infos_array)
|
||||
}
|
||||
} else {
|
||||
setTimeout(send_ajax_cmd, 80, "/all/list");
|
||||
setTimeout(send_ajax_cmd, 120, "/all/status");
|
||||
setTimeout(send_ajax_cmd, 180, "/all/list");
|
||||
setTimeout(send_ajax_cmd, 180, "/all/status");
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -593,6 +598,8 @@ function send_ajax_cmd(command) {
|
|||
|
||||
function enqueue_file(evt) {
|
||||
send_ajax_cmd("/" + evt.currentTarget.host + "/enqueue/" + evt.currentTarget.innerText);
|
||||
// User can't be interacting with timeline when clicking on file so unfreeze it.
|
||||
currentUser.freeze_timeline_update = 0;
|
||||
setTimeout(send_ajax_cmd, 40, "/" + evt.currentTarget.host + "/list");
|
||||
}
|
||||
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
body {color:#fff;background-color:#666;margin:0;}
|
||||
body {color:#fff;background-color:#666;margin:0;padding-top: 8em;}
|
||||
div {box-sizing: border-box;}
|
||||
h2 {margin:0;}
|
||||
table {background-color: #555;margin-left:.5em;max-width:100%;font-size:.9em}
|
||||
|
@ -14,10 +14,26 @@ tr:nth-child(2n+1) {background-color: #888;}
|
|||
}
|
||||
|
||||
#master_remote {
|
||||
background: linear-gradient(0deg, #222 10%, #444 80%);
|
||||
background: linear-gradient(0deg, #222 10%, #444 80%);
|
||||
padding: 1em;
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 999;
|
||||
width: 100%;
|
||||
height:8em;
|
||||
}
|
||||
/*
|
||||
min-height: 20em;
|
||||
*/
|
||||
}
|
||||
#master_remote .right_col {background-color:transparent;}
|
||||
#master_remote .buttons{
|
||||
margin: unset;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.client_container {
|
||||
border-bottom: #222 solid 1px;
|
||||
display:none;
|
||||
|
@ -146,7 +162,7 @@ tr:nth-child(2n+1) {background-color: #888;}
|
|||
}
|
||||
.btn_txt {display: block;font-size: small;}
|
||||
|
||||
.delete_btn {
|
||||
#delete_btn {
|
||||
width: 5em;
|
||||
height: 3em;
|
||||
background-color: #df7474;
|
||||
|
@ -157,7 +173,7 @@ tr:nth-child(2n+1) {background-color: #888;}
|
|||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.delete_btn:hover {
|
||||
#delete_btn:hover {
|
||||
box-shadow: 0 0 10px #df7474;
|
||||
}
|
||||
|
||||
|
|
|
@ -9,7 +9,9 @@
|
|||
<div class="left_col">
|
||||
<h2>{{gui_l10n['str_pilpil_title']}}</h2>
|
||||
<p id="status_all">{{status_message}}</p>
|
||||
<!--
|
||||
<p id="filelist">{{queue_msgs[0]}}</p>
|
||||
-->
|
||||
</div>
|
||||
<div class="right_col">
|
||||
<p class="buttons">
|
||||
|
@ -24,6 +26,7 @@
|
|||
<button value="/all/clear" class="command btn btn-block btn-lg btn-default" role="button">X<span class="btn_txt">{{gui_l10n['str_clear']}}</span></button>
|
||||
<button value="/all/move/0/1" class="command btn btn-block btn-lg btn-default" role="button">β<span class="btn_txt">{{gui_l10n['str_sort']}}</span></button>
|
||||
<button value="/sync/all" class="command btn btn-block btn-lg btn-default" role="button">↭<span class="btn_txt">{{gui_l10n['str_sync']}}</span></button>
|
||||
<button id="delete_btn" ondrop="drop(event, this)", ondragover="drag_over_bin(event)" ondragleave="drag_leave_bin(event)" class="delete_btn" role="button">🗑<span class="btn_txt">{{gui_l10n['str_delete']}}</span></button>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -77,7 +80,9 @@
|
|||
<button value="/{{host}}/loop" class="command btn btn-block btn-lg btn-default" role="button">🔁<span class="btn_txt">{{gui_l10n['str_loop']}}</span></button>
|
||||
<button value="/{{host}}/clear" class="command btn btn-block btn-lg btn-default" role="button">X<span class="btn_txt">{{gui_l10n['str_clear']}}</span></button>
|
||||
<button id="toggle_val_{{host}}}" value="/{{host}}/sort/1/id" class="command btn btn-block btn-lg btn-default" role="button">🔀<span class="btn_txt">{{gui_l10n['str_sort']}}</span></button>
|
||||
<!--
|
||||
<button id="delete_{{host}}" value="/{{host}}/delete" ondrop="drop(event, this)", ondragover="drag_over_bin(event)" ondragleave="drag_leave_bin(event)" class="delete_btn" role="button">🗑<span class="btn_txt">{{gui_l10n['str_delete']}}</span></button>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue