# HG changeset patch
# User HIROSE Yuuji <yuuji@gentei.org>
# Date 1609582407 -32400
# Node ID 1fa8b4440f8f17b408063ec782df405771890514
# Parent  a4ad4101064de5029d0e25c111981333d15c9de2
Update button changed to ajax

diff -r a4ad4101064d -r 1fa8b4440f8f examples/common/default/default.css
--- a/examples/common/default/default.css	Sat Jan 02 15:30:15 2021 +0900
+++ b/examples/common/default/default.css	Sat Jan 02 19:13:27 2021 +0900
@@ -32,7 +32,7 @@
     border-top: 2px inset #555; text-align: right; clear: both;
     font-size: 50%;
 }
-p.copyright a {text-decoration: none;}
+p.copyright a, a#reload {text-decoration: none;}
 
 td {padding-left: 0.5ex; padding-right: 0.5ex;}
 table.td2r td:nth-child(2) {text-align: right;}
@@ -418,9 +418,9 @@
 }
 .dissolving {opacity: 0; transition: 3.0s;}
 .emerging {opacity: 1; transition: 3s;}
-span.loading, input#c:disabled  {
+button#c, button#reload  {display: inline-block;}
+span.loading, button#c:disabled, button#reload:disabled  {
     visibility: visible; transform: rotateX(3600deg); transition: 30s;
-    display: inline-block;
 }
 span.loading {padding: 0 1em;}
 
diff -r a4ad4101064d -r 1fa8b4440f8f s4-blog.sh
--- a/s4-blog.sh	Sat Jan 02 15:30:15 2021 +0900
+++ b/s4-blog.sh	Sat Jan 02 19:13:27 2021 +0900
@@ -624,9 +624,9 @@
 	  )
   cat<<-EOF
 	</table> <!-- end of s4-blog:blog_showentry() main table -->
-	<p class="update_link"><a
-	 href="?reload/$rowid" accesskey="r"
-	  title="Shortcut: R${nl}Reload">再読込</a> / <a
+	<p class="update_link"><a href="?reload/$rowid" accesskey="r"
+	  title="Shortcut: R${nl}Reload">
+	  <button id="reload">再読込</button></a> / <a
 	 href="#title" id="bottom" accesskey="t"
 	  title="Shortcut: T${nl}to the Top">先頭へ</a>
 	 ${showalllink:+/ `echo $showalllink|sed 's/n:all/&\#bottom/'`$limitedmsg}</p>
diff -r a4ad4101064d -r 1fa8b4440f8f s4-main.js
--- a/s4-main.js	Sat Jan 02 15:30:15 2021 +0900
+++ b/s4-main.js	Sat Jan 02 19:13:27 2021 +0900
@@ -122,7 +122,7 @@
 	for (i of newids)
 	    idlist.push(getArticleID(i));
 	console.log("IDList="+idlist.join());
-	let cnt=0;
+	let cnt=0, ntr;
 	let current = collectElementsByAttr("td", "class", "repl"),
 	    ncur=0, n, icur=0, o, oid, nid, otr;
 	current = document.querySelectorAll('td[class="repl"]');
@@ -134,7 +134,7 @@
 	    if (!n.id) continue;
 	    nid = parseInt(n.id);
 	    if (nid<=0) continue;
-	    let ntr = n.parentNode;
+	    ntr = n.parentNode;
 	    for (; icur<current.length; icur++) {
 		o = current[icur];
 		otr = o.parentNode;
@@ -152,18 +152,27 @@
 	    ntr = n.parentNode;
 	    ntr.getElementsByTagName("td")[0].classList.add("new");
 	    tbody.appendChild(ntr);
+	    ntr.scrollIntoView({behavior: "smooth"});
 	    registPjaxViewers(ntr.querySelectorAll("a[href]"));
 	    ntr.classList.add("dissolving");
-	    ntr.scrollIntoView({behavior: "smooth"});
+	    let localntr = ntr;
 	    setTimeout(() => {
-		ntr.classList.remove("dissolving");
-		ntr.classList.add("emerging");
+		localntr.classList.remove("dissolving");
+		localntr.classList.add("emerging");
 	    }, 100);
 	    cnt++;
 	}
-	ajaxSubmit.value = ajaxSubmit.back;
+	ajaxSubmit.textContent = ajaxSubmit.back;
 	ajaxSubmit.disabled = false;
 	console.log("Update "+cnt+"rows");
+	if (cnt>0)
+	    try {	// Scroll to last updated row
+		ntr.scrollIntoView({behavior: "smooth", block: "center"});
+	    } catch (e1) {
+		try {	// block: "center" is not supported by older agents
+		    ntr.scrollIntoView({behavior: "smooth"});
+		} catch (e2) {}
+	    } 
 	return cnt;
     }
 
@@ -213,16 +222,22 @@
 	if (!myurl.match(/replyblog\+([0-9]+)/)) return;
 	rowid = RegExp.$1
 	let myform = document.querySelector("form.replyblog");
-	if (warnFileSize(myform)) return;
-	ajaxSubmit = e.target;
-	ajaxSubmit.back = ajaxSubmit.value;
-	ajaxSubmit.value = "送信中";
-	ajaxSubmit.blur();
-	ajaxSubmit.disabled = true;
 	let data = new FormData(myform),
 	    fetchtime = data.get("fetchtime");
 	if (!fetchtime || fetchtime=="") return;
 	///*XX*/fetchtime = "2020-06-14T00:00:00";data.set("fetchtime", fetchtime)
+
+	ajaxSubmit = e.target;
+	ajaxSubmit.back = ajaxSubmit.textContent;
+	if (ajaxSubmit.id == "reload") {
+	    ajaxSubmit.textContent = "更新中"
+	    data.set("text", "")
+	} else {
+	    if (warnFileSize(myform)) return;
+	    ajaxSubmit.textContent = "送信中";
+	}
+	ajaxSubmit.blur();
+	ajaxSubmit.disabled = true;
 	let act = mypath+"?blog_fetch+"+rowid+"+f:"+fetchtime;
 	
 	function respUpdate(tbody) {
@@ -237,8 +252,10 @@
 	    let update = replAddNews(form);
 	    let dispelem = myform.querySelector("textarea").parentNode;
 	    newform = new FormData(form);
-	    myform.reset();
-	    myform.text.value = '';
+	    if (data.get("text") > "") {	// Called by submit button
+		myform.reset();
+		// myform.text.value = '';
+	    }
 	    myform.fetchtime.value = newform.get("fetchtime");
 	    myform.id.value = newform.get("id");
 	    if (update && update > 0) {
@@ -577,23 +594,27 @@
     }
     function initBlogs() {
 	// Auto-complete #xxxx
-	var check = collectElementsByAttr("input", "name", "notifyto");
+	let i, check = collectElementsByAttr("input", "name", "notifyto");
 	if (check)
-	    for (let i of check) {
+	    for (i of check) {
 		i.addEventListener("click", insertRedirect, false);
 	    }
-	for (let i of document.querySelectorAll("a[href]"))
+	for (i of document.querySelectorAll("a[href]"))
 	    if (i.getAttribute("href").match(/^#[0-9]+$/))
 		if (RegExp.lastMatch == i.innerHTML)
 		    i.addEventListener("click", insertRedirect, false)
-	for (let i of document.querySelectorAll('input#c[value="送信"]')) {
-	    // let b = document.createElement("button");
-	    let b = i;
-	    b.value = "送信!";
+	for (i of document.querySelectorAll('input#c[value="送信"]')) {
+	    let b = document.createElement("button");
+	    b.textContent = "送信!";
 	    console.log("b="+b+", tc="+b.textContent);
 	    b.addEventListener("click", ajaxPost, false);
 	    // i.insertAdjacentElement('afterend', b);
+	    b.id = i.id;
+	    i.parentNode.replaceChild(b, i);
+	    i.remove();
 	}
+	i = document.getElementById("reload");
+	if (i) i.addEventListener("click", ajaxPost, false);
 	for (let f of document.querySelectorAll('input[type="file"]')) {
 	    let form = document.forms[0];
 	    f.addEventListener('change', (e) => {