aboutsummaryrefslogtreecommitdiffstats
path: root/root/articles/mmmfs/examples
diff options
context:
space:
mode:
authors-ol <s-ol@users.noreply.github.com>2019-12-30 18:52:37 +0000
committers-ol <s-ol@users.noreply.github.com>2019-12-30 18:52:37 +0000
commit5db27ae44907974230dbdfba002182e68e59038e (patch)
treef3f341ceb8b808e8293f188db21a51fd2fd98145 /root/articles/mmmfs/examples
parentprint styling fixes (diff)
downloadmmm-5db27ae44907974230dbdfba002182e68e59038e.tar.gz
mmm-5db27ae44907974230dbdfba002182e68e59038e.zip
lots of fixes
Diffstat (limited to 'root/articles/mmmfs/examples')
-rw-r--r--root/articles/mmmfs/examples/$order1
-rw-r--r--root/articles/mmmfs/examples/empty/title: text$plain1
-rw-r--r--root/articles/mmmfs/examples/gallery/preview: text$moonscript -> fn -> mmm$dom.moon7
-rw-r--r--root/articles/mmmfs/examples/gallery/title: text$plain2
-rw-r--r--root/articles/mmmfs/examples/image/preview: text$moonscript -> fn -> mmm$dom.moon5
-rw-r--r--root/articles/mmmfs/examples/image/title: text$plain2
-rw-r--r--root/articles/mmmfs/examples/intro: text$markdown+sidenotes.md21
-rw-r--r--root/articles/mmmfs/examples/markdown/preview: text$markdown.md6
-rw-r--r--root/articles/mmmfs/examples/markdown/text$markdown.md20
-rw-r--r--root/articles/mmmfs/examples/markdown/title: text$plain2
-rw-r--r--root/articles/mmmfs/examples/pinwall/title: text$plain2
-rw-r--r--root/articles/mmmfs/examples/text$moonscript -> fn -> mmm$dom.moon17
12 files changed, 47 insertions, 39 deletions
diff --git a/root/articles/mmmfs/examples/$order b/root/articles/mmmfs/examples/$order
index 348f5fe..4ee3140 100644
--- a/root/articles/mmmfs/examples/$order
+++ b/root/articles/mmmfs/examples/$order
@@ -1,6 +1,5 @@
language_support
image
markdown
-empty
gallery
pinwall
diff --git a/root/articles/mmmfs/examples/empty/title: text$plain b/root/articles/mmmfs/examples/empty/title: text$plain
deleted file mode 100644
index 911f98b..0000000
--- a/root/articles/mmmfs/examples/empty/title: text$plain
+++ /dev/null
@@ -1 +0,0 @@
-Hey I'm an almost empty Fileder.
diff --git a/root/articles/mmmfs/examples/gallery/preview: text$moonscript -> fn -> mmm$dom.moon b/root/articles/mmmfs/examples/gallery/preview: text$moonscript -> fn -> mmm$dom.moon
deleted file mode 100644
index 5285629..0000000
--- a/root/articles/mmmfs/examples/gallery/preview: text$moonscript -> fn -> mmm$dom.moon
+++ /dev/null
@@ -1,7 +0,0 @@
-import div, img, br from require 'mmm.dom'
-
-=> div {
- 'the first pic as a little taste:',
- br!,
- img src: @children[1]\get 'preview', 'URL -> image/png'
-}
diff --git a/root/articles/mmmfs/examples/gallery/title: text$plain b/root/articles/mmmfs/examples/gallery/title: text$plain
index ad74eec..2e9ef34 100644
--- a/root/articles/mmmfs/examples/gallery/title: text$plain
+++ b/root/articles/mmmfs/examples/gallery/title: text$plain
@@ -1 +1 @@
-A Gallery of 25 random pictures, come on in!
+a gallery of images
diff --git a/root/articles/mmmfs/examples/image/preview: text$moonscript -> fn -> mmm$dom.moon b/root/articles/mmmfs/examples/image/preview: text$moonscript -> fn -> mmm$dom.moon
deleted file mode 100644
index 6c431d0..0000000
--- a/root/articles/mmmfs/examples/image/preview: text$moonscript -> fn -> mmm$dom.moon
+++ /dev/null
@@ -1,5 +0,0 @@
-import img from require 'mmm.dom'
-
--- look for main content with 'URL to png' type
--- and wrap in an mmm/dom image tag
-=> img src: @gett 'URL -> image/png'
diff --git a/root/articles/mmmfs/examples/image/title: text$plain b/root/articles/mmmfs/examples/image/title: text$plain
index 60a556f..dca924f 100644
--- a/root/articles/mmmfs/examples/image/title: text$plain
+++ b/root/articles/mmmfs/examples/image/title: text$plain
@@ -1 +1 @@
-Hey I'm like a link to a picture or smth
+link to a remote image
diff --git a/root/articles/mmmfs/examples/intro: text$markdown+sidenotes.md b/root/articles/mmmfs/examples/intro: text$markdown+sidenotes.md
index cce348c..709da5c 100644
--- a/root/articles/mmmfs/examples/intro: text$markdown+sidenotes.md
+++ b/root/articles/mmmfs/examples/intro: text$markdown+sidenotes.md
@@ -16,16 +16,17 @@ and doesn't render as a paragraph but rather just a line of text.
This makes it suitable for denoting formatted-text titles and other small strings of text.
The problem of embedding other content together with text comfortably is also solved easily,
-becase Markdown allows embedding arbitrary HTML in the document.
+because Markdown allows embedding arbitrary HTML in the document.
This made it possible to define a set of pseudo-HTML elements in the Markdown-convert,
`<mmm-embed>` and `<mmm-link>`, which respectively embed and link to other content native to mmm.
### scientific publishing
-<div class="sidenote">
+<div class="sidenote" style="margin-top: 1.25rem">
One of the 'standard' solutions, <a href="https://www.latex-project.org/">LaTeX</a>,
is arguably at least as complex as the mmm system proposed here, but has a much narrower scope,
since it does not support interaction.
</div>
+
Scientific publishing is notoriously complex, involving not only the transclusion of diagrams
and other media, but generally requiring precise and consistent control over formatting and layout.
Some of these complexities are tedious to manage, but present good opportunities for programmatic
@@ -43,9 +44,9 @@ type to convert to a full reference format (to `mmm/dom`) and to an inline side-
For convenience, a convert from the `URL -> cite/acm` type has been provided to `URL -> text/bibtex`,
which generates links to the ACM Digital Library<mmm-embed path="../references/acm-dl" wrap="sidenote"></mmm-embed>
-API for accessing BibTeX citations for documents in the library.
-This means that it is enough to store the link to the ACM DL entry in mmmfs,
-and the reference will automatically be fetched (and track potential remote corrections).
+API for accessing BibTeX citations for documents in the library. This means that it is enough to store the link to the
+ACM DL entry in mmmfs, and the reference will automatically be fetched, and therefore stay up to date with potential
+remote corrections.
## pinwall
In many situations, in particular for creative work, it is often useful to compile resources of
@@ -62,14 +63,14 @@ which enumerates the list of children, wraps each in such a rectangular containe
and outputs the list of containers as DOM elements.
The position and size of each panel are stored in an ad-hoc facet, encoded in the JSON data format:
-`pinwall_info: text/json`. This facet can then set on each child and accessed whenever the script is called
+`pinwall_info: text/json`. Such a facet is set on each child and read whenever the script is called
to render the children, plugging the values within the facet into the visual styling of the document.
The script can also set event handlers that react to user input while the document is loaded,
and allow the user to reposition and resize the individual pinwall items by clicking and dragging
on the upper border or lower right-hand corner respectively.
Whenever a change is made the event handler can then update the value in the `pinwall_info` facet,
-so that the script places the content at the updated position and size next time it is invoked.
+so that the updated position and size are stored for the next time the pinwall is opened.
## slideshow
Another common use of digital documents is as aids in a verbal presentation.
@@ -84,8 +85,10 @@ It also allows putting the browser into fullscreen mode to maximise screenspace
of the website that may distract from the presentation, and register an event handler for keyboard accelerators
for moving through the presentation.
-Finally the script simply embeds the first of its child-fileders into the viewport rect.
-One the current slide is changed, the next embedded child is simply chosen.
+Finally the script simply embeds the first of its child-fileders into the viewport rectangle.
+Once the current slide is changed, the next embedded child is simply chosen.
+<!--
## code documentation
/meta/mmm.dom/:%20text/html+interactive
+-->
diff --git a/root/articles/mmmfs/examples/markdown/preview: text$markdown.md b/root/articles/mmmfs/examples/markdown/preview: text$markdown.md
deleted file mode 100644
index 4b38ef2..0000000
--- a/root/articles/mmmfs/examples/markdown/preview: text$markdown.md
+++ /dev/null
@@ -1,6 +0,0 @@
-See I have like
-
-- a list of things
-- (two things)
-
-and some bold **text** and `code tags` with me.
diff --git a/root/articles/mmmfs/examples/markdown/text$markdown.md b/root/articles/mmmfs/examples/markdown/text$markdown.md
new file mode 100644
index 0000000..880eedb
--- /dev/null
+++ b/root/articles/mmmfs/examples/markdown/text$markdown.md
@@ -0,0 +1,20 @@
+This is a markdown document rendered using [marked][marked] on the client, and [discount][discount] on the server.
+All Markdown features are supported, for example there is support for lists...
+
+- a list of things
+- (two things)
+
+...and syntax-highlighted code tags:
+
+```
+print "Hello World"
+```
+
+Since Markdown supports inline HTML, mmmfs shorthands can also be used to embed and reference content from elsewhere in
+the system. For example, the title of this fileder can be embedded using
+`<mmm-embed facet="title"></mmm-embed>`:
+
+<mmm-embed facet="title"></mmm-embed>
+
+[marked]: https://marked.js.org/
+[discount]: https://luarocks.org/modules/craigb/discount
diff --git a/root/articles/mmmfs/examples/markdown/title: text$plain b/root/articles/mmmfs/examples/markdown/title: text$plain
index 319068d..7915148 100644
--- a/root/articles/mmmfs/examples/markdown/title: text$plain
+++ b/root/articles/mmmfs/examples/markdown/title: text$plain
@@ -1 +1 @@
- I'm not even five lines of markdown but i render myself!
+markdown content
diff --git a/root/articles/mmmfs/examples/pinwall/title: text$plain b/root/articles/mmmfs/examples/pinwall/title: text$plain
index 9d29c5d..c629992 100644
--- a/root/articles/mmmfs/examples/pinwall/title: text$plain
+++ b/root/articles/mmmfs/examples/pinwall/title: text$plain
@@ -1 +1 @@
-A pinwall
+a pinwall
diff --git a/root/articles/mmmfs/examples/text$moonscript -> fn -> mmm$dom.moon b/root/articles/mmmfs/examples/text$moonscript -> fn -> mmm$dom.moon
index c79ffcf..1401e95 100644
--- a/root/articles/mmmfs/examples/text$moonscript -> fn -> mmm$dom.moon
+++ b/root/articles/mmmfs/examples/text$moonscript -> fn -> mmm$dom.moon
@@ -13,7 +13,7 @@
title = child\gett 'title', 'text/plain'
-- get 'preview' as a DOM description (nil if no value or conversion possible)
- content = child\get 'preview', 'mmm/dom'
+ -- content = child\get 'preview', 'mmm/dom'
-- div {
-- h4 title, style: { margin: 0, cursor: 'pointer' }, onclick: -> BROWSER\navigate child.path
@@ -31,10 +31,15 @@
li link_to child
- content = ul for child in *@children
- preview child
+ examples = div {
+ style:
+ position: 'relative'
+ 'margin-top': '4rem'
- -- table.insert content, 1, (@gett 'intro: mmm/dom')
- -- div content
+ div "The online version is available at ", (a "s-ol.nu/ba", href: 'https://s-ol.nu/ba'), ".", class: 'sidenote'
+ "The following examples can be viewed and inspected in the interactive version online:"
+ ul for child in *@children
+ preview child
+ }
- div (@gett 'intro: mmm/dom'), content
+ div (@gett 'intro: mmm/dom'), examples