switch between amarula and a-ads

This commit is contained in:
2020-05-24 14:23:03 +02:00
parent a6c7999448
commit f881e8fc8f
5 changed files with 58 additions and 46 deletions

View File

@@ -50,8 +50,8 @@ function Viewer(type, viewToken, data) {
this.setFile(fileFromSkyNet(data))
}
this.renderSponsorsSimple()
window.addEventListener("resize", e => { this.renderSponsorsSimple() })
this.renderSponsors()
window.addEventListener("resize", e => { this.renderSponsors() })
// Register keyboard shortcuts
document.addEventListener("keydown", e => { this.keyboardEvent(e) })
@@ -132,12 +132,12 @@ Viewer.prototype.setFile = function(file) {
}
}
Viewer.prototype.renderSponsorsSimple = function() {
Viewer.prototype.renderSponsors = function() {
let scaleWidth = 1
let scaleHeight = 1
let minWindowHeight = 1000
let bannerWidth = 720
let bannerHeight = 120
let minWindowHeight = 800
let bannerWidth = document.querySelector(".sponsors_banner").offsetWidth
let bannerHeight = document.querySelector(".sponsors_banner").offsetHeight
if (window.innerWidth < bannerWidth) {
scaleWidth = window.innerWidth/bannerWidth
@@ -146,45 +146,21 @@ Viewer.prototype.renderSponsorsSimple = function() {
scaleHeight = window.innerHeight/minWindowHeight
}
// The smaller scale is the scale we'll use
let scale = scaleWidth < scaleHeight ? scaleWidth : scaleHeight
document.querySelector(".sponsors").style.height = (scale*bannerHeight)+"px"
// Because of the scale transformation the automatic margins don't work
// anymore. So we have to manually calculate the margin. Here we take the
// width of the viewport - the width of the ad to calculate the amount of
// pixels around the ad. We multiply the ad size by the scale we calcualted
// to account for the smaller size.
let offset = (window.innerWidth - (bannerWidth*scale)) / 2
document.querySelector(".sponsors").style.height = (bannerHeight*scale)+"px"
document.querySelector(".sponsors_banner").style.marginLeft = offset+"px"
document.querySelector(".sponsors_banner").style.transform = "scale("+scale+")"
}
// Viewer.prototype.renderSponsors = function() {
// let scale = 1
// let scaleWidth = 1
// let scaleHeight = 1
// let minWidth = 728
// let minHeight = 800
// if (window.innerWidth < minWidth) {
// scaleWidth = window.innerWidth/minWidth
// }
// if (window.innerHeight < minHeight) {
// scaleHeight = window.innerHeight/minHeight
// }
// scale = scaleWidth < scaleHeight ? scaleWidth : scaleHeight
// // Because of the scale transformation the automatic margins don't work
// // anymore. So we have to maunally calculate the margin. Where we take the
// // width of the viewport - the width of the ad to calculate the amount of
// // pixels around the ad. We multiply the ad size by the scale we calcualted
// // to account for the smaller size.
// let offset = (window.innerWidth - (minWidth*scale)) / 2
// if (offset < 0) {
// offset = 0
// }
// document.querySelector(".sponsors > iframe").style.marginLeft = offset+"px"
// if (scale == 1) {
// document.querySelector(".sponsors > iframe").style.transform = "none"
// document.querySelector(".sponsors").style.height = "90px"
// } else {
// document.querySelector(".sponsors > iframe").style.transform = "scale("+scale+")"
// document.querySelector(".sponsors").style.height = (scale*90)+"px"
// }
// }
Viewer.prototype.keyboardEvent = function(evt) {
if (evt.ctrlKey || evt.altKey || evt.metaKey) {
return // prevent custom shortcuts from interfering with system shortcuts

View File

@@ -116,7 +116,7 @@
font-size: 0;
line-height: 0;
}
.file_viewer > .sponsors > iframe {
.file_viewer > .sponsors > * {
display: block;
margin: auto;
transform-origin: 0 0;