allow Lychee to be hosted in sub directories

LycheeOrg · Oct 20, 2024 · e65793e · e65793e
1 parent a293683
commit e65793e
Show file tree

Hide file tree

Showing 25 changed files with 123 additions and 112 deletions.
diff --git a/app/View/Components/Meta.php b/app/View/Components/Meta.php
@@ -26,6 +26,7 @@ class Meta extends Component
 	public string $siteOwner;
 	public string $imageUrl;
 	public string $pageUrl;
+	public string $baseUrl;
 	public bool $rssEnable;
 	public string $userCssUrl;
 	public string $userJsUrl;
@@ -64,6 +65,7 @@ public function __construct()
 		$this->rssEnable = Configs::getValueAsBool('rss_enable');
 		$this->userCssUrl = self::getUserCustomFiles('user.css');
 		$this->userJsUrl = self::getUserCustomFiles('custom.js');
+		$this->baseUrl = url('/');
 	}
 
 	/**

diff --git a/config/filesystems.php b/config/filesystems.php
@@ -112,7 +112,7 @@ function renv_cond(string $cst): string
 		'dist' => [
 			'driver' => 'local',
 			'root' => env('LYCHEE_DIST', public_path('dist/')),
-			'url' => env('LYCHEE_DIST_URL', '/dist/'),
+			'url' => env('LYCHEE_DIST_URL', renv_cond('APP_DIR') . '/dist/'),
 			'visibility' => 'public',
 		],
 

diff --git a/resources/js/components/gallery/thumbs/AlbumThumb.vue b/resources/js/components/gallery/thumbs/AlbumThumb.vue
@@ -52,6 +52,7 @@ import { useLycheeStateStore } from "@/stores/LycheeState";
 import AlbumThumbOverlay from "./AlbumThumbOverlay.vue";
 import AlbumThumbDecorations from "./AlbumThumbDecorations.vue";
 import { storeToRefs } from "pinia";
+import Constants from "@/services/constants";
 
 export type AlbumThumbConfig = {
 	album_thumb_css_aspect_ratio: string;
@@ -85,5 +86,5 @@ const linkClass = computed(
 );
 auth.getUser();
 
-const play_icon = ref((window.assets_url ?? "") + "/img/play-icon.png");
+const play_icon = ref(Constants.BASE_URL + "/img/play-icon.png");
 </script>
diff --git a/resources/js/components/gallery/thumbs/AlbumThumbImage.vue b/resources/js/components/gallery/thumbs/AlbumThumbImage.vue
@@ -16,6 +16,7 @@
 	</span>
 </template>
 <script setup lang="ts">
+import Constants from "@/services/constants";
 import { watch, ref, computed } from "vue";
 
 const props = defineProps<{
@@ -28,25 +29,25 @@ const src = ref("");
 const srcSet = ref("");
 const assets_url = ref(window.assets_url ?? "");
 const classList = computed(() => {
-	if (src.value === assets_url.value + "/img/no_images.svg" || src.value === assets_url.value + "/img/password.svg") {
+	if (src.value === Constants.BASE_URL + "/img/no_images.svg" || src.value === Constants.BASE_URL + "/img/password.svg") {
 		return "invert brightness-25 dark:invert-0 dark:brightness-100";
 	}
 	return "";
 });
 
 function load(thumb: App.Http.Resources.Models.ThumbResource | undefined | null, isPasswordProtected: boolean) {
 	if (thumb?.thumb === "uploads/thumb/") {
-		src.value = assets_url.value + "/img/placeholder.png";
+		src.value = Constants.BASE_URL + "/img/placeholder.png";
 		if (thumb.type.includes("video")) {
-			src.value = assets_url.value + "/img/play-icon.png";
+			src.value = Constants.BASE_URL + "/img/play-icon.png";
 		}
 		if (thumb.type.includes("raw")) {
-			src.value = assets_url.value + "/img/no_images.svg";
+			src.value = Constants.BASE_URL + "/img/no_images.svg";
 		}
 	} else {
 		src.value = isNotEmpty(thumb?.thumb)
 			? (thumb?.thumb as string)
-			: assets_url.value + (isPasswordProtected ? "/img/password.svg" : "/img/no_images.svg");
+			: Constants.BASE_URL + (isPasswordProtected ? "/img/password.svg" : "/img/no_images.svg");
 	}
 	srcSet.value = isNotEmpty(thumb?.thumb2x) ? (thumb?.thumb2x as string) : "";
 }

diff --git a/resources/js/components/gallery/thumbs/PhotoThumb.vue b/resources/js/components/gallery/thumbs/PhotoThumb.vue
@@ -53,6 +53,7 @@ import MiniIcon from "@/components/icons/MiniIcon.vue";
 import ThumbBadge from "@/components/gallery/thumbs/ThumbBadge.vue";
 import { useLycheeStateStore } from "@/stores/LycheeState";
 import { storeToRefs } from "pinia";
+import Constants from "@/services/constants";
 
 const props = defineProps<{
 	isSelected: boolean;
@@ -66,8 +67,8 @@ const props = defineProps<{
 
 const auth = useAuthStore();
 const lycheeStore = useLycheeStateStore();
-const srcPlay = ref((window.assets_url ?? "") + "img/play-icon.png");
-const srcNoImage = ref((window.assets_url ?? "") + "img/no_images.svg");
+const srcPlay = ref(Constants.BASE_URL + "/img/play-icon.png");
+const srcNoImage = ref(Constants.BASE_URL + "/img/no_images.svg");
 
 // @ts-expect-error
 const is_cover_id = computed(() => props.album?.cover_id === props.photo.id);

diff --git a/resources/js/services/album-service.ts b/resources/js/services/album-service.ts
@@ -64,80 +64,80 @@ const AlbumService = {
 
 	getAll(): Promise<AxiosResponse<App.Http.Resources.Collections.RootAlbumResource>> {
 		const requester = axios as unknown as AxiosCacheInstance;
-		return requester.get(`${Constants.API_URL}Albums`, { data: {}, id: "albums" });
+		return requester.get(`${Constants.getApiUrl()}Albums`, { data: {}, id: "albums" });
 	},
 
 	get(album_id: string): Promise<AxiosResponse<App.Http.Resources.Models.AbstractAlbumResource>> {
 		const requester = axios as unknown as AxiosCacheInstance;
-		return requester.get(`${Constants.API_URL}Album`, { params: { album_id: album_id }, data: {}, id: "album_" + album_id });
+		return requester.get(`${Constants.getApiUrl()}Album`, { params: { album_id: album_id }, data: {}, id: "album_" + album_id });
 	},
 
 	unlock(album_id: string, password: string): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Album::unlock`, { album_id: album_id, password: password });
+		return axios.post(`${Constants.getApiUrl()}Album::unlock`, { album_id: album_id, password: password });
 	},
 
 	getLayout(): Promise<AxiosResponse<App.Http.Resources.GalleryConfigs.PhotoLayoutConfig>> {
-		return axios.get(`${Constants.API_URL}Gallery::getLayout`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Gallery::getLayout`, { data: {} });
 	},
 
 	createAlbum(data: CreateAlbumData): Promise<AxiosResponse<string>> {
-		return axios.post(`${Constants.API_URL}Album`, data);
+		return axios.post(`${Constants.getApiUrl()}Album`, data);
 	},
 
 	createTag(data: CreateTagAlbumData): Promise<AxiosResponse<string>> {
-		return axios.post(`${Constants.API_URL}TagAlbum`, data);
+		return axios.post(`${Constants.getApiUrl()}TagAlbum`, data);
 	},
 
 	updateAlbum(data: UpdateAbumData): Promise<AxiosResponse> {
-		return axios.patch(`${Constants.API_URL}Album`, data);
+		return axios.patch(`${Constants.getApiUrl()}Album`, data);
 	},
 
 	updateTag(data: UpdateTagAlbumData): Promise<AxiosResponse> {
-		return axios.patch(`${Constants.API_URL}TagAlbum`, data);
+		return axios.patch(`${Constants.getApiUrl()}TagAlbum`, data);
 	},
 
 	updateProtectionPolicy(data: UpdateProtectionPolicyData): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Album::updateProtectionPolicy`, data);
+		return axios.post(`${Constants.getApiUrl()}Album::updateProtectionPolicy`, data);
 	},
 
 	rename(album_id: string, title: string): Promise<AxiosResponse> {
-		return axios.patch(`${Constants.API_URL}Album::rename`, { album_id: album_id, title: title });
+		return axios.patch(`${Constants.getApiUrl()}Album::rename`, { album_id: album_id, title: title });
 	},
 
 	delete(album_ids: string[]): Promise<AxiosResponse> {
-		return axios.delete(`${Constants.API_URL}Album`, { data: { album_ids: album_ids } });
+		return axios.delete(`${Constants.getApiUrl()}Album`, { data: { album_ids: album_ids } });
 	},
 
 	getTargetListAlbums(album_id: string | null): Promise<AxiosResponse<App.Http.Resources.Models.TargetAlbumResource[]>> {
-		return axios.get(`${Constants.API_URL}Album::getTargetListAlbums`, { params: { album_id: album_id }, data: {} });
+		return axios.get(`${Constants.getApiUrl()}Album::getTargetListAlbums`, { params: { album_id: album_id }, data: {} });
 	},
 
 	move(dest: string | null, album_ids: string[]): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Album::move`, { album_id: dest, album_ids: album_ids });
+		return axios.post(`${Constants.getApiUrl()}Album::move`, { album_id: dest, album_ids: album_ids });
 	},
 
 	merge(dest: string, album_ids: string[]): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Album::merge`, { album_id: dest, album_ids: album_ids });
+		return axios.post(`${Constants.getApiUrl()}Album::merge`, { album_id: dest, album_ids: album_ids });
 	},
 
 	transfer(album_id: string, user_id: number): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Album::transfer`, { album_id: album_id, user_id: user_id });
+		return axios.post(`${Constants.getApiUrl()}Album::transfer`, { album_id: album_id, user_id: user_id });
 	},
 
 	frame(album_id: string | null): Promise<AxiosResponse<App.Http.Resources.Frame.FrameData>> {
-		return axios.get(`${Constants.API_URL}Frame`, { params: { album_id: album_id }, data: {} });
+		return axios.get(`${Constants.getApiUrl()}Frame`, { params: { album_id: album_id }, data: {} });
 	},
 
 	getMapProvider(): Promise<AxiosResponse<App.Http.Resources.GalleryConfigs.MapProviderData>> {
-		return axios.get(`${Constants.API_URL}Map::provider`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Map::provider`, { data: {} });
 	},
 
 	getMapData(album_id: string | undefined): Promise<AxiosResponse<App.Http.Resources.Collections.PositionDataResource>> {
-		return axios.get(`${Constants.API_URL}Map`, { params: { album_id: album_id }, data: {} });
+		return axios.get(`${Constants.getApiUrl()}Map`, { params: { album_id: album_id }, data: {} });
 	},
 
 	download(album_ids: string[]): void {
-		location.href = `${Constants.API_URL}Zip?album_ids=${album_ids.join(",")}`;
+		location.href = `${Constants.getApiUrl()}Zip?album_ids=${album_ids.join(",")}`;
 	},
 
 	uploadTrack(album_id: string, file: Blob): Promise<AxiosResponse> {
@@ -152,11 +152,11 @@ const AlbumService = {
 			transformRequest: [(data) => data],
 		};
 
-		return axios.post(`${Constants.API_URL}Album::track`, formData, config);
+		return axios.post(`${Constants.getApiUrl()}Album::track`, formData, config);
 	},
 
 	deleteTrack(album_id: string): Promise<AxiosResponse> {
-		return axios.delete(`${Constants.API_URL}Album::track`, { params: { album_id: album_id }, data: {} });
+		return axios.delete(`${Constants.getApiUrl()}Album::track`, { params: { album_id: album_id }, data: {} });
 	},
 };
 

diff --git a/resources/js/services/auth-service.ts b/resources/js/services/auth-service.ts
@@ -4,7 +4,7 @@ import Constants from "./constants";
 const AuthService = {
 	login(username: string, password: string): Promise<AxiosResponse<any>> {
 		return axios.post(
-			`${Constants.API_URL}Auth::login`,
+			`${Constants.getApiUrl()}Auth::login`,
 			{
 				username: username,
 				password: password,
@@ -20,15 +20,15 @@ const AuthService = {
 	},
 
 	logout(): Promise<AxiosResponse<any>> {
-		return axios.post(`${Constants.API_URL}Auth::logout`, {});
+		return axios.post(`${Constants.getApiUrl()}Auth::logout`, {});
 	},
 
 	user(): Promise<AxiosResponse<App.Http.Resources.Models.UserResource>> {
-		return axios.get(`${Constants.API_URL}Auth::user`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Auth::user`, { data: {} });
 	},
 
 	config(): Promise<AxiosResponse<App.Http.Resources.Root.AuthConfig>> {
-		return axios.get(`${Constants.API_URL}Auth::config`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Auth::config`, { data: {} });
 	},
 };
 

diff --git a/resources/js/services/constants.ts b/resources/js/services/constants.ts
@@ -1,5 +1,9 @@
 const Constants = {
 	API_URL: "/api/v2/",
+	BASE_URL: document.querySelector("base")?.getAttribute("href") || "",
+	getApiUrl(): string {
+		return this.BASE_URL + this.API_URL;
+	},
 };
 
 export type PaginatedResponse<T> = {

diff --git a/resources/js/services/diagnostics-service.ts b/resources/js/services/diagnostics-service.ts
@@ -16,23 +16,23 @@ export type UpdateProfileRequest = {
 
 const DiagnosticsService = {
 	errors(): Promise<AxiosResponse<App.Http.Resources.Diagnostics.ErrorLine[]>> {
-		return axios.get(`${Constants.API_URL}Diagnostics`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Diagnostics`, { data: {} });
 	},
 
 	info(): Promise<AxiosResponse<string[]>> {
-		return axios.get(`${Constants.API_URL}Diagnostics::info`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Diagnostics::info`, { data: {} });
 	},
 
 	space(): Promise<AxiosResponse<string[]>> {
-		return axios.get(`${Constants.API_URL}Diagnostics::space`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Diagnostics::space`, { data: {} });
 	},
 
 	config(): Promise<AxiosResponse<string[]>> {
-		return axios.get(`${Constants.API_URL}Diagnostics::config`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Diagnostics::config`, { data: {} });
 	},
 
 	permissions(): Promise<AxiosResponse<App.Http.Resources.Diagnostics.Permissions>> {
-		return axios.get(`${Constants.API_URL}Diagnostics::permissions`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Diagnostics::permissions`, { data: {} });
 	},
 };
 

diff --git a/resources/js/services/init-service.ts b/resources/js/services/init-service.ts
@@ -3,19 +3,19 @@ import Constants from "./constants";
 
 const InitService = {
 	fetchLandingData(): Promise<AxiosResponse<App.Http.Resources.GalleryConfigs.LandingPageResource>> {
-		return axios.get(`${Constants.API_URL}LandingPage`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}LandingPage`, { data: {} });
 	},
 
 	fetchInitData(): Promise<AxiosResponse<App.Http.Resources.GalleryConfigs.InitConfig>> {
-		return axios.get(`${Constants.API_URL}Gallery::Init`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Gallery::Init`, { data: {} });
 	},
 
 	fetchGlobalRights(): Promise<AxiosResponse<App.Http.Resources.Rights.GlobalRightsResource>> {
-		return axios.get(`${Constants.API_URL}Auth::rights`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Auth::rights`, { data: {} });
 	},
 
 	fetchVersion(): Promise<AxiosResponse<App.Http.Resources.Root.VersionResource>> {
-		return axios.get(`${Constants.API_URL}Version`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Version`, { data: {} });
 	},
 };
 

diff --git a/resources/js/services/jobs-service.ts b/resources/js/services/jobs-service.ts
@@ -11,7 +11,7 @@ export type UpdateProfileRequest = {
 
 const JobService = {
 	list(): Promise<AxiosResponse<PaginatedResponse<App.Http.Resources.Models.JobHistoryResource>>> {
-		return axios.get(`${Constants.API_URL}Jobs`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Jobs`, { data: {} });
 	},
 };
 

diff --git a/resources/js/services/maintenance-service.ts b/resources/js/services/maintenance-service.ts
@@ -3,53 +3,53 @@ import Constants from "./constants";
 
 const MaintenanceService = {
 	updateGet(): Promise<AxiosResponse<App.Http.Resources.Diagnostics.UpdateInfo>> {
-		return axios.get(`${Constants.API_URL}Maintenance::update`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Maintenance::update`, { data: {} });
 	},
 	updateCheck(): Promise<AxiosResponse<App.Http.Resources.Diagnostics.UpdateCheckInfo>> {
-		return axios.post(`${Constants.API_URL}Maintenance::update`, {});
+		return axios.post(`${Constants.getApiUrl()}Maintenance::update`, {});
 	},
 
 	cleaningGet(path: string): Promise<AxiosResponse<App.Http.Resources.Diagnostics.CleaningState>> {
-		return axios.get(`${Constants.API_URL}Maintenance::cleaning`, { params: { path: path }, data: {} });
+		return axios.get(`${Constants.getApiUrl()}Maintenance::cleaning`, { params: { path: path }, data: {} });
 	},
 	cleaningDo(path: string): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Maintenance::cleaning`, { path: path });
+		return axios.post(`${Constants.getApiUrl()}Maintenance::cleaning`, { path: path });
 	},
 
 	jobsGet(): Promise<AxiosResponse<number>> {
-		return axios.get(`${Constants.API_URL}Maintenance::jobs`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Maintenance::jobs`, { data: {} });
 	},
 	jobsDo(): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Maintenance::jobs`, {});
+		return axios.post(`${Constants.getApiUrl()}Maintenance::jobs`, {});
 	},
 
 	treeGet(): Promise<AxiosResponse<App.Http.Resources.Diagnostics.TreeState>> {
-		return axios.get(`${Constants.API_URL}Maintenance::tree`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Maintenance::tree`, { data: {} });
 	},
 	treeDo(): Promise<AxiosResponse<number>> {
-		return axios.post(`${Constants.API_URL}Maintenance::tree`, {});
+		return axios.post(`${Constants.getApiUrl()}Maintenance::tree`, {});
 	},
 
 	genSizeVariantsCheck(sv: App.Enum.SizeVariantType): Promise<AxiosResponse<number>> {
-		return axios.get(`${Constants.API_URL}Maintenance::genSizeVariants`, { data: {}, params: { variant: sv } });
+		return axios.get(`${Constants.getApiUrl()}Maintenance::genSizeVariants`, { data: {}, params: { variant: sv } });
 	},
 	genSizeVariantsDo(sv: App.Enum.SizeVariantType): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Maintenance::genSizeVariants`, { variant: sv });
+		return axios.post(`${Constants.getApiUrl()}Maintenance::genSizeVariants`, { variant: sv });
 	},
 
 	missingFileSizesCheck(): Promise<AxiosResponse<number>> {
-		return axios.get(`${Constants.API_URL}Maintenance::missingFileSize`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Maintenance::missingFileSize`, { data: {} });
 	},
 	missingFileSizesDo(): Promise<AxiosResponse> {
-		return axios.post(`${Constants.API_URL}Maintenance::missingFileSize`, {});
+		return axios.post(`${Constants.getApiUrl()}Maintenance::missingFileSize`, {});
 	},
 
 	optimizeDo(): Promise<AxiosResponse<string[]>> {
-		return axios.post(`${Constants.API_URL}Maintenance::optimize`, {});
+		return axios.post(`${Constants.getApiUrl()}Maintenance::optimize`, {});
 	},
 
 	register(key: string): Promise<AxiosResponse<App.Http.Resources.GalleryConfigs.RegisterData>> {
-		return axios.post(`${Constants.API_URL}Maintenance::register`, { key: key });
+		return axios.post(`${Constants.getApiUrl()}Maintenance::register`, { key: key });
 	},
 };
 

diff --git a/resources/js/services/oauth-service.ts b/resources/js/services/oauth-service.ts
@@ -3,7 +3,7 @@ import Constants from "./constants";
 
 const OauthService = {
 	list(): Promise<AxiosResponse<App.Http.Resources.Oauth.OauthRegistrationData[] | App.Enum.OauthProvidersType[]>> {
-		return axios.get(`${Constants.API_URL}Oauth`, { data: {} });
+		return axios.get(`${Constants.getApiUrl()}Oauth`, { data: {} });
 	},
 
 	providerIcon(provider: App.Enum.OauthProvidersType): string {
@@ -30,7 +30,7 @@ const OauthService = {
 	},
 
 	clear(provider: string): Promise<AxiosResponse> {
-		return axios.delete(`${Constants.API_URL}Oauth`, { data: { provider: provider } });
+		return axios.delete(`${Constants.getApiUrl()}Oauth`, { data: { provider: provider } });
 	},
 };