From 675bcbc55db5e7f4f45a5dec2550f86035bda837 Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Fri, 12 Oct 2018 22:39:25 +0200 Subject: [PATCH 1/9] Add test with special chars in a markdown file --- tests/sample/pictures/dir1/test2/21.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/tests/sample/pictures/dir1/test2/21.md b/tests/sample/pictures/dir1/test2/21.md index 576d6c7..5609d64 100644 --- a/tests/sample/pictures/dir1/test2/21.md +++ b/tests/sample/pictures/dir1/test2/21.md @@ -1 +1,4 @@ +Title: in"title" Order: 01 + +in"description From dd4ce9e8bcc6c5bdcbf2e29ea2861310f681ac1d Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Fri, 12 Oct 2018 22:52:12 +0200 Subject: [PATCH 2/9] Update colorbox, following the split of templates --- sigal/themes/colorbox/templates/album.html | 90 +++++++++++++++++- .../themes/colorbox/templates/album_list.html | 92 +------------------ .../themes/colorbox/templates/breadcrumb.html | 10 ++ 3 files changed, 99 insertions(+), 93 deletions(-) create mode 100644 sigal/themes/colorbox/templates/breadcrumb.html diff --git a/sigal/themes/colorbox/templates/album.html b/sigal/themes/colorbox/templates/album.html index baadc75..451cd28 100644 --- a/sigal/themes/colorbox/templates/album.html +++ b/sigal/themes/colorbox/templates/album.html @@ -1,2 +1,88 @@ - -{% extends "album_list.html" %} +{% extends "base.html" %} +{% block content %} + {% include 'breadcrumb.html' %} + {% set numbers = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine"] %} + {% set column_size = settings.colorbox_column_size %} + {% set nb_columns = (9 / column_size)|int %} + {% set column_size_t = numbers[column_size] %} + + {% macro img_description(media) -%} + {% if media.big %} data-big="{{ media.big_url }}"{% endif %} + {% if media.exif %} + {% if media.exif.datetime %} + data-date=", {{ media.exif.datetime }}" + {% endif %} + {% endif %} + {%- endmacro %} + + + + {% if album.zip %} + + {% endif %} + + {% if album.description %} +
+ {{ album.description }} +
+ {% endif %} +{% endblock %} + +{% block footer %} + + + + + {% if 'sigal.plugins.media_page' in settings.plugins %} + + {% else %} + + {% endif %} +{% endblock %} diff --git a/sigal/themes/colorbox/templates/album_list.html b/sigal/themes/colorbox/templates/album_list.html index 5415ac9..2777a17 100644 --- a/sigal/themes/colorbox/templates/album_list.html +++ b/sigal/themes/colorbox/templates/album_list.html @@ -1,22 +1,11 @@ {% extends "base.html" %} {% block content %} -
- {% if album.breadcrumb %} -

- {% for url, title in album.breadcrumb %} - {{ title }}{% if not loop.last %} » {% endif %} - {% endfor -%} -

-
- {% endif %} -
- + {% include 'breadcrumb.html' %} {% set numbers = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine"] %} {% set column_size = settings.colorbox_column_size %} {% set nb_columns = (9 / column_size)|int %} {% set column_size_t = numbers[column_size] %} - {% if album.albums %} {% for alb in album.albums %} {% if loop.index % nb_columns == 1 %}
@@ -31,71 +20,6 @@
{% endif%} {% endfor %} - {% endif %} - - {% if album.medias %} - {% macro img_description(media) -%} - {% if media.big %} data-big="{{ media.big_url }}"{% endif %} - {% if media.exif %} - {% if media.exif.datetime %} - data-date=", {{ media.exif.datetime }}" - {% endif %} - {% endif %} - {%- endmacro %} - - - {% endif %} - - {% if album.zip %} - - {% endif %} {% if album.description %}
@@ -103,17 +27,3 @@
{% endif %} {% endblock %} - -{% block footer %} - {% if album.medias %} - - - - - {% if 'sigal.plugins.media_page' in settings.plugins %} - - {% else %} - - {% endif %} - {% endif %} -{% endblock %} diff --git a/sigal/themes/colorbox/templates/breadcrumb.html b/sigal/themes/colorbox/templates/breadcrumb.html new file mode 100644 index 0000000..c39e916 --- /dev/null +++ b/sigal/themes/colorbox/templates/breadcrumb.html @@ -0,0 +1,10 @@ +
+ {% if album.breadcrumb %} +

+ {% for url, title in album.breadcrumb %} + {{ title }}{% if not loop.last %} » {% endif %} + {% endfor -%} +

+
+ {% endif %} +
From bb95308cda581589de07a6f4bb761672d1242c94 Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Fri, 12 Oct 2018 23:11:40 +0200 Subject: [PATCH 3/9] Move links to a dedicated template --- sigal/themes/colorbox/templates/base.html | 10 +--------- sigal/themes/default/templates/links.html | 9 +++++++++ sigal/themes/galleria/templates/album_list.html | 1 - sigal/themes/galleria/templates/base.html | 10 +--------- sigal/themes/photoswipe/static/styles.css | 6 +++--- sigal/themes/photoswipe/templates/album_list.html | 10 +--------- 6 files changed, 15 insertions(+), 31 deletions(-) create mode 100644 sigal/themes/default/templates/links.html diff --git a/sigal/themes/colorbox/templates/base.html b/sigal/themes/colorbox/templates/base.html index 9225115..ba0483c 100644 --- a/sigal/themes/colorbox/templates/base.html +++ b/sigal/themes/colorbox/templates/base.html @@ -27,15 +27,7 @@ {{ index_title }} {% endif %} - {% if settings.links %} - - {% endif %} + {% include 'links.html' %} {% include 'footer.html' %} diff --git a/sigal/themes/default/templates/links.html b/sigal/themes/default/templates/links.html new file mode 100644 index 0000000..9da5285 --- /dev/null +++ b/sigal/themes/default/templates/links.html @@ -0,0 +1,9 @@ +{% if settings.links %} + +{% endif %} diff --git a/sigal/themes/galleria/templates/album_list.html b/sigal/themes/galleria/templates/album_list.html index 22cdbd5..8cc7d8c 100644 --- a/sigal/themes/galleria/templates/album_list.html +++ b/sigal/themes/galleria/templates/album_list.html @@ -15,7 +15,6 @@ {% block content %}
-
    {% for alb in album.albums %}
  • diff --git a/sigal/themes/galleria/templates/base.html b/sigal/themes/galleria/templates/base.html index e7119dc..391400d 100644 --- a/sigal/themes/galleria/templates/base.html +++ b/sigal/themes/galleria/templates/base.html @@ -21,15 +21,7 @@

    {{ index_title }}

    - {% if settings.links %} - - {% endif %} + {% include 'links.html' %} {% if album.breadcrumb %}

    {%- for url, title in album.breadcrumb -%} diff --git a/sigal/themes/photoswipe/static/styles.css b/sigal/themes/photoswipe/static/styles.css index edd709a..9cacc1a 100644 --- a/sigal/themes/photoswipe/static/styles.css +++ b/sigal/themes/photoswipe/static/styles.css @@ -84,18 +84,18 @@ figcaption { padding:2em 0; } -.menu { +#menu { width: 100%; background: #F7F7F7 none repeat scroll 0 0; padding: 30px 0; } -.menu ul { +#menu ul { max-width: 1024px; margin: 0 auto; } -.menu li { +#menu li { display: inline; list-style: none; /* pour enlever les puces sur IE7 */ } diff --git a/sigal/themes/photoswipe/templates/album_list.html b/sigal/themes/photoswipe/templates/album_list.html index f0f79b2..57290b4 100644 --- a/sigal/themes/photoswipe/templates/album_list.html +++ b/sigal/themes/photoswipe/templates/album_list.html @@ -23,15 +23,7 @@

    {{ index_title }}

    - {% if settings.links %} - - {% endif %} + {% include 'links.html' %} {% block content %} From 3846dc0be4669124dad642e8f64cb2d72f622d9f Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Fri, 12 Oct 2018 23:18:41 +0200 Subject: [PATCH 4/9] Galleria: Remove useless jinja tags, add back description in album list --- sigal/themes/galleria/templates/album.html | 12 +++--------- sigal/themes/galleria/templates/album_list.html | 6 ++++++ 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/sigal/themes/galleria/templates/album.html b/sigal/themes/galleria/templates/album.html index 001b3a2..8b04f03 100644 --- a/sigal/themes/galleria/templates/album.html +++ b/sigal/themes/galleria/templates/album.html @@ -3,21 +3,17 @@ {% block extra_head %} {# We will always want to show the first image when we're on an album page #} {# Start loading now for faster document complete instead of waiting for js to load it #} - {% if album.medias %} - {% endif %} - {% if settings.show_map and album.show_map %} {% endif %} {% endblock %} {% block content %} - {% if album.medias %}
    {% if settings.show_map and album.show_map %} Fullscreen (f)
    - - {% endif %} + {% if album.zip %}
    @@ -68,7 +63,7 @@ {%- endif -%} {% endif %} {%- endmacro %} - {% if album.medias %} + {% if settings.show_map and album.show_map %} @@ -246,10 +241,9 @@ Galleria.configure({ imageCrop: false, transition: "fade", - thumbnails: 'lazy' + thumbnails: "lazy" }); Galleria.run("#gallery", {dataSource: data}); - {% endif %} {% endblock %} diff --git a/sigal/themes/galleria/templates/album_list.html b/sigal/themes/galleria/templates/album_list.html index 8cc7d8c..9670e21 100644 --- a/sigal/themes/galleria/templates/album_list.html +++ b/sigal/themes/galleria/templates/album_list.html @@ -24,4 +24,10 @@ {% endfor %}

+ + {% if album.description %} +
+ {{ album.description }} +
+ {% endif %} {% endblock %} From 43491405dee97d9862879053d0a7b9823e0997d3 Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Fri, 12 Oct 2018 23:58:28 +0200 Subject: [PATCH 5/9] Split photoswipe --- sigal/themes/colorbox/templates/base.html | 3 +- sigal/themes/photoswipe/templates/album.html | 316 +++++++++++++- .../photoswipe/templates/album_list.html | 409 +----------------- sigal/themes/photoswipe/templates/base.html | 56 +++ 4 files changed, 384 insertions(+), 400 deletions(-) create mode 100644 sigal/themes/photoswipe/templates/base.html diff --git a/sigal/themes/colorbox/templates/base.html b/sigal/themes/colorbox/templates/base.html index ba0483c..274ccda 100644 --- a/sigal/themes/colorbox/templates/base.html +++ b/sigal/themes/colorbox/templates/base.html @@ -1,7 +1,6 @@ - {% block head %} @@ -12,7 +11,7 @@ - {% endblock %} + {% block extra_head %}{% endblock extra_head %} {% include 'analytics.html' %} diff --git a/sigal/themes/photoswipe/templates/album.html b/sigal/themes/photoswipe/templates/album.html index baadc75..d8ed126 100644 --- a/sigal/themes/photoswipe/templates/album.html +++ b/sigal/themes/photoswipe/templates/album.html @@ -1,2 +1,314 @@ - -{% extends "album_list.html" %} +{% extends "base.html" %} + +{% block content %} + {% if album.zip %} + + {% endif %} + + + +{% endblock %} + +{% block extra_footer %} + {% if album.medias %} + + + + + {% endif %} +{% endblock %} diff --git a/sigal/themes/photoswipe/templates/album_list.html b/sigal/themes/photoswipe/templates/album_list.html index 57290b4..ddc6e53 100644 --- a/sigal/themes/photoswipe/templates/album_list.html +++ b/sigal/themes/photoswipe/templates/album_list.html @@ -1,396 +1,13 @@ - - - - {% block head %} - - - - {{ album.title }} - - - - - - - - - - {% endblock %} - {% include 'analytics.html' %} - - - {% include 'gtm.html' %} -
-

{{ index_title }}

- - {% include 'links.html' %} - - {% block content %} - -
- {% if album.breadcrumb %} - - {% endif %} - - {% if album.albums %} -
- {% for alb in album.albums %} - - {% endfor %} -
- {% endif %} - - {% if album.zip %} - - {% endif %} - - {% if album.medias %} - - {% endif %} - - {% if album.description %} -
- {{ album.description }} -
- {% endif %} - -
- {% endblock %} - - {% block footer %} -
-

{% if album.author %}© {{ album.author }} - {% endif %} - Generated by sigal -

-
- {% if album.medias %} - - - - - {% endif %} - {% endblock %} -
-{% include 'piwik.html' %} - - +{% extends "base.html" %} +{% block content %} +
+ {% for alb in album.albums %} + + {% endfor %} +
+{% endblock %} diff --git a/sigal/themes/photoswipe/templates/base.html b/sigal/themes/photoswipe/templates/base.html new file mode 100644 index 0000000..cfab9d4 --- /dev/null +++ b/sigal/themes/photoswipe/templates/base.html @@ -0,0 +1,56 @@ + + + + + + + {{ album.title }} + + + + + + + + + + {% block extra_head %}{% endblock extra_head %} + {% include 'analytics.html' %} + + + {% include 'gtm.html' %} +
+

{{ index_title }}

+ + {% include 'links.html' %} + +
+ {% if album.breadcrumb %} + + {% endif %} + + {% block content %}{% endblock %} + + {% if album.description %} +
+ {{ album.description }} +
+ {% endif %} +
+ +
+

{% if album.author %}© {{ album.author }} - {% endif %} + Generated by sigal +

+
+ {% block extra_footer %}{% endblock %} +
+ {% include 'piwik.html' %} + + From 114c22d7c1af18f7e072accdb4f8f76cf94f133f Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Sat, 13 Oct 2018 00:07:06 +0200 Subject: [PATCH 6/9] Reorganize breadcrumb --- sigal/themes/colorbox/templates/album.html | 6 ------ .../themes/colorbox/templates/album_list.html | 7 ------- sigal/themes/colorbox/templates/base.html | 18 +++++++++++++++++- .../themes/colorbox/templates/breadcrumb.html | 10 ---------- sigal/themes/galleria/templates/album.html | 5 ++--- sigal/themes/photoswipe/templates/album.html | 3 ++- 6 files changed, 21 insertions(+), 28 deletions(-) delete mode 100644 sigal/themes/colorbox/templates/breadcrumb.html diff --git a/sigal/themes/colorbox/templates/album.html b/sigal/themes/colorbox/templates/album.html index 451cd28..a1a7d06 100644 --- a/sigal/themes/colorbox/templates/album.html +++ b/sigal/themes/colorbox/templates/album.html @@ -1,6 +1,5 @@ {% extends "base.html" %} {% block content %} - {% include 'breadcrumb.html' %} {% set numbers = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine"] %} {% set column_size = settings.colorbox_column_size %} {% set nb_columns = (9 / column_size)|int %} @@ -68,11 +67,6 @@ {% endif %} - {% if album.description %} -
- {{ album.description }} -
- {% endif %} {% endblock %} {% block footer %} diff --git a/sigal/themes/colorbox/templates/album_list.html b/sigal/themes/colorbox/templates/album_list.html index 2777a17..e7c40e0 100644 --- a/sigal/themes/colorbox/templates/album_list.html +++ b/sigal/themes/colorbox/templates/album_list.html @@ -1,6 +1,5 @@ {% extends "base.html" %} {% block content %} - {% include 'breadcrumb.html' %} {% set numbers = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine"] %} {% set column_size = settings.colorbox_column_size %} {% set nb_columns = (9 / column_size)|int %} @@ -20,10 +19,4 @@ {% endif%} {% endfor %} - - {% if album.description %} -
- {{ album.description }} -
- {% endif %} {% endblock %} diff --git a/sigal/themes/colorbox/templates/base.html b/sigal/themes/colorbox/templates/base.html index 274ccda..6047e1d 100644 --- a/sigal/themes/colorbox/templates/base.html +++ b/sigal/themes/colorbox/templates/base.html @@ -31,10 +31,26 @@
+
+ {% if album.breadcrumb %} +

+ {% for url, title in album.breadcrumb %} + {{ title }}{% if not loop.last %} » {% endif %} + {% endfor -%} +

+
+ {% endif %} +
+ {% block content %}{% endblock %} + + {% if album.description %} +
+ {{ album.description }} +
+ {% endif %}
- {% block footer %}{% endblock %} {% include 'piwik.html' %} diff --git a/sigal/themes/colorbox/templates/breadcrumb.html b/sigal/themes/colorbox/templates/breadcrumb.html deleted file mode 100644 index c39e916..0000000 --- a/sigal/themes/colorbox/templates/breadcrumb.html +++ /dev/null @@ -1,10 +0,0 @@ -
- {% if album.breadcrumb %} -

- {% for url, title in album.breadcrumb %} - {{ title }}{% if not loop.last %} » {% endif %} - {% endfor -%} -

-
- {% endif %} -
diff --git a/sigal/themes/galleria/templates/album.html b/sigal/themes/galleria/templates/album.html index 8b04f03..f87d7b9 100644 --- a/sigal/themes/galleria/templates/album.html +++ b/sigal/themes/galleria/templates/album.html @@ -26,9 +26,8 @@ {% if album.zip %} {% endif %} diff --git a/sigal/themes/photoswipe/templates/album.html b/sigal/themes/photoswipe/templates/album.html index d8ed126..f35f9b7 100644 --- a/sigal/themes/photoswipe/templates/album.html +++ b/sigal/themes/photoswipe/templates/album.html @@ -3,7 +3,8 @@ {% block content %} {% if album.zip %} {% endif %} From 094a3d7f8e2fc5fc8d7d30f32fb762f191618c5b Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Sat, 13 Oct 2018 00:25:01 +0200 Subject: [PATCH 7/9] Refactor footer and other things --- sigal/themes/colorbox/static/css/style.css | 3 +++ sigal/themes/default/templates/footer.html | 23 ++++++++++++++------ sigal/themes/galleria/static/css/style.css | 3 +++ sigal/themes/photoswipe/static/styles.css | 3 +++ sigal/themes/photoswipe/templates/album.html | 8 +++++++ sigal/themes/photoswipe/templates/base.html | 13 ++--------- 6 files changed, 35 insertions(+), 18 deletions(-) diff --git a/sigal/themes/colorbox/static/css/style.css b/sigal/themes/colorbox/static/css/style.css index ce48612..707f47c 100644 --- a/sigal/themes/colorbox/static/css/style.css +++ b/sigal/themes/colorbox/static/css/style.css @@ -32,6 +32,9 @@ header h1 a { position: absolute; bottom: 40px; } +.sidebar footer span { + display: block; +} .thumbnail { text-align: center; diff --git a/sigal/themes/default/templates/footer.html b/sigal/themes/default/templates/footer.html index c1b7c68..44d23fd 100644 --- a/sigal/themes/default/templates/footer.html +++ b/sigal/themes/default/templates/footer.html @@ -1,7 +1,16 @@ -
-

{% if album.author %}© {{ album.author }} - {% endif %} - Generated by sigal - {% if 'sigal.plugins.feeds' in settings.plugins %} - {% if settings.rss_feed %}
RSS Feed{% endif %} - {% if settings.atom_feed %}
Atom Feed{% endif %}{% endif %}

-
+
+

+ {% if album.author %} + © {{ album.author }} + {% endif %} + Generated by sigal + {% if 'sigal.plugins.feeds' in settings.plugins %} + {% if settings.rss_feed %} + RSS Feed + {% endif %} + {% if settings.atom_feed %} + Atom Feed + {% endif %} + {% endif %} +

+
diff --git a/sigal/themes/galleria/static/css/style.css b/sigal/themes/galleria/static/css/style.css index 837ccd2..3d50220 100644 --- a/sigal/themes/galleria/static/css/style.css +++ b/sigal/themes/galleria/static/css/style.css @@ -172,6 +172,9 @@ footer a:hover { border-bottom: 1px solid; text-decoration: none; } +footer span:not(:last-child):after { + content: ' - '; +} @media only screen and (min-width: 980px) { .container { diff --git a/sigal/themes/photoswipe/static/styles.css b/sigal/themes/photoswipe/static/styles.css index 9cacc1a..42a3c38 100644 --- a/sigal/themes/photoswipe/static/styles.css +++ b/sigal/themes/photoswipe/static/styles.css @@ -204,6 +204,9 @@ footer { footer p { text-align: center; } +footer span:not(:last-child):after { + content: ' - '; +} @media screen and (max-width: 700px) { h1 { diff --git a/sigal/themes/photoswipe/templates/album.html b/sigal/themes/photoswipe/templates/album.html index f35f9b7..22e0324 100644 --- a/sigal/themes/photoswipe/templates/album.html +++ b/sigal/themes/photoswipe/templates/album.html @@ -1,5 +1,13 @@ {% extends "base.html" %} +{% block extra_head %} + + + + + +{% endblock extra_head %} + {% block content %} {% if album.zip %}
diff --git a/sigal/themes/photoswipe/templates/base.html b/sigal/themes/photoswipe/templates/base.html index cfab9d4..0763ad3 100644 --- a/sigal/themes/photoswipe/templates/base.html +++ b/sigal/themes/photoswipe/templates/base.html @@ -8,13 +8,8 @@ - - - - - - {% block extra_head %}{% endblock extra_head %} + {% include 'analytics.html' %} @@ -44,11 +39,7 @@ {% endif %}
-
-

{% if album.author %}© {{ album.author }} - {% endif %} - Generated by sigal -

-
+ {% include 'footer.html' %} {% block extra_footer %}{% endblock %} {% include 'piwik.html' %} From 69fc93f207f39699914e012a355795bb3bbd8d76 Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Sat, 13 Oct 2018 00:31:16 +0200 Subject: [PATCH 8/9] breadcrumb --- sigal/themes/colorbox/templates/base.html | 6 +----- sigal/themes/default/templates/breadcrumb.html | 9 +++++++++ sigal/themes/galleria/templates/base.html | 7 +------ sigal/themes/photoswipe/templates/base.html | 11 +---------- 4 files changed, 12 insertions(+), 21 deletions(-) create mode 100644 sigal/themes/default/templates/breadcrumb.html diff --git a/sigal/themes/colorbox/templates/base.html b/sigal/themes/colorbox/templates/base.html index 6047e1d..27a8d59 100644 --- a/sigal/themes/colorbox/templates/base.html +++ b/sigal/themes/colorbox/templates/base.html @@ -32,12 +32,8 @@
+ {% include 'breadcrumb.html' %} {% if album.breadcrumb %} -

- {% for url, title in album.breadcrumb %} - {{ title }}{% if not loop.last %} » {% endif %} - {% endfor -%} -


{% endif %}
diff --git a/sigal/themes/default/templates/breadcrumb.html b/sigal/themes/default/templates/breadcrumb.html new file mode 100644 index 0000000..b7c0396 --- /dev/null +++ b/sigal/themes/default/templates/breadcrumb.html @@ -0,0 +1,9 @@ +{% if album.breadcrumb %} + +{% endif %} diff --git a/sigal/themes/galleria/templates/base.html b/sigal/themes/galleria/templates/base.html index 391400d..05a970b 100644 --- a/sigal/themes/galleria/templates/base.html +++ b/sigal/themes/galleria/templates/base.html @@ -22,13 +22,8 @@

{{ index_title }}

{% include 'links.html' %} + {% include 'breadcrumb.html' %} {% if album.breadcrumb %} -

- {%- for url, title in album.breadcrumb -%} - {{ title }} - {%- if not loop.last %} » {% endif -%} - {% endfor -%} -


{% endif %} diff --git a/sigal/themes/photoswipe/templates/base.html b/sigal/themes/photoswipe/templates/base.html index 0763ad3..ce556f4 100644 --- a/sigal/themes/photoswipe/templates/base.html +++ b/sigal/themes/photoswipe/templates/base.html @@ -20,16 +20,7 @@ {% include 'links.html' %}
- {% if album.breadcrumb %} - - {% endif %} - + {% include 'breadcrumb.html' %} {% block content %}{% endblock %} {% if album.description %} From f92ce71434b8dbd80949a085d1aa6c974e178f76 Mon Sep 17 00:00:00 2001 From: Simon Conseil Date: Sat, 13 Oct 2018 00:48:09 +0200 Subject: [PATCH 9/9] photoswipe - simplify images loop and move js to a dedicated file --- sigal/themes/photoswipe/static/app.js | 214 +++++++++++++++ sigal/themes/photoswipe/templates/album.html | 260 ++----------------- 2 files changed, 234 insertions(+), 240 deletions(-) create mode 100644 sigal/themes/photoswipe/static/app.js diff --git a/sigal/themes/photoswipe/static/app.js b/sigal/themes/photoswipe/static/app.js new file mode 100644 index 0000000..de825ae --- /dev/null +++ b/sigal/themes/photoswipe/static/app.js @@ -0,0 +1,214 @@ +echo.init({ + offset: 100, + throttle: 250, + unload: false +}); + +var initPhotoSwipeFromDOM = function(gallerySelector) { + + // parse slide data (url, title, size ...) from DOM elements + // (children of gallerySelector) + var parseThumbnailElements = function(el) { + var thumbElements = el.childNodes, + numNodes = thumbElements.length, + items = [], + figureEl, + linkEl, + size, + item; + + for(var i = 0; i < numNodes; i++) { + + figureEl = thumbElements[i]; //
element + + // include only element nodes + if(figureEl.nodeType !== 1) { + continue; + } + + linkEl = figureEl.children[0]; // element + + // create slide object + if (linkEl.getAttribute('data-type') == 'video') { + item = { + html: linkEl.getAttribute('data-video') + }; + } else { + size = linkEl.getAttribute('data-size').split('x'); + item = { + src: linkEl.getAttribute('href'), + w: parseInt(size[0], 10), + h: parseInt(size[1], 10) + }; + } + + if(figureEl.children.length > 1) { + //
content + item.title = figureEl.children[1].innerHTML; + } + + if(linkEl.children.length > 0) { + // thumbnail element, retrieving thumbnail url + item.msrc = linkEl.children[0].getAttribute('data-echo'); + } + + item.el = figureEl; // save link to element for getThumbBoundsFn + items.push(item); + } + + return items; + }; + + // find nearest parent element + var closest = function closest(el, fn) { + return el && ( fn(el) ? el : closest(el.parentNode, fn) ); + }; + + // triggers when user clicks on thumbnail + var onThumbnailsClick = function(e) { + e = e || window.event; + e.preventDefault ? e.preventDefault() : e.returnValue = false; + + var eTarget = e.target || e.srcElement; + + // find root element of slide + var clickedListItem = closest(eTarget, function(el) { + return (el.tagName && el.tagName.toUpperCase() === 'FIGURE'); + }); + + if(!clickedListItem) { + return; + } + + // find index of clicked item by looping through all child nodes + // alternatively, you may define index via data- attribute + var clickedGallery = clickedListItem.parentNode, + childNodes = clickedListItem.parentNode.childNodes, + numChildNodes = childNodes.length, + nodeIndex = 0, + index; + + for (var i = 0; i < numChildNodes; i++) { + if(childNodes[i].nodeType !== 1) { + continue; + } + + if(childNodes[i] === clickedListItem) { + index = nodeIndex; + break; + } + nodeIndex++; + } + + + + if(index >= 0) { + // open PhotoSwipe if valid index found + openPhotoSwipe( index, clickedGallery ); + } + return false; + }; + + // parse picture index and gallery index from URL (#&pid=1&gid=2) + var photoswipeParseHash = function() { + var hash = window.location.hash.substring(1), + params = {}; + + if(hash.length < 5) { + return params; + } + + var vars = hash.split('&'); + for (var i = 0; i < vars.length; i++) { + if(!vars[i]) { + continue; + } + var pair = vars[i].split('='); + if(pair.length < 2) { + continue; + } + params[pair[0]] = pair[1]; + } + + if(params.gid) { + params.gid = parseInt(params.gid, 10); + } + + return params; + }; + + var openPhotoSwipe = function(index, galleryElement, disableAnimation, fromURL) { + var pswpElement = document.querySelectorAll('.pswp')[0], + gallery, + options, + items; + + items = parseThumbnailElements(galleryElement); + + // define options (if needed) + options = { + + // define gallery index (for URL) + galleryUID: galleryElement.getAttribute('data-pswp-uid'), + + getThumbBoundsFn: function(index) { + // See Options -> getThumbBoundsFn section of documentation for more info + var thumbnail = items[index].el.getElementsByTagName('img')[0], // find thumbnail + pageYScroll = window.pageYOffset || document.documentElement.scrollTop, + rect = thumbnail.getBoundingClientRect(); + + return {x:rect.left, y:rect.top + pageYScroll, w:rect.width}; + } + + }; + + // PhotoSwipe opened from URL + if(fromURL) { + if(options.galleryPIDs) { + // parse real index when custom PIDs are used + // http://photoswipe.com/documentation/faq.html#custom-pid-in-url + for(var j = 0; j < items.length; j++) { + if(items[j].pid == index) { + options.index = j; + break; + } + } + } else { + // in URL indexes start from 1 + options.index = parseInt(index, 10) - 1; + } + } else { + options.index = parseInt(index, 10); + } + + // exit if index not found + if( isNaN(options.index) ) { + return; + } + + if(disableAnimation) { + options.showAnimationDuration = 0; + } + + // Pass data to PhotoSwipe and initialize it + gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, items, options); + gallery.init(); + }; + + // loop through all gallery elements and bind events + var galleryElements = document.querySelectorAll( gallerySelector ); + + for(var i = 0, l = galleryElements.length; i < l; i++) { + galleryElements[i].setAttribute('data-pswp-uid', i+1); + galleryElements[i].onclick = onThumbnailsClick; + } + + // Parse URL and open gallery if it contains #&pid=3&gid=1 + var hashData = photoswipeParseHash(); + if(hashData.pid && hashData.gid) { + openPhotoSwipe( hashData.pid , galleryElements[ hashData.gid - 1 ], true, true ); + } +}; + +// execute above function +initPhotoSwipeFromDOM('.gallery'); diff --git a/sigal/themes/photoswipe/templates/album.html b/sigal/themes/photoswipe/templates/album.html index 22e0324..aefa6c3 100644 --- a/sigal/themes/photoswipe/templates/album.html +++ b/sigal/themes/photoswipe/templates/album.html @@ -19,29 +19,27 @@ @@ -49,7 +47,6 @@ {% endblock %} {% block extra_footer %} - {% if album.medias %}