Skip to content

Commit

Permalink
Better looking log system with print-to-pdf features
Browse files Browse the repository at this point in the history
  • Loading branch information
@qkmaxware
qkmaxware committed May 14, 2021
1 parent cbe3e40 commit 97ab91f
Show file tree
Hide file tree
Showing 8 changed files with 126 additions and 65 deletions.
133 changes: 75 additions & 58 deletions TrekSharp.AdventureTools/Pages/ManageLogs.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,80 +2,97 @@
@page "/manage/logs"
@using System.Globalization

<PrintNotification></PrintNotification>

<div class="no-print">
<LCARS Title="LOG ENTRIES">
@if (compose) {
<div class="w3-col" style="width: 50px">
<button class="w3-button w3-blue w3-margin-right w3-margin-bottom" style="border-radius: 0;" @onclick=@(() => compose = false)>&lt;</button>
</div>
<Quicklog OnLogRecorded=@(() => { compose = false; StateHasChanged(); })></Quicklog>
} else {
@if (viewedEntry == null) {
<div class="w3-padding">
<div class="w3-row">
<div class="w3-half w3-border-right" style="max-height: 50vh; overflow: auto;">
<input type="text" placeholder="search logs" @bind="filter" style="width: 100%;"/>
<div class="w3-row">
<button class="w3-col s6 w3-button @(!flaggedOnly ? "w3-blue" : "w3-black")" style="border-radius: 0; font-size: medium;" @onclick=@(() => flaggedOnly = false)>All</button>
<button class="w3-col s6 w3-button @(flaggedOnly ? "w3-blue" : "w3-black")" style="border-radius: 0; font-size: medium;" @onclick=@(() => flaggedOnly = true)>Flagged</button>
</div>
<div class="w3-right-align">
<button class="w3-margin" @onclick=@(() => compose = true)>Record Log</button>
<button class="w3-col s6 w3-button @(!flaggedOnly ? "w3-text-blue" : "w3-text-white")" style="background-color: inherit; border-radius: 0; font-size: medium;" @onclick=@(() => flaggedOnly = false)>All</button>
<button class="w3-col s6 w3-button @(flaggedOnly ? "w3-text-blue" : "w3-text-white")" style="background-color: inherit; border-radius: 0; font-size: medium;" @onclick=@(() => flaggedOnly = true)>Flagged</button>
</div>
@{
string stardate = null;
foreach (var entry in Data.Logs.Enumerate()) {
var capture = entry;
if((!flaggedOnly || capture.Flagged) && (string.IsNullOrEmpty(filter) || CultureInfo.InvariantCulture.CompareInfo.IndexOf(capture.Content, filter, CompareOptions.IgnoreCase) >=0 )) {
var printed_stardate = capture.Stardate.ToString("0.0#");
if (printed_stardate != stardate) {
stardate = printed_stardate;
<div class="w3-grey w3-padding">
<b>@stardate</b>
</div>
}
<div class="w3-margin-left w3-padding w3-display-container">
<button class="no-lcars w3-button w3-block w3-left-align" style="background-color:inherit;" @onclick=@(() => viewedEntry = capture)>
@capture.ExcerptString()
</button>
<div class="w3-display-topright">
<button class="w3-button no-lcars" style="background-color:transparent;" @onclick=@(() => capture.Flagged = !capture.Flagged)>
@if (capture.Flagged) {
<img src="assets/flag_filled.png" width=12 height=12>
} else {
<img src="assets/flag_empty.png" width=12 height=12>
}
</button>
<button class="w3-button no-lcars w3-text-red" style="background-color:transparent;" @onclick=confirmDeleteCurrent>
&times;
</button>
</div>
</div>
}
}
}
</div>
@if (Data.Logs.Count > 0) {
<hr>
}
<ul class="w3-ul w3-hoverable">
@foreach (var entry in Data.Logs.Enumerate()) {
if((!flaggedOnly || entry.Flagged) && (string.IsNullOrEmpty(filter) || CultureInfo.InvariantCulture.CompareInfo.IndexOf(entry.Content, filter, CompareOptions.IgnoreCase) >=0 )) {
var capture = entry;
<li class="w3-row">
<div class="w3-col" style="width: 72px;">
<button class="w3-black" @onclick=@(() => capture.Flagged = !capture.Flagged)>
@if (capture.Flagged) {
<img src="assets/flag_filled.png" width=24 height=24>
} else {
<img src="assets/flag_empty.png" width=24 height=24>
}
</button>
</div>
<div class="w3-rest" @onclick=@(() => viewedEntry = capture)>
<b>@capture.Stardate</b>
<p>
@capture.ExcerptString()
</p>
<div class="w3-half">
<div class="w3-right-align primary">
<button class="no-lcars w3-button" @onclick=@(() => compose = true)>Compose Entry</button>
</div>
@if (viewedEntry != null) {
<div class="w3-padding">
<h4 class="w3-right-align">Stardate @viewedEntry.Stardate.ToString("0.0#")</h4>
<div style="white-space: pre-line;">
@viewedEntry.Content
</div>
</li>
</div>
}
}
</ul>
</div>
</div>
}
</LCARS>
</div>
<div class="print">
@{
string stardate = null;
int count = 0;
foreach (var entry in Data.Logs.Enumerate()) {
var capture = entry;var printed_stardate = capture.Stardate.ToString("0.0#");
if (printed_stardate != stardate) {
count = 1;
stardate = printed_stardate;
<h3>Personal Log Stardate @stardate</h3>
} else {
<div class="w3-row">
<div class="w3-col" style="width: 50px">
<button class="w3-button w3-blue w3-margin-right" style="border-radius: 0;" @onclick=@(() => viewedEntry = null)>&lt;</button>
</div>
<div class="w3-rest">
<div class="w3-half w3-xlarge">
STARDATE @viewedEntry.Stardate
</div>
<div class="w3-half w3-right-align w3-padding">
<button class="w3-black" @onclick=@(() => viewedEntry.Flagged = !viewedEntry.Flagged)>
@if (viewedEntry.Flagged) {
<img src="assets/flag_filled.png" width=24 height=24>
} else {
<img src="assets/flag_empty.png" width=24 height=24>
}
</button>
<button class="w3-red" @onclick=confirmDeleteCurrent>
&times;
</button>
</div>
</div>
</div>
<div style="white-space: pre-wrap;">
@viewedEntry.Content
</div>
count++;
}
<div class="w3-margin-left w3-display-container">
@if (count > 1) {
<h4>supplemental</h4>
}
<div class="w3-padding">
@capture.Content
</div>
</div>
}
</LCARS>
}
</div>

<ConfirmationDialog @ref="confirm">
</ConfirmationDialog>
Expand Down
3 changes: 3 additions & 0 deletions TrekSharp.AdventureTools/Shared/AssetAddList.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,9 @@
<p class="w3-center">
OR
</p>
<div class="w3-container">
Upload a JSON file describing the item to add.
</div>
<div class="w3-padding">
<LocalFileInput Accept=".json" OnFileLoad=onFileLoaded></LocalFileInput>
</div>
Expand Down
10 changes: 10 additions & 0 deletions TrekSharp.AdventureTools/wwwroot/css/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,16 @@
padding: 8px 4px !important;
}

.notification {
position: fixed;
bottom: 12px;
right: 12px;
background-color: #404040;
border-radius: 6px;
padding: 24px;
z-index: 10;
}

@media (max-width:601px){
.navbar {
width: 100%;
Expand Down
33 changes: 31 additions & 2 deletions TrekSharp.AdventureTools/wwwroot/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,17 +24,46 @@
</head>

<body>
<div id="pwa-update-notification" class="notification w3-hide">
A new version is available <a id="pwa-update-refresh" href="" onclick="window.location.reload();" class="w3-text-blue">REFRESH</a> <a style="text-decoration: none;" href="" onclick="hidePwaUpdate(); return false;">&times;</a>
</div>
<app>
<div class="w3-center w3-padding w3-margin-top">
<div class="w3-large">Loading... Please Wait</div>
If this takes longer than a few seconds than an error might have occurred
</div>
<div id="blazor-error-ui" class="w3-center">
<a href="" class="reload">Reload</a>
<a href="" class="reload" onclick="window.location.reload();">Reload</a>
</div>
</app>
<script src="_framework/blazor.webassembly.js"></script>
<script>navigator.serviceWorker.register('service-worker.js');</script>
<script>
function showPwaUpdate() {
let note = document.getElementById("pwa-update-notification");
note.classList.remove("w3-hide");
note.classList.add("w3-show");
}
function hidePwaUpdate() {
let note = document.getElementById("pwa-update-notification");
note.classList.add("w3-hide");
note.classList.remove("w3-show");
}
navigator.serviceWorker.register('service-worker.js').then(reg => {
reg.addEventListener('updatefound', () => {
let newWorker = reg.installing;
newWorker.addEventListener('statechange', () => {
switch (newWorker.state) {
case "installed":
// If there is a new service worker
if (navigator.serviceWorker.controller) {
showPwaUpdate();
}
break;
}
});
});
});
</script>
<script src="js/helpers.js"></script>
<script>
// Allow components to scroll to top
Expand Down
7 changes: 7 additions & 0 deletions TrekSharp.AdventureTools/wwwroot/service-worker.published.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ self.importScripts('./service-worker-assets.js');
self.addEventListener('install', event => event.waitUntil(onInstall(event)));
self.addEventListener('activate', event => event.waitUntil(onActivate(event)));
self.addEventListener('fetch', event => event.respondWith(onFetch(event)));
self.addEventListener('message', event => onMessage(event));

const cacheNamePrefix = 'offline-cache-';
const cacheName = `${cacheNamePrefix}${self.assetsManifest.version}`;
Expand Down Expand Up @@ -46,3 +47,9 @@ async function onFetch(event) {

return cachedResponse || fetch(event.request);
}

function onMessage(event) {
if (event.data.action === 'skipWaiting') {
self.skipWaiting();
}
}
1 change: 0 additions & 1 deletion TrekSharp.AdventureTools/wwwroot/site.webmanifest
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
"short_name": "TrekSharp",
"description": "Fan-made tools for GMs and Players of Modiphius's Star Trek Adventures",
"start_url": "./",
"orientation": "portrait",
"icons": [
{
"src": "android-chrome-96x96.png",
Expand Down
2 changes: 0 additions & 2 deletions TrekSharp/src/Rulebooks/OperationsDivision.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -186,13 +186,11 @@ private OperationsDivision() {}
new Item { Name = "Engineering Tricorder", Size = ItemSize.OneHanded },
new Item { Name = "Micro-Optic Drill", Size = ItemSize.OneHanded },
new Item { Name = "Phaser Drill", Size = ItemSize.TwoHanded },
new Item { Name = "Engineering Tricorder", Size = ItemSize.OneHanded },
new Item { Name = "Field Destabilizer", Size = ItemSize.OneHanded },
new Item { Name = "Hyperspanner", Size = ItemSize.OneHanded },
new Item { Name = "Magnetic Probe", Size = ItemSize.OneHanded },
new Item { Name = "Sonic Driver", Size = ItemSize.OneHanded },
new Item { Name = "Transport Inhibitor", Size = ItemSize.OneHanded },
new Item { Name = "Chronometer", Size = ItemSize.OneHanded },
}
};

Expand Down
2 changes: 0 additions & 2 deletions TrekSharp/src/Rulebooks/ScienceDivision.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -254,10 +254,8 @@ private ScienceDivision() {}
new Item { Name = "Medical Tricorder", Size = ItemSize.OneHanded },
new Item { Name = "Blood Gas Infuser", Size = ItemSize.TwoHanded },
new Item { Name = "Bone Regenerator", Size = ItemSize.TwoHanded },
new Item { Name = "Blood Gas Infuser", Size = ItemSize.OneHanded },
new Item { Name = "Cardiostimulator", Size = ItemSize.OneHanded },
new Item { Name = "Cortical Scanner", Size = ItemSize.OneHanded },
new Item { Name = "Blood Gas Infuser", Size = ItemSize.OneHanded },
new Item { Name = "Cortical Stimulator", Size = ItemSize.OneHanded },
new Item { Name = "Neural Caliper", Size = ItemSize.OneHanded },
new Item { Name = "Neural Pad", Size = ItemSize.OneHanded },
Expand Down

0 comments on commit 97ab91f

Please sign in to comment.