chore(postprocessing): clean up postprocessing

Author: nartc

libs/postprocessing/src/lib/effects/depth-of-field.ts

@@ -26,12 +26,12 @@ type DOFOptions = NonNullable<ConstructorParameters<typeof DepthOfFieldEffect>[1
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class NgtpDepthOfField {
-	private effectComposer = inject(NgtpEffectComposer);
-
 	options = input({} as DOFOptions);
 
 	private autoFocus = computed(() => this.options().target != null);
 
+	private effectComposer = inject(NgtpEffectComposer);
+
 	effect = computed(() => {
 		const [camera, options, autoFocus] = [this.effectComposer.camera(), this.options(), this.autoFocus()];
 

libs/postprocessing/src/lib/effects/glitch.ts

@@ -24,9 +24,6 @@ export type GlitchOptions = NonNullable<ConstructorParameters<typeof GlitchEffec
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class NgtpGlitch {
-	private store = injectStore();
-	private invalidate = this.store.select('invalidate');
-
 	options = input({ active: true } as GlitchOptions, { transform: mergeInputs({ active: true }) });
 
 	private active = pick(this.options, 'active');
@@ -37,6 +34,9 @@ export class NgtpGlitch {
 	private chromaticAberrationOffset = vector2(this.options, 'chromaticAberrationOffset');
 	private strength = vector2(this.options, 'strength');
 
+	private store = injectStore();
+	private invalidate = this.store.select('invalidate');
+
 	effect = computed(() => {
 		const [
 			{ ratio, dtSize, columns, blendFunction, perturbationMap },

libs/postprocessing/src/lib/effects/god-rays.ts

@@ -28,10 +28,10 @@ type GodRaysOptions = ConstructorParameters<typeof GodRaysEffect>[2] & {
 	schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
 export class NgtpGodRays {
-	private effectComposer = inject(NgtpEffectComposer);
-
 	options = input({} as GodRaysOptions);
 
+	private effectComposer = inject(NgtpEffectComposer);
+
 	effect = computed(() => {
 		const [camera, { sun, ...options }] = [this.effectComposer.camera(), this.options()];
 		return new GodRaysEffect(camera, is.ref(sun) ? sun.nativeElement : sun, options);

libs/postprocessing/src/lib/effects/lens-flare.ts

@@ -144,14 +144,14 @@ const defaultOptions: LensFlareOptions = {
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class NgtpLensFlare {
+	options = input(defaultOptions, { transform: mergeInputs(defaultOptions) });
+
 	private store = injectStore();
 	private viewport = this.store.select('viewport');
 	private raycaster = this.store.select('raycaster');
 	private pointer = this.store.select('pointer');
 
-	effectComposer = inject(NgtpEffectComposer);
-
-	options = input(defaultOptions, { transform: mergeInputs(defaultOptions) });
+	private effectComposer = inject(NgtpEffectComposer);
 
 	private projectedPosition = new Vector3();
 	private mouse2d = new Vector2();

libs/postprocessing/src/lib/effects/lut.ts

@@ -20,12 +20,12 @@ export interface LUTOptions {
 	changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class NgtpLUT {
-	private store = injectStore();
-	private invalidate = this.store.select('invalidate');
-
 	options = input({} as LUTOptions);
 	private lut = pick(this.options, 'lut');
 
+	private store = injectStore();
+	private invalidate = this.store.select('invalidate');
+
 	effect = computed(() => {
 		const [lut, { lut: _, ...options }] = [this.lut(), this.options()];
 		return new LUT3DEffect(lut, options);