floatinghotpot / cordova-plugin-facebookads

Cordova/PhoneGap plugin for Facebook Audience Network Ads
64 stars 71 forks source link

I Will Almost done with Native Ad but i will click the button and ad area not pass advertiser website #105

Open ajith-abizz opened 5 years ago

ajith-abizz commented 5 years ago

home.ts

import { Component, ViewChild } from '@angular/core';

import { NavController, Content } from 'ionic-angular';

import { Platform } from 'ionic-angular';

declare var FacebookAds: any;

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  @ViewChild(Content) content: Content;
  constructor(public navCtrl: NavController, public platform: Platform) {
    platform.ready().then(() => {
          this.content.ionScroll.subscribe((data) => { 
              this.updateXY(data.scrollLeft, data.scrollTop);
        }); 

    });
  }
  updateXY(left, top){
          var d;
          var h, w, x, y;
           d = document.getElementById('native');
           var headHeight = document.getElementById("headerHeight").clientHeight;
           w = document.getElementById('native').clientWidth;
           h = document.getElementById('native').clientHeight;
           x = d.offsetLeft - left;
           y = d.offsetTop - (top - headHeight);

          if(FacebookAds)
            FacebookAds.setNativeAdClickArea('313480179221223_315915618977679', x, y, w, h);
  }   
  ionViewDidEnter(){
   var that = this;
    this.platform.ready().then(() => {
        if(FacebookAds)
        {
          FacebookAds.createNativeAd('313480179221223_315915618977679', function(data){ 
                       alert(JSON.stringify(data));
                      document.addEventListener("onAdLoaded", function(data){ 
                        alert(JSON.stringify(data));
                        let temp: any = data; 
                        if(temp.adType == "native") 
                        { 
                          document.getElementById('adIcon').setAttribute("src", decodeURIComponent(temp.adRes.icon.url));
                          document.getElementById('adCover').setAttribute("src", decodeURIComponent(temp.adRes.coverImage.url));
                          document.getElementById('adTitle').innerHTML = temp.adRes.title;
                          document.getElementById('adBody').innerHTML = temp.adRes.body;
                          document.getElementById('adSocialContext').innerHTML = temp.adRes.socialContext;
                          document.getElementById('adBtn').innerHTML = temp.adRes.buttonText;
                          that.updateXY(0, 0);
                        }
                      });
          }, function(err) { alert(JSON.stringify(err)); });
        }
   });
  }

  ionViewDidLeave(){
    if(FacebookAds)
       FacebookAds.removeNativeAd('313480179221223_315915618977679');  
}
}

home.html


<ion-header id="headHeight">
<ion-navbar>
<ion-title>
Ionic Blank
</ion-title>
</ion-navbar>
</ion-header>