changeset 1002:47b3e770372d draft

Auth-ON/OFF button available in all modes
author HIROSE Yuuji <yuuji@gentei.org>
date Sun, 04 Dec 2022 16:59:59 +0859
parents bbd5a0c50d5b
children 5bd1b5125049
files examples/common/default/default.css s4-blog.sh s4-main.js
diffstat 3 files changed, 67 insertions(+), 52 deletions(-) [+]
line wrap: on
line diff
--- a/examples/common/default/default.css	Sun Dec 04 10:36:33 2022 +0859
+++ b/examples/common/default/default.css	Sun Dec 04 16:59:59 2022 +0859
@@ -1,6 +1,13 @@
 /*
  * Default CSS definitions
  */
+@media print {
+    div.blogcomment, div.blogcomment *, div.topmenu,
+    table.bloghead button {
+	display: none
+    }
+    a {text-decoration: none;}
+}
 body {background: #eff; margin: 2px; padding: 6px;}
 h2, h3, hr {clear: both;}
 *.warn {color: red;}
@@ -222,54 +229,56 @@
 body.grouphome p.groupimg img {
     max-width: 380px; max-height: 380px;}
 
-div.fold {margin-top: 1em; border-top: 1px solid black; padding-top: 1em;}
-div.noborder {border: 0px; margin: 0;}
-div.fold > div {
+@media screen {
+  div.fold {margin-top: 1em; border-top: 1px solid black; padding-top: 1em;}
+  div.noborder {border: 0px; margin: 0;}
+  div.fold > div {
     xxdisplay: none; max-height: 80%; overflow: auto;
     height: 0px; opacity: 0; padding: 0 1ex;
-}
-div.fold input[type="checkbox"]:checked ~ div,
-div.fold input[type="radio"]:checked ~ div {
+  }
+  div.fold input[type="checkbox"]:checked ~ div,
+  div.fold input[type="radio"]:checked ~ div {
     display: block; background: #fadede;
     height: auto; opacity: 1.0; transition: 1s;
-}
-input.fold + label + *.folded {opacity: 0; display: none; hight: 0;}
-input[type="checkbox"].fold:checked + label + *.folded {
-    opacity: 1.0; transition: 2s;
-}
-input[type="checkbox"].fold:checked + label + div.folded {
-    display: block; hight: auto; transition: 2s;
-}
+  }
+  input.fold + label + *.folded {opacity: 0; display: none; hight: 0;}
+  input[type="checkbox"].fold:checked + label + *.folded {
+      opacity: 1.0; transition: 2s;
+  }
+  input[type="checkbox"].fold:checked + label + div.folded {
+      display: block; hight: auto; transition: 2s;
+  }
 
-/* fold2!! */
-div.foldtabs {
-    position: relative; height: 5em; margin-top: 1em;
-    border-top: 1px solid black; padding-top: 1em;
-}
-div.foldtabs > div {
-    position: absolute; top: 2.5em; opacity: 0.0; background: pink;
-    margin: 2px; overflow: auto;
+  /* fold2!! */
+  div.foldtabs {
+      position: relative; height: 5em; margin-top: 1em;
+      border-top: 1px solid black; padding-top: 1em;
+  }
+  div.foldtabs > div {
+      position: absolute; top: 2.5em; opacity: 0.0; background: pink;
+      margin: 2px; overflow: auto;
+  }
+  div.foldtabs input[type="radio"] {display: none;}
+  div.foldtabs input[type="radio"]:checked + label + div {
+      display: block; opacity: 1.0; transition: 0.2s; width: 100%;
+      margin: 0; z-index: 2;
+  }
+  div.foldtabs > label {
+      border: 1px outset #ddd; background: #ddd; xbackground: pink;
+      border-top-left-radius: 0.8em; border-top-right-radius: 0.8em;
+      margin: 0;
+      padding: 0.2ex 0.5em; height: 3em;
+  }
+  div.foldtabs > input:active + label {background: white;}
+  div.foldtabs input:checked + label {
+      background: pink; border: pink 1px solid; border-bottom-width: 6px;
+  }
+  div.foldtabs input:checked + label:last-of-type {border-width: 1px;}
+  input[type="checkbox"] + label + input[type="submit"] {display: none;}
+  input[type="checkbox"]:checked + label + input[type="submit"] {
+      display: inline;}
+  div.foldtabs p {margin: 0;}
 }
-div.foldtabs input[type="radio"] {display: none;}
-div.foldtabs input[type="radio"]:checked + label + div {
-    display: block; opacity: 1.0; transition: 0.2s; width: 100%;
-    margin: 0; z-index: 2;
-}
-div.foldtabs > label {
-    border: 1px outset #ddd; background: #ddd; xbackground: pink;
-    border-top-left-radius: 0.8em; border-top-right-radius: 0.8em;
-    margin: 0;
-    padding: 0.2ex 0.5em; height: 3em;
-}
-div.foldtabs > input:active + label {background: white;}
-div.foldtabs input:checked + label {
-    background: pink; border: pink 1px solid; border-bottom-width: 6px;
-}
-div.foldtabs input:checked + label:last-of-type {border-width: 1px;}
-input[type="checkbox"] + label + input[type="submit"] {display: none;}
-input[type="checkbox"]:checked + label + input[type="submit"] {
-    display: inline;}
-div.foldtabs p {margin: 0;}
 
 /* ToDo List CheckBox inspired by https://cultureacademia.jp/webcreate/303/ */
 input.s4-checkbox {display: none;}	/* Do not show real checkbox */
--- a/s4-blog.sh	Sun Dec 04 10:36:33 2022 +0859
+++ b/s4-blog.sh	Sun Dec 04 16:59:59 2022 +0859
@@ -269,13 +269,16 @@
 	case "$isgrpadmin$blog_mode" in
 	  false*closed*|false*quiz|false*enquete*) ;;
 	  *)
-	    href3="(ファイル取得[<a href=\"?gethandout+$rowid\" accesskey=\"f\" title=\"Shortcut: F${nl}File Retrieval\">記事順</a>|<a href=\"?gethandout+$rowid+by_uname\" accesskey=\"u\" title=\"Shortcut: F${nl}File Retrieval by User\">著者順</a>])"
+	    href3="(ファイル取得[<a href=\"?gethandout+$rowid\" accesskey=\"f\" title=\"Shortcut: F${nl}File Retrieval\">記事順</a>|<a href=\"?gethandout+$rowid+by_uname\" accesskey=\"u\" title=\"Shortcut: U${nl}File Retrieval by User\">著者順</a>])"
 	    ;;
 	esac
 	;;
     esac
   fi
-  href4="${blog_math:+<span id=\"mathjax\">Math</span>} <a href=\"#bottom\" accesskey=\"b\" title=\"Shortcut: B${nl}to the Bottom\"> 末尾へ</a>"
+  hidebtn='<button type="button" id="hideauth" accesskey="a" title="Shortcut: A
+Hide/Show Author - Useful for summary printing
+OFFにするとまとめ印刷に便利。">著者OFF</button>'
+  href4="${blog_math:+<span id=\"mathjax\">Math</span>} $hidebtn <a href=\"#bottom\" accesskey=\"b\" title=\"Shortcut: B${nl}to the Bottom\"> 末尾へ</a>"
   $isgrpadmin &&
       href5="<a href=\"?blogseen+$rowid\" accesskey=\"s\" title=\"Shortcut: S${nl}State of Accesses\"> 読刻</a>"
   quizmodefile=$tmpd/quiz; rm -f "$quizmodefile"	# XXX: Global state
@@ -311,7 +314,6 @@
       case "$blogtype" in
 	"クイズ"|"XXXX集計")
 	  echo "${blogtype}モードは本人と管理者の書き込みのみが表示されます"
-	  echo "隠す/見せる(Hide/Show)" | html button 'id="quizwarn" type="button"'
 	  ;;
       esac | html p 'class="warn"'
 
--- a/s4-main.js	Sun Dec 04 10:36:33 2022 +0859
+++ b/s4-main.js	Sun Dec 04 16:59:59 2022 +0859
@@ -803,21 +803,23 @@
 	}
 	return elem;
     }
-    var quizwarnVisible = false;
+    var authVisible = false;
     function toggleAuthorVisibility(e) {
-	// In QUIZ mode, click to quizwarn line toggles visibility of author
+	// Click to hideauth button toggles visibility of author columns
 	e.stopPropagation();
-	if (quizwarnVisible) {
+	let b = document.getElementById("hideauth");
+	if (authVisible) {
 	    for (let i of document.querySelectorAll("td.repatt")) {
 		i.classList.remove("hideauthor");
 	    }
-	    quizwarnVisible = false;
+	    authVisible = false;
 	} else {
 	    for (let i of document.querySelectorAll("td.repatt")) {
 		i.classList.add("hideauthor");
 	    }
-	    quizwarnVisible = true;
+	    authVisible = true;
 	}
+	b.textContent = b.textContent.replace(/OFF|ON/, authVisible ? "ON" : "OFF");
     }
     function downloadFile(filename, content, BOM) {
         let bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
@@ -926,7 +928,9 @@
 		let btn = document.createElement("button");
 		btn.innerText = "CSVget";
 		btn.type = "button";
-		btn.title = `見えている書き込みをCSVで取得します
+		btn.accessKey = "g";
+		btn.title = `Shortcut: G
+見えている書き込みをCSVで取得します
 全件表示されていることを確認してから利用して下さい。
 Excelで利用する場合は Ctrl を押しながらクリックして下さい。
 Get seen TEXT content as CSV.`;
@@ -949,7 +953,7 @@
 		warnFileSize(document.forms[0]);
 	    }, false)
 	}
-	if (i=document.getElementById("quizwarn")) {
+	if (i=document.getElementById("hideauth")) {
 	    i.addEventListener('click', toggleAuthorVisibility, false);
 	}
 	// Hack article_m links

yatex.org