PWA Fundvelo der Caritas.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270
  1. <!DOCTYPE html>
  2. <html lang="de-ch">
  3. <head>
  4. <title>Caritas PWA</title>
  5. <base href="/" /> <!--For localhost development-->
  6. <!--<base href="/cwebplusApp/" />--> <!--For VM-CARITAS-->
  7. <!--<base href="/cwebplusApp/" />--> <!--For cwebplus.ch-->
  8. <meta charset="utf-8" />
  9. <meta name="description" content="Caritas PWA, developed by INTEGRATE AG, Switzerland">
  10. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes" />
  11. <meta name="apple-mobile-web-app-status-bar" content="#db001b">
  12. <meta name="theme-color" content="#db001b">
  13. <script src="_content/BlazorAnimate/blazorAnimateInterop.js"></script>
  14. <script src="_content/MatBlazor/dist/matBlazor.js"></script>
  15. <link href="_content/MatBlazor/dist/matBlazor.css" rel="stylesheet" />
  16. <link href="css/united/bootstrap.min.css" rel="stylesheet" />
  17. <link href="css/united/_bootswatch.min.css" rel="stylesheet" />
  18. <link href="css/united/_variables.min.css" rel="stylesheet" />
  19. <link href="css/app.css" rel="stylesheet" />
  20. <link href="manifest.json" rel="manifest" />
  21. <link rel="apple-touch-icon" href="icons/icon-60@3x.png" />
  22. <link href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" rel="stylesheet"
  23. integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
  24. crossorigin="" />
  25. </head>
  26. <body>
  27. <app>App wird geladen...</app>
  28. <div id="blazor-error-ui">
  29. Ein unbehandelter Fehler ist aufgetreten.
  30. <a href="" class="reload">Neu laden</a>
  31. <a class="dismiss">🗙</a>
  32. </div>
  33. <!-- The actual snackbar -->
  34. <div id="snackbarDiv">
  35. <div id="snackbar">Eine neue Version der App ist verfügbar. Klicken Sie <a id="reload" style="color:deepskyblue">hier</a> um die App zu aktualisieren. Eventuell müssen Sie die App neu starten.</div>
  36. </div>
  37. <div class="ios-prompt">
  38. <span style="color: rgb(187, 187, 187); float: right; margin-top: -14px; margin-right: -11px;">&times;</span>
  39. <p style="margin-top: -3px; line-height: 1.3rem;">Um die App auf dem Homebildschirm zu installieren, klicken Sie auf <img src="images/ios-share-icon.png" style="display: inline-block; margin-top: 0px; margin-bottom: 4px; height: 16px; width: auto;"> und dann "Zum Home-Bildschirm".</p>
  40. </div>
  41. <script src="_framework/blazor.webassembly.js"></script>
  42. <script src="_content/TG.Blazor.IndexedDB/indexedDb.Blazor.js"></script>
  43. <script>
  44. let newWorker;
  45. function showUpdateBar() {
  46. let snackbarDiv = document.getElementById('snackbarDiv');
  47. let snackbar = document.getElementById('snackbar');
  48. snackbar.className = 'show';
  49. snackbarDiv.className = 'show';
  50. }
  51. function hideUpdateBar() {
  52. let snackbarDiv = document.getElementById('snackbarDiv');
  53. let snackbar = document.getElementById('snackbar');
  54. snackbar.className = '';
  55. snackbarDiv.className = '';
  56. }
  57. // The click event on the pop up notification
  58. document.getElementById('reload').addEventListener('click', function () {
  59. newWorker.postMessage({ action: 'skipWaiting' });
  60. hideUpdateBar();
  61. });
  62. if ('serviceWorker' in navigator) {
  63. navigator.serviceWorker.register('service-worker.js').then(reg => {
  64. reg.addEventListener('updatefound', () => {
  65. // A wild service worker has appeared in reg.installing!
  66. newWorker = reg.installing;
  67. newWorker.addEventListener('statechange', () => {
  68. // Has newWorker.state changed?
  69. switch (newWorker.state) {
  70. case 'installed':
  71. if (navigator.serviceWorker.controller) {
  72. // new update available
  73. showUpdateBar();
  74. }
  75. // No update available
  76. break;
  77. }
  78. });
  79. });
  80. }).catch((err) => console.log('Failed to register Service worker.', err));
  81. let refreshing;
  82. navigator.serviceWorker.addEventListener('controllerchange', function () {
  83. if (refreshing) return;
  84. window.location = window.location.origin;
  85. refreshing = true;
  86. console.log('Reload to page ' + window.location.origin + ' on controller change.');
  87. });
  88. }
  89. </script>
  90. <script>
  91. function BlazorSetLocalStorage(key, value) {
  92. localStorage.setItem(key, value);
  93. }
  94. function BlazorGetLocalStorage(key) {
  95. return localStorage.getItem(key);
  96. }
  97. function BlazorRegisterStorageEvent(component) {
  98. window.addEventListener("storage", async e => {
  99. await component.invokeMethodAsync("OnStorageUpdated", e.key);
  100. });
  101. }
  102. function registerOnlineStatusHandler(dotNetObjRef) {
  103. function onlineStatusHandler() {
  104. dotNetObjRef.invokeMethodAsync("SetOnlineStatus", navigator.onLine);
  105. };
  106. onlineStatusHandler();
  107. window.addEventListener("online", onlineStatusHandler);
  108. window.addEventListener("offline", onlineStatusHandler);
  109. }
  110. function IsGeoLocationAllowed(dotNetObjRef) {
  111. if (isSafari()) {
  112. navigator.geolocation.getCurrentPosition(
  113. position => {
  114. // this function is called only if the user grant permission so here you can handle the granted state
  115. dotNetObjRef.invokeMethodAsync("GeoLocationPermissionChanged", "granted");
  116. return "granted";
  117. },
  118. error => {
  119. // this function is called if the user denied permission or some other errors occurs
  120. dotNetObjRef.invokeMethodAsync("GeoLocationPermissionChanged", "denied");
  121. return "denied";
  122. }
  123. );
  124. } else {
  125. navigator.permissions.query({ name: 'geolocation' }).then(function (result) {
  126. result.onchange = function () {
  127. dotNetObjRef.invokeMethodAsync("GeoLocationPermissionChanged", result.state);
  128. }
  129. dotNetObjRef.invokeMethodAsync("GeoLocationPermissionChanged", result.state);
  130. return result.state;
  131. });
  132. }
  133. return "";
  134. }
  135. function RemoveScrollLock(dotNetObjRef) {
  136. document.querySelector("body.mdc-dialog-scroll-lock")?.classList.remove("mdc-dialog-scroll-lock");
  137. }
  138. function MoveCursorToNextInput(dotNetObjRef, key) {
  139. if (key == "Enter" || key == "ArrowRight") {
  140. var activeElement = document.activeElement;
  141. var inputs = getKeyboardFocusableElements();
  142. var arr = Array.prototype.slice.call(inputs)
  143. var index = arr.indexOf(activeElement);
  144. if (index + 1 < arr.length && CanNavigateForward(activeElement, key)) {
  145. activeElement.dispatchEvent(new Event('focusout'));
  146. setTimeout(function () { arr[index + 1].focus(); }, 50);
  147. if (arr[index + 1].localName.includes('input') || arr[index + 1].localName.includes('textarea')) {
  148. setTimeout(function () { arr[index + 1].select(); }, 50);
  149. }
  150. }
  151. }
  152. }
  153. function MoveCursorToPreviousInput(dotNetObjRef) {
  154. var activeElement = document.activeElement;
  155. var inputs = getKeyboardFocusableElements();
  156. var arr = Array.prototype.slice.call(inputs)
  157. var index = arr.indexOf(activeElement);
  158. if (index - 1 >= 0 && CanNavigateBack(activeElement)) {
  159. activeElement.dispatchEvent(new Event('focusout'));
  160. setTimeout(function () { arr[index + 1].focus(); }, 50);
  161. if (arr[index - 1].localName.includes('input') || arr[index - 1].localName.includes('textarea')) {
  162. setTimeout(function () { arr[index - 1].select(); }, 50);
  163. }
  164. }
  165. }
  166. function DispatchKeyboardEvent(dotNetObjRef, key) {
  167. window.dispatchEvent(new KeyboardEvent('keydown', { 'key': key }));
  168. }
  169. function getKeyboardFocusableElements(element = document) {
  170. return [...element.querySelectorAll('input:not([disabled]), textarea:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')]
  171. .filter(el => el.localName != 'li' && !el.getAttribute("aria-hidden"))
  172. }
  173. function CanNavigateForward(element, key) {
  174. if (element.getAttribute('class').includes('select') || element.getAttribute('class').includes('button')) {
  175. if (key == "Enter") {
  176. return false;
  177. }
  178. return true;
  179. } else {
  180. return key == "Enter" || element.selectionStart == element.value.length
  181. || (element.selectionStart == 0 && element.selectionEnd == element.value.length);
  182. }
  183. }
  184. function CanNavigateBack(element) {
  185. if (element.getAttribute('class').includes('select') || element.getAttribute('class').includes('button')) {
  186. return true;
  187. } else {
  188. return element.selectionStart == null || element.selectionStart == 0;
  189. }
  190. }
  191. function CheckConstrainedInput(dotNetObjRef, key) {
  192. const ignoredKeys = ["Backspace", "Tab"];
  193. var theEvent = window.event;
  194. var activeElement = document.activeElement;
  195. var regex = new RegExp(activeElement.pattern);
  196. if (!ignoredKeys.includes(key) && !regex.test(activeElement.value + key)) {
  197. theEvent.returnValue = false;
  198. if (theEvent.preventDefault) theEvent.preventDefault();
  199. }
  200. }
  201. </script>
  202. <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"
  203. integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
  204. crossorigin="">
  205. </script>
  206. <!-- ----------------- iOS Support for home screen ----------------- -->
  207. <script>
  208. function showIosInstall() {
  209. let iosPrompt = document.querySelector(".ios-prompt");
  210. iosPrompt.style.display = "block";
  211. iosPrompt.addEventListener("click", () => {
  212. iosPrompt.style.display = "none";
  213. });
  214. }
  215. function isSafari() {
  216. var is_safari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
  217. return is_safari;
  218. }
  219. function isIOS() {
  220. // Detects if device is on iOS
  221. const userAgent = window.navigator.userAgent.toLowerCase();
  222. return /iphone|ipad|ipod/.test(userAgent);
  223. }
  224. function iOSInstallerCheck() {
  225. // Detects if device is in standalone mode
  226. const isInStandaloneMode = () => ('standalone' in window.navigator) && (window.navigator.standalone);
  227. // Checks if should display install popup notification:
  228. if (isIOS() && !isInStandaloneMode()) {
  229. showIosInstall();
  230. }
  231. }
  232. iOSInstallerCheck();
  233. </script>
  234. </body>
  235. </html>