mirror of
https://github.com/journeyman-cc/smeagol.git
synced 2026-04-12 18:05:06 +00:00
Working, but not finished.
This commit is contained in:
parent
1df78111cd
commit
719222195e
9 changed files with 168 additions and 5 deletions
59
resources/public/content/Example gallery.md
Normal file
59
resources/public/content/Example gallery.md
Normal file
|
|
@ -0,0 +1,59 @@
|
|||
## The Gallery
|
||||
|
||||
This page holds an example Photoswipe gallery.
|
||||
|
||||
```pswp
|
||||
{
|
||||
slides: [
|
||||
{ src: 'content/uploads/g1.jpg', w: 2592, h:1944,
|
||||
title: 'Frost on a gate, Laurieston' },
|
||||
{ src: 'content/uploads/g2.jpg', w: 2560, h:1920,
|
||||
title: 'Feathered crystals on snow surface, Taliesin' },
|
||||
{ src: 'content/uploads/g3.jpg', w: 2560, h:1920,
|
||||
title: 'Feathered snow on log, Taliesin' },
|
||||
{ src: 'content/uploads/g4.jpg', w: 2560, h:1920,
|
||||
title: 'Crystaline growth on seed head, Taliesin' }],
|
||||
options: {
|
||||
timeToIdle: 100
|
||||
},
|
||||
openImmediately: true
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
## How this works
|
||||
|
||||
The specification for this gallery is as follows:
|
||||
|
||||
```
|
||||
{
|
||||
slides: [
|
||||
{ src: 'content/uploads/g1.jpg', w: 2592, h:1944,
|
||||
title: 'Frost on a gate, Laurieston' },
|
||||
{ src: 'content/uploads/g2.jpg', w: 2560, h:1920,
|
||||
title: 'Feathered crystals on snow surface, Taliesin' },
|
||||
{ src: 'content/uploads/g3.jpg', w: 2560, h:1920,
|
||||
title: 'Feathered snow on log, Taliesin' },
|
||||
{ src: 'content/uploads/g4.jpg', w: 2560, h:1920,
|
||||
title: 'Crystaline growth on seed head, Taliesin' }],
|
||||
options: {
|
||||
timeToIdle: 100
|
||||
},
|
||||
openImmediately: true
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
The format of the specification is [JSON](https://www.json.org/json-en.html); there are (at present) three keys, as follows
|
||||
|
||||
### slides
|
||||
|
||||
Most be present. The value of `slides` is a list delimited by square brackets of slide objects. For more information, see the [authoritative documentation](https://photoswipe.com/documentation/getting-started.html) under the sub heading **'Creating an Array of Slide Objects'**.
|
||||
|
||||
### options
|
||||
|
||||
Optional. The value of `options` is a JSON object [as documented here](https://photoswipe.com/documentation/options.html).
|
||||
|
||||
### openImmediately
|
||||
|
||||
Optional. If the value of `openImmediately` is `true`, the gallery will open immediately, covering the whole page. If false, only a button with the label 'Open the gallery' will be shown. Selecting this button will cause the gallery to open.
|
||||
|
|
@ -66,6 +66,12 @@ Mermaid graph specifications can also be loaded from URLs. Here's another exampl
|
|||
data/classes.mermaid
|
||||
```
|
||||
|
||||
## Photoswipe galleries
|
||||
|
||||
Not so much a formatter, this is an extension to allow you to embed image galleries in your markdown. To specify a gallery, use three backticks followed by `pswp`, followed on the following lines by a Photoswipe specification in [JSON](https://www.json.org/json-en.html)
|
||||
followed by three backticks on a line by themselves. There is an [[Example gallery]] so that you can see how this works.
|
||||
|
||||
|
||||
## Writing your own custom formatters
|
||||
|
||||
A custom formatter is simply a Clojure function which takes a string and an integer as arguments and produces a string as output. The string is the text the user has typed into their markdown; the integer is simply a number you can use to keep track of which addition to the page this is, in order, for example, to fix up some JavaScript to render it.
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue