Valueimpression ad

svelte/src/file_viewer/AdHead.svelte

@@ -6,6 +6,20 @@ export const adaround_load = writable(false)
 export const adaround_loaded = writable(false)
 export const flyingsquare_load = writable(false)
 export const flyingsquare_loaded = writable(false)
+export const valueimpression_load = writable(false)
+export const valueimpression_loaded = writable(false)
+
+export const load_ad = (ad_type) => {
+	if (ad_type === "ads.plus") {
+		adsplus_load.set(true)
+	} else if (ad_type === "adaround") {
+		adaround_load.set(true)
+	} else if (ad_type === "flyingsquare") {
+		flyingsquare_load.set(true)
+	} else if (ad_type === "valueimpression") {
+		valueimpression_load.set(true)
+	}
+}
 </script>
 
 <script>
@@ -14,37 +28,32 @@ export const flyingsquare_loaded = writable(false)
 // stores are for telling the ads that the head element has finished loading
 
 let adsplus = false
-adsplus_load.subscribe(v => {
+adsplus_load.subscribe(v => adsplus = v)
-	if (v) {
-		adsplus = true
-	}
-})
 const adsplus_load_event = () => {
 	adsplus_loaded.set(true)
 	console.debug("finished loading adsplus head element")
 }
 
 let adaround = false
-adaround_load.subscribe(v => {
+adaround_load.subscribe(v => adaround = v)
-	if (v) {
-		adaround = true
-	}
-})
 const adaround_load_event = () => {
 	adaround_loaded.set(true)
 	console.debug("finished loading adaround head element")
 }
 
 let flyingsquare = false
-flyingsquare_load.subscribe(v => {
+flyingsquare_load.subscribe(v => flyingsquare = v)
-	if (v) {
-		flyingsquare = true
-	}
-})
 const flyingsquare_load_event = () => {
 	flyingsquare_loaded.set(true)
 	console.debug("finished loading flyingsquare head element")
 }
+
+let valueimpression = false
+valueimpression_load.subscribe(v => valueimpression = v)
+const valueimpression_load_event = () => {
+	valueimpression_loaded.set(true)
+	console.debug("finished loading valueimpression head element")
+}
 </script>
 
 <svelte:head>
@@ -57,4 +66,8 @@ const flyingsquare_load_event = () => {
 	{#if flyingsquare}
 		<script on:load={flyingsquare_load_event} async src="/res/script/flyingsquare.js"></script>
 	{/if}
+	{#if valueimpression}
+		<script on:load={valueimpression_load_event} async defer src="//services.vlitag.com/adv1/?q=f8197b031408cd00d0ba7385af21bec5"></script>
+		<script> var vitag = vitag || {};</script>
+	{/if}
 </svelte:head>

svelte/src/file_viewer/AdLeaderboard.svelte

@@ -1,24 +1,11 @@
 <script>
 import { onMount } from "svelte"
-import { adsplus_load, adsplus_loaded, adaround_load, flyingsquare_load } from "./AdHead.svelte"
+import * as head from "./AdHead.svelte"
 
 let container
 let banner
 let ad_type = ""
 
-let set_ad_type = (t) => {
-	ad_type = t
-	if (ad_type === "ads.plus") {
-		adsplus_load.set(true)
-	} else if (ad_type === "adaround") {
-		adaround_load.set(true)
-	} else if (ad_type === "flyingsquare") {
-		flyingsquare_load.set(true)
-	}
-
-	console.log("leaderboard ad is " + t)
-}
-
 onMount(() => {
 	let url_ads = new URL(window.location.href).searchParams.get("ads")
 	if (url_ads) {
@@ -26,8 +13,7 @@ onMount(() => {
 		return
 	}
 
-	let now = new Date().getTime()
+	switch (Math.floor(Math.random()*6)) {
-	switch (now % 5) {
 		case 0:
 			set_ad_type("aads")
 			break
@@ -43,11 +29,20 @@ onMount(() => {
 		case 4:
 			set_ad_type("flyingsquare")
 			break
+		case 5:
+			set_ad_type("valueimpression")
+			break
 	}
-
-	resize()
 })
 
+let set_ad_type = (t) => {
+	ad_type = t
+	head.load_ad(t)
+	resize()
+
+	console.log("leaderboard ad is " + t)
+}
+
 // We scale the size of the banner based on the size of the screen. But because
 // some things don't scale easily like iframes and javascript ads we use a CSS
 // transformation instead of changing the actual dimensions
@@ -84,7 +79,7 @@ const resize = () => {
 	banner.style.transform = "scale(" + scale + ")"
 }
 
-adsplus_loaded.subscribe(v => {
+head.adsplus_loaded.subscribe(v => {
 	if (v) {
 		window.googletag = window.googletag || {cmd: []};
 		googletag.cmd.push(function() {
@@ -95,6 +90,11 @@ adsplus_loaded.subscribe(v => {
 		googletag.cmd.push(function() { googletag.display('div-gpt-ad-pixeldraincom728x90_1'); });
 	}
 })
+head.valueimpression_loaded.subscribe(v => {
+	if (v) {
+		(vitag.Init = window.vitag.Init || []).push(function(){viAPItag.display("vi_1994884987")})
+	}
+})
 </script>
 
 <svelte:window on:resize={resize} on:load={resize}/>
@@ -149,6 +149,8 @@ adsplus_loaded.subscribe(v => {
 		<div bind:this={banner} class="_fa7cdd4c68507744 banner" data-zone="d8764be36c134d3d807abb2a073dc010" style="width:728px;height:90px;display: inline-block;margin: 0 auto"></div>
 	{:else if ad_type === "flyingsquare"}
 		<div bind:this={banner} class="xc449bad4854773ff banner" data-zone="28ebf286bb7d4446a5ba43b0ead8f1bb" style="width:728px;height:90px;display: inline-block;margin: 0 auto"></div>
+	{:else if ad_type === "valueimpression"}
+		<div bind:this={banner} class="adsbyvli banner" data-ad-slot="vi_1994884987" style="width: 728px; height: 90px"></div>
 	{/if}
 </div>
 

svelte/src/file_viewer/AdSkyscraper.svelte

@@ -1,6 +1,6 @@
 <script>
 import { createEventDispatcher, onMount, tick } from "svelte"
-import { adsplus_load, adsplus_loaded, adaround_load, flyingsquare_load } from "./AdHead.svelte"
+import * as head from "./AdHead.svelte"
 
 let dispatch = createEventDispatcher()
 let container
@@ -31,7 +31,7 @@ onMount(async () => {
 		return
 	}
 
-	switch (now % 4) {
+	switch (Math.floor(Math.random()*5)) {
 		case 0:
 			set_ad_type("ads.plus")
 			break
@@ -44,18 +44,15 @@ onMount(async () => {
 		case 3:
 			set_ad_type("aads")
 			break
+		case 4:
+			set_ad_type("valueimpression")
+			break
 	}
 })
 
 let set_ad_type = async (t) => {
 	ad_type = t
-	if (ad_type === "ads.plus") {
+	head.load_ad(t)
-		adsplus_load.set(true)
-	} else if (ad_type === "adaround") {
-		adaround_load.set(true)
-	} else if (ad_type === "flyingsquare") {
-		flyingsquare_load.set(true)
-	}
 
 	visible = true
 	await tick()
@@ -75,7 +72,7 @@ const close = () => {
 	setTimeout(() => { visible = false }, 1000)
 }
 
-adsplus_loaded.subscribe(v => {
+head.adsplus_loaded.subscribe(v => {
 	if (v) {
 		window.googletag = window.googletag || {cmd: []};
 		googletag.cmd.push(function() {
@@ -86,6 +83,11 @@ adsplus_loaded.subscribe(v => {
 		googletag.cmd.push(function() { googletag.display('div-gpt-ad-pixeldraincom160x600_1'); });
 	}
 })
+head.valueimpression_loaded.subscribe(v => {
+	if (v) {
+		(vitag.Init = window.vitag.Init || []).push(function(){viAPItag.display("vi_1994884988")})
+	}
+})
 
 </script>
 
@@ -114,6 +116,8 @@ adsplus_loaded.subscribe(v => {
 				<div class="_fa7cdd4c68507744" data-zone="2a0dbd4b7c484e9e824d211a57fa6b93" style="width:160px;height:600px;display: inline-block;margin: 0 auto"></div>
 			{:else if ad_type === "flyingsquare"}
 				<div class="xc449bad4854773ff" data-zone="d675792db61d408287d0d694d03d12e5" style="width:160px;height:600px;display: inline-block;margin: 0 auto"></div>
+			{:else if ad_type === "valueimpression"}
+				<div class="adsbyvli" data-ad-slot="vi_1994884988" style="width: 160px; height: 600px"></div>
 			{/if}
 		</div>
 	</div>