Can now cancel editing

This commit is contained in:
krateng 2022-04-17 15:15:29 +02:00
parent 0525ff400b
commit 83e3157ad1
4 changed files with 39 additions and 22 deletions

View File

@ -6,6 +6,7 @@
{% block scripts %} {% block scripts %}
<script src="/rangeselect.js"></script> <script src="/rangeselect.js"></script>
<script src="/edit.js"></script>
{% endblock %} {% endblock %}
{% set artist = filterkeys.artist %} {% set artist = filterkeys.artist %}
@ -32,6 +33,7 @@
<script> <script>
const entity_id = {{ info.id }}; const entity_id = {{ info.id }};
const entity_type = 'artist'; const entity_type = 'artist';
const entity_name = {{ artist | tojson }};
</script> </script>

View File

@ -1,4 +1,3 @@
<script src="/edit.js"></script>
<div title="Edit" id="editicon" class="clickable_icon" onclick="editEntity()"> <div title="Edit" id="editicon" class="clickable_icon" onclick="editEntity()">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="20px" y="20px" <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="20px" y="20px"
viewBox="0 0 59.985 59.985" style="enable-background:new 0 0 59.985 59.985;" xml:space="preserve"> viewBox="0 0 59.985 59.985" style="enable-background:new 0 0 59.985 59.985;" xml:space="preserve">

View File

@ -5,6 +5,7 @@
{% block scripts %} {% block scripts %}
<script src="/rangeselect.js"></script> <script src="/rangeselect.js"></script>
<script src="/edit.js"></script>
<script> <script>
function scrobble(encodedtrack) { function scrobble(encodedtrack) {
neo.xhttprequest('/apis/mlj_1/newscrobble?nofix&' + encodedtrack,data={},method="POST").then(response=>{window.location.reload()}); neo.xhttprequest('/apis/mlj_1/newscrobble?nofix&' + encodedtrack,data={},method="POST").then(response=>{window.location.reload()});
@ -26,6 +27,7 @@
<script> <script>
const entity_id = {{ info.id }}; const entity_id = {{ info.id }};
const entity_type = 'track'; const entity_type = 'track';
const entity_name = {{ track.title | tojson }};
</script> </script>

View File

@ -1,5 +1,7 @@
// JS for all web interface editing / deletion of scrobble data // JS for all web interface editing / deletion of scrobble data
function toggleDeleteConfirm(element) { function toggleDeleteConfirm(element) {
element.parentElement.parentElement.classList.toggle('active'); element.parentElement.parentElement.classList.toggle('active');
} }
@ -22,15 +24,22 @@ function selectAll(e) {
} }
function editEntity() { function editEntity() {
var namefield = document.getElementById('main_entity_name'); var namefield = document.getElementById('main_entity_name');
namefield.contentEditable = "plaintext-only"; namefield.contentEditable = "plaintext-only";
namefield.addEventListener('keydown',function(e){
// dont allow new lines, done on enter // dont allow new lines, done on enter
namefield.addEventListener('keypress',function(e){ if (e.key === "Enter") {
if (e.which === 13) {
e.preventDefault(); e.preventDefault();
namefield.blur(); // this leads to below namefield.blur(); // this leads to below
} }
// cancel on esc
else if (e.key === "Escape" || e.key === "Esc") {
e.preventDefault();
namefield.innerHTML = entity_name;
namefield.blur();
}
}) })
// emergency, not pretty because it will move cursor // emergency, not pretty because it will move cursor
@ -54,7 +63,9 @@ function editEntity() {
function doneEditing() { function doneEditing() {
var namefield = document.getElementById('main_entity_name'); var namefield = document.getElementById('main_entity_name');
namefield.contentEditable = "false"; namefield.contentEditable = "false";
newname = document.getElementById('main_entity_name').innerHTML; newname = namefield.innerHTML;
if (newname != entity_name) {
var searchParams = new URLSearchParams(window.location.search); var searchParams = new URLSearchParams(window.location.search);
if (entity_type == 'artist') { if (entity_type == 'artist') {
@ -76,3 +87,6 @@ function doneEditing() {
json=true json=true
); );
} }
}