Vytváření korektur z jednoho prototypu
This commit is contained in:
		
							parent
							
								
									a4175f836e
								
							
						
					
					
						commit
						44a8649d0e
					
				
					 6 changed files with 294 additions and 148 deletions
				
			
		|  | @ -1,5 +1,6 @@ | ||||||
| .textzanaseni { display:none; } | .textzanaseni { display:none; } | ||||||
| .textzastarale { display:none; } | .textzastarale { display:none; } | ||||||
|  | #prekomentar, #preoprava, #prepointer { display: none; } | ||||||
| 
 | 
 | ||||||
| body { | body { | ||||||
| 	&[data-status="pridavani"] { | 	&[data-status="pridavani"] { | ||||||
|  | @ -96,6 +97,8 @@ img{background:white;} | ||||||
| 		} | 		} | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
|  | 	button img { pointer-events: none; } | ||||||
|  | 
 | ||||||
| 	.corr-header { | 	.corr-header { | ||||||
| 		overflow: auto; | 		overflow: auto; | ||||||
| 	} | 	} | ||||||
|  |  | ||||||
|  | @ -1,7 +1,7 @@ | ||||||
| function place_comments_one_div(img_id, comments) | function place_comments_one_div(img_id, comments) | ||||||
| { | { | ||||||
| 	var img = document.getElementById(img_id); | 	var img = document.getElementById(img_id); | ||||||
| 	if( img == null ) {  | 	if( img == null ) { | ||||||
| 		return; | 		return; | ||||||
| 	} | 	} | ||||||
| 	var par = img.parentNode; | 	var par = img.parentNode; | ||||||
|  | @ -27,8 +27,13 @@ function place_comments_one_div(img_id, comments) | ||||||
| 		var x  = comments_sorted[c][1]; | 		var x  = comments_sorted[c][1]; | ||||||
| 		var y  = comments_sorted[c][2]; | 		var y  = comments_sorted[c][2]; | ||||||
| 
 | 
 | ||||||
| 		var el = document.getElementById(id); |         if (!(id in opravy)) { | ||||||
| 		var elp = document.getElementById(id + "-pointer"); |             console.log(id) | ||||||
|  |             continue; | ||||||
|  |         } | ||||||
|  |         var op = opravy[id]; | ||||||
|  |         var el = op.htmlElement; | ||||||
|  | 		var elp = op.pointer; | ||||||
| 
 | 
 | ||||||
| 		if( el == null  || elp == null ) {  | 		if( el == null  || elp == null ) {  | ||||||
| 			continue; | 			continue; | ||||||
|  | @ -67,63 +72,4 @@ function place_comments() { | ||||||
|     } |     } | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| // show comment form, when clicked to image
 |  | ||||||
| function img_click(element, ev) { |  | ||||||
| 	switch(document.body.dataset.status){ |  | ||||||
| 		case "zanaseni": |  | ||||||
| 			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; |  | ||||||
| 			break; |  | ||||||
| 	} |  | ||||||
| 
 |  | ||||||
| 	var dx, dy; |  | ||||||
| 	var par = element.parentNode; |  | ||||||
| 	if( ev.pageX != null ) {  |  | ||||||
| 		dx = ev.pageX - par.offsetLeft; |  | ||||||
| 		dy = ev.pageY - par.offsetTop; |  | ||||||
| 	} else { //IE
 |  | ||||||
| 		dx = ev.offsetX; |  | ||||||
| 		dy = ev.offsetY; |  | ||||||
| 	} |  | ||||||
| 	var img_id = element.id; |  | ||||||
| 	return show_form(img_id, dx, dy, '', '', ''); |  | ||||||
| } |  | ||||||
| // hide or show text of correction
 |  | ||||||
| function toggle_visibility(oprava){ |  | ||||||
|     oprava.dataset.opravazobrazit = oprava.dataset.opravazobrazit !== 'true'; |  | ||||||
| 	for (var i=0;i<comments.length-1;i++){ |  | ||||||
| 		 place_comments_one_div(comments[i][0], comments[i][1]) |  | ||||||
| 	} |  | ||||||
| }  |  | ||||||
| 
 |  | ||||||
| // show comment form, when 'comment' button pressed
 |  | ||||||
| function comment(op) |  | ||||||
| { |  | ||||||
|     return show_form(op.img_id, op.x, op.y, op.dataset.opid, "", "comment"); |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| // show comment form when 'update-comment' button pressed
 |  | ||||||
| function update_comment(oid,ktid) |  | ||||||
| { |  | ||||||
|     var op = document.getElementById(oid); |  | ||||||
| 	var text = document.getElementById(ktid).textContent; |  | ||||||
| 
 |  | ||||||
| 	return show_form(op.img_id, op.x, op.y, ktid.substring(2), text, 'update-comment'); |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| function oprava_onmouseover(op) |  | ||||||
| { |  | ||||||
| 	var pointer = op.pointer; |  | ||||||
|     pointer.dataset.highlight = "true"; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| function oprava_onmouseout(op) |  | ||||||
| { |  | ||||||
| 	var pointer = op.pointer; |  | ||||||
|     pointer.dataset.highlight = "false"; |  | ||||||
| } |  | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -38,7 +38,7 @@ | ||||||
| 
 | 
 | ||||||
|   //fill up comment form and show him |   //fill up comment form and show him | ||||||
|   function show_form(img_id, dx, dy, id, text, action) { |   function show_form(img_id, dx, dy, id, text, action) { | ||||||
|     var img = document.getElementById(img_id); |     var 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; |     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; | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -1,23 +1,86 @@ | ||||||
| {% load static %} | {% load static %} | ||||||
| 
 | 
 | ||||||
| <div class='comment' id='k{{k.id}}'> | <div class='comment' id='prekomentar' {# id='k{{k.id}}' #}> | ||||||
|   <div class='corr-header'> |   <div class='corr-header'> | ||||||
|     <div class='author'>{{k.autor}}</div> |     <div class='author'>{# {{k.autor}} #}</div> | ||||||
|     <div class="float-right"> | 
 | ||||||
|       <!-- Komentar !--> |     <div class='float-right'> | ||||||
|       <form  action='' method='POST'> |       <button type='button' style='display: none' class='del-comment' title='Smaž komentář'> | ||||||
|         {% csrf_token %} |         <img src='{% static "korektury/imgs/delete.png" %}' alt='del'/> | ||||||
|         <input type='hidden' name='id' value='{{k.id}}'> |       </button> | ||||||
|         <button style="display: none" type='submit' name='action' value='del-comment' title='Smaž komentář' | 
 | ||||||
|                 onclick='return confirm("Opravdu smazat komentář?")'> |       <button type='button' class='update-comment' title='Uprav komentář'> | ||||||
|           <img src="{% static "korektury/imgs/delete.png" %}"/> |         <img src='{% static "korektury/imgs/edit.png"%}' alt='edit'/> | ||||||
|         </button> |  | ||||||
|       </form> |  | ||||||
|       <!-- /Komentar !--> |  | ||||||
|       <button type='button' onclick="update_comment('op{{o.id}}','kt{{k.id}}');" title='Uprav komentář'> |  | ||||||
|         <img src="{% static "korektury/imgs/edit.png"%}"/> |  | ||||||
|       </button> |       </button> | ||||||
|     </div> |     </div> | ||||||
|  | 
 | ||||||
|   </div> |   </div> | ||||||
|   <div id='kt{{k.id}}'>{{k.text|linebreaks}}</div> | 
 | ||||||
|  |   <div class='komtext'>{# {{k.text|linebreaks}} #}</div> | ||||||
| </div> | </div> | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | <script> | ||||||
|  |   const prekomentar = document.getElementById('prekomentar'); | ||||||
|  |   const komentare = {}; | ||||||
|  | 
 | ||||||
|  |   class Komentar { | ||||||
|  |     static update_or_create(komentar_data, oprava) { | ||||||
|  |       const id = komentar_data['id']; | ||||||
|  |       if (id in komentare) komentare[id].update(komentar_data); | ||||||
|  |       else new Komentar(komentar_data, oprava); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     #autor; #text; | ||||||
|  |     htmlElement; | ||||||
|  |     id; oprava; {# komentar_data; #} | ||||||
|  | 
 | ||||||
|  |     /** | ||||||
|  |      * | ||||||
|  |      * @param komentar_data | ||||||
|  |      * @param {Oprava} oprava | ||||||
|  |      */ | ||||||
|  |     constructor(komentar_data, oprava) { | ||||||
|  |       this.htmlElement = prekomentar.cloneNode(true); | ||||||
|  |       this.#autor = this.htmlElement.getElementsByClassName('author')[0]; | ||||||
|  |       this.#text = this.htmlElement.getElementsByClassName('komtext')[0]; | ||||||
|  | 
 | ||||||
|  |       this.id = komentar_data['id']; | ||||||
|  |       this.htmlElement.id = 'k' + this.id; | ||||||
|  | 
 | ||||||
|  |       this.oprava = oprava; | ||||||
|  |       this.oprava.add_komentar_htmlElement(this.htmlElement); | ||||||
|  | 
 | ||||||
|  |       this.update(komentar_data); | ||||||
|  | 
 | ||||||
|  |       this.htmlElement.getElementsByClassName('update-comment')[0].addEventListener('click', _ => this.#update_comment()); | ||||||
|  |       this.htmlElement.getElementsByClassName('del-comment')[0].addEventListener('click', _ => this.#delete_comment()); | ||||||
|  | 
 | ||||||
|  |       komentare[this.id] = this; | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     update(komentar_data) { | ||||||
|  |       {# this.komentar_data = komentar_data; #} | ||||||
|  |       this.set_autor(komentar_data['autor']); | ||||||
|  |       this.set_text(komentar_data['text']); | ||||||
|  |     }; | ||||||
|  | 
 | ||||||
|  |     set_autor(autor) {this.#autor.textContent=autor;}; | ||||||
|  |     set_text(text) { | ||||||
|  |       this.#text.innerHTML=text; | ||||||
|  |     }; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |     // show comment form when 'update-comment' button pressed | ||||||
|  |     #update_comment() { | ||||||
|  |       return show_form(this.oprava.img_id, this.oprava.x, this.oprava.y, this.id, this.#text.textContent, 'update-comment'); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     #delete_comment() { | ||||||
|  |       if (confirm('Opravdu smazat komentář?')) { | ||||||
|  |         throw {name : 'NotImplementedError', message: '(Webaři jsou) too lazy to implement'}; | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | </script> | ||||||
|  |  | ||||||
|  | @ -1,63 +1,148 @@ | ||||||
| {% load static %} | {% load static %} | ||||||
| 
 | 
 | ||||||
| <div | <div id='prepointer' {# id='op{{o.id}}-pointer' #} | ||||||
|      id='op{{o.id}}-pointer' |  | ||||||
|      class='pointer' |      class='pointer' | ||||||
|      data-highlight="false" |      data-highlight='false' | ||||||
|      data-opravastatus="{{o.status}}" |      {# data-opravastatus='{{o.status}}' #} | ||||||
| > | ></div> | ||||||
| </div> | 
 | ||||||
| <div name='op{{o.id}}' id='op{{o.id}}' | <div id='preoprava' {# name='op{{o.id}}' id='op{{o.id}}' #} | ||||||
|      class='oprava' |      class='oprava' | ||||||
|      data-opravastatus="{{o.status}}" |      {# data-opravastatus='{{o.status}}' #} | ||||||
|      data-opravazobrazit="true" |      data-opravazobrazit='true' | ||||||
|      data-opid="{{o.id}}" |  | ||||||
|      onmouseover='oprava_onmouseover(this)' |  | ||||||
|      onmouseout='oprava_onmouseout(this)' |  | ||||||
| > | > | ||||||
| 
 |  | ||||||
|   <div class='corr-body'> |   <div class='corr-body'> | ||||||
|     {% for k in o.komentare %} |     {# {% for k in o.komentare %} {% include "korektury/korekturovatko/__komentar.html" %} <hr> {% endfor %} #} | ||||||
|       {% include "korektury/korekturovatko/__komentar.html" %} |  | ||||||
|       <hr> |  | ||||||
|     {% endfor %} |  | ||||||
|   </div> |   </div> | ||||||
|  | 
 | ||||||
|   <div class='corr-header'> |   <div class='corr-header'> | ||||||
| 			<span class='float-right'> |     <span class='float-right'> | ||||||
| 				<span class='corr-buttons'> |       <span class='corr-buttons'> | ||||||
| 	  			<form action='' method='POST'> |         <button type='button' style='display: none' class='del' title='Smaž opravu'> | ||||||
| 	   				{% csrf_token %} |           <img src='{% static "korektury/imgs/delete.png"%}' alt='🗑️'/> | ||||||
| 	   				<input type='hidden' name='id' value='{{o.id}}'> |         </button> | ||||||
|  |         <button type='button' class='action' value='k_oprave' title='Označ jako neopravené'> | ||||||
|  |           <img src='{% static "korektury/imgs/undo.png"%}' alt='↪'/> | ||||||
|  |         </button> | ||||||
|  |         <button type='button' class='action' value='opraveno' title='Označ jako opravené'> | ||||||
|  |           <img src='{% static "korektury/imgs/check.png"%}' alt='✔️'/> | ||||||
|  |         </button> | ||||||
|  |         <button type='button' class='action' value='neni_chyba' title='Označ, že se nebude měnit'> | ||||||
|  |           <img src='{% static "korektury/imgs/cross.png" %}' alt='❌'/> | ||||||
|  |         </button> | ||||||
|  |         <button type='button' class='action' value='k_zaneseni' title='Označ jako připraveno k zanesení'> | ||||||
|  |           <img src='{% static "korektury/imgs/tex.png" %}' alt='TeX'/> | ||||||
|  |         </button> | ||||||
| 
 | 
 | ||||||
| 					<button style="display: none" type='submit' name='action' value='del' title='Smaž opravu'> |         <button type='button' class='notcomment' title='Korekturu nelze komentovat, protože už je uzavřená' disabled=''> | ||||||
|             <img src="{% static "korektury/imgs/delete.png"%}"/> |           <img src='{% static "korektury/imgs/comment-gr.png" %}' alt='💭'/> | ||||||
| 					</button> | 				</button> | ||||||
|               <button type='submit' name='action' value='{{ o.STATUS.K_OPRAVE }}' title='Označ jako neopravené'> |         <button type='button' class='comment' title='Komentovat'> | ||||||
|             <img src="{% static "korektury/imgs/undo.png"%}"/> |           <img src='{% static "korektury/imgs/comment.png" %}' alt='💭'/> | ||||||
| 					</button> | 				</button> | ||||||
|               <button type='submit' name='action' value='{{ o.STATUS.OPRAVENO }}' title='Označ jako opravené'> |       </span> | ||||||
|             <img src="{% static "korektury/imgs/check.png"%}"/> |  | ||||||
| 					</button> |  | ||||||
|               <button type='submit' name='action' value='{{ o.STATUS.NENI_CHYBA }}' title='Označ, že se nebude měnit'> |  | ||||||
|             <img src="{% static "korektury/imgs/cross.png" %}"/> |  | ||||||
| 					</button> |  | ||||||
|               <button type='submit' name='action' value='{{ o.STATUS.K_ZANESENI }}' title='Označ jako připraveno k zanesení'> |  | ||||||
|             <img src="{% static "korektury/imgs/tex.png" %}"/> |  | ||||||
| 					</button> |  | ||||||
| 				</form> |  | ||||||
| 
 | 
 | ||||||
|             <button type='button' value="notcomment" title='Korekturu nelze komentovat, protože už je uzavřená'> |       <button type='button' class='toggle-vis' title='Skrýt/Zobrazit'> | ||||||
|           <img src="{% static "korektury/imgs/comment-gr.png" %}"/> |         <img class='toggle-button' src='{% static "korektury/imgs/hide.png" %}' alt='⬆'/> | ||||||
| 				</button> |       </button> | ||||||
|             <button type='button' value="comment" onclick='comment(this.parentElement.parentElement.parentElement.parentElement);' title='Komentovat'> |  | ||||||
|           <img src="{% static "korektury/imgs/comment.png" %}"/> |  | ||||||
| 				</button> |  | ||||||
| 
 |  | ||||||
| 				</span> |  | ||||||
| 				<button type='button' onclick='toggle_visibility(this.parentElement.parentElement.parentElement);' title='Skrýt/Zobrazit'> |  | ||||||
|           <img class='toggle-button' src="{% static "korektury/imgs/hide.png" %}"/> |  | ||||||
| 				</button> |  | ||||||
| 
 | 
 | ||||||
| 			</span> | 			</span> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|  | 
 | ||||||
|  | <script> | ||||||
|  |   const preoprava = document.getElementById('preoprava'); | ||||||
|  |   const prepointer = document.getElementById('prepointer'); | ||||||
|  |   const opravy = {}; | ||||||
|  | 
 | ||||||
|  |   class Oprava { | ||||||
|  |     static update_or_create(oprava_data) { | ||||||
|  |       const id = oprava_data['id']; | ||||||
|  |       if (id in opravy) opravy[id].update(oprava_data); | ||||||
|  |       else new Oprava(oprava_data); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     #komentare; | ||||||
|  |     htmlElement; pointer; | ||||||
|  |     id; x; y; img_id; zobrazit = true; {# oprava_data; #} | ||||||
|  | 
 | ||||||
|  |     constructor(oprava_data) { | ||||||
|  |       this.htmlElement = preoprava.cloneNode(true); | ||||||
|  |       this.pointer = prepointer.cloneNode(true); | ||||||
|  |       this.#komentare = this.htmlElement.getElementsByClassName('corr-body')[0]; | ||||||
|  | 
 | ||||||
|  |       this.id = oprava_data['id']; | ||||||
|  |       this.htmlElement.id = 'op' + this.id; | ||||||
|  |       this.pointer.id = 'op' + this.id + '-pointer'; | ||||||
|  | 
 | ||||||
|  |       this.x = oprava_data['x']; | ||||||
|  |       this.y = oprava_data['y']; | ||||||
|  |       this.img_id = oprava_data['img_id']; | ||||||
|  | 
 | ||||||
|  |       this.update(oprava_data); | ||||||
|  | 
 | ||||||
|  |       this.htmlElement.getElementsByClassName('toggle-vis')[0].addEventListener('click', _ => this.#toggle_visibility()); | ||||||
|  |       for (const button of this.htmlElement.getElementsByClassName('action')) | ||||||
|  |         button.addEventListener('click', async event => this.#zmenStavKorektury(event)); | ||||||
|  |       this.htmlElement.getElementsByClassName('comment')[0].addEventListener('click', _ => this.#comment()) | ||||||
|  |       this.htmlElement.getElementsByClassName('del')[0].addEventListener('click', _ => this.#delete()); | ||||||
|  | 
 | ||||||
|  |       this.htmlElement.addEventListener('mouseover', _ => this.pointer.dataset.highlight = 'true'); | ||||||
|  |       this.htmlElement.addEventListener('mouseout', _ => this.pointer.dataset.highlight = 'false'); | ||||||
|  | 
 | ||||||
|  |       opravy[this.id] = this; | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     update(oprava_data) { | ||||||
|  |       {# this.oprava_data = oprava_data; #} | ||||||
|  |       this.set_status(oprava_data['status']); | ||||||
|  |     }; | ||||||
|  | 
 | ||||||
|  |     set_status(status) { | ||||||
|  |       this.htmlElement.dataset.opravastatus=status; | ||||||
|  |       this.pointer.dataset.opravastatus=status; | ||||||
|  |     }; | ||||||
|  | 
 | ||||||
|  |     add_komentar_htmlElement(htmlElement) { | ||||||
|  |       this.#komentare.appendChild(htmlElement); | ||||||
|  |       this.#komentare.appendChild(document.createElement('hr')); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |     // hide or show text of correction | ||||||
|  |     #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]) | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     // show comment form, when 'comment' button pressed | ||||||
|  |     #comment() { return show_form(this.img_id, this.x, this.y, this.id, "", "comment"); } | ||||||
|  | 
 | ||||||
|  |     #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);} | ||||||
|  |           else response.json().then(data => this.set_status(data['status'])); | ||||||
|  |         }) | ||||||
|  |         .catch(error => {alert('Něco se nepovedlo:' + error);}); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     #delete() { | ||||||
|  |       if (confirm('Opravdu smazat korekturu?')) { | ||||||
|  |         throw {name : 'NotImplementedError', message: '(Webaři jsou) too lazy to implement'}; | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | </script> | ||||||
|  |  | ||||||
|  | @ -3,10 +3,11 @@ | ||||||
| {% for i in img_indexes %} | {% for i in img_indexes %} | ||||||
|   <div class='imgdiv'> |   <div class='imgdiv'> | ||||||
|     <img |     <img | ||||||
|  |       id='img-{{i}}' | ||||||
|       width='1021' height='1448' |       width='1021' height='1448' | ||||||
|       onclick='img_click(this,event)' id='img-{{i}}' |  | ||||||
|       src='/media/korektury/img/{{img_prefix}}-{{i}}.png' |       src='/media/korektury/img/{{img_prefix}}-{{i}}.png' | ||||||
|       alt='Strana {{ i|add:1 }}' |       alt='Strana {{ i|add:1 }}' | ||||||
|  |       class="strana" | ||||||
|     /> |     /> | ||||||
|   </div> |   </div> | ||||||
| 
 | 
 | ||||||
|  | @ -14,34 +15,82 @@ | ||||||
| {% endfor %} | {% endfor %} | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| {% for o in opravy %} | {# {% for o in opravy %} {% include "korektury/korekturovatko/__oprava.html" %} {% endfor %} #} | ||||||
|   {% include "korektury/korekturovatko/__oprava.html" %} | {% include "korektury/korekturovatko/__oprava.html" %} | ||||||
| {% endfor %} | {% include "korektury/korekturovatko/__komentar.html" %} | ||||||
| 
 | 
 | ||||||
| <script> | <script> | ||||||
|   var comments = [ |   var comments = [ | ||||||
|     {% for s in opravy_strany %} |     {% for s in opravy_strany %} | ||||||
|       ["img-{{s.strana}}", [{% for o in s.op_id %}["op{{o.id}}",{{o.x}},{{o.y}}],{% endfor %}[]]], |       ["img-{{s.strana}}", [{% for o in s.op_id %}[{{o.id}},{{o.x}},{{o.y}}],{% endfor %}[]]], | ||||||
|     {% endfor %} |     {% endfor %} | ||||||
|     []] |     []] | ||||||
|  | 
 | ||||||
|  |   const data = [ | ||||||
|  |     {% for o in opravy %} | ||||||
|  |       { | ||||||
|  |         id: "{{o.id}}", | ||||||
|  |         x: "{{o.x}}", | ||||||
|  |         y: "{{o.y}}", | ||||||
|  |         img_id: "{{o.strana}}", | ||||||
|  |         status: "{{o.status}}", | ||||||
|  |         komentare: [ | ||||||
|  |           {% for k in o.komentare %} | ||||||
|  |             { | ||||||
|  |               id: "{{ k.id }}", | ||||||
|  |               text: "{{ k.text|slugify }}", | ||||||
|  |               autor: "{{k.autor}}" | ||||||
|  |             } | ||||||
|  |           {% if not forloop.last %},{% endif %} | ||||||
|  |           {% endfor %} | ||||||
|  |         ] | ||||||
|  |       } | ||||||
|  |     {% if not forloop.last %},{% endif %} | ||||||
|  |     {% endfor %} | ||||||
|  |   ]; | ||||||
|  | 
 | ||||||
|  |   for (const oprava_data of data) { | ||||||
|  |     const oprava = new Oprava(oprava_data); | ||||||
|  |     for (const komentar_data of oprava_data["komentare"]) { | ||||||
|  |       new Komentar(komentar_data, oprava); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   place_comments(); | ||||||
|  | </script> | ||||||
|  | 
 | ||||||
|  | <form id='CSRF_form' style='display: none'>{% csrf_token %}</form> | ||||||
|  | 
 | ||||||
|  | <script> | ||||||
|  |   const CSRF_FORM = document.getElementById('CSRF_form'); | ||||||
| </script> | </script> | ||||||
| 
 | 
 | ||||||
| <script> | <script> | ||||||
|   function zmenStavKorektury(event) { |   // show comment form, when clicked to image | ||||||
|     event.preventDefault(); |   for (const image of document.getElementsByClassName('strana')) { | ||||||
|  |     image.addEventListener('click', ev => { | ||||||
|  |       switch (document.body.dataset.status) { | ||||||
|  |         case 'zanaseni': | ||||||
|  |           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; | ||||||
|  |           break; | ||||||
|  |       } | ||||||
| 
 | 
 | ||||||
|     const oprava = event.target.parentElement.parentElement.parentElement.parentElement; |       let dx, dy; | ||||||
| 
 |       const par = image.parentNode; | ||||||
|     const data = new FormData(event.target); |       if (ev.pageX != null) { | ||||||
|     data.append("action", event.submitter.value); |         dx = ev.pageX - par.offsetLeft; | ||||||
| 
 |         dy = ev.pageY - par.offsetTop; | ||||||
|     fetch("{% url 'korektury_api_oprava_stav' %}", {method: "POST", body: data}) |       } else { //IE a další | ||||||
|       .then(response => { |         dx = ev.offsetX; | ||||||
|         if (!response.ok) {alert("Něco se nepovedlo:" + response.statusText);} |         dy = ev.offsetY; | ||||||
|         else response.json().then(data => {oprava.dataset.opravastatus = data["status"]; oprava.previousElementSibling.dataset.opravastatus = data["status"]}); |       } | ||||||
|       }) |       const img_id = image.id; | ||||||
|       .catch(error => {alert("Něco se nepovedlo:" + error);}); |       return show_form(img_id, dx, dy, '', '', ''); | ||||||
|  |     }); | ||||||
|   } |   } | ||||||
| 
 |  | ||||||
|   for (const form of document.querySelectorAll(".corr-buttons form")) form.addEventListener('submit', async event => { zmenStavKorektury(event); }); |  | ||||||
| </script> | </script> | ||||||
|  |  | ||||||
		Loading…
	
		Reference in a new issue