diff --git a/korektury/templates/korektury/korekturovatko/moduly/dalsi_korektura.html b/korektury/templates/korektury/korekturovatko/moduly/dalsi_korektura.html index 25a0c379..fb4a5006 100644 --- a/korektury/templates/korektury/korekturovatko/moduly/dalsi_korektura.html +++ b/korektury/templates/korektury/korekturovatko/moduly/dalsi_korektura.html @@ -38,8 +38,9 @@ Nemusíš mačkat, pokud ti stačí, že se korektury aktualizují samy každé function dalsi_nebo_predchozi_korektura(dalsi=true, stav=null) { let predchozi = null; - for (let [_, korektury] of Object.entries(korektury_na_strankach)) { - for (const korektura of korektury) { + for (const strana of setrizene_strany) { + // strana.setrid_korektury(); // Nemělo by být potřeba, protože se volá vždy, když se renderují korektury. + for (const korektura of strana.korektury) { if (stav == null || korektura.stav === stav) { const y = korektura.htmlElement.getBoundingClientRect().y; if (y >= -1) { diff --git a/korektury/templates/korektury/korekturovatko/moduly/edit_komentar.html b/korektury/templates/korektury/korekturovatko/moduly/edit_komentar.html index a10e928a..02e0e055 100644 --- a/korektury/templates/korektury/korekturovatko/moduly/edit_komentar.html +++ b/korektury/templates/korektury/korekturovatko/moduly/edit_komentar.html @@ -48,26 +48,25 @@ schovej() { this.div.style.display = 'none'; } // zobrazí korekturovací formulář - _zobraz(img_id, x, y) { + _zobraz(strana, x, y) { this.odesilaci_button.disabled = false; this.div.style.display = 'block'; this.div.style.left = x; this.div.style.top = y; - const img = document.getElementById("img-" + img_id); - img.parentNode.appendChild(korekturovaci_formular.div); + strana.htmlElement_div.appendChild(korekturovaci_formular.div); this.text.focus(); } // fill up comment form and show him - zobraz(img_id, x, y, text, korektura_id=-1, komentar_id=-1) { + zobraz(strana, x, y, text, korektura_id=-1, komentar_id=-1) { if (this.div.style.display !== 'none' && this.text.value !== "" && !confirm("Zavřít předchozí okénko přidávání korektury / editace komentáře?")) return; // set hidden values this.x = x; this.y = y; - this.imgID = img_id; + this.strana = strana; this.korektura_id = korektura_id; this.komentar_id = komentar_id; this.text.value = text; @@ -83,7 +82,7 @@ tag.dataset.vybran = String(korektura.tagy.has(parseInt(tag.value))); } - this._zobraz(img_id, x, y); + this._zobraz(strana, x, y); } odesli_formular() { @@ -91,7 +90,7 @@ const data = new FormData(CSRF_FORM); data.append('x', this.x); data.append('y', this.y); - data.append('img_id', this.imgID); + data.append('img_id', this.strana.id); data.append('oprava_id', this.korektura_id); data.append('komentar_id', this.komentar_id); diff --git a/korektury/templates/korektury/korekturovatko/moduly/komentar.html b/korektury/templates/korektury/korekturovatko/moduly/komentar.html index a4c7e1f0..748a9d48 100644 --- a/korektury/templates/korektury/korekturovatko/moduly/komentar.html +++ b/korektury/templates/korektury/korekturovatko/moduly/komentar.html @@ -81,7 +81,7 @@ // Ukaž formulář na editaci komentáře (když je zmáčknuto „uprav-komentar“) #uprav_komentar() { - return korekturovaci_formular.zobraz(this.korektura.img_id, this.korektura.x, this.korektura.y, this.#text.textContent, this.korektura.id, this.id); + return korekturovaci_formular.zobraz(this.korektura.strana, this.korektura.x, this.korektura.y, this.#text.textContent, this.korektura.id, this.id); } // Smaž komentář (když je zmáčknuto „smaz-komentar“) diff --git a/korektury/templates/korektury/korekturovatko/moduly/korektura.html b/korektury/templates/korektury/korekturovatko/moduly/korektura.html index 1c73bc39..1f90e104 100644 --- a/korektury/templates/korektury/korekturovatko/moduly/korektura.html +++ b/korektury/templates/korektury/korekturovatko/moduly/korektura.html @@ -71,7 +71,7 @@ #komentare; #tagy; htmlElement; pointer; - id; x; y; img_id; stav; sbalena = false; {# korektura_data; #} + id; x; y; strana; stav; sbalena = false; {# korektura_data; #} tagy; constructor(korektura_data) { @@ -86,7 +86,6 @@ this.x = korektura_data['x']; this.y = korektura_data['y']; - this.img_id = korektura_data['strana']; this.aktualizuj(korektura_data); @@ -102,8 +101,12 @@ this.htmlElement.addEventListener('mouseover', _ => this.pointer.dataset.hover = 'true'); this.htmlElement.addEventListener('mouseout', _ => this.pointer.dataset.hover = 'false'); + const cislo_strany = korektura_data['strana']; + if (cislo_strany in strany) { + this.strana = strany[cislo_strany]; + this.strana.korektury.push(this); + } else alert("Někdo korekturoval stranu, která neexistuje. Dejte vědět webařům :)"); korektury[this.id] = this; - if (this.img_id in korektury_na_strankach) korektury_na_strankach[this.img_id].push(this); else alert("Někdo korekturoval stranu, která neexistuje. Dejte vědět webařům :)"); } aktualizuj(korektura_data) { @@ -143,7 +146,7 @@ } // Ukaž komentovací formulář (když je zmáčknuto komentovat) - #komentuj() { korekturovaci_formular.zobraz(this.img_id, this.x, this.y, "", this.id); } + #komentuj() { korekturovaci_formular.zobraz(this.strana, this.x, this.y, "", this.id); } #zmen_stav_korektury(event) { const data = new FormData(CSRF_FORM); @@ -178,57 +181,11 @@ } #smaz_pouze_na_strance() { - korektury_na_strankach[this.img_id].splice(korektury_na_strankach[this.img_id].indexOf(this), 1); + this.strana.korektury.splice(this.strana.korektury.indexOf(this), 1); delete korektury[this.id]; for (const komentar of Object.values(komentare)) if (komentar.korektura === this) komentar.smaz_pouze_na_strance(); this.htmlElement.remove(); this.pointer.remove(); } } - - // Umisťování korektur - const HORIZONTALNI_MEZERA = 10; - const VERTIKALNI_MEZERA = 5; - const MINIMALNI_VYSKA_POINTERU = 30; - - function umisti_korektury_na_jedne_strance(strana, korektury) - { - const strana_img = document.getElementById("img-"+strana); - if( strana_img == null ) return; - const setridene_korektury = korektury.sort((a, b) => a.y - b.y); - - const img_div = strana_img.parentNode; - const w = strana_img.clientWidth; - - let spodek_posledni_korektury = 0; - for (const korektura of setridene_korektury) { - const x = korektura.x; - const y = korektura.y; - const htmlElement = korektura.htmlElement; - const pointer = korektura.pointer; - - img_div.appendChild(pointer); - img_div.appendChild(htmlElement); - - const delta_y = (y > spodek_posledni_korektury) ? 0: spodek_posledni_korektury - y + VERTIKALNI_MEZERA; - - pointer.style.left = x; - pointer.style.top = y; - pointer.style.width = w - x + HORIZONTALNI_MEZERA; - pointer.style.height = MINIMALNI_VYSKA_POINTERU + delta_y; - - htmlElement.style.left = w + HORIZONTALNI_MEZERA; - htmlElement.style.top = y + delta_y; - - spodek_posledni_korektury = Math.max(spodek_posledni_korektury, htmlElement.offsetTop + htmlElement.offsetHeight + VERTIKALNI_MEZERA); // FIXME nemám páru, proč +H_SKIP funguje, ale opravuje to bug, že nově vytvořené korektury za sebou neměly mezeru - } - - if (img_div.offsetHeight < spodek_posledni_korektury) img_div.style.height = spodek_posledni_korektury; - } - - function umisti_korektury() { - for (let [img_id, korektury] of Object.entries(korektury_na_strankach)) { - umisti_korektury_na_jedne_strance(img_id, korektury) - } - } </script> diff --git a/korektury/templates/korektury/korekturovatko/moduly/stranky_pdfka.html b/korektury/templates/korektury/korekturovatko/moduly/stranky_pdfka.html index 7398b0ac..b6096edf 100644 --- a/korektury/templates/korektury/korekturovatko/moduly/stranky_pdfka.html +++ b/korektury/templates/korektury/korekturovatko/moduly/stranky_pdfka.html @@ -13,42 +13,96 @@ {% endfor %} <script> - // Mapování stránka -> korektury - /** - * @type {Object.<number, Array<Korektura>>} - */ - const korektury_na_strankach = { - {% for s in img_indexes %} - {{s}}: []{% if not forloop.last %},{% endif %} - {% endfor %} - }; + // Pro umisťování korektur + const HORIZONTALNI_MEZERA = 10; + const VERTIKALNI_MEZERA = 5; + const MINIMALNI_VYSKA_POINTERU = 30; - // show comment form, when clicked to image - for (const strana_img of document.getElementsByClassName('strana')) { - strana_img.addEventListener('click', event => { + /** + * @type {Object.<int, Strana>} + */ + const strany = {}; + + class Strana { + htmlElement_img; htmlElement_div; + id; korektury; + + constructor(htmlElement_img) { + this.htmlElement_img = htmlElement_img; + this.htmlElement_div = this.htmlElement_img.parentNode; + + this.id = parseInt(this.htmlElement_img.id.substring(4)); + this.korektury = [] + + this.htmlElement_img.addEventListener('click', event => this.#korekturuj(event)); + + strany[this.id] = this; + } + + #korekturuj(event) { switch (document.body.dataset.stav_pdf) { case 'zanaseni': - if (!confirm('Právě jsou zanášeny korektury, opravdu chcete přidat novou?')) - return; + if (!confirm('Právě jsou zanášeny korektury, opravdu chcete přidat novou?')) return; break; case 'zastarale': - if (!confirm('Toto PDF je již zastaralé, opravdu chcete vytvořit korekturu?')) - return; + if (!confirm('Toto PDF je již zastaralé, opravdu chcete vytvořit korekturu?')) return; break; } let dx, dy; - const strana_div = strana_img.parentNode; if (event.pageX != null) { - dx = event.pageX - strana_div.offsetLeft; - dy = event.pageY - strana_div.offsetTop; + dx = event.pageX - this.htmlElement_div.offsetLeft; + dy = event.pageY - this.htmlElement_div.offsetTop; } else { //IE a další dx = event.offsetX; dy = event.offsetY; } - const img_id = strana_img.id.substring(4); - korekturovaci_formular.zobraz(img_id, dx, dy, ''); - console.log("Pro přesun korektur: strana = " + img_id + ", x = " + dx + ", y = " + dy); - }); + korekturovaci_formular.zobraz(this, dx, dy, ''); + console.log("Pro přesun korektur: strana = " + this.id + ", x = " + dx + ", y = " + dy); + } + + setrid_korektury() { this.korektury.sort((a, b) => a.y - b.y); } + + umisti_korektury() { + this.setrid_korektury() + + const w = this.htmlElement_img.clientWidth; + + let spodek_posledni_korektury = 0; + for (const korektura of this.korektury) { + const x = korektura.x; + const y = korektura.y; + const pointer = korektura.pointer; + + this.htmlElement_div.appendChild(pointer); + this.htmlElement_div.appendChild(korektura.htmlElement); + + const delta_y = (y > spodek_posledni_korektury) ? 0: spodek_posledni_korektury - y + VERTIKALNI_MEZERA; + + pointer.style.left = x; + pointer.style.top = y; + pointer.style.width = w - x + HORIZONTALNI_MEZERA; + pointer.style.height = MINIMALNI_VYSKA_POINTERU + delta_y; + + korektura.htmlElement.style.left = w + HORIZONTALNI_MEZERA; + korektura.htmlElement.style.top = y + delta_y; + + spodek_posledni_korektury = Math.max( + spodek_posledni_korektury, + korektura.htmlElement.offsetTop + korektura.htmlElement.offsetHeight + VERTIKALNI_MEZERA + ); // FIXME nemám páru, proč +VERTIKALNI_MEZERA funguje, ale opravuje to bug, že nově vytvořené korektury za sebou neměly mezeru + } + + if (this.htmlElement_div.offsetHeight < spodek_posledni_korektury) + this.htmlElement_div.style.height = spodek_posledni_korektury; + } } + + for (const strana_img of document.getElementsByClassName('strana')) + new Strana(strana_img); + + const setrizene_strany = Object.values(strany); + setrizene_strany.sort((a, b) => a.htmlElement_img.offsetTop - b.htmlElement_img.offsetTop); + + function umisti_korektury() { for (const strana of Object.values(strany)) strana.umisti_korektury(); } </script>