feat: add transparent renderpass

Render transparently after opaque pass.

declarations/mapillary.js.flow

@@ -3113,6 +3113,7 @@ export type ViewerEventType =
 
 declare var RenderPass: {|
   +Opaque: 0, // 0
+  +Transparent: 1, // 1
 |};
 
 /**

src/render/GLRenderer.ts

@@ -106,6 +106,7 @@ export class GLRenderer {
     private _subscriptions: SubscriptionHolder = new SubscriptionHolder();
 
     private _opaqueRender$: Subject<void> = new Subject<void>();
+    private _transparentRender$: Subject<void> = new Subject<void>();
 
     constructor(
         canvas: HTMLCanvasElement,
@@ -245,6 +246,7 @@ export class GLRenderer {
                     renderer.resetState();
 
                     this._opaqueRender$.next();
+                    this._transparentRender$.next();
                 });
 
         subs.push(renderSubscription);
@@ -398,6 +400,10 @@ export class GLRenderer {
         return this._opaqueRender$;
     }
 
+    public get transparentRender$(): Observable<void> {
+        return this._transparentRender$;
+    }
+
     public get webGLRenderer$(): Observable<THREE.WebGLRenderer> {
         return this._webGLRenderer$;
     }

src/viewer/CustomRenderer.ts

@@ -13,6 +13,7 @@ import { LngLatAlt } from "../api/interfaces/LngLatAlt";
 import { WebGLRenderer } from "three";
 import { RenderCamera } from "../render/RenderCamera";
 import { IViewer } from "./interfaces/IViewer";
+import { RenderPass } from "./enums/RenderPass";
 
 export class CustomRenderer {
     private _renderers: {
@@ -44,7 +45,11 @@ export class CustomRenderer {
                     renderer.onAdd(viewer, reference, gl.getContext());
                 }));
 
-        subs.push(this._container.glRenderer.opaqueRender$
+        const render$ = renderer.renderPass === RenderPass.Opaque ?
+            this._container.glRenderer.opaqueRender$ :
+            this._container.glRenderer.transparentRender$;
+
+        subs.push(render$
             .pipe(
                 withLatestFrom(
                     this._container.renderService.renderCamera$,

src/viewer/enums/RenderPass.ts

@@ -3,4 +3,9 @@ export enum RenderPass {
      * Occurs after the background render pass.
      */
     Opaque,
+
+    /**
+     * Occurs last in the render sequence, after the opaque render pass.
+     */
+    Transparent,
 }