feat: preferred stream settings

Vencord · Jan 24, 2025 · 3d702d0 · 3d702d0
1 parent 030ffca
commit 3d702d0
Show file tree

Hide file tree

Showing 3 changed files with 128 additions and 3 deletions.
diff --git a/src/renderer/components/ScreenSharePicker.tsx b/src/renderer/components/ScreenSharePicker.tsx
@@ -453,6 +453,25 @@ function StreamSettings({
                     />
                 )}
             </Card>
+
+            <div className="vcd-screen-picker-save-settings">
+                <label htmlFor="" className="vcd-screen-picker-save-label">
+                    Remember stream settings
+                </label>
+                <div className="vcd-screen-picker-save-control">
+                    <div
+                        className={`vcd-screen-picker-save-checkbox ${Settings.stream?.preferred && "checked"}`}
+                        onClick={() => {
+                            Settings.stream = { ...Settings.stream, preferred: !Settings.stream?.preferred };
+                        }}
+                    >
+                        <div className="vcd-screen-picker-save-knob">
+                            <div className="vcd-screen-picker-save-line"></div>
+                            <div className="vcd-screen-picker-save-line2"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
     );
 }
@@ -699,11 +718,13 @@ function ModalComponent({
     close: () => void;
     skipPicker: boolean;
 }) {
+    const Settings = useSettings();
+
     const [selected, setSelected] = useState<string | undefined>(skipPicker ? screens[0].id : void 0);
     const [settings, setSettings] = useState<StreamSettings>({
-        resolution: "720",
-        fps: "30",
-        contentHint: "motion",
+        resolution: Settings.stream?.preferred ? (Settings.stream.resolution as StreamResolution) : "720",
+        fps: Settings.stream?.preferred ? (Settings.stream.fps as StreamFps) : "30",
+        contentHint: Settings.stream?.preferred ? Settings.stream.contentHint : "motion",
         audio: true,
         includeSources: "None"
     });
@@ -779,6 +800,19 @@ function ModalComponent({
                                     logger.error("Failed to apply constraints.", e);
                                 }
                             }, 100);
+
+                            // Update the preferred stream value if it has changed.
+                            if (Settings.stream?.preferred) {
+                                if (settings.resolution !== Settings.stream?.resolution) {
+                                    Settings.stream.resolution = settings.resolution;
+                                }
+                                if (settings.fps !== Settings.stream?.fps) {
+                                    Settings.stream.fps = settings.fps;
+                                }
+                                if (settings.contentHint !== Settings.stream?.contentHint) {
+                                    Settings.stream.contentHint = settings.contentHint;
+                                }
+                            }
                         } catch (error) {
                             logger.error("Error while submitting stream.", error);
                         }

diff --git a/src/renderer/components/screenSharePicker.css b/src/renderer/components/screenSharePicker.css
@@ -143,3 +143,87 @@
     line-height: 20px;
     font-weight: 400;
 }
+
+.vcd-screen-picker-save-settings {
+    display: flex;
+    flex-direction: row;
+    width: 100%;
+    align-items: center;
+    margin-bottom: 0.5em;
+    margin-top: 0.5em;
+}
+
+.vcd-screen-picker-save-label {
+    flex: 1;
+    display: block;
+    overflow: hidden;
+    margin-top: 0;
+    margin-bottom: 0;
+    color: var(--header-primary);
+    line-height: 24px;
+    font-size: 16px;
+    font-weight: 500;
+    word-wrap: break-word;
+    cursor: pointer;
+}
+
+.vcd-screen-picker-save-control{
+    flex: 0 0 auto;
+}
+
+.vcd-screen-picker-save-checkbox {
+    position: relative;
+    margin: 10px 10px;
+    width: 40px;
+    height: 24px;
+    border-radius: 60px;
+    cursor: pointer;
+    background: #72767d;
+    transition: background 0.3s linear;
+  }
+  .vcd-screen-picker-save-knob {
+    position: absolute;
+    width: 18px;
+    height: 18px;
+    top: 3px;
+    left: 3px;
+    background: #fff;
+    border-radius: 30px;
+    transition: left 0.3s ease-out;
+  }
+  .vcd-screen-picker-save-line,
+  .vcd-screen-picker-save-line2 {
+      position: absolute;
+      top: 8px;
+      left: 3px;
+      width: 12px;
+      height: 2px;
+      background: #72767d;
+      transition: transform 0.3s ease-out, background-color 0.3s ease-out; /* Add transitions */
+  }
+
+  .vcd-screen-picker-save-line {
+      transform: rotateZ(0deg); /* Start at 0deg */
+  }
+
+  .vcd-screen-picker-save-line2 {
+      transform: rotateZ(0deg); /* Start at 0deg */
+  }
+
+  .vcd-screen-picker-save-checkbox.checked {
+      background: var(--brand-500);
+  }
+
+  .vcd-screen-picker-save-checkbox.checked .vcd-screen-picker-save-knob {
+      left: 19px; /* Directly set the final position */
+  }
+
+  .vcd-screen-picker-save-checkbox.checked .vcd-screen-picker-save-line {
+      transform: rotateZ(45deg);
+      background-color: var(--brand-500);
+  }
+
+  .vcd-screen-picker-save-checkbox.checked .vcd-screen-picker-save-line2 {
+      transform: rotateZ(-45deg);
+      background-color: var(--brand-500);
+  }
diff --git a/src/shared/settings.d.ts b/src/shared/settings.d.ts
@@ -41,6 +41,13 @@ export interface Settings {
         onlySpeakers?: boolean;
         onlyDefaultSpeakers?: boolean;
     };
+
+    stream?: {
+        preferred?: boolean;
+        resolution?: string;
+        fps?: string;
+        contentHint?: string;
+    };
 }
 
 export interface State {