File: cgi/showcode-template.txt

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<HTML>

<!-- This is a template: use your browser's "View Source" to see its expanded form -->
<!-- Python string formatting expands "__X__" targets here: see the .py CGI script -->

<!-------------------------------------------------------------------------------------->

<HEAD>

<!-- UTF8 for any non-ASCII Unicode in text -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<!-- Site-wide icon -->
<link rel="shortcut icon" type="image/x-icon" href="https://learning-python.com/favicon.ico" />

<!-- Site-wide styles: footer, code -->
<link rel="stylesheet" type="text/css" href="../_main.css">

<!-- Be mobile-friendly -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- Anonymous analytics to prioritize work: UA tag, ~Jul23 -->
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  ga('create', 'UA-52579036-1', 'auto');
  ga('set', 'anonymizeIp', true);            // Anonymize IP addr (&aip) [Jun-2019]
  ga('send', 'pageview');
</script>

<!-- Anonymous analytics to prioritize work: GA4 tag, Nov22+ -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-J8CTEZHX3L"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}    // Always IP anonymous
  gtag('js', new Date());
  gtag('config', 'G-J8CTEZHX3L');
</script>

<STYLE> 
LI {
    margin-bottom: 3px;    /* Space between listed items, to read and tap */
}
</STYLE>

<!-------------------------------------------------------------------------------------->

<!-- Jun-2021: style a floating jump-to-Top button, used/available iff JS enabled -->

<STYLE>
#topBtn {
    display: none;             /* initially hidden (change on scroll) */
    position: fixed;           /* float/persist */
    bottom: 36px;              /* above site toolbar */
    right: 8px;                /* left of scroll area */
    z-index: 99;               /* covering priority */
    font-size: 15px;
    border: none;
    outline: none;
    cursor: pointer;           /* change on mouse-over */
    padding: 10px;
    border-radius: 4px;        /* rounded corners */
    color: white;              /* foreground (text color) */
    background-color: #999;    /* which is #999999, which is rgb(153, 153, 153) */ 
}

.finalparagraph {           /* if needed, extra space above Top bottom at end of page */
    margin-bottom: 50px;    /* else text at end may be overlayed and unviewable */
}
</STYLE>

<!-------------------------------------------------------------------------------------->

<TITLE>File: %(__NAME__)s</TITLE>

</HEAD>

<BODY>

<!-------------------------------------------------------------------------------------->

<!-- Jun-2021: build+configure the floating Top button, used/available iff JS enabled -->
<!-- Button: "display: none" in CSS makes this widget invisible initially, JS or not  -->
<!-- Adapted from the more general website version, which goes to any #TOC tag instead-->
<!-- This is especially useful for mobile, where no ~top key/gesture may be available -->

<BUTTON onclick="topClick();" 
        id="topBtn" 
        title="Go to index">Top</button>

<!-- Set up click/scroll callbacks to jump/show, iff JS is enabled -->
<SCRIPT>

// Get and save the button in global (window) scope
var topButton = document.getElementById("topBtn");    // i.e., "Top"

// Set the default scroll constant: global so pages can change if needed
var topButtonShowAt = 500;    // px from top, show Top below this cutoff

function topClick() {
    //
    // Go to the top, clear hover shading? (else recessed color gets stuck on mobile).
    // Unhover failed as tried here: see the CSS code in website's version for details.
    //
    window.location.href = '#';              // go/scroll to page top (not toc tag)
}

function scrollFunction() {
    //
    // Adapted from a w3 example; the odd || test is for browser interoperability:
    // see, for instance, https://dev.opera.com/articles/fixing-the-scrolltop-bug/.
    //
    var showat = topButtonShowAt;  // local
    // N pixels from the top after scroll?
    if (document.body.scrollTop > showat || document.documentElement.scrollTop > showat) {
        topButton.style.display = "block";   // show Top
    } else {
        topButton.style.display = "none";    // hide Top
    }
}

// Show/hide button whenever user scrolls below/above N px from top
window.onscroll = scrollFunction;   // source had "function() {scrollFunction()};"; why?

</SCRIPT>

<!-------------------------------------------------------------------------------------->

<P><B><I>File</I>: %(__NAME__)s</B>    <!-- not H1: pathname may be long -->

<P>
<UL style="list-style-type: none;">
<!-- See urllib.[parse.]quote_plus for encoding, use 2 %% for 1 post formatting expr -->

<!-- Link to raw text-file content in "..": script sends plain text, inline or attachment -->
<LI>&#x21E8; Raw text
                 <A HREF="showcode.py?name=%(__NAMEURL__)s&rawmode=view">view</A> and
                 <A HREF="showcode.py?name=%(__NAMEURL__)s&rawmode=save">save</A>

<!-- Show myself: cgi/showcode.py and cgi/showcode-template.txt, relative to ".." -->
<LI>&#x21E8; Page
                 <A HREF="showcode.py?name=cgi%%2Fshowcode.py">script</A> and 
                 <A HREF="showcode.py?name=cgi%%2Fshowcode-template.txt">template</A>
</UL>

<P>
<!-- Use site-wide <pre> styling with auto-scroll, add more top space -->
<!-- Code is HTML-escaped, decoded Unicode codepoints (to be sent as UTF8-encoded bytes) -->

<STYLE>
/* Jul-22: use more horizontal space on narrow mobiles (else 20px * 2 via _main.css) */
@media screen and (max-device-width: 640px) { 
    PRE {
        margin-left: 3px; margin-right: 3px;     /* for 0..640w viewports, only */
    }
}

/* Jul-22: rounded corners, for s-n-g?  no: inconsistent with other <pre> as is */
/*PRE { 
    border-radius: 6px; 
}*/
</STYLE>

<DIV style="margin-top: 30px;" class=finalparagraph>
<PRE>%(__CODE__)s</PRE>
</DIV>
</P>

<!-------------------------------------------------------------------------------------->

<!-- Site-wide scrollable footer -->
<!-- This cgi subdir is outside the scope of the site's genhtml page generator, -->
<!-- and copying generated footer code here is a bad idea: requires future recopies. -->
<!-- Instead, grab a generated dummy in .. and prefix its links with ".." in the .py. -->

%(__FOOTER__)s

</BODY>
</HTML>



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