Skip to content

Commit de3f5f8

Browse files
amjiaoamjiao
committed
Screens
1 parent 289f4e4 commit de3f5f8

4 files changed

Lines changed: 313 additions & 17 deletions

File tree

‎app/src/main/java/com/cornellappdev/score/model/Highlights.kt‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,13 @@ data class ArticleHighlightData(
1818
)
1919

2020
sealed class HighlightData {
21-
data class Video(val data: VideoHighlightData) : HighlightData()
22-
data class Article(val data: ArticleHighlightData) : HighlightData()
21+
abstract val title: String
22+
23+
data class Video(val data: VideoHighlightData) : HighlightData() {
24+
override val title = data.title
25+
}
26+
27+
data class Article(val data: ArticleHighlightData) : HighlightData() {
28+
override val title = data.title
29+
}
2330
}

‎app/src/main/java/com/cornellappdev/score/screen/HighlightsScreen.kt‎

Lines changed: 23 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
package com.cornellappdev.score.screen
22

33
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.layout.Box
45
import androidx.compose.foundation.layout.Column
56
import androidx.compose.foundation.layout.Spacer
67
import androidx.compose.foundation.layout.fillMaxSize
78
import androidx.compose.foundation.layout.height
9+
import androidx.compose.foundation.layout.padding
10+
import androidx.compose.material3.Text
811
import androidx.compose.runtime.Composable
912
import androidx.compose.ui.Modifier
1013
import androidx.compose.ui.graphics.Color
@@ -16,30 +19,42 @@ import com.cornellappdev.score.R
1619
import com.cornellappdev.score.components.EmptyStateBox
1720
import com.cornellappdev.score.components.ScorePreview
1821
import com.cornellappdev.score.components.highlights.HighlightsCardRow
19-
import com.cornellappdev.score.components.highlights.HighlightsScreenHeader
22+
import com.cornellappdev.score.components.highlights.HighlightsFilterRow
23+
import com.cornellappdev.score.components.highlights.HighlightsScreenSearchFilterBar
24+
import com.cornellappdev.score.components.highlights.HighlightsSearchBarUI
2025
import com.cornellappdev.score.model.HighlightData
2126
import com.cornellappdev.score.model.Sport
27+
import com.cornellappdev.score.theme.Style.heading1
2228
import com.cornellappdev.score.util.highlightsList
2329
import com.cornellappdev.score.util.sportList
2430

2531
/*todo: needs a UIState */
2632
@Composable
2733
fun HighlightsScreen(
28-
sportList: List<Sport>,
29-
todayHighlightsList: List<HighlightData>,
30-
pastThreeHighlightsList: List<HighlightData>
34+
sportList: List<Sport> = emptyList(),
35+
todayHighlightsList: List<HighlightData> = emptyList(),
36+
pastThreeHighlightsList: List<HighlightData> = emptyList(),
37+
toSearchScreen: () -> Unit
3138
) {
3239
Column(
3340
modifier = Modifier
3441
.fillMaxSize()
3542
.background(color = Color.White)
3643
) {
3744
Spacer(modifier = Modifier.height(24.dp))
38-
HighlightsScreenHeader(sportList)
45+
Column(
46+
modifier = Modifier.padding(start =24.dp)
47+
){
48+
Text("Highlights", style = heading1)
49+
Spacer(modifier = Modifier.height(12.dp))
50+
HighlightsSearchBarUI(toSearchScreen)
51+
}
52+
Spacer(modifier = Modifier.height(16.dp))
53+
HighlightsFilterRow(sportList, { /*handle with viewmodel*/ })
3954
Spacer(modifier = Modifier.height(24.dp))
4055
if (todayHighlightsList.isEmpty() && pastThreeHighlightsList.isEmpty()) {
4156
EmptyStateBox(
42-
icon = R.drawable.kid_star,
57+
icon = R.drawable.ic_kid_star,
4358
title = "No results yet.",
4459
)
4560
}
@@ -52,14 +67,6 @@ fun HighlightsScreen(
5267
}
5368
}
5469

55-
@Composable
56-
@Preview
57-
private fun HighlightsScreenHeaderPreview() {
58-
ScorePreview {
59-
HighlightsScreenHeader(sportList)
60-
}
61-
}
62-
6370
data class HighlightsScreenPreviewData(
6471
val sportList: List<Sport>,
6572
val todayHighlightList: List<HighlightData>,
@@ -76,14 +83,15 @@ class HighlightsScreenPreviewProvider : PreviewParameterProvider<HighlightsScree
7683

7784
@Preview(showBackground = true)
7885
@Composable
79-
private fun VideoHighlightCardPreview(
86+
private fun HighlightScreenPreview(
8087
@PreviewParameter(HighlightsScreenPreviewProvider::class) previewData: HighlightsScreenPreviewData
8188
) {
8289
ScorePreview {
8390
HighlightsScreen(
8491
sportList = previewData.sportList,
8592
todayHighlightsList = previewData.todayHighlightList,
8693
pastThreeHighlightsList = previewData.pastHighlightList,
94+
toSearchScreen = {}
8795
)
8896
}
8997
}

‎app/src/main/java/com/cornellappdev/score/screen/HighlightsSearchScreen.kt‎

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
package com.cornellappdev.score.screen
2+
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.layout.Arrangement
5+
import androidx.compose.foundation.layout.Column
6+
import androidx.compose.foundation.layout.Row
7+
import androidx.compose.foundation.layout.Spacer
8+
import androidx.compose.foundation.layout.fillMaxSize
9+
import androidx.compose.foundation.layout.height
10+
import androidx.compose.foundation.layout.padding
11+
import androidx.compose.foundation.layout.width
12+
import androidx.compose.foundation.lazy.LazyColumn
13+
import androidx.compose.foundation.lazy.items
14+
import androidx.compose.material3.Text
15+
import androidx.compose.runtime.Composable
16+
import androidx.compose.ui.Modifier
17+
import androidx.compose.ui.graphics.Color
18+
import androidx.compose.ui.tooling.preview.Preview
19+
import androidx.compose.ui.unit.dp
20+
import com.cornellappdev.score.R
21+
import com.cornellappdev.score.components.EmptyStateBox
22+
import com.cornellappdev.score.components.highlights.ArticleHighlightCard
23+
import com.cornellappdev.score.components.highlights.HighlightsScreenSearchFilterBar
24+
import com.cornellappdev.score.components.highlights.RecentSearches
25+
import com.cornellappdev.score.components.highlights.VideoHighlightCard
26+
import com.cornellappdev.score.model.HighlightData
27+
import com.cornellappdev.score.model.Sport
28+
import com.cornellappdev.score.theme.Style.bodyNormal
29+
import com.cornellappdev.score.theme.Style.heading2
30+
import com.cornellappdev.score.util.highlightsList
31+
import com.cornellappdev.score.util.sportList
32+
33+
@Composable
34+
fun HighlightsSearchScreen(
35+
sportList: List<Sport>,
36+
recentSearchList: List<String>,
37+
highlightsList: List<HighlightData>,
38+
query: String,
39+
header: String
40+
) {
41+
Column(
42+
modifier = Modifier
43+
.fillMaxSize()
44+
.background(color = Color.White)
45+
.padding(top = 24.dp)
46+
) {
47+
Row(modifier = Modifier.padding(horizontal = 24.dp)) {
48+
Text(text = header, style = heading2)
49+
}
50+
Spacer(modifier = Modifier.height(16.dp))
51+
HighlightsScreenSearchFilterBar(
52+
sportList,
53+
true
54+
) //need viewmodel to handle comms between composables
55+
Spacer(modifier = Modifier.height(24.dp))
56+
Column(
57+
modifier = Modifier.padding(horizontal = 24.dp)
58+
) {
59+
if (recentSearchList.isNotEmpty() && query.isEmpty()) { //start state: no search attempted yet
60+
RecentSearches(recentSearchList)
61+
} else if (query.isNotEmpty()) { //filtering - will pull this out to the viewmodel when i do that, just here for sanity check rn
62+
val filteredList = highlightsList.filter {
63+
it.title.contains(query, ignoreCase = true)
64+
}
65+
if (filteredList.isEmpty()) {
66+
EmptyStateBox(
67+
icon = R.drawable.ic_kid_star,
68+
title = "No results yet.",
69+
)
70+
} else {
71+
Text("${filteredList.size} Results", style = bodyNormal)
72+
LazyColumn(
73+
verticalArrangement = Arrangement.spacedBy(16.dp)
74+
) {
75+
item { Spacer(Modifier.width(8.dp)) }
76+
items(filteredList) { item ->
77+
when (item) {
78+
is HighlightData.Video -> VideoHighlightCard(item.data, true)
79+
is HighlightData.Article -> ArticleHighlightCard(item.data, true)
80+
}
81+
}
82+
item { Spacer(Modifier.width(8.dp)) }
83+
}
84+
Spacer(modifier = Modifier.height(24.dp))
85+
}
86+
87+
}
88+
}
89+
}
90+
}
91+
92+
@Preview
93+
@Composable
94+
private fun HighlightsSearchScreenStartStatePreview() {
95+
HighlightsSearchScreen(
96+
sportList,
97+
listOf("Columbia", "Men's ice hockey", "Late goal lifts No.6 men’s hockey"),
98+
highlightsList,
99+
"",
100+
"Search All Highlights"
101+
)
102+
}
103+
104+
@Preview
105+
@Composable
106+
private fun HighlightsSearchScreenQueryMissPreview() {
107+
HighlightsSearchScreen(
108+
sportList,
109+
listOf("Columbia", "Men's ice hockey", "Late goal lifts No.6 men’s hockey"),
110+
highlightsList,
111+
"Sports",
112+
"Search All Highlights"
113+
)
114+
}
115+
116+
@Preview
117+
@Composable
118+
private fun HighlightsSearchScreenQueryHitPreview() {
119+
HighlightsSearchScreen(
120+
sportList,
121+
listOf("Columbia", "Men's ice hockey", "Late goal lifts No.6 men’s hockey"),
122+
highlightsList,
123+
"Hockey",
124+
"Search All Highlights"
125+
)
126+
}

‎app/src/main/java/com/cornellappdev/score/screen/HighlightsSubScreen.kt‎

Lines changed: 155 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,155 @@
1+
package com.cornellappdev.score.screen
2+
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.layout.Arrangement
5+
import androidx.compose.foundation.layout.Box
6+
import androidx.compose.foundation.layout.Column
7+
import androidx.compose.foundation.layout.Row
8+
import androidx.compose.foundation.layout.Spacer
9+
import androidx.compose.foundation.layout.fillMaxSize
10+
import androidx.compose.foundation.layout.fillMaxWidth
11+
import androidx.compose.foundation.layout.height
12+
import androidx.compose.foundation.layout.padding
13+
import androidx.compose.foundation.layout.width
14+
import androidx.compose.foundation.layout.wrapContentSize
15+
import androidx.compose.foundation.lazy.LazyColumn
16+
import androidx.compose.foundation.lazy.items
17+
import androidx.compose.material3.Icon
18+
import androidx.compose.material3.Surface
19+
import androidx.compose.material3.Text
20+
import androidx.compose.runtime.Composable
21+
import androidx.compose.ui.Modifier
22+
import androidx.compose.ui.draw.dropShadow
23+
import androidx.compose.ui.graphics.Color
24+
import androidx.compose.ui.graphics.RectangleShape
25+
import androidx.compose.ui.graphics.shadow.Shadow
26+
import androidx.compose.ui.res.painterResource
27+
import androidx.compose.ui.tooling.preview.Preview
28+
import androidx.compose.ui.unit.DpOffset
29+
import androidx.compose.ui.unit.dp
30+
import com.cornellappdev.score.R
31+
import com.cornellappdev.score.components.EmptyStateBox
32+
import com.cornellappdev.score.components.ScorePreview
33+
import com.cornellappdev.score.components.highlights.ArticleHighlightCard
34+
import com.cornellappdev.score.components.highlights.HighlightsScreenSearchFilterBar
35+
import com.cornellappdev.score.components.highlights.RecentSearches
36+
import com.cornellappdev.score.components.highlights.VideoHighlightCard
37+
import com.cornellappdev.score.model.HighlightData
38+
import com.cornellappdev.score.model.Sport
39+
import com.cornellappdev.score.theme.Style.bodyNormal
40+
import com.cornellappdev.score.theme.Style.heading2
41+
import com.cornellappdev.score.theme.White
42+
import com.cornellappdev.score.util.highlightsList
43+
import com.cornellappdev.score.util.sportList
44+
45+
@Composable
46+
fun HighlightsSubScreenHeader(
47+
header: String
48+
) {
49+
Row(
50+
modifier = Modifier
51+
.padding(horizontal = 24.dp, vertical = 12.dp)
52+
.fillMaxWidth(),
53+
horizontalArrangement = Arrangement.spacedBy(96.dp)
54+
) {
55+
Icon(
56+
painter = painterResource(R.drawable.ic_left_arrowhead),
57+
contentDescription = "back arrow"
58+
)
59+
Text(header, style = heading2)
60+
}
61+
}
62+
63+
@Preview
64+
@Composable
65+
private fun HighlightsSubScreenHeader() {
66+
ScorePreview {
67+
HighlightsSubScreenHeader("Past 3 Days")
68+
}
69+
}
70+
71+
@Composable
72+
fun HighlightsSubScreen(
73+
sportList: List<Sport>,
74+
recentSearchList: List<String>,
75+
highlightsList: List<HighlightData>,
76+
query: String,
77+
header: String
78+
) {
79+
Column(
80+
modifier = Modifier
81+
.fillMaxSize()
82+
.background(color = Color.White)
83+
.padding(top = 24.dp)
84+
) {
85+
Surface(
86+
modifier = Modifier.wrapContentSize().dropShadow(
87+
shape = RectangleShape,
88+
shadow = Shadow(
89+
radius = 2.dp,
90+
color = Color.Black.copy(alpha = 0.05f),
91+
offset = DpOffset(0.dp, (2).dp)
92+
)
93+
),
94+
color = White
95+
) {
96+
HighlightsSubScreenHeader(header)
97+
}
98+
Spacer(modifier = Modifier.height(16.dp))
99+
HighlightsScreenSearchFilterBar(
100+
sportList,
101+
102+
false
103+
) //need viewmodel to handle comms between composables
104+
Spacer(modifier = Modifier.height(24.dp))
105+
Column(
106+
modifier = Modifier.padding(horizontal = 24.dp)
107+
) {
108+
if (recentSearchList.isNotEmpty() && query.isEmpty()) { //start state: no search attempted yet
109+
RecentSearches(recentSearchList)
110+
} else if (query.isNotEmpty()) { //filtering - will pull this out to the viewmodel when i do that, just here for sanity check rn
111+
val filteredList = highlightsList.filter {
112+
it.title.contains(query, ignoreCase = true)
113+
}
114+
if (filteredList.isEmpty()) {
115+
EmptyStateBox(
116+
icon = R.drawable.ic_kid_star,
117+
title = "No results yet.",
118+
)
119+
} else {
120+
Text("${filteredList.size} Results", style = bodyNormal)
121+
LazyColumn(
122+
verticalArrangement = Arrangement.spacedBy(16.dp)
123+
) {
124+
item { Spacer(Modifier.width(8.dp)) }
125+
items(filteredList) { item ->
126+
when (item) {
127+
is HighlightData.Video -> VideoHighlightCard(item.data, true)
128+
is HighlightData.Article -> ArticleHighlightCard(item.data, true)
129+
}
130+
}
131+
item { Spacer(Modifier.width(8.dp)) }
132+
}
133+
Spacer(modifier = Modifier.height(24.dp))
134+
}
135+
136+
}
137+
}
138+
}
139+
}
140+
141+
@Preview
142+
@Composable
143+
private fun HighlightsSubScreenPreview() {
144+
HighlightsSubScreen(
145+
sportList = sportList,
146+
recentSearchList = listOf(
147+
"Columbia",
148+
"Men's ice hockey",
149+
"Late goal lifts No.6 men’s hockey"
150+
),
151+
highlightsList = highlightsList,
152+
query = "hockey",
153+
header = "Past 3 Days"
154+
)
155+
}

0 commit comments

Comments
 (0)