Mercurial Hosting > freedit
comparison 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 |
comparison
equal
deleted
inserted
replaced
18:94e26bffd4fb | 19:da006d1c1eba |
---|---|
54 color: #888; | 54 color: #888; |
55 } | 55 } |
56 [message] { | 56 [message] { |
57 white-space: pre-wrap; | 57 white-space: pre-wrap; |
58 } | 58 } |
59 textarea { | |
60 width: 100%; | |
61 max-width: 450px; | |
62 height: 100px; | |
63 } | |
64 </style> | 59 </style> |
65 <script> | 60 <script> |
66 function cancelEdit(post) { | 61 function getPostDiv(node) { |
67 let postDiv = document.querySelector('[post="'+post+'"]'); | 62 do { |
63 if( node.getAttribute('post') ) | |
64 return node; | |
65 } while( node = node.parentNode ); | |
66 } | |
67 | |
68 function cancelEdit(a) { | |
69 let postDiv = getPostDiv(a); | |
68 postDiv.querySelector('[output]').style.display = 'block'; | 70 postDiv.querySelector('[output]').style.display = 'block'; |
69 postDiv.querySelector('[edit]').innerHTML = ''; | 71 postDiv.querySelector('[edit]').innerHTML = ''; |
70 } | 72 } |
71 function saveEdit(post) { | 73 function saveEdit(a) { |
72 let postDiv = document.querySelector('[post="'+post+'"]'); | 74 let postDiv = getPostDiv(a); |
73 let text = postDiv.querySelector('textarea').value; | 75 let post = postDiv.getAttribute('post'); |
76 let text = postDiv.querySelector('[contentEditable]').textContent; | |
74 let postData = 'post=' + post + '&text=' + encodeURIComponent(text); | 77 let postData = 'post=' + post + '&text=' + encodeURIComponent(text); |
75 ajax("save_edit.js",postData); | 78 ajax("save_edit.js",postData); |
76 } | 79 } |
77 | 80 |
78 function deletePost(span) { | 81 function deletePost(span) { |
80 } | 83 } |
81 function deleteNo(span) { | 84 function deleteNo(span) { |
82 span.innerHTML = document.querySelector('[hidden][undelete]').innerHTML; | 85 span.innerHTML = document.querySelector('[hidden][undelete]').innerHTML; |
83 } | 86 } |
84 function deleteYes(span) { | 87 function deleteYes(span) { |
85 let post = span.getAttribute('delete'); | 88 let post = getPostDiv(span).getAttribute('post'); |
86 ajax( '/delete.js?post=' + post ); | 89 ajax( '/delete.js?post=' + post ); |
87 } | 90 } |
88 | 91 |
89 function init() { | 92 function init() { |
90 let spans = document.querySelectorAll('span[ago]'); | 93 let spans = document.querySelectorAll('span[ago]'); |
117 <% bbcode_to_html(post.content) %> | 120 <% bbcode_to_html(post.content) %> |
118 <p> | 121 <p> |
119 <a href="/reply.html?parent=<%=post.id%>">reply</a> | 122 <a href="/reply.html?parent=<%=post.id%>">reply</a> |
120 <% if post.author_name == user_name then %> | 123 <% if post.author_name == user_name then %> |
121 - <a href="javascript:ajax('/edit.js?post=<%=post.id%>')">edit</a> | 124 - <a href="javascript:ajax('/edit.js?post=<%=post.id%>')">edit</a> |
122 - <span delete="<%=post.id%>"><%deletePost()%></span> | 125 - <span delete><%deletePost()%></span> |
123 <% end %> | 126 <% end %> |
124 </p> | 127 </p> |
125 </div> | 128 </div> |
126 <div edit></div> | 129 <div edit></div> |
127 </div> | 130 </div> |
128 <% end %> | 131 <% end %> |
129 </div> | 132 </div> |
130 <% footer() %> | 133 <% footer() %> |
131 <span hidden delete>Delete? <a href="javascript:" onclick="deleteYes(parentNode)">yes</a> / <a href="javascript:" onclick="deleteNo(parentNode)">no</a></span> | 134 <span hidden delete>Delete? <a href="javascript:" onclick="deleteYes(parentNode)">yes</a> / <a href="javascript:" onclick="deleteNo(parentNode)">no</a></span> |
132 <span hidden undelete><%deletePost()%></span> | 135 <span hidden undelete><%deletePost()%></span> |
136 <div hidden edit> | |
137 <div contentEditable></div> | |
138 <p> | |
139 <button onclick="saveEdit(this)">save</button> | |
140 <button onclick="cancelEdit(this)">cancel</button> | |
141 </p> | |
142 </div> | |
133 </body> | 143 </body> |
134 </html> | 144 </html> |
135 <% | 145 <% |
136 end | 146 end |