test/index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport"
	content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
<title>Hello World</title>
<script type="text/javascript" src="cordova.js"></script>
<style type="text/css">
body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: gray;
	color: white;
}

div#fullpage {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0px solid red;
	text-align: center;
	vertical-align: middle;
}

button {
	font-size: 18px;
}
</style>
</head>
<body onload="onLoad()" onresize="onResize()">
<script>
    function onLoad() {
        if(( /(ipad|iphone|ipod|android|windows phone)/i.test(navigator.userAgent) )) {
            document.addEventListener('deviceready', initApp, false);
        } else {
            initApp();
        }
    }

	var ad_units = {};
	
	if( /(android)/i.test(navigator.userAgent) ) { 
		ad_units = { // for Android
            siteId: 73569,
			banner: '549527/15140',
			interstitial: '549527/12145'
		};
	} else if(/(ipod|iphone|ipad)/i.test(navigator.userAgent)) {
		ad_units = { // for iOS
            siteId: 73568,
			banner: '549526/15140',
			interstitial: '549526/12145'
		};
	} else {
		alert('Windows phone not supported');
	}
        
    function initApp() {
		if (! SmartAdServer ) { alert( 'smart ad server plugin not ready' ); return; }

		initAd();

        // display the banner at startup
        createSelectedBanner();
    }
    function initAd(){
        var defaultOptions = {
                siteId: ad_units.siteId,
                baseUrl: 'http://mobile.smartadserver.com',
                position: SmartAdServer.AD_POSITION.BOTTOM_CENTER,
                // offsetTopBar: false, // avoid overlapped by status bar, for iOS7+
                bgColor: 'black', // color name, or '#RRGGBB'
                isTesting: true, // set to true, to receiving test ad for testing purpose
                // autoShow: true // auto show interstitial ad when loaded, set to false if prepare/show
            };
        SmartAdServer.setOptions( defaultOptions );
        registerAdEvents();
    }
    // optional, in case respond to events or handle error
    function registerAdEvents() {
        // new events, with variable to differentiate: adNetwork, adType, adEvent
        document.addEventListener('onAdFailLoad', function(data){ 
        	alert('error: ' + data.error + 
        			', reason: ' + data.reason + 
        			', adNetwork:' + data.adNetwork + 
        			', adType:' + data.adType + 
        			', adEvent:' + data.adEvent); // adType: 'banner' or 'interstitial'
        });
        document.addEventListener('onAdLoaded', function(data){});
        document.addEventListener('onAdPresent', function(data){});
        document.addEventListener('onAdDismiss', function(data){});
    }
    
    // click button to call following functions
    function getSelectedAdSize() {
        var i = document.getElementById("adSize").selectedIndex;
        var items = document.getElementById("adSize").options;
        return items[i].value;
    }
    function getSelectedPosition() {
        var i = document.getElementById("adPosition").selectedIndex;
        var items = document.getElementById("adPosition").options;
        return parseInt( items[i].value );
    }
    function createSelectedBanner() {
    	var overlap = document.getElementById('overlap').checked;
        var offsetTopBar = document.getElementById('offsetTopBar').checked;
        SmartAdServer.createBanner( {adId:ad_units.banner, overlap:overlap, offsetTopBar:offsetTopBar, adSize: getSelectedAdSize(), position:getSelectedPosition()} );
    }
    function createBannerOfGivenSize() {
        var w = document.getElementById('w').value;
        var h = document.getElementById('h').value;
        
        SmartAdServer.createBanner( {adId:ad_units.banner,
                           adSize:'CUSTOM', width:w, height:h,
                           position:getSelectedPosition()} );
    }
    function showBannerAtSelectedPosition() {
        SmartAdServer.showBanner( getSelectedPosition() );
    }
    function showBannerAtGivenXY() {
        var x = document.getElementById('x').value;
        var y = document.getElementById('y').value;
        SmartAdServer.showBannerAtXY(x, y);
    }
    function prepareInterstitial() {
        var autoshow = document.getElementById('autoshow').checked;
        SmartAdServer.prepareInterstitial({adId:ad_units.interstitial, autoShow:autoshow});
    }
    function onResize(){
        var s = document.getElementById('sizeinfo');
        s.innerHTML = "web view: " + window.innerWidth + " x " + window.innerHeight;
    }
</script>
	<div id="fullpage">
		<p>Demo for SmartAdServer Plugin</p>
		Banner<br /> Standard: <select id="adSize">
			<option value='SMART_BANNER'>SMART_BANNER</option>
			<option value='BANNER'>BANNER</option>
		</select><br /> <input type='checkbox' id='overlap' />overlap<br/>
         <input type='checkbox' id='offsetTopBar' />offsetTopBar<br/>
		<button onclick="createSelectedBanner();">create</button>
		<br /> Custom Size: (<input id='w' type='text' size=3 /> x <input
			id='h' type='text' size=3>)
		<button onclick="createBannerOfGivenSize();">create</button>
		<br />

		<button onclick="SmartAdServer.removeBanner();">remove banner</button>

		<hr />
		<select id="adPosition">
			<option value='1'>Top Left</option>
			<option value='2'>Top Center</option>
			<option value='3'>Top Right</option>
			<option value='4'>Left</option>
			<option value='5'>Center</option>
			<option value='6'>Right</option>
			<option value='7'>Bottom Left</option>
			<option value='8' selected>Bottom Center</option>
			<option value='9'>Bottom Right</option>
		</select>
		<button onclick="showBannerAtSelectedPosition();">show</button>
		<br /> (<input id='x' type='text' size=3 />,<input id='y'
			type='text' size=3>)
		<button onclick="showBannerAtGivenXY();">show At XY</button>
		<br />

		<button onclick="SmartAdServer.hideBanner();">hide banner</button>
		<hr />

		<p>Interstitial</p>
		<input type='checkbox' id='autoshow' checked />auto show when ready<br />
		<button onclick="prepareInterstitial();">Prepare</button>
		<button onclick="SmartAdServer.showInterstitial();">Show</button>
		<div id='sizeinfo'></div>
	</div>
</body>
</html>