reworked config to dynamically adjust to staging or master config value (2nd version aftert 1st lost)

client/src/inject.ts

@@ -5,7 +5,6 @@ import Utils from './modules/utils';
 import * as Communication from "./modules/communication";
 import * as Parser from './modules/parser';
 import * as UI from "./modules/ui";
-import { config } from "./modules/config";
 import * as BookingBtn from "./modules/bookingButton";
 import * as Parent from "./modules/parent";
 
@@ -31,7 +30,7 @@ window.addEventListener('load', () => {
 
     // Inject parent CSS
     // Parent = trxstate 20
-    Utils.inject(config.urlCSSParentStaging, "css", "body");
+    Parent.injectResources();
 
     // Start message handler to be able to receive messages from child
     Communication.listenToMessages(messageHandler);

client/src/modules/child.ts

@@ -94,3 +94,13 @@ export function sendCheckoutResponse(inE: any) {
 
     config.state.cartChanged = false;
 }
+
+export function injectResources(): void {
+    const branch: I.TypeConfigBranch = config.branch;
+    const resources = config.resources[branch];
+
+    Utils.inject(resources.JSC, "js", "head");
+    Utils.inject(resources.CSSJSC, "css", "body");
+    Utils.inject(resources.CSSChild, "css", "body");
+    Utils.inject(resources.CSSjQueryUI, "css", "body");
+}

client/src/modules/config.ts

@@ -1,22 +1,29 @@
 import * as I from "../types/types";
 
 export const config: I.Config = {
+    childHasVenueXML: false,
     debug: true,
     branch: "staging",
     version: "0.0.1",
-    urlSeatmapStaging: "https://staging.tickets.zinomedia.de",
-    urlSeatmapMaster: "https://tickets.zinomedia.de",
-    urlCSSChildMaster: "https://tickets.zinomedia.de/dist/styleChild.css",
-    urlCSSChildStaging: "https://staging.tickets.zinomedia.de/dist/styleChild.css",
-    urlCSSParentMaster: "https://tickets.zinomedia.de/dist/styleParent.css",
-    urlCSSParentStaging: "https://staging.tickets.zinomedia.de/dist/styleParent.css",
-    urlJSCStaging: "https://staging.tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.min.js",
-    urlJSCMaster: "https://tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.min.js",
-    urlCSSJSCStaging: "https://staging.tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.css",
-    urlCSSJSCMaster: "https://tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.css",
-    urlCSSjQueryUI: "https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css",
-    childHasVenueXML: false,
     maxSelectedSeats: 10,
+    resources: {
+        master: {
+            seatmap: "https://tickets.zinomedia.de",
+            JSC: "https://tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.min.js",
+            CSSChild: "https://tickets.zinomedia.de/dist/styleChild.css",
+            CSSJSC: "https://tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.css",
+            CSSParent: "https://tickets.zinomedia.de/dist/styleParent.css",
+            CSSjQueryUI: "https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"
+        },
+        staging: {
+            seatmap: "https://staging.tickets.zinomedia.de",
+            JSC: "https://staging.tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.min.js",
+            CSSChild: "https://staging.tickets.zinomedia.de/dist/styleChild.css",
+            CSSJSC: "https://staging.tickets.zinomedia.de/libs/jQuery-Seat-Charts/jquery.seat-charts.css",
+            CSSParent: "https://staging.tickets.zinomedia.de/dist/styleParent.css",
+            CSSjQueryUI: "https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"
+        }
+    },
     state: {
         priceOverall: "",
         cartChanged: false,

client/src/modules/parent.ts

@@ -69,4 +69,11 @@ export function clickCheckout(inE: any) {
     const data: I.Message = JSON.parse(inE.data);
     const inUrl: string = data.message.url;
     window.location.href = inUrl;
+}
+
+export function injectResources(): void {
+    const branch: I.TypeConfigBranch = config.branch;
+    const resources = config.resources[branch];
+
+    Utils.inject(resources.CSSParent, "css", "body");
 }

client/src/modules/ui.ts

@@ -4,6 +4,7 @@ import { config } from "./config";
 import * as Events from "./events";
 import * as Panzoom from "./panzoom";
 import * as CartButtons from "./cartButtons";
+import Utils from "./utils";
 
 export function setOptionSelect(inSeatmapListing: I.Seatmap[], inId: string): void {
     const seatmapDropdown: HTMLElement | null = document.getElementById(inId);
@@ -29,7 +30,7 @@ export function setEventInfo(inEventInfo: I.EventInfo): void {
 
 export function createDialog(): void {
     const iframeHTML: string = "<iframe id='iframeSeatmap' scrolling='no' frameborder='0' marginwidth='0' marginheight='0' allowfullscreen width='100%' />";
-    const src: string = config.branch === "staging" ? config.urlSeatmapStaging : config.urlSeatmapMaster;
+    const src: string = Utils.getConfigValue("seatmap");
 
     jQuery("#dialogSeatmap").append(
         jQuery(iframeHTML)

client/src/modules/utils.ts

@@ -1,4 +1,5 @@
 import * as I from "../types/types";
+import { config } from "./config";
 
 export default class Utils {
 
@@ -98,4 +99,10 @@ export default class Utils {
         if (process.env["NODE_ENV"] === "development")
             console.log(inMessage);
     }
+
+    static getConfigValue(inProperty: I.TypeConfigResourcesProperty): string {
+        const branch: I.TypeConfigBranch = config.branch;
+        const resources = config.resources[branch];
+        return resources[inProperty];
+    }
 }

client/src/seatmap.ts

@@ -13,10 +13,7 @@ import * as UI from "./modules/ui";
 window.addEventListener('load', () => {
     // Inject JSC (jQuery Seat Charts)
     // Inject CSS for JSC, child and jQuery dialog
-    Utils.inject(config.urlJSCStaging, "js", "head");
-    Utils.inject(config.urlCSSJSCStaging, "css", "body");
-    Utils.inject(config.urlCSSChildStaging, "css", "body");
-    Utils.inject(config.urlCSSjQueryUI, "css", "body");
+    Child.injectResources();
 
     // Start message handler to be able to receive messages from parent
     Communication.listenToMessages(messageHandler);

client/src/types/types.d.ts

@@ -83,24 +83,27 @@ export interface InputsWithValue {
 
 export interface Config {
     debug: boolean;
-    branch: string;
+    branch: "staging" | "master";
     version: string;
-    urlSeatmapStaging: string;
-    urlSeatmapMaster: string;
-    urlCSSChildStaging: string;
-    urlCSSChildMaster: string;
-    urlJSCStaging: string;
-    urlJSCMaster: string;
-    urlCSSJSCStaging: string;
-    urlCSSJSCMaster: string;
-    urlCSSParentStaging: string;
-    urlCSSParentMaster: string;
     childHasVenueXML: boolean;
-    urlCSSjQueryUI: string;
     maxSelectedSeats: number;
     state: State;
+    resources: Resources;
 }
 
+export interface Resources {
+    "staging": ResourcesURL;
+    "master": ResourcesURL;
+}
+
+export interface ResourcesURL {
+    seatmap: string;
+    JSC: string;
+    CSSChild: string;    
+    CSSJSC: string;
+    CSSParent: string;
+    CSSjQueryUI: string;
+}
 
 export interface Message {
     message: any | VenueXML,
@@ -428,4 +431,6 @@ export interface TrimPos {
 export type TypeBuyerType = (string | undefined)[][] | undefined;
 export type TypeBuyerTypeArr = (string | undefined)[];
 export type TypeWaitForElementSwitch = "selector" | "seatmap";
-export type TypeInjectScript = HTMLLinkElement | HTMLScriptElement | HTMLStyleElement;
+export type TypeInjectScript = HTMLLinkElement | HTMLScriptElement | HTMLStyleElement;
+export type TypeConfigBranch = "staging" | "master";
+export type TypeConfigResourcesProperty = keyof ResourcesURL;