Skip to content

Commit

Permalink
work on gallery
Browse files Browse the repository at this point in the history
  • Loading branch information
@bastihilger
bastihilger committed Dec 4, 2021
1 parent e36b16e commit bf530d9
Show file tree
Hide file tree
Showing 3 changed files with 69 additions and 17 deletions.
2 changes: 1 addition & 1 deletion dist/js/field.js
View file

Large diffs are not rendered by default.

31 changes: 27 additions & 4 deletions resources/js/components/content-blocks/GalleryContentBlock.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,9 +35,20 @@
class="my-6 p-2 bg-40 rounded-lg"
>
<div class="mb-2 flex items-center justify-between text-primary">
<div
v-text="'Slide '+(slideIndex + 1)"
/>
<div class="flex items-center">
<div
v-text="'Slide '+(slideIndex + 1)"
/>

<div
class="ml-4 cursor-pointer"
@click="removeSlide(slideIndex)"
>
<font-awesome-icon :icon="['fas', 'trash-alt']">
</font-awesome-icon>

</div>
</div>

<div>
<div
Expand Down Expand Up @@ -110,7 +121,7 @@
cursor-pointer ml-8 text-xl text-primary
"
>
<font-awesome-icon :icon="['fas', 'trash-alt']">
<font-awesome-icon :icon="['fas', 'times-circle']">
</font-awesome-icon>
</div>

Expand Down Expand Up @@ -336,6 +347,18 @@ export default {
},
removeSlide(index) {
let newSlides = [];
for(let i = 0; i < this.slideCount; i++) {
if (i != index) {
newSlides.push(this.slides[i]);
}
}
this.slides = newSlides;
},
moveDown(index) {
let newSlides = [];
Expand Down
53 changes: 41 additions & 12 deletions src/TiptapContentBlocks.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@

namespace Manogi\Tiptap;

use Illuminate\Support\Str;

class TiptapContentBlocks
{
public function parse($content)
Expand Down Expand Up @@ -31,21 +33,48 @@ function ($matches) {
$mode = $matches[4];
$maxcolumns = $matches[3];

$html = '<div class="ttcp-'.$mode.'-wrapper"><div class="ttcp-'.$mode.'-inner"><div class="ttcp-'.$mode.'-stage ttcp-'.$mode.'-cols-'.$maxcolumns.'">';
if ($mode == 'grid') {
$html = '<div class="ttcp-grid-wrapper"><div class="ttcp-grid-inner"><div class="ttcp-grid-stage ttcp-grid-cols-'.$maxcolumns.'">';

foreach ($slides as $slide) {
$html .= '<div class="ttcp-grid-slide">';
$html .= '<div class="ttcp-grid-image-wrapper">';
$html .= '<img class="ttcp-grid-image" src="'.$slide->src.'" />';
$html .= '</div>';
$html .= '<div class="ttcp-grid-subtext">';
$html .= '<div class="ttcp-grid-caption">'.$slide->caption.'</div>';
$html .= '<div class="ttcp-grid-credits">'.$slide->credits.'</div>';
$html .= '</div>';
$html .= '</div>';
}

$html .= '</div></div></div>';
} elseif ($mode == 'slideshow') {
$html = '<div class="ttcp-slideshow-wrapper"><div class="ttcp-slideshow-inner"><div id="swiper_'.Str::random(12).'" class="swiper"><div class="swiper-wrapper">';

foreach ($slides as $slide) {
$html .= '<div class="ttcp-slideshow-slide swiper-slide">';
$html .= '<div class="ttcp-slideshow-image-wrapper"><div class="ttcp-slideshow-image-inner">';
$html .= '<img class="ttcp-slideshow-image" src="'.$slide->src.'" />';
$html .= '</div></div>';
$html .= '<div class="ttcp-slideshow-subtext">';
$html .= '<div class="ttcp-slideshow-caption">'.$slide->caption.'</div>';
$html .= '<div class="ttcp-slideshow-credits">'.$slide->credits.'</div>';
$html .= '</div>';
$html .= '</div>';
}

foreach ($slides as $slide) {
$html .= '<div class="ttcp-'.$mode.'-slide">';
$html .= '<div class="ttcp-'.$mode.'-image-wrapper">';
$html .= '<img class="ttcp-'.$mode.'-image" src="'.$slide->src.'" />';
$html .= '</div>';
$html .= '<div class="ttcp-'.$mode.'-subtext">';
$html .= '<div class="ttcp-'.$mode.'-caption">'.$slide->caption.'</div>';
$html .= '<div class="ttcp-'.$mode.'-credits">'.$slide->caption.'</div>';
$html .= '</div>';
$html .= '</div>';
}

$html .= '</div></div></div>';
if (count($slides) > 1) {
$html .= '<div class="swiper-pagination"></div>';

$html .= '<div class="swiper-button-prev"></div>';
$html .= '<div class="swiper-button-next"></div>';
}

$html .= '</div></div></div>';
}

return $html;
},
Expand Down

0 comments on commit bf530d9

Please sign in to comment.