Race Time Leaderboard In Horizon Worlds! (TS & Codeblocks)
Today we look at how to script a timer for a race leaderboard using both Codeblocks and Typescript. Where when the start trigger is entered we track the time entered, and when the end trigger is entered we calculate the time elapsed and record it to the player's Leaderboard. Download the script: https://drive.google.com/drive/u/1/folders/1Az7hsaAMWt2idZe9r_JYfmU1_IRz3htP
Turn A Trigger Off/On With A Trigger (Codeblocks & Typescript)
This is a good video to watch if you are in Codeblocks and want to see how something simple would look in Typescript: https://www.youtube.com/live/KwNjuLHrFLI Download the script files here: https://drive.google.com/drive/u/1/folders/1qwtRr__Bs2ZlAEDyAAWF_xn_YdI-yK4kUsing HorizonHub.info to move from Codeblocks to Typescript
Hi Creators! For those moving from CodeBlocks and VR Creation into the new world of TypeScript Desktop Creation, a common question is "How do I easily lift and shift all my existing CodeBlock algorithms and mechanics over to this new system?" Fortunately, the creator wafflecopters generously built a whole CodeBlock drafting system on the web. And it can import code from your existing horizon worlds! And, it can automatically convert it to TypeScript! Check it out at https://horizonhub.info Note: this is not a Meta sponsored or maintained website. You will need to create a new Horizon Hub specific account at the site, as it does not use your Meta account. It is a 3rd party creation entirely by wafflecopters. The conversion isn't perfect, but, due to the hours of effort wafflecopters put into the tooling, it does produce runnable typescript that mimics the CodeBlock behavior in almost all common use cases. It's a great place to start learning how the CodeBlocks you love manifest as TypeScript code. And it's a great way to get all those constants and equations you've refined in your CodeBlock code over to the new TypeScript way of doing things, without having to hand copy them out via your headset!To import from Horizon Worlds, you'll need to access your Meta Horizon creator portal page at https://horizon.meta.com/creator/worlds_all/. Make sure that works for you first. From the horizon hub editor window, choose File -> World -> Import from Horizon. That will bring you to an instructions page with detailed technical details on how to proceed. https://www.horizonhub.info/editor?importGraphQLDataBlob=fromClipboard Once you complete import, you should see your scripts in the horizon hub web editor! Click on Settings -> Non-Horizon Features -> Show TypeScript Equivalent to see the TypeScript on the far right side of the page! You can just copy and paste that into your TypeScript editor of choice (e.g. VSCode). The Horizon Hub also has a number of other useful guides in the Navigate menu. Head over to the Horizon Hub now! https://horizonhub.infoDebugging Features
Debugging Features Have you ever spent countless hours trying to identify why a mechanic doesn’t work only to realize that it was a small oversight on logic? In this post I’m going to outline some of the techniques I use when I try to identify the source of a code bug. Meta Horizon Worlds has a few features that allow us to troubleshoot and test the functionality of scripts. Some of them are straightforward, but others are not technically features made for debugging purposes, but I find them very useful when understanding the execution flow: Console logs: These are the standard console.log, console.warn, console.error in TypeScript, and the equivalent *debug print* under the Values tab in Code Blocks. With these APIs we can “print” messages to flag if a particular part of the script runs, or to preview the changes of a variable. When using console logs (or debug print) it is recommended to standardize the structure of the log messages. Sometimes these logs are generated very fast and from different scripts, so it’s important to know in what order they are being called and executed. In the Desktop Editor, you can see logs in the “Console” tab; in VR, you can find the logs in the Build Menu. Debug Console: This is a gizmo that you can place in your world to see the logs in preview and published mode. This feature helps to identify real time errors that never appear when creating the world. One of the things that I like to do is to make this gizmo part of a wearable or grabbable that I carry around in published mode, or make it appear when I press a button. This makes the Debug Console always available if something goes wrong. Pop-ups: This is one of the unintended debug features. If the logs are not too repetitive, I prefer to use pop-ups to know if a particular part of the code runs while previewing a mechanic. It shows right in front of me, this way I don’t have to lose attention to the experience to look away at the console log. This is also more applicable for VR playtesting. In Desktop Editor, you can see the Console log all the time while testing a game. NPC Gizmo: This is one of the most recent Meta Horizon Worlds features. It allows you to spawn a player avatar, generating the same events as a real player would: player enter/exit world, player enter/exit trigger, and so on. I like to use this gizmo when debugging multiplayer mechanics. Real testers are not always available, but the NPCs can be used as a placeholder visitor. Note that to test interactions with an NPC (grab, move, look…) does require TypeScript scripting. Text and Custom UI gizmos: These are another alternative to the Debug Console. You can personalize these display features to print the output of your logs. My favorite implementation of this was a CUI overlay that only appeared for the collaborators of a world after pressing a key. It’s like having special X-Rays to troubleshoot an experience. When something goes wrong, try to reduce the amount of logic that runs at once; and continue to iterate into smaller and smaller chunks of code to isolate the true cause of a bug. Last, always remember to remove or disable the console logs and test features once you are ready to publish your world!
