diff --git a/packages/primevue/src/galleria/GalleriaThumbnails.vue b/packages/primevue/src/galleria/GalleriaThumbnails.vue index 1b14a61bf..2ba00ef97 100755 --- a/packages/primevue/src/galleria/GalleriaThumbnails.vue +++ b/packages/primevue/src/galleria/GalleriaThumbnails.vue @@ -5,7 +5,7 @@ v-if="showThumbnailNavigators" v-ripple :class="cx('thumbnailPrevButton')" - :disabled="isNavBackwardDisabled()" + :disabled="isNavBackwardDisabled" type="button" :aria-label="ariaPrevButtonLabel" @click="navBackward($event)" @@ -57,7 +57,7 @@ v-if="showThumbnailNavigators" v-ripple :class="cx('thumbnailNextButton')" - :disabled="isNavForwardDisabled()" + :disabled="isNavForwardDisabled" type="button" :aria-label="ariaNextButtonLabel" @click="navForward($event)" @@ -507,12 +507,7 @@ export default { this.documentResizeListener = null; } }, - isNavBackwardDisabled() { - return (!this.circular && this.d_activeIndex === 0) || this.value.length <= this.d_numVisible; - }, - isNavForwardDisabled() { - return (!this.circular && this.d_activeIndex === this.value.length - 1) || this.value.length <= this.d_numVisible; - }, + firstItemAciveIndex() { return this.totalShiftedItems * -1; }, @@ -532,6 +527,16 @@ export default { }, ariaNextButtonLabel() { return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.nextPageLabel : undefined; + }, + isNavBackwardDisabled() { + // console.log((!this.circular && this.d_activeIndex === 0) || this.value.length <= this.d_numVisible); + + return (!this.circular && this.d_activeIndex === 0) || this.value.length <= this.d_numVisible; + }, + isNavForwardDisabled() { + console.log((!this.circular && this.d_activeIndex === this.value.length - 1) || this.value.length <= this.d_numVisible); + + return (!this.circular && this.d_activeIndex === this.value.length - 1) || this.value.length <= this.d_numVisible; } }, components: { diff --git a/packages/primevue/src/galleria/style/GalleriaStyle.js b/packages/primevue/src/galleria/style/GalleriaStyle.js index 6eae421a7..f29f607e9 100644 --- a/packages/primevue/src/galleria/style/GalleriaStyle.js +++ b/packages/primevue/src/galleria/style/GalleriaStyle.js @@ -458,7 +458,7 @@ const classes = { prevButton: ({ instance }) => [ 'p-galleria-prev-button p-galleria-nav-button', { - 'p-disabled': instance.isNavBackwardDisabled() + 'p-disabled': instance.isNavBackwardDisabled } ], prevIcon: 'p-galleria-prev-icon', @@ -466,7 +466,7 @@ const classes = { nextButton: ({ instance }) => [ 'p-galleria-next-button p-galleria-nav-button', { - 'p-disabled': instance.isNavForwardDisabled() + 'p-disabled': instance.isNavForwardDisabled } ], nextIcon: 'p-galleria-next-icon', @@ -484,7 +484,7 @@ const classes = { thumbnailPrevButton: ({ instance }) => [ 'p-galleria-thumbnail-prev-button p-galleria-thumbnail-nav-button', { - 'p-disabled': instance.isNavBackwardDisabled() + 'p-disabled': instance.isNavBackwardDisabled } ], thumbnailPrevIcon: 'p-galleria-thumbnail-prev-icon', @@ -503,7 +503,7 @@ const classes = { thumbnailNextButton: ({ instance }) => [ 'p-galleria-thumbnail-next-button p-galleria-thumbnail-nav-button', { - 'p-disabled': instance.isNavForwardDisabled() + 'p-disabled': instance.isNavForwardDisabled } ], thumbnailNextIcon: 'p-galleria-thumbnail-next-icon'