Skip to content

Commit 6675a08

Browse files
IM-THE-GRASSIM-THE-GRASS
committed
finsh
1 parent b6a77b2 commit 6675a08

File tree

7 files changed

+352
-143
lines changed

7 files changed

+352
-143
lines changed

‎movie_streaming_site/components/loading.py

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import reflex as rx
2+
from reflex_lottiefiles import LottieFiles
3+
4+
def loading():
5+
return rx.center(
6+
rx.vstack(
7+
rx.heading("Loading, please wait"),
8+
LottieFiles(
9+
src="https://lottie.host/5ff06a80-3f45-4dd3-8737-f4cf62ba3d48/X5hdVEjbNK.lottie",
10+
autoplay=True,
11+
loop=True,
12+
width="20vw",
13+
height="20vw",
14+
)
15+
),
16+
17+
width="100%",
18+
height="90vh"
19+
20+
),
21+
22+

‎movie_streaming_site/components/moviecard.py

+21-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,23 @@
11
import reflex as rx
2+
from reflex_motion import motion
3+
4+
25
def movie_card(title: str, year: str, duration: str, link:str, img:str = "https://via.placeholder.com/316x421", description:str = ""):
36
return rx.hover_card.root(
47
rx.hover_card.trigger(
58
rx.link(
69

7-
rx.box(
8-
rx.image(src=img, width="17vw", height="47vh"),
10+
motion(
11+
motion(
12+
rx.image(
13+
src=img,
14+
width="17vw",
15+
height="47vh"
16+
),
17+
while_hover={"scale": 1.05},
18+
while_tap={"scale": 0.95},
19+
transition={"type": "spring", "stiffness": 400, "damping": 17},
20+
),
921
rx.vstack(
1022
rx.hstack(
1123
rx.text(year, color="#C0C0C0", font_size="2vh", font_style="italic"),
@@ -23,7 +35,13 @@ def movie_card(title: str, year: str, duration: str, link:str, img:str = "https:
2335
bg="#1A1A1A",
2436
border_radius="1vh",
2537
#border="0.1vh solid #D9D9D9",
38+
while_hover={"scale": 1.05},
39+
while_tap={"scale": 0.95},
40+
transition={"type": "spring", "stiffness": 400, "damping": 17},
2641
),
42+
padding="1vw",
43+
width="19vw",
44+
border_radius="1vh",
2745
href=link,
2846
is_external=True
2947
)
@@ -48,6 +66,7 @@ def movie_card(title: str, year: str, duration: str, link:str, img:str = "https:
4866
),
4967
side="right"
5068
),
69+
open_delay=900
5170

5271
)
5372

‎movie_streaming_site/components/search.py

+28-9
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,37 @@
11
import reflex as rx
2+
from movie_streaming_site.state import State
3+
from reflex_motion import motion
24

35
def search():
46
return rx.hstack(
5-
rx.icon(tag="search", color="white", size=30),
6-
rx.input(
7-
placeholder="Search",
8-
color="white",
9-
font_size="3.5vh",
7+
motion(
8+
rx.link(
9+
rx.icon(tag="search", color="white", size=30),
10+
href=State.search_url
11+
),
12+
while_hover={"scale": 1.2},
13+
while_tap={"scale": 0.9},
14+
transition={"type": "spring", "stiffness": 400, "damping": 17},
15+
),
16+
motion(
17+
rx.input(
18+
placeholder="Search",
19+
color="white",
20+
font_size="3.5vh",
21+
width="100%",
22+
background_color="rgba(255, 255, 255, 0)",
23+
border="none",
24+
border_width="0px",
25+
height="30",
26+
value=State.search_value,
27+
on_change=State.change_search_value
28+
),
1029
width="100%",
11-
background_color="rgba(255, 255, 255, 0)",
12-
border="none",
13-
border_width="0px",
14-
height="30"
30+
while_hover={"scale": 1.05},
31+
while_tap={"scale": 0.95},
32+
transition={"type": "spring", "stiffness": 400, "damping": 17},
1533
),
34+
1635
bg="rgba(0, 0, 0, 0.29)",
1736
border_radius="1087vh",
1837
padding="0.5vh",

‎movie_streaming_site/movie_streaming_site.py

+68-121
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,21 @@
44
from movie_streaming_site.components.search import search
55
from movie_streaming_site.components.footer import footer
66
from reflex_lottiefiles import LottieFiles
7+
from movie_streaming_site.components.loading import loading
8+
from movie_streaming_site.pages.player import movieplayer
9+
from movie_streaming_site.pages.search import search_page
10+
from reflex_motion import motion
11+
12+
class slider(rx.Component):
13+
library = "nuka-carousel"
14+
tag = "Carousel"
15+
autoplay:rx.Var[bool]
16+
showDots:rx.Var[bool]
17+
autoplayInterval:rx.Var[int]
18+
19+
20+
Slider = slider.create
21+
722

823
@rx.page(on_load=State.on_load)
924
def index():
@@ -20,23 +35,31 @@ def index():
2035
top="0",
2136
bg="linear-gradient(180deg, rgba(18, 18, 18, 0) 0%, rgba(18, 18, 18, 0.25) 37%, rgba(18, 18, 18, 0.77) 67%, rgba(18, 18, 18, 0.90) 77%, #121212 93%)",
2237
),
23-
24-
rx.button(
25-
"Watch Now",
26-
rx.icon(tag="circle_play", size=70),
27-
bg="#FFE066",
28-
color="black",
29-
font_size="5vh",
30-
font_weight="800",
31-
border_radius="9999px",
32-
border="0.7vh solid #2C2C2C",
33-
padding="1.5vh",
38+
motion(
39+
40+
rx.button(
41+
"Watch Now",
42+
rx.icon(tag="circle_play", size=70),
43+
bg="#FFE066",
44+
color="black",
45+
font_size="5vh",
46+
font_weight="800",
47+
border_radius="9999px",
48+
border="0.7vh solid #2C2C2C",
49+
padding="1.5vh",
50+
width="24vw",
51+
height="16vh"
52+
),
3453
position="absolute",
3554
left="7vw",
3655
top="70vh",
3756
width="24vw",
38-
height="16vh"
57+
height="16vh",
58+
while_hover={"scale": 1.2},
59+
while_tap={"scale": 0.9},
60+
transition={"type": "spring", "stiffness": 400, "damping": 17},
3961
),
62+
4063
rx.heading(
4164
"TORNADO MOVIE OR SOMETHING",
4265
font_size="14vh",
@@ -55,7 +78,28 @@ def index():
5578
),
5679
search(),
5780
rx.center(
81+
rx.cond(
82+
State.loading,
83+
rx.center(
84+
rx.vstack(
85+
rx.heading("Loading, please wait"),
86+
LottieFiles(
87+
src="https://lottie.host/5ff06a80-3f45-4dd3-8737-f4cf62ba3d48/X5hdVEjbNK.lottie",
88+
autoplay=True,
89+
loop=True,
90+
width="20vw",
91+
height="20vw",
92+
)
93+
),
94+
95+
width="100%",
96+
height="90vh",
97+
margin_bottom="20vh"
98+
),
99+
100+
),
58101
rx.grid(
102+
59103
rx.foreach(
60104
State.now_playing,
61105
lambda info, index: movie_card(info["title"], info["year"], f"{info['runtime']} mins", info["link"], info["poster"], description=info["description"])
@@ -79,117 +123,17 @@ def index():
79123

80124

81125

82-
@rx.page(route="/movieplayer/[movieid]", on_load=State.on_load)
83-
def movieplayer():
126+
def testpage():
84127
return rx.box(
85-
search(),
86-
87-
88-
rx.cond(
89-
State.loading,
90-
rx.center(
91-
rx.vstack(
92-
rx.heading("Loading, please wait"),
93-
LottieFiles(
94-
src="https://lottie.host/5ff06a80-3f45-4dd3-8737-f4cf62ba3d48/X5hdVEjbNK.lottie",
95-
autoplay=True,
96-
loop=True,
97-
width="20vw",
98-
height="20vw",
99-
)
100-
),
101-
102-
width="100%",
103-
height="90vh"
104-
),
105-
106-
rx.box(
107-
rx.text(State.current_movie["title"], font_size="10.5vh", font_weight="800"),
108-
rx.hstack(
109-
rx.html(
110-
State.movie_iframe,
111-
width="50vw",
112-
height="60vw"
113-
),
114-
#rx.box(width="960px", height="540px", bg="#D9D9D9"),
115-
rx.vstack(
116-
rx.text(
117-
"Description",
118-
color="white",
119-
font_size="4vh",
120-
font_weight="800"
121-
),
122-
rx.text(
123-
State.current_movie["description"],
124-
color="white",
125-
font_size="3vh",
126-
max_width="28vw"
127-
),
128-
align_items="flex-start",
129-
),
130-
rx.desktop_only(
131-
rx.vstack(
132-
movie_info_item(State.current_movie["date"], "calendar"),
133-
movie_info_item(State.current_movie["revenue"], "dollar-sign"),
134-
movie_info_item(State.current_movie["runtime"], "clock"),
135-
136-
rx.cond(
137-
State.current_movie["site"],
138-
rx.link(
139-
movie_info_item("Site", "globe"),
140-
href=State.current_movie["site"],
141-
is_external=True
142-
),
143-
),
144-
rx.cond(
145-
State.current_movie["tmdb_link"],
146-
rx.link(
147-
movie_info_item("TMDB", "clock"),
148-
href=State.current_movie["tmdb_link"],
149-
is_external=True
150-
),
151-
),
152-
rx.cond(
153-
State.current_movie["imdb_link"],
154-
rx.link(
155-
movie_info_item("IMDB", "clock"),
156-
href=State.current_movie["imdb_link"],
157-
is_external=True
158-
)
159-
)
160-
161-
162-
163-
),
164-
),
165-
166-
spacing="2vw",
167-
),
168-
)
169-
),
170-
171-
172-
173-
width = "100%",
174-
padding="5.5vh",
128+
Slider(
129+
rx.image(src="https://commerce.nearform.com/open-source/nuka-carousel/img/pexels-01.jpg"),
130+
rx.image(src="https://commerce.nearform.com/open-source/nuka-carousel/img/pexels-01.jpg"),
131+
autoplay=True,
132+
showDots=True,
133+
autoplayInterval=3000
134+
)
175135
)
176136

177-
def movie_info_item(text, icon):
178-
return rx.hstack(
179-
rx.center(
180-
rx.icon(
181-
icon,
182-
),
183-
184-
),
185-
rx.center(
186-
rx.text(text, color="white", font_size="2.5vh"),
187-
),
188-
189-
spacing="1vw",
190-
)
191-
192-
193137

194138

195139

@@ -200,4 +144,7 @@ def movie_info_item(text, icon):
200144
}
201145

202146
app = rx.App(style = style)
203-
app.add_page(index)
147+
app.add_page(search_page)
148+
app.add_page(movieplayer)
149+
app.add_page(index)
150+
app.add_page(testpage)

0 commit comments

Comments
 (0)