HTML source code, style-sheets, scripts, and images for deployment on mingw.osdn.io
Revision | 003cc5a29d0cfabf8588b700a826b516d639a087 (tree) |
---|---|
Time | 2020-11-03 06:41:07 |
Author | Keith Marshall <keith@user...> |
Commiter | Keith Marshall |
Adapt index.html to serve arbitrarily specified content.
* index.html (onload): Delegate content retrieval to...
(load_page): ...this new javascript function, passing URL.
(page-title, page-subtitle): Rename place-holders, using...
(as-page-title, as-page-subtitle): ...these alternative names.
* site.js (load_page): New function; it consolidates...
(new_page, load_page_overlay, load_page_content): ...these, but
excluding "page-title" and "page-subtitle" assignment; do this...
(load_content): ...here, using repeated invocations of...
(update_page_content_header): ...this new function; it propagates any
"page-title" and "page-subtitle" values from the loaded page fragment,
to their corresponding "index.html" place-holders, calling...
(no_break): ...this new function, to substitute non-breaking hyphens
in place of any included ASCII hyphen characters.
* header.html (navbar): Use fully qualified "href" URL links on all
tabs, replacing "onclick" actions.
* about.html fdl.html terms.html (page-title, page-subtitle): Assign
them to hidden <dt> elements, (in <dl style="display: none"> blocks),
whence they may be propagated, via javascript executed on loading of
the page fragment, to their visible "index.html" place-holders.
* terms.html: Additionally, use a fully qualified "href" link, for
reference to "fdl.html".
* missing.html (page-title): Add hidden <dt> entry.
* site.css (dl.masthead): Define new style, to conceal the <dl>
assignments for "page-title", and "page-subtitle"; adjust top margin
spacing for any immediately following paragraph.
@@ -2,6 +2,9 @@ | ||
2 | 2 | * |
3 | 3 | * about.html |
4 | 4 | * |
5 | + * Default landing page content for the MinGW.org web-site. | |
6 | + * | |
7 | + * | |
5 | 8 | * $Id$ |
6 | 9 | * |
7 | 10 | * Written by Keith Marshall <keith@users.osdn.me> |
@@ -45,6 +48,16 @@ | ||
45 | 48 | * ” right (closing) typographic double quote |
46 | 49 | * |
47 | 50 | --> |
51 | +<dl class="masthead"><!-- hidden for masthead class --> | |
52 | +<!-- FIXME: is there a better way to do this? We need to propagate | |
53 | + content to the "as-page-title" and "as-page-subtitle" place-holders, | |
54 | + within the "page-content" div of "index.html"; our javascript page | |
55 | + loader will explicitly look for these hidden elements, and copy | |
56 | + their content into the corresponding visible place-holders. | |
57 | +--> | |
58 | + <dt id="page-title">Welcome to MinGW.org</dt> | |
59 | + <dt id="page-subtitle">Home of the MinGW and MSYS Projects</dt> | |
60 | +</dl><!-- masthead --> | |
48 | 61 | <p><strong>MinGW</strong>, |
49 | 62 | a contraction of “Minimalist GNU for Windows”, |
50 | 63 | is a minimalist development environment |
@@ -40,6 +40,16 @@ | ||
40 | 40 | * DAMAGE. |
41 | 41 | * |
42 | 42 | --> |
43 | +<dl class="masthead"><!-- hidden for masthead class --> | |
44 | +<!-- FIXME: is there a better way to do this? We need to propagate | |
45 | + content to the "as-page-title" and "as-page-subtitle" place-holders, | |
46 | + within the "page-content" div of "index.html"; our javascript page | |
47 | + loader will explicitly look for these hidden elements, and copy | |
48 | + their content into the corresponding visible place-holders. | |
49 | +--> | |
50 | + <dt id="page-title">MinGW.org Licensing</dt> | |
51 | + <dt id="page-subtitle">The MinGW Free Documentation Licence</dt> | |
52 | +</dl><!-- masthead --> | |
43 | 53 | <p>Copyright © 2020, MinGW.org Project |
44 | 54 | </p> |
45 | 55 | <p>Redistribution and use in source and 'compiled' forms (SGML, HTML, |
@@ -39,41 +39,16 @@ | ||
39 | 39 | * OF THIS DOCUMENTATION, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH |
40 | 40 | * DAMAGE. |
41 | 41 | * |
42 | - * | |
43 | - * Note: this page assumes browser support for the following numeric | |
44 | - * HTML entity codes: | |
45 | - * | |
46 | - * ‑ non-breaking hyphen | |
47 | - * ’ typographic apostrophe | |
48 | - * | |
49 | 42 | --> |
50 | 43 | <a href="index.html"><div id="logo"></div></a> |
51 | 44 | <div class="text"> |
52 | 45 | <h1>Minimalist GNU for Windows</h1> |
53 | 46 | <ul id="navbar"> |
54 | - <li><a href="index.html">Home</a></li> | |
55 | - <li><a onclick="load_page_overlay('download.html', | |
56 | - 'MinGW Downloads', 'MinGW.org File Release System')" | |
57 | - href="#" | |
58 | - >Downloads</a> | |
59 | - </li> | |
60 | - <li><a onclick="load_page_overlay('terms.html', 'MinGW Licensing', | |
61 | - 'Terms of Use for MinGW.org Products and Resources')" | |
62 | - href="#" | |
63 | - >Licensing</a> | |
64 | - </li> | |
65 | - <li><a onclick="load_page_overlay('docrefs.html', | |
66 | - 'MinGW Product Documentation', | |
67 | - 'Links to Documentation Resources for MinGW.org Products')" | |
68 | - href="#" | |
69 | - >Documentation</a> | |
70 | - </li> | |
71 | - <li><a onclick="load_page_overlay('contact.html', | |
72 | - 'Contacting MinGW.org', | |
73 | - 'When the Web‑Site doesn’t Provide an Answer')" | |
74 | - href="#" | |
75 | - >Contact Us</a> | |
76 | - </li> | |
47 | + <li><a href="index.html?page=about.html">Home</a></li> | |
48 | + <li><a href="index.html?page=terms.html">Licensing</a></li> | |
49 | + <li><a href="index.html?page=download.html">Downloads</a></li> | |
50 | + <li><a href="index.html?page=docs.html">Documentation</a></li> | |
51 | + <li><a href="index.html?page=contact.html">Contact Us</a></li> | |
77 | 52 | </ul> |
78 | 53 | </div> |
79 | 54 |
@@ -49,12 +49,12 @@ | ||
49 | 49 | <link rel="stylesheet" href="site.css" /> |
50 | 50 | <script src="site.js"></script> |
51 | 51 | </head> |
52 | - <body onload="new_page('about.html', 'Home of the MinGW and MSYS Projects')"> | |
52 | + <body onload="load_page(document.URL)"> | |
53 | 53 | <div id="header"></div> |
54 | 54 | <div class="page-view"> |
55 | 55 | <div class="masthead"> |
56 | - <h1 id="page-title"></h1> | |
57 | - <h2 id="page-subtitle"></h2> | |
56 | + <h1 id="as-page-title"></h1> | |
57 | + <h2 id="as-page-subtitle"></h2> | |
58 | 58 | </div><!-- masthead --><hr /> |
59 | 59 | <div id="page-content"></div> |
60 | 60 | </div><!-- page-view --> |
@@ -47,6 +47,15 @@ | ||
47 | 47 | * ’ typographic apostrophe |
48 | 48 | * |
49 | 49 | --> |
50 | +<dl class="masthead"><!-- hidden for masthead class --> | |
51 | +<!-- FIXME: is there a better way to do this? We need to propagate | |
52 | + content to the "as-page-title" and "as-page-subtitle" place-holders, | |
53 | + within the "page-content" div of "index.html"; our javascript page | |
54 | + loader will explicitly look for these hidden elements, and copy | |
55 | + their content into the corresponding visible place-holders. | |
56 | +--> | |
57 | + <dt id="page-title">MinGW.org Server Error</dt> | |
58 | +</dl><!-- masthead --> | |
50 | 59 | <h2>Page Not Found</h2> |
51 | 60 | <p>The MinGW.org web‑site is undergoing an overhaul, |
52 | 61 | whilst in the process of transferring to a new hosting provider. |
@@ -212,6 +212,23 @@ p+ul | ||
212 | 212 | */ |
213 | 213 | margin: 0; padding-top: 1px; font-weight: normal; |
214 | 214 | } |
215 | +dl.masthead | |
216 | +{ /* On page overlays, we use a definition list to specify the | |
217 | + * page title, and subtitle, which are to be propagated to the | |
218 | + * masthead section within the page content; the content of the | |
219 | + * definition list, itself, should not be directly visible. | |
220 | + */ | |
221 | + display: none; | |
222 | +} | |
223 | +dl.masthead+p | |
224 | +{ /* The masthead section is separated from the remaining page | |
225 | + * content, by a horizontal rule; to keep white space balanced, | |
226 | + * above and below this rule, when it is immediately followed | |
227 | + * by a paragraph, with no intervening heading, we need to | |
228 | + * explicitly adjust the paragraph margin. | |
229 | + */ | |
230 | + margin-top: 1.3em; | |
231 | +} | |
215 | 232 | |
216 | 233 | /* Supplementary formatting for sections with numbered headings |
217 | 234 | * ============================================================ |
@@ -39,6 +39,25 @@ function set_content( item, value ) | ||
39 | 39 | if( element ) element.innerHTML = value; |
40 | 40 | } |
41 | 41 | |
42 | +function no_break( text ) | |
43 | +{ /* Helper function to replace all occurrences of ASCII hyphen-minus, | |
44 | + * within "text", by substitution of HTML non-breaking hyphen. | |
45 | + */ | |
46 | + return text.replace( /-/g, "‑" ); | |
47 | +} | |
48 | + | |
49 | +function update_page_content_header( tag ) | |
50 | +{ /* Update the "page-title" and "page-subtitle" content-header text, | |
51 | + * by substitution into the "as-page-title" and "as-page-subtitle" | |
52 | + * place-holder elements, respectively. | |
53 | + */ | |
54 | + var element = document.getElementById( "page-".concat( tag )); | |
55 | + if( element ) | |
56 | + { if( tag == "title" ) document.title = element.innerHTML; | |
57 | + set_content( "as-page-".concat( tag ), no_break( element.innerHTML )); | |
58 | + } | |
59 | +} | |
60 | + | |
42 | 61 | function load_content( container, src ) |
43 | 62 | { /* Set the content of the specified HTML "container" element, by |
44 | 63 | * injection of the entire contents of an external file which is |
@@ -51,6 +70,8 @@ function load_content( container, src ) | ||
51 | 70 | switch( this.status ) |
52 | 71 | { case 200: |
53 | 72 | set_content( container, this.responseText ); |
73 | + update_page_content_header( "title" ); | |
74 | + update_page_content_header( "subtitle" ); | |
54 | 75 | break; |
55 | 76 | case 404: |
56 | 77 | load_content( container, "missing.html" ); |
@@ -60,34 +81,19 @@ function load_content( container, src ) | ||
60 | 81 | request_handler.send(); |
61 | 82 | } |
62 | 83 | |
63 | -function load_page_content( src, subtitle ) | |
64 | -{ /* Propagate the HTML document title to the "masthead" display, | |
65 | - * update the displayed page subtitle, (which may be null), and | |
66 | - * load the page content from the specified "src" file. | |
67 | - */ | |
68 | - set_content( "page-content", null ); | |
69 | - set_content( "page-title", document.title ); | |
70 | - set_content( "page-subtitle", subtitle ); | |
71 | - load_content( "page-content", src ); | |
72 | -} | |
73 | - | |
74 | -function load_page_overlay( src, title, subtitle ) | |
75 | -{ /* Replace the existing page content from the specified overlay | |
76 | - * "src" file, updating the page title, and subtitle, as may be | |
77 | - * appropriate. | |
78 | - */ | |
79 | - if( title ) document.title = title; | |
80 | - load_page_content( src, subtitle ); | |
81 | -} | |
82 | - | |
83 | -function new_page( src, subtitle ) | |
84 | -{ /* Create a new page display, starting from scratch; assign the | |
85 | - * displayed title from the HTML document title attribute, adding | |
86 | - * the specified subtitle, lay out the standard page header block, | |
87 | - * and load the page content from the "src" file. | |
84 | +function load_page( src ) | |
85 | +{ /* Load page content from the HTML fragment file, as determined | |
86 | + * from the specified "src" URL; if no alternative fragment name | |
87 | + * is specified, fall back to loading "about.html". | |
88 | 88 | */ |
89 | + const ref = "?page="; | |
90 | + const div = "page-content"; | |
91 | + set_content( div, null ); | |
89 | 92 | load_content( "header", "header.html" ); |
90 | - load_page_content( src, subtitle ); | |
93 | + if( src.includes( ref ) ) | |
94 | + src = src.substring( src.indexOf( ref ) + ref.length, src.length ); | |
95 | + else src = "about.html"; | |
96 | + load_content( div, src ); | |
91 | 97 | } |
92 | 98 | |
93 | 99 | /* $RCSfile$: end of file */ |
@@ -49,6 +49,16 @@ | ||
49 | 49 | * ” right (closing) typographic double quote |
50 | 50 | * |
51 | 51 | --> |
52 | +<dl class="masthead"><!-- hidden for masthead class --> | |
53 | +<!-- FIXME: is there a better way to do this? We need to propagate | |
54 | + content to the "as-page-title" and "as-page-subtitle" place-holders, | |
55 | + within the "page-content" div of "index.html"; our javascript page | |
56 | + loader will explicitly look for these hidden elements, and copy | |
57 | + their content into the corresponding visible place-holders. | |
58 | +--> | |
59 | + <dt id="page-title">MinGW.org Licensing</dt> | |
60 | + <dt id="page-subtitle">Terms of Use for MinGW.org Products and Resources</dt> | |
61 | +</dl><!-- masthead --> | |
52 | 62 | <div class="h3-numbered"> |
53 | 63 | <p>Each of the various packages, |
54 | 64 | which are distributed by MinGW.org, |
@@ -60,9 +70,7 @@ are as follows:— | ||
60 | 70 | <h3>MinGW.org Web‑Site Content</h3> |
61 | 71 | <p>Publication of the content of this MinGW.org web‑site is |
62 | 72 | subject to the terms of |
63 | -<a href="#" | |
64 | -onclick="load_page_content('fdl.html','The MinGW Free Documentation Licence')" | |
65 | ->this MinGW specific adaptation</a> | |
73 | +<a href="index.html?page=fdl.html">this MinGW specific adaptation</a> | |
66 | 74 | of the |
67 | 75 | <a rel="noopener noreferrer" target="_blank" |
68 | 76 | href="https://www.freebsd.org/copyright/freebsd-doc-license.html" |