mirror/maloja
1
0
Fork 0
mirror of https://github.com/krateng/maloja.git synced 2023-08-10 21:12:55 +03:00
Code Issues Projects Releases Wiki Activity

Reogranized scrobble action area in web interface

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
maloja/web/jinja/partials/scrobbles.jinja
View File

@ -17,34 +17,32 @@
{{ entityrow.row(s.track) }} {{ entityrow.row(s.track) }}
{% if adminmode %} {% if adminmode %}
<td class='delete_area'> <td class='scrobble_action_area'>
<span class="confirmactions"> <span class='scrobble_action_type'>
<button class="smallbutton warning" onclick="reparseScrobble({{ s.time }},this)">Confirm</button> <span class="confirmactions">
<button class="smallbutton" onclick="toggleReparseConfirm(this)">Cancel</button> <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>
<span class="initializeactions"> <span class='scrobble_action_type'>
<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>
</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="initializeactions">
<span class="confirmactions"> <div class='deleteicon clickable_icon danger' onclick="toggleDeleteConfirm(this)">
<button class="smallbutton warning" onclick="deleteScrobble({{ s.time }},this)">Confirm</button> {% include 'icons/delete.jinja' %}
<button class="smallbutton" onclick="toggleDeleteConfirm(this)">Cancel</button> </div>
</span> </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> </span>
</td> </td>

35
maloja/web/static/css/maloja.css
View File

@ -615,35 +615,50 @@ table.list td.searchProvider:hover {
color: gold; color: gold;
} }
table.list td.delete_area { table.list td.scrobble_action_area {
text-align: right; text-align: right;
width:0em; width:2em;
overflow:visible;
} }
table.list td.delete_area.active { table.list tr td.scrobble_action_area span.scrobble_action_type {
width:7em; display:inline-block;
float:right;
}
table.list td.scrobble_action_area span.scrobble_action_type.active {
} }
/* rows that can be deleted in some form /* rows that can be deleted in some form
'active' class on the delete area cell to toggle confirm prompt 'active' class on the delete area cell to toggle confirm prompt
'removed' class on the whole row to delete '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; 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; 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; 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; 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; 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; display: none;
} }
table.list tr.removed { table.list tr.removed {

26
maloja/web/static/js/edit.js
View File

@ -13,6 +13,7 @@ function selectAll(e) {
// DELETION // DELETION
function toggleDeleteConfirm(element) { function toggleDeleteConfirm(element) {
element.parentElement.parentElement.classList.toggle('active'); element.parentElement.parentElement.classList.toggle('active');
element.parentElement.parentElement.parentElement.classList.toggle('active');
} }
function deleteScrobble(id,element) { 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); 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 // EDIT NAME
function editEntity() { function editEntity() {
@ -187,14 +202,3 @@ function cancelMerge() {
lcst.setItem(key,[]); lcst.setItem(key,[]);
showValidMergeIcons(); 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);
}