landingpage/themes/app-landingpage/layouts/_default/single.html

127 lines
6.4 KiB
HTML
Raw Normal View History

2022-08-06 20:25:26 +02:00
{{ define "main" }}
<div class="main-content">
<section class="component download pb-0">
<div class="container h-100">
<picture class="download-mobile-image d-block d-lg-none">
2022-08-06 21:19:03 +02:00
<img class="download-mobile-image" src="{{site.BaseURL}}/assets/img/favicon.png" title="{{site.Params.appName}} App" alt="{{site.Params.appName}}-App Smartphone" loading="lazy" />
2022-08-06 20:25:26 +02:00
</picture>
<div class="row align-items-end align-items-lg-center justify-content-lg-between h-100">
<div class="col col-12 col-lg-6 bg-white p-3">
<h1 class="headline headline-heavy" id="headline">{{ .Title }}</h1>
<h1 class="headline headline-heavy d-none" id="infoUnsupported">{{ i18n "infoUnsupported" site.Params.appName }}</h1>
<div class="lead d-none" id="lead">
{{ .Content }}
</div>
<p class="warning d-none" id="warningiOS">{{ i18n "warningiOS" }}</p>
<p class="warning d-none" id="warningAndroid">{{ i18n "warningAndroid" }}</p>
<h1 class="headline headline-heavy d-none" id="infoiOS">{{ i18n "infoiOS" }}</h1>
<h1 class="headline headline-heavy d-none" id="infoAndroid">{{ i18n "infoAndroid" }}</h1>
<a class="d-none originalUrl" id="directUrl" href="" target="_blank" rel="noopener noreferrer">{{ i18n "directUrl" site.Params.appName }}</a>
<a class="d-none originalUrl" id="alternativeUrl" href="" target="_blank" rel="noopener noreferrer">{{ default (i18n "alternativeUrl") .Page.Params.alternativeUrlDescription }}</a>
<div class="row">
<p class="lead d-none" id="downloadInfo">{{ i18n "downloadInfo" }}</p>
{{ range site.Params.stores }}
<div class="col col-12 col-md-6 mb-3" id="store_{{ .id }}">
<a href="{{ .url }}" target="_blank" rel="noopener noreferrer">
<img class="img-fluid w-100" src="{{ .badge }}" alt="{{ .name }} Icon" />
</a>
</div>
{{ end }}
</div>
</div>
<div class="col col-12 col-sm-12 col-md-12 col-lg-5 d-none d-lg-block">
2022-08-06 21:19:03 +02:00
<img class="section-main-image" src="{{site.BaseURL}}/assets/img/favicon.png" title="{{site.Params.appName}} App" alt="{{site.Params.appName}}-App Smartphone" loading="lazy" />
2022-08-06 20:25:26 +02:00
</div>
</div>
</div>
</section>
2022-08-06 21:21:31 +02:00
<script src="{{site.BaseURL}}/assets/js/ua-parser.pack.js"></script>
2022-08-06 20:25:26 +02:00
<script>
const Platforms = { "Android": "Android", "iOS": "iOS", "Unsupported": "Unsupported" };
Object.freeze(Platforms);
const DirectLinkingCompatibility = { "Full": "Full", "Manual": "Manual", "None": "None" };
Object.freeze(DirectLinkingCompatibility);
document.addEventListener("DOMContentLoaded", () => {
let parser = new UAParser();
let platform;
if (Platforms.hasOwnProperty(parser.getOS().name))
platform = parser.getOS().name;
else
platform = Platforms.Unsupported;
console.log("Detected platform: ", platform);
console.log("Detected browser: ", parser.getBrowser().name);
const directLinkingCompatibility = {
"Android": parser.getBrowser().name === "Chrome" ?
DirectLinkingCompatibility.Full :
(parser.getBrowser().name === "Firefox" ?
DirectLinkingCompatibility.Manual :
DirectLinkingCompatibility.None),
"iOS": parser.getBrowser().name === "Mobile Safari" ?
DirectLinkingCompatibility.Manual :
DirectLinkingCompatibility.None,
"Unsupported": DirectLinkingCompatibility.None
}[platform];
console.log("Direct linking compatibility: ", directLinkingCompatibility);
const originalQuery = sessionStorage.getItem('originalQuery');
2022-08-06 21:26:01 +02:00
console.log("Original query:", originalQuery);
2022-08-06 20:25:26 +02:00
sessionStorage.removeItem('originalQuery');
let directUrl;
let alternativeUrl;
if (originalQuery) {
2022-08-06 21:19:03 +02:00
directUrl = "{{ site.BaseURL }}/" + originalQuery;
alternativeUrl = "{{ site.Params.alternativeUrl }}/" + originalQuery;
2022-08-06 20:25:26 +02:00
}
window.history.replaceState({}, document.title, window.location.protocol + "//" + window.location.host + "/" + (originalQuery ? originalQuery:""));
if (directUrl && directLinkingCompatibility !== DirectLinkingCompatibility.None) {
const directUrlElement = document.getElementById("directUrl");
directUrlElement.classList.remove("d-none");
directUrlElement.href = directUrl;
if (directLinkingCompatibility === DirectLinkingCompatibility.Manual)
document.getElementById("info" + platform).classList.remove("d-none");
document.getElementById("downloadInfo").classList.remove("d-none");
document.getElementById("headline").classList.add("d-none");
}
else if (directUrl && platform !== Platforms.Unsupported && directLinkingCompatibility === DirectLinkingCompatibility.None) {
document.getElementById("warning" + platform).classList.remove("d-none");
document.getElementById("downloadInfo").classList.remove("d-none");
document.getElementById("headline").classList.add("d-none");
}
else if (directUrl && platform === Platforms.Unsupported) {
const alternativeUrlElement = document.getElementById("alternativeUrl");
alternativeUrlElement.classList.remove("d-none");
alternativeUrlElement.href = alternativeUrl;
document.getElementById("infoUnsupported").classList.remove("d-none");
document.getElementById("headline").classList.add("d-none");
}
switch (platform) {
case Platforms.iOS:
document.getElementById("store_android").classList.add("d-none");
break;
case Platforms.Android:
document.getElementById("store_apple").classList.add("d-none");
break;
case Platforms.Unsupported:
document.getElementById("lead").classList.remove("d-none");
break;
}
});
</script>
</div>
{{ end }}