From 1a9d0b55e4c096e79dd66c3b44f4b049fc737f96 Mon Sep 17 00:00:00 2001 From: Orion Gunning Date: Fri, 27 Sep 2024 17:53:15 +1000 Subject: [PATCH] fixed some bugs in character creation screen --- src/client/Controllers/AssetsController.ts | 22 +++++ src/client/Controllers/VatController.ts | 10 +- src/client/Screens/CharacterEditor.ts | 109 ++++++++++++--------- 3 files changed, 90 insertions(+), 51 deletions(-) diff --git a/src/client/Controllers/AssetsController.ts b/src/client/Controllers/AssetsController.ts index 95f5b8ac..df2cbf42 100644 --- a/src/client/Controllers/AssetsController.ts +++ b/src/client/Controllers/AssetsController.ts @@ -151,6 +151,28 @@ export class AssetsController { await this.prepareDynamicMeshes(); } + public async loadRaces() { + this.assetDatabase = []; + this.assetToPreload = []; + let races = this._game.loadGameData("races"); + if (races) { + for (let key in races) { + let el = races[key]; + this.assetDatabase.push({ name: "RACE_" + el.key, filename: "races/" + el.key + ".glb", extension: "glb", type: "mesh", instantiate: true }); + this.assetDatabase.push({ + name: "VAT_" + el.vat.key, + filename: "races/" + el.vat.key + ".glb", + extension: "glb", + type: "mesh", + instantiate: true, + }); + } + } + this.assetToPreload = this.assetDatabase; + console.log("loadRacesloadRacesloadRaces", this.assetToPreload); + await this.preloadAssets(); + } + public async fetchAsset(key) { // is asset is database let entry = this.assetDatabase.find((el: AssetEntry) => { diff --git a/src/client/Controllers/VatController.ts b/src/client/Controllers/VatController.ts index a787e928..924ff7f8 100644 --- a/src/client/Controllers/VatController.ts +++ b/src/client/Controllers/VatController.ts @@ -143,12 +143,12 @@ export class VatController { var result = element.id.substring(n + 1); if (!keepArray.includes(result)) { element.dispose(); - console.error("DISPOSING", element.id); + //console.error("DISPOSING", element.id); } else { //element.removeVerticesData(VertexBuffer.MatricesIndicesKind) //element.removeVerticesData(VertexBuffer.MatricesWeightsKind) - console.log(element.getVerticesDataKinds()); - console.log("KEEPING", element.id); + //console.log(element.getVerticesDataKinds()); + //console.log("KEEPING", element.id); } }); @@ -341,14 +341,14 @@ export class VatController { let rawMesh = this._game._loadedAssets["RACE_" + key].meshes[0].clone("embedded_vat_" + itemKey) as Mesh; // find raw mesh - console.log(rawMesh.id, rawMesh.getChildMeshes()); + //console.log(rawMesh.id, rawMesh.getChildMeshes()); rawMesh.getChildMeshes(false).forEach((element) => { var n = element.id.lastIndexOf("."); var result = element.id.substring(n + 1); if (!item.equippable.mesh.includes(result)) { element.dispose(); } else { - console.log("FOUND MESH", element.id); + //console.log("FOUND MESH", element.id); } }); diff --git a/src/client/Screens/CharacterEditor.ts b/src/client/Screens/CharacterEditor.ts index c70ccd17..6babbe83 100644 --- a/src/client/Screens/CharacterEditor.ts +++ b/src/client/Screens/CharacterEditor.ts @@ -50,14 +50,19 @@ export class CharacterEditor { private selected_face; private selected_variant; + private btnsFace: any = []; + private btnsColor: any = []; + + private randomPlayerName: string = ""; + private entityData; - private entity:any = { + private entity: any = { race: "humanoid", head: "Head_Base", material: 1, raceData: {}, - mesh: null - } + mesh: null, + }; constructor() { this._newState = State.NULL; @@ -199,10 +204,13 @@ export class CharacterEditor { this.selected_race = races[defaultRace]; this.selected_face = this.selected_race.vat.meshes.HEAD[0]; this.selected_variant = defaultVariant; - + + // + this.randomPlayerName = generateRandomPlayerName(); + // initialize assets controller this._game.initializeAssetController(); - await this._game._assetsCtrl.load(); + await this._game._assetsCtrl.loadRaces(); this._game._vatController = new VatController(this._game, []); await this._game._vatController.initialize(); @@ -233,7 +241,7 @@ export class CharacterEditor { element.dispose(); }); } - + this.entity.raceData = race; this.entityData = this._game._vatController._entityData.get(race.key); @@ -243,40 +251,36 @@ export class CharacterEditor { this.refreshUI(); this._scene.registerBeforeRender(() => { - // get current delta let delta = this._game.engine.getFps(); // process vat animations this._game._vatController.process(delta); - }); } - async loadCharacter(choice){ - - if(this.entity.mesh){ + async loadCharacter(choice) { + if (this.entity.mesh) { this.entity.mesh.dispose(); } this._game._vatController.prepareMesh(this.entity); + let animIndex = 4; let idle = { name: "IDLE", - index: 2, + index: animIndex, loop: true, speed: 1, - ranges: this.entityData.animationRanges[2], + ranges: this.entityData.animationRanges[animIndex], }; - setTimeout(()=>{ - + setTimeout(() => { let materialIndex = VatController.findMeshKey(this.entity.raceData, this.entity); const playerMesh = this.entityData.meshes.get(materialIndex).createInstance("CHARACTER"); this.entity.mesh = playerMesh; this.setAnimationParameters(playerMesh.instancedBuffers.bakedVertexAnimationSettingsInstanced, idle); - - }, 200) + }, 400); } disposeUI() { @@ -347,31 +351,9 @@ export class CharacterEditor { } } - sectionDescription() { - const section3Title = new TextBlock("section3Title", "Class Description"); - section3Title.width = 0.8; - section3Title.height = "60px"; - section3Title.color = "white"; - section3Title.horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_CENTER; - section3Title.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP; - section3Title.fontWeight = "bold"; - this.rightStackPanel.addControl(section3Title); - - const section3Description = new TextBlock("section3Description", this.selected_race.description); - section3Description.width = 0.8; - section3Description.height = "100px"; - section3Description.color = "white"; - section3Description.horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_CENTER; - section3Description.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP; - section3Description.fontSize = "16px"; - section3Description.textWrapping = TextWrapping.WordWrap; - section3Description.resizeToFit = true; - this.rightStackPanel.addControl(section3Description); - } - sectionFaces() { let selectedChoices = this.selected_race.vat.meshes.HEAD; - + const sectionTitle = new TextBlock("sectionTitle", "Choose Face"); sectionTitle.width = 0.8; sectionTitle.height = "40px"; @@ -407,6 +389,8 @@ export class CharacterEditor { btnChoice.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP; chatStackPanel.addControl(btnChoice); + this.btnsFace.push(btnChoice); + if (this.entity.head === faceKey) { btnChoice.background = "green"; } @@ -414,15 +398,16 @@ export class CharacterEditor { btnChoice.onPointerDownObservable.add(() => { this.entity.head = faceKey; this.loadCharacter(this.selected_race); - this.refreshUI(); + this.resetButtons(this.btnsFace); + btnChoice.background = "green"; }); }); } sectionVariant() { let selectedChoices = this.selected_race.materials; - - const sectionTitle = new TextBlock("sectionTitle", "Choose Face"); + + const sectionTitle = new TextBlock("sectionTitle", "Choose Color"); sectionTitle.width = 0.8; sectionTitle.height = "40px"; sectionTitle.color = "white"; @@ -446,7 +431,7 @@ export class CharacterEditor { chatScrollViewer.addControl(chatStackPanel); selectedChoices.forEach((mat, index) => { - const btnChoice = Button.CreateSimpleButton("btnChoice_"+index, mat.material); + const btnChoice = Button.CreateSimpleButton("btnChoice_" + index, mat.material); btnChoice.top = "0px"; btnChoice.width = 1; btnChoice.height = "30px"; @@ -457,6 +442,8 @@ export class CharacterEditor { btnChoice.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP; chatStackPanel.addControl(btnChoice); + this.btnsColor.push(btnChoice); + if (this.entity.material === index) { btnChoice.background = "green"; } @@ -464,11 +451,18 @@ export class CharacterEditor { btnChoice.onPointerDownObservable.add(() => { this.entity.material = index; this.loadCharacter(this.selected_race); - this.refreshUI(); + this.resetButtons(this.btnsColor); + btnChoice.background = "green"; }); }); } + resetButtons(btns) { + btns.forEach((btnChoice) => { + btnChoice.background = "gray"; + }); + } + loadCenterPanel() { //////////////////////////////////////////////// // center columm @@ -488,7 +482,7 @@ export class CharacterEditor { usernameInput.width = "200px"; usernameInput.height = "30px;"; usernameInput.color = "#FFF"; - usernameInput.text = generateRandomPlayerName(); + usernameInput.text = this.randomPlayerName; usernameInput.placeholderText = "Enter username"; usernameInput.horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_CENTER; usernameInput.verticalAlignment = Control.VERTICAL_ALIGNMENT_BOTTOM; @@ -542,6 +536,29 @@ export class CharacterEditor { vec.set(from, to - 1, 0, delta); // skip one frame to avoid weird artifacts } + /* + sectionDescription() { + const section3Title = new TextBlock("section3Title", "Class Description"); + section3Title.width = 0.8; + section3Title.height = "60px"; + section3Title.color = "white"; + section3Title.horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_CENTER; + section3Title.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP; + section3Title.fontWeight = "bold"; + this.rightStackPanel.addControl(section3Title); + + const section3Description = new TextBlock("section3Description", this.selected_race.description); + section3Description.width = 0.8; + section3Description.height = "100px"; + section3Description.color = "white"; + section3Description.horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_CENTER; + section3Description.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP; + section3Description.fontSize = "16px"; + section3Description.textWrapping = TextWrapping.WordWrap; + section3Description.resizeToFit = true; + this.rightStackPanel.addControl(section3Description); + }*/ + /////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////////