Skip to content

Commit

Permalink
feat(core): export useLogger
Browse files Browse the repository at this point in the history
  • Loading branch information
alvarosabu committed Mar 11, 2023
1 parent 9044c99 commit 4ad1a3e
Show file tree
Hide file tree
Showing 11 changed files with 82 additions and 25 deletions.
2 changes: 1 addition & 1 deletion packages/cientos/src/core/usePamCameraMouse/index.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { watchEffect, computed } from 'vue'
import { Camera } from 'three'
import { useWindowSize, useMouse } from '@vueuse/core'
import { useLogger } from '@tresjs/core/src/iternal/useLogger'
import { useLogger } from '@tresjs/core'

export function usePamCameraMouse(disabled = false, factor = 5, camera: Camera | undefined) {
const { x, y } = useMouse()
Expand Down
53 changes: 43 additions & 10 deletions packages/tres/src/App.vue
Original file line number Diff line number Diff line change
@@ -1,30 +1,63 @@
<script setup lang="ts">
import { ref, watchEffect } from 'vue'
import { OrbitControls } from 'three/addons/controls/OrbitControls.js'
import TresCanvas from './components/TresCanvas'
import AkuAku from './demos/AkuAku.vue'
import { useRenderLoop, useTres } from '/@/composables'
// import TheEvents from '/@/components/TheEvents.vue'
const gl = {
antialias: true,
alpha: true,
clearColor: '#82DBC5',
}
const { state } = useTres()
let controls = null
const { onLoop } = useRenderLoop()
watchEffect(() => {
if (state.camera && state.renderer) {
controls = new OrbitControls(state.camera, state.renderer.domElement)
controls.enableDamping = true
controls.dampingFactor = 0.05
controls.screenSpacePanning = false
controls.minDistance = 1
controls.maxDistance = 500
controls.maxPolarAngle = Math.PI / 2
}
})
onLoop(() => {
if (controls) {
controls.update()
}
})
const gridVisible = ref(false)
function click(e) {
console.log('click', e)
gridVisible.value = !gridVisible.value
}
function enter(e) {
console.log('enter', e)
}
</script>

<template>
<Suspense>
<TresCanvas v-bind="gl">
<TresPerspectiveCamera :args="[75, 1, 0.1, 1000]" :position="[0, 2, 7]"></TresPerspectiveCamera>
<TresMesh :position="[0, 4, 0]" @click="click" @pointer-enter="enter">
<TresBoxGeometry :args="[1, 1, 1]"></TresBoxGeometry>
<TresMeshBasicMaterial color="teal"></TresMeshBasicMaterial>
</TresMesh>
<TresGridHelper :args="[4, 4]"></TresGridHelper>
</TresCanvas>
</Suspense>
<TresCanvas v-bind="gl">
<TresPerspectiveCamera :args="[75, 1, 0.1, 1000]" :position="[0, 2, 7]"></TresPerspectiveCamera>
<TresAmbientLight :color="0xffffff" :intensity="0.75" />
<TresDirectionalLight :color="0xffffff" :intensity="0.75" :position="[-2, 2, 0]" />
<TresMesh :position="[0, 4, 0]" @click="click" @pointer-enter="enter">
<TresBoxGeometry :args="[1, 1, 1]"></TresBoxGeometry>
<TresMeshBasicMaterial color="teal"></TresMeshBasicMaterial>
</TresMesh>
<TresGridHelper v-if="gridVisible" :args="[4, 4]"></TresGridHelper>
<Suspense>
<AkuAku />
</Suspense>
</TresCanvas>
</template>

<style>
Expand Down
1 change: 1 addition & 0 deletions packages/tres/src/composables/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,3 +6,4 @@ export * from './useLoader'
export * from './useTexture'
export * from './useTres'
export * from './useRaycaster'
export * from './useLogger'
2 changes: 1 addition & 1 deletion packages/tres/src/composables/useLoader/index.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { isArray } from '@alvarosabu/utils'
import { Object3D } from 'three'
import { useLogger } from '../../iternal'
import { useLogger } from '/@/composables'

export interface TresLoader<T> extends THREE.Loader {
load(
Expand Down
File renamed without changes.
2 changes: 1 addition & 1 deletion packages/tres/src/composables/useRenderer/component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { RendererPresetsType } from './const'
import { ShadowMapType, TextureEncoding, ToneMapping } from 'three'
import { h, defineComponent, ref, provide, onBeforeUnmount, PropType } from 'vue'
import { useRenderer } from '.'
import { useLogger } from '../../iternal'
import { useLogger } from '/@/composables'
import { TresVNodeType } from '/@/types'

/**
Expand Down
2 changes: 1 addition & 1 deletion packages/tres/src/composables/useRenderer/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import { normalizeColor } from '/@/utils/normalize'
import { TresColor } from '/@/types'
import { rendererPresets, RendererPresetsType } from './const'
import { merge } from '/@/utils'
import { useLogger } from '../../iternal'
import { useLogger } from '/@/composables'

export interface UseRendererOptions extends WebGLRendererParameters {
/**
Expand Down
10 changes: 6 additions & 4 deletions packages/tres/src/core/nodeOps.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { useCamera, useRaycaster, useRenderLoop } from '/@/composables'
import { RendererOptions } from 'vue'
import { useLogger } from '../iternal'
import { useLogger } from '/@/composables'
import { catalogue } from './catalogue'
import { Mesh } from 'three'
import { useEventListener } from '@vueuse/core'
Expand All @@ -24,6 +24,7 @@ function noop(fn: string): any {
export const nodeOps: RendererOptions<TresObject, TresObject> = {
createElement(type, _isSVG, _isCustomizedBuiltIn, props) {
if (type === 'template') return null
if (type === 'div') return null
let instance

if (props === null) {
Expand Down Expand Up @@ -110,6 +111,7 @@ export const nodeOps: RendererOptions<TresObject, TresObject> = {
}
},
remove(node) {
if (!node) return
const parent = node.parent
if (parent) {
if (parent.isObject3D && node.isObject3D) {
Expand All @@ -132,13 +134,13 @@ export const nodeOps: RendererOptions<TresObject, TresObject> = {
let target = root[key]

// Traverse pierced props (e.g. foo-bar=value => foo.bar = value)
if (key.includes('-')) {
/* if (key.includes('-')) {
const chain = key.split('-')
target = chain.reduce((acc, key) => acc[key], root)
key = chain.pop() as string
if (!target?.set) root = chain.reduce((acc, key) => acc[key], root)
}
} */

const value = nextValue
/* try {
Expand All @@ -148,7 +150,7 @@ export const nodeOps: RendererOptions<TresObject, TresObject> = {

// Set prop, prefer atomic methods if applicable
if (!target?.set) root[key] = value
else if (target.constructor === value.constructor) target.copy(value)
else if (target.constructor === value.constructor && target?.copy) target?.copy(value)
else if (Array.isArray(value)) target.set(...value)
else if (!target.isColor && target.setScalar) target.setScalar(value)
else target.set(value)
Expand Down
20 changes: 20 additions & 0 deletions packages/tres/src/demos/AkuAku.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<script setup lang="ts">
import { useTweakPane, useGLTF } from '@tresjs/cientos'
useTweakPane()
const { scene: model } = await useGLTF(
'https://raw.githubusercontent.com/Tresjs/assets/main/models/gltf/aku-aku/AkuAku.gltf',
{
draco: true,
},
)
model.position.set(0, 4, 0)
model.updateMatrixWorld()
</script>

<template>
<Suspense>
<TresMesh v-bind="model" />
</Suspense>
</template>
14 changes: 8 additions & 6 deletions packages/tres/src/demos/TestSphere.vue
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
<!-- eslint-disable max-len -->
<script setup lang="ts">
import { Ref, ref } from 'vue'
import { useRenderLoop, useTexture } from '/@/composables/'
Expand All @@ -13,13 +14,14 @@ onLoop(({ elapsed }) => {
}
})
/* const texture = await useTexture(['/textures/stylized-leaves-material/Stylized_Leaves_002_basecolor.jpg']) */
const pbrTexture = await useTexture({
map: '/textures/stylized-leaves-material/Stylized_Leaves_002_basecolor.jpg',
displacementMap: '/textures/stylized-leaves-material/Stylized_Leaves_002_height.png',
roughnessMap: '/textures/stylized-leaves-material/Stylized_Leaves_002_roughness.jpg',
normalMap: '/textures/stylized-leaves-material/Stylized_Leaves_002_normal.jpg',
ambientOcclusion: '/textures/stylized-leaves-material/Stylized_Leaves_002_ambientOcclusion.jpg',
map: 'https://raw.githubusercontent.com/Tresjs/assets/main/textures/black-rock/Rock035_2K_Displacement.jpg',
displacementMap:
'https://raw.githubusercontent.com/Tresjs/assets/main/textures/black-rock/Rock035_2K_Displacement.jpg',
roughnessMap: 'https://raw.githubusercontent.com/Tresjs/assets/main/textures/black-rock/Rock035_2K_Roughness.jpg',
normalMap: 'https://raw.githubusercontent.com/Tresjs/assets/main/textures/black-rock/Rock035_2K_NormalGL.jpg',
ambientOcclusion:
'https://raw.githubusercontent.com/Tresjs/assets/main/textures/black-rock/Rock035_2K_AmbientOcclusion.jpg',
})
</script>
<template>
Expand Down
1 change: 0 additions & 1 deletion packages/tres/src/iternal/index.ts

This file was deleted.

0 comments on commit 4ad1a3e

Please sign in to comment.