I`m trying to find some good plugin for Ad showing ( videos ) for ionic2. I've tried with https://github.com/cranberrygame/cordova-plugin-ad-adcolony but I can't adjust it to work with ionic2 and angular2. I've also reviewed AdMob , which is ionic2 plugin , but video ads are not supported , as I read (only banners) . Can you please advise me what should I use and how , for my ionic2 app. Thanks.
By the way , when I'm trying to run adcolony this way window.plugins.adcolony.showIntersitialAd() with the HTML below
<button ion-button (click)="window.plugins.adcolony.showInterstitialAd();">showInterstitialAd</button>
it returns
HomePage.html:15 ERROR TypeError: Cannot read property 'plugins' of undefined
and when I'm trying to run it like this
<button ion-button (click)="window.adcolony.showInterstitialAd();">showInterstitialAd</button>
it returns the following error:
HomePage.html:15 ERROR TypeError: Cannot read property 'adcolony' of undefined
any help will be appreciated , thanks :)
By the way , I`m testing the app through https://apps.ionic.io/apps
Try with this plugin: https://github.com/appfeel/admob-google-cordova
cordova plugin add cordova-admob
Notice that you have to wait for interstitial to be loaded and also is a good idea to disable interstitial loading when your app is in background, as there is a delay between the moment you request an interstitial and the moment you show it:
<button ion-button (click)="tryToShowInterstitial();">showInterstitialAd</button>
And in your javascript code:
var isAppForeground = true;
var isInterstitialAvailable = false;
function tryToShowInterstitial() {
if (isInterstitialAvailable) {
admob.showInterstitialAd();
} else {
// Do your button action here when there are no ads to show
}
}
function onAdLoaded(e) {
if (isAppForeground) {
if (e.adType === admob.AD_TYPE.INTERSTITIAL) {
isInterstitialAvailable = true;
}
}
}
function onAdClosed(e) {
if (isAppForeground) {
if (e.adType === admob.AD_TYPE.INTERSTITIAL) {
// Would you like to prepare next interstitial?
setTimeout(admob.requestInterstitialAd, 1);
isInterstitialAvailable = false;
}
}
}
function onPause() {
if (isAppForeground) {
admob.destroyBannerView();
isAppForeground = false;
}
}
function onResume() {
if (!isAppForeground) {
setTimeout(admob.createBannerView, 1);
setTimeout(admob.requestInterstitialAd, 1);
isAppForeground = true;
}
}
// optional, in case respond to events
function registerAdEvents() {
document.addEventListener(admob.events.onAdLoaded, onAdLoaded);
document.addEventListener(admob.events.onAdClosed, onAdClosed);
document.addEventListener("pause", onPause, false);
document.addEventListener("resume", onResume, false);
}
function initAds() {
if (admob) {
var adPublisherIds = {
ios : {
banner : "ca-app-pub-XXXXXXXXXXXXXXXX/BBBBBBBBBB",
interstitial : "ca-app-pub-XXXXXXXXXXXXXXXX/IIIIIIIIII"
},
android : {
banner : "ca-app-pub-XXXXXXXXXXXXXXXX/BBBBBBBBBB",
interstitial : "ca-app-pub-XXXXXXXXXXXXXXXX/IIIIIIIIII"
}
};
var admobid = (/(android)/i.test(navigator.userAgent)) ? adPublisherIds.android : adPublisherIds.ios;
admob.setOptions({
publisherId: admobid.banner,
interstitialAdId: admobid.interstitial,
autoShowInterstitial: false
});
registerAdEvents();
} else {
alert('AdMobAds plugin not ready');
}
}
function onDeviceReady() {
document.removeEventListener('deviceready', onDeviceReady, false);
initAds();
// display a banner at startup
admob.createBannerView();
// request an interstitial
admob.requestInterstitialAd();
}
document.addEventListener("deviceready", onDeviceReady, false);
Related
I hope you can help me with this problem. I have tried EVERYTHING the last 5 days, but I fail every time.
I have buildt a simple app using HTML5, CSS and little bit of Javascript.The app works fine.Than I want a simple banner ad that shows at the bottom of the app.I just can't get it to work. Sometimes a black box shows up at the bottom, that's all, but not ad. I'm not very good with Javascript so the problem is maby with the code, but I've copied most of it from plugin exemple.
Source: https://www.npmjs.com/package/phonegap-admob
I'm using:
- Phonegap 6.1.2 (Build Service)
- admob-phonegap plugin(<plugin name="phonegap-admob" spec="4.2.1" />)
- Other plugins that work fine.
What I need:
- Only a small banner ad at the bottom of the page.
Platform:
- Only Andriod
In my config.xml I have this line:
<plugin name="phonegap-admob" spec="4.2.1" />
In my index.html inside the <script></script> tags, I have this code:
<script>
var isAppForeground = true;
function initAds() {
if (admob) {
var adPublisherIds = {
android : {
banner : "ca-app-pub-1467389904102750/404191XXXX",
}
};
var admobid = (/(android)/i.test(navigator.userAgent)) ? adPublisherIds.android : adPublisherIds.ios;
admob.setOptions({
publisherId: admobid.banner,
interstitialAdId: admobid.interstitial,
});
registerAdEvents();
} else {
alert('AdMobAds plugin not ready');
}
}
function onAdLoaded(e) {
if (isAppForeground) {
if (e.adType === admob.AD_TYPE.INTERSTITIAL) {
console.log("An interstitial has been loaded and autoshown. If you want to load the interstitial first and show it later, set 'autoShowInterstitial: false' in admob.setOptions() and call 'admob.showInterstitialAd();' here");
} else if (e.adType === admob.AD_TYPE_BANNER) {
console.log("New banner received");
}
}
}
function onPause() {
if (isAppForeground) {
admob.destroyBannerView();
isAppForeground = false;
}
}
function onResume() {
if (!isAppForeground) {
setTimeout(admob.createBannerView, 1);
setTimeout(admob.requestInterstitialAd, 1);
isAppForeground = true;
}
}
// optional, in case respond to events
function registerAdEvents() {
document.addEventListener(admob.events.onAdLoaded, onAdLoaded);
document.addEventListener(admob.events.onAdFailedToLoad, function (e) {});
document.addEventListener(admob.events.onAdOpened, function (e) {});
document.addEventListener(admob.events.onAdClosed, function (e) {});
document.addEventListener(admob.events.onAdLeftApplication, function (e) {});
document.addEventListener("pause", onPause, false);
document.addEventListener("resume", onResume, false);
}
function onDeviceReady() {
document.removeEventListener('deviceready', onDeviceReady, false);
initAds();
// display a banner at startup
admob.createBannerView();
}
document.addEventListener("deviceready", onDeviceReady, false);
</script>
I hope someone can help me. Thank you so much
Allright, the whole code was correct. The problem was just that I didn't link to Cordova in the Script tag. I read it somewhere that you didn't need it and Phonegap / Cordova would include it automatically. It was all that was needed. Do you want Admob to be displayed (and probably many other plugins), please include
<script type = "text / javascript" src = "cordova.js"> </script>.
Why does Error: Unable to get property '_ScriptLoaderTask' of undefined or null referece get thrown when trying to close a RadWindow with ScriptManager and JavaScript in ASP? (Internet Explorer 11)
Our application has 'Save and Close' buttons that have the following C# code for the closing logic that is executed after the save has completed:
public void CloseWindow()
{
ScriptManager.RegisterStartupScript(this, this.GetType(), "close",
"CloseModal()", true);
}
The .aspx page has the following JavaScript:
function CloseModal() {
var oWnd = GetRadWindow();
if (oWnd) {
oWnd.close();
}
}
function GetRadWindow() {
var oWindow = null;
if (window.radWindow) {
oWindow = window.radWindow;
} else if (window.frameElement &&
window.frameElement.radWindow) {
oWindow = window.frameElement.radWindow;
}
return oWindow;
}
Adding setTimeout() for one second before the RadWindow .close() function is called seems to fix the issue. I believe this allows the ScriptManager.RegisterStartupScript just enough time to complete execution.
The following JavaScript is a solution to the problem, and stops the error modal from displaying post 'Save and Close' button click:
function CloseModal() {
var oWnd = GetRadWindow();
if (oWnd) {
setTimeout(function () {
oWnd.close();
}, 1000);
}
}
I've been trying to implement the Phonegap Media plugin to playback an audio file.
I understand I'll need to refer to the correct file path (android_asset/www/...) and use an .amr file as per the docs but it's still returning with a code: 1 error, which I believe has something to do with a disruption in getting the file.
function sound(){
var backgroundMusic = null;
var musicPlaying = false;
function playAudio(){
function getPhoneGapPath() {
var devicePlatform = device.platform;
if (devicePlatform === "iOS") {
path = "";
} else if (devicePlatform === "Android" || devicePlatform === 'android') {
path = "/android_asset/www/";
}
return path;
};
var backgroundMusic = new Media(getPhoneGapPath() + 'audio/bg.amr', success, error);
function success(){
backgroundMusic.release();
alert('success');
}
function error(e){
alert(getPhoneGapPath() + 'audio/bg.amr');
alert(JSON.stringify(e));
}
if (!musicPlaying) {
backgroundMusic.play();
musicPlaying = true;
$(".audio-off").css('display', 'block');
$(".audio-on").css('display', 'none');
}
else if (musicPlaying){
backgroundMusic.stop();
musicPlaying = false;
$(".audio-on").css('display', 'block');
$(".audio-off").css('display', 'none');
};
}
$(".audio-on, .audio-off").on("touchstart", function() {
playAudio();
});
}
window.onload = function() {
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady(){
sound();
//other code...
}
After reading so many questions and tutorials I can't see where I've gone wrong. The media plugin is also definitely included in my config.xml as well.
I'm testing on my Nexus 5 with Lollipop 5.0.1.
Any help would be greatly appreciated, thanks :-)
i have been written this code in main.js and adding this file index.html but on android emulator events everything working correctly but on device ready event showing error on cat log that device ready event not fired i am not understanding where i am wrong is there any problem with this code .
main.js
$(document).ready(function () {
// setup global error handler
window.onerror = function (message, url, lineNumber) {
console.log([lineNumber, url, message].join(" "));
return false;
};
window.isphone = false;
if(document.URL.indexOf("http://") === -1
&& document.URL.indexOf("https://") === -1) {
window.isphone = true;
}
if(window.isphone) {
document.addEventListener("deviceready", onDeviceReady, false);
} else {
onDeviceReady();
}
console.log("document.ready");
console.log(window.location.hash);
// start the app
});
function onDeviceReady() {
app.init();
}
var app = app || { _timeStart: null };
app.init = function () {
//events binding
});
};
I have an application built in html5 and phonegap for android, by pressing the exit button I call the following function(JavaScript):
function close_window() {
if (confirm("Exit?")) {
navigator.app.exitApp()
}
}
Window with the message "Exit?" appear, but the application does not close when you click OK, how can we close it?
Is this the way to use navigator.app.exitApp()?
I think your missing with call of confirm notification.
Please try following code, it is working fine in my app:
document.addEventListener("exitButton", function(){
navigator.notification.confirm(
'Do you want to quit',
onConfirmQuit,
'QUIT TITLE',
'OK,Cancel'
);
}, true);
function onConfirmQuit(button){
if(button == "1"){
navigator.app.exitApp();
}
}
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
checkConnection();
}
function checkConnection() {
var networkState = navigator.connection.type;
if(navigator.connection.type == Connection.NONE) {
alert("No network connection");
}
}