Skip to content

Commit 46c9b54

Browse files
authored
Merge pull request #4641 from Countly/SER-740
[SER-740] [guides] more improvements
2 parents 14724b4 + 95a2369 commit 46c9b54

File tree

6 files changed

+58
-49
lines changed

6 files changed

+58
-49
lines changed

plugins/guides/frontend/public/javascripts/countly.models.js

+6
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,12 @@
3737
return _entries;
3838
};
3939

40+
countlyGuides.getEntry = function(sectionID) {
41+
return _entries.find(function(entry) {
42+
return entry.sectionID === sectionID;
43+
});
44+
};
45+
4046
countlyGuides.getWalkthroughs = function(sectionID) {
4147
let entries = _entries;
4248
if (sectionID) {

plugins/guides/frontend/public/javascripts/countly.views.js

+31-15
Original file line numberDiff line numberDiff line change
@@ -69,8 +69,8 @@
6969
var OverviewComponent = countlyVue.views.create({
7070
template: CV.T('/guides/templates/overview-component.html'),
7171
props: {
72-
title: {type: String, required: true},
73-
description: {type: String, required: true},
72+
title: {type: String, required: false},
73+
description: {type: String, required: false},
7474
link: {type: String, required: false},
7575
items: {type: Array, required: false},
7676
type: {type: String, required: true, default: 'walkthroughs'},
@@ -80,14 +80,31 @@
8080
'walkthrough-component': WalkthroughComponent,
8181
'article-component': ArticleComponent
8282
},
83+
data: function() {
84+
return {
85+
guideConfig: {}
86+
};
87+
},
8388
computed: {
89+
titleContent: function() {
90+
return this.title || (this.type === 'walkthroughs' ? this.guideConfig.walkthroughTitle : this.guideConfig.articleTitle);
91+
},
92+
descriptionContent: function() {
93+
return this.description || (this.type === 'walkthroughs' ? this.guideConfig.walkthroughDescription : this.guideConfig.articleDescription);
94+
},
8495
customClass: function() {
8596
return this.max <= 2 ? 'bu-is-half' : 'bu-is-full';
8697
},
8798
wrapperStyle: function() {
8899
return this.max > 0 ? `max-width:${100 / this.max}%;` : `max-width:50%;`;
89100
}
90-
}
101+
},
102+
created: function() {
103+
var self = this;
104+
countlyCMS.fetchEntry("server-guide-config").then(function(config) {
105+
self.guideConfig = (config && config.data && config.data[0] && config.data[0]) || {};
106+
});
107+
},
91108
});
92109

93110
// GLOBAL COMPONENTS
@@ -163,11 +180,10 @@
163180
while (sections.length > 0 && !self.isButtonVisible) {
164181
let sectionID = '/' + sections.join('/');
165182
countlyGuides.fetchEntries({ sectionID }).then(function() {
166-
let walkthroughs = countlyGuides.getWalkthroughs(sectionID);
167-
let articles = countlyGuides.getArticles(sectionID);
168-
if (walkthroughs.length > 0 || articles.length > 0) {
183+
let entry = countlyGuides.getEntry(sectionID);
184+
if (entry.walkthroughs.length > 0 || entry.articles.length > 0) {
169185
self.isButtonVisible = true;
170-
self.guideData = countlyGuides.getEntries()[0];
186+
self.guideData = entry;
171187
countlyCMS.fetchEntry("server-guide-config").then(function(config) {
172188
self.guideConfig = (config && config.data && config.data[0] && config.data[0]) || {};
173189
});
@@ -387,20 +403,20 @@
387403
},
388404
data: function() {
389405
return {
390-
onboardingWalkthroughs: [],
391-
newWalkthroughs: [],
392-
suggestionsWalkthroughs: [],
393-
promotedArticles: []
406+
onboardingEntry: {},
407+
newEntry: {},
408+
suggestionsEntry: {},
409+
promotedEntry: {},
394410
};
395411
},
396412
created: function() {
397413
var self = this;
398414
countlyGuides.fetchEntries({ sectionID: { $in: ["/overview/getting-started", "/overview/whats-new", "/overview/suggestions", "/overview/promoted"] } })
399415
.then(function() {
400-
self.onboardingWalkthroughs = countlyGuides.getWalkthroughs('/overview/getting-started').slice(0, 2);
401-
self.newWalkthroughs = countlyGuides.getWalkthroughs('/overview/whats-new').slice(0, 2);
402-
self.suggestionsWalkthroughs = countlyGuides.getWalkthroughs('/overview/suggestions').slice(0, 4);
403-
self.promotedArticles = countlyGuides.getArticles('/overview/promoted').slice(0, 3);
416+
self.onboardingEntry = countlyGuides.getEntry('/overview/getting-started');
417+
self.newEntry = countlyGuides.getEntry('/overview/whats-new');
418+
self.suggestionsEntry = countlyGuides.getEntry('/overview/suggestions');
419+
self.promotedEntry = countlyGuides.getEntry('/overview/promoted');
404420
})
405421
.catch(function() {
406422
// console.log(error);

plugins/guides/frontend/public/localization/guides.properties

-9
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,6 @@ guides.feedback = Do you have any <span class="feedback__link">feedback</span>?
2121
guides.read-more = Read more
2222
guides.see-all = See all
2323

24-
guides.get-started = Get started
25-
guides.get-started.desc = Run through out onboarding setup to get started
26-
guides.suggestions = Suggestions for you
27-
guides.suggestions.desc = First time here or just need a quick overview? Run through our onboarding setup to get started
28-
guides.promoted = Promoted Articles
29-
guides.promoted.desc = First time here or just need a quick overview? Run through our onboarding setup to get started
30-
guides.new = What's new?
31-
guides.new.desc = Run through our onboarding setup to get started
32-
3324
guides.search.in-guides = Search in Guides
3425
guides.search.in-countly-guides = Search in Countly Guides
3526
guides.search.results-count = {0} results for "{1}"

plugins/guides/frontend/public/templates/dialog.html

+6-6
Original file line numberDiff line numberDiff line change
@@ -31,12 +31,12 @@ <h2>{{ guideData.sectionTitle || "" }}</h2>
3131
</template>
3232
<div class="content">
3333
<vue-scroll :ops="scrollDialogContent">
34-
<div v-if="guideData.description" class="description">
35-
{{ guideData.description }}
34+
<div v-if="guideData.sectionDescription" class="description">
35+
{{ guideData.sectionDescription }}
3636
</div>
3737
<div v-if="guideData.walkthroughs && guideData.walkthroughs.length > 0" class="bu-is-flex bu-is-flex-direction-column bu-is-align-items-start" style="margin-bottom: 25px;">
38-
<div class="title">{{ guideConfig.walkthroughTitle }}</div>
39-
<div class="description">{{ guideConfig.walkthroughDescription }}</div>
38+
<div class="title">{{ guideData.walkthroughTitle || guideConfig.walkthroughTitle }}</div>
39+
<div class="description">{{ guideData.walkthroughDescription || guideConfig.walkthroughDescription }}</div>
4040
<div style="width:100%;">
4141
<vue-scroll ref="walkthroughSlider" :ops="scrollWalkthroughs" style="width:100%;">
4242
<div class="bu-is-flex">
@@ -53,8 +53,8 @@ <h2>{{ guideData.sectionTitle || "" }}</h2>
5353
</div>
5454
</div>
5555
<div v-if="guideData.articles && guideData.articles.length > 0" class="bu-is-flex bu-is-flex-direction-column bu-is-align-items-start">
56-
<div class="title">{{ guideConfig.articleTitle }}</div>
57-
<div class="description">{{ guideConfig.articleDescription }}</div>
56+
<div class="title">{{ guideData.articleTitle || guideConfig.articleTitle }}</div>
57+
<div class="description">{{ guideData.articleDescription || guideConfig.articleDescription }}</div>
5858
<div class="bu-is-flex bu-is-flex-wrap-wrap" style="width: 100%;">
5959
<article-component
6060
v-for="(article, index) in guideData.articles"

plugins/guides/frontend/public/templates/overview-component.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
<div class="bu-column" :class="customClass">
1+
<div class="bu-column" :class="customClass" v-if="items.length > 0">
22
<div class="overview">
33
<div class="bu-level">
44
<div class="bu-level-left">
55
<div class="bu-level-item bu-is-flex bu-is-flex-direction-column bu-is-align-items-start">
6-
<div class="title">{{ title }}</div>
7-
<div class="description">{{ description }}</div>
6+
<div class="title">{{ titleContent }}</div>
7+
<div class="description">{{ descriptionContent }}</div>
88
</div>
99
</div>
1010
<div class="bu-level-right" v-if="link">
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,32 @@
11
<div class="bu-columns bu-is-multiline bu-is-gapless">
22
<overview-component
3-
v-if="onboardingWalkthroughs && onboardingWalkthroughs.length > 0"
4-
:title="i18n('guides.get-started')"
5-
:description="i18n('guides.get-started.desc')"
3+
:title="onboardingEntry.walkthroughTitle"
4+
:description="onboardingEntry.walkthroughDescription"
65
link="#/guides/walkthroughs/onboarding"
76
type="walkthrough"
8-
:items="onboardingWalkthroughs"
7+
:items="onboardingEntry.walkthroughs.slice(0, 2)"
98
></overview-component>
109
<overview-component
11-
v-if="newWalkthroughs && newWalkthroughs.length > 0"
12-
:title="i18n('guides.new')"
13-
:description="i18n('guides.new.desc')"
10+
:title="newEntry.walkthroughTitle"
11+
:description="newEntry.walkthroughDescription"
1412
link="#/guides/walkthroughs/new"
1513
type="walkthrough"
16-
:items="newWalkthroughs"
14+
:items="newEntry.walkthroughs.slice(0, 2)"
1715
></overview-component>
1816
<overview-component
19-
v-if="suggestionsWalkthroughs && suggestionsWalkthroughs.length > 0"
20-
:title="i18n('guides.suggestions')"
21-
:description="i18n('guides.suggestions.desc')"
17+
:title="suggestionsEntry.walkthroughTitle"
18+
:description="suggestionsEntry.walkthroughDescription"
2219
link="#/guides/walkthroughs/suggestions"
2320
type="walkthrough"
24-
:items="suggestionsWalkthroughs"
21+
:items="suggestionsEntry.walkthroughs.slice(0, 4)"
2522
:max="4"
2623
></overview-component>
2724
<overview-component
28-
v-if="promotedArticles && promotedArticles.length > 0"
29-
:title="i18n('guides.promoted')"
30-
:description="i18n('guides.promoted.desc')"
25+
:title="promotedEntry.articleTitle"
26+
:description="promotedEntry.articleDescription"
3127
link="#/guides/articles/promoted"
3228
type="article"
33-
:items="promotedArticles"
29+
:items="promotedEntry.articles.slice(0, 3)"
3430
:max="3"
3531
></overview-component>
3632
</div>

0 commit comments

Comments
 (0)