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

134 lines
6.9 KiB
HTML
Raw Normal View History

2022-08-06 20:25:26 +02:00
{{ define "main" }}
<div class="main-content">
2023-07-09 17:09:56 +02:00
<section class="component download pb-0">
<div class="container h-100">
<picture class="download-mobile-image d-block d-lg-none">
<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" />
</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="warning-ios">{{ i18n "warningIOS" }}</p>
<p class="warning d-none" id="warning-android">{{ i18n "warningAndroid" }}</p>
<h1 class="headline headline-heavy d-none" id="info-ios">{{ i18n "infoIOS" }}</h1>
<h1 class="headline headline-heavy d-none" id="info-android">{{ 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 }}
2022-08-06 20:25:26 +02:00
<div class="col col-12 col-md-6 mb-3" id="store_{{ .id }}">
2023-07-09 17:09:56 +02:00
<a href="{{ .url }}" target="_blank" rel="noopener noreferrer">
<img class="img-fluid w-100" src="{{ .badge }}" alt="{{ .name }} Icon" />
</a>
2022-08-06 20:25:26 +02:00
</div>
2023-07-09 17:09:56 +02:00
{{ end }}
</div>
</div>
<div class="col col-12 col-sm-12 col-md-12 col-lg-5 d-none d-lg-block">
<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" />
</div>
</div>
</div>
</section>
<script src="{{site.BaseURL}}/assets/js/ua-parser.pack.js"></script>
<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.toLowerCase()))
platform = parser.getOS().name.toLowerCase();
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" ?
2022-08-06 20:25:26 +02:00
DirectLinkingCompatibility.Manual :
2023-07-09 17:09:56 +02:00
DirectLinkingCompatibility.None,
"Unsupported": DirectLinkingCompatibility.None
}[platform];
console.log("Direct linking compatibility: ", directLinkingCompatibility);
const originalQuery = sessionStorage.getItem('originalQuery');
console.log("Original query:", originalQuery);
sessionStorage.removeItem('originalQuery');
let directUrl;
let alternativeUrl;
if (originalQuery) {
directUrl = "{{ site.BaseURL }}/" + originalQuery;
alternativeUrl = "{{ site.Params.alternativeUrl }}" + originalQuery;
}
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_google").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>
2022-08-06 20:25:26 +02:00
</div>
{{ end }}