text: import { Color, PerspectiveCamera, Vector3 } from "three";
  import { DeltaControls } from "delta-controls";
  import { ProgressManager } from "../utils/ProgressManager.js";
  import { PostProcessingDemo } from "./PostProcessingDemo.js";
  
  import * as Sponza from "./objects/Sponza.js";
  
  import {
  	EdgeDetectionMode,
  	EffectPass,
  	PixelationEffect,
  	SMAAEffect,
  	SMAAImageLoader,
  	SMAAPreset
  } from "../../../src";
  
  /**
   * A pixelation demo setup.
   */
  
  export class PixelationDemo extends PostProcessingDemo {
  
  	/**
  	 * Constructs a new pixelation demo.
  	 *
  	 * @param {EffectComposer} composer - An effect composer.
  	 */
  
  	constructor(composer) {
  
  		super("pixelation", composer);
  
  		/**
  		 * An effect.
  		 *
  		 * @type {Effect}
  		 * @private
  		 */
  
  		this.effect = null;
  
  	}
  
  	/**
  	 * Loads scene assets.
  	 *
  	 * @return {Promise} A promise that returns a collection of assets.
  	 */
  
  	load() {
  
  		const assets = this.assets;
  		const loadingManager = this.loadingManager;
  		const smaaImageLoader = new SMAAImageLoader(loadingManager);
  
  		const anisotropy = Math.min(this.composer.getRenderer().capabilities.getMaxAnisotropy(), 8);
  
  		return new Promise((resolve, reject) => {
  
  			if(assets.size === 0) {
  
  				loadingManager.onLoad = () => setTimeout(resolve, 250);
  				loadingManager.onProgress = ProgressManager.updateProgress;
  				loadingManager.onError = reject;
  
  				Sponza.load(assets, loadingManager, anisotropy);
  
  				smaaImageLoader.load(([search, area]) => {
  
  					assets.set("smaa-search", search);
  					assets.set("smaa-area", area);
  
  				});
  
  			} else {
  
  				resolve();
  
  			}
  
  		});
  
  	}
  
  	/**
  	 * Creates the scene.
  	 */
  
  	initialize() {
  
  		const scene = this.scene;
  		const assets = this.assets;
  		const composer = this.composer;
  		const renderer = composer.getRenderer();
  
  		// Camera.
  
  		const aspect = window.innerWidth / window.innerHeight;
  		const camera = new PerspectiveCamera(50, aspect, 0.5, 2000);
  		camera.position.set(-9, 0.5, 0);
  		this.camera = camera;
  
  		// Controls.
  
  		const target = new Vector3(0, 3, -3.5);
  		const controls = new DeltaControls(camera.position, camera.quaternion, renderer.domElement);
  		controls.settings.pointer.lock = false;
  		controls.settings.translation.enabled = true;
  		controls.settings.sensitivity.translation = 3.0;
  		controls.lookAt(target);
  		controls.setOrbitEnabled(false);
  		this.controls = controls;
  
  		// Sky.
  
  		scene.background = new Color(0xeeeeee);
  
  		// Lights.
  
  		scene.add(...Sponza.createLights());
  
  		// Objects.
  
  		scene.add(assets.get("sponza"));
  
  		// Passes.
  
  		const smaaEffect = new SMAAEffect(
  			assets.get("smaa-search"),
  			assets.get("smaa-area"),
  			SMAAPreset.HIGH,
  			EdgeDetectionMode.DEPTH
  		);
  
  		smaaEffect.edgeDetectionMaterial.setEdgeDetectionThreshold(0.05);
  
  		const pixelationEffect = new PixelationEffect(5.0);
  
  		const effectPass = new EffectPass(camera, pixelationEffect);
  		const smaaPass = new EffectPass(camera, smaaEffect);
  
  		this.effect = pixelationEffect;
  
  		composer.addPass(smaaPass);
  		composer.addPass(effectPass);
  
  	}
  
  	/**
  	 * Registers configuration options.
  	 *
  	 * @param {GUI} menu - A menu.
  	 */
  
  	registerOptions(menu) {
  
  		const effect = this.effect;
  
  		const params = {
  			"granularity": effect.getGranularity()
  		};
  
  		menu.add(params, "granularity").min(0.0).max(50.0).step(0.1).onChange(() => {
  
  			effect.setGranularity(params.granularity);
  
  		});
  
  	}
  
  }
  