s4
changeset 1002:47b3e770372d
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, 68 insertions(+), 53 deletions(-) [+] |
line diff
1.1 --- a/examples/common/default/default.css Sun Dec 04 10:36:33 2022 +0859 1.2 +++ b/examples/common/default/default.css Sun Dec 04 16:59:59 2022 +0859 1.3 @@ -1,6 +1,13 @@ 1.4 /* 1.5 * Default CSS definitions 1.6 */ 1.7 +@media print { 1.8 + div.blogcomment, div.blogcomment *, div.topmenu, 1.9 + table.bloghead button { 1.10 + display: none 1.11 + } 1.12 + a {text-decoration: none;} 1.13 +} 1.14 body {background: #eff; margin: 2px; padding: 6px;} 1.15 h2, h3, hr {clear: both;} 1.16 *.warn {color: red;} 1.17 @@ -222,54 +229,56 @@ 1.18 body.grouphome p.groupimg img { 1.19 max-width: 380px; max-height: 380px;} 1.20 1.21 -div.fold {margin-top: 1em; border-top: 1px solid black; padding-top: 1em;} 1.22 -div.noborder {border: 0px; margin: 0;} 1.23 -div.fold > div { 1.24 +@media screen { 1.25 + div.fold {margin-top: 1em; border-top: 1px solid black; padding-top: 1em;} 1.26 + div.noborder {border: 0px; margin: 0;} 1.27 + div.fold > div { 1.28 xxdisplay: none; max-height: 80%; overflow: auto; 1.29 height: 0px; opacity: 0; padding: 0 1ex; 1.30 -} 1.31 -div.fold input[type="checkbox"]:checked ~ div, 1.32 -div.fold input[type="radio"]:checked ~ div { 1.33 + } 1.34 + div.fold input[type="checkbox"]:checked ~ div, 1.35 + div.fold input[type="radio"]:checked ~ div { 1.36 display: block; background: #fadede; 1.37 height: auto; opacity: 1.0; transition: 1s; 1.38 + } 1.39 + input.fold + label + *.folded {opacity: 0; display: none; hight: 0;} 1.40 + input[type="checkbox"].fold:checked + label + *.folded { 1.41 + opacity: 1.0; transition: 2s; 1.42 + } 1.43 + input[type="checkbox"].fold:checked + label + div.folded { 1.44 + display: block; hight: auto; transition: 2s; 1.45 + } 1.46 + 1.47 + /* fold2!! */ 1.48 + div.foldtabs { 1.49 + position: relative; height: 5em; margin-top: 1em; 1.50 + border-top: 1px solid black; padding-top: 1em; 1.51 + } 1.52 + div.foldtabs > div { 1.53 + position: absolute; top: 2.5em; opacity: 0.0; background: pink; 1.54 + margin: 2px; overflow: auto; 1.55 + } 1.56 + div.foldtabs input[type="radio"] {display: none;} 1.57 + div.foldtabs input[type="radio"]:checked + label + div { 1.58 + display: block; opacity: 1.0; transition: 0.2s; width: 100%; 1.59 + margin: 0; z-index: 2; 1.60 + } 1.61 + div.foldtabs > label { 1.62 + border: 1px outset #ddd; background: #ddd; xbackground: pink; 1.63 + border-top-left-radius: 0.8em; border-top-right-radius: 0.8em; 1.64 + margin: 0; 1.65 + padding: 0.2ex 0.5em; height: 3em; 1.66 + } 1.67 + div.foldtabs > input:active + label {background: white;} 1.68 + div.foldtabs input:checked + label { 1.69 + background: pink; border: pink 1px solid; border-bottom-width: 6px; 1.70 + } 1.71 + div.foldtabs input:checked + label:last-of-type {border-width: 1px;} 1.72 + input[type="checkbox"] + label + input[type="submit"] {display: none;} 1.73 + input[type="checkbox"]:checked + label + input[type="submit"] { 1.74 + display: inline;} 1.75 + div.foldtabs p {margin: 0;} 1.76 } 1.77 -input.fold + label + *.folded {opacity: 0; display: none; hight: 0;} 1.78 -input[type="checkbox"].fold:checked + label + *.folded { 1.79 - opacity: 1.0; transition: 2s; 1.80 -} 1.81 -input[type="checkbox"].fold:checked + label + div.folded { 1.82 - display: block; hight: auto; transition: 2s; 1.83 -} 1.84 - 1.85 -/* fold2!! */ 1.86 -div.foldtabs { 1.87 - position: relative; height: 5em; margin-top: 1em; 1.88 - border-top: 1px solid black; padding-top: 1em; 1.89 -} 1.90 -div.foldtabs > div { 1.91 - position: absolute; top: 2.5em; opacity: 0.0; background: pink; 1.92 - margin: 2px; overflow: auto; 1.93 -} 1.94 -div.foldtabs input[type="radio"] {display: none;} 1.95 -div.foldtabs input[type="radio"]:checked + label + div { 1.96 - display: block; opacity: 1.0; transition: 0.2s; width: 100%; 1.97 - margin: 0; z-index: 2; 1.98 -} 1.99 -div.foldtabs > label { 1.100 - border: 1px outset #ddd; background: #ddd; xbackground: pink; 1.101 - border-top-left-radius: 0.8em; border-top-right-radius: 0.8em; 1.102 - margin: 0; 1.103 - padding: 0.2ex 0.5em; height: 3em; 1.104 -} 1.105 -div.foldtabs > input:active + label {background: white;} 1.106 -div.foldtabs input:checked + label { 1.107 - background: pink; border: pink 1px solid; border-bottom-width: 6px; 1.108 -} 1.109 -div.foldtabs input:checked + label:last-of-type {border-width: 1px;} 1.110 -input[type="checkbox"] + label + input[type="submit"] {display: none;} 1.111 -input[type="checkbox"]:checked + label + input[type="submit"] { 1.112 - display: inline;} 1.113 -div.foldtabs p {margin: 0;} 1.114 1.115 /* ToDo List CheckBox inspired by https://cultureacademia.jp/webcreate/303/ */ 1.116 input.s4-checkbox {display: none;} /* Do not show real checkbox */
2.1 --- a/s4-blog.sh Sun Dec 04 10:36:33 2022 +0859 2.2 +++ b/s4-blog.sh Sun Dec 04 16:59:59 2022 +0859 2.3 @@ -269,13 +269,16 @@ 2.4 case "$isgrpadmin$blog_mode" in 2.5 false*closed*|false*quiz|false*enquete*) ;; 2.6 *) 2.7 - 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>])" 2.8 + 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>])" 2.9 ;; 2.10 esac 2.11 ;; 2.12 esac 2.13 fi 2.14 - href4="${blog_math:+<span id=\"mathjax\">Math</span>} <a href=\"#bottom\" accesskey=\"b\" title=\"Shortcut: B${nl}to the Bottom\"> 末尾へ</a>" 2.15 + hidebtn='<button type="button" id="hideauth" accesskey="a" title="Shortcut: A 2.16 +Hide/Show Author - Useful for summary printing 2.17 +OFFにするとまとめ印刷に便利。">著者OFF</button>' 2.18 + href4="${blog_math:+<span id=\"mathjax\">Math</span>} $hidebtn <a href=\"#bottom\" accesskey=\"b\" title=\"Shortcut: B${nl}to the Bottom\"> 末尾へ</a>" 2.19 $isgrpadmin && 2.20 href5="<a href=\"?blogseen+$rowid\" accesskey=\"s\" title=\"Shortcut: S${nl}State of Accesses\"> 読刻</a>" 2.21 quizmodefile=$tmpd/quiz; rm -f "$quizmodefile" # XXX: Global state 2.22 @@ -311,7 +314,6 @@ 2.23 case "$blogtype" in 2.24 "クイズ"|"XXXX集計") 2.25 echo "${blogtype}モードは本人と管理者の書き込みのみが表示されます" 2.26 - echo "隠す/見せる(Hide/Show)" | html button 'id="quizwarn" type="button"' 2.27 ;; 2.28 esac | html p 'class="warn"' 2.29
3.1 --- a/s4-main.js Sun Dec 04 10:36:33 2022 +0859 3.2 +++ b/s4-main.js Sun Dec 04 16:59:59 2022 +0859 3.3 @@ -803,21 +803,23 @@ 3.4 } 3.5 return elem; 3.6 } 3.7 - var quizwarnVisible = false; 3.8 + var authVisible = false; 3.9 function toggleAuthorVisibility(e) { 3.10 - // In QUIZ mode, click to quizwarn line toggles visibility of author 3.11 + // Click to hideauth button toggles visibility of author columns 3.12 e.stopPropagation(); 3.13 - if (quizwarnVisible) { 3.14 + let b = document.getElementById("hideauth"); 3.15 + if (authVisible) { 3.16 for (let i of document.querySelectorAll("td.repatt")) { 3.17 i.classList.remove("hideauthor"); 3.18 } 3.19 - quizwarnVisible = false; 3.20 + authVisible = false; 3.21 } else { 3.22 for (let i of document.querySelectorAll("td.repatt")) { 3.23 i.classList.add("hideauthor"); 3.24 } 3.25 - quizwarnVisible = true; 3.26 + authVisible = true; 3.27 } 3.28 + b.textContent = b.textContent.replace(/OFF|ON/, authVisible ? "ON" : "OFF"); 3.29 } 3.30 function downloadFile(filename, content, BOM) { 3.31 let bom = new Uint8Array([0xEF, 0xBB, 0xBF]); 3.32 @@ -926,7 +928,9 @@ 3.33 let btn = document.createElement("button"); 3.34 btn.innerText = "CSVget"; 3.35 btn.type = "button"; 3.36 - btn.title = `見えている書き込みをCSVで取得します 3.37 + btn.accessKey = "g"; 3.38 + btn.title = `Shortcut: G 3.39 +見えている書き込みをCSVで取得します 3.40 全件表示されていることを確認してから利用して下さい。 3.41 Excelで利用する場合は Ctrl を押しながらクリックして下さい。 3.42 Get seen TEXT content as CSV.`; 3.43 @@ -949,7 +953,7 @@ 3.44 warnFileSize(document.forms[0]); 3.45 }, false) 3.46 } 3.47 - if (i=document.getElementById("quizwarn")) { 3.48 + if (i=document.getElementById("hideauth")) { 3.49 i.addEventListener('click', toggleAuthorVisibility, false); 3.50 } 3.51 // Hack article_m links