Skip to main content

JSON to HTML, Spawning Objects, and Graphics

A major task I worked on this week for the Beta presentation was a function to convert the JSON I created with all the furniture parts information into HTML entities that could be added to the scene when "spawned". This took around 6hrs and I learned that JavaScript does not take well to retrieving property names containing dashes in in JSON. This led to issues with trying to directly convert from using the property names stored in JSON with the associated values, since the properties needed dashes to work as an A-Frame entity in HTML.

I also initially had some challenges with querying the JSON objects since the data for each furniture piece is contained in the furniture object, therefore the query must account for multiple layers of arrays. However, the object spawning now works as tested in the Warehouse environment by clicking on specific boxes (which have yet to be labeled). I will be adding the other box spawners once the furniture parts 3D models are ready to be imported.

This week I also worked on improving the index.html page (see screenshot below) since it was originally just the Living Room environment with two clickable cubes, one to go to each respective scene. This took around 2hrs to create the images and implement the clicking functionality leading to the different pages.


After the coronavirus precautions began, I became a bit preoccupied with some other things but I was still able to finish the aforementioned tasks for this sprint. With the school closed down for all non-essential operations, we have some difficulties with renting a VR headset to test our game prototype with. This unexpected limitation may inevitably lead to a change in our scope.

Comments

Popular posts from this blog

[FINAL] - Where to find our game

Hello future builders, we're 3 programmer-artists that make up the Seismic Octopus team: Mitchell Koch - lead programmer, game tester, researcher  Priscilla Lo - project manager, sound design, lead 2D artist, programmer, documentation  Maxime Vincent - lead 3D artist, lighting designer, game tester We finished this course in May 2020 with a final release of Build-a-Furniture available on GitHub: https://github.com/Areizza/Build-a-Furniture Although this semester was full of hardships and unprecedented times near the end, we got through it together and are proud to present our simple web-VR game. Check it out and let us know what you think! :)

Catalogue, Sound Effects, JSON for Instructions

This week I updated the image for the catalogue and added it to the Living Room environment as an image plane (~2hrs). I am currently adding smaller clickable planes on top of it to represent the different furniture options to choose to build. A screenshot of this can be seen below. I also looked for some sound effects to use for user feedback (~2hrs) when pieces are combined together correctly, incorrectly, pieces are dropped, etc. These sound files have been added to the shared drive and will be implemented in the code in the next few days. Some example sounds can be listened to at the following links: https://freesound.org/people/NenadSimic/sounds/150879/ https://freesound.org/people/grunz/sounds/109662/ https://freesound.org/people/GabrielAraujo/sounds/242501/ https://freesound.org/people/kirbydx/sounds/175409/  I also worked on adding JSON for the builder.js and finder.js files to store the required information for the instructions (~1hr). An example o...

Building the Shelf and Chairs

With the final submission looming closer, most of my effort was directed at replacing some hard-coded game-play functionality with dynamic data from the Builder and Finder systems (~3 hours), assisting my team with issues they encountered (~2-3 hours), and getting the shelf and chair ready to be built by the players (~8 hours). The Builder and Finder systems still had a few hard-coded values from the Beta build of the project that were specific to constructing the table, so I worked on replacing those with the data that is contained in the instructions arrays that Priscilla and Maxime created this week.  I was initially have problems accessing this array before I discovered that JavaScript arrays can be accessed by string, which simplified it a lot.  Below is an example of the before and after of this process. // Before socket . on ( 'setFurn' , function ( data ) { this . current = data . id ; // Where data.id was always "table" this . step = ...