102 lines
2.3 KiB
JavaScript
102 lines
2.3 KiB
JavaScript
|
import React from 'react';
|
||
|
|
import { View, requireNativeComponent } from 'react-native';
|
||
|
|
import PropTypes from 'prop-types';
|
||
|
|
import { statics } from './';
|
||
|
|
import { nativeToJSError } from '../../utils';
|
||
|
|
|
||
|
|
import AdRequest from './AdRequest';
|
||
|
|
import VideoOptions from './VideoOptions';
|
||
|
|
|
||
|
|
class AdMobComponent extends React.Component {
|
||
|
|
|
||
|
|
static propTypes = {
|
||
|
|
...View.propTypes,
|
||
|
|
|
||
|
|
// TODO ehesp: cant init this outside of the component; statics isn't defined
|
||
|
|
...(() => {
|
||
|
|
const eventProps = {};
|
||
|
|
Object.keys(statics.EventTypes).forEach((key) => {
|
||
|
|
eventProps[key] = PropTypes.func;
|
||
|
|
});
|
||
|
|
return eventProps;
|
||
|
|
}),
|
||
|
|
|
||
|
|
...(() => {
|
||
|
|
const eventProps = {};
|
||
|
|
Object.keys(statics.NativeExpressEventTypes).forEach((key) => {
|
||
|
|
eventProps[key] = PropTypes.func;
|
||
|
|
});
|
||
|
|
return eventProps;
|
||
|
|
}),
|
||
|
|
|
||
|
|
size: PropTypes.string.isRequired,
|
||
|
|
unitId: PropTypes.string.isRequired,
|
||
|
|
request: PropTypes.object,
|
||
|
|
video: PropTypes.object,
|
||
|
|
};
|
||
|
|
|
||
|
|
static defaultProps = {
|
||
|
|
request: new AdRequest().addTestDevice().build(),
|
||
|
|
video: new VideoOptions().build(),
|
||
|
|
};
|
||
|
|
|
||
|
|
constructor(props) {
|
||
|
|
super(props);
|
||
|
|
this.state = {
|
||
|
|
width: 0,
|
||
|
|
height: 0,
|
||
|
|
};
|
||
|
|
|
||
|
|
this.nativeView = requireNativeComponent(props.class, AdMobComponent, {
|
||
|
|
nativeOnly: {
|
||
|
|
onSizeChange: true,
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Handle a single banner event and pass to
|
||
|
|
* any props watching it
|
||
|
|
* @param nativeEvent
|
||
|
|
*/
|
||
|
|
onBannerEvent = ({ nativeEvent }) => {
|
||
|
|
if (this.props[nativeEvent.type]) {
|
||
|
|
if (nativeEvent.type === 'onAdFailedToLoad') {
|
||
|
|
const { code, message } = nativeEvent.payload;
|
||
|
|
this.props[nativeEvent.type](nativeToJSError(code, message));
|
||
|
|
} else {
|
||
|
|
this.props[nativeEvent.type](nativeEvent.payload || {});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
if (nativeEvent.type === 'onSizeChange') this.updateSize(nativeEvent.payload);
|
||
|
|
};
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Set the JS size of the loaded banner
|
||
|
|
* @param width
|
||
|
|
* @param height
|
||
|
|
*/
|
||
|
|
updateSize = ({ width, height }) => {
|
||
|
|
this.setState({ width, height });
|
||
|
|
};
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Render the native component
|
||
|
|
* @returns {XML}
|
||
|
|
*/
|
||
|
|
render() {
|
||
|
|
return (
|
||
|
|
<this.nativeView
|
||
|
|
{...this.props}
|
||
|
|
style={[this.props.style, { ...this.state }]}
|
||
|
|
bannerEvent={this.onBannerEvent}
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
export default AdMobComponent;
|