Skip to content

Commit

Permalink
fix bug
Browse files Browse the repository at this point in the history
  • Loading branch information
@rupadana
rupadana committed Jan 26, 2024
1 parent 902d018 commit 4a86185
Show file tree
Hide file tree
Showing 5 changed files with 217 additions and 175 deletions.
251 changes: 91 additions & 160 deletions resources/views/infolists/components/swiper-image-entry.blade.php
View file
Original file line number Diff line number Diff line change
@@ -1,66 +1,65 @@
@php
$limit = $getLimit();
$state = \Illuminate\Support\Arr::wrap($getState());
$limitedState = array_slice($state, 0, $limit);
$isCircular = $isCircular();
$isSquare = $isSquare();
$isStacked = $isStacked();
$overlap = $isStacked ? ($getOverlap() ?? 2) : null;
$ring = $isStacked ? ($getRing() ?? 2) : null;
$height = $getHeight() ?? ($isStacked ? '2.5rem' : '8rem');
$width = $getWidth() ?? (($isCircular || $isSquare) ? $height : null);
$defaultImageUrl = $getDefaultImageUrl();
$pagination = $getPagination();
$navigation = $getNavigation();
$slidesPerView = $getSlidesPerView();
$paginationType = $getPaginationType();
$autoplay = $getAutoplay();
$autoplayDelay = $getAutoplayDelay();
$paginationClickable = $getPaginationClickable();
$paginationDynamicBullets = $getPaginationDynamicBullets();
$paginationDynamicMainBullets = $getPaginationDynamicMainBullets();
$paginationHideOnClick = $getPaginationHideOnClick();
$scrollbar = $getScrollbar();
$scrollbarDraggable = $getScrollbarDraggable();
$scrollbarHide = $getScrollbarHide();
$scrollbarSnapOnRelease = $getScrollbarSnapOnRelease();
$scrollbarDragSize = $getScrollbarDragSize();
$effect = $getEffect();
// dd($slidesPerView);
if ((! count($limitedState)) && filled($defaultImageUrl)) {
$limitedState = [null];
}
$ringClasses = \Illuminate\Support\Arr::toCssClasses([
'ring-white dark:ring-gray-900',
match ($ring) {
0 => null,
1 => 'ring-1',
2 => 'ring-2',
3 => 'ring',
4 => 'ring-4',
default => $ring,
},
]);
$hasLimitedRemainingText = $hasLimitedRemainingText();
$isLimitedRemainingTextSeparate = $isLimitedRemainingTextSeparate();
$limitedRemainingTextSizeClasses = match ($getLimitedRemainingTextSize()) {
'xs' => 'text-xs',
'sm', null => 'text-sm',
'base', 'md' => 'text-base',
'lg' => 'text-lg',
default => $size,
};
$limit = $getLimit();
$state = \Illuminate\Support\Arr::wrap($getState());
$limitedState = array_slice($state, 0, $limit);
$isCircular = $isCircular();
$isSquare = $isSquare();
$isStacked = $isStacked();
$overlap = $isStacked ? ($getOverlap() ?? 2) : null;
$ring = $isStacked ? ($getRing() ?? 2) : null;
$height = $getHeight() ?? ($isStacked ? '2.5rem' : '8rem');
$width = $getWidth() ?? (($isCircular || $isSquare) ? $height : null);
$defaultImageUrl = $getDefaultImageUrl();
$pagination = $getPagination();
$navigation = $getNavigation();
$slidesPerView = $getSlidesPerView();
$paginationType = $getPaginationType();
$autoplay = $getAutoplay();
$autoplayDelay = $getAutoplayDelay();
$paginationClickable = $getPaginationClickable();
$paginationDynamicBullets = $getPaginationDynamicBullets();
$paginationDynamicMainBullets = $getPaginationDynamicMainBullets();
$paginationHideOnClick = $getPaginationHideOnClick();
$scrollbar = $getScrollbar();
$scrollbarDraggable = $getScrollbarDraggable();
$scrollbarHide = $getScrollbarHide();
$scrollbarSnapOnRelease = $getScrollbarSnapOnRelease();
$scrollbarDragSize = $getScrollbarDragSize();
$effect = $getEffect();
// dd($slidesPerView);
if ((! count($limitedState)) && filled($defaultImageUrl)) {
$limitedState = [null];
}
$ringClasses = \Illuminate\Support\Arr::toCssClasses([
'ring-white dark:ring-gray-900',
match ($ring) {
0 => null,
1 => 'ring-1',
2 => 'ring-2',
3 => 'ring',
4 => 'ring-4',
default => $ring,
},
]);
$hasLimitedRemainingText = $hasLimitedRemainingText();
$isLimitedRemainingTextSeparate = $isLimitedRemainingTextSeparate();
$limitedRemainingTextSizeClasses = match ($getLimitedRemainingTextSize()) {
'xs' => 'text-xs',
'sm', null => 'text-sm',
'base', 'md' => 'text-base',
'lg' => 'text-lg',
default => $size,
};
@endphp

<style>
* {
--swiper-theme-color: rgba(var(--primary-600));
--swiper-scrollbar-drag-bg-color: rgba(var(--primary-600));
Expand All @@ -86,75 +85,19 @@
object-fit: cover;
}
</style>
<div
{{
<div {{
$attributes
->merge($getExtraAttributes(), escape: false)
->class([
'fi-in-image flex items-center gap-x-2.5',
])
}}

ax-load
ax-load-src="{{\Filament\Support\Facades\FilamentAsset::getScriptSrc('filament-swiper-scripts',
'rupadana/filament-swiper')}}"
>
}} ax-load ax-load-src="{{\Filament\Support\Facades\FilamentAsset::getScriptSrc('filament-swiper-scripts',
'rupadana/filament-swiper')}}">
@if (count($limitedState))
<swiper-container

@if($autoplay)
autoplay-delay="{{$autoplayDelay}}"
autoplay="@js($autoplay)"
@endif
slides-per-view="@js($slidesPerView)"

@if($navigation)
navigation="@js($navigation)"
@endif



@if($pagination)
pagination="@js($pagination)"
pagination-type="{{$paginationType}}"
pagination-clickable="@js($paginationClickable)"
pagination-dynamic-bullets="@js($paginationDynamicBullets)"
pagination-dynamic-main-bullets="{{$paginationDynamicMainBullets}}"
pagination-hide-on-click="{{$paginationHideOnClick}}"
@endif

@if($scrollbar)
scrollbar="@js($scrollbar)"
scrollbar-draggable="@js($scrollbarDraggable)"
scrollbar-drag-size="{{$scrollbarDragSize}}"
scrollbar-hide="@js($scrollbarHide)"
scrollbar-snap-on-release="@js($scrollbarSnapOnRelease)"
@endif


effect="{{$effect}}"

@if($effect == \Rupadana\FilamentSwiper\Infolists\Components\SwiperImageEntry::COVERFLOW_EFFECT)
coverflow-effect-modifier="@js($getCoverflowEffectModifier())"
coverflow-depth="@js($getCoverflowDepth())"
coverflow-slide-shadows="@js($getCoverflowSlideShadows())"
coverflow-stretch="@js($getCoverflowStretch())"
@endif

@if($effect == \Rupadana\FilamentSwiper\Infolists\Components\SwiperImageEntry::CARDS_EFFECT)
cards-per-slide-offset="@js($getCardsPerSlideOffset())"
cards-per-slide-rotate="@js($getCardsPerSlideRotate())"
cards-rotate="@js($getCardsRotate())"
cards-slide-shadows="@js($getCardsSlideShadows())"
@endif

centered-slides="@js($getCenteredSlides())"
>
@foreach ($limitedState as $stateItem)
<swiper-slide>
<img
src="{{ filled($stateItem) ? $getImageUrl($stateItem) : $defaultImageUrl }}"
{{
<swiper-container @if($autoplay) autoplay-delay="{{$autoplayDelay}}" autoplay="@js($autoplay)" @endif slides-per-view="@js($slidesPerView)" @if($navigation) navigation="@js($navigation)" @endif @if($pagination) pagination="@js($pagination)" pagination-type="{{$paginationType}}" pagination-clickable="@js($paginationClickable)" pagination-dynamic-bullets="@js($paginationDynamicBullets)" pagination-dynamic-main-bullets="{{$paginationDynamicMainBullets}}" pagination-hide-on-click="{{$paginationHideOnClick}}" @endif @if($scrollbar) scrollbar="@js($scrollbar)" scrollbar-draggable="@js($scrollbarDraggable)" scrollbar-drag-size="{{$scrollbarDragSize}}" scrollbar-hide="@js($scrollbarHide)" scrollbar-snap-on-release="@js($scrollbarSnapOnRelease)" @endif effect="{{$effect}}" @if($effect==\Rupadana\FilamentSwiper\Infolists\Components\SwiperImageEntry::COVERFLOW_EFFECT) coverflow-effect-modifier="@js($getCoverflowEffectModifier())" coverflow-depth="@js($getCoverflowDepth())" coverflow-slide-shadows="@js($getCoverflowSlideShadows())" coverflow-stretch="@js($getCoverflowStretch())" @endif @if($effect==\Rupadana\FilamentSwiper\Infolists\Components\SwiperImageEntry::CARDS_EFFECT) cards-per-slide-offset="@js($getCardsPerSlideOffset())" cards-per-slide-rotate="@js($getCardsPerSlideRotate())" cards-rotate="@js($getCardsRotate())" cards-slide-shadows="@js($getCardsSlideShadows())" @endif centered-slides="@js($getCenteredSlides())">
@foreach ($limitedState as $stateItem)
<swiper-slide>
<img src="{{ filled($stateItem) ? $getImageUrl($stateItem) : $defaultImageUrl }}" {{
$getExtraImgAttributeBag()
->class([
'max-w-none object-cover object-center',
Expand All @@ -165,48 +108,36 @@
"height: {$height}" => $height,
"width: {$width}" => $width,
])
}}
/>
</swiper-slide>
@endforeach
}} />
</swiper-slide>
@endforeach

@if ($hasLimitedRemainingText && ($loop->iteration < count($limitedState)) && (! $isLimitedRemainingTextSeparate) && $isCircular)
<div
style="
@if ($hasLimitedRemainingText && ($loop->iteration < count($limitedState)) && (! $isLimitedRemainingTextSeparate) && $isCircular) <div style="
@if ($height) height: {{ $height }}; @endif
@if ($width) width: {{ $width }}; @endif
"
@class([
'flex items-center justify-center bg-gray-100 font-medium text-gray-500 dark:bg-gray-800 dark:text-gray-400',
'rounded-full' => $isCircular,
$limitedRemainingTextSizeClasses,
$ringClasses,
])
@style([
"height: {$height}" => $height,
"width: {$width}" => $width,
])
>
<span class="-ms-0.5">
+{{ count($state) - count($limitedState) }}
</span>
</div>
@endif
</swiper-container>

@if ($hasLimitedRemainingText && ($loop->iteration < count($limitedState)) && ($isLimitedRemainingTextSeparate || (! $isCircular)))
<div
@class([
'font-medium text-gray-500 dark:text-gray-400',
$limitedRemainingTextSizeClasses,
])
" @class([ 'flex items-center justify-center bg-gray-100 font-medium text-gray-500 dark:bg-gray-800 dark:text-gray-400' , 'rounded-full'=> $isCircular,
$limitedRemainingTextSizeClasses,
$ringClasses,
])
@style([
"height: {$height}" => $height,
"width: {$width}" => $width,
])
>
<span class="-ms-0.5">
+{{ count($state) - count($limitedState) }}
</div>
@endif
</span>
</div>
@endif
</swiper-container>

@if ($hasLimitedRemainingText && ($loop->iteration < count($limitedState)) && ($isLimitedRemainingTextSeparate || (! $isCircular))) <div @class([ 'font-medium text-gray-500 dark:text-gray-400' , $limitedRemainingTextSizeClasses, ])>
+{{ count($state) - count($limitedState) }}
</div>
@endif
@elseif (($placeholder = $getPlaceholder()) !== null)
<x-filament-infolists::entries.placeholder>
{{ $placeholder }}
</x-filament-infolists::entries.placeholder>
<x-filament-infolists::entries.placeholder>
{{ $placeholder }}
</x-filament-infolists::entries.placeholder>
@endif
</div>
</div>
15 changes: 4 additions & 11 deletions resources/views/infolists/components/swiper.blade.php
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,4 @@

<style>
* {
--swiper-theme-color: rgba(var(--primary-600));
--swiper-scrollbar-drag-bg-color: rgba(var(--primary-600));
Expand Down Expand Up @@ -33,19 +31,14 @@
{{$getTitle()}}
</h2>

<div
{{
<div {{
$attributes
->merge($getExtraAttributes(), escape: false)
->class([
'fi-in-image flex items-center gap-x-2.5 max-w-7xl mx-auto px-6 md:px-12 xl:px-6 mt-16',
])
}}

ax-load
ax-load-src="{{\Filament\Support\Facades\FilamentAsset::getScriptSrc('filament-swiper-scripts',
'rupadana/filament-swiper')}}"
>
}} ax-load ax-load-src="{{\Filament\Support\Facades\FilamentAsset::getScriptSrc('filament-swiper-scripts',
'rupadana/filament-swiper')}}">



Expand All @@ -54,4 +47,4 @@

</div>

</div>
</div>
Loading

0 comments on commit 4a86185

Please sign in to comment.