Feature/ibl credits

index.html

@@ -376,6 +376,8 @@ <h2 class="title is-spaced">Animation</h2>
                                 <h2 class="title">Model Credits</h2>
                                 <div class="modelCredit"><i>Copyright:</i><br/>{{ assetCopyright }}</div>
                                 <div class="modelCredit"><i>Generated by:</i><br/>{{ assetGenerator }}</div>
+                                <h2 class="title">Environment Credits</h2>
+                                <div class="modelCredit"><i>Copyright:</i><br/><p v-html="environmentLicense"></p></div>
                                 <h3 class="title">{{ xmp ? "XMP" : "" }}</h3>
                                 <json-to-ui-template v-bind:data="xmp" v-bind:isinner="false"></json-to-ui-template>
                             </div>

src/logic/uimodel.js

@@ -24,7 +24,7 @@ class UIModel
         this.environmentRotation = app.environmentRotationChanged.pipe();
         this.app.environments = environments;
         const selectedEnvironment = app.selectedEnvironmentChanged.pipe(
-            map(environmentName => this.app.environments[environmentName].hdr_path)
+            map(environmentName => this.app.environments[environmentName])
         );
         const initialEnvironment = "Cannon_Exterior";
         this.app.selectedEnvironment = initialEnvironment;
@@ -106,12 +106,40 @@ class UIModel
         );
 
         this.model = merge(dropdownGltfChanged, dropdownFlavourChanged, inputObservables.droppedGltf);
+
         this.hdr = merge(selectedEnvironment, this.addEnvironment, inputObservables.droppedHdr).pipe(
-            startWith(environments[initialEnvironment].hdr_path)
+            startWith(environments[initialEnvironment])
         );
 
+        this.hdr.subscribe(async hdr => {
+            if (hdr.license_path !== undefined) {
+                try {
+                    const response = await fetch(hdr.license_path);
+                    if (!response.ok) {
+                        throw new Error("License file not found");
+                    }
+                    let text = await response.text();
+                    const license = text.split("SPDX-License-Identifier: ")[1];
+                    console.log(license);
+                    text = text.replace("SPDX-FileCopyrightText: ", "");
+                    text = text.replace(/SPDX-License-Identifier:(.)*/g, `, <a href="${hdr.hdr_path}">Source</a>, License: `);
+                    text += `<a href="${hdr.base_path}/LICENSES/${license}.txt">${license}</a>`;
+                    text = "(c) " + text;
+                    text = text.replaceAll("\n","");
+                    text = text.replaceAll(" ,", ",");
+                    this.app.environmentLicense = text;
+                } catch (error) {
+                    this.app.environmentLicense = "N/A";
+                }
+
+            } else {
+                this.app.environmentLicense = "N/A";
+            }
+        });
+
         merge(this.addEnvironment, inputObservables.droppedHdr)
-            .subscribe(hdrPath => {
+            .subscribe(hdr => {
+                const hdrPath = hdr.hdr_path;
                 this.app.environments[hdrPath.name] = {
                     title: hdrPath.name,
                     hdr_path: hdrPath,
@@ -280,7 +308,8 @@ const getInputObservables = (inputElement, app) => {
     observables.droppedHdr = droppedFiles.pipe(
         map(files => files.find(([path]) => path.endsWith(".hdr"))),
         filter(file => file !== undefined),
-        pluck("1")
+        pluck("1"),
+        map(file => ({hdr_path: file}))
     );
 
     const mouseMove = fromEvent(document, 'mousemove');

src/main.js

@@ -420,8 +420,8 @@ export default async () => {
     );
     listenForRedraw(uiModel.activeAnimations);
 
-    uiModel.hdr.subscribe((hdrFile) => {
-        resourceLoader.loadEnvironment(hdrFile).then((environment) => {
+    uiModel.hdr.subscribe((hdr) => {
+        resourceLoader.loadEnvironment(hdr.hdr_path).then((environment) => {
             state.environment = environment;
             // We need to wait until the environment is loaded to redraw
             redraw = true;

src/model_path_provider.js

@@ -68,7 +68,9 @@ export function fillEnvironmentWithPaths(environmentNames, environmentsBasePath)
             index: index,
             title: title,
             hdr_path: environmentsBasePath + name + ".hdr",
-            jpg_path: environmentsBasePath + name + ".jpg"
+            jpg_path: environmentsBasePath + name + ".jpg",
+            license_path: environmentsBasePath + name + ".hdr.license",
+            base_path: environmentsBasePath
         };
     });
     return environmentNames;

src/ui/ui.js

@@ -324,7 +324,7 @@ const appCreated = createApp({
         },
         onFileChange(e) {
             const file = e.target.files[0];
-            this.addEnvironmentChanged.next(file);
+            this.addEnvironmentChanged.next({hdr_path: file});
         },
 
         toggleUI() {