-
Notifications
You must be signed in to change notification settings - Fork 608
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(storefront): BCTHEME-200 add notifications announcement on carou…
…sel change
- Loading branch information
1 parent
851e42b
commit 9483757
Showing
12 changed files
with
72 additions
and
35 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,26 +1,19 @@ | ||
const NUMBER = '[NUMBER]'; | ||
const integerRegExp = /[0-9]+/; | ||
const lastIntegerRegExp = /(\d+)(?!.*\d)/; | ||
import updateTextWithLiveData from './updateTextWithLiveData'; | ||
|
||
export default ($prevArrow, $nextArrow, actualSlide, actualSlideCount) => { | ||
if (actualSlideCount < 2) return; | ||
if ($prevArrow.length === 0 || $nextArrow.length === 0) return; | ||
|
||
const arrowAriaLabelBaseText = $prevArrow.attr('aria-label'); | ||
|
||
const isInit = arrowAriaLabelBaseText.includes(NUMBER); | ||
const valueToReplace = isInit ? NUMBER : integerRegExp; | ||
const currentSlideNumber = actualSlide + 1; | ||
|
||
const prevSlideNumber = actualSlide === 0 ? actualSlideCount : currentSlideNumber - 1; | ||
const arrowLeftText = arrowAriaLabelBaseText | ||
.replace(valueToReplace, prevSlideNumber) | ||
.replace(lastIntegerRegExp, actualSlideCount); | ||
const arrowLeftText = updateTextWithLiveData(arrowAriaLabelBaseText, prevSlideNumber, actualSlideCount); | ||
|
||
$prevArrow.attr('aria-label', arrowLeftText); | ||
|
||
const nextSlideNumber = actualSlide === actualSlideCount - 1 ? 1 : currentSlideNumber + 1; | ||
const arrowRightText = arrowAriaLabelBaseText | ||
.replace(valueToReplace, nextSlideNumber) | ||
.replace(lastIntegerRegExp, actualSlideCount); | ||
const arrowRightText = updateTextWithLiveData(arrowAriaLabelBaseText, nextSlideNumber, actualSlideCount); | ||
|
||
$nextArrow.attr('aria-label', arrowRightText); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
11 changes: 11 additions & 0 deletions
11
assets/js/theme/common/carousel/utils/updateTextWithLiveData.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
const NUMBER = '[NUMBER]'; | ||
const integerRegExp = /[0-9]+/; | ||
const lastIntegerRegExp = /(\d+)(?!.*\d)/; | ||
|
||
export default (textForChange, slideNumber, slideCount) => { | ||
const valueToReplace = textForChange.includes(NUMBER) ? NUMBER : integerRegExp; | ||
|
||
return textForChange | ||
.replace(valueToReplace, slideNumber) | ||
.replace(lastIntegerRegExp, slideCount); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
<span | ||
class="js-carousel-content-change-message aria-description--hidden" | ||
aria-live="polite" | ||
role="status"> | ||
{{lang 'carousel.contentAnnounceMessage'}} {{slides_length}} | ||
</span> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters