Skip to the main content

Hex Dump 2Novi program(er)ski zapis. Sretnici, slobodno preskočite.

Dakle, pet Flash/JavaScript biblioteka/widgeta/alata za one koji prave web stranice. Prva čini samo JavaScript, a ostale imaju i Flash tj. ActionScript dio. Plus primjeri.

1. JavaScript Flash Detection Library (Flash Detect)

Flash Detect služi za detekciju Flasha tj. odgovara na pitanje da li je Flash instaliran u vaš web preglednik. Posjeduje nekoliko svojstva (properties) i metoda, npr.:

FlashDetect.installed
FlashDetect.major
FlashDetect.versionAtLeast()
FlashDetect.minorAtLeast()

U praksi ćete od svega toga trebati samo svojstvo FlashDetect.installed u kojem se nalazi true ili false:

if(!FlashDetect.installed)
    alert('Go fetch Adobe Flash!');

...

• • •

2. Zero Clipboard

Zero Clipboard omogućava kopiranje teksta u međuspremnik (clipboard) preko skrivenog Flash objekta i JavaScript sučelja. Uporaba je jednostavna:

HTML:

<input type="text" id="text" />
<input type="button" id="button" value="Copy to Clipboard" />

JS:

ZeroClipboard.setMoviePath('ZeroClipboard.swf');
var zero = new ZeroClipboard.Client();
zero.addEventListener('mousedown',function()
{
clip.setText(document.getElementById('text').value);
});
zero.glue('button');

(Prvo se postavlja putanja do Flash komponente, onda se kreira Client() objekt, pa se postavlja funkcija koja će se izvršiti na klik i na kraju se sve to "zalijepi" na input gumb.)

Zero Clipboard koristi MooTools.


3. SWFObject

SWFObject je JavaScript biblioteka za ugradnju Flash sadržaja u web stranice. Može detektirati razne verzije Flash playera te redirektati preglednik na ne-Flash sadržaj.

Potrebne su nam dvije stvari, prvo je neki spremnik (container):

<div id="flashmovie">
If you see this text you need to install or upgrade Flash plugin.
</div>

a drugo je sam JavaScript:

<script type="text/javascript">
var so = new SWFObject("severina.swf", "myfilm", "400", "200", "10");
so.write("flashmovie");
</script>

(U prijevodu: postavi film "severina.swf" u spremnik koji ima id "myfilm", širina objekta je 400 piksela, visina 200 piksela i potrebna je minimalno Flash verzija 10.)


4. Uploadify

Uploadify je Flash+JavaScript komponenta za upload datoteka na moderan način: više datoteka istodobno, s vizualnim uvidom u postotak poslanog, uz JavaScript kontrolu svih događaja.

Primjer korištenja:

JavaScript koji se izvršava na početku:

$(document).ready(function() {
$('#upload').uploadify({
'uploader' : '/uploadify/uploadify.swf',
'script' : '/uploadify/uploadify.php',
'cancelImg' : '/uploadify/cancel.png',
'folder' : '/uploads',
'auto' : true
});
});

(Postavljamo putanje do Flash komponente, do upload skripte na drugoj strani, do upload direktorija i još par sitnica.)

Nakon ovog dovoljno je napisati

<input id="upload" name="upload" type="file" />

i kod je spreman. U PHPu s druge strane baratamo s datotekama na stari način, koristeći funkciju move_uploaded_file().

Uploadify koristi jQuery i SWFObject. Dokumentacija.


5. SoundManager

Namjena SoundManagera je jednostavno upravljanje sa zvukovima i melodijama na web stranici. Podržava MP3, MPEG4 te HTML5 audio.

Da bismo ga koristili potrebno je prvo inicirati zvuk:

<script type="text/javascript">

soundManager.onload = function()
{
soundManager.createSound({
id : 'zvuk',
url : 'zvuk.mp3',
})
}

</script>

I kad želimo "odsvirati" zvuk.mp3 nabijemo nešto kao:

<button onclick="javascript:soundManager.play('zvuk')">zvuk</button>

Za ostale stvari poput rukovanja događajima, sviranja u petlji, debugiranja itd. zavirite u opširnu dokumentaciju.

• • •

Taaako, sad imam gdje pogledati ako/kad mi zatreba. ;) Slijedeći put na redu su PHP funkcije. Bazinga!


PS. Is It Weekend Yet?