Upotreba zvuka



 
 
 
 
 
 
 
 
 
 
Kontrola ponašanja plug-in u JavaScript

   Plug-in je dodatak browser-u koji odozvoljava upotrebu dodatnih tipova informacija: zvuk, video, ... Trenutno postoji više stotina plug-inova dostupnih za browser-e. Na primer: Adobe's Acrobat plug-in radi podrške precizno formatiranog unakrsng teksta ili Macromedia's Shock Wave i Flash plug-inovi radi podrške animaciji i videu.
 
Tag <embed>
Tagom <embed> moguće je uključiti datoteku koja koristi plug-in u Web dokument.
<embed SRC=''sound.wav'' HIDDEN=true AUTOSTART=false LOOP=false>

ATRIBUTI
   SRC  zadaje URL zvučne datoteke
   HIDDEN  zadaje (ne)vidljivost objekta; bez ovog atributa prikazuje se kontrolna tabla za puštanje/zaustavljanje zvuka
   AUTOSTART kontroliše puštanje zvuka pri učitavanju strane
   LOOP zadaje ponavljanje zvuka (npr. MIDI muz. datoteke)
   CONTROLS zadaje tip kontrolne table koja se koristi ako HIDDEN nije određen. Zadate vrednosti mogu biti console (za veću kontrolu), smallconsole (za manju kontrolu), playbutton (Play dugme).
   WIDTH, HEIGHT zadaju veličinu kontrolne table (ako nije skrivena)

Samo za IE - zvuk u pozadini (BGSOUND tag), na primer zvucna podloga da bude sadrzaj datoteke
bkground.mid
<BGSOUND LOOP=0  SRC="bkground.mid">

Inace, reprodukcija zvucne datoteke bkground.mid nakon sto browser ucita Vas dokument
<EMBED NAME="bkgroundID" SRC="bkground.mid"
LOOP=TRUE AUTOSTART=TRUE HIDDEN=TRUE>
 
 
 
 
Tag <object>

Tagom <object> se u HTML dokument umeću objekti pout slike, dokumenta ili apleta. On dozvoljava zadavanje parametara za ugrađivanje zvuka.
   Primer <object> za uključivanje zvuka
<object type="audio/x-wav"  data="sound.wav" width="100" height="30">
      <param name="src" value="sound.wav">
      <param name="autostart" value="false">
      <param name="hidden" value="true">
</object>

ATRIBUTI
  TYPE  zadaje tip Internet medija (MIME TYPE) podataka.
  DATA zadaje URL objekta
  WIDTH, HEIGHT zadaje veličinu objekata
 
MIME tipovi

Višenamensko proširenje Internet pošte (MIME, Multipurpose Internet Mail Extesnsions) je standard za klasifikovanje različitih tipova datoteka i njihov prenos putem Interneta.
Primer MIME tipova koji su do sada korišteni:
    HTML  (MIME tip je text/html)
    tekst     (MIME tip je text/plain)
    GIF slika  (MIME tip je image/gif)

Kada Web server pošalje dokument browser-u, on u zaglavlju sadrži MIME tip dokumenta. Ako browser podržava MIME tip, onda se prikazuje datoteka. Inače se nude opcije preuzimanja,...
 

Objekat navigator.plugins je niz sa unosom za svaki plug-in instaliran u browser-u. Svaki unos poseduje osobine:
   name  naziv plug-in
   filename izvršna datoteka koja je učitana za instaliranje plug-in
   description opis plug-ina, dobijen od programera
   mimeTypes niz sa jednim unosom za svaki MIME tip podržan od strane plug-ina

Upotreba JavaScript-a za detektovanje plug-ina pre učitavanja strane koja poseduje plug-in sadržaj
 

             Datoteka prz1.htm
<html>
<head>
<title>Plug-In lista</title>
</head>
<body>
<h1>Lista postojecih Plug-In</h1>
<hr>
<p> Pomocu objekta navigator.plugins detektovana je lista postojecih plug-in:</p>
<hr>
<table BORDER>
<tr><th>Plug-in Naziv</th>
<th>Naziv Datoteke</th>
<th>Opis</th>
</tr>
<script LANGUAGE="JavaScript">
for (i=0; i<navigator.plugins.length; i++) {
   document.write("<tr><td>");
   document.write(navigator.plugins[i].name);
   document.write("</td><td>");
   document.write(navigator.plugins[i].filename);
   document.write("</td><td>");
   document.write(navigator.plugins[i].description);
   document.write("</td></tr>");
}
</script>
</table>
</body>
</html>
 

Ovaj primer prikazuje kao rezultat tabelu plug-inova koje podržava browser (počev samo od Netscape 3.0). Tabela se sastoji iz tri kolone u kojima se navodi
document.write(navigator.plugins[i].name);         /* naziv plug-ina*/
document.write(navigator.plugins[i].filename);    /* naziv datoteke*/
document.write(navigator.plugins[i].description);  /* opis datoteke */

U for ciklusu scripta (u sekciji BODY) brojačka promenljiva i uzima vrednosti od 0 do broja plug-inova (navigator.plugins.length).

PRIMER IZLAZA
 
 

  Plug-in Naziv  Naziv Datoteke Opis
Java Plug-in C:\PROGRAMFILES\NETSCAPE\COMMUNICATOR\PROGRAM\plugins\NPJPI140.dll   Java Plug-in 1.4.0 for Netscape Navigator  (DLL Helper)

 
 
Upotreba JavaScript-a pri sviranju klavira sa 88 dirki

 Datoteka prz2.htm

Ako se pogleda iyvorni kod datoteke pry2.htm, uocava se skript koji detektuje klik pokazivača miša na dirku klavira (sliku bele.gif ili crne.gif) i proizvodi zvuk odgovarajuće note.
  U konkretnom primeru su za  13 nota jedne oktave na klavijaturi kreirane zvučne datoteka (format je WAV, format datoteke u kome Windows memoriše zvuke kao uzorkovane zvućne talase. Jedan minut zvuka zauzima 644 KB ili čak 27 MB, zavisno od učestanosti uzorkovanja, zavisno od toga da li zvuk je stereo i da li se za svaki uzorak koristi 8 ili 16 bita.)
  Zvučne datoteke su ukljućene upotrebom taga embed, na primer
 <embed SRC="D0.wav" HIDDEN=true AUTOSTART=false>,
  tj. SRC zadaje naziv note/datoteke, dok atributi HIDDEN i AUTOSTART imaju sledeće uloge:
   -- zvuk se pušta pre nego se učita strana, ali da se ne bi pustilo svih 13 nota, to se može sprečiti atributom AUTOSTART=false
   --da bi se sprečilo prikazivanje kontrolne table od strane browser-a za svaki zvuk, postavlja se atribut HIDDEN=true
  Efekat je da tbog ovakvog taga embed će svih 13 zvukova biti odmah učitano, ali ne i pušteno.
 

Kako efekat sviranja prstima na klaviru se postiže klikom pokazivača miša na sliku dirke, to su dirke ukljućene u HTML dokument kao hperveze, na primer:
   <a HREF="#" onClick="svirajnotu(1);">
         <img border=0 SRC="crne.gif" ALIGN=TOP>
   </a>

Oznakom img prikazuje se crna dirka, linkovana u tagu A sa #, tj. to je odredište linka nakon klika mišem. Time se sprečava browser da učita neku drugu stranicu, dok obradom događaja procedurom onClick pokreće se JavaScript za puštanje note 1 (note su brojevi od 0..12), tj. f-ju svirajnotu

JavaScript koji je zadužen za puštanje odgovarajućeg zvuka glasi
<script LANGUAGE="JavaScript">
function svirajnotu(note) {
  document.embeds[note].play();
}
</script>

Funkcija svirajnotu prihvata kao parametar redni broj note od 0 do 12 i koristi metodu play iz objekta document.embeds za reprodukciju zvuka. Svaki ugrađeni objekat u dokumentu je predstavljen elementom u embeds nizu. Niz embeds je document dete. Kako konkretan primer ne radi sa 88 dirki, več sa 13, to su oni predstavljeni od strane document.embeds[0]..document.embeds[12]

Osobine i metode embed objekta zavise od plug-ina koji se koristi. U ovom primer u slucaju LiveAudio plug-in postoje metode play i stop za kontrolu audio izlaza.
 

NAPOMENA: Tesko je podrzati sve plug-inove, a njihovom upotrebom mozete izgubiti deo posetilaca Vase Web strane koji poseduju browser koji nema instaliran plug-in za npr. zvucne datoteke koje koristite, te vodite racuna o tome. Savet je da obezbedite besplatnu plug-in alternativu za pristup Vasim Web dokumentima.
 
 
 
Uključivanje zvuka bez JavaScript-a

Moguće je postaviti hipervezu do zvučne datoteke u HTML dokument
<A HREF="zvuk.mid"> Reprodukcija zvuka (kliknite) </a>

Kada korisnik poseti link, odredište će biti zvučni zapis zvuk.mid, tj. browser otvara zvučnu kontrolnu tablu i korisnik je mora ručno zatvoriti na kraju.
 
 
Rerodukcija zvuka sa onMouseOver procedurom za obradu događaja 

<a href=#
onClick="return false"
onMouseOver="sviraj();return true"
onMouseOut ="zaustavi();return true"
>Hiperveza</a>
 

<script language="JavaScript">
<!--
ver=parseInt(navigator.appVersion)
ie4=(ver>3  && navigator.appName!="Netscape")?1:0
ns4=(ver>3  && navigator.appName=="Netscape")?1:0
ns3=(ver==3 && navigator.appName=="Netscape")?1:0
function zaustavi() {
 if (ie4) document.all['BGSOUND_ID'].src='tishina.mid';
 if ((ns4||ns3)
  && navigator.javaEnabled()
  && navigator.mimeTypes['audio/x-midi']
 )
 {
  self.document.Bach.stop()
 }
}

function sviraj() {
 if (ie4) document.all['BGSOUND_ID'].src='ZaElizu.mid';
 if ((ns4||ns3)
  && navigator.javaEnabled()
  && navigator.mimeTypes['audio/x-midi']
  && self.document.Bach.IsReady()
 )
 {
  self.document.Bach.play()
 }
}
//-->
</script>