Method draw

packages/melonjs/src/renderable/container.js:1158–1245

* draw this renderable (automatically called by melonJS) * @param {CanvasRenderer|WebGLRenderer} renderer - a renderer instance * @param {Camera2d} [viewport] - the viewport to (re)draw

(renderer, viewport)

	 * @param {Camera2d} [viewport] - the viewport to (re)draw
	 */
	draw(renderer, viewport) {
		const bounds = this.getBounds();

		// adjust position before clipping so the renderer's currentTransform
		// sits at this container's local origin. `clipRect` then operates
		// in container-local coords and any scale/rotation accumulated in
		// the matrix is honored when the renderer converts to screen space.
		// (Issue #1349 — passing world-space `bounds.left/top` to the
		// previous local-space-expecting `clipRect` double-counted the
		// translation when the container was nested inside a translated
		// parent.)
		renderer.translate(this.pos.x, this.pos.y);

		// clip the container children to the container bounds.
		// Container's anchorPoint is forced to (0, 0), so the local rect
		// is (0, 0, width, height). `bounds.isFinite()` covers the
		// aggregate (self + children) — a container may have a finite
		// child bounds while its own `width/height` are `Infinity`
		// (e.g., the world container or any `enableChildBoundsUpdate`
		// container with a finite child but no intrinsic size). Passing
		// `Infinity` to `clipRect` would NaN-poison the WebGL scissor
		// math, so guard on the size we actually pass too.
		if (
			this.root === false &&
			this.clipping === true &&
			bounds.isFinite() === true &&
			Number.isFinite(this.width) === true &&
			Number.isFinite(this.height) === true
		) {
			renderer.clipRect(0, 0, this.width, this.height);
		}

		// color background if defined
		if (this.backgroundColor.alpha > 1 / 255) {
			renderer.clearColor(this.backgroundColor);
		}

		// viewport is documented optional — legacy subclass overrides call
		// `super.draw(renderer)` without one; treat that as the default camera
		const isNonDefaultCamera = viewport ? !viewport.isDefault : false;

		const children = this.getChildren();
		for (let i = children.length, obj; i--, (obj = children[i]); ) {
			const isFloating = obj.floating === true;

			if (obj.inViewport || isFloating) {
				// skip UI-only floating elements on non-default cameras
				if (isFloating && isNonDefaultCamera && !obj.visibleInAllCameras) {
					continue;
				}

				if (isFloating) {
					renderer.save();
					renderer.resetTransform();
					// Floating renderables draw in screen space — swap to
					// the camera's flat screen ortho regardless of whether
					// we're on the default camera. Under Camera2d this is
					// a no-op (its `screenProjection` mirrors