emancipate-vr/js/ItemManager.js

import * as THREE from 'three';
import { Player } from './Player';
import { Item } from './Item';
import { TextContent, ImageContent, VideoContent, AudioContent } from './Content';
import { GeometryUtils } from 'three/examples/jsm/Addons.js';
import { Line2 } from 'three/examples/jsm/lines/Line2.js';
import { LineMaterial } from 'three/examples/jsm/lines/LineMaterial.js';
import { LineGeometry } from 'three/examples/jsm/lines/LineGeometry.js';


export class ItemManager {
    constructor(filePath, preloadedObjects, dynamicGroups, scene, rapierWorld, player, interactableItems) {
        this.filePath = filePath;
        this.scene = scene;
        this.rapierWorld = rapierWorld;
        this.player = player,
        this.interactableItems = interactableItems;
        this.audioListener = player.audioListener;
        this.itemData = new Map();
        this.loadDistance = 250;
        this.unloadDistance = 300;
        this.linkLines = new Map();
        this.drawnLinks = new Set();
        this.preloadedObjects = preloadedObjects;
        this.dynamicGroups = dynamicGroups;
        this.groupCentres = new Map();
        this.groupCenterLinks = new Map();
        this.interGroupLinks = new Map();
        this._init();
    }

    async _init() {
        await this._loadFromJSON();
    }

    async _loadFromJSON() {
        try {
            const resp = await fetch(this.filePath);
            if (!resp.ok) {
               throw new Error(`HTTP error! status: ${response.status}`);
            }

            const data = await resp.json();
            await this._processItemData(data.items);
            this._createGroupCenterLinks();

            if (data.groupLinks) this._createInterGroupLinks(data.groupLinks);

        } catch (error) {
            console.error("Could not load or process content JSON:", error);
        }
    }

    async _processItemData(itemArray) {
        for (const itemDef of itemArray) {
            let contentObject = null;

            const preloadedObject = this.preloadedObjects.get(itemDef.name);

            if (!preloadedObject) {
                console.warn(`Could not find a preloaded 3D object for item name: "${itemDef.name}"`);
                continue;
            }

            // Find the correct THREE.Group for this item
            const parentGroup = this.dynamicGroups.get(itemDef.groupId);
            if (!parentGroup) {
                console.warn(`Could not find a group for groupId: "${itemDef.groupId}"`);
                continue;
            }

            // Create content object based on contentType and file
            if (itemDef.contentType && itemDef.file) {
                switch (itemDef.contentType) {
                    case 'text':
                        // Fetch the text content from the specified file
                        try {
                            const textResponse = await fetch(itemDef.file);
                            if (!textResponse.ok) throw new Error(`Failed to fetch text: ${textResponse.status}`);
                            const textData = await textResponse.text();
                            contentObject = new TextContent(textData);
                        } catch (e) {
                            console.error(`Could not load text content for item "${itemDef.name}" from ${itemDef.file}`, e);
                        }
                        break;
                    case 'image':
                        contentObject = new ImageContent(itemDef.file);
                        break;
                    case 'video':
                        contentObject = new VideoContent(itemDef.file);
                        break;
                    case 'audio':
                        if (!this.audioListener) {
                            console.error("AudioListener not provided. Cannot create AudioContent.");
                            continue; // Skip this item
                        }
                        contentObject = new AudioContent(itemDef.file, this.audioListener);
                        break;
                    default:
                        console.warn(`Unknown content type: ${itemDef.contentType}`);
                        break;
                }
            }
            
            const newItem = new Item(
                this.rapierWorld,
                parentGroup,
                this.player,
                true,
                preloadedObject.position,
                1,
                itemDef.name,
                null,
                null,
                [], // spawnedObjects placeholder
                contentObject,
                preloadedObject
            );

            // Set item id and group id
            newItem.id = itemDef.id;
            newItem.groupId = parentGroup.name;

            // Set links
            if (itemDef.links) {
                newItem.links = itemDef.links;
            }

            // Item is already loaded from world glb, but this func creates collider etc.
            await newItem.loadModel();
            newItem.show();

            this.interactableItems.push(newItem);

            // Setting a key and value pair in the Map (id, item)
            this.itemData.set(itemDef.id, newItem);
        }
    }

    _createGroupCenterLinks() {
        this.itemData.forEach(item => {
            const groupCenter = this._getGroupCentre(item.groupId);
            if (!groupCenter) return;

            const material = new THREE.LineBasicMaterial({
                color: 0xFF0000,
                transparent: false,
                opacity: 1
            });

            const points = [groupCenter.clone(), item.spawnPosition.clone()];
            const geometry = new THREE.BufferGeometry().setFromPoints(points);
            
            const line = new THREE.Line(geometry, material);
            line.visible = false; // Initially hidden

            this.scene.add(line);

            // Store the line and the group it belongs to, keyed by the item's ID
            this.groupCenterLinks.set(item.id, { line, groupId: item.groupId });
        });
    }

    _createInterGroupLinks(groupLinks) {
        groupLinks.forEach(linkPair => {
            const [groupA_ID, groupB_ID] = linkPair;

            const centerA = this._getGroupCentre(groupA_ID);
            const centerB = this._getGroupCentre(groupB_ID);

            if (!centerA || !centerB) {
                console.warn(`Could not find centers for group link: ${groupA_ID} to ${groupB_ID}`);
                return;
            }

            const lineGeometry = new LineGeometry();
            lineGeometry.setPositions([
                centerA.x, centerA.y, centerA.z,
                centerB.x, centerB.y, centerB.z
            ]);

            const lineMaterial = new LineMaterial({
                color: 0xffa500, // Orange color for distinction
                linewidth: 2, // in pixels
                resolution: new THREE.Vector2(window.innerWidth, window.innerHeight),
                fog:true
            });

            const line = new Line2(lineGeometry, lineMaterial);
            this.scene.add(line);

            const linkKey = `${groupA_ID}-${groupB_ID}`;
            this.interGroupLinks.set(linkKey, { line, groupA_ID, groupB_ID });
        });
    }

    _getGroupCentre(groupId) {
        const group = this.dynamicGroups.get(groupId);
        if (!group) {
            console.warn(`Group with id ${groupId} not found`);
            return null;
        }

        const bbox = new THREE.Box3().setFromObject(group);
        const centre = new THREE.Vector3();
        bbox.getCenter(centre);

        return centre;
    }

    _updateGroupCentres() {
        this.dynamicGroups.forEach((group, groupId) => {
            const center = this._getGroupCentre(groupId);
            if (center) {
                let helper = this.groupCentres.get(groupId);
                if (!helper) {
                    helper = new THREE.AxesHelper(3); // The number defines the size of the helper
                    this.scene.add(helper);
                    this.groupCentres.set(groupId, helper);
                }
                helper.position.copy(center);
            }
        });
    }

    _updateGroupCenterLinks() {
        this.groupCenterLinks.forEach((linkData, itemId) => {
            const { line, groupId } = linkData;
            const item = this.itemData.get(itemId);
            
            if (item && item.isVisible) {
                const groupCenter = this._getGroupCentre(groupId);
                if (!groupCenter) return;

                line.visible = true;
                const positions = line.geometry.attributes.position;
                positions.setXYZ(0, groupCenter.x, groupCenter.y, groupCenter.z);
                positions.setXYZ(1, item.object.position.x, item.object.position.y, item.object.position.z);
                positions.needsUpdate = true;
            } else {
                line.visible = false;
            }
        });
    }

    _updateInterGroupLinks() {
        this.interGroupLinks.forEach(link => {
            const centerA = this._getGroupCentre(link.groupA_ID);
            const centerB = this._getGroupCentre(link.groupB_ID);

            if (centerA && centerB) {
                link.line.geometry.setPositions([
                    centerA.x, centerA.y, centerA.z,
                    centerB.x, centerB.y, centerB.z
                ]);
            }
        });
    }

    update() {
        const playerPosition = this.player.camera.position;
        this.itemData.forEach(item => {
            let distance;

            if (item.lastPosition === null) {
                const initPositon = item.spawnPosition;
                distance = initPositon.distanceTo(playerPosition);
            } else {
                distance = item.lastPosition.distanceTo(playerPosition);
            }

            // Check if item should be loaded
            if (distance < this.loadDistance && !item.isVisible) {
                item.show();
            } 
            // Check if item should be unloaded
            else if (distance > this.unloadDistance && item.isVisible) {
                item.hide();
            }
        });

        this._updateGroupCenterLinks();
        this._updateGroupCentres();
        this._updateInterGroupLinks();
    }

    // _createLinkLines() {
       
    //     this.itemData.forEach(item => {
    //         if (!item.links) return;

    //         item.links.forEach(linkedItemId => {
    //             // Goes through each connection; links = [0, 1, 2..]
    //             const linkedItem = this.itemData.get(linkedItemId);
    //             if (!linkedItem) return;

    //             if (item.groupId !== linkedItem.groupId) return;

    //             // Creates a key for the Set; a Set can only have unique values, so used for no overlap
    //             const key = [item.id, linkedItemId].sort().join('-');

    //             if (this.drawnLinks.has(key)) return;

    //             const material = new THREE.LineDashedMaterial({
    //                 color: 0xffa500,
    //                 dashSize: 10,
    //                 gapSize: 1
    //             });

    //             const sourcePos = item.spawnPosition.clone();
    //             const terminalPos = linkedItem.spawnPosition.clone();
    //             sourcePos.y = 1; terminalPos.y = 1;

    //             const points = [item.spawnPosition.clone(), linkedItem.spawnPosition.clone()];
    //             const geometry = new THREE.BufferGeometry().setFromPoints(points);
                
    //             const line = new THREE.Line(geometry, material);
    //             line.computeLineDistances(); 

    //             this.scene.add(line);

    //             // The Set is used as the key "0-1", then the item and the linkedItem are set as values in the Map?
    //             this.linkLines.set(key, { line, item1: item, item2: linkedItem });
    //             // Make sure it is not drawn again, adding the unique pair here
    //             this.drawnLinks.add(key);
    //         });
    //     });
    // }

    // _updateLinkLines() {
    //     this.linkLines.forEach(link => {
    //         const { line, item1, item2 } = link;

    //         // Only update/show the line if both items are loaded
    //         if ((item1.loadState === 'loaded' && item2.loadState === 'loaded') 
    //             && (item1.isVisible && item2.isVisible)) {
    //             line.visible = true;
    //             const positions = line.geometry.attributes.position;
    //             positions.setXYZ(0, item1.object.position.x, 1, item1.object.position.z);
    //             positions.setXYZ(1, item2.object.position.x, 1, item2.object.position.z);
    //             positions.needsUpdate = true;
    //         } else {
    //             line.visible = false;
    //         }
    //     });
    // }
}