diff --git a/src/plugins/GettingStarted.md b/src/plugins/GettingStarted.md deleted file mode 100644 index 64c91a8..0000000 --- a/src/plugins/GettingStarted.md +++ /dev/null @@ -1,608 +0,0 @@ -# Plugins -impress.js has a plugin system that allows you to expand its functionality. It ships with some default plugins which are activated by default, but there are more plugins which you can find [here](/extras/). You may learn how to activate those plugins by reading [this](#extra-plugins). Here you can see all the collected plugin READMEs and Documentation from the js files. I have added a note, where I have added my own documentation and where I have changed something. - -## CONTENTS - -* [Autoplay](#autoplay) -* [Blackout](#blackout) -* [Form](#form) -* [Fullscreen](#fullscreen) -* [Goto](#fullscreen) - - - -# Main plugins -## Autoplay -*This documentation here was not authored by the creator of the plugin* - -The [autoplay](/src/plugins/autoplay/autoplay.js) plugin automatically advances the presentation after a certain timeout expired. - -**USAGE** - -You first have to enable the plugin by setting a global ```data-autoplay``` value on the impress-div. Then you can change individual ```data-autoplay``` values on each *step* by adding ```data-autoplay``` to it. If this value is set to ```0```, there will be no more auto-advancing on this *step*. The value you enter is time in seconds to switch to the next slide. - -**EXAMPLE** - -Note: This only shows part of the HTML. If you want to know how to set up a presentation, I highly recommend you read our [Getting Started Guide](/GettingStarted.md) -``` -
-
- This slide will not auto-advance -
-
- This slide will auto-advance at the globally defined rate. -
-
- This slide will auto-advance after 10 seconds -
-
-``` - - -## Blackout -*This documentation here was not authored by the creator of the plugin* - -This plugin is automatically enabled and runs whenever you start your presentation. You can press *B* or *.* on your keyboard to blank / unblank the screen. - - -## Form -Form support! Functionality to better support use of input, textarea, button... elements in a presentation. - -This plugin does two things: - -Set stopPropagation on any element that might take text input. This allows users to type, for example, the letter 'P' into a form field, without causing the presenter console to spring up. - -On impress:stepleave, de-focus any potentially active element. This is to prevent the focus from being left in a form element that is no longer visible in the window, and user therefore typing garbage into the form. - -***THIS PLUGIN REQUIRES FURTHER DEVELOPMENT*** - - TODO: Currently it is not possible to use TAB to navigate between form elements. Impress.js, and - in particular the navigation plugin, unfortunately must fully take control of the tab key, - otherwise a user could cause the browser to scroll to a link or button that's not on the current - step. However, it could be possible to allow tab navigation between form elements, as long as - they are on the active step. This is a topic for further study. - -## Fullscreen -*This documentation here was not authored by the creator of the plugin* -This plugin puts your presentation into fullscreen by pressing *F5*. You can leave fullscreen again by pressing *Esc*. - -*Note:* impress.js works just fine with the normal fullscreen offered by your browser where you would (usually) press *F11* to enter it. There are certain circumstances where you might want to use this plugin instead, as it should work with the impressConsole plugin as well. - - - -## Goto -The goto plugin is a pre-stepleave plugin. It is executed before -`impress:stepleave` event, and will alter the destination where to transition next. - -Example: - - -
- - -
- - -
- -See https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key/Key_Values for a table -of what strings to use for each key. - -***Author:*** - -Copyright 2016 Henrik Ingo (@henrikingo) - - -## Help -Shows a help popup when a presentation is loaded, as well as when 'H' is pressed. - -To enable the help popup, add following div to your presentation: - -
- -Example CSS: - - .impress-enabled #impress-help { - background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5); - color: #EEEEEE; - font-size: 80%; - position: fixed; - left: 2em; - bottom: 2em; - width: 24em; - border-radius: 1em; - padding: 1em; - text-align: center; - z-index: 100; - font-family: Verdana, Arial, Sans; - } - .impress-enabled #impress-help td { - padding-left: 1em; - padding-right: 1em; - } - - - -***Author:*** - -Copyright Henrik Ingo (@henrikingo), 2016 - - -## impressConsole -Press 'P' to show a speaker console window. - -* View of current slide -* Preview of next slide -* Speaker notes (contents of a
element on current slide) -* Navigation - -For speaker notes, add the following anywhere inside a step - -
Speaker notes text...
- -Example CSS: - - /* Hide notes from the actual presentation. This will not affect the visibility of notes in the impress console window. */ - - .notes { - display: none; - } - - - -***Authors:*** -* Henrik Ingo, henrik.ingo@avoinelama.fi, impress.js (plugin) integration -* Heiko Richler, Aico.Richler@gmx.net, major changes in rev. 1.3 -* Lennart Regebro, regebro@gmail.com, main author of impressConsole -* David Souther, davidsouther@gmail.com, author of the original notes.js - - -## Media -This plugin will do the following things: - - Add a special class when playing (body.impress-media-video-playing and body.impress-media-video-playing) and pausing media (body.impress-media-video-paused and body.impress-media-audio-paused) (removing them when ending). This can be useful for example for darkening the background or fading out other elements while a video is playing. Only media at the current step are taken into account. All classes are removed when leaving a step. -- Introduce the following new data attributes: - - data-media-autoplay="true": Autostart media when entering its step. - - data-media-autostop="true": Stop media (= pause and reset to start), when leaving its step. - - data-media-autopause="true": Pause media but keep current time when leaving its step. - -When these attributes are added to a step they are inherited by all media on this step. Of course this setting can be overwritten by adding different attributes to inidvidual media. - -The same rule applies when this attributes is added to the root element. Settings can be overwritten for individual steps and media. -Examples: -- data-media-autoplay="true" data-media-autostop="true": start media on enter, stop on leave, restart from beginning when re-entering the step. -- data-media-autoplay="true" data-media-autopause="true": start media on enter, pause on leave, resume on re-enter -- data-media-autoplay="true" data-media-autostop="true" data-media-autopause="true": start media on enter, stop on leave (stop overwrites pause). -- data-media-autoplay="true" data-media-autopause="false": let media start automatically when entering a step and let it play when leaving the step. -- ```
...
``` - All media is startet automatically on all steps except the one that has the data-media-autoplay="false" attribute. -- Pro tip: Use ```