Merge pull request 'staging' (#14) from staging into master

Reviewed-on: http://localhost:3000/zino/seatmapv2/pulls/14

client/src/css/seatmap.css

@@ -27,15 +27,9 @@ div.seatCharts-seat {
   border-radius: 0.2vw;
 }
 
-/* div.seatCharts-seat,
-div.seatCharts-seat.available {
-  border: 0.1rem solid #5c5c5c;
-} */
-
 div.seatCharts-seat.selected,
 div.seatCharts-seat.focused {
   border: 0.1vw solid black;
-  /* filter: brightness(2); */
 }
 
 div.seatCharts-seat.selected {
@@ -50,10 +44,6 @@ select#dropdownSeatmap {
   font-weight: bold;
 }
 
-/* #loftloader-wrapper .loader-inner {
-  top: 50%;
-} */
-
 ul.seatCharts-legendList {
   list-style: none;
   margin: 0;
@@ -145,12 +135,6 @@ select#dropdownLegend, select#dropdownSeatmap, .dropdownBuyerTypes {
   overflow: auto;
 }
 
-/* .cartItemCross {
-  text-align: right;
-  line-height: 0;
-  cursor: pointer;
-} */
-
 #modalCart-overlay .uabb-overlay {
   background: white;
 }
@@ -180,6 +164,49 @@ span.trimChar {
   font-size: 1vw;
 }
 
+#btnCloseModal {
+  cursor: pointer;
+}
+
+#htmlSeatmapInner {
+  height: 66vh;
+}
+
+#htmlSeatmapInner .fl-module-content, #htmlSeatmapInner .fl-html {
+  height: 100%;
+}
+
+#containerSeatmapInner {
+  border: 1px solid black;
+  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
+}
+
+#modalCart-overlay {
+  overflow-y: scroll;
+}
+
+#bottomHTML {
+  text-align: center;
+}
+
+#bottomHTML h6, #bottomHTML a {
+  color: #999;
+}
+
+#modalCartImportantNote {
+  margin: 0 0 20px 0;
+  display: none;
+}
+
+#modalCart-overlay .uabb-modal {
+  pointer-events: auto;
+  width: 100% !important;
+  height: 100%;
+  overflow-y: scroll;
+  top: 0 !important;
+  transform: none !important;
+}
+
 /**
  * ==============================================
  * Dot Pulse
@@ -259,48 +286,4 @@ span.trimChar {
   100% {
     box-shadow: 10014px 0 0 -5px #5c5c5c;
   }
-}
-
-#btnCloseModal {
-  cursor: pointer;
-}
-
-#htmlSeatmapInner {
-  /* background: grey; */
-  height: 66vh;
-}
-
-#htmlSeatmapInner .fl-module-content, #htmlSeatmapInner .fl-html {
-  height: 100%;
-}
-
-#containerSeatmapInner {
-  border: 1px solid black;
-  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
-}
-
-#modalCart-overlay {
-  overflow-y: scroll;
-}
-
-#bottomHTML {
-  text-align: center;
-}
-
-#bottomHTML h6, #bottomHTML a {
-  color: #999;
-}
-
-#modalCartImportantNote {
-  margin: 0 0 20px 0;
-  display: none;
-}
-
-#modalCart-overlay .uabb-modal {
-  pointer-events: auto;
-  width: 100% !important;
-  height: 100%;
-  overflow-y: scroll;
-  top: 0 !important;
-  transform: none !important;
 }

client/src/modules/cart.ts

@@ -85,7 +85,7 @@ export function generateCheckoutUrl(): string | undefined {
 }
 
 export function getPriceInEur(inPrice: string): string {
-    const price: number = parseInt(inPrice);
+    const price: number = parseFloat(inPrice);
     return new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(price);
 }
 

client/src/modules/cartButtons.ts

@@ -12,13 +12,7 @@ function createCartBtnText(): string {
 
 function createModalCartBtnText(): string {
     const numTickets: number = config.state.selectedSeatsArr.length;
-
     return `Summe (${numTickets} Plätze) ${config.state.priceOverallEur}`;
-
-    // if (config.state.priceOverall !== "")
-    //     return `Summe (${numTickets} Plätze) €${config.state.priceOverall}`;
-    // else
-    //     return `Summe (0 Plätze) €0,00`;
 }
 
 export function showHideBtnCartLoading(inSwitch: string): void {

client/src/modules/config.ts

@@ -39,5 +39,17 @@ export const config: I.Config = {
         panzoom: undefined,
         inVenueXML: undefined,
         seatmapXML: undefined,
-    }
+    },
+    fallbackColors: [
+        "#ae2fb7",
+        "#150021",
+        "#90af80",
+        "#7f261a",
+        "#040fdb",
+        "#5896dd",
+        "#47994d",
+        "#6937bf",
+        "#5b2d53",
+        "#4f4d28"
+    ]
 }

client/src/modules/legend.ts

@@ -36,8 +36,6 @@ export function dropdownLegendOnChange(inHTMLSelectElement: HTMLSelectElement, i
 
     changeDropdownLegendBGColor(inSelector, sectionID, className);
 
-    console.log(sectionID);
-
     if (sectionID === "all") {
         seatmap.find('unavailable').status('available');
     }

client/src/modules/ui.ts

@@ -96,10 +96,15 @@ export function generatePricescaleCSS(): string {
     const venueXML: I.VenueXML = config.state.inVenueXML!;
     const venuePricescalesArr: I.Pricescale2[] = venueXML.venue[0].pricescales[0].pricescale;
 
-    return venuePricescalesArr.map(arr => {
+    return venuePricescalesArr.map((arr, i) => {
         const ID: string = arr.id[0];
-        let color: string = `#${arr.color[0]} !important`;  // Update: Colors are always defined: fallback colors exist in system so every XML provides them
-        return `._${ID} { background-color: ${color}; }`;
+        const color: string = arr.color[0];
+
+        // Update: Colors are always defined: fallback colors exist in system so every XML provides them
+        // Update 2: Above is not true, since old PVO versions does NOT have default/fallback colors
+        const colorCSS:string = color ? `#${color} !important` : `${config.fallbackColors[i]} !important`; 
+    
+        return `._${ID} { background-color: ${colorCSS}; }`;   
     }).join("\r\n");
 }
 

client/src/types/types.d.ts

@@ -95,6 +95,7 @@ export interface Config {
     maxSelectedSeats: number;
     state: State;
     resources: Resources;
+    fallbackColors: string[];
 }
 
 export interface Resources {