Lobbysettings to crewlink v2

angular.json

@@ -29,7 +29,8 @@
                 "glob": "**/*.svg",
                 "input": "node_modules/ionicons/dist/ionicons/svg",
                 "output": "./svg"
-              }
+              },
+              "src/manifest.webmanifest"
             ],
             "styles": [
               {
@@ -64,7 +65,9 @@
                   "maximumWarning": "2mb",
                   "maximumError": "5mb"
                 }
-              ]
+              ],
+              "serviceWorker": true,
+              "ngswConfigPath": "ngsw-config.json"
             },
             "ci": {
               "progress": false
@@ -110,7 +113,8 @@
                 "glob": "**/*",
                 "input": "src/assets",
                 "output": "/assets"
-              }
+              },
+              "src/manifest.webmanifest"
             ]
           },
           "configurations": {

ngsw-config.json

@@ -0,0 +1,30 @@
+{
+  "$schema": "./node_modules/@angular/service-worker/config/schema.json",
+  "index": "/index.html",
+  "assetGroups": [
+    {
+      "name": "app",
+      "installMode": "prefetch",
+      "resources": {
+        "files": [
+          "/favicon.ico",
+          "/index.html",
+          "/manifest.webmanifest",
+          "/*.css",
+          "/*.js"
+        ]
+      }
+    },
+    {
+      "name": "assets",
+      "installMode": "lazy",
+      "updateMode": "prefetch",
+      "resources": {
+        "files": [
+          "/assets/**",
+          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
+        ]
+      }
+    }
+  ]
+}

package.json

@@ -11,7 +11,7 @@
     "lint": "ng lint",
     "e2e": "ng e2e",
     "dev": "ionic serve --external --ssl",
-    "build" : "ionic capacitor build android --prod"
+    "build": "ionic capacitor build android --prod"
   },
   "private": true,
   "dependencies": {
@@ -21,6 +21,7 @@
     "@angular/platform-browser": "~10.0.0",
     "@angular/platform-browser-dynamic": "~10.0.0",
     "@angular/router": "~10.0.0",
+    "@angular/service-worker": "~10.0.0",
     "@capacitor/android": "^2.4.5",
     "@capacitor/core": "2.4.5",
     "@ionic-native/android-permissions": "^5.30.0",

src/app/app.module.ts

@@ -13,11 +13,13 @@ import { IonicStorageModule } from '@ionic/storage';
 import { AndroidPermissions } from '@ionic-native/android-permissions/ngx';
 import { Platform } from '@ionic/angular';
 import { LocalNotifications } from '@ionic-native/local-notifications/ngx';
+import { ServiceWorkerModule } from '@angular/service-worker';
+import { environment } from '../environments/environment';
 
 @NgModule({
 	declarations: [AppComponent],
 	entryComponents: [],
-	imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, IonicStorageModule.forRoot()],
+	imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, IonicStorageModule.forRoot(), ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production })],
 	providers: [
 		StatusBar,
 		SplashScreen,

src/app/comp/AudioController.ts

@@ -32,7 +32,9 @@ export default class AudioController extends EventEmitterO {
 		document.body.appendChild(htmlAudioElement);
 		htmlAudioElement.srcObject = stream;
 
+		const AudioContext = window.webkitAudioContext || window.AudioContext;
 		const context = new AudioContext();
+
 		const source = context.createMediaStreamSource(stream);
 		const gain = context.createGain();
 		const pan = context.createPanner();
@@ -44,9 +46,14 @@ export default class AudioController extends EventEmitterO {
 		pan.maxDistance = connectionController.lobbySettings.maxDistance;
 		pan.rolloffFactor = 1;
 
+		const muffle = context.createBiquadFilter();
+		muffle.type = 'lowpass';
+
 		source.connect(pan);
-		pan.connect(gain);
+		pan.connect(muffle);
+		muffle.connect(gain);
 		gain.connect(compressor);
+
 		gain.gain.value = 0;
 		htmlAudioElement.volume = 1;
 		const audioContext = pan.context;
@@ -55,6 +62,8 @@ export default class AudioController extends EventEmitterO {
 		pan.positionX.setValueAtTime(panPos[0], audioContext.currentTime);
 		pan.positionY.setValueAtTime(panPos[1], audioContext.currentTime);
 		compressor.connect(context.destination);
+		htmlAudioElement.autoplay = true;
+		htmlAudioElement.play();
 
 		return {
 			htmlAudioElement,
@@ -63,19 +72,23 @@ export default class AudioController extends EventEmitterO {
 			gain,
 			pan,
 			compressor,
+			muffle
 		};
 	}
 
 	// move to different controller
 	updateAudioLocation(currentGameState: AmongUsState, element: SocketElement, localPLayer: Player) {
-		//		console.log('updateAudioLocation ->', { element });
+		// console.log('updateAudioLocation ->', { element });
 		if (!element.audioElement || !element.client || !element.player || !localPLayer) {
-			if (element?.audioElement?.gain?.gain) {element.audioElement.gain.gain.value = 0; }
+			if (element?.audioElement?.gain?.gain) {
+				element.audioElement.gain.gain.value = 0;
+			}
 			return;
 		}
-		//	console.log('[updateAudioLocation]');
+		// console.log('[updateAudioLocation]');
 		const pan = element.audioElement.pan;
 		const gain = element.audioElement.gain;
+		const muffle = element.audioElement.muffle;
 		const audioContext = pan.context;
 
 		const other = element.player; // this.getPlayer(element.client?.clientId);
@@ -92,13 +105,25 @@ export default class AudioController extends EventEmitterO {
 			case GameState.TASKS:
 				gain.gain.value = 1;
 
-				if (!localPLayer.isDead && connectionController.lobbySettings.commsDisabled && currentGameState.comsSabotaged) {
+				if (!localPLayer.isDead && connectionController.lobbySettings.commsSabotage && currentGameState.comsSabotaged) {
 					gain.gain.value = 0;
 				}
 
 				// Mute other players which are in a vent
-				if (other.inVent) {
-					gain.gain.value = localPLayer.inVent && connectionController.lobbySettings.ventTalk ? 1 : 0;
+				if (other.inVent && !connectionController.lobbySettings.hearImpostorsInVents) {
+					gain.gain.value = 0;
+				}
+
+				if (muffle) {
+					// Muffling in vents
+					if (localPLayer.inVent || other.inVent) {
+						muffle.frequency.value = 1200;
+						muffle.Q.value = 20;
+						if (gain.gain.value === 1) gain.gain.value = 0.7; // Too loud at 1
+					} else {
+						muffle.frequency.value = 20000;
+						muffle.Q.value = 0;
+					}
 				}
 
 				if (
@@ -166,10 +191,11 @@ export default class AudioController extends EventEmitterO {
 			.filter((o) => o.kind === 'audiooutput' || o.kind === 'audioinput')
 			.sort((a, b) => b.kind.localeCompare(a.kind))
 			.map((o) => {
+				const id = deviceId++;
 				return {
-					id: deviceId,
+					id,
 					kind: o.kind,
-					label: o.label || `mic ${o.kind.charAt(5)} ${deviceId++}`,
+					label: o.label || `mic ${o.kind.charAt(5)} ${id}`,
 					deviceId: o.deviceId,
 				};
 			});

src/app/comp/smallInterfaces.ts

@@ -37,21 +37,24 @@ export interface AudioElement {
 	mediaStreamAudioSource: MediaStreamAudioSourceNode;
 	gain: GainNode;
 	pan: PannerNode;
+	muffle: BiquadFilterNode;
 	compressor: DynamicsCompressorNode;
 }
 
+
 export interface ILobbySettings {
 	maxDistance: number;
 	haunting: boolean;
-	ventTalk: boolean;
-	commsDisabled: boolean;
+	hearImpostorsInVents: boolean;
+	commsSabotage: boolean;
 }
 
+
 export const DEFAULT_LOBBYSETTINGS: ILobbySettings = {
 	maxDistance: 5.6,
 	haunting: false,
-	ventTalk: false,
-	commsDisabled: false,
+	hearImpostorsInVents: false,
+	commsSabotage: false,
 };
 
 export class SocketElement {

src/index.html

@@ -2,25 +2,28 @@
 <html lang="en">
 
 <head>
-  <meta charset="utf-8" />
-  <title>Ionic App</title>
+  <meta charset="utf-8"/>
+  <title>BetterCrewlink - App</title>
 
-  <base href="/" />
+  <base href="/"/>
 
-  <meta name="color-scheme" content="light dark" />
-  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-  <meta name="format-detection" content="telephone=no" />
-  <meta name="msapplication-tap-highlight" content="no" />
+  <meta name="color-scheme" content="light dark"/>
+  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
+  <meta name="format-detection" content="telephone=no"/>
+  <meta name="msapplication-tap-highlight" content="no"/>
 
-  <link rel="icon" type="image/png" href="assets/icon/favicon.png" />
+  <link rel="icon" type="image/png" href="assets/icon/favicon.png"/>
 
   <!-- add to homescreen for ios -->
-  <meta name="apple-mobile-web-app-capable" content="yes" />
-  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+  <meta name="apple-mobile-web-app-capable" content="yes"/>
+  <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
+  <link rel="manifest" href="manifest.webmanifest">
+  <meta name="theme-color" content="#1976d2">
 </head>
 
 <body>
   <app-root></app-root>
+  <noscript>Please enable JavaScript to continue using this application.</noscript>
 </body>
 
 </html>

src/manifest.webmanifest

@@ -0,0 +1,31 @@
+{
+	"name": "BetterCrewlink-PWA",
+	"short_name": "BetterCrewlink-PWA",
+	"theme_color": "#1976d2",
+	"background_color": "#fafafa",
+	"display": "standalone",
+	"scope": "./",
+	"start_url": "./",
+	"icons": [
+		{
+			"src": "assets/icons/icon-192x192.png",
+			"sizes": "192x192",
+			"type": "image/png"
+		},
+		{
+			"src": "assets/icons/icon-256x256.png",
+			"sizes": "256x256",
+			"type": "image/png"
+		},
+		{
+			"src": "assets/icons/icon-384x384.png",
+			"sizes": "384x384",
+			"type": "image/png"
+		},
+		{
+			"src": "assets/icons/icon-512x512.png",
+			"sizes": "512x512",
+			"type": "image/png"
+		}
+	]
+}

src/polyfills.ts

@@ -73,6 +73,12 @@ import 'zone.js/dist/zone'; // Included with Angular CLI.
 	},
 };
 
+declare global {
+	interface Window {
+		webkitAudioContext: typeof AudioContext;
+	}
+}
+
 // navigator.getUserMedia =
 // 	navigator.getUserMedia ||
 // 	navigator.webkitGetUserMedia ||