Skip to content
Snippets Groups Projects
Commit 574edc5e authored by Miniontoby's avatar Miniontoby :writing_hand_tone1:
Browse files

Added support for webapp with offline page

Just check changelog.txt
parent e0930188
No related branches found
No related tags found
No related merge requests found
......@@ -9,7 +9,7 @@ RewriteRule ^((?!public/).*)$ public/$1 [L,NC]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule manifest.json manifest.php [L,NC]
#RewriteRule js/fb_config.js js/fb_config.php [L,NC]
RewriteRule js/fb_config.js js/fb_config.php [L,NC]
RewriteRule ^([^/]+)$ index.php?page=$1 [L,NC]
#RewriteCond %{REQUEST_FILENAME} !-f
......
1.0.0:
- Created the repo
- Added images tab and added the logo's including the .ico logo
1.0.1:
- Created index.php with templates folder
- Created config.ini file
- Added stylesheet
- Dark theme
- Created .htaccess
- Fixed accessability problems
- Added manifest.json and tried to create webapp with offline page
- Added icon.png (resized logo.png to make rectangle) and splashscreen.png (different color and resized higher)
- Added HTML Tags for previews
- Started working on database
......@@ -9,3 +9,14 @@ app_email =
app_domain =
app_folder =
app_language = en_US
[notification]
fb_enabled = false
fb_apiKey =
fb_authDomain =
fb_databaseURL =
fb_projectId =
fb_storageBucket =
fb_messagingSenderId =
fb_appId =
fb_measurementId =
......@@ -8,7 +8,7 @@
--bg-color: #161625;
--font-color: #e1e1ff;
--footer-bg: grey;
--footer-color: #fff;
--footer-color: rgb(0, 0, 0);
}
.theme-switch-wrapper { display: flex; align-items: center; } em { margin-left: 10px; font-size: 1rem; } .theme-switch { display: inline-block; height: 34px; position: relative; width: 60px; } .theme-switch input { display:none; } .slider { background-color: #ccc; bottom: 0; cursor: pointer; left: 0; position: absolute; right: 0; top: 0; transition: .4s; } .slider:before { background-color: #fff; bottom: 4px; content: ""; height: 26px; left: 4px; position: absolute; transition: .4s; width: 26px; } input:checked + .slider { background-color: #66bb6a; } input:checked + .slider:before { transform: translateX(26px); } .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; }
......
public/images/SplashScreen.png

13.1 KiB

......@@ -8,11 +8,15 @@ if (file_exists('templates/' . $page_name . '.php')){
$page_title = '404 Not Found';
}
?>
<html>
<!DOCTYPE html>
<html lang="<?=$app->config['app_language']?>">
<head>
<title><?=$page_title?> - MySchoolDay</title>
<meta charset="utf-8">
<meta name="title" content="<?=$page_title?> - MySchoolDay">
<meta name="description" content="MySchoolDay WebApp">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#ffd260">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="<?=$page_title?> - MySchoolDay">
<meta name="twitter:description" content="MySchoolDay WebApp">
......@@ -27,6 +31,7 @@ if (file_exists('templates/' . $page_name . '.php')){
<link rel="shortcut icon" type="image/ico" href="favicon.ico"/>
<link rel="stylesheet" href="css/style.css"/>
<link rel="manifest" href="manifest.json"/>
<link rel="apple-touch-icon" href="favicon.ico"/>
</head>
<body>
......@@ -58,6 +63,12 @@ if (file_exists('templates/' . $page_name . '.php')){
</nav>
<noscript>Please Enable JavaScript For Some Features</noscript>
<script src="js/main.js"></script>
<?php
if ($app->config['fb_enabled']){ ?>
<script src="js/fb_config.js"></script>
<script type="module" src="js/fb.js"></script>
<?php }
?>
<footer>
<span class="copyright">© Copyright 2021 - TheDutchProgrammers</span>
</footer>
......
import "https://www.gstatic.com/firebasejs/8.5.0/firebase-app.js";
import "https://www.gstatic.com/firebasejs/8.5.0/firebase-analytics.js";
console.log("starting up");
// firebaseConfig from fb_config.php
firebase.initializeApp(firebaseConfig);
//firebase.analytics();
let deferredPrompt;
window.addEventListener('beforeinstallprompt', (event) => {
console.log('[fb.js]', 'beforeinstallprompt', event);
window.deferredPrompt = event;
});
window.addEventListener('appinstalled', (event) => {
console.log('[fb.js]', 'appinstalled', event);
window.deferredPrompt = null;
});
window.addEventListener('beforeinstallprompt', (e) => {
e.preventDefault();
deferredPrompt = e;
showInstallPromotion();
console.log('[fb.js]', `'beforeinstallprompt' event was fired.`);
});
window.addEventListener('load', function() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('./js/sw.js');
} else {
console.warn('[fb.js]', 'Service workers aren\'t supported in this browser.');
}
});
<?php
include('../functions/class.php');
$app = new MySchoolDay();
$configs = ["fb_enabled","fb_apiKey","fb_authDomain","fb_databaseURL","fb_projectId","fb_storageBucket","fb_messagingSenderId","fb_appId","fb_measurementId"];
foreach ($app->config as $key => $value) {
if(preg_match_all('/fb_(.*)/m', $key)){
if (!in_array($key, $configs) || $value == ""){
echo $key . " is not set or is null!";
return;
}
}
}
header("Content-Type: application/javascript");
?>
firebaseConfig = {
apiKey: "<?= $app->config['fb_apiKey'] ?>",
authDomain: "<?= $app->config['fb_authDomain'] ?>",
databaseURL: "<?= $app->config['fb_databaseURL'] ?>",
projectId: "<?= $app->config['fb_projectId'] ?>",
storageBucket: "<?= $app->config['fb_storageBucket'] ?>",
messagingSenderId: "<?= $app->config['fb_messagingSenderId'] ?>",
appId: "<?= $app->config['fb_appId'] ?>",
measurementId: "<?= $app->config['fb_measurementId'] ?>"
};
const CACHE_NAME = "V1";
importScripts("https://www.gstatic.com/firebasejs/8.5.0/firebase-app.js");
firebaseConfig = {
apiKey: "AIzaSyDVu-ql-eQJKLLOMglnkTL3F9mcJsLnTdo",
authDomain: "myschoolday-cloud.firebaseapp.com",
databaseURL: "https://myschoolday-cloud-default-rtdb.europe-west1.firebasedatabase.app,",
projectId: "myschoolday-cloud",
storageBucket: "myschoolday-cloud.appspot.com",
messagingSenderId: "1009962896793",
appId: "1:1009962896793:web:77d1c66d10b61b5db1d708",
measurementId: "G-REH6MSC11V"
};
firebase.initializeApp(firebaseConfig);
self.addEventListener('install', function(event) {
console.log('[ServiceWorker] Install');
event.waitUntil((async () => {
const cache = await caches.open(CACHE_NAME);
await cache.add(new Request("offline.html", {cache: 'reload'}));
})());
self.skipWaiting();
});
self.addEventListener('activate', (event) => {
console.log('[ServiceWorker] Activate');
event.waitUntil((async () => {
if ('navigationPreload' in self.registration) {
await self.registration.navigationPreload.enable();
}
})());
// Tell the active service worker to take control of the page immediately.
self.clients.claim();
});
self.addEventListener('fetch', function(event) {
console.log('[ServiceWorker] Fetch', event.request.url);
if (event.request.mode === 'navigate') {
event.respondWith((async () => {
try {
const preloadResponse = await event.preloadResponse;
if (preloadResponse) {
return preloadResponse;
}
const networkResponse = await fetch(event.request);
return networkResponse;
} catch (error) {
console.log('[Service Worker] Fetch failed; returning offline page instead.', error);
const cache = await caches.open(CACHE_NAME);
const cachedResponse = await cache.match('offline.html');
return cachedResponse;
}
})());
}
});
console.log("sw.js loaded");
\ No newline at end of file
......@@ -12,10 +12,11 @@ $url = ($_SERVER['REQUEST_URI'] == $app->config['app_folder']) ? '/' : $app->con
"display": "standalone",
"lang": "<?=$app->config['app_language']?>",
"icons": [
{"src": "images/icon.png", "sizes": "256x256", "type": "image/png", "purpose": "maskable"},
{"src": "images/icon.png", "sizes": "256x256", "type": "image/png"},
{"src": "images/logo.png", "sizes": "256x245", "type": "image/png"},
{"src": "images/LogoMint.png", "sizes": "48x48", "type": "image/png"},
{"src": "images/logo-removebg-preview__1_.png", "sizes": "256x245", "type": "image/png"}
{"src": "images/SplashScreen.png", "sizes": "512x512", "type": "image/png"}
],
"start_url": "index.php",
"scope": "<?=$url?>",
......
This diff is collapsed.
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment