Newer
Older
import { Card, Carousel, Divider, Image, Space } from "antd";
import Meta from "antd/lib/card/Meta";
Tomáš Havlíček
committed
import { Link } from "react-router-dom";
const contentStyle: React.CSSProperties = {
color: "#fff",
lineHeight: "160px",
textAlign: "center",
background: "#364d79",
};
export interface CategoryIO {
id: string;
name: string;
movies: MovieIO[];
Tomáš Havlíček
committed
}
export interface MovieIO {
id: string;
name: string;
originalName: string;
intro: string;
picture: string;
published: string;
Tomáš Havlíček
committed
}
export interface DirectorIO {
id: string;
name: string;
surname: string;
birthdate: string;
Tomáš Havlíček
committed
}
//example - TODO replace this with API preview call - get POPULAR movies (probably 6 is enough)
export const cardsDataExample: MovieIO[] = [
{
id: "1",
originalName: "Cars",
name: "Auta",
intro: "auta ve filmu",
published: "7.8.2005",
director: {
id: "xd123",
name: "Kenny",
surname: "Omega",
birthdate: "9.9.1980",
},
picture: "https://upload.wikimedia.org/wikipedia/en/3/34/Cars_2006.jpg",
},
{
id: "2",
originalName: "Monster House",
name: "V tom domě straší",
intro: "jo ten dum je docela spooky",
published: "4.4.1994",
picture:
"https://images-na.ssl-images-amazon.com/images/S/pv-target-images/9a996123e0b01f618ab2291b479f9d5034de354b2d1bb58979ddc6937588dfa8._RI_V_TTW_.jpg",
director: {
id: "xp234",
name: "Bray",
surname: "Wyatt",
birthdate: "unknown",
},
},
{
id: "3",
originalName: "Pokemon",
name: "Pokémon",
intro: "Gotta catch them all.",
published: "9.9.1970",
picture:
"https://www.obchod.crew.cz/im/coc/1280/0/content/629080/cover_image.1607432614.jpg",
director: {
id: "xc456",
name: "Kazuchika",
surname: "Okada",
birthdate: "17.2.1984",
},
},
{
id: "4",
originalName: "Gympl",
name: "Gympl",
intro: "VO SEDUMNÁCT METRŮ?",
published: "2.2.2005",
picture:
"https://img.csfd.cz/files/images/user/profile/162/847/162847510_91e839.jpg",
director: {
id: "xs789",
name: "Tomáš",
surname: "Vorel",
birthdate: "někdy minulé století",
},
},
{
id: "5",
originalName: "Toy Story",
name: "Příběh hraček",
intro: "Hmm the floor here is made of floor",
published: "4.5.1999",
picture:
"https://m.media-amazon.com/images/M/MV5BMDU2ZWJlMjktMTRhMy00ZTA5LWEzNDgtYmNmZTEwZTViZWJkXkEyXkFqcGdeQXVyNDQ2OTk4MzI@._V1_.jpg",
director: {
id: "xl753",
name: "Tomohiro",
surname: "Ishii",
birthdate: "19.9.1970",
},
},
{
id: "6",
name: "Smoke",
originalName: "Kouř",
intro:
"Jedu dál stále s tebou víme kam cesty vedou je to fajn fajn fajn je to fajn fajnový",
published: "17.11.1989",
picture:
"https://img.csfd.cz/files/images/user/profile/164/556/164556101_d8e43b.jpg",
director: {
id: "xx787",
name: "Zdenda",
surname: "Pohlreich",
birthdate: "4.4.1985",
},
},
];
Tomáš Havlíček
committed
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
//example - TODO replace this with API preview call - get RECENT movies (probably 6-7 is enough)
export const cardsDataExample2: MovieIO[] = [
{
id: "1",
originalName: "Cars",
name: "Auta",
intro: "auta ve filmu",
published: "7.8.2005",
runtimeMinutes: 125,
director: {
id: "xd123",
name: "Kenny",
surname: "Omega",
birthdate: "9.9.1980",
},
picture: "https://upload.wikimedia.org/wikipedia/en/3/34/Cars_2006.jpg",
},
{
id: "2",
originalName: "Monster House",
name: "V tom domě straší",
intro: "jo ten dum je docela spooky",
published: "4.4.1994",
runtimeMinutes: 80,
picture:
"https://images-na.ssl-images-amazon.com/images/S/pv-target-images/9a996123e0b01f618ab2291b479f9d5034de354b2d1bb58979ddc6937588dfa8._RI_V_TTW_.jpg",
director: {
id: "xp234",
name: "Bray",
surname: "Wyatt",
birthdate: "unknown",
},
},
{
id: "3",
originalName: "Pokemon",
name: "Pokémon",
intro: "Gotta catch them all.",
published: "9.9.1970",
runtimeMinutes: 600,
picture:
"https://www.obchod.crew.cz/im/coc/1280/0/content/629080/cover_image.1607432614.jpg",
director: {
id: "xc456",
name: "Kazuchika",
surname: "Okada",
birthdate: "17.2.1984",
},
},
{
id: "4",
originalName: "Gympl",
name: "Gympl",
intro: "VO SEDUMNÁCT METRŮ?",
published: "2.2.2005",
runtimeMinutes: 96,
picture:
"https://img.csfd.cz/files/images/user/profile/162/847/162847510_91e839.jpg",
director: {
id: "xs789",
name: "Tomáš",
surname: "Vorel",
birthdate: "někdy minulé století",
},
},
{
id: "5",
originalName: "Toy Story",
name: "Příběh hraček",
intro: "Hmm the floor here is made of floor",
published: "4.5.1999",
runtimeMinutes: 90,
picture:
"https://m.media-amazon.com/images/M/MV5BMDU2ZWJlMjktMTRhMy00ZTA5LWEzNDgtYmNmZTEwZTViZWJkXkEyXkFqcGdeQXVyNDQ2OTk4MzI@._V1_.jpg",
director: {
id: "xl753",
name: "Tomohiro",
surname: "Ishii",
birthdate: "19.9.1970",
},
},
{
id: "6",
name: "Smoke",
originalName: "Kouř",
intro:
"Jedu dál stále s tebou víme kam cesty vedou je to fajn fajn fajn je to fajn fajnový",
published: "17.11.1989",
runtimeMinutes: 50,
picture:
"https://img.csfd.cz/files/images/user/profile/164/556/164556101_d8e43b.jpg",
director: {
id: "xx787",
name: "Zdenda",
surname: "Pohlreich",
birthdate: "4.4.1985",
},
},
];
const Preview: React.FC = () => (
<Space className="preview" direction="vertical" style={{display: "flex", paddingTop:"2%"}}>
<Card title="Popular movies" >
<Space style={{ display: 'flex', padding: "5 %", justifyContent: "flex-end", width:"fit-content", overflow: "auto"}}>
return (
<>
<Link to={`/movie/${movie.id}`}>
<Card
hoverable
style={{
width: "240px",
}}
cover={<img alt={movie.name} src={movie.picture} />}
>
<Meta title={movie.name} description={movie.originalName} />
</Card>
</Link>
</>
);
})}
</Space>
</Card>
<Divider/>
<Card title="Recent movies" >
<Space style={{ display: 'flex', padding: "5 %", justifyContent: "flex-end", width:"fit-content", overflow: "auto"}}>
{cardsDataExample2.map((movie) => {
return (
<>
<Link to={`/movie/${movie.id}`}>
<Card
hoverable
style={{
width: 240,
}}
cover={<img alt={movie.name} src={movie.picture} />}
>
<Meta title={movie.name} description={movie.originalName} />
</Card>
</Link>
</>
);
Tomáš Havlíček
committed
})}
</Space>
);
export default Preview;