File: trnpix/_generate.sh

#===================================================================
# 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='<A HREF="index-dynamic.html">dynamic-layout</A> flavor \
      avoids horizontal scrolls and its \
      <A HREF="index-thumbsonly.html">thumbs-only</A> 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='<A HREF="index.html">fixed-layout</A> flavor \
      expands to fill space and its \
      <A HREF="index-thumbsonly.html">thumbs-only</A> 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='<A HREF="index.html">fixed-layout</A> flavor \
      expands to fill space and its \
      <A HREF="index-dynamic.html">dynamic-layout</A> 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



[Home page] Books Code Blog Python Author Train Find ©M.Lutz