File size: 5,527 Bytes
b6d9a34
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1b16646
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
b6d9a34
 
 
1b16646
 
 
 
 
 
 
 
 
 
b6d9a34
 
 
 
 
 
1b16646
b6d9a34
 
 
1b16646
b6d9a34
 
 
1b16646
b6d9a34
 
 
 
 
 
 
 
 
1b16646
 
 
 
 
 
b6d9a34
1b16646
b6d9a34
 
1b16646
b6d9a34
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8bf46bc
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
import gradio as gr
from interface_pages.home_page import home_page
from interface_pages.about_page import about_page
from interface_pages.yoga_position_from_stream import yoga_position_from_stream
from interface_pages.yoga_position_from_video import yoga_position_from_video
import time


def main(page):
    if page == "Home":
        return home_page()
    elif page == "About us":
        return about_page()
    elif page == "Yoga from stream":
        return yoga_position_from_stream()
    elif page == "Yoga from video":
        return yoga_position_from_video()


def interface():
    css_version = int(time.time())  # Use current timestamp as version

    theme = gr.themes.Soft(
        primary_hue="indigo",
        secondary_hue="blue",
        font=[gr.themes.GoogleFont("Roboto"), "sans-serif"],
    ).set(
        body_text_color="#303030",
        block_title_text_size="24px",
        block_label_text_size="20px",
        input_text_size="18px",
        button_large_text_size="20px",
        button_small_text_size="18px",
        checkbox_label_text_size="18px",
    )

    with gr.Blocks(theme=theme, css=f"static/styles.css?v={css_version}") as demo:
        # ASCII Logo at the top with inline gradient style
        ascii_logo = """
                 ___           ___           ___                 
                /\  \         /\__\         /\  \                
     ___       /::\  \       /:/ _/_       /::\  \       ___     
    /|  |     /:/\:\  \     /:/ /\  \     /:/\:\  \     /\__\    
   |:|  |    /:/  \:\  \   /:/ /::\  \   /:/ /::\  \   /:/__/    
   |:|  |   /:/__/ \:\__\ /:/__\/\:\__\ /:/_/:/\:\__\ /::\  \    
 __|:|__|   \:\  \ /:/  / \:\  \ /:/  / \:\/:/  \/__/ \/\:\  \__ 
/::::\  \    \:\  /:/  /   \:\  /:/  /   \::/__/       ~~\:\/\__\\
~~~~\:\  \    \:\/:/  /     \:\/:/  /     \:\  \          \::/  /
     \:\__\    \::/  /       \::/  /       \:\__\         /:/  / 
      \/__/     \/__/         \/__/         \/__/         \/__/  
        """
        gr.HTML(
            f"""
            <div class="ascii-logo-container" style="display: flex; justify-content: center; width: 100%;">
                <pre class="ascii-logo" style="
                    font-family: monospace;
                    font-size: 1.8em;
                    line-height: 1.2;
                    white-space: pre;
                    text-align: center;
                    background: linear-gradient(to right, #4f46e5, #3b82f6);
                    -webkit-background-clip: text;
                    -webkit-text-fill-color: transparent;
                    display: inline-block;
                    margin-bottom: 20px;
                ">{ascii_logo}</pre>
            </div>
            """
        )

        # Layout with a Row to hold buttons and content
        with gr.Row():
            with gr.Column(scale=1, elem_classes=["menu-column"]):
                # Vertical Navigation Buttons
                home_button = gr.Button(
                    "Home", elem_classes=["menu-button", "large-font"]
                )
                about_button = gr.Button(
                    "About us", elem_classes=["menu-button", "large-font"]
                )
                yoga_stream_button = gr.Button(
                    "Yoga from stream", elem_classes=["menu-button", "large-font"]
                )
                yoga_video_button = gr.Button(
                    "Yoga from video", elem_classes=["menu-button", "large-font"]
                )

        # Create page contents
        with gr.Column(elem_id="page-content") as page_content:
            home_page_content = home_page()
            about_page_content = about_page()
            yoga_stream_content = yoga_position_from_stream()
            yoga_video_content = yoga_position_from_video()

        # Set initial visibility
        home_page_content.visible = True
        about_page_content.visible = False
        yoga_stream_content.visible = False
        yoga_video_content.visible = False

        # Button click handlers
        def show_page(page):
            return [
                gr.update(visible=(content == page))
                for content in [
                    home_page_content,
                    about_page_content,
                    yoga_stream_content,
                    yoga_video_content,
                ]
            ]

        home_button.click(
            lambda: show_page(home_page_content),
            outputs=[
                home_page_content,
                about_page_content,
                yoga_stream_content,
                yoga_video_content,
            ],
        )
        about_button.click(
            lambda: show_page(about_page_content),
            outputs=[
                home_page_content,
                about_page_content,
                yoga_stream_content,
                yoga_video_content,
            ],
        )
        yoga_stream_button.click(
            lambda: show_page(yoga_stream_content),
            outputs=[
                home_page_content,
                about_page_content,
                yoga_stream_content,
                yoga_video_content,
            ],
        )
        yoga_video_button.click(
            lambda: show_page(yoga_video_content),
            outputs=[
                home_page_content,
                about_page_content,
                yoga_stream_content,
                yoga_video_content,
            ],
        )

    return demo


if __name__ == "__main__":
    interface().launch()