lfk/frontend
2
0
Fork 0
Code Issues 3 Pull Requests Actions Projects Releases Wiki Activity

Track edit animation

Browse Source 
ref #11
This commit is contained in:
Philipp Dormann 2021-01-05 21:38:57 +01:00
parent 34ecb8b2fb
commit e5fcb2ef68
1 changed files with 40 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/components/Tracks.svelte
View File

@ -1,5 +1,6 @@
<script> <script>
import { _, json } from "svelte-i18n"; import { _, json } from "svelte-i18n";
import Toastify from "toastify-js";
import TracksEmptyState from "./TracksEmptyState.svelte"; import TracksEmptyState from "./TracksEmptyState.svelte";
import { TrackService } from "@odit/lfk-client-js"; import { TrackService } from "@odit/lfk-client-js";
const tracks_promise = TrackService.trackControllerGetAll(); const tracks_promise = TrackService.trackControllerGetAll();
@ -8,6 +9,7 @@
import "gridjs/dist/theme/mermaid.css"; import "gridjs/dist/theme/mermaid.css";
import { tracks as tracksstore } from "../store.js"; import { tracks as tracksstore } from "../store.js";
$: trackscache = []; $: trackscache = [];
$: blocked = [];
let table; let table;
let datatable; let datatable;
let datatable_inited = false; let datatable_inited = false;
@ -25,30 +27,45 @@
window.track__edit_cancel = () => renderdatatable(); window.track__edit_cancel = () => renderdatatable();
window.track__edit_save = () => { window.track__edit_save = () => {
const trackid = parseInt(window.event.target.getAttribute("data-trackid")); const trackid = parseInt(window.event.target.getAttribute("data-trackid"));
document if (blocked.includes(trackid)) {
.querySelector(`[data-id="default_table_actions_${trackid}"]`) //
.classList.remove("hidden"); } else {
document blocked.push(trackid);
.querySelector(`[data-id="triggered_table_actions_${trackid}"]`) const elem = document.querySelector(
.classList.add("hidden"); `[data-id="triggered_table_actions_${trackid}"]`
// ).parentNode.parentNode.parentNode;
const elem = document.querySelector( Toastify({
`[data-id="triggered_table_actions_${trackid}"]` text: "Track is being updated...",
).parentNode.parentNode.parentNode; duration: 500,
TrackService.trackControllerPut(trackid, { }).showToast();
id: trackid, TrackService.trackControllerPut(trackid, {
name: elem.childNodes[0].childNodes[0].value, id: trackid,
distance: parseInt(elem.childNodes[1].childNodes[0].value), name: elem.childNodes[0].childNodes[0].value,
minimumLapTime: parseInt(elem.childNodes[2].childNodes[0].value), distance: parseInt(elem.childNodes[1].childNodes[0].value),
}) minimumLapTime: parseInt(elem.childNodes[2].childNodes[0].value),
.then((r) => {
elem.childNodes[0].innerHTML = `<td data-column-id="trackName" class="gridjs-td">${elem.childNodes[0].childNodes[0].value}</td>`;
elem.childNodes[1].innerHTML = `<td data-column-id="trackName" class="gridjs-td">${elem.childNodes[1].childNodes[0].value}</td>`;
elem.childNodes[2].innerHTML = `<td data-column-id="trackName" class="gridjs-td">${elem.childNodes[2].childNodes[0].value}</td>`;
}) })
.catch((err) => { .then((r) => {
console.error(err); Toastify({
}); text: "Track was updated!",
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
duration: 1000,
}).showToast();
blocked = blocked.filter((e) => e !== trackid);
document
.querySelector(`[data-id="default_table_actions_${trackid}"]`)
.classList.remove("hidden");
document
.querySelector(`[data-id="triggered_table_actions_${trackid}"]`)
.classList.add("hidden");
//
elem.childNodes[0].innerHTML = `<td data-column-id="trackName" class="gridjs-td">${elem.childNodes[0].childNodes[0].value}</td>`;
elem.childNodes[1].innerHTML = `<td data-column-id="trackName" class="gridjs-td">${elem.childNodes[1].childNodes[0].value}</td>`;
elem.childNodes[2].innerHTML = `<td data-column-id="trackName" class="gridjs-td">${elem.childNodes[2].childNodes[0].value}</td>`;
})
.catch((err) => {
console.error(err);
});
}
}; };
window.track__delete_handler = () => { window.track__delete_handler = () => {
const trackid = parseInt(window.event.target.getAttribute("data-trackid")); const trackid = parseInt(window.event.target.getAttribute("data-trackid"));