Link to home
Start Free TrialLog in
Avatar of CHINOS
CHINOS

asked on

Error #1009 - Null object reference with "stage." in IE7 using AS3

Hi , I hope somebody can help me this is the last problem I have with my site before I can deliver and I've searched all over and tried so many things but haven't worked.

I am getting this error with my event listener for checking if the browser is resized.

My goal is to reposition the left and right arrow of my gallery on a browser resize.  I position them initially on lines 304 and 305 but that is not for browser resizing.  My resizeStageHandler() is on lines 182 being called from line 174.

My understanding is that the "stage" cannot be used without first  being declared in AS3.  

So is this...
a problem of me not declaring my stage as a variable or display object and if it is how would you do that?
OR
is this a problem that has to do with me not removing my Event Listener between gallery changes.  If so how could I do that?
// SlickGallery AS File for my slideshow
 
package slickgallery {
	
	import flash.display.Loader;
	import flash.display.MovieClip;
	import flash.net.URLLoader;
	import flash.net.URLRequest;
	import flash.events.*;
	import caurina.transitions.*;
	import flash.text.TextField;
	import flash.text.TextFormat;
	
	public class  SlickGallery extends MovieClip{
		
		private var _skinColor:uint;
		
		private var _xmlRequest:URLRequest;
		private var _xmlLoader:URLLoader;
		
		private var _imageLoader:Loader;
		private var _imageContainer:MovieClip = new MovieClip();
				
		private var _loadingIndicator:MovieClip;
		
		private var _leftArrowLoader:Loader;
		private var _leftArrow:MovieClip;
		private var _rightArrowLoader:Loader;
		private var _rightArrow:MovieClip;				
			
		private var _mask:MovieClip;
		private var _background:MovieClip;
		private var _textbox_background:MovieClip;
		private var _textbox:TextField;
		
		private var _activeImage:Array = new Array();
		
		private var _defaultWidth:Number = 500;
		private var _defaultHeight:Number = 300;
		
		private var _textboxHeight:Number = 40;
		private var _padding:Number = 18;
		
		private var _imageIndex:int = 0;
		
		private var _textColor:uint = 0xFFFFFF;
		private var _textFormat:TextFormat;
		
		private var _data:XML;
		
 
		//Contructor
		public function SlickGallery(xmlFile:String="images.xml", skinColor:uint=0x000000) {
			
			this._skinColor = skinColor;
			
			this._xmlRequest = new URLRequest(xmlFile);
			this._xmlLoader = new URLLoader(_xmlRequest);
			this._xmlLoader.addEventListener(Event.COMPLETE, this.init);
			this._xmlLoader.addEventListener(ProgressEvent.PROGRESS, this.xml_PROGRESS);
			this._xmlLoader.addEventListener(IOErrorEvent.IO_ERROR, this.xml_IO_ERROR);			
			
		}
		
		private function init(e:Event):void {									
		
			//background
			this._background = new MovieClip();
			this._background.graphics.beginFill(this._skinColor, 0.5);
			this._background.graphics.drawRect(-(this._defaultWidth/2), -(this._defaultHeight/2), this._defaultWidth, this._defaultHeight);
			this._background.graphics.endFill();
			this.addChild(this._background);
			//this._background.x = (this.x + this._background.width / 2);
			//this._background.y = (this.y + this._background.height / 2);
			
			//mask
			this._mask = new MovieClip();
			this._mask.graphics.beginFill(this._skinColor);
			this._mask.graphics.drawRect(-(this._defaultWidth/2)+this._padding, -(this._defaultHeight/2)+this._padding, this._defaultWidth-this._padding*2, this._defaultHeight-this._padding*2);
			this._mask.graphics.endFill();			
			this.addChild(this._mask);	
			//this._mask.x = (this.x + this._mask.width / 2);
			//this._mask.y = (this.y + this._mask.height / 2);			
			
			//Image container
			
			this.addChild(this._imageContainer);
			
			//arrows
			this._leftArrowLoader = new Loader();			
			this._leftArrowLoader.load(new URLRequest("images/left_arrow.png"));
			this._leftArrowLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, this.positionLeftArrow);
			
			this._leftArrow = new MovieClip();
			this._leftArrow.name = "Left Arrow";
			this._leftArrow.addChild(this._leftArrowLoader);
			this.addChild(this._leftArrow);
			this._leftArrow.useHandCursor = true;
			this._leftArrow.buttonMode = true;
			this._leftArrow.addEventListener(MouseEvent.CLICK, this.leftArrow_CLICK);
			
			//right arrow
			
			this._rightArrowLoader = new Loader();
			this._rightArrowLoader.load(new URLRequest("images/right_arrow.png"));
			this._rightArrowLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, this.positionRightArrow);			
			
			this._rightArrow = new MovieClip();
			this._rightArrow.name = "Right Arrow";
			this._rightArrow.addChild(this._rightArrowLoader);
			this._rightArrow.x = this._background.width;
			this.addChild(this._rightArrow);
			this._rightArrow.useHandCursor = true;
			this._rightArrow.buttonMode = true;
			this._rightArrow.addEventListener(MouseEvent.CLICK, this.rightArrow_CLICK);
			
			// Right arrow
			
			//text background
			
			this._textbox_background = new MovieClip();
			this._textbox_background.graphics.beginFill(this._skinColor,0.6);
			this._textbox_background.graphics.drawRect(0,0, this._background.width-this._padding*2, this._textboxHeight);
			this._textbox_background.graphics.endFill();
			this.addChild(this._textbox_background);
			this._textbox_background.x = -(this._background.width / 2) + this._padding;
			this._textbox_background.y= this._background.height / 2 - this._textboxHeight - this._padding;			
			//textbox format
			
			this._textFormat = new TextFormat();
			this._textFormat.font = "Arial";
			this._textFormat.size = 12;
			this._textFormat.color = this._textColor;			
			
			//textbox
			this._textbox = new TextField();
			this._textbox.antiAliasType = "advanced";
			this._textbox.autoSize = "left";
			this._textbox.embedFonts = true;
			this._textbox.selectable = false;
			this._textbox.wordWrap = true;
			this._textbox.width = this._background.width - this._padding*2;
			this._textbox.x = -(this._background.width / 2) + this._padding;
			this._textbox.y = this._background.height / 2 - this._textboxHeight - this._padding;
			this._textbox.text = "asdfasdf";	
			this._textbox.setTextFormat(this._textFormat);
			this.addChild(this._textbox);
			
			//loading indicator
			
			this._loadingIndicator = new MovieClip();
			this._loadingIndicator.graphics.beginFill(0xFFFFFF, 1);
			this._loadingIndicator.graphics.drawRect(0, 0, 1, 2);
			this._loadingIndicator.graphics.endFill();
			this._loadingIndicator.alpha = 0;
			this._loadingIndicator.x = (this._background.x - this._background.width / 2) + this._padding;
			this._loadingIndicator.y=(this._background.height / 2) - this._loadingIndicator.height - this._padding;
			this.addChild(this._loadingIndicator);
						
			this.initEventListeners();
			
			//loading data
			
			this._data = new XML(e.currentTarget.data);
			if (this._data.image.length() > 0) {
				this.loadImage(0);
			}
		}
		
		
		private function initEventListeners() {
			//addEventListener(Event.ADDED_TO_STAGE, StageHandler, false, 0, true);
			trace("Stage is: " + this.stage);
			stage.addEventListener(Event.RESIZE, resizeStageHandler);
 
		}
		
		private function removeEventListeners() { 
			//stage.removeEventListener(Event.RESIZE, StageHandler);
		}
		
		private function resizeStageHandler(event:Event):void
		{
			this._leftArrow.x = (- stage.stageWidth / 2);
			this._rightArrow.x = stage.stageWidth / 2 - this._rightArrow.width;
		}
		
		private function imageContainer_ROLL_OVER(e:MouseEvent):void {
			
			Tweener.addTween(this._textbox, { alpha:1, time:0.5, onStart:function():void { this.visible = false } } );
			Tweener.addTween(this._textbox_background, { alpha:1, time:0.5, onStart:function():void{this.visible=false}  });
			Tweener.addTween(this._leftArrow, { alpha:1, time:0.5, onStart:function():void{this.visible=true}  } );
			Tweener.addTween(this._rightArrow, { alpha:1, time:0.5, onStart:function():void{this.visible=true}  } );
			
		}
		
		private function imageContainer_ROLL_OUT(e:MouseEvent):void {
			
			Tweener.addTween(this._textbox, { alpha:0, time:0.3, onComplete:function():void { this.visible = false; }  } );
			Tweener.addTween(this._textbox_background, { alpha:0, time:0.3,onComplete:function():void { this.visible = false; }  } );
			Tweener.addTween(this._leftArrow, { alpha:0, time:0.3, onComplete:function():void { this.visible = false; } } );
			Tweener.addTween(this._rightArrow, { alpha:0, time:0.3, onComplete:function():void { this.visible = false; }} );
			
		}		
		
		private function positionLeftArrow(e:Event):void {
			//trace("Left Arrow Image Loaded");
			//this._leftArrow.x = (this._background.x - this._background.width / 2) + 5;
			//this._leftArrow.y = this._background.y - this._leftArrow.height / 2;
			
		}
		
		private function positionRightArrow(e:Event):void {
			//trace("Right Arrow Image Loaded");
			//trace("Right Arrow x pos: "+this._rightArrow.x);
			//trace("SW"+stage.stageWidth);
			//trace("PSW"+parent.stage.stageWidth);			
			//this._rightArrow.x = this._background.width/2 + this._rightArrow.width;
			//this._rightArrow.y = this._background.y - this._rightArrow.height / 2;
			
		}
		
		private function xml_PROGRESS(e:ProgressEvent):void {
			trace("XML Loading loaded:" + e.bytesLoaded + " total: " + e.bytesTotal);
		}
		
		private function xml_IO_ERROR(e:IOErrorEvent):void {
			trace("ioErrorHandler: " + e);
		}
		
		private function showControls():void {
			Tweener.addTween(this._leftArrow, { alpha:1, delay:0.3,time:0.5 , onStart:function():void { this.visible = true; }} );
			Tweener.addTween(this._rightArrow, { alpha:1,delay:0.3, time:0.5, onStart:function():void { this.visible = true; } } );
			Tweener.addTween(this._textbox_background, { alpha:1, delay:0.3,time:0.3, onStart:function():void { this.visible = false; } } );
			Tweener.addTween(this._textbox, { alpha:1, delay:0.3,time:0.5, onStart:function():void { this.visible = false; }} );
			
		}
		
		private function loadImage(imageIndex:Number = 0):void {
			
			//trace(this._data.image[imageIndex].attribute("filename"));
			this._imageIndex = imageIndex;
			//initializing the loading indicator
			this._loadingIndicator.width = 1;
			
			this.removeEventListeners();
			
			Tweener.addTween(this._loadingIndicator, { time:0.3, alpha:1 } );
			
			this._leftArrow.visible = false;
			this._rightArrow.visible = false;
			
			this._textbox.alpha = 0;
			this._textbox_background.alpha = 0;
			
			
			this._imageLoader = new Loader();
			this._imageLoader.load(new URLRequest(this._data.image[imageIndex].attribute("filename")));
			this._imageLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, this.image_PROGRESS);
			this._imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, this.image_COMPLETE);
			
		}
		
		private function image_PROGRESS(e:ProgressEvent):void {			
			var percentage:Number = 100 / (e.bytesTotal / e.bytesLoaded);
			trace("Loading..." + percentage);
			this._loadingIndicator.width = percentage * ((this._background.width-this._padding*2) / 100);
		}
		
		private function image_COMPLETE(e:Event):void {
						
			
			this._mask.width = 50;
			this._mask.height = 50;
			
			Tweener.addTween(this._loadingIndicator, { alpha:0, time:0 } );					
			this._textbox.text = this._data.image[this._imageIndex].attribute("text");
			this._textbox.setTextFormat(this._textFormat);
			
			trace("Image Loaded");
			
			var image:MovieClip = new MovieClip();
			image.alpha = 0;
			image.addChild(this._imageLoader);			
			this._imageContainer.addChild(image);
			image.name = "Image" + this._imageIndex;
			image.x = -image.width / 2;
			image.y = -image.height / 2;		
			image.mask = this._mask;
			this.resizeAndMove(image.width, image.height);
			
			
			if (this._activeImage[0] != null && this._activeImage[0]!=undefined){
				Tweener.addTween(this._activeImage, { alpha:0, time:0.4, onComplete:function():void { _imageContainer.removeChild(_activeImage[0]);}} );
			}				
			
				Tweener.addTween(image, { time:0.5, alpha:1, onComplete:function():void { _activeImage[0] = image; showControls();  initEventListeners(); } } );
					
			
		}
			
		private function resizeAndMove(width:Number, height:Number):void {			
			
			this._leftArrow.x = (- stage.stageWidth) / 2;
			this._rightArrow.x = stage.stageWidth / 2 - this._rightArrow.width;			
			this._textbox.x =  -width / 2;
			this._textbox.y = height / 2 - this._textboxHeight;
			this._textbox_background.x = -width / 2;
			this._textbox_background.y = height / 2 - this._textboxHeight;
			
			this._loadingIndicator.x = -width / 2;
			this._loadingIndicator.y = height / 2 - this._loadingIndicator.height;			
			
			this._loadingIndicator.x = -width / 2;
			Tweener.addTween(this._background, {width:width+this._padding*2, height:height+this._padding*2, time:0.5, transition:"easeOutBack" } );
			Tweener.addTween(this._mask, { width:width, height:height, time:1, transition:"easeOutExpo" });
			Tweener.addTween(this._textbox_background, { alpha:0, width:width, time:0, transition:"easeOutBack" } );
			Tweener.addTween(this._textbox, { alpha:0,width:width, time:0, transition:"easeOutBack" });
			
		}
		
		private function leftArrow_CLICK(e:MouseEvent):void {
			trace(e.currentTarget.name + " clicked");
			
			if (this._imageIndex > 0) {
				this._imageIndex -= 1;				
			} else {
				this._imageIndex = this._data.image.length() - 1;
			}
			
			this.loadImage(this._imageIndex);			
		}
		
		private function rightArrow_CLICK(e:MouseEvent):void {
			trace(e.currentTarget.name + " clicked");
			if (this._imageIndex < this._data.image.length() - 1) {
				this._imageIndex += 1;				
			} else {
				this._imageIndex = 0;
			}
			
			this.loadImage(this._imageIndex);
		}
		
		
	}
	
}

Open in new window

Avatar of CHINOS
CHINOS

ASKER

NOTE: To simulate the error...
1) USE IE7 go to my website... http://www.timtabstudios.com/flash/
2) go into any slideshow, then go directly into another slideshow and resize the browser

and you'll see... (drumroll)
TypeError: Error #1009: Cannot access a property or method of a null object reference.
      at slickgallery::SlickGallery/StageHandler()


NOTE2: For each gallery I have a separate movie clip using addChild(); to call this AS file.  This is the code I use...
/* This is the basic code in each gallery's movie clip to call the AS file and images */
import slickgallery.SlickGallery;
var s:SlickGallery = new SlickGallery("enagements_gallery.xml", 0x000000);
addChild(s);

Open in new window

would be easier to pinpoint if you could upload your files.
a hack i use is when i get a null reference error

put if (!null) before it - i.e. check that it's not null before execution.

Avatar of CHINOS

ASKER

I tried that already from a post I think you added but it didn't solve the issue but isnt the stage null because it hasn't been declared as a variable or displayobject or something?  

My entire website is currently available for the remainder of this question here...
http://timtabstudios.com/flash/fla/fullsite.zip

Thank you so much for helping!
Avatar of CHINOS

ASKER

This only happens AFTER you have already entered one gallery, so the code is running properly on the first call of the AS file but then if you recall the AS file from another gallery it gives the problem when you resize.  
ASKER CERTIFIED SOLUTION
Avatar of blue-genie
blue-genie
Flag of South Africa image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
argggh rezip the final file as CS3 - i got an invalid file format.
not the whole lot just that.
Avatar of CHINOS

ASKER

Ok, here is the CS3 link...
http://timtabstudios.com/flash/fla/final_CS3.zip

I did rename the StageHandler but only that it would be maybe clearer for this post... lol guess not...

I wrote that piece in there myself... The original design is with the arrows at the border of the pictures, I'm trying to keep the arrows at the edge of the browser.  
Avatar of CHINOS

ASKER

did that file work for you?
missing package slickGalleryeditorials.
Avatar of CHINOS

ASKER

Ok, I think what you may be referring to is a file I accidentally kept in there while trying to fix it.  

I have uploaded 2 full versions again, one in CS3 one in CS4
http://www.timtabstudios.com/flash/fla/final_cs3.zip
http://www.timtabstudios.com/flash/fla/final_cs4.zip

Now here's the crazy thing... after I saved it as CS3 and tried it with the CS3 main.swf... it worked!  No Error 1009: !!

Is that just some flash bug or something?  This has been such a headache and I can find no technical reason for it.  I'm afraid to close this question and then run into the problem again later... any suggestions?
Avatar of CHINOS

ASKER

This is not the solution to my problem although it is the technical explanation to the stage type in a AS3 class.