Mercurial Hosting > freedit
diff src/thread.html.luan @ 19:da006d1c1eba
use contentEditable
author | Franklin Schmidt <fschmidt@gmail.com> |
---|---|
date | Wed, 13 Jul 2022 08:47:13 -0600 |
parents | 94e26bffd4fb |
children | 3ea49246d6a7 |
line wrap: on
line diff
--- a/src/thread.html.luan Mon Jul 11 12:14:05 2022 -0600 +++ b/src/thread.html.luan Wed Jul 13 08:47:13 2022 -0600 @@ -56,21 +56,24 @@ [message] { white-space: pre-wrap; } - textarea { - width: 100%; - max-width: 450px; - height: 100px; - } </style> <script> - function cancelEdit(post) { - let postDiv = document.querySelector('[post="'+post+'"]'); + function getPostDiv(node) { + do { + if( node.getAttribute('post') ) + return node; + } while( node = node.parentNode ); + } + + function cancelEdit(a) { + let postDiv = getPostDiv(a); postDiv.querySelector('[output]').style.display = 'block'; postDiv.querySelector('[edit]').innerHTML = ''; } - function saveEdit(post) { - let postDiv = document.querySelector('[post="'+post+'"]'); - let text = postDiv.querySelector('textarea').value; + function saveEdit(a) { + let postDiv = getPostDiv(a); + let post = postDiv.getAttribute('post'); + let text = postDiv.querySelector('[contentEditable]').textContent; let postData = 'post=' + post + '&text=' + encodeURIComponent(text); ajax("save_edit.js",postData); } @@ -82,7 +85,7 @@ span.innerHTML = document.querySelector('[hidden][undelete]').innerHTML; } function deleteYes(span) { - let post = span.getAttribute('delete'); + let post = getPostDiv(span).getAttribute('post'); ajax( '/delete.js?post=' + post ); } @@ -119,7 +122,7 @@ <a href="/reply.html?parent=<%=post.id%>">reply</a> <% if post.author_name == user_name then %> - <a href="javascript:ajax('/edit.js?post=<%=post.id%>')">edit</a> - - <span delete="<%=post.id%>"><%deletePost()%></span> + - <span delete><%deletePost()%></span> <% end %> </p> </div> @@ -130,6 +133,13 @@ <% footer() %> <span hidden delete>Delete? <a href="javascript:" onclick="deleteYes(parentNode)">yes</a> / <a href="javascript:" onclick="deleteNo(parentNode)">no</a></span> <span hidden undelete><%deletePost()%></span> + <div hidden edit> + <div contentEditable></div> + <p> + <button onclick="saveEdit(this)">save</button> + <button onclick="cancelEdit(this)">cancel</button> + </p> + </div> </body> </html> <%