chore(release): 0.2.14

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 737014839035050a69e89778e9b96e5ca6696cf9..69685ca74422fe6074236d0781cf83ca9bcab441 100644 (file)
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 

+### [0.2.14](https://git.xangelo.ca/?p=risinglegends.git;a=commitdiff;h=v0.2.14;hp=v0.2.13;ds=sidebyside) (2023-08-21)
+
+
+### Features
+
+* display travel progress d66fcf8
+

 ### [0.2.13](https://git.xangelo.ca/?p=risinglegends.git;a=commitdiff;h=v0.2.13;hp=v0.2.12;ds=sidebyside) (2023-08-21)
 
 
 ### [0.2.13](https://git.xangelo.ca/?p=risinglegends.git;a=commitdiff;h=v0.2.13;hp=v0.2.12;ds=sidebyside) (2023-08-21)
 
 

diff --git a/package-lock.json b/package-lock.json
index ec5739500127313dec1fbc74ce70651b057bdebe..88e09fe9bd9578fb74863c1de172c63d3f737223 100644 (file)
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "rising-legends",
 {
   "name": "rising-legends",

-  "version": "0.2.13",
+  "version": "0.2.14",

   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "rising-legends",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "rising-legends",

-      "version": "0.2.13",
+      "version": "0.2.14",

       "dependencies": {
         "@honeycombio/opentelemetry-node": "^0.4.0",
         "@opentelemetry/auto-instrumentations-node": "^0.37.0",
       "dependencies": {
         "@honeycombio/opentelemetry-node": "^0.4.0",
         "@opentelemetry/auto-instrumentations-node": "^0.37.0",

diff --git a/package.json b/package.json
index 4ea1eba8ee5a7267f8e51fd7590af26453db3118..cfc0057c6fa8da59cc92feb39aac73e3fb7a0cc2 100644 (file)
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "rising-legends",
   "private": true,
 {
   "name": "rising-legends",
   "private": true,

-  "version": "0.2.13",
+  "version": "0.2.14",

   "scripts": {
     "up": "npx prisma migrate dev --name \"init\"",
     "start": "pm2 start dist/server/api.js",
   "scripts": {
     "up": "npx prisma migrate dev --name \"init\"",
     "start": "pm2 start dist/server/api.js",

diff --git a/public/assets/css/game.css b/public/assets/css/game.css
index 4060899f36c8779d646649f0e12aba787a262e95..7afe6295627ce058ac4c73e848c825882b788092 100644 (file)
--- a/public/assets/css/game.css
+++ b/public/assets/css/game.css
@@ -486,6 +486,9 @@ h3 {
   gap: 1rem;
   margin-bottom: 1rem;
 }
   gap: 1rem;
   margin-bottom: 1rem;
 }

+.travel-distance {
+  margin-bottom: 1rem;
+}

 
 
 #explore .shop-inventory-listing  {
 
 
 #explore .shop-inventory-listing  {

diff --git a/src/server/views/components/progress-bar.ts b/src/server/views/components/progress-bar.ts
new file mode 100644 (file)
index 0000000..7d7677d
--- /dev/null
+++ b/src/server/views/components/progress-bar.ts
@@ -0,0 +1,14 @@
+export interface ProgressBarOptions {
+  startingColor: string;
+  endingColor: string;
+}
+
+export function ProgressBar(current: number, max: number, id: string, opts: ProgressBarOptions) {
+  let percent = 0;
+  if(max > 0) {
+    percent = Math.floor((current / max) * 100);
+  }
+
+  return `<div class="progress-bar" id="${id}" style="background: linear-gradient(to right, ${opts.startingColor}, ${opts.endingColor} ${percent}%, transparent ${percent}%, transparent)"
+title="${percent}% - ${current}/${max}">${current}/${max} - ${percent}%</div>`;
+}

diff --git a/src/server/views/travel.ts b/src/server/views/travel.ts
index 9aff00eea77a0aefafdc89be0ab83b03787a7aa2..f1775f0ab09efe0ed6aca2419735c9be1b6cc59c 100644 (file)
--- a/src/server/views/travel.ts
+++ b/src/server/views/travel.ts
@@ -1,4 +1,5 @@
 import { TravelDTO } from "../../shared/map";
 import { TravelDTO } from "../../shared/map";

+import { ProgressBar } from './components/progress-bar';

 
 export function travelButton(blockTime: number): string {
   return `<button id="keep-walking" hx-post="/travel/step" class="${blockTime ? 'disabled': ''}" data-block="${blockTime}" ${blockTime ? 'disabled': ''}>Keep Walking</button>`;
 
 export function travelButton(blockTime: number): string {
   return `<button id="keep-walking" hx-post="/travel/step" class="${blockTime ? 'disabled': ''}" data-block="${blockTime}" ${blockTime ? 'disabled': ''}>Keep Walking</button>`;


@@ -11,7 +12,15 @@ export function renderTravel(data: TravelDTO): string {
 
   let html = `<section id="explore" class="tab active" hx-swap-oob="true" style="background-image: url('/assets/img/map/${data.closestTown}.jpeg')">
 
 
   let html = `<section id="explore" class="tab active" hx-swap-oob="true" style="background-image: url('/assets/img/map/${data.closestTown}.jpeg')">
 

-<div id="travelling" class="city-details">`;
+<div id="travelling" class="city-details">
+  <div class="travel-distance">
+    <p>Travelling from ${data.travelPlan.source_city_name} to ${data.travelPlan.destination_city_name}</p>
+    ${ProgressBar(data.travelPlan.current_position, data.travelPlan.total_distance, 'travel-plan', {
+      startingColor: '#d9975a',
+      endingColor: '#bb724c'
+    })}
+  </div>
+`;

   html += '<div id="travelling-actions">';
   html += travelButton(blockTime);
   if(data.things.length) {
   html += '<div id="travelling-actions">';
   html += travelButton(blockTime);
   if(data.things.length) {