sekretaerbaer/friendica-addons-sekb
1
0
Fork 0
forked from Friendica/friendica-addons
Code Pull requests Activity

AddOn Fancybox

Browse source 
This addon loads all media attachments of a post into a "fancybox" instead of linking directly to the media.
Each post gets its own attachment library, when there are more than one media attached you can scroll through them.
This commit is contained in:
Grischa Brockhaus 2022-11-24 23:48:08 +01:00
parent 30329df0dd
commit ae28f6ef01
15 changed files with 6761 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
fancybox/CHANGELOG.md Normal file
View file

@ -0,0 +1,9 @@
### Version 1.01
* One gallery for each post
* All media attached to a post are added to the posts gallery.
* Loop scrolling: You can step from last media to first and vice versa.
### Version 1.00
* First test version released.
* One fancybox per page displaying first media of each post.

19
fancybox/README.md Normal file
View file

@ -0,0 +1,19 @@
# Post image gallery using fancybox
Addon author: [Grischa Brockhaus](https://brockha.us)
## Description
This addon loads all media attachments of a post into a "fancybox" instead of linking directly to the media.
Each post gets its own attachment library, when there are more than one media attached you can scroll through them.
## Licenses
### Fancybox Library
This AddOn is using the jQuery library [fancybox](https://github.com/fancyapps/fancybox).
The fancyBox libryry is licensed under the GPLv3 license for all open source applications. A commercial license is required for all commercial applications (including sites, themes and apps you plan to sell).
[Read more about fancyBox license](https://github.com/fancyapps/fancybox).

62
fancybox/asset/fancybox/README.md Normal file
View file

@ -0,0 +1,62 @@
# fancyBox 3.5.7
jQuery lightbox script for displaying images, videos and more.
Touch enabled, responsive and fully customizable.
See the [project page](http://fancyapps.com/fancybox/3/) for documentation and a demonstration.
Follow [@thefancyapps](//twitter.com/thefancyapps) for updates.
## Quick start
1\. Add latest jQuery and fancyBox files
```html
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<link href="/path/to/jquery.fancybox.min.css" rel="stylesheet">
<script src="/path/to/jquery.fancybox.min.js"></script>
```
2\. Create links
```html
<a data-fancybox="gallery" href="big_1.jpg">
<img src="small_1.jpg">
</a>
<a data-fancybox="gallery" href="big_2.jpg">
<img src="small_2.jpg">
</a>
```
3\. Enjoy!
## License
fancyBox is licensed under the [GPLv3](http://choosealicense.com/licenses/gpl-3.0) license for all open source applications.
A commercial license is required for all commercial applications (including sites, themes and apps you plan to sell).
[Read more about fancyBox license](http://fancyapps.com/fancybox/3/#license).
## Bugs and feature requests
If you find a bug, please report it [here on Github](https://github.com/fancyapps/fancybox/issues).
Guidelines for bug reports:
1. Use the GitHub issue search — check if the issue has already been reported.
2. Check if the issue has been fixed — try to reproduce it using the latest master or development branch in the repository.
3. Isolate the problem — create a reduced test case and a live example. You can use CodePen to fork any demo found on documentation to use it as a template.
A good bug report shouldn't leave others needing to chase you up for more information.
Please try to be as detailed as possible in your report.
Feature requests are welcome. Please look for existing ones and use GitHub's "reactions" feature to vote.
Please do not use the issue tracker for personal support requests - use Stack Overflow ([fancybox-3](http://stackoverflow.com/questions/tagged/fancybox-3) tag) instead.

3
fancybox/asset/fancybox/fancybox.config.js Normal file
View file

@ -0,0 +1,3 @@
$(document).ready(function() {
$.fancybox.defaults.loop = "true";
});

895
fancybox/asset/fancybox/jquery.fancybox.css vendored Normal file
View file

@ -0,0 +1,895 @@
body.compensate-for-scrollbar {
overflow: hidden;
}
.fancybox-active {
height: auto;
}
.fancybox-is-hidden {
left: -9999px;
margin: 0;
position: absolute !important;
top: -9999px;
visibility: hidden;
}
.fancybox-container {
-webkit-backface-visibility: hidden;
height: 100%;
left: 0;
outline: none;
position: fixed;
-webkit-tap-highlight-color: transparent;
top: 0;
-ms-touch-action: manipulation;
touch-action: manipulation;
transform: translateZ(0);
width: 100%;
z-index: 99992;
}
.fancybox-container * {
box-sizing: border-box;
}
.fancybox-outer,
.fancybox-inner,
.fancybox-bg,
.fancybox-stage {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
}
.fancybox-outer {
-webkit-overflow-scrolling: touch;
overflow-y: auto;
}
.fancybox-bg {
background: rgb(30, 30, 30);
opacity: 0;
transition-duration: inherit;
transition-property: opacity;
transition-timing-function: cubic-bezier(.47, 0, .74, .71);
}
.fancybox-is-open .fancybox-bg {
opacity: .9;
transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}
.fancybox-infobar,
.fancybox-toolbar,
.fancybox-caption,
.fancybox-navigation .fancybox-button {
direction: ltr;
opacity: 0;
position: absolute;
transition: opacity .25s ease, visibility 0s ease .25s;
visibility: hidden;
z-index: 99997;
}
.fancybox-show-infobar .fancybox-infobar,
.fancybox-show-toolbar .fancybox-toolbar,
.fancybox-show-caption .fancybox-caption,
.fancybox-show-nav .fancybox-navigation .fancybox-button {
opacity: 1;
transition: opacity .25s ease 0s, visibility 0s ease 0s;
visibility: visible;
}
.fancybox-infobar {
color: #ccc;
font-size: 13px;
-webkit-font-smoothing: subpixel-antialiased;
height: 44px;
left: 0;
line-height: 44px;
min-width: 44px;
mix-blend-mode: difference;
padding: 0 10px;
pointer-events: none;
top: 0;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.fancybox-toolbar {
right: 0;
top: 0;
}
.fancybox-stage {
direction: ltr;
overflow: visible;
transform: translateZ(0);
z-index: 99994;
}
.fancybox-is-open .fancybox-stage {
overflow: hidden;
}
.fancybox-slide {
-webkit-backface-visibility: hidden;
/* Using without prefix would break IE11 */
display: none;
height: 100%;
left: 0;
outline: none;
overflow: auto;
-webkit-overflow-scrolling: touch;
padding: 44px;
position: absolute;
text-align: center;
top: 0;
transition-property: transform, opacity;
white-space: normal;
width: 100%;
z-index: 99994;
}
.fancybox-slide::before {
content: '';
display: inline-block;
font-size: 0;
height: 100%;
vertical-align: middle;
width: 0;
}
.fancybox-is-sliding .fancybox-slide,
.fancybox-slide--previous,
.fancybox-slide--current,
.fancybox-slide--next {
display: block;
}
.fancybox-slide--image {
overflow: hidden;
padding: 44px 0;
}
.fancybox-slide--image::before {
display: none;
}
.fancybox-slide--html {
padding: 6px;
}
.fancybox-content {
background: #fff;
display: inline-block;
margin: 0;
max-width: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
padding: 44px;
position: relative;
text-align: left;
vertical-align: middle;
}
.fancybox-slide--image .fancybox-content {
animation-timing-function: cubic-bezier(.5, 0, .14, 1);
-webkit-backface-visibility: hidden;
background: transparent;
background-repeat: no-repeat;
background-size: 100% 100%;
left: 0;
max-width: none;
overflow: visible;
padding: 0;
position: absolute;
top: 0;
-ms-transform-origin: top left;
transform-origin: top left;
transition-property: transform, opacity;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
z-index: 99995;
}
.fancybox-can-zoomOut .fancybox-content {
cursor: zoom-out;
}
.fancybox-can-zoomIn .fancybox-content {
cursor: zoom-in;
}
.fancybox-can-swipe .fancybox-content,
.fancybox-can-pan .fancybox-content {
cursor: -webkit-grab;
cursor: grab;
}
.fancybox-is-grabbing .fancybox-content {
cursor: -webkit-grabbing;
cursor: grabbing;
}
.fancybox-container [data-selectable='true'] {
cursor: text;
}
.fancybox-image,
.fancybox-spaceball {
background: transparent;
border: 0;
height: 100%;
left: 0;
margin: 0;
max-height: none;
max-width: none;
padding: 0;
position: absolute;
top: 0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
width: 100%;
}
.fancybox-spaceball {
z-index: 1;
}
.fancybox-slide--video .fancybox-content,
.fancybox-slide--map .fancybox-content,
.fancybox-slide--pdf .fancybox-content,
.fancybox-slide--iframe .fancybox-content {
height: 100%;
overflow: visible;
padding: 0;
width: 100%;
}
.fancybox-slide--video .fancybox-content {
background: #000;
}
.fancybox-slide--map .fancybox-content {
background: #e5e3df;
}
.fancybox-slide--iframe .fancybox-content {
background: #fff;
}
.fancybox-video,
.fancybox-iframe {
background: transparent;
border: 0;
display: block;
height: 100%;
margin: 0;
overflow: hidden;
padding: 0;
width: 100%;
}
/* Fix iOS */
.fancybox-iframe {
left: 0;
position: absolute;
top: 0;
}
.fancybox-error {
background: #fff;
cursor: default;
max-width: 400px;
padding: 40px;
width: 100%;
}
.fancybox-error p {
color: #444;
font-size: 16px;
line-height: 20px;
margin: 0;
padding: 0;
}
/* Buttons */
.fancybox-button {
background: rgba(30, 30, 30, .6);
border: 0;
border-radius: 0;
box-shadow: none;
cursor: pointer;
display: inline-block;
height: 44px;
margin: 0;
padding: 10px;
position: relative;
transition: color .2s;
vertical-align: top;
visibility: inherit;
width: 44px;
}
.fancybox-button,
.fancybox-button:visited,
.fancybox-button:link {
color: #ccc;
}
.fancybox-button:hover {
color: #fff;
}
.fancybox-button:focus {
outline: none;
}
.fancybox-button.fancybox-focus {
outline: 1px dotted;
}
.fancybox-button[disabled],
.fancybox-button[disabled]:hover {
color: #888;
cursor: default;
outline: none;
}
/* Fix IE11 */
.fancybox-button div {
height: 100%;
}
.fancybox-button svg {
display: block;
height: 100%;
overflow: visible;
position: relative;
width: 100%;
}
.fancybox-button svg path {
fill: currentColor;
stroke-width: 0;
}
.fancybox-button--play svg:nth-child(2),
.fancybox-button--fsenter svg:nth-child(2) {
display: none;
}
.fancybox-button--pause svg:nth-child(1),
.fancybox-button--fsexit svg:nth-child(1) {
display: none;
}
.fancybox-progress {
background: #ff5268;
height: 2px;
left: 0;
position: absolute;
right: 0;
top: 0;
-ms-transform: scaleX(0);
transform: scaleX(0);
-ms-transform-origin: 0;
transform-origin: 0;
transition-property: transform;
transition-timing-function: linear;
z-index: 99998;
}
/* Close button on the top right corner of html content */
.fancybox-close-small {
background: transparent;
border: 0;
border-radius: 0;
color: #ccc;
cursor: pointer;
opacity: .8;
padding: 8px;
position: absolute;
right: -12px;
top: -44px;
z-index: 401;
}
.fancybox-close-small:hover {
color: #fff;
opacity: 1;
}
.fancybox-slide--html .fancybox-close-small {
color: currentColor;
padding: 10px;
right: 0;
top: 0;
}
.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
overflow: hidden;
}
.fancybox-is-scaling .fancybox-close-small,
.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
display: none;
}
/* Navigation arrows */
.fancybox-navigation .fancybox-button {
background-clip: content-box;
height: 100px;
opacity: 0;
position: absolute;
top: calc(50% - 50px);
width: 70px;
}
.fancybox-navigation .fancybox-button div {
padding: 7px;
}
.fancybox-navigation .fancybox-button--arrow_left {
left: 0;
left: env(safe-area-inset-left);
padding: 31px 26px 31px 6px;
}
.fancybox-navigation .fancybox-button--arrow_right {
padding: 31px 6px 31px 26px;
right: 0;
right: env(safe-area-inset-right);
}
/* Caption */
.fancybox-caption {
background: linear-gradient(to top,
rgba(0, 0, 0, .85) 0%,
rgba(0, 0, 0, .3) 50%,
rgba(0, 0, 0, .15) 65%,
rgba(0, 0, 0, .075) 75.5%,
rgba(0, 0, 0, .037) 82.85%,
rgba(0, 0, 0, .019) 88%,
rgba(0, 0, 0, 0) 100%);
bottom: 0;
color: #eee;
font-size: 14px;
font-weight: 400;
left: 0;
line-height: 1.5;
padding: 75px 44px 25px 44px;
pointer-events: none;
right: 0;
text-align: center;
z-index: 99996;
}
@supports (padding: max(0px)) {
.fancybox-caption {
padding: 75px max(44px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left));
}
}
.fancybox-caption--separate {
margin-top: -50px;
}
.fancybox-caption__body {
max-height: 50vh;
overflow: auto;
pointer-events: all;
}
.fancybox-caption a,
.fancybox-caption a:link,
.fancybox-caption a:visited {
color: #ccc;
text-decoration: none;
}
.fancybox-caption a:hover {
color: #fff;
text-decoration: underline;
}
/* Loading indicator */
.fancybox-loading {
animation: fancybox-rotate 1s linear infinite;
background: transparent;
border: 4px solid #888;
border-bottom-color: #fff;
border-radius: 50%;
height: 50px;
left: 50%;
margin: -25px 0 0 -25px;
opacity: .7;
padding: 0;
position: absolute;
top: 50%;
width: 50px;
z-index: 99999;
}
@keyframes fancybox-rotate {
100% {
transform: rotate(360deg);
}
}
/* Transition effects */
.fancybox-animated {
transition-timing-function: cubic-bezier(0, 0, .25, 1);
}
/* transitionEffect: slide */
.fancybox-fx-slide.fancybox-slide--previous {
opacity: 0;
transform: translate3d(-100%, 0, 0);
}
.fancybox-fx-slide.fancybox-slide--next {
opacity: 0;
transform: translate3d(100%, 0, 0);
}
.fancybox-fx-slide.fancybox-slide--current {
opacity: 1;
transform: translate3d(0, 0, 0);
}
/* transitionEffect: fade */
.fancybox-fx-fade.fancybox-slide--previous,
.fancybox-fx-fade.fancybox-slide--next {
opacity: 0;
transition-timing-function: cubic-bezier(.19, 1, .22, 1);
}
.fancybox-fx-fade.fancybox-slide--current {
opacity: 1;
}
/* transitionEffect: zoom-in-out */
.fancybox-fx-zoom-in-out.fancybox-slide--previous {
opacity: 0;
transform: scale3d(1.5, 1.5, 1.5);
}
.fancybox-fx-zoom-in-out.fancybox-slide--next {
opacity: 0;
transform: scale3d(.5, .5, .5);
}
.fancybox-fx-zoom-in-out.fancybox-slide--current {
opacity: 1;
transform: scale3d(1, 1, 1);
}
/* transitionEffect: rotate */
.fancybox-fx-rotate.fancybox-slide--previous {
opacity: 0;
-ms-transform: rotate(-360deg);
transform: rotate(-360deg);
}
.fancybox-fx-rotate.fancybox-slide--next {
opacity: 0;
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
.fancybox-fx-rotate.fancybox-slide--current {
opacity: 1;
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
/* transitionEffect: circular */
.fancybox-fx-circular.fancybox-slide--previous {
opacity: 0;
transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
}
.fancybox-fx-circular.fancybox-slide--next {
opacity: 0;
transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
}
.fancybox-fx-circular.fancybox-slide--current {
opacity: 1;
transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
}
/* transitionEffect: tube */
.fancybox-fx-tube.fancybox-slide--previous {
transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg);
}
.fancybox-fx-tube.fancybox-slide--next {
transform: translate3d(100%, 0, 0) scale(.1) skew(10deg);
}
.fancybox-fx-tube.fancybox-slide--current {
transform: translate3d(0, 0, 0) scale(1);
}
/* Styling for Small-Screen Devices */
@media all and (max-height: 576px) {
.fancybox-slide {
padding-left: 6px;
padding-right: 6px;
}
.fancybox-slide--image {
padding: 6px 0;
}
.fancybox-close-small {
right: -6px;
}
.fancybox-slide--image .fancybox-close-small {
background: #4e4e4e;
color: #f2f4f6;
height: 36px;
opacity: 1;
padding: 6px;
right: 0;
top: 0;
width: 36px;
}
.fancybox-caption {
padding-left: 12px;
padding-right: 12px;
}
@supports (padding: max(0px)) {
.fancybox-caption {
padding-left: max(12px, env(safe-area-inset-left));
padding-right: max(12px, env(safe-area-inset-right));
}
}
}
/* Share */
.fancybox-share {
background: #f4f4f4;
border-radius: 3px;
max-width: 90%;
padding: 30px;
text-align: center;
}
.fancybox-share h1 {
color: #222;
font-size: 35px;
font-weight: 700;
margin: 0 0 20px 0;
}
.fancybox-share p {
margin: 0;
padding: 0;
}
.fancybox-share__button {
border: 0;
border-radius: 3px;
display: inline-block;
font-size: 14px;
font-weight: 700;
line-height: 40px;
margin: 0 5px 10px 5px;
min-width: 130px;
padding: 0 15px;
text-decoration: none;
transition: all .2s;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
white-space: nowrap;
}
.fancybox-share__button:visited,
.fancybox-share__button:link {
color: #fff;
}
.fancybox-share__button:hover {
text-decoration: none;
}
.fancybox-share__button--fb {
background: #3b5998;
}
.fancybox-share__button--fb:hover {
background: #344e86;
}
.fancybox-share__button--pt {
background: #bd081d;
}
.fancybox-share__button--pt:hover {
background: #aa0719;
}
.fancybox-share__button--tw {
background: #1da1f2;
}
.fancybox-share__button--tw:hover {
background: #0d95e8;
}
.fancybox-share__button svg {
height: 25px;
margin-right: 7px;
position: relative;
top: -1px;
vertical-align: middle;
width: 25px;
}
.fancybox-share__button svg path {
fill: #fff;
}
.fancybox-share__input {
background: transparent;
border: 0;
border-bottom: 1px solid #d7d7d7;
border-radius: 0;
color: #5d5b5b;
font-size: 14px;
margin: 10px 0 0 0;
outline: none;
padding: 10px 15px;
width: 100%;
}
/* Thumbs */
.fancybox-thumbs {
background: #ddd;
bottom: 0;
display: none;
margin: 0;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
padding: 2px 2px 4px 2px;
position: absolute;
right: 0;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
top: 0;
width: 212px;
z-index: 99995;
}
.fancybox-thumbs-x {
overflow-x: auto;
overflow-y: hidden;
}
.fancybox-show-thumbs .fancybox-thumbs {
display: block;
}
.fancybox-show-thumbs .fancybox-inner {
right: 212px;
}
.fancybox-thumbs__list {
font-size: 0;
height: 100%;
list-style: none;
margin: 0;
overflow-x: hidden;
overflow-y: auto;
padding: 0;
position: absolute;
position: relative;
white-space: nowrap;
width: 100%;
}
.fancybox-thumbs-x .fancybox-thumbs__list {
overflow: hidden;
}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
width: 7px;
}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
background: #fff;
border-radius: 10px;
box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
background: #2a2a2a;
border-radius: 10px;
}
.fancybox-thumbs__list a {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background-color: rgba(0, 0, 0, .1);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
cursor: pointer;
float: left;
height: 75px;
margin: 2px;
max-height: calc(100% - 8px);
max-width: calc(50% - 4px);
outline: none;
overflow: hidden;
padding: 0;
position: relative;
-webkit-tap-highlight-color: transparent;
width: 100px;
}
.fancybox-thumbs__list a::before {
border: 6px solid #ff5268;
bottom: 0;
content: '';
left: 0;
opacity: 0;
position: absolute;
right: 0;
top: 0;
transition: all .2s cubic-bezier(.25, .46, .45, .94);
z-index: 99991;
}
.fancybox-thumbs__list a:focus::before {
opacity: .5;
}
.fancybox-thumbs__list a.fancybox-thumbs-active::before {
opacity: 1;
}
/* Styling for Small-Screen Devices */
@media all and (max-width: 576px) {
.fancybox-thumbs {
width: 110px;
}
.fancybox-show-thumbs .fancybox-inner {
right: 110px;
}
.fancybox-thumbs__list a {
max-width: calc(100% - 10px);
}
}

5632
fancybox/asset/fancybox/jquery.fancybox.js vendored Normal file
View file

File diff suppressed because it is too large Load diff

1
fancybox/asset/fancybox/jquery.fancybox.min.css vendored Normal file
View file

File diff suppressed because one or more lines are too long

13
fancybox/asset/fancybox/jquery.fancybox.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

17
fancybox/createrelease Executable file
View file

@ -0,0 +1,17 @@
MODULE=fancybox
cd ..
# read actual version from module.json
# old releases not needed anymore
mkdir -p $MODULE/dist
rm $MODULE/dist/*
# create release for actual version
zip -r9 $MODULE/dist/release.zip $MODULE/* -x $MODULE/dist/\* -x $MODULE/test/\* $MODULE/createrelease
echo release/release.zip created.
cd $MODULE

BIN
fancybox/dist/release.zip vendored Normal file
View file

Binary file not shown.

61
fancybox/fancybox.php Normal file
View file

@ -0,0 +1,61 @@
<?php
/**
* Name: Fancybox
* Description: Open media attachments of posts into a fancybox overlay.
* Version: 1.01
* Author: Grischa Brockhaus <grischa@brockha.us>
*/
use Friendica\App;
use Friendica\Core\Hook;
use Friendica\DI;
function fancybox_install()
{
Hook::register('head', __FILE__, 'fancybox_head');
Hook::register('footer', __FILE__, 'fancybox_footer');
Hook::register('prepare_body_final', __FILE__, 'fancybox_render');
}
function fancybox_head(App $a, string &$b)
{
DI::page()->registerStylesheet(__DIR__ . '/asset/fancybox/jquery.fancybox.min.css');
}
function fancybox_footer(App $a, string &$str)
{
DI::page()->registerFooterScript(__DIR__ . '/asset/fancybox/jquery.fancybox.min.js');
DI::page()->registerFooterScript(__DIR__ . '/asset/fancybox/fancybox.config.js');
}
/*
prepare_body_final
Called at the end of prepare_body(). Hook data:
item: item array (input)
html: converted item body (input/output)
*/
function fancybox_render(App $a, array &$b) {
$matches = [];
$pattern='#<div class="body-attach">.*?</div>#s';
$gallery = 'gallery';
if (array_key_exists('item', $b)) {
$item = $b['item'];
if (array_key_exists('uri-id', $item)) {
$gallery = $gallery . '-' . $item['uri-id'];
}
}
$html = $b['html'];
while (preg_match($pattern, $html, $matches, PREG_OFFSET_CAPTURE)) {
if (is_array($matches)) $matches=$matches[0];
$part = $matches[0];
$replaced = str_replace('<a href', '<a data-fancybox="' . $gallery . '" href', $part);
$replaced = str_replace('<div class="body-attach"', '<div class="body-attach done"', $replaced);
$html =str_replace($part, $replaced, $html);
}
$html = str_replace('class="body-attach done"', 'class="body-attach"', $html);
$b['html'] = $html;
}

BIN
fancybox/test/fancybox-3.5.7.zip Normal file
View file

Binary file not shown.

21
fancybox/test/imagetest.html Normal file
View file

@ -0,0 +1,21 @@
<html>
<head>
<!-- https://github.com/friendica/friendica/tree/stable/doc -->
<!-- https://github.com/friendica/friendica/blob/stable/doc/Addons.md -->
<!-- https://stackoverflow.com/questions/44409223/show-image-in-a-popup-when-i-click-button -->
<!-- https://github.com/fancyapps/fancybox -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.2.0/jquery.fancybox.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.2.0/jquery.fancybox.min.js"></script>
</head>
<body>
<div class="body-attach"><a data-fancybox="gallery" href="https://social.beachcom.org/system/media_attachments/files/109/395/536/026/043/860/original/cb17a73a2a5cd86f.jpeg"><img src="https://friends.brockha.us/photo/preview/600/3734" alt="" title=""></a>
<br>
<div class="clear"></div></div>
<div class="body-attach"><a data-fancybox="gallery" href="https://media.troet.cafe/troet.cafe/media_attachments/files/109/393/109/756/233/529/original/4290ef9eb5d7b799.jpeg"><img src="https://friends.brockha.us/photo/preview/1024/3729" alt="Tardis cookie jar and Tardis book, like River Songs diary." title="Tardis cookie jar and Tardis book, like River Songs diary."></a>
<br>
<div class="clear"></div></div>
</body>
</html>

14
fancybox/test/test.html Normal file
View file

@ -0,0 +1,14 @@
<p>Blubber Start</p>
<div class="clearfix"></div>
<hr />
<div class="wall-item-content post" id="wall-item-content-21657">
<div class="wall-item-body e-content p-name" id="wall-item-body-21657" dir="auto">Aktuell blockieren Unterstützer:innen der Letzten Generation das Rollfeld des BER.<br>Einige haben sich auf dem Asphalt festgeklebt, andere fahren mit Rad über den Rangierbereich und bringen so den Flugverkehr zum Erliegen. Vor dem Betreten des BER informierten sie die Polizei. <a href="https://t.co/c6UGVfPDI9" target="_blank" rel="noopener noreferrer">https://t.co/c6UGVfPDI9</a><div class="body-attach"><a href="https://climatejustice.social/system/media_attachments/files/109/400/027/751/450/406/original/9217a95e2bca723f.jpg"><img src="https://friends.brockha.us/photo/preview/1024/4292" alt="" title=""></a>
<br>
<a href="https://climatejustice.social/system/media_attachments/files/109/400/028/270/759/610/original/33b8b6d69d0d98fa.jpg"><img src="https://friends.brockha.us/photo/preview/600/4294" alt="" title=""></a>
<br>
<a href="https://climatejustice.social/system/media_attachments/files/109/400/028/712/968/943/original/2affd82b2c9a50c9.jpg"><img src="https://friends.brockha.us/photo/preview/600/4296" alt="" title=""></a>
<br>
<div class="clear"></div></div></div>
<p>Blubber Ende</p>

14
fancybox/test/test.out.html Normal file
View file

@ -0,0 +1,14 @@
<p>Blubber Start</p>
<div class="clearfix"></div>
<hr />
<div class="wall-item-content post" id="wall-item-content-21657">
<div class="wall-item-body e-content p-name" id="wall-item-body-21657" dir="auto">Aktuell blockieren Unterstützer:innen der Letzten Generation das Rollfeld des BER.<br>Einige haben sich auf dem Asphalt festgeklebt, andere fahren mit Rad über den Rangierbereich und bringen so den Flugverkehr zum Erliegen. Vor dem Betreten des BER informierten sie die Polizei. <a href="https://t.co/c6UGVfPDI9" target="_blank" rel="noopener noreferrer">https://t.co/c6UGVfPDI9</a><div class="body-attach"><a data-fancybox="gallery" href="https://climatejustice.social/system/media_attachments/files/109/400/027/751/450/406/original/9217a95e2bca723f.jpg"><img src="https://friends.brockha.us/photo/preview/1024/4292" alt="" title=""></a>
<br>
<a data-fancybox="gallery" href="https://climatejustice.social/system/media_attachments/files/109/400/028/270/759/610/original/33b8b6d69d0d98fa.jpg"><img src="https://friends.brockha.us/photo/preview/600/4294" alt="" title=""></a>
<br>
<a data-fancybox="gallery" href="https://climatejustice.social/system/media_attachments/files/109/400/028/712/968/943/original/2affd82b2c9a50c9.jpg"><img src="https://friends.brockha.us/photo/preview/600/4296" alt="" title=""></a>
<br>
<div class="clear"></div></div></div>
<p>Blubber Ende</p>