feat(api): Support Unsplash API

yoyurec · Jul 12, 2022 · f5a8de9 · f5a8de9
2 parents dcfe81f + 213461d
commit f5a8de9
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 5 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "logseq-banners-plugin",
-  "version": "1.7.0",
+  "version": "1.8.0",
   "main": "dist/index.html",
   "scripts": {
     "dev": "vite",

diff --git a/readme.md b/readme.md
@@ -12,6 +12,15 @@ Enliven your Logseq Workspace with gorgeous, custom, notion style page banners a
 ### Customization
 - All customizations can be done from plugin settings
 - Example for adwanced settings for custom page types: Plugin settings -> customPropsConfig -> "Edit settings.json"
+- Random images from Unsplash API:
+
+### Unsplash API
+Set in settings for default page/journal banner:
+* Random featured: https://source.unsplash.com/featured/1600x900
+* Photo of the day: https://source.unsplash.com/1600x900/daily
+* Search terms. Add comma separated terms after `?` at the end (for default settings or in props at specific page): https://source.unsplash.com/1600x900?red,house
+
+For ex. "Dafault journal banner" - https://source.unsplash.com/featured/1600x900?diary
 
 ---
 ## Credits

diff --git a/src/main.tsx b/src/main.tsx
@@ -192,7 +192,7 @@ const initStyles = () => {
       transform: translateY(-55%);
       line-height: initial;
     }
-    body:is([data-page="page"],[data-page="home"]).is-banner-active :is(.ls-page-title, .page-title, .journal-title) {
+    body:is([data-page="page"],[data-page="home"]).is-banner-active.is-icon-active :is(.ls-page-title, .page-title, .journal-title) {
       margin-top: 35px;
     }
     body:is([data-page="page"],[data-page="home"]).is-banner-active.is-icon-active #journals .journal-item:first-child {
@@ -337,12 +337,13 @@ const getBase64FromUrl = async (url: string): Promise<string> => {
   });
 }
 
-// Get and encode default banners for reusing
+// Get and encode default banners for caching
+// skip caching if random image from Unsplash API used
 const encodeDefaultBanners = async () => {
-  if (defaultConfig.page.banner) {
+  if (defaultConfig.page.banner && !(defaultConfig.page.banner?.includes("source.unsplash.com"))) {
     defaultConfig.page.banner = await getBase64FromUrl(defaultConfig.page.banner);
   }
-  if (defaultConfig.journal.banner) {
+  if (defaultConfig.journal.banner && !(defaultConfig.journal.banner?.includes("source.unsplash.com"))) {
     defaultConfig.journal.banner = await getBase64FromUrl(defaultConfig.journal.banner);
   }
 }