Each line can be a text or a command. A command line is preceded by a special sequente (by default ##), then the command name, and then arguments for the command, or some text (depending on wich command you invoke). A line starting with the sequence ## and not followed by a command name, or with wrong command arguments, will generate an error message on the console, and in most cases no content on to the slide. The arguments for a command must be separated by single spaces.
Example: the line ##title Foo Bar invokes the command title that sets the text Foo Bar as the title for the current slide, and places it in the slide with the special style defined for titles (H1 tag in HTML output).
In the middle of a text, you can mark some parts with a different/special prepending the style name and : and surrounding it all with [[ and ]].
Example: in the line the [[blue:second]] word have a different colour will use default style for all the words but the second one. The word second will use a style called blue (defined as .blue { <some-rules-and-properties> } in the css file).
Every time the parser finds [[, will consider that point as the beggining of a styled section, will look for the closest : character after that to delimit the style name from the content, and for the closest ]] after that to determine where the styled section ends. So, for instance, in [[blue:a:b]]] the styled part will bi a:b, the style name will be blue, and the remaining last ] will have default text style.
There is however one expception to that rule. If you place the delimiter sequences for the styled section without any content inside ([[]] neither style name, nor text nor separator), this will be translated into a line break (using BR tag in HTML output). It is usefull to break into a few lines a single content used as final argument for some command, or to break a single styled section.
Styles will translate to SPAN tag in HTML output, and can be nested, so [[blue:colourized, [[bold:colourized and highlighted]], only colourized]] is valid.
The special sequences used the identify a command or a style can be changed with the parser command.
The following sections will describe each command in detail.
Changes the special character sequences that precedes a command line, or that is used to apply a style to some part of a line. Defaults are: ## for commands, and [[, : and ]] for styles. The command must receive exactly four arguments, that are the four special sequences: the one for introducing a command, the one for starting a style section, the one for separating the style name from the styled content, and the one for marking the end of a styled section. If you invoke this command, the new sequences are used from the folliwing line on, and until another parser command is found, or the end of the content is reached.
Example:
##title Example
##parser @ ( - )
This line will use the (bold-new) sequences.
##code int v(bold:[10]);
That previous highlight in the code would not have been possible with the default settings
@parser ## [[ : ]]
Now we are back in the default state.
The default sequences can be unintuitive for some users, or can be part of some desired content. So this command lets the user selects whatever he wants in order to avoid colliding the styling syntax with whatever content he is including in his presentation.
This command will make sinad ignore a slide when generating the pdf version; the slide will be only present in the html version.
Example content.txt
##newpage
##nopdf
If you see this slide, you are watching the html version.
This slide will not be included when converting to pdf.
##newpage
This will the second slide in the html version, the first one in the pdf.
Sets a zoom/scale to be applied to the whole current slide. It should be followed by a single mandatory argument that is the new scale/proportion in terms of percentage (100% is default scale, percentage symbol is optional).
This command will be translated in properties for the BODY tag in the generated html page, replacing the variable $ZOOM in <[{code:base/slide.html}]>.
Example base/slide.html
<HTML><HEAD>
<TITLE>$TITLE</TITLE>
<LINK rel="stylesheet" type="text/css" href="$CSS.css">
<script type="text/javascript"> ... </script>
</HEAD>
<BODY onkeydown="onkey" $ZOOM>
$CONTENT
</BODY></HTML>
Example content.txt
##newpage
##zoom 50%
This slide will be scaled down to a half of the original size.
##newpage
This new slide will have its regular scale again.
Alternatively you can also set the scale with newpage command:
##newpage 50%
This slide will be scaled down to a half of the original size.
##newpage
This new slide will have its regular scale again.
See also: newpage
Defines a text value that will be used to replace any occurrence of the string $DOCTITLE inside the base html. It is usefull to define a title to be shown in a header or a footer in all slides.
You should use html+css to place this text in some absolute position in the slides.
If you don't use the $DOCTITLE var in your base html template, this command won't generate any output. If you don't use this command, the variable $DOCTITLE will be replaced by an empty string. If you use this command several times, each time you do, you define the title to be used in any slide from that point on, until next doctitle command, or the end of the presentation, whatever comes first.
Every line of content has a "time" counter associated. If there are lines with different time counters in a slide, that slide will be rendered to more thant one html page in order to make the content appear gradually instead of presenting it all at once. The time counter defines the order (in time) in wich the lines appear. Content associated to value 0 appear first (inmediatly), and then every time user advances the slide a new "current time" is set so other content is made visible.
time with one argument defines that time counter value for all the content from that point on, until the next time changing command. If the command receives two arguments, the second one marks the time point at wich the content must be hidden again.
The order in time does not have to be correlated with the order in the screen. That means that first line can have time at 1, and second line at 0; so first line will appear first. Also, the list of time values for a slide does not have to be contiguos; first time value is always 0, but then you can define 3 other time values to 1, 2, and 3; or to 5, 10 and 30, achieving the same result (intermediate time values with no content associated are skipped).
Example:
This line will be shown inmediatly (its time value is 0)
##time 1
This line will be shown after first Enter, and remain in the screen until the end of the slide.
Another line with same life cycle that previous one
##time 1 5
This line will be shown after pressing Enter for the first time, and hidden again after pressing it for the second time.
##time 5
This line will be shown on the third step.
##time 0
This line will be also shown from the begining (its time value is 0)
pause increments the time counter value by one. That means that when content before this line is first shown, content after this line is hidden until user advances the presentation one more step.
This line will be shown inmediatly.
##pause
This line will be shown after first Enter, and remain in the screen until the end of the slide.
##pause
This line will be shown after pressing Enter for the second time.
timed makes some content visible only on a single time step (the current one). If there is no extra argument, the command applies to whatever content comes next (as time command). If there is some argument, it must be another nested command and the time setting will apply to that command alone.
Example:
This line will be shown inmediatly.
##pause
##timed
This line will be shown after first Enter, and hidden again after second one
Same as before
##pause
This line will be shown after pressing Enter for the second time.
For an example of timed used with a nested command, see image.
newpage command always reset time counter to 0.
Displays a line without bullet or number in the middle of a list or enumeration. Use this as a prefix for the line that you don't want to be shown as a new item. Works for beginlist/endlist and beginenum/endenum.
Example: adding a comment to an list item (the first one) as a second line for that same firt bullet.
##beginlist
This is the first bullet
##noitem This is the second line, but it does not generate a new bullet... looks like a continuation for the first one.
This is the second bullet
##endlist
Note: In the HTML output, that content will be generated as a new paragraph in between two items. That means that the content will be inside an OL or UL but outside an LI element. This might be not 100% correct for HTML, but mosts browsers will render it ok anyway.
See also: bullet number
Displays a single line as an unordered/bulleted list item. Internally, it generates an unordered list (same as with beginlist/endlist, but shorter) with a single item. The rest of the line is the content of that item.
Example:
This is a regular paragraph, not in a list.
##item This will be shown as a list item, with the list bullet at the begining.
This is a regular paragraph, not in a list.
See also: number noitem beginlist beginenum
Displays a single line as an ordered/enumerated list item. Internally, it generates an ordered list (same as with begienum/endenum, but shorter) with a single item. You must provide as first argument the item number to be shown. The rest of the line is the content of that item.
Example:
This is a regular paragraph, not in a list.
##number 42 This will be shown as an enumeration item, with the item's number (42) at the begining.
This is a regular paragraph, not in a list.
See also: bullet noitem beginlist beginenum
Adds an image to the content. In HTML output uses the IMG tag. If the first argument ends with %, it will be assumed to be an scale factor and used to change the size of the image (using that argument as value for the width property of the IMG tag). This percentual scale factor is relative to the slide width, not to the original image size. The rest of the line will be considered the image file name (inner spaces include).
Example: adding and image stored in the file "My Picture.png" with a size of approximatelly half the screen/slide width:
##image 50% My Picture.pngExample: adding and image stored in the file "foo/bar.svg" preserving its original size.
##image foo/bar.svgImages' paths will be relative to the output folder generated by sinad (html/). Remember that anything inside the <extra folder is recursivelly copied to that output folder, so you should place your image files there. Image formats allowed will depend on your browser's capabilities, but all common standard formats such as bmp, gif, jpg, png, svg, are supported by modern browsers.
Personal recomendation: For vector content, I suggest usign svg format for being a vectorial one (easier to edit, to scale without loosing quality, and with a smaller file size). If you don't know how to generate svg or edit files, I suggest you use Inkscape, a free, very powerfull and portable svg editor.
The image alignment will depend on what you defined in your style sheet for IMG tag.
Other usefull commands for combining with image are float and timed.
Example: if you want a slide to show several images as "frames", one over the over, each one appearing after a click, you can use:
##float timed image file1.svg
##timed pause float image file2.svg
##timed pause float image file3.svg
##timed pause float image file4.svg
##timed pause float image file5.svg
See also: embed
Embeds a file inside the HTML source using the EMBED tag. Use this instead of image if you need to insert content with some inner javascript behaviour. For instance, an animated SVG file might need to capture some events (such as mouse clicks) to trigger animations. If you insert it as an image, the envets won't work, but if you insert is with embed they'll do.
Example: embedding an animated svg file:
##embed anim.svg
Warnings: You migth need to set the focus to the embeded element (clicking on it) before it starts responding to events. When the embeded content gets the keyboard/mouse focus, your main HTML body will stop receiving its events (unless the embeded content redirects them to the that main body). That usually means that you need to click outside the embeded content in order to advance to the next slide with Enter key, because the base HTML template for the slide (the one defined in base/slide.txt) uses javascript events attached to the HTML's BODY tag to perform such actions.
See also: image
Comment is a command that does nothing; it can be used to comment-out another line by prepending ##comment to it. You can also skip the command's name a just insert the command sequence followed by a whitespace.
Example:
This line is processed and visible.
##comment This one is not.
## neither this another one.
Marks the begining of a table. To introduce a table you must surround its data with commands begintable and endtable. Inside, you must enumerate each cell's content, by row, using newcol command to separate columns inside a row, and newrow command to separate the different table's rows. You can add extra commands after newcol and newrow (as pause to make table's content appear gradually).
Example: a 3x2 table (3 rows, 2 colums), where first row contains "A" and "B", second one "C" and "D", and the last one "E" and "F"; and makes it appear gradually, one row a time:
##begintable
A (Row 1, Col 1)
##newcol
B (Row 1, Col 2)
##newrow pause
C (Row 2, Col 1)
##newcol
D (Row 2, Col 2)
##newrow pause
E (Row 3, Col 1)
##newcol
F (Row 3, Col 2)
##endtable
This command finishes content processing immediatly as if end-of-file was reached (ignoring any following line).