Toutes les vidéos disponibles dans la démonstration ont été faites sur MAC.
Les vidéos au format .ogg
ont été faites à l’aide VLC Version 1.1.3
Les vidéos au format .mp4
ont été faites à l’aide QuickTime 7 Pro
Si vous êtes sous Mac OS X Snow Leopard, QuickTime 7 est déjà installé. Il vous suffira de l’ouvrir et d’activer la licence qu’il faudra avoir acheter préalablement sur apple 30,00 €
. Le player QuickTime 7 se trouve Applications/Utilities/
.
Source : QuickTime 7 Pro – http://www.apple.com/fr/quicktime/download/
.MP4
Voilà la séquence pour encoder un fichier quicktime en MP4.
Pour assurer la meilleure qualité possible de votre vidéo avant un encodage en .mp4
, ll vaut mieux désentrelacer votre source vidéo
Les paramètres vidéo du format .mp4
Les paramètres audio du format .mp4
.OGG
Voilà la séquence pour encoder un fichier quicktime en OGG. Pour se faire on utilise la toute dernière version de VLC.
1. Choisir l’assistant de diffusion et de transcodage
2. Définir les options de transcodage
3. Choisir l’entrée, la source vidéo
4. Définir les paramètres du transcode
5. Définir le mode d’encapsulation
Au terme de ces 6 opérations, vous obtenez un fichier .ogg
de votre vidéo.
Pour activer ou non la barre de transport, si vous le souhiatez, vous pouvez à l’aide de FireBug
sous Firefox, mettre style="display: block;"
pour voir apparaitre temporairement la barre de transport qui vous donne tous les boutons, le timecode….etc
<div class="he3Player_toolbar" style="display: block;">...</div> |
La barre de transport du 3WDOC player
Voici, pour les plus courageux, l’intégrale de ma documentation pour personnaliser le player 3WDOC des paramètres d’affichage et des options d’initialisation et des options d’effets.
Blind direction: horizontal,vertical (string) Bounce direction: up,down,left,right (string) Clip direction: horizontal,vertical (string) Drop direction: up,down,left,right (string) Explode pieces: 9 (int) Fold horizFirst: true,false (bool) size: 15 (int) Highlight color: #ffff99 (hex) Puff percent: 150 (int) Pulsate times: 5 (int) Shake direction: up,down,left,right (string) distance: 20 (int) times: 3 (int) Slide direction: up,down,left,right Fade |
note: the effect options are strings in json notation without curly-braces, don’t forget to single quote keys/values, if multiple keys/values pairs separate by coma.
<node (video,audio,article,img,button) // show attributes tcStart="" (float) # timecode start tcStartTop="" (int) # relative to section start top position in px tcStartLeft="" (int) # relative to section start left position in px tcStartWidth="" (int) # start width in px tcStartHeight="" (int) # start height in px tcStartZindex="" (int) # start z-index tcStartEffect="" (string) # start fx tcStartEffectDuration="" (int) # start fx duration tcStartEffectOptions="" (string) # start fx options // hide attributes tcStop="" (float) # timecode stop tcStopEffect="" (string) # stop fx tcStopEffectDuration="" (int) # stop fx duration tcStopEffectOptions="" (string) # stop fx options > node content </node> <node (audio,video) // source attribute tcSrc = "" (string) # url to the multimedia source file without extension (ext will be elected to ogg for FF and mp4 for others) > !!! no node content, will be dynamically injected when needed !!! </node> <node (button) tcLink="http://www.hecube.net" (URLstring) # action button to link to URL tcGoto="" (float) # action button to jump to specified timecode in the sequence tcOverlay="" (string) # action button to trigger an overlayed group class="[ui]rwd" (string) # action button stepping rewind (see he3PlayerSeekStep) class="[ui]play" (string) # action button trigger play class="pause" (string) # action button trigger pause class="[ui]stop" (string) # action button trigger stop class="[ui]fwd" (string) # action button stepping forward (see he3PlayerSeekStep) class="[ui]mute" (string) # action button trigger mute (see he3PlayerMute) class="[ui]sndMinus" (string) # action button trigger stepping volume (see he3PlayerVolumeStep) class="[ui]sndPlus" (string) # action button trigger stepping volume (see he3PlayerVolumeStep) class="[ui]fullScreen" (string) # action button trigger player size class="ctime" (string) # passive button display current timecode > node content </node <node (article,img) tcOverlayed="" (string) # defines an overlayed group to be trigger by an overlay button > node content </node> |
note: [c] cookie mode capabilities
he3PlayerWidth: 1024, (int) # the main container section width he3PlayerHeight: 768, (int) # the main container section height he3PlayerNativeWindow: true, (bool) [c] # init in native window size (he3PlayerWidth,he3PlayerHeight) or resize window size (see he3PlayerRatioWindow,he3PlayerReferenceWindow) he3PlayerRatioWindow: 0.5, (float) # defines the resize ration, if set to 0 follow full browser window size he3PlayerReferenceWindow: "width", width|height (string) # choice of the dimension we refer to for full browser window size following he3PlayerAutoplay: false, (bool) [c] # init in autoplay, can be bypassed by runtime transport status in cookie mode [c] he3PlayerMute: false, (bool) [c] # init in mute he3PlayerSeekStep: 3, (float) # seekink stepping configuration he3PlayerVolumeDefault: 0.5, (float) [c] # default init volume value, from 0 to 1 he3PlayerCookieName: "mywebdoc", (string) # will name the session cookie (experimental) that stores runtime properties between pages, it should represent a webdoc name he3PlayerCookieRecall: "transport,nativeWindow,volume,mute", (string) # will (de)activate data recal at init from the session cookie (experimental), bypassing some of the init options [c] he3PlayerFirebug: true (bool) # enables Firebug debugging messages (FF only!) |
Ce développement du Player 3WDOC a été rendu possible grâce aux ressources suivantes :
5e Arrondissement de Paris, 75005 Paris, France
[geo_mashup_map height=”235″ width=”600″ map_type=”G_HYBRID_MAP” zoom=”15″ add_overview_control=”true” add_map_type_control=”true”]