Pano2VR - Flash API

From GardenGnomeSoftware

To embed the pano, please use the following code:

Contents 1 Loading the Panorama 1.1 Actionscript 2.0 1.2 Actionscript 3.0 2 Panorama API calls 2.1 Changing the view 2.2 Changing the panorama window 2.3 Hotspots 2.4 Video 2.5 Others 3 Change the default Hotspot handler 3.1 Actionscript 2.0 3.2 Actionscript 3.0

Loading the Panorama

Actionscript 2.0

var vr:MovieClip = _root.createEmptyMovieClip("vr", 1);
vr._lockroot=true;
// move the upper left corner
vr._x=100;
vr._y=200;
var myLoader = new MovieClipLoader();
var myListener = new Object();
myListener.onLoadStart = function () {
// Set the dimensions and position of the pano
  vr.window_width=500;
  vr.window_height=380;
  vr.window_x=100;
  vr.window_y=10;
};
myListener.onLoadInit = function () {
  // your initalisation of the pano, add Hotspots,...
  // You can also set the window size here but you need to use the API
  vr.pano.setWindowSize(500,380);
};
myLoader.addListener(myListener);
myLoader.loadClip("mypanorama.swf", vr);

I never managed to use loadMovie properly, so if you really want to use it you are on your own. The demo at http://gardengnomesoftware.com/samples/pano2qtvr/flashtour/ includes the .fla file with the complete source code.

Actionscript 3.0

For Pano2VR <= 2.1

import flash.display.*;
import flash.net.URLRequest;
import flash.events.Event;
var loader:Loader;
loader = new Loader();
var url:String = "park.swf";
var urlReq:URLRequest = new URLRequest(url);
var vr:MovieClip;
// This is done after the swf is loaded.
function finished_loading (e:Event) {
}
function initHandler(event:Event):void {
  trace("initHandler: " + event);
  vr = MovieClip(loader.content); // cast 'DisplayObject' to 'MovieClip'
  vr.pano.setWindowSize(200,100);
}
// Tell the loader to call 'finished_loading' after the swf is loaded.
loader.contentLoaderInfo.addEventListener(flash.events.Event.COMPLETE, finished_loading);
loader.contentLoaderInfo.addEventListener(Event.INIT, initHandler);
loader.load(urlReq);
addChild(loader); // add your swf directly to the stage

Starting with Pano2VR 2.2 the panorama object is not initialized within the first frame so it is necessary to check each frame for the object. The modified code looks like this:

import flash.display.*;
import flash.net.URLRequest;
import flash.events.Event;
var loader:Loader;
loader = new Loader();
var url:String = "park.swf";
var urlReq:URLRequest = new URLRequest(url);
var vr:MovieClip; // panorama movieclip

// This is done after the swf is loaded.
function finished_loading (e:Event) {
}

function initHandler(event:Event):void {
	trace("initHandler: " + event);
	vr = MovieClip(loader.content); // cast 'DisplayObject' to 'MovieClip'
	vr.isFlash10=false; // Disable Flash 10 rendering if the container is Flash 9
}

function initPanorama(e:Event) {
// check if the panorama object is available and initialize it
	if ((vr!=null) && (vr.pano!=null)) {
		removeEventListener( Event.ENTER_FRAME , initPanorama);
		vr.pano.setWindowSize(200,100); // resize the window
		vr.pano.setWindowPos(200,200); // reposition
	}
}
// call initPanorama every frame
addEventListener( Event.ENTER_FRAME , initPanorama);

// Tell the loader to call 'finished_loading' after the swf is loaded.
loader.contentLoaderInfo.addEventListener(flash.events.Event.COMPLETE, finished_loading);
// Tell the loader to call 'initHandler' after the swf is initialized.
loader.contentLoaderInfo.addEventListener(Event.INIT, initHandler);
loader.load(urlReq);
addChild(loader); // add your swf directly to the stage

If you like to remove the panorama use the following code:

vr.pano.cleanup();
removeChild(vr);

You need to call the cleanup method to avoid errors like "Cannot access a property or method of a null object reference" because ActionScript doesn't provide a destructor for objects.

Panorama API calls

After the panorama is initialized and loaded you can make the following API calls at runtime

Changing the view

<panoclip>.pano.getPan(); // returns the current pan angle
<panoclip>.pano.setPan(angle_in_degrees:Number); // sets the current pan angle
<panoclip>.pano.changePan(offset_in_degrees:Number); // change the current pan angle

<panoclip>.pano.getTilt(); // returns the current tilt angle
<panoclip>.pano.setTilt(angle_in_degrees:Number); // sets the current tilt angle
<panoclip>.pano.changeTilt(offset_in_degrees:Number); // change the current tilt angle

<panoclip>.pano.getFov(); // sets the current FoV
<panoclip>.pano.setFov(angle_in_degrees:Number); // sets the current FoV
<panoclip>.pano.changeFov(offset_in_degrees:Number); // change the current FoV

<panoclip>.pano.moveTo(pan:Number, tilt:Number, fov:Number, speed:Number ); // move to position

Changing the panorama window

<panoclip>.pano.setWindowSize(<width>,<height>); - sets the current panorama window size
<panoclip>.pano.setWindowPos(<x>,<y>); - sets the panorama window position

Hotspots

<panoclip>.pano.addHotspot(<id:String>,<pan:Number>,<tilt:Number>,<mc:MovieClip>); - Adds a Hotspot to the panorama

• <id> - This is just a string. No use for it now but maybe in the future.
• <pan>,<tilt> - define the position within the panorama.
• <mc> - this can be anything you created in the library or code.

Basically only the _x and _y are moved by the pano so the depth of your movieclip defines for example the visibility. Also you can let the movieclip do what ever you want for example open a URL, change the color on mouse over.... animations will always run with the speed of the pano so don't expect wonders. On a normal PC this would result in 10-20 fps.

<panoclip>.pano.unloadHotspots(); // Remove references for all Hotspots

Video

If you like to play panoramic videos you can directly access the video object. The variables are:

<panoclip>.pano.video.connection // NetConnection object
<panoclip>.pano.video.stream // NetStream object
<panoclip>.pano.video.video // Video object

You can also bind a video at runtime with

<panoclip>.attachVideo(videoXML:String);

The videoXML has to be the same form as for the HTML based binding.

Example:

vr.attachVideo('<video url="video.flv"/>');

Others

Some other API calls for special cases

<panoclip>.pano.setAutorotate(<speed:Number>,<delay:Number>,<return to horizon:Number>,<only in focus:Boolean>); 
<panoclip>.pano.setLocked(<value:Boolean>); // Allow interaction with the panorama (mouse/keyboard)
<panoclip>.pano.setMeshDensity(<angular speed:Number>); // change the quality for the current speed (in scripted movement)

Change the default Hotspot handler

For panoramas with QuickTime like hotspots the following code allows to use your own handler.

Actionscript 2.0

var vr:MovieClip = _root.createEmptyMovieClip("vr", 1);
vr._lockroot=true;

var myLoader = new MovieClipLoader();
var myListener = new Object();

myListener.onLoadInit = function () {
// callback after the pano is fully loaded
  vr.pano.onClickQtHotspot=function(id:Number,title:String,url:String,target:String)
  {
    // add your code here!
    trace(id + "," + title);
  }
};
myLoader.addListener(myListener);
myLoader.loadClip("mypanorama.swf", vr);

Actionscript 3.0

import flash.display.*;
import flash.net.URLRequest;
import flash.events.Event;

var loader:Loader;
loader = new Loader();
var url:String = "park.swf";
var urlReq:URLRequest = new URLRequest(url);
var vr:MovieClip;

// This is done after the swf is loaded.
function finished_loading (e:Event) {
  vr.pano.onClickQtHotspot=function(id:Number,title:String,url:String,target:String)
  {
    // add your code here!
    trace(id + "," + title);
  }
}
function initHandler(event:Event):void {
   trace("initHandler");
   vr = MovieClip(loader.content); // cast 'DisplayObject' to 'MovieClip'
}
// Tell the loader to call 'finished_loading' after the swf is loaded.
loader.contentLoaderInfo.addEventListener(flash.events.Event.COMPLETE, finished_loading);
loader.contentLoaderInfo.addEventListener(Event.INIT, initHandler);
loader.load(urlReq);
addChild(loader); // add your swf directly to the stage

Since Pano2VR beta 3 there are also 2 new handles onRollOverQtHotspot and onRollOutQtHotspot that can be assigned in the finished_loading callback function:

vr.pano.onRollOverQtHotspot=function(id:Number,title:String,url:String,target:String)
{
  trace("QtRollOver " + id + "," + title);
}
vr.pano.onRollOutQtHotspot=function(id:Number,title:String,url:String,target:String)
{
  trace("QtRollOut " + id + "," + title);
}