Files
misode.github.io/src/app/components/Ad.tsx
2022-10-15 07:23:16 +02:00

37 lines
1.2 KiB
TypeScript

import { useEffect } from 'preact/hooks'
declare const ethicalads: any
type AdProps = {
type: 'text' | 'image',
id: string,
}
export function Ad({ type, id }: AdProps) {
if (type === 'text') {
return <div data-ea-publisher="misode-github-io" data-ea-type="text" class="ad dark flat loaded">
<div class="ea-placement ea-type-text">
<a href="https://misode.github.io/bingo/" target="_blank">
<div class="ea-content" style="display: flex; gap: 6px; align-items: center;">
<img height="36" src="https://misode.github.io/bingo/assets/icon.png" alt="Minecraft Live Bingo logo" />
<div class="ea-text">
<strong>Bingo!</strong>
<span> Generate your own random bingo card to fill out as you watch </span>
<strong> Minecraft Live 2022!</strong>
</div>
</div>
</a>
<div class="ea-callout"><a rel="nofollow noopener" target="_blank" href="https://github.com/misode">Ad by Misode</a></div>
</div>
</div>
}
useEffect(() => {
document.getElementById('ad-placeholder')?.remove()
if ('ethicalads' in window) {
ethicalads.load()
}
}, [])
return <div data-ea-publisher="misode-github-io" data-ea-type={type} class="ad dark flat loaded" id={id}></div>
}