Other Websites

  • SeaCloud9 Interactive
  • SeaCloud9 Commercial Development
  • i-os
  • stArcade9

Brendon Smith Social Networks

  • On Linkedin
  • Bookmarks
  • On Twitter
  • On Facebook
Open ↓ Close ↑
  • Home
  • Subscribe
Browse: Home / jQuery CenterIT

i-create | therefore-i am

i-create | therefore i-am | a blog about opensource technology and rich internet applications

 

jQuery CenterIT

By Brendon Smith on February 7, 2010

 

Have you ever had to deal with the hassle of centering modal windows? I made this function to automagically center windows I call this function after I load a modal and it centers the object perfectly for every browser. It takes the hassle of wondering if something is perfectly center in every browser. The only thing I do to use it is send it the main containing div that the object should be centered in and the div that I want to be centered. It grabs the offset does a little basic math and that’s it. No more hassle with centering now it will be perfectly centered.

function CenterIT(mainModal, mainContainer) {
    var modalW = $(mainModal).width() / 2;
    var windowW = $(mainContainer).width() / 2;
    var modalH = $(mainModal).height() / 2;
    var windowH = $(mainContainer).height() / 2;
    var centerPointW = windowW - modalW;
    var centerPointH = windowH - modalH;
    var myPoint = $(mainContainer).offset();
    centerPointW = myPoint.left + centerPointW;
    centerPointH = myPoint.top + centerPointH;
    $(mainModal).css('left', centerPointW);
    $(mainModal).css('top', centerPointH);   
}

Some Useful/Interesting Flash Links:
Prefab – Highly useful tool when it comes to 3D in flash with Away3D
Snook on HTML5 and Adobe

Some Useful/Interesting JavaScript Links:
Javascript RayCaster
Burst Engine for SVG in JavaScript
Canvas 3D
JS3D library
Parallax in CSS
WebGL Example

  • Share/Bookmark

Posted in 3d, JavaScript, QuickTip | Tagged JavaScript, JavaScript programming language, JQuery, quick tip, QuickTip, webGL | Leave a response

 

404 Errors Hyped With PaperVision3d pt. 2

By Brendon Smith on February 7, 2010

 


  1. Capture URL for search with JavaScript and Pass it to Flash
  2. Search Google from URL parsing
  3. Use of Random Range
  4. Create an Array of Spheres that holds the Google results
  5. Apply the title field to a Text3D and add that as a child to the Sphere
  6. Apply an Event to the Sphere to navigate to the Google result.
  7. How to trace out events from flash to Firebug

This tutorial uses the following libraries of code:
Hype
PaperVision3d
googleas3api

I chose to omit the parallax effect. You can find an excellent example of the parallax effect on gotoandlearn.com, .Net , and web designer magazine. I might modify this swf later to have youtube results and render them as planes. If you go to seacloud9.org and look for a page that you know is not on that web server it will serve up google results and display them in three dimensions randomly. This page is distracting on purpose but It was kind of fun to make. You can go to the page results by clicking on the sphere. You can move the viewport of the search results by moving the sliders.

JavaScript to retrieve the url location and parse it:

    var gResult;
    var gResultL;
    function getQueryString(){
    var qString = window.location;
    myReg  = new RegExp("http://seacloud9.org/");
    var url = qString.href.replace(myReg, "");
    return url;
    }
 
    function googleResultArray(googleResult){
        gResult = googleResult;
    }
 
    function getGoogleTitle(titleNum){
        return gResult[titleNum];
    }

ActionScript 3 Code behind for SWF all Google Search code and Debugging

package {
    import flash.display.*;
    import flash.events.*;
    import flash.events.Event;
    import flash.filters.BitmapFilterQuality;
    import flash.filters.BlurFilter;
    import fl.transitions.*;
    import flash.media.Sound;
    import flash.net.URLLoader;
    import flash.net.URLRequest;
    import flash.net.URLRequestMethod;
    import flash.net.navigateToURL;
    import org.papervision3d.cameras.Camera3D;
    import org.papervision3d.objects.primitives.Plane;
    import org.papervision3d.objects.primitives.Sphere;
    import org.papervision3d.render.BasicRenderEngine;
    import org.papervision3d.scenes.Scene3D;
    import org.papervision3d.view.Viewport3D;
    import org.papervision3d.typography.Font3D;
    import org.papervision3d.typography.Text3D;
    import org.papervision3d.materials.BitmapFileMaterial;
    import org.papervision3d.materials.special.Letter3DMaterial;
    import org.papervision3d.typography.fonts.HelveticaBold;
    import org.papervision3d.materials.MovieMaterial;
    import org.papervision3d.materials.*;
    import org.papervision3d.events.InteractiveScene3DEvent;
    import hype.framework.core.TimeType;
    import hype.framework.rhythm.SimpleRhythm;
    import hype.framework.sound.SoundAnalyzer;
    import org.papervision3d.lights.PointLight3D;
    import org.papervision3d.materials.shadematerials.CellMaterial;
    import flash.external.ExternalInterface;
    import be.boulevart.google.events.*;
    import     be.boulevart.google.ajaxapi.search.web.*;
    import     be.boulevart.google.ajaxapi.search.web.data.*;
    import     be.boulevart.google.ajaxapi.search.*;
 
 
    public class e404 extends MovieClip {
        public var viewport:Viewport3D;
        public var scene:Scene3D;
        public var camera:Camera3D;
        public var viewport2:Viewport3D;
        public var scene2:Scene3D;
        public var camera2:Camera3D;
        public var plane:Plane;
        public var plane2:Plane;
        public var plane3:Plane;
        public var sphere:Sphere;
        public var font3d:Font3D;
        public var text3d:Text3D;
        public var fontMat:Letter3DMaterial;
        private var cell:CellMaterial;
        private var sphereArr:Array;
        public var light:PointLight3D;
        public var renderer:BasicRenderEngine;
        public var renderer2:BasicRenderEngine;
        public var googleTitle:Array = new Array();
        public var googleLink:Array = new Array();
        public var googleWebSearch:GoogleWebSearch=new GoogleWebSearch();
        public var googURL:URLRequest;
 
 
        public function e404():void {
            addEventListener( Event.ENTER_FRAME, e404Go );
 
        }
        private function onWebResults(e:GoogleSearchEvent):void {
            var resultObject:GoogleSearchResult=e.data as GoogleSearchResult;
            ExternalInterface.call( "console.log" ,"Estimated Number of Results: "+resultObject.estimatedNumResults);
            ExternalInterface.call( "console.log" ,"Current page index: "+resultObject.currentPageIndex);
            ExternalInterface.call( "console.log" ,"Number of pages: "+resultObject.numPages);
 
            for each (var result:GoogleWebItem in resultObject.results) {
                googleTitle.push(result.title);
                googURL = new URLRequest (result.url);
                googleLink.push(googURL);
                ExternalInterface.call( "console.log" ,"link:"+result.url+"title:"+result.title );
            }
 
            ExternalInterface.call( "googleResultArray" , googleTitle );
            //build 3d world now that we have our google search!
            init3D();
            createSearch();
            addEventListeners();
        }
 
        private function onAPIError(evt:GoogleAPIErrorEvent):void {
            trace("An API error has occured: " + evt.responseDetails, "responseStatus was: " + evt.responseStatus);
        }
 
        public function e404Go(e:Event):void {
            removeEventListener(Event.ENTER_FRAME,e404Go );
            // Create the container Sprite
            stage.scaleMode=StageScaleMode.NO_SCALE;
            stage.align=StageAlign.TOP_LEFT;
            //this javascript function returns the query string from the window location
            googleWebSearch.search(ExternalInterface.call( "getQueryString" ),0,"english");
            googleWebSearch.addEventListener(GoogleAPIErrorEvent.API_ERROR,onAPIError);
            googleWebSearch.addEventListener(GoogleSearchEvent.WEB_SEARCH_RESULT,onWebResults);
 
        }
 
        private function init3D():void {
            // VIEWPORT
            viewport=new Viewport3D(0,0,true,false);
            viewport2=new Viewport3D(stage.width,stage.height,true,true);
            addChild( viewport );
            addChild( viewport2 );
            //
            // RENDERER
            renderer = new BasicRenderEngine();
            renderer2 = new BasicRenderEngine();
            //
            // SCENE
            scene = new Scene3D();
            scene2 = new Scene3D();
            //
            // CAMERA
            camera = new Camera3D();
            camera.zoom=11;
            camera.focus=100;
 
            camera2 = new Camera3D();
            camera2.zoom=11;
            camera2.focus=100;
        }
 
        private function createSearch():void {
            // Set some colors so we can see if loading is still happening,
            // or if it failed
            BitmapFileMaterial.LOADING_COLOR=0x000000;
            BitmapFileMaterial.ERROR_COLOR=0xFF0000;
            //
            var material:BitmapFileMaterial=new BitmapFileMaterial("404e.png");
            material.doubleSided=true;
            var material2:BitmapFileMaterial=new BitmapFileMaterial("404e2.png");
            material2.doubleSided=true;
            var material3:ColorMaterial=new ColorMaterial(0xFC0606,.3);
            material3.doubleSided=true;
            light=new PointLight3D(true);
            light.z=0;
            light.y=randomRange(-30,280);
            light.x=randomRange(-350,500);
 
 
            //
            plane=new Plane(material,300,100,10,10);
            plane.x=-350;
            plane.y=265;
 
            // Second ViewPort objects sphere and text from google
            sphereArr = new Array();
            for (var i:int = 0; i < googleTitle.length; i++) {
                var myPattern:RegExp = /<b>/g;
                var myPattern2:RegExp = /<\/b>/g;
                var googSearch:String = new String(googleTitle[i].toString());
                googSearch = googSearch.replace(myPattern, "");
                googSearch = googSearch.replace(myPattern2, "");
                sphere=new Sphere(buildCell(),randomRange(10,100),randomRange(5,20),10);
                sphere.x=randomRange(-500,500);
                sphere.y=randomRange(-500,500);
                sphere.z=randomRange(-500,500);
                try{
                var colorPoolCell:Array = new Array(0x9F3F11, 0xFC0606, 0x9FC1BE, 0x787D29, 0xE0D4BA, 0x911F15, 0xBFCDF2, 0xF0EEF1);
                var colorID:int = randomRange(7, 0);   
                fontMat = new Letter3DMaterial(colorPoolCell[colorID]);
                font3d = new HelveticaBold();
                text3d = new Text3D(googSearch, font3d,  fontMat);
                text3d.x = sphere.x + googSearch.length + 10;
                text3d.y = sphere.y + 10;
                //text3d.z = sphere.z + 10;
                sphere.addChild(text3d);
                sphere.id = i;
                scene2.addChild( sphere );
                sphereArr.push(sphere);
                }
                catch(e:Error){
                    // Sometimes the google title font3D will fail but we can catch it so it doesn't
                    // have a nasty flash epic fail warning..
                    ExternalInterface.call( "console.log" , "Error Reached = " + e);
                }
 
 
 
            }
            //create the 3D planes for the first ViewPort
 
            plane2=new Plane(material2,300,100,10,10);
            plane2.x=-350;
            plane2.y=265;
            plane2.z=-60;
            plane3=new Plane(material3,800,150,10,10);
            plane3.x=-350;
            plane3.y=285;
            plane3.z=80;
            //
            scene.addChild( plane );
            scene.addChild( plane2 );
            scene.addChild( plane3 );
            addListner();
        }
        function addListner():void{
            for(var i:int = 0; i < sphereArr.length; i++){
            try{
            sphereArr[i].addEventListener( InteractiveScene3DEvent.OBJECT_PRESS, callLink );
            ExternalInterface.call( "console.log" , "Event Added" + i);
            }catch(e:Error){
                ExternalInterface.call( "console.log" , e);
            }
            }
        }
        function callLink(e:InteractiveScene3DEvent):void {
            try {
                navigateToURL(googleLink[e.target.id], '_blank');
                ExternalInterface.call( "console.log" , "link Clicked --" + e.target.id + "Link Called - " + googleLink[e.target.id]);
            } catch (err:Error) {
                ExternalInterface.call( "console.log" , err + " id: " + e.target.id + "Errored on: " + googleLink[e.target.id].toString() );
            }
        }
 
 
 
        function buildCell():CellMaterial {
            var colorPoolCell:Array = new Array(0x9F3F11, 0xFC0606, 0x9FC1BE, 0x787D29, 0xE0D4BA, 0x911F15, 0xBFCDF2, 0xF0EEF1);
            var colorID:int = randomRange(7, 0);
            var colorID2:int = randomRange(7, 0);
            //random color material generation returns cellMaterial
            //cell=new CellMaterial(light,Math.round(Math.random()*0xFFFFFF),Math.round(Math.random()*0xFFFFFF),100);
            cell=new CellMaterial(light,colorPoolCell[colorID],colorPoolCell[colorID2],100);
            cell.interactive=true;
            return cell;
        }
 
        function randomRange(max:Number, min:Number = 0):Number {
            return Math.random() * (max - min) + min;
        }
 
 
        private function addEventListeners():void {
            addEventListener( Event.ENTER_FRAME, __onEnterFrame );
        }
 
        private function removeEventListeners():void {
            removeEventListener( Event.ENTER_FRAME, __onEnterFrame );
        }
 
        /*===================================================================\\
        ||Listener Functions ||
        \\===================================================================*/
 
        private function __onEnterFrame( e:Event ):void {
            //moves the error planes viewort according to mouse position
            plane.rotationY=viewport.mouseX/4;
            plane.rotationX=viewport.mouseY/4;
            plane2.rotationY=viewport.mouseX/4;
            plane2.rotationX=viewport.mouseY/4;
            plane3.rotationY=viewport.mouseX/4;
            plane3.rotationX=viewport.mouseY/4;
            light.rotationX=viewport2.mouseY/4;
            light.rotationY=viewport2.mouseY/4;
            //
            sldWorld.addEventListener("change", updateWorldAxisValue);
            sldZoomCam.addEventListener("change", updateCamerValue);
            this.setChildIndex(sldWorld, this.numChildren-1);
            this.setChildIndex(sldZoomCam, this.numChildren-1);
            renderer.renderScene( scene, camera, viewport );
            renderer2.renderScene( scene2, camera2, viewport2 );
        }
 
        function updateWorldAxisValue(argument) {
            var sldWorld_value:Number=this.sldWorld.value;
            camera2.rotationY=sldWorld_value;
 
 
        }
        function updateCamerValue(argument) {
            var sldZoomCam_value:Number=this.sldZoomCam.value;
            camera2.zoom=sldZoomCam_value;
 
        }
    }
}

ActionScript3 Timeline Code for Sound Analysis and Image Effects

import hype.extended.behavior.FunctionTracker;
import hype.extended.behavior.Oscillator;
import hype.extended.color.ColorPool;
import hype.extended.layout.GridLayout;
import hype.framework.display.BitmapCanvas;
import hype.framework.sound.SoundAnalyzer;
import hype.extended.behavior.FixedVibration;
var myWidth = stage.stageWidth;
var myHeight = stage.stageHeight;
 
var clipCanvas:BitmapCanvas = new BitmapCanvas(myWidth, myHeight);
addChild(clipCanvas);
 
var clipContainer:Sprite = new Sprite();
 
var soundAnalyzer:SoundAnalyzer = new SoundAnalyzer();
soundAnalyzer.start();
 
var colorPool:ColorPool = new ColorPool(
    0x9F3F11, 0xFC0606, 0x9FC1BE, 0x787D29, 0xE0D4BA, 0x911F15, 0xBFCDF2, 0xF0EEF1
);
 
// xStart, yStart, xSpacing, ySpacing, columns
 
var layout:GridLayout = new GridLayout(0, myHeight / 2, 10, 0, 34);
 
var numItems:int = 64;
var freq:int = 120;
 
for (var i:uint = 0; i < numItems; ++i) {
    var clip:MySquare = new MySquare();
 
    layout.applyLayout(clip);
    colorPool.colorChildren(clip);
 
    // object, property, soundAnalyzer.getFrequencyRange, [startRange, endRange, min, max]
 
    var aTracker:FunctionTracker = new FunctionTracker(clip.myFill, "alpha", soundAnalyzer.getFrequencyRange, [i*4, i*4+4, 0.25, 1.0]);
    var sTracker:FunctionTracker = new FunctionTracker(clip.myFill, "scaleY", soundAnalyzer.getFrequencyRange, [i*4, i*4+4, 0.5, 30.0]);
    aTracker.start();
    sTracker.start();
 
    // target Object, property, waveFunction, frequency, min, max, start value
 
    var yOsc:Oscillator = new Oscillator(clip, "y", Oscillator.sineWave, freq, 60, 600, i/(180/2));   
    yOsc.start();
 
    clipContainer.addChild(clip);
}
 
clipCanvas.startCapture(clipContainer, true);
 
var sound:Sound = new Sound();
sound.load(new URLRequest("http://i-create.org/actionscript/404e/shortCircuitE1.mp3"));
sound.play();
 
var aVibration:FixedVibration = new FixedVibration(cBagHead, "alpha", 0.9, 0.1, 0.0, 1.0, false);
aVibration.start();

You find working examples of this 404 error page working at the following location:
http://seacloud9.org/Processing.org
http://seacloud9.org/Context Free Art
http://seacloud9.org/Generative Art

A few articles that are good reads:
Web development will become much more complicated
The Future of Web Content

  • Share/Bookmark

Posted in 3d, ActionScript, Flash, i-create, MashUp | Tagged ActionScript, Adobe Flash, api, Computer programming, Experiment, JavaScript, MashUp | Leave a response

 

The Evolutionary iPad

By Brendon Smith on January 29, 2010

 

What is my opinion?  It’s awesome I will definitely get one.  I also think it presents a unique opportunity for Google and others to create competing products.   The iPad is essentially a big iPod touch.  So whats the big deal?  Well more cool apps that have yet to be developed.  More useful applications for email, note taking, and wordpress etc.  I could see this device being very useful for consumers and I am not saying Apple is the only one capable of creating a revolutionary change.  They do happen to be the most tactful, creative, and divisive competition though.  I personally would like to have all my books on such a devices why?  I don’t know probably; because I imagine writing notes on virtual pages is less destructive then writing notes on the sides of pages, I pay for I also would like to be able to search all my reference books quickly simultaneously. I am also confident that the user interface will be easy to utilize. I also think it will be highly useful in educational settings. I would think this would be a very handy device for college students. I can also see people creating all sorts of new educational content for kids on it. It seems to me that Macromedia (Adobe) Director and Flash used to own this niche market.

I would also like to point out it is still a very much so walled garden (the size just got larger).  Why are their no competing browsers on the iPod platform, Android has them, why no flash, still 1ghz of speed and no flash?  I think the dominance of the Apple makes it hard to compete iTunes has weight behind it.  This will enable writes, artist everyone really to display their work to a community that can purchase their work easily.  I think both Google and Microsoft can learn from Apples innovative interfaces (Not to say Microsoft hasn’t done a great job with Surface).  I am looking forward to developing for it and on the apple platform.  I am also anxious to see FlashCS5 this will also ensure a boom for the app store.  With the apple bookstore also comes lock in fear as if iTunes wasn’t enough for music.  This could very well be the death kneel for bookstores lets at least hope it angers Amazon enough to utilize Android to create a competing product.  I am also hopeful to hear about Windows Mobile 7 I think it will be awesome to develop mobile applications with Silverlight, Microsoft is in need of a comeback. I think windows 7 will also be on a variety of devices, tablets, etc..

The iPad is evolutionary but not necessarily revolutionary in my opinion.

  • Share/Bookmark

Posted in Apple | Tagged Android, Apple I, Apple Inc., IPod, ITunes, Steve Jobs, Technology/Internet | Leave a response

 

Reloaded..

By Brendon Smith on January 29, 2010

 

Quick Tip:

Utilize Firebug with ActionScript to trace out tough Bugs
Add the import statment at the Top and then call it anywhere Handy:) Note I was having troubles getting it to work with Firebug 1.5 but on Firebug 1.4.5 works like a charm!

import flash.external.ExternalInterface; 
ExternalInterface.call( "console.log" , "Omaha Winter. Camera Z:" + cam.z);

The example below will show it in action if you have Firebug 1.4.5 I will print out a message. This example was built off of Away3d use your arrow keys to move and your “w” and “s” key to zoom. On a side note – I am looking forward to reading the Essential Guide to 3D in flash it goes over the Away3D engine indepth

Reloaded

I have been making style changes and I am not done with making those changes; I am just glad the old version is gone for good! I have been very busy at work and working on several other websites simultaneously. I have been working on my wordpress blog lately and rearranged some things. First of all this blog will NO LONGER Supports IE6 on purpose! I personally have a great disdain for IE6 and I don’t want to spend my free time programming for it unless it is absolutely required. In short this browser is no longer supported and this is for many reasons so many that I can’t post them all here. So if your using IE6 or lower please upgrade and you might even want to try something new like Chrome or Firefox both of these browsers in my opinion are better suited for the web. I really just wanted to make my blog brighter and more easily read. I also need to make the loading a little more graceful I just simply haven’t had the time yet. I guess, I will just apply agile and continually improve it:)

I will be updating my 404 Error tutorials soon maybe even this weekend if I get ahead. I have been spending my time working on redoing my interactive portfolio. I have also been experimenting with Processing on Android and my initial reaction to programming with Processing and Android in my opinion have been very positive. I have a couple of books that I have been reading and I might put together a video tutorial of my new apps I have been working on. I am also really looking forward to Verizon updating to Android 2.1! Processing / Android kit targets 2.0 and higher. I think Android has lots of potential for developers in my opinion it is an excellent time to be a developer things are really booming and changing in the tech industry and they will trickle down to everyday life and really change the way people go about everyday tasks.

Reading lately:
The Essential Guide to Processing for the Flash Developer
Tutorial on Away3D

  • Share/Bookmark

Posted in 3d, ActionScript, Flash, i-create | Tagged 3d, ActionScript, Android, Firebug, Internet Explorer 6, Panoramic, quick tip, Smartphones | Leave a response

 

404 Errors Hyped With PaperVision3d

By Brendon Smith on December 20, 2009

 

404 Error Pages don’t have to be boring. Especially if you develop rich internet applications and have access to awesome tools like PaperVision3d and Hype! This is a two part example. This example just shows you simple code to create a planes in PaperVision3d make them follow your mouse. I also used SoundSnap to snag some short-circuit static for background noise. I also used Hype to analyze the sound this is literally an out of the box example of Hype. What is hype? Hype is a new framework for quickly putting together highly interactive eye-candy. Hype was created by Joshua Davis and Brendan Hall. It has special methods like Color Pool, Grids, Vibrations Effects, Sound Analysis, just to name a few in short its wicked cool. I am looking forward to playing around with it more it’s just a matter of finding the time. This was just something I was thinking about placing on my new interactive portfolio. I am going to create a 404 page that utilizes these libraries. This part only shows you the audio analysis(please note the analysis will fail if you are playing youtube or something else in another window), papervision3d plane code, and vibration effect applied to a movie. In part two I will add a parallax effect to give this error page more depth. Mash it with a search that pulls results from i-create (I will pull the URL from the browser with JavaScript) and also has hidden gems in it. I will hope to really dig into hype more. Sometimes it can be fun to make websites that are distracting on purpose read like a choose your own adventure album. I can show an example like this and now show you one of my favorite sites. You have to go out and check out ABC (Abnormal Behavior Child) I think he originally made this style and his site is setup more like a personal odyssey.

404e

Code for the Class Code Behind:

package {
	import flash.display.*;
	import flash.events.Event;
	import flash.net.URLLoader;
	import flash.net.URLRequest;
	import flash.events.*;
	import flash.filters.BitmapFilterQuality;
	import flash.filters.BlurFilter;
	import fl.transitions.*;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.media.Sound;
	import org.papervision3d.cameras.Camera3D;
	import org.papervision3d.objects.primitives.Plane;
	import org.papervision3d.render.BasicRenderEngine;
	import org.papervision3d.scenes.Scene3D;
	import org.papervision3d.view.Viewport3D;
	import org.papervision3d.materials.BitmapFileMaterial;
	import org.papervision3d.materials.MovieMaterial;
	import org.papervision3d.materials.*;
	import hype.framework.core.TimeType;
	import hype.framework.rhythm.SimpleRhythm;
	import hype.framework.sound.SoundAnalyzer;
 
 
	public class e404 extends MovieClip {
		public var viewport:Viewport3D;
		public var scene:Scene3D;
		public var camera:Camera3D;
		public var plane :Plane;
		public var plane2 :Plane;
		public var plane3 :Plane;
		public var renderer:BasicRenderEngine;
 
		public function e404():void {
			addEventListener( Event.ENTER_FRAME, e404Go );
 
		}
		public function e404Go(e:Event):void {
			removeEventListener(Event.ENTER_FRAME,e404Go );
			// Create the container Sprite
			stage.scaleMode=StageScaleMode.NO_SCALE;
			stage.align=StageAlign.TOP_LEFT;
			//
			init3D();
			createPlane();
			addEventListeners();
 
 
		private function init3D():void {
			// VIEWPORT
			viewport=new Viewport3D(0,0,true,false);
			addChild( viewport );
			//
			// RENDERER
			renderer = new BasicRenderEngine();
			//
			// SCENE
			scene = new Scene3D();
			//
			// CAMERA
			camera = new Camera3D();
			camera.zoom=11;
			camera.focus=100;
		}
 
		private function createPlane():void {
			BitmapFileMaterial.LOADING_COLOR=0x000000;
			BitmapFileMaterial.ERROR_COLOR=0xFF0000;
			//
			var material:BitmapFileMaterial=new BitmapFileMaterial("404e.png");
			material.doubleSided=true;
			var material2:BitmapFileMaterial=new BitmapFileMaterial("404e2.png");
			material2.doubleSided=true;
			var material3:ColorMaterial=new ColorMaterial(0xFC0606,.6);
			material3.doubleSided=true;
 
			//
			plane=new Plane(material,300,100,10,10);
			plane.x=-350;
			plane.y=265;
 
			plane2=new Plane(material2,300,100,10,10);
			plane2.x=-350;
			plane2.y=265;
			plane2.z=-60;
 
			plane3=new Plane(material3,800,150,10,10);
			plane3.x=-350;
			plane3.y=285;
			plane3.z=80;
			//
			scene.addChild( plane );
			scene.addChild( plane2 );
			scene.addChild( plane3 );
		}
 
		private function addEventListeners():void {
			addEventListener( Event.ENTER_FRAME, __onEnterFrame );
		}
 
		private function removeEventListeners():void {
			removeEventListener( Event.ENTER_FRAME, __onEnterFrame );
		}
 
		private function __onEnterFrame( e:Event ):void {
			plane.rotationY=viewport.mouseX/4;
			plane.rotationX=viewport.mouseY/4;
			plane2.rotationY=viewport.mouseX/4;
			plane2.rotationX=viewport.mouseY/4;
			plane3.rotationY=viewport.mouseX/4;
			plane3.rotationX=viewport.mouseY/4;
			//
			renderer.renderScene( scene, camera, viewport );
		}
	}
}

Below are the actions that are applied to the time-line with in the Movie

import hype.extended.behavior.FunctionTracker;
import hype.extended.behavior.Oscillator;
import hype.extended.color.ColorPool;
import hype.extended.layout.GridLayout;
import hype.framework.display.BitmapCanvas;
import hype.framework.sound.SoundAnalyzer;
import hype.extended.behavior.FixedVibration;
var myWidth = stage.stageWidth;
var myHeight = stage.stageHeight;
 
var clipCanvas:BitmapCanvas = new BitmapCanvas(myWidth, myHeight);
addChild(clipCanvas);
 
var clipContainer:Sprite = new Sprite();
 
var soundAnalyzer:SoundAnalyzer = new SoundAnalyzer();
soundAnalyzer.start();
 
var colorPool:ColorPool = new ColorPool(
	0x9F3F11, 0xFC0606, 0x9FC1BE, 0x787D29, 0xE0D4BA, 0x911F15, 0xBFCDF2, 0xF0EEF1
);
 
// xStart, yStart, xSpacing, ySpacing, columns
 
var layout:GridLayout = new GridLayout(0, myHeight / 2, 10, 0, 34);
 
var numItems:int = 64;
var freq:int = 120;
 
for (var i:uint = 0; i < numItems; ++i) {
	var clip:MySquare = new MySquare();
 
	layout.applyLayout(clip);
	colorPool.colorChildren(clip);
 
	// object, property, soundAnalyzer.getFrequencyRange, [startRange, endRange, min, max]
 
	var aTracker:FunctionTracker = new FunctionTracker(clip.myFill, "alpha", soundAnalyzer.getFrequencyRange, [i*4, i*4+4, 0.25, 1.0]);
	var sTracker:FunctionTracker = new FunctionTracker(clip.myFill, "scaleY", soundAnalyzer.getFrequencyRange, [i*4, i*4+4, 0.5, 30.0]);
	aTracker.start();
	sTracker.start();
 
	// target Object, property, waveFunction, frequency, min, max, start value
 
	var yOsc:Oscillator = new Oscillator(clip, "y", Oscillator.sineWave, freq, 60, 600, i/(180/2));	
	yOsc.start();
 
	clipContainer.addChild(clip);
}
 
clipCanvas.startCapture(clipContainer, true);
 
var sound:Sound = new Sound();
sound.load(new URLRequest("shortCircuitE1.mp3"));
sound.play();
 
var aVibration:FixedVibration = new FixedVibration(cBagHead, "alpha", 0.9, 0.1, 0.0, 1.0, false);
aVibration.start();

Sometimes it can be fun to make something that is distracting. Kind of reminds me of my college days. Life drawing for about 3 hours(which beats the hell out of Biology and Business lectures) in the morning and then off to do some display work at the Hitchin Post a clothing store I worked at for years. I always had opportunities to use my creative skills with display work their. You know you’ve created great display work when people ask for things out of the window. Display work also used to make retail work easy people see something like it and want to buy hence you don’t need to talk to them. It can be fun to make things interactive! People like eye-candy. Anyway exercises like these help make you a little bit more creative. At least that was the case for these well known display artists Jasper Johns and Andy Warhol. Anyway enough ranting it is Saturday night. I can’t wait until my Media Temple migration is complete and my new interactive portfolio is done. Than I can work on new projects. Ya thanks Josh and Brendan the Hype Framework is like an awesome set of paints!

Cool Sites to Check Out:
ABC
Choose Your Own Adventure and Informatics

Cool Frameworks to Check Out:
PaperVision3D
Hype

  • Share/Bookmark

Posted in 3d, ActionScript | Tagged as3, Experiment, Flash, hype, Joshua Davis, PaperVision3D | Leave a response

Next »
 
 

3d ActionScript Adobe Air Android Apollo Apple art as3 ASP.NET Blend C# CakePHP CSS Experiment Flash Flash Develop Flex Games Generative Design Google Informatics JavaScript Joshua Davis JSON Life Lingo Linux MashUp Open Source OpenSource PaperVision3D PC History Processing quick tip RIA Silverlight Technology/Internet travel twitter Web Web 3.0 Webware XML Yahoo Pipes

WP Cumulus Flash tag cloud by Roy Tanck and Luke Morton requires Flash Player 9 or better.

  • Monthly
  • Yearly
  • Links
  • February 2010
  • January 2010
  • December 2009
  • November 2009
  • October 2009
  • September 2009
  • August 2009
  • July 2009
  • June 2009
  • May 2009
  • 2010
  • 2009
  • 2008
  • 2007
  • 2006
  • 2005
  • agit8
  • Bit-101
  • D.I.Y.
  • draw.logic
  • Flight404
  • Flong
  • generatorX
  • haXe
  • Jonathan Snook
  • Joshua Davis
  • Jot
  • Kirupa
  • LifeHacker
  • Make
  • NurseOnTheRun
  • octane42
  • PV3D
  • Senocular
  • Sephiroth
  • ShineDraw
  • SWX
  • Tech News
  • Toxi
  • ZeusLabs

Brendon's Photos

DSC00065.JPG

Recent Comments

  • morganae23 on Processing JS
  • morganae23 on Processing JS

RSS LifeStream

  • #Flash and Windows Phone 7 #RIA
  • Douglas Crockford: “Crockford on #JavaScript — Episode IV: The Metamorphosis of #Ajax” (93 min.) #YUI
  • The #HTML5 Flash Marriage: #Geolocation