Flash Offerwall API Documentation

1. Prerequisites:

Flash Offerwall API is not compatible with versions prior to Flash Player 7, and is only compatible with ActionScript 3.0.

Please make sure the following tasks have been completed before you get started:

  1. 1. Create a SuperRewards Publisher account on www.srpoints.com
  2. 2. Log in and create a new application for your account.
    (NOTE: if the application you will be adding the offerwall to already exists, you do not need to create a new one)
  3. 3. Download the Flash Offerwall ZIP package.
Download: Flash Offerwall API 1.0

2. Offerwall Setup:

There are three important items that are needed before the Offerwall can be displayed within your flash game. These items and their specific instructions are outlined below.

(a) Unique App Identifier:

The unique app identifier (h) is the encrypted string that identifies the app that is making the Flash Offerwall request. This identifier is created when you sign up for a SuperRewards Publisher account and create an app; if you have an app already, the unique app identifier (h) has already been created for you.

The unique app identifier (h) is needed to load the Flash Offerwall as it identifies the app that is making the request. To find your unique app identifier (h), you need to log in to your SuperRewards Publisher account and edit the application that you wish to place the Flash Offerwall on by clicking on the "edit" link located next to that specific application. On the "Edit Application" page, you will see a box that appears like Figure 2a below. Your unique app identifier is the h parameter located in the query string of the iframe (highlighted in bold red font).

<iframe src="http://www.superrewards-offers.com/super/offers? h=xxxxx.xxxxxxxxxxx&uid=[USER ID]" frameborder="0" width="728" height="2400" scrolling="no"></iframe>
Figure 2a: Locating your unique app identifier.

(b) Include Folder Installation:

The include folder consists of the ActionScript classes that will be needed to display the offerwall within your game. Once the include folder is located in the correct location, the classes can be imported and referenced when needed. This code will be compiled within the games SWF.
(NOTE: the ActionScript contained inside the include folder does NOT need to be changed)

The Flash Offerwall ZIP contains the ActionScript library needed to display the Offerwall in your game. Simply unzip the contents of the package to a location on your computer. Then just copy-and-paste the "offerwall" folder into the root directory of your project.

(c) Opening the Offerwall In-game:

The in-game code is the line(s) of code that will be used to display the Flash Offerwall at any desired point in your game. The in-game code calls the Flash Offerwall ActionScript library that you copied into your project to display the Offerwall. There is only one line of code that needs to be added to your flash project (Figures 2b).

Copy and paste the showOffers (Figure 2b) code into an event that is called (ie. click event) or into a frame located in the main timeline of your movie. Calling this code will display the Flash Offerwall on top of the existing game or MovieClip. You choose when the Flash Offerwall is shown, so this place may change depending on the specific game or movie being modified. Remember to pass in the parameters that are defined below.

offerwall.as3.OfferWall.showOffers({uid:"xxxxxx", ip:"xxx.xxx.xxx.xxx", h:"xxxxxx.xxxxxxxxxxxx", clip:root});
Figure 2b: In-game code snippet - Displays the flash offerwall.

These are all required parameters:

• uid: The unique user id. For a Facebook application, you would pass in the user's Facebook User Id.
• ip: The ip address of the user (used for location-based filtering of offers). It is critical that the offers shown to each user are filtered to only show those offers available to their country or location.
• h: The unique app identifier (h) that you located above.
• clip: The reference container that will be used to display the Flash Offerwall. This reference must be a DisplayObject container and by default the root is used.


3. Offerwall Customization:

The Flash Offerwall can be customized in a number of ways. A number of visual or behavioral items can be altered by you to further enhance the users in-game experience. Below is a list of these optional items.

• version: This parameter references the version of the Flash Offerwall to display. By default, the latest version of the Flash Offerwall will be used.
• res: This parameter specifies the width and height of the Flash Offerwall. By default, the minimum size of the Flash Offerwall is used "600x400" (600px wide by 400px tall).
• bgcolor: This parameter specifies the background color of the Flash Offerwall - the color that goes around the main section.
• on_close: This function is called when the offerwall is closed by the user. A general use is to resume a game in this function.

Here is a sample of what your new code may look like:

offerwall.as3.OfferWall.showOffers({
uid:"xxxxxx",
ip:"xxx.xxx.xxx.xxx",
h:"xxxxxx.xxxxxxxxxxxx",
clip:root,
version:"1.0",
res:"600x600",
bgcolor: "#000000",
on_close: function():void { _global.mygame.unpause(); }
});


4. Example Code - ActionScript 3.0 Basic:

To display the Flash Offerwall in an ActionScript 3.0 project, you will need to add the one line in-game code snippet to the desired frame. You can add the code to the "Actions" tab of the frame in the timeline.

Outlined below in Figure 4a is an example of how to display the Flash Offerwall by opening it in a click event handler.

import offerwall.as3.*;
myButton.addEventListener (MouseEvent.CLICK, myButton_Click);
function myButton_Click(event:MouseEvent):void {
offerwall.as3.OfferWall.showOffers({uid:"xxxxxx", ip:"xxx.xxx.xxx.xxx", h:"xxxxxx.xxxxxxxxxxxx", clip:root, version:"1.0", res:"600x400"});
}
Figure 4a: ActionScript 3.0 Example - Opening the Flash Offerwall in the click event.

NOTE: Do not forget to import the included ActionScript library.


5. Example Code - Load as Separate SWF:

To display the Flash Offerwall in an ActionScript 3.0 project as a SWF that is loaded by another SWF contained within the project, you will need to add the following in-game code snippets. You can add the code to the "Actions" tab of the specified frames in the projects timeline.

1. Create and compile the "offerwall.swf" that will be included by another SWF within your project. Outlined below in Figure 5a is an example of how to display the Flash Offerwall using a click event handler. Once the code snippet has been added to your "offerwall.swf" project, simply publish the project and the SWF is now ready to be loaded in the next step.

import offerwall.as3.*;
myButton.addEventListener (MouseEvent.CLICK, myButton_Click);
function myButton_Click(event:MouseEvent):void {
offerwall.as3.OfferWall.showOffers({uid:"xxxxxx", ip:"xxx.xxx.xxx.xxx", h:"xxxxxx.xxxxxxxxxxxx", clip:root, version:"1.0", res:"600x400"});
}
Figure 5a: Creating the "offerwall.swf" - this SWF will be loaded by another SWF within the project.

NOTE: Do not forget to import the included ActionScript library.

2. Load the "offerwall.swf" from a separate SWF within your project. Outlined below in Figure 5b is an example of how to load the Flash Offerwall ("offerwall.swf") from another SWF. It is important that you allow the cdn-np.superrewards-offers.com domain, as shown below in red, or you will get security errors.

Security.allowDomain("cdn-np.superrewards-offers.com");
var swfLoader:Loader = new Loader();
addChild(_gameLoader);
swfLoader( new URLRequest( "offerwall.swf" ) );
swfLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, swfLoaded);
function swfLoaded(event:Event):void {
swfLoader.contentLoaderInfo.removeEventListener(Event.COMPLETE, swfLoaded);
addChild(swfLoader.content);
}
Figure 5b: Loading the "offerwall.swf" from a separate SWF within your project.

IMPORTANT: Do not forget to allow the cdn-np.superrewards-offers.com domain.


6. Example Code - Adobe Flex:

To display the Flash Offerwall in an Adobe Flex project, one additional step is required before the offerwall can be displayed. You still are required to follow all of the steps outlined above, however, you must also create an empty MovieClip that will be used to display the offerwall.

Outlined below in Figure 6a is an example of how to display the Flash Offerwall in Adobe Flex using a click event handler.
NOTE: The init() function is called when the updateComplete event is fired.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" updateComplete="init()">
<mx:Script>
<![CDATA[
import offerwall.as3.*;
private var _clip:MovieClip;
private function init():void {
_clip = new MovieClip();
MyDisplayComponent.addChild(_clip);
}
private function myButton_Click():void {
offerwall.as3.OfferWall.showOffers({uid:"xxxxxx", ip:"xxx.xxx.xxx.xxx", h:"xxxxxx.xxxxxxxxxxxx", clip:_clip, res:"600x400"});
}
]]>
</mx:Script>
<mx:UIComponent id="MyDisplayComponent" x="0" y="0">
</mx:UIComponent>
<mx:Button id="myButton" label="Open Offerwall" click="myButton_Click()" />
</mx:Application>
Figure 6a: Adobe Flex Example - Opening the Flash Offerwall in the click event.

NOTE: Do not forget to import the included ActionScript library.


7. Additional Help:

For more help regarding the setup of the Flash Offerwall, please contact your Account Manager.