diff --git a/.gitignore b/.gitignore index b169933..a952697 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,7 @@ -public -./public -./public/* +# ignore the public folder at the root directory +/public/ +# ignore for macs .DS_Store +# for debugging locally +/output.txt/ +/err.txt/ diff --git a/all-versions-smoo.sh b/all-versions-smoo.sh new file mode 100755 index 0000000..33edab3 --- /dev/null +++ b/all-versions-smoo.sh @@ -0,0 +1,71 @@ +#!/bin/bash + +# Set the base directory for versions +versions_dir="./v-saved/all-saved" + +latest_v="v0.6.4" + +echo "hi0" + +# delete /main/ in v-saved setup for now. +main_version_dir="$versions_dir/main" +rm -rf $main_version_dir + +echo "hi1" + +# setup to run all of `smoo.sh`es for each sub-directory: +# -- for each folder in v, run smoo.sh and pass in the proper +# versioning info 'vX.Y.Z' s.t. they go to the right public +# folder + +# Navigate to the version directory +# cd "$versions_dir" + +# Loop through each version subdirectory and execute smoo.sh +# Retrieve list of directories and store in an array +directories=($(find "$versions_dir" -maxdepth 1 -mindepth 1 -type d -exec basename {} \;)) + +# Echo directories to check what's captured +echo "Directories in $versions_dir:" +printf "%s\n" "${directories[@]}" + +# Example of processing each directory +for dir in "${directories[@]}"; do + version=${dir%/} # Strip trailing slash to get the version name + + echo "Processing version $version..." + + # Change to the version directory + # cd "$version" + + echo "pwd:" $(pwd) + echo "smoo.sh is:" "$versions_dir/$version/smoo.sh" + + # Check if smoo.sh exists and is executable + if [[ -x "$versions_dir/$version/smoo.sh" ]]; then + # Execute smoo.sh with the version as a parameter + $versions_dir/$version/smoo.sh + else + echo "Error: smoo.sh is not executable or found" + fi + + # Go back to the version directory + # cd .. +done + +# Return to the original directory +# cd .. + +# run /main/ in v-saved setup now. +rm -rf $main_version_dir +mkdir $main_version_dir +echo "removed and recreated: $main_version_dir" +# copy everything except the folders .github, public, and v-saved +# to the /main/ section in v-saved/all +rsync -av --exclude='err.txt' --exclude='output.txt' --exclude='.github/' --exclude='.git' --exclude='public/' --exclude='v-saved/' ./ $main_version_dir +echo "copied current main documentation to: $main_version_dir" + +# cd "$main_version_dir" +echo "pwd:" $(pwd) +./$main_version_dir/smoo.sh "main" +# cd - diff --git a/err.txt b/err.txt new file mode 100644 index 0000000..e69de29 diff --git a/output.txt b/output.txt new file mode 100644 index 0000000..5ab421f --- /dev/null +++ b/output.txt @@ -0,0 +1,358 @@ +removed and recreated: v-saved/all-saved/main +sending incremental file list +./ +.DS_Store +.gitignore +.markdownlint.yaml +README.md +action-build.sh +all-versions-smoo.sh +anchorlinks.lua +colgroups.lua +smoo.sh +source/ +source/.DS_Store +source/_template.html +source/index.md +source/_disabled/ +source/_disabled/03Javascript API.md +source/_disabled/mr-textarea.md +source/_disabled/mr-textfield.md +source/attributes/ +source/attributes/data-camera.md +source/attributes/data-comp-anchor.md +source/attributes/data-comp-animation.md +source/attributes/data-comp-audio.md +source/attributes/data-debug.md +source/attributes/data-lighting.md +source/attributes/data-occlusion.md +source/attributes/data-orbital.md +source/attributes/data-position.md +source/attributes/data-preserve-drawing-buffer.md +source/attributes/data-rotation.md +source/attributes/data-stats.md +source/docs/ +source/docs/.DS_Store +source/docs/mr-a.md +source/docs/mr-app.md +source/docs/mr-button.md +source/docs/mr-div.md +source/docs/mr-entity.md +source/docs/mr-img.md +source/docs/mr-light.md +source/docs/mr-model.md +source/docs/mr-panel.md +source/docs/mr-skybox.md +source/docs/mr-stats.md +source/docs/mr-text.md +source/docs/mr-video.md +source/docs/mr-volume.md +source/ecs/ +source/ecs/01What is it.md +source/ecs/02How We Use It.md +source/events/ +source/events/interaction-events.md +source/events/mr-events.md +source/js-api-extras/ +source/js-api-extras/000Refractor.md +source/js-api-extras/001Water.md +source/js-api-utils/ +source/js-api-utils/000HTML.md +source/js-api-utils/001XR.md +source/js-api-utils/002JS.md +source/js-api-utils/003Display.md +source/js-api-utils/004Notify.md +source/js-api-utils/005Material.md +source/js-api-utils/006Color.md +source/js-api-utils/007String.md +source/js-api-utils/008Math.md +source/js-api-utils/009CSS.md +source/js-api-utils/010Physics.md +source/js-api-utils/011Model.md +source/js-api-utils/012App.md +source/js-api-utils/013Geometry.md +source/js-api/ +source/js-api/000MRElement.md +source/js-api/001MRSystem.md +source/js-api/002MRApp.md +source/js-api/003MRUser.md +source/js-api/004MRHand.md +source/js-api/005BoundaryVisibilitySystem.md +source/js-api/006InstancingSystem.md +source/js-api/007AudioSystem.md +source/js-api/008SkyBoxSystem.md +source/js-api/009PhysicsSystem.md +source/js-api/010MaskingSystem.md +source/js-api/011ClippingSystem.md +source/js-api/012GeometryStyleSystem.md +source/js-api/013MaterialStyleSystem.md +source/js-api/014TextSystem.md +source/js-api/015LayoutSystem.md +source/js-api/016AnimationSystem.md +source/js-api/017ControlSystem.md +source/js-api/018StatsSystem.md +source/js-api/019PanelSystem.md +source/js-api/020AnchorSystem.md +source/js-api/021MREntity.md +source/js-api/022MRVolumeEntity.md +source/js-api/023MRTextAreaEntity.md +source/js-api/024MRLightEntity.md +source/js-api/025MRTextEntity.md +source/js-api/026MRDivEntity.md +source/js-api/027MRModelEntity.md +source/js-api/028MRImageEntity.md +source/js-api/029MRStatsEntity.md +source/js-api/030MRVideoEntity.md +source/js-api/031MRMediaEntity.md +source/js-api/032MRSkyBoxEntity.md +source/js-api/033MRButtonEntity.md +source/js-api/034MRTextInputEntity.md +source/js-api/035MRTextFieldEntity.md +source/js-api/036MRHyperlinkEntity.md +source/js-api/037MRPanelEntity.md +source/js-api/038MRPlane.md +source/js-api/039MRClippingGeometry.md +source/js-api/040global.md +source/js-api/041MRPlaneManager.md +source/pages/ +source/pages/.DS_Store +source/pages/01Welcome.md +source/pages/03Debugging.md +source/pages/04Contribute.md +source/pages/05Create.md +source/static/ +source/static/.DS_Store +source/static/favicon.svg +source/static/inline-repl.js +source/static/link.svg +source/static/mrjs-logo.svg +source/static/opengraph.jpg +source/static/style.css +source/static/ace/ +source/static/ace/ace.js +source/static/ace/ext-language_tools.js +source/static/ace/mode-css.js +source/static/ace/mode-html.js +source/static/ace/mode-javascript.js +source/static/ace/theme-chrome.js +source/static/ace/theme-dracula.js +source/static/ace/worker-css.js +source/static/ace/worker-html.js +source/static/ace/worker-javascript.js +source/static/ace/unused/ +source/static/ace/unused/theme-solarized_light.js +source/static/ace/unused/theme-xcode.js +source/static/dist/ +source/static/dist/57cf7fc5ff4d6dfc74e4.module.wasm +source/static/dist/mr.js +source/static/dist/vendors-node_modules_dimforge_rapier3d_rapier_js.mr.js +source/static/dist/assets/ +source/static/dist/assets/.DS_Store +source/static/dist/assets/models/ +source/static/dist/assets/models/.DS_Store +source/static/dist/assets/textures/ +source/static/dist/assets/textures/.DS_Store +source/static/sample/ +source/static/sample/bowtie.glb +source/static/sample/humpback.jpg +source/static/sample/koi.glb +source/static/sample/logo.glb +source/static/sample/logo.stl +source/static/sample/video.mp4 + +sent 19,873,722 bytes received 2,819 bytes 39,753,082.00 bytes/sec +total size is 19,858,359 speedup is 1.00 +copied current main documentation to: v-saved/all-saved/main + + +RUNNING MAIN ACTION + + +๐Ÿงน Cleaned up /public/v/main/ folder +๐Ÿ“ฆ๏ธ Copied /v-saved/all-saved/main/source/static/ assets folder +๐Ÿ”Ž Extracted metadata for Welcome +๐Ÿ”Ž Extracted metadata for Debugging +๐Ÿ”Ž Extracted metadata for Contribute +๐Ÿ”Ž Extracted metadata for Create +๐Ÿ”Ž Extracted metadata for What is it +๐Ÿ”Ž Extracted metadata for How We Use It +๐Ÿ”Ž Extracted metadata for mr-a +๐Ÿ”Ž Extracted metadata for mr-app +๐Ÿ”Ž Extracted metadata for mr-button +๐Ÿ”Ž Extracted metadata for mr-div +๐Ÿ”Ž Extracted metadata for mr-entity +๐Ÿ”Ž Extracted metadata for mr-img +๐Ÿ”Ž Extracted metadata for mr-light +๐Ÿ”Ž Extracted metadata for mr-model +๐Ÿ”Ž Extracted metadata for mr-panel +๐Ÿ”Ž Extracted metadata for mr-skybox +๐Ÿ”Ž Extracted metadata for mr-stats +๐Ÿ”Ž Extracted metadata for mr-text +๐Ÿ”Ž Extracted metadata for mr-video +๐Ÿ”Ž Extracted metadata for mr-volume +๐Ÿ”Ž Extracted metadata for interaction-events +๐Ÿ”Ž Extracted metadata for mr-events +๐Ÿ”Ž Extracted metadata for data-camera +๐Ÿ”Ž Extracted metadata for data-comp-anchor +๐Ÿ”Ž Extracted metadata for data-comp-animation +๐Ÿ”Ž Extracted metadata for data-comp-audio +๐Ÿ”Ž Extracted metadata for data-debug +๐Ÿ”Ž Extracted metadata for data-lighting +๐Ÿ”Ž Extracted metadata for data-occlusion +๐Ÿ”Ž Extracted metadata for data-orbital +๐Ÿ”Ž Extracted metadata for data-position +๐Ÿ”Ž Extracted metadata for data-preserve-drawing-buffer +๐Ÿ”Ž Extracted metadata for data-rotation +๐Ÿ”Ž Extracted metadata for data-stats +๐Ÿ”Ž Extracted metadata for MRElement +๐Ÿ”Ž Extracted metadata for MRSystem +๐Ÿ”Ž Extracted metadata for MRApp +๐Ÿ”Ž Extracted metadata for MRUser +๐Ÿ”Ž Extracted metadata for MRHand +๐Ÿ”Ž Extracted metadata for BoundaryVisibilitySystem +๐Ÿ”Ž Extracted metadata for InstancingSystem +๐Ÿ”Ž Extracted metadata for AudioSystem +๐Ÿ”Ž Extracted metadata for SkyBoxSystem +๐Ÿ”Ž Extracted metadata for PhysicsSystem +๐Ÿ”Ž Extracted metadata for MaskingSystem +๐Ÿ”Ž Extracted metadata for ClippingSystem +๐Ÿ”Ž Extracted metadata for GeometryStyleSystem +๐Ÿ”Ž Extracted metadata for MaterialStyleSystem +๐Ÿ”Ž Extracted metadata for TextSystem +๐Ÿ”Ž Extracted metadata for LayoutSystem +๐Ÿ”Ž Extracted metadata for AnimationSystem +๐Ÿ”Ž Extracted metadata for ControlSystem +๐Ÿ”Ž Extracted metadata for StatsSystem +๐Ÿ”Ž Extracted metadata for PanelSystem +๐Ÿ”Ž Extracted metadata for AnchorSystem +๐Ÿ”Ž Extracted metadata for MREntity +๐Ÿ”Ž Extracted metadata for MRVolumeEntity +๐Ÿ”Ž Extracted metadata for MRTextAreaEntity +๐Ÿ”Ž Extracted metadata for MRLightEntity +๐Ÿ”Ž Extracted metadata for MRTextEntity +๐Ÿ”Ž Extracted metadata for MRDivEntity +๐Ÿ”Ž Extracted metadata for MRModelEntity +๐Ÿ”Ž Extracted metadata for MRImageEntity +๐Ÿ”Ž Extracted metadata for MRStatsEntity +๐Ÿ”Ž Extracted metadata for MRVideoEntity +๐Ÿ”Ž Extracted metadata for MRMediaEntity +๐Ÿ”Ž Extracted metadata for MRSkyBoxEntity +๐Ÿ”Ž Extracted metadata for MRButtonEntity +๐Ÿ”Ž Extracted metadata for MRTextInputEntity +๐Ÿ”Ž Extracted metadata for MRTextFieldEntity +๐Ÿ”Ž Extracted metadata for MRHyperlinkEntity +๐Ÿ”Ž Extracted metadata for MRPanelEntity +๐Ÿ”Ž Extracted metadata for MRPlane +๐Ÿ”Ž Extracted metadata for MRClippingGeometry +๐Ÿ”Ž Extracted metadata for global +๐Ÿ”Ž Extracted metadata for MRPlaneManager +๐Ÿ”Ž Extracted metadata for Refractor +๐Ÿ”Ž Extracted metadata for Water +๐Ÿ”Ž Extracted metadata for HTML +๐Ÿ”Ž Extracted metadata for XR +๐Ÿ”Ž Extracted metadata for JS +๐Ÿ”Ž Extracted metadata for Display +๐Ÿ”Ž Extracted metadata for Notify +๐Ÿ”Ž Extracted metadata for Material +๐Ÿ”Ž Extracted metadata for Color +๐Ÿ”Ž Extracted metadata for String +๐Ÿ”Ž Extracted metadata for Math +๐Ÿ”Ž Extracted metadata for CSS +๐Ÿ”Ž Extracted metadata for Physics +๐Ÿ”Ž Extracted metadata for Model +๐Ÿ”Ž Extracted metadata for App +๐Ÿ”Ž Extracted metadata for Geometry +๐ŸŒŸ Generated page for Welcome +๐ŸŒŸ Generated page for Debugging +๐ŸŒŸ Generated page for Contribute +๐ŸŒŸ Generated page for Create +๐ŸŒŸ Generated page for What is it +๐ŸŒŸ Generated page for How We Use It +๐ŸŒŸ Generated page for mr-a +๐ŸŒŸ Generated page for mr-app +๐ŸŒŸ Generated page for mr-button +๐ŸŒŸ Generated page for mr-div +๐ŸŒŸ Generated page for mr-entity +๐ŸŒŸ Generated page for mr-img +๐ŸŒŸ Generated page for mr-light +๐ŸŒŸ Generated page for mr-model +๐ŸŒŸ Generated page for mr-panel +๐ŸŒŸ Generated page for mr-skybox +๐ŸŒŸ Generated page for mr-stats +๐ŸŒŸ Generated page for mr-text +๐ŸŒŸ Generated page for mr-video +๐ŸŒŸ Generated page for mr-volume +๐ŸŒŸ Generated page for interaction-events +๐ŸŒŸ Generated page for mr-events +๐ŸŒŸ Generated page for data-camera +๐ŸŒŸ Generated page for data-comp-anchor +๐ŸŒŸ Generated page for data-comp-animation +๐ŸŒŸ Generated page for data-comp-audio +๐ŸŒŸ Generated page for data-debug +๐ŸŒŸ Generated page for data-lighting +๐ŸŒŸ Generated page for data-occlusion +๐ŸŒŸ Generated page for data-orbital +๐ŸŒŸ Generated page for data-position +๐ŸŒŸ Generated page for data-preserve-drawing-buffer +๐ŸŒŸ Generated page for data-rotation +๐ŸŒŸ Generated page for data-stats +๐ŸŒŸ Generated page for MRElement +๐ŸŒŸ Generated page for MRSystem +๐ŸŒŸ Generated page for MRApp +๐ŸŒŸ Generated page for MRUser +๐ŸŒŸ Generated page for MRHand +๐ŸŒŸ Generated page for BoundaryVisibilitySystem +๐ŸŒŸ Generated page for InstancingSystem +๐ŸŒŸ Generated page for AudioSystem +๐ŸŒŸ Generated page for SkyBoxSystem +๐ŸŒŸ Generated page for PhysicsSystem +๐ŸŒŸ Generated page for MaskingSystem +๐ŸŒŸ Generated page for ClippingSystem +๐ŸŒŸ Generated page for GeometryStyleSystem +๐ŸŒŸ Generated page for MaterialStyleSystem +๐ŸŒŸ Generated page for TextSystem +๐ŸŒŸ Generated page for LayoutSystem +๐ŸŒŸ Generated page for AnimationSystem +๐ŸŒŸ Generated page for ControlSystem +๐ŸŒŸ Generated page for StatsSystem +๐ŸŒŸ Generated page for PanelSystem +๐ŸŒŸ Generated page for AnchorSystem +๐ŸŒŸ Generated page for MREntity +๐ŸŒŸ Generated page for MRVolumeEntity +๐ŸŒŸ Generated page for MRTextAreaEntity +๐ŸŒŸ Generated page for MRLightEntity +๐ŸŒŸ Generated page for MRTextEntity +๐ŸŒŸ Generated page for MRDivEntity +๐ŸŒŸ Generated page for MRModelEntity +๐ŸŒŸ Generated page for MRImageEntity +๐ŸŒŸ Generated page for MRStatsEntity +๐ŸŒŸ Generated page for MRVideoEntity +๐ŸŒŸ Generated page for MRMediaEntity +๐ŸŒŸ Generated page for MRSkyBoxEntity +๐ŸŒŸ Generated page for MRButtonEntity +๐ŸŒŸ Generated page for MRTextInputEntity +๐ŸŒŸ Generated page for MRTextFieldEntity +๐ŸŒŸ Generated page for MRHyperlinkEntity +๐ŸŒŸ Generated page for MRPanelEntity +๐ŸŒŸ Generated page for MRPlane +๐ŸŒŸ Generated page for MRClippingGeometry +๐ŸŒŸ Generated page for global +๐ŸŒŸ Generated page for MRPlaneManager +๐ŸŒŸ Generated page for Refractor +๐ŸŒŸ Generated page for Water +๐ŸŒŸ Generated page for HTML +๐ŸŒŸ Generated page for XR +๐ŸŒŸ Generated page for JS +๐ŸŒŸ Generated page for Display +๐ŸŒŸ Generated page for Notify +๐ŸŒŸ Generated page for Material +๐ŸŒŸ Generated page for Color +๐ŸŒŸ Generated page for String +๐ŸŒŸ Generated page for Math +๐ŸŒŸ Generated page for CSS +๐ŸŒŸ Generated page for Physics +๐ŸŒŸ Generated page for Model +๐ŸŒŸ Generated page for App +๐ŸŒŸ Generated page for Geometry +๐ŸŽ€ Website smooshed! + diff --git a/smoo.sh b/smoo.sh index 1f90bfe..ce31c1d 100755 --- a/smoo.sh +++ b/smoo.sh @@ -1,31 +1,64 @@ #!/bin/bash +version="main" + +echo "" +echo "" +echo "SETUP MAIN ACTION for : $version" +echo "" +echo "" + OLDIFS="$IFS" IFS=$'\n' if [ "$LOCAL" = "true" ]; then - base_url="http://localhost:8000" + base_url="http://localhost:8000/v/$version" else - base_url="https://docs.mrjs.io" + base_url="https://docs.mrjs.io/v/$version" fi github_base='https://github.com/Volumetrics-io/documentation/edit/main/source' site_name='MRjs' -templateDir='source' -templateHTML='source/_template.html' -outputDir='public' - -assetDir='source/static' -pagesDir='source/pages' -ecsDir='source/ecs' -docsDir='source/docs' -attributesDir='source/attributes' -eventsDir='source/events' -jsAPIDir='source/js-api' -jsAPIExtrasDir='source/js-api-extras' -jsAPIUtilsDir='source/js-api-utils' + +saved_version_dir="v-saved/all-saved/$version" +sourceDir="$saved_version_dir/source" +templateHTML="$sourceDir/_template.html" +outputDir="public/v/$version" + +echo "saved_version_dir:" $saved_version_dir +echo "sourceDir:" $sourceDir +echo "outputDir:" $outputDir + +assetDir="$sourceDir/static" +pagesDir="$sourceDir/pages" +ecsDir="$sourceDir/ecs" +docsDir="$sourceDir/docs" +attributesDir="$sourceDir/attributes" +eventsDir="$sourceDir/events" +jsAPIDir="$sourceDir/js-api" +jsAPIExtrasDir="$sourceDir/js-api-extras" +jsAPIUtilsDir="$sourceDir/js-api-utils" + +# copy items over to run easily based on linking + +if [ "$version" == "main" ]; then + # cleanout first + rm -rf $saved_version_dir + mkdir $saved_version_dir + echo "removed and recreated: $saved_version_dir" + # copy everything except the folders .github, public, and v-saved + # to the /main/ section in v-saved/all + rsync -av --exclude='err.txt' --exclude='output.txt' --exclude='.github/' --exclude='.git' --exclude='public/' --exclude='v-saved/' ./ $saved_version_dir + echo "copied current main documentation to: $saved_version_dir" +fi current_year=$(date +"%Y") +echo "" +echo "" +echo "RUNNING MAIN ACTION for : $version" +echo "" +echo "" + #run main action mkdir -p "$outputDir" rm -rf "${outputDir}"/* @@ -189,7 +222,7 @@ process_markdown "$jsAPIUtilsDir" "js-api-utils" "js-api-utils" # --metadata base-url="$base_url" \ # --metadata github-path="https://github.com/Volumetrics-io/mrjs/edit/main/README.md" \ -pandoc "${templateDir}/index.md" \ +pandoc "${sourceDir}/index.md" \ --template $templateHTML \ --metadata current-year="$current_year" \ --metadata site-name="$site_name" \ diff --git a/source/_template.html b/source/_template.html index 21c87d6..89b8395 100644 --- a/source/_template.html +++ b/source/_template.html @@ -9,7 +9,7 @@ $if(title-prefix)$$title-prefix$ โฌฅ $endif$$title$ - + @@ -33,18 +33,42 @@ - + - + - + - + + + + + + + +
+ + + + + +
+
+ $body$ + + +
+ +
+ + + + + + diff --git a/v-saved/all-saved/main/source/attributes/data-camera.md b/v-saved/all-saved/main/source/attributes/data-camera.md new file mode 100644 index 0000000..4617926 --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-camera.md @@ -0,0 +1,16 @@ +# data-camera + +```html + ... +``` + +Camera can be attached to an [`mr-app`](/doc/mr-app) using `data-camera`: + +### `data-camera` +Specifies the camera setup. + +- `mode`: type when viewing on a 2D screen. + - default: `orthographic` (default) + - options: `orthographic`, `perspective` +- `startPos`: the startingPosition of the camera/user in the 3D scene. + - default: `0 0 1` diff --git a/v-saved/all-saved/main/source/attributes/data-comp-anchor.md b/v-saved/all-saved/main/source/attributes/data-comp-anchor.md new file mode 100644 index 0000000..724eed4 --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-comp-anchor.md @@ -0,0 +1,41 @@ +# data-comp-anchor + +```html + +``` + +Anchoring is achieved using the anchoring component `data-comp-anchor` on any [`mr-entity`](/doc/mr-entity): + +## `type` + +There are currently three types of anchors: + +- `fixed`: Positions the anchored element directly in front of the user whenever an XR session is started. +- `floating`: Allows the user to place the anchored element where they choose, using a look/pinch gesture. The user can place it floating in their space or on the scene mesh. +- `plane`: Anchors the element to the nearest plane that matches the specified label or orientation. + +If no label or orientation is specified, the element will be anchored to the nearest plane. + +**Note**: each plane is limited to one anchor for simplicity. To anchor multiple entities to a single plane, group them under a parent entity and anchor the parent entity. + +# Plane anchor attributes + +These attributes are only relevant to plane anchors. + +## `orientation` (optional) + +This attribute is useful when you wish to anchor to a plane of any given orientation, regardless of label. + +Supported values: `horizontal`, `vertical` + +## `label` (optional) + +Use this to target a specific type of plane, such as a table or wall. + +Supported values: `wall`, `floor`, `ceiling`, `table` + +## `occlusion` + +By default, planes occlude virtual content behind them, use this flag to disable occlusion. + +Values: `true` (default), `false` diff --git a/v-saved/all-saved/main/source/attributes/data-comp-animation.md b/v-saved/all-saved/main/source/attributes/data-comp-animation.md new file mode 100644 index 0000000..ce6777e --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-comp-animation.md @@ -0,0 +1,45 @@ +# data-comp-animation + +```html + +``` + +Animation is achieved using the animation component, `data-comp-animation` on any [`mr-model`](/doc/mr-model): + +## `action` + +Handles the animation starting and stopping. + +Values: `play`, `pause`, `stop` + +## `clip` + +Handles if a specific clip will play or all animation clips for the mesh will play. + +Values: `1,2,3,...` + +> If not set, plays all animation clips in the mesh. Otherwise just plays the specified one. + +## `loop` + +Handles how the animation loops for the model file. If set to `true`/`false` ignores the value of `loopMode`, otherwise acts as a numerical looping count. + +Values: `true`, `false`, number >= 0 + +> if set to `true`/`false`, ignores the `loopMode` value + +## `loopMode` + +The format for how the looping should occur. Values are based on threejs defaults. + +Values: `once`, `repeat`, and `pingpong` + +> if set to `once`, ignores the `loop` value. + +## `clampWhenFinished` + +Freezes the animation state to the last frame when stop is called or any looping ends. + +Values: `true`, `false` + +> if not set, defaults to the threejs internals setup, which is `false` diff --git a/v-saved/all-saved/main/source/attributes/data-comp-audio.md b/v-saved/all-saved/main/source/attributes/data-comp-audio.md new file mode 100644 index 0000000..d9f2447 --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-comp-audio.md @@ -0,0 +1,29 @@ +# data-comp-audio + +```html + +``` + +Positional (aka Spatial) Audio can be attached using `data-comp-audio` to any [`mr-entity`](/doc/mr-entity): + +## `src` + +The path to the audio file. + +## `action` + +The current action state of the audio playback. + +Values: `play`, `pause`, `stop` (default) + +## `loop` + +Whether the audio should be looped. + +Values: `true`, `false` (default) + +## `distance` + +The distance at which the audio begins to dissipate. + +Values: meters, default: 1.0 diff --git a/v-saved/all-saved/main/source/attributes/data-debug.md b/v-saved/all-saved/main/source/attributes/data-debug.md new file mode 100644 index 0000000..834a841 --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-debug.md @@ -0,0 +1,58 @@ +# data-debug + +```html + ... +``` + +Debug state can be attached to an [`mr-app`](/doc/mr-app) using `data-debug`: + +### `data-debug` +Enables various debug features such as physics directional lines, some color changes to show certain features being used, and 3D toggling in website mode. + +Physics directional lines: +These are red/green/blue axes lines coming out of the origin (center position) of objects. They demonstrate the xyz directions associated with that object. + +Orbital Control 3D toggling: +> When the debug flag is enabled (``), you can press and hold the `=+` key on your keyboard to: +> +> 1. rotate the scene with left mouse drag +> 2. pan the scene with right mouse drag +> 3. zoom with the mouse wheel +> +> Try it out below! + + + + + + + Change color! + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + mr-button { + font-family: system-ui; + background-color: white; + padding: 8px 16px; + font-size: 150%; + border-radius: 20px; + } + + + function changeColor() { + let hue = Math.floor(Math.random() * 360); + let color = 'hsl(' + hue + ', 100%, 80%)'; + document.querySelector("#panel").style.backgroundColor = color; + } + changeColor(); + + diff --git a/v-saved/all-saved/main/source/attributes/data-lighting.md b/v-saved/all-saved/main/source/attributes/data-lighting.md new file mode 100644 index 0000000..66059cf --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-lighting.md @@ -0,0 +1,22 @@ +# data-lighting + +```html + ... +``` + +Lighting state can be attached to an [`mr-app`](/doc/mr-app) using `data-lighting`: + +### `data-lighting` +Specifies the global lighting conditions. + +- `enabled`: enables or disables global lighting is enabled + - default: `true` +- `shadows`: enables or disables shadows + - default: `true` + - _note: always disabled on mobile for performance reasons_ +- `color`: the color of the global lighting + - default: `#fff` +- `intensity`: how bright the lighting is + - default: `1` +- `radius`: the shadow radius + - default: `5` diff --git a/v-saved/all-saved/main/source/attributes/data-occlusion.md b/v-saved/all-saved/main/source/attributes/data-occlusion.md new file mode 100644 index 0000000..71f703f --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-occlusion.md @@ -0,0 +1,16 @@ +# data-occlusion + +```html + ... +``` + +Occlusion setup can be attached to an [`mr-app`](/doc/mr-app) using `data-occlusion`: + +### `data-occlusion` +This handles the mode for occlusion planes within fully immersed mode. + +- `enabled` +- `disabled` +- `spotlight` + - just where you're standing shows through + - helps with walking in different environments and a sense of rootedness. diff --git a/v-saved/all-saved/main/source/attributes/data-orbital.md b/v-saved/all-saved/main/source/attributes/data-orbital.md new file mode 100644 index 0000000..fb8f0ff --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-orbital.md @@ -0,0 +1,57 @@ +# data-orbital + +```html + ... +``` + +Orbital state can be attached to an [`mr-app`](/doc/mr-app) using `data-orbital`.: + +### `data-orbital` +Specifies the orbital setup. + +- `mode`: true/false + - default: `false` +- `targetPos`: the position that the orbital camera/user will rotate around in the 3D scene. + - default: `0 0 0` + +Enables just the use of orbital controls. Though this feature is already enabled as part of `debug=true`, we also allow a specific flag for it for the cases where you just want to look closer at something more easily without all the additional overhead of full debugging. + +It works without the requirement of the `=+` keypress (unlike the `debug=true` case). + +Note if both `orbital` and `debug` are set to `true`, the `orbital` will take priority, meaning you still wont have to use the `=+` keypress for it to work. The rest of `debug` will still work as expected. + +Orbital Control 3D toggling: +> +> 1. rotate the scene with left mouse drag +> 2. pan the scene with right mouse drag +> 3. zoom with the mouse wheel +> +> Try it out below! + + + + + + + + + + + + + + mr-panel { + background-color: LightSkyBlue; + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + #koi { + scale: 0.05; + z-index: 70; + } + + diff --git a/v-saved/all-saved/main/source/attributes/data-position.md b/v-saved/all-saved/main/source/attributes/data-position.md new file mode 100644 index 0000000..d6b8aa6 --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-position.md @@ -0,0 +1,14 @@ +# data-position + +```html + + +``` + +Position can be attached to an [`mr-entity`](/doc/mr-entity) using `data-position`, it has a specific 3D value: + +## `data-position` + +Sets the position of an entity in the 3D space, relative to its parent. + +Value: a string of 3 numbers in meters separated by a space. diff --git a/v-saved/all-saved/main/source/attributes/data-preserve-drawing-buffer.md b/v-saved/all-saved/main/source/attributes/data-preserve-drawing-buffer.md new file mode 100644 index 0000000..f4d61cf --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-preserve-drawing-buffer.md @@ -0,0 +1,50 @@ +# data-preserve-drawing-buffer + +```html + ... +``` + +Preserve-drawing-buffer state can be attached to an [`mr-app`](/doc/mr-app) using `data-preserve-drawing-buffer`: + +### `preserve-drawing-buffer` +This enables the common html use-case of 'right-click to save' a png file of what's on the screen. + +_Note: Most chromium-based browsers (chrome, duckduckgo, arc, etc...) have this feature by default making the use of this flag unnecessary_ + +Allowing this as a feature the user toggles manually, because it causes a performance hit and isnt a strong requirement by default for most people who are interacting. + + + + + + + Change color! + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + mr-button { + font-family: system-ui; + background-color: white; + padding: 8px 16px; + font-size: 150%; + border-radius: 20px; + } + + + function changeColor() { + let hue = Math.floor(Math.random() * 360); + let color = 'hsl(' + hue + ', 100%, 80%)'; + document.querySelector("#panel").style.backgroundColor = color; + } + changeColor(); + + diff --git a/v-saved/all-saved/main/source/attributes/data-rotation.md b/v-saved/all-saved/main/source/attributes/data-rotation.md new file mode 100644 index 0000000..06dc0ba --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-rotation.md @@ -0,0 +1,14 @@ +# data-rotation + +```html + + +``` + +Rotation can be attached to an [`mr-entity`](/doc/mr-entity) using `data-rotation`, it has a specific 3D value: + +## `data-rotation` + +Sets the rotation of an entity in the 3D space, relative to its parent. + +Value: a string of 3 numbers in degrees, separated by a space. diff --git a/v-saved/all-saved/main/source/attributes/data-stats.md b/v-saved/all-saved/main/source/attributes/data-stats.md new file mode 100644 index 0000000..655a2f1 --- /dev/null +++ b/v-saved/all-saved/main/source/attributes/data-stats.md @@ -0,0 +1,50 @@ +# data-stats + +```html + ... +``` + +Stats can be attached to an [`mr-app`](/doc/mr-app) using `data-stats`: + +### `data-stats` +Enables a visual of a stats counter in the top left corner. The stats counter can show a few different options, by default it shows 0. + +Note this is different than the stats that are enabled by use of the [``](/doc/mr-stats/) entity being directly added. + +This stats toggle is great for use on desktop; however, it can cause performance bottle-necks in headset. We recommend for you to use the `` tag for headset testing. + + + + + + + Change color! + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + mr-button { + font-family: system-ui; + background-color: white; + padding: 8px 16px; + font-size: 150%; + border-radius: 20px; + } + + + function changeColor() { + let hue = Math.floor(Math.random() * 360); + let color = 'hsl(' + hue + ', 100%, 80%)'; + document.querySelector("#panel").style.backgroundColor = color; + } + changeColor(); + + diff --git a/v-saved/all-saved/main/source/docs/mr-a.md b/v-saved/all-saved/main/source/docs/mr-a.md new file mode 100644 index 0000000..99e9395 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-a.md @@ -0,0 +1,83 @@ +# <mr-a> + +The ``embeds a hyperlink in the UI of an ``. + +## Example + + + + + + + This is a link + This is a big purple link + This is not a link + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + padding: 10vw; + gap: 10px; + width: 100vw; + height: 100vh; + border-radius: unset; + } + .big-link { + font-size: 150%; + color: rebeccaPurple; + } + + + +## Definition and Usage + +The `` tag has two required attribute: + +* `href`: the hyperlink destination + +## Image links + +Like it's HTML equivalent, `` can be used to wrap other elements, making them clickable links + + + + + + + + + + + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + mr-a { + height:100vh; + width:100vh; + } + mr-img { + max-width: 300px; + height:100%; + border-radius: 30px; + } + mr-img.hover { + border-radius: 20px; + } + + diff --git a/v-saved/all-saved/main/source/docs/mr-app.md b/v-saved/all-saved/main/source/docs/mr-app.md new file mode 100644 index 0000000..40110f9 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-app.md @@ -0,0 +1,77 @@ +# <mr-app> + +The `` component serves as the foundational building block of an application using MRjs. + +- It initializes the core functionalities like the render loop, physics engine, and other core features such as lighting and controllers/hand-tracking. +- It acts as the primary container for the entire application. All other custom elements, for example ``, ``, ``, or ``, should be nested within this root component to ensure they function correctly. +- Some data-attributes like `data-camera`, `data-lighting`, or `data-debug` can be set to change various defaults. More on that [below](#definition-and-usage). + +## Definition and Usage + +The `` tag has optional `data-attributes`: + +- [`data-camera`](/attributes/data-camera) +- [`data-lighting`](/attributes/data-lighting) +- [`data-debug`](/attributes/data-debug) +- [`data-occlusion`](/attributes/data-occlusion) +- [`data-orbital`](/attributes/data-orbital) +- [`data-stats`](/attributes/data-stats) +- [`data-preserve-drawing-buffer`](/attributes/data-preserve-drawing-buffer) + + +## Example + + + + + + + + + Hello world! + This is an mr-app + + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + gap: 0.5rem; + font-family: Helvetica; + border-radius: unset; + } + mr-text { + letter-spacing: 1px; + line-height: 120%; + } + .title { + font-size: 150%; + font-weight: bold; + } + #logo { + width: 200px; + height: 200px; + z-index: 70; + scale: 0.15; + } + + + function rotate(timestamp) { + t = timestamp / 2000; + let rx = -Math.cos(t) * 90; + let ry = Math.cos(t) * 90; + let rz = Math.cos(t) * 180; + document.querySelector("#logo").dataset.rotation = rx + " " + ry + " " + rz; + window.requestAnimationFrame(rotate); + }; + window.requestAnimationFrame(rotate); + + + + diff --git a/v-saved/all-saved/main/source/docs/mr-button.md b/v-saved/all-saved/main/source/docs/mr-button.md new file mode 100644 index 0000000..bbf8ea3 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-button.md @@ -0,0 +1,47 @@ +# <mr-button> + +The `` embeds a button in the UI of an ``. + +## Example + + + + + + + Change color! + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + mr-button { + font-family: system-ui; + background-color: white; + padding: 8px 16px; + font-size: 150%; + border-radius: 20px; + } + + + function changeColor() { + let hue = Math.floor(Math.random() * 360); + let color = 'hsl(' + hue + ', 100%, 80%)'; + document.querySelector("#panel").style.backgroundColor = color; + } + changeColor(); + + + +## Definition and Usage + +`` has one optional attribute: + +* `onclick`: the function to be called when the button is clicked diff --git a/v-saved/all-saved/main/source/docs/mr-div.md b/v-saved/all-saved/main/source/docs/mr-div.md new file mode 100644 index 0000000..3440262 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-div.md @@ -0,0 +1,66 @@ +# <mr-div> + +The ``defines a division or section in an ``. This is the same concept as `` but is specific to items that are within an ``. Think of this as items that are specific to the interface on the panel, 2D and 3D alike. + +## Example + + + + + + + Purple section + Blue section + Yellow section + + + + + + +## Definition and Usage + +`` behaves exactly like a `
` tag. It can be styles using CSS, store data-attributes, etc. + +```html + +``` + +You can then apply CSS + +```css +.blue { + background-color: LightSkyBlue; + grid-row: 1 / 3; + grid-column: 1 / -1; +} +``` diff --git a/v-saved/all-saved/main/source/docs/mr-entity.md b/v-saved/all-saved/main/source/docs/mr-entity.md new file mode 100644 index 0000000..44e1d6e --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-entity.md @@ -0,0 +1,18 @@ +# <mr-entity> + +`` is the most fundamental MRjs element. It is an empty entity and contains no default properties of it's own. + +## Example + +```html + + + + + + +``` + +## Definition and Usage + +There are endless uses for ``. The simplest of which is to group other elements together, such that they can be moved, rotated, scaled, and otherwise manipulated as a single entity. diff --git a/v-saved/all-saved/main/source/docs/mr-img.md b/v-saved/all-saved/main/source/docs/mr-img.md new file mode 100644 index 0000000..2eedc17 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-img.md @@ -0,0 +1,44 @@ +# <mr-img> + +The `` tag is used to embed an image in an MRjs page. + +## Example + + + + + + + + A Humpback whale breaching the water + + + + + mr-panel { + display: block; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + mr-text { + align-self: center; + width: 100vw; + } + mr-img { + position: absolute; + align-self: center; + object-fit: cover; + } + + + +## Definition and Usage + +Images are not technically inserted into a web page; images are linked to web pages. The `` tag creates a holding space for the referenced image. + +The `` tag has two required attributes: + +* `src` - Specifies the path to the image +* `alt` - Specifies an alternate text for the image, if the image, for some reason, cannot be displayed, or if the user uses a screen reader. diff --git a/v-saved/all-saved/main/source/docs/mr-light.md b/v-saved/all-saved/main/source/docs/mr-light.md new file mode 100644 index 0000000..fdd9b28 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-light.md @@ -0,0 +1,88 @@ +# <mr-light> + +`` creates a light source in the MRjs scene. + +## Simple example + +```html + + + + this white panel is tinted red by the light. + + +``` + +## Multiple lights + + + + + + + + + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + #bowtie { + scale: 0.15; + z-index: 35 + } + + + function rotate(timestamp) { + t = timestamp / 2000; + rotation = Math.cos(t) * 180; + document.querySelector("#bowtie").dataset.rotation = rotation + " 0 0"; + window.requestAnimationFrame(rotate); + } + window.requestAnimationFrame(rotate); + + + + + + + +## Definition and Usage + +`` can be used to create additional light sources that can be positioned throughout the environment. + +`` has two optional values: + +* `color`: the color of the light +* `intensity`: the brightness of the light + +## Shadows + +for performance reasons, `` cannot cast shadows. Please use the global lighting for shadows. diff --git a/v-saved/all-saved/main/source/docs/mr-model.md b/v-saved/all-saved/main/source/docs/mr-model.md new file mode 100644 index 0000000..7a34496 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-model.md @@ -0,0 +1,84 @@ +# <mr-model> + +`` is used to load 3D model files. + +## Example + + + + + + + + + + + + + + mr-panel { + background-color: LightSkyBlue; + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + #koi { + scale: 0.05; + z-index: 70; + } + + + +## Definition and Usage + +`` has one required attribute: + +* `src`: the path to the target model file + +> Note: `data-comp-animation` can be useful here + +## Supported file types + +* Check out the [allowed extensions](https://docs.mrjs.io/js-api-utils/model/#modelloadmodelfilepath-extension--promisethreemesh) from the Model.loadModel function +* The current supported list is: `dae`, `fbx`, `glb`, `obj`, and `stl` + +> Note: certain filetypes require additional inputs to 'src' (for ex: 'obj'). Check the [documentation](https://examples.mrjs.io/examples/models.html) if you are unsure. + +## Anchoring 3D elements + +3D elements can flow alongside with text inside an `` + + + + + + + Amet sed pulvinar amet a mi est adipiscing rhoncus enim. Dui in nulla labore quis nibh consectetur tempor vulputate diam. Sed hendrerit risus gravida labore. + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore disputandum putant. Sed ut iis bonis erigimur, quae expectamus, sic laetamur iis, quae et splendide dicta sint neque sint conversa. + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + gap: 10px; + padding: 20px; + } + mr-text { + max-width: 600px; + } + #bowtie { + width: 100px; + height: 100px; + z-index: 70; + scale: 0.1; + } + + diff --git a/v-saved/all-saved/main/source/docs/mr-panel.md b/v-saved/all-saved/main/source/docs/mr-panel.md new file mode 100644 index 0000000..896fabc --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-panel.md @@ -0,0 +1,71 @@ +# <mr-panel> + +The `` tag creates a 2.5D UI panel. + +**Currently limited to one UI panel per app** + +## Example + +```html + + + โ€ฆ + + โ€ฆ + +``` + +## Definition and Usage + +The `` tag initializes and manages 2D interface elements, such as images, text, and buttons. + + + + + + + Welcome to my app + You will be asked a few questions. + Get started + + + + + mr-panel { + background-color: white; + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + .title { + font-size: 150%; + font-weight: 700; + letter-spacing: 1px; + } + .subtitle { + font-size: 100%; + font-weight: 400; + margin-bottom: 20px; + } + + + +## Spatial Responsive Design + +When viewed on a 2D screen, an `mr-panel` positions itself to fill the viewport, rendering itself and behaving like any 2D web app, responding to keyboard and mouse input or touch events. + +In mixed-reality, the panel behaves like a floating touch screen, clipping any content that extends beyond its boundaries. + +## 2.5D UI + +MRjs supports 2.5D UI, adding a bit of depth to buttons, and incorporating 3D content such as the ``tag. + +```html + + + Click me + +``` diff --git a/v-saved/all-saved/main/source/docs/mr-skybox.md b/v-saved/all-saved/main/source/docs/mr-skybox.md new file mode 100644 index 0000000..7c4d57d --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-skybox.md @@ -0,0 +1,64 @@ +# <mr-skybox> + +`` creates a skybox that can be enabled or disabled, toggling between MR and VR. + +## Example + +```html + + + +``` + +## Definition and Usage + +`` is used to create a very simple immersive environment for an immersive experience + +`` has the following attributes: + +* `src`: the src image file(s) to be applied to the skybox. +* `pathToTextures`: the foldering path to the image file(s). + +## CSS option + +If you set the background of in css it will load it up as a skybox into the scene. + +```css +mr-app { + background-image: url('/assets/textures/skybox_starmap_4k.jpg'); +} +``` + +## Use Options + +* singular `src` + +```html + + + +``` + +* singular `src` using the `pathToTextures` folder setup + +```html + + + +``` + +* multiple `src` files + +```html + + + +``` + +* multiple `src` files using the `pathToTextures` folder setup + +```html + + + +``` diff --git a/v-saved/all-saved/main/source/docs/mr-stats.md b/v-saved/all-saved/main/source/docs/mr-stats.md new file mode 100644 index 0000000..7a8df23 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-stats.md @@ -0,0 +1,31 @@ +# <mr-stats> + +The `` is a text-based entity that can be added to a panel to show an updating counter of the current fps. + +It is performant both in headset and on desktop. + +Note this is not the same thing that is created when doing `stats=true` in ``. See [`stats=true`](https://docs.mrjs.io/doc/mr-app/#stats) for that instead. + +## Example + + + + + + + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + + + + diff --git a/v-saved/all-saved/main/source/docs/mr-text.md b/v-saved/all-saved/main/source/docs/mr-text.md new file mode 100644 index 0000000..3c063e2 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-text.md @@ -0,0 +1,69 @@ +# <mr-text> + +The ``embeds text into an ``. + +## Example + + + + + + Hello World! + + + + + mr-panel { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + + + +## Troika + +mr-text is made possible through Troika-Three-Text and can be manipulated with JavaScript like any other THREE.js. + +## Definition and Usage + +`` supports custom fonts and has growing support CSS styling: + +```html +MRjs +``` + +```css +.title { + font-family: 'Roboto'; + font-size: 6vw; + line-height: 100%; + text-align: center; + color: rgba(24, 24, 24, 0.75); +} +``` + +## Custom Fonts + +Custom fonts are supported but must be loaded manually in css using `@font-face` + +```css +@font-face { + font-family: 'Roboto'; + src: url('./assets/fonts/Roboto-Regular.ttf') format('truetype'); +} +``` + +## Supported Properties + +* font-family + * font fallbacks not currently supported +* font-size +* color +* line-height +* white-space +* vertical-align +* text-align diff --git a/v-saved/all-saved/main/source/docs/mr-video.md b/v-saved/all-saved/main/source/docs/mr-video.md new file mode 100644 index 0000000..386e76b --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-video.md @@ -0,0 +1,67 @@ +# <mr-video> + +The `` tag is used to embed a video in an MRjs page. + +## Definition and Usage + +Videos are not technically inserted into a web page; images are linked to web pages. The `` tag creates a holding space for the referenced video. + +The `` tag has two required attributes: + +* `src` - Specifies the path to the video +* `alt` - Specifies an alternate text for the video, if the video, for some reason, cannot be displayed, or if the user uses a screen reader. + +## Example + + + + + + + + + Play + Stop + + + + + mr-panel { + display: block; + align-items: center; + justify-content: center; + width: 100vw; + height: 100vh; + } + mr-video { + position: absolute; + align-self: center; + object-fit: cover; + } + #tabbar { + background-color: #141414; + border-radius: 1%; + position:fixed; + bottom: 0; + left: 0; + width: 50%; + display: grid; + grid-template-columns: 1fr 1fr 1fr 1fr; + padding: 1vh; + height: fit-content; + z-index: 4; + } + #tabbar * { + margin: 0 10px; + } + + + let vid = document.querySelector('#vid'); + function playVideo() { + vid.play(); + } + function stopVideo() { + vid.pause(); + } + + diff --git a/v-saved/all-saved/main/source/docs/mr-volume.md b/v-saved/all-saved/main/source/docs/mr-volume.md new file mode 100644 index 0000000..d6c8c90 --- /dev/null +++ b/v-saved/all-saved/main/source/docs/mr-volume.md @@ -0,0 +1,7 @@ +# <mr-volume> + +The `` tag is used to limit the visual space of items in a scene. + +## Definition and Usage + +The ``defines a visible region in 3D space. Models and other entities can move throughout the space and leave the space, yet will only be rendered in the visual area of fthe volume. From a conceptual perspective it is considered a 'clipping volume'. diff --git a/v-saved/all-saved/main/source/ecs/01What is it.md b/v-saved/all-saved/main/source/ecs/01What is it.md new file mode 100644 index 0000000..ab4fa5f --- /dev/null +++ b/v-saved/all-saved/main/source/ecs/01What is it.md @@ -0,0 +1,50 @@ +# What is an Entity Component System? + +At the heart of MRjs is an architecture known as an Entity Component Systems (ECS). This is an efficient, modular, and scalable architecture popularized by the gaming industry. + +In a single sentence: +- an Entity is a thing +- a Component is an attribute of a thing +- a System acts on all things with its matching Component + +It can be a little difficult to immediately pick up, so let's break it down piece-by-piece. + +## Entities + +_An entity is a thing, and everything is a thing, so everything is an entity._ + +The closest comparison to an `mr-entity` is the `div` tag. On its own, a `div` is empty and invisible, but by applying CSS and JavaScript, you can create images, buttons, containers, and so on. You can also use them to group other elements together. + +An entity works the same way, it's nothing on its own. It only becomes something when you attach components. + +## Components + +_A component is an attribute of a thing, so every entity has components._ + +Components "describe" an entity. They store data unique to the entity they are attached to. This data can range from position and rotation, to how hungry the entity is. + +MRjs utilizes the data-attributes standard for the component element of its ECS. Each component begins with the `data-comp-` prefix. + +## Systems + +On their own, entities and components don't do much. They are just things with data. To do anything interesting, we need systems. + +A system monitors and manipulates all entities that have its matching component. For instance, an "Energy" system would only care about entities that have an "Energy" component. + +## How does this compare to Object-Oriented Programming (OOP)? + +Obviously, you can combine ECS and OOP, MRjs does. But here are a couple of ways in which they differ. + +### Flexibility + +In many ways, the ECS is a lot more flexible. In OOP, each object of a given type is created using the same blueprint, and they all have the same attributes and duplicate logic. You can utilize inheritance to create variants of a given object, but that can become cumbersome. + +With ECS, you can create a unique object on the fly by attaching the components you need, and neatly organizing logic into Systems. + +### Order + +Systems are called in the order they were instanced, so you know at which point the logic for a given system will be called in the process. This allows you to design the flow of your application, making events more predictable. + +### Single Threaded + +ECS is designed to run on a single thread. This can be constraining, as one bad system can bring your application to a slowdown. So it's important to reduce complexity in your update functions, and utilize async for anything that can be done outside the main thread. diff --git a/v-saved/all-saved/main/source/ecs/02How We Use It.md b/v-saved/all-saved/main/source/ecs/02How We Use It.md new file mode 100644 index 0000000..b7e5ef3 --- /dev/null +++ b/v-saved/all-saved/main/source/ecs/02How We Use It.md @@ -0,0 +1,147 @@ +# How do we use ECS in MRjs? + + + +### Entity Component System + +MRjs is designed from the ground up using the Entity-Component-System Architecture. This is a common architecture implemented by Game Engines such as Unity, Unreal, and RealityKit. + +#### Entity + +An Entity is an object. It stores only the most fundamental data, such as a unique identifier, a THREE.js Object3D, a physics body, and dimension data such as width and scale. + +Any `mr-*` tag within the `mr-app` is an Entity. `mr-entity` is the spatial equivalent of a `div`. + +Creating a custom Entity is as simple as creating a Custom Element via the Web Components API. + +Example: + +```js +class Spacecraft extends MREntity { + constructor(){ + this.object3D = this.generateSpacecraft() + } + + // function to procedurally generate a 3D spacecraft + generateSpacecraft(){ + ... + } +} + +customElements.get('mr-spacecraft') || customElements.define('mr-spacecraft', Spacecraft) +``` + +#### Systems + +A System contains logic that is applied to all entities that have a corresponding Component, using the data stored by the component. Unlike Entities & Components, Systems have no HTML representation and are implemented entirely in JavaScript. + +When a component is attached to or detached from an entity, it is added or removed from its System's registry of entities. + +Example: + +```js +class OrbitSystem extends MRSystem{ + constructor(){ + super() + } + + // called every frame + update(deltaTime, frame) { + for(const entity in this.registry) { + // Update entity position + let component = entity.components.get('orbit') + component.radius + component.target + //... + entity.component.set('orbit', { speed : 1 }) + } + } + + // Called when an orbit component is attached + attachedComponent(entity) { + //... + } + + + // do something when an orbit component is updated + updatedComponent(entity, oldData) { + //... + } + + // do something when an orbit component is detached + detachedComponent(entity) { + //... + } +} +``` + +When you define a custom system, it listens for events triggered when the System's corresponding component is attached, updated, or detached. In the above case, `data-comp-orbit`. + +#### Components + +Components are attached to entities and used to store data. In MRjs they are implemented using data attributes beginning with the prefix `data-comp-`. + +Example: + +```html + +``` + +Note: the mapping between components and systems is 1-to-1, and the naming convention (`data-comp-` and `System`) is strictly enforced. + +## Defining Custom Components & Systems in MRjs + +A Component is defined whenever a custom `MRSystem` is created, which we create by extending the `MRSystem` class in JavaScript. + +If we were to create the Health system: + +```js +class HealthSystem extends MRSystem { + ... +} +``` +That system would listen for whenever the `data-comp-health` attribute is added, updated, or removed from an entity. + +### Setting and Getting Component Data. + +A component and be attached to an entity in HTML: + +```html + +``` +You can also set and get components in JavaScript using the components API + +```js +entity.components.set('health', {stamina: 0.99, damage: 0.1}) + +let healthComp = entity.components.get('health') + +console.log('stamina', healthComp.stamina) + +``` +Each system has an `update` function that is called every frame. This function can be used to update the entities in the system's registry. + +```js +... +update(delta, time) { + for(const entity of this.registry) { + let healthComp = entity.components.get('health') + + healthComp.stamina -= healthComp.damage * 0.001 + + entity.components.set('health', healthComp) + } +} +... +``` + +There are also built-in functions that are called whenever a component is attached, detached, or updated. Check out the `MRSystems` docs to learn more. + diff --git a/v-saved/all-saved/main/source/events/interaction-events.md b/v-saved/all-saved/main/source/events/interaction-events.md new file mode 100644 index 0000000..fc6a3d5 --- /dev/null +++ b/v-saved/all-saved/main/source/events/interaction-events.md @@ -0,0 +1,96 @@ +# Interaction Events + +## `selectstart` + +Triggered via the controller's trigger button is pressed, or a pinch gesture is performed. + +Origin: `document` + +Detail: + +- `handedness`: `left` or `right` +- `position`: a THREE.js Vector3 of the pinch/controller position + +## `selectmoved` + +Triggered when the controller's trigger button, or a pinch gesture is held. + +Origin: `document` + +Detail: + +- `handedness`: `left` or `right` +- `position`: a THREE.js Vector3 of the pinch/controller position + +## `selectend` + +Triggered when the controller's trigger button, or a pinch gesture is released. + +Origin: `document` + +Detail: + +- `handedness`: `left` or `right` +- `position`: a THREE.js Vector3 of the pinch/controller position + +## `hoverstart` + +Triggered when the cursor or the users' finger begins hovering over an entity. + +The `hover` CSS class is added to the entity when this event is triggered. + +Origin: the target element + +Detail: + +- `worldPosition`: a THREE.js Vector3 of the hover world position +- `position`: a THREE.js Vector3 of the local hover position + +## `hovermove` + +Emitted continuously while a finger is on an element. + +Origin: the target element + +Detail: + +- `worldPosition`: a THREE.js Vector3 of the hover world position +- `position`: a THREE.js Vector3 of the local hover position +- `delta`: a THREE.js Vector3 of the delta between the the current local position and the last + +## `hoverend` + +Triggered when the cursor or the users' finger stops hovering over an entity. + +The `hover` CSS class is removed to the entity when this event is triggered. + +Origin: the target element + +## `touchstart` + +Triggered whenever the controller's trigger button is pushed, a pinch gesture occurs, or the user touches an entity. + +Origin: the target element + +Detail: + +- `worldPosition`: a THREE.js Vector3 of the hover world position +- `position`: a THREE.js Vector3 of the local hover position + +## `touchmove` + +Emitted continuously while the trigger/pinch or direct touch collision is maintained + +Origin: the target element + +Detail: + +- `worldPosition`: a THREE.js Vector3 of the hover world position +- `position`: a THREE.js Vector3 of the local hover position +- `delta`: a THREE.js Vector3 of the delta between the the current local position and the last + +## `touchend` + +Triggered whenever the controller's trigger button or pinch gesture is released, or when the user stops touching an entity. + +Origin: the target element \ No newline at end of file diff --git a/v-saved/all-saved/main/source/events/mr-events.md b/v-saved/all-saved/main/source/events/mr-events.md new file mode 100644 index 0000000..c845b17 --- /dev/null +++ b/v-saved/all-saved/main/source/events/mr-events.md @@ -0,0 +1,38 @@ +--- +description: "An introduction to the Event system in MRjs" +--- +# MRjs Events + +## `enterXR` + +Triggered when the XR session is initialized. This is useful when dealing with XR exclusive features, such as hit testing, accessing the scene mesh or planes. + +Origin: `mr-app` + +## `exitXR` + +Triggered when the XR session is ended. This is useful when you'd like to save the XR state, or when application-specific content needs to be reconfigured for a 2D window. + +Origin: `mr-app` + +## `entityadded` + +Triggered whenever an entity is added to the DOM. + +Origin: the created entity + +## `entityupdated` + +Triggered when an entity is updated to the DOM, this excludes component updates and focuses primarily on any update that might effect the geometry or physics colliders of the entity. + +Origin: the created entity + +## `entityremoved` + +Triggered whenever an entity is removed from the DOM. + +Origin: document + +detail: + +- `entity` - the removed entity node diff --git a/v-saved/all-saved/main/source/index.md b/v-saved/all-saved/main/source/index.md new file mode 100644 index 0000000..c643b10 --- /dev/null +++ b/v-saved/all-saved/main/source/index.md @@ -0,0 +1,136 @@ +--- +description: "An extendable WebComponents library for the Spatial Web" +--- +![The MRjs logo, an indigo and purple bowtie.](https://docs.mrjs.io/static/mrjs-logo.svg) + +An extensible library of Web Components for the spatial web. + +[![npm run build](https://github.com/Volumetrics-io/mrjs/actions/workflows/build.yml/badge.svg)](https://github.com/Volumetrics-io/mrjs/actions/workflows/build.yml) [![npm run test](https://github.com/Volumetrics-io/mrjs/actions/workflows/test.yml/badge.svg)](https://github.com/Volumetrics-io/mrjs/actions/workflows/test.yml) [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/Volumetrics-io/mrjs/blob/main/LICENSE) + +[![docs](https://img.shields.io/badge/documentation-8A2BE2)](https://docs.mrjs.io) [![dev-examples](https://img.shields.io/badge/examples-ee99ff?logoColor=white)](https://examples.mrjs.io) + +## Branches + +- Large refactor of MRjs happening on ![sub-main](https://img.shields.io/badge/sub--main-orange) branch, stay tuned! +- ![main](https://img.shields.io/badge/main-gray) branch still being used for dependabots and quick fix cleanups + +## Overview + +MRjs is a mixed-reality-first, WebXR user interface library meant to bootstrap spatial web development. It implements much of the foundational work so that developers can spend less time on the basics and more time on their app. + +Designed to be extensible, MRjs provides a familiar interface via [THREE.js](https://github.com/mrdoob/three.js), the [Custom Elements API](https://developer.mozilla.org/en-US/docs/Web/API/Web_components), [Rapier.js](https://github.com/dimforge/rapier), and our own built-in ECS (Entity Component System) setup. + +[[ECS - what is it?](https://docs.mrjs.io/ecs/what-is-it/)] - [[ECS - how we use it](https://docs.mrjs.io/ecs/how-we-use-it/)] - [[MRjs - Creating custom entities, components, && systems](https://docs.mrjs.io/ecs/how-we-use-it/#defining-custom-components--systems-in-mrjs)] + +## Getting started + +### Via HTML Script Tag: + +For the latest stable version: + +```html + + โ€ฆ + + โ€ฆ + +``` + +For the daily build. No guarantee of stability: + +```html + + โ€ฆ + + โ€ฆ + +``` + +### Via NPM: + +```sh +npm i mrjs +``` + +### Via Github Source: + +1) [Clone this repository](https://github.com/Volumetrics-io/mrjs) ([github's how-to-clone](https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories)) + +```sh +git clone the.cloning.url +``` + +> If you are planning to contribute to this repo instead of just using is as a source you will need its submodules for proper samples and testing: +> ```sh +> git clone --recurse-submodules the.cloning.url +> ``` +> +> If you've already cloned the repo the normal way (`git clone the.cloning.url`) you can update for the submodule as follows: +> ```sh +> git submodule update --init --recursive +> ``` + +2) Next, setup your node environment ([make sure node is setup properly](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)): + +```sh +npm install +``` + +3) and now build: + +```sh +npm run build +``` + +## Running the samples and tests + +Note for in-headset testing / running of samples: [https requirement](#https-requirement) + +### Samples + +This only works if you're setting this up [via github source](#via-github-source); otherwise, go to [examples.mrjs.io](https://examples.mrjs.io) to try out the samples there. + +You are able to try the samples locally and in headset by running the following: + +```sh +npm run server +``` + +> We serve some of our examples and testing files from submodules, if you are planning to contribute, there will be times when the submodule for your work might be out of date. Since we run scripts along with our submodule update. Run the following to stay up to date: +> ```sh +> npm run update-submodules +> ``` + +### Tests + +```sh +npm run test +``` + +### Updating Documentation: + +Check [docs.mrjs.io](https://docs.mrjs.io) or our [repository](https://github.com/Volumetrics-io/documentation) for the full documentation. + +For local documentation or to check the local output when writing your own PR to see how it will update, run the below command. + +`Note:` the order of creation of docs depends on your operating system, so if when you run this and the order looks different, do not worry - in the repository itself our action will handle that for you and default to use the right version for these automatically generated docs. + +```sh +npm run docs +``` + +### HTTPS Requirement + +To test in headset, WebXR requires that your project be served using an HTTPS server. If you're using Webpack, you can achieve this by utilizing the [Dev Server webpack plugin](https://webpack.js.org/configuration/dev-server/) with `https: true`. + +Here are some additional solutions: + +- [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) for VS Code +- [via Python](https://anvileight.com/blog/posts/simple-python-http-server/) + +Both options require you generate an SSL certificate and a key via OpenSSL: + +```sh +openssl req -x509 -newkey rsa:2048 -keyout key.pem -out cert.pem -days 365 +``` +
Suggest an edit on GitHub for README.md
diff --git a/v-saved/all-saved/main/source/js-api-extras/000Refractor.md b/v-saved/all-saved/main/source/js-api-extras/000Refractor.md new file mode 100644 index 0000000..dd282ec --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-extras/000Refractor.md @@ -0,0 +1,19 @@ +--- +title: Refractor +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/extras/Refractor.js +--- +# Refractor + + + +## Refractor +**Kind**: global class + + +### new Refractor(geometry, options) + +| Param | +| --- | +| geometry | +| options | + diff --git a/v-saved/all-saved/main/source/js-api-extras/001Water.md b/v-saved/all-saved/main/source/js-api-extras/001Water.md new file mode 100644 index 0000000..14c94f1 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-extras/001Water.md @@ -0,0 +1,79 @@ +--- +title: Water +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/extras/Water.js +--- +# Water + +## Classes + +
+
Water
+
+
WaterSystem
+
+
+ + + +## Water +**Kind**: global class + +* [Water](#Water) + * [new Water(geometry, options)](#new_Water_new) + * [.updateTextureMatrix(camera)](#Water+updateTextureMatrix) + * [.updateFlow(delta)](#Water+updateFlow) + + + +### new Water(geometry, options) + +| Param | +| --- | +| geometry | +| options | + + + +### water.updateTextureMatrix(camera) +**Kind**: instance method of [Water](#Water) + +| Param | +| --- | +| camera | + + + +### water.updateFlow(delta) +**Kind**: instance method of [Water](#Water) + +| Param | +| --- | +| delta | + + + +## WaterSystem +**Kind**: global class + +* [WaterSystem](#WaterSystem) + * [new WaterSystem(water)](#new_WaterSystem_new) + * [.update(dt, f)](#WaterSystem+update) + + + +### new WaterSystem(water) + +| Param | +| --- | +| water | + + + +### waterSystem.update(dt, f) +**Kind**: instance method of [WaterSystem](#WaterSystem) + +| Param | +| --- | +| dt | +| f | + diff --git a/v-saved/all-saved/main/source/js-api-utils/000HTML.md b/v-saved/all-saved/main/source/js-api-utils/000HTML.md new file mode 100644 index 0000000..18e525a --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/000HTML.md @@ -0,0 +1,44 @@ +--- +title: HTML +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/HTML.js +--- +# HTML + + + +## html : object +Useful namespace for helping with html utility functions + +**Kind**: global namespace + +* [html](#html) : object + * [.resolvePath(path, baseUrl)](#html.resolvePath) โ‡’ string + * [.removeUrlQueries(path, baseUrl)](#html.removeUrlQueries) โ‡’ string + + + +### html.resolvePath(path, baseUrl) โ‡’ string +Given the path returns an absolute path resolved so relative linking works as expected. + +**Kind**: static method of [html](#html) +**Returns**: string - a.href - the absolute path (or paths) + +| Param | Type | Description | +| --- | --- | --- | +| path | string | either a relative or full path inputted to an element. This can also be a path that has items separated by ',' so that you can resolve multiple items at once, since we allow users to send us multiple files that way. | +| baseUrl | string | a separate entry for if you want your url to start differently. this defaults to your window.location.origin. Additionally removes all queries from the end of the url, leaving the input as just the origin and its pathname. For ex: 'https://example.com/images/photo.png?version=2' becomes 'https://example.com/images/photo.png' | + + + +### html.removeUrlQueries(path, baseUrl) โ‡’ string +Removes all queries from the end of the url, leaving the input as just the origin and its pathname. +For ex: 'https://example.com/images/photo.png?version=2' becomes 'https://example.com/images/photo.png' + +**Kind**: static method of [html](#html) +**Returns**: string - a.href - the absolute path + +| Param | Type | Description | +| --- | --- | --- | +| path | string | either a relative or full path inputted to an element. | +| baseUrl | string | a separate entry for if you want your url to start differently. this defaults to your window.location.origin. | + diff --git a/v-saved/all-saved/main/source/js-api-utils/001XR.md b/v-saved/all-saved/main/source/js-api-utils/001XR.md new file mode 100644 index 0000000..040ee36 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/001XR.md @@ -0,0 +1,13 @@ +--- +title: XR +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/XR.js +--- +# XR + + + +## xr : object +Useful namespace for helping with xr utility functions. +this is set within the MRApp to access various WebXR API features + +**Kind**: global namespace diff --git a/v-saved/all-saved/main/source/js-api-utils/002JS.md b/v-saved/all-saved/main/source/js-api-utils/002JS.md new file mode 100644 index 0000000..c348fe4 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/002JS.md @@ -0,0 +1,30 @@ +--- +title: JS +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/JS.js +--- +# JS + + + +## js : object +Useful namespace for helping with common needed JS quick functions + +**Kind**: global namespace + + +### js.isInstanceOfBaseClassOnly(instance, BaseClass) โ‡’ object +Given the parent, grabs either the parent's direct material or (in the case of a group) the +material of the first child hit. + +**Kind**: static method of [js](#js) +**Returns**: object - material - the grabbed material + +| Param | Type | Description | +| --- | --- | --- | +| instance | object | the object whose class is being checked | +| BaseClass | object | the given name of the BaseClass being checked against. Not in quotes. | + +**Example** +```js +JS.isInstanceOfBaseClassOnly(entity, MRDivEntity) would return true only on entities. +``` diff --git a/v-saved/all-saved/main/source/js-api-utils/003Display.md b/v-saved/all-saved/main/source/js-api-utils/003Display.md new file mode 100644 index 0000000..f6a2267 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/003Display.md @@ -0,0 +1,30 @@ +--- +title: Display +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/Display.js +--- +# Display + + + +## display : object +Useful namespace for helping with Display utility functions + +**Kind**: global namespace + +* [display](#display) : object + * [.VIRTUAL_DISPLAY_RESOLUTION](#display.VIRTUAL_DISPLAY_RESOLUTION) + * [.mobileCheckFunction()](#display.mobileCheckFunction) โ‡’ boolean + + + +### display.VIRTUAL\_DISPLAY\_RESOLUTION +Defaults to 1080; + +**Kind**: static property of [display](#display) + + +### display.mobileCheckFunction() โ‡’ boolean +Checks whether the user is on mobile or not based on a large list of potential options. + +**Kind**: static method of [display](#display) +**Returns**: boolean - - returns true if on any mobile devices. diff --git a/v-saved/all-saved/main/source/js-api-utils/004Notify.md b/v-saved/all-saved/main/source/js-api-utils/004Notify.md new file mode 100644 index 0000000..c0ce7ec --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/004Notify.md @@ -0,0 +1,78 @@ +--- +title: Notify +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/Notify.js +--- +# Notify + +## Objects + +
+
error : object
+

Useful namespace for helping with error utility functions

+
+
warn : object
+

Useful namespace for helping with error utility functions

+
+
+ + + +## error : object +Useful namespace for helping with error utility functions + +**Kind**: global namespace + +* [error](#error) : object + * [.emptyParentFunction()](#error.emptyParentFunction) + * [.err(string)](#error.err) + + + +### error.emptyParentFunction() +Function helper to error in console if a child class is expected to overwrite a parent +class's function but didnt. + +**Kind**: static method of [error](#error) + + +### error.err(string) +Function helper separated out to console error for when we eventually have a more robust +erroring system. + +**Kind**: static method of [error](#error) + +| Param | Type | Description | +| --- | --- | --- | +| string | string | string of texted emitted through the console. | + + + +## warn : object +Useful namespace for helping with error utility functions + +**Kind**: global namespace + +* [warn](#warn) : object + * [.EmptyParentFunction()](#warn.EmptyParentFunction) + * [.warn(string)](#warn.warn) + + + +### warn.EmptyParentFunction() +Function helper to warn in console if a child class might want to overwrite a parent +class's function but didnt. Useful for base classes that are more abstract classes (if in Java or C++) +to remind the user of the child class that there is more to implement. + +**Kind**: static method of [warn](#warn) + + +### warn.warn(string) +Function helper separated out to console warn for when we eventually have a more robust +warning system. + +**Kind**: static method of [warn](#warn) + +| Param | Type | Description | +| --- | --- | --- | +| string | string | string of texted emitted through the console. | + diff --git a/v-saved/all-saved/main/source/js-api-utils/005Material.md b/v-saved/all-saved/main/source/js-api-utils/005Material.md new file mode 100644 index 0000000..0bc7993 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/005Material.md @@ -0,0 +1,70 @@ +--- +title: Material +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/Material.js +--- +# Material + + + +## material : object +Useful namespace for helping with Materials and threejs utility functions + +**Kind**: global namespace + +* [material](#material) : object + * [.getObjectMaterial(parent)](#material.getObjectMaterial) โ‡’ object + * [.setObjectMaterial(parent, material)](#material.setObjectMaterial) โ‡’ object + * [.loadTextureAsync(src)](#material.loadTextureAsync) โ‡’ object + * [.loadVideoTextureAsync(video)](#material.loadVideoTextureAsync) โ‡’ object + + + +### material.getObjectMaterial(parent) โ‡’ object +Given the parent, grabs either the parent's direct material or (in the case of a group) the +material of the first child hit. + +**Kind**: static method of [material](#material) +**Returns**: object - material - the grabbed material + +| Param | Type | Description | +| --- | --- | --- | +| parent | object | either a THREE.Group or a THREE.mesh/object | + + + +### material.setObjectMaterial(parent, material) โ‡’ object +Given the parent, grabs either the parents direct material or (in the case of a group) the +material of the first child hit. + +**Kind**: static method of [material](#material) +**Returns**: object - parent - the updated parent object + +| Param | Type | Description | +| --- | --- | --- | +| parent | object | either a THREE.Group or a THREE.mesh/object | +| material | object | a threejs material to be set for either the parent's direct material or (in the case of a group) the material of all children within the parent group. | + + + +### material.loadTextureAsync(src) โ‡’ object +Function to load the texture asynchronously and return a promise + +**Kind**: static method of [material](#material) +**Returns**: object - texture - the fully loaded texture + +| Param | Type | Description | +| --- | --- | --- | +| src | object | the url path to the data to be loaded | + + + +### material.loadVideoTextureAsync(video) โ‡’ object +Function to load the texture asynchronously and return a promise + +**Kind**: static method of [material](#material) +**Returns**: object - texture - the fully loaded texture + +| Param | Type | Description | +| --- | --- | --- | +| video | object | the html video element whose src contains the path to the data to be loaded | + diff --git a/v-saved/all-saved/main/source/js-api-utils/006Color.md b/v-saved/all-saved/main/source/js-api-utils/006Color.md new file mode 100644 index 0000000..73e873d --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/006Color.md @@ -0,0 +1,30 @@ +--- +title: Color +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/Color.js +--- +# Color + + + +## color : object +Useful namespace for helping with color utility functions + +**Kind**: global namespace + + +### color.hexToRgba(hex) โ‡’ object +Converts a hex code into a usable rgba object value + +**Kind**: static method of [color](#color) +**Returns**: object - - the calculated rgba value representation of the hex code +{ + r: number, // Red component (0-255) + g: number, // Green component (0-255) + b: number, // Blue component (0-255) + a: number // Alpha component (0-1 for transparency) +} + +| Param | Type | Description | +| --- | --- | --- | +| hex | string | the hex code including "#" at the beginning | + diff --git a/v-saved/all-saved/main/source/js-api-utils/007String.md b/v-saved/all-saved/main/source/js-api-utils/007String.md new file mode 100644 index 0000000..3d4db23 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/007String.md @@ -0,0 +1,80 @@ +--- +title: String +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/String.js +--- +# String + + + +## string : object +Useful namespace for helping with String utility functions + +**Kind**: global namespace + +* [string](#string) : object + * [.stringToJson(attrString)](#string.stringToJson) โ‡’ object + * [.jsonToString(componentData)](#string.jsonToString) โ‡’ [string](#string) + * [.stringToVector(str)](#string.stringToVector) โ‡’ object + * [.stringToDegVector(str)](#string.stringToDegVector) โ‡’ object + * [.stringToDimensionValue(val)](#string.stringToDimensionValue) โ‡’ number + + + +### string.stringToJson(attrString) โ‡’ object +Converts and formats the inputted string to a json object. + +**Kind**: static method of [string](#string) +**Returns**: object - - object in json form + +| Param | Type | Description | +| --- | --- | --- | +| attrString | [string](#string) | the string to be formatted | + + + +### string.jsonToString(componentData) โ‡’ [string](#string) +Converts and formats the inputted json object into a string. + +**Kind**: static method of [string](#string) +**Returns**: [string](#string) - - the string representation of the json object + +| Param | Type | Description | +| --- | --- | --- | +| componentData | object | the json object to be formatted into a string | + + + +### string.stringToVector(str) โ‡’ object +Converts a string to vector format. + +**Kind**: static method of [string](#string) +**Returns**: object - - the vector version of the inputted string. + +| Param | Type | Description | +| --- | --- | --- | +| str | [string](#string) | the string to be converted to a vector. Must be of format 'xx xxx xx...'. | + + + +### string.stringToDegVector(str) โ‡’ object +Converts a string to vector format where the numbers are pre-converted from radians to degrees. + +**Kind**: static method of [string](#string) +**Returns**: object - - the vector version of the inputted string. + +| Param | Type | Description | +| --- | --- | --- | +| str | [string](#string) | the string to be converted to a vector. Must be of format 'xx xxx xx...'. | + + + +### string.stringToDimensionValue(val) โ‡’ number +Converts a string to vector format where the numbers are pre-converted from a number to an appropriate representation + +**Kind**: static method of [string](#string) +**Returns**: number - - the vector version of the inputted string. + +| Param | Type | Description | +| --- | --- | --- | +| val | [string](#string) | the string to be converted to a vector. Must be of format 'x%' or 'x/y'. | + diff --git a/v-saved/all-saved/main/source/js-api-utils/008Math.md b/v-saved/all-saved/main/source/js-api-utils/008Math.md new file mode 100644 index 0000000..133b578 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/008Math.md @@ -0,0 +1,78 @@ +--- +title: Math +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/Math.js +--- +# Math + + + +## math : object +Useful namespace for helping with Math utility functions including numerical, 3d, etc. + +**Kind**: global namespace + +* [math](#math) : object + * [.roundTo(val, decimal)](#math.roundTo) โ‡’ number + * [.roundVectorTo(vector, decimal)](#math.roundVectorTo) + * [.radToDeg(val)](#math.radToDeg) โ‡’ number + * [.computeBoundingSphere(group, relativeTo)](#math.computeBoundingSphere) โ‡’ THREE.Sphere + + + +### math.roundTo(val, decimal) โ‡’ number +Rounds the inputted val to the nearest decimal place as denoted by the decimal parameter. + +**Kind**: static method of [math](#math) +**Returns**: number - - The rounded number to the requested decimal amount. + +| Param | Type | Description | +| --- | --- | --- | +| val | number | The number to be rounded. | +| decimal | number | The decimal place targeted in the rounding. | + +**Example** +```js +For example: roundTo(832.456, 10) = 832.4; roundTo(832.456, 1000) = 832.456; roundTo(832.456, 0.01) = 800; +``` + + +### math.roundVectorTo(vector, decimal) +Rounds the inputted vector to the nearest decimal place as denoted by the decimal parameter. + +**Kind**: static method of [math](#math) + +| Param | Type | Description | +| --- | --- | --- | +| vector | vector | The vector of numbers to be rounded. | +| decimal | number | The decimal place targeted in the rounding. | + +**Example** +```js +For example: roundTo(<832.456, 92.10003, 23452.1>, 10) = <832.4, 92.1, 2342.1>; +``` + + +### math.radToDeg(val) โ‡’ number +Performs the radian To Degree calculation commonly used in math. +https://en.wikipedia.org/wiki/Degree_(angle) https://en.wikipedia.org/wiki/Radian + +**Kind**: static method of [math](#math) +**Returns**: number - - the calculated degree representation of val. + +| Param | Type | Description | +| --- | --- | --- | +| val | number | The number to be converted from radians to degrees | + + + +### math.computeBoundingSphere(group, relativeTo) โ‡’ THREE.Sphere +Computes the bounding sphere of an inputted three group object. + +**Kind**: static method of [math](#math) +**Returns**: THREE.Sphere - - the resolved bounding sphere + +| Param | Type | Description | +| --- | --- | --- | +| group | THREE.group | the group to be enclosed in the bounding sphere. | +| relativeTo | THREE.group | object that the group is relative to. For example if the group is an apple held in a character's hand, relativeTo would be the characters hand. When left as null, the bounding sphere defaults to the inputted groups original world matrix. | + diff --git a/v-saved/all-saved/main/source/js-api-utils/009CSS.md b/v-saved/all-saved/main/source/js-api-utils/009CSS.md new file mode 100644 index 0000000..48f2383 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/009CSS.md @@ -0,0 +1,56 @@ +--- +title: CSS +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/CSS.js +--- +# CSS + + + +## css : object +Useful namespace for helping with CSS utility functions + +**Kind**: global namespace + +* [css](#css) : object + * [.domToThree(val)](#css.domToThree) โ‡’ number + * [.threeToPx(val)](#css.threeToPx) โ‡’ number + * [.pxToThree(val)](#css.pxToThree) โ‡’ number + + + +### css.domToThree(val) โ‡’ number +Converts the dom string to a 3D numerical value + +**Kind**: static method of [css](#css) +**Returns**: number - - the 3D numerical represenation of the dom css value + +| Param | Type | Description | +| --- | --- | --- | +| val | string | the dom css information includes items of the form `XXXpx`, `XXX%`, etc | + + + +### css.threeToPx(val) โ‡’ number +Converts 3D world positions to display positions based on global viewPort information. + Useful as part of the layout system and css value handling (px<-->threejs). + +**Kind**: static method of [css](#css) +**Returns**: number - - the 2D pixel space representation of value. + +| Param | Type | Description | +| --- | --- | --- | +| val | number | the 3D value to be converted to 2D pixel space | + + + +### css.pxToThree(val) โ‡’ number +Converts display positions to 3D world positions to based on global viewPort information. +Useful as part of the layout system and css value handling (px<-->threejs). + +**Kind**: static method of [css](#css) +**Returns**: number - - the 3D representation of value. + +| Param | Type | Description | +| --- | --- | --- | +| val | number | the 2D pixel space value to be converted to 3D space. | + diff --git a/v-saved/all-saved/main/source/js-api-utils/010Physics.md b/v-saved/all-saved/main/source/js-api-utils/010Physics.md new file mode 100644 index 0000000..b8f8f32 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/010Physics.md @@ -0,0 +1,43 @@ +--- +title: Physics +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/Physics.js +--- +# Physics + + + +## physics : object +Useful namespace for helping with physics utility functions + +**Kind**: global namespace + +* [physics](#physics) : object + * [.CollisionGroups](#physics.CollisionGroups) + * [.RAPIER](#physics.RAPIER) + * [.INPUT_COLLIDER_HANDLE_NAMES](#physics.INPUT_COLLIDER_HANDLE_NAMES) + * [.COLLIDER_ENTITY_MAP](#physics.COLLIDER_ENTITY_MAP) + + + +### physics.CollisionGroups +the Rapier collision groups used throughout MRjs + +**Kind**: static property of [physics](#physics) + + +### physics.RAPIER +the RAPIER physics controller object + +**Kind**: static property of [physics](#physics) + + +### physics.INPUT\_COLLIDER\_HANDLE\_NAMES +the Rapier INPUT_COLLIDER_HANDLE_NAMES + +**Kind**: static property of [physics](#physics) + + +### physics.COLLIDER\_ENTITY\_MAP +the Rapier COLLIDER_ENTITY_MAP + +**Kind**: static property of [physics](#physics) diff --git a/v-saved/all-saved/main/source/js-api-utils/011Model.md b/v-saved/all-saved/main/source/js-api-utils/011Model.md new file mode 100644 index 0000000..b326d76 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/011Model.md @@ -0,0 +1,120 @@ +--- +title: Model +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/Model.js +--- +# Model + + + +## model : object +Useful namespace for helping with Model utility functions + +**Kind**: global namespace + +* [model](#model) : object + * [.loadDAE(filePath)](#model.loadDAE) โ‡’ Promise.<THREE.Mesh> + * [.loadOBJ(filePath)](#model.loadOBJ) โ‡’ Promise.<THREE.Mesh> + * [.loadOBJWithMTL(filePath)](#model.loadOBJWithMTL) โ‡’ Promise.<THREE.Mesh> + * [.loadFBX(filePath)](#model.loadFBX) โ‡’ Promise.<THREE.Mesh> + * [.loadGLTF(filePath)](#model.loadGLTF) โ‡’ Promise.<THREE.Mesh> + * [.loadSTL(filePath)](#model.loadSTL) โ‡’ Promise.<THREE.Mesh> + * [.loadUSDZ(filePath)](#model.loadUSDZ) โ‡’ Promise.<THREE.Mesh> + * [.loadModel(filePath, extension)](#model.loadModel) โ‡’ Promise.<THREE.Mesh> + + + +### model.loadDAE(filePath) โ‡’ Promise.<THREE.Mesh> +Loads Collada file + +**Kind**: static method of [model](#model) +**Returns**: Promise.<THREE.Mesh> - - the promise of the loaded mesh object. + +| Param | Type | Description | +| --- | --- | --- | +| filePath | string | The path to the file(s) needing to be loaded. For now this only supports the full path and the relative path directly to the file. | + + + +### model.loadOBJ(filePath) โ‡’ Promise.<THREE.Mesh> +Loads OBJ file + +**Kind**: static method of [model](#model) +**Returns**: Promise.<THREE.Mesh> - - the promise of the loaded mesh object. + +| Param | Type | Description | +| --- | --- | --- | +| filePath | string | The path to the file(s) needing to be loaded. For now this only supports the full path and the relative path directly to the file. | + + + +### model.loadOBJWithMTL(filePath) โ‡’ Promise.<THREE.Mesh> +Loads OBJ file with externally hosted MTL file + +**Kind**: static method of [model](#model) +**Returns**: Promise.<THREE.Mesh> - - the promise of the loaded mesh object. + +| Param | Type | Description | +| --- | --- | --- | +| filePath | string | The path of the form '/path/to/mtlFile.mtl,/path/to/objFile.obj'. | + + + +### model.loadFBX(filePath) โ‡’ Promise.<THREE.Mesh> +Loads FBX file + +**Kind**: static method of [model](#model) +**Returns**: Promise.<THREE.Mesh> - - the promise of the loaded mesh object. + +| Param | Type | Description | +| --- | --- | --- | +| filePath | string | The path to the file(s) needing to be loaded. For now this only supports the full path and the relative path directly to the file. | + + + +### model.loadGLTF(filePath) โ‡’ Promise.<THREE.Mesh> +Loads GLTF/GLB file + +**Kind**: static method of [model](#model) +**Returns**: Promise.<THREE.Mesh> - - the promise of the loaded mesh object. + +| Param | Type | Description | +| --- | --- | --- | +| filePath | string | The path to the file(s) needing to be loaded. For now this only supports the full path and the relative path directly to the file. | + + + +### model.loadSTL(filePath) โ‡’ Promise.<THREE.Mesh> +Loads stl file + +**Kind**: static method of [model](#model) +**Returns**: Promise.<THREE.Mesh> - - the promise of the loaded mesh object. + +| Param | Type | Description | +| --- | --- | --- | +| filePath | string | The path to the file(s) needing to be loaded. For now this only supports the full path and the relative path directly to the file. | + + + +### model.loadUSDZ(filePath) โ‡’ Promise.<THREE.Mesh> +Loads USD/USDZ file + +**Kind**: static method of [model](#model) +**Returns**: Promise.<THREE.Mesh> - - the promise of the loaded mesh object. + +| Param | Type | Description | +| --- | --- | --- | +| filePath | string | The path to the file(s) needing to be loaded. For now this only supports the full path and the relative path directly to the file. | + + + +### model.loadModel(filePath, extension) โ‡’ Promise.<THREE.Mesh> +The main loading function + +**Kind**: static method of [model](#model) +**Returns**: Promise.<THREE.Mesh> - - the promise of the loaded mesh object. + +| Param | Type | Description | +| --- | --- | --- | +| filePath | string | The path to the file(s) needing to be loaded. For now this only supports the full path and the relative path directly to the file. | +| extension | string | The extension of the file type. Current allowed extensions are `dae`, fbx`, `glb`, `obj`, and `stl`. | + diff --git a/v-saved/all-saved/main/source/js-api-utils/012App.md b/v-saved/all-saved/main/source/js-api-utils/012App.md new file mode 100644 index 0000000..0baae0a --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/012App.md @@ -0,0 +1,12 @@ +--- +title: App +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/App.js +--- +# App + + + +## app : object +Useful namespace for helping with app utility functions. + +**Kind**: global namespace diff --git a/v-saved/all-saved/main/source/js-api-utils/013Geometry.md b/v-saved/all-saved/main/source/js-api-utils/013Geometry.md new file mode 100644 index 0000000..a0bd7d1 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api-utils/013Geometry.md @@ -0,0 +1,27 @@ +--- +title: Geometry +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/utils/Geometry.js +--- +# Geometry + + + +## geometry : object +Useful namespace for helping with geometry utility functions + +**Kind**: global namespace + + +### geometry.UIPlane(width, height, radius_corner, smoothness) โ‡’ THREE.BufferGeometry +This construction function creates the UIPlane that is used as the backdrop for most mrjs Panel divs. + +**Kind**: static method of [geometry](#geometry) +**Returns**: THREE.BufferGeometry - - The completed threejs plane object. + +| Param | Type | Description | +| --- | --- | --- | +| width | number | the expected width of the plane. | +| height | number | the expected height of the plane. | +| radius_corner | number | the expected radius value to curve the planes corners. | +| smoothness | number | the expected smoothness value. | + diff --git a/v-saved/all-saved/main/source/js-api/000MRElement.md b/v-saved/all-saved/main/source/js-api/000MRElement.md new file mode 100644 index 0000000..e75b3a9 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/000MRElement.md @@ -0,0 +1,51 @@ +--- +title: MRElement +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/MRElement.js +--- +# MRElement + + + +## MRElement โ‡ HTMLElement +The first step in MRjs extending an HTMLElement. Used as a base for both `mr-app` and `mr-entity`. + +**Kind**: global class +**Extends**: HTMLElement + +* [MRElement](#MRElement) โ‡ HTMLElement + * [.MRElement](#MRElement+MRElement) + * [new exports.MRElement()](#new_MRElement+MRElement_new) + * [.add(entity)](#MRElement+add) + * [.removeEntity(entity)](#MRElement+removeEntity) + + + +### mrElement.MRElement +**Kind**: instance class of [MRElement](#MRElement) + + +#### new exports.MRElement() +Constructs the basic information needed to separate an `MRElement` from an `HTMLElement`. + + + +### mrElement.add(entity) +Adding an entity as a sub-object of this entity. + +**Kind**: instance method of [MRElement](#MRElement) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity to be added. | + + + +### mrElement.removeEntity(entity) +Removing an entity as a sub-object of this entity. + +**Kind**: instance method of [MRElement](#MRElement) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity to be removed. | + diff --git a/v-saved/all-saved/main/source/js-api/001MRSystem.md b/v-saved/all-saved/main/source/js-api/001MRSystem.md new file mode 100644 index 0000000..5f15ae3 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/001MRSystem.md @@ -0,0 +1,211 @@ +--- +title: MRSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/MRSystem.js +--- +# MRSystem + + + +## MRSystem +The default representation of an MRSystem to be expanded upon by actual details ECS System items. + +**Kind**: global class + +* [MRSystem](#MRSystem) + * [.MRSystem](#MRSystem+MRSystem) + * [new exports.MRSystem(useComponents, frameRate)](#new_MRSystem+MRSystem_new) + * [.onRegister(app)](#MRSystem+onRegister) + * [.onUnregister(app)](#MRSystem+onUnregister) + * [._update(deltaTime, frame)](#MRSystem+_update) + * [.update(deltaTime, frame)](#MRSystem+update) + * [.eventUpdate()](#MRSystem+eventUpdate) + * [._onNewEntity(entity)](#MRSystem+_onNewEntity) + * [.onNewEntity(entity)](#MRSystem+onNewEntity) + * [._entityRemoved(entity)](#MRSystem+_entityRemoved) + * [.entityRemoved(entity)](#MRSystem+entityRemoved) + * [.attachedComponent(entity)](#MRSystem+attachedComponent) + * [.updatedComponent(entity, oldData)](#MRSystem+updatedComponent) + * [.detachedComponent(entity)](#MRSystem+detachedComponent) + * [.onAttach(event)](#MRSystem+onAttach) + * [.onUpdate(event)](#MRSystem+onUpdate) + * [.onDetach(event)](#MRSystem+onDetach) + + + +### mrSystem.MRSystem +**Kind**: instance class of [MRSystem](#MRSystem) + + +#### new exports.MRSystem(useComponents, frameRate) +Constructor for MRSystem. Sets up appropriate document event listeners, component defaults, and system defaults that will be used for system runs ever frame. + + +| Param | Type | Default | Description | +| --- | --- | --- | --- | +| useComponents | boolean | true | Default to true. Determines whether comonents need to be maintained (attached/updated/detached) with the system. | +| frameRate | number | | Default to null. When set, used and updated as part of the System's update function. | + + + +### mrSystem.onRegister(app) +Called when a new entity is added to the scene + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| app | object | the app the system is registered to. | + + + +### mrSystem.onUnregister(app) +Called when the system is registered to an app is added. + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| app | object | the app the system is registered to. | + + + +### mrSystem.\_update(deltaTime, frame) +The actual system update call. + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### mrSystem.update(deltaTime, frame) +The generic system update call per render-frame. + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### mrSystem.eventUpdate() +An event triggered update, called when any global scene level events occur. +See GLOBAL_UPDATE_EVENTS of MRSystem.js + +**Kind**: instance method of [MRSystem](#MRSystem) + + +### mrSystem.\_onNewEntity(entity) +internal function, called when a new entity is added to the scene + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being added. | + + + +### mrSystem.onNewEntity(entity) +Called when a new entity is added to the scene + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being added. | + + + +### mrSystem.\_entityRemoved(entity) +internal function, called when a new entity is added to the scene + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being added. | + + + +### mrSystem.entityRemoved(entity) +Called when a new entity is added to the scene + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being added. | + + + +### mrSystem.attachedComponent(entity) +(async) Called when the entity component is initialized + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being attached/initialized. | + + + +### mrSystem.updatedComponent(entity, oldData) +Called when a specific entity component is being updated + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated | +| oldData | object | the | + + + +### mrSystem.detachedComponent(entity) +Called when the entity component is removed + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity component being removed. | + + + +### mrSystem.onAttach(event) +(async) Handles the component and registry aspect of the event when an entity component attaches to this system. + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| event | object | the attach event | + + + +### mrSystem.onUpdate(event) +Handles the component and registry update of the even when an entity component needs to change. + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| event | object | the update event | + + + +### mrSystem.onDetach(event) +Handles the component and registry aspect of the even when an entity component detaches from this system. + +**Kind**: instance method of [MRSystem](#MRSystem) + +| Param | Type | Description | +| --- | --- | --- | +| event | object | the detach event | + diff --git a/v-saved/all-saved/main/source/js-api/002MRApp.md b/v-saved/all-saved/main/source/js-api/002MRApp.md new file mode 100644 index 0000000..654a435 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/002MRApp.md @@ -0,0 +1,189 @@ +--- +title: MRApp +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/MRApp.js +--- +# MRApp + + + +## MRApp โ‡ MRElement +The engine handler for running MRjs as an App. `mr-app` + +**Kind**: global class +**Extends**: MRElement + +* [MRApp](#MRApp) โ‡ MRElement + * _instance_ + * [.MRApp](#MRApp+MRApp) + * [new exports.MRApp()](#new_MRApp+MRApp_new) + * [.appWidth()](#MRApp+appWidth) โ‡’ number + * [.appHeight()](#MRApp+appHeight) โ‡’ number + * [.mutatedAttribute(mutation)](#MRApp+mutatedAttribute) + * [.mutatedChildList(mutation)](#MRApp+mutatedChildList) + * [.mutationCallback(mutationList, observer)](#MRApp+mutationCallback) + * [.init()](#MRApp+init) + * [.initCamera()](#MRApp+initCamera) + * [.initLights(data)](#MRApp+initLights) + * [.denit()](#MRApp+denit) + * [.registerSystem(system)](#MRApp+registerSystem) + * [.unregisterSystem(system)](#MRApp+unregisterSystem) + * [.add(entity)](#MRApp+add) + * [.removeEntity(entity)](#MRApp+removeEntity) + * [.onWindowResize()](#MRApp+onWindowResize) + * [.render(timeStamp, frame)](#MRApp+render) + * _static_ + * [.Connected()](#MRApp.Connected) + * [.Disconnected()](#MRApp.Disconnected) + + + +### mrApp.MRApp +**Kind**: instance class of [MRApp](#MRApp) + + +#### new exports.MRApp() +Constructs the base information of the app including system, camera, engine, xr, and rendering defaults. + + + +### mrApp.appWidth() โ‡’ number +**Kind**: instance method of [MRApp](#MRApp) +**Returns**: number - width in 3d or pixel space (depending on if in xr) of the current open app + + +### mrApp.appHeight() โ‡’ number +**Kind**: instance method of [MRApp](#MRApp) +**Returns**: number - height in 3d or pixel space (depending on if in xr) of the current open app + + +### mrApp.mutatedAttribute(mutation) +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| mutation | object | TODO | + + + +### mrApp.mutatedChildList(mutation) +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| mutation | object | TODO | + + + +### mrApp.mutationCallback(mutationList, observer) +The mutationCallback function that runs whenever this entity component should be mutated. + +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| mutationList | object | the list of update/change/mutation(s) to be handled. | +| observer | object | w3 standard object that watches for changes on the HTMLElement | + + + +### mrApp.init() +Initializes the engine state for the MRApp. This function is run whenever the MRApp is connected. + +**Kind**: instance method of [MRApp](#MRApp) + + +### mrApp.initCamera() +Initializes the user information for the MRApp including appropriate HMD direction and camera information and the default scene anchor location. + +**Kind**: instance method of [MRApp](#MRApp) + + +### mrApp.initLights(data) +Initializes default lighting and shadows for the main scene. + +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| data | object | the lights data (color, intensity, shadows, etc) | + + + +### mrApp.denit() +De-initializes rendering and MR + +**Kind**: instance method of [MRApp](#MRApp) + + +### mrApp.registerSystem(system) +Registers a new system addition to the MRApp engine. + +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| system | MRSystem | the system to be added. | + + + +### mrApp.unregisterSystem(system) +Unregisters a system from the MRApp engine. + +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| system | MRSystem | the system to be removed. | + + + +### mrApp.add(entity) +Adding an entity as an object in this MRApp engine's scene. + +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity to be added. | + + + +### mrApp.removeEntity(entity) +Removing an entity as an object in this MRApp engine's scene. + +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity to be removed. | + + + +### mrApp.onWindowResize() +Handles what is necessary rendering, camera, and user-wise when the viewing window is resized. + +**Kind**: instance method of [MRApp](#MRApp) + + +### mrApp.render(timeStamp, frame) +Default function header needed by threejs. The render function that is called during ever frame. Calls every systems' update function. + +**Kind**: instance method of [MRApp](#MRApp) + +| Param | Type | Description | +| --- | --- | --- | +| timeStamp | number | timeStamp of the current frame. | +| frame | object | given frame information to be used for any feature changes | + + + +### MRApp.Connected() +The connectedCallback function that runs whenever this entity component becomes connected to something else. + +**Kind**: static method of [MRApp](#MRApp) + + +### MRApp.Disconnected() +The disconnectedCallback function that runs whenever this entity component becomes connected to something else. + +**Kind**: static method of [MRApp](#MRApp) diff --git a/v-saved/all-saved/main/source/js-api/003MRUser.md b/v-saved/all-saved/main/source/js-api/003MRUser.md new file mode 100644 index 0000000..6a68a1d --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/003MRUser.md @@ -0,0 +1,41 @@ +--- +title: MRUser +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/user/MRUser.js +--- +# MRUser + +## Classes + +
+
MRUser
+
+
+ +## Functions + +
+
initSpotlight() โ‡’ object
+

Initializes the spotlight associated with the user's pov.

+
+
update()
+

The update function for a user, its spotlight, and its hands.

+
+
+ + + +## MRUser +**Kind**: global class + + +## initSpotlight() โ‡’ object +Initializes the spotlight associated with the user's pov. + +**Kind**: global function +**Returns**: object - spotlight - the spotlight to be used. + + +## update() +The update function for a user, its spotlight, and its hands. + +**Kind**: global function diff --git a/v-saved/all-saved/main/source/js-api/004MRHand.md b/v-saved/all-saved/main/source/js-api/004MRHand.md new file mode 100644 index 0000000..74764c8 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/004MRHand.md @@ -0,0 +1,130 @@ +--- +title: MRHand +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/user/MRHand.js +--- +# MRHand + + + +## MRHand +Class describing the MRHand object representing the UX of the hand object for MR interactions. + +**Kind**: global class +**Properties** + +| Name | Type | Description | +| --- | --- | --- | +| pinch | boolean | Indicates if the hand is in a pinch gesture. | +| jointPhysicsBodies | object | Physics bodies associated with the hand joints. | +| identityPosition | THREE.Vector3 | A reference position for the hand. | +| tempJointPosition | THREE.Vector3 | Temporary storage for a joint's position. | +| tempJointOrientation | THREE.Quaternion | Temporary storage for a joint's orientation. | +| controllerModelFactory | XRControllerModelFactory | Factory for creating controller models. | +| handModelFactory | XRHandModelFactory | Factory for creating hand models. | +| mesh | THREE.Mesh | The 3D mesh representing the hand. | +| controller | THREE.Object3D | The controller object. | +| grip | THREE.Object3D | The grip associated with the controller. | +| hand | THREE.Object3D | The 3D object representing the hand. | +| model | THREE.Object3D | The model of the hand. | + + +* [MRHand](#MRHand) + * [.MRHand](#MRHand+MRHand) + * [new exports.MRHand(handedness, scene)](#new_MRHand+MRHand_new) + * [.initPhysicsBodies()](#MRHand+initPhysicsBodies) + * [.update()](#MRHand+update) + * [.pinchMoved()](#MRHand+pinchMoved) + * [.updatePhysicsBodies()](#MRHand+updatePhysicsBodies) + * [.setMesh()](#MRHand+setMesh) + * [.onSelect(event)](#MRHand+onSelect) + * [.getJointOrientation(jointName)](#MRHand+getJointOrientation) โ‡’ THREE.Quaternion + * [.getJointPosition(jointName)](#MRHand+getJointPosition) โ‡’ THREE.Vector3 + * [.getCursorPosition()](#MRHand+getCursorPosition) โ‡’ number + + + +### mrHand.MRHand +**Kind**: instance class of [MRHand](#MRHand) + + +#### new exports.MRHand(handedness, scene) +Constructor for the MRHand class object. Setups up all attributes for MRHand including physics, mouse/cursor information, hand tracking and state, and model + + +| Param | Type | Description | +| --- | --- | --- | +| handedness | object | enum for the `left`` or `right` hand. | +| scene | object | the threejs scene object with information from the MRApp. | + + + +### mrHand.initPhysicsBodies() +Initializes the physics bodies that the hand represents. Useful for collision detection and UX interactions in MR space. + +**Kind**: instance method of [MRHand](#MRHand) + + +### mrHand.update() +Update function for the Hand object. Updates the physics bodies and checks whether a pinch has happened or is in progress in any way. + +**Kind**: instance method of [MRHand](#MRHand) + + +### mrHand.pinchMoved() +If a pinch happens, updates the MR cursor position while sending out an event that movement has occured from this hand. + +**Kind**: instance method of [MRHand](#MRHand) + + +### mrHand.updatePhysicsBodies() +Update function for the physics associated with this hand. Runs for every joint in the system and moves all elements of the hand model. + +**Kind**: instance method of [MRHand](#MRHand) + + +### mrHand.setMesh() +Handles the setMesh callback. + +**Kind**: instance method of [MRHand](#MRHand) + + +### mrHand.onSelect(event) +Handles the onSelect event + +**Kind**: instance method of [MRHand](#MRHand) + +| Param | Type | Description | +| --- | --- | --- | +| event | event | the on pinch event object | + + + +### mrHand.getJointOrientation(jointName) โ‡’ THREE.Quaternion +Gets the joint orientation of the named joint in the hand. + +**Kind**: instance method of [MRHand](#MRHand) +**Returns**: THREE.Quaternion - - the quaternion representation or the joint orientation. + +| Param | Type | Description | +| --- | --- | --- | +| jointName | string | the string name of the joint whose information is requested. | + + + +### mrHand.getJointPosition(jointName) โ‡’ THREE.Vector3 +Gets the joint position of the named joint in the hand. + +**Kind**: instance method of [MRHand](#MRHand) +**Returns**: THREE.Vector3 - - the position representation or the joint orientation. + +| Param | Type | Description | +| --- | --- | --- | +| jointName | string | the string name of the joint whose information is requested. | + + + +### mrHand.getCursorPosition() โ‡’ number +Gets the expected cursor position of this hand based on the index finger and thumb's tip positions. + +**Kind**: instance method of [MRHand](#MRHand) +**Returns**: number - - the resolved position of the cursor. diff --git a/v-saved/all-saved/main/source/js-api/005BoundaryVisibilitySystem.md b/v-saved/all-saved/main/source/js-api/005BoundaryVisibilitySystem.md new file mode 100644 index 0000000..a9b61da --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/005BoundaryVisibilitySystem.md @@ -0,0 +1,80 @@ +--- +title: BoundaryVisibilitySystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/BoundaryVisibilitySystem.js +--- +# BoundaryVisibilitySystem + +## Classes + +
+
BoundaryVisibilitySystem โ‡ MRSystem
+

Makes the entities invisible if they are outside of their parent panels

+
+
+ +## Functions + +
+
observe(root, target) โ‡’ IntersectionObserver
+

Observe a target MRDivEntity and make the associated object visible only if it is in visible position in a root MRDivEntity

+
+
+ + + +## BoundaryVisibilitySystem โ‡ MRSystem +Makes the entities invisible if they are outside of their parent panels + +**Kind**: global class +**Extends**: MRSystem + +* [BoundaryVisibilitySystem](#BoundaryVisibilitySystem) โ‡ MRSystem + * [.BoundaryVisibilitySystem](#BoundaryVisibilitySystem+BoundaryVisibilitySystem) + * [new exports.BoundaryVisibilitySystem()](#new_BoundaryVisibilitySystem+BoundaryVisibilitySystem_new) + * [.onNewEntity(entity)](#BoundaryVisibilitySystem+onNewEntity) + * [._entityRemoved(entity)](#BoundaryVisibilitySystem+_entityRemoved) + + + +### boundaryVisibilitySystem.BoundaryVisibilitySystem +**Kind**: instance class of [BoundaryVisibilitySystem](#BoundaryVisibilitySystem) + + +#### new exports.BoundaryVisibilitySystem() +BoundaryVisibilitySystem's default constructor. + + + +### boundaryVisibilitySystem.onNewEntity(entity) +Called when a new entity is added to the scene. + +**Kind**: instance method of [BoundaryVisibilitySystem](#BoundaryVisibilitySystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being added. | + + + +### boundaryVisibilitySystem.\_entityRemoved(entity) +Called when an entity is removed from the scene. + +**Kind**: instance method of [BoundaryVisibilitySystem](#BoundaryVisibilitySystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being added. | + + + +## observe(root, target) โ‡’ IntersectionObserver +Observe a target MRDivEntity and make the associated object visible only if it is in visible position in a root MRDivEntity + +**Kind**: global function +**Returns**: IntersectionObserver - - an observer for tracking visiblity + +| Param | Type | Description | +| --- | --- | --- | +| root | MRDivEntity | the root object being compared against | +| target | MRDivEntity | the target object for which we're determining visiblity. | + diff --git a/v-saved/all-saved/main/source/js-api/006InstancingSystem.md b/v-saved/all-saved/main/source/js-api/006InstancingSystem.md new file mode 100644 index 0000000..ee4f280 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/006InstancingSystem.md @@ -0,0 +1,66 @@ +--- +title: InstancingSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/InstancingSystem.js +--- +# InstancingSystem + + + +## InstancingSystem โ‡ MRSystem +System that allows for instancing of meshes based on a given entity where the instances can be modified separately. + +**Kind**: global class +**Extends**: MRSystem + +* [InstancingSystem](#InstancingSystem) โ‡ MRSystem + * [.InstancingSystem](#InstancingSystem+InstancingSystem) + * [new exports.InstancingSystem()](#new_InstancingSystem+InstancingSystem_new) + * [.update(deltaTime, frame)](#InstancingSystem+update) + * [.attachedComponent(entity)](#InstancingSystem+attachedComponent) + * [.random(entity)](#InstancingSystem+random) + + + +### instancingSystem.InstancingSystem +**Kind**: instance class of [InstancingSystem](#InstancingSystem) + + +#### new exports.InstancingSystem() +InstancingSystem's default constructor that sets up default instancing count, transformations, and mesh information. + + + +### instancingSystem.update(deltaTime, frame) +The generic system update call. Updates the entity and its instances to their appropriate transformations and visuals + based on the picked predefined option. + +**Kind**: instance method of [InstancingSystem](#InstancingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### instancingSystem.attachedComponent(entity) +Determines what meshes are attached from this entity and When a component is attached. +Setups up instancing based on the predefined setup option and the entity's geometry (handling properly whether that be a group or mesh). + +**Kind**: instance method of [InstancingSystem](#InstancingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity with the geometry to be instanced and the chosen setup option | + + + +### instancingSystem.random(entity) +An option for default instancing. Places the given entity instancing it at a bunch of random transformation locations.Uses threejs's `InstancedMesh`. + +**Kind**: instance method of [InstancingSystem](#InstancingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity to be instanced in random locations | + diff --git a/v-saved/all-saved/main/source/js-api/007AudioSystem.md b/v-saved/all-saved/main/source/js-api/007AudioSystem.md new file mode 100644 index 0000000..6e19935 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/007AudioSystem.md @@ -0,0 +1,89 @@ +--- +title: AudioSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/AudioSystem.js +--- +# AudioSystem + + + +## AudioSystem โ‡ MRSystem +This system manages spatial audio in the THREE.js scene. + +**Kind**: global class +**Extends**: MRSystem + +* [AudioSystem](#AudioSystem) โ‡ MRSystem + * [.AudioSystem](#AudioSystem+AudioSystem) + * [new exports.AudioSystem()](#new_AudioSystem+AudioSystem_new) + * [.update(deltaTime, frame)](#AudioSystem+update) + * [.attachedComponent(entity)](#AudioSystem+attachedComponent) + * [.updatedComponent(entity)](#AudioSystem+updatedComponent) + * [.detachedComponent(entity)](#AudioSystem+detachedComponent) + * [.setAudioState(entity, comp)](#AudioSystem+setAudioState) + + + +### audioSystem.AudioSystem +**Kind**: instance class of [AudioSystem](#AudioSystem) + + +#### new exports.AudioSystem() +AudioSystem's Default constructor that sets up the audio listener and loader + + + +### audioSystem.update(deltaTime, frame) +The generic system update call. Updates the clipped view of every entity in this system's registry. + +**Kind**: instance method of [AudioSystem](#AudioSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### audioSystem.attachedComponent(entity) +Called when the entity component is initialized + +**Kind**: instance method of [AudioSystem](#AudioSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being attached/initialized. | + + + +### audioSystem.updatedComponent(entity) +Called when the entity component is updated + +**Kind**: instance method of [AudioSystem](#AudioSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being updated based on the component. | + + + +### audioSystem.detachedComponent(entity) +Called when the entity component is detached + +**Kind**: instance method of [AudioSystem](#AudioSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being updated based on the component being detached. | + + + +### audioSystem.setAudioState(entity, comp) +Updates the Audio State based on the user passed 'state' variable. + +**Kind**: instance method of [AudioSystem](#AudioSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being updated based on the component being detached. | +| comp | object | component that contains the value of 'action' | + diff --git a/v-saved/all-saved/main/source/js-api/008SkyBoxSystem.md b/v-saved/all-saved/main/source/js-api/008SkyBoxSystem.md new file mode 100644 index 0000000..702220c --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/008SkyBoxSystem.md @@ -0,0 +1,52 @@ +--- +title: SkyBoxSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/SkyBoxSystem.js +--- +# SkyBoxSystem + + + +## SkyBoxSystem โ‡ MRSystem +Handles skybox interactions and updates for all items. + +**Kind**: global class +**Extends**: MRSystem + +* [SkyBoxSystem](#SkyBoxSystem) โ‡ MRSystem + * [.SkyBoxSystem](#SkyBoxSystem+SkyBoxSystem) + * [new exports.SkyBoxSystem()](#new_SkyBoxSystem+SkyBoxSystem_new) + * [.update(deltaTime, frame)](#SkyBoxSystem+update) + * [.onNewEntity(entity)](#SkyBoxSystem+onNewEntity) + + + +### skyBoxSystem.SkyBoxSystem +**Kind**: instance class of [SkyBoxSystem](#SkyBoxSystem) + + +#### new exports.SkyBoxSystem() +SkyBox's default constructor + + + +### skyBoxSystem.update(deltaTime, frame) +The generic system update call. + +**Kind**: instance method of [SkyBoxSystem](#SkyBoxSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### skyBoxSystem.onNewEntity(entity) +Called when a new entity is added to the scene. Adds said new entity to the style's system registry. + +**Kind**: instance method of [SkyBoxSystem](#SkyBoxSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being added. | + diff --git a/v-saved/all-saved/main/source/js-api/009PhysicsSystem.md b/v-saved/all-saved/main/source/js-api/009PhysicsSystem.md new file mode 100644 index 0000000..6d4f92d --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/009PhysicsSystem.md @@ -0,0 +1,183 @@ +--- +title: PhysicsSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/PhysicsSystem.js +--- +# PhysicsSystem + + + +## PhysicsSystem โ‡ MRSystem +The physics system functions differently from other systems, +Rather than attaching components, physical properties such as +shape, body, mass, etc are definied as attributes. +if shape and body are not defined, they default to the geometry +of the entity, if there is no geometry, there is no physics defined +on the entity. + +Alternatively, you can also expressly attach a comp-physics +attribute for more detailed control. + +**Kind**: global class +**Extends**: MRSystem + +* [PhysicsSystem](#PhysicsSystem) โ‡ MRSystem + * [.PhysicsSystem](#PhysicsSystem+PhysicsSystem) + * [new exports.PhysicsSystem()](#new_PhysicsSystem+PhysicsSystem_new) + * [.eventUpdate()](#PhysicsSystem+eventUpdate) + * [.entityEventUpdate(e)](#PhysicsSystem+entityEventUpdate) + * [.update(deltaTime, frame)](#PhysicsSystem+update) + * [.onNewEntity(entity)](#PhysicsSystem+onNewEntity) + * [.entityRemoved(entity)](#PhysicsSystem+entityRemoved) + * [.initPhysicsBody(entity)](#PhysicsSystem+initPhysicsBody) + * [.initUIEntityBody(entity)](#PhysicsSystem+initUIEntityBody) + * [.initSimpleBody(entity)](#PhysicsSystem+initSimpleBody) + * [.initDetailedBody(entity)](#PhysicsSystem+initDetailedBody) + * [.updateBody(entity)](#PhysicsSystem+updateBody) + * [.updateUIBody(entity)](#PhysicsSystem+updateUIBody) + * [.updateSimpleBody(entity)](#PhysicsSystem+updateSimpleBody) + * [.updateDebugRenderer()](#PhysicsSystem+updateDebugRenderer) + + + +### physicsSystem.PhysicsSystem +**Kind**: instance class of [PhysicsSystem](#PhysicsSystem) + + +#### new exports.PhysicsSystem() +PhysicsSystem's default constructor - sets up useful world and debug information alongside an initial `Rapier` event queue. + + + +### physicsSystem.eventUpdate() +The per global scene event update call. Based on the captured physics events for the frame, handles all items appropriately. + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + + +### physicsSystem.entityEventUpdate(e) +a function called when a specific entity has an event update + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| e | Event | the event generated by the entity | + + + +### physicsSystem.update(deltaTime, frame) +The per-frame system update call. Based on the captured physics events for the frame, handles all items appropriately. + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### physicsSystem.onNewEntity(entity) +When a new entity is created, adds it to the physics registry and initializes the physics aspects of the entity. + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being set up | + + + +### physicsSystem.entityRemoved(entity) +when an entity is removed, remove and destroy it's physics body + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the removed entity | + + + +### physicsSystem.initPhysicsBody(entity) +Initializes the rigid body used by the physics part of the entity + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated | + + + +### physicsSystem.initUIEntityBody(entity) +Initializes the rigid body used by the physics for non-nr-model div entities + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated | + + + +### physicsSystem.initSimpleBody(entity) +Initializes a simple bounding box collider based on the visual bounds of the entity + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated | + + + +### physicsSystem.initDetailedBody(entity) +Initializes a Rigid Body detailed convexMesh collider for the entity +NOTE: not currently in use until we can sync it with animations + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated | + + + +### physicsSystem.updateBody(entity) +Updates the rigid body used by the physics part of the entity + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated | + + + +### physicsSystem.updateUIBody(entity) +Updates the rigid body used by the physics part of the div entity + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated | + + + +### physicsSystem.updateSimpleBody(entity) +Updates the rigid body used by the physics part of the model entity + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated | + + + +### physicsSystem.updateDebugRenderer() +Updates the debug renderer to either be on or off based on the 'this.debug' variable. Handles the drawing of the visual lines. + +**Kind**: instance method of [PhysicsSystem](#PhysicsSystem) diff --git a/v-saved/all-saved/main/source/js-api/010MaskingSystem.md b/v-saved/all-saved/main/source/js-api/010MaskingSystem.md new file mode 100644 index 0000000..03abcdf --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/010MaskingSystem.md @@ -0,0 +1,103 @@ +--- +title: MaskingSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/MaskingSystem.js +--- +# MaskingSystem + +## Classes + +
+
MaskingSystem โ‡ MRSystem
+

Handles specific needs for setting up the masking for all necessary items.

+
+
+ +## Functions + +
+
setupMaskingMaterial(material, shiftBit, debug)
+

Setting up a material for an object that maskes other elements

+
+
setupMaskedMaterial(material, shiftBit)
+

Setting up a material for an object that is masked by another element

+
+
+ + + +## MaskingSystem โ‡ MRSystem +Handles specific needs for setting up the masking for all necessary items. + +**Kind**: global class +**Extends**: MRSystem + +* [MaskingSystem](#MaskingSystem) โ‡ MRSystem + * [.MaskingSystem](#MaskingSystem+MaskingSystem) + * [new exports.MaskingSystem()](#new_MaskingSystem+MaskingSystem_new) + * [.update(deltaTime, frame)](#MaskingSystem+update) + * [.sync()](#MaskingSystem+sync) + * [.onNewEntity(entity)](#MaskingSystem+onNewEntity) + + + +### maskingSystem.MaskingSystem +**Kind**: instance class of [MaskingSystem](#MaskingSystem) + + +#### new exports.MaskingSystem() +MaskingSystem's default constructor. + + + +### maskingSystem.update(deltaTime, frame) +... + +**Kind**: instance method of [MaskingSystem](#MaskingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### maskingSystem.sync() +Copy the source world matrices to the objects writing to stencil buffer + +**Kind**: instance method of [MaskingSystem](#MaskingSystem) + + +### maskingSystem.onNewEntity(entity) +Called when a new entity is added to the scene. Handles masking elements to their panel. + +**Kind**: instance method of [MaskingSystem](#MaskingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being added. | + + + +## setupMaskingMaterial(material, shiftBit, debug) +Setting up a material for an object that maskes other elements + +**Kind**: global function + +| Param | Type | Default | Description | +| --- | --- | --- | --- | +| material | THREE.Material | | the material whose values are augmented to mask as expected. | +| shiftBit | number | | used to offset the stencilWriteMask and stencilRef. | +| debug | boolean | false | true if in debug mode, false otherwise | + + + +## setupMaskedMaterial(material, shiftBit) +Setting up a material for an object that is masked by another element + +**Kind**: global function + +| Param | Type | Description | +| --- | --- | --- | +| material | THREE.Material | the material whose values are augmented to mask as expected. | +| shiftBit | number | used to offset the stencilWriteMask and stencilRef. | + diff --git a/v-saved/all-saved/main/source/js-api/011ClippingSystem.md b/v-saved/all-saved/main/source/js-api/011ClippingSystem.md new file mode 100644 index 0000000..ce4218c --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/011ClippingSystem.md @@ -0,0 +1,103 @@ +--- +title: ClippingSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/ClippingSystem.js +--- +# ClippingSystem + + + +## ClippingSystem โ‡ MRSystem +This system supports 3D clipping following threejs's clipping planes setup. + See https://threejs.org/docs/?q=material#api/en/materials/Material.clippingPlanes for more information. + +**Kind**: global class +**Extends**: MRSystem + +* [ClippingSystem](#ClippingSystem) โ‡ MRSystem + * [.ClippingSystem](#ClippingSystem+ClippingSystem) + * [new exports.ClippingSystem()](#new_ClippingSystem+ClippingSystem_new) + * [.update(deltaTime, frame)](#ClippingSystem+update) + * [.updatePlanes(entity)](#ClippingSystem+updatePlanes) + * [.applyClipping(entity, clipping)](#ClippingSystem+applyClipping) + * [.addClippingPlanes(entity)](#ClippingSystem+addClippingPlanes) + * [.entityEventUpdate(e)](#ClippingSystem+entityEventUpdate) + * [.onNewEntity(entity)](#ClippingSystem+onNewEntity) + + + +### clippingSystem.ClippingSystem +**Kind**: instance class of [ClippingSystem](#ClippingSystem) + + +#### new exports.ClippingSystem() +ClippingSystem's default constructor that sets up coplanar points and the default clipping information. + + + +### clippingSystem.update(deltaTime, frame) +The generic system update call. Updates the clipped view of every entity in this system's registry. + +**Kind**: instance method of [ClippingSystem](#ClippingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### clippingSystem.updatePlanes(entity) +Updates the stored clipping planes to be based on the passed in entity. + +**Kind**: instance method of [ClippingSystem](#ClippingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | given entity that will be used to create the clipping planes positioning. | + + + +### clippingSystem.applyClipping(entity, clipping) +Helper method for `onNewEntity`. Actually applies the clipping planes to the material setup for rendering. +Uses threejs in the background following https://threejs.org/docs/?q=material#api/en/materials/Material.clippingPlanes + +**Kind**: instance method of [ClippingSystem](#ClippingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity to be clipped | +| clipping | MRClippingGeometry | the clipping information to be passed to the material | + + + +### clippingSystem.addClippingPlanes(entity) +Helper method for `onNewEntity`. Creates a clipping planes information (still writing this description) + +**Kind**: instance method of [ClippingSystem](#ClippingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity to which we're adding the clipping planes information | + + + +### clippingSystem.entityEventUpdate(e) +a function called when a specific entity has an event update + +**Kind**: instance method of [ClippingSystem](#ClippingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| e | Event | the event generated by the entity | + + + +### clippingSystem.onNewEntity(entity) +When the system swaps to a new entity, this handles applying the clipping planes as needed in the system run. + +**Kind**: instance method of [ClippingSystem](#ClippingSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | given entity that will be clipped by the planes. | + diff --git a/v-saved/all-saved/main/source/js-api/012GeometryStyleSystem.md b/v-saved/all-saved/main/source/js-api/012GeometryStyleSystem.md new file mode 100644 index 0000000..f2a72dc --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/012GeometryStyleSystem.md @@ -0,0 +1,110 @@ +--- +title: GeometryStyleSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/GeometryStyleSystem.js +--- +# GeometryStyleSystem + + + +## GeometryStyleSystem โ‡ MRSystem +Handles geometry updates for all items. + +**Kind**: global class +**Extends**: MRSystem + +* [GeometryStyleSystem](#GeometryStyleSystem) โ‡ MRSystem + * [.GeometryStyleSystem](#GeometryStyleSystem+GeometryStyleSystem) + * [new exports.GeometryStyleSystem()](#new_GeometryStyleSystem+GeometryStyleSystem_new) + * [._updateSpecificEntity(entity)](#GeometryStyleSystem+_updateSpecificEntity) + * [.eventUpdate()](#GeometryStyleSystem+eventUpdate) + * [.update(deltaTime, frame)](#GeometryStyleSystem+update) + * [.onNewEntity(entity)](#GeometryStyleSystem+onNewEntity) + * [.setScale(entity)](#GeometryStyleSystem+setScale) โ‡’ boolean + * [.setUpdatedBorder(entity)](#GeometryStyleSystem+setUpdatedBorder) โ‡’ boolean + * [.setUpdatedMediaPlane(entity)](#GeometryStyleSystem+setUpdatedMediaPlane) โ‡’ boolean + + + +### geometryStyleSystem.GeometryStyleSystem +**Kind**: instance class of [GeometryStyleSystem](#GeometryStyleSystem) + + +#### new exports.GeometryStyleSystem() +StyleSystem's default constructor with a starting framerate of 1/30. + + + +### geometryStyleSystem.\_updateSpecificEntity(entity) +The per entity triggered update call. Handles updating all 3D items to match whatever geometry/style is expected whether that be a 2D setup or a 3D change. + +**Kind**: instance method of [GeometryStyleSystem](#GeometryStyleSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the MREntity to be updated by this function. | + + + +### geometryStyleSystem.eventUpdate() +The per global scene event update call. Handles updating all 3D items to match whatever geometry/style is expected whether that be a 2D setup or a 3D change. + +**Kind**: instance method of [GeometryStyleSystem](#GeometryStyleSystem) + + +### geometryStyleSystem.update(deltaTime, frame) +The per-frame system update call. + +**Kind**: instance method of [GeometryStyleSystem](#GeometryStyleSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### geometryStyleSystem.onNewEntity(entity) +Called when a new entity is added to the scene. Adds said new entity to the style's system registry. + +**Kind**: instance method of [GeometryStyleSystem](#GeometryStyleSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being added. | + + + +### geometryStyleSystem.setScale(entity) โ‡’ boolean +Sets the scale of the MREntity based on its css scale value, otherwise defaults to 1. + +**Kind**: instance method of [GeometryStyleSystem](#GeometryStyleSystem) +**Returns**: boolean - true if updated, false otherwise. + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the MREntity to be updated by this function. | + + + +### geometryStyleSystem.setUpdatedBorder(entity) โ‡’ boolean +Sets the border of the UI based on compStyle and inputted css elements. + +**Kind**: instance method of [GeometryStyleSystem](#GeometryStyleSystem) +**Returns**: boolean - true if updated, false otherwise + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the MREntity to be updated by this function. | + + + +### geometryStyleSystem.setUpdatedMediaPlane(entity) โ‡’ boolean +Updates the Media Plane for this geometry. Specific to the MRMedia subclasses. + +**Kind**: instance method of [GeometryStyleSystem](#GeometryStyleSystem) +**Returns**: boolean - true if updated, false otherwise + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the MRMediaEntity to be updated by this function. | + diff --git a/v-saved/all-saved/main/source/js-api/013MaterialStyleSystem.md b/v-saved/all-saved/main/source/js-api/013MaterialStyleSystem.md new file mode 100644 index 0000000..3b2a169 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/013MaterialStyleSystem.md @@ -0,0 +1,88 @@ +--- +title: MaterialStyleSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/MaterialStyleSystem.js +--- +# MaterialStyleSystem + + + +## MaterialStyleSystem โ‡ MRSystem +Handles style updates for all items. + +**Kind**: global class +**Extends**: MRSystem + +* [MaterialStyleSystem](#MaterialStyleSystem) โ‡ MRSystem + * [.MaterialStyleSystem](#MaterialStyleSystem+MaterialStyleSystem) + * [new exports.MaterialStyleSystem()](#new_MaterialStyleSystem+MaterialStyleSystem_new) + * [._updateSpecificEntity(entity)](#MaterialStyleSystem+_updateSpecificEntity) + * [.update(deltaTime, frame)](#MaterialStyleSystem+update) + * [.onNewEntity(entity)](#MaterialStyleSystem+onNewEntity) + * [.setBackground(entity)](#MaterialStyleSystem+setBackground) + * [.setVisibility(entity)](#MaterialStyleSystem+setVisibility) + + + +### materialStyleSystem.MaterialStyleSystem +**Kind**: instance class of [MaterialStyleSystem](#MaterialStyleSystem) + + +#### new exports.MaterialStyleSystem() +StyleSystem's default constructor with a starting framerate of 1/30. + + + +### materialStyleSystem.\_updateSpecificEntity(entity) +The per entity triggered update call. Handles updating all 3D items to match whatever geometry/style is expected whether that be a 2D setup or a 3D change. + +**Kind**: instance method of [MaterialStyleSystem](#MaterialStyleSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the MREntity being updated. | + + + +### materialStyleSystem.update(deltaTime, frame) +The per-frame system update call. Handles updating all 3D items to match whatever geometry/style is expected whether that be a 2D setup or a 3D change. + +**Kind**: instance method of [MaterialStyleSystem](#MaterialStyleSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### materialStyleSystem.onNewEntity(entity) +Called when a new entity is added to the scene. Adds said new entity to the style's system registry. + +**Kind**: instance method of [MaterialStyleSystem](#MaterialStyleSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the MREntity being touched by this function. | + + + +### materialStyleSystem.setBackground(entity) +Sets the background based on compStyle and inputted css elements. + +**Kind**: instance method of [MaterialStyleSystem](#MaterialStyleSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the MREntity being updated. | + + + +### materialStyleSystem.setVisibility(entity) +Sets the visibility of the MREntity based on its css 'visibility' property. + +**Kind**: instance method of [MaterialStyleSystem](#MaterialStyleSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the MREntity being updated. | + diff --git a/v-saved/all-saved/main/source/js-api/014TextSystem.md b/v-saved/all-saved/main/source/js-api/014TextSystem.md new file mode 100644 index 0000000..4fb0684 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/014TextSystem.md @@ -0,0 +1,199 @@ +--- +title: TextSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/TextSystem.js +--- +# TextSystem + + + +## TextSystem โ‡ MRSystem +Handles text creation and font rendering for `mr-text`, `mr-textfield`, and `mr-textarea` with a starting framerate of 1/30. + +**Kind**: global class +**Extends**: MRSystem + +* [TextSystem](#TextSystem) โ‡ MRSystem + * [.TextSystem](#TextSystem+TextSystem) + * [new exports.TextSystem()](#new_TextSystem+TextSystem_new) + * [.onNewEntity(entity)](#TextSystem+onNewEntity) + * [._updateSpecificEntity(entity)](#TextSystem+_updateSpecificEntity) + * [.checkIfTextContentChanged(entity)](#TextSystem+checkIfTextContentChanged) โ‡’ boolean + * [.handleTextContentUpdate(entity)](#TextSystem+handleTextContentUpdate) + * [.eventUpdate()](#TextSystem+eventUpdate) + * [.updateStyle(entity)](#TextSystem+updateStyle) + * [.addText(entity)](#TextSystem+addText) + * [.parseFontWeight(weight)](#TextSystem+parseFontWeight) โ‡’ string + * [.parseFontSize(val, el)](#TextSystem+parseFontSize) โ‡’ number + * [.getVerticalAlign(verticalAlign, entity)](#TextSystem+getVerticalAlign) โ‡’ string + * [.getLineHeight(lineHeight, entity)](#TextSystem+getLineHeight) โ‡’ number + * [.getTextAlign(textAlign)](#TextSystem+getTextAlign) โ‡’ string + * [.parseFontFace(cssString)](#TextSystem+parseFontFace) โ‡’ object + * [.setTextObject3DColor(object3D, color, default_color)](#TextSystem+setTextObject3DColor) + + + +### textSystem.TextSystem +**Kind**: instance class of [TextSystem](#TextSystem) + + +#### new exports.TextSystem() +TextSystem's default constructor + + + +### textSystem.onNewEntity(entity) +When a new entity is created, adds it to the physics registry and initializes the physics aspects of the entity. + +**Kind**: instance method of [TextSystem](#TextSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being set up | + + + +### textSystem.\_updateSpecificEntity(entity) +The per entity triggered update call. Handles updating all text items including updates for style and cleaning of content for special characters. + +**Kind**: instance method of [TextSystem](#TextSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity that needs to be updated. | + + + +### textSystem.checkIfTextContentChanged(entity) โ‡’ boolean +**Kind**: instance method of [TextSystem](#TextSystem) +**Returns**: boolean - true if the content needed to be updated, false otherwise. + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | checks if the content changed and if so, updates it to match. | + + + +### textSystem.handleTextContentUpdate(entity) +**Kind**: instance method of [TextSystem](#TextSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity whose content updated. | + + + +### textSystem.eventUpdate() +The per global scene event update call. Handles updating all text items including updates for style and cleaning of content for special characters. + +**Kind**: instance method of [TextSystem](#TextSystem) + + +### textSystem.updateStyle(entity) +Updates the style for the text's information based on compStyle and inputted css elements. + +**Kind**: instance method of [TextSystem](#TextSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MRTextEntity | the text entity whose style is being updated | + + + +### textSystem.addText(entity) +Handles when text is added as an entity updating content and style for the internal textObj appropriately. + +**Kind**: instance method of [TextSystem](#TextSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MRTextEntity | the text entity being updated | + + + +### textSystem.parseFontWeight(weight) โ‡’ string +parses the font weight as 'bold', 'normal', etc based on the given weight value + +**Kind**: instance method of [TextSystem](#TextSystem) +**Returns**: string - - the enum of 'bold', 'normal', etc + +| Param | Type | Description | +| --- | --- | --- | +| weight | number | the numerical representation of the font-weight | + + + +### textSystem.parseFontSize(val, el) โ‡’ number +parses the font size based on its `XXpx` value and converts it to a usable result based on the virtual display resolution + +**Kind**: instance method of [TextSystem](#TextSystem) +**Returns**: number - - the font size adjusted for the display as expected + +| Param | Type | Description | +| --- | --- | --- | +| val | number | the value being adjusted | +| el | object | the css element handler | + + + +### textSystem.getVerticalAlign(verticalAlign, entity) โ‡’ string +Gets the vertical align + +**Kind**: instance method of [TextSystem](#TextSystem) +**Returns**: string - - the string representation of the the verticalAlign + +| Param | Type | Description | +| --- | --- | --- | +| verticalAlign | number | the numerical representation in pixel space of the vertical Align | +| entity | MREntity | the entity whose comp style (css) is relevant | + + + +### textSystem.getLineHeight(lineHeight, entity) โ‡’ number +Gets the line height + +**Kind**: instance method of [TextSystem](#TextSystem) +**Returns**: number - - the numerical representation of the the lineHeight + +| Param | Type | Description | +| --- | --- | --- | +| lineHeight | number | the numerical representation in pixel space of the line height | +| entity | MREntity | the entity whose comp style (css) is relevant | + + + +### textSystem.getTextAlign(textAlign) โ‡’ string +Gets the text alignment string + +**Kind**: instance method of [TextSystem](#TextSystem) +**Returns**: string - - the resolved `textAlign`. + +| Param | Type | Description | +| --- | --- | --- | +| textAlign | string | handles values for `start`, `end`, `left`, and `right`; otherwise, defaults to the same input as `textAlign`. | + + + +### textSystem.parseFontFace(cssString) โ‡’ object +Based on the given font-face value in the passed cssString, tries to either use by default or download the requested font-face + for use by the text object. + +**Kind**: instance method of [TextSystem](#TextSystem) +**Returns**: object - - json object respresenting the preloaded font-face + +| Param | Type | Description | +| --- | --- | --- | +| cssString | string | the css string to be parsed for the font-face css value. | + + + +### textSystem.setTextObject3DColor(object3D, color, default_color) +Sets the text object3D color. + +**Kind**: instance method of [TextSystem](#TextSystem) + +| Param | Type | Description | +| --- | --- | --- | +| object3D | object | the threejs object representation of the troika textt to be colored | +| color | string | the string representation of the color in rgba, hex, or name ('red') form | +| default_color | string | fallback color used if the system does not understand the color parameter. Defaults to black. | + diff --git a/v-saved/all-saved/main/source/js-api/015LayoutSystem.md b/v-saved/all-saved/main/source/js-api/015LayoutSystem.md new file mode 100644 index 0000000..5b659b5 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/015LayoutSystem.md @@ -0,0 +1,64 @@ +--- +title: LayoutSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/LayoutSystem.js +--- +# LayoutSystem + + + +## LayoutSystem โ‡ MRSystem +System that allows for setup and handling of changing layout. + +**Kind**: global class +**Extends**: MRSystem + +* [LayoutSystem](#LayoutSystem) โ‡ MRSystem + * [.LayoutSystem](#LayoutSystem+LayoutSystem) + * [new exports.LayoutSystem()](#new_LayoutSystem+LayoutSystem_new) + * [.onNewEntity(entity)](#LayoutSystem+onNewEntity) + * [.update(deltaTime, frame)](#LayoutSystem+update) + * [.setLayoutPosition(entity)](#LayoutSystem+setLayoutPosition) + + + +### layoutSystem.LayoutSystem +**Kind**: instance class of [LayoutSystem](#LayoutSystem) + + +#### new exports.LayoutSystem() +Constructor for the layout system. Uses the default System setup. + + + +### layoutSystem.onNewEntity(entity) +Called when a new entity is added to this system + +**Kind**: instance method of [LayoutSystem](#LayoutSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being added. | + + + +### layoutSystem.update(deltaTime, frame) +The generic system update call. Handles updating all 3D items to match whatever layout position is expected. + +**Kind**: instance method of [LayoutSystem](#LayoutSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### layoutSystem.setLayoutPosition(entity) +Helper function for the update call. Sets the entity's appropriate 3D layout position based on window and entity expectations. + +**Kind**: instance method of [LayoutSystem](#LayoutSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | the entity being updated. | + diff --git a/v-saved/all-saved/main/source/js-api/016AnimationSystem.md b/v-saved/all-saved/main/source/js-api/016AnimationSystem.md new file mode 100644 index 0000000..6a92b7f --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/016AnimationSystem.md @@ -0,0 +1,106 @@ +--- +title: AnimationSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/AnimationSystem.js +--- +# AnimationSystem + + + +## AnimationSystem โ‡ MRSystem +Handles specific needs for setting up the masking for all necessary items. + +**Kind**: global class +**Extends**: MRSystem + +* [AnimationSystem](#AnimationSystem) โ‡ MRSystem + * [.AnimationSystem](#AnimationSystem+AnimationSystem) + * [new exports.AnimationSystem()](#new_AnimationSystem+AnimationSystem_new) + * [.update(deltaTime, frame)](#AnimationSystem+update) + * [.attachedComponent(entity)](#AnimationSystem+attachedComponent) + * [.updatedComponent(entity)](#AnimationSystem+updatedComponent) + * [.detachedComponent(entity)](#AnimationSystem+detachedComponent) + * [.onNewEntity(entity)](#AnimationSystem+onNewEntity) + * [.setAnimation(entity, comp)](#AnimationSystem+setAnimation) + + + +### animationSystem.AnimationSystem +**Kind**: instance class of [AnimationSystem](#AnimationSystem) + + +#### new exports.AnimationSystem() +AnimationSystem's default constructor. + + + +### animationSystem.update(deltaTime, frame) +Updates each animation mixer in the registry. This function should be called + within the main animation loop of the application. It iterates through all the + animation mixers stored in the registry and updates them with the given deltaTime. + The deltaTime parameter is typically the time elapsed since the last frame + which is used to ensure smooth animation playback. + +**Kind**: instance method of [AnimationSystem](#AnimationSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | The time elapsed since the last update call, used to update the animation mixers. | +| frame | object | Additional frame information, not used in the current implementation but can be utilized for future enhancements. | + + + +### animationSystem.attachedComponent(entity) +(async) Called when the entity component is initialized + +**Kind**: instance method of [AnimationSystem](#AnimationSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being attached/initialized. | + + + +### animationSystem.updatedComponent(entity) +Called when the entity component is updated + +**Kind**: instance method of [AnimationSystem](#AnimationSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being updated based on the component. | + + + +### animationSystem.detachedComponent(entity) +Called when the entity component is detached + +**Kind**: instance method of [AnimationSystem](#AnimationSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being updated based on the component being detached. | + + + +### animationSystem.onNewEntity(entity) +When the system swaps to a new entity, this handles setting up the animations for the system runs. + +**Kind**: instance method of [AnimationSystem](#AnimationSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | given entity that might be handled by the system. | + + + +### animationSystem.setAnimation(entity, comp) +Sets the Animation of the entity object based on the component value associated with it. Otherwise lets those +be handled by the threejs default setup. (Always looping, always playing based on browser type, etc). + +**Kind**: instance method of [AnimationSystem](#AnimationSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being updated based on the component being detached. | +| comp | object | component that contains the values of 'action', 'loop', and/or 'loopMode' | + diff --git a/v-saved/all-saved/main/source/js-api/017ControlSystem.md b/v-saved/all-saved/main/source/js-api/017ControlSystem.md new file mode 100644 index 0000000..e16950e --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/017ControlSystem.md @@ -0,0 +1,206 @@ +--- +title: ControlSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/ControlSystem.js +--- +# ControlSystem + + + +## ControlSystem โ‡ MRSystem +This system supports interaction event information including mouse and controller interfacing. + +**Kind**: global class +**Extends**: MRSystem + +* [ControlSystem](#ControlSystem) โ‡ MRSystem + * [.ControlSystem](#ControlSystem+ControlSystem) + * [new exports.ControlSystem()](#new_ControlSystem+ControlSystem_new) + * [.update(deltaTime, frame)](#ControlSystem+update) + * [.checkCollisions(hand)](#ControlSystem+checkCollisions) + * [.onContactStart(handle1, handle2)](#ControlSystem+onContactStart) + * [.onContactEnd(handle1, handle2)](#ControlSystem+onContactEnd) + * [.touchStart(collider1, collider2, entity)](#ControlSystem+touchStart) + * [.touchEnd(entity)](#ControlSystem+touchEnd) + * [.hoverStart(collider1, collider2, entity)](#ControlSystem+hoverStart) + * [.hoverEnd(entity)](#ControlSystem+hoverEnd) + * [.pointerRay()](#ControlSystem+pointerRay) + * [.clearPointer()](#ControlSystem+clearPointer) + * [.mouseOver(event)](#ControlSystem+mouseOver) + * [.onMouseDown(event)](#ControlSystem+onMouseDown) + * [.onMouseUp(event)](#ControlSystem+onMouseUp) + * [.interact(entity)](#ControlSystem+interact) + * [.pixelRayCast(event)](#ControlSystem+pixelRayCast) โ‡’ object + + + +### controlSystem.ControlSystem +**Kind**: instance class of [ControlSystem](#ControlSystem) + + +#### new exports.ControlSystem() +ControlSystem's Default constructor that sets up the app's mouse information along with any relevant physics and cursor information. + + + +### controlSystem.update(deltaTime, frame) +The generic system update call. Updates the meshes and states for both the left and right hand visuals. + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### controlSystem.checkCollisions(hand) +Check for any collisions with this MRHand and the rapier physics world. + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| hand | object | the MRHand object whose collisions we are checking with this function. | + + + +### controlSystem.onContactStart(handle1, handle2) +Handles the start of collisions between two different colliders. + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| handle1 | number | the first collider | +| handle2 | number | the second collider | + + + +### controlSystem.onContactEnd(handle1, handle2) +Handles the end of collisions between two different colliders. + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| handle1 | number | the first collider | +| handle2 | number | the second collider | + + + +### controlSystem.touchStart(collider1, collider2, entity) +Handles the start of touch between two different colliders and the current entity. + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| collider1 | number | the first collider | +| collider2 | number | the second collider | +| entity | object | the current entity | + + + +### controlSystem.touchEnd(entity) +Handles the end of touch for the current entity + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the current entity | + + + +### controlSystem.hoverStart(collider1, collider2, entity) +Handles the start of hovering over/around a specific entity. + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| collider1 | number | the first collider | +| collider2 | number | the second collider | +| entity | object | the current entity | + + + +### controlSystem.hoverEnd(entity) +Handles the end of hovering over/around a specific entity. + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the current entity | + + + +### controlSystem.pointerRay() +Fills in the this.origin,direction,ray, and hit values based on the rapier world + +**Kind**: instance method of [ControlSystem](#ControlSystem) + + +### controlSystem.clearPointer() +clears the gaze/pinch pointer from the scene + +**Kind**: instance method of [ControlSystem](#ControlSystem) + + +### controlSystem.mouseOver(event) +Handles the mouse over event + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| event | event | the mouse over event | + + + +### controlSystem.onMouseDown(event) +Handles the mouse down event + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| event | event | the mouse down event | + + + +### controlSystem.onMouseUp(event) +Handles the mouse up event + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| event | event | the mouse up event | + + + +### controlSystem.interact(entity) +Checks what kind of interactions should happen based on the current entity and any events that +have happened so far. + +**Kind**: instance method of [ControlSystem](#ControlSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | checking if there is any interaction required based on current events and this entity. | + + + +### controlSystem.pixelRayCast(event) โ‡’ object +Raycast into the scene using the information from the event that called it. + +**Kind**: instance method of [ControlSystem](#ControlSystem) +**Returns**: object - - collision item for what the ray hit in the 3d scene. + +| Param | Type | Description | +| --- | --- | --- | +| event | object | the event being handled | + diff --git a/v-saved/all-saved/main/source/js-api/018StatsSystem.md b/v-saved/all-saved/main/source/js-api/018StatsSystem.md new file mode 100644 index 0000000..4b4f6bd --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/018StatsSystem.md @@ -0,0 +1,51 @@ +--- +title: StatsSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/StatsSystem.js +--- +# StatsSystem + + + +## StatsSystem โ‡ MRSystem +Track the elapsed time across frames and update the fps counter periodically for `mr-stats`. + +**Kind**: global class +**Extends**: MRSystem + +* [StatsSystem](#StatsSystem) โ‡ MRSystem + * [.StatsSystem](#StatsSystem+StatsSystem) + * [new exports.StatsSystem()](#new_StatsSystem+StatsSystem_new) + * [.onNewEntity(entity)](#StatsSystem+onNewEntity) + * [.update(deltaTime)](#StatsSystem+update) + + + +### statsSystem.StatsSystem +**Kind**: instance class of [StatsSystem](#StatsSystem) + + +#### new exports.StatsSystem() +StatsSystem's default constructor + + + +### statsSystem.onNewEntity(entity) +Registers MRStatsEntity + +**Kind**: instance method of [StatsSystem](#StatsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | MREntity | given entity that might be handled by this system | + + + +### statsSystem.update(deltaTime) +Tracks the elapsed time and updates the fps counter periodically. + +**Kind**: instance method of [StatsSystem](#StatsSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | the time elapsed since the last update call | + diff --git a/v-saved/all-saved/main/source/js-api/019PanelSystem.md b/v-saved/all-saved/main/source/js-api/019PanelSystem.md new file mode 100644 index 0000000..fb0f50d --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/019PanelSystem.md @@ -0,0 +1,13 @@ +--- +title: PanelSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/PanelSystem.js +--- +# PanelSystem + + + +## PanelManagementSystem โ‡ MRSystem +A system that manages the screen relative position of UI panels + +**Kind**: global class +**Extends**: MRSystem diff --git a/v-saved/all-saved/main/source/js-api/020AnchorSystem.md b/v-saved/all-saved/main/source/js-api/020AnchorSystem.md new file mode 100644 index 0000000..19a96f8 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/020AnchorSystem.md @@ -0,0 +1,203 @@ +--- +title: AnchorSystem +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/componentSystems/AnchorSystem.js +--- +# AnchorSystem + + + +## AnchorSystem โ‡ MRSystem +creates and manages WebXR anchors in the MR scene. + +**Kind**: global class +**Extends**: MRSystem + +* [AnchorSystem](#AnchorSystem) โ‡ MRSystem + * [.AnchorSystem](#AnchorSystem+AnchorSystem) + * [new exports.AnchorSystem()](#new_AnchorSystem+AnchorSystem_new) + * [.update(deltaTime, frame)](#AnchorSystem+update) + * [.attachedComponent(entity)](#AnchorSystem+attachedComponent) + * [.updatedComponent(entity)](#AnchorSystem+updatedComponent) + * [.detachedComponent(entity)](#AnchorSystem+detachedComponent) + * [.deleteAnchor(entity)](#AnchorSystem+deleteAnchor) + * [.createAnchor(entity, comp)](#AnchorSystem+createAnchor) + * [.setAppOrigin()](#AnchorSystem+setAppOrigin) + * [.updateOrigin(frame)](#AnchorSystem+updateOrigin) + * [.fixed(entity)](#AnchorSystem+fixed) + * [.floating(frame)](#AnchorSystem+floating) + * [.plane(entity, comp)](#AnchorSystem+plane) + * [.adjustTransform(xrRigidTransform, origin)](#AnchorSystem+adjustTransform) โ‡’ object + * [.matrix4ToXRRigidTransform(matrix4)](#AnchorSystem+matrix4ToXRRigidTransform) โ‡’ object + * [.multiplyQuaternionWithXRRigidTransform(quaternion, xrRigidTransform)](#AnchorSystem+multiplyQuaternionWithXRRigidTransform) โ‡’ object + + + +### anchorSystem.AnchorSystem +**Kind**: instance class of [AnchorSystem](#AnchorSystem) + + +#### new exports.AnchorSystem() +AnchorSystem's default constructor including setting up event listeners for XR initialization, user interaction, and the MRPlaneManager + + + +### anchorSystem.update(deltaTime, frame) +This update function maintains the transforms of anchored entities. +This overrides any other transform values set on the element when in mixed reality. + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| deltaTime | number | given timestep to be used for any feature changes | +| frame | object | given frame information to be used for any feature changes | + + + +### anchorSystem.attachedComponent(entity) +Called when the entity component is initialized + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being attached/initialized. | + + + +### anchorSystem.updatedComponent(entity) +Called when the entity component is updated + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being updated based on the component. | + + + +### anchorSystem.detachedComponent(entity) +Called when the entity component is detached + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being updated based on the component being detached. | + + + +### anchorSystem.deleteAnchor(entity) +deletes anchors from the scene and removes all references to the anchored plane (if any) + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity whose anchor is being deleted. | + + + +### anchorSystem.createAnchor(entity, comp) +creates the anchor specified by the data-anchor-comp + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity whose anchor is being created. | +| comp | object | the data component with a type value that represents the string 'fixed', 'plane', 'floating', etc | + + + +### anchorSystem.setAppOrigin() +Sets the origin of the MRApp being touched by all systems to allow anchoring to position +itself properly. + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + + +### anchorSystem.updateOrigin(frame) +Updates the origin of the MRApp being touched by all systems to allow anchoring to position. + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| frame | object | given frame information to be used for any feature changes (from the update(..) loop) | + + + +### anchorSystem.fixed(entity) +Anchors the given entity half a meter in front of the users position at launch. + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being positioned. | + + + +### anchorSystem.floating(frame) +Creates an anchor at the position specified by the user, +either floating in front of them or pinned to the scene mesh + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| frame | object | given frame information to be used for any feature changes (from the update(..) loop) | + + + +### anchorSystem.plane(entity, comp) +Anchors the provided entity to the nearest unoccupied plane that meets the given orientation and label. +each plane is currently limited to one anchor for simplicity. + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) + +| Param | Type | Description | +| --- | --- | --- | +| entity | object | the entity being anchored by this function. | +| comp | object | the data-component to determine the orientation and label of the associated plane | + + + +### anchorSystem.adjustTransform(xrRigidTransform, origin) โ‡’ object +converts the provided XRRigidTransform to a Matrix4 and adjusts it to ensure +that it's y-axis is pointing directly up and it's z-axis is facing inward + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) +**Returns**: object - a new adjusted THREE.js Matrix4 + +| Param | Type | Default | Description | +| --- | --- | --- | --- | +| xrRigidTransform | object | | a THREE.js transformation matrix that we want to adjust | +| origin | boolean | false | true if this is positioned at the origin or not (handles special case of div-0). | + + + +### anchorSystem.matrix4ToXRRigidTransform(matrix4) โ‡’ object +Converts the provided matrix4 into a webXR xompatible XRRigidTransform + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) +**Returns**: object - xrRigidTransform - the converted representation of the param matrix4 + +| Param | Type | Description | +| --- | --- | --- | +| matrix4 | object | the matrix we want to convert to a XRRigidTransform | + + + +### anchorSystem.multiplyQuaternionWithXRRigidTransform(quaternion, xrRigidTransform) โ‡’ object +Multiplies an xr rigid transform by the provided quaternion + +**Kind**: instance method of [AnchorSystem](#AnchorSystem) +**Returns**: object - xrRigidTransform - the output of the quaternion * xrRigidTransform in the form of an xrRigidTransform + +| Param | Type | Description | +| --- | --- | --- | +| quaternion | object | the quaternion we want to multiply with the xrRigidTransform | +| xrRigidTransform | object | the second part of the multiplication we are looking to perform. | + diff --git a/v-saved/all-saved/main/source/js-api/021MREntity.md b/v-saved/all-saved/main/source/js-api/021MREntity.md new file mode 100644 index 0000000..401fa02 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/021MREntity.md @@ -0,0 +1,250 @@ +--- +title: MREntity +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/MREntity.js +--- +# MREntity + + + +## MREntity โ‡ MRElement +The default representation of an MRElement to be expanded upon by actual details ECS Entity items. `mr-entity` + +**Kind**: global class +**Extends**: MRElement + +* [MREntity](#MREntity) โ‡ MRElement + * [.MREntity](#MREntity+MREntity) + * [new exports.MREntity()](#new_MREntity+MREntity_new) + * [.width()](#MREntity+width) โ‡’ number + * [.contentWidth()](#MREntity+contentWidth) โ‡’ number + * [.height()](#MREntity+height) โ‡’ number + * [.contentHeight()](#MREntity+contentHeight) โ‡’ number + * [.triggerGeometryStyleUpdate()](#MREntity+triggerGeometryStyleUpdate) + * [.triggerMaterialStyleUpdate()](#MREntity+triggerMaterialStyleUpdate) + * [.updateMaterialStyle()](#MREntity+updateMaterialStyle) + * [.updateGeometryStyle()](#MREntity+updateGeometryStyle) + * [.onHover(event)](#MREntity+onHover) + * [.onTouch(event)](#MREntity+onTouch) + * [.onScroll(event)](#MREntity+onScroll) + * [.loadAttributes()](#MREntity+loadAttributes) + * [.connected()](#MREntity+connected) + * [.connectedCallback()](#MREntity+connectedCallback) + * [.disconnected()](#MREntity+disconnected) + * [.disconnectedCallback()](#MREntity+disconnectedCallback) + * [.mutated(mutation)](#MREntity+mutated) + * [.mutationCallback(mutationList, observer)](#MREntity+mutationCallback) + * [.componentMutated(mutation)](#MREntity+componentMutated) + * [.add(entity)](#MREntity+add) + * [.removeEntity(entity)](#MREntity+removeEntity) + * [.traverse(callBack)](#MREntity+traverse) + * [.traverseObjects(callBack)](#MREntity+traverseObjects) + + + +### mrEntity.MREntity +**Kind**: instance class of [MREntity](#MREntity) + + +#### new exports.MREntity() +Constructor for the default Entity Component (MREntity). + Sets up the base object3D and useful Mixed Reality information including rendering, touching, and component basics. + + + +### mrEntity.width() โ‡’ number +Calculates the width of the Entity based on the viewPort's shape. If in Mixed Reality, adjusts the value appropriately. + +**Kind**: instance method of [MREntity](#MREntity) +**Returns**: number - - the resolved width + + +### mrEntity.contentWidth() โ‡’ number +The actual 3D value of the content's width. + +**Kind**: instance method of [MREntity](#MREntity) +**Returns**: number - - width of the 3D object. + + +### mrEntity.height() โ‡’ number +Calculates the height of the Entity based on the viewPort's shape. If in Mixed Reality, adjusts the value appropriately. + +**Kind**: instance method of [MREntity](#MREntity) +**Returns**: number - - the resolved height + + +### mrEntity.contentHeight() โ‡’ number +The actual 3D value of the content's height. + +**Kind**: instance method of [MREntity](#MREntity) +**Returns**: number - - height of the 3D object. + + +### mrEntity.triggerGeometryStyleUpdate() +Triggers a system run to update geometry specifically for the entity calling it. Useful when it's not an overall scene event and for cases where +relying on an overall scene or all items to update isnt beneficial. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.triggerMaterialStyleUpdate() +Triggers a system run to update material specifically for the entity calling it. Useful when it's not an overall scene event and for cases where +relying on an overall scene or all items to update isnt beneficial. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.updateMaterialStyle() +Directly in MRjs, this function is empty. It is called directly in the +MaterialStyleSystem. This allows outside users to add their own additional functionality +for the entities. These are run after the MaterialStyleSystem does its own update on the entity. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.updateGeometryStyle() +Directly in MRjs, this function is empty. It is called directly in the +GeometryStyleSystem. This allows outside users to add their own additional functionality +for the entities. These are run after the GeometryStyleSystem does its own update on the entity. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.onHover(event) +Handles the hover event + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| event | object | the hover event | + + + +### mrEntity.onTouch(event) +Handles the touch event + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| event | object | the touch event | + + + +### mrEntity.onScroll(event) +Handles the scroll event + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| event | object | the scroll event | + + + +### mrEntity.loadAttributes() +Loads all attributes of this entity's stored dataset including components, attaching them, and their associated rotations and positions. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.connected() +(async) does nothing. Is called by the connectedCallback. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.connectedCallback() +The connectedCallback function that runs whenever this entity component becomes connected to something else. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.disconnected() +Callback function of MREntity - does nothing. Is called by the disconnectedCallback. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.disconnectedCallback() +The disconnectedCallback function that runs whenever this entity component becomes disconnected from something else. + +**Kind**: instance method of [MREntity](#MREntity) + + +### mrEntity.mutated(mutation) +Callback function of MREntity - does nothing. Is called by mutation Callback. + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| mutation | object | the update/change/mutation to be handled. | + + + +### mrEntity.mutationCallback(mutationList, observer) +The mutationCallback function that runs whenever this entity component should be mutated. + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| mutationList | object | the list of update/change/mutation(s) to be handled. | +| observer | object | w3 standard object that watches for changes on the HTMLElement | + + + +### mrEntity.componentMutated(mutation) +Helper function for the mutationCallback. Handles actually updating this entity component with all the associated dispatchEvents. + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| mutation | object | the update/change/mutation to be handled. | + + + +### mrEntity.add(entity) +Adding an entity as a sub-object of this entity. + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| entity | [MREntity](#MREntity) | the entity to be added. | + + + +### mrEntity.removeEntity(entity) +Removing an entity as a sub-object of this entity. + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| entity | [MREntity](#MREntity) | the entity to be removed. | + + + +### mrEntity.traverse(callBack) +Runs the passed through function on this object and every child of this object. + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| callBack | function | the function to run recursively. | + + + +### mrEntity.traverseObjects(callBack) +Runs the passed through function on the objects associated with this Entity + +**Kind**: instance method of [MREntity](#MREntity) + +| Param | Type | Description | +| --- | --- | --- | +| callBack | function | the function to run recursively. | + diff --git a/v-saved/all-saved/main/source/js-api/022MRVolumeEntity.md b/v-saved/all-saved/main/source/js-api/022MRVolumeEntity.md new file mode 100644 index 0000000..c4dbf7a --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/022MRVolumeEntity.md @@ -0,0 +1,36 @@ +--- +title: MRVolumeEntity +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/entities/MRVolumeEntity.js +--- +# MRVolumeEntity + + + +## MRVolumeEntity โ‡ MREntity +Representation of a visible region in 3D space. Models and other entities can move +throughout the space and leave the space, yet will only be rendered in the visual area of +the volume. From a conceptual perspective it is considered a โ€˜clipping volumeโ€™. + +**Kind**: global class +**Extends**: MREntity + +* [MRVolumeEntity](#MRVolumeEntity) โ‡ MREntity + * [.MRVolumeEntity](#MRVolumeEntity+MRVolumeEntity) + * [new exports.MRVolumeEntity()](#new_MRVolumeEntity+MRVolumeEntity_new) + * [.connected()](#MRVolumeEntity+connected) + + + +### mrVolumeEntity.MRVolumeEntity +**Kind**: instance class of [MRVolumeEntity](#MRVolumeEntity) + + +#### new exports.MRVolumeEntity() +Creates the volume as a base THREE.js object3D + + + +### mrVolumeEntity.connected() +(async) handles creating clipping geometry around the entire volume for visible restrictions. + +**Kind**: instance method of [MRVolumeEntity](#MRVolumeEntity) diff --git a/v-saved/all-saved/main/source/js-api/023MRTextAreaEntity.md b/v-saved/all-saved/main/source/js-api/023MRTextAreaEntity.md new file mode 100644 index 0000000..6750024 --- /dev/null +++ b/v-saved/all-saved/main/source/js-api/023MRTextAreaEntity.md @@ -0,0 +1,85 @@ +--- +title: MRTextAreaEntity +github-path: https://github.com/volumetrics-io/mrjs/edit/main/src/core/entities/MRTextAreaEntity.js +--- +# MRTextAreaEntity + + + +## MRTextAreaEntity โ‡ MRTextInputEntity +The text area element that simulates the behavior of an HTML