Friendica/friendica-github
1
0
Fork 0
mirror of https://github.com/friendica/friendica synced 2024-11-18 17:03:41 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #13522 from MrPetovan/task/expose-image-description

Browse source 
Add caption display for described images in Fancybox gallery
This commit is contained in:
Tobias Diekershoff 2023-10-08 18:38:59 +02:00 committed by GitHub
commit bffbde4639
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 17 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
view/js/fancybox/fancybox.config.js
View file

@ -1,13 +1,10 @@
$(document).ready(function() { $(document).ready(function() {
$.fancybox.defaults.loop = "true"; $.fancybox.defaults.loop = "true";
// this disables the colorbox hook found in frio/js/modal.js:34 $.fancybox.defaults.afterLoad = function(instance, current) {
$("body").off("click", ".wall-item-body a img"); current.$image.attr('alt', current.opts.$orig.find('img').attr('alt') );
current.$image.attr('title', current.opts.$orig.find('img').attr('title') );
// Adds ALT/TITLE text to fancybox };
$('a[data-fancybox').fancybox({ $.fancybox.defaults.caption = function (instance, slide, caption) {
afterLoad : function(instance, current) { return slide.$thumb.attr('alt');
current.$image.attr('alt', current.opts.$orig.find('img').attr('alt') ); };
current.$image.attr('title', current.opts.$orig.find('img').attr('title') );
}
});
}); });

7
view/templates/content/image/single.tpl
View file

@ -1,5 +1,10 @@
{{if $image->preview}} {{if $image->preview}}
<a data-fancybox="{{$image->uriId}}" href="{{$image->url}}"><img src="{{$image->preview}}" alt="{{$image->description}}" title="{{$image->description}}" loading="lazy"></a> <a data-fancybox="{{$image->uriId}}" href="{{$image->url}}"><img src="{{$image->preview}}" alt="{{$image->description}}" title="{{$image->description}}" loading="lazy"></a>
{{else}} {{else}}
<img src="{{$image->url}}" alt="{{$image->description}}" title="{{$image->description}}" loading="lazy"> <figure>
<img src="{{$image->url}}" alt="{{$image->description}}" title="{{$image->description}}" loading="lazy">
{{if $image->description}}
<figcaption>{{$image->description}}</figcaption>
{{/if}}
</figure>
{{/if}} {{/if}}

3
view/templates/content/image/single_with_height_allocation.tpl
View file

@ -12,6 +12,9 @@
</a> </a>
{{else}} {{else}}
<img src="{{$image->url}}" alt="{{$image->description}}" title="{{$image->description}}" loading="lazy"> <img src="{{$image->url}}" alt="{{$image->description}}" title="{{$image->description}}" loading="lazy">
{{if $image->description}}
<figcaption>{{$image->description}}</figcaption>
{{/if}}
{{/if}} {{/if}}
</figure> </figure>