8000 feat: add selected model store with click for selecting logic by toddeTV · Pull Request #28 · toddeTV/zlig · GitHub
[go: up one dir, main page]

Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add selected model store with click for selecting logic #28

Merged
merged 51 commits into from
Aug 16, 2024
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
51 commits
Select commit Hold shift + click to select a range
f240fe2
feat: add test scene
toddeTV Jul 14, 2024
c3b4d6b
Merge branch 'dev' into feat/3d-node-click-poc
toddeTV Jul 15, 2024
a924f5a
fix: TresJS dependency version upgrade bc the current one had a bug
toddeTV Jul 15, 2024
637e067
feat: add dependency `@tresjs/post-processing`
toddeTV Jul 15, 2024
ffb0f6e
feat: add pinia store for storing the current clicked & active model
toddeTV Jul 15, 2024
2ccaae4
feat: clicking a model node will store the model UUID in the pinia store
toddeTV Jul 15, 2024
42a199b
create script to generate types for gltf models
fehnomenal Jul 15, 2024
3284cca
rework script
fehnomenal Jul 15, 2024
3d2956f
generate model types also on build
fehnomenal Jul 15, 2024
fefb2ee
generate types for models in assets
fehnomenal Jul 16, 2024
b963ccf
add vite plugin to bundle model files
fehnomenal Jul 16, 2024
16c8826
inline hardcoded default values
fehnomenal Jul 16, 2024
9237295
Merge branch 'dev' into feat/typed-models
fehnomenal Jul 16, 2024
075e5df
lint
fehnomenal Jul 16, 2024
3c7ebe7
Merge branch 'dev' into feat/typed-models
toddeTV Jul 23, 2024
806d057
feat: add documentation to `README.md`
toddeTV Jul 23, 2024
cb9507c
refactor: changing pnpm command script names
toddeTV Jul 23, 2024
0845571
refactor: lint
toddeTV Jul 23, 2024
9c3b636
refactor: nit doc comment length
toddeTV Jul 23, 2024
dd1db4f
Merge branch 'dev' into feat/3d-node-click-poc
toddeTV Jul 23, 2024
1b03dda
Merge branch 'feat/typed-models' into feat/3d-node-click-poc
toddeTV Jul 23, 2024
eb5fd29
chore: remove not needed test scene model
toddeTV Jul 23, 2024
d4768fd
feat: add dependency `postprocessing`
toddeTV Jul 23, 2024
eb47dd7
feat: adding outline effect composer with store that stores full obj
toddeTV Jul 23, 2024
5bd778c
fix: remove non existing import
toddeTV Jul 23, 2024
1a17841
feat: make the model node store capable of storing multiple at once
toddeTV Jul 23, 2024
0c30ea0
feat: for selected objects store the ID and not the UUID
toddeTV Jul 23, 2024
112c9bc
feat: extracted scene & added converting selected object IDs to objects
toddeTV Jul 23, 2024
31b1048
feat: add TresJS click event type
toddeTV Jul 23, 2024
ea97cdd
chore: cleanup including refactoring, fixing & disable post processing
toddeTV Jul 23, 2024
6ba93e1
revert: things that should not be part of this branch
toddeTV Jul 23, 2024
2fc02ff
feat: deselect a node when clicked again while it is selected
toddeTV Jul 23, 2024
4641a22
Merge branch 'dev' into feat/3d-node-click-poc
toddeTV Aug 12, 2024
eb3ff7b
chore: removed ThreeJS & TresJS postprocessing bc the TresJS is outdated
toddeTV Aug 12, 2024
c9e61ef
revert: changes that should not be part of this branch
toddeTV Aug 12, 2024
1bb3dab
feat: make the selected model object ID variable a `Set`
toddeTV Aug 12, 2024
4194dd5
feat: add better selected node store with saving objects helper fns
toddeTV Aug 12, 2024
643d49c
feat: add unselecting all models when clicking on nothing
toddeTV Aug 12, 2024
5106127
refactor: selected model store name
toddeTV Aug 12, 2024
156c3e5
feat: add store for selectable models
toddeTV Aug 12, 2024
02e2fef
feat: unselect when a non selectable model is clicked
toddeTV Aug 12, 2024
310e44e
feat: only one model is now selectable at the same time
toddeTV Aug 12, 2024
b58079d
feat: improved debug for selected and registered for selected models
toddeTV Aug 12, 2024
460ff13
feat: for registered selectable models only store the ID for performance
toddeTV Aug 12, 2024
a0135ed
feat: add helper function to check if something is selected
toddeTV Aug 12, 2024
61c29bf
feat: extend debug with button for moving the selected model
toddeTV Aug 12, 2024
fde3854
doc: add documentation to all store helper functions
toddeTV Aug 12, 2024
bacb7b9
refactor: remove unused code
toddeTV Aug 12, 2024
b9bb401
Merge branch 'dev' into feat/3d-node-click-poc
toddeTV Aug 12, 2024
7dcc065
fix: downgrading the `@tresjs/core` version bc of bug #33
toddeTV Aug 12, 2024
6afef81
chore: update all ThreeJS & TresJS dependency versions
toddeTV Aug 12, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8000
Prev Previous commit
Next Next commit
doc: add documentation to all store helper functions
  • Loading branch information
toddeTV committed Aug 12, 2024
commit fde38540af393a3590a64dc7acb10f85d5770421
34 changes: 33 additions & 1 deletion src/composables/useRegisteredForSelectingModelStore.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,34 @@ import type { Object3D } from 'three'
import { reactive } from 'vue'

export default defineStore('registeredForSelectingModelStore', () => {
// store only the `id` of the `Object3D` object for performance reasons
// Store only the `id` of the `Object3D` object for performance reasons
const registered = reactive(new Set<number>())

/**
* Retrieves all registered Object3D IDs.
*
* @returns {number[]} - An array of registered Object3D IDs.
*/
function getRegisteredAll(): number[] {
return Array.from(registered)
}

/**
* Checks if the given Object3D instance is registered.
*
* @param {Object3D} obj - The Object3D instance to check.
* @returns {boolean} - Returns true if the Object3D instance is registered, otherwise false.
*/
function isRegistered(obj: Object3D): boolean {
return registered.has(getObject3DId(obj))
}

/**
* Registers the given Object3D instance.
*
* @param {Object3D} obj - The Object3D instance to register.
* @returns {boolean} - Returns true if the Object3D instance was successfully registered, otherwise false.
*/
function register(obj: Object3D): boolean {
if (isRegistered(obj)) {
return false
Expand All @@ -22,6 +39,12 @@ export default defineStore('registeredForSelectingModelStore', () => {
return true
}

/**
* Unregisters the given Object3D instance.
*
* @param {Object3D} obj - The Object3D instance to unregister.
* @returns {boolean} - Returns true if the Object3D instance was successfully unregistered, otherwise false.
*/
function unregister(obj: Object3D): boolean {
if (!isRegistered(obj)) {
return false
Expand All @@ -30,10 +53,19 @@ export default defineStore('registeredForSelectingModelStore', () => {
return true
}

/**
* Unregisters all Object3D instances.
*/
function unregisterAll() {
registered.clear()
}

/**
* Retrieves the ID of the given Object3D instance.
*
* @param {Object3D} obj - The Object3D instance to get the ID from.
* @returns {number} - The ID of the Object3D instance.
*/
function getObject3DId(obj: Object3D): number {
return obj.id
}
Expand Down
53 changes: 48 additions & 5 deletions src/composables/useSelectedModelsStore.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,25 +6,49 @@ import useRegisteredForSelectingModelStore from '@/composables/useRegisteredForS
export default defineStore('selectedModelsStore', () => {
const registeredForSelectingModelStore = useRegisteredForSelectingModelStore()

// Store the real `Object3D` object for faster access without converting e.g. a stored `id: number` first
// back to the real object. Also, we would need the scene's `useContext()` to get the real object
// via `<context>.getObjectById(id: number): Object3D | undefined`.
// We use `reactive` instead of `ref` bc it is deeper reactive into the object. But bc a reactive can't be
// set again, we must wrap the one object we want to store in a data structure like an Array, Set, ...
/*
Store the real `Object3D` object for faster access without converting e.g. a stored `id: number` first
back to the real object. Also, we would need the scene's `useTresContext()` to get the real object
via `<context>.getObjectById(id: number): Object3D | undefined`.
We use `reactive` instead of `ref` bc it is deeper reactive into the object. But bc a reactive can't be
set again, we must wrap the one object we want to store in a data structure like an Array, Set, ...
*/
const selected = reactive(new Set<Object3D>())

/**
* Function to get the selected Object3D instance.
*
* @returns {Object3D | undefined} - The selected Object3D instance or undefined if none is selected.
*/
function getSelected(): Object3D | undefined {
return Array.from(selected)[0]
}

/**
* Checks if the given Object3D instance is the currently selected one.
*
* @param {Object3D} obj - The Object3D instance to check.
* @returns {boolean} - Returns true if the given Object3D instance is selected, otherwise false.
*/
function isSelected(obj: Object3D): boolean {
return getSelected()?.id === obj.id
}

/**
* Checks if there is any Object3D instance selected.
*
* @returns {boolean} - Returns true if there is at least one Object3D instance selected, otherwise false.
*/
function hasSelected(): boolean {
return selected.size > 0
}

/**
* Selects the given Object3D instance if it is registered.
*
* @param {Object3D} obj - The Object3D instance to select.
* @returns {boolean} - Returns true if the object was successfully selected, otherwise false.
*/
function select(obj: Object3D): boolean {
if (!registeredForSelectingModelStore.isRegistered(obj)) {
return false
Expand All @@ -34,6 +58,12 @@ export default defineStore('selectedModelsStore', () => {
return true
}

/**
* Unselects the given Object3D instance if it is currently selected.
*
* @param {Object3D} obj - The Object3D instance to unselect.
* @returns {boolean} - Returns true if the object was successfully unselected, otherwise false.
*/
function unselect(obj: Object3D): boolean {
if (!isSelected(obj)) {
return false
Expand All @@ -42,11 +72,24 @@ export default defineStore('selectedModelsStore', () => {
return true
}

/**
* Unselects all currently selected Object3D instances.
*
* @returns {boolean} - Returns true if all objects were successfully unselected.
*/
function unselectAll(): boolean {
selected.clear()
return true
}

/**
* Toggles the selection state of the given Object3D instance.
* If the object is currently selected, it will be unselected.
* If the object is not currently selected, it will be selected.
*
* @param {Object3D} obj - The Object3D instance to toggle.
* @returns {boolean} - Returns true if the object's selection state was successfully toggled.
*/
function toggle(obj: Object3D): boolean {
if (isSelected(obj)) {
return unselect(obj)
Expand Down
Loading
0