Add client open mode preference (same tab / new window) to user settings

app/Http/Controllers/User/PreferencesController.php

@@ -31,6 +31,7 @@ class PreferencesController extends Controller
             'friend_requests' => 'sometimes|boolean',
             'room_invites' => 'sometimes|boolean',
             'email_notifications' => 'sometimes|boolean',
+            'client_open_mode' => 'sometimes|in:same,new_window',
         ]);
 
         $preferences = array_merge($this->getDefaultPreferences(), $validated);
@@ -49,6 +50,7 @@ class PreferencesController extends Controller
             'friend_requests' => true,
             'room_invites' => true,
             'email_notifications' => false,
+            'client_open_mode' => 'same',
         ];
     }
 }

resources/themes/atom/views/components/site-header.blade.php

@@ -22,30 +22,31 @@
  </div>
 
  <div class="flex flex-col gap-y-2 md:flex-row md:gap-x-4">
- <a data-turbolinks="false" href="{{ route('nitro-client') }}">
- <button
- class="font-bold py-3 px-6 rounded-xl shadow-xl border-2 transition-all duration-300 hover:scale-110 hover:shadow-2xl text-base tracking-wide"
- style="background-color: var(--button-color); color: var(--button-text-color); border-color: rgba(255,255,255,0.3);">
- <span class="flex items-center gap-2">
- <i class="fa-solid fa-gamepad"></i>
- <span class="-md">{{ __('Nitro client') }}</span>
- </span>
- </button>
- </a>
+  @php $clientOpenMode = auth()->user()->preferences['client_open_mode'] ?? 'same'; @endphp
+  <a data-turbolinks="false" href="{{ route('nitro-client') }}" @if($clientOpenMode === 'new_window') target="_blank" rel="noopener" @endif>
+  <button
+  class="font-bold py-3 px-6 rounded-xl shadow-xl border-2 transition-all duration-300 hover:scale-110 hover:shadow-2xl text-base tracking-wide"
+  style="background-color: var(--button-color); color: var(--button-text-color); border-color: rgba(255,255,255,0.3);">
+  <span class="flex items-center gap-2">
+  <i class="fa-solid fa-gamepad"></i>
+  <span class="-md">{{ __('Nitro client') }}</span>
+  </span>
+  </button>
+  </a>
 
- @if (config('habbo.client.flash_enabled'))
- <a data-turbolinks="false" href="{{ route('flash-client') }}">
- <button
- class="font-bold py-3 px-6 rounded-xl shadow-xl border-2 transition-all duration-300 hover:scale-110 hover:shadow-2xl text-base tracking-wide"
- style="background-color: var(--button-color); color: var(--button-text-color); border-color: rgba(255,255,255,0.3);">
- <span class="flex items-center gap-2">
- <i class="fa-solid fa-bolt"></i>
- <span class="-md">{{ __('Flash client') }}</span>
- </span>
- </button>
- </a>
- @endif
- </div>
+  @if (config('habbo.client.flash_enabled'))
+  <a data-turbolinks="false" href="{{ route('flash-client') }}" @if($clientOpenMode === 'new_window') target="_blank" rel="noopener" @endif>
+  <button
+  class="font-bold py-3 px-6 rounded-xl shadow-xl border-2 transition-all duration-300 hover:scale-110 hover:shadow-2xl text-base tracking-wide"
+  style="background-color: var(--button-color); color: var(--button-text-color); border-color: rgba(255,255,255,0.3);">
+  <span class="flex items-center gap-2">
+  <i class="fa-solid fa-bolt"></i>
+  <span class="-md">{{ __('Flash client') }}</span>
+  </span>
+  </button>
+  </a>
+  @endif
+  </div>
  </div>
  @endauth
 

resources/themes/atom/views/components/user/me-backdrop.blade.php

@@ -13,11 +13,12 @@
  </a>
  </div>
 
- <a data-turbolinks="false" href="{{ route('nitro-client') }}">
- <button
- class="font-bold py-2 px-4 rounded-lg shadow-lg transition-all duration-300 hover:scale-105 hover:opacity-90"
- style="background-color: var(--button-color); color: var(--button-text-color);">
- {{ __('Go to :hotel', ['hotel' => setting('hotel_name')]) }}
- </button>
- </a>
+ @php $clientOpenMode = auth()->user()->preferences['client_open_mode'] ?? 'same'; @endphp
+ <a data-turbolinks="false" href="{{ route('nitro-client') }}" @if($clientOpenMode === 'new_window') target="_blank" rel="noopener" @endif>
+  <button
+  class="font-bold py-2 px-4 rounded-lg shadow-lg transition-all duration-300 hover:scale-105 hover:opacity-90"
+  style="background-color: var(--button-color); color: var(--button-text-color);">
+  {{ __('Go to :hotel', ['hotel' => setting('hotel_name')]) }}
+  </button>
+  </a>
 </div>

resources/themes/atom/views/user/settings/preferences.blade.php

@@ -85,6 +85,24 @@
 
  <hr style="border-color: var(--color-text-muted);">
 
+ {{-- Client Settings --}}
+ <div>
+ <h3 class="text-lg font-semibold mb-4" style="color: var(--color-text);">{{ __('Client Settings') }}</h3>
+ <div class="space-y-4">
+ <label class="flex items-center justify-between cursor-pointer p-3 rounded" style="background-color: var(--color-surface);">
+ <div>
+ <span class="font-semibold" style="color: var(--color-text);">{{ __('Open client in new window') }}</span>
+ <p class="text-sm" style="color: var(--color-text-muted);">{{ __('When enabled, the game client will open in a new browser tab instead of navigating away from the site') }}</p>
+ </div>
+ <input type="hidden" name="client_open_mode" value="same">
+ <input type="checkbox" name="client_open_mode" value="new_window" {{ old('client_open_mode', $preferences['client_open_mode'] ?? 'same') === 'new_window' ? 'checked' : '' }}
+ class="w-5 h-5 rounded cursor-pointer" style="accent-color: var(--color-primary);">
+ </label>
+ </div>
+ </div>
+
+ <hr style="border-color: var(--color-text-muted);">
+
  {{-- Notification Settings --}}
  <div>
  <h3 class="text-lg font-semibold mb-4" style="color: var(--color-text);">{{ __('Notification Settings') }}</h3>

resources/themes/dusk/views/components/user/me-backdrop.blade.php

@@ -12,7 +12,8 @@
         </a>
     </div>
 
-    <a data-turbolinks="false" href="{{ route('nitro-client') }}">
+    @php $openMode = auth()->user()->preferences['client_open_mode'] ?? 'same'; @endphp
+    <a data-turbolinks="false" href="{{ route('nitro-client') }}" @if($openMode === 'new_window') target="_blank" rel="noopener" @endif>
         <button
             class="cms-button bg-yellow-500 hover:bg-yellow-400 text-yellow-900 font-bold py-2 px-4 rounded-lg shadow-lg transition-all duration-300 hover:scale-105">
             {{ __('Go to :hotel', ['hotel' => setting('hotel_name')]) }}

resources/themes/dusk/views/components/user/settings/settings-navigation.blade.php

@@ -1,3 +1,12 @@
+<a href="{{ route('settings.preferences.show') }}"
+    class="{{ request()->routeIs('settings.preferences.show') ? 'bg-[#eeb425]' : 'bg-[#21242e]' }} flex gap-x-2 justify-center items-center rounded p-2 md:p-6 text-center md:text-xl font-semibold transition duration-200 ease-in-out settings-nav" style="color: var(--color-text);">
+    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-6 w-6">
+        <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 6h9.75M10.5 6a1.5 1.5 0 11-3 0m3 0a1.5 1.5 0 10-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-9.75 0h9.75" />
+    </svg>
+
+    {{ __('Preferences') }}
+</a>
+
 <a href="{{ route('settings.account.show') }}"
     class="{{ request()->routeIs('settings.account.show') ? 'bg-[#eeb425]' : 'bg-[#21242e]' }} flex gap-x-2 justify-center items-center rounded p-2 md:p-6 text-center md:text-xl font-semibold transition duration-200 ease-in-out settings-nav" style="color: var(--color-text);">
     <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"

resources/themes/dusk/views/user/me.blade.php

@@ -37,12 +37,13 @@
             </div>
 
            <div class="self-start lg:ml-14 w-full lg:w-64">
-               <a href="{{ route('nitro-client') }}">
-                   <button type="submit" class="cms-button w-full text-white bg-yellow-500 border-2 border-yellow-300 w-full rounded transition duration-300 ease-in-out hover:scale-[102%] py-2 px-4">
-                       {{ __('Go to :hotel', ['hotel' => setting('hotel_name')]) }}
-                   </button>
-               </a>
-           </div>
+                @php $openMode = auth()->user()->preferences['client_open_mode'] ?? 'same'; @endphp
+                <a href="{{ route('nitro-client') }}" @if($openMode === 'new_window') target="_blank" rel="noopener" @endif>
+                    <button type="submit" class="cms-button w-full text-white bg-yellow-500 border-2 border-yellow-300 w-full rounded transition duration-300 ease-in-out hover:scale-[102%] py-2 px-4">
+                        {{ __('Go to :hotel', ['hotel' => setting('hotel_name')]) }}
+                    </button>
+                </a>
+            </div>
         </div>
 
         <div class="absolute w-full bottom-0 left-0 h-20 bg-gray-900 py-4 lg:pl-64 px-4 lg:px-0">

resources/themes/dusk/views/user/settings/preferences.blade.php

@@ -0,0 +1,130 @@
+<x-app-layout>
+    @push('title', __('Preferences'))
+
+    <div class="col-span-12 flex flex-col gap-y-3 md:col-span-3">
+        <x-user.settings.settings-navigation />
+    </div>
+
+    <div class="col-span-12 flex flex-col gap-y-3 md:col-span-9">
+        <x-content.content-card icon="cog-icon">
+            <x-slot:title>
+                {{ __('Preferences') }}
+            </x-slot:title>
+
+            <x-slot:under-title>
+                {{ __('Manage your preferences') }}
+            </x-slot:under-title>
+
+            <form action="{{ route('settings.preferences.update') }}" method="POST" class="flex flex-col gap-y-6">
+                @method('PUT')
+                @csrf
+
+                {{-- Radio Settings --}}
+                <div>
+                    <h3 class="text-lg font-semibold mb-4" style="color: var(--color-text);">{{ __('Radio Settings') }}</h3>
+                    <div class="space-y-4">
+                        <label class="flex items-center justify-between cursor-pointer p-3 rounded" style="background-color: var(--color-surface);">
+                            <div>
+                                <span class="font-semibold" style="color: var(--color-text);">{{ __('Auto-play radio') }}</span>
+                                <p class="text-sm" style="color: var(--color-text-muted);">{{ __('Automatically start playing radio when you visit the site') }}</p>
+                            </div>
+                            <input type="hidden" name="radio_auto_play" value="0">
+                            <input type="checkbox" name="radio_auto_play" value="1" {{ old('radio_auto_play', $preferences['radio_auto_play'] ?? false) ? 'checked' : '' }}
+                                   class="w-5 h-5 rounded cursor-pointer" style="accent-color: var(--color-primary);">
+                        </label>
+
+                        <label class="flex items-center justify-between cursor-pointer p-3 rounded" style="background-color: var(--color-surface);">
+                            <div>
+                                <span class="font-semibold" style="color: var(--color-text);">{{ __('Show radio shouts') }}</span>
+                                <p class="text-sm" style="color: var(--color-text-muted);">{{ __('Show live shouts panel on the radio player') }}</p>
+                            </div>
+                            <input type="hidden" name="radio_shouts" value="0">
+                            <input type="checkbox" name="radio_shouts" value="1" {{ old('radio_shouts', $preferences['radio_shouts'] ?? true) ? 'checked' : '' }}
+                                   class="w-5 h-5 rounded cursor-pointer" style="accent-color: var(--color-primary);">
+                        </label>
+
+                        <label class="flex items-center justify-between cursor-pointer p-3 rounded" style="background-color: var(--color-surface);">
+                            <div>
+                                <span class="font-semibold" style="color: var(--color-text);">{{ __('Radio notifications') }}</span>
+                                <p class="text-sm" style="color: var(--color-text-muted);">{{ __('Show notifications when a new song plays') }}</p>
+                            </div>
+                            <input type="hidden" name="radio_notifications" value="0">
+                            <input type="checkbox" name="radio_notifications" value="1" {{ old('radio_notifications', $preferences['radio_notifications'] ?? true) ? 'checked' : '' }}
+                                   class="w-5 h-5 rounded cursor-pointer" style="accent-color: var(--color-primary);">
+                        </label>
+                    </div>
+                </div>
+
+                <hr style="border-color: var(--color-text-muted); opacity: 0.3;">
+
+                {{-- Social Settings --}}
+                <div>
+                    <h3 class="text-lg font-semibold mb-4" style="color: var(--color-text);">{{ __('Social Settings') }}</h3>
+                    <div class="space-y-4">
+                        <label class="flex items-center justify-between cursor-pointer p-3 rounded" style="background-color: var(--color-surface);">
+                            <div>
+                                <span class="font-semibold" style="color: var(--color-text);">{{ __('Friend requests') }}</span>
+                                <p class="text-sm" style="color: var(--color-text-muted);">{{ __('Allow other users to send you friend requests') }}</p>
+                            </div>
+                            <input type="hidden" name="friend_requests" value="0">
+                            <input type="checkbox" name="friend_requests" value="1" {{ old('friend_requests', $preferences['friend_requests'] ?? true) ? 'checked' : '' }}
+                                   class="w-5 h-5 rounded cursor-pointer" style="accent-color: var(--color-primary);">
+                        </label>
+
+                        <label class="flex items-center justify-between cursor-pointer p-3 rounded" style="background-color: var(--color-surface);">
+                            <div>
+                                <span class="font-semibold" style="color: var(--color-text);">{{ __('Room invites') }}</span>
+                                <p class="text-sm" style="color: var(--color-text-muted);">{{ __('Allow other users to invite you to rooms') }}</p>
+                            </div>
+                            <input type="hidden" name="room_invites" value="0">
+                            <input type="checkbox" name="room_invites" value="1" {{ old('room_invites', $preferences['room_invites'] ?? true) ? 'checked' : '' }}
+                                   class="w-5 h-5 rounded cursor-pointer" style="accent-color: var(--color-primary);">
+                        </label>
+                    </div>
+                </div>
+
+                <hr style="border-color: var(--color-text-muted); opacity: 0.3;">
+
+                {{-- Client Settings --}}
+                <div>
+                    <h3 class="text-lg font-semibold mb-4" style="color: var(--color-text);">{{ __('Client Settings') }}</h3>
+                    <div class="space-y-4">
+                        <label class="flex items-center justify-between cursor-pointer p-3 rounded" style="background-color: var(--color-surface);">
+                            <div>
+                                <span class="font-semibold" style="color: var(--color-text);">{{ __('Open client in new window') }}</span>
+                                <p class="text-sm" style="color: var(--color-text-muted);">{{ __('When enabled, the game client will open in a new browser tab instead of navigating away from the site') }}</p>
+                            </div>
+                            <input type="hidden" name="client_open_mode" value="same">
+                            <input type="checkbox" name="client_open_mode" value="new_window" {{ old('client_open_mode', $preferences['client_open_mode'] ?? 'same') === 'new_window' ? 'checked' : '' }}
+                                   class="w-5 h-5 rounded cursor-pointer" style="accent-color: var(--color-primary);">
+                        </label>
+                    </div>
+                </div>
+
+                <hr style="border-color: var(--color-text-muted); opacity: 0.3;">
+
+                {{-- Notification Settings --}}
+                <div>
+                    <h3 class="text-lg font-semibold mb-4" style="color: var(--color-text);">{{ __('Notification Settings') }}</h3>
+                    <div class="space-y-4">
+                        <label class="flex items-center justify-between cursor-pointer p-3 rounded" style="background-color: var(--color-surface);">
+                            <div>
+                                <span class="font-semibold" style="color: var(--color-text);">{{ __('Email notifications') }}</span>
+                                <p class="text-sm" style="color: var(--color-text-muted);">{{ __('Receive email notifications for important updates') }}</p>
+                            </div>
+                            <input type="hidden" name="email_notifications" value="0">
+                            <input type="checkbox" name="email_notifications" value="1" {{ old('email_notifications', $preferences['email_notifications'] ?? false) ? 'checked' : '' }}
+                                   class="w-5 h-5 rounded cursor-pointer" style="accent-color: var(--color-primary);">
+                        </label>
+                    </div>
+                </div>
+
+                <div class="flex w-full justify-start md:justify-end">
+                    <x-form.primary-button classes="lg:w-1/4">
+                        {{ __('Save preferences') }}
+                    </x-form.primary-button>
+                </div>
+            </form>
+        </x-content.content-card>
+    </div>
+</x-app-layout>