Added news

client/scripts/database.js

@@ -1,4 +1,4 @@
-const DB_VERSION = 5;
+const DB_VERSION = 6;
 
 const USER_ID = localStorage.getItem('auth_user');
 const USER_NAME = localStorage.getItem('auth_username');
@@ -491,7 +491,7 @@ function sync() {
 			localTimes[entry['table']] = entry['time'];
 		});
 		
-		syncInProgress = 10;
+		syncInProgress = 11;
 		var syncOkay = true;
 		console.log("Sync Start");
 		$('#i-sync').addClass('fa-spin');
@@ -824,6 +824,38 @@ function sync() {
 					syncInProgress -= 3;
 				}
 				
+				// NEWS
+				if (localTimes['news'] < serverTimes['news']) {
+					getJSON(QUERY_URL + 'get_news?changed-after=' + localTimes['news'], function (code, data) {
+						if (code == 200) {
+							var os = db.transaction('news', 'readwrite').objectStore('news');
+							console.log(data);
+							data.data.forEach(function (entry) {
+								os.put(entry);
+							});
+							os.openCursor().onsuccess = function (event) {
+								var cursor = event.target.result;
+								if (cursor) {
+									if (!data.keys.includes(parseInt(cursor.key))) {
+										os.delete(cursor.key);
+									}
+									cursor.continue();
+								} else {
+									var osUpdateTimes = db.transaction('update_times', 'readwrite').objectStore('update_times');
+									osUpdateTimes.put({ table: 'news', time: serverTimes['news'] });
+									syncInProgress --;
+								}
+							};
+						} else {
+							console.log("Something went wrong (HTTP " + code + ")");
+							syncOkay = false;
+							syncInProgress --;
+						}
+					});
+				} else {
+					syncInProgress --;
+				}
+				
 				// USERS
 				if (localTimes['users'] < serverTimes['users']) {
 					getJSON(QUERY_URL + 'get_users?changed-after=' + localTimes['users'], function (code, data) {
@@ -986,6 +1018,13 @@ function initDatabase() {
 				var osPushes = db.createObjectStore('settings', { keyPath: 'key' });
 			}
 			
+			if ((oldVersion < 6) && (newVersion >= 6)) {
+				console.log('to version 6');
+				var osNews = db.createObjectStore('news', { keyPath: 'id' });
+				var osUpdateTimes = upgradeTransaction.objectStore('update_times');
+				osUpdateTimes.add({ table: 'news', time: 0 });
+			}
+			
 			var osUpdateTimes = upgradeTransaction.objectStore('update_times');
 			osUpdateTimes.put({ table: 'last_sync', time: 0 });
 		}
@@ -1009,6 +1048,7 @@ function resetDb(silent = true) {
 		osUpdateTimes.put({ table: 'trim_boats', time: 0 });
 		osUpdateTimes.put({ table: 'trim_users', time: 0 });
 		osUpdateTimes.put({ table: 'trim_trims', time: 0 });
+		osUpdateTimes.put({ table: 'news', time: 0 });
 		osUpdateTimes.put({ table: 'users', time: 0 });
 		console.log('DB update times reset');
 		if (!silent)

client/styles/regatten.css

@@ -173,6 +173,13 @@
 	text-align: right;
 }
 
+/*** BLOCKQUOTE ***/
+blockquote {
+	border-left: 0.5em solid rgba(0, 0, 0, 0.125);
+	font-style: italic;
+	padding-left: 1em;
+}
+
 /*** BLINKING ICONS ***/
 @keyframes fa-blink {
 	0% { opacity: 1; }

server/content/news.php

@@ -1,19 +1,22 @@
 <?php
 	
-	// TODO: Create site
+	$sp['title'] = 'News - Regatten.net ' . $_CLASS['name'];
-	
-	$sp['title'] = 'Seite noch nicht unterstuuml;tzt - Regatten.net ' . $_CLASS['name'];
 	$sp['backbutton'] = true;
+	$sp['activenav'] = 5;
 	
-	$content = $tpl->load('error', ['404', 'Seite existiert noch nicht']);
+	// Title
-	$content .= '<p>';
+	$content = "<h1>Neuigkeiten</h1>";
-	$content .= 'Die gesuchte Seite ist leider noch nicht verf&uuml;gbar.<br>';
+	$content .= '<p>Aktuelles der letzten zw&ouml;lf Monate</p>';
-	$content .= 'Wir arbeiten daran, sie schnellstm&ouml;glich zur Verf&uuml;gung zu stellen.<br>';
-	$content .= 'Wie w&auml;re es mit der Homepage?';
-	$content .= '</p>';
-	$content .= $tpl->load('button', ['Zur Startseite', LINK_PRE . 'index', 'css-class' => 'mb-3']);
-	$content .= $tpl->load('button', ['Kontakt', LINK_PRE . 'contact']);
 	
-	$sp['output'] = $tpl->load('card', [$content, 'css-class' => 'text-center pt-3']);
+	$sp['output'] .= $tpl->load('card', [$content]);
+	
+	// Menu
+	$sp['menus'] .= $tpl->load('menu/modal', ['html-id' => 'menu-news', 'title' => 'Details']);
+	
+	$cardTemplate = $tpl->load('card', ['%CONTENT%', 'html-id' => '%ID%', 'css-class' => 'card-news']);
+	$cardTemplate = str_replace("\n", '', $cardTemplate);
+	$cardTemplate = str_replace("\r", '', $cardTemplate);
+	$sp['scripts'] .= "<script>const cardTemplate = '" . $cardTemplate . "';</script>";
+	$sp['scripts'] .= $scripts->load('news');
 	
 ?>

server/scripts/news.js

@@ -0,0 +1,44 @@
+async function onNewsClicked(id) {
+	var newsEntry = await dbGetData('news', id);
+	if (newsEntry == null) return;
+	
+	$('#menu-news').css('height', '80%');
+	$('#menu-news').css('width', '90%');
+	$('#menu-news').find('.menu-title').find('p').text(newsEntry.title);
+	$('#menu-news').find('.content').addClass('pb-3');
+	$('#menu-news').find('.content').html(newsEntry.html);
+	
+	$('#menu-news').showMenu();
+}
+
+function addCard(newsEntry) {
+	console.log(newsEntry);
+	var content = '<h2>' + newsEntry.title + '</h2>';
+	content += '<p class="mb-2"><i>' + formatDate('d.m.Y', newsEntry.date) + '</i></p>';
+	content += '<p class="mb-0">' + newsEntry.description.replace('\n', '<br>') + '</p>';
+	if (newsEntry.html != '') {
+		content += '<a class="btn btn-full rounded-s text-uppercase font-900 shadow-m bg-highlight mt-3" href="#" onclick="onNewsClicked(' + newsEntry.id + '); return false;">Mehr lesen</a>';
+	}
+	
+	$('.page-content').append(cardTemplate.replace('%ID%', 'card-news-' + newsEntry.id).replace('%CONTENT%', content));
+}
+
+var siteScript = async function() {
+	$('.card-news').remove();
+	var news = await dbGetData('news');
+	news.sort(function (a,b) {
+		return b.date.localeCompare(a.date);
+	});
+	var today = getToday();
+	var lastYear = new Date(today);
+	lastYear.setFullYear(lastYear.getFullYear() - 1);
+	console.log(today, lastYear);
+	for (var n in news) {
+		var newsEntry = news[n];
+		newsEntry.date = parseDate(newsEntry.date.substring(0, 10));
+		if (newsEntry.date > today) continue;
+		if (newsEntry.date < lastYear) break;
+		addCard(newsEntry);
+	}
+	hideLoader();
+}

service-worker.js.php

@@ -226,6 +226,10 @@ self.addEventListener('push', async function(event) {
 					options.image = image;
 				}
 				
+				// Force refresh on next app open
+				var os = db.transaction('update_times', 'readwrite').objectStore('update_times');
+				os.put({ table: 'last_sync', time: 0 });
+				
 				console.log('Showing notification');
 				self.registration.showNotification(data.title, options);
 				break;