Ads Event Tracking
npm install sdkblm-tracking``bash`
npm install --save sdkblm-tracking
After install the library the next step is to import the sdkblmTracking library in our project
`jsx`
import sdkblmTracking from 'sdkblm-tracking'
Instantiate the class to be able to use the methods as required
`jsx`
events = new sdkblmTracking('http://ads.json')
Once we instantiate our sdkblmTracking class we can call the methods
getAds
This method returns the called json structure and adds the time in milliseconds at each required level, adding the elements startTimeInMiliSeconds and durationInMiliSeconds
`jsx`
const ads = await events.getAds()
getAvailPosition
This method will return the avails object that corresponds to the time parameter based on startTime and endTime,
endTime is calculated by adding starTime and the duration of the ad
@param int time
`jsx`
const avail = await events.getAvailPosition(this.state.time)
sendEvent
This method will return the elements contained in trackingEvents that correspond to the current time of the player and the perse event.
In addition, it performs the fetch action to each beacon Url contained in the response except for the clickThrough event in which case it will only return the object
@param int time
@param string action
`jsx`
const objavails = await events.sendEvent(this.state.time, this.state.action)
Below we can see an example of the implementation of the class
`jsx
import React from 'react'
import sdkblmTracking from 'sdkblm-tracking'
import 'sdkblm-tracking/dist/index.css'
class App extends React.Component {
constructor(props) {
super(props)
this.state = {
action: 'mute',
adId: '_PT10M_0',
time: 660000,
events: new sdkblmTracking('http://ads.json')
}
this.handleChangeUrl = this.handleChangeUrl.bind(this)
this.handleChangeAction = this.handleChangeAction.bind(this)
this.handleChangeTime = this.handleChangeTime.bind(this)
this.handleCallEvets = this.handleCallEvets.bind(this)
this.handleAdAction = this.handleAdAction.bind(this)
this.handleAvailAction = this.handleAvailAction.bind(this)
}
handleChangeUrl(e) {
this.setState({ url: e.target.value })
}
handleChangeAction(e) {
this.setState({ action: e.target.value })
}
handleChangeTime(e) {
this.setState({ time: e.target.value })
}
async handleAvailAction() {
const avail = await this.state.events.getAvailPosition(this.state.time)
console.log(avail)
}
async handleAdAction() {
// const events = new sdkblmTracking()
const ads = await this.state.events.getAds()
console.log(ads)
}
async handleCallEvets() {
const objavails = await this.state.events.sendEvent(
this.state.time,
this.state.action
)
console.log(objavails)
}
render() {
return (
export default App
``
MIT ©