Web3D/trois
1
0
Fork 0
mirror of https://github.com/troisjs/trois.git synced 2024-11-24 04:12:02 +08:00
Code Issues Projects Releases Wiki Activity

wip: effectcomposer

Browse Source
This commit is contained in:
Kevin Levron 2021-04-21 02:17:31 +02:00
parent d10c7d6a02
commit b5e03c5600
1 changed files with 14 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/effects/EffectComposer.ts
View File

@ -1,11 +1,10 @@
import { defineComponent, inject } from 'vue' import { defineComponent, inject } from 'vue'
import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js' import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js'
import { ThreeInterface } from '../core/useThree'
import { Pass } from 'three/examples/jsm/postprocessing/Pass' import { Pass } from 'three/examples/jsm/postprocessing/Pass'
import { RendererInterface } from '../core/Renderer'
interface EffectComposerSetupInterface { interface EffectComposerSetupInterface {
three: ThreeInterface renderer: RendererInterface
// passes: Pass[]
composer?: EffectComposer composer?: EffectComposer
} }
@ -16,10 +15,9 @@ export interface EffectComposerInterface extends EffectComposerSetupInterface {
export default defineComponent({ export default defineComponent({
setup(): EffectComposerSetupInterface { setup(): EffectComposerSetupInterface {
const three = inject('three') as ThreeInterface const renderer = inject('renderer') as RendererInterface
return { return {
three, renderer,
// passes: [],
} }
}, },
provide() { provide() {
@ -28,18 +26,21 @@ export default defineComponent({
} }
}, },
created() { created() {
const composer = new EffectComposer(this.three.renderer) const composer = new EffectComposer(this.renderer.renderer)
this.composer = composer this.composer = composer
this.three.composer = composer this.renderer.three.composer = composer
this.three.onAfterInit(() => { // this.renderer.onInit(() => {
this.three.renderer.autoClear = false this.renderer.addListener('init', () => {
this.renderer.renderer.autoClear = false
this.resize() this.resize()
this.three.onAfterResize(this.resize) // this.renderer.onResize(this.resize)
this.renderer.addListener('resize', this.resize)
}) })
}, },
unmounted() { unmounted() {
this.three.offAfterResize(this.resize) // this.renderer.offResize(this.resize)
this.renderer.removeListener('resize', this.resize)
}, },
methods: { methods: {
addPass(pass: Pass) { addPass(pass: Pass) {
@ -49,7 +50,7 @@ export default defineComponent({
this.composer?.removePass(pass) this.composer?.removePass(pass)
}, },
resize() { resize() {
this.composer?.setSize(this.three.size.width, this.three.size.height) this.composer?.setSize(this.renderer.size.width, this.renderer.size.height)
}, },
}, },
render() { render() {