Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #48 from Zebradil/master
✨ Integrate hugo-easy-gallery and replace fancybox by photoswipe
- Loading branch information
Showing
27 changed files
with
448 additions
and
64 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,4 @@ | ||
/node_modules/ | ||
/public/ | ||
/content/ | ||
/content/ | ||
env |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,75 @@ | ||
<!-- | ||
Put this file in /layouts/shortcodes/load-photoswipe.html | ||
Documentation and licence at https://github.com/liwenyip/hugo-easy-gallery/ | ||
--> | ||
|
||
<!-- | ||
*** jQuery must be loaded before load-photoswipe.js *** | ||
- If your template already loads jQuery in the header then you don't need to load it again here. | ||
- If your template already loads jQuery in the footer, then you could load load-photoswipe.js from the footer instead | ||
--> | ||
<!-- these files are loaded in the theme footer | ||
<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> | ||
<script src="/js/load-photoswipe.js"></script> | ||
--> | ||
|
||
<!-- Photoswipe css/js libraries --> | ||
{{ if .Site.Params.bootcdn }} | ||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.1/photoswipe.min.css" integrity="sha256-sCl5PUOGMLfFYctzDW3MtRib0ctyUvI9Qsmq2wXOeBY=" crossorigin="anonymous" /> | ||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.1/default-skin/default-skin.min.css" integrity="sha256-BFeI1V+Vh1Rk37wswuOYn5lsTcaU96hGaI7OUVCLjPc=" crossorigin="anonymous" /> | ||
{{ else }} | ||
<link rel="stylesheet" href="{{ "/lib/photoswipe/photoswipe.min.css" | relURL }}" /> | ||
<link rel="stylesheet" href="{{ "/lib/photoswipe/default-skin/default-skin.min.css" | relURL }}" /> | ||
{{ end }} | ||
<!-- these files are loaded in the theme footer | ||
<script src="https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.1/photoswipe.min.js" integrity="sha256-UplRCs9v4KXVJvVY+p+RSo5Q4ilAUXh7kpjyIP5odyc=" crossorigin="anonymous"></script> | ||
<script src="https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.1/photoswipe-ui-default.min.js" integrity="sha256-PWHOlUzc96pMc8ThwRIXPn8yH4NOLu42RQ0b9SpnpFk=" crossorigin="anonymous"></script> | ||
--> | ||
|
||
<!-- Root element of PhotoSwipe. Must have class pswp. --> | ||
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true"> | ||
<!-- Background of PhotoSwipe. | ||
It's a separate element, as animating opacity is faster than rgba(). --> | ||
<div class="pswp__bg"></div> | ||
<!-- Slides wrapper with overflow:hidden. --> | ||
<div class="pswp__scroll-wrap"> | ||
<!-- Container that holds slides. | ||
PhotoSwipe keeps only 3 of them in DOM to save memory. | ||
Don't modify these 3 pswp__item elements, data is added later on. --> | ||
<div class="pswp__container"> | ||
<div class="pswp__item"></div> | ||
<div class="pswp__item"></div> | ||
<div class="pswp__item"></div> | ||
</div> | ||
<!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. --> | ||
<div class="pswp__ui pswp__ui--hidden"> | ||
<div class="pswp__top-bar"> | ||
<!-- Controls are self-explanatory. Order can be changed. --> | ||
<div class="pswp__counter"></div> | ||
<button class="pswp__button pswp__button--close" title="Close (Esc)"></button> | ||
<button class="pswp__button pswp__button--share" title="Share"></button> | ||
<button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button> | ||
<button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button> | ||
<!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR --> | ||
<!-- element will get class pswp__preloader--active when preloader is running --> | ||
<div class="pswp__preloader"> | ||
<div class="pswp__preloader__icn"> | ||
<div class="pswp__preloader__cut"> | ||
<div class="pswp__preloader__donut"></div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap"> | ||
<div class="pswp__share-tooltip"></div> | ||
</div> | ||
<button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"> | ||
</button> | ||
<button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"> | ||
</button> | ||
<div class="pswp__caption"> | ||
<div class="pswp__caption__center"></div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
<!-- | ||
Put this file in /layouts/shortcodes/figure.html | ||
NB this overrides Hugo's built-in "figure" shortcode but is backwards compatible | ||
Documentation and licence at https://github.com/liwenyip/hugo-easy-gallery/ | ||
--> | ||
<!-- count how many times we've called this shortcode; load the css if it's the first time --> | ||
{{- if not ($.Page.Scratch.Get "figurecount") }}<link rel="stylesheet" href="{{ "/css/hugo-easy-gallery.css" | relURL }}" />{{ end }} | ||
{{- $.Page.Scratch.Add "figurecount" 1 -}} | ||
<!-- use either src or link-thumb for thumbnail image --> | ||
{{- $thumb := .Get "src" | default (printf "%s." (.Get "thumb") | replace (.Get "link") ".") }} | ||
<div class="box{{ with .Get "caption-position" }} fancy-figure caption-position-{{.}}{{end}}{{ with .Get "caption-effect" }} caption-effect-{{.}}{{end}}" {{ with .Get "width" }}style="max-width:{{.}}"{{end}}> | ||
<figure {{ with .Get "class" }}class="{{.}}"{{ end }} itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject"> | ||
<div class="img"{{ if .Parent }} style="background-image: url('{{ print .Site.BaseURL $thumb }}');"{{ end }}{{ with .Get "size" }} data-size="{{.}}"{{ end }}> | ||
<img itemprop="thumbnail" src="{{ $thumb }}" {{ with .Get "alt" | default (.Get "caption") }}alt="{{.}}"{{ end }}/><!-- <img> hidden if in .gallery --> | ||
</div> | ||
{{ with .Get "link" | default (.Get "src") }}<a href="{{.}}" itemprop="contentUrl"></a>{{ end }} | ||
{{- if or (or (.Get "title") (.Get "caption")) (.Get "attr")}} | ||
<figcaption> | ||
{{- with .Get "title" }}<h4>{{.}}</h4>{{ end }} | ||
{{- if or (.Get "caption") (.Get "attr")}} | ||
<p> | ||
{{- .Get "caption" -}} | ||
{{- with .Get "attrlink"}}<a href="{{.}}">{{ .Get "attr" }}</a>{{ else }}{{ .Get "attr"}}{{ end -}} | ||
</p> | ||
{{- end }} | ||
</figcaption> | ||
{{- end }} | ||
</figure> | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
<!-- | ||
Put this file in /layouts/shortcodes/gallery.html | ||
Documentation and licence at https://github.com/liwenyip/hugo-easy-gallery/ | ||
--> | ||
<!-- count how many times we've called this shortcode; load the css if it's the first time --> | ||
{{- if not ($.Page.Scratch.Get "figurecount") }}<link rel="stylesheet" href="/css/hugo-easy-gallery.css" />{{ end }} | ||
{{- $.Page.Scratch.Add "figurecount" 1 }} | ||
{{ $baseURL := .Site.BaseURL }} | ||
<div class="gallery caption-position-{{ with .Get "caption-position" | default "bottom" }}{{.}}{{end}} caption-effect-{{ with .Get "caption-effect" | default "slide" }}{{.}}{{end}} hover-effect-{{ with .Get "hover-effect" | default "zoom" }}{{.}}{{end}} {{ if ne (.Get "hover-transition") "none" }}hover-transition{{end}}" itemscope itemtype="http://schema.org/ImageGallery"> | ||
{{- with (.Get "dir") -}} | ||
<!-- If a directory was specified, generate figures for all of the images in the directory --> | ||
{{- $files := readDir (print "/static/" .) }} | ||
{{- range $files -}} | ||
<!-- skip files that aren't images, or that inlcude the thumb suffix in their name --> | ||
{{- $thumbext := $.Get "thumb" | default "-thumb" }} | ||
{{- $isthumb := .Name | findRE ($thumbext | printf "%s\\.") }}<!-- is the current file a thumbnail image? --> | ||
{{- $isimg := lower .Name | findRE "\\.(gif|jpg|jpeg|tiff|png|bmp)" }}<!-- is the current file an image? --> | ||
{{- if and $isimg (not $isthumb) }} | ||
{{- $caption := .Name | replaceRE "\\..*" "" | humanize }}<!-- humanized filename without extension --> | ||
{{- $linkURL := print $baseURL ($.Get "dir") "/" .Name | absURL }}<!-- absolute URL to hi-res image --> | ||
{{- $thumb := .Name | replaceRE "(\\.)" ($thumbext | printf "%s.") }}<!-- filename of thumbnail image --> | ||
{{- $thumbexists := where $files "Name" $thumb }}<!-- does a thumbnail image exist? --> | ||
{{- $thumbURL := print $baseURL ($.Get "dir") "/" $thumb | absURL }}<!-- absolute URL to thumbnail image --> | ||
<div class="box"> | ||
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject"> | ||
<div class="img" style="background-image: url('{{ if $thumbexists }}{{ $thumbURL }}{{ else }}{{ $linkURL }}{{ end }}');" > | ||
<img itemprop="thumbnail" src="{{ if $thumbexists }}{{ $thumbURL }}{{ else }}{{ $linkURL }}{{ end }}" alt="{{ $caption }}" /><!-- <img> hidden if in .gallery --> | ||
</div> | ||
<figcaption> | ||
<p>{{ $caption }}</p> | ||
</figcaption> | ||
<a href="{{ $linkURL }}" itemprop="contentUrl"></a><!-- put <a> last so it is stacked on top --> | ||
</figure> | ||
</div> | ||
{{- end }} | ||
{{- end }} | ||
{{- else -}} | ||
<!-- If no directory was specified, include any figure shortcodes called within the gallery --> | ||
{{ .Inner }} | ||
{{- end }} | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.