Archives Posts

Jquery Kid. A small fry with a big mind & a very bright future.

May 18th, 2008 by steamfrog

Jquery KID! I’m so jealous. Why wasn’t jquery around when I was that age.. All I had was atari :(

atari.jpg

Share and Enjoy:

These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • del.icio.us
  • Netvouz
  • DZone
  • ThisNext
  • MisterWong
  • Wists
  • blinkbits
  • BlinkList
  • blogmarks
  • Fark
  • Fleck
  • Furl
  • IndiaGram
  • IndianPad
  • Linkter
  • Ma.gnolia
  • NewsVine
  • Reddit
  • Simpy
  • Slashdot
  • Smarking
  • SphereIt
  • Spurl
  • StumbleUpon
  • Taggly
  • TailRank
  • Technorati
  • YahooMyWeb
Filed under Feedback having No Comments »

Archives Posts

Play Quicktime in flash using the FLV components

May 18th, 2008 by steamfrog

I spent at least 3 hours hunting around for any kind of tutotial on “perloader for quicktime” & “making quicktime faster” blah blah. In the end I gave up… well sort of.

All I wanted to do is have the remote quicktime load faster than it was, my viewers were sitting in front of a black screen or the damn Quicktime icon for 10 minutes while the 64mb file did it’s thing. One word for that Boooring, in fact is it wasn’t my site I’d be clicking away & going somewhere else.


So here is my solution.

First off you should know how to use swf object and how to use the video component in flash.

Open flash and go to the components screen.
1.png

Add an instance to the stage, rezise it to suit your needs and all that stuff. Now open the component Inspector (same menu as the component)

3.png

In the source panel write the FULL URL of the quicktime file (I even used an MP4 file)

Save & publish as you normally would.

The end result should be a streaming Quicktime experience as seen below. It even has the standard flv controls.
4.png

Cool.. ok here is the best part you can pass a FlashVar to this via the swfobject. Get SWF object from here: http://blog.deconcept.com/swfobject/

Add this between the <head> tags <script type="text/javascript" src="js/swfobject.js"></script> & this to the area in the body of your page where you want the flash to play.

<script type="text/javascript">
// <![CDATA[
var so = new SWFObject("name of the SWF you made earlier.swf","sotester", "630", "550", "9.0.124", "#FFFFFF");
so.addVariable("vidURL", "http://example.com/movie.mp4");
so.useExpressInstall('expressinstall.swf');
so.write("#ID of the DIV the flash will be in");

// ]]>
</script>

Change this to any url with php and you have a dynamic player.

so.addVariable("vidURL", "http://example.com/movie.mp4");

Doing the same thing with Netstream

To preload an FLV file:

1. Create a new FLA file called preloadFLV.fla.

2. In the Library panel (Window > Library), select New Video from the Library
pop-up menu.

3. In the Video Properties dialog box, name the video symbol and select Video (ActionScript controlled).

4. Click OK to create a video object.

5. Drag the video object from the Library panel to the Stage to create a video object instance.

6. With the video object selected on the Stage, type my_video in the Instance Name text box in the Property inspector (Window > Properties > Properties).

7. With the video instance still selected, type 320 in the width text box and 213 in the height text box in the Property inspector.

8. Select Frame 1 in the Timeline, and open the Actions panel (Window > Actions).

9. Type the following code in the Actions panel:

var connection_nc:NetConnection = new NetConnection();
connection_nc.connect(null);
var stream_ns:NetStream = new NetStream(connection_nc);
my_video.attachVideo(stream_ns);
stream_ns.play(vidURL); – See the swfobject code above!

this.createTextField(”loaded_txt”, this.getNextHighestDepth(), 10, 10, 160, 22);
var loaded_interval:Number = setInterval(checkBytesLoaded, 500, stream_ns);
function checkBytesLoaded(my_ns:NetStream) {
var pctLoaded:Number = Math.round(my_ns.bytesLoaded / my_ns.bytesTotal * 100);
loaded_txt.text = Math.round(my_ns.bytesLoaded / 1000) + ” of ” + Math.round(my_ns.bytesTotal / 1000) + ” KB loaded (” + pctLoaded + “%)”;
progressBar_mc.bar_mc._xscale = pctLoaded;
if (pctLoaded >= 100) {
clearInterval(loaded_interval);
}
}

10. Select Control > Test Movie to test your code.

Share and Enjoy:

These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • del.icio.us
  • Netvouz
  • DZone
  • ThisNext
  • MisterWong
  • Wists
  • blinkbits
  • BlinkList
  • blogmarks
  • Fark
  • Fleck
  • Furl
  • IndiaGram
  • IndianPad
  • Linkter
  • Ma.gnolia
  • NewsVine
  • Reddit
  • Simpy
  • Slashdot
  • Smarking
  • SphereIt
  • Spurl
  • StumbleUpon
  • Taggly
  • TailRank
  • Technorati
  • YahooMyWeb
Filed under Feedback having No Comments »

Archives Posts

Variable data publishing.

May 1st, 2008 by steamfrog

OK hold onto your hats I have just completed a great video tutorial series on the all time exciting subject of variable data publishing using Illustrator/Photoshop/Indesign. Learn how Variable data publishing will help you speed up those repetitive tasks we designers face when working on large design projects.

Yeah whatever… what is variable data publishing?
It’s the ability to assign data areas to documents.

Variable Data Publishing automates the creation of customized communications by merging a page layout design with data imported from a database and/or images imported from a digital asset repository. Variable Data Printing automates the production of the customized materials. - Wikipedia

An example:

Your working in a design studio and doing a great job with the Illustrator card designs, sweet, then your boss walks in with a job for 500 cards for a big tech firm close by… OMFG!!

Lets do the math on this job

500 cards =
500 names +
500 phone numbers +
500 job titles +
500 mobile numbers
that’s over 2000 data changes in this one job.

The tutorial I have created for you will show you how you can complete this job in a morning, before lunch even… coolies.
Combined with a bit of xml you life will dramatically improve & your work flow will be easier.


Variable data will work with.
Illustrator
Indesign
Photoshop

Stay tuned and when I have this online you will be the first to know about it.

Share and Enjoy:

These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • del.icio.us
  • Netvouz
  • DZone
  • ThisNext
  • MisterWong
  • Wists
  • blinkbits
  • BlinkList
  • blogmarks
  • Fark
  • Fleck
  • Furl
  • IndiaGram
  • IndianPad
  • Linkter
  • Ma.gnolia
  • NewsVine
  • Reddit
  • Simpy
  • Slashdot
  • Smarking
  • SphereIt
  • Spurl
  • StumbleUpon
  • Taggly
  • TailRank
  • Technorati
  • YahooMyWeb
Filed under Feedback having No Comments »

Archives Posts

SWFobject 2.0 has arrived! & with AIR

May 1st, 2008 by steamfrog

SWFObject is an easy-to-use and standards-friendly method to embed Flash content, which utilizes one small JavaScript file.

No more “click to activate” in IE !

Swfobject comes in 3 great flavors the standard js and examples all in a handy .zip file. A standalone AIR file which is really handy as it allows you to install as a program and use easily when ever you need. It also gives the ability for the user (you) to change a lot of the parameters and add some cool additions to the swfobject that you may not have been able to do previously.

And last but not least the trusty html version, exactly the same as the AIR version with all the groovy features, simply activate through the browser as a webpage.

GRAB IT HERE - http://code.google.com/p/swfobject/

Share and Enjoy:

These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • del.icio.us
  • Netvouz
  • DZone
  • ThisNext
  • MisterWong
  • Wists
  • blinkbits
  • BlinkList
  • blogmarks
  • Fark
  • Fleck
  • Furl
  • IndiaGram
  • IndianPad
  • Linkter
  • Ma.gnolia
  • NewsVine
  • Reddit
  • Simpy
  • Slashdot
  • Smarking
  • SphereIt
  • Spurl
  • StumbleUpon
  • Taggly
  • TailRank
  • Technorati
  • YahooMyWeb
Filed under Feedback having No Comments »