Support emby branding

server/auth.go

@@ -150,6 +150,7 @@ type AvailableAuthProvidersResponse struct {
 	AvailableAuthProviders []string `json:"available"`
 	SignupEnabled          bool     `json:"signupEnabled"`
 	IsInSetup              bool     `json:"isInSetup"`
+	UseEmby                bool     `json:"useEmby"`
 }
 
 type ArgonParams struct {

server/config.go

@@ -34,6 +34,9 @@ type ServerConfig struct {
 	// to enable it as an auth provider.
 	JELLYFIN_HOST string `json:",omitempty"`
 
+	// Optional: Use Emby instead of Jellyfin branding in the ui.
+	USE_EMBY bool
+
 	// Enable/disable signup functionality.
 	// Set to `false` to disable registering an account.
 	SIGNUP_ENABLED bool
@@ -73,6 +76,7 @@ func (c *ServerConfig) GetSafe() ServerConfig {
 		SIGNUP_ENABLED:  c.SIGNUP_ENABLED,
 		DEFAULT_COUNTRY: c.DEFAULT_COUNTRY,
 		JELLYFIN_HOST:   c.JELLYFIN_HOST,
+		USE_EMBY:        c.USE_EMBY,
 		TMDB_KEY:        c.TMDB_KEY,
 		PLEX_HOST:       c.PLEX_HOST,
 		PLEX_MACHINE_ID: c.PLEX_MACHINE_ID,
@@ -150,6 +154,8 @@ func updateConfig(k string, v any) error {
 	}
 	if k == "JELLYFIN_HOST" {
 		Config.JELLYFIN_HOST = v.(string)
+	} else if k == "USE_EMBY" {
+		Config.USE_EMBY = v.(bool)
 	} else if k == "SIGNUP_ENABLED" {
 		Config.SIGNUP_ENABLED = v.(bool)
 	} else if k == "TMDB_KEY" {

server/routes.go

@@ -622,6 +622,7 @@ func (b *BaseRouter) addAuthRoutes() {
 			AvailableAuthProviders: availableAuthProviders,
 			SignupEnabled:          Config.SIGNUP_ENABLED,
 			IsInSetup:              ServerInSetup,
+			UseEmby:                Config.USE_EMBY,
 		})
 	})
 

src/lib/Icon.svelte

@@ -58,6 +58,12 @@
       d="M12 .002C8.826.002-1.398 18.537.16 21.666c1.56 3.129 22.14 3.094 23.682 0C25.384 18.573 15.177 0 12 0zm7.76 18.949c-1.008 2.028-14.493 2.05-15.514 0C3.224 16.9 9.92 4.755 12.003 4.755c2.081 0 8.77 12.166 7.759 14.196zM12 9.198c-1.054 0-4.446 6.15-3.93 7.189.518 1.04 7.348 1.027 7.86 0 .511-1.027-2.874-7.19-3.93-7.19z"
     />
   </svg>
+{:else if i === "emby"}
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width={wh} height={wh}>
+    <path
+      d="M11.041 0c-.007 0-1.456 1.43-3.219 3.176L4.615 6.352l.512.513.512.512-2.819 2.791L0 12.961l1.83 1.848c1.006 1.016 2.438 2.46 3.182 3.209l1.351 1.359.508-.496c.28-.273.515-.498.524-.498.008 0 1.266 1.264 2.794 2.808L12.97 24l.187-.182c.23-.225 5.007-4.95 5.717-5.656l.52-.516-.502-.513c-.276-.282-.5-.52-.496-.53.003-.009 1.264-1.26 2.802-2.783 1.538-1.522 2.8-2.776 2.803-2.785.005-.012-3.617-3.684-6.107-6.193L17.65 4.6l-.505.505c-.279.278-.517.501-.53.497-.013-.005-1.27-1.267-2.793-2.805A449.655 449.655 0 0011.041 0zM9.223 7.367c.091.038 7.951 4.608 7.957 4.627.003.013-1.781 1.056-3.965 2.32a999.898 999.898 0 01-3.996 2.307c-.019.006-.026-1.266-.026-4.629 0-3.7.007-4.634.03-4.625Z"
+    />
+  </svg>
 {:else if i === "plex"}
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width={wh} height={wh}>
     <path d="M256 70H148l108 186-108 186h108l108-186z" fill="#e5a00d" />

src/routes/(app)/profile/+page.svelte

@@ -292,7 +292,7 @@
         {/if}
         {#if user?.type === UserType?.Jellyfin}
           <button on:click={() => (jellyfinSyncModalOpen = true)} disabled={exportDisabled}>
-            Sync With Jellyfin
+            Sync With {localStorage.getItem("useEmby") ? "Emby" : "Jellyfin"}
           </button>
         {/if}
         {#if user?.type === UserType?.Plex}

src/routes/(app)/profile/modals/SyncModal.svelte

@@ -113,7 +113,11 @@
 </script>
 
 <Modal
-  title="{type === 'jellyfin' ? 'Jellyfin' : 'Plex'} Sync"
+  title="{type === 'jellyfin'
+    ? localStorage.getItem('useEmby')
+      ? 'Emby'
+      : 'Jellyfin'
+    : 'Plex'} Sync"
   maxWidth="700px"
   onClose={modalClose}
 >

src/routes/(app)/server/+page.svelte

@@ -39,6 +39,7 @@
   let tmdbkDisabled = false;
   let plexHostDisabled = false;
   let countryDisabled = false;
+  let useEmbyDisabled = false;
   let selectedCountry: string;
   let countries: any;
   let countriesDropdown: DropDownItem[] = [];
@@ -92,6 +93,11 @@
   async function getServerStats() {
     return (await axios.get("/server/stats")).data as ServerStats;
   }
+
+  let jellyfinOrEmby = "Jellyfin";
+  $: {
+    jellyfinOrEmby = serverConfig?.USE_EMBY ? "Emby" : "Jellyfin";
+  }
 </script>
 
 <div class="content">
@@ -148,13 +154,13 @@
           />
         </Setting>
         <Setting
-          title="Jellyfin Host"
-          desc="Point to your Jellyfin server to enable related features. Don't change server after
+          title="{jellyfinOrEmby} Host"
+          desc="Point to your {jellyfinOrEmby} server to enable related features. Don't change server after
         already using another."
         >
           <input
             type="text"
-            placeholder="https://jellyfin.example.com"
+            placeholder="https://{jellyfinOrEmby.toLowerCase()}.example.com"
             bind:value={serverConfig.JELLYFIN_HOST}
             on:blur={() => {
               jfDisabled = true;
@@ -165,6 +171,23 @@
             disabled={jfDisabled}
           />
         </Setting>
+        <Setting
+          title="Use Emby"
+          desc="Do you want to pretend you're using Emby instead of Jellyfin?"
+          row
+        >
+          <Checkbox
+            name="USE_EMBY"
+            disabled={useEmbyDisabled}
+            value={serverConfig.USE_EMBY}
+            toggled={(on) => {
+              useEmbyDisabled = true;
+              updateServerConfig("USE_EMBY", on, () => {
+                useEmbyDisabled = false;
+              });
+            }}
+          />
+        </Setting>
         <Setting
           title="Plex Host"
           desc="Point to your Plex server to enable related features. Don't change server after

src/routes/(app)/tv/[id]/+page.svelte

@@ -167,7 +167,11 @@
             {/if}
             {#if jellyfinUrl}
               <a class="btn" href={jellyfinUrl} target="_blank">
-                <Icon i="jellyfin" wh={14} />Play On Jellyfin
+                {#if localStorage.getItem("useEmby")}
+                  <Icon i="emby" wh={14} />Play On Emby
+                {:else}
+                  <Icon i="jellyfin" wh={14} />Play On Jellyfin
+                {/if}
               </a>
             {/if}
             {#if $serverFeatures.sonarr && data.tvId}

src/routes/(plain)/login/+page.svelte

@@ -11,6 +11,7 @@
   let login = true;
   let availableProviders: string[] = [];
   let signupEnabled = true;
+  let useEmby = false;
 
   onMount(() => {
     if (localStorage.getItem("token")) {
@@ -25,6 +26,7 @@
         }
         availableProviders = r.data.available;
         signupEnabled = r.data.signupEnabled;
+        useEmby = r.data.useEmby;
       }
     });
   });
@@ -60,6 +62,11 @@
         if (resp.data?.token) {
           console.log("Received token... logging in.");
           localStorage.setItem("token", resp.data.token);
+          if (useEmby) {
+            localStorage.setItem("useEmby", "1");
+          } else {
+            localStorage.removeItem("useEmby");
+          }
           goto("/");
           notify({ id: nid, text: `Welcome ${user}!`, type: "success" });
         }
@@ -142,9 +149,19 @@
         <div class="login-btns">
           <button type="submit"><span class="watcharr">W</span>Watcharr</button>
           {#if availableProviders?.length > 0}
-            {#each availableProviders.filter((ap) => ap !== "plex") as p}
-              <button type="submit" name={p} class="other"><Icon i={p} wh={18} />{p}</button>
-            {/each}
+            {#if availableProviders.find((ap) => ap === "jellyfin")}
+              {#if useEmby}
+                <button type="submit" name="jellyfin" class="other">
+                  <Icon i="emby" wh={18} />
+                  emby
+                </button>
+              {:else}
+                <button type="submit" name="jellyfin" class="other">
+                  <Icon i="jellyfin" wh={18} />
+                  jellyfin
+                </button>
+              {/if}
+            {/if}
           {/if}
         </div>
         {#if availableProviders?.findIndex((provider) => provider == "plex") > -1}

src/types.ts

@@ -11,6 +11,7 @@ export type Icon =
   | "play"
   | "pause"
   | "jellyfin"
+  | "emby"
   | "plex"
   | "trash"
   | "close"
@@ -207,6 +208,7 @@ export interface AvailableAuthProviders {
   available: string[];
   signupEnabled: boolean;
   isInSetup: boolean;
+  useEmby: boolean;
 }
 
 export interface TokenClaims {
@@ -788,6 +790,7 @@ export interface ManagedUser {
 export interface ServerConfig {
   DEFAULT_COUNTRY: string;
   JELLYFIN_HOST: string;
+  USE_EMBY: boolean;
   SIGNUP_ENABLED: boolean;
   TMDB_KEY: string;
   PLEX_HOST: string;