From 3046f6194fbfe1178ab8f063dcf3692c3e35579d Mon Sep 17 00:00:00 2001
From: Patrizio Bekerle <patrizio.bekerle@tugraz.at>
Date: Wed, 12 Aug 2020 12:59:27 +0200
Subject: [PATCH] Add more demo app scaffolding

---
 demo/assets/dbp-toolkit-demo.html.ejs | 143 ++++++++++++++++++++++++++
 demo/src/toolkit-demo.js              |   2 +-
 2 files changed, 144 insertions(+), 1 deletion(-)
 create mode 100644 demo/assets/dbp-toolkit-demo.html.ejs

diff --git a/demo/assets/dbp-toolkit-demo.html.ejs b/demo/assets/dbp-toolkit-demo.html.ejs
new file mode 100644
index 00000000..108c34ae
--- /dev/null
+++ b/demo/assets/dbp-toolkit-demo.html.ejs
@@ -0,0 +1,143 @@
+<!doctype html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <!-- Favicons -->
+    <link rel="shortcut icon" type="image/x-icon" href="<%= getPrivateUrl('favicon.ico') %>">
+    <link rel="icon" type="image/svg+xml" href="<%= getPrivateUrl('favicon.svg') %>" sizes="any">
+
+<% if (environment === "local") { -%>
+    <!-- XXX: Disable adoptedStyleSheets so that lit-element doesn't use it and we can edit CSS in the Chrome dev tools -->
+    <script>
+        delete Document.prototype.adoptedStyleSheets;
+    </script>
+<% } -%>
+
+    <!-- PWA manfiest file -->
+    <link rel="manifest" href="<%= getUrl(name + '.manifest.json') %>">
+
+    <!-- Loading spinner -->
+    <script type="module">
+        import {Spinner} from '<%= getPrivateUrl('spinner.js') %>';
+        customElements.define('dbp-loading-spinner', Spinner);
+    </script>
+
+    <!-- App bundles-->
+    <script type="module" src="<%= getUrl(name + '.js') %>"></script>
+
+    <!-- Prevent Chrome/Edge from suggesting to translate the page -->
+    <meta name="google" content="notranslate">
+
+    <!-- Preload fonts -->
+    <link rel="preload" href="<%= getPrivateUrl('fonts/SourceSansPro-Light.otf.woff2') %>" as="font" type="font/woff2" crossorigin>
+    <link rel="preload" href="<%= getPrivateUrl('fonts/SourceSansPro-Regular.otf.woff2') %>" as="font" type="font/woff2" crossorigin>
+    <link rel="preload" href="<%= getPrivateUrl('fonts/SourceSansPro-Semibold.otf.woff2') %>" as="font" type="font/woff2" crossorigin>
+    <link rel="preload" href="<%= getPrivateUrl('fonts/SourceSansPro-Bold.otf.woff2') %>" as="font" type="font/woff2" crossorigin>
+
+    <!-- Matomo -->
+    <script type="text/javascript">
+        var _paq = window._paq || [];
+        _paq.push(['setCustomVariable', 1, "GitCommit", "<%= buildInfo.info %>", "visit"]);
+        _paq.push(['enableHeartBeatTimer']);
+        _paq.push(['disableCookies']);
+        _paq.push(['trackPageView']);
+        _paq.push(['enableLinkTracking']);
+
+        (function() {
+            var u="https://analytics.tugraz.at/";
+            _paq.push(['setTrackerUrl', u+'matomo.php']);
+            _paq.push(['setSiteId', '<%= matomoSiteId %>']);
+            var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+            g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+        })();
+
+        // track changed locations
+        window.addEventListener('locationchanged', function(e) {
+            _paq.push(['setReferrerUrl', e.detail.referrerUrl]);
+            _paq.push(['setCustomUrl', location.href]);
+            // _paq.push(['setDocumentTitle', '']);
+            _paq.push(['trackPageView']);
+
+            // make Matomo aware of newly added content
+            var content = document.getElementById('content');
+            _paq.push(['MediaAnalytics::scanForMedia', content]);
+            _paq.push(['FormAnalytics::scanForForms', content]);
+            _paq.push(['trackContentImpressionsWithinNode', content]);
+        });
+
+        // track errors
+        window.addEventListener('error', function(e) {
+            _paq.push(['trackEvent', 'Error', e.error.message + '\n' + e.error.stack]);
+        });
+    </script>
+    <!-- End Matomo Code -->
+
+    <!-- Font related CSS -->
+    <style>
+        body {
+            font-family: 'Source Sans Pro', 'Calibri', 'Arial', 'sans-serif';
+            font-weight: 300;
+            margin: 0;
+        }
+
+        @font-face {
+            font-family: 'Source Sans Pro';
+            font-weight: 300;
+            src: url('<%= getPrivateUrl('fonts/SourceSansPro-Light.otf.woff2') %>') format('woff2');
+            font-display: block;
+        }
+
+        @font-face {
+            font-family: 'Source Sans Pro';
+            font-weight: 400;
+            src: url('<%= getPrivateUrl('fonts/SourceSansPro-Regular.otf.woff2') %>') format('woff2');
+            font-display: block;
+        }
+
+        @font-face {
+            font-family: 'Source Sans Pro';
+            font-weight: 600;
+            src: url('<%= getPrivateUrl('fonts/SourceSansPro-Semibold.otf.woff2') %>') format('woff2');
+            font-display: block;
+        }
+
+        @font-face {
+            font-family: 'Source Sans Pro';
+            font-weight: 700;
+            src: url('<%= getPrivateUrl('fonts/SourceSansPro-Bold.otf.woff2') %>') format('woff2');
+            font-display: block;
+        }
+
+        /* TU-Graz style override */
+        html {
+            --dbp-override-primary-bg-color: #245b78;
+            --dbp-override-primary-button-border: solid 1px #245b78;
+            --dbp-override-info-bg-color: #245b78;
+            --dbp-override-danger-bg-color: #e4154b;
+            --dbp-override-warning-bg-color: #ffe183;
+            --dbp-override-warning-text-color: black;
+            --dbp-override-success-bg-color: #259207;
+        }
+    </style>
+
+    <!-- Preloading/Preconnecting -->
+    <link rel="preconnect" href="<%= entryPointURL %>">
+    <link rel="preconnect" href="<%= keyCloakBaseURL %>">
+</head>
+
+<body>
+<<%= name %>
+    lang="de"
+    src="<%= getUrl(name + '.topic.metadata.json') %>"
+    entry-point-url="<%= entryPointURL %>"
+    base-path="<%= getUrl('') %>"
+    keycloak-config='{"url": "<%= keyCloakBaseURL %>", "realm": "tugraz", "clientId": "<%= keyCloakClientId %>", "silentCheckSsoRedirectUri": "<%= getUrl('silent-check-sso.html') %>"}'
+><dbp-loading-spinner></dbp-loading-spinner></<%= name %>>
+
+<!-- Error handling for too old browsers -->
+<script src="<%= getPrivateUrl('browser-check.js') %>" defer></script>
+<noscript>Diese Applikation benötigt Javascript / This application requires Javascript</noscript>
+</body>
+</html>
\ No newline at end of file
diff --git a/demo/src/toolkit-demo.js b/demo/src/toolkit-demo.js
index 47faec64..f9b88e27 100644
--- a/demo/src/toolkit-demo.js
+++ b/demo/src/toolkit-demo.js
@@ -1,4 +1,4 @@
 import {AppShell} from 'dbp-app-shell';
 import * as commonUtils from 'dbp-common/utils';
 
-commonUtils.defineCustomElement('dbp-signature', AppShell);
\ No newline at end of file
+commonUtils.defineCustomElement('dbp-toolkit-demo', AppShell);
-- 
GitLab