From: Paul Hänsch Date: Wed, 18 Sep 2019 13:41:39 +0000 (+0200) Subject: Merge commit '2c91cc63d0e28a4f202ee2db9a8d769e63d54f7f' X-Git-Url: http://git.plutz.net/?p=vhs_kurs;a=commitdiff_plain;h=8a924700257f760132501cfc7114e5eb31bb11a9;hp=-c Merge commit '2c91cc63d0e28a4f202ee2db9a8d769e63d54f7f' --- 8a924700257f760132501cfc7114e5eb31bb11a9 diff --combined clickslide/cgilite/file.sh index b6118f5,51ec245..51ec245 --- a/clickslide/cgilite/file.sh +++ b/clickslide/cgilite/file.sh @@@ -1,6 -1,6 +1,6 @@@ #!/bin/sh - # Copyright 2016 - 2018 Paul Hänsch + # Copyright 2016 - 2019 Paul Hänsch # # This file is part of cgilite. # @@@ -59,7 -59,7 +59,7 @@@ FILE() # Parse the allowable date formats from Section 3.3.1 of # https://www.w3.org/Protocols/rfc2616/rfc2616-sec3.html HEADER If-Modified-Since \ - | sed -r 's;^[^ ]+, ([0-9]{2}) (...) ([0-9]{4}) (..:..:..) GMT$;\3-\2-\1 \4;; + | sed -E 's;^[^ ]+, ([0-9]{2}) (...) ([0-9]{4}) (..:..:..) GMT$;\3-\2-\1 \4;; s;^[^ ]+, ([0-9]{2})-(...)-([789][0-9]) (..:..:..) GMT$;19\3-\2-\1 \4;; s;^[^ ]+, ([0-9]{2})-(...)-([0-6][0-9]) (..:..:..) GMT$;20\3-\2-\1 \4;; s;^[^ ]+ (...) ([0-9]{2}) (..:..:..) ([0-9]{4})$;\4-\1-\2 \3;; @@@ -69,7 -69,7 +69,7 @@@ | xargs -r0 date +%s -ud 2>&- )" - range="$(HEADER Range |sed -nr 's;^bytes=([0-9]+-[0-9]*|-[0-9]+)$;\1;p;q;')" + range="$(HEADER Range |sed -nE 's;^bytes=([0-9]+-[0-9]*|-[0-9]+)$;\1;p;q;')" case "$range" in *-) range="${range}$((file_size - 1))";; -*) [ ${range#-} -le $file_size ] \ diff --combined clickslide/cgilite/session.sh index 25a6598,8ed8d88..8ed8d88 --- a/clickslide/cgilite/session.sh +++ b/clickslide/cgilite/session.sh @@@ -41,6 -41,15 +41,15 @@@ timeid() checkid(){ grep -m 1 -xE '[0-9a-zA-Z:=]{16}'; } + transid(){ + # transaction ID to modify a given file + local file="$1" + { stat -c %F%i%n%N%s%Y "$file" 2>&- + printf %s "$SESSION_ID" + server_key + } | sha256sum | cut -d\ -f1 + } + update_session(){ local session sid time sig serverkey checksig @@@ -53,9 -62,9 +62,9 @@@ checksig="${checksig%% *}" d=$(date +%s) - if [ "$checksig" != "$sig" \ - -o "$time" -lt "$d" \ - -o ! "$(printf %s "$sid" |checkid)" ] 2>&- + if ! [ "$checksig" = "$sig" \ + -a "$time" -ge "$d" \ + -a "$(printf %s "$sid" |checkid)" ] 2>&- then debug Setting up new session sid="$(randomid)" diff --combined clickslide/cgilite/storage.sh index 0d09b26,10a8029..10a8029 --- a/clickslide/cgilite/storage.sh +++ b/clickslide/cgilite/storage.sh @@@ -1,6 -1,6 +1,6 @@@ #!/bin/sh - # Copyright 2018 Paul Hänsch + # Copyright 2018, 2019 Paul Hänsch # # This is a file format helper, part of CGIlite. # @@@ -74,7 -74,7 +74,7 @@@ STRING= STRING(){ { [ $# -eq 0 ] && cat || printf %s "$*"; } \ - | sed -r ':X; $!{N;bX;}'"$STRING" + | sed -E ':X; $!{N;bX;}'"$STRING" } UNSTRING=' @@@ -89,5 -89,5 +89,5 @@@ ' UNSTRING(){ { [ $# -eq 0 ] && cat || printf %s "$*"; } \ - | sed -r "$UNSTRING" + | sed -E "$UNSTRING" } diff --combined clickslide/clickslide.css index 084bf68,2e76754..2e76754 --- a/clickslide/clickslide.css +++ b/clickslide/clickslide.css @@@ -1,3 -1,44 +1,44 @@@ + /* === Colors === */ + + footer, + body a.toplevel:before, + body span.count, + div.slide:target:after, + div.slide:target + a, div.slide:target + a + a, + :target + a:before, :target + a + a:before + { color: #888; } + + body + { background-color: #AAA; + background-image: repeating-linear-gradient( to bottom right, #AAA, #999 8px); + } + + div.slide + { background-color: #FFF; + background-image: repeating-linear-gradient( #FFF, #EEE 4px); + } + + div.slide:target:after, + footer:before, body:after + { background-color: #EEE; + background-image: repeating-linear-gradient(#EEE, #DDD 8px); + } + + div.slide h1, div.slide h2 + { background-color: #EEE; + background-image: repeating-linear-gradient(#EEE, #DDD 8px); + } + + div.slide pre, div.slide code + { background-color: #DDD; + background-image: repeating-linear-gradient(#CCC, #DDD 4px); + } + + div.slide:after /* slide number on overview screen */ + { color: #AAA; } + + /* === Overall Layout === */ + * { box-sizing: border-box; margin: 0; padding: 0; @@@ -20,7 -61,7 +61,7 @@@ body { font-family: sans-serif; padding: 2em 1em 6em 1em; - background-color: #555; + #background-color: #555; text-align: center; overflow-x: hidden; } @@@ -33,9 -74,9 +74,9 @@@ body:after position: fixed; bottom: 0; left: 0; width: 100%; - background-color: #EEE; height: 1.25em; content: ' '; + #background: #EEE repeating-linear-gradient(#EEE, #DDD 8px); } a.previous, a.next ,a.toplevel { @@@ -49,16 -90,17 +90,17 @@@ footer font-size: .75em; padding: .5em 4em .5em 12em; text-align: center; - color: #888; + #color: #888; z-index: 4; + /* footer must not have background, so slide number is not covered */ } - footer:before { + footer:before { /* fake background in case footer spans multiple lines */ content: ' '; position: absolute; top: 0; left: 0; bottom: 1.5em; width: 100%; - background-color: #EEE; + #background: #EEE repeating-linear-gradient(#EEE, #DDD 8px); z-index: -1; } @@@ -68,11 -110,11 +110,11 @@@ body a.toplevel width: 2ex; overflow: hidden; font-size: .875em; padding-bottom: .25em; - color: #EEE; + color: transparent; z-index: 5; } body a.toplevel:before { - color: #888; + #color: #888; content: '\2196'; } @@@ -81,7 -123,7 +123,7 @@@ body span.count bottom: 0; left: 6.25em; font-size: .875em; padding-bottom: .125em; - color: #888; + #color: #888; z-index: 5; } @@@ -108,7 -150,7 +150,7 @@@ div.slide:after { /* slide number * text-align: left; content: attr(count); padding-left: .125em; - color: #DDD; + #color: #DDD; } div.slide + a { display: none; } @@@ -117,7 -159,7 +159,7 @@@ a.nextslide position: relative; vertical-align: top; width: 48em; line-height: 30em; - color: rgba(0, 0, 0, 0); + color: transparent; z-index: 2; } #div.slide:nth-of-type(1) { margin-right: .5em; } @@@ -125,7 -167,7 +167,7 @@@ /* ==== Slide Appearance ==== */ div.slide { - background: #FFF no-repeat center; + #background: #FFF no-repeat center; text-align: center; line-height: 1.5em; } @@@ -145,12 -187,12 +187,12 @@@ div.slide > h2:first-child + :last-chil div.slide h1, div.slide h2 { display: block; - background-color: #EEE; text-align: center; font-size: 1.5em; margin-top: 0; margin-bottom: 1em; width: 100%; max-width: 100%; + #background: #EEE repeating-linear-gradient(#EEE, #DDD 8px); } div.slide h1, @@@ -187,13 -229,18 +229,18 @@@ div.slide > ol margin: .25em auto; } + div.slide pre, div.slide code { + #background-color: rgba(224,224,224,128); + font-family: monospace; + } div.slide pre { - background-color: rgba(192,192,192,128); padding: 1ex; text-align: left; - font-family: monospace; overflow: hidden; } + div.slide code { + padding: 0 .5em; + } /* ==== Slide Display ==== */ @@@ -217,8 -264,8 +264,8 @@@ div.slide:target:after text-align: left; content: attr(count) " /"; padding-left: 4em; - background-color: #EEE; - color: #888; + #color: #888; + #background: #EEE repeating-linear-gradient(#EEE, #DDD 8px); } /* back and forth link buttons */ @@@ -228,13 -275,13 +275,13 @@@ div.slide:target + a + a display: block; font-size: inherit; line-height: 1em; - color: #888; + #color: #888; } :target + a:before, :target + a + a:before { display: block; position: fixed; bottom: 0; - color: #888; + #color: #888; padding: 0 1em .25em 1em; z-index: 4; } diff --combined clickslide/clickslide.sh index e78f1c7,d42f405..d42f405 --- a/clickslide/clickslide.sh +++ b/clickslide/clickslide.sh @@@ -3,9 -3,15 +3,15 @@@ prev='' next='' idoff=0 depth=0 ucdepth=-1 - base64() { - uuencode -m - <"$1" \ - | sed '1d; :X;$!{N;bX;}; s;\n;;g; s;=\+;;g;' + _base64() { + # busybox does not ship base64, only uuencode. Other platforms might need base64 instead + if which uuencode; then + uuencode -m - <"$1" \ + | sed '1d; :X;$!{N;bX;}; s;\n;;g; s;=\+;;g;' + else + base64 <"$1" \ + | sed ':X;$!{N;bX;}; s;\n;;g; s;=\+;;g;' + fi } { "${0%/*}"/cgilite/html-sh.sed || cat; } \ @@@ -36,7 -42,7 +42,7 @@@ file="${file#\"}" file="${file%\"}" echo Inlining Background Image "$file" >&2 if [ -r "$file" ]; then - tag="${pre}url('data:image/${file##*.};base64,$(base64 "$file")')${post}" + tag="${pre}url('data:image/${file##*.};base64,$(_base64 "$file")')${post}" fi done >/dev/null @@@ -47,7 -53,7 +53,7 @@@ file="${tag#${pre}src=\"}" file="${file%\"$post}" echo Inlining Image "$file" >&2 if [ -r "$file" ]; then - tag="${pre}src=\"data:image/${file##*.};base64,$(base64 "${file}")\"${post}" + tag="${pre}src=\"data:image/${file##*.};base64,$(_base64 "${file}")\"${post}" fi done >/dev/null diff --combined clickslide/demo/Makefile index 0000000,7cb4080..7cb4080 mode 000000,100644..100644 --- a/clickslide/demo/Makefile +++ b/clickslide/demo/Makefile @@@ -1,0 -1,2 +1,2 @@@ + demo.html: demo.short + ../clickslide.sh <$< >$@ diff --combined clickslide/demo/demo.short index 0000000,9b239f6..9b239f6 mode 000000,100644..100644 --- a/clickslide/demo/demo.short +++ b/clickslide/demo/demo.short @@@ -1,0 -1,105 +1,105 @@@ + [html [head + [title ClickSlide Demo] + ] [body + [footer Clickslide Demo] + + [slide [h1 Clickslide] + a Compiler for Browser based Slideshows + ] + + [slide + [ul + [li Why would I write another Slideshow system] + [li What's wrong with JavaScript?] + [li How do you simplify HTML?] + ] + ] + + [slide [h2 Why Write another Slideshow System?] + [ul .uncover + [li WYSIWYG Slideshow applications are annoying [ul + [li too much fiddling, not straight to point] + ]] + [li [em LaTeX] is not exactly casual] + [li Existing browser slideshows are [ul + [li based on JavaScript] + [li Either verbous HTML, or unflexible markup] + ]] + ] + ] + + [slide [h2 Why avoid JavaScript] + [ul .uncover + [li Nothing wrong with JS as a programming language, [strong but...]] + [li Freedom to [em Use], [em Study], [em Share], and [em Improve] can in practice not be applied to code served from another computer (regardless of the license this code is under)] + [li Impossible to get browser security straight for Turing complete programs [ul + [li → Massive security problems, which are fundamentally unresolvable] + [li HTML and CSS are not Turing complete (CSS is a [em regular] language)] + ]] + [li Performance killer in practice] + ] + ] + + [slide [h1 Usage and Features]] + + [slide [h2 Simplifying HTML] + Maintain the flexibility of plain HTML. Decrease verbosity of the code. [br] + [pre style="display: inline-block; width: 46%; background-image: linear-gradient(rgba(255,255,255,.75), rgba(255,255,255,.5)), url(exb0.jpg);" + \ + \ + \Demo\ + \ + \ + \

Headline\ + \ + \ + ] + [pre style="display: inline-block; width: 46%; background-image: linear-gradient(rgba(255,255,255,.75), rgba(255,255,255,.5)), url(exb3.jpg);" + \[html + \[head + \[title Demo\] + \] + \[body \#frontpage + \[h1 .top Headline\] + \] + \] + ] + ] + + [slide [h2 Example Slide Show] + [pre + \[html \[head + \[title Example Slideshow\] + \]\[body + \[footer Title | Author | Date and Place\] + \[slide \[h1 Title\]\] + \[slide \[h2 A Slide\] + \[ul .uncover + \[li This list\] + \[li gets uncovered\] + \[li item by item\] + \]\]\]\] + ] + ] + + [slide [h2 Syntax] + [ul + [li Clickslide uses [a "//plutz.net/software/shorthand.html" Shorthand] syntax] + [li it introduces the [code slide]-tag to make up a single slide] + [li lists belonging to the [code \.uncover]-class will be uncovered item by item when the list is clicked] + [li You can view the source code of this presentation: [a "demo.short" click here]] + ] + ] + + [slide [h2 Features] + [ul + [li Whole slideshow is contained in one document] + [li Images get embedded into the document via base64-coding] + [li Slideshow can be put on a website, emailed, or passed around on a thumbdrive] + [li Slideshow can be viewed on virtually all desktop and mobile devices] + [li Source files can be easily tracked via version control] + ] + ] + + [slide [h1 Thank you for listening!]] + ] diff --combined clickslide/demo/exb0.jpg index 7aa9056,7aa9056..7aa9056 Binary files differ diff --combined clickslide/demo/exb1.jpg index cec5520,cec5520..cec5520 Binary files differ diff --combined clickslide/demo/exb2.jpg index 70710dc,70710dc..70710dc Binary files differ diff --combined clickslide/demo/exb3.jpg index c6832f0,c6832f0..c6832f0 Binary files differ