search

decaf-dev / obsidian-vault-explorer

Explore your Obsidian vault in visual format
https://vaultexplorer.com
MIT License
111 stars 4 forks source link

Cover image loading options #261

Closed decaf-dev closed 3 months ago

decaf-dev commented 3 months ago

BTW, could you consider adding more options for cover image detection ? image

For example, maybe an array of "cover soure" like..

Cover Source:

  1. ✅ Url
  2. ✅ First Image in Page
  3. ❌ Property
  4. ✅ Preview Text (Like the Feed View - showing some text rather than empty background )

Query from top to bottom, displaying the first valid image. If users doesn't want to show any image they can just un-check all of the options. ( but why? 🤔)

And if it can be re-ordered, that would be even better! image

Originally posted by @Moyf in https://github.com/decaf-dev/obsidian-vault-explorer/issues/192#issuecomment-2251954136

decaf-dev commented 3 months ago

This could be part of the "fallback" mechanism?

decaf-dev commented 3 months ago

@moyf

Here is a list of URL's that I think a user could load

//External embed with empty alt text
![](https://example.com/file.jpg)

//External embed with alt text
![cover](https://example.com/file.jpg)

//External embed with no file extension. This is common for some image
//hosting sites
![](https://example.com/file?width=200)

//Internal embed
![[file.jpg]]

//Internal embed with parameter
![[file.jpg|200]]

//Wiki Link
[[file.jpg]]

//Plain url
https://example.com/file.jpg

//Plain url without an image extension
https://example.com/file?width=200
decaf-dev commented 3 months ago

The order that you presented is good, but I think my use case is a little more complex.

- Frontmatter - this is in sequential order
    - Specified property
    - Wiki Link
    - Internal Embed
    - External Embed
    - Plain URL
- Body - this is in sequential order
    - Internal Embed
    - External Embed
decaf-dev commented 3 months ago

Do you think users would want to load a plain url from the body for a cover image?

Moyf commented 3 months ago

This could be part of the "fallback" mechanism?

Yes, I believe that the selection should be made from top to bottom while respecting the user's preferred order.

For instance, if I configure the settings as "Image Property > URL > First Image in Note" and leave both the image and url fields empty, the system should display the first image. However, if I fill in the url, the system should display the social media image from that URL, and so on.

Currently, the plugin provides the user with two specific property names: image and url, which I find beneficial: image

I believe that these two specific properties are sufficient for my needs. 😊

Moyf commented 3 months ago

Do you think users would want to load a plain url from the body for a cover image?

I personally think it's possible, but not necessary.

In my opinion, a certain degree of limitation is necessary, considering that loading all the social media images from links might add extra overhead in terms of performance or storage space...?

But you can always provide this option along with a corresponding checkbox, allowing users who need it to enable it (which may also depend on the development effort required for you to implement this).

It's kind of hard for me to imagine when I would put a plain text image url (http://xxx.jpg) in my note 😂

decaf-dev commented 3 months ago

@Moyf

Okay here's an updated order

Explanation

  1. Look for an image property in the frontmatter, if configured in the settings
  2. Look for a url property in the frontmatter, if configured in the settings
  3. Look for some type of link in the frontmatter. Choose the link from the first property that appears
  4. Look for some type of link in the body (content minus frontmatter). Choose first link that appears
  5. Otherwise show nothing
decaf-dev commented 3 months ago

So updating the dropdown image that you posted I would think

And then you could toggle each one on or off, and rearrange.

Does this seem sufficient?

decaf-dev commented 3 months ago

A social media image can be loaded for an external embed or a URL if the link fails to find an image

decaf-dev commented 3 months ago

@Moyf By the way, where did you get the image of the dropdown? Is that an Obsidian plugin?

decaf-dev commented 3 months ago

Implementing fallback logic would a little complex. I am thinking of the case if you have an order like

Let's say I have an URL and a link in the body

If the URL fails to load, it should load the link the body.

I think for me personally, I wouldn't want that. It would be confusing as to where the link is loading from

Moyf commented 3 months ago

@Moyf By the way, where did you get the image of the dropdown? Is that an Obsidian plugin?

Oh yes, it's another plugin called Comonents - which is not available in the community plugin store yet. You can find the repo in https://github.com/obsidian-components/obsidian-components-release , where you can download and install the plugin.

However, please note that this is a paid, closed-source plugin, and unfortunately, the author has not provided an English introduction or information on purchasing options outside of China. Here is the Chinese documentation

Additionally, there is a public beta version available for use without payment: https://github.com/obsidian-components/obsidian-components-release/releases/tag/20240423.

Moyf commented 3 months ago

sufficient

YEEES, completely satisfied! Thank you very much for your effort!

Moyf commented 3 months ago

Implementing fallback logic would a little complex. I am thinking of the case if you have an order like

  • Image property
  • URL
  • First link in frontmatter
  • First link in body

Let's say I have an URL and a link in the body

If the URL fails to load, it should load the link the body.

I think for me personally, I wouldn't want that. It would be confusing as to where the link is loading from

Yay, I share the same opinion.

Personally, I believe that the first image in the text should consist of local images only; I would not expect to display images from "normal URLs" 🤔

The url property in the frontmatter provides more control, allowing me to easily associate the image with its source. However, using links—especially when I have numerous reference links in a note—might not be as intuitive.

decaf-dev commented 3 months ago

@Moyf Added in 1.37.0. Enjoy :)

Moyf commented 3 months ago

@Moyf Added in 1.37.0. Enjoy :)

Hooray! You made my day, thank you decaf! 🥳