Add LFSA and en PSKOV
This commit is contained in:
@@ -20,11 +20,6 @@
|
||||
{
|
||||
color: #433729;
|
||||
}
|
||||
iframe
|
||||
{
|
||||
width: 720px;
|
||||
height: 720px;
|
||||
}
|
||||
html
|
||||
{
|
||||
font-family: sans-serif;
|
||||
@@ -71,13 +66,13 @@
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV - Opensource Game Studio static site generator
|
||||
PSKOV-201905
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="index.html">Tool</a>
|
||||
<a href="tool.pskov.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
|
||||
65
pskov/en/education.01.why.md
Normal file
65
pskov/en/education.01.why.md
Normal file
@@ -0,0 +1,65 @@
|
||||
Title: Education: 01. Why
|
||||
Date: 2019-05-14 00:00
|
||||
Category: Page
|
||||
Slug: education.01.why
|
||||
Lang: en
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| Not available | [Education][index] | [02. Dependencies][next] |
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
In this document we briefly explain why **PSKOV** was created.
|
||||
|
||||
Estimated completion time: 5 minutes.
|
||||
|
||||
**Table of contents**
|
||||
|
||||
* [01. Why](#why)
|
||||
* [02. Features](#features)
|
||||
|
||||
<a name="why"/>
|
||||
|
||||
## 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.
|
||||
|
||||
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 |
|
||||
| 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 |
|
||||
|
||||
<a name="features"/>
|
||||
|
||||
## 02. Features
|
||||
|
||||
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 |
|
||||
| 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\* |
|
||||
|
||||
\* 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
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| Not available | [Education][index] | [02. Dependencies][next] |
|
||||
|
||||
[index]: education.html
|
||||
[next]: education.02.deps.html
|
||||
|
||||
[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
|
||||
@@ -20,11 +20,6 @@
|
||||
{
|
||||
color: #433729;
|
||||
}
|
||||
iframe
|
||||
{
|
||||
width: 720px;
|
||||
height: 720px;
|
||||
}
|
||||
html
|
||||
{
|
||||
font-family: sans-serif;
|
||||
@@ -71,13 +66,13 @@
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV - Opensource Game Studio static site generator
|
||||
PSKOV-201905
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="index.html">Tool</a>
|
||||
<a href="tool.pskov.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
@@ -101,23 +96,22 @@ Education: 02. Dependencies
|
||||
</tbody>
|
||||
</table>
|
||||
<p></div><div class="contents"></p>
|
||||
<p>In this document we teach how to install <strong>PSKOV</strong> dependencies.</p>
|
||||
<p>Estimated completion time: ?? minutes.</p>
|
||||
<p>In this document we describe <strong>PSKOV</strong> dependencies and how to get them.</p>
|
||||
<p>Estimated completion time: 5 minutes.</p>
|
||||
<p><strong>Table of contents</strong></p>
|
||||
<ul>
|
||||
<li><a href="#deps">01. Dependencies</a></li>
|
||||
<li><a href="#lfsa">02. Install LFSA</a></li>
|
||||
<li><a href="#showdown">03. Showdown</a></li>
|
||||
<li><a href="#details">02. Details</a></li>
|
||||
</ul>
|
||||
<p><a name="deps"/></p>
|
||||
<h2 id="01dependencies">01. Dependencies</h2>
|
||||
<p>We designed <strong>PSKOV</strong> to run inside web browsers. Hence, here is a list of <strong>PSKOV dependencies</strong>:</p>
|
||||
<p>We designed <strong>PSKOV</strong> to run inside web browsers. Here is what you need to run <strong>PSKOV</strong>:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>№</th>
|
||||
<th>Dependency</th>
|
||||
<th>Note</th>
|
||||
<th>PSKOV dependency</th>
|
||||
<th>Notes</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@@ -128,18 +122,27 @@ Education: 02. Dependencies
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>Local file system access (LFSA)</td>
|
||||
<td><a href="http://opengamestudio.org/lfsa">LFSA</a> gives <strong>PSKOV</strong> access to your local file system</td>
|
||||
<td>Local file system access</td>
|
||||
<td><a href="http://opengamestudio.org/lfsa">LFSA</a> gives <strong>PSKOV</strong> access to your local file system. Install LFSA to be able to use <strong>PSKOV</strong>.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>Since <strong>PSKOV</strong> is a client side JavaScript application, it has no direct access to your local file system to generate files. That's why we have also created <a href="http://opengamestudio.org/lfsa">LFSA</a>, a tiny Python server to provide read/write access to your local file system at 8000 port. LFSA is under 200 lines of code, feel free to <a href="TODO-LFSA-SRC">inspect it</a> to make sure we don't steal your data.</p>
|
||||
<p><a name="lfsa"/></p>
|
||||
<h2 id="02installlfsa">02. Install LFSA</h2>
|
||||
<p>TODO </p>
|
||||
<p><a name="showdown"/></p>
|
||||
<h2 id="03showdown">03. Showdown</h2>
|
||||
<p>Tell Showdown.JS is used to convert Markdown to HTML, so users should refer to Showdown.JS for rules.</p>
|
||||
<p><strong>Note</strong>: <a href="http://opengamestudio.org/lfsa">install LFSA</a> to be able to use <strong>PSKOV</strong>.</p>
|
||||
<p><a name="details"/></p>
|
||||
<h2 id="02details">02. Details</h2>
|
||||
<p><strong>PSKOV</strong>:</p>
|
||||
<ul>
|
||||
<li>is a client side JavaScript application</li>
|
||||
<li>has no direct access to local file system</li>
|
||||
<li>uses <a href="http://opengamestudio.org/lfsa">LFSA</a> to access local file system</li>
|
||||
<li>uses <a href="https://github.com/showdownjs/showdown">Showdown</a> to convert Markdown to HTML</li>
|
||||
</ul>
|
||||
<p><strong>LFSA</strong>:</p>
|
||||
<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>
|
||||
</ul>
|
||||
<p></div><div class="contents"></p>
|
||||
<table>
|
||||
<thead>
|
||||
|
||||
64
pskov/en/education.02.deps.md
Normal file
64
pskov/en/education.02.deps.md
Normal file
@@ -0,0 +1,64 @@
|
||||
Title: Education: 02. Dependencies
|
||||
Date: 2019-05-14 00:00
|
||||
Category: Page
|
||||
Slug: education.02.deps
|
||||
Lang: en
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| [01. Why][prev] | [Education][index] | [03. Site][next] |
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
In this document we describe **PSKOV** dependencies and how to get them.
|
||||
|
||||
Estimated completion time: 5 minutes.
|
||||
|
||||
**Table of contents**
|
||||
|
||||
* [01. Dependencies](#deps)
|
||||
* [02. Details](#details)
|
||||
|
||||
<a name="deps"/>
|
||||
|
||||
## 01. Dependencies
|
||||
|
||||
We designed **PSKOV** to run inside web browsers. Here is what you need to run **PSKOV**:
|
||||
|
||||
| № | PSKOV dependency | Notes |
|
||||
|---|---|---|
|
||||
| 1 | Web browser of 2010 or newer | **PSKOV** needs ECMAScript 5 (2009), any modern web browser should work |
|
||||
| 2 | Local file system access | [LFSA][lfsa] gives **PSKOV** access to your local file system. Install LFSA to be able to use **PSKOV**. |
|
||||
|
||||
**Note**: [install LFSA][lfsa] to be able to use **PSKOV**.
|
||||
|
||||
<a name="details"/>
|
||||
|
||||
## 02. Details
|
||||
|
||||
**PSKOV**:
|
||||
|
||||
* is a client side JavaScript application
|
||||
* has no direct access to local file system
|
||||
* uses [LFSA][lfsa] to access local file system
|
||||
* uses [Showdown][showdown] to convert Markdown to HTML
|
||||
|
||||
**LFSA**:
|
||||
|
||||
* is a tiny Python server to provide read/write access to local file system
|
||||
* runs at 8000 port
|
||||
* is under 200 lines of code, feel free to [inspect it][lfsa-src]
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| [01. Why][prev] | [Education][index] | [03. Site][next] |
|
||||
|
||||
[index]: education.html
|
||||
[prev]: education.01.why.html
|
||||
[next]: education.03.site.html
|
||||
|
||||
[lfsa]: http://opengamestudio.org/lfsa
|
||||
[lfsa-src]: https://bitbucket.org/ogstudio/lfsa/src/default/lfsa-201905.py
|
||||
[showdown]: https://github.com/showdownjs/showdown
|
||||
@@ -20,11 +20,6 @@
|
||||
{
|
||||
color: #433729;
|
||||
}
|
||||
iframe
|
||||
{
|
||||
width: 720px;
|
||||
height: 720px;
|
||||
}
|
||||
html
|
||||
{
|
||||
font-family: sans-serif;
|
||||
@@ -71,13 +66,13 @@
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV - Opensource Game Studio static site generator
|
||||
PSKOV-201905
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="index.html">Tool</a>
|
||||
<a href="tool.pskov.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
@@ -102,15 +97,16 @@ Education: 03. Site
|
||||
</table>
|
||||
<p></div><div class="contents"></p>
|
||||
<p>In this document we create a simple static web site with two pages.</p>
|
||||
<p>Estimated completion time: ? minutes.</p>
|
||||
<p>Estimated completion time: 10 minutes.</p>
|
||||
<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="#item">03. Investigate <code>item.template</code> file</a></li>
|
||||
<li><a href="#md">04. Investigate <code>index.md</code> and <code>cv.md</code> files</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>
|
||||
<li><a href="#gen">06. Generate the site</a></li>
|
||||
<li><a href="#summary">07. Summary</a></li>
|
||||
</ul>
|
||||
<p><a name="inspiration"/></p>
|
||||
<h2 id="01inspiration">01. Inspiration</h2>
|
||||
@@ -124,7 +120,7 @@ Education: 03. Site
|
||||
<ul>
|
||||
<li>cfg</li>
|
||||
<li>item.template</li>
|
||||
<li>index.md</li>
|
||||
<li>about.md</li>
|
||||
<li>cv.md</li>
|
||||
</ul>
|
||||
<p>Let's look at their contents closer.</p>
|
||||
@@ -149,7 +145,7 @@ item = item.template
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>item</code></td>
|
||||
<td>Points to an HTML template file that will be used to generate HTML files out of Markdown ones</td>
|
||||
<td>Points to an HTML template file that is used to generate HTML files out of Markdown ones</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -162,14 +158,14 @@ item = item.template
|
||||
<meta charset="utf-8">
|
||||
<head>
|
||||
<style>
|
||||
- - - - Style was collapsed for brevity - - - -
|
||||
- - - - Collapsed for brevity - - - -
|
||||
</style>
|
||||
<title>Serov</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong>Serov</strong>
|
||||
<a href="index.html">About me</a>
|
||||
<a href="about.html">About me</a>
|
||||
<a href="cv.html">CV</a>
|
||||
</div>
|
||||
<center>
|
||||
@@ -177,12 +173,15 @@ item = item.template
|
||||
<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>Note</strong>: style was collapsed for brevity.</p>
|
||||
<p>As you can see, <code>item.template</code> is an average HTML file with two constants specified:</p>
|
||||
<p>As you can see, <code>item.template</code> is an average HTML file with two <strong>PSKOV</strong> constants specified:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
@@ -207,16 +206,16 @@ PSKOV_ITEM_CONTENTS
|
||||
<li>page's header section is described below</li>
|
||||
</ul>
|
||||
<p><a name="md"/></p>
|
||||
<h2 id="04investigateindexmdandcvmdfiles">04. Investigate <code>index.md</code> and <code>cv.md</code> files</h2>
|
||||
<p><code>index.md</code> file has the following contents:</p>
|
||||
<h2 id="04investigateaboutmdandcvmdfiles">04. Investigate <code>about.md</code> and <code>cv.md</code> files</h2>
|
||||
<p><code>about.md</code> file has the following contents:</p>
|
||||
<pre><code> Title: About me
|
||||
Slug: index
|
||||
Slug: about
|
||||
|
||||
Hi, my name is Valentin Serov. Here's my self-portrait:
|
||||
|
||||
![Valentin Serov self-portrait][serov-portrait]
|
||||
|
||||
- - - - Contents were collapsed for brevity - - - -
|
||||
- - - - Collapsed for brevity - - - -
|
||||
|
||||
Have a look at my [CV][cv] now.
|
||||
|
||||
@@ -228,7 +227,7 @@ PSKOV_ITEM_CONTENTS
|
||||
[pskov]: http://opengamestudio.org/pskov
|
||||
[cv]: cv.html
|
||||
</code></pre>
|
||||
<p><code>index.md</code> starts with a so-called header section:</p>
|
||||
<p><code>about.md</code> starts with a so-called header section:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
@@ -243,11 +242,11 @@ PSKOV_ITEM_CONTENTS
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>Slug:</code></td>
|
||||
<td>Tells <strong>PSKOV</strong> that this particular Markdown file should be saved under <code><slug>.html</code> filename</td>
|
||||
<td>Tells <strong>PSKOV</strong> that particular Markdown file should be saved under <code><slug>.html</code> filename</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>The rest of <code>index.md</code> contents is what any Markdown file looks like.</p>
|
||||
<p>The rest of <code>about.md</code> contents is what any Markdown file looks like.</p>
|
||||
<p><strong>Note</strong>: <code>cv</code> page is referenced as <code>cv.html</code>, not <code>cv.md</code></p>
|
||||
<p><code>cv.md</code> file has the following contents:</p>
|
||||
<pre><code> Title: Curriculum vitae
|
||||
@@ -267,8 +266,8 @@ PSKOV_ITEM_CONTENTS
|
||||
<p>As you can see, there's nothing new in <code>cv.md</code> except for a Markdown table.</p>
|
||||
<p><a name="lfsa"/></p>
|
||||
<h2 id="05launchlfsa">05. Launch LFSA</h2>
|
||||
<p>Launch LFSA so that it points to directory with the files we just observed:</p>
|
||||
<pre><code>$ /path/to/local-file-system-access.py /path/to/dir/01.TwoPages
|
||||
<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
|
||||
</code></pre>
|
||||
<p>You should see output similar to this:</p>
|
||||
<pre><code>DIR: '/Users/kornerr/p/site-pskov-sample/01.TwoPages'
|
||||
@@ -283,10 +282,69 @@ PORT: '8000'
|
||||
<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>Press <code>Generate</code> button to generate HTML files right where Markdown ones reside</li>
|
||||
<li>Open generated <code>index.html</code> from the site's directory</li>
|
||||
<li>Open generated <code>about.html</code> from the site's directory</li>
|
||||
<li>You should see your web site running locally</li>
|
||||
</ul>
|
||||
<p>Take time to observe your new shiny personal web site consisting of two pages.</p>
|
||||
<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>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>PSKOV constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>PSKOV_ITEM_TITLE</code></td>
|
||||
<td>Provides title from <code>Title:</code> part of page's header section</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_ITEM_CONTENTS</code></td>
|
||||
<td>Provides HTML contents generated out of Markdown contents</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>Introduced configuration keys include:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Key</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>input</code></td>
|
||||
<td>Points to a directory where <code>item</code>'s file is located</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>item</code></td>
|
||||
<td>Points to an HTML template file that is used to generate HTML files out of Markdown ones</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>Introduced header constants include:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Header constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<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>Tells <strong>PSKOV</strong> that particular Markdown file should be saved under <code><slug>.html</code> filename</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p></div><div class="contents"></p>
|
||||
<table>
|
||||
<thead>
|
||||
|
||||
247
pskov/en/education.03.site.md
Normal file
247
pskov/en/education.03.site.md
Normal file
@@ -0,0 +1,247 @@
|
||||
Title: Education: 03. Site
|
||||
Date: 2019-05-14 00:00
|
||||
Category: Page
|
||||
Slug: education.03.site
|
||||
Lang: en
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| [02. Dependencies][prev] | [Education][index] | [04. Language][next] |
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
In this document we create a simple static web site with two pages.
|
||||
|
||||
Estimated completion time: 10 minutes.
|
||||
|
||||
**Table of contents**
|
||||
|
||||
* [01. Inspiration](#inspiration)
|
||||
* [02. Investigate `cfg` file](#cfg)
|
||||
* [03. Investigate `item.template` file](#item)
|
||||
* [04. Investigate `about.md` and `cv.md` files](#md)
|
||||
* [05. Launch LFSA](#lfsa)
|
||||
* [06. Generate the site](#gen)
|
||||
* [07. Summary](#summary)
|
||||
|
||||
<a name="inspiration"/>
|
||||
|
||||
## 01. Inspiration
|
||||
|
||||
Suppose you are a great Russian painter named Valentin Serov. Everytime anyone wants to know about you they refer to [Wikipedia][serov]. You wake up earlier today with a distinct desire to have your very own personal web site.
|
||||
|
||||
You set on to create the following pages:
|
||||
|
||||
* About me
|
||||
* Curriculum vitae (CV)
|
||||
|
||||
Some time later you have the following files in your [site directory][01-files]:
|
||||
|
||||
* cfg
|
||||
* item.template
|
||||
* about.md
|
||||
* cv.md
|
||||
|
||||
Let's look at their contents closer.
|
||||
|
||||
<a name="cfg"/>
|
||||
|
||||
## 02. Investigate `cfg` file
|
||||
|
||||
`cfg` file has the following contents:
|
||||
|
||||
```
|
||||
input = .
|
||||
item = item.template
|
||||
```
|
||||
|
||||
`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.
|
||||
|
||||
<a name="item"/>
|
||||
|
||||
## 03. Investigate `item.template` file
|
||||
|
||||
`item.template` file has the following contents:
|
||||
|
||||
```
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<head>
|
||||
<style>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
</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>
|
||||
```
|
||||
|
||||
**Note**: style was collapsed for brevity.
|
||||
|
||||
As you can see, `item.template` is an average HTML file with two **PSKOV** constants specified:
|
||||
|
||||
| PSKOV constant | Description |
|
||||
|---|---|
|
||||
| `PSKOV_ITEM_TITLE` | Provides title from `Title:` part of page's header section |
|
||||
| `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
|
||||
|
||||
<a name="md"/>
|
||||
|
||||
## 04. Investigate `about.md` and `cv.md` files
|
||||
|
||||
`about.md` file has the following contents:
|
||||
|
||||
```
|
||||
Title: About me
|
||||
Slug: about
|
||||
|
||||
Hi, my name is Valentin Serov. Here's my self-portrait:
|
||||
|
||||
![Valentin Serov self-portrait][serov-portrait]
|
||||
|
||||
- - - - Collapsed for brevity - - - -
|
||||
|
||||
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` starts with a so-called header section:
|
||||
|
||||
| Header constant | 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 |
|
||||
|
||||
The rest of `about.md` contents is what any Markdown file looks like.
|
||||
|
||||
**Note**: `cv` page is referenced as `cv.html`, not `cv.md`
|
||||
|
||||
`cv.md` file has the following contents:
|
||||
|
||||
```
|
||||
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) |
|
||||
```
|
||||
|
||||
As you can see, there's nothing new in `cv.md` except for a Markdown table.
|
||||
|
||||
<a name="lfsa"/>
|
||||
|
||||
## 05. Launch LFSA
|
||||
|
||||
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
|
||||
```
|
||||
|
||||
You should see output similar to this:
|
||||
|
||||
```
|
||||
DIR: '/Users/kornerr/p/site-pskov-sample/01.TwoPages'
|
||||
PORT: '8000'
|
||||
```
|
||||
|
||||
<a name="gen"/>
|
||||
|
||||
## 06. Generate the site
|
||||
|
||||
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`
|
||||
* 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
|
||||
|
||||
<a name="summary"/>
|
||||
|
||||
## 07. Summary
|
||||
|
||||
You have successfully generated a web site with two pages. [Check out the result][01-sample].
|
||||
|
||||
Introduced PSKOV constants include:
|
||||
|
||||
| PSKOV constant | Description |
|
||||
|---|---|
|
||||
| `PSKOV_ITEM_TITLE` | Provides title from `Title:` part of page's header section |
|
||||
| `PSKOV_ITEM_CONTENTS` | Provides HTML contents generated out of Markdown contents |
|
||||
|
||||
Introduced configuration keys include:
|
||||
|
||||
| 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 |
|
||||
|
||||
Introduced header constants include:
|
||||
|
||||
| Header constant | 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 |
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| [02. Dependencies][prev] | [Education][index] | [04. Language][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://en.wikipedia.org/wiki/INI_file
|
||||
[serov]: https://en.wikipedia.org/wiki/Valentin_Serov
|
||||
[lfsa]: http://opengamestudio.org/lfsa
|
||||
[tool]: http://opengamestudio.org/pskov
|
||||
@@ -20,11 +20,6 @@
|
||||
{
|
||||
color: #433729;
|
||||
}
|
||||
iframe
|
||||
{
|
||||
width: 720px;
|
||||
height: 720px;
|
||||
}
|
||||
html
|
||||
{
|
||||
font-family: sans-serif;
|
||||
@@ -71,13 +66,13 @@
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV - Opensource Game Studio static site generator
|
||||
PSKOV-201905
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="index.html">Tool</a>
|
||||
<a href="tool.pskov.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
@@ -102,7 +97,7 @@ Education: 04. Language
|
||||
</table>
|
||||
<p></div><div class="contents"></p>
|
||||
<p>In this document we add language selection.</p>
|
||||
<p>Estimated completion time: ? minutes.</p>
|
||||
<p>Estimated completion time: 10 minutes.</p>
|
||||
<p><strong>Table of contents</strong></p>
|
||||
<ul>
|
||||
<li><a href="#localization">01. Localization</a></li>
|
||||
@@ -110,6 +105,7 @@ Education: 04. Language
|
||||
<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>
|
||||
<li><a href="#summary">06. Summary</a></li>
|
||||
</ul>
|
||||
<p><a name="localization"/></p>
|
||||
<h2 id="01localization">01. Localization</h2>
|
||||
@@ -118,10 +114,10 @@ Education: 04. Language
|
||||
<ul>
|
||||
<li><code>cfg</code></li>
|
||||
<li><code>en/item.template</code></li>
|
||||
<li><code>en/index.md</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/index.md</code></li>
|
||||
<li><code>ru/about.md</code></li>
|
||||
<li><code>ru/cv.md</code></li>
|
||||
</ul>
|
||||
<p>Let's look at the contents of these files closer.</p>
|
||||
@@ -143,7 +139,7 @@ item = item.template
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong>Serov</strong>
|
||||
<a href="index.html">About me</a>
|
||||
<a href="about.html">About me</a>
|
||||
<a href="cv.html">CV</a>
|
||||
<div id="lang">
|
||||
<a href="../en/PSKOV_ITEM_URL">EN</a>
|
||||
@@ -160,7 +156,7 @@ item = item.template
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong>Серов</strong>
|
||||
<a href="index.html">Обо мне</a>
|
||||
<a href="about.html">Обо мне</a>
|
||||
<a href="cv.html">Резюме</a>
|
||||
<div id="lang">
|
||||
<a href="../en/PSKOV_ITEM_URL">EN</a>
|
||||
@@ -189,14 +185,14 @@ item = item.template
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>PSKOV_ITEM_URL</code></td>
|
||||
<td>Provides <code><slug>.html</code> value for the page</td>
|
||||
<td>Provides generated page's file name: <code><slug>.html</code></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/index.md</code> and <code>en/cv.md</code> files look exactly as <a href="education.03.site.html">before</a>. <code>ru/index.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 the same pages.</p>
|
||||
<p>For example, <code>ru/cv.md</code> has the following contents:</p>
|
||||
<pre><code> Title: Резюме
|
||||
Slug: cv
|
||||
@@ -215,17 +211,34 @@ item = item.template
|
||||
<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 LFSA so that it points to directory with the files we just observed:</p>
|
||||
<pre><code>$ /path/to/local-file-system-access.py /path/to/dir/02.Language
|
||||
<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
|
||||
</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/index.html</code> or <code>ru/index.html</code> from the site's directory locally</li>
|
||||
<li>Open generated <code>en/about.html</code> or <code>ru/about.html</code> from the site's directory locally</li>
|
||||
<li>Switch language to verify language selection works fine</li>
|
||||
</ul>
|
||||
<p>Take time to observe just how little effort you spent to have your web site localized.</p>
|
||||
<p><a name="summary"/></p>
|
||||
<h2 id="06summary">06. Summary</h2>
|
||||
<p>You have successfully added language selection. <a href="http://opengamestudio.org/pskov/sample/02.Language/en/about.html">Check out the result</a>.</p>
|
||||
<p>Introduced PSKOV constants include:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>PSKOV constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>PSKOV_ITEM_URL</code></td>
|
||||
<td>Provides generated page's file name: <code><slug>.html</code></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p></div><div class="contents"></p>
|
||||
<table>
|
||||
<thead>
|
||||
|
||||
187
pskov/en/education.04.lang.md
Normal file
187
pskov/en/education.04.lang.md
Normal file
@@ -0,0 +1,187 @@
|
||||
Title: Education: 04. Language
|
||||
Date: 2019-05-21 00:00
|
||||
Category: Page
|
||||
Slug: education.04.lang
|
||||
Lang: en
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| [03. Site][prev] | [Education][index] | [05. Blog][next] |
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
In this document we add language selection.
|
||||
|
||||
Estimated completion time: 10 minutes.
|
||||
|
||||
**Table of contents**
|
||||
|
||||
* [01. Localization](#localization)
|
||||
* [02. Investigate `cfg` file](#cfg)
|
||||
* [03. Investigate template files](#item)
|
||||
* [04. Investigate Markdown files](#md)
|
||||
* [05. Launch LFSA and generate the site](#gen)
|
||||
* [06. Summary](#summary)
|
||||
|
||||
<a name="localization"/>
|
||||
|
||||
## 01. Localization
|
||||
|
||||
Now that you have your web site in English you start to wonder why there's no Russian version, you're Russian after all!
|
||||
|
||||
You set on to create the following [directory structure][02-files]:
|
||||
|
||||
* `cfg`
|
||||
* `en/item.template`
|
||||
* `en/about.md`
|
||||
* `en/cv.md`
|
||||
* `ru/item.template`
|
||||
* `ru/about.md`
|
||||
* `ru/cv.md`
|
||||
|
||||
Let's look at the contents of these files closer.
|
||||
|
||||
<a name="cfg"/>
|
||||
|
||||
## 02. Investigate `cfg` file
|
||||
|
||||
`cfg` file has the following contents:
|
||||
|
||||
```
|
||||
input = en;ru
|
||||
item = item.template
|
||||
```
|
||||
|
||||
As you see, `input` can accept multiple directories separated by `;` symbol: **PSKOV** will go over each directory specified and run as before.
|
||||
|
||||
In this case, both `en/` and `ru/` directories have their own `item.template` file.
|
||||
|
||||
<a name="item"/>
|
||||
|
||||
## 03. Investigate template files
|
||||
|
||||
* `en/item.template` contents:
|
||||
|
||||
```
|
||||
- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
```
|
||||
* `ru/item.template` contents:
|
||||
|
||||
```
|
||||
- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
```
|
||||
|
||||
**Note**: beginning and ending were collapsed for brevity.
|
||||
|
||||
As you can see, both `en/item.template` and `ru/item.template` look similar to `item.template` we saw [before][prev].
|
||||
|
||||
The changes include:
|
||||
|
||||
* use of `<div id="lang">...</div>` section to present language selection
|
||||
* localization of titles into English and Russian
|
||||
|
||||
Language selection uses new **PSKOV** constant:
|
||||
|
||||
| PSKOV constant | Description |
|
||||
|---|---|
|
||||
| `PSKOV_ITEM_URL` | Provides generated page's file name: `<slug>.html` |
|
||||
|
||||
As you see, `PSKOV_ITEM_URL` is all you need to have your page in as many languages as you please.
|
||||
|
||||
<a name="md"/>
|
||||
|
||||
## 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.
|
||||
|
||||
For example, `ru/cv.md` has the following contents:
|
||||
|
||||
```
|
||||
Title: Резюме
|
||||
Slug: cv
|
||||
|
||||
Здесь вы можете увидеть моё резюме в том случае, если мои произведения всё ещё вас интересуют. Я использовал современный подход ИТ для структурирования своего резюме в виде пар ключ-значение словаря (карты). Наслаждайтесь!
|
||||
|
||||
| Ключ | Значение |
|
||||
|---|---|
|
||||
| Имя | Валентин Серов |
|
||||
| Возраст | 46 |
|
||||
| Семейное положение | Женат |
|
||||
| Страна | Российская Империя |
|
||||
| Учёба | Императорская Академия художеств |
|
||||
| Звания | * академик ИАХ (1898) <br> * действительный член ИАХ (1903) |
|
||||
```
|
||||
|
||||
**Note**: Russian page has exactly the same `Slug:` value as English one.
|
||||
|
||||
<a name="gen"/>
|
||||
|
||||
## 05. Launch LFSA and generate the site
|
||||
|
||||
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
|
||||
```
|
||||
|
||||
Generate the site:
|
||||
|
||||
* Go to [Tool][tool] page
|
||||
* Press `Generate` button
|
||||
* Open generated `en/about.html` or `ru/about.html` from the site's directory locally
|
||||
* Switch language to verify language selection works fine
|
||||
|
||||
<a name="summary"/>
|
||||
|
||||
## 06. Summary
|
||||
|
||||
You have successfully added language selection. [Check out the result][02-sample].
|
||||
|
||||
Introduced PSKOV constants include:
|
||||
|
||||
| PSKOV constant | Description |
|
||||
|---|---|
|
||||
| `PSKOV_ITEM_URL` | Provides generated page's file name: `<slug>.html` |
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| [03. Site][prev] | [Education][index] | [05. Blog][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/en/about.html
|
||||
[lfsa]: http://opengamestudio.org/lfsa
|
||||
[tool]: http://opengamestudio.org/pskov
|
||||
696
pskov/en/education.05.blog.html
Normal file
696
pskov/en/education.05.blog.html
Normal file
@@ -0,0 +1,696 @@
|
||||
<!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;
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV-201905
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="tool.pskov.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
Education: 05. Blog
|
||||
</h1></center>
|
||||
<center><div class="contents">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>< Back</th>
|
||||
<th>Index</th>
|
||||
<th>Next ></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><a href="education.04.lang.html">04. Language</a></td>
|
||||
<td><a href="education.html">Education</a></td>
|
||||
<td>Not available</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p></div><div class="contents"></p>
|
||||
<p>In this document we create "dynamic" pages like blog posts.</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="#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="#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>
|
||||
<li><a href="#summary">09. Summary</a></li>
|
||||
</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>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>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>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>
|
||||
<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>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>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Key</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>previewEnding</code></td>
|
||||
<td>String to use at the end of HTML previews</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>previewsPerPage</code></td>
|
||||
<td>Number of HTML previews hosted by single index (summary) file</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>previewsPageBaseName</code></td>
|
||||
<td>Index (summary) file base name</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>In our case:</p>
|
||||
<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>
|
||||
</ul>
|
||||
<p><a name="item"/></p>
|
||||
<h2 id="03investigateitemtemplatesoftheblog">03. Investigate item templates of the blog</h2>
|
||||
<ul>
|
||||
<li><p><code>en/blog/item.template</code> contents:</p>
|
||||
<pre><code>- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
</code></pre></li>
|
||||
<li><p><code>ru/blog/item.template</code> contents:</p>
|
||||
<pre><code>- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
</code></pre></li>
|
||||
</ul>
|
||||
<p><strong>Note</strong>: beginning and ending were collapsed for brevity.</p>
|
||||
<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>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>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>PSKOV constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>PSKOV_ITEM_DATE</code></td>
|
||||
<td>Provides date from <code>Date:</code> part of page's header section</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p><a name="preview"/></p>
|
||||
<h2 id="04investigatepreviewtemplates">04. Investigate preview templates</h2>
|
||||
<ul>
|
||||
<li><p><code>en/blog/preview.template</code> contents:</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> contents:</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>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>Preview itself is referenced by <code>PSKOV_PREVIEW</code> constant:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>PSKOV constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>PSKOV_PREVIEW</code></td>
|
||||
<td>Provides contents from 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>
|
||||
<ul>
|
||||
<li><p><code>en/blog/index.template</code> contents:</p>
|
||||
<pre><code>- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
</code></pre></li>
|
||||
<li><p><code>ru/blog/index.template</code> contents:</p>
|
||||
<pre><code>- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
</code></pre></li>
|
||||
</ul>
|
||||
<p><strong>Notes</strong>:</p>
|
||||
<ul>
|
||||
<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>
|
||||
<tr>
|
||||
<th>PSKOV constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>PSKOV_INDEX_URL</code></td>
|
||||
<td>Provides generated page's 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>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_PAGINATION</code></td>
|
||||
<td>Provides pagination section to navigate index (summary) 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>There are free pagination templates:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Pagination template</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>prev</td>
|
||||
<td>Is used for the last index (summary) page because we 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>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>both</td>
|
||||
<td>Is used for intermediate index (summary) pages because we can either go backwards, or forward</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>Let's look at English pagination templates:</p>
|
||||
<ul>
|
||||
<li><p><code>en/blog/pagination.prev.template</code> contents:</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> contents:</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> contents:</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>Russian counterparts look similar. Here's <code>ru/blog/pagination.template</code> contents:</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>Here are new <strong>PSKOV</strong> constants we used:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>PSKOV constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>PSKOV_PAGE_ID</code></td>
|
||||
<td>Provides index (summary) 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>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_PREV_PAGE_URL</code></td>
|
||||
<td>Provides previous index (summary) page file name</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_NEXT_PAGE_URL</code></td>
|
||||
<td>Provides next index (summary) page file name</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p><a name="md"/></p>
|
||||
<h2 id="07investigatemarkdownfiles">07. Investigate Markdown files</h2>
|
||||
<p>Markdown files represent blog posts and they look almost like Markdown files for pages. Here's <code>en/blog/1885.md</code> contents:</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>Date is used to sort blog posts by date in ascending order:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Header constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<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><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
|
||||
</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>
|
||||
</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>Introduced PSKOV constants include:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>PSKOV constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>PSKOV_ITEM_DATE</code></td>
|
||||
<td>Provides date from <code>Date:</code> part of page's header section</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_PREVIEW</code></td>
|
||||
<td>Provides contents from 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>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_PREVIEWS</code></td>
|
||||
<td>Provides a combination of <code>PSKOV_PREVIEW</code> sections</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_PAGINATION</code></td>
|
||||
<td>Provides pagination section to navigate index (summary) pages</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_PAGE_ID</code></td>
|
||||
<td>Provides index (summary) 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>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_PREV_PAGE_URL</code></td>
|
||||
<td>Provides previous index (summary) page file name</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>PSKOV_NEXT_PAGE_URL</code></td>
|
||||
<td>Provides next index (summary) page file name</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>Introduced configuration keys include:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Key</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>previewEnding</code></td>
|
||||
<td>String to use at the end of HTML previews</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>previewsPerPage</code></td>
|
||||
<td>Number of HTML previews hosted by single index (summary) file</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>previewsPageBaseName</code></td>
|
||||
<td>Index (summary) file base name</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>Introduced header constants include:</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Header constant</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<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>Now use <strong>PSKOV</strong> to generate your very own web site!</p>
|
||||
<p></div><div class="contents"></p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>< Back</th>
|
||||
<th>Index</th>
|
||||
<th>Next ></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><a href="education.04.lang.html">04. Language</a></td>
|
||||
<td><a href="education.html">Education</a></td>
|
||||
<td>Not available</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div></center>
|
||||
<script type="text/javascript">
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
482
pskov/en/education.05.blog.md
Normal file
482
pskov/en/education.05.blog.md
Normal file
@@ -0,0 +1,482 @@
|
||||
Title: Education: 05. Blog
|
||||
Date: 2019-05-22 00:00
|
||||
Category: Page
|
||||
Slug: education.05.blog
|
||||
Lang: en
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| [04. Language][prev] | [Education][index] | Not available |
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
In this document we create "dynamic" pages like blog posts.
|
||||
|
||||
Estimated completion time: 20 minutes.
|
||||
|
||||
**Table of contents**
|
||||
|
||||
* [01. Blog](#blog)
|
||||
* [02. Investigate `cfg` file](#cfg)
|
||||
* [03. Investigate item templates of the blog](#item)
|
||||
* [04. Investigate preview templates](#preview)
|
||||
* [05. Investigate index (summary) templates](#index)
|
||||
* [06. Investigate pagination templates](#pagination)
|
||||
* [07. Investigate Markdown files](#md)
|
||||
* [08. Launch LFSA and generate the site](#gen)
|
||||
* [09. Summary](#summary)
|
||||
|
||||
<a name="blog"/>
|
||||
|
||||
## 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.
|
||||
|
||||
You set on to create the following [directory structure][03-files]:
|
||||
|
||||
* `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`
|
||||
|
||||
Let's look at the contents of these files closer.
|
||||
|
||||
<a name="cfg"/>
|
||||
|
||||
## 02. Investigate `cfg` file
|
||||
|
||||
`cfg` file has the following contents:
|
||||
|
||||
```
|
||||
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
|
||||
```
|
||||
|
||||
Apart from already used `input` and `item` keys, we have quite a lot of new ones. Let's break them down:
|
||||
|
||||
| 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 |
|
||||
|
||||
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.
|
||||
|
||||
<a name="item"/>
|
||||
|
||||
## 03. Investigate item templates of the blog
|
||||
|
||||
* `en/blog/item.template` contents:
|
||||
|
||||
```
|
||||
- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
```
|
||||
* `ru/blog/item.template` contents:
|
||||
|
||||
```
|
||||
- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
```
|
||||
|
||||
**Note**: beginning and ending were collapsed for brevity.
|
||||
|
||||
As you can see, both files look similar to `item.template` files we saw [before][prev].
|
||||
|
||||
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
|
||||
* 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 |
|
||||
|
||||
<a name="preview"/>
|
||||
|
||||
## 04. Investigate preview templates
|
||||
|
||||
* `en/blog/preview.template` contents:
|
||||
|
||||
```
|
||||
<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` contents:
|
||||
|
||||
```
|
||||
<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>
|
||||
```
|
||||
|
||||
Previews have no `<head>`, `<body>`, and similar full page HTML tags. Previews represent sections inserted into index (summary) files.
|
||||
|
||||
Preview itself is referenced by `PSKOV_PREVIEW` constant:
|
||||
|
||||
| PSKOV constant | Description |
|
||||
|---|---|
|
||||
| `PSKOV_PREVIEW` | Provides contents from a Markdown file limited by `previewSize` characters (approximately) |
|
||||
|
||||
<a name="index"/>
|
||||
|
||||
## 05. Investigate index (summary) templates
|
||||
|
||||
* `en/blog/index.template` contents:
|
||||
|
||||
```
|
||||
- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
```
|
||||
|
||||
* `ru/blog/index.template` contents:
|
||||
|
||||
```
|
||||
- - - - Collapsed for brevity - - - -
|
||||
<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>
|
||||
- - - - Collapsed for brevity - - - -
|
||||
```
|
||||
|
||||
**Notes**:
|
||||
|
||||
* 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 |
|
||||
|
||||
<a name="pagination"/>
|
||||
|
||||
## 06. Investigate pagination templates
|
||||
|
||||
Pagination templates represent sections used to navigate index (summary) 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 |
|
||||
|
||||
Let's look at English pagination templates:
|
||||
|
||||
* `en/blog/pagination.prev.template` contents:
|
||||
|
||||
```
|
||||
<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` contents:
|
||||
|
||||
```
|
||||
<p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p>
|
||||
<p>
|
||||
<a href="PSKOV_NEXT_PAGE_URL">Older »</a>
|
||||
</p>
|
||||
```
|
||||
|
||||
* `en/blog/pagination.template` contents:
|
||||
|
||||
```
|
||||
<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>
|
||||
```
|
||||
|
||||
Russian counterparts look similar. Here's `ru/blog/pagination.template` contents:
|
||||
|
||||
```
|
||||
<p>Страница PSKOV_PAGE_ID из PSKOV_PAGES_COUNT</p>
|
||||
<p>
|
||||
<a href="PSKOV_PREV_PAGE_URL">« Новее</a>
|
||||
<a href="PSKOV_NEXT_PAGE_URL">Старее »</a>
|
||||
</p>
|
||||
```
|
||||
|
||||
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 |
|
||||
|
||||
<a name="md"/>
|
||||
|
||||
## 07. Investigate Markdown files
|
||||
|
||||
Markdown files represent blog posts and they look almost like Markdown files for pages. Here's `en/blog/1885.md` contents:
|
||||
|
||||
```
|
||||
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 is used to sort blog posts by date in ascending order:
|
||||
|
||||
| Header constant | Description |
|
||||
|---|---|
|
||||
| `Date:` | Provides value for `PSKOV_ITEM_DATE` constant when generating HTML out of Markdown |
|
||||
|
||||
<a name="gen"/>
|
||||
|
||||
## 08. Launch LFSA and generate the site
|
||||
|
||||
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
|
||||
```
|
||||
|
||||
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
|
||||
|
||||
<a name="summary"/>
|
||||
|
||||
## 09. Summary
|
||||
|
||||
You have successfully generated a web site with "constant" and "dynamic" pages. [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 |
|
||||
|
||||
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 |
|
||||
|---|---|
|
||||
| `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].
|
||||
|
||||
Now use **PSKOV** to generate your very own web site!
|
||||
|
||||
</div><div class="contents">
|
||||
|
||||
| < Back | Index | Next > |
|
||||
|---|---|---|
|
||||
| [04. Language][prev] | [Education][index] | Not available |
|
||||
|
||||
[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/en/blog/index.html
|
||||
[lfsa]: http://opengamestudio.org/lfsa
|
||||
[tool]: http://opengamestudio.org/pskov
|
||||
|
||||
[tw]: https://twitter.com/OpenGameStudio
|
||||
[fb]: https://www.facebook.com/groups/162611230470183
|
||||
[vk]: https://vk.com/opengamestudo
|
||||
@@ -20,11 +20,6 @@
|
||||
{
|
||||
color: #433729;
|
||||
}
|
||||
iframe
|
||||
{
|
||||
width: 720px;
|
||||
height: 720px;
|
||||
}
|
||||
html
|
||||
{
|
||||
font-family: sans-serif;
|
||||
@@ -71,68 +66,156 @@
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV - Opensource Game Studio static site generator
|
||||
PSKOV-201905
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="index.html">Tool</a>
|
||||
<a href="tool.pskov.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
Education
|
||||
</h1></center>
|
||||
<center><div class="contents">
|
||||
<p>Here you can find a set of documents to make you proficient in generating static sites with <strong>PSKOV</strong>. You are encouraged to read the documents in order.</p>
|
||||
<p>Here is a set of documents to make you proficient in generating static sites with <strong>PSKOV</strong>. We encourage you to read the documents in order.</p>
|
||||
<h2 id="01whywhy"><a href="education.01.why.html">01. Why</a></h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>№</th>
|
||||
<th>Document</th>
|
||||
<th>Item</th>
|
||||
<th>Details</th>
|
||||
<th>Demonstration</th>
|
||||
<th>Estimated completion time</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td><a href="education.01.why.html">Why</a></td>
|
||||
<td>Description</td>
|
||||
<td>Find out why <strong>PSKOV</strong> was created</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Estimated completion time</td>
|
||||
<td>5 minutes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td><a href="education.02.deps.html">Dependencies</a></td>
|
||||
<td>Install dependencies to start using <strong>PSKOV</strong></td>
|
||||
<td>-</td>
|
||||
<td>?? minutes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td><a href="education.03.site.html">Site</a></td>
|
||||
<td>Learn how to create a simple static web site with two pages</td>
|
||||
<td>TODO Link</td>
|
||||
<td>?? minutes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>Language</td>
|
||||
<td>?</td>
|
||||
<td>TODO Link</td>
|
||||
<td>?</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>Blog</td>
|
||||
<td>?</td>
|
||||
<td>TODO Link</td>
|
||||
<td>?</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2 id="02dependenciesdeps"><a href="education.02.deps.html">02. Dependencies</a></h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Item</th>
|
||||
<th>Details</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Description</td>
|
||||
<td>Install dependencies to start using <strong>PSKOV</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Estimated completion time</td>
|
||||
<td>5 minutes</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2 id="03sitesite"><a href="education.03.site.html">03. Site</a></h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Item</th>
|
||||
<th>Details</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Description</td>
|
||||
<td>Learn how to create a simple static web site with two pages</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Estimated completion time</td>
|
||||
<td>10 minutes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Demonstration</td>
|
||||
<td><a href="http://opengamestudio.org/pskov/sample/01.TwoPages/about.html">TwoPages</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Introduced PSKOV constants</td>
|
||||
<td><ol> <li><code>PSKOV_ITEM_TITLE</code></li> <li><code>PSKOV_ITEM_CONTENTS</code></li> </ol></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Introduced configuration keys</td>
|
||||
<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>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2 id="04languagelang"><a href="education.04.lang.html">04. Language</a></h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Item</th>
|
||||
<th>Details</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Description</td>
|
||||
<td>Learn how to add language selection</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Estimated completion time</td>
|
||||
<td>10 minutes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Demonstration</td>
|
||||
<td><a href="http://opengamestudio.org/pskov/sample/02.Language/en/about.html">Language</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Introduced PSKOV constants</td>
|
||||
<td><ol> <li><code>PSKOV_ITEM_URL</code></li> </ol></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h2 id="05blogblog"><a href="education.05.blog.html">05. Blog</a></h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Item</th>
|
||||
<th>Details</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Description</td>
|
||||
<td>Learn how to create "dynamic" pages like blog posts</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Estimated completion time</td>
|
||||
<td>20 minutes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Demonstration</td>
|
||||
<td><a href="http://opengamestudio.org/pskov/sample/03.Blog/en/blog/index.html">Blog</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Introduced PSKOV constants</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>Introduced configuration keys</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>Introduced header constants</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>
|
||||
</div></center>
|
||||
<script type="text/javascript">
|
||||
</script>
|
||||
|
||||
68
pskov/en/education.md
Normal file
68
pskov/en/education.md
Normal file
@@ -0,0 +1,68 @@
|
||||
Title: Education
|
||||
Date: 2019-05-20 00:00
|
||||
Category: Page
|
||||
Slug: education
|
||||
Lang: en
|
||||
|
||||
Here is a set of documents to make you proficient in generating static sites with **PSKOV**. We encourage you to read the documents in order.
|
||||
|
||||
## [01. Why][why]
|
||||
|
||||
| Item | Details |
|
||||
|---|---|
|
||||
| Description | Find out why **PSKOV** was created |
|
||||
| Estimated completion time | 5 minutes |
|
||||
|
||||
## [02. Dependencies][deps]
|
||||
|
||||
| Item | Details |
|
||||
|---|---|
|
||||
| Description | Install dependencies to start using **PSKOV** |
|
||||
| Estimated completion time | 5 minutes |
|
||||
|
||||
## [03. Site][site]
|
||||
|
||||
| Item | 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> |
|
||||
|
||||
## [04. Language][lang]
|
||||
|
||||
| Item | Details |
|
||||
|---|---|
|
||||
| Description | Learn how to add language selection |
|
||||
| Estimated completion time | 10 minutes |
|
||||
| Demonstration | [Language][02-sample] |
|
||||
| Introduced PSKOV constants | <ol> <li>`PSKOV_ITEM_URL`</li> </ol> |
|
||||
|
||||
## [05. Blog][blog]
|
||||
|
||||
| Item | Details |
|
||||
|---|---|
|
||||
| Description | Learn how to create "dynamic" pages like blog posts |
|
||||
| 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> |
|
||||
|
||||
If you like what we do, support us by joining our group at [Twitter][tw], [Facebook][fb], or [VK][vk].
|
||||
|
||||
[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/en/about.html
|
||||
[03-sample]: http://opengamestudio.org/pskov/sample/03.Blog/en/blog/index.html
|
||||
|
||||
[tw]: https://twitter.com/OpenGameStudio
|
||||
[fb]: https://www.facebook.com/groups/162611230470183
|
||||
[vk]: https://vk.com/opengamestudo
|
||||
@@ -1,96 +0,0 @@
|
||||
<!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;
|
||||
}
|
||||
iframe
|
||||
{
|
||||
width: 720px;
|
||||
height: 720px;
|
||||
}
|
||||
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;
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV - Opensource Game Studio static site generator
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="index.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
Tool
|
||||
</h1></center>
|
||||
<center><div class="contents">
|
||||
<p><strong>PSKOV</strong> is a static site generator that runs in your web browser. What you see now has also been generated with <strong>PSKOV</strong>. If you're new to <strong>PSKOV</strong>, visit <a href="education.html">education page</a>.</p>
|
||||
<iframe id="pskov" src="pskov-201905.html">
|
||||
<p>ERROR Your browser does not support iframes</p>
|
||||
</iframe>
|
||||
</div></center>
|
||||
<script type="text/javascript">
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -20,11 +20,6 @@
|
||||
{
|
||||
color: #433729;
|
||||
}
|
||||
iframe
|
||||
{
|
||||
width: 720px;
|
||||
height: 720px;
|
||||
}
|
||||
html
|
||||
{
|
||||
font-family: sans-serif;
|
||||
@@ -71,13 +66,13 @@
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV - Opensource Game Studio static site generator
|
||||
PSKOV-201905
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="index.html">Tool</a>
|
||||
<a href="tool.pskov.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
|
||||
@@ -1 +0,0 @@
|
||||
../pskov-201905.html
|
||||
@@ -3,6 +3,67 @@
|
||||
<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;
|
||||
}
|
||||
table
|
||||
{
|
||||
border-collapse: collapse;
|
||||
@@ -28,81 +89,99 @@
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
<title>
|
||||
PSKOV-201905
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<table>
|
||||
<tr>
|
||||
<td colspan="2" class="section">
|
||||
<a href="http://opengamestudio.org/lfsa">Local file system access</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Path:</td>
|
||||
<td id="lfsaPath">Updating...</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="section">
|
||||
Configuration
|
||||
<button type="button" onclick="window.pskovTool.saveCfg()">Save</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Input directory:</td>
|
||||
<td><input id="input"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Item template:</td>
|
||||
<td><input id="item"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preview template:</td>
|
||||
<td><input id="preview"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Index template:</td>
|
||||
<td><input id="index"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Pagination 'Previous' template:</td>
|
||||
<td><input id="paginationPrev"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Pagination 'Next' template:</td>
|
||||
<td><input id="paginationNext"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Pagination 'Previous/Next' template:</td>
|
||||
<td><input id="paginationPrevNext"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preview characters limit:</td>
|
||||
<td><input id="previewSize"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preview ending string:</td>
|
||||
<td><input id="previewEnding"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Previews per page:</td>
|
||||
<td><input id="previewsPerPage"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preview page base name:</td>
|
||||
<td><input id="previewPageBaseName"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="section">
|
||||
News
|
||||
<button type="button" onclick="window.pskovTool.generateNews()">Generate</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="section">Log</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="log" colspan="2"></td>
|
||||
</tr>
|
||||
</table>
|
||||
<div id="header">
|
||||
<strong id="title">PSKOV</strong>
|
||||
<a href="tool.pskov.html">Tool</a>
|
||||
<a href="education.html">Education</a>
|
||||
</div>
|
||||
<center><h1>
|
||||
PSKOV-201905
|
||||
</h1></center>
|
||||
<center><div class="contents">
|
||||
<p>
|
||||
<strong>PSKOV</strong> is a static site generator that runs in your web browser.
|
||||
What you see now has also been generated with <strong>PSKOV</strong>.
|
||||
If you're new to <strong>PSKOV</strong>, visit <a href="education.html">education page</a>.
|
||||
</p>
|
||||
<table>
|
||||
<tr>
|
||||
<td colspan="2" class="section">
|
||||
<a href="http://opengamestudio.org/lfsa">Local file system access</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Path:</td>
|
||||
<td id="lfsaPath">Updating...</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="section">
|
||||
Configuration
|
||||
<button type="button" onclick="window.pskovTool.saveCfg()">Save</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Input directory:</td>
|
||||
<td><input id="input"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Item template:</td>
|
||||
<td><input id="item"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preview template:</td>
|
||||
<td><input id="preview"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Index template:</td>
|
||||
<td><input id="index"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Pagination 'Previous' template:</td>
|
||||
<td><input id="paginationPrev"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Pagination 'Next' template:</td>
|
||||
<td><input id="paginationNext"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Pagination 'Previous/Next' template:</td>
|
||||
<td><input id="paginationPrevNext"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preview characters limit:</td>
|
||||
<td><input id="previewSize"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preview ending string:</td>
|
||||
<td><input id="previewEnding"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Previews per page:</td>
|
||||
<td><input id="previewsPerPage"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preview page base name:</td>
|
||||
<td><input id="previewPageBaseName"></input></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="section">
|
||||
News
|
||||
<button type="button" onclick="window.pskovTool.generateNews()">Generate</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" class="section">Log</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="log" colspan="2"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div></center>
|
||||
<script type="text/javascript">
|
||||
<!-- showdown.js -->
|
||||
;/*! showdown v 2.0.0-alpha1 - 24-10-2018 */
|
||||
@@ -5576,7 +5655,7 @@
|
||||
String.prototype.startsWith = String.prototype.startsWith || function(prefix) {
|
||||
return this.indexOf(prefix) === 0;
|
||||
};
|
||||
|
||||
|
||||
function fileExists(fileName, fileList)
|
||||
{
|
||||
for (var id in fileList)
|
||||
@@ -5662,7 +5741,7 @@
|
||||
this.subscriptions.push(subscription);
|
||||
return subscription;
|
||||
}
|
||||
|
||||
|
||||
<!-- LFSA -->
|
||||
// LFSA class to communicate with local-file-system-access instance.
|
||||
function LFSA()
|
||||
@@ -5673,28 +5752,21 @@
|
||||
LFSA.prototype.get = function(url, successCallback, failureCallback)
|
||||
{
|
||||
var req = new XMLHttpRequest();
|
||||
req.addEventListener(
|
||||
"load",
|
||||
function()
|
||||
req.onreadystatechange = function()
|
||||
{
|
||||
if (this.readyState == 4)
|
||||
{
|
||||
//console.log("get.successCallback.responseText: '" + this.responseText + "'");
|
||||
successCallback(this.responseText);
|
||||
if (this.status == 200)
|
||||
{
|
||||
//console.log("get.successCallback.responseText: '" + this.responseText + "'");
|
||||
successCallback(this.responseText);
|
||||
}
|
||||
else
|
||||
{
|
||||
failureCallback();
|
||||
}
|
||||
}
|
||||
);
|
||||
req.addEventListener(
|
||||
"error",
|
||||
function()
|
||||
{
|
||||
failureCallback();
|
||||
}
|
||||
);
|
||||
req.addEventListener(
|
||||
"abort",
|
||||
function()
|
||||
{
|
||||
failureCallback();
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
const prefix = this.host + ":" + this.port;
|
||||
const addr = prefix + url;
|
||||
@@ -5709,28 +5781,21 @@
|
||||
LFSA.prototype.post = function(url, data, successCallback, failureCallback)
|
||||
{
|
||||
var req = new XMLHttpRequest();
|
||||
req.addEventListener(
|
||||
"load",
|
||||
function()
|
||||
req.onreadystatechange = function()
|
||||
{
|
||||
if (this.readyState == 4)
|
||||
{
|
||||
//console.log("POST.successCallback.responseText: '" + this.responseText + "'");
|
||||
successCallback(this.responseText);
|
||||
if (this.status == 200)
|
||||
{
|
||||
//console.log("POST.successCallback.responseText: '" + this.responseText + "'");
|
||||
successCallback(this.responseText);
|
||||
}
|
||||
else
|
||||
{
|
||||
failureCallback();
|
||||
}
|
||||
}
|
||||
);
|
||||
req.addEventListener(
|
||||
"error",
|
||||
function()
|
||||
{
|
||||
failureCallback();
|
||||
}
|
||||
);
|
||||
req.addEventListener(
|
||||
"abort",
|
||||
function()
|
||||
{
|
||||
failureCallback();
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
const prefix = this.host + ":" + this.port;
|
||||
const addr = prefix + url;
|
||||
@@ -5890,7 +5955,7 @@
|
||||
// Start processing.
|
||||
process();
|
||||
}
|
||||
|
||||
|
||||
<!-- Common -->
|
||||
// NewsItem class.
|
||||
function NewsItem()
|
||||
@@ -5908,7 +5973,7 @@
|
||||
this.items = [];
|
||||
this.previews = [];
|
||||
}
|
||||
|
||||
|
||||
<!-- Cfg -->
|
||||
// Cfg class.
|
||||
function Cfg()
|
||||
@@ -6051,7 +6116,7 @@
|
||||
}
|
||||
this.lfsa.saveFile("cfg", cfgFile, success, failure);
|
||||
}
|
||||
|
||||
|
||||
<!-- News -->
|
||||
// News class.
|
||||
function News()
|
||||
@@ -6091,7 +6156,7 @@
|
||||
this.paginatedPreviewPagesChanged = new Reporter();
|
||||
this.savedPreviewPages = new Reporter();
|
||||
this.finished = new Reporter();
|
||||
|
||||
|
||||
this.inputFilesChanged.subscribe(function(){
|
||||
self.locateMarkdownFiles();
|
||||
});
|
||||
@@ -6671,7 +6736,7 @@
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
<!-- Tool -->
|
||||
// Tool class.
|
||||
function Tool()
|
||||
@@ -6681,7 +6746,7 @@
|
||||
this.cfg = new Cfg();
|
||||
this.cfg.lfsa = this.lfsa;
|
||||
this.news = new News();
|
||||
|
||||
|
||||
this.news.finished.subscribe(function(){
|
||||
// Continue processing.
|
||||
self.processNewsGeneration();
|
||||
@@ -6749,10 +6814,11 @@
|
||||
delete this.cfg.cfg["output"];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
<!-- Startup -->
|
||||
window.pskovTool = new Tool();
|
||||
window.pskovTool.run()
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta http-equiv="refresh" content="0; URL='en/index.html'"/>
|
||||
<meta http-equiv="refresh" content="0; URL='en/tool.pskov.html'"/>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user