Skip to content

Commit 080b9e2

Browse files
l-olson1214l-olson1214
authored
Merge pull request #5526 from wikimedia/yir-highlights-fixes
[YIR] Highlights slide design review tweaks
2 parents f604996 + c8d7916 commit 080b9e2

File tree

20 files changed

+160
-96
lines changed

20 files changed

+160
-96
lines changed

‎WMFComponents/Sources/WMFComponents/Components/Shared/Buttons/WMFLargeButton.swift‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,17 @@ struct WMFLargeButton: View {
1212

1313
let configuration: Configuration
1414
let title: String
15+
let forceBackgroundColor: UIColor?
1516
let action: (() -> Void)?
1617

18+
init(appEnvironment: WMFAppEnvironment = WMFAppEnvironment.current, configuration: Configuration, title: String, forceBackgroundColor: UIColor? = nil, action: (() -> Void)?) {
19+
self.appEnvironment = appEnvironment
20+
self.configuration = configuration
21+
self.title = title
22+
self.forceBackgroundColor = forceBackgroundColor
23+
self.action = action
24+
}
25+
1726
private var foregroundColor: UIColor {
1827
switch configuration {
1928
case .primary:
@@ -24,6 +33,11 @@ struct WMFLargeButton: View {
2433
}
2534

2635
private var backgroundColor: UIColor {
36+
37+
if let forceBackgroundColor {
38+
return forceBackgroundColor
39+
}
40+
2741
switch configuration {
2842
case .primary:
2943
return appEnvironment.theme.link

‎WMFComponents/Sources/WMFComponents/Components/Year in Review/View Models/WMFYearInReviewViewModel.swift‎

Lines changed: 49 additions & 42 deletions
Large diffs are not rendered by default.

‎WMFComponents/Sources/WMFComponents/Components/Year in Review/Views/Slide Views/WMFYearInReviewSlideHighlightsView.swift‎

Lines changed: 84 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -4,60 +4,100 @@ public struct WMFYearInReviewSlideHighlightsView: View {
44
@ObservedObject var appEnvironment = WMFAppEnvironment.current
55
var theme: WMFTheme { appEnvironment.theme }
66
var viewModel: WMFYearInReviewSlideHighlightsViewModel
7+
8+
var titleAttributedString: AttributedString {
9+
let html = "<b>" + viewModel.localizedStrings.title + "</b>" + " " + viewModel.localizedStrings.subtitle
10+
let fallback = viewModel.localizedStrings.title + " " + viewModel.localizedStrings.subtitle
11+
12+
var maxTraitCollection: UITraitCollection
13+
14+
// Only allow growing for iPad
15+
let hSizeClass = UITraitCollection.current.horizontalSizeClass
16+
let vSizeClass = UITraitCollection.current.verticalSizeClass
17+
18+
if hSizeClass == .compact {
19+
maxTraitCollection = UITraitCollection(preferredContentSizeCategory: .large)
20+
} else if vSizeClass == .compact {
21+
maxTraitCollection = UITraitCollection(preferredContentSizeCategory: .large)
22+
} else {
23+
maxTraitCollection = WMFAppEnvironment.current.traitCollection
24+
}
25+
26+
let regularFont = WMFFont.for(.headline, compatibleWith: maxTraitCollection)
27+
let boldFont = WMFFont.for(.boldHeadline, compatibleWith: maxTraitCollection)
28+
29+
let styles = HtmlUtils.Styles(font: regularFont, boldFont: boldFont, italicsFont: regularFont, boldItalicsFont: regularFont, color: .white, linkColor: theme.link, lineSpacing: 1)
30+
31+
return(try? HtmlUtils.attributedStringFromHtml(html, styles: styles)) ?? AttributedString(fallback)
32+
}
33+
34+
var scrollViewContents: some View {
35+
WMFYearInReviewInfoboxView(
36+
viewModel: viewModel.infoBoxViewModel,
37+
isSharing: false
38+
)
39+
.overlay(
40+
Rectangle().stroke(Color(WMFColor.gray300), lineWidth: 1)
41+
)
42+
}
43+
44+
func dynamicMaxInfoboxHeight(availableHeight: CGFloat) -> CGFloat {
45+
if availableHeight < 530 {
46+
47+
// SE size
48+
let preferredContentSize = UITraitCollection.current.preferredContentSizeCategory
49+
50+
if preferredContentSize.isAccessibilityCategory {
51+
return 200
52+
}
53+
54+
return 300
55+
}
56+
return 414
57+
}
58+
59+
@State var availableHeight: CGFloat?
760

861
public var body: some View {
9-
ZStack {
10-
GradientBackgroundView()
11-
12-
GeometryReader { proxy in
13-
ScrollView(.vertical, showsIndicators: true) {
14-
VStack(spacing: 0) {
15-
Spacer(minLength: 0)
62+
GeometryReader { geometry in
63+
64+
ZStack {
65+
GradientBackgroundView()
66+
67+
VStack(spacing: 0) {
68+
Spacer(minLength: 0)
1669

17-
VStack(spacing: 24) {
18-
Text(viewModel.localizedStrings.title)
19-
.font(Font(WMFFont.for(.boldTitle1)))
20-
.foregroundColor(.white)
70+
VStack(spacing: 32) {
71+
VStack(spacing: 16) {
72+
Text(titleAttributedString)
2173
.multilineTextAlignment(.center)
74+
.lineLimit(nil) // allows unlimited lines
75+
.fixedSize(horizontal: false, vertical: true)
2276

23-
Text(viewModel.localizedStrings.subtitle)
24-
.font(Font(WMFFont.for(.headline)))
25-
.foregroundColor(.white)
26-
.multilineTextAlignment(.center)
27-
28-
WMFYearInReviewInfoboxView(
29-
viewModel: viewModel.infoBoxViewModel,
30-
isSharing: false
31-
)
32-
.overlay(
33-
Rectangle().stroke(Color(WMFColor.gray300), lineWidth: 1)
34-
)
35-
.frame(maxWidth: 350)
36-
.frame(maxWidth: .infinity)
37-
77+
WMFYearInReviewScrollView(scrollViewContents: scrollViewContents, needsClearBackground: true)
78+
.frame(minHeight: 0, maxHeight: dynamicMaxInfoboxHeight(availableHeight: geometry.size.height), alignment: .top)
79+
.fixedSize(horizontal: false, vertical: true)
3880
}
39-
.frame(maxWidth: .infinity)
40-
.padding(.horizontal, 32)
41-
.padding(.vertical, 24)
42-
43-
Spacer(minLength: 0)
81+
.frame(maxWidth: 324)
82+
.padding([.leading, .trailing], 35)
83+
84+
WMFLargeButton(configuration: .primary,
85+
title: viewModel.localizedStrings.buttonTitle,
86+
forceBackgroundColor: WMFColor.blue600) {
87+
withAnimation(.easeInOut(duration: 0.75)) {
88+
viewModel.tappedShare()
89+
}
90+
}
91+
.frame(maxWidth: 345)
92+
.padding([.leading, .trailing], 24)
93+
4494
}
45-
.frame(minHeight: proxy.size.height)
46-
.frame(maxWidth: .infinity)
47-
}
48-
}
49-
}
50-
.safeAreaInset(edge: .bottom) {
51-
WMFLargeButton(configuration: .primary,
52-
title: viewModel.localizedStrings.buttonTitle) {
53-
withAnimation(.easeInOut(duration: 0.75)) {
54-
viewModel.tappedShare()
95+
96+
Spacer(minLength: 0)
5597
}
5698
}
57-
.padding(.horizontal, 32)
58-
.padding(.bottom, 16)
59-
.padding(.top, 32)
6099
}
100+
61101
}
62102
}
63103

‎WMFComponents/Sources/WMFComponents/Components/Year in Review/Views/WMFYearInReviewScrollView.swift‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,14 @@ struct WMFYearInReviewScrollView: View {
99
@State private var flashScrollIndicators: Bool = false
1010

1111
private let scrollViewContents: AnyView
12+
private let needsClearBackground: Bool
1213

1314
init<ScrollViewContent: View>(
14-
scrollViewContents: ScrollViewContent
15+
scrollViewContents: ScrollViewContent,
16+
needsClearBackground: Bool = false
1517
) {
1618
self.scrollViewContents = AnyView(scrollViewContents)
19+
self.needsClearBackground = needsClearBackground
1720
}
1821

1922
// MARK: - Lifecycle
@@ -47,7 +50,7 @@ struct WMFYearInReviewScrollView: View {
4750
var body: some View {
4851
content
4952
.background {
50-
Color(appEnvironment.theme.midBackground).ignoresSafeArea()
53+
Color(needsClearBackground ? .clear : appEnvironment.theme.midBackground).ignoresSafeArea()
5154
}
5255
.onAppear {
5356
DispatchQueue.main.asyncAfter(deadline: .now() + 1.0) {

‎Wikipedia/Code/YearInReviewCoordinator.swift‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -160,13 +160,13 @@ final class YearInReviewCoordinator: NSObject, Coordinator {
160160
contributorSubtitle: contributorSlideSubtitle(isEditor:isDonator:),
161161
contributorGiftTitle: WMFLocalizedString("year-in-review-contributor-gift-title", value: "Activate new app icon", comment: "Year in review title for the new icon"),
162162
contributorGiftSubtitle: WMFLocalizedString("year-in-review-contributor-gift-subtitle", value: "If you don’t turn it on now, you can access it later in Settings under Theme.", comment: "Year in review subtitle for the new icon"),
163-
highlightsSlideTitle: WMFLocalizedString("year-in-review-highlights-title", value: "Thank you for spending your year with Wikipedia", comment: "Title for year in review highlights slide"),
163+
highlightsSlideTitle: WMFLocalizedString("year-in-review-highlights-title", value: "Thank you for spending your year with Wikipedia.", comment: "Title for year in review highlights slide"),
164164
highlightsSlideSubtitle: WMFLocalizedString("year-in-review-highlights-subtitle", value: "We look forward to next year!", comment: "Subtitle for year in review highlights slide"),
165165
highlightsSlideButtonTitle: WMFLocalizedString("year-in-review-highlights-button-title", value: "Share highlights", comment: "Title for the share button on Year in Review Highlights slide"),
166-
longestReadArticlesTitle: WMFLocalizedString("year-in-review-highlights-personalized-articles", value: "Articles I read the longest", comment: "Title for the list of articles read the longest in the year in review slide"),
166+
mostReadArticlesTitle: WMFLocalizedString("year-in-review-highlights-personalized-articles", value: "Articles I read the most", comment: "Title for the list of articles read the most in the year in review slide"),
167167
minutesReadTitle: WMFLocalizedString("year-in-review-highlights-reading-time", value: "Minutes read", comment: "Title for the minutes read in the Year in review highlights slide"),
168168
favoriteReadingDayTitle: WMFLocalizedString("year-in-review-highlights-favorite-day", value: "Favorite day to read", comment: "Title for the favorite day to read in the Year in review highlights slide"),
169-
savedArticlesTitle: WMFLocalizedString("year-in-review-highlights-articles-saved", value: "Articles saved", comment: "Title for the articles saved by an user in the Year in review highlights slide"),
169+
articlesReadTitle: WMFLocalizedString("year-in-review-highlights-articles-read", value: "Articles read", comment: "Title for the articles read by a user in the Year in review highlights slide"),
170170
favoriteCategoriesTitle: WMFLocalizedString("year-in-review-highlights-categories", value: "Categories that interested me", comment: "Title for the top categories for an user in the Year in review highlights slide"),
171171
editedArticlesTitle: WMFLocalizedString("year-in-review-highlights-times-edited", value: "Times edited", comment: "Title for the number of articles edited by an user in the Year in review highlights slide"),
172172
enWikiTopArticlesTitle: WMFLocalizedString("year-in-review-highlights-english-articles", value: "Most read articles on English Wikipedia", comment: "Title for the list of most popular articles on English Wikipedia in the Year in review slide"),

‎Wikipedia/Localizations/en.lproj/Localizable.strings‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1508,7 +1508,7 @@
15081508
"year-in-review-feature-explore-body-v3" = "See insights about which articles you read on the Wikipedia app and the edits you made.";
15091509
"year-in-review-feature-explore-footer-v3" = "Your reading history is kept protected. Reading insights are calculated using locally stored data on your device.";
15101510
"year-in-review-finish" = "Finish";
1511-
"year-in-review-highlights-articles-saved" = "Articles saved";
1511+
"year-in-review-highlights-articles-read" = "Articles read";
15121512
"year-in-review-highlights-articles-viewed" = "Number of viewed articles";
15131513
"year-in-review-highlights-button-title" = "Share highlights";
15141514
"year-in-review-highlights-categories" = "Categories that interested me";
@@ -1520,12 +1520,12 @@
15201520
"year-in-review-highlights-english-articles" = "Most read articles on English Wikipedia";
15211521
"year-in-review-highlights-favorite-day" = "Favorite day to read";
15221522
"year-in-review-highlights-number-app-editors" = "Edits on-app";
1523-
"year-in-review-highlights-personalized-articles" = "Articles I read the longest";
1523+
"year-in-review-highlights-personalized-articles" = "Articles I read the most";
15241524
"year-in-review-highlights-reading-time" = "Minutes read";
15251525
"year-in-review-highlights-share-logo-caption" = "Wikipedia logo";
15261526
"year-in-review-highlights-subtitle" = "We look forward to next year!";
15271527
"year-in-review-highlights-times-edited" = "Times edited";
1528-
"year-in-review-highlights-title" = "Thank you for spending your year with Wikipedia";
1528+
"year-in-review-highlights-title" = "Thank you for spending your year with Wikipedia.";
15291529
"year-in-review-intro-exit-toast-title" = "You can access your Year in Review later in Profile.";
15301530
"year-in-review-intro-login-title" = "Log in for personalization";
15311531
"year-in-review-most-read-categories-title" = "Your most interesting categories";

‎Wikipedia/Localizations/qqq.lproj/Localizable.strings‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1508,7 +1508,7 @@
15081508
"year-in-review-feature-explore-body-v3" = "Body for year in review feature announcement - version 3";
15091509
"year-in-review-feature-explore-footer-v3" = "Footer text in the year in review intro view.";
15101510
"year-in-review-finish" = "Year in review finish button. Displayed on last slide and dismisses feature view.";
1511-
"year-in-review-highlights-articles-saved" = "Title for the articles saved by an user in the Year in review highlights slide";
1511+
"year-in-review-highlights-articles-read" = "Title for the articles read by a user in the Year in review highlights slide";
15121512
"year-in-review-highlights-articles-viewed" = "Title for the number of viewed articles in Wikipedia in the Year in review highlights slide";
15131513
"year-in-review-highlights-button-title" = "Title for the share button on Year in Review Highlights slide";
15141514
"year-in-review-highlights-categories" = "Title for the top categories for an user in the Year in review highlights slide";
@@ -1520,7 +1520,7 @@
15201520
"year-in-review-highlights-english-articles" = "Title for the list of most popular articles on English Wikipedia in the Year in review slide";
15211521
"year-in-review-highlights-favorite-day" = "Title for the favorite day to read in the Year in review highlights slide";
15221522
"year-in-review-highlights-number-app-editors" = "Title for the number of edits using the Wikipedia app in the Year in review highlights slide";
1523-
"year-in-review-highlights-personalized-articles" = "Title for the list of articles read the longest in the year in review slide";
1523+
"year-in-review-highlights-personalized-articles" = "Title for the list of articles read the most in the year in review slide";
15241524
"year-in-review-highlights-reading-time" = "Title for the minutes read in the Year in review highlights slide";
15251525
"year-in-review-highlights-share-logo-caption" = "Caption for Wikipedia logo on sharable version of the highlights year in review slide";
15261526
"year-in-review-highlights-subtitle" = "Subtitle for year in review highlights slide";

‎Wikipedia/iOS Native Localizations/ar.lproj/Localizable.strings‎

-292 Bytes
Binary file not shown.

‎Wikipedia/iOS Native Localizations/az.lproj/Localizable.strings‎

-174 Bytes
Binary file not shown.

‎Wikipedia/iOS Native Localizations/en.lproj/Localizable.strings‎

-18 Bytes
Binary file not shown.

0 commit comments

Comments
 (0)