Prepare release of 2023.7.1-beta

This commit is contained in:
Fred Boniface 2023-07-12 21:00:28 +01:00
parent c61a8e9ff0
commit 81ec43ef5a
8 changed files with 147 additions and 100 deletions

View File

@ -7,7 +7,7 @@ RUN npm install
COPY . ./ COPY . ./
RUN npm run build RUN npm run build
FROM nginx:alpine-slim FROM georgjung/nginx-brotli:mainline-alpine
RUN rm -f /etc/nginx/nginx.conf RUN rm -f /etc/nginx/nginx.conf
COPY ./nginx.conf /etc/nginx/nginx.conf COPY ./nginx.conf /etc/nginx/nginx.conf
COPY --from=build /app/build /usr/share/nginx/html COPY --from=build /app/build /usr/share/nginx/html

View File

@ -1,3 +1,5 @@
load_module modules/ngx_http_brotli_static_module.so;
user nginx; user nginx;
worker_processes auto; worker_processes auto;
@ -44,6 +46,7 @@ http {
root /usr/share/nginx/html; root /usr/share/nginx/html;
index index.html; index index.html;
gzip_static on; gzip_static on;
brotli_static on;
error_page 500 502 503 504 /50x.html; error_page 500 502 503 504 /50x.html;
try_files $uri $uri.html $uri/ =404; try_files $uri $uri.html $uri/ =404;
add_header Cache-Control "public, no-transform, max-age=1209600"; add_header Cache-Control "public, no-transform, max-age=1209600";

View File

@ -28,7 +28,8 @@
@font-face { @font-face {
font-family: 'ubuntu'; font-family: 'ubuntu';
src: url('/font/ubuntumono/ubuntumono-regular.woff2') format('woff2'), url('/font/ubuntumono/ubuntumono-refular.woff') format('woff'), url('/font/ubuntumono/ubuntumono-regular.ttf') format('truetype'); src: url('/font/ubuntumono/ubuntumono-regular.woff2') format('woff2'), url('/font/ubuntumono/ubuntumono-regular.woff') format('woff'),
url('/font/ubuntumono/ubuntumono-regular.ttf') format('truetype');
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
} }

View File

@ -150,72 +150,78 @@
click(rid, uid, tid); click(rid, uid, tid);
} }
</script> </script>
<p class="smallScreen">Your display is too small to view this data</p> <p class="smallScreen">Your display is too small to view this data</p>
<table> <table>
<tr> <tr>
<th class="id">ID</th> <th class="id">ID</th>
<th class="from">From</th> <th class="from">From</th>
<th class="to">To</th> <th class="to">To</th>
<th class="plat">Plat</th> <th class="plat">Plat</th>
<th class="time">Sch</th> <th class="time">Sch</th>
<th class="time">Exp</th> <th class="time">Exp</th>
<th class="time">Sch</th> <th class="time">Sch</th>
<th class="time">Exp</th> <th class="time">Exp</th>
</tr> </tr>
<tr> <tr>
<th class="other" colspan="4" /> <th class="other" colspan="4" />
<th class="timepair" colspan="2">Arrival</th> <th class="timepair" colspan="2">Arrival</th>
<th class="timepair" colspan="2">Departure</th> <th class="timepair" colspan="2">Departure</th>
</tr> </tr>
{#each services as service} {#each services as service}
{#await generateServiceData(service)} {#await generateServiceData(service)}
<tr><td colspan="8">Loading Service Data...</td></tr> <tr><td colspan="8">Loading Service Data...</td></tr>
{:then serviceData} {:then serviceData}
<tr <tr
class="dataRow" class="dataRow"
on:click={(event) => detail(event, service.rid, service.uid, service.trainid)} on:click={(event) => detail(event, service.rid, service.uid, service.trainid)}
on:keypress={(event) => detail(event, service.rid, service.uid, service.trainid)} on:keypress={(event) => detail(event, service.rid, service.uid, service.trainid)}
>
<td class="id">{service.trainid}</td>
<td class="from {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.from}</td>
<td class="to {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.to}</td>
<td class="plat {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'} {serviceData.platformHidden && 'nonPass'}"
>{serviceData.platform.number || '-'}</td
> >
<td class="id">{service.trainid}</td> <td class="time schTime {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.schArr}</td>
<td class="from {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.from}</td> <td
<td class="to {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.to}</td> class="time {serviceData.isNonPublic && 'nonPass'} {serviceData.isLateArr && 'late'} {serviceData.isArrDelayed && 'late'} {serviceData.isCancelled &&
<td class="plat {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'} {serviceData.platformHidden && 'nonPass'}">{serviceData.platform.number || '-'}</td> 'canc'} {serviceData.isEarlyArr && 'early'}">{serviceData.isArrDelayed ? 'LATE' : serviceData.expArr}</td
<td class="time schTime {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.schArr}</td> >
<td class="time {serviceData.isNonPublic && 'nonPass'} {serviceData.isLateArr && 'late'} {serviceData.isArrDelayed && 'late'} {serviceData.isCancelled && 'canc'} {serviceData.isEarlyArr && 'early'}" <td class="time schTime {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.schDep}</td>
>{serviceData.isArrDelayed ? 'LATE' : serviceData.expArr}</td <td
> class="time {serviceData.isNonPublic && 'nonPass'} {serviceData.isLateDep && 'late'} {serviceData.isDepDelayed && 'late'}
<td class="time schTime {serviceData.isNonPublic && 'nonPass'} {serviceData.isCancelled && 'cancTxt'}">{serviceData.schDep}</td>
<td
class="time {serviceData.isNonPublic && 'nonPass'} {serviceData.isLateDep && 'late'} {serviceData.isDepDelayed && 'late'}
{serviceData.isCancelled && 'canc'} {serviceData.isEarlyDep && 'early'}">{serviceData.isDepDelayed ? 'LATE' : serviceData.expDep}</td {serviceData.isCancelled && 'canc'} {serviceData.isEarlyDep && 'early'}">{serviceData.isDepDelayed ? 'LATE' : serviceData.expDep}</td
> >
</tr> </tr>
<tr> <tr>
<td class="tableTxt" colspan="8"> <td class="tableTxt" colspan="8">
{service.operator} {#if service.isCharter}charter{/if} {service.operator}
{#if serviceData.length} | {serviceData.length} carriages{/if} {#if service.isCharter}charter{/if}
{#if service.delayReason} {#if serviceData.length} | {serviceData.length} carriages{/if}
<br /> {#if service.delayReason}
<Reason type={'delay'} code={service.delayReason} /> <br />
{/if} <Reason type={'delay'} code={service.delayReason} />
{#if service.cancelReason} {/if}
<br /> {#if service.cancelReason}
<Reason type={'cancel'} code={service.cancelReason} /> <br />
{/if} <Reason type={'cancel'} code={service.cancelReason} />
</td> {/if}
</tr> </td>
{:catch} </tr>
<tr> {:catch}
<td colspan="8">Unable to display service</td> <tr>
</tr> <td colspan="8">Unable to display service</td>
{/await} </tr>
{/each} {/await}
</table> {/each}
</table>
<style> <style>
table { table {
table-layout: fixed; table-layout: fixed;
width: 100%; width: 100%;
max-width: 875px;
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
color: white; color: white;
@ -261,10 +267,12 @@
text-align: left; text-align: left;
} }
td.to, th.to { td.to,
th.to {
text-align: right; text-align: right;
} }
td.from, th.from { td.from,
th.from {
text-align: left; text-align: left;
} }
td.time { td.time {
@ -280,27 +288,52 @@
} }
/* Handle small screens */ /* Handle small screens */
.smallScreen {display: none; margin: 20px;} .smallScreen {
display: none;
margin: 20px;
}
@media screen and (max-width: 335px) { @media screen and (max-width: 335px) {
th {font-size: 10px;} th {
.dataRow {font-size: 12px;} font-size: 10px;
td.time {font-size: 12px;} }
.tableTxt{font-size:10px;} .dataRow {
font-size: 12px;
}
td.time {
font-size: 12px;
}
.tableTxt {
font-size: 10px;
}
} }
@media screen and (max-width: 279px) { @media screen and (max-width: 279px) {
table {display: none;} table {
.smallScreen {display: block;} display: none;
}
.smallScreen {
display: block;
}
} }
/* Handle Large Screens */ /* Handle Large Screens */
@media screen and (min-width: 375px) { @media screen and (min-width: 375px) {
.dataRow{font-size: 18px;} .dataRow {
td.time{font-size:16px;} font-size: 18px;
}
td.time {
font-size: 16px;
}
} }
@media screen and (min-width: 450px) { @media screen and (min-width: 450px) {
.dataRow{font-size:20px;} .dataRow {
td.time{font-size:19px;} font-size: 20px;
.tableTxt{font-size:13px;} }
td.time {
font-size: 19px;
}
.tableTxt {
font-size: 13px;
}
} }
/* Conditional Classes */ /* Conditional Classes */

View File

@ -108,24 +108,24 @@
<br /> <br />
Times in <span class="estimate">yellow</span> are estimated times Times in <span class="estimate">yellow</span> are estimated times
</p> </p>
{#if train.GetServiceDetailsResult.delayReason} {#if train.GetServiceDetailsResult.delayReason}
<p class="reason late"> <p class="reason late">
<Reason type="delay" code={train.GetServiceDetailsResult.delayReason} /> <Reason type="delay" code={train.GetServiceDetailsResult.delayReason} />
</p> </p>
{/if} {/if}
{#if train.GetServiceDetailsResult.cancelReason} {#if train.GetServiceDetailsResult.cancelReason}
<p class="reason canc"> <p class="reason canc">
<Reason type="cancel" code={train.GetServiceDetailsResult.cancelReason} /> <Reason type="cancel" code={train.GetServiceDetailsResult.cancelReason} />
</p> </p>
{/if} {/if}
<table id="detailTable"> <table id="detailTable">
<tr> <tr>
<th class="tableLocation">Loc.</th> <th class="tableLocation">Loc.</th>
<th class="tablePlatform">Pl.</th> <th class="tablePlatform">Pl.</th>
<th class="tableTime">Sch</th> <th class="tableTime">Sch</th>
<th class="tableTime">Est/<br>Act</th> <th class="tableTime">Est/<br />Act</th>
<th class="tableTime">Sch</th> <th class="tableTime">Sch</th>
<th class="tableTime">Est/<br>Act</th> <th class="tableTime">Est/<br />Act</th>
<th class="tableDelay" /> <th class="tableDelay" />
</tr> </tr>
<tr> <tr>
@ -209,17 +209,23 @@
margin-right: 0px; margin-right: 0px;
padding: 0px; padding: 0px;
color: white; color: white;
font-family: ubuntu,monospace; font-family: ubuntu, monospace;
font-size: 16px; font-size: 16px;
} }
@media screen and (max-width: 338px) { @media screen and (max-width: 338px) {
#detailTable{font-size: 14px} #detailTable {
font-size: 14px;
}
} }
@media screen and (max-width: 301px) { @media screen and (max-width: 301px) {
#detailTable{font-size: 12px} #detailTable {
font-size: 12px;
}
} }
@media screen and (min-width: 469px) { @media screen and (min-width: 469px) {
#detailTable{font-size: 20px} #detailTable {
font-size: 20px;
}
} }
.tableLocation { .tableLocation {
width: 18%; width: 18%;

View File

@ -1,3 +1,3 @@
export const version = '2023.7.1'; export const version = '2023.7.1';
export const versionTag = 'beta.2'; export const versionTag = 'beta.3';
export const showWelcome = true; export const showWelcome = true;

View File

@ -83,7 +83,10 @@
<p>There was an error processing your request.</p> <p>There was an error processing your request.</p>
<p>Check that the email you entered was correct or try again later.</p> <p>Check that the email you entered was correct or try again later.</p>
{:else if state == 'reg'} {:else if state == 'reg'}
<p>You are already registered for OwlBoard. If you've recently logged out or updated, you may need to refresh this page to register as old data could still be stored in your browser.</p> <p>
You are already registered for OwlBoard. If you've recently logged out or updated, you may need to refresh this page to register as old data could still be stored in your
browser.
</p>
{/if} {/if}
<Nav /> <Nav />

View File

@ -2,15 +2,16 @@
// This should then enable the new /service-worker.js to be installed // This should then enable the new /service-worker.js to be installed
self.addEventListener('activate', function (e) { self.addEventListener('activate', function (e) {
console.log(`Unregistering service worker`) console.log(`Unregistering service worker`);
self.registration.unregister() self.registration
.unregister()
.then(function () { .then(function () {
return self.clients.matchAll(); return self.clients.matchAll();
}) })
.then(function (clients) { .then(function (clients) {
clients.forEach(client => { clients.forEach((client) => {
console.log(`Navigating ${client.url}`) console.log(`Navigating ${client.url}`);
client.navigate(client.url) client.navigate(client.url);
}) });
}); });
}); });