Unable to use filterOptions on embedded exif data or color labels

[eclecticpassions]

Hi Matze @mfg92, I'm having a lot of trouble getting the filterOptions to work with anything other than {label: '3 Stars', rating: '3'}.

It is not working for color labels eg: {label: 'Yellow', 'Color_Labels': 'yellow'} or filtering with the embedded exif data eg: {label: 'GR3x', Model: 'RICOH GR IIIx'}. Nothing happens when I click on these filter buttons, either it shows all the photos, or nothing.

I checked the photos with exiftool -a -G1 -s and it shows the color label metadata is under two namespaces: [XMP-digiKam] ColorLabel : yellow and [XMP-xmp] Label : yellow. For the camera model metadata it's in: [IFD0] Model : RICOH GR IIIx.

Secondly, I originally hoped it was possible to read tags/keywords directly from the [XMP-dc] Subject embedded metadata field but from what I understand it can only be done with the additional sidecar file within Hugo?

Thanks so much for creating this theme component for Hugo. If this works out it'll be a brilliant way of showing photos on the site. Thanks again.

Edit: My hugo.toml has this set for includeFields under [imaging.Exif] because ".*" was causing a lot of weird symbols being extracted from the metadata (seen when debugging with:

{{ with .Exif }}
<pre>{{ . | jsonify }}</pre>
{{ end }} 

After specifying includeFields instead of "all", the weird symbols and gibberish was gone.

[imaging]
  [imaging.exif]
    includeFields = "Copyright|Artist|Rights|Exif|Tags|Rating|FNumber|ISO|Lens|Model|Exposure|FocalLength|Title|Description"
    disableLatLong = true
    excludeFields = ''
    disableDate = false

Originally posted by @eclecticpassions in #63 I realised I commented on a closed thread, so I opened a new issue.

[mfg92]

Hi,

here is an example that works for me:

• one of the sidecar files

  {
     "Rating": 4,
     "Tags": [
        "macro",
        "published",
        "plant|flower"
     ],
     "ColorLabels":"r"
  }

• the 'filterOptions' used by my gallery

  [
     {
        "label":"Favorites",
        "color_label":"r"
     },
     {
        "label":"All"
     },
     {
        "label":"Macro",
        "tags":"macro"
     }
  ]

I can spot two issues in your example:

• In your filterOptions you have
• 'Color_Labels' but it should be 'color_label'
• 'Yellow' but it should be 'y'

The code expects the sidecar file to contain only the first letter of the color label (yellow -> y), this allows to have multiple color labels (ry -> red + yellow).
If I remember correctly, Hugo did not support reading tags and color labels when I implemented this filter. That was one reason why I implemented this sidecar mechanism. It may be possible to modify the code so that this is no longer necessary, but I have not yet tried.

[eclecticpassions]

Thanks for getting back to me @mfg92. Thanks for pointing out the errors in my code - that the capitalization matters. I am not sure how, but I got it working now by using: {label: 'Red', color_label: 'red'} in the filterOptions and "ColorLabels": "red",`in the .meta. Thanks so much for your help!

On a unrelated issue - is it possible to view the bottom-bar (exif data) of the swipebox component to show on mobile (especially Android)? I can't seem to get it to show despite forcing it to display in the css, and turning all the removeBarsOnMobile related lines to false in the .js. (Same issue mentioned here.) I am guessing nothing can be done because swipebox is kind of abandoned at this point?