Skip to content

Commit 418d5f3

Browse files
authored
Merge pull request #2207 from tf/hide-chapter
Allow hiding chapters in navigation
2 parents 30b7296 + f7c2ec9 commit 418d5f3

File tree

12 files changed

+196
-12
lines changed

12 files changed

+196
-12
lines changed

entry_types/scrolled/config/locales/de.yml

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -560,10 +560,8 @@ de:
560560
edit_chapter:
561561
attributes:
562562
summary:
563-
inline_help: Zusammenfassung des Kapitels für die Darstellung in der Navigationsleiste. Nur Kapitel die sowohl Titel als auch Zusammenfassung gesetzt haben werden als Menüpunkt zur Navigation hinzugefügt.
564563
label: Zusammenfassung
565564
title:
566-
inline_help: Wird in der Editor-Übersicht und der Navigationsleiste des Beitrags angezeigt. Nur Kapitel die sowohl Titel als auch Zusammenfassung gesetzt haben werden als Menüpunkt zur Navigation hinzugefügt.
567565
label: Titel
568566
confirm_destroy: |-
569567
Kapitel einschließlich ALLER enthaltener Abschnitte wirklich löschen?

entry_types/scrolled/config/locales/en.yml

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -552,10 +552,8 @@ en:
552552
edit_chapter:
553553
attributes:
554554
summary:
555-
inline_help: Summary of the chapter for display in the navigation bar. Only chapters with both title and summary set will get added as menu items to the navigation.
556555
label: Summary
557556
title:
558-
inline_help: The chapter title will be displayed in the editor overview and the navigation bar of the entry. Only chapters with both title and summary set will get added as menu items to the navigation.
559557
label: Title
560558
confirm_destroy: |-
561559
Really delete this chapter including ALL its sections?
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
de:
2+
pageflow_scrolled:
3+
editor:
4+
chapter_item:
5+
chapter: Kapitel
6+
unnamed: Unbenannt
7+
hidden_in_navigation: In der Navigationsleiste ausgeblendet
8+
edit_chapter:
9+
attributes:
10+
hideInNavigation:
11+
label: In der Navigationsleiste ausblenden
12+
inline_help: |-
13+
Kapitel kann als Link-Ziel verwendet werden, erscheint
14+
allerdings nicht in der Navigationsleiste.
15+
summary:
16+
inline_help: Zusammenfassung des Kapitels für die Darstellung in der Navigationsleiste.
17+
title:
18+
inline_help: |-
19+
Der Titel des Kapitels erscheint in der
20+
Navigationsleiste. Er wird außerdem verwendet, um den
21+
Teil der Webadresse zu erstellen, der es ermöglicht,
22+
direkt zu diesem Kapitel zu springen.<br><br>
23+
24+
Zum Beispiel: Wenn dein Kapitel 'Unsere Mission' heißt,
25+
kann man über eine Webadresse der Form
26+
<code>yourwebsite.com/story#unsere-mission</code> direkt
27+
zu diesem Kapitel springen.
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
en:
2+
pageflow_scrolled:
3+
editor:
4+
chapter_item:
5+
chapter: Chapter
6+
unnamed: Untitled
7+
hidden_in_navigation: Hidden in navigation bar
8+
edit_chapter:
9+
attributes:
10+
hideInNavigation:
11+
label: Hide in navigation bar
12+
inline_help: |-
13+
Chapter can be used as link destination but does not
14+
appear in the navigation bar.
15+
summary:
16+
inline_help: Summary of the chapter for display in the navigation bar.
17+
title:
18+
inline_help_html: |-
19+
The title of the chapter appears in the navigation
20+
bar. It is also used to create the part of the web
21+
address that helps link directly to that chapter.<br><br>
22+
23+
For example, if your chapter is titled 'Our Mission,'
24+
the system will create a web address like
25+
<code>yourwebsite.com/story#our-mission</code>, so
26+
people can jump straight to that chapter
Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
import {ChapterItemView} from 'editor/views/ChapterItemView';
2+
3+
import {useEditorGlobals, useFakeXhr, useReactBasedBackboneViews} from 'support';
4+
import {screen} from '@testing-library/dom';
5+
import {useFakeTranslations} from 'pageflow/testHelpers';
6+
import '@testing-library/jest-dom/extend-expect';
7+
8+
describe('ChapterItemView', () => {
9+
useFakeXhr();
10+
11+
useFakeTranslations({
12+
'pageflow_scrolled.editor.chapter_item.chapter': 'Chapter',
13+
'pageflow_scrolled.editor.chapter_item.drag_hint': 'Drag',
14+
'pageflow_scrolled.editor.chapter_item.save_error': 'Error',
15+
'pageflow_scrolled.editor.chapter_item.hidden_in_navigation': 'Hidden in navigation',
16+
});
17+
18+
const {createEntry} = useEditorGlobals();
19+
const {render} = useReactBasedBackboneViews();
20+
21+
it('renders chapter link', async () => {
22+
const entry = createEntry({
23+
chapters: [
24+
{
25+
id: 1,
26+
permaId: 100,
27+
position: 0,
28+
configuration: {
29+
title: 'Some title'
30+
}
31+
}
32+
]
33+
});
34+
const chapter = entry.chapters.get(1)
35+
const view = new ChapterItemView({
36+
entry,
37+
model: chapter
38+
});
39+
40+
render(view);
41+
42+
expect(screen.getByRole('link', {name: /Chapter 1 Some title/})).toBeInTheDocument();
43+
});
44+
45+
it('marks chapter as hidden in navigation', async () => {
46+
const entry = createEntry({
47+
chapters: [
48+
{
49+
id: 1,
50+
permaId: 100,
51+
position: 0,
52+
configuration: {
53+
title: 'Some title',
54+
hideInNavigation: true
55+
}
56+
}
57+
]
58+
});
59+
const chapter = entry.chapters.get(1)
60+
const view = new ChapterItemView({
61+
entry,
62+
model: chapter
63+
});
64+
65+
render(view);
66+
67+
expect(screen.getByRole('generic', {name: 'Hidden in navigation'})).toBeInTheDocument();
68+
});
69+
});

entry_types/scrolled/package/spec/entryState/structure-spec.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,8 @@ const chaptersSeed = [
3030
position: 2,
3131
configuration: {
3232
title: 'Chapter 2',
33-
summary: 'A great chapter'
33+
summary: 'A great chapter',
34+
hideInNavigation: true
3435
}
3536
}
3637
];
@@ -336,7 +337,8 @@ describe('useChapters', () => {
336337
chapterSlug: 'chapter-2',
337338
index: 1,
338339
title: 'Chapter 2',
339-
summary: 'A great chapter'
340+
summary: 'A great chapter',
341+
hideInNavigation: true
340342
}
341343
]);
342344
});

entry_types/scrolled/package/spec/widgets/defaultNavigation/Defaultnavigation-spec.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,25 @@ describe('DefaultNavigation', () => {
102102
expect(getByRole('img', {name: 'Other logo'})).toHaveAttribute('src', 'other-logo.png');
103103
});
104104

105+
it('does not render chapters that have hide in navigation flag', () => {
106+
const {queryByRole} = renderInEntry(
107+
<DefaultNavigation configuration={{}} />,
108+
{
109+
seed: {
110+
chapters: [
111+
{configuration: {title: 'First chapter'}},
112+
{configuration: {title: 'Hidden chapter', hideInNavigation: true}},
113+
{configuration: {title: 'Second chapter'}}
114+
]
115+
}
116+
}
117+
);
118+
119+
expect(queryByRole('link', {name: 'First chapter'})).not.toBeNull();
120+
expect(queryByRole('link', {name: 'Second chapter'})).not.toBeNull();
121+
expect(queryByRole('link', {name: 'Hidden chapter'})).toBeNull();
122+
});
123+
105124
it('supports extra buttons component', () => {
106125
const ExtraButtons = () => <button>Extra</button>;
107126
const {queryByRole} = renderInEntry(
@@ -143,6 +162,22 @@ describe('DefaultNavigation', () => {
143162
expect(queryByRole('button', {name: 'Open mobile menu'})).not.toBeNull();
144163
});
145164

165+
it('does not render mobile menu button if all chapters are hidden', () => {
166+
const {queryByRole} = renderInEntry(
167+
<DefaultNavigation configuration={{}} />,
168+
{
169+
seed: {
170+
chapters: [
171+
{configuration: {hideInNavigation: true}},
172+
{configuration: {hideInNavigation: true}}
173+
]
174+
}
175+
}
176+
);
177+
178+
expect(queryByRole('button', {name: 'Open mobile menu'})).toBeNull();
179+
});
180+
146181
it('toggles class to show and hide mobile menu', async () => {
147182
const {getByRole} = renderInEntry(
148183
<DefaultNavigation configuration={{}} />,

entry_types/scrolled/package/src/editor/views/ChapterItemView.js

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,18 @@ export const ChapterItemView = Marionette.Layout.extend({
6767
},
6868

6969
update() {
70-
this.ui.title.text(this.model.configuration.get('title') || I18n.t('pageflow.editor.views.chapter_item_view.unnamed'));
71-
this.ui.number.text(I18n.t('pageflow.editor.views.chapter_item_view.chapter') + ' ' + (this.model.get('position') + 1));
70+
this.ui.title.text(
71+
this.model.configuration.get('title') || I18n.t('pageflow_scrolled.editor.chapter_item.unnamed')
72+
);
73+
this.ui.title.toggleClass(styles.blank, !this.model.configuration.get('title'));
74+
75+
this.ui.number.text(
76+
I18n.t('pageflow_scrolled.editor.chapter_item.chapter') + ' ' + (this.model.get('position') + 1)
77+
);
78+
79+
if (this.model.configuration.get('hideInNavigation')) {
80+
this.ui.title.attr('title', I18n.t('pageflow_scrolled.editor.chapter_item.hidden_in_navigation'));
81+
this.ui.title.addClass(styles.hiddenInNavigation);
82+
}
7283
}
7384
});

entry_types/scrolled/package/src/editor/views/ChapterItemView.module.css

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,21 @@
4242
font-weight: bold;
4343
}
4444

45-
.title {}
45+
.root:first-child:last-child .title.blank {
46+
display: none;
47+
}
48+
49+
.hiddenInNavigation {
50+
opacity: 0.7;
51+
}
52+
53+
.hiddenInNavigation::before {
54+
content: "(";
55+
}
56+
57+
.hiddenInNavigation::after {
58+
content: ")";
59+
}
4660

4761
.sections {
4862
composes: sections from './outline.module.css';

entry_types/scrolled/package/src/editor/views/EditChapterView.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import {EditConfigurationView} from 'pageflow/editor';
2-
import {TextInputView, TextAreaInputView} from 'pageflow/ui';
2+
import {CheckBoxInputView, TextInputView, TextAreaInputView} from 'pageflow/ui';
33

44
export const EditChapterView = EditConfigurationView.extend({
55
translationKeyPrefix: 'pageflow_scrolled.editor.edit_chapter',
66

77
configure: function(configurationEditor) {
88
configurationEditor.tab('chapter', function() {
99
this.input('title', TextInputView);
10+
this.input('hideInNavigation', CheckBoxInputView);
1011
this.input('summary', TextAreaInputView, {
1112
disableLinks: true
1213
});

0 commit comments

Comments
 (0)