Curs Web Cap 12

10
1 Capitolul 12 FacilităŃi suplimentare Multimedia Conceptul multimedia este unul din cele mai tentante şi moderne concepte utilizate în lumea informaticii. Prin tehnologii multimedia se întelege totalitatea modalităŃilor de creare, utilizare, stocare, regăsire şi difuzare a aplicaŃiilor din medii multiple precum text, grafică, imagine, sunet şi animaŃie. Multimedia semnifică prezenŃa simultană a multor astfel de medii într-un document (ca de exemplu o pagină web). HTML suportă tehnologiile multimedia. Fişierele multimedia pot fi fişiere: De aplicaŃii,care sunt executate de sistemul de operare şi au în general exetensia exe, (ca de exemplu programe de prelucrare grafică, de calcule, etc.) Unele aplicaŃii sunt independente (WORD,EXCEL, MAP THIS, etc), iar alte aplicaŃii sunt dependente (ca de exemplu controale ActiveX, programe PLUG-IN, etc. De date folosite pentru stocarea datelor. xtensia acestor tip de fişiere indică tipul datelor stocate şi a aplicaŃiei folosită pentru citirea, ditarea şi tipărirea lor. Sistemul de operare al calculatorului stabileşte o legatură între fişierele de date şi aplicaŃia care prelucrează datele din fişier.Pentru a constata dacă un fişier este de aplicaŃie sau de date, se execută click pe butonul drept al mouse-ului şi din meniul rapid se selectează comanda Properties. În caseta Type of file a ferestrei va apare: Application-dacă fişierul este de aplicaŃii Mediu-de exemplu text, grafics, video,etc. dacă fişierul este de date. În acest caz mai apare o casetă Open With care indică aplicaŃia prestabilită care va deschide fişierul respectiv de date (de exemplu NOTEPAD). Termenul de hypermedia desemnează documentele multimedia care cuprind hyperlegături, acestea fiind modul uzual de existenŃă a documentelor multimedia pe spaŃiul Web. 12.1 Multipurpose Internet Mail Extensions (MIME) Pentru a putea fi recunoscute de aplicaŃiile hypermedia, fiecare fişier de date trebuie identificat printr-un tip MIME (Multipurpose Internet Mail Extension). MIME a fost realizat de Internet Engineering Task Force (IETF) în 1992.

Transcript of Curs Web Cap 12

Page 1: Curs Web Cap 12

1

Capitolul 12

FacilităŃi suplimentare Multimedia

Conceptul multimedia este unul din cele mai tentante şi moderne concepte utilizate în lumea informaticii.

Prin tehnologii multimedia se întelege totalitatea modalităŃilor de creare, utilizare, stocare, regăsire şi difuzare a aplicaŃiilor din medii multiple precum text, grafică, imagine, sunet şi animaŃie.

Multimedia semnifică prezenŃa simultană a multor astfel de medii într-un document (ca de exemplu o pagină web). HTML suportă tehnologiile multimedia. Fişierele multimedia pot fi fişiere:

� De aplicaŃii,care sunt executate de sistemul de operare şi au în general exetensia exe, (ca de exemplu programe de prelucrare grafică, de calcule, etc.) Unele aplicaŃii sunt independente (WORD,EXCEL, MAP THIS, etc), iar alte aplicaŃii sunt dependente (ca de exemplu controale ActiveX, programe PLUG-IN, etc.

� De date folosite pentru stocarea datelor. xtensia acestor tip de fişiere indică tipul datelor stocate şi a aplicaŃiei folosită pentru citirea, ditarea şi tipărirea lor. Sistemul de operare al calculatorului stabileşte o legatură între fişierele de date şi aplicaŃia care prelucrează datele din fişier.Pentru a constata dacă un fişier este de aplicaŃie sau de date, se execută click pe butonul drept al mouse-ului şi din meniul rapid se selectează comanda Properties. În caseta Type of file a ferestrei va apare:

• Application-dacă fişierul este de aplicaŃii • Mediu-de exemplu text, grafics, video,etc. dacă fişierul este de

date. În acest caz mai apare o casetă Open With care indică aplicaŃia prestabilită care va deschide fişierul respectiv de date (de exemplu NOTEPAD).

Termenul de hypermedia desemnează documentele multimedia care cuprind hyperlegături, acestea fiind modul uzual de existenŃă a documentelor multimedia pe spaŃiul Web.

12.1 Multipurpose Internet Mail Extensions (MIME)

Pentru a putea fi recunoscute de aplicaŃiile hypermedia, fiecare fişier de date trebuie identificat printr-un tip MIME (Multipurpose Internet Mail Extension). MIME a fost realizat de Internet Engineering Task Force (IETF) în 1992.

Page 2: Curs Web Cap 12

2

Standardul MIME organizează extensiile fişierelor multimedia în tipuri şi subtipuri (de exemplu text/html ,text/CSS, image/jpg, image/gif, application /msword, etc.)

În capitolul 2,am clasificat fişierele de date pe diferite medii. În tabelul de mai jos vor fi date o parte din fişierele de date, specificând

extensia, tipul şi subtipul MIME. Descriere

Extensie de fişier

Tip/subtip MIME

text HTML html, htm text/html text obişnuit txt text/plain fişier CSS Css text/css imagini GIF gif image/gif fişiere JPEG jpg, jpeg, ipe image/jpeg PNG png image/x-png fişiere TIFF tiff,tif image/tiff fişiere Microsoft Bitmap bmp image/x-ms-bmp fişiere audio de bază au,snd audio/basic fişiere video Microsoft wav audio/x-wav format audio Macintosh aif, aiff,a ifc audio/x-aiff format audio Microsoft wav audio/x-wav audio MPEG mpa, mpega audio/x-mpeg audio MPEG-1 mp2a, mpa2 audio/x-mpeg-2 audio Real ra, ram application/x-pn-

realaudio MIDI mmid x-music/x-midi video MPEG mpeg, mpg, mpe video/mpeg video MPEG-2 mpv2, mp2v video/mpeg-2 Macintosh Quick Time qt,mov video/quicktime video Microsoft avi video/x-msvideo Microsoft Rich Text rtf application/rtf Adobe Acrobat Reader PDF

pdf application/pdf

fişiere Microsoft Word doc application/msword fişiere Microsoft Excel xls application/ms-excel fişiere Microsoft Power Point

ppz application/mspowerpoint

fişiere Microsoft Power Point

ppt application/vnd.ms-powerpoint

fişiere VRML wrl,vrml x-world/x-vrml Pentru mai multe informaŃii despre MIME accesaŃi diferitele adrese de

Internet (de exemplu: http://www.iana.org/, http://www.webopedia.com/ ,etc.)

Page 3: Curs Web Cap 12

3

12.2 AplicaŃii ActiveX şi Plug-in AplicaŃiile dependente sunt utilizate ca elemente ajutătoare pentru alte

aplicaŃii. Dintre aceste vom discuta despre programele de completare (plug-in) şi controale ActiveX.

Plug-in-programe de completare Plug-in-urile sunt aplicaŃii dependete care ajută browser-ele să afişeze

corect datele din fişierele de date, în ferestrele browser-ului. Aceste programe se găsesc pe Internet şi se pot descărca free

(gratuit).Fiecare program de completare are în vedere o serie de extensii de fişiere şi tipuri MIME.

De exemplu programul Adobe Acrobat lucrează cu fişiere .pdf iar tipul MIME este application/pdf.

În tabelul de mai jos sunt prezentate cele mai utile programe de completare:

Nume program de completare

Extensii de nume de fişier acceptate

Tipuri MIME acceptate

Windows Media Player

.asf,.asx,.wma,.wax, .wmv,.wvx

application/x-mplayer2,application/asx, .video/x-ms-asf-plugin,video/x-ms-asf, video/x-ms-wm,audio/x-ms-wax, video/x-ms-wmv,video/x-ms-wvx

Apple Quick Time

.aiff,.au,.mpeg,.wav,.aif,.mid, .png,.tif,.tiff, .bmp,.ptng,.png,.targa, .avi,.flc,.mpe

audio/aiff,audio/basic,audio/midi, audio/mpeg,audio/wav,audio/x-aiff, audio/x-midi,audio/x-mpeg, audio/x-wav,image/png,image/tif, image/x-bmp,image/x-macpaint, image/x-photoshop,image/x-png, image/x-sgi,image/x-targa, image/x-tiff, video/avi,video/flc,video/mpeg, video/quicktime,video/x-mpeg, video/x-msvideo

Winamp MP3 Player

.mp3,.mp2,.mp1,.w

Audio/mid,application/ x-msdownload, Audio/mpeg,audio/mpg,audio/mpg, audio/mp3,audio/x-mpg, Application/x-winamp-plugin,

Page 4: Curs Web Cap 12

4

ma,.voc,.wav, .cda,.it,.xm,.s3m,.stm,.mod,.dsm,.far, .ult,.mtm,..669,.mid,.m3u,.pls,.mjf

Interface/x-winamp-skin, Application/x-mpeg,audio/x-mp3, Audio/x-scpls,audio/mpegurl, Audio/mpegurl,audio/scpls, Audio/x-vnd.Audio.Explosion. Mjuide Media

Flash Player .spl,.swf

Application/futuresplash, Application/x-shockwave-flash

Shockwave .aam,.dir,.dxr,.dcr Application/x-director Adobe Acrobat .pdf Application/pdf

ActiveX

Conceptul de obiecte sau coreponente ActiveX s-a dezvoltat pe baza tehnologiei OLE (Object Linking and Embedding) a corporaŃiei Microsoft care permite să înserăm obiecte COM şi alte aplicaŃii. Controalele ActiveX se pot însera în aplicaŃii pentru a putea fi refolosite cu toate funcŃionalităŃile lor. Controalele ActiveX funcŃionează ca o interfaŃă, astfel codul inclus în pagina Web interacŃionează cu controlul ActiveX, iar acesta ineracŃionează direct cu programul de navigare.

Prin această tehnologie aproape orice cod poate fi executat de la nivelul programului de navigare, de la procesare de texte, la filme, animaŃie/video etc.

Fiecare control ActiveX se introduce în paginile Web cu ajutorul etichetei <OBJECT> şi cu parametri specificaŃi de eticheta <PARAM>, etichete care vor fi descrise în secŃiunile următoare. Mai multe informaŃii despre ActiveX se pot afla din mai multe locaŃii de pe internet:

http://www.microsoft.com/sitebuilder/.zdnet, http://www.zdnet.com/products/activexuser.html

Pentru a însera alte fişiere sau pagini(fişiere html)se foloseşte tehnica deja cunoscută de Inserare de legaturi, cu ajutorul elementului <A>.

În acest caz browser-ul: − prelucrează fişierelul (html, gif, jpg, png) şi îl afişează în fereastra sa − prelucrează fişierelul cu ajutorul unui program de completare şi îl

afişează în fereastra sa − nu poate să prelucreze fişierelul şi cere ajutor unei aplicaŃii (word,

excel, etc.)

12.3. Elemente OBJECT şi PARAM Elementul OBJECT este un element foarte important, considerat şi ca

superelement deoarece permite intrudcerea în fereastra browser-ului a oricărui tip de informaŃie multimedia (imagini, aplicaŃii, fişiere, alte pagini Web şi ActiveX).

Page 5: Curs Web Cap 12

5

Sintaxa acestui element este: <OBJECT atribute> <PARAM atribute> …. <PARAM> </ OBJECT>

După cum se observă între tag-urile <OBJECT> şi </ OBJECT> se pot introduce mai multe elemente <PARAM >. Atributele elementului OBJECT sunt:

• hight, width, align – definesc înalŃimea, lăŃimea şi alinierea elementului multimedia înserat

• hspace, vspace, border – definesc spaŃiul alb şi chenarul din jurul elementului înserat

• title – indică o sugestie atunci când suntem cu mouse-ul deasupra elementului

• data – indică afişarea de către browser a fişierului multimedia şi are ca valoare o adresă URL validă

• type – determină tipul şi subtipul MIME asociat fişierului • id – indică un nume ce reprezintă un identificator unic de clasă • classid – specifică elemental de control ActiveX ce va fi folosit pentru a

reda/afişa/rula fişierul multimedia înserat. Acest atribut are ca valoare un cod unic al clasei unui control Microsoft ActiveX recunsocut, care se găseşte în Registry Editor şi are forma:

“classid:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx” Tabelul de mai jos conŃine cele mai importante controle ActiveX împreună cu valorile atributului classid: DESCRIERE CLASSID button tabel textfield graphic calendar avi excel Iexplorer ClipArt Gallery Java

D7053240-CE69-11CD-A777-00DD01143C57 978C9E23-D480-11CE-Bf2D-00AA003f40D0 8BD21D10-EC42-11CE-9E0D-00AA006002f3 369303C2-D7AC-11d0-89D5-00A0C90833E6 8E27C92B-1264-101C-8A2F-040224009C02 05589FA1-C356-11CE-BF01-00AA0055595A 0002E510-0000-0000-C000-000000000046 0002DF01-0000-0000-0000-000000000046 00030026-0000-0000-C000-000000000046 3EFB1800-C2A1-11CF-960C-0080C7C2BA87

NOTĂ: când se instalează un program el se înregistrează în regiştrii pentru aplicaŃii a Windows-ului. Fiecare aplicaŃie are un cod unic, numit GUID (Globally Unique Identifier), care este acelaşi pe orice calculator. Pentru a afla codul GUID

Page 6: Curs Web Cap 12

6

pentru un anumit program se execută programul Regedit.exe ( Start / Run / Regedit.exe) şi se caută în regiştri la HKEY _CLASSES _ ROOT / CLSID Dacă programul nu este găsit în regiştrii de către browser, înseamnă că el nu este instalat pe calculatorul propriu şi pentru a-l descărca şi instala se foloseşte atributul:

• codebase - indică browser-ului locaŃia de unde se poate descărca programul, de obicei se introduce locaŃia kitului de instalare

(în acest curs presupunem că programele sunt instalate).

Page 7: Curs Web Cap 12

7

Figura 12. 1 Aflarea codului GUID pentru controlul AVI

Cu ajutorul marcajului OBJECT şi a atributelor sale enumerate mai sus,

se poate însera un obiect într-o pagină. Marcajului <OBJECT> i se asociază marcajul <PARAM> care indică

fişierul care trebuie să ruleze acest obiect şi în ce mod. (aşa cum un obiect deŃine anumite metode care sunt descries în funcŃie de tipul său. Forma tag-ului <PARAM> este <PARAM name = “nume”, value =“valoare”> Am arătat că se pot însera fişiere, imagini, aplicaŃii, pagini şi ActiveX cu ajutorul etichetei <OBJECT>, care poate avea anumiŃi parametri în funcŃie de obiectul înserat. Înserarea diferitelor fişiere Pentru înserarea diferitelor fişiere, elementul OBJECT poate avea atributele din exemplul de mai jos:

Page 8: Curs Web Cap 12

8

<HTML> <HEAD> </HEAD> <BODY> <OBJECT id="excel" classid="clsid:0002E510-0000-0000-C000-000000000046" data=“oferta.xls” align=“center” width=300 height=200 border=0> <param name="src" value="oferta.xls"> </OBJECT> <OBJECT id="Adobe Acrobat Control for ActiveX" width="320" height="240" classid="clsid:CA8A9780-280D-11CF-A24D-444553540000" data="sample.pdf" type"application/pdf"> <PARAM name="src" value="sample.pdf"> </OBJECT> </BODY></HTML>

Figura 12. 2 Înserarea fişierelor cu ajutorul elementului OBJECT

Înserarea imaginilor În ultimul timp, există tendinŃa de a însera în pagini imagini cu ajutorul

etichetei <OBJECT> în loc de eticheta <IMG>,astfel: <HTML> <HEAD> </HEAD> <BODY> <CENTER> Înserarea imaginilor</CENTER> <TABLE cellspacing="2"> <TR> <TD> <OBJECT data="butterfly.jpg" width=200 height=250> </OBJECT> <TD> <OBJECT data="Water lilies.jpg" width=200 height=250></OBJECT> <TR> <TD> <OBJECT data="flori4.jpg" width=200 height=200></OBJECT> <TD><OBJECT data="flori5.jpg" width=200 height=200> </OBJECT> </TABLE> </BODY></HTML>

Page 9: Curs Web Cap 12

9

Figura 12. 3 Înserarea imaginilor cu elementul OBJECT

Înserarea Controalelor ActiveX Presupunem că dorim să redăm un fişier .avi sau un fişier .mpeg. Pentru

acesta este nevoie de înserarea programului Windows Media Player. Cu acest program putem reda fişiere:.avi, .mpeg, ,mpg, .wmv, .wma, aşa cum reiese din exemplul de mai jos.

<HTML> <HEAD> </HEAD> <BODY> <OBJECT id="WMPlayer" width="320" height="240" classid="clsid:05589FA1-C356-11CE-BF01-00AA0055595A"> <PARAM name="src" value="sample.avi"> </OBJECT> <BR> <OBJECT id="buton"width=100 height=50 classid="clsid:D7053240-CE69-11CD-A777-00DD01143C57"> <PARAM name="caption" value="buton"> </OBJECT> <BR> <OBJECT id="WMPlayer" width =320 height=240 classid=clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6> <PARAM name="url" value="d:\poze\remember\2006_craciun_revelion\MVI_8297.AVI"> </OBJECT > </BODY> </HTML>

Page 10: Curs Web Cap 12

10

Figura 12. 4 Înserarea controalelor ActiveX