1
0
mirror of https://github.com/krateng/maloja.git synced 2023-08-10 21:12:55 +03:00

Reogranized scrobble action area in web interface

This commit is contained in:
krateng 2022-04-22 18:29:09 +02:00
parent e6992f1e90
commit 009d77a75e
3 changed files with 62 additions and 45 deletions

View File

@ -17,34 +17,32 @@
{{ entityrow.row(s.track) }}
{% if adminmode %}
<td class='delete_area'>
<span class="confirmactions">
<button class="smallbutton warning" onclick="reparseScrobble({{ s.time }},this)">Confirm</button>
<button class="smallbutton" onclick="toggleReparseConfirm(this)">Cancel</button>
<td class='scrobble_action_area'>
<span class='scrobble_action_type'>
<span class="confirmactions">
<button class="smallbutton warning" onclick="reparseScrobble({{ s.time }},this)">Reparse</button>
<button class="smallbutton" onclick="toggleReparseConfirm(this)">Cancel</button>
</span>
<span class="initializeactions">
<div class='refreshicon clickable_icon danger' onclick="toggleReparseConfirm(this)">
{% include 'icons/reparse.jinja' %}
</div>
</span>
</span>
<span class="initializeactions">
<div class='refreshicon clickable_icon danger' onclick="toggleReparseConfirm(this)">
<svg style="width:14px;height:14px" viewBox="0 0 24 24">
<path d="M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z" />
</svg>
</div>
</span>
<span class='scrobble_action_type'>
</td>
<span class="confirmactions">
<button class="smallbutton warning" onclick="deleteScrobble({{ s.time }},this)">Delete</button>
<button class="smallbutton" onclick="toggleDeleteConfirm(this)">Cancel</button>
</span>
<td class='delete_area'>
<span class="confirmactions">
<button class="smallbutton warning" onclick="deleteScrobble({{ s.time }},this)">Confirm</button>
<button class="smallbutton" onclick="toggleDeleteConfirm(this)">Cancel</button>
</span>
<span class="initializeactions">
<div class='deleteicon clickable_icon danger' onclick="toggleDeleteConfirm(this)">
<svg style="width:14px;height:14px" viewBox="0 0 24 24">
<path d="M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z" />
</svg>
</div>
<span class="initializeactions">
<div class='deleteicon clickable_icon danger' onclick="toggleDeleteConfirm(this)">
{% include 'icons/delete.jinja' %}
</div>
</span>
</span>
</td>

View File

@ -615,35 +615,50 @@ table.list td.searchProvider:hover {
color: gold;
}
table.list td.delete_area {
table.list td.scrobble_action_area {
text-align: right;
width:0em;
width:2em;
overflow:visible;
}
table.list td.delete_area.active {
width:7em;
table.list tr td.scrobble_action_area span.scrobble_action_type {
display:inline-block;
float:right;
}
table.list td.scrobble_action_area span.scrobble_action_type.active {
}
/* rows that can be deleted in some form
'active' class on the delete area cell to toggle confirm prompt
'removed' class on the whole row to delete
*/
table.list tr td.delete_area span.confirmactions {
table.list tr td.scrobble_action_area span.scrobble_action_type span.confirmactions {
display: none;
}
table.list tr td.delete_area span.initializeactions {
table.list tr td.scrobble_action_area span.scrobble_action_type span.initializeactions {
display: initial;
}
table.list tr td.delete_area.active span.confirmactions {
/* when other action is active, hide all */
table.list tr td.scrobble_action_area.active span.scrobble_action_type span.initializeactions {
display: none;
}
table.list tr td.scrobble_action_area.active span.scrobble_action_type span.initializeactions {
display: none;
}
/* except this one itself is active */
table.list tr td.scrobble_action_area.active span.scrobble_action_type.active span.confirmactions {
display: initial;
}
table.list tr td.delete_area.active span.initializeactions {
table.list tr td.scrobble_action_area.active span.scrobble_action_type.active span.initializeactions {
display: none;
}
table.list tr.removed td.delete_area span.confirmactions {
table.list tr.removed td.scrobble_action_area span.scrobble_action_type span.confirmactions {
display: none;
}
table.list tr.removed td.delete_area span.initializeactions {
table.list tr.removed td.scrobble_action_area span.scrobble_action_type span.initializeactions {
display: none;
}
table.list tr.removed {

View File

@ -13,6 +13,7 @@ function selectAll(e) {
// DELETION
function toggleDeleteConfirm(element) {
element.parentElement.parentElement.classList.toggle('active');
element.parentElement.parentElement.parentElement.classList.toggle('active');
}
function deleteScrobble(id,element) {
@ -29,6 +30,20 @@ function deleteScrobble(id,element) {
neo.xhttpreq("/apis/mlj_1/delete_scrobble",data={'timestamp':id},method="POST",callback=callback_func,json=true);
}
// REPARSING
function toggleReparseConfirm(element) {
element.parentElement.parentElement.classList.toggle('active');
element.parentElement.parentElement.parentElement.classList.toggle('active');
}
function reparseScrobble(id, element) {
toggleReparseConfirm(element);
neo.xhttpreq("/apis/mlj_1/reparse_scrobble",data={'timestamp':id},method="POST",callback=notifyCallback,json=true);
}
// EDIT NAME
function editEntity() {
@ -187,14 +202,3 @@ function cancelMerge() {
lcst.setItem(key,[]);
showValidMergeIcons();
}
function toggleReparseConfirm(element) {
element.parentElement.parentElement.classList.toggle('active');
}
function reparseScrobble(id, element) {
toggleReparseConfirm(element);
neo.xhttpreq("/apis/mlj_1/reparse_scrobble",data={'timestamp':id},method="POST",callback=(()=>null),json=true);
}