Arkiv for marts 2008

omFlash fylder 2 år

mandag, 31. marts 2008

Fik lige set i arkivet, at omFlash fyldte 2 år i lørdags, utroligt så hurtigt som tiden er gået.

Så, hip hip hurra, og så det lange, hurraaaaaaaaa :-)

ActionScript 3 performance tip: Slå mouseEnabled og mouseChildren fra

torsdag, 27. marts 2008

Jeg kan ikke tage æren for dette ActionScript 3 tip, men det skal ikke udelukke mig fra at bringe det:
Hvis du har mange objekter på scenen, så kan man ofte halvere CPU forbruget ved at sætte mouseEnabled = false og mouseChildren = false på de objekter som rent faktisk ikke skal interagere med musen.

Så, tak til NateJC for at dokumentere det:
mouseEnabled and mouseChildren Affect CPU Load

Og til Ryan Taylor for at påpege det (se den første kommentar):
Does this code make my Flash look fat?

Flash Player 9 update på vej som kan få dine sider til at fejle

onsdag, 26. marts 2008

Åh åh, så skal vi til det igen, i April releaser Adobe en update til Flash Player 9 med opdateret og dermed også forbedret sikkerhed.

Desværre betyder det så også, at noget eksisterende indhold ikke vil fungere mere, i hvert fald ikke uden at man tager de fornødne forholdsregler.

Ændringerne berører primært:
- allowScriptAccess
- Socket connections
- Custom http-headers

Præcis hvad der ændres er en temmelig lang historie, så vil absolut anbefale at du læser Adobes egen meddelelse om updaten:
Preparing for the Flash Player 9 April 2008 Security Update

Samt Senoculars lille sammenskrivning af tingene:
Hello New Flash Player Update, Breaker of Web Sites

Hvor er det dog belastende at der endnu engang kommer en update som kan breake eksisterende indhold, men måske er det bare ikke til at undgå, ved det ikke, men irriterende er det i hvert fald.

Adobe Developer Week

tirsdag, 25. marts 2008

Hold da op, utroligt at jeg slet ikke har opdaget det før nu, men denne uge er altså Adobe Developer Week.

Det betyder at der i løbet af ugen vil være en række online video-seminarer om en masse spændende ting, blandt andet en hel del om AIR.

Du kan se listen her:
Adobe Developer Week 2008

Det er som sagt i DENNE uge, så du skal være hurtig hvis du skal nå at registrere dig.

I øvrigt så er ugen mest henvendt mod det amerikanske marked, så derfor er tidspunkterne ikke helt optimale for os i Europa, men onsdag d. 26. marts fra kl. 16-17 CET er der eksempelvis “Adobe AIR Local Data Storage Options With Emphasis on Using Embedded SQL Databases”, så det er absolut ikke umuligt at finde noget spændende.

Godt igang med SwfObject 2.0

tirsdag, 18. marts 2008

Som lovet i går kommer her en introduktion til SwfObject 2.0 - den bedste måde at embedde swf-filer i html.

Hvorfor egentlig SwfObject?
Se, det er en rigtig, rigtig, RIGTIG lang historie og en historie der er så betændt og så fyldt med religion at jeg ikke vil komme ind på det i denne artikel, vi har haft Muhammed-kriser nok ;-)

Kort fortalt kan man bare sige, at SwfObject i øjeblikket er den bedste måde at embedde swf-filer på, hvis man vil sikre kompatabilitet på tværs af flest mulige platforme og sikre at de brugere som ikke har den nødvendige version af, eller slet ikke har, Flash Player installeret bliver præsenteret for alternativt indhold.

Hvis du er nysgerrig og ikke er bange for at vove dig ud på det dybe vand, så kan denne artikel fra februar 2007 af Bobby Van Der Sluis anbefales:
Flash Embedding Cage Match

Step 1: Download
Første skridt for at komme igang med SwfObject 2.0 er *indsæt selv fanfare* at downloade den, og det kan ske herfra:
SwfObject download på Google Code

Du skal bare nappe den første fil, som i skrivende stund hedder swfobject_2_0.zip, gemme den og pakke den ud.

Index.html og index_dynamic.html indeholder eksempler på hvordan du bruger SwfObject 2.0 og er sådan set rigtigt nemme at gå til.

Static vs dynamic
Det gamle SwfObject havde kun en måde at embedde indhold på, men dens nye har 2 måder, henholdvis static og dynamic.

Static (som svarer til index.html) anbefales til sites hvor det er vigtigt at alting virker selvom brugeren ikke har javascript aktiveret.
Den største ulempe er, at den ikke fjerner den belastende “Klik for at aktivere”-markering i Internet Explorer og derudover er koden væsentlig mere kluntet og dermed sværere at overskue.

Dynamic (som svarer til index_dynamic.html) er den der ligger tættest op af den tidligere version af SwfObject og har som største fordel at man ikke skal klikke for at aktivere, samt at koden er meget enkel at overskue og ikke indeholder dobbeltkonfekt, altså ens værdier som skal rettes flere steder.

Hvilken metode der passer bedst til dig skal jeg ikke kunne sige, men hvis de ting du laver primært skal virke på almindelige computere, hvad enten det drejer sig om Macs eller pc’ere, så vil jeg anbefale dynamic, og det er også den metode som jeg vil gennemgå.

Hvis det er kritisk for de ting du laver at de også virker på meget alternative enheder, eksempelvis Sony PSP, så er static vejen frem.

Step 2: Struktur
For at forstå hvordan SwfObject virker, så er det vigtigt at vide at der er tale om en to-trins-raket:
En <div> placeret der på siden hvor Flash-indholdet skal vises, samt en smule javascript i toppen.

Her er grundstrukturen, som stort set svarer til index_dynamic.html, men da denne blog er super dårlig til at vise html-kode, så er den skåret lidt til for overskuelighedens skyld:

<html>
<head>
	<title>SWFObject v2.0 dynamic embed sample page</title>
	<script type="text/javascript" src="swfobject.js"></script>
	<script type="text/javascript">
	swfobject.embedSWF("test.swf", "myContent", "300", "120", "9.0.0", "expressInstall.swf");
	</script>
</head>
<body>
	<div id="myContent">
		<h1>Alternative content</h1>
	</div>
</body>
</html>

Step 3: Scriptet
I toppen er der to scripts, det første sørger for at inkludere swfobject.js som indeholder al funktionaliteten, og som derfor i øvrigt også skal kopieres med ud på serveren sammen med html og swf-filerne:

<script type="text/javascript" src="swfobject.js"></script>

Den næste, og væsentligt sjovere linie er denne:

swfobject.embedSWF("test.swf", "myContent", "300", "120", "9.0.0", "expressInstall.swf");

embedSWF funktionen er den funktion som overskriver <div> med swf-filen, og dermed den funktion som får det hele til at ske.

Den har følgende parametre:
- Sti til swf-fil (”test.swf”)
- ID på det <div> der skal overskrives (”myContent”)
- Bredde på swf’en (”300″)
- Højde på swf’en (”120″)
- Minimums Flash Player version (”9.0.0″)
- Sti til expressInstall.swf (”expressInstall.swf)

Den eneste som måske ikke giver sig selv er expressInstall.swf, men det er en fil som gør Flash Player i stand til at opdatere sig selv til nyeste version, uden at brugere skal forlade sitet.
Medmindre du har specifik grund til andet, så hav den endelig med. Du kan læse mere om Express Install her:
Express Install FAQ

Step 4: Ekstra parametre og Flashvars
Hvis man bruger funktionen i den viste, den reneste form, så skal den nok inkludere swf-filen, men ofte har man jo brug for at stille på et eller flere af de mange parametre, eksempelvis wmode, allowscriptaccess med flere, eller brug for at kunne sende egne værdier med ind i Flash-filen, og hvad gør man så?

Til det formål byder SwfObject på to objekter, henholdsvis flashvars og params.

Params er til de indbyggede parametre, såsom wmode, mens flashvars er til dine egne værdier.

Med begge dele, kunne scriptet i toppen nu se således ud:

<script type="text/javascript">
	var flashvars = {};
	flashvars.feed = "http://www.myfeed.dk/feed.xml";

	var params = {};
	params.menu = "false";
	params.bgcolor = "#000000";
	params.allowfullscreen = "true";

	swfobject.embedSWF("test.swf", "myContent", "300", "120", "9.0.0", "expressInstall.swf", flashvars, params, false);
</script>

Step 5: Upload
Jep, det var det!

Så let er det at bruge SwfObject 2.0 og dermed at sikre maksimal kompatabilitet.

Du kan se den komplette index_dynamic.html i aktion her:
SWFObject v2.0 dynamic embed sample page

En endnu nemmere måde!
Hvis du, som jeg, synes at koden nok ser nem ud at rette i, men aldrig helt kan huske hvad de forskellige variabler hedder og aldrig lige kan finde et godt eksempel blandt dine gemte kodestumper, så er der endnu en rigtig god nyhed ved SwfObject 2.0, nemlig html-generatoren!

De har nemlig været så flinke at lave en lille applikation, hvor man kan se alle tilgængelige muligheder, stille ved dem man ønsker, trykke generate og voila, så har man den færdige html og javascript, lige til at sætte ind, nemmere bliver det ikke!

Den findes i to versioner, en i html og en i AIR og begge dele kan også downloades fra Google Code:
SwfObject download på Google Code

Herunder kan du se et screenshot af AIR version, klik for at se det i fuld størrelse:

Det var vidst det, rigtig god fornøjelse med SwfObject 2.0!

SwfObject 2.0 er på gaden!

mandag, 17. marts 2008

Så skete det endelig, version 2.0 af vores allesammens favoritmetode til at embedde Flash-indhold er på gaden!

Projektet gik en overgang under navnet Swffix, da det skulle tage det bedste fra SwfObject 1.5 og UFO, men endte i sidste ende med at hedde SwfObject 2.0.
Hvis man kigger på den nye syntax, så kan man sagtens se hvorfor, for den minder utrolig meget om den gamle, men alligevel med lidt små justeringer.

Inden for kort tid skal jeg nok lave en lille artikel som viser hvordan man bruger SwfObject 2.0, men i første omgang ville jeg bare lige sprede den gode nyhed om den rent faktisk er på banen.

Du finder den her:
SwfObject på Google Code

Silverlight 2.0 - Nu også med DeepZoom?!

torsdag, 6. marts 2008

Ved keynoten på Microsoft’s MIX konference blev der i går, traditionen tro, løftet sløret for en række nye tiltag fra Microsoft, og et af disse var Silverlight 2.0 Beta 1.

Jeg skal ærligt sige at jeg endnu ikke i detaljer har været inde og læse hvad der er af nyt i Silverlight 2.0, så udover den lovede mulighed for indbyggede input-felter (som jo ikke var en del af 1.1!), så har jeg endnu ikke et overblik over præcis hvad den kan eller ikke kan.

HardRock DeepZoomDet som jeg synes er det sjove, er at de brugte et nyt HardRock Memorabilia som det helt store og lækre eksempel på mulighederne i Silverlight 2.0.
Det der er den unikke funktion på sitet er den såkaldte DeepZoom, hvor man kan zoome trinløst ind på et billede - eller, det vil så sige, det er faktisk ikke engang trinløst, men i foruddefiberede zoom-niveauer og der opstår ofte load-pauser når den så skal loade den detaljerede version, fuldt ud på linie med det man er van til når man zoomer ind på satelitbillederne på Google Maps.

Og, så er det jeg spørger mig selv: Hvad er det fantastiske lige i det?
Funktionen er absolut god og fin, men at fremhæve den som det store nye på en MIX konference, det forstår jeg simpelthen ikke?

Men hey, kunne jo være at Microsoft bare var bange for at vise noget som var for fantastisk, det blev jo vist for de samme udviklere som nærmest var ved at dåne over muligheden for dynamisk at tegne en firkant med en gradient da version 1.0 blev vist frem, og set i det lys, så er DeepZoom jo så absolut imponerende ;-)

Du kan selv se sitet her:
HardRock Memorabilia

En anden ting der også blev nævnt er, at Silverlight fremover også vil findes i en mobilversion, som i første omgang vil være at finde på Nokia N95, men inden for kort tid også til mange andre telefoner.
Den nyhed synes jeg faktisk er mere interessant, for den falder dagen efter, at Steve Jobs udtalte at der ikke vil komme en Flash Player til iPhone, da den ganske enkelt er for ressourcekrævende.
Hvis Silverlight ender med at vinde det kapløb, så kan det godt ende med at få en stor betydning for om det er den eller Flash der bliver defacto-standarden på mobilen.

I øvrigt kan du finde et længere sammendrag med stikord fra MIX keynoten her:
Microsoft MIX keynote one, live from Las Vegas

Cubo - realistisk pseudo-3D ansigt

tirsdag, 4. marts 2008

Cubo
Nogen ting kræver ikke ingen forklaring for at man kan forstå hvor fede de er, og Cubo er absolut en af de ting.

Funktionaliteten er ganske simpel, et ansigt der ændrer sig i forhold til musens position, men aldrig før er den set så realistisk i Flash.

Absolut et kig værd:
CUBOCC

Visuals til Se mor! fødselsdagsfest

mandag, 3. marts 2008

Der var lidt stille her på bloggen i sidste uge, og det skyldes simpelthen at vi i fredags d. 29. februar holdt en stor 1 års fødselsdagsfest for det firma som jeg er medstifter af, Se mor!.
Derfor gik det meste af min tid i sidste uge med de praktiske forberedelser til festen, samt ikke mindst, på at lave nogle sjove visuals der kunne vises på projektor.

Resultatet blev en lille applikation med både almindelige videoklip, såvel som lidt interaktivt webcamsjov.

Da det hele ikke giver sig selv, skulle kun betjenes af os, så kommer der her en lille forklaring, link følger til sidst.

Det overordnede
Vi ville gerne have en applikation som kunne køre hele aftenen, uden at vores almindelige skrivebord nogensinde blev synligt for gæsterne, så derfor valgte vi at lave en samlet applikation med det hele i, som vi kunne betjene via tastaturet, nærmere betegnet med tasterne 1-5 samt 0.

NB: Virker kun på de almindelige tal, ikke på det numeriske tastatur.

Tast 1

En lille stiliseret video hvor man ser en papirflyver blive foldet.

Tast 2

En række stills med farvekridt sat sammen til en video.

Tast 3

Igen række stills sat sammen til en video.

Tast 4

Viser indholdet fra et webcam 24 gange, men med et delay på 100 millisekunder mellem hvert billede.
Derudover ændrer trekanternes mønster sig også tilfældigt.

Tast 5

Papirflyvere som genereres automatisk og herefter flyver henover skærmen mens de trækker et røgslør efter sig.
Selvom man ikke lige kan se det, så gør denne applikation også brug af webcammet.

Hver gang en ny papirflyver genereres, så tager den et snapshot fra webcammet og beregner gennemsnitsfarven på det, og det er så denne farve som bruges til røgsløret.
Prøv selv at vifte med hænderne foran de webcam, eller at holde noget med en kraftigt farve hen foran det.

Tast 0
De fleste af disse visuals er ganske korte, og eftersom vi helst også skulle have tid til gæsterne, så kunne vi jo ikke bruge hele aftenen foran skærmen.
Derfor er 0 simpelthen en selvkørende random-funktion, hvor den med jævne mellemrum selv skifter mellem de forskellige visuals.

Effekt
Meget mod min forventning, så opførte Flash sig eksemplarisk hele aftenen, så vi havde faktisk ikke et eneste nedbrud på vores visuals, hvilket i sig selv var fedt.
Og, derudover viste det sig at være rigtig fedt at kunne skifte hurtigt mellem de forskellige scener med tastaturet, noget som vi blandt andet brugte til at ramme takten under koncerten med Turboweekend.

Link
Og her kommer linket så, men inden du klikker på det, så husk at det er en applikation som egentlig er lave til offline brug, og derfor er der ikke nogen loader, på trods af at den fylder 12 MB.
Når den kommer frem og beder om adgang til webcammet, så er den loadet, og herefter kan du trykke på 1-5 samt 0 for at se hvad den kan.

Se mor! party visuals

Invitationen
I øvrigt, så er invitationen også lavet i Flash, med brug af Turboweekends musik og lidt sjov med ComputeSpectrum:
Se mor! 1 års fødselsdagsfest