Add wallhaven

_locales/vi/translations.json

@@ -18,6 +18,7 @@
 	"Default group": "Default group",
 	"Folder": "Thư mục",
 	"Photo by <name>": "Ảnh tạo bởi <name>",
+	"Photo from Wallhaven": "Ảnh từ Wallhaven",
 	"Editing": "Đang sửa",
 	"No selection": "Không chọn",
 	"Grid position": "Vị trí",
@@ -81,6 +82,9 @@
 	"Unsplash collection": "Bộ sưu tập Unsplash",
 	"Tips on Unsplash collections": "Mẹo về bộ sưu tập Unsplash",
 	"Type the collection ID from its URL, add more by separating them with a comma.": "Nhập ID bộ sưu tập từ URL của nó, thêm nhiều ID bằng cách phân tách chúng bằng dấu phẩy.",
+	"Wallhaven parameters": "Tham số Wallhaven",
+	"Tips on Wallhaven parameters": "Mẹo về tham số Wallhaven",
+	"Type the full search URL, or keywords.": "Nhập URL tìm kiếm, hoặc từ khóa.",
 	"Blur intensity": "Làm mờ",
 	"Brightness": "Độ sáng",
 	"Quick Links": "Liên kết nhanh",

src/scripts/defaults.ts

@@ -135,6 +135,13 @@ export const SYNC_DEFAULT: Sync.Storage = {
 		pausedImage: undefined,
 		time: undefined,
 	},
+    wallhaven: {
+        every: 'hour',
+        parameters: '',
+        lastParams: 'day',
+        pausedImage: undefined,
+        time: undefined,
+    },
 	weather: {
 		ccode: undefined,
 		city: undefined,
@@ -193,4 +200,11 @@ export const LOCAL_DEFAULT: Local.Storage = {
 		night: [],
 		user: [],
 	},
+    wallhavenCache: {
+        noon: [],
+        day: [],
+        evening: [],
+        night: [],
+        user: [],
+    },
 }

src/scripts/features/backgrounds/index.ts

@@ -1,4 +1,5 @@
 import unsplashBackgrounds from './unsplash'
+import wallhavenBackgrounds from './wallhaven'
 import localBackgrounds from './local'
 import { rgbToHex } from '../../utils'
 import { eventDebounce } from '../../utils/debounce'
@@ -30,7 +31,13 @@ export default function initBackground(data: Sync.Storage, local: Local.Storage)
 		bgsecond.style.transform = 'scale(1.1) translateX(0px) translate3d(0, 0, 0)'
 	}
 
-	type === 'local' ? localBackgrounds() : unsplashBackgrounds({ unsplash: data.unsplash, cache: local.unsplashCache })
+	if (type === 'local') {
+        localBackgrounds()
+    } else if (type === 'unsplash') {
+        unsplashBackgrounds({ unsplash: data.unsplash, cache: local.unsplashCache })
+    } else if (type === 'wallhaven') {
+        wallhavenBackgrounds({ wallhaven: data.wallhaven, cache: local.wallhavenCache })
+    }
 }
 
 //
@@ -86,14 +93,26 @@ export function backgroundFilter({ blur, brightness, isEvent }: FilterOptions) {
 
 export function updateBackgroundOption({ freq, refresh }: UpdateOptions) {
 	const i_type = document.getElementById('i_type') as HTMLInputElement
-	const isLocal = i_type.value === 'local'
+	const type = i_type.value || 'unsplash'
 
 	if (freq !== undefined) {
-		isLocal ? localBackgrounds({ freq }) : unsplashBackgrounds(undefined, { every: freq })
+		if (type === 'local') {
+            localBackgrounds({ freq })
+        } else if (type === 'unsplash') {
+            unsplashBackgrounds(undefined, { every: freq })
+        } else if (type === 'wallhaven') {
+            wallhavenBackgrounds(undefined, { every: freq })
+        }
 	}
 
 	if (refresh) {
-		isLocal ? localBackgrounds({ refresh }) : unsplashBackgrounds(undefined, { refresh })
+		if (type === 'local') {
+            localBackgrounds({ refresh })
+        } else if (type === 'unsplash') {
+            unsplashBackgrounds(undefined, { refresh })
+        } else if (type === 'wallhaven') {
+            wallhavenBackgrounds(undefined, { refresh })
+        }
 	}
 }