diff --git a/src/components/InteractiveObjects/InteractiveObject.js b/src/components/InteractiveObjects/InteractiveObject.js index bdc74e3..40f8606 100644 --- a/src/components/InteractiveObjects/InteractiveObject.js +++ b/src/components/InteractiveObjects/InteractiveObject.js @@ -12,6 +12,7 @@ import { PuzzleGame2 } from "./PuzzleGame2"; // import { Game3 } from "./games/Game3"; import { PuzzleGame4 } from "./PuzzleGame4"; import { ClassicPuzzle } from "./ClassicPuzzle"; +import { PairMatchingGame } from "./PairMatchingGame"; // import { Game5 } from "./games/Game5"; // import { Game6 } from "./games/Game6"; import { MazeQuizGame } from "./MazeQuizGame/MazeQuizGame"; @@ -22,7 +23,7 @@ import { GameEngine } from "@/lib/GameEngine"; const InteractiveObjectsImports = { GenericObject, CharacterObject, TextObject, ImageObject, GltfObject, VideoPlayer, Particles, SceneSwitcher, - PuzzleGame1, PuzzleGame2, PuzzleGame4, MazeQuizGame, ClassicPuzzle + PuzzleGame1, PuzzleGame2, PuzzleGame4, MazeQuizGame, ClassicPuzzle, PairMatchingGame }; class InteractiveObject extends EventManager{ @@ -50,6 +51,7 @@ class InteractiveObject extends EventManager{ case 'PuzzleGame2': case 'MazeQuizGame': case 'ClassicPuzzle': + case 'PairMatchingGame': case 'Particles': case 'SceneSwitcher': this.io = await new InteractiveObjectsImports[obj.type](engine, obj); @@ -161,6 +163,8 @@ const InteractiveObjectTypes = [ id: 'MazeQuizGame', name: 'Maze Quiz Game' },{ id: 'ClassicPuzzle', name: 'Classic Puzzle Game' + },{ + id: 'PairMatchingGame', name: 'Pair Matching Game' },{ id: 'VideoPlayer', name: 'Video Player' },{ diff --git a/src/components/InteractiveObjects/PairMatchingGame.js b/src/components/InteractiveObjects/PairMatchingGame.js new file mode 100644 index 0000000..c8798c2 --- /dev/null +++ b/src/components/InteractiveObjects/PairMatchingGame.js @@ -0,0 +1,75 @@ +import { BoxGeometry, Mesh, MeshStandardMaterial, Group } from 'three'; +import { centerOrigin } from '@/lib/MeshUtils'; +import { EventManager } from '@/lib/EventManager'; +import Utils from '@/lib/Utils'; + +class PairMatchingGame extends EventManager { + emits = ['finish'] + constructor(engine, data) { + super(); + return new Promise(async (resolve, reject)=>{ + let container = new Group(); + let c = data.c, orderArray = Array.from({length:c}, (_, i)=>i); + let o = [ Utils.shuffleArray(orderArray), Utils.shuffleArray(orderArray) ] + const aq = engine.motionQueue; + let dx = 3, dy = 1.2; + + let bm = new BoxGeometry(1, 1, 1); + + let material = new MeshStandardMaterial({ + map: await engine.loadTexture(data.$go.asset.name), + // roughness:1, metalness:0, + // normalMap: await engine.loadTexture('NormalMap.png', '/static/textures/'), + }); + //material.map.encoding = sRGBEncoding; + + for (let i = 0; i < c; i++) { + let b = [], uv = [], p = []; + for (let xi = 0; xi < 2; xi++){ + b[xi] = bm.clone(); + uv[xi] = b[xi].getAttribute('uv'); + let s = [xi/2, i / c]; + for (let i = 0; i < 6; i++) { + //top left + uv[xi].array[8 * i] = s[0]; + uv[xi].array[8 * i + 1] = s[1] + 1 / c; + //top right + uv[xi].array[8 * i + 2] = s[0] + 1 / 2; + uv[xi].array[8 * i + 3] = s[1] + 1 / c; + //bottom left + uv[xi].array[8 * i + 4] = s[0]; + uv[xi].array[8 * i + 5] = s[1]; + //bottom right + uv[xi].array[8 * i + 6] = s[0] + 1 / 2; + uv[xi].array[8 * i + 7] = s[1]; + } + let mesh = new Mesh(b[xi], material); + mesh.position.set(xi * dx, o[xi][i] * dy, 0); + container.add(mesh); + } + } + + var check = () => { + + }; + + let clickFn = (i) => { + + }; + + container.children.forEach(c => { + engine.clickable.add(c, clickFn); + }); + + this.update = () => { + + }; + + this.object = centerOrigin(container); + + resolve(this); + }) + } +} + +export { PairMatchingGame } \ No newline at end of file diff --git a/src/components/InteractiveObjects/PairMatchingGame.vue b/src/components/InteractiveObjects/PairMatchingGame.vue new file mode 100644 index 0000000..08cc725 --- /dev/null +++ b/src/components/InteractiveObjects/PairMatchingGame.vue @@ -0,0 +1,36 @@ + + + \ No newline at end of file diff --git a/src/components/SceneDesigner/GameObject.vue b/src/components/SceneDesigner/GameObject.vue index d06e32a..c6ade95 100644 --- a/src/components/SceneDesigner/GameObject.vue +++ b/src/components/SceneDesigner/GameObject.vue @@ -51,6 +51,7 @@ import PuzzleGame1 from '../InteractiveObjects/PuzzleGame1.vue'; import PuzzleGame2 from '../InteractiveObjects/PuzzleGame2.vue'; import MazeQuizGame from '../InteractiveObjects/MazeQuizGame/MazeQuizGame.vue'; import ClassicPuzzle from '../InteractiveObjects/ClassicPuzzle.vue'; +import PairMatchingGame from '../InteractiveObjects/PairMatchingGame.vue'; import Particles from '../InteractiveObjects/Particles.vue'; import GenericObject from '../InteractiveObjects/GenericObject.vue'; import CharacterObject from '../InteractiveObjects/CharacterObject.vue'; @@ -61,7 +62,7 @@ import { InteractiveObjectTypes } from '../InteractiveObjects/InteractiveObject' const components = { SvgIcon, OffsetLine, GenericObject, CharacterObject, VideoPlayer, SceneSwitcher, - PuzzleGame1, PuzzleGame2, MazeQuizGame, Particles, ClassicPuzzle + PuzzleGame1, PuzzleGame2, MazeQuizGame, Particles, ClassicPuzzle, PairMatchingGame }; export default {