https://www.scientologie.fr/js-static/ias-2023/threejsapp.js?_=

1
2class THREEJsAPP {
3
4	init(container, logo) {
5		this.shouldRender = false;
6		this.container = container;
7		this.lastTime = performance.now();
8		this.frameCount = 0;
9		this.slowPerformanceCounter = 0;
10		this.initWebGL(logo);
11		// this.initGUI();
12		this.addListeners();
13		this.animate();
14		this.resize();
15		this.setAnimateListener();
16	}
17
18	initWebGL(logo) {
19		this.webgl = new WebGLView(this, logo);
20		this.container.querySelector('.ias-2023-renderer').appendChild(this.webgl.renderer.domElement);
21	}
22
23	initGUI() {
24		this.gui = new GUIView(this);
25	}
26
27	addListeners() {
28		this.handlerAnimate = this.animate.bind(this);
29
30		window.addEventListener('resize', this.resize.bind(this));
31		window.addEventListener('keyup', this.keyup.bind(this));
32		
33		const el = this.webgl.renderer.domElement;
34		el.addEventListener('click', this.click.bind(this));
35	}
36
37	animate() {
38		if(this.shouldRender) {
39			this.update();
40			this.draw();
41
42			const now = performance.now();
43			const deltaTime = now - this.lastTime;
44			
45			// Count frames over a second.
46			this.frameCount++;
47			if (deltaTime >= 1000) {
48			  this.lastTime = now;
49			  const fps = this.frameCount;
50			  this.frameCount = 0;
51
52			  const slowPerformance = fps < 30;
53			  if(slowPerformance) {
54				this.slowPerformanceCounter ++ ;
55			  } else {
56				this.slowPerformanceCounter = 0;
57			  }
58
59			  if(this.slowPerformanceCounter > 3 && globalGetParams.webgl != "1") {
60				  console.warn("Slow performance detected. Stopping animation, fps: " + fps);
61				  this.shouldRender = false;

62				  this.webgl.renderer.clear();
63				  this.webgl.renderer.dispose();
64				  return;
65				}
66			}
67	
68			this.raf = requestAnimationFrame(this.handlerAnimate);
69		}
70	}
71
72	setAnimateListener() {
73		var self = this;
74		gsap.timeline({
75			scrollTrigger: {
76				trigger: this.container.querySelector(".ias-2023-4d-logo-inner"),
77				start: "bottom bottom",
78				endTrigger: $(this.container).next()[0],
79				end: "bottom top",
80				onEnter: function(progress, direction, isActive) {
81					self.shouldRender = true;
82					self.webgl.clock.start();
83					self.animate();
84				},
85				onEnterBack: function(progress, direction, isActive) {
86					self.shouldRender = true;
87					self.webgl.clock.start();
88					self.animate();
89				},
90				onLeave: function(progress, direction, isActive) {
91					self.shouldRender = false;
92					self.webgl.clock.stop();
93				},
94				onLeaveBack: function(progress, direction, isActive) {
95					self.shouldRender = false;
96					self.webgl.clock.stop();
97				}
98			}
99		});
100
101	}
102
103	// ---------------------------------------------------------------------------------------------
104	// PUBLIC
105	// ---------------------------------------------------------------------------------------------
106
107	update() {
108		if (this.gui && this.gui.stats) this.gui.stats.begin();
109		if (this.webgl) this.webgl.update();
110		if (this.gui) this.gui.update();
111	}
112
113	draw() {
114		if (this.webgl) this.webgl.draw();
115		if (this.gui && this.gui.stats) this.gui.stats.end();
116	}
117
118	// ---------------------------------------------------------------------------------------------
119	// EVENT HANDLERS
120	// ---------------------------------------------------------------------------------------------
121
122	resize() {
123		if (this.webgl) this.webgl.resize();
124	}
125
126	keyup(e) {
127		// g
128		if (e.keyCode == 71) { if (this.gui) this.gui.toggle(); }
129	}
130
131	click(e) {
132		this.webgl.next();
133	}
134}