aboutsummaryrefslogtreecommitdiff
path: root/templates/shortcodes/imghover.html
blob: 80633787de60c380c68b4b768655b95a120cd3a0 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
{%- set_global bg = "" %}

{%- for source in src %}

  {%- set dirtest = source | trim_start_matches(pat="./") %}
  {%- if dirtest is containing("/") %}
    {%- set reldir = true %}
  {%- endif %}

  {%- if source is starting_with("./") and reldir %} {# Relative Path #}
    {%- set pathtype = "rel-" %}
    {%- set path = source | trim_start_matches(pat="./") | split(pat="/") | slice(end=-1) | join(sep="/") | trim_start_matches(pat="/") %}
    {%- set path = path ~ "/"  %}

  {%- elif source is starting_with("/") %} {# Root Path #}
    {%- set pathtype = "root-" %}
    {%- set rootpath = source | split(pat="/") | slice(end=-1) | join(sep="/") %}
    {%- set path = config.base_url ~ rootpath ~ "/"  %}

  {%- else %} {# Same Directory Path #}
    {%- set pathtype = "same-" %}
    {%- set path = "" %}
  {%- endif %}

  {%- set sourcepath = source | split(pat="/") | last %}
  {%- set sourcename = pathtype ~ sourcepath | split(pat=".") | first %}

  {%- if loop.first %}
    {%- set_global bg = source | split(pat="/") | last %}
  {%- else %}
    <div id="{{ sourcename }}"><b>{{ sourcename }} on hover</b></div>
    <div id="{{ sourcename }}image" alt="{{ sourcename }}"> </div>
  {%- endif %}

{%- endfor %}

{%- if w and h and p %}
  {%- set padding = h / w * p %}
{%- elif w and h %}
  {%- set padding = h / w * 50 %}
{%- else %}
  {%- set padding = 50 %}
{%- endif %}

<style>
  {%- for source in src %}

    {%- set dirtest = source | trim_start_matches(pat="./") %}
    {%- if dirtest is containing("/") %}
      {%- set reldir = true %}
    {%- endif %}

    {%- if source is starting_with("./") and reldir %} {# Relative Path #}
      {%- set pathtype = "rel-" %}
      {%- set path = source | trim_start_matches(pat="./") | split(pat="/") | slice(end=-1) | join(sep="/") | trim_start_matches(pat="/") %}
      {%- set path = path ~ "/"  %}

    {%- elif source is starting_with("/") %} {# Root Path #}
      {%- set pathtype = "root-" %}
      {%- set rootpath = source | split(pat="/") | slice(end=-1) | join(sep="/") %}
      {%- set path = config.base_url ~ rootpath ~ "/"  %}

    {%- else %} {# Same Directory Path #}
      {%- set pathtype = "same-" %}
      {%- set path = "" %}
    {%- endif %}

    {%- set sourcepath = source | split(pat="/") | last %}
    {%- set sourcename = pathtype ~ sourcepath | split(pat=".") | first %}

    {%- if not loop.first %}
      #{{ sourcename | safe }}image {
        background-image: url('{{ path | safe }}{{ bg | safe }}');
        background-size: contain;
        background-repeat: no-repeat;
        width: {{ p | default(value=50) }}%;
        height: 0;
        padding-top: {{ padding }}%;
      }
      #{{ sourcename | safe }}image:hover {
        background-image: url('{{ path | safe }}{{ sourcepath | safe }}');
      }
    {%- endif %}
  {%- endfor %}
</style>