.. You may want to use the usual include line. Uncomment and adjust the path. .. include:: ../Includes.txt ================ EXT:miflowplayer ================ :Author: Ines Willenbrock :Created: 2008-09-24T23:24:14 :Changed by: Michael Schulze :Changed: 2010-02-03T10:18:38 :Classification: miflowplayer :Description: The keywords help with categorizing and tagging of the manuals. You can combine two or more keywords and add additional keywords yourself. Please use at least one keyword from both lists. If your manual is NOT in english, see next tab "language" ---- forEditors (use this for editors / german "Redakteure") forAdmins (use this for Administrators) forDevelopers (use this for Developers) forBeginners (manuals covering TYPO3 basics) forIntermediates (manuals going into more depth) forAdvanced (covering the most advanced TYPO3 topics) see more: http://wiki.typo3.org/doc_template#tags ---- :Author: Michael Schulze :Email: info@michael66.de :Info 4: :Language: en |img-1| |img-2| EXT:miflowplayer - miflowplayer .. _EXT-miflowplayer: EXT:miflowplayer ================ Extension Key: miflowplayer Language: en Keywords: Copyright 2000-2009, Michael Schulze, This document is published under the Open Content License available from http://www.opencontent.org/opl.shtml The content of this document is related to TYPO3 \- a GNU/GPL CMS/Framework available from www.typo3.org .. _Table-of-Contents: Table of Contents ----------------- `EXT:miflowplayer 1 <#1.EXT:miflowplayer|outline>`_ **`Introduction 3 <#1.1.Introduction|outline>`_** `What does it do? 3 <#1.1.1.What%20does%20it%20do_|outline>`_ `Getting started 3 <#1.1.2.Getting%20started|outline>`_ **`Screen shots 5 <#1.2.Screen%20shots|outline>`_** **`Users manual 6 <#1.3.Users%20manual|outline>`_** **`Configuration 7 <#1.4.Configuration|outline>`_** **`Change log 10 <#1.5.Change%20log|outline>`_** .. _Introduction: Introduction ------------ The *miflowplayer* extension enables an easy way to place videos on the webpage by using the Flowplayer. The Flowplayer is an Open Source (GPL 3) video player for the web. For more informations see `http://flowplayer.org `_ . The basic version of the Flowplayer which includes the Flowplayer logo on fullscreen or in the background is free to use. Commercial use is allowed. All licenses including these without any branding can be found here: http://flowplayer.org/download/index.html .. _What-does-it-do: What does it do? ^^^^^^^^^^^^^^^^ One frontend plugin enables the player and you can choose any FLV or F4V video you want. You can define the standard configurations (like size or elements in the control bar) in TypoScript and overwrite them in every plugin. At the moment only the default skin of the Flowplayer is available. Multiple videos on one page are supported. |img-3| |img-4| .. _Getting-started: Getting started ^^^^^^^^^^^^^^^ .. _Install-extension: Install extension """"""""""""""""" Install the latest version from the Repository and include the static EXT-templates. |img-5| No additional database tables or fields are needed and the extension only creates an upload folder for videos and images. .. _Screen-shots: Screen shots ------------ |img-6| |img-7| .. _Users-manual: Users manual ------------ First you have to choose the plugin Flowplayer which is available in the “New content element wizard”. Then choose the video file and the video is ready. All settings you don't edit will be chosen from the TS-Setup. If you want you can define a preview image. This image is only shown if the autostart option is disabled (in tab “Player(Clip)”). By default autostart is disabled. .. _Configuration: Configuration ------------- In TS you can set every configuration from the Flowplayer. At the moment playlists are not supported. All possible configurations for the Flowplayer can be found here: http://flowplayer.org/documentation/configuration/ .. _generated: ((generated)) ^^^^^^^^^^^^^ .. _generated: ((generated)) """"""""""""" .. _Example: Example ~~~~~~~ The original Flowplayer configuration (Javascript) is like this: :: flowplayer("player", "flowplayer.swf", { clip: { autoPlay: false, autoBuffering: true } }); :code:`The TypoScript-Setup is:` :: plugin.tx_miflowplayer.player { // All configs for the flowplayer video config { param { clip { autoPlay = false autoBuffering = true } } } } tt_content.list.20.tx_miflowplayer_player < plugin.tx_miflowplayer.player You can define any parameters from the Flowplayer you want. Another example for the controlbar: :: flowplayer("player", "flowplayer.swf", { plugin: { control: { height: '24px', opacity: 1.0, borderRadius: '0px', autoHide: "always", play: true, volume: true, mute: true } } }); In Typoscript-Setup: :: plugin.tx_miflowplayer.player { // All configs for the flowplayer video config { param { plugin { controls { height = '24px' opacity = 1.0 borderRadius = '0px' autoHide = "always" play = true volume = true mute = true } } } } } tt_content.list.20.tx_miflowplayer_player < plugin.tx_miflowplayer.player .. _General-Video-Settings: General Video Settings """""""""""""""""""""" :: plugin.tx_miflowplayer.player.config.video .. ### BEGIN~OF~TABLE ### .. _width: width ~~~~~ .. container:: table-row Property width Data type integer Description The default width of all videos. This could be changed in every plugin. Default 480 .. _height: height ~~~~~~ .. container:: table-row Property height Data type integer Description The default height of all videos. This could be changed in every plugin. Default 360 .. ###### END~OF~TABLE ###### .. _Parameters: Parameters """""""""" :: plugin.tx_miflowplayer.player.config.param .. ### BEGIN~OF~TABLE ### .. _key: key ~~~ .. container:: table-row Property key Data type string Description If you buy a license than the key has to be placed here. Default .. _clip-autoPlay: clip.autoPlay ~~~~~~~~~~~~~ .. container:: table-row Property clip.autoPlay Data type boolean Description Chose true or false as default for all videos. Default false .. _clip-scaling: clip.scaling ~~~~~~~~~~~~ .. container:: table-row Property clip.scaling Data type string Description Setting which defines how video is scaled on the video screen. Available options are: - fit: Fit to window by preserving the aspect ratio encoded in the file's metadata. - half: Half-size (preserves aspect ratio) - orig: Use the dimensions encoded in the file. If the video is too big for the available space, the video is scaled using the 'fit' option. - scale: Scale the video to fill all available space. Ignores the dimensions in the metadata. This is the default setting. Default “fit” .. _clip-loop: clip.loop ~~~~~~~~~ .. container:: table-row Property clip.loop Data type boolean Description Repeat the video. Default False .. _clip-autoBuffering: clip.autoBuffering ~~~~~~~~~~~~~~~~~~ .. container:: table-row Property clip.autoBuffering Data type boolean Description Flag indicating whether loading of clip into player's memory should begin straight away. When this is trueand autoPlay is falsethen the clip will automatically stop at first frameof the video. Default false .. _clip-fadeInSpeed: clip.fadeInSpeed ~~~~~~~~~~~~~~~~ .. container:: table-row Property clip.fadeInSpeed Data type integer Description Time in milliseconds to fade from zero to full opacity upon commencement of video playback. Default 2000 .. _clip-fadeOutSpeed: clip.fadeOutSpeed ~~~~~~~~~~~~~~~~~ .. container:: table-row Property clip.fadeOutSpeed Data type integer Description Time in milliseconds to fade from full to zero opacity upon completion of video playback. Default 2000 .. _canvas-background: canvas.background ~~~~~~~~~~~~~~~~~ .. container:: table-row Property canvas.background Data type string Description Defines the background of the video stage Default '#000000' .. _plugins-controls-autoHide: plugins.controls.autoHide ~~~~~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.autoHide Data type string Description Hides the controlbar by viewing. Chose “always” or “never”. Default “always” .. _plugins-controls-play: plugins.controls.play ~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.play Data type boolean Description Shows the play button Default true .. _plugins-controls-stop: plugins.controls.stop ~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.stop Data type boolean Description Shows the stop button Default false .. _plugins-controls-volume: plugins.controls.volume ~~~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.volume Data type boolean Description Shows the volume bar Default true .. _plugins-controls-mute: plugins.controls.mute ~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.mute Data type boolean Description Shows the mute button Default true .. _plugins-controls-time: plugins.controls.time ~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.time Data type boolean Description Shows the time Default true .. _plugins-controls-fullscreen: plugins.controls.fullscreen ~~~~~~~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.fullscreen Data type boolean Description Shows the fullscreen button Default true .. _plugins-controls-playlist: plugins.controls.playlist ~~~~~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.playlist Data type boolean Description Shows the playlist buttons (not supported yet) Default false .. _plugins-controls-scrubber: plugins.controls.scrubber ~~~~~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.scrubber Data type boolean Description Shows the timeline Default true .. _plugins-controls-width: plugins.controls.width ~~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.width Data type string Description The width of the controlbar in % or px Default '98%' .. _plugins-controls-bottom: plugins.controls.bottom ~~~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.bottom Data type integer Description Margin-bottom in px Default 5 .. _plugins-controls-left: plugins.controls.left ~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.left Data type string Description Position of controlbar (default center) Default '50%' .. _plugins-controls-borderRadius: plugins.controls.borderRadius ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ .. container:: table-row Property plugins.controls.borderRadius Data type integer Description Round corners of the controlbar Default 15 .. ###### END~OF~TABLE ###### Feel free to add more configurations in your TypoScript. .. _Change-log: Change log ---------- .. _generated: ((generated)) ^^^^^^^^^^^^^ .. _Beta-0-1-1: Beta 0.1.1 """""""""" **Bugfix:** Now the JS-Output is correctly, so the IE7+ can handle it. .. _Beta-0-1-0: Beta 0.1.0 """""""""" - **First version of documentation** - **Clearing Static TypoScript Setup:** .. _Beta-0-0-4: Beta 0.0.4 """""""""" **Bugfix:** In version 0.0.3 the href attribute of the A-Tag was broken so no video could be shown if no preview image was selected. 10 .. ######CUTTER_MARK_IMAGES###### .. |img-1| image:: img-1.png .. :align: left .. |img-2| image:: img-2.png .. :border: 0 .. :height: 21 .. :hspace: 9 .. :id: Grafik2 .. :name: Grafik2 .. :width: 87 .. |img-3| image:: img-3.png .. :align: left .. :border: 0 .. :height: 209 .. :id: Grafik37 .. :name: Grafik37 .. :width: 479 .. |img-4| image:: img-4.png .. :align: left .. :border: 0 .. :height: 339 .. :id: Grafik38 .. :name: Grafik38 .. :width: 512 .. |img-5| image:: img-5.png .. :align: left .. :border: 0 .. :height: 195 .. :id: Grafik1 .. :name: Grafik1 .. :width: 570 .. |img-6| image:: img-6.png .. :align: left .. :border: 0 .. :height: 459 .. :id: Grafik3 .. :name: Grafik3 .. :width: 669 .. |img-7| image:: img-7.png .. :align: left .. :border: 0 .. :height: 460 .. :id: Grafik4 .. :name: Grafik4 .. :width: 669