Uhlazení JavaScriptu
This commit is contained in:
parent
e205ca52d3
commit
c54e11f25a
4 changed files with 27 additions and 47 deletions
|
@ -80,6 +80,7 @@ img{background:white;}
|
|||
padding: 3px;
|
||||
border: 2px solid rgb(var(--rgb));
|
||||
border-radius: 10px;
|
||||
position: absolute;
|
||||
|
||||
&:hover {
|
||||
border-width:3px;
|
||||
|
|
|
@ -1,56 +1,40 @@
|
|||
const W_SKIP = 10;
|
||||
const H_SKIP = 5;
|
||||
const POINTER_MIN_H = 30;
|
||||
|
||||
function place_comments_one_div(img_id, comments)
|
||||
{
|
||||
var img = document.getElementById("img-"+img_id);
|
||||
if( img == null ) {
|
||||
return;
|
||||
}
|
||||
var par = img.parentNode;
|
||||
var w = img.clientWidth;
|
||||
var h = img.clientHeight;
|
||||
var w_skip = 10;
|
||||
var h_skip = 5;
|
||||
var pointer_min_h = 30;
|
||||
const img = document.getElementById("img-"+img_id);
|
||||
if( img == null ) return;
|
||||
const comments_sorted = comments.sort((a, b) => a.y - b.y);
|
||||
|
||||
var bott_max = 0;
|
||||
var comments_sorted = comments.sort(function (a,b) {
|
||||
return a.y - b.y;
|
||||
const par = img.parentNode;
|
||||
const w = img.clientWidth;
|
||||
|
||||
});
|
||||
let bott_max = 0;
|
||||
for (const oprava of comments_sorted) {
|
||||
const x = oprava.x;
|
||||
const y = oprava.y;
|
||||
const el = oprava.htmlElement;
|
||||
const elp = oprava.pointer;
|
||||
const htmlElement = oprava.htmlElement;
|
||||
const pointer = oprava.pointer;
|
||||
|
||||
if( el == null || elp == null ) {
|
||||
continue;
|
||||
}
|
||||
par.appendChild(pointer);
|
||||
par.appendChild(htmlElement);
|
||||
|
||||
par.appendChild(elp);
|
||||
par.appendChild(el);
|
||||
const delta_y = (y > bott_max) ? 0: bott_max - y + H_SKIP;
|
||||
|
||||
var delta_y = (y > bott_max) ? 0: bott_max - y + h_skip;
|
||||
pointer.style.left = x;
|
||||
pointer.style.top = y;
|
||||
pointer.style.width = w - x + W_SKIP;
|
||||
pointer.style.height = POINTER_MIN_H + delta_y;
|
||||
|
||||
elp.style.left = x;
|
||||
elp.style.top = y ;
|
||||
elp.style.width = w - x + w_skip;
|
||||
elp.style.height = pointer_min_h + delta_y;
|
||||
htmlElement.style.left = w + W_SKIP;
|
||||
htmlElement.style.top = y + delta_y;
|
||||
|
||||
el.pointer = elp;
|
||||
el.img_id = img_id;
|
||||
el.x = x
|
||||
el.y = y
|
||||
el.style.position = 'absolute';
|
||||
el.style.left = w + w_skip;
|
||||
el.style.top = y + delta_y;
|
||||
|
||||
var bott = el.offsetTop + el.offsetHeight;
|
||||
bott_max = ( bott_max > bott ) ? bott_max : bott;
|
||||
bott_max = Math.max(bott_max, htmlElement.offsetTop + htmlElement.offsetHeight);
|
||||
}
|
||||
if( par.offsetHeight < bott_max ) {
|
||||
par.style.height = bott_max;
|
||||
|
||||
}
|
||||
if (par.offsetHeight < bott_max) par.style.height = bott_max;
|
||||
}
|
||||
|
||||
function place_comments() {
|
||||
|
|
|
@ -38,7 +38,7 @@
|
|||
|
||||
//fill up comment form and show him
|
||||
function show_form(img_id, dx, dy, id, text, action) {
|
||||
var img = document.getElementById("img-" + img_id);
|
||||
const img = document.getElementById("img-" + img_id);
|
||||
|
||||
if (commform._div.style.display !== 'none' && commform._text.value !== "" && !confirm("Zavřít předchozí okénko přidávání korektury / editace komentáře?")) return 1;
|
||||
|
||||
|
|
|
@ -91,7 +91,7 @@
|
|||
this.htmlElement.addEventListener('mouseout', _ => this.pointer.dataset.highlight = 'false');
|
||||
|
||||
opravy[this.id] = this;
|
||||
comments[this.img_id].push(this);
|
||||
if (this.img_id in comments) comments[this.img_id].push(this); else alert("Někdo korekturoval stranu, která neexistuje. Dejte vědět webařům :)");
|
||||
}
|
||||
|
||||
update(oprava_data) {
|
||||
|
@ -116,9 +116,7 @@
|
|||
#toggle_visibility(){
|
||||
this.zobrazit = !this.zobrazit;
|
||||
this.htmlElement.dataset.opravazobrazit = String(this.zobrazit);
|
||||
for (let i=0;i<comments.length-1;i++){
|
||||
place_comments_one_div(comments[i][0], comments[i][1])
|
||||
}
|
||||
place_comments()
|
||||
}
|
||||
|
||||
// show comment form, when 'comment' button pressed
|
||||
|
@ -127,11 +125,8 @@
|
|||
#zmenStavKorektury(event) {
|
||||
const data = new FormData(CSRF_FORM);
|
||||
data.append('id', this.id);
|
||||
console.log(event)
|
||||
data.append('action', event.target.value);
|
||||
|
||||
console.log(data)
|
||||
|
||||
fetch('{% url "korektury_api_oprava_stav" %}', {method: 'POST', body: data})
|
||||
.then(response => {
|
||||
if (!response.ok) {alert('Něco se nepovedlo:' + response.statusText);}
|
||||
|
|
Loading…
Reference in a new issue