Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Announcement Bar] Auto-rotate fixes #2810

Merged
merged 7 commits into from
Jul 11, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions assets/component-slider.css
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,10 @@ slider-component.slider-component-full-width {
padding-bottom: 0;
}

.slider__slide[aria-hidden="true"] {
visibility: hidden;
}

@media screen and (max-width: 749px) {
.slider.slider--mobile {
position: relative;
Expand Down
1 change: 1 addition & 0 deletions assets/component-slideshow.css
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ slideshow-component .slideshow.banner {
position: relative;
display: flex;
flex-direction: column;
visibility: visible;
}

@media screen and (max-width: 749px) {
Expand Down
13 changes: 4 additions & 9 deletions assets/global.js
Original file line number Diff line number Diff line change
Expand Up @@ -735,13 +735,9 @@ class SlideshowComponent extends SliderComponent {
if (this.announcementBarSlider) {
this.announcementBarArrowButtonWasClicked = false;

this.desktopLayout = window.matchMedia('(min-width: 750px)');
this.reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');

[this.reducedMotion, this.desktopLayout].forEach((mediaQuery) => {
mediaQuery.addEventListener('change', () => {
if (this.slider.getAttribute('data-autoplay') === 'true') this.setAutoPlay();
});
this.reducedMotion.addEventListener('change', () => {
if (this.slider.getAttribute('data-autoplay') === 'true') this.setAutoPlay();
});

[this.prevButton, this.nextButton].forEach((button) => {
Expand Down Expand Up @@ -771,7 +767,7 @@ class SlideshowComponent extends SliderComponent {
this.autoplayButtonIsSetToPlay = true;
this.play();
} else {
this.reducedMotion.matches || this.announcementBarArrowButtonWasClicked || !this.desktopLayout.matches
this.reducedMotion.matches || this.announcementBarArrowButtonWasClicked
? this.pause()
: this.play();
}
Expand Down Expand Up @@ -839,8 +835,7 @@ class SlideshowComponent extends SliderComponent {
this.play();
} else if (
!this.reducedMotion.matches &&
!this.announcementBarArrowButtonWasClicked &&
this.desktopLayout.matches
!this.announcementBarArrowButtonWasClicked
) {
this.play();
}
Expand Down
2 changes: 1 addition & 1 deletion locales/cs.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Automaticky střídat na ploše"
"label": "Automaticky střídat oznámení"
},
"change_slides_speed": {
"label": "Změnit co"
Expand Down
2 changes: 1 addition & 1 deletion locales/da.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Automatisk rotation på computer"
"label": "Roter meddelelser automatisk"
},
"change_slides_speed": {
"label": "Skift hver"
Expand Down
2 changes: 1 addition & 1 deletion locales/de.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Autorotieren auf Desktop-Gerät"
"label": "Autorotieren der Ankündigungen"
},
"change_slides_speed": {
"label": "Ändern alle"
Expand Down
2 changes: 1 addition & 1 deletion locales/en.default.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -448,7 +448,7 @@
"name": "Announcement bar",
"settings": {
"auto_rotate": {
"label": "Auto-rotate on desktop"
"label": "Auto-rotate announcements"
kjellr marked this conversation as resolved.
Show resolved Hide resolved
},
"change_slides_speed": {
"label": "Change every"
Expand Down
2 changes: 1 addition & 1 deletion locales/es.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Girar automáticamente en el escritorio"
"label": "Rotar anuncios automáticamente"
},
"change_slides_speed": {
"label": "Cambiar cada"
Expand Down
2 changes: 1 addition & 1 deletion locales/fi.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Käännä automaattisesti työpöydällä"
"label": "Kierrä ilmoituksia automaattisesti"
},
"change_slides_speed": {
"label": "Vaihda joka"
Expand Down
2 changes: 1 addition & 1 deletion locales/fr.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Rotation automatique sur le bureau"
"label": "Rotation automatique des annonces"
},
"change_slides_speed": {
"label": "Changer toutes les"
Expand Down
2 changes: 1 addition & 1 deletion locales/it.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Ruota automaticamente su desktop"
"label": "Ruota annunci automaticamente"
},
"change_slides_speed": {
"label": "Cambio"
Expand Down
2 changes: 1 addition & 1 deletion locales/ja.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "デスクトップ上の自動切り替え"
"label": "自動切り替えのお知らせ"
},
"change_slides_speed": {
"label": "変更する間隔"
Expand Down
2 changes: 1 addition & 1 deletion locales/ko.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "데스크톱에서 자동 회전"
"label": "공지 사항 자동 회전"
},
"change_slides_speed": {
"label": "변경 간격"
Expand Down
2 changes: 1 addition & 1 deletion locales/nb.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Roter automatisk på stasjonære datamaskiner"
"label": "Roter kunngjøringer automatisk"
},
"change_slides_speed": {
"label": "Endre hver"
Expand Down
2 changes: 1 addition & 1 deletion locales/nl.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Automatisch draaien op desktop"
"label": "Aankondigingen automatisch draaien"
},
"change_slides_speed": {
"label": "Wijzig elke"
Expand Down
2 changes: 1 addition & 1 deletion locales/pl.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Automatyczna zmiana na pulpicie"
"label": "Automatyczna zmiana ogłoszeń"
},
"change_slides_speed": {
"label": "Zmieniaj co"
Expand Down
2 changes: 1 addition & 1 deletion locales/pt-BR.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Girar automaticamente no desktop"
"label": "Girar automaticamente os comunicados"
},
"change_slides_speed": {
"label": "Mudar a cada"
Expand Down
2 changes: 1 addition & 1 deletion locales/pt-PT.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Rotação automática no computador"
"label": "Rotação automática de comunicados"
},
"change_slides_speed": {
"label": "Mudar a cada"
Expand Down
2 changes: 1 addition & 1 deletion locales/sv.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Rotera automatiskt på skrivbordet"
"label": "Rotera meddelanden automatiskt"
},
"change_slides_speed": {
"label": "Byt varje"
Expand Down
2 changes: 1 addition & 1 deletion locales/th.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "เปลี่ยนอัตโนมัติบนเดสก์ท็อป"
"label": "เปลี่ยนประกาศอัตโนมัติ"
},
"change_slides_speed": {
"label": "เปลี่ยนทุก"
Expand Down
2 changes: 1 addition & 1 deletion locales/tr.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Masaüstünde otomatik olarak döndür"
"label": "Duyuruları otomatik olarak döndür"
},
"change_slides_speed": {
"label": "Şu zaman aralığında değiştir:"
Expand Down
2 changes: 1 addition & 1 deletion locales/vi.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "Tự động xoay trên màn hình nền"
"label": "Tự động xoay vòng thông báo"
},
"change_slides_speed": {
"label": "Thay đổi sau mỗi"
Expand Down
2 changes: 1 addition & 1 deletion locales/zh-CN.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "在桌面上自动轮换"
"label": "自动循环展示公告"
},
"change_slides_speed": {
"label": "更换时间间隔"
Expand Down
2 changes: 1 addition & 1 deletion locales/zh-TW.schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
},
"settings": {
"auto_rotate": {
"label": "在桌上型裝置自動旋轉"
"label": "自動輪播公告"
},
"change_slides_speed": {
"label": "變更頻率"
Expand Down
3 changes: 3 additions & 0 deletions sections/announcement-bar.liquid
Original file line number Diff line number Diff line change
Expand Up @@ -120,6 +120,9 @@
</button>
</div>
</slideshow-component>
{%- if request.design_mode -%}
<script src="{{ 'theme-editor.js' | asset_url }}" defer="defer"></script>
{%- endif -%}
{%- endif -%}
<div class="localization-wrapper">
{%- if section.settings.enable_country_selector and localization.available_countries.size > 1 -%}
Expand Down Expand Up @@ -205,7 +208,7 @@
</div>
</div>

{% schema %}

Check notice on line 211 in sections/announcement-bar.liquid

View workflow job for this annotation

GitHub Actions / Theme Check Report

sections/announcement-bar.liquid#L211

[SchemaJsonFormat] JSON formatting could be improved
{
"name": "t:sections.announcement-bar.name",
"max_blocks": 12,
Expand Down
Loading