DEPRECATION WARNING

This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.

EXT: Video Basic (Imagine virtual services)

Created:2009-06-15T15:24:59
Changed:2009-06-25T17:51:03
Classification:dam_ivs_videobasic
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 ----
Keywords:keywords comma-separated
Author:Sebastian Siebert
Email:ss@imagine-vs.de
Info 4:
Language:en, de

img-1 img-2 EXT: Video Basic (Imagine virtual services) - dam_ivs_videobasic

EXT: Video Basic (Imagine virtual services)

Extension Key: dam_ivs_videobasic

Language: en, de

Keywords: keywords comma-separated

Copyright 2009, Sebastian Siebert, <ss@imagine-vs.de>

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

EXT: Video Basic (Imagine virtual services) 1

`Introduction 3 <#1.1.Introduction|outline>`_

What does it do? 3

Requirements 3

Screenshots 3

`Users manual 4 <#1.2.Users%20manual|outline>`_

Add a new video to dam 4

Add a new video to content 6

FAQ 7

`Administration 8 <#1.3.Administration|outline>`_

FAQ 8

`Configuration 9 <#1.4.Configuration|outline>`_

FAQ 9

Reference 10

`Known problems 12 <#1.5.Known%20problems|outline>`_

`To-Do list 13 <#1.6.To-Do%20list|outline>`_

`ChangeLog 14 <#1.7.ChangeLog|outline>`_

Introduction

What does it do?

This extension handles the videos with encoding server und shows those in a flash player NonverBlaster. Required extension is Media (DAM).

Requirements

  • Server with access via SSH
  • PHP >= 5.2.0
  • ffmpeg >= 0.5
  • qt-faststart (Tool is included in the source of ffmpeg)
  • gcc (we need it to build the tool qt-faststart)
  • cronjob

Screenshots

See next chapter “Users manual”

Users manual

Add a new video to dam

Module File → go to video directory (if doesn't exist, create a folder called “video”)

Select in the drop down field “Upload”

Select a video to upload on the webserver

Module “File” → select the uploaded video to edit. img-3

Fill in the video information for the title and description. This information will used in front end content: img-4

Go to the tab “Video (Basic)” img-5 **Description:**

Encode → Set to encode the video into MP4-Format. If you save the information of video, it will be send the information to video encoding server (See chapter “Configuration of the dam_ivs_videobasic extension”)

Location → In this basic variant is only local available. If you wish to upgrade to professional variant, you can select a content delivery network called “amazon web services” too. (Please contact us for more information to upgrade to “Video Pro”)

Screenshot → After encoding process you can select a screenshot under the folder called encoded_basic_(videoname)

Directory (Stream) → Show the path to the video (not editable)

Filename (Stream) → Show the filename of the video (not editable)

Width → Show the width of the video (not editable).

Height → Show the height of the video (not editable).

Status → This is the encoding status of the video. Possible status information: submitted, wait (encoding), encoding error, ready

Save the additional information

Add a new video to content

Module Page → create a new element as “Regular text element”

Switch the type to “Video Basic (Flash)” img-6

Switch to the tab “Video (Basic)” img-7 Video → Select the uploaded video and add it to media field Position → Set the position of the flash player. Possible are center, right, left

FAQ

No FAQ for User available

Administration

Please install the Media (DAM) extension (dam) with the Extension Manager:

Go to Extension Manager (Ext Manager)

Select in the dropdown field “import extensions”

Put into the textfield: “dam” (without quotes)

Install the dam extension called as “Media (DAM)” in the category “Backend Modules”

This extensions for dam are recommend:

  • MediaCategories (dam_catedit)
  • DAM for Content Elements (dam_ttcontent)

Installation of the dam_ivs_videobasic extension:

Install the dam_ivs_videobasic extension with the Extension Manager

Include static (Video Basic (dam_ivs_videobasic)) from this extension to your template configuration

Build qt-faststart from ffmpeg-tools (Shell)

Download the source code from ffmpeg http://ffmpeg.org/download.html

Unpack the archive: tar xvf ffmpeg-0.5.tar.bz2

Change to directory: cd ffmpeg-0.5/tools

Compile the tool: gcc qt-faststart.c -o qt-faststart

Install the tool with root: install -m 755 qt-faststart /usr/bin/qt- faststart

FAQ

No FAQ for Administration available.

Configuration

Configuration the encoding script:

  • You need a webserver via SSH to create a cronjob. The server have to access the part of the encoding script from network.
  • Unpack the archiv on the webserver ./dam_ivs_videobasic/3rdparty/typo3video.tar.bz2
  • Type into the shell: crontab -e
  • Insert follow line into the editor: */5 * * * * /usr/bin/php -f /path/to/your/script/typo3videobasic_cronjob.php >> /var/log/typo3video.log
  • Create a new database for the encoding script p.e. typo3video
  • Import the create.sql into the database “typo3video” (included in the tar.bz2-Archive)
  • It's expressly recommended to create a new user for the created database “typo3video”.
  • Set in the configuration the database access, the path to the applications and the URL of encoding server: /path/to/your/script/typo3video/config/config.php

Add a project to your encoding server (Shell):

/path/to /your/script/typo3video_command.php add (projectname)

Create a new hash (Shell):

/path/to /your/script/typo3video_command.php renewhash (projectname)

Remove a project with all their files (Shell):

/path/to /your/script/typo3video_command.php remove (projectname)

Configuration of the dam_ivs_videobasic extension:

  • URL to the encoding server (without typo3video.php): p.e. http://www.sitename.com/
  • Project hash (see “Configuration the encoding script”). p.e. 2227C83e7a9856590c3076cf0be5af3f
  • Number of screenshots from video (Integer): p.e. 10
  • Set the video width as pixel for embed flash (It's affected the encoded video too): p.e. 352

img-8

FAQ

No FAQ for Configuration available

Reference

TypoScript Configuration for plugin.tx_damivsvideobasic_pi1

ampersand

Property

ampersand

Data type

string

Description

Sets the ampersands in documents. Possible parameters: html, xhtml

Default

xhtml

flashParams.quality

Property

flashParams.quality

Data type

string

Description

Sets the quality of the video. Possible parameters: low, high, autolow, autohigh, best

Default

high

flashParams.allowscriptaccess

Property

flashParams.allowscriptaccess

Data type

string

Description

Sets the security restriction to Flash. Possible parameters: always, sameDomain, never

Default

always

flashParams.wmode

Property

flashParams.wmode

Data type

string

Description

Sets the window mode property of the Flash movie in the browser: Possible parameters: window, opaque, transparent

Default

transparent

flashParams.swliveconnect

Property

flashParams.swliveconnect

Data type

boolean

Description

Sets this parameter for running Flash and Javascript on same time. Possible parameters: true, false

Default

true

flashParams.allowfullscreen

Property

flashParams.allowfullscreen

Data type

boolean

Description

Sets to allowed to display Flash in fullscreen mode. Possible parameters: true, false

Default

true

flashParams.scale

Property

flashParams.scale

Data type

string

Description

Sets for resize the video. Possible parameters: showall, noborder, exactfit

Default

default

flashVars.allowsmoothing

Property

flashVars.allowsmoothing

Data type

boolean

Description

Sets for allowed smoothing: Possible values: true, false

Default

true

flashVars.autoplay

Property

flashVars.autoplay

Data type

boolean

Description

Sets to play the video immediately after the DOM-Object are ready. Possible values: true, false

Default

false

flashVars.buffer

Property

flashVars.buffer

Data type

integer

Description

Sets the buffer as time in second

Default

3

flashVars.showtimecode

Property

flashVars.showtimecode

Data type

boolean

Description

Sets to show Timecode. Possible values: true, false

Default

true

flashVars.loop

Property

flashVars.loop

Data type

boolean

Description

Sets to loop the video. Possible values: true, false

Default

true

flashVars.controlColor

Property

flashVars.controlColor

Data type

hexdezimal

Description

Sets the color of control panel in hexdezimal.

Default

0xf4f1ec

flashVars.scaleiffullscreen

Property

flashVars.scaleiffullscreen

Data type

boolean

Description

Sets to allowed to scaling the video on fullscreen

Default

true

flashVars.showscalingbutton

Property

flashVars.showscalingbutton

Data type

boolean

Description

Sets to allowed to scaling the buttons on fullscreen

Default

true

videoTemplate

Property

videoTemplate

Data type

string

Description

You can set your own htmlcode for flashvideo:

<div>
###FLASHVIDEO###
<div class="video_title"><strong>###TITLE###:</strong> ###VIDEO_TITLE###</div>
<div class="video_description"><strong>###DESCRIPTION###:</strong> ###VIDEO_DESCRIPTION###</div>
</div>

Follow Placeholder are possible:

###FLASHVIDEO### - Insert the video flash object###TITLE### - Insert the label title in your language###VIDEO_TITLE### - Insert the title from video via dam

###DESCRIPTION### - Insert the label description in your language

###VIDEO_DESCRIPTION### - Insert the description from video via dam

That's all

Default

((generated))
Example

You can configure the flash player or the html-output as TypoScript, here an example:

plugin.tx_damivsvideobasic_pi1 {
    ampersand = xhtml
    flashParams {
            quality = high
            allowscriptaccess = always
            wmode = transparent
            swliveconnect = true
            allowfullscreen = true
            scale = default
    }
    flashVars {
            allowsmoothing = true
            autoplay = false
            buffer = 3
            showtimecode = true
            loop = true
            controlcolour = 0xf4f1ec
            scaleiffullscreen = true
            showscalingbutton = true
    }
    videoTemplate (
            <div>
            ###FLASHVIDEO###
            <div class="video_title"><strong>###TITLE###:</strong> ###VIDEO_TITLE###</div>
            <div class="video_description"><strong>###DESCRIPTION###:</strong> ###VIDEO_DESCRIPTION###</div>
            </div>
    )
}

You can change the CSS in your CSS layout, if you wish:

.tx-damivsvideobasic-pi1 .video_left {
        width: 100%;
        text-align: left;
}

.tx-damivsvideobasic-pi1 .video_center {
        width: 100%;
        text-align: center;
}

.tx-damivsvideobasic-pi1 .video_right {
        width: 100%;
        text-align: right;
}

Known problems

no bugs, problems or performance issues.

To-Do list

not yet available

ChangeLog

22.06.2009 – Sebastian Siebert

initial development

14