Solved

Trigger banner ad rotation from Flash events

Posted on 2008-10-15
1
571 Views
Last Modified: 2013-11-11
Hello

I want to trigger an ad banner rotation from Flash. When the user flips 5 pages I would like the banner to change.

http://alt.coxnewsweb.com/palmbeachpost/for_shaun/flip_enhanced/flip_tab.html

What combination of actionscript and javascript would I use to accomplish this?

Thanks
Shaun
stop();

myBook._visible = true;
 
 

var zoomRatios = [2,4,5];

var zoomed = false;

var zoomCount = 0;

var clk = 0;
 

navbar_mc.index_btn.onPress = gotoPage;

navbar_mc.next_btn.onPress = nextPage;

navbar_mc.prev_btn.onPress = prevPage;
 
 

zoom_mc.zoom_in_btn.onPress = openZoom;

zoom_mc.zoom_out_btn.onPress = closeZoom;

zoom_mc.zoom_out_btn._visible = false;
 

service_mc.help_btn.onPress = openInfoWindow;

service_mc.print_left_btn.onPress = printLeftPage;

service_mc.print_right_btn.onPress = printRightPage;
 

myBook.onPageLoad = function( pageURL, pageNumber ){

if( pageNumber == 0 )this.flipCorner("top-right");

}
 

myBook.onStartFlip = function(i) {

	if (i == undefined) {

		return;

	}

	myBook.flipOnClickProp = true;

	showHint();

};

myBook.onFlipBack = function() {

	myBook.flipOnClickProp = false;

	hideHint();

};

myBook.onClick = function(i, page, isCorner) {

	hideHint();

};

myBook.onPutPage = function() {

	myBook.flipOnClickProp = false;

	var res = "";

	if (this.leftPageNumber && this.rightPageNumber) {

		res = this.leftPageNumber+" / "+this.rightPageNumber;

	} else if (this.rightPageNumber == 0) {

		res = this.rightPageNumber;

	} else if (this.leftPageNumber && !this.rightPageNumber) {

		res = this.leftPageNumber;

	}

	navbar_mc.current_page_txt.text = res;

};
 

function sendData(){

       	var sender:LoadVars = new LoadVars();

		//sender.sendAndLoad("http://ad.doubleclick.net/clk;201954821;9066607;j?",sender,"GET");

		

}
 

function nextPage() {

      if( zoomed ){

	  openInfoWindow();

} else {

      myBook.flipForward();

      //sendData ("http://ad.doubleclick.net/clk;201954821;9066607;j?");

}

}
 

function prevPage() {

     if( zoomed ) {

openInfoWindow();
 

} else {      

      myBook.flipBack();

      //sendData ("http://ad.doubleclick.net/clk;201954819;9066607;q?");

}

}
 

function gotoPage() {

      if( zoomed ){

		  openInfoWindow();

} else {

      myBook.flipGotoPage( 0 );

      //sendData ("http://ad.doubleclick.net/clk;201954818;9066607;p?");

}

}
 

function startZoomingMode() {

	zoomed = !zoomed;

	if (zoomed) {

		Mouse.hide();

		myBook.enabledProp = false;

		_root.attachMovie("ZoomPointer", "zoom_pointer_mc", 100);

		zoom_pointer_mc._x = _xmouse;

		zoom_pointer_mc._y = _ymouse;

		zoom_pointer_mc.onMouseMove = function() {

			this._x = _xmouse;

			this._y = _ymouse;

		};

	} else {

		Mouse.show();

		myBook.enabledProp = true;

		zoom_pointer_mc.removeMovieClip();

	}

}

function openInfoWindow() {

	clk = clk+1;

	trace("clk="+clk);

	myBook.enabledProp = false;

	if (clk==1) {

		_root.attachMovie("InfoWindow","info_mc",_root.getNextHighestDepth());

	}

	info_mc._x = Stage.width/2-info_mc._width/2;

	info_mc._y = Stage.height/2-info_mc._height/2;

	info_mc.close_btn.onRelease = closeInfoWindow;

}

function closeInfoWindow() {

	clk = 0;

	myBook.enabledProp = true;

	info_mc.removeMovieClip();

}
 

function printLeftPage() {

	print_box.printIt(myBook.leftPageNumber, myBook);

}

function printRightPage() {

	print_box.printIt(myBook.rightPageNumber, myBook);

}
 

/*function showHint() {

	_root.attachMovie("Hint", "hint_mc", 215);

	hint_mc._x = _xmouse;

	hint_mc._y = _ymouse;

	if( (hint_mc._y + hint_mc._height) > Stage.height )hint_mc._y -= ((hint_mc._y + hint_mc._height)-Stage.height + 10);

	if( (hint_mc._x + hint_mc._width) > Stage.width )hint_mc._x -= ((hint_mc._x + hint_mc._width)-Stage.width + 10);
 

	hint_mc.onMouseMove = moveHint;

	Mouse.hide();

}

function moveHint(){

	this._x = _xmouse;

	this._y = _ymouse;

	

	if( (this._y + this._height) > Stage.height )this._y -= ((this._y + this._height)-Stage.height + 10);

	if( (this._x + this._width) > Stage.width )this._x -= ((this._x + this._width)-Stage.width + 10);

};	
 

function hideHint() {

	hint_mc.onMouseMove = undefined;

	hint_mc.removeMovieClip();

	Mouse.show();

}*/
 

function openZoom(){

	myBook.enabledProp = false;

	var ratio = zoomRatios[zoomCount++];

	if( zoomRatios[zoomCount+1] == undefined )

		zoom_mc.zoom_in_btn._visible = false;

	else

		zoom_mc.zoom_in_btn._visible = true;

		

	if(!zoomed)	{

		ow = myBook._bookWidth;

		oh = myBook._bookHeight;

		drawZoomMask();	

		cx = myBook._x;

		cy = myBook._y;

	}

	

	myBook.setSize(ow * ratio, oh * ratio);

	

	var left = cx-myBook._bookWidth/2 + ow/2;

	var top = cy-myBook._bookHeight/2 + oh/2;

	var right = cx+myBook._bookWidth/2 - ow/2;

	var bottom = cy+myBook._bookHeight/2 - oh/2;

	

	mask_mc.onMouseDown = function(){myBook.startDrag(false, left, top, right,bottom);};

	mask_mc.onMouseUp = function(){myBook.stopDrag();};	

	mask_mc.onRollOver = function(){};

	

	zoomed = true;

	zoom_mc.zoom_out_btn._visible = true;

	

	

}
 

function closeZoom(){

	if(!zoomed)return;

	if(zoomCount > 1){

		zoomCount-=2;

		openZoom();

		return;

	}

	

	myBook.enabledProp = true;

	myBook.setSize(ow, oh);

	myBook._x = cx;

	myBook._y = cy;

	myBook.setMask(null);

	mask_mc.removeMovieClip();

	myBook.stopDrag();

	mask_mc.onMouseDown = undefined;

	mask_mc.onMouseUp = undefined;

	zoomed = false;

	zoomCount = 0;

	zoom_mc.zoom_out_btn._visible = false;

	zoom_mc.zoom_in_btn._visible = true;

	

	

}
 
 

function drawZoomMask(){

	var cx = myBook._x;

	var cy = myBook._y;

	

	var x0 = cx - ow/2;

	var y0 = cy - oh/2;

	var x1 = cx + ow/2;

	var y1 = cy + oh/2;
 

	_root.createEmptyMovieClip( "mask_mc", 2000 );

	mask_mc.lineStyle();

	mask_mc.beginFill( 0, 100 );

	mask_mc.moveTo( x0, y0 );

	mask_mc.lineTo( x1, y0 );

	mask_mc.lineTo( x1, y1 );	

	mask_mc.lineTo( x0, y1 );	

	mask_mc.lineTo( x0, y0 );	

	mask_mc.endFill();

	

	myBook.setMask( mask_mc);

}

Open in new window

0
Comment
Question by:dialektkid
1 Comment
 
LVL 4

Accepted Solution

by:
ckoning earned 500 total points
ID: 22734728
The easiest way to accomplish what you are after is to use the ExternalInterface class to call a javascript function to switch the add. This is a multistep process:

1) Put the add in its own div
2) Write a JS function to load an ad into that div
3) Write an AS function to call the JS function
4) Count the page turns and call the ad rotation function to accomplish effect

See code below for example. Might require modification and debugging. I am in an airport, and don't have the resources to fully test the code. Please let me know if you have problems.
// STEP ONE: Place the ad in its own div

// In the HTML source, you currently are using a table to place the ad on the page. This is less 

// than desirable for a number of reasons, but such a discussion is the topic for another post. To 

// access the content of the ad, need to place it in a div and give it an id. inside the table, 

// substitute this markup for the '<!----- begin ad tag ... ------>' that currently loads the ad:
 

<div id='bannerAd'>

   <script type="text/javascript"> getAd(); </script>

</div>
 

// The JavaScript will call the function written in step 2 to load the first add. 

// Also need to give it some CSS to make it fill the table space given. in the CSS place:
 

#bannerAd

{

   position: relative;

   width: 100%;

   height: 100%;

}
 

// Now we have a JS accessible element to place the ad in, and will be in the same position and size as current layout.
 

// STEP TWO: Write JavaScript function to change the ad

// Now that we have a place to put the ad, need to write a repeatable JS function to load a random

// ad into the spot. Start with the existing code, modify to suit. Place the following script tag 

// just after the <body> tag to make sure it is available for later calls:
 

<script language="text/javascript">

function getAd()

{

  ord=Math.random()*10000000000000000; 

  document.getElementByID('bannerAd').innerHTML = '<SCR' + 'IPT LANGUAGE="JavaScript" SRC="http://ad.doubleclick.net/adj/pbp.cni/shopping;ap=shopping;pg=shopping;sub=;sz=728x1;swrd=;ptile=1;ord=' + ord + '?" ><\/SCR' + 'IPT>';

}

</script>
 

// This is the tricky part of the whole process. I cannot recall offhand if innerHTML will actually

// evaluate the resulting script tag or just write it to the page. If it does evaluate, then all is

// well. If not, then some more sophisticated techniques are required to get the script to execute. 

// Also note that as written, the function will only work on DOM compliant browsers. Older browsers

// will not handle the document.getElementByID function. Both of these topics are better suited to

// the JavaScript section of ExpertsExchange. Posting there will most likely result in some very 

// slick solutions in the event that this function is not sufficient. For now, we will operate on 

// the assumption that the function works. Now we have a javascript function that will load a random

// doubleclick ad into a div in the appropriate place in the correct size. Now we need to trigger

// the switch from ActionScript.
 

// STEP THREE: Write an ActionScript function to call the JavaScript function.

// Add the following function to your AS at line 53 (order shouldn't matter, but it is good form to

// define functions before they are used):
 

function getAd():void

{

   ExternalInterface.call("getAd");

}
 

// For more details on how the ExternalInterface class works in ActionScript 2, see the livedocs. 

// Now the only remaining challenge is to count the pages and call the ad function after five pages.
 

// STEP FOUR: Count the page turns and call the ad function appropriately.

// First, declare a counter for page flips. On line 9 add:
 

var pgFlips = 0;
 

// Next, modify the page nav code to count the pages. Replace lines 65, 75, and 84 with:
 

if( pgFlips <= 5 )

{  // Not enough page flips to rotate ad

   pgFlips++;

}

else

{  // Otherwise, there were five or more page flips. Time to rotate. First, reset counter

   pgFlips = 0;

   // Now rotate

   getAd();

}
 

// That ought to do it. The code can be condensed by incorporating the counting logic into the 

// page counting into getAd() and then simply replacing lines 65, 75, and 84 with 
 

getAd();
 

// However, for illustrative purposed it was separated here. 

Open in new window

0

Featured Post

How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

Join & Write a Comment

Introduction This article is primarily concerned with ActionScript 3 and generally specific to AVM2.  Most suggestions would apply to ActionScript 2 as well, and I've noted those tips that differ between AS2 and AS3. With the advent of ActionS…
This article discusses how to create an extensible mechanism for linked drop downs.
The goal of the tutorial is to teach the user how to set there setting in Adobe Flash Media Live Encoder and YouTube for optimal video and audio quality.
The goal of the tutorial is to teach the user what frame rate is, how to control it and what effect it has on the video.

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now