#===================================================================
# Generate trnpix galleries, but do not upload them.
# Run this script in its own folder, with 'bash _generate.sh'.
#
# As of May 2022, this makes 3 cross-linked variants of the index
# page: fixed and dynamic layout, and dynamic + thumbs-only mode.
# The subfolders made for all 3 are identical, except that their
# viewer-pages' Index buttons link to the index which opens them.
#
# Besides direct use, this is also run:
#
# - As a subscript from this folder's _publish.py, prior to
# automatic uploads.
#
# - By thumbspage's examples/trnpix, to ensure that trnpix results
# it copies are current (but examples/dynamiclayout does not).
#
# This Unix bash script is demo only: it requires a common.sh (not
# included), and either Cygwin, WSL, or DOS translation on Windows.
#
#---------------------------------------------------------------------
#
# [2.3] UPDATE: this now also builds a second index page for the
# gallery, with thumbspage (TP) dynamic-index layout to avoid all
# horizontal scrolling on mobile devices (i.e., candy-bar phones).
# Open its index-dynamic.html to view the alternative index page.
# A link to the other index is added to both indexes automatically.
#
# Details: as coded, the dynamic-alternative build creates a second
# index page, but also remakes both thumbnails and viewer pages in a
# second folder. It's possible to instead reuse a single and shared
# thumbs+viewers folder and skip thumbnail rebuilds (by simply using
# the default folder name in the second build below). But a second
# folder allows thumbs size to vary if desired (e.g., smaller for
# mobile), and also ensures that each variant's viewer pages return
# to its own index page on Index button taps. This also replaces a
# _HEADER.html tag to make HEADER.html twice, for preamble links.
#
# Discussion: 2.3's new .5 'em' dynamic-layout scheme packs labels
# tighter, so the new dynamic variant now renders as more than one
# column on larger phones. It's still not the index.html default,
# because it can leave some extra empty space on the right for some
# window sizes on desktop, and this website's traffic is 71% desktop
# over the last year (and probably higher, given analytics disabling).
#
# Moreover, fixed layout may be preferred for the 26% mobile-browser
# audience too. Fixed requires minor horizontal scrolling in portrait
# on mobile, but not once a user is inside the gallery. And smaller
# phones may still display just one column of thumbnails in dynamic
# layout, which makes for a lot more vertical scrolling in this > 100
# image gallery; dynamic largely trades hscrolls for vscrolls.
#
# OTOH, most full-size photos are larger in portrait, so rotating
# to landscape to reduce hscrolls isn't a good workaround for mobile.
# The real issue here is that most mobiles' form factors make them
# inherently subpar for viewing nontrivial content; see foldables!
#
#---------------------------------------------------------------------
#
# NEW: this script was augmented after TP's 2.3 May release to also
# build a third thumbs-only variant: index-thumbsonly.html. This
# mode isn't as useful for this gallery, despite its per-image notes:
# filenames are descriptive, and helpful when there are > 100 images.
#
# UPDATE: change popupFgColor from 'tan' to 'wheat' in Oct-2022.
# It's still less harsh than white (or goldenrod or cornsilk), but
# a bit brighter than tan (and #ddd or its ilk). Colors are hard.
#=====================================================================
# common defs and aliases
source ~/MY-STUFF/Websites/_admin/BUILD-THUMBSPAGE-CLIENTS/common.sh
#---------------------------------------------------------------------
# 1) Default index page: fixed layout
# make thumbs, viewer pages, and default index.html + _thumbspage/
#---------------------------------------------------------------------
# replace header tag
note='dynamic-layout flavor \
avoids horizontal scrolls and its \
thumbs-only cut omits labels'
py3 -c \
"open('HEADER.html', 'w', encoding='utf8').write( \
open('_HEADER.html', 'r', encoding='utf8').read().replace('\$ALTPAGE\$', '$note'))"
# build gallery
py3 $C/thumbspage/thumbspage.py . \
useDynamicIndexLayout=False \
inputCleanThumbsFolder=True inputThumbsPerRow=4 \
inputThumbMaxSize=100 inputUseViewerPages=True \
popupFgColor=\'wheat\' \
popupOpacity=0.45 \
omitIndexPageLabels=False
#---------------------------------------------------------------------
# 2) Alternative index page: dynamic layout
# make new thumbs and viewer pages, and index-dynamic.html
#---------------------------------------------------------------------
# replace header tag
note='fixed-layout flavor \
expands to fill space and its \
thumbs-only cut omits labels'
py3 -c \
"open('HEADER.html', 'w', encoding='utf8').write( \
open('_HEADER.html', 'r', encoding='utf8').read().replace('\$ALTPAGE\$', '$note'))"
# build gallery
py3 $C/thumbspage/thumbspage.py . \
INDEX=\'index-dynamic\' \
THUMBS=\'_thumbspage-dynamic\' \
useDynamicIndexLayout=True \
dynamicLayoutPaddingH=\'6px\' \
dynamicLayoutPaddingV=\'6px\' \
inputCleanThumbsFolder=True \
inputThumbMaxSize=100 inputUseViewerPages=True \
popupFgColor=\'wheat\' \
popupOpacity=0.45 \
omitIndexPageLabels=False
#---------------------------------------------------------------------
# 3) Alternative index page: thumbs-only mode (dynamic layout)
# make new thumbs and viewer pages, and index-thumbsonly.html
#---------------------------------------------------------------------
# replace header tag
note='fixed-layout flavor \
expands to fill space and its \
dynamic-layout cut \
avoids horizontal scrolls'
py3 -c \
"open('HEADER.html', 'w', encoding='utf8').write( \
open('_HEADER.html', 'r', encoding='utf8').read().replace('\$ALTPAGE\$', '$note'))"
# build gallery
py3 $C/thumbspage/thumbspage.py . \
INDEX=\'index-thumbsonly\' \
THUMBS=\'_thumbspage-thumbsonly\' \
useDynamicIndexLayout=True \
dynamicLayoutPaddingH=\'16px\' \
dynamicLayoutPaddingV=\'16px\' \
inputCleanThumbsFolder=True \
inputThumbMaxSize=100 inputUseViewerPages=True \
popupFgColor=\'wheat\' \
popupOpacity=0.45 \
omitIndexPageLabels=True
#---------------------------------------------------------------------
# Prior build-command form (doc only)
#---------------------------------------------------------------------
## old style: use bash 'here' document for console inputs
## use all defaults except muted white popup text (#dddddd == #ddd)
##
## py3 $C/thumbspage/thumbspage.py . popupFgColor=\'#dddddd\' <<-EOF
##
##
##
##
## EOF