Flash 8 Video © Reiska, 2008

Flash 8 tekijäympäristö  Videotiedostojen on Flash Playerissa oltava FLV muodossa.  Koodaus FLV muotoon voidaan tehdä kahdella tavalla: 1. Viime tingassa: Flash Video Import Wizard, sisäinen dialogi vasta Flash-esitystä tehtäessä, tai 2. Etukäteen: Tätä varten on erillinen Flash 8 Video Encoder, itsenäinen ulkoinen ohjelma.  Flash Video Import Wizard käynnistyy käskyllä File>Import> Import Video. Dialogit ohjaavat tarvittaessa videotiedoston muuntamisen FLV muotoon ja FLVPlayback komponentin asetukset.Dialogit ohjaavat tarvittaessa videotiedoston muuntamisen FLV muotoon ja FLVPlayback komponentin asetukset  Syntynyt FLVPlayback komponentti liittää Flash esitykseen ulkoisen lokaalin tai WWW-palvelimella olevan FLV videotiedoston (protokolla HTTP), tai Flash Media Serverin tuottaman videovirran, streamin (protokolla RTMP).

Flash 8 esitysympäristö  Palvelin voi olla tavallinen WWW-palvelin, tai sovellus palvelin – ja/tai erityinen Media/Streaming palvelin.  Asiakas on Flash Player, joka upotetaan selaimeen tai voi toimia itsenäisessä ikkunassa. Flash Player voi soittaa myös lokaaleja FLV tiedostoja.  Flash Player toistaa Flash Videota ilman mitään lisäosia muun Flash sisällön mukana. Flash Video on kuten mikä muu Flash symboli tahansa.  Dreamweaverissa on perustoiminnot sisältävä Flash Video Import mekanismi, jolla Flash Videon (FLV) voi upottaa Web-sivulle.

Flash 8 streamingympäristö  Flash Media Server on Macromedian Streaming Media Server, virtausmediapalvelin, joka tuottaa audio- ja videostreamin Flash Player 6+:n ymmärtämään muotoon.  Flash Video Streaming Service (FVSS) on kolmannen osapuolen tarjoama palvelu, johon kuukausimaksua vastaan voi toimittaa maailmanlaajuiseen jakeluun streameja.  Palvelu perustuu Flash Media Serveriin.  Palvelu vastaa Web-hotellipalvelua (Web hosting).

Flash Videon julkaiseminen  Flash Video voidaan tuottaa ja julkaista kahdella kahdella tapaa: 1. Videon tallennus etukäteen (pre-recorded) ja toisto tarvittaessa (on-demand). 1. Video voidaan upottaa Flash-esitykseen (Embedded in SWF), 2. tai video voidaan ladata progressiivisesti tai streamina ulkoisesta FLV-tiedostosta. Protokolla HTTP tai RTMP. 2. Videon tuottaminen ja toisto livenä (broadcasting live video) edellyttää aina Flash Media (Streaming) Serverin käyttöä. Protokolla RTMP.

Embedded, Progressive vai Streaming?

On-demand videotuotanto 1. Kuvaa itse video, tai hanki valmista videomateriaalia. 2. Koodaa video Flash Videoksi (FLV). 3. Päätä jakelutapa, upotettuna, progressiivisena vai streamina. 4. Lisää video WWW-sivulle ja julkaise sivu. Reaaliaikaisten videolähetysten (live broadcasts) tuotanto on eri tarina.

Koodekit  Koodekki (koodaus|dekoodaus) on pakkaus- ja purkualgoritmi, joka määrää, miten videotiedostot pakataan (koodaus, encoding) ja miten ne puretaan (dekoodaus, decoding) toistettaessa.  Flash Video Encoder koodaa videon On2 VP6 videokoodekilla (Flash Player 8), tai Sorenson Spark koodekilla (Flash Player 7).  Sorenson Spark koodekilla pakatun videon voi julkaista SWF 6 tai 7 muodossa, ja soittaa vastaavasti Flash Player 6-7 tai 7+ versioilla.  On2 VP6 koodekilla pakatun videon voi julkaista kaikilla SWF versioilla 6-8, mutta soittaa vain Flash Player 8+ versiolla.

Videon tallennus ja toisto  Ennen kuin On-demand videota voi lisätä Web-sivulle, video pitää koodata Flash Video (FLV) muotoon.  Videon voi tallentaa tavalliselle Web-palvelimelle tai virtauspalvelimelle (Flash Media Server tai FVSS).  Videon toistaa sama Flash Player, kuin muunkin Flash sisällön.  Live videon kaappaus ja jakelu edellyttää Flash Playerin ja Flash Media Serverin yhteiskäyttöä.  Video kaapataan ja lähetetään Flash Media palvelimelle Flash-ohjelmalla, joka on yleislähetyssovellus kuvaavassa päässä.  Live streaming sovellus Flash Media Serverillä (tai FVSS palvelu) ottaa lähetyksen vastaan.  Tehdään toinen SWF tiedosto, joka soittaa videostreamin ja julkaistaan se Web-sivulle, josta asiakkaat sen löytävät.

Video-symbolin käyttö  Videon soittamiseen käytetään Video-symbolia.  Ensimmäinen esimerkki on aikajanalle upotettu video.  Toinen esimerkki on ActionScriptillä ohjattu videon toistaminen.  HUOM! Esimerkeissä ei käytetä Flashin FLVPlayback komponenttia (tai vanhempia Flash Media komponentteja).

Vedä Stagelle Tämä on esimerkki Embed (upotetusta) videosta ilman valmiiden Flash komponenttien käyttöä.

8 7 6

Sama kuin edellä, mutta upotuksen (Embed) sijasta Action Script ohjattuna ulkoisena videona.

Flash Video tuodaan Flash Playerille NetConnection yhteysolion kautta, johon soitin liittyy. NetStream-olio käyttää yhteyttä. my_video on näyttämöllä oleva video-olio (Video- luokan instanssi), johon liitetään NetStream virrassa oleva video. Videoluokka luodaan kirjaston (Library) Popup-valikosta komennolla New Video (yksityiskohdat seuraavalla sivulla). Videovirralle asetetaan vielä 5 sekunnin puskuri ja kytketään se toiseen päähän, FLV tiedostoihin. Lopputulos on ohessa. Kokeile muitakin.

Esimerkkejä

Mediakomponentit  Flash 6-7 kehitysympäristössä käytössä ovat valmiit mediakomponentit  MediaDisplay  MediaController  MediaPlayback (edellisten yhdistelmä)  Mediakomponenttien avulla videoiden sisällyttäminen esitykseen on usein helpompaa. Mediakomponenttien avulla videoiden sisällyttäminen

FLVPlayback komponentti  Flash 8 kehitysympäristössä on uusi FLVPlayback komponentti, joka on vielä monipuolisempi ja helpompi käyttää kuin Media komponentit.  FLVPlayback komponentista on myös erillinen Custom UI versio, jossa videon ohjaimet, kontrollit voidaan valita erikseen.  Komponentti vedetään normaalisti Components paneelista Stagelle instanssiksi ja sille annetaan nimi.  Component Inspector paneelissa komponentille annetaan videon siirtoprotokolla ja sijainti (URL eli contentPath) sekä muut tarvittavat ominaisuudet.

skin videon ohjausnapeille voidaan valita valmiista listasta tai käyttää omia nappeja.

Component Inspector  contentPath voi olla  Lokaali tiedosto, esim. C:\fish.flv, tai  WWW palvelimella, esim. ~reiska/Friikki/Flash/sanfrancisco.flv, tai ~reiska/Friikki/Flash/sanfrancisco.flv  Streaming-palvelimella, esim. rtmp://localhost:1935/my_video/indeprop.flv  skin videon ohjausnapeille voidaan valita valmiista listasta tai käyttää omia nappeja.  P.S. Jos video ei ole FLV muodossa, Flash8 käynnistää Flash 8 Video Encoder ohjelman ja käy läpi dialogin, jolla muunnos suoritetaan. Samalla syntyy automaattisesti FLVPlayback komponentti ohjaimineen Stagelle.dialogin, jolla muunnos suoritetaan

FLVPlayback ohjelmointi  FLVPlayback komponenttia (nimettyä instanssia siitä) voi myös ohjelmoida ActionScriptillä, kuten muitakin symboleita tai komponentteja.  FLVPlayback komponentin saa sovelluksen kirjastoon helpoimmin vetämällä Components paneelista instanssin Stagelle.  Instanssille pitää antaa nimi Properties- tai Component Inspector paneeliin (se voidaan antaa myös AS-koodissa).  Seuraavaksi on ensin esimerkki erillisten kontrollinappien ohjelmoinnista. Sitten on lopuksi esimerkki videon tietojen näyttämisestä ja videolistan soittamisesta. Tutki!

Lopuksi esimerkki, jossa näytetään FLVPlayback soittimen ajoaikaiset ominaisuudet ja soitetaan soittimella videolistaa …

this.createTextField("status_txt", 999, 0, 0, 200, 200); status_txt.autoSize = "left"; status_txt.multiline = true; FLVsoitin.onEnterFrame = function() { status_txt.text=""; status_txt.text += "\nactiveVideoPlayerIndex: " + FLVsoitin.activeVideoPlayerIndex ; status_txt.text += "\nbytesLoaded: " + FLVsoitin.bytesLoaded ; status_txt.text += "\nbytesTotal: " + FLVsoitin.bytesTotal ; status_txt.text += "\ncontentPath: " + FLVsoitin.contentPath ; status_txt.text += "\nheight: " + FLVsoitin.height ; status_txt.text += "\npaused: " + FLVsoitin.paused ; status_txt.text += "\nplayheadTime: " + FLVsoitin.playheadTime ; status_txt.text += "\nplaying: " + FLVsoitin.playing ; status_txt.text += "\npreferredHeight: " + FLVsoitin.preferredHeight ; status_txt.text += "\npreferredWidth: " + FLVsoitin.preferredWidth ; status_txt.text += "\nscaleX: " + FLVsoitin.scaleX ; status_txt.text += "\nscaleY: " + FLVsoitin.scaleY ; status_txt.text += "\nstate: " + FLVsoitin.state ; status_txt.text += "\nstopped: " + FLVsoitin.stopped; status_txt.text += "\ntotalTime: " + FLVsoitin.totalTime ; status_txt.text += "\nvolume: " + FLVsoitin.volume ; status_txt.text += "\nwidth: " + FLVsoitin.width ; status_txt.text += "\nx: " + FLVsoitin.x ; status_txt.text += "\ny: " + FLVsoitin.y ; } FLV soittimen ominaisuudet näkyville!

var videos:Object = new Object(); videos.list = new Array(); videos.list[0] = " videos.list[1] = " videos.list[2] = " videos.list[3] = ""; videos.list[4] = ""; videos.list[5] = ""; videos.list[6] = ""; videos.loop = true; videos.length = 1; videos.loaded = false; var m = this.FLVsoitin; m.contentPath = videos.list[0]; videos.ready = function( evt:Object ):Void { if(!this.loaded){ this.loaded = true; for( var n=1; n<this.list.length; n++ ){ if( videos.list[n].indexOf(".flv") != -1 ){ m.activeVideoPlayerIndex = n; m.contentPath = videos.list[n]; this.length++; } m.activeVideoPlayerIndex = 0; } Videolistan soittaminen. AS-koodi.

m.addEventListener("ready",videos); // Set a 'complete' event handler to load the next video videos.complete = function( evt:Object ):Void { var nextIndex = Number(evt.vp)+1; if( nextIndex == this.length){ if( this.loop ){ nextIndex = 0; }else{ return; } m.activeVideoPlayerIndex = nextIndex; m.visibleVideoPlayerIndex = nextIndex; m.play(); } m.addEventListener("complete",videos); // End Set Videos Behavior