Blackboard2 is a simple math oriented presentation web application. It enables dynamic slide creation and manipulation in real time. Blackboard2 can also be used as a traditional presentation software where the content of the slide is prepared before presentation
Next: Getting started [Contents]
| • Getting started | ||
| • Commands |
The easiest method to access Blackboard2 is to visit the Blackboard2 website.
The following sections are intended to help you can start creating your presentations.
Next: How to edit existing elements, Up: Getting started [Contents]
Blackboard2 allows to add and manipulate a few different elements, the two
most often used are comment and math elements. To add
those two elements you use n and $ commands, respectively.
To finish element creation, use enter command. You can use
g command to position newly added elements where you see it fit.
Next: Latex commands, error correction, direct editing, Previous: How to add Math and Comment elements, Up: Getting started [Contents]
To re-open an element for additional editing, Blackboard2 assigns tab command. After necessary changes are made, use enter to finish editing.
Next: Running presentation, Previous: How to edit existing elements, Up: Getting started [Contents]
Next: Cursor and Selection controls, Previous: Latex commands, error correction, direct editing, Up: Getting started [Contents]
Next: Save content of your slide, load saved content, Previous: Running presentation, Up: Getting started [Contents]
Next: Delimiters and sizes, Previous: Cursor and Selection controls, Up: Getting started [Contents]
Blackboard2 uses Dropbox to store your content. You have to have a Dropbox account and you have to authorise Blackboard2 to have access to dedicated folder in your Dropbox storage.
Next: Image manupulation, Previous: Save content of your slide, load saved content, Up: Getting started [Contents]
Blackboard2 provides an extremely quick method of typing delimiters and changing delimiters sizes. The method is based on Snippet Commands and ctrl+up and ctrl+down commands. Have a look at the following short demonstration.
Next: Element selection explained, Previous: Delimiters and sizes, Up: Getting started [Contents]
Blackboard2 gives two methods to embed images into your slides. You can embed svg images which you pre-uploaded to your Dropbox account (i command). You can also embed images by given URI’s to those images (I command). The second method is particularly useful to embed Geogebra graphs (both 2d and 3d).
Next: How to preload slide, Previous: Image manupulation, Up: Getting started [Contents]
Blackboard2 implements follow-mouse selection method. You can select multiple elements by holding shift key down. You can also select multiple elements using box selection which is bound to B keyboard shortcut. To de-select everything on your slide, use esc esc command.
Next: How add Blackboard2 to your an html page, Previous: Element selection explained, Up: Getting started [Contents]
You can specify the document to pre-load using ’id’ URL parameter, you can find out the value of this parameter using ’e’ top-level key command:
http://bb2.durackpl.com/BB/?id=id%3A7wS2mymfHBAAAAAAAAAEiA
or, you can give the path explicitly:
http://bb2.durackpl.com/BB/?id=%2Fpath%2Fto%2Ffile...
If you need the content to be veiled at the start, supply the URL parameter ’veil=T’:
http://bb2.durackpl.com/BB/?id=id%3A7wS2mymfHBAAAAAAAAAEiA&veil=T
Next: Configuration File, Previous: How to preload slide, Up: Getting started [Contents]
You can add Blackboard2 functionality to any html page by adding the following line to head section:
<base href='https://bb2.durackpl.com/BB/'>
<script data-main='main.js' src='require.js'></script>
and the following line to body section:
<div id='bb2appA'></div>
<div id='bb2appB'></div>
If you need to load the content of a presentation at the start, add
data-bb2-src parameter to the line above as follows:
<script data-bb2-src='/path_to_content.txt' data-main='main' src='require.js'></script>
In the latter case, the content will be loaded from the corresponding file stored in your Dropbox storage.
Alternatively, you can supply the initial content of the presentation by
directly embedding the content into your html page. In order to do so,
add the following block at the end of your body section:
<pre data-bb2-content> ... JSON encoded presentation content ... </pre>
You can access JSON encoded content of your presentation by directly opening the Dropbox file of your presentation of by using export function of Blackboard2 (toplevel command ’E’).
If you need the content to be veiled at the start add
data-bb2-veil attribute to ’script’ tag above.
Some Blackboard2 functionality will not be available if you embed Blackboard2 app to your page. For instance, screenshot generation (S command) is processed through remote server. The server responds with ’Access-Control-*’ headers in accordance with CORS specifications. Such response will be declined by major browsers if it is made from your own website.
Previous: How add Blackboard2 to your an html page, Up: Getting started [Contents]
The file config.json must be accessible through the uri
[[host]]/BB/config.json in order for the app to work on your
webpage. Currently the following values are supported in the config
file:
Location of the backend server:
{
"appserv-host" : "https://durackpl.com"
}
Previous: Getting started, Up: Top [Contents]
Blackboard2 is driven by commands/keyboard shortcuts. The following sections describe currently active commands:
| • Toplevel Commands | ||
| • Pathname Commands | ||
| • Player Commands | ||
| • Note Commands | ||
| • IFrame Commands | ||
| • Advance TeX Editing | ||
| • Raw TeX Editing | ||
| • Matrix Input | ||
| • Active Abbreviations |
Next: Pathname Commands, Up: Commands [Contents]
Toplevel level commands are active from the moment the application is completely loaded. The toplevel commands are suspended when an element is open for editing; a dialogue is active; or typing simulation (playing) is active and etc.
Shows a small text buffer with the content of the element. The content is selected and focused. So, the subsequent typing ctrl+c copies the content to the clipboard. This is useful to quickly copy content to other software. Click any place on the screen for the text buffer to disappear. In case multiple elements are selected, then the content is concatenated in the order of selections.
Box select.
Show canvas link.
Download canvas screenshot
Exports canvas content.
Undo the latest change to the current document.
Aligns selected elements horizontally. The first selected elements is used as anchor.
Distributes selected elements vertically. The first selected element is used as anchor.
Distributes selected elements horizontally. The first selected element is used as anchor.
Distributes selected elements vertically. The first selected element is used as anchor.
Raise selected element. In case more than one element is selected, the action is applied to the last selected element.
Lower selected element. In case more than one element is selected, the action is applied to the last selected element.
Order widgets by size, so that every one is visible.
Shows widget context menu.
Resets scaling of the selected element. In case more than one element is selected, the action is applied to the last selected element.
Scales up the selected element by 10%. In case more than one element is selected, the action is applied to the last selected element.
Scales down the selected element by 10%. In case more than one element is selected, the action is applied to the last selected element.
New document.
Saves the content of the current document to your Dropbox.
Saves the content of the current document to a new file on your Dropbox.
Loads document from your Dropbox.
Cancels current selection.
Adds new widgets encoded as json with json interactively requested through a dialog.
Adds new TeX with content interactively requested through a dialog.
Adds new TeX element to the current document and starts editing.
Adds new image element to the current document. The image is assumed to be SVG and is loaded from your Dropbox. When this action is activated, a dialogue asking for path to the image pops up. If the path is relative, it is assumed to be relative to the location of the current document.
Adds new web image element.
Shows embedded black webpage.
Shows embedded geogebra page.
Shows embedded wikipedia page.
Adds new NOTE element to the current document and starts editing.
Deletes the selected element. In case more than one element is selected, the action is applied to the last selected element.
Deletes all the selected elements.
Starts editing the selected element.
Duplicates active widget and activates moving action of the duplicate. To complete the move, left click on the document. In case more than one element is selected, the action is applied to the last selected element.
Activates moving action of the selected element. To complete the move, left click on the document. In case more than one element is selected, the action is applied to the last selected element.
Activates moving all the selected elements, keeps relative positions. To complete the move, left click on the document.
Starts typing simulation (play) of the selected element. If the element is veiled, unveils the element first. In case more than one element is selected, the action is applied to the last selected element.
Toggles ’veil’/’unveil’ state of the selected element. In case more than one element is selected, the action is applied to the last selected element.
Veils every element of the current document.
Unveils every element of the current document.
Blackboard2 implements "follow mouse" selection method: to select an element pause the pointer on it; to de-select, move the pointer away from the element. In case, you need multiple elements selected, hold SHIFT down while moving pointer off the element.
Holding ’z’ down actives ’hint’-ing of veiled elements. Otherwise, if an element is ’hint’-ed, then moving a pointer over such element activates hinting.
Actives ’tracing’ temporarily. This is a mechanism which shows (temporarily) a free-drawn red line which follows you pointer on the document. This line is useful if you need to draw your viewer’s attention to a particular place on your presentation (similar to laser pointer in traditional presentation).
Next: Player Commands, Previous: Toplevel Commands, Up: Commands [Contents]
Pathname commands are active when you enter/edit pathname to a file with the content of your document.
Completes pathname as far as possible without ambiguity.
Deletes one last section of pathname.
Next: Note Commands, Previous: Pathname Commands, Up: Commands [Contents]
This short set of commands is active when an element is being “played”. Once element is finished “playing”, toplevel set of commands is activated.
Speeds up simulated typing.
Suspend/resume playing.
Actives ’tracing’ temporarily. This is a mechanism which shows (temporarily) a free-drawn red line which follows you pointer on the document. This line is useful if you need to draw your viewer’s attention to a particular place on your presentation (similar to laser pointer in traditional presentation).
Next: IFrame Commands, Previous: Player Commands, Up: Commands [Contents]
Currently, there is only one command active while a note/comment element is being edited. The command is ’enter’ and it finishes element editing and activates toplevel set of commands.
Close editing of Note element.
Next: Advance TeX Editing, Previous: Note Commands, Up: Commands [Contents]
This set of commands is active when an iframe element is being “edited”.
Change iframe uri.
Close editing of iframe element.
Increment/decrement width and height of iframe element.
Faster increment/decrement width and height of iframe element.
Next: Raw TeX Editing, Previous: IFrame Commands, Up: Commands [Contents]
This is the set of commands which allows fast editing of latex/math elements. Please note that most of the commands are only active when the underlying latex is valid. If the underlying latex is invalid, then an “undo” command must be called to bring the element to the latest valid state.
| • Snippet Commands | ||
| • Backquote Commands |
Undo the latest change to the element; if element is ’invalid’ then endues element content until the latest ’valid’ state.
Starts raw editing mode. This mode allows direct editing of latex content. To complete raw editing press ’enter’ to commit changes; or ’esc’ to return back to the state before raw editing started. Changes cannot be committed unless the latex content is valid.
Activates abbreviation; if abbreviation is not detected, regular space inserted.
Cuts selection and adds it to clipboard. Every next ’cut’ adds more content to clipboard.
Pastes the latest added content of clipboard.
Removes the latest added content from clipboard and pastes the next added content.
Increases the size of delimiters. For this action, the closest pair of delimiters around the active selection or cursor.
Decreases the size of delimiters. For this action, the closest pair of delimiters around the active selection or cursor.
Moves cursor right to the next legitimate position. That is, the position where changes (inserts/deletes) can be made without changing validity of latex content.
Moves cursor left to the previous legitimate position. That is, the position where changes (inserts/deletes) can be made without changing validity of latex content.
Deletes content before cursor, ensures that the cotnent of the element is valid after deletion.
Moves cursor to the next marked position.
Moves cursor to the previous marked position.
Completes element editing.
Starts matrix input method. The question mark ’?’ stands for one of the following characters which defines which environment is used:
align
array
bmatrix
Bmatrix
matrix
pmatrix
vmatrix
Vmatrix
cases
Activates selection sensor.
Activates cursor sensor.
Next: Backquote Commands, Up: Advance TeX Editing [Contents]
Snippets are substirings of valid latex which have some places
marked with marker <<>>. Also, every snippet has the marker
<<>> at the end. Once a snippet is added to math element, cursor
can be quickly moved between marked positions by tab and
shft+tab commands.
Inserts bars \langle<<>>\rangle with tabbing
Inserts bars ||<<>>|| with tabbing
Inserts bars |<<>>| with tabbing
Inserts parentheses (<<>>) with tabbing
Inserts tex group {<<>>} with tabbing
Inserts brackets [<<>>] with tabbing
Inserts subscript _<<\mathstrut>> with tabbing
Inserts superscript ^<<\mathstrut>> with tabbing
Inserts braces \{<<>>\} with tabbing
Previous: Snippet Commands, Up: Advance TeX Editing [Contents]
Backquote commands is a subset of advanced TeX editing commands and is copied (with minor alterations) from the Emacs AucTeX major mode. This set of commands especially efficient with Greek alphabet.
\quad
\qquad
\mathstrut
\alpha
\beta
\gamma
\delta
\epsilon
\zeta
\eta
\theta
\kappa
\lambda
\mu
\nu
\xi
\pi
\rho
\sigma
\tau
\upsilon
\phi
\chi
\psi
\omega
\varepsilon
\vartheta
\varpi
\varrho
\varsigma
\varphi
\Gamma
\Delta
\Theta
\Lambda
\Xi
\Pi
\Sigma
\Upsilon
\Phi
\Psi
\Omega
\times
\cdot
\cap
\cup
\vee
\wedge
\setminus
\leq
\geq
\subset
\supset
\subseteq
\supseteq
\in
\leftarrow
\Leftarrow
\rightarrow
\Rightarrow
\longleftarrow
\Longleftarrow
\longrightarrow
\Longrightarrow
\uparrow
\Uparrow
\downarrow
\Downarrow
\colon
\nabla
\forall
\infty
\emptyset
\exists
\not
\cos
\det
\exp
\inf
\lim
\sin
\sup
\tan
\langle
\rangle
\hat
\tilde
\varGamma
\varDelta
\varTheta
\varLambda
\varXi
\varPi
\varSigma
\varUpsilon
\varPhi
\varPsi
\varOmega
Next: Matrix Input, Previous: Advance TeX Editing, Up: Commands [Contents]
This set of commands is active when you edit raw (latex) math element content. Please note that enter command proceeds only if the underlying latex is valid.
Cancels raw editing without changing element content.
Finishes raw editing and updates element content.
Next: Active Abbreviations, Previous: Raw TeX Editing, Up: Commands [Contents]
One single command to cancel matrix input control.
Cancels matrix input.
Previous: Matrix Input, Up: Commands [Contents]
The following combinations are not commands but abbreviations.
That is, you type iff followed by space and it is replaced
with the corresponding snippet. Make sure you type
abbreviation after a non-word character, otherwise the
abbreviation will not be detected.
expands to \quad \Leftrightarrow \quad
expands to \quad \Rightarrow \quad
expands to \quad \Leftarrow \quad
expands to \frac {<<\mathstrut >>}{<<\mathstrut >>}<<!>>
expands to \sqrt {<<\mathstrut >>}<<!>>
expands to \mathrm {<<>>}<<!>>
expands to \mathbb <<\mathstrut>>
expands to \mathbf <<\mathstrut>>
expands to \mathcal <<\mathstrut>>
expands to \ldots
expands to \vdots
expands to \ddots
expands to \partial
expands to \quad \mathrm{and}\quad
expands to \quad \mathrm{or}\quad
expands to \int_{<<\mathstrut >>}^{<<\mathstrut >>} <<!>>\, \mathrm{d} <<!>>
expands to \iint_{<<\mathstrut >>}^{<<\mathstrut >>} <<!>>\, \mathrm{d} <<!>>
expands to \iiint_{<<\mathstrut >>}^{<<\mathstrut >>} <<!>>\, \mathrm{d} <<!>>
expands to \oint_{<<\mathstrut >>}^{<<\mathstrut >>} <<!>>\, \mathrm{d} <<!>>
expands to \frac{\mathrm{d} <<>>}{\mathrm{d} <<>>} <<!>>
expands to \frac{\partial <<>>}{\partial <<>>} <<!>>
expands to \lim_{<<>> \rightarrow <<>>} <<>>
expands to \vec {<<\mathstrut >>} <<!>>