28 changed files with 10580 additions and 250 deletions
Split View
Diff Options
-
+39 -12pskov/en/education.01.why.html
-
+12 -10pskov/en/education.01.why.md
-
+19 -2pskov/en/education.02.deps.html
-
+2 -2pskov/en/education.02.deps.md
-
+38 -21pskov/en/education.03.site.html
-
+21 -21pskov/en/education.03.site.md
-
+27 -10pskov/en/education.04.lang.html
-
+10 -10pskov/en/education.04.lang.md
-
+85 -69pskov/en/education.05.blog.html
-
+67 -69pskov/en/education.05.blog.md
-
+29 -12pskov/en/education.html
-
+11 -11pskov/en/education.md
-
+18 -1pskov/en/item.template
-
+17 -0pskov/en/pskov_1.0.0.html
-
+230 -0pskov/ru/education.01.why.html
-
+67 -0pskov/ru/education.01.why.md
-
+185 -0pskov/ru/education.02.deps.html
-
+64 -0pskov/ru/education.02.deps.md
-
+387 -0pskov/ru/education.03.site.html
-
+247 -0pskov/ru/education.03.site.md
-
+281 -0pskov/ru/education.04.lang.html
-
+187 -0pskov/ru/education.04.lang.md
-
+712 -0pskov/ru/education.05.blog.html
-
+480 -0pskov/ru/education.05.blog.md
-
+241 -0pskov/ru/education.html
-
+68 -0pskov/ru/education.md
-
+105 -0pskov/ru/item.template
-
+6931 -0pskov/ru/pskov_1.0.0+ru.html
+ 39
- 12
pskov/en/education.01.why.html
View File
| @@ -64,9 +64,17 @@ | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| pskov_1.0.0 | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| @@ -74,6 +82,10 @@ | |||
| <strong id="title">PSKOV</strong> | |||
| <a href="pskov_1.0.0.html">Tool</a> | |||
| <a href="education.html">Education</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.01.why.html">EN</a> | |||
| <a href="../ru/education.01.why.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Education: 01. Why | |||
| @@ -105,7 +117,7 @@ Education: 01. Why | |||
| </ul> | |||
| <p><a name="why"/></p> | |||
| <h2 id="01why">01. Why</h2> | |||
| <p>You might know there already exist quite a lot of <a href="https://medium.com/codingthesmartway-com-blog/top-static-site-generators-for-2019-26a4c8afcc05">static site generators</a>, why create another one? Because <strong>they are not good enough</strong> for <a href="http://opengamestudio.org">Opensource Game Studio</a> needs.</p> | |||
| <p>You might know there already exist quite a lot of <a href="https://medium.com/codingthesmartway-com-blog/top-static-site-generators-for-2019-26a4c8afcc05">static site generators</a>, why create another one? Because <strong>they were not good enough</strong> for <a href="http://opengamestudio.org">Open Game Studio</a> needs.</p> | |||
| <p>Here's a list of <strong>features we don't need</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| @@ -119,7 +131,7 @@ Education: 01. Why | |||
| <tr> | |||
| <td>1</td> | |||
| <td>Learning anything beyond HTML, CSS, JavaScript, and Markdown</td> | |||
| <td>These technologies are enough to deliver information to users</td> | |||
| <td>These technologies are enough to have a clean web site</td> | |||
| </tr> | |||
| <tr> | |||
| <td>2</td> | |||
| @@ -129,12 +141,12 @@ Education: 01. Why | |||
| <tr> | |||
| <td>3</td> | |||
| <td>Installation</td> | |||
| <td>We had enough updates that were never requested</td> | |||
| <td>No more forced updates that were never requested</td> | |||
| </tr> | |||
| <tr> | |||
| <td>4</td> | |||
| <td>Comprehensible source code</td> | |||
| <td>Single file with just enough number of lines</td> | |||
| <td>No more millions of source code files</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| @@ -152,8 +164,8 @@ Education: 01. Why | |||
| <tbody> | |||
| <tr> | |||
| <td>1</td> | |||
| <td>Bare HTML, CSS, JavaScript, and Markdown</td> | |||
| <td>No need for template language, web framework or anything else</td> | |||
| <td>HTML, CSS, JavaScript, and Markdown</td> | |||
| <td>Just what you already know</td> | |||
| </tr> | |||
| <tr> | |||
| <td>2</td> | |||
| @@ -162,17 +174,27 @@ Education: 01. Why | |||
| </tr> | |||
| <tr> | |||
| <td>3</td> | |||
| <td>Optional installation</td> | |||
| <td><strong>PSKOV</strong> is available at <a href="http://opengamestudio.org/pskov">http://opengamestudio.org/pskov</a>. However, if you want to keep <strong>PSKOV</strong> locally, you can get <strong>PSKOV</strong> single HTML file <a href="http://opengamestudio.org/pskov-201905.html">here</a> and open it locally</td> | |||
| <td>Available on-line</td> | |||
| <td><a href="http://opengamestudio.org/pskov">http://opengamestudio.org/pskov</a></td> | |||
| </tr> | |||
| <tr> | |||
| <td>4</td> | |||
| <td>Comprehensible source code</td> | |||
| <td><strong>PSKOV</strong> is a <a href="http://opengamestudio.org/pskov-201905.html">single HTML file</a> with less than 10000 lines of code</td> | |||
| <td>Available off-line</td> | |||
| <td>Just save the <a href="http://opengamestudio.org/pskov">Tool</a> page and then open it locally</td> | |||
| </tr> | |||
| <tr> | |||
| <td>5</td> | |||
| <td>Decades long support (DLS)</td> | |||
| <td>Comprehensible source code</td> | |||
| <td><strong>PSKOV</strong> is a single HTML file</td> | |||
| </tr> | |||
| <tr> | |||
| <td>6</td> | |||
| <td>Belongs to everyone</td> | |||
| <td><strong>PSKOV</strong> is released under <a href="https://creativecommons.org/share-your-work/public-domain/cc0/">CC0</a> license (public domain)</td> | |||
| </tr> | |||
| <tr> | |||
| <td>7</td> | |||
| <td>Runs for decades</td> | |||
| <td>You can use <strong>PSKOV</strong> on both Windows 2000 and Windows 2030*</td> | |||
| </tr> | |||
| </tbody> | |||
| @@ -196,6 +218,11 @@ Education: 01. Why | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| The site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a> | |||
| from <a href="http://github.com/ogstudio/site-pskov">this source code</a>. | |||
| The site is hosted by <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
+ 12
- 10
pskov/en/education.01.why.md
View File
| @@ -1,5 +1,5 @@ | |||
| Title: Education: 01. Why | |||
| Date: 2019-05-14 00:00 | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education.01.why | |||
| Lang: en | |||
| @@ -23,16 +23,16 @@ Estimated completion time: 5 minutes. | |||
| ## 01. Why | |||
| You might know there already exist quite a lot of [static site generators][other-generators], why create another one? Because **they are not good enough** for [Opensource Game Studio][ogs] needs. | |||
| You might know there already exist quite a lot of [static site generators][other-generators], why create another one? Because **they were not good enough** for [Open Game Studio][ogs] needs. | |||
| Here's a list of **features we don't need**: | |||
| | № | Unwelcome feature | Note | | |||
| |---|---|---| | |||
| | 1 | Learning anything beyond HTML, CSS, JavaScript, and Markdown | These technologies are enough to deliver information to users | | |||
| | 1 | Learning anything beyond HTML, CSS, JavaScript, and Markdown | These technologies are enough to have a clean web site | | |||
| | 2 | Server side | Nobody should be able to pull the plug on you except yourself | | |||
| | 3 | Installation | We had enough updates that were never requested | | |||
| | 4 | Comprehensible source code | Single file with just enough number of lines | | |||
| | 3 | Installation | No more forced updates that were never requested | | |||
| | 4 | Comprehensible source code | No more millions of source code files | | |||
| <a name="features"/> | |||
| @@ -42,11 +42,13 @@ Consequently, here is a list of **PSKOV features**: | |||
| | № | PSKOV feature | Note | | |||
| |---|---|---| | |||
| | 1 | Bare HTML, CSS, JavaScript, and Markdown | No need for template language, web framework or anything else | | |||
| | 1 | HTML, CSS, JavaScript, and Markdown | Just what you already know | | |||
| | 2 | Client side | **PSKOV** is a client side JavaScript application, it runs solely on your device | | |||
| | 3 | Optional installation | **PSKOV** is available at [http://opengamestudio.org/pskov][pskov]. However, if you want to keep **PSKOV** locally, you can get **PSKOV** single HTML file [here][pskov-src] and open it locally | | |||
| | 4 | Comprehensible source code | **PSKOV** is a [single HTML file][pskov-src] with less than 10000 lines of code | | |||
| | 5 | Decades long support (DLS) | You can use **PSKOV** on both Windows 2000 and Windows 2030\* | | |||
| | 3 | Available on-line | [http://opengamestudio.org/pskov][pskov] | | |||
| | 4 | Available off-line | Just save the [Tool][pskov] page and then open it locally | | |||
| | 5 | Comprehensible source code | **PSKOV** is a single HTML file | | |||
| | 6 | Belongs to everyone | **PSKOV** is released under [CC0][cc0] license (public domain)| | |||
| | 7 | Runs for decades | You can use **PSKOV** on both Windows 2000 and Windows 2030\* | | |||
| \* Windows 2030 does not (yet) exist, we simply refer to the fact that **PSKOV** is designed to work for operating systems released in the range of years 2000-2030 | |||
| @@ -62,4 +64,4 @@ Consequently, here is a list of **PSKOV features**: | |||
| [other-generators]: https://medium.com/codingthesmartway-com-blog/top-static-site-generators-for-2019-26a4c8afcc05 | |||
| [ogs]: http://opengamestudio.org | |||
| [pskov]: http://opengamestudio.org/pskov | |||
| [pskov-src]: http://opengamestudio.org/pskov-201905.html | |||
| [cc0]: https://creativecommons.org/share-your-work/public-domain/cc0/ | |||
+ 19
- 2
pskov/en/education.02.deps.html
View File
| @@ -64,9 +64,17 @@ | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| pskov_1.0.0 | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| @@ -74,6 +82,10 @@ | |||
| <strong id="title">PSKOV</strong> | |||
| <a href="pskov_1.0.0.html">Tool</a> | |||
| <a href="education.html">Education</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.02.deps.html">EN</a> | |||
| <a href="../ru/education.02.deps.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Education: 02. Dependencies | |||
| @@ -141,7 +153,7 @@ Education: 02. Dependencies | |||
| <ul> | |||
| <li>is a tiny Python server to provide read/write access to local file system</li> | |||
| <li>runs at 8000 port</li> | |||
| <li>is under 200 lines of code, feel free to <a href="https://bitbucket.org/ogstudio/lfsa/src/default/lfsa-201905.py">inspect it</a></li> | |||
| <li>is under 200 lines of code, feel free to <a href="https://bitbucket.org/ogstudio/lfsa/src/default/lfsa_1.0.0.py">inspect it</a></li> | |||
| </ul> | |||
| <p></div><div class="contents"></p> | |||
| <table> | |||
| @@ -161,6 +173,11 @@ Education: 02. Dependencies | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| The site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a> | |||
| from <a href="http://github.com/ogstudio/site-pskov">this source code</a>. | |||
| The site is hosted by <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
+ 2
- 2
pskov/en/education.02.deps.md
View File
| @@ -1,5 +1,5 @@ | |||
| Title: Education: 02. Dependencies | |||
| Date: 2019-05-14 00:00 | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education.02.deps | |||
| Lang: en | |||
| @@ -60,5 +60,5 @@ We designed **PSKOV** to run inside web browsers. Here is what you need to run * | |||
| [next]: education.03.site.html | |||
| [lfsa]: http://opengamestudio.org/lfsa | |||
| [lfsa-src]: https://bitbucket.org/ogstudio/lfsa/src/default/lfsa-201905.py | |||
| [lfsa-src]: https://bitbucket.org/ogstudio/lfsa/src/default/lfsa_1.0.0.py | |||
| [showdown]: https://github.com/showdownjs/showdown | |||
+ 38
- 21
pskov/en/education.03.site.html
View File
| @@ -64,9 +64,17 @@ | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| pskov_1.0.0 | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| @@ -74,6 +82,10 @@ | |||
| <strong id="title">PSKOV</strong> | |||
| <a href="pskov_1.0.0.html">Tool</a> | |||
| <a href="education.html">Education</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.03.site.html">EN</a> | |||
| <a href="../ru/education.03.site.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Education: 03. Site | |||
| @@ -101,7 +113,7 @@ Education: 03. Site | |||
| <p><strong>Table of contents</strong></p> | |||
| <ul> | |||
| <li><a href="#inspiration">01. Inspiration</a></li> | |||
| <li><a href="#cfg">02. Investigate <code>cfg</code> file</a></li> | |||
| <li><a href="#cfg">02. Investigate <code>pskov.cfg</code> file</a></li> | |||
| <li><a href="#item">03. Investigate <code>item.template</code> file</a></li> | |||
| <li><a href="#md">04. Investigate <code>about.md</code> and <code>cv.md</code> files</a></li> | |||
| <li><a href="#lfsa">05. Launch LFSA</a></li> | |||
| @@ -118,19 +130,19 @@ Education: 03. Site | |||
| </ul> | |||
| <p>Some time later you have the following files in your <a href="https://github.com/OGStudio/site-pskov-sample/tree/master/01.TwoPages">site directory</a>:</p> | |||
| <ul> | |||
| <li>cfg</li> | |||
| <li>pskov.cfg</li> | |||
| <li>item.template</li> | |||
| <li>about.md</li> | |||
| <li>cv.md</li> | |||
| </ul> | |||
| <p>Let's look at their contents closer.</p> | |||
| <p><a name="cfg"/></p> | |||
| <h2 id="02investigatecfgfile">02. Investigate <code>cfg</code> file</h2> | |||
| <p><code>cfg</code> file has the following contents:</p> | |||
| <h2 id="02investigatepskovcfgfile">02. Investigate <code>pskov.cfg</code> file</h2> | |||
| <p><code>pskov.cfg</code> file has the following contents:</p> | |||
| <pre><code>input = . | |||
| item = item.template | |||
| </code></pre> | |||
| <p><code>cfg</code> is an <a href="https://en.wikipedia.org/wiki/INI_file">INI file</a> with the following keys specified:</p> | |||
| <p><code>pskov.cfg</code> is an <a href="https://en.wikipedia.org/wiki/INI_file">INI file</a> with the following keys specified:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| @@ -149,7 +161,7 @@ item = item.template | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>In our case, <code>item.template</code> file is located alongside <code>cfg</code>, so we use <code>.</code> to denote current directory.</p> | |||
| <p>In our case, <code>item.template</code> file is located alongside <code>pskov.cfg</code>, so we use <code>.</code> to denote current directory.</p> | |||
| <p><a name="item"/></p> | |||
| <h2 id="03investigateitemtemplatefile">03. Investigate <code>item.template</code> file</h2> | |||
| <p><code>item.template</code> file has the following contents:</p> | |||
| @@ -192,7 +204,7 @@ PSKOV_ITEM_CONTENTS | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_TITLE</code></td> | |||
| <td>Provides title from <code>Title:</code> part of page's header section</td> | |||
| <td>Value of <code>Title</code> key of the page's Markdown file</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_CONTENTS</code></td> | |||
| @@ -203,7 +215,7 @@ PSKOV_ITEM_CONTENTS | |||
| <p><strong>Notes</strong>:</p> | |||
| <ul> | |||
| <li>other <strong>PSKOV</strong> constants are described later</li> | |||
| <li>page's header section is described below</li> | |||
| <li>page's Markdown file is described below</li> | |||
| </ul> | |||
| <p><a name="md"/></p> | |||
| <h2 id="04investigateaboutmdandcvmdfiles">04. Investigate <code>about.md</code> and <code>cv.md</code> files</h2> | |||
| @@ -231,17 +243,17 @@ PSKOV_ITEM_CONTENTS | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Header constant</th> | |||
| <th>Header key</th> | |||
| <th>Description</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>Title:</code></td> | |||
| <td><code>Title</code></td> | |||
| <td>Provides value for <code>PSKOV_ITEM_TITLE</code> constant when generating HTML out of Markdown</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>Slug:</code></td> | |||
| <td><code>Slug</code></td> | |||
| <td>Tells <strong>PSKOV</strong> that particular Markdown file should be saved under <code><slug>.html</code> filename</td> | |||
| </tr> | |||
| </tbody> | |||
| @@ -267,7 +279,7 @@ PSKOV_ITEM_CONTENTS | |||
| <p><a name="lfsa"/></p> | |||
| <h2 id="05launchlfsa">05. Launch LFSA</h2> | |||
| <p>Launch <a href="http://opengamestudio.org/lfsa">LFSA</a> so that it points to directory with the files we just observed:</p> | |||
| <pre><code>$ /path/to/lfsa-201905.py /path/to/dir/01.TwoPages | |||
| <pre><code>$ /path/to/lfsa_1.0.0.py /path/to/dir/01.TwoPages | |||
| </code></pre> | |||
| <p>You should see output similar to this:</p> | |||
| <pre><code>DIR: '/Users/kornerr/p/site-pskov-sample/01.TwoPages' | |||
| @@ -279,8 +291,8 @@ PORT: '8000' | |||
| <ul> | |||
| <li>Go to <a href="http://opengamestudio.org/pskov">Tool</a> page</li> | |||
| <li>Make sure<ul> | |||
| <li><code>Path:</code> points to the same directory you specified before</li> | |||
| <li><code>Input directory:</code> and <code>Item template:</code> have values from <code>cfg</code></li></ul></li> | |||
| <li><code>Path</code> points to the same directory you specified before</li> | |||
| <li><code>Input directory</code> and <code>Item template</code> have values from <code>pskov.cfg</code></li></ul></li> | |||
| <li>Press <code>Generate</code> button to generate HTML files right where Markdown ones reside</li> | |||
| <li>Open generated <code>about.html</code> from the site's directory</li> | |||
| <li>You should see your web site running locally</li> | |||
| @@ -288,7 +300,7 @@ PORT: '8000' | |||
| <p><a name="summary"/></p> | |||
| <h2 id="07summary">07. Summary</h2> | |||
| <p>You have successfully generated a web site with two pages. <a href="http://opengamestudio.org/pskov/sample/01.TwoPages/about.html">Check out the result</a>.</p> | |||
| <p>Introduced PSKOV constants include:</p> | |||
| <p>Introduced <strong>PSKOV</strong> constants include:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| @@ -299,7 +311,7 @@ PORT: '8000' | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_TITLE</code></td> | |||
| <td>Provides title from <code>Title:</code> part of page's header section</td> | |||
| <td>Value of <code>Title</code> key of the page's Markdown file</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_CONTENTS</code></td> | |||
| @@ -326,21 +338,21 @@ PORT: '8000' | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Introduced header constants include:</p> | |||
| <p>Introduced header keys include:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Header constant</th> | |||
| <th>Header key</th> | |||
| <th>Description</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>Title:</code></td> | |||
| <td><code>Title</code></td> | |||
| <td>Provides value for <code>PSKOV_ITEM_TITLE</code> constant when generating HTML out of Markdown</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>Slug:</code></td> | |||
| <td><code>Slug</code></td> | |||
| <td>Tells <strong>PSKOV</strong> that particular Markdown file should be saved under <code><slug>.html</code> filename</td> | |||
| </tr> | |||
| </tbody> | |||
| @@ -363,6 +375,11 @@ PORT: '8000' | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| The site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a> | |||
| from <a href="http://github.com/ogstudio/site-pskov">this source code</a>. | |||
| The site is hosted by <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
+ 21
- 21
pskov/en/education.03.site.md
View File
| @@ -1,5 +1,5 @@ | |||
| Title: Education: 03. Site | |||
| Date: 2019-05-14 00:00 | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education.03.site | |||
| Lang: en | |||
| @@ -17,7 +17,7 @@ Estimated completion time: 10 minutes. | |||
| **Table of contents** | |||
| * [01. Inspiration](#inspiration) | |||
| * [02. Investigate `cfg` file](#cfg) | |||
| * [02. Investigate `pskov.cfg` file](#cfg) | |||
| * [03. Investigate `item.template` file](#item) | |||
| * [04. Investigate `about.md` and `cv.md` files](#md) | |||
| * [05. Launch LFSA](#lfsa) | |||
| @@ -37,7 +37,7 @@ You set on to create the following pages: | |||
| Some time later you have the following files in your [site directory][01-files]: | |||
| * cfg | |||
| * pskov.cfg | |||
| * item.template | |||
| * about.md | |||
| * cv.md | |||
| @@ -46,23 +46,23 @@ Let's look at their contents closer. | |||
| <a name="cfg"/> | |||
| ## 02. Investigate `cfg` file | |||
| ## 02. Investigate `pskov.cfg` file | |||
| `cfg` file has the following contents: | |||
| `pskov.cfg` file has the following contents: | |||
| ``` | |||
| input = . | |||
| item = item.template | |||
| ``` | |||
| `cfg` is an [INI file][ini-file] with the following keys specified: | |||
| `pskov.cfg` is an [INI file][ini-file] with the following keys specified: | |||
| | Key | Description | | |||
| |---|---| | |||
| | `input` | Points to a directory where `item`'s file is located | | |||
| | `item` | Points to an HTML template file that is used to generate HTML files out of Markdown ones | | |||
| In our case, `item.template` file is located alongside `cfg`, so we use `.` to denote current directory. | |||
| In our case, `item.template` file is located alongside `pskov.cfg`, so we use `.` to denote current directory. | |||
| <a name="item"/> | |||
| @@ -105,13 +105,13 @@ As you can see, `item.template` is an average HTML file with two **PSKOV** const | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_ITEM_TITLE` | Provides title from `Title:` part of page's header section | | |||
| | `PSKOV_ITEM_TITLE` | Value of `Title` key of the page's Markdown file | | |||
| | `PSKOV_ITEM_CONTENTS` | Provides HTML contents generated out of Markdown contents | | |||
| **Notes**: | |||
| * other **PSKOV** constants are described later | |||
| * page's header section is described below | |||
| * page's Markdown file is described below | |||
| <a name="md"/> | |||
| @@ -142,10 +142,10 @@ As you can see, `item.template` is an average HTML file with two **PSKOV** const | |||
| `about.md` starts with a so-called header section: | |||
| | Header constant | Description | | |||
| | Header key | Description | | |||
| |---|---| | |||
| | `Title:` | Provides value for `PSKOV_ITEM_TITLE` constant when generating HTML out of Markdown | | |||
| | `Slug:` | Tells **PSKOV** that particular Markdown file should be saved under `<slug>.html` filename | | |||
| | `Title` | Provides value for `PSKOV_ITEM_TITLE` constant when generating HTML out of Markdown | | |||
| | `Slug` | Tells **PSKOV** that particular Markdown file should be saved under `<slug>.html` filename | | |||
| The rest of `about.md` contents is what any Markdown file looks like. | |||
| @@ -178,7 +178,7 @@ As you can see, there's nothing new in `cv.md` except for a Markdown table. | |||
| Launch [LFSA][lfsa] so that it points to directory with the files we just observed: | |||
| ``` | |||
| $ /path/to/lfsa-201905.py /path/to/dir/01.TwoPages | |||
| $ /path/to/lfsa_1.0.0.py /path/to/dir/01.TwoPages | |||
| ``` | |||
| You should see output similar to this: | |||
| @@ -196,8 +196,8 @@ Now it's finally time to generate your personal web site: | |||
| * Go to [Tool][tool] page | |||
| * Make sure | |||
| * `Path:` points to the same directory you specified before | |||
| * `Input directory:` and `Item template:` have values from `cfg` | |||
| * `Path` points to the same directory you specified before | |||
| * `Input directory` and `Item template` have values from `pskov.cfg` | |||
| * Press `Generate` button to generate HTML files right where Markdown ones reside | |||
| * Open generated `about.html` from the site's directory | |||
| * You should see your web site running locally | |||
| @@ -208,11 +208,11 @@ Now it's finally time to generate your personal web site: | |||
| You have successfully generated a web site with two pages. [Check out the result][01-sample]. | |||
| Introduced PSKOV constants include: | |||
| Introduced **PSKOV** constants include: | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_ITEM_TITLE` | Provides title from `Title:` part of page's header section | | |||
| | `PSKOV_ITEM_TITLE` | Value of `Title` key of the page's Markdown file | | |||
| | `PSKOV_ITEM_CONTENTS` | Provides HTML contents generated out of Markdown contents | | |||
| Introduced configuration keys include: | |||
| @@ -222,12 +222,12 @@ Introduced configuration keys include: | |||
| | `input` | Points to a directory where `item`'s file is located | | |||
| | `item` | Points to an HTML template file that is used to generate HTML files out of Markdown ones | | |||
| Introduced header constants include: | |||
| Introduced header keys include: | |||
| | Header constant | Description | | |||
| | Header key | Description | | |||
| |---|---| | |||
| | `Title:` | Provides value for `PSKOV_ITEM_TITLE` constant when generating HTML out of Markdown | | |||
| | `Slug:` | Tells **PSKOV** that particular Markdown file should be saved under `<slug>.html` filename | | |||
| | `Title` | Provides value for `PSKOV_ITEM_TITLE` constant when generating HTML out of Markdown | | |||
| | `Slug` | Tells **PSKOV** that particular Markdown file should be saved under `<slug>.html` filename | | |||
| </div><div class="contents"> | |||
+ 27
- 10
pskov/en/education.04.lang.html
View File
| @@ -64,9 +64,17 @@ | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| pskov_1.0.0 | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| @@ -74,6 +82,10 @@ | |||
| <strong id="title">PSKOV</strong> | |||
| <a href="pskov_1.0.0.html">Tool</a> | |||
| <a href="education.html">Education</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.04.lang.html">EN</a> | |||
| <a href="../ru/education.04.lang.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Education: 04. Language | |||
| @@ -101,7 +113,7 @@ Education: 04. Language | |||
| <p><strong>Table of contents</strong></p> | |||
| <ul> | |||
| <li><a href="#localization">01. Localization</a></li> | |||
| <li><a href="#cfg">02. Investigate <code>cfg</code> file</a></li> | |||
| <li><a href="#cfg">02. Investigate <code>pskov.cfg</code> file</a></li> | |||
| <li><a href="#item">03. Investigate template files</a></li> | |||
| <li><a href="#md">04. Investigate Markdown files</a></li> | |||
| <li><a href="#gen">05. Launch LFSA and generate the site</a></li> | |||
| @@ -112,7 +124,7 @@ Education: 04. Language | |||
| <p>Now that you have your web site in English you start to wonder why there's no Russian version, you're Russian after all!</p> | |||
| <p>You set on to create the following <a href="https://github.com/OGStudio/site-pskov-sample/tree/master/02.Language">directory structure</a>:</p> | |||
| <ul> | |||
| <li><code>cfg</code></li> | |||
| <li><code>pskov.cfg</code></li> | |||
| <li><code>en/item.template</code></li> | |||
| <li><code>en/about.md</code></li> | |||
| <li><code>en/cv.md</code></li> | |||
| @@ -122,8 +134,8 @@ Education: 04. Language | |||
| </ul> | |||
| <p>Let's look at the contents of these files closer.</p> | |||
| <p><a name="cfg"/></p> | |||
| <h2 id="02investigatecfgfile">02. Investigate <code>cfg</code> file</h2> | |||
| <p><code>cfg</code> file has the following contents:</p> | |||
| <h2 id="02investigatepskovcfgfile">02. Investigate <code>pskov.cfg</code> file</h2> | |||
| <p><code>pskov.cfg</code> file has the following contents:</p> | |||
| <pre><code>input = en;ru | |||
| item = item.template | |||
| </code></pre> | |||
| @@ -185,14 +197,14 @@ item = item.template | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_URL</code></td> | |||
| <td>Provides generated page's file name: <code><slug>.html</code></td> | |||
| <td>Provides generated page's file name</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>As you see, <code>PSKOV_ITEM_URL</code> is all you need to have your page in as many languages as you please.</p> | |||
| <p><a name="md"/></p> | |||
| <h2 id="04investigatemarkdownfiles">04. Investigate Markdown files</h2> | |||
| <p><code>en/about.md</code> and <code>en/cv.md</code> files look almost exactly as <a href="education.03.site.html">before</a>. <code>ru/about.md</code> and <code>ru/cv.md</code> are simply Russian variants of the same pages.</p> | |||
| <p><code>en/about.md</code> and <code>en/cv.md</code> files look almost exactly as <a href="education.03.site.html">before</a>. <code>ru/about.md</code> and <code>ru/cv.md</code> are simply Russian variants of corresponding pages.</p> | |||
| <p>For example, <code>ru/cv.md</code> has the following contents:</p> | |||
| <pre><code> Title: Резюме | |||
| Slug: cv | |||
| @@ -208,11 +220,11 @@ item = item.template | |||
| | Учёба | Императорская Академия художеств | | |||
| | Звания | * академик ИАХ (1898) <br> * действительный член ИАХ (1903) | | |||
| </code></pre> | |||
| <p><strong>Note</strong>: Russian page has exactly the same <code>Slug:</code> value as English one.</p> | |||
| <p><strong>Note</strong>: Russian page has exactly the same <code>Slug</code> value as English one.</p> | |||
| <p><a name="gen"/></p> | |||
| <h2 id="05launchlfsaandgeneratethesite">05. Launch LFSA and generate the site</h2> | |||
| <p>Launch <a href="http://opengamestudio.org/lfsa">LFSA</a> so that it points to directory with the files we just observed:</p> | |||
| <pre><code>$ /path/to/lfsa-201905.py /path/to/dir/02.Language | |||
| <pre><code>$ /path/to/lfsa_1.0.0.py /path/to/dir/02.Language | |||
| </code></pre> | |||
| <p>Generate the site:</p> | |||
| <ul> | |||
| @@ -235,7 +247,7 @@ item = item.template | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_URL</code></td> | |||
| <td>Provides generated page's file name: <code><slug>.html</code></td> | |||
| <td>Provides generated page's file name</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| @@ -257,6 +269,11 @@ item = item.template | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| The site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a> | |||
| from <a href="http://github.com/ogstudio/site-pskov">this source code</a>. | |||
| The site is hosted by <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
+ 10
- 10
pskov/en/education.04.lang.md
View File
| @@ -1,5 +1,5 @@ | |||
| Title: Education: 04. Language | |||
| Date: 2019-05-21 00:00 | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education.04.lang | |||
| Lang: en | |||
| @@ -17,7 +17,7 @@ Estimated completion time: 10 minutes. | |||
| **Table of contents** | |||
| * [01. Localization](#localization) | |||
| * [02. Investigate `cfg` file](#cfg) | |||
| * [02. Investigate `pskov.cfg` file](#cfg) | |||
| * [03. Investigate template files](#item) | |||
| * [04. Investigate Markdown files](#md) | |||
| * [05. Launch LFSA and generate the site](#gen) | |||
| @@ -31,7 +31,7 @@ Now that you have your web site in English you start to wonder why there's no Ru | |||
| You set on to create the following [directory structure][02-files]: | |||
| * `cfg` | |||
| * `pskov.cfg` | |||
| * `en/item.template` | |||
| * `en/about.md` | |||
| * `en/cv.md` | |||
| @@ -43,9 +43,9 @@ Let's look at the contents of these files closer. | |||
| <a name="cfg"/> | |||
| ## 02. Investigate `cfg` file | |||
| ## 02. Investigate `pskov.cfg` file | |||
| `cfg` file has the following contents: | |||
| `pskov.cfg` file has the following contents: | |||
| ``` | |||
| input = en;ru | |||
| @@ -112,7 +112,7 @@ Language selection uses new **PSKOV** constant: | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_ITEM_URL` | Provides generated page's file name: `<slug>.html` | | |||
| | `PSKOV_ITEM_URL` | Provides generated page's file name | | |||
| As you see, `PSKOV_ITEM_URL` is all you need to have your page in as many languages as you please. | |||
| @@ -120,7 +120,7 @@ As you see, `PSKOV_ITEM_URL` is all you need to have your page in as many langua | |||
| ## 04. Investigate Markdown files | |||
| `en/about.md` and `en/cv.md` files look almost exactly as [before][prev]. `ru/about.md` and `ru/cv.md` are simply Russian variants of the same pages. | |||
| `en/about.md` and `en/cv.md` files look almost exactly as [before][prev]. `ru/about.md` and `ru/cv.md` are simply Russian variants of corresponding pages. | |||
| For example, `ru/cv.md` has the following contents: | |||
| @@ -140,7 +140,7 @@ For example, `ru/cv.md` has the following contents: | |||
| | Звания | * академик ИАХ (1898) <br> * действительный член ИАХ (1903) | | |||
| ``` | |||
| **Note**: Russian page has exactly the same `Slug:` value as English one. | |||
| **Note**: Russian page has exactly the same `Slug` value as English one. | |||
| <a name="gen"/> | |||
| @@ -149,7 +149,7 @@ For example, `ru/cv.md` has the following contents: | |||
| Launch [LFSA][lfsa] so that it points to directory with the files we just observed: | |||
| ``` | |||
| $ /path/to/lfsa-201905.py /path/to/dir/02.Language | |||
| $ /path/to/lfsa_1.0.0.py /path/to/dir/02.Language | |||
| ``` | |||
| Generate the site: | |||
| @@ -169,7 +169,7 @@ Introduced PSKOV constants include: | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_ITEM_URL` | Provides generated page's file name: `<slug>.html` | | |||
| | `PSKOV_ITEM_URL` | Provides generated page's file name | | |||
| </div><div class="contents"> | |||
+ 85
- 69
pskov/en/education.05.blog.html
View File
| @@ -64,9 +64,17 @@ | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| pskov_1.0.0 | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| @@ -74,6 +82,10 @@ | |||
| <strong id="title">PSKOV</strong> | |||
| <a href="pskov_1.0.0.html">Tool</a> | |||
| <a href="education.html">Education</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.05.blog.html">EN</a> | |||
| <a href="../ru/education.05.blog.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Education: 05. Blog | |||
| @@ -96,15 +108,15 @@ Education: 05. Blog | |||
| </tbody> | |||
| </table> | |||
| <p></div><div class="contents"></p> | |||
| <p>In this document we create "dynamic" pages like blog posts.</p> | |||
| <p>In this document we create "dynamic" pages for a blog.</p> | |||
| <p>Estimated completion time: 20 minutes.</p> | |||
| <p><strong>Table of contents</strong></p> | |||
| <ul> | |||
| <li><a href="#blog">01. Blog</a></li> | |||
| <li><a href="#cfg">02. Investigate <code>cfg</code> file</a></li> | |||
| <li><a href="#cfg">02. Investigate <code>pskov.cfg</code> file</a></li> | |||
| <li><a href="#item">03. Investigate item templates of the blog</a></li> | |||
| <li><a href="#preview">04. Investigate preview templates</a></li> | |||
| <li><a href="#index">05. Investigate index (summary) templates</a></li> | |||
| <li><a href="#index">05. Investigate templates of preview pages</a></li> | |||
| <li><a href="#pagination">06. Investigate pagination templates</a></li> | |||
| <li><a href="#md">07. Investigate Markdown files</a></li> | |||
| <li><a href="#gen">08. Launch LFSA and generate the site</a></li> | |||
| @@ -112,10 +124,10 @@ Education: 05. Blog | |||
| </ul> | |||
| <p><a name="blog"/></p> | |||
| <h2 id="01blog">01. Blog</h2> | |||
| <p>So, you have your web site in both English and Russian. You start to feel the need to constantly share your thoughts with the world as blog posts.</p> | |||
| <p>So, you have your web site in both English and Russian. You start to feel the need to regularly share your thoughts with the world as blog posts.</p> | |||
| <p>You set on to create the following <a href="https://github.com/OGStudio/site-pskov-sample/tree/master/03.Blog">directory structure</a>:</p> | |||
| <ul> | |||
| <li><code>cfg</code></li> | |||
| <li><code>pskov.cfg</code></li> | |||
| <li><code>en/blog/</code><ul> | |||
| <li><code>item.template</code></li> | |||
| <li><code>index.template</code></li> | |||
| @@ -157,8 +169,8 @@ Education: 05. Blog | |||
| </ul> | |||
| <p>Let's look at the contents of these files closer.</p> | |||
| <p><a name="cfg"/></p> | |||
| <h2 id="02investigatecfgfile">02. Investigate <code>cfg</code> file</h2> | |||
| <p><code>cfg</code> file has the following contents:</p> | |||
| <h2 id="02investigatepskovcfgfile">02. Investigate <code>pskov.cfg</code> file</h2> | |||
| <p><code>pskov.cfg</code> file has the following contents:</p> | |||
| <pre><code>input = en/page;ru/page;en/blog;ru/blog | |||
| item = item.template | |||
| preview = preview.template | |||
| @@ -171,7 +183,7 @@ previewEnding = . . . | |||
| previewsPerPage = 3 | |||
| previewPageBaseName = index | |||
| </code></pre> | |||
| <p>Apart from already used <code>input</code> and <code>item</code> keys, we have quite a lot of new ones. Let's break them down:</p> | |||
| <p>You already met <code>input</code> and <code>item</code> keys. Let's see into new ones:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| @@ -182,39 +194,39 @@ previewPageBaseName = index | |||
| <tbody> | |||
| <tr> | |||
| <td><code>preview</code></td> | |||
| <td>Points to an HTML template file that is used to generate HTML previews out of the first <code>previewSize</code> (approximately) characters of Markdown files</td> | |||
| <td>Points to an HTML template that is used to generate HTML preview out of the first <code>previewSize</code> (approximately) characters for each Markdown file</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>index</code></td> | |||
| <td>Points to an HTML template file that is used to generate HTML index (summary) files to host previews</td> | |||
| <td>Points to an HTML template that is used to generate preview page to host previews</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationPrev</code></td> | |||
| <td>Points to an HTML template file that is used to generate pagination section used by the <em>last</em> index (summary) file</td> | |||
| <td>Points to an HTML template that is used to generate pagination section to navigate backwards</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationNext</code></td> | |||
| <td>Points to an HTML template file that is used to generate pagination section used by the <em>first</em> index (summary) file</td> | |||
| <td>Points to an HTML template that is used to generate pagination section to navigate forward</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationPrevNext</code></td> | |||
| <td>Points to an HTML template file that is used to generate pagination section used by index (summary) files <em>except the ones at the beginning and at the end</em></td> | |||
| <td>Points to an HTML template that is used to generate pagination section</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewSize</code></td> | |||
| <td>How many characters (approximately) to take out of a Markdown file to generate an HTML preview</td> | |||
| <td>How many characters (approximately) to take out of a Markdown file to generate a preview</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewEnding</code></td> | |||
| <td>String to use at the end of HTML previews</td> | |||
| <td>String to use at the end of each preview</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewsPerPage</code></td> | |||
| <td>Number of HTML previews hosted by single index (summary) file</td> | |||
| <td>Maximum number of previews hosted by a preview page</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewsPageBaseName</code></td> | |||
| <td>Index (summary) file base name</td> | |||
| <td>Base file name for preview pages</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| @@ -222,8 +234,8 @@ previewPageBaseName = index | |||
| <ul> | |||
| <li>we restrict previews to <code>200</code> characters in size (approximately)</li> | |||
| <li>we use <code>. . .</code> string at the end of each preview</li> | |||
| <li>index (summary) files host <code>3</code> previews maximum</li> | |||
| <li>index (summary) files are saved as <code>index.html</code>, <code>index2.html</code>, <code>index3.html</code>, etc.</li> | |||
| <li>preview pages host <code>3</code> previews maximum</li> | |||
| <li>preview pages are saved as <code>index.html</code>, <code>index2.html</code>, <code>index3.html</code>, etc.</li> | |||
| </ul> | |||
| <p><a name="item"/></p> | |||
| <h2 id="03investigateitemtemplatesoftheblog">03. Investigate item templates of the blog</h2> | |||
| @@ -291,8 +303,8 @@ PSKOV_ITEM_CONTENTS | |||
| <p>As you can see, both files look similar to <code>item.template</code> files we saw <a href="education.04.lang.html">before</a>.</p> | |||
| <p>The changes include:</p> | |||
| <ul> | |||
| <li>new URLs to reference pages in <code>page</code> directory and first index (summary) file in <code>blog</code> directory</li> | |||
| <li>title is now referenced inside <code>contents</code> section as a link to complete page</li> | |||
| <li>new URLs to reference pages in <code>page</code> directory and the first preview page in <code>blog</code> directory</li> | |||
| <li>title is referenced inside <code>contents</code> section as a link pointing to a complete blog post</li> | |||
| <li>date is referenced to highlight relationship among different blog posts in time</li> | |||
| </ul> | |||
| <p>Date reference uses new <code>PSKOV_ITEM_DATE</code> constant:</p> | |||
| @@ -306,7 +318,7 @@ PSKOV_ITEM_CONTENTS | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_DATE</code></td> | |||
| <td>Provides date from <code>Date:</code> part of page's header section</td> | |||
| <td>Value of <code>Date</code> key of the page's Markdown file</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| @@ -338,7 +350,7 @@ PSKOV_PREVIEW | |||
| </div> | |||
| </code></pre></li> | |||
| </ul> | |||
| <p>Previews have no <code><head></code>, <code><body></code>, and similar full page HTML tags. Previews represent sections inserted into index (summary) files.</p> | |||
| <p>Previews have no <code><head></code>, <code><body></code>, and similar full page HTML tags. Previews represent sections inserted into preview pages.</p> | |||
| <p>Preview itself is referenced by <code>PSKOV_PREVIEW</code> constant:</p> | |||
| <table> | |||
| <thead> | |||
| @@ -350,12 +362,12 @@ PSKOV_PREVIEW | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_PREVIEW</code></td> | |||
| <td>Provides contents from a Markdown file limited by <code>previewSize</code> characters (approximately)</td> | |||
| <td>Provides contents of a Markdown file limited by <code>previewSize</code> characters (approximately)</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><a name="index"/></p> | |||
| <h2 id="05investigateindexsummarytemplates">05. Investigate index (summary) templates</h2> | |||
| <h2 id="05investigatetemplatesofpreviewpages">05. Investigate templates of preview pages</h2> | |||
| <ul> | |||
| <li><p><code>en/blog/index.template</code> contents:</p> | |||
| <pre><code>- - - - Collapsed for brevity - - - - | |||
| @@ -411,7 +423,6 @@ PSKOV_PAGINATION | |||
| <li>beginning and ending were collapsed for brevity</li> | |||
| <li><code>PSKOV_INDEX_URL</code> constant is used to provide language selection</li> | |||
| </ul> | |||
| <p>Index (summary) files are used to host previews.</p> | |||
| <p>Here are new <strong>PSKOV</strong> constants explained:</p> | |||
| <table> | |||
| <thead> | |||
| @@ -423,21 +434,21 @@ PSKOV_PAGINATION | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_INDEX_URL</code></td> | |||
| <td>Provides generated page's file name: <code><previewsPageBaseName><id>.html</code></td> | |||
| <td>Provides generated preview page file name: <code><previewsPageBaseName><id>.html</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREVIEWS</code></td> | |||
| <td>Provides a combination of <code>PSKOV_PREVIEW</code> sections</td> | |||
| <td>Provides a set of previews</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGINATION</code></td> | |||
| <td>Provides pagination section to navigate index (summary) pages</td> | |||
| <td>Provides pagination section to navigate preview pages</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><a name="pagination"/></p> | |||
| <h2 id="06investigatepaginationtemplates">06. Investigate pagination templates</h2> | |||
| <p>Pagination templates represent sections used to navigate index (summary) pages.</p> | |||
| <p>Pagination templates represent HTML sections to navigate preview pages.</p> | |||
| <p>There are free pagination templates:</p> | |||
| <table> | |||
| <thead> | |||
| @@ -448,16 +459,16 @@ PSKOV_PAGINATION | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>prev</td> | |||
| <td>Is used for the last index (summary) page because we can only go backwards</td> | |||
| <td>Previous</td> | |||
| <td>A visitor can only go backwards</td> | |||
| </tr> | |||
| <tr> | |||
| <td>next</td> | |||
| <td>Is used for the first index (summary) page because we can only go forward</td> | |||
| <td>Next</td> | |||
| <td>A visitor can only go forward</td> | |||
| </tr> | |||
| <tr> | |||
| <td>both</td> | |||
| <td>Is used for intermediate index (summary) pages because we can either go backwards, or forward</td> | |||
| <td>Both</td> | |||
| <td>A visitor can either go backwards, or forward</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| @@ -501,19 +512,19 @@ PSKOV_PAGINATION | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_PAGE_ID</code></td> | |||
| <td>Provides index (summary) page id starting from <code>1</code></td> | |||
| <td>Provides preview page id starting from <code>1</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGES_COUNT</code></td> | |||
| <td>Provides total number of index (summary) pages generated</td> | |||
| <td>Provides total number of generated preview pages</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREV_PAGE_URL</code></td> | |||
| <td>Provides previous index (summary) page file name</td> | |||
| <td>Provides previous preview page file name</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_NEXT_PAGE_URL</code></td> | |||
| <td>Provides next index (summary) page file name</td> | |||
| <td>Provides next preview page file name</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| @@ -530,17 +541,17 @@ PSKOV_PAGINATION | |||
| [bullocks]: https://upload.wikimedia.org/wikipedia/commons/c/cb/Walentin_Aleksandrovich_Serov_Bullocks.jpg | |||
| </code></pre> | |||
| <p>Date is used to sort blog posts by date in ascending order:</p> | |||
| <p>Date is used to sort blog posts by date in descending order:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Header constant</th> | |||
| <th>Header key</th> | |||
| <th>Description</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>Date:</code></td> | |||
| <td><code>Date</code></td> | |||
| <td>Provides value for <code>PSKOV_ITEM_DATE</code> constant when generating HTML out of Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| @@ -548,18 +559,18 @@ PSKOV_PAGINATION | |||
| <p><a name="gen"/></p> | |||
| <h2 id="08launchlfsaandgeneratethesite">08. Launch LFSA and generate the site</h2> | |||
| <p>Launch <a href="http://opengamestudio.org/lfsa">LFSA</a> so that it points to directory with the files we just observed:</p> | |||
| <pre><code>$ /path/to/lfsa-201905.py /path/to/dir/03.Blog | |||
| <pre><code>$ /path/to/lfsa_1.0.0.py /path/to/dir/03.Blog | |||
| </code></pre> | |||
| <p>Generate the site:</p> | |||
| <ul> | |||
| <li>Go to <a href="http://opengamestudio.org/pskov">Tool</a> page</li> | |||
| <li>Press <code>Generate</code> button</li> | |||
| <li>Open generated <code>en/blog/index.html</code> or <code>ru/blog/index.html</code> from the site's directory locally</li> | |||
| <li>Navigate index (summary) pages to make sure everything works fine</li> | |||
| <li>Navigate preview pages to make sure everything works fine</li> | |||
| </ul> | |||
| <p><a name="summary"/></p> | |||
| <h2 id="09summary">09. Summary</h2> | |||
| <p>You have successfully generated a web site with "constant" and "dynamic" pages. <a href="http://opengamestudio.org/pskov/sample/03.Blog/en/blog/index.html">Check out the result</a>.</p> | |||
| <p>You have successfully generated a web site with "dynamic" blog posts. <a href="http://opengamestudio.org/pskov/sample/03.Blog/en/blog/index.html">Check out the result</a>.</p> | |||
| <p>Introduced PSKOV constants include:</p> | |||
| <table> | |||
| <thead> | |||
| @@ -571,39 +582,39 @@ PSKOV_PAGINATION | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_DATE</code></td> | |||
| <td>Provides date from <code>Date:</code> part of page's header section</td> | |||
| <td>Value of <code>Date</code> key of the page's Markdown file</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREVIEW</code></td> | |||
| <td>Provides contents from a Markdown file limited by <code>previewSize</code> characters (approximately)</td> | |||
| <td>Provides contents of a Markdown file limited by <code>previewSize</code> characters (approximately)</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_INDEX_URL</code></td> | |||
| <td>Provides generated page's file name: <code><previewsPageBaseName><id>.html</code></td> | |||
| <td>Provides generated preview page file name: <code><previewsPageBaseName><id>.html</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREVIEWS</code></td> | |||
| <td>Provides a combination of <code>PSKOV_PREVIEW</code> sections</td> | |||
| <td>Provides a set of previews</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGINATION</code></td> | |||
| <td>Provides pagination section to navigate index (summary) pages</td> | |||
| <td>Provides pagination section to navigate preview pages</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGE_ID</code></td> | |||
| <td>Provides index (summary) page id starting from <code>1</code></td> | |||
| <td>Provides preview page id starting from <code>1</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGES_COUNT</code></td> | |||
| <td>Provides total number of index (summary) pages generated</td> | |||
| <td>Provides total number of generated preview pages</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREV_PAGE_URL</code></td> | |||
| <td>Provides previous index (summary) page file name</td> | |||
| <td>Provides previous preview page file name</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_NEXT_PAGE_URL</code></td> | |||
| <td>Provides next index (summary) page file name</td> | |||
| <td>Provides next preview page file name</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| @@ -618,58 +629,58 @@ PSKOV_PAGINATION | |||
| <tbody> | |||
| <tr> | |||
| <td><code>preview</code></td> | |||
| <td>Points to an HTML template file that is used to generate HTML previews out of the first <code>previewSize</code> (approximately) characters of Markdown files</td> | |||
| <td>Points to an HTML template that is used to generate HTML preview out of the first <code>previewSize</code> (approximately) characters for each Markdown file</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>index</code></td> | |||
| <td>Points to an HTML template file that is used to generate HTML index (summary) files to host previews</td> | |||
| <td>Points to an HTML template that is used to generate preview page to host previews</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationPrev</code></td> | |||
| <td>Points to an HTML template file that is used to generate pagination section used by the <em>last</em> index (summary) file</td> | |||
| <td>Points to an HTML template that is used to generate pagination section to navigate backwards</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationNext</code></td> | |||
| <td>Points to an HTML template file that is used to generate pagination section used by the <em>first</em> index (summary) file</td> | |||
| <td>Points to an HTML template that is used to generate pagination section to navigate forward</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationPrevNext</code></td> | |||
| <td>Points to an HTML template file that is used to generate pagination section used by index (summary) files <em>except the ones at the beginning and at the end</em></td> | |||
| <td>Points to an HTML template that is used to generate pagination section</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewSize</code></td> | |||
| <td>How many characters (approximately) to take out of a Markdown file to generate an HTML preview</td> | |||
| <td>How many characters (approximately) to take out of a Markdown file to generate a preview</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewEnding</code></td> | |||
| <td>String to use at the end of HTML previews</td> | |||
| <td>String to use at the end of each preview</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewsPerPage</code></td> | |||
| <td>Number of HTML previews hosted by single index (summary) file</td> | |||
| <td>Maximum number of previews hosted by a preview page</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewsPageBaseName</code></td> | |||
| <td>Index (summary) file base name</td> | |||
| <td>Base file name for preview pages</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Introduced header constants include:</p> | |||
| <p>Introduced header keys include:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Header constant</th> | |||
| <th>Header key</th> | |||
| <th>Description</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>Date:</code></td> | |||
| <td><code>Date</code></td> | |||
| <td>Provides value for <code>PSKOV_ITEM_DATE</code> constant when generating HTML out of Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>This was the final document to make you proficient in generating static sites with <strong>PSKOV</strong>. If you like what we do, support us by joining our group at <a href="https://twitter.com/OpenGameStudio">Twitter</a>, <a href="https://www.facebook.com/groups/162611230470183">Facebook</a>, or <a href="https://vk.com/opengamestudo">VK</a>.</p> | |||
| <p>This was the final document to make you proficient in generating static sites with <strong>PSKOV</strong>. If you like what we do, join us at <a href="https://vk.com/opengamestudo">VK</a>, <a href="https://twitter.com/OpenGameStudio">Twitter</a>, or <a href="https://www.facebook.com/groups/162611230470183">Facebook</a>.</p> | |||
| <p>Now use <strong>PSKOV</strong> to generate your very own web site!</p> | |||
| <p></div><div class="contents"></p> | |||
| <table> | |||
| @@ -689,6 +700,11 @@ PSKOV_PAGINATION | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| The site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a> | |||
| from <a href="http://github.com/ogstudio/site-pskov">this source code</a>. | |||
| The site is hosted by <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
+ 67
- 69
pskov/en/education.05.blog.md
View File
| @@ -10,17 +10,17 @@ Lang: en | |||
| </div><div class="contents"> | |||
| In this document we create "dynamic" pages like blog posts. | |||
| In this document we create "dynamic" pages for a blog. | |||
| Estimated completion time: 20 minutes. | |||
| **Table of contents** | |||
| * [01. Blog](#blog) | |||
| * [02. Investigate `cfg` file](#cfg) | |||
| * [02. Investigate `pskov.cfg` file](#cfg) | |||
| * [03. Investigate item templates of the blog](#item) | |||
| * [04. Investigate preview templates](#preview) | |||
| * [05. Investigate index (summary) templates](#index) | |||
| * [05. Investigate templates of preview pages](#index) | |||
| * [06. Investigate pagination templates](#pagination) | |||
| * [07. Investigate Markdown files](#md) | |||
| * [08. Launch LFSA and generate the site](#gen) | |||
| @@ -30,11 +30,11 @@ Estimated completion time: 20 minutes. | |||
| ## 01. Blog | |||
| So, you have your web site in both English and Russian. You start to feel the need to constantly share your thoughts with the world as blog posts. | |||
| So, you have your web site in both English and Russian. You start to feel the need to regularly share your thoughts with the world as blog posts. | |||
| You set on to create the following [directory structure][03-files]: | |||
| * `cfg` | |||
| * `pskov.cfg` | |||
| * `en/blog/` | |||
| * `item.template` | |||
| * `index.template` | |||
| @@ -78,9 +78,9 @@ Let's look at the contents of these files closer. | |||
| <a name="cfg"/> | |||
| ## 02. Investigate `cfg` file | |||
| ## 02. Investigate `pskov.cfg` file | |||
| `cfg` file has the following contents: | |||
| `pskov.cfg` file has the following contents: | |||
| ``` | |||
| input = en/page;ru/page;en/blog;ru/blog | |||
| @@ -96,26 +96,26 @@ previewsPerPage = 3 | |||
| previewPageBaseName = index | |||
| ``` | |||
| Apart from already used `input` and `item` keys, we have quite a lot of new ones. Let's break them down: | |||
| You already met `input` and `item` keys. Let's see into new ones: | |||
| | Key | Description | | |||
| |---|---| | |||
| | `preview` | Points to an HTML template file that is used to generate HTML previews out of the first `previewSize` (approximately) characters of Markdown files | | |||
| | `index` | Points to an HTML template file that is used to generate HTML index (summary) files to host previews | | |||
| | `paginationPrev` | Points to an HTML template file that is used to generate pagination section used by the *last* index (summary) file | | |||
| | `paginationNext` | Points to an HTML template file that is used to generate pagination section used by the *first* index (summary) file | | |||
| | `paginationPrevNext` | Points to an HTML template file that is used to generate pagination section used by index (summary) files *except the ones at the beginning and at the end* | | |||
| | `previewSize` | How many characters (approximately) to take out of a Markdown file to generate an HTML preview | | |||
| | `previewEnding` | String to use at the end of HTML previews | | |||
| | `previewsPerPage` | Number of HTML previews hosted by single index (summary) file | | |||
| | `previewsPageBaseName` | Index (summary) file base name | | |||
| | `preview` | Points to an HTML template that is used to generate HTML preview out of the first `previewSize` (approximately) characters for each Markdown file | | |||
| | `index` | Points to an HTML template that is used to generate preview page to host previews | | |||
| | `paginationPrev` | Points to an HTML template that is used to generate pagination section to navigate backwards | | |||
| | `paginationNext` | Points to an HTML template that is used to generate pagination section to navigate forward | | |||
| | `paginationPrevNext` | Points to an HTML template that is used to generate pagination section | | |||
| | `previewSize` | How many characters (approximately) to take out of a Markdown file to generate a preview | | |||
| | `previewEnding` | String to use at the end of each preview | | |||
| | `previewsPerPage` | Maximum number of previews hosted by a preview page | | |||
| | `previewsPageBaseName` | Base file name for preview pages | | |||
| In our case: | |||
| * we restrict previews to `200` characters in size (approximately) | |||
| * we use `. . .` string at the end of each preview | |||
| * index (summary) files host `3` previews maximum | |||
| * index (summary) files are saved as `index.html`, `index2.html`, `index3.html`, etc. | |||
| * preview pages host `3` previews maximum | |||
| * preview pages are saved as `index.html`, `index2.html`, `index3.html`, etc. | |||
| <a name="item"/> | |||
| @@ -190,15 +190,15 @@ As you can see, both files look similar to `item.template` files we saw [before] | |||
| The changes include: | |||
| * new URLs to reference pages in `page` directory and first index (summary) file in `blog` directory | |||
| * title is now referenced inside `contents` section as a link to complete page | |||
| * new URLs to reference pages in `page` directory and the first preview page in `blog` directory | |||
| * title is referenced inside `contents` section as a link pointing to a complete blog post | |||
| * date is referenced to highlight relationship among different blog posts in time | |||
| Date reference uses new `PSKOV_ITEM_DATE` constant: | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_ITEM_DATE` | Provides date from `Date:` part of page's header section | | |||
| | `PSKOV_ITEM_DATE` | Value of `Date` key of the page's Markdown file | | |||
| <a name="preview"/> | |||
| @@ -234,17 +234,17 @@ Date reference uses new `PSKOV_ITEM_DATE` constant: | |||
| </div> | |||
| ``` | |||
| Previews have no `<head>`, `<body>`, and similar full page HTML tags. Previews represent sections inserted into index (summary) files. | |||
| Previews have no `<head>`, `<body>`, and similar full page HTML tags. Previews represent sections inserted into preview pages. | |||
| Preview itself is referenced by `PSKOV_PREVIEW` constant: | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_PREVIEW` | Provides contents from a Markdown file limited by `previewSize` characters (approximately) | | |||
| | `PSKOV_PREVIEW` | Provides contents of a Markdown file limited by `previewSize` characters (approximately) | | |||
| <a name="index"/> | |||
| ## 05. Investigate index (summary) templates | |||
| ## 05. Investigate templates of preview pages | |||
| * `en/blog/index.template` contents: | |||
| @@ -305,29 +305,27 @@ Preview itself is referenced by `PSKOV_PREVIEW` constant: | |||
| * beginning and ending were collapsed for brevity | |||
| * `PSKOV_INDEX_URL` constant is used to provide language selection | |||
| Index (summary) files are used to host previews. | |||
| Here are new **PSKOV** constants explained: | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_INDEX_URL` | Provides generated page's file name: `<previewsPageBaseName><id>.html` | | |||
| | `PSKOV_PREVIEWS` | Provides a combination of `PSKOV_PREVIEW` sections | | |||
| | `PSKOV_PAGINATION` | Provides pagination section to navigate index (summary) pages | | |||
| | `PSKOV_INDEX_URL` | Provides generated preview page file name: `<previewsPageBaseName><id>.html` | | |||
| | `PSKOV_PREVIEWS` | Provides a set of previews | | |||
| | `PSKOV_PAGINATION` | Provides pagination section to navigate preview pages | | |||
| <a name="pagination"/> | |||
| ## 06. Investigate pagination templates | |||
| Pagination templates represent sections used to navigate index (summary) pages. | |||
| Pagination templates represent HTML sections to navigate preview pages. | |||
| There are free pagination templates: | |||
| | Pagination template | Description | | |||
| |---|---| | |||
| | prev | Is used for the last index (summary) page because we can only go backwards | | |||
| | next | Is used for the first index (summary) page because we can only go forward | | |||
| | both | Is used for intermediate index (summary) pages because we can either go backwards, or forward | | |||
| | Previous | A visitor can only go backwards | | |||
| | Next | A visitor can only go forward | | |||
| | Both | A visitor can either go backwards, or forward | | |||
| Let's look at English pagination templates: | |||
| @@ -373,10 +371,10 @@ Here are new **PSKOV** constants we used: | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_PAGE_ID` | Provides index (summary) page id starting from `1` | | |||
| | `PSKOV_PAGES_COUNT` | Provides total number of index (summary) pages generated | | |||
| | `PSKOV_PREV_PAGE_URL` | Provides previous index (summary) page file name | | |||
| | `PSKOV_NEXT_PAGE_URL` | Provides next index (summary) page file name | | |||
| | `PSKOV_PAGE_ID` | Provides preview page id starting from `1` | | |||
| | `PSKOV_PAGES_COUNT` | Provides total number of generated preview pages | | |||
| | `PSKOV_PREV_PAGE_URL` | Provides previous preview page file name | | |||
| | `PSKOV_NEXT_PAGE_URL` | Provides next preview page file name | | |||
| <a name="md"/> | |||
| @@ -396,11 +394,11 @@ Markdown files represent blog posts and they look almost like Markdown files for | |||
| [bullocks]: https://upload.wikimedia.org/wikipedia/commons/c/cb/Walentin_Aleksandrovich_Serov_Bullocks.jpg | |||
| ``` | |||
| Date is used to sort blog posts by date in ascending order: | |||
| Date is used to sort blog posts by date in descending order: | |||
| | Header constant | Description | | |||
| | Header key | Description | | |||
| |---|---| | |||
| | `Date:` | Provides value for `PSKOV_ITEM_DATE` constant when generating HTML out of Markdown | | |||
| | `Date` | Provides value for `PSKOV_ITEM_DATE` constant when generating HTML out of Markdown | | |||
| <a name="gen"/> | |||
| @@ -409,7 +407,7 @@ Date is used to sort blog posts by date in ascending order: | |||
| Launch [LFSA][lfsa] so that it points to directory with the files we just observed: | |||
| ``` | |||
| $ /path/to/lfsa-201905.py /path/to/dir/03.Blog | |||
| $ /path/to/lfsa_1.0.0.py /path/to/dir/03.Blog | |||
| ``` | |||
| Generate the site: | |||
| @@ -417,49 +415,49 @@ Generate the site: | |||
| * Go to [Tool][tool] page | |||
| * Press `Generate` button | |||
| * Open generated `en/blog/index.html` or `ru/blog/index.html` from the site's directory locally | |||
| * Navigate index (summary) pages to make sure everything works fine | |||
| * Navigate preview pages to make sure everything works fine | |||
| <a name="summary"/> | |||
| ## 09. Summary | |||
| You have successfully generated a web site with "constant" and "dynamic" pages. [Check out the result][03-sample]. | |||
| You have successfully generated a web site with "dynamic" blog posts. [Check out the result][03-sample]. | |||
| Introduced PSKOV constants include: | |||
| | PSKOV constant | Description | | |||
| |---|---| | |||
| | `PSKOV_ITEM_DATE` | Provides date from `Date:` part of page's header section | | |||
| | `PSKOV_PREVIEW` | Provides contents from a Markdown file limited by `previewSize` characters (approximately) | | |||
| | `PSKOV_INDEX_URL` | Provides generated page's file name: `<previewsPageBaseName><id>.html` | | |||
| | `PSKOV_PREVIEWS` | Provides a combination of `PSKOV_PREVIEW` sections | | |||
| | `PSKOV_PAGINATION` | Provides pagination section to navigate index (summary) pages | | |||
| | `PSKOV_PAGE_ID` | Provides index (summary) page id starting from `1` | | |||
| | `PSKOV_PAGES_COUNT` | Provides total number of index (summary) pages generated | | |||
| | `PSKOV_PREV_PAGE_URL` | Provides previous index (summary) page file name | | |||
| | `PSKOV_NEXT_PAGE_URL` | Provides next index (summary) page file name | | |||
| | `PSKOV_ITEM_DATE` | Value of `Date` key of the page's Markdown file | | |||
| | `PSKOV_PREVIEW` | Provides contents of a Markdown file limited by `previewSize` characters (approximately) | | |||
| | `PSKOV_INDEX_URL` | Provides generated preview page file name: `<previewsPageBaseName><id>.html` | | |||
| | `PSKOV_PREVIEWS` | Provides a set of previews | | |||
| | `PSKOV_PAGINATION` | Provides pagination section to navigate preview pages | | |||
| | `PSKOV_PAGE_ID` | Provides preview page id starting from `1` | | |||
| | `PSKOV_PAGES_COUNT` | Provides total number of generated preview pages | | |||
| | `PSKOV_PREV_PAGE_URL` | Provides previous preview page file name | | |||
| | `PSKOV_NEXT_PAGE_URL` | Provides next preview page file name | | |||
| Introduced configuration keys include: | |||
| | Key | Description | | |||
| |---|---| | |||
| | `preview` | Points to an HTML template file that is used to generate HTML previews out of the first `previewSize` (approximately) characters of Markdown files | | |||
| | `index` | Points to an HTML template file that is used to generate HTML index (summary) files to host previews | | |||
| | `paginationPrev` | Points to an HTML template file that is used to generate pagination section used by the *last* index (summary) file | | |||
| | `paginationNext` | Points to an HTML template file that is used to generate pagination section used by the *first* index (summary) file | | |||
| | `paginationPrevNext` | Points to an HTML template file that is used to generate pagination section used by index (summary) files *except the ones at the beginning and at the end* | | |||
| | `previewSize` | How many characters (approximately) to take out of a Markdown file to generate an HTML preview | | |||
| | `previewEnding` | String to use at the end of HTML previews | | |||
| | `previewsPerPage` | Number of HTML previews hosted by single index (summary) file | | |||
| | `previewsPageBaseName` | Index (summary) file base name | | |||
| Introduced header constants include: | |||
| | Header constant | Description | | |||
| | `preview` | Points to an HTML template that is used to generate HTML preview out of the first `previewSize` (approximately) characters for each Markdown file | | |||
| | `index` | Points to an HTML template that is used to generate preview page to host previews | | |||
| | `paginationPrev` | Points to an HTML template that is used to generate pagination section to navigate backwards | | |||
| | `paginationNext` | Points to an HTML template that is used to generate pagination section to navigate forward | | |||
| | `paginationPrevNext` | Points to an HTML template that is used to generate pagination section | | |||
| | `previewSize` | How many characters (approximately) to take out of a Markdown file to generate a preview | | |||
| | `previewEnding` | String to use at the end of each preview | | |||
| | `previewsPerPage` | Maximum number of previews hosted by a preview page | | |||
| | `previewsPageBaseName` | Base file name for preview pages | | |||
| Introduced header keys include: | |||
| | Header key | Description | | |||
| |---|---| | |||
| | `Date:` | Provides value for `PSKOV_ITEM_DATE` constant when generating HTML out of Markdown | | |||
| | `Date` | Provides value for `PSKOV_ITEM_DATE` constant when generating HTML out of Markdown | | |||
| This was the final document to make you proficient in generating static sites with **PSKOV**. If you like what we do, support us by joining our group at [Twitter][tw], [Facebook][fb], or [VK][vk]. | |||
| This was the final document to make you proficient in generating static sites with **PSKOV**. If you like what we do, join us at [VK][vk], [Twitter][tw], or [Facebook][fb]. | |||
| Now use **PSKOV** to generate your very own web site! | |||
| @@ -477,6 +475,6 @@ Now use **PSKOV** to generate your very own web site! | |||
| [lfsa]: http://opengamestudio.org/lfsa | |||
| [tool]: http://opengamestudio.org/pskov | |||
| [vk]: https://vk.com/opengamestudo | |||
| [tw]: https://twitter.com/OpenGameStudio | |||
| [fb]: https://www.facebook.com/groups/162611230470183 | |||
| [vk]: https://vk.com/opengamestudo | |||
+ 29
- 12
pskov/en/education.html
View File
| @@ -64,9 +64,17 @@ | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| pskov_1.0.0 | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| @@ -74,6 +82,10 @@ | |||
| <strong id="title">PSKOV</strong> | |||
| <a href="pskov_1.0.0.html">Tool</a> | |||
| <a href="education.html">Education</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.html">EN</a> | |||
| <a href="../ru/education.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Education | |||
| @@ -84,7 +96,7 @@ Education | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Item</th> | |||
| <th>Property</th> | |||
| <th>Details</th> | |||
| </tr> | |||
| </thead> | |||
| @@ -103,7 +115,7 @@ Education | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Item</th> | |||
| <th>Property</th> | |||
| <th>Details</th> | |||
| </tr> | |||
| </thead> | |||
| @@ -122,7 +134,7 @@ Education | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Item</th> | |||
| <th>Property</th> | |||
| <th>Details</th> | |||
| </tr> | |||
| </thead> | |||
| @@ -148,8 +160,8 @@ Education | |||
| <td><ol> <li><code>input</code></li> <li><code>item</code></li> </ol></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Introduced header constants</td> | |||
| <td><ol> <li><code>Title:</code></li> <li><code>Slug:</code></li> </ol></td> | |||
| <td>Introduced header keys</td> | |||
| <td><ol> <li><code>Title</code></li> <li><code>Slug</code></li> </ol></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| @@ -157,7 +169,7 @@ Education | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Item</th> | |||
| <th>Property</th> | |||
| <th>Details</th> | |||
| </tr> | |||
| </thead> | |||
| @@ -184,14 +196,14 @@ Education | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Item</th> | |||
| <th>Property</th> | |||
| <th>Details</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Description</td> | |||
| <td>Learn how to create "dynamic" pages like blog posts</td> | |||
| <td>Learn how to create "dynamic" pages for a blog</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Estimated completion time</td> | |||
| @@ -210,13 +222,18 @@ Education | |||
| <td><ol> <li><code>preview</code></li> <li><code>index</code></li> <li><code>paginationPrev</code></li> <li><code>paginationNext</code></li> <li><code>paginationPrevNext</code></li> <li><code>previewSize</code></li> <li><code>previewEnding</code></li> <li><code>previewsPerPage</code></li> <li><code>previewsPageBaseName</code></li> </ol></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Introduced header constants</td> | |||
| <td><ol> <li><code>Date:</code></li> </ol></td> | |||
| <td>Introduced header keys</td> | |||
| <td><ol> <li><code>Date</code></li> </ol></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>If you like what we do, support us by joining our group at <a href="https://twitter.com/OpenGameStudio">Twitter</a>, <a href="https://www.facebook.com/groups/162611230470183">Facebook</a>, or <a href="https://vk.com/opengamestudo">VK</a>.</p> | |||
| <p>If you like what we do, join us at <a href="https://vk.com/opengamestudo">VK</a>, <a href="https://twitter.com/OpenGameStudio">Twitter</a>, or <a href="https://www.facebook.com/groups/162611230470183">Facebook</a>.</p> | |||
| </div></center> | |||
| <div id="footer"> | |||
| The site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a> | |||
| from <a href="http://github.com/ogstudio/site-pskov">this source code</a>. | |||
| The site is hosted by <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
+ 11
- 11
pskov/en/education.md
View File
| @@ -1,5 +1,5 @@ | |||
| Title: Education | |||
| Date: 2019-05-20 00:00 | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education | |||
| Lang: en | |||
| @@ -8,32 +8,32 @@ Here is a set of documents to make you proficient in generating static sites wit | |||
| ## [01. Why][why] | |||
| | Item | Details | | |||
| | Property | Details | | |||
| |---|---| | |||
| | Description | Find out why **PSKOV** was created | | |||
| | Estimated completion time | 5 minutes | | |||
| ## [02. Dependencies][deps] | |||
| | Item | Details | | |||
| | Property | Details | | |||
| |---|---| | |||
| | Description | Install dependencies to start using **PSKOV** | | |||
| | Estimated completion time | 5 minutes | | |||
| ## [03. Site][site] | |||
| | Item | Details | | |||
| | Property | Details | | |||
| |---|---| | |||
| | Description | Learn how to create a simple static web site with two pages | | |||
| | Estimated completion time | 10 minutes | | |||
| | Demonstration | [TwoPages][01-sample] | | |||
| | Introduced PSKOV constants | <ol> <li>`PSKOV_ITEM_TITLE`</li> <li>`PSKOV_ITEM_CONTENTS`</li> </ol> | | |||
| | Introduced configuration keys | <ol> <li>`input`</li> <li>`item`</li> </ol> | | |||
| | Introduced header constants | <ol> <li>`Title:`</li> <li>`Slug:`</li> </ol> | | |||
| | Introduced header keys | <ol> <li>`Title`</li> <li>`Slug`</li> </ol> | | |||
| ## [04. Language][lang] | |||
| | Item | Details | | |||
| | Property | Details | | |||
| |---|---| | |||
| | Description | Learn how to add language selection | | |||
| | Estimated completion time | 10 minutes | | |||
| @@ -42,16 +42,16 @@ Here is a set of documents to make you proficient in generating static sites wit | |||
| ## [05. Blog][blog] | |||
| | Item | Details | | |||
| | Property | Details | | |||
| |---|---| | |||
| | Description | Learn how to create "dynamic" pages like blog posts | | |||
| | Description | Learn how to create "dynamic" pages for a blog | | |||
| | Estimated completion time | 20 minutes | | |||
| | Demonstration | [Blog][03-sample] | | |||
| | Introduced PSKOV constants | <ol> <li>`PSKOV_ITEM_DATE`</li> <li>`PSKOV_PREVIEW`</li> <li>`PSKOV_INDEX_URL`</li> <li>`PSKOV_PREVIEWS`</li> <li>`PSKOV_PAGINATION`</li> <li>`PSKOV_PAGE_ID`</li> <li>`PSKOV_PAGES_COUNT`</li> <li>`PSKOV_PREV_PAGE_URL`</li> <li>`PSKOV_NEXT_PAGE_URL`</li> </ol> | | |||
| | Introduced configuration keys | <ol> <li>`preview`</li> <li>`index`</li> <li>`paginationPrev`</li> <li>`paginationNext`</li> <li>`paginationPrevNext`</li> <li>`previewSize`</li> <li>`previewEnding`</li> <li>`previewsPerPage`</li> <li>`previewsPageBaseName`</li> </ol> | | |||
| | Introduced header constants | <ol> <li>`Date:`</li> </ol> | | |||
| | Introduced header keys | <ol> <li>`Date`</li> </ol> | | |||
| If you like what we do, support us by joining our group at [Twitter][tw], [Facebook][fb], or [VK][vk]. | |||
| If you like what we do, join us at [VK][vk], [Twitter][tw], or [Facebook][fb]. | |||
| [why]: education.01.why.html | |||
| [deps]: education.02.deps.html | |||
| @@ -63,6 +63,6 @@ If you like what we do, support us by joining our group at [Twitter][tw], [Faceb | |||
| [02-sample]: http://opengamestudio.org/pskov/sample/02.Language/en/about.html | |||
| [03-sample]: http://opengamestudio.org/pskov/sample/03.Blog/en/blog/index.html | |||
| [vk]: https://vk.com/opengamestudo | |||
| [tw]: https://twitter.com/OpenGameStudio | |||
| [fb]: https://www.facebook.com/groups/162611230470183 | |||
| [vk]: https://vk.com/opengamestudo | |||
+ 18
- 1
pskov/en/item.template
View File
| @@ -64,9 +64,17 @@ | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| pskov_1.0.0 | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| @@ -74,6 +82,10 @@ | |||
| <strong id="title">PSKOV</strong> | |||
| <a href="pskov_1.0.0.html">Tool</a> | |||
| <a href="education.html">Education</a> | |||
| <div id="lang"> | |||
| <a href="../en/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../ru/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| PSKOV_ITEM_TITLE | |||
| @@ -81,6 +93,11 @@ PSKOV_ITEM_TITLE | |||
| <center><div class="contents"> | |||
| PSKOV_ITEM_CONTENTS | |||
| </div></center> | |||
| <div id="footer"> | |||
| The site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a> | |||
| from <a href="http://github.com/ogstudio/site-pskov">this source code</a>. | |||
| The site is hosted by <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
+ 17
- 0
pskov/en/pskov_1.0.0.html
View File
| @@ -64,6 +64,14 @@ | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| table | |||
| { | |||
| border-collapse: collapse; | |||
| @@ -98,6 +106,10 @@ | |||
| <strong id="title">PSKOV</strong> | |||
| <a href="pskov_1.0.0.html">Tool</a> | |||
| <a href="education.html">Education</a> | |||
| <div id="lang"> | |||
| <a href="../en/pskov_1.0.0.html">EN</a> | |||
| <a href="../ru/pskov_1.0.0+ru.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| PSKOV 1.0.0 (2019-06) | |||
| @@ -182,6 +194,11 @@ | |||
| </tr> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| The site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a> | |||
| from <a href="http://github.com/ogstudio/site-pskov">this source code</a>. | |||
| The site is hosted by <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| <!-- showdown.js --> | |||
| ;/*! showdown v 2.0.0-alpha1 - 24-10-2018 */ | |||
+ 230
- 0
pskov/ru/education.01.why.html
View File
| @@ -0,0 +1,230 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| #header | |||
| { | |||
| background: #856d51; | |||
| padding: 0.7em; | |||
| text-align: left; | |||
| } | |||
| #header a | |||
| { | |||
| color: white; | |||
| text-decoration: none; | |||
| padding: 0.5em 1em 0.5em 1em; | |||
| } | |||
| #title | |||
| { | |||
| color: #433729; | |||
| } | |||
| html | |||
| { | |||
| font-family: sans-serif; | |||
| } | |||
| body | |||
| { | |||
| line-height: 1.5em; | |||
| } | |||
| body | |||
| { | |||
| background: #FAFAFA; | |||
| } | |||
| table | |||
| { | |||
| border-collapse: collapse; | |||
| width: 100%; | |||
| } | |||
| table, th, td | |||
| { | |||
| border: 1px solid #aaa; | |||
| padding: 0.5em; | |||
| margin-top: 0.5em; | |||
| margin-bottom: 0.5em; | |||
| } | |||
| code, pre | |||
| { | |||
| font-family: monospace, serif; | |||
| font-size: 1em; | |||
| color: #7f0a0c; | |||
| background: #f5f5f5; | |||
| white-space: pre-wrap; | |||
| } | |||
| .contents | |||
| { | |||
| background: #FFFFFF; | |||
| width: 720px; | |||
| padding: 1em; | |||
| margin-top: 2em; | |||
| margin-bottom: 2em; | |||
| border: 1px solid #E0E0E0; | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong id="title">ПСКОВ</strong> | |||
| <a href="pskov_1.0.0+ru.html">Инструмент</a> | |||
| <a href="education.html">Обучение</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.01.why.html">EN</a> | |||
| <a href="../ru/education.01.why.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Обучение: 01. Почему | |||
| </h1></center> | |||
| <center><div class="contents"> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Отсутствует</td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td><a href="education.02.deps.html">02. Зависимости</a></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p></div><div class="contents"></p> | |||
| <p>В этом документе мы кратко объясним причины создания <strong>ПСКОВА</strong>.</p> | |||
| <p>Ожидаемое время завершения: 5 минут.</p> | |||
| <p><strong>Содержание</strong></p> | |||
| <ul> | |||
| <li><a href="#why">01. Почему</a></li> | |||
| <li><a href="#features">02. Возможности</a></li> | |||
| </ul> | |||
| <p><a name="why"/></p> | |||
| <h2 id="01">01. Почему</h2> | |||
| <p>Возможно, вы знаете о существовании множества <a href="https://habr.com/ru/company/selectel/blog/236441/">генераторов статических сайтов</a>, зачем же создавать ещё один? Потому что <strong>они не были достаточно хороши</strong> для нужд <a href="http://opengamestudio.org">Студии Открытых Игр</a>.</p> | |||
| <p>Таков список <strong>избыточных для нас функциональностей</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>№</th> | |||
| <th>Избыточная функциональность</th> | |||
| <th>Детали</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>1</td> | |||
| <td>Изучение чего-либо, кроме HTML, CSS, JavaScript и Markdown</td> | |||
| <td>Этих технологий достаточно для создания чистого веб-сайта</td> | |||
| </tr> | |||
| <tr> | |||
| <td>2</td> | |||
| <td>На стороне сервера</td> | |||
| <td>Никто не должен иметь возможность выключить ваш сайт кроме вас</td> | |||
| </tr> | |||
| <tr> | |||
| <td>3</td> | |||
| <td>Установка</td> | |||
| <td>Отсутствие принудительных обновлений, о которых никто не просил</td> | |||
| </tr> | |||
| <tr> | |||
| <td>4</td> | |||
| <td>Осязаемый исходный код</td> | |||
| <td>Отсутствие миллионов файлов исходного кода</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><a name="features"/></p> | |||
| <h2 id="02">02. Возможности</h2> | |||
| <p>Как следствие, таковы <strong>возможности ПСКОВА</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>№</th> | |||
| <th>Функциональность ПСКОВА</th> | |||
| <th>Детали</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>1</td> | |||
| <td>HTML, CSS, JavaScript и Markdown</td> | |||
| <td>То, что вы уже знаете</td> | |||
| </tr> | |||
| <tr> | |||
| <td>2</td> | |||
| <td>На стороне клиента</td> | |||
| <td><strong>ПСКОВ</strong> является приложением JavaScript, исполняемым на стороне клиента, строго на вашем устройств</td> | |||
| </tr> | |||
| <tr> | |||
| <td>3</td> | |||
| <td>Доступен в сети</td> | |||
| <td><a href="http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html">http://opengamestudio.org/pskov</a></td> | |||
| </tr> | |||
| <tr> | |||
| <td>4</td> | |||
| <td>Доступен без сети</td> | |||
| <td>Просто сохраните страницу <a href="http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html">Инструмент</a>, а затем откройте её локально</td> | |||
| </tr> | |||
| <tr> | |||
| <td>5</td> | |||
| <td>Осязаемый исходный код</td> | |||
| <td><strong>ПСКОВ</strong> умещается в один файл HTML</td> | |||
| </tr> | |||
| <tr> | |||
| <td>6</td> | |||
| <td>Принадлежит каждому</td> | |||
| <td><strong>ПСКОВ</strong> выпущен под лицензией <a href="https://creativecommons.org/share-your-work/public-domain/cc0/">CC0</a> (общественное достояние)</td> | |||
| </tr> | |||
| <tr> | |||
| <td>7</td> | |||
| <td>Работает десятилетия</td> | |||
| <td>Вы можете использовать <strong>ПСКОВ</strong> и на Windows 2000, и на Windows 2030*</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>* Windows 2030 не существует (ещё), мы просто указываем на тот факт, что <strong>ПСКОВ</strong> создан для работы на операционных системах, выпущенных в период 2000-2030 годов.</p> | |||
| <p></div><div class="contents"></p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Отсутствует</td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td><a href="education.02.deps.html">02. Зависимости</a></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| Сайт сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a> | |||
| из <a href="http://github.com/ogstudio/site-pskov">этого исходного кода</a>. | |||
| Сайт расположен на <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
| </html> | |||
+ 67
- 0
pskov/ru/education.01.why.md
View File
| @@ -0,0 +1,67 @@ | |||
| Title: Обучение: 01. Почему | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education.01.why | |||
| Lang: ru | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | Отсутствует | [Обучение][index] | [02. Зависимости][next] | | |||
| </div><div class="contents"> | |||
| В этом документе мы кратко объясним причины создания **ПСКОВА**. | |||
| Ожидаемое время завершения: 5 минут. | |||
| **Содержание** | |||
| * [01. Почему](#why) | |||
| * [02. Возможности](#features) | |||
| <a name="why"/> | |||
| ## 01. Почему | |||
| Возможно, вы знаете о существовании множества [генераторов статических сайтов][other-generators], зачем же создавать ещё один? Потому что **они не были достаточно хороши** для нужд [Студии Открытых Игр][ogs]. | |||
| Таков список **избыточных для нас функциональностей**: | |||
| | № | Избыточная функциональность | Детали | | |||
| |---|---|---| | |||
| | 1 | Изучение чего-либо, кроме HTML, CSS, JavaScript и Markdown | Этих технологий достаточно для создания чистого веб-сайта | | |||
| | 2 | На стороне сервера | Никто не должен иметь возможность выключить ваш сайт кроме вас | | |||
| | 3 | Установка | Отсутствие принудительных обновлений, о которых никто не просил | | |||
| | 4 | Осязаемый исходный код | Отсутствие миллионов файлов исходного кода | | |||
| <a name="features"/> | |||
| ## 02. Возможности | |||
| Как следствие, таковы **возможности ПСКОВА**: | |||
| | № | Функциональность ПСКОВА | Детали | | |||
| |---|---|---| | |||
| | 1 | HTML, CSS, JavaScript и Markdown | То, что вы уже знаете | | |||
| | 2 | На стороне клиента | **ПСКОВ** является приложением JavaScript, исполняемым на стороне клиента, строго на вашем устройств | | |||
| | 3 | Доступен в сети | [http://opengamestudio.org/pskov][pskov] | | |||
| | 4 | Доступен без сети | Просто сохраните страницу [Инструмент][pskov], а затем откройте её локально | | |||
| | 5 | Осязаемый исходный код | **ПСКОВ** умещается в один файл HTML | | |||
| | 6 | Принадлежит каждому | **ПСКОВ** выпущен под лицензией [CC0][cc0] (общественное достояние)| | |||
| | 7 | Работает десятилетия | Вы можете использовать **ПСКОВ** и на Windows 2000, и на Windows 2030\* | | |||
| \* Windows 2030 не существует (ещё), мы просто указываем на тот факт, что **ПСКОВ** создан для работы на операционных системах, выпущенных в период 2000-2030 годов. | |||
| </div><div class="contents"> | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | Отсутствует | [Обучение][index] | [02. Зависимости][next] | | |||
| [index]: education.html | |||
| [next]: education.02.deps.html | |||
| [other-generators]: https://habr.com/ru/company/selectel/blog/236441/ | |||
| [ogs]: http://opengamestudio.org | |||
| [pskov]: http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html | |||
| [cc0]: https://creativecommons.org/share-your-work/public-domain/cc0/ | |||
+ 185
- 0
pskov/ru/education.02.deps.html
View File
| @@ -0,0 +1,185 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| #header | |||
| { | |||
| background: #856d51; | |||
| padding: 0.7em; | |||
| text-align: left; | |||
| } | |||
| #header a | |||
| { | |||
| color: white; | |||
| text-decoration: none; | |||
| padding: 0.5em 1em 0.5em 1em; | |||
| } | |||
| #title | |||
| { | |||
| color: #433729; | |||
| } | |||
| html | |||
| { | |||
| font-family: sans-serif; | |||
| } | |||
| body | |||
| { | |||
| line-height: 1.5em; | |||
| } | |||
| body | |||
| { | |||
| background: #FAFAFA; | |||
| } | |||
| table | |||
| { | |||
| border-collapse: collapse; | |||
| width: 100%; | |||
| } | |||
| table, th, td | |||
| { | |||
| border: 1px solid #aaa; | |||
| padding: 0.5em; | |||
| margin-top: 0.5em; | |||
| margin-bottom: 0.5em; | |||
| } | |||
| code, pre | |||
| { | |||
| font-family: monospace, serif; | |||
| font-size: 1em; | |||
| color: #7f0a0c; | |||
| background: #f5f5f5; | |||
| white-space: pre-wrap; | |||
| } | |||
| .contents | |||
| { | |||
| background: #FFFFFF; | |||
| width: 720px; | |||
| padding: 1em; | |||
| margin-top: 2em; | |||
| margin-bottom: 2em; | |||
| border: 1px solid #E0E0E0; | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong id="title">ПСКОВ</strong> | |||
| <a href="pskov_1.0.0+ru.html">Инструмент</a> | |||
| <a href="education.html">Обучение</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.02.deps.html">EN</a> | |||
| <a href="../ru/education.02.deps.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Обучение: 02. Зависимости | |||
| </h1></center> | |||
| <center><div class="contents"> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><a href="education.01.why.html">01. Почему</a></td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td><a href="education.03.site.html">03. Сайт</a></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p></div><div class="contents"></p> | |||
| <p>В этом документы мы коснёмся зависимостей <strong>ПСКОВА</strong> и их установку.</p> | |||
| <p>Ожидаемое время завершения: 5 минут.</p> | |||
| <p><strong>Содержание</strong></p> | |||
| <ul> | |||
| <li><a href="#deps">01. Зависимости</a></li> | |||
| <li><a href="#details">02. Подробности</a></li> | |||
| </ul> | |||
| <p><a name="deps"/></p> | |||
| <h2 id="01">01. Зависимости</h2> | |||
| <p>Мы спроектировали <strong>ПСКОВ</strong> таким образом, чтобы он исполнялся в веб-браузере. Для запуска <strong>ПСКОВА</strong> вам понадобятся:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>№</th> | |||
| <th>Зависимость ПСКОВА</th> | |||
| <th>Подробности</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>1</td> | |||
| <td>Веб-браузер 2010-го года или новее</td> | |||
| <td><strong>ПСКОВ</strong> использует ECMAScript 5 (2009), любой современный веб-браузер должен подойти</td> | |||
| </tr> | |||
| <tr> | |||
| <td>2</td> | |||
| <td>К локальной файловой системе доступ</td> | |||
| <td><a href="http://opengamestudio.org/lfsa/ru">ЛФСД</a> предоставляет <strong>ПСКОВУ</strong> доступ к вашей локальной файловой системе. Установите ЛФСД, чтобы использовать <strong>ПСКОВ</strong>.</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><strong>Внимание</strong>: <a href="http://opengamestudio.org/lfsa/ru">установите ЛФСД</a>, чтобы использовать <strong>ПСКОВ</strong>.</p> | |||
| <p><a name="details"/></p> | |||
| <h2 id="02">02. Подробности</h2> | |||
| <p><strong>ПСКОВ</strong>:</p> | |||
| <ul> | |||
| <li>является приложением JavaScript на стороне клиента</li> | |||
| <li>не имеет прямого доступа к локальной файловой системе</li> | |||
| <li>использует <a href="http://opengamestudio.org/lfsa/ru">ЛФСД</a> для доступа к локальной файловой системе</li> | |||
| <li>использует <a href="https://github.com/showdownjs/showdown">Showdown</a> для перевода Markdown в HTML</li> | |||
| </ul> | |||
| <p><strong>ЛФСД</strong>:</p> | |||
| <ul> | |||
| <li>является крошечным веб-сервером, предоставляющим доступ к локальной файловой системе</li> | |||
| <li>использует порт 8000</li> | |||
| <li>занимает менее 200 строк кода, <a href="https://bitbucket.org/ogstudio/lfsa/src/default/lfsa_1.0.0.py">удостоверьтесь в этом</a> сами</li> | |||
| </ul> | |||
| <p></div><div class="contents"></p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><a href="education.01.why.html">01. Почему</a></td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td><a href="education.03.site.html">03. Сайт</a></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| Сайт сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a> | |||
| из <a href="http://github.com/ogstudio/site-pskov">этого исходного кода</a>. | |||
| Сайт расположен на <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
| </html> | |||
+ 64
- 0
pskov/ru/education.02.deps.md
View File
| @@ -0,0 +1,64 @@ | |||
| Title: Обучение: 02. Зависимости | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education.02.deps | |||
| Lang: ru | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | [01. Почему][prev] | [Обучение][index] | [03. Сайт][next] | | |||
| </div><div class="contents"> | |||
| В этом документы мы коснёмся зависимостей **ПСКОВА** и их установку. | |||
| Ожидаемое время завершения: 5 минут. | |||
| **Содержание** | |||
| * [01. Зависимости](#deps) | |||
| * [02. Подробности](#details) | |||
| <a name="deps"/> | |||
| ## 01. Зависимости | |||
| Мы спроектировали **ПСКОВ** таким образом, чтобы он исполнялся в веб-браузере. Для запуска **ПСКОВА** вам понадобятся: | |||
| | № | Зависимость ПСКОВА | Подробности | | |||
| |---|---|---| | |||
| | 1 | Веб-браузер 2010-го года или новее | **ПСКОВ** использует ECMAScript 5 (2009), любой современный веб-браузер должен подойти | | |||
| | 2 | К локальной файловой системе доступ | [ЛФСД][lfsa] предоставляет **ПСКОВУ** доступ к вашей локальной файловой системе. Установите ЛФСД, чтобы использовать **ПСКОВ**. | | |||
| **Внимание**: [установите ЛФСД][lfsa], чтобы использовать **ПСКОВ**. | |||
| <a name="details"/> | |||
| ## 02. Подробности | |||
| **ПСКОВ**: | |||
| * является приложением JavaScript на стороне клиента | |||
| * не имеет прямого доступа к локальной файловой системе | |||
| * использует [ЛФСД][lfsa] для доступа к локальной файловой системе | |||
| * использует [Showdown][showdown] для перевода Markdown в HTML | |||
| **ЛФСД**: | |||
| * является крошечным веб-сервером, предоставляющим доступ к локальной файловой системе | |||
| * использует порт 8000 | |||
| * занимает менее 200 строк кода, [удостоверьтесь в этом][lfsa-src] сами | |||
| </div><div class="contents"> | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | [01. Почему][prev] | [Обучение][index] | [03. Сайт][next] | | |||
| [index]: education.html | |||
| [prev]: education.01.why.html | |||
| [next]: education.03.site.html | |||
| [lfsa]: http://opengamestudio.org/lfsa/ru | |||
| [lfsa-src]: https://bitbucket.org/ogstudio/lfsa/src/default/lfsa_1.0.0.py | |||
| [showdown]: https://github.com/showdownjs/showdown | |||
+ 387
- 0
pskov/ru/education.03.site.html
View File
| @@ -0,0 +1,387 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| #header | |||
| { | |||
| background: #856d51; | |||
| padding: 0.7em; | |||
| text-align: left; | |||
| } | |||
| #header a | |||
| { | |||
| color: white; | |||
| text-decoration: none; | |||
| padding: 0.5em 1em 0.5em 1em; | |||
| } | |||
| #title | |||
| { | |||
| color: #433729; | |||
| } | |||
| html | |||
| { | |||
| font-family: sans-serif; | |||
| } | |||
| body | |||
| { | |||
| line-height: 1.5em; | |||
| } | |||
| body | |||
| { | |||
| background: #FAFAFA; | |||
| } | |||
| table | |||
| { | |||
| border-collapse: collapse; | |||
| width: 100%; | |||
| } | |||
| table, th, td | |||
| { | |||
| border: 1px solid #aaa; | |||
| padding: 0.5em; | |||
| margin-top: 0.5em; | |||
| margin-bottom: 0.5em; | |||
| } | |||
| code, pre | |||
| { | |||
| font-family: monospace, serif; | |||
| font-size: 1em; | |||
| color: #7f0a0c; | |||
| background: #f5f5f5; | |||
| white-space: pre-wrap; | |||
| } | |||
| .contents | |||
| { | |||
| background: #FFFFFF; | |||
| width: 720px; | |||
| padding: 1em; | |||
| margin-top: 2em; | |||
| margin-bottom: 2em; | |||
| border: 1px solid #E0E0E0; | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong id="title">ПСКОВ</strong> | |||
| <a href="pskov_1.0.0+ru.html">Инструмент</a> | |||
| <a href="education.html">Обучение</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.03.site.html">EN</a> | |||
| <a href="../ru/education.03.site.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Обучение: 03. Сайт | |||
| </h1></center> | |||
| <center><div class="contents"> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><a href="education.02.deps.html">02. Зависимости</a></td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td><a href="education.04.lang.html">04. Язык</a></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p></div><div class="contents"></p> | |||
| <p>В этом документы мы создадим простой статический сайт с двумя страницами.</p> | |||
| <p>Ожидаемое время завершения: 10 минут.</p> | |||
| <p><strong>Содержание</strong></p> | |||
| <ul> | |||
| <li><a href="#inspiration">01. Вдохновление</a></li> | |||
| <li><a href="#cfg">02. Изучите файл <code>pskov.cfg</code></a></li> | |||
| <li><a href="#item">03. Изучите файл <code>item.template</code></a></li> | |||
| <li><a href="#md">04. Изучите файлы <code>about.md</code> и <code>cv.md</code></a></li> | |||
| <li><a href="#lfsa">05. Запустите ЛФСД</a></li> | |||
| <li><a href="#gen">06. Сгенерируйте сайт</a></li> | |||
| <li><a href="#summary">07. Итог</a></li> | |||
| </ul> | |||
| <p><a name="inspiration"/></p> | |||
| <h2 id="01">01. Вдохновление</h2> | |||
| <p>Представьте, что вы являетесь выдающимся русским живописцем Валентином Серовым. Каждый раз, когда кто-либо хочет узнать о вас, он идёт на <a href="https://ru.wikipedia.org/wiki/%D0%A1%D0%B5%D1%80%D0%BE%D0%B2,_%D0%92%D0%B0%D0%BB%D0%B5%D0%BD%D1%82%D0%B8%D0%BD_%D0%90%D0%BB%D0%B5%D0%BA%D1%81%D0%B0%D0%BD%D0%B4%D1%80%D0%BE%D0%B2%D0%B8%D1%87">Википедию</a>. Сегодня утром вы просыпаетесь раньше обычного с отчётливым желанием создать свой собственный веб-сайт.</p> | |||
| <p>Вы приступаете к созданию следующих страницы:</p> | |||
| <ul> | |||
| <li>About me</li> | |||
| <li>Curriculum vitae (CV)</li> | |||
| </ul> | |||
| <p>Несколько позже в <a href="https://github.com/OGStudio/site-pskov-sample/tree/master/01.TwoPages">директории вашего сайта</a> у вас оказываются следующие файлы:</p> | |||
| <ul> | |||
| <li>pskov.cfg</li> | |||
| <li>item.template</li> | |||
| <li>about.md</li> | |||
| <li>cv.md</li> | |||
| </ul> | |||
| <p>Давайте взглянем на их содержимое.</p> | |||
| <p><a name="cfg"/></p> | |||
| <h2 id="02pskovcfg">02. Изучите файл <code>pskov.cfg</code></h2> | |||
| <p>Файл <code>pskov.cfg</code> содержит следующее:</p> | |||
| <pre><code>input = . | |||
| item = item.template | |||
| </code></pre> | |||
| <p><code>pskov.cfg</code> является <a href="https://ru.wikipedia.org/wiki/.ini">файлом настроек</a> со следующими ключами:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Ключ</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>input</code></td> | |||
| <td>Указывает на директорию с файлом, на который ссылается ключ <code>item</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>item</code></td> | |||
| <td>Указывает на файл с шаблоном HTML, который используется для генерации файлов HTML из Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>В нашем случае файл <code>item.template</code> расположен рядом с <code>pskov.cfg</code>, поэтому мы используем <code>.</code> для обозначения текущей директории.</p> | |||
| <p><a name="item"/></p> | |||
| <h2 id="03itemtemplate">03. Изучите файл <code>item.template</code></h2> | |||
| <p>Файл <code>item.template</code> содержит следующее:</p> | |||
| <pre><code><!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| </style> | |||
| <title>Serov</title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Serov</strong> | |||
| <a href="about.html">About me</a> | |||
| <a href="cv.html">CV</a> | |||
| </div> | |||
| <center> | |||
| <h1>PSKOV_ITEM_TITLE</h1> | |||
| <div class="contents"> | |||
| PSKOV_ITEM_CONTENTS | |||
| </div> | |||
| <div id="footer"> | |||
| This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| </html> | |||
| </code></pre> | |||
| <p><strong>Внимание</strong>: стиль схлопнут для краткости.</p> | |||
| <p>Как видите, <code>item.template</code> представляет из себя обычный файл HTML с двумя константами <strong>ПСКОВА</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_TITLE</code></td> | |||
| <td>Значение ключа <code>Title</code> из файла Markdown страницы</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_CONTENTS</code></td> | |||
| <td>Предоставляет содержимое HTML, сгенерированное из Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><strong>Замечания</strong>:</p> | |||
| <ul> | |||
| <li>другие константы <strong>ПСКОВА</strong> описаны позже</li> | |||
| <li>файл Markdown страницы описан ниже</li> | |||
| </ul> | |||
| <p><a name="md"/></p> | |||
| <h2 id="04aboutmdcvmd">04. Изучите файлы <code>about.md</code> и <code>cv.md</code></h2> | |||
| <p>Файл <code>about.md</code> содержит следующее:</p> | |||
| <pre><code> Title: About me | |||
| Slug: about | |||
| Hi, my name is Valentin Serov. Here's my self-portrait: | |||
| ![Valentin Serov self-portrait][serov-portrait] | |||
| - - - - Схлопнуто для краткости - - - - | |||
| Have a look at my [CV][cv] now. | |||
| [serov]: https://en.wikipedia.org/wiki/Valentin_Serov | |||
| [revolution]: https://en.wikipedia.org/wiki/Russian_Revolution | |||
| [serov-portrait]: myself.jpg | |||
| [serov-work]: mywork.jpg | |||
| [girl-with-peaches]: https://en.wikipedia.org/wiki/Girl_with_Peaches | |||
| [pskov]: http://opengamestudio.org/pskov | |||
| [cv]: cv.html | |||
| </code></pre> | |||
| <p><code>about.md</code> начинается с так называемого заголовка:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Ключ заголовка</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>Title</code></td> | |||
| <td>Предоставляет значение для константы <code>PSKOV_ITEM_TITLE</code> во время генерации HTML из Markdown</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>Slug</code></td> | |||
| <td>Сообщает <strong>ПСКОВУ</strong> о том, что этот файл должен быть сохранён как <code><slug>.html</code></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>В остальном содержимое <code>about.md</code> ничем не отличается от любых других файлов Markdown.</p> | |||
| <p><strong>Внимание</strong>: ссылка на страницу <code>cv</code> указана как <code>cv.html</code>, не <code>cv.md</code></p> | |||
| <p>Файл <code>cv.md</code> содержит следующее:</p> | |||
| <pre><code> Title: Curriculum vitae | |||
| Slug: cv | |||
| Here's my CV in case my paintings still interest you. I took a bit of a modern IT approach to structure my CV as key-value pairs of a dictionary (map), enjoy! | |||
| | Key | Value | | |||
| |---|---| | |||
| | Name | Valentin Serov | | |||
| | Age | 46 | | |||
| | Marital status | Married | | |||
| | Country | Russian Empire | | |||
| | Alma mater | Imperial Academy of Arts | | |||
| | Education | * Member Academy of Arts (1898) <br> * Full Member Academy of Arts (1903) | | |||
| </code></pre> | |||
| <p>Как видите, в <code>cv.md</code> нет ничего нового за исключением таблицы Markdown.</p> | |||
| <p><a name="lfsa"/></p> | |||
| <h2 id="05">05. Запустите ЛФСД</h2> | |||
| <p>Запустите <a href="http://opengamestudio.org/lfsa/ru">ЛФСД</a> с указанием директории, содержащей только что рассмотренные файлы:</p> | |||
| <pre><code>$ /путь/до/lfsa_1.0.0.py /путь/до/директории/01.TwoPages | |||
| </code></pre> | |||
| <p>Вы должны увидеть примерно такой вывод:</p> | |||
| <pre><code>DIR: '/Users/kornerr/p/site-pskov-sample/01.TwoPages' | |||
| PORT: '8000' | |||
| </code></pre> | |||
| <p><a name="gen"/></p> | |||
| <h2 id="06">06. Сгенерируйте сайт</h2> | |||
| <p>Настало время сгенерировать свой собственный веб-сайт:</p> | |||
| <ul> | |||
| <li>Перейдите на страницу <a href="http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html">Инструмент</a></li> | |||
| <li>Убедитесь в том, что:<ul> | |||
| <li><code>Путь</code> указывает на нужную директорию</li> | |||
| <li><code>Входящая директория</code> и <code>Шаблон элемента</code> содержат значения из <code>pskov.cfg</code></li></ul></li> | |||
| <li>Нажмите кнопку <code>Генерировать</code> для генерации файлов HTML рядом с файлами Markdown</li> | |||
| <li>Откройте сгенерированный файл <code>about.html</code> из директории сайта</li> | |||
| <li>Перед вами ваш собственный веб-сайт, запущенный локально</li> | |||
| </ul> | |||
| <p><a name="summary"/></p> | |||
| <h2 id="07">07. Итог</h2> | |||
| <p>Вы успешно сгенерировали веб-сайт с двумя страницами. <a href="http://opengamestudio.org/pskov/sample/01.TwoPages/about.html">Проверьте результат</a>.</p> | |||
| <p>Представлены константы <strong>ПСКОВА</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_TITLE</code></td> | |||
| <td>Значение ключа <code>Title</code> из файла Markdown страницы</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_CONTENTS</code></td> | |||
| <td>Предоставляет содержимое HTML, сгенерированное из Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Представлены ключи настроек:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Ключ</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>input</code></td> | |||
| <td>Указывает на директорию с файлом, на который ссылается ключ <code>item</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>item</code></td> | |||
| <td>Указывает на файл с шаблоном HTML, который используется для генерации файлов HTML из Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Представлены ключи заголовка:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Ключ заголовка</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>Title</code></td> | |||
| <td>Предоставляет значение для константы <code>PSKOV_ITEM_TITLE</code> во время генерации HTML из Markdown</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>Slug</code></td> | |||
| <td>Сообщает <strong>ПСКОВУ</strong> о том, что этот файл должен быть сохранён как <code><slug>.html</code></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p></div><div class="contents"></p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><a href="education.02.deps.html">02. Зависимости</a></td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td><a href="education.04.lang.html">04. Язык</a></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| Сайт сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a> | |||
| из <a href="http://github.com/ogstudio/site-pskov">этого исходного кода</a>. | |||
| Сайт расположен на <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
| </html> | |||
+ 247
- 0
pskov/ru/education.03.site.md
View File
| @@ -0,0 +1,247 @@ | |||
| Title: Обучение: 03. Сайт | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education.03.site | |||
| Lang: ru | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | [02. Зависимости][prev] | [Обучение][index] | [04. Язык][next] | | |||
| </div><div class="contents"> | |||
| В этом документы мы создадим простой статический сайт с двумя страницами. | |||
| Ожидаемое время завершения: 10 минут. | |||
| **Содержание** | |||
| * [01. Вдохновление](#inspiration) | |||
| * [02. Изучите файл `pskov.cfg`](#cfg) | |||
| * [03. Изучите файл `item.template`](#item) | |||
| * [04. Изучите файлы `about.md` и `cv.md`](#md) | |||
| * [05. Запустите ЛФСД](#lfsa) | |||
| * [06. Сгенерируйте сайт](#gen) | |||
| * [07. Итог](#summary) | |||
| <a name="inspiration"/> | |||
| ## 01. Вдохновление | |||
| Представьте, что вы являетесь выдающимся русским живописцем Валентином Серовым. Каждый раз, когда кто-либо хочет узнать о вас, он идёт на [Википедию][serov]. Сегодня утром вы просыпаетесь раньше обычного с отчётливым желанием создать свой собственный веб-сайт. | |||
| Вы приступаете к созданию следующих страницы: | |||
| * About me | |||
| * Curriculum vitae (CV) | |||
| Несколько позже в [директории вашего сайта][01-files] у вас оказываются следующие файлы: | |||
| * pskov.cfg | |||
| * item.template | |||
| * about.md | |||
| * cv.md | |||
| Давайте взглянем на их содержимое. | |||
| <a name="cfg"/> | |||
| ## 02. Изучите файл `pskov.cfg` | |||
| Файл `pskov.cfg` содержит следующее: | |||
| ``` | |||
| input = . | |||
| item = item.template | |||
| ``` | |||
| `pskov.cfg` является [файлом настроек][ini-file] со следующими ключами: | |||
| | Ключ | Описание | | |||
| |---|---| | |||
| | `input` | Указывает на директорию с файлом, на который ссылается ключ `item` | | |||
| | `item` | Указывает на файл с шаблоном HTML, который используется для генерации файлов HTML из Markdown | | |||
| В нашем случае файл `item.template` расположен рядом с `pskov.cfg`, поэтому мы используем `.` для обозначения текущей директории. | |||
| <a name="item"/> | |||
| ## 03. Изучите файл `item.template` | |||
| Файл `item.template` содержит следующее: | |||
| ``` | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| </style> | |||
| <title>Serov</title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Serov</strong> | |||
| <a href="about.html">About me</a> | |||
| <a href="cv.html">CV</a> | |||
| </div> | |||
| <center> | |||
| <h1>PSKOV_ITEM_TITLE</h1> | |||
| <div class="contents"> | |||
| PSKOV_ITEM_CONTENTS | |||
| </div> | |||
| <div id="footer"> | |||
| This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| </html> | |||
| ``` | |||
| **Внимание**: стиль схлопнут для краткости. | |||
| Как видите, `item.template` представляет из себя обычный файл HTML с двумя константами **ПСКОВА**: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_ITEM_TITLE` | Значение ключа `Title` из файла Markdown страницы | | |||
| | `PSKOV_ITEM_CONTENTS` | Предоставляет содержимое HTML, сгенерированное из Markdown | | |||
| **Замечания**: | |||
| * другие константы **ПСКОВА** описаны позже | |||
| * файл Markdown страницы описан ниже | |||
| <a name="md"/> | |||
| ## 04. Изучите файлы `about.md` и `cv.md` | |||
| Файл `about.md` содержит следующее: | |||
| ``` | |||
| Title: About me | |||
| Slug: about | |||
| Hi, my name is Valentin Serov. Here's my self-portrait: | |||
| ![Valentin Serov self-portrait][serov-portrait] | |||
| - - - - Схлопнуто для краткости - - - - | |||
| Have a look at my [CV][cv] now. | |||
| [serov]: https://en.wikipedia.org/wiki/Valentin_Serov | |||
| [revolution]: https://en.wikipedia.org/wiki/Russian_Revolution | |||
| [serov-portrait]: myself.jpg | |||
| [serov-work]: mywork.jpg | |||
| [girl-with-peaches]: https://en.wikipedia.org/wiki/Girl_with_Peaches | |||
| [pskov]: http://opengamestudio.org/pskov | |||
| [cv]: cv.html | |||
| ``` | |||
| `about.md` начинается с так называемого заголовка: | |||
| | Ключ заголовка | Описание | | |||
| |---|---| | |||
| | `Title` | Предоставляет значение для константы `PSKOV_ITEM_TITLE` во время генерации HTML из Markdown | | |||
| | `Slug` | Сообщает **ПСКОВУ** о том, что этот файл должен быть сохранён как `<slug>.html` | | |||
| В остальном содержимое `about.md` ничем не отличается от любых других файлов Markdown. | |||
| **Внимание**: ссылка на страницу `cv` указана как `cv.html`, не `cv.md` | |||
| Файл `cv.md` содержит следующее: | |||
| ``` | |||
| Title: Curriculum vitae | |||
| Slug: cv | |||
| Here's my CV in case my paintings still interest you. I took a bit of a modern IT approach to structure my CV as key-value pairs of a dictionary (map), enjoy! | |||
| | Key | Value | | |||
| |---|---| | |||
| | Name | Valentin Serov | | |||
| | Age | 46 | | |||
| | Marital status | Married | | |||
| | Country | Russian Empire | | |||
| | Alma mater | Imperial Academy of Arts | | |||
| | Education | * Member Academy of Arts (1898) <br> * Full Member Academy of Arts (1903) | | |||
| ``` | |||
| Как видите, в `cv.md` нет ничего нового за исключением таблицы Markdown. | |||
| <a name="lfsa"/> | |||
| ## 05. Запустите ЛФСД | |||
| Запустите [ЛФСД][lfsa] с указанием директории, содержащей только что рассмотренные файлы: | |||
| ``` | |||
| $ /путь/до/lfsa_1.0.0.py /путь/до/директории/01.TwoPages | |||
| ``` | |||
| Вы должны увидеть примерно такой вывод: | |||
| ``` | |||
| DIR: '/Users/kornerr/p/site-pskov-sample/01.TwoPages' | |||
| PORT: '8000' | |||
| ``` | |||
| <a name="gen"/> | |||
| ## 06. Сгенерируйте сайт | |||
| Настало время сгенерировать свой собственный веб-сайт: | |||
| * Перейдите на страницу [Инструмент][tool] | |||
| * Убедитесь в том, что: | |||
| * `Путь` указывает на нужную директорию | |||
| * `Входящая директория` и `Шаблон элемента` содержат значения из `pskov.cfg` | |||
| * Нажмите кнопку `Генерировать` для генерации файлов HTML рядом с файлами Markdown | |||
| * Откройте сгенерированный файл `about.html` из директории сайта | |||
| * Перед вами ваш собственный веб-сайт, запущенный локально | |||
| <a name="summary"/> | |||
| ## 07. Итог | |||
| Вы успешно сгенерировали веб-сайт с двумя страницами. [Проверьте результат][01-sample]. | |||
| Представлены константы **ПСКОВА**: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_ITEM_TITLE` | Значение ключа `Title` из файла Markdown страницы | | |||
| | `PSKOV_ITEM_CONTENTS` | Предоставляет содержимое HTML, сгенерированное из Markdown | | |||
| Представлены ключи настроек: | |||
| | Ключ | Описание | | |||
| |---|---| | |||
| | `input` | Указывает на директорию с файлом, на который ссылается ключ `item` | | |||
| | `item` | Указывает на файл с шаблоном HTML, который используется для генерации файлов HTML из Markdown | | |||
| Представлены ключи заголовка: | |||
| | Ключ заголовка | Описание | | |||
| |---|---| | |||
| | `Title` | Предоставляет значение для константы `PSKOV_ITEM_TITLE` во время генерации HTML из Markdown | | |||
| | `Slug` | Сообщает **ПСКОВУ** о том, что этот файл должен быть сохранён как `<slug>.html` | | |||
| </div><div class="contents"> | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | [02. Зависимости][prev] | [Обучение][index] | [04. Язык][next] | | |||
| [index]: education.html | |||
| [prev]: education.02.deps.html | |||
| [next]: education.04.lang.html | |||
| [01-files]: https://github.com/OGStudio/site-pskov-sample/tree/master/01.TwoPages | |||
| [01-sample]: http://opengamestudio.org/pskov/sample/01.TwoPages/about.html | |||
| [ini-file]: https://ru.wikipedia.org/wiki/.ini | |||
| [serov]: https://ru.wikipedia.org/wiki/%D0%A1%D0%B5%D1%80%D0%BE%D0%B2,_%D0%92%D0%B0%D0%BB%D0%B5%D0%BD%D1%82%D0%B8%D0%BD_%D0%90%D0%BB%D0%B5%D0%BA%D1%81%D0%B0%D0%BD%D0%B4%D1%80%D0%BE%D0%B2%D0%B8%D1%87 | |||
| [lfsa]: http://opengamestudio.org/lfsa/ru | |||
| [tool]: http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html | |||
+ 281
- 0
pskov/ru/education.04.lang.html
View File
| @@ -0,0 +1,281 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| #header | |||
| { | |||
| background: #856d51; | |||
| padding: 0.7em; | |||
| text-align: left; | |||
| } | |||
| #header a | |||
| { | |||
| color: white; | |||
| text-decoration: none; | |||
| padding: 0.5em 1em 0.5em 1em; | |||
| } | |||
| #title | |||
| { | |||
| color: #433729; | |||
| } | |||
| html | |||
| { | |||
| font-family: sans-serif; | |||
| } | |||
| body | |||
| { | |||
| line-height: 1.5em; | |||
| } | |||
| body | |||
| { | |||
| background: #FAFAFA; | |||
| } | |||
| table | |||
| { | |||
| border-collapse: collapse; | |||
| width: 100%; | |||
| } | |||
| table, th, td | |||
| { | |||
| border: 1px solid #aaa; | |||
| padding: 0.5em; | |||
| margin-top: 0.5em; | |||
| margin-bottom: 0.5em; | |||
| } | |||
| code, pre | |||
| { | |||
| font-family: monospace, serif; | |||
| font-size: 1em; | |||
| color: #7f0a0c; | |||
| background: #f5f5f5; | |||
| white-space: pre-wrap; | |||
| } | |||
| .contents | |||
| { | |||
| background: #FFFFFF; | |||
| width: 720px; | |||
| padding: 1em; | |||
| margin-top: 2em; | |||
| margin-bottom: 2em; | |||
| border: 1px solid #E0E0E0; | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong id="title">ПСКОВ</strong> | |||
| <a href="pskov_1.0.0+ru.html">Инструмент</a> | |||
| <a href="education.html">Обучение</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.04.lang.html">EN</a> | |||
| <a href="../ru/education.04.lang.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Обучение: 04. Язык | |||
| </h1></center> | |||
| <center><div class="contents"> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><a href="education.03.site.html">03. Сайт</a></td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td><a href="education.05.blog.html">05. Блог</a></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p></div><div class="contents"></p> | |||
| <p>В этом документе мы добавим выбор языка.</p> | |||
| <p>Ожидаемое время завершения: 10 минут.</p> | |||
| <p><strong>Содержание</strong></p> | |||
| <ul> | |||
| <li><a href="#localization">01. Локализация</a></li> | |||
| <li><a href="#cfg">02. Изучите файл <code>pskov.cfg</code></a></li> | |||
| <li><a href="#item">03. Изучите файлы шаблонов</a></li> | |||
| <li><a href="#md">04. Изучите файлы Markdown</a></li> | |||
| <li><a href="#gen">05. Запустите ЛФСД и сгенерируйте сайт</a></li> | |||
| <li><a href="#summary">06. Итог</a></li> | |||
| </ul> | |||
| <p><a name="localization"/></p> | |||
| <h2 id="01">01. Локализация</h2> | |||
| <p>Теперь, когда у вас есть собственный веб-сайт на английском, вы задумываетесь о русской версии, ведь вы же всё-таки русский!</p> | |||
| <p>Вы создаёте директорию со <a href="https://github.com/OGStudio/site-pskov-sample/tree/master/02.Language">следующей структурой файлов</a>:</p> | |||
| <ul> | |||
| <li><code>pskov.cfg</code></li> | |||
| <li><code>en/item.template</code></li> | |||
| <li><code>en/about.md</code></li> | |||
| <li><code>en/cv.md</code></li> | |||
| <li><code>ru/item.template</code></li> | |||
| <li><code>ru/about.md</code></li> | |||
| <li><code>ru/cv.md</code></li> | |||
| </ul> | |||
| <p>Давайте взглянем на содержимое этих файлов.</p> | |||
| <p><a name="cfg"/></p> | |||
| <h2 id="02pskovcfg">02. Изучите файл <code>pskov.cfg</code></h2> | |||
| <p>Файл <code>pskov.cfg</code> содержит следующее:</p> | |||
| <pre><code>input = en;ru | |||
| item = item.template | |||
| </code></pre> | |||
| <p>Как видите, <code>input</code> может принимать несколько директорий, разделённых символом <code>;</code>. <strong>ПСКОВ</strong> обработает каждую указанную директорию так же, как и ранее.</p> | |||
| <p>В нашем случае каждая из директорий - <code>en/</code> и <code>ru/</code> - содержит собственный шаблон <code>item.template</code>.</p> | |||
| <p><a name="item"/></p> | |||
| <h2 id="03">03. Изучите файлы шаблонов</h2> | |||
| <ul> | |||
| <li><p>Содержимое <code>en/item.template</code>:</p> | |||
| <pre><code>- - - - Схлопнуто для краткости - - - - | |||
| <title>Serov</title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Serov</strong> | |||
| <a href="about.html">About me</a> | |||
| <a href="cv.html">CV</a> | |||
| <div id="lang"> | |||
| <a href="../en/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../ru/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| </code></pre></li> | |||
| <li><p>Содержимое <code>ru/item.template</code>:</p> | |||
| <pre><code>- - - - Схлопнуто для краткости - - - - | |||
| <title>Серов</title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Серов</strong> | |||
| <a href="about.html">Обо мне</a> | |||
| <a href="cv.html">Резюме</a> | |||
| <div id="lang"> | |||
| <a href="../en/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../ru/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| </code></pre></li> | |||
| </ul> | |||
| <p><strong>Внимание</strong>: начало и конец схлопнуты для краткости.</p> | |||
| <p>Как видите, <code>en/item.template</code> и <code>ru/item.template</code> очень похожи на <a href="education.03.site.html">виденный ранее</a> <code>item.template</code>.</p> | |||
| <p>Изменения следующие:</p> | |||
| <ul> | |||
| <li>использование секции <code><div id="lang">...</div></code> для отображения выбора языка</li> | |||
| <li>локализация заголовков на Английском и Русском языках</li> | |||
| </ul> | |||
| <p>Выбор языка использует следующую новую константу <strong>ПСКОВА</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_URL</code></td> | |||
| <td>Предоставляет имя файла генерируемой страницы</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Использование <code>PSKOV_ITEM_URL</code> даёт вам поддержку стольких языков, сколько пожелаете.</p> | |||
| <p><a name="md"/></p> | |||
| <h2 id="04markdown">04. Изучите файлы Markdown</h2> | |||
| <p>Файлы <code>en/about.md</code> и <code>en/cv.md</code> выглядят почти идентично <a href="education.03.site.html">виденным ранее</a>. <code>ru/about.md</code> и <code>ru/cv.md</code> представляют собой русские версии соответствующих английских страниц.</p> | |||
| <p>Например, <code>ru/cv.md</code> содержит:</p> | |||
| <pre><code> Title: Резюме | |||
| Slug: cv | |||
| Здесь вы можете увидеть моё резюме в том случае, если мои произведения всё ещё вас интересуют. Я использовал современный подход ИТ для структурирования своего резюме в виде пар ключ-значение словаря (карты). Наслаждайтесь! | |||
| | Ключ | Значение | | |||
| |---|---| | |||
| | Имя | Валентин Серов | | |||
| | Возраст | 46 | | |||
| | Семейное положение | Женат | | |||
| | Страна | Российская Империя | | |||
| | Учёба | Императорская Академия художеств | | |||
| | Звания | * академик ИАХ (1898) <br> * действительный член ИАХ (1903) | | |||
| </code></pre> | |||
| <p><strong>Внимание</strong>: русская страница использует точно такое же значение <code>Slug</code>, как и английская страница.</p> | |||
| <p><a name="gen"/></p> | |||
| <h2 id="05">05. Запустите ЛФСД и сгенерируйте сайт</h2> | |||
| <p>Запустите <a href="http://opengamestudio.org/lfsa/ru">ЛФСД</a> с указанием директории, содержащей только что рассмотренные файлы:</p> | |||
| <pre><code>$ /путь/до/lfsa_1.0.0.py /путь/до/директории/02.Language | |||
| </code></pre> | |||
| <p>Сгенерируйте сайт:</p> | |||
| <ul> | |||
| <li>Перейдите на страницу <a href="http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html">Инструмент</a></li> | |||
| <li>Нажмите кнопку <code>Генерировать</code></li> | |||
| <li>Откройте сгенерированный файл <code>en/about.html</code> или <code>ru/about.html</code> из директории сайта</li> | |||
| <li>Переключите язык, чтобы убедиться в корректной работе</li> | |||
| </ul> | |||
| <p><a name="summary"/></p> | |||
| <h2 id="06">06. Итог</h2> | |||
| <p>Вы успешно добавили выбор языка. <a href="http://opengamestudio.org/pskov/sample/02.Language/ru/about.html">Проверьте результат</a>.</p> | |||
| <p>Представлены константы <strong>ПСКОВА</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_URL</code></td> | |||
| <td>Предоставляет имя файла генерируемой страницы</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p></div><div class="contents"></p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><a href="education.03.site.html">03. Сайт</a></td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td><a href="education.05.blog.html">05. Блог</a></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| Сайт сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a> | |||
| из <a href="http://github.com/ogstudio/site-pskov">этого исходного кода</a>. | |||
| Сайт расположен на <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
| </html> | |||
+ 187
- 0
pskov/ru/education.04.lang.md
View File
| @@ -0,0 +1,187 @@ | |||
| Title: Обучение: 04. Язык | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education.04.lang | |||
| Lang: ru | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | [03. Сайт][prev] | [Обучение][index] | [05. Блог][next] | | |||
| </div><div class="contents"> | |||
| В этом документе мы добавим выбор языка. | |||
| Ожидаемое время завершения: 10 минут. | |||
| **Содержание** | |||
| * [01. Локализация](#localization) | |||
| * [02. Изучите файл `pskov.cfg`](#cfg) | |||
| * [03. Изучите файлы шаблонов](#item) | |||
| * [04. Изучите файлы Markdown](#md) | |||
| * [05. Запустите ЛФСД и сгенерируйте сайт](#gen) | |||
| * [06. Итог](#summary) | |||
| <a name="localization"/> | |||
| ## 01. Локализация | |||
| Теперь, когда у вас есть собственный веб-сайт на английском, вы задумываетесь о русской версии, ведь вы же всё-таки русский! | |||
| Вы создаёте директорию со [следующей структурой файлов][02-files]: | |||
| * `pskov.cfg` | |||
| * `en/item.template` | |||
| * `en/about.md` | |||
| * `en/cv.md` | |||
| * `ru/item.template` | |||
| * `ru/about.md` | |||
| * `ru/cv.md` | |||
| Давайте взглянем на содержимое этих файлов. | |||
| <a name="cfg"/> | |||
| ## 02. Изучите файл `pskov.cfg` | |||
| Файл `pskov.cfg` содержит следующее: | |||
| ``` | |||
| input = en;ru | |||
| item = item.template | |||
| ``` | |||
| Как видите, `input` может принимать несколько директорий, разделённых символом `;`. **ПСКОВ** обработает каждую указанную директорию так же, как и ранее. | |||
| В нашем случае каждая из директорий - `en/` и `ru/` - содержит собственный шаблон `item.template`. | |||
| <a name="item"/> | |||
| ## 03. Изучите файлы шаблонов | |||
| * Содержимое `en/item.template`: | |||
| ``` | |||
| - - - - Схлопнуто для краткости - - - - | |||
| <title>Serov</title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Serov</strong> | |||
| <a href="about.html">About me</a> | |||
| <a href="cv.html">CV</a> | |||
| <div id="lang"> | |||
| <a href="../en/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../ru/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| ``` | |||
| * Содержимое `ru/item.template`: | |||
| ``` | |||
| - - - - Схлопнуто для краткости - - - - | |||
| <title>Серов</title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Серов</strong> | |||
| <a href="about.html">Обо мне</a> | |||
| <a href="cv.html">Резюме</a> | |||
| <div id="lang"> | |||
| <a href="../en/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../ru/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| ``` | |||
| **Внимание**: начало и конец схлопнуты для краткости. | |||
| Как видите, `en/item.template` и `ru/item.template` очень похожи на [виденный ранее][prev] `item.template`. | |||
| Изменения следующие: | |||
| * использование секции `<div id="lang">...</div>` для отображения выбора языка | |||
| * локализация заголовков на Английском и Русском языках | |||
| Выбор языка использует следующую новую константу **ПСКОВА**: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_ITEM_URL` | Предоставляет имя файла генерируемой страницы | | |||
| Использование `PSKOV_ITEM_URL` даёт вам поддержку стольких языков, сколько пожелаете. | |||
| <a name="md"/> | |||
| ## 04. Изучите файлы Markdown | |||
| Файлы `en/about.md` и `en/cv.md` выглядят почти идентично [виденным ранее][prev]. `ru/about.md` и `ru/cv.md` представляют собой русские версии соответствующих английских страниц. | |||
| Например, `ru/cv.md` содержит: | |||
| ``` | |||
| Title: Резюме | |||
| Slug: cv | |||
| Здесь вы можете увидеть моё резюме в том случае, если мои произведения всё ещё вас интересуют. Я использовал современный подход ИТ для структурирования своего резюме в виде пар ключ-значение словаря (карты). Наслаждайтесь! | |||
| | Ключ | Значение | | |||
| |---|---| | |||
| | Имя | Валентин Серов | | |||
| | Возраст | 46 | | |||
| | Семейное положение | Женат | | |||
| | Страна | Российская Империя | | |||
| | Учёба | Императорская Академия художеств | | |||
| | Звания | * академик ИАХ (1898) <br> * действительный член ИАХ (1903) | | |||
| ``` | |||
| **Внимание**: русская страница использует точно такое же значение `Slug`, как и английская страница. | |||
| <a name="gen"/> | |||
| ## 05. Запустите ЛФСД и сгенерируйте сайт | |||
| Запустите [ЛФСД][lfsa] с указанием директории, содержащей только что рассмотренные файлы: | |||
| ``` | |||
| $ /путь/до/lfsa_1.0.0.py /путь/до/директории/02.Language | |||
| ``` | |||
| Сгенерируйте сайт: | |||
| * Перейдите на страницу [Инструмент][tool] | |||
| * Нажмите кнопку `Генерировать` | |||
| * Откройте сгенерированный файл `en/about.html` или `ru/about.html` из директории сайта | |||
| * Переключите язык, чтобы убедиться в корректной работе | |||
| <a name="summary"/> | |||
| ## 06. Итог | |||
| Вы успешно добавили выбор языка. [Проверьте результат][02-sample]. | |||
| Представлены константы **ПСКОВА**: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_ITEM_URL` | Предоставляет имя файла генерируемой страницы | | |||
| </div><div class="contents"> | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | [03. Сайт][prev] | [Обучение][index] | [05. Блог][next] | | |||
| [index]: education.html | |||
| [prev]: education.03.site.html | |||
| [next]: education.05.blog.html | |||
| [02-files]: https://github.com/OGStudio/site-pskov-sample/tree/master/02.Language | |||
| [02-sample]: http://opengamestudio.org/pskov/sample/02.Language/ru/about.html | |||
| [lfsa]: http://opengamestudio.org/lfsa/ru | |||
| [tool]: http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html | |||
+ 712
- 0
pskov/ru/education.05.blog.html
View File
| @@ -0,0 +1,712 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| #header | |||
| { | |||
| background: #856d51; | |||
| padding: 0.7em; | |||
| text-align: left; | |||
| } | |||
| #header a | |||
| { | |||
| color: white; | |||
| text-decoration: none; | |||
| padding: 0.5em 1em 0.5em 1em; | |||
| } | |||
| #title | |||
| { | |||
| color: #433729; | |||
| } | |||
| html | |||
| { | |||
| font-family: sans-serif; | |||
| } | |||
| body | |||
| { | |||
| line-height: 1.5em; | |||
| } | |||
| body | |||
| { | |||
| background: #FAFAFA; | |||
| } | |||
| table | |||
| { | |||
| border-collapse: collapse; | |||
| width: 100%; | |||
| } | |||
| table, th, td | |||
| { | |||
| border: 1px solid #aaa; | |||
| padding: 0.5em; | |||
| margin-top: 0.5em; | |||
| margin-bottom: 0.5em; | |||
| } | |||
| code, pre | |||
| { | |||
| font-family: monospace, serif; | |||
| font-size: 1em; | |||
| color: #7f0a0c; | |||
| background: #f5f5f5; | |||
| white-space: pre-wrap; | |||
| } | |||
| .contents | |||
| { | |||
| background: #FFFFFF; | |||
| width: 720px; | |||
| padding: 1em; | |||
| margin-top: 2em; | |||
| margin-bottom: 2em; | |||
| border: 1px solid #E0E0E0; | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong id="title">ПСКОВ</strong> | |||
| <a href="pskov_1.0.0+ru.html">Инструмент</a> | |||
| <a href="education.html">Обучение</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.05.blog.html">EN</a> | |||
| <a href="../ru/education.05.blog.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Обучение: 05. Блог | |||
| </h1></center> | |||
| <center><div class="contents"> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><a href="education.04.lang.html">04. Язык</a></td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td>Отсутствует</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p></div><div class="contents"></p> | |||
| <p>В этом документе мы создадим "динамические" страницы блога.</p> | |||
| <p>Ожидаемое время завершения: 20 минут.</p> | |||
| <p><strong>Содержание</strong></p> | |||
| <ul> | |||
| <li><a href="#blog">01. Блог</a></li> | |||
| <li><a href="#cfg">02. Изучите файл <code>pskov.cfg</code></a></li> | |||
| <li><a href="#item">03. Изучите шаблоны элементов</a></li> | |||
| <li><a href="#preview">04. Изучите шаблоны предпросмотров</a></li> | |||
| <li><a href="#index">05. Изучите шаблоны страниц с предпросмотрами</a></li> | |||
| <li><a href="#pagination">06. Изучите постраничные шаблоны</a></li> | |||
| <li><a href="#md">07. Изучите файлы Markdown</a></li> | |||
| <li><a href="#gen">08. Запустите ЛФСД и сгенерируйте сайт</a></li> | |||
| <li><a href="#summary">09. Итог</a></li> | |||
| </ul> | |||
| <p><a name="blog"/></p> | |||
| <h2 id="01">01. Блог</h2> | |||
| <p>Итак, у вас есть веб-сайт на Английском и Русском языках. Вы начинаете ощущать желание регулярно делиться своими мыслями с миром в виде заметок блога.</p> | |||
| <p>Вы создаёте директорию со <a href="https://github.com/OGStudio/site-pskov-sample/tree/master/03.Blog">следующей структурой файлов</a>:</p> | |||
| <ul> | |||
| <li><code>pskov.cfg</code></li> | |||
| <li><code>en/blog/</code><ul> | |||
| <li><code>item.template</code></li> | |||
| <li><code>index.template</code></li> | |||
| <li><code>preview.template</code></li> | |||
| <li><code>pagination.template</code></li> | |||
| <li><code>pagination.prev.template</code></li> | |||
| <li><code>pagination.next.template</code></li> | |||
| <li><code>1885.md</code></li> | |||
| <li><code>1886.01.md</code></li> | |||
| <li><code>1886.02.md</code></li> | |||
| <li><code>1887.01.md</code></li> | |||
| <li><code>1887.02.md</code></li> | |||
| <li><code>1888.md</code></li> | |||
| <li><code>1896.md</code></li> | |||
| <li><code>1899.md</code></li></ul></li> | |||
| <li><code>en/page/</code><ul> | |||
| <li><code>item.template</code></li> | |||
| <li><code>about.md</code></li> | |||
| <li><code>cv.md</code></li></ul></li> | |||
| <li><code>ru/blog/</code><ul> | |||
| <li><code>item.template</code></li> | |||
| <li><code>index.template</code></li> | |||
| <li><code>preview.template</code></li> | |||
| <li><code>pagination.template</code></li> | |||
| <li><code>pagination.prev.template</code></li> | |||
| <li><code>pagination.next.template</code></li> | |||
| <li><code>1885.md</code></li> | |||
| <li><code>1886.01.md</code></li> | |||
| <li><code>1886.02.md</code></li> | |||
| <li><code>1887.01.md</code></li> | |||
| <li><code>1887.02.md</code></li> | |||
| <li><code>1888.md</code></li> | |||
| <li><code>1896.md</code></li> | |||
| <li><code>1899.md</code></li></ul></li> | |||
| <li><code>ru/page/</code><ul> | |||
| <li><code>item.template</code></li> | |||
| <li><code>about.md</code></li> | |||
| <li><code>cv.md</code></li></ul></li> | |||
| </ul> | |||
| <p>Давайте взглянем на содержимое этих файлов.</p> | |||
| <p><a name="cfg"/></p> | |||
| <h2 id="02pskovcfg">02. Изучите файл <code>pskov.cfg</code></h2> | |||
| <p>Файл <code>pskov.cfg</code> содержит следующее:</p> | |||
| <pre><code>input = en/page;ru/page;en/blog;ru/blog | |||
| item = item.template | |||
| preview = preview.template | |||
| index = index.template | |||
| paginationPrev = pagination.prev.template | |||
| paginationNext = pagination.next.template | |||
| paginationPrevNext = pagination.template | |||
| previewSize = 200 | |||
| previewEnding = . . . | |||
| previewsPerPage = 3 | |||
| previewPageBaseName = index | |||
| </code></pre> | |||
| <p>Вы уже встречались с ключами <code>input</code> и <code>item</code>. Рассмотрим остальные:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Ключ</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>preview</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации предпросмотра HTML из первых <code>previewSize</code> (приблизительно) символов для каждого файла Markdown</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>index</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации страницы с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationPrev</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации секции с переходом лишь на предыдущую страницу</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationNext</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации секции с переходм лишь на следующую страницу</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationPrevNext</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации секции с переходами по страницам</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewSize</code></td> | |||
| <td>Количество символов (приблизительное) из файла Markdown, используемое для генерации предпросмотра</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewEnding</code></td> | |||
| <td>Строка для добавления в конец каждого предпросмотра</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewsPerPage</code></td> | |||
| <td>Максимальное количество предпросмотров, умещающееся на странице с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewsPageBaseName</code></td> | |||
| <td>Базовое имя файла для страниц с предпросмотрами</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>В нашем случае:</p> | |||
| <ul> | |||
| <li>мы ограничиваем предпросмотр <code>200</code> символами (приблизительно)</li> | |||
| <li>мы используем строку <code>. . .</code> в конце каждого предпросмотра</li> | |||
| <li>страницы с предпросмотрами вмещают максимум <code>3</code> предпросмотра</li> | |||
| <li>страницы с предпросмотрами будут сохранены как <code>index.html</code>, <code>index2.html</code>, <code>index3.html</code> и т.д.</li> | |||
| </ul> | |||
| <p><a name="item"/></p> | |||
| <h2 id="03">03. Изучите шаблоны элементов</h2> | |||
| <ul> | |||
| <li><p>Содержимое <code>en/blog/item.template</code>:</p> | |||
| <pre><code>- - - - Схлопнуто для краткости - - - - | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Serov</strong> | |||
| <a href="../../en/blog/index.html">Blog</a> | |||
| <a href="../../en/page/about.html">About me</a> | |||
| <a href="../../en/page/cv.html">CV</a> | |||
| <div id="lang"> | |||
| <a href="../../en/blog/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../../ru/blog/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| <h1>In the blog...</h1> | |||
| <div class="contents"> | |||
| <h2 class="itemTitle"> | |||
| <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a> | |||
| </h2> | |||
| <p class="itemDate">PSKOV_ITEM_DATE</p> | |||
| PSKOV_ITEM_CONTENTS | |||
| </div> | |||
| <div id="footer"> | |||
| This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| </code></pre></li> | |||
| <li><p>Содержимое <code>ru/blog/item.template</code>:</p> | |||
| <pre><code>- - - - Схлопнуто для краткости - - - - | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Серов</strong> | |||
| <a href="../../ru/blog/index.html">Блог</a> | |||
| <a href="../../ru/page/about.html">Обо мне</a> | |||
| <a href="../../ru/page/cv.html">Резюме</a> | |||
| <div id="lang"> | |||
| <a href="../../en/blog/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../../ru/blog/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| <h1>В блоге...</h1> | |||
| <div class="contents"> | |||
| <h2 class="itemTitle"> | |||
| <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a> | |||
| </h2> | |||
| <p class="itemDate">PSKOV_ITEM_DATE</p> | |||
| PSKOV_ITEM_CONTENTS | |||
| </div> | |||
| <div id="footer"> | |||
| Этот пример сайта сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| </code></pre></li> | |||
| </ul> | |||
| <p><strong>Внимание</strong>: начало и конец схлопнуты для краткости.</p> | |||
| <p>Как видите, оба файла выглядят практически так же, как и файлы <code>item.template</code>, рассмотренные <a href="education.04.lang.html">ранее</a>.</p> | |||
| <p>Изменения следующие:</p> | |||
| <ul> | |||
| <li>новые URL страниц в директории <code>page</code> и первой страницы с предпросмотрами в директории <code>blog</code></li> | |||
| <li>заголовок используется внутри секции <code>contents</code> в качестве ссылки на полную заметку блога</li> | |||
| <li>дата используется для подчёркивания временной зависимости между заметками блога</li> | |||
| </ul> | |||
| <p>Дату мы получаем из константы <code>PSKOV_ITEM_DATE</code>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_DATE</code></td> | |||
| <td>Значение ключа <code>Date</code> файла Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><a name="preview"/></p> | |||
| <h2 id="04">04. Изучите шаблоны предпросмотров</h2> | |||
| <ul> | |||
| <li><p>Содержимое <code>en/blog/preview.template</code>:</p> | |||
| <pre><code><div class="contents"> | |||
| <h2 class="itemTitle"> | |||
| <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a> | |||
| </h2> | |||
| <p class="itemDate">PSKOV_ITEM_DATE</p> | |||
| PSKOV_PREVIEW | |||
| <div class="itemMore"> | |||
| <a href="PSKOV_ITEM_URL">Continue reading</a> | |||
| </div> | |||
| </div> | |||
| </code></pre></li> | |||
| <li><p>Содержимое <code>ru/blog/preview.template</code>:</p> | |||
| <pre><code><div class="contents"> | |||
| <h2 class="itemTitle"> | |||
| <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a> | |||
| </h2> | |||
| <p class="itemDate">PSKOV_ITEM_DATE</p> | |||
| PSKOV_PREVIEW | |||
| <div class="itemMore"> | |||
| <a href="PSKOV_ITEM_URL">Читать дальше</a> | |||
| </div> | |||
| </div> | |||
| </code></pre></li> | |||
| </ul> | |||
| <p>У предпросмотров нет <code><head></code>, <code><body></code> и прочих полностраничных тэгов HTML. Предпросмотры являются секциями, вставляемыми в страницы с предпросмотрами.</p> | |||
| <p>Сам предпросмотр мы получаем из константы <code>PSKOV_PREVIEW</code>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_PREVIEW</code></td> | |||
| <td>Предоставляет содержимое файла Markdown, ограниченное <code>previewSize</code> символами (приблизительно)</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><a name="index"/></p> | |||
| <h2 id="05">05. Изучите шаблоны страниц с предпросмотрами</h2> | |||
| <ul> | |||
| <li><p>Содержимое <code>en/blog/index.template</code>:</p> | |||
| <pre><code>- - - - Схлопнуто для краткости - - - - | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Serov</strong> | |||
| <a href="../../en/blog/index.html">Blog</a> | |||
| <a href="../../en/page/about.html">About me</a> | |||
| <a href="../../en/page/cv.html">CV</a> | |||
| <div id="lang"> | |||
| <a href="../../en/blog/PSKOV_INDEX_URL">EN</a> | |||
| <a href="../../ru/blog/PSKOV_INDEX_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| <h1>Blog</h1> | |||
| PSKOV_PREVIEWS | |||
| PSKOV_PAGINATION | |||
| <div id="footer"> | |||
| This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| </code></pre></li> | |||
| <li><p>Содержимое <code>ru/blog/index.template</code>:</p> | |||
| <pre><code>- - - - Схлопнуто для краткости - - - - | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Серов</strong> | |||
| <a href="../../ru/blog/index.html">Блог</a> | |||
| <a href="../../ru/page/about.html">Обо мне</a> | |||
| <a href="../../ru/page/cv.html">Резюме</a> | |||
| <div id="lang"> | |||
| <a href="../../en/blog/PSKOV_INDEX_URL">EN</a> | |||
| <a href="../../ru/blog/PSKOV_INDEX_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| <h1>Блог</h1> | |||
| PSKOV_PREVIEWS | |||
| PSKOV_PAGINATION | |||
| <div id="footer"> | |||
| Этот пример сайта сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| </code></pre></li> | |||
| </ul> | |||
| <p><strong>Замечания</strong>:</p> | |||
| <ul> | |||
| <li>начало и конец схлопнуты для краткости</li> | |||
| <li>константа <code>PSKOV_INDEX_URL</code> используется для выбора языка</li> | |||
| </ul> | |||
| <p>Новые константы <strong>ПСКОВА</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_INDEX_URL</code></td> | |||
| <td>Предоставляет генерируемое имя файла страницы с предпросмотрами: <code><previewsPageBaseName><id>.html</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREVIEWS</code></td> | |||
| <td>Предоставляет набор предпросмотров</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGINATION</code></td> | |||
| <td>Предоставляет секцию для перехода между страницами с предпросмотрами</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><a name="pagination"/></p> | |||
| <h2 id="06">06. Изучите постраничные шаблоны</h2> | |||
| <p>Постраничные шаблоны являются секциями HTML для перехода между страницами с предпросмотрами.</p> | |||
| <p>Существует три постраничных шаблона:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Постраничный шаблон</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Предыдущий</td> | |||
| <td>Посетитель может перейти лишь назад</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Следующий</td> | |||
| <td>Посетитель может перейти лишь вперёд</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Оба</td> | |||
| <td>Посетитель может перейти либо вперёд, либо назад</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Рассмотрим английские постраничные шаблоны:</p> | |||
| <ul> | |||
| <li><p>Содержимое <code>en/blog/pagination.prev.template</code>:</p> | |||
| <pre><code><p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p> | |||
| <p> | |||
| <a href="PSKOV_PREV_PAGE_URL">« Newer</a> | |||
| </p> | |||
| </code></pre></li> | |||
| <li><p>Содержимое <code>en/blog/pagination.next.template</code>:</p> | |||
| <pre><code><p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p> | |||
| <p> | |||
| <a href="PSKOV_NEXT_PAGE_URL">Older »</a> | |||
| </p> | |||
| </code></pre></li> | |||
| <li><p>Содержимое <code>en/blog/pagination.template</code>:</p> | |||
| <pre><code><p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p> | |||
| <p> | |||
| <a href="PSKOV_PREV_PAGE_URL">« Newer</a> | |||
| <a href="PSKOV_NEXT_PAGE_URL">Older »</a> | |||
| </p> | |||
| </code></pre></li> | |||
| </ul> | |||
| <p>Русские версии выглядят схожим образом. Например, содержимое <code>ru/blog/pagination.template</code>:</p> | |||
| <pre><code><p>Страница PSKOV_PAGE_ID из PSKOV_PAGES_COUNT</p> | |||
| <p> | |||
| <a href="PSKOV_PREV_PAGE_URL">« Новее</a> | |||
| <a href="PSKOV_NEXT_PAGE_URL">Старее »</a> | |||
| </p> | |||
| </code></pre> | |||
| <p>Новые константы <strong>ПСКОВА</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_PAGE_ID</code></td> | |||
| <td>Предоставляет порядковый номер страницы с предпросмотрами, начиная с <code>1</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGES_COUNT</code></td> | |||
| <td>Предоставляет количество сгенерированных страниц с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREV_PAGE_URL</code></td> | |||
| <td>Предоставляет имя файла предыдущей страницы с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_NEXT_PAGE_URL</code></td> | |||
| <td>Предоставляет имя файла следующей страницы с предпросмотрами</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><a name="md"/></p> | |||
| <h2 id="07markdown">07. Изучите файлы Markdown</h2> | |||
| <p>Файлы Markdown являются заметками блога, они похожи на файлы Markdown обычных страниц. Вот как выглядит содержимое <code>en/blog/1885.md</code>:</p> | |||
| <pre><code> Title: Bullocks | |||
| Date: 1885 | |||
| Slug: 1885.01.bullocks | |||
| ![Bullocks][bullocks] | |||
| I've been painting "Bullocks" sketch while I was staying in Odessa at Kuznetsov's in 1885. | |||
| [bullocks]: https://upload.wikimedia.org/wikipedia/commons/c/cb/Walentin_Aleksandrovich_Serov_Bullocks.jpg | |||
| </code></pre> | |||
| <p>Заметки блога сортируются по дате: новые заметки размещаются перед старыми.</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Ключ заголовка</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>Date</code></td> | |||
| <td>Предоставляет значение для константы <code>PSKOV_ITEM_DATE</code> при генерации HTML из Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p><a name="gen"/></p> | |||
| <h2 id="08">08. Запустите ЛФСД и сгенерируйте сайт</h2> | |||
| <p>Запустите <a href="http://opengamestudio.org/lfsa/ru">ЛФСД</a> с указанием директории, содержащей только что рассмотренные файлы:</p> | |||
| <pre><code>$ /путь/до/lfsa_1.0.0.py /путь/до/директории/03.Blog | |||
| </code></pre> | |||
| <p>Сгенерируйте сайт:</p> | |||
| <ul> | |||
| <li>Перейдите на страницу <a href="http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html">Инструмент</a></li> | |||
| <li>Нажмите кнопку <code>Генерировать</code></li> | |||
| <li>Откройте сгенерированный файл <code>en/blog/index.html</code> или <code>ru/blog/index.html</code> из директории сайта</li> | |||
| <li>Осуществите переход между страницами предпросмотра</li> | |||
| </ul> | |||
| <p><a name="summary"/></p> | |||
| <h2 id="09">09. Итог</h2> | |||
| <p>Вы успешно сгенерировали веб-сайт с "динамическими" страницами блога. <a href="http://opengamestudio.org/pskov/sample/03.Blog/ru/blog/index.html">Проверьте результат</a>.</p> | |||
| <p>Представлены константы <strong>ПСКОВА</strong>:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Константа ПСКОВА</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>PSKOV_ITEM_DATE</code></td> | |||
| <td>Значение ключа <code>Date</code> файла Markdown</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREVIEW</code></td> | |||
| <td>Предоставляет содержимое файла Markdown, ограниченное <code>previewSize</code> символами (приблизительно)</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_INDEX_URL</code></td> | |||
| <td>Предоставляет генерируемое имя файла страницы с предпросмотрами: <code><previewsPageBaseName><id>.html</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREVIEWS</code></td> | |||
| <td>Предоставляет набор предпросмотров</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGINATION</code></td> | |||
| <td>Предоставляет секцию для перехода между страницами с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGE_ID</code></td> | |||
| <td>Предоставляет порядковый номер страницы с предпросмотрами, начиная с <code>1</code></td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PAGES_COUNT</code></td> | |||
| <td>Предоставляет количество сгенерированных страниц с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_PREV_PAGE_URL</code></td> | |||
| <td>Предоставляет имя файла предыдущей страницы с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>PSKOV_NEXT_PAGE_URL</code></td> | |||
| <td>Предоставляет имя файла следующей страницы с предпросмотрами</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Представлены ключи настроек:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Ключ</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>preview</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации предпросмотра HTML из первых <code>previewSize</code> (приблизительно) символов для каждого файла Markdown</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>index</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации страницы с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationPrev</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации секции с переходом лишь на предыдущую страницу</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationNext</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации секции с переходм лишь на следующую страницу</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>paginationPrevNext</code></td> | |||
| <td>Указывает на шаблон HTML, используемый для генерации секции с переходами по страницам</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewSize</code></td> | |||
| <td>Количество символов (приблизительное) из файла Markdown, используемое для генерации предпросмотра</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewEnding</code></td> | |||
| <td>Строка для добавления в конец каждого предпросмотра</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewsPerPage</code></td> | |||
| <td>Максимальное количество предпросмотров, умещающееся на странице с предпросмотрами</td> | |||
| </tr> | |||
| <tr> | |||
| <td><code>previewsPageBaseName</code></td> | |||
| <td>Базовое имя файла для страниц с предпросмотрами</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Представлены ключи заголовка:</p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Ключ заголовка</th> | |||
| <th>Описание</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><code>Date</code></td> | |||
| <td>Предоставляет значение для константы <code>PSKOV_ITEM_DATE</code> при генерации HTML из Markdown</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Это был последний документ, призванный научить вас уверенно владеть генератором статических сайтов <strong>ПСКОВ</strong>. Если вам нравится наш труд, присоединяйтесь к нам в <a href="https://vk.com/opengamestudo">VK</a>, <a href="https://twitter.com/OpenGameStudio">Twitter</a> или <a href="https://www.facebook.com/groups/162611230470183">Facebook</a>.</p> | |||
| <p>А теперь используйте <strong>ПСКОВ</strong> для генерация своего собственного веб-сайта!</p> | |||
| <p></div><div class="contents"></p> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>< Назад</th> | |||
| <th>Начало</th> | |||
| <th>Далее ></th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td><a href="education.04.lang.html">04. Язык</a></td> | |||
| <td><a href="education.html">Обучение</a></td> | |||
| <td>Отсутствует</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| </div></center> | |||
| <div id="footer"> | |||
| Сайт сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a> | |||
| из <a href="http://github.com/ogstudio/site-pskov">этого исходного кода</a>. | |||
| Сайт расположен на <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
| </html> | |||
+ 480
- 0
pskov/ru/education.05.blog.md
View File
| @@ -0,0 +1,480 @@ | |||
| Title: Обучение: 05. Блог | |||
| Date: 2019-06-19 00:00 | |||
| Category: Page | |||
| Slug: education.05.blog | |||
| Lang: ru | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | [04. Язык][prev] | [Обучение][index] | Отсутствует | | |||
| </div><div class="contents"> | |||
| В этом документе мы создадим "динамические" страницы блога. | |||
| Ожидаемое время завершения: 20 минут. | |||
| **Содержание** | |||
| * [01. Блог](#blog) | |||
| * [02. Изучите файл `pskov.cfg`](#cfg) | |||
| * [03. Изучите шаблоны элементов](#item) | |||
| * [04. Изучите шаблоны предпросмотров](#preview) | |||
| * [05. Изучите шаблоны страниц с предпросмотрами](#index) | |||
| * [06. Изучите постраничные шаблоны](#pagination) | |||
| * [07. Изучите файлы Markdown](#md) | |||
| * [08. Запустите ЛФСД и сгенерируйте сайт](#gen) | |||
| * [09. Итог](#summary) | |||
| <a name="blog"/> | |||
| ## 01. Блог | |||
| Итак, у вас есть веб-сайт на Английском и Русском языках. Вы начинаете ощущать желание регулярно делиться своими мыслями с миром в виде заметок блога. | |||
| Вы создаёте директорию со [следующей структурой файлов][03-files]: | |||
| * `pskov.cfg` | |||
| * `en/blog/` | |||
| * `item.template` | |||
| * `index.template` | |||
| * `preview.template` | |||
| * `pagination.template` | |||
| * `pagination.prev.template` | |||
| * `pagination.next.template` | |||
| * `1885.md` | |||
| * `1886.01.md` | |||
| * `1886.02.md` | |||
| * `1887.01.md` | |||
| * `1887.02.md` | |||
| * `1888.md` | |||
| * `1896.md` | |||
| * `1899.md` | |||
| * `en/page/` | |||
| * `item.template` | |||
| * `about.md` | |||
| * `cv.md` | |||
| * `ru/blog/` | |||
| * `item.template` | |||
| * `index.template` | |||
| * `preview.template` | |||
| * `pagination.template` | |||
| * `pagination.prev.template` | |||
| * `pagination.next.template` | |||
| * `1885.md` | |||
| * `1886.01.md` | |||
| * `1886.02.md` | |||
| * `1887.01.md` | |||
| * `1887.02.md` | |||
| * `1888.md` | |||
| * `1896.md` | |||
| * `1899.md` | |||
| * `ru/page/` | |||
| * `item.template` | |||
| * `about.md` | |||
| * `cv.md` | |||
| Давайте взглянем на содержимое этих файлов. | |||
| <a name="cfg"/> | |||
| ## 02. Изучите файл `pskov.cfg` | |||
| Файл `pskov.cfg` содержит следующее: | |||
| ``` | |||
| input = en/page;ru/page;en/blog;ru/blog | |||
| item = item.template | |||
| preview = preview.template | |||
| index = index.template | |||
| paginationPrev = pagination.prev.template | |||
| paginationNext = pagination.next.template | |||
| paginationPrevNext = pagination.template | |||
| previewSize = 200 | |||
| previewEnding = . . . | |||
| previewsPerPage = 3 | |||
| previewPageBaseName = index | |||
| ``` | |||
| Вы уже встречались с ключами `input` и `item`. Рассмотрим остальные: | |||
| | Ключ | Описание | | |||
| |---|---| | |||
| | `preview` | Указывает на шаблон HTML, используемый для генерации предпросмотра HTML из первых `previewSize` (приблизительно) символов для каждого файла Markdown | | |||
| | `index` | Указывает на шаблон HTML, используемый для генерации страницы с предпросмотрами | | |||
| | `paginationPrev` | Указывает на шаблон HTML, используемый для генерации секции с переходом лишь на предыдущую страницу | | |||
| | `paginationNext` | Указывает на шаблон HTML, используемый для генерации секции с переходм лишь на следующую страницу | | |||
| | `paginationPrevNext` | Указывает на шаблон HTML, используемый для генерации секции с переходами по страницам | | |||
| | `previewSize` | Количество символов (приблизительное) из файла Markdown, используемое для генерации предпросмотра | | |||
| | `previewEnding` | Строка для добавления в конец каждого предпросмотра | | |||
| | `previewsPerPage` | Максимальное количество предпросмотров, умещающееся на странице с предпросмотрами | | |||
| | `previewsPageBaseName` | Базовое имя файла для страниц с предпросмотрами | | |||
| В нашем случае: | |||
| * мы ограничиваем предпросмотр `200` символами (приблизительно) | |||
| * мы используем строку `. . .` в конце каждого предпросмотра | |||
| * страницы с предпросмотрами вмещают максимум `3` предпросмотра | |||
| * страницы с предпросмотрами будут сохранены как `index.html`, `index2.html`, `index3.html` и т.д. | |||
| <a name="item"/> | |||
| ## 03. Изучите шаблоны элементов | |||
| * Содержимое `en/blog/item.template`: | |||
| ``` | |||
| - - - - Схлопнуто для краткости - - - - | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Serov</strong> | |||
| <a href="../../en/blog/index.html">Blog</a> | |||
| <a href="../../en/page/about.html">About me</a> | |||
| <a href="../../en/page/cv.html">CV</a> | |||
| <div id="lang"> | |||
| <a href="../../en/blog/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../../ru/blog/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| <h1>In the blog...</h1> | |||
| <div class="contents"> | |||
| <h2 class="itemTitle"> | |||
| <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a> | |||
| </h2> | |||
| <p class="itemDate">PSKOV_ITEM_DATE</p> | |||
| PSKOV_ITEM_CONTENTS | |||
| </div> | |||
| <div id="footer"> | |||
| This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| ``` | |||
| * Содержимое `ru/blog/item.template`: | |||
| ``` | |||
| - - - - Схлопнуто для краткости - - - - | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Серов</strong> | |||
| <a href="../../ru/blog/index.html">Блог</a> | |||
| <a href="../../ru/page/about.html">Обо мне</a> | |||
| <a href="../../ru/page/cv.html">Резюме</a> | |||
| <div id="lang"> | |||
| <a href="../../en/blog/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../../ru/blog/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| <h1>В блоге...</h1> | |||
| <div class="contents"> | |||
| <h2 class="itemTitle"> | |||
| <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a> | |||
| </h2> | |||
| <p class="itemDate">PSKOV_ITEM_DATE</p> | |||
| PSKOV_ITEM_CONTENTS | |||
| </div> | |||
| <div id="footer"> | |||
| Этот пример сайта сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| ``` | |||
| **Внимание**: начало и конец схлопнуты для краткости. | |||
| Как видите, оба файла выглядят практически так же, как и файлы `item.template`, рассмотренные [ранее][prev]. | |||
| Изменения следующие: | |||
| * новые URL страниц в директории `page` и первой страницы с предпросмотрами в директории `blog` | |||
| * заголовок используется внутри секции `contents` в качестве ссылки на полную заметку блога | |||
| * дата используется для подчёркивания временной зависимости между заметками блога | |||
| Дату мы получаем из константы `PSKOV_ITEM_DATE`: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_ITEM_DATE` | Значение ключа `Date` файла Markdown | | |||
| <a name="preview"/> | |||
| ## 04. Изучите шаблоны предпросмотров | |||
| * Содержимое `en/blog/preview.template`: | |||
| ``` | |||
| <div class="contents"> | |||
| <h2 class="itemTitle"> | |||
| <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a> | |||
| </h2> | |||
| <p class="itemDate">PSKOV_ITEM_DATE</p> | |||
| PSKOV_PREVIEW | |||
| <div class="itemMore"> | |||
| <a href="PSKOV_ITEM_URL">Continue reading</a> | |||
| </div> | |||
| </div> | |||
| ``` | |||
| * Содержимое `ru/blog/preview.template`: | |||
| ``` | |||
| <div class="contents"> | |||
| <h2 class="itemTitle"> | |||
| <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a> | |||
| </h2> | |||
| <p class="itemDate">PSKOV_ITEM_DATE</p> | |||
| PSKOV_PREVIEW | |||
| <div class="itemMore"> | |||
| <a href="PSKOV_ITEM_URL">Читать дальше</a> | |||
| </div> | |||
| </div> | |||
| ``` | |||
| У предпросмотров нет `<head>`, `<body>` и прочих полностраничных тэгов HTML. Предпросмотры являются секциями, вставляемыми в страницы с предпросмотрами. | |||
| Сам предпросмотр мы получаем из константы `PSKOV_PREVIEW`: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_PREVIEW` | Предоставляет содержимое файла Markdown, ограниченное `previewSize` символами (приблизительно) | | |||
| <a name="index"/> | |||
| ## 05. Изучите шаблоны страниц с предпросмотрами | |||
| * Содержимое `en/blog/index.template`: | |||
| ``` | |||
| - - - - Схлопнуто для краткости - - - - | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Serov</strong> | |||
| <a href="../../en/blog/index.html">Blog</a> | |||
| <a href="../../en/page/about.html">About me</a> | |||
| <a href="../../en/page/cv.html">CV</a> | |||
| <div id="lang"> | |||
| <a href="../../en/blog/PSKOV_INDEX_URL">EN</a> | |||
| <a href="../../ru/blog/PSKOV_INDEX_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| <h1>Blog</h1> | |||
| PSKOV_PREVIEWS | |||
| PSKOV_PAGINATION | |||
| <div id="footer"> | |||
| This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| ``` | |||
| * Содержимое `ru/blog/index.template`: | |||
| ``` | |||
| - - - - Схлопнуто для краткости - - - - | |||
| <body> | |||
| <div id="header"> | |||
| <strong>Серов</strong> | |||
| <a href="../../ru/blog/index.html">Блог</a> | |||
| <a href="../../ru/page/about.html">Обо мне</a> | |||
| <a href="../../ru/page/cv.html">Резюме</a> | |||
| <div id="lang"> | |||
| <a href="../../en/blog/PSKOV_INDEX_URL">EN</a> | |||
| <a href="../../ru/blog/PSKOV_INDEX_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center> | |||
| <h1>Блог</h1> | |||
| PSKOV_PREVIEWS | |||
| PSKOV_PAGINATION | |||
| <div id="footer"> | |||
| Этот пример сайта сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a>. | |||
| </div> | |||
| </center> | |||
| </body> | |||
| - - - - Схлопнуто для краткости - - - - | |||
| ``` | |||
| **Замечания**: | |||
| * начало и конец схлопнуты для краткости | |||
| * константа `PSKOV_INDEX_URL` используется для выбора языка | |||
| Новые константы **ПСКОВА**: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_INDEX_URL` | Предоставляет генерируемое имя файла страницы с предпросмотрами: `<previewsPageBaseName><id>.html` | | |||
| | `PSKOV_PREVIEWS` | Предоставляет набор предпросмотров | | |||
| | `PSKOV_PAGINATION` | Предоставляет секцию для перехода между страницами с предпросмотрами | | |||
| <a name="pagination"/> | |||
| ## 06. Изучите постраничные шаблоны | |||
| Постраничные шаблоны являются секциями HTML для перехода между страницами с предпросмотрами. | |||
| Существует три постраничных шаблона: | |||
| | Постраничный шаблон | Описание | | |||
| |---|---| | |||
| | Предыдущий | Посетитель может перейти лишь назад | | |||
| | Следующий | Посетитель может перейти лишь вперёд | | |||
| | Оба | Посетитель может перейти либо вперёд, либо назад | | |||
| Рассмотрим английские постраничные шаблоны: | |||
| * Содержимое `en/blog/pagination.prev.template`: | |||
| ``` | |||
| <p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p> | |||
| <p> | |||
| <a href="PSKOV_PREV_PAGE_URL">« Newer</a> | |||
| </p> | |||
| ``` | |||
| * Содержимое `en/blog/pagination.next.template`: | |||
| ``` | |||
| <p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p> | |||
| <p> | |||
| <a href="PSKOV_NEXT_PAGE_URL">Older »</a> | |||
| </p> | |||
| ``` | |||
| * Содержимое `en/blog/pagination.template`: | |||
| ``` | |||
| <p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p> | |||
| <p> | |||
| <a href="PSKOV_PREV_PAGE_URL">« Newer</a> | |||
| <a href="PSKOV_NEXT_PAGE_URL">Older »</a> | |||
| </p> | |||
| ``` | |||
| Русские версии выглядят схожим образом. Например, содержимое `ru/blog/pagination.template`: | |||
| ``` | |||
| <p>Страница PSKOV_PAGE_ID из PSKOV_PAGES_COUNT</p> | |||
| <p> | |||
| <a href="PSKOV_PREV_PAGE_URL">« Новее</a> | |||
| <a href="PSKOV_NEXT_PAGE_URL">Старее »</a> | |||
| </p> | |||
| ``` | |||
| Новые константы **ПСКОВА**: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_PAGE_ID` | Предоставляет порядковый номер страницы с предпросмотрами, начиная с `1` | | |||
| | `PSKOV_PAGES_COUNT` | Предоставляет количество сгенерированных страниц с предпросмотрами | | |||
| | `PSKOV_PREV_PAGE_URL` | Предоставляет имя файла предыдущей страницы с предпросмотрами | | |||
| | `PSKOV_NEXT_PAGE_URL` | Предоставляет имя файла следующей страницы с предпросмотрами | | |||
| <a name="md"/> | |||
| ## 07. Изучите файлы Markdown | |||
| Файлы Markdown являются заметками блога, они похожи на файлы Markdown обычных страниц. Вот как выглядит содержимое `en/blog/1885.md`: | |||
| ``` | |||
| Title: Bullocks | |||
| Date: 1885 | |||
| Slug: 1885.01.bullocks | |||
| ![Bullocks][bullocks] | |||
| I've been painting "Bullocks" sketch while I was staying in Odessa at Kuznetsov's in 1885. | |||
| [bullocks]: https://upload.wikimedia.org/wikipedia/commons/c/cb/Walentin_Aleksandrovich_Serov_Bullocks.jpg | |||
| ``` | |||
| Заметки блога сортируются по дате: новые заметки размещаются перед старыми. | |||
| | Ключ заголовка | Описание | | |||
| |---|---| | |||
| | `Date` | Предоставляет значение для константы `PSKOV_ITEM_DATE` при генерации HTML из Markdown | | |||
| <a name="gen"/> | |||
| ## 08. Запустите ЛФСД и сгенерируйте сайт | |||
| Запустите [ЛФСД][lfsa] с указанием директории, содержащей только что рассмотренные файлы: | |||
| ``` | |||
| $ /путь/до/lfsa_1.0.0.py /путь/до/директории/03.Blog | |||
| ``` | |||
| Сгенерируйте сайт: | |||
| * Перейдите на страницу [Инструмент][tool] | |||
| * Нажмите кнопку `Генерировать` | |||
| * Откройте сгенерированный файл `en/blog/index.html` или `ru/blog/index.html` из директории сайта | |||
| * Осуществите переход между страницами предпросмотра | |||
| <a name="summary"/> | |||
| ## 09. Итог | |||
| Вы успешно сгенерировали веб-сайт с "динамическими" страницами блога. [Проверьте результат][03-sample]. | |||
| Представлены константы **ПСКОВА**: | |||
| | Константа ПСКОВА | Описание | | |||
| |---|---| | |||
| | `PSKOV_ITEM_DATE` | Значение ключа `Date` файла Markdown | | |||
| | `PSKOV_PREVIEW` | Предоставляет содержимое файла Markdown, ограниченное `previewSize` символами (приблизительно) | | |||
| | `PSKOV_INDEX_URL` | Предоставляет генерируемое имя файла страницы с предпросмотрами: `<previewsPageBaseName><id>.html` | | |||
| | `PSKOV_PREVIEWS` | Предоставляет набор предпросмотров | | |||
| | `PSKOV_PAGINATION` | Предоставляет секцию для перехода между страницами с предпросмотрами | | |||
| | `PSKOV_PAGE_ID` | Предоставляет порядковый номер страницы с предпросмотрами, начиная с `1` | | |||
| | `PSKOV_PAGES_COUNT` | Предоставляет количество сгенерированных страниц с предпросмотрами | | |||
| | `PSKOV_PREV_PAGE_URL` | Предоставляет имя файла предыдущей страницы с предпросмотрами | | |||
| | `PSKOV_NEXT_PAGE_URL` | Предоставляет имя файла следующей страницы с предпросмотрами | | |||
| Представлены ключи настроек: | |||
| | Ключ | Описание | | |||
| |---|---| | |||
| | `preview` | Указывает на шаблон HTML, используемый для генерации предпросмотра HTML из первых `previewSize` (приблизительно) символов для каждого файла Markdown | | |||
| | `index` | Указывает на шаблон HTML, используемый для генерации страницы с предпросмотрами | | |||
| | `paginationPrev` | Указывает на шаблон HTML, используемый для генерации секции с переходом лишь на предыдущую страницу | | |||
| | `paginationNext` | Указывает на шаблон HTML, используемый для генерации секции с переходм лишь на следующую страницу | | |||
| | `paginationPrevNext` | Указывает на шаблон HTML, используемый для генерации секции с переходами по страницам | | |||
| | `previewSize` | Количество символов (приблизительное) из файла Markdown, используемое для генерации предпросмотра | | |||
| | `previewEnding` | Строка для добавления в конец каждого предпросмотра | | |||
| | `previewsPerPage` | Максимальное количество предпросмотров, умещающееся на странице с предпросмотрами | | |||
| | `previewsPageBaseName` | Базовое имя файла для страниц с предпросмотрами | | |||
| Представлены ключи заголовка: | |||
| | Ключ заголовка | Описание | | |||
| |---|---| | |||
| | `Date` | Предоставляет значение для константы `PSKOV_ITEM_DATE` при генерации HTML из Markdown | | |||
| Это был последний документ, призванный научить вас уверенно владеть генератором статических сайтов **ПСКОВ**. Если вам нравится наш труд, присоединяйтесь к нам в [VK][vk], [Twitter][tw] или [Facebook][fb]. | |||
| А теперь используйте **ПСКОВ** для генерация своего собственного веб-сайта! | |||
| </div><div class="contents"> | |||
| | < Назад | Начало | Далее > | | |||
| |---|---|---| | |||
| | [04. Язык][prev] | [Обучение][index] | Отсутствует | | |||
| [index]: education.html | |||
| [prev]: education.04.lang.html | |||
| [03-files]: https://github.com/OGStudio/site-pskov-sample/tree/master/03.Blog | |||
| [03-sample]: http://opengamestudio.org/pskov/sample/03.Blog/ru/blog/index.html | |||
| [lfsa]: http://opengamestudio.org/lfsa/ru | |||
| [tool]: http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html | |||
| [vk]: https://vk.com/opengamestudo | |||
| [tw]: https://twitter.com/OpenGameStudio | |||
| [fb]: https://www.facebook.com/groups/162611230470183 | |||
+ 241
- 0
pskov/ru/education.html
View File
| @@ -0,0 +1,241 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| #header | |||
| { | |||
| background: #856d51; | |||
| padding: 0.7em; | |||
| text-align: left; | |||
| } | |||
| #header a | |||
| { | |||
| color: white; | |||
| text-decoration: none; | |||
| padding: 0.5em 1em 0.5em 1em; | |||
| } | |||
| #title | |||
| { | |||
| color: #433729; | |||
| } | |||
| html | |||
| { | |||
| font-family: sans-serif; | |||
| } | |||
| body | |||
| { | |||
| line-height: 1.5em; | |||
| } | |||
| body | |||
| { | |||
| background: #FAFAFA; | |||
| } | |||
| table | |||
| { | |||
| border-collapse: collapse; | |||
| width: 100%; | |||
| } | |||
| table, th, td | |||
| { | |||
| border: 1px solid #aaa; | |||
| padding: 0.5em; | |||
| margin-top: 0.5em; | |||
| margin-bottom: 0.5em; | |||
| } | |||
| code, pre | |||
| { | |||
| font-family: monospace, serif; | |||
| font-size: 1em; | |||
| color: #7f0a0c; | |||
| background: #f5f5f5; | |||
| white-space: pre-wrap; | |||
| } | |||
| .contents | |||
| { | |||
| background: #FFFFFF; | |||
| width: 720px; | |||
| padding: 1em; | |||
| margin-top: 2em; | |||
| margin-bottom: 2em; | |||
| border: 1px solid #E0E0E0; | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong id="title">ПСКОВ</strong> | |||
| <a href="pskov_1.0.0+ru.html">Инструмент</a> | |||
| <a href="education.html">Обучение</a> | |||
| <div id="lang"> | |||
| <a href="../en/education.html">EN</a> | |||
| <a href="../ru/education.html">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| Обучение | |||
| </h1></center> | |||
| <center><div class="contents"> | |||
| <p>Представленные здесь документы научат вас уверенно владеть генератором статических сайтов <strong>ПСКОВ</strong>. Советуем читать документы по порядку.</p> | |||
| <h2 id="01why"><a href="education.01.why.html">01. Почему</a></h2> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Свойство</th> | |||
| <th>Подробности</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Описание</td> | |||
| <td>Узнайте причины создания <strong>ПСКОВА</strong></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Ожидаемое время завершения</td> | |||
| <td>5 минут</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <h2 id="02deps"><a href="education.02.deps.html">02. Зависимости</a></h2> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Свойство</th> | |||
| <th>Подробности</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Описание</td> | |||
| <td>Установите зависимости, чтобы начать использовать <strong>ПСКОВ</strong></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Ожидаемое время завершения</td> | |||
| <td>5 минут</td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <h2 id="03site"><a href="education.03.site.html">03. Сайт</a></h2> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Свойство</th> | |||
| <th>Подробности</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Описание</td> | |||
| <td>Научитесь создавать простой статический сайт с двумя страницами</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Ожидаемое время завершения</td> | |||
| <td>10 минут</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Демонстрация</td> | |||
| <td><a href="http://opengamestudio.org/pskov/sample/01.TwoPages/about.html">ДвеСтраницы</a></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Представленные константы ПСКОВА</td> | |||
| <td><ol> <li><code>PSKOV_ITEM_TITLE</code></li> <li><code>PSKOV_ITEM_CONTENTS</code></li> </ol></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Представленные ключи настроек</td> | |||
| <td><ol> <li><code>input</code></li> <li><code>item</code></li> </ol></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Представленные ключи заголовка</td> | |||
| <td><ol> <li><code>Title</code></li> <li><code>Slug</code></li> </ol></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <h2 id="04lang"><a href="education.04.lang.html">04. Язык</a></h2> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Свойство</th> | |||
| <th>Подробности</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Описание</td> | |||
| <td>Научитесь добавлять выбор языка</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Ожидаемое время завершения</td> | |||
| <td>10 минут</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Демонстрация</td> | |||
| <td><a href="http://opengamestudio.org/pskov/sample/02.Language/ru/about.html">Язык</a></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Представленные константы ПСКОВА</td> | |||
| <td><ol> <li><code>PSKOV_ITEM_URL</code></li> </ol></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <h2 id="05blog"><a href="education.05.blog.html">05. Блог</a></h2> | |||
| <table> | |||
| <thead> | |||
| <tr> | |||
| <th>Свойство</th> | |||
| <th>Подробности</th> | |||
| </tr> | |||
| </thead> | |||
| <tbody> | |||
| <tr> | |||
| <td>Описание</td> | |||
| <td>Научитесь создавать "динамические" страницы для блога</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Ожидаемое время завершения</td> | |||
| <td>20 минут</td> | |||
| </tr> | |||
| <tr> | |||
| <td>Демонстрация</td> | |||
| <td><a href="http://opengamestudio.org/pskov/sample/03.Blog/ru/blog/index.html">Блог</a></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Представленные константы ПСКОВА</td> | |||
| <td><ol> <li><code>PSKOV_ITEM_DATE</code></li> <li><code>PSKOV_PREVIEW</code></li> <li><code>PSKOV_INDEX_URL</code></li> <li><code>PSKOV_PREVIEWS</code></li> <li><code>PSKOV_PAGINATION</code></li> <li><code>PSKOV_PAGE_ID</code></li> <li><code>PSKOV_PAGES_COUNT</code></li> <li><code>PSKOV_PREV_PAGE_URL</code></li> <li><code>PSKOV_NEXT_PAGE_URL</code></li> </ol></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Представленные ключи настроек</td> | |||
| <td><ol> <li><code>preview</code></li> <li><code>index</code></li> <li><code>paginationPrev</code></li> <li><code>paginationNext</code></li> <li><code>paginationPrevNext</code></li> <li><code>previewSize</code></li> <li><code>previewEnding</code></li> <li><code>previewsPerPage</code></li> <li><code>previewsPageBaseName</code></li> </ol></td> | |||
| </tr> | |||
| <tr> | |||
| <td>Представленные ключи заголовка</td> | |||
| <td><ol> <li><code>Date</code></li> </ol></td> | |||
| </tr> | |||
| </tbody> | |||
| </table> | |||
| <p>Если вам нравится наш труд, присоединяйтесь к нам в <a href="https://vk.com/opengamestudo">VK</a>, <a href="https://twitter.com/OpenGameStudio">Twitter</a> или <a href="https://www.facebook.com/groups/162611230470183">Facebook</a>.</p> | |||
| </div></center> | |||
| <div id="footer"> | |||
| Сайт сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a> | |||
| из <a href="http://github.com/ogstudio/site-pskov">этого исходного кода</a>. | |||
| Сайт расположен на <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
| </html> | |||
+ 68
- 0
pskov/ru/education.md
View File
| @@ -0,0 +1,68 @@ | |||
| Title: Обучение | |||
| Date: 2019-06-18 00:00 | |||
| Category: Page | |||
| Slug: education | |||
| Lang: ru | |||
| Представленные здесь документы научат вас уверенно владеть генератором статических сайтов **ПСКОВ**. Советуем читать документы по порядку. | |||
| ## [01. Почему][why] | |||
| | Свойство | Подробности | | |||
| |---|---| | |||
| | Описание | Узнайте причины создания **ПСКОВА** | | |||
| | Ожидаемое время завершения | 5 минут | | |||
| ## [02. Зависимости][deps] | |||
| | Свойство | Подробности | | |||
| |---|---| | |||
| | Описание | Установите зависимости, чтобы начать использовать **ПСКОВ** | | |||
| | Ожидаемое время завершения | 5 минут | | |||
| ## [03. Сайт][site] | |||
| | Свойство | Подробности | | |||
| |---|---| | |||
| | Описание | Научитесь создавать простой статический сайт с двумя страницами | | |||
| | Ожидаемое время завершения | 10 минут | | |||
| | Демонстрация | [ДвеСтраницы][01-sample] | | |||
| | Представленные константы ПСКОВА | <ol> <li>`PSKOV_ITEM_TITLE`</li> <li>`PSKOV_ITEM_CONTENTS`</li> </ol> | | |||
| | Представленные ключи настроек | <ol> <li>`input`</li> <li>`item`</li> </ol> | | |||
| | Представленные ключи заголовка | <ol> <li>`Title`</li> <li>`Slug`</li> </ol> | | |||
| ## [04. Язык][lang] | |||
| | Свойство | Подробности | | |||
| |---|---| | |||
| | Описание | Научитесь добавлять выбор языка | | |||
| | Ожидаемое время завершения | 10 минут | | |||
| | Демонстрация | [Язык][02-sample] | | |||
| | Представленные константы ПСКОВА | <ol> <li>`PSKOV_ITEM_URL`</li> </ol> | | |||
| ## [05. Блог][blog] | |||
| | Свойство | Подробности | | |||
| |---|---| | |||
| | Описание | Научитесь создавать "динамические" страницы для блога | | |||
| | Ожидаемое время завершения | 20 минут | | |||
| | Демонстрация | [Блог][03-sample] | | |||
| | Представленные константы ПСКОВА | <ol> <li>`PSKOV_ITEM_DATE`</li> <li>`PSKOV_PREVIEW`</li> <li>`PSKOV_INDEX_URL`</li> <li>`PSKOV_PREVIEWS`</li> <li>`PSKOV_PAGINATION`</li> <li>`PSKOV_PAGE_ID`</li> <li>`PSKOV_PAGES_COUNT`</li> <li>`PSKOV_PREV_PAGE_URL`</li> <li>`PSKOV_NEXT_PAGE_URL`</li> </ol> | | |||
| | Представленные ключи настроек | <ol> <li>`preview`</li> <li>`index`</li> <li>`paginationPrev`</li> <li>`paginationNext`</li> <li>`paginationPrevNext`</li> <li>`previewSize`</li> <li>`previewEnding`</li> <li>`previewsPerPage`</li> <li>`previewsPageBaseName`</li> </ol> | | |||
| | Представленные ключи заголовка | <ol> <li>`Date`</li> </ol> | | |||
| Если вам нравится наш труд, присоединяйтесь к нам в [VK][vk], [Twitter][tw] или [Facebook][fb]. | |||
| [why]: education.01.why.html | |||
| [deps]: education.02.deps.html | |||
| [site]: education.03.site.html | |||
| [lang]: education.04.lang.html | |||
| [blog]: education.05.blog.html | |||
| [01-sample]: http://opengamestudio.org/pskov/sample/01.TwoPages/about.html | |||
| [02-sample]: http://opengamestudio.org/pskov/sample/02.Language/ru/about.html | |||
| [03-sample]: http://opengamestudio.org/pskov/sample/03.Blog/ru/blog/index.html | |||
| [vk]: https://vk.com/opengamestudo | |||
| [tw]: https://twitter.com/OpenGameStudio | |||
| [fb]: https://www.facebook.com/groups/162611230470183 | |||
+ 105
- 0
pskov/ru/item.template
View File
| @@ -0,0 +1,105 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <meta charset="utf-8"> | |||
| <head> | |||
| <style> | |||
| #header | |||
| { | |||
| background: #856d51; | |||
| padding: 0.7em; | |||
| text-align: left; | |||
| } | |||
| #header a | |||
| { | |||
| color: white; | |||
| text-decoration: none; | |||
| padding: 0.5em 1em 0.5em 1em; | |||
| } | |||
| #title | |||
| { | |||
| color: #433729; | |||
| } | |||
| html | |||
| { | |||
| font-family: sans-serif; | |||
| } | |||
| body | |||
| { | |||
| line-height: 1.5em; | |||
| } | |||
| body | |||
| { | |||
| background: #FAFAFA; | |||
| } | |||
| table | |||
| { | |||
| border-collapse: collapse; | |||
| width: 100%; | |||
| } | |||
| table, th, td | |||
| { | |||
| border: 1px solid #aaa; | |||
| padding: 0.5em; | |||
| margin-top: 0.5em; | |||
| margin-bottom: 0.5em; | |||
| } | |||
| code, pre | |||
| { | |||
| font-family: monospace, serif; | |||
| font-size: 1em; | |||
| color: #7f0a0c; | |||
| background: #f5f5f5; | |||
| white-space: pre-wrap; | |||
| } | |||
| .contents | |||
| { | |||
| background: #FFFFFF; | |||
| width: 720px; | |||
| padding: 1em; | |||
| margin-top: 2em; | |||
| margin-bottom: 2em; | |||
| border: 1px solid #E0E0E0; | |||
| text-align: left; | |||
| color: #444; | |||
| } | |||
| #footer | |||
| { | |||
| text-align: center; | |||
| } | |||
| #lang | |||
| { | |||
| float: right; | |||
| } | |||
| </style> | |||
| <title> | |||
| PSKOV | |||
| </title> | |||
| </head> | |||
| <body> | |||
| <div id="header"> | |||
| <strong id="title">ПСКОВ</strong> | |||
| <a href="pskov_1.0.0+ru.html">Инструмент</a> | |||
| <a href="education.html">Обучение</a> | |||
| <div id="lang"> | |||
| <a href="../en/PSKOV_ITEM_URL">EN</a> | |||
| <a href="../ru/PSKOV_ITEM_URL">RU</a> | |||
| </div> | |||
| </div> | |||
| <center><h1> | |||
| PSKOV_ITEM_TITLE | |||
| </h1></center> | |||
| <center><div class="contents"> | |||
| PSKOV_ITEM_CONTENTS | |||
| </div></center> | |||
| <div id="footer"> | |||
| Сайт сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a> | |||
| из <a href="http://github.com/ogstudio/site-pskov">этого исходного кода</a>. | |||
| Сайт расположен на <a href="https://pages.github.com">GitHub Pages</a>. | |||
| </div> | |||
| <script type="text/javascript"> | |||
| </script> | |||
| </body> | |||
| </html> | |||