katja's git: oeffisearch

tripView: better offline support

diff --git a/src/tripView.js b/src/tripView.js
@@ -45,22 +45,30 @@ class TripView extends BaseView {
 
 		if (previous.has('refreshToken')) {
 			this.viewState  = null;
-			await this.updateViewState();
+			if (!this.isOffline) await this.updateViewState();
 		}
+
+		if (previous.has('isOffline') && this.viewState === null) await this.updateViewState();
 	}
 
 	renderContent () {
-		return this.viewState !== null ? html`
+		return [
+			html`
 			<div class="header-container">
 				<header>
 					<a id="back" class="icon-back ${history.length !== 1 ? '': 'invisible'}" title="${t('back')}" @click=${() => history.back()}></a>
 					<div class="container">
-						<h3>Trip of ${formatLineDisplayName(this.viewState.trip.line)} to ${this.viewState.trip.direction}</h3>
+						${this.viewState !== null ?
+						html`<h3>Trip of ${formatLineDisplayName(this.viewState.trip.line)} to ${this.viewState.trip.direction}</h3>`
+						: html`<h3>Trip of ...</h3>
+						`}
 					</div>
-					<a class="icon-reload ${this.isUpdating ? 'spinning' : ''}" title="${t("reload")}" @click=${this.updateViewState}></a>
+					<a class="icon-reload ${this.isUpdating ? 'spinning' : ''} ${!this.isOffline ? '' : 'invisible'}" title="${t("reload")}" @click=${this.updateViewState}></a>
 				</header>
 			</div>
+			`,
 
+			this.viewState !== null ? html`
 			<div class="container">
 				<div class="card">
 					<table>

@@ -113,21 +121,15 @@ class TripView extends BaseView {
 				</div>
 			</div>
 			<footer-component></footer-component>
-		` : html`
-			<div class="header-container">
-				<header>
-					<a class="icon-back ${history.length !== 1 ? '': 'invisible'}" title="${t('back')}" @click=${() => history.back()}></a>
-					<div class="container">
-						<h3>Trip of ... to ...</h3>
-					</div>
-					<a class="icon-reload ${this.isUpdating ? 'spinning' : ''}" title="${t("reload")}" @click=${this.updateViewState}></a>
-				</header>
-			</div>
-			<div class="spinner"></div>
-		`;
+			` : !this.isOffline ?
+			html`<div class="spinner"></div>`
+			: html`<div class="offline"></div>`
+		];
 	}
 
 	updateViewState = async () => {
+		if (this.isOffline !== false) return;
+
 		this.isUpdating = true;
 		try {
 			const client = await getHafasClient(this.profile);