diff options
Diffstat (limited to 'templates/shortcodes/image_toggler.html')
| -rw-r--r-- | templates/shortcodes/image_toggler.html | 57 |
1 files changed, 0 insertions, 57 deletions
diff --git a/templates/shortcodes/image_toggler.html b/templates/shortcodes/image_toggler.html deleted file mode 100644 index 991d5f5..0000000 --- a/templates/shortcodes/image_toggler.html +++ /dev/null @@ -1,57 +0,0 @@ -{# The `random_id` ensures that each instance of the shortcode has a "unique" id #} -{# allowing individual interactive elements (like toggles) to function correctly. #} -{# This avoids conflicts when multiple instances of the shortcode are used. #} -{%- set random_id = get_random(end=100000) -%} -{%- set colocated_path = page.colocated_path | default(value="") -%} -{%- set lazy_loading = lazy_loading | default(value=true) -%} -{%- set inline = inline | default(value=false) -%} - -{#- Determine the class for the images -#} -{#- Necessary for inline images -#} -{%- set tag = "div" -%} -{%- if inline -%} - {%- set tag = "span" -%} -{%- endif -%} - -{%- set img_class_list = "" -%} -{%- if inline -%} - {%- set img_class_list = img_class_list ~ " inline" -%} -{%- endif -%} - -{# Direct or relative URL handling for default image #} -{%- if default_src is starting_with("http") or raw_path -%} - {%- set default_image_url = default_src -%} -{%- else -%} - {%- set relative_default_path = colocated_path ~ default_src -%} - {%- set default_meta = get_image_metadata(path=relative_default_path, allow_missing=true) -%} - {%- if not default_meta -%} - {%- set default_image_url = get_url(path=default_src, cachebust=true) -%} - {%- else -%} - {%- set default_image_url = get_url(path=relative_default_path, cachebust=true) -%} - {%- endif -%} -{%- endif -%} - -{# Direct or relative URL handling for toggled image #} -{%- if toggled_src is starting_with("http") or raw_path -%} - {%- set toggled_image_url = toggled_src -%} -{%- else -%} - {%- set relative_toggled_path = colocated_path ~ toggled_src -%} - {%- set toggled_meta = get_image_metadata(path=relative_toggled_path, allow_missing=true) -%} - {%- if not toggled_meta -%} - {%- set toggled_image_url = get_url(path=toggled_src, cachebust=true) -%} - {%- else -%} - {%- set toggled_image_url = get_url(path=relative_toggled_path, cachebust=true) -%} - {%- endif -%} -{%- endif -%} - -<{{ tag }} class="image-toggler-container {% if full_width %}full-width{% endif %}"> - <input type="checkbox" id="toggle-img-{{ random_id }}" class="image-toggler-toggle"> - <label for="toggle-img-{{ random_id }}" class="image-label"> - <{{ tag }} class="image-default"> - <img class="{{ img_class_list }}" src="{{ default_image_url }}"{% if lazy_loading %} loading="lazy"{% endif %}{% if default_alt %} alt="{{ default_alt }}"{% endif %}{% if default_meta.width %} width="{{ default_meta.width }}"{% endif %}{% if default_meta.height %} height="{{ default_meta.height }}"{% endif %}> - </{{ tag }}> - <{{ tag }} class="image-toggled"> - <img class="{{ img_class_list }}" src="{{ toggled_image_url }}"{% if lazy_loading %} loading="lazy"{% endif %}{% if toggled_alt %} alt="{{ toggled_alt }}"{% endif %}{% if toggled_meta.width %} width="{{ toggled_meta.width }}"{% endif %}{% if toggled_meta.height %} height="{{ toggled_meta.height }}"{% endif %}> - </{{ tag }}> - </label> -</{{ tag }}> |
