====== Carousel ======
[[doku>plugin:mikioplugin|Mikio Plugin]]

https://github.com/nomadjimbob/mikioplugin/wiki/Carousel

A carousel item. By default images in the carousel are set to be contained within the element.
<carousel>
<carousel-item image=":syntax:district.jpg" title="Slide 1 title" text="this is some text" url="http://github.com">
<carousel-item image=":syntax:district.jpg" title="Slide 2 title" text="the text">
</carousel>
<code ->
<carousel>
<carousel-item image=":syntax:district.jpg" title="Slide 1 title" text="this is some text" url="http://github.com">
<carousel-item image=":syntax:district.jpg" title="Slide 2 title" text="the text">
</carousel>

</code>

===== Attributes (Carousel) =====

**controls**: True or false to show the left/right controls (default is true)\\ **indicators**: True, false or circle to show the slide indicators (default is true)\\ **start**: Automatically start the carousel transitions\\ **slide**: Use the sliding effect when transitioning between slides\\ **fade**: Use the fade effect when transitioning between slides\\ **cover**: True or false to use the image to cover the space instead of contain the entire image\\ **control-color**: The control colour. Default is white\\ **control-outline-width**: The control outline width. Default is 0.2px\\ **control-outline-color**: The control outline colour. Default is black

===== Attributes (Carousel Item) =====

**background-color**: The slides background color. Can be in the format of%% %%''HEX''%% %%or%% %%''RGBA''\\ **delay**: Seconds before automatically transitioning to the next slide (default is 5 seconds)\\ **image**: The slides background image\\ **placeholder-text**: The text to display on the slides background. This is ignored when the%% %%''image''%% %%attribute is used\\ **title**: Title text displayed on the slide\\ **text**: Slide text displayed on the slide\\ **url**: The URL to open when the user clicks on the slide\\ **cover**: True or false to use the image to cover the space instead of contain the entire image

====== Dynamically Built Carousels ======

Since 2021-11-13, The Carousel element supports a dynamic tag which will create a Carousel dynamically from the title and image of pages under a namespace. When building a dynamic carousel, no elements should be included.

**dynamic**: Namespace of the pages to use as slides. Each slide will use the page title and first image. The slide will link to that page when clicked. Only pages directly under the namespace are used, with permissions taken into account\%% %%**dynamic-prefix**: The prefix text (if any) to include on the slide title (default is none)\\ **dynamic-start**: The starting page count. Useful if you only want to include a certain range of pages (default is 1)\\ **dynamic-count**: The amount of pages to include. Useful if you only want to include a certain range of pages (default is unlimited)\

**Example**%% %%''<carousel dynamic=portfolio:grumpus dynamic-prefix="IMAGINED THING"></carousel>''

Will create a dynamic carousel using each page under the portfolio:grumpus namespace with the title of each slide prefixed with the text IMAGINED THING.

**NOTE**%% %%Pages that have a dynamic carousel will require the directive%% %%''~~NOCACHE~~''%% %%so page caching is not used.

====== Full Page Carousel ======

There is now a special view that can be used to display a carousel full page for use in site embeds or showing on a public display.

Create your carousel as per usual on a wiki page, then use the URL%% %%''/lib/plugins/mikioplugin/carousel.php?id=<&lt>PAGE_ID<&gt>''. This will display the first carousel on that wiki page as a full page carousel.

**Example**%% %%If I have created a carousel at%% %%''/doku.php?id=portfolio:grumpus:start'', to display this as a full page carousel, I would navigate my browser to%% %%''/lib/plugins/mikioplugin/carousel.php?id=portfolio:grumpus:start''

**Multiple Carousels**%% %%The Full Page Carousel also supports a carousel parameter (''&carousel=<INDEX>''). By default, the first carousel on the page is used, however if you wish to instead use a different carousel, include this parameter and the carousel number (starting at 1).