From de34a48d8a858d96cd00bc520ae4d6f69a019d1b Mon Sep 17 00:00:00 2001
From: Sander Moolin <sandermoolin@gmail.com>
Date: Sat, 20 Mar 2021 23:26:47 -0400
Subject: [PATCH 1/4] added ssao pass

---
 src/effects/SSAOPass.js | 40 ++++++++++++++++++++++++++++++++++++++++
 src/effects/index.js    |  1 +
 src/plugin.js           |  1 +
 3 files changed, 42 insertions(+)
 create mode 100644 src/effects/SSAOPass.js

diff --git a/src/effects/SSAOPass.js b/src/effects/SSAOPass.js
new file mode 100644
index 0000000..09de056
--- /dev/null
+++ b/src/effects/SSAOPass.js
@@ -0,0 +1,40 @@
+import { SSAOPass } from 'three/examples/jsm/postprocessing/SSAOPass.js';
+import EffectPass from './EffectPass.js';
+
+export default {
+  extends: EffectPass,
+  props: {
+    scene: null,
+    camera: null,
+    options: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  mounted() {
+    const pass = new SSAOPass(
+      this.scene || this.three.scene,
+      this.camera || this.three.camera,
+      this.three.size.width,
+      this.three.size.height
+    );
+    this.passes.push(pass);
+    this.pass = pass;
+
+    for (let key of Object.keys(this.options)) {
+      this.pass[key] = this.options[key];
+    }
+    // resize will be called in three init
+    this.three.onAfterResize(this.resize);
+  },
+  unmounted() {
+    this.three.offAfterResize(this.resize);
+  },
+  methods: {
+    resize() {
+      this.pass.width = this.three.size.width
+      this.pass.height = this.three.size.height
+    },
+  },
+  __hmrId: 'FXAAPass',
+};
diff --git a/src/effects/index.js b/src/effects/index.js
index 76ae78c..5681b80 100644
--- a/src/effects/index.js
+++ b/src/effects/index.js
@@ -6,6 +6,7 @@ export { default as FilmPass } from './FilmPass.js';
 export { default as FXAAPass } from './FXAAPass.js';
 export { default as HalftonePass } from './HalftonePass.js';
 export { default as SMAAPass } from './SMAAPass.js';
+export { default as SSAOPass } from './SSAOPass.js';
 export { default as TiltShiftPass } from './TiltShiftPass.js';
 export { default as UnrealBloomPass } from './UnrealBloomPass.js';
 export { default as ZoomBlurPass } from './ZoomBlurPass.js';
diff --git a/src/plugin.js b/src/plugin.js
index 04e1bfa..bdee5f3 100644
--- a/src/plugin.js
+++ b/src/plugin.js
@@ -69,6 +69,7 @@ export const TroisJSVuePlugin = {
       'RenderPass',
       'SAOPass',
       'SMAAPass',
+      'SSAOPass',
       'TiltShiftPass',
       'UnrealBloomPass',
       'ZoomBlurPass',

From 7887f2266a1cbab325914dd8cfd754543a9cf2c6 Mon Sep 17 00:00:00 2001
From: Sander Moolin <sandermoolin@gmail.com>
Date: Sat, 20 Mar 2021 23:33:32 -0400
Subject: [PATCH 2/4] updated hmrID

---
 src/effects/SSAOPass.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/effects/SSAOPass.js b/src/effects/SSAOPass.js
index 09de056..949e089 100644
--- a/src/effects/SSAOPass.js
+++ b/src/effects/SSAOPass.js
@@ -36,5 +36,5 @@ export default {
       this.pass.height = this.three.size.height
     },
   },
-  __hmrId: 'FXAAPass',
+  __hmrId: 'SSAOPass',
 };

From d67805e6bd83b72f974bfac0bed6247f26fc7851 Mon Sep 17 00:00:00 2001
From: Sander Moolin <sandermoolin@gmail.com>
Date: Sun, 21 Mar 2021 14:49:41 -0400
Subject: [PATCH 3/4] pass ready events on all pass types

---
 src/effects/BokehPass.js       | 3 +--
 src/effects/EffectPass.js      | 8 ++++++++
 src/effects/FXAAPass.js        | 3 +--
 src/effects/FilmPass.js        | 3 +--
 src/effects/HalftonePass.js    | 3 +--
 src/effects/RenderPass.js      | 3 +--
 src/effects/SMAAPass.js        | 3 +--
 src/effects/SSAOPass.js        | 3 +--
 src/effects/TiltShiftPass.js   | 3 +++
 src/effects/UnrealBloomPass.js | 3 +--
 src/effects/ZoomBlurPass.js    | 7 ++++---
 11 files changed, 23 insertions(+), 19 deletions(-)

diff --git a/src/effects/BokehPass.js b/src/effects/BokehPass.js
index 61481ff..bb38876 100644
--- a/src/effects/BokehPass.js
+++ b/src/effects/BokehPass.js
@@ -37,8 +37,7 @@ export default {
       height: this.three.size.height,
     };
     const pass = new BokehPass(this.three.scene, this.three.camera, params);
-    this.passes.push(pass);
-    this.pass = pass;
+    this.completePass(pass);
   },
   __hmrId: 'BokehPass',
 };
diff --git a/src/effects/EffectPass.js b/src/effects/EffectPass.js
index e892fb0..a93d5a1 100644
--- a/src/effects/EffectPass.js
+++ b/src/effects/EffectPass.js
@@ -1,5 +1,6 @@
 export default {
   inject: ['three', 'passes'],
+  events: ['ready'],
   beforeMount() {
     if (!this.passes) {
       console.error('Missing parent EffectComposer');
@@ -8,6 +9,13 @@ export default {
   unmounted() {
     if (this.pass.dispose) this.pass.dispose();
   },
+  methods: {
+    completePass(pass) {
+      this.passes.push(pass);
+      this.pass = pass;
+      this.$emit('ready', pass);
+    }
+  },
   render() {
     return [];
   },
diff --git a/src/effects/FXAAPass.js b/src/effects/FXAAPass.js
index 3442acf..3a69ffe 100644
--- a/src/effects/FXAAPass.js
+++ b/src/effects/FXAAPass.js
@@ -6,8 +6,7 @@ export default {
   extends: EffectPass,
   mounted() {
     const pass = new ShaderPass(FXAAShader);
-    this.passes.push(pass);
-    this.pass = pass;
+    this.completePass(pass);
 
     // resize will be called in three init
     this.three.onAfterResize(this.resize);
diff --git a/src/effects/FilmPass.js b/src/effects/FilmPass.js
index c199532..2c49018 100644
--- a/src/effects/FilmPass.js
+++ b/src/effects/FilmPass.js
@@ -29,8 +29,7 @@ export default {
   },
   mounted() {
     const pass = new FilmPass(this.noiseIntensity, this.scanlinesIntensity, this.scanlinesCount, this.grayscale);
-    this.passes.push(pass);
-    this.pass = pass;
+    this.completePass(pass);
   },
   __hmrId: 'FilmPass',
 };
diff --git a/src/effects/HalftonePass.js b/src/effects/HalftonePass.js
index 8be4ff6..3da12e8 100644
--- a/src/effects/HalftonePass.js
+++ b/src/effects/HalftonePass.js
@@ -22,8 +22,7 @@ export default {
       });
     });
 
-    this.passes.push(pass);
-    this.pass = pass;
+    this.completePass(pass);
   },
   __hmrId: 'HalftonePass',
 };
diff --git a/src/effects/RenderPass.js b/src/effects/RenderPass.js
index 9caab8f..c82875f 100644
--- a/src/effects/RenderPass.js
+++ b/src/effects/RenderPass.js
@@ -11,8 +11,7 @@ export default {
       console.error('Missing Camera');
     }
     const pass = new RenderPass(this.three.scene, this.three.camera);
-    this.passes.push(pass);
-    this.pass = pass;
+    this.completePass(pass);
   },
   __hmrId: 'RenderPass',
 };
diff --git a/src/effects/SMAAPass.js b/src/effects/SMAAPass.js
index b762eb1..06a70fd 100644
--- a/src/effects/SMAAPass.js
+++ b/src/effects/SMAAPass.js
@@ -6,8 +6,7 @@ export default {
   mounted() {
     // three size is not set yet, but this pass will be resized by effect composer
     const pass = new SMAAPass(this.three.size.width, this.three.size.height);
-    this.passes.push(pass);
-    this.pass = pass;
+    this.completePass(pass);
   },
   __hmrId: 'SMAAPass',
 };
diff --git a/src/effects/SSAOPass.js b/src/effects/SSAOPass.js
index 949e089..0c501f0 100644
--- a/src/effects/SSAOPass.js
+++ b/src/effects/SSAOPass.js
@@ -18,8 +18,7 @@ export default {
       this.three.size.width,
       this.three.size.height
     );
-    this.passes.push(pass);
-    this.pass = pass;
+    this.completePass(pass);
 
     for (let key of Object.keys(this.options)) {
       this.pass[key] = this.options[key];
diff --git a/src/effects/TiltShiftPass.js b/src/effects/TiltShiftPass.js
index 7046969..1293a62 100644
--- a/src/effects/TiltShiftPass.js
+++ b/src/effects/TiltShiftPass.js
@@ -39,6 +39,9 @@ export default {
     this.pass.setSize = (width, height) => {
       uniforms.texSize.value.set(width, height);
     };
+
+    this.completePass(pass);
+    this.completePass(pass1);
   },
   methods: {
     updateFocusLine() {
diff --git a/src/effects/UnrealBloomPass.js b/src/effects/UnrealBloomPass.js
index 039597c..83a4006 100644
--- a/src/effects/UnrealBloomPass.js
+++ b/src/effects/UnrealBloomPass.js
@@ -17,8 +17,7 @@ export default {
   mounted() {
     const size = new Vector2(this.three.size.width, this.three.size.height);
     const pass = new UnrealBloomPass(size, this.strength, this.radius, this.threshold);
-    this.passes.push(pass);
-    this.pass = pass;
+    this.completePass(pass);
   },
   __hmrId: 'UnrealBloomPass',
 };
diff --git a/src/effects/ZoomBlurPass.js b/src/effects/ZoomBlurPass.js
index b492af5..910aa84 100644
--- a/src/effects/ZoomBlurPass.js
+++ b/src/effects/ZoomBlurPass.js
@@ -10,12 +10,13 @@ export default {
     strength: { type: Number, default: 0.5 },
   },
   mounted() {
-    this.pass = new ShaderPass(ZoomBlur);
-    this.passes.push(this.pass);
+    const pass = new ShaderPass(ZoomBlur);
 
-    const uniforms = this.uniforms = this.pass.uniforms;
+    const uniforms = this.uniforms = pass.uniforms;
     bindProp(this, 'center', uniforms.center, 'value');
     bindProp(this, 'strength', uniforms.strength, 'value');
+
+    this.completePass(pass);
   },
   __hmrId: 'ZoomBlurPass',
 };

From 132950301c3ab57e6d5bafa55c413ec247c15941 Mon Sep 17 00:00:00 2001
From: Sander Moolin <sandermoolin@gmail.com>
Date: Sun, 21 Mar 2021 14:52:30 -0400
Subject: [PATCH 4/4] tiltshift pass update

---
 src/effects/TiltShiftPass.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/effects/TiltShiftPass.js b/src/effects/TiltShiftPass.js
index 1293a62..e60b7d9 100644
--- a/src/effects/TiltShiftPass.js
+++ b/src/effects/TiltShiftPass.js
@@ -40,8 +40,9 @@ export default {
       uniforms.texSize.value.set(width, height);
     };
 
-    this.completePass(pass);
-    this.completePass(pass1);
+    // emit ready event with two passes - do so manually in this file instead
+    // of calling `completePass` like in other effect types
+    this.$emit('ready', [this.pass, this.pass1])
   },
   methods: {
     updateFocusLine() {