DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:s5

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
plugin:s5 [2012-11-28 01:19] – old revision restored (2012/11/23 16:39) achplugin:s5 [2023-01-10 18:44] (current) – version upped andi
Line 6: Line 6:
 email      : andi@splitbrain.org email      : andi@splitbrain.org
 type       : render type       : render
-lastupdate : 2009-01-07 +lastupdate : 2022-11-30 
-compatible : 2009-02-14+, Adora Belle+compatible : Adora Belle, binky, ponder stibbons, hrun
 depends    :  depends    : 
 conflicts  conflicts 
Line 13: Line 13:
 tags       : media, slideshow, javascript tags       : media, slideshow, javascript
  
-downloadurl: http://github.com/splitbrain/dokuwiki-plugin-s5/zipball/master +downloadurl: https://github.com/splitbrain/dokuwiki-plugin-s5/zipball/master 
-sourcerepo : http://github.com/splitbrain/dokuwiki-plugin-s5/ +sourcerepo : https://github.com/splitbrain/dokuwiki-plugin-s5/ 
-bugtracker : http://github.com/splitbrain/dokuwiki-plugin-s5/issues+bugtracker : https://github.com/splitbrain/dokuwiki-plugin-s5/issues
 donationurl: http://donate.dokuwiki.org/S5 donationurl: http://donate.dokuwiki.org/S5
 ---- ----
Line 22: Line 22:
  
 This plugin can create [[http://meyerweb.com/eric/tools/s5/|S5 slide show]] presentations from any DokuWiki page. This plugin can create [[http://meyerweb.com/eric/tools/s5/|S5 slide show]] presentations from any DokuWiki page.
- 
  
 ===== Download and Install ===== ===== Download and Install =====
Line 30: Line 29:
 ==== Changes ==== ==== Changes ====
  
-{{rss>http://github.com/feeds/splitbrain/commits/dokuwiki-plugin-s5/master date}}+{{rss>https://github.com/splitbrain/dokuwiki-plugin-s5/commits/master.atom date}}
  
 ===== Configuration ===== ===== Configuration =====
Line 42: Line 41:
 Usage is simple. Just add ''%%~~SLIDESHOW~~%%'' somewhere in the page (at the very top is recommended), and start your page with a H1 headline. Following content will go on the first (welcome) slide. Additional slides are created by H2 headlines. Adding a horizontal rule finishes the current slide and additional content goes to the "Handout" area (only visible when the slide is printed). Footnotes and abbreviation will be ignored on the slide. Plugin output won't be visible unless a plugin handles the mode ''s5'' explicitly. Usage is simple. Just add ''%%~~SLIDESHOW~~%%'' somewhere in the page (at the very top is recommended), and start your page with a H1 headline. Following content will go on the first (welcome) slide. Additional slides are created by H2 headlines. Adding a horizontal rule finishes the current slide and additional content goes to the "Handout" area (only visible when the slide is printed). Footnotes and abbreviation will be ignored on the slide. Plugin output won't be visible unless a plugin handles the mode ''s5'' explicitly.
  
-Have a look at this [[plugin:s5:example|Example Presentation]] (follow the link and press the slideshow icon in the upper right corner).+A template can be selected from within the syntax like this: ''%%~~SLIDESHOW flower~~%%''.
  
 Opera users need to press ''F11'' to enter the presentation mode. Navigating between the slides is then possible using ''PAGE_UP'' and ''PAGE_DOWN''. Opera users need to press ''F11'' to enter the presentation mode. Navigating between the slides is then possible using ''PAGE_UP'' and ''PAGE_DOWN''.
  
-Another option is to insert a link to the s5 view of any page in your template. For example edit: <wiki_dir>/lib/tpl/<your-template>/main.php to add +Another option is to insert a link to the s5 view of any page in your template. For example edit: ''<wiki_dir>/lib/tpl/<your-template>/main.php'' to add 
-<code>+<code html>
 <a href="<?php echo exportlink($ID, 's5')?>" title="online slideshow"><img src="<?php echo DOKU_BASE?>lib/plugins/s5/screen.gif" height="16px" alt="online slideshow"></a> <a href="<?php echo exportlink($ID, 's5')?>" title="online slideshow"><img src="<?php echo DOKU_BASE?>lib/plugins/s5/screen.gif" height="16px" alt="online slideshow"></a>
 </code> </code>
 in the topright div. in the topright div.
  
-===== Specifying theme: == +
-ahmetsacan: In order to specify theme using e.g., ''%%~~SLIDESHOW flower~~%%'', apply the following changes  +
-<code> +
-diff -b -u .s5/renderer.php s5/renderer.php +
---- .s5/renderer.php 2010-02-12 05:54:20.000000000 -0500 +
-+++ s5/renderer.php 2010-02-15 16:46:50.561469800 -0500 +
-@@ -45,7 +45,7 @@ +
-         ); +
-         p_set_metadata($ID,array('format' => array('s5' => $headers) )); +
-         $this->base = DOKU_BASE.'lib/plugins/s5/ui/'; +
--        $this->tpl  = $this->getConf('template'); +
-+        $this->tpl  = isset($_GET['s5theme'])?$_GET['s5theme']:$this->getConf('template'); +
-     } +
-  +
-     /** +
-</code> +
-<code> +
-diff -b -u .s5/syntax.php s5/syntax.php +
---- .s5/syntax.php 2010-02-12 05:54:20.000000000 -0500 +
-+++ s5/syntax.php 2010-02-15 16:44:57.731469800 -0500 +
-@@ -43,7 +43,7 @@ +
-      * Connect pattern to lexer +
-      */ +
-     function connectTo($mode) { +
--        $this->Lexer->addSpecialPattern('~~SLIDESHOW~~',$mode,'plugin_s5'); +
-+        $this->Lexer->addSpecialPattern('~~SLIDESHOW[^~]*~~',$mode,'plugin_s5'); +
-     } +
-  +
-  +
-@@ -51,6 +51,7 @@ +
-      * Handle the match +
-      */ +
-     function handle($match, $state, $pos, &$handler){ +
-+    if($match!='~~SLIDESHOW~~') return array(trim(substr($match,11,-2))); +
-         return array(); +
-     } +
-  +
-@@ -61,7 +62,7 @@ +
-         global $ID; +
-         if($format != 'xhtml') return false; +
-  +
--        $renderer->doc .= '<a href="'.exportlink($ID, 's5').'" title="'.$this->getLang('view').'">'; +
-+        $renderer->doc .= '<a href="'.exportlink($ID, 's5',sizeof($data)?array('s5theme'=>$data[0]):null).'" title="'.$this->getLang('view').'">'; +
-         $renderer->doc .= '<img src="'.DOKU_BASE.'lib/plugins/s5/screen.gif" align="right" alt="'.$this->getLang('view').'" width="48" height="48" />'; +
-         $renderer->doc .= '</a>'; +
-         return true; +
-</code>+
 ===== Using with jsMath ===== ===== Using with jsMath =====
  
Line 104: Line 57:
  
 <code php> <code php>
-<!-- S5 JS -->                                                                                                                                                                                                       +<!-- S5 JS -->                                                                                                            
 // add those two lines: // add those two lines:
-<script type="text/javascript" charset="utf-8" src="'.$this->base.'../../../exe/js.php"></script>                                                                                                                     +<script type="text/javascript" charset="utf-8" src="'.$this->base.'../../../exe/js.php"></script> 
-<script src="'.$this->base.'../../jsmath/script.js" type="text/javascript"></script>    +<script src="'.$this->base.'../../jsmath/script.js" type="text/javascript"></script> 
-                                                                                                                               +<script src="'.$this->base.'default/slides.js" type="text/javascript"></script>
-<script src="'.$this->base.'default/slides.js" type="text/javascript"></script>                            +
 </code> </code>
 +
 ===== Incremental ULs ===== ===== Incremental ULs =====
 +
 just in case you want to show List-Elements one by one put this at the bottom of the page just in case you want to show List-Elements one by one put this at the bottom of the page
  
-<code+<code javascript>
-<html>+
 <script> var uls = document.getElementsByTagName('ul'); <script> var uls = document.getElementsByTagName('ul');
 for(var i=0,j=uls.length;i<j;++i){uls[i].setAttribute('class','incremental')} for(var i=0,j=uls.length;i<j;++i){uls[i].setAttribute('class','incremental')}
 </script> </script>
-</html> 
- 
 </code> </code>
  
 ===== Discussion ===== ===== Discussion =====
 +
   * Is there a way to manually create a new page (with a new H2 headline) or automatically split content in multiple slides (for instance two pages : "H2 Headline (1/2)" and "H2 Headline (2/2)") ?   * Is there a way to manually create a new page (with a new H2 headline) or automatically split content in multiple slides (for instance two pages : "H2 Headline (1/2)" and "H2 Headline (2/2)") ?
     *Another solution would be an option to use H3 headline for new slides.     *Another solution would be an option to use H3 headline for new slides.
 +    * You can try this patch : <code>
 +--- s5/conf/default.php.orig    2015-06-02 18:03:19.062284950 +0200
 ++++ s5/conf/default.php 2015-06-02 17:50:35.406550419 +0200
 +@@ -1,4 +1,5 @@
 + <?php
 +
 + $conf['template'   = 'dokuwiki';
 ++$conf['maxHeaderLevelForNewSlide'   = 3;
 +
 +--- s5/renderer.php.orig        2015-06-02 17:44:20.952724847 +0200
 ++++ s5/renderer.php     2015-06-02 18:02:06.229923670 +0200
 +@@ -18,6 +18,7 @@
 +     var $slideopen = false;
 +     var $base='';
 +     var $tpl='';
 ++    var $lastH2='';
 +
 +     /**
 +      * the format we produce
 +@@ -121,7 +122,7 @@
 +     /**
 +      * This is what creates new slides
 +      *
 +-     * A new slide is started for each H2 header
 ++     * A new slide is started for each Hx header, where x <= configuration parameter "maxHeaderLevelForNewSlide"
 +      */
 +     function header($text, $level, $pos) {
 +         if($level == 1){
 +@@ -133,12 +134,19 @@
 +             }
 +         }
 +
 +-        if($level == 2){
 ++        if($level <= $this->getConf('maxHeaderLevelForNewSlide')){
 +             if($this->slideopen){
 +                 $this->doc .= '</div>'.DOKU_LF; //close previous slide
 +             }
 +             $this->doc .= '<div class="slide">'.DOKU_LF;
 +             $this->slideopen = true;
 ++
 ++            if ($level == 2) {
 ++                $this->lastH2 = $text;
 ++            } else {
 ++                $level = 2;
 ++                $text = $this->lastH2 . " - " . $text;
 ++            }
 +         }
 +         $this->doc .= '<h'.($level-1).'>';
 +         $this->doc .= $this->_xmlEntities($text);
 +@@ -149,7 +157,7 @@
 +      * Top-Level Sections are slides
 +      */
 +     function section_open($level) {
 +-        if($level < 3){
 ++        if($level <= $this->getConf('maxHeaderLevelForNewSlide')){
 +             $this->doc .= '<div class="slidecontent">'.DOKU_LF;
 +         }else{
 +             $this->doc .= '<div>'.DOKU_LF;
 +</code>
   * There is a colision with the html5 plugin. When it is on, the button for starting is not visible.   * There is a colision with the html5 plugin. When it is on, the button for starting is not visible.
   * Is there a way to end the slideshow and get back to the page?   * Is there a way to end the slideshow and get back to the page?
 +    * -> there is: hit "back" or, on FF, Alt + left arrow to return to the page.
 +
 +==== Any chance to have <class=incremental> ?====
 +
 +Due to http://meyerweb.com/eric/tools/s5/features.html "Incremental display", example in http://meyerweb.com/eric/tools/s5/s5-intro.html on page 9, s5 is capable to "show the bullet points one at a time".
 +
 +Is there a way to have this for the s5 plugin?
 +
 + --- [[user>coastGNU|Thomas Templin]] //2016-04-10 21:30//
plugin/s5.1354061972.txt.gz · Last modified: 2012-11-28 01:19 by ach

Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
CC Attribution-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki