File size: 9,798 Bytes
4885161
f2dc27c
410aaa4
 
eaa20c8
 
 
f2dc27c
ff650b2
410aaa4
 
 
 
 
 
 
 
 
 
 
 
 
 
 
6a9817c
 
 
1dc293c
 
6a9817c
 
 
 
1dc293c
 
 
6a9817c
1dc293c
6a9817c
 
 
1dc293c
 
6a9817c
1dc293c
6a9817c
 
1dc293c
 
 
 
 
6a9817c
1dc293c
 
 
6a9817c
1dc293c
 
 
 
 
 
6a9817c
1dc293c
 
 
 
 
6a9817c
 
 
1dc293c
 
 
 
 
 
 
 
 
 
 
 
 
6a9817c
 
 
410aaa4
 
ff650b2
 
 
 
 
 
 
eaa20c8
410aaa4
6a9817c
 
410aaa4
 
 
ff650b2
 
 
 
 
 
 
 
 
 
410aaa4
 
 
c73acfa
410aaa4
 
eaa20c8
c73acfa
98e7849
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
eaa20c8
98e7849
 
 
 
 
 
 
 
 
 
 
 
 
 
6a9817c
 
 
eaa20c8
2f3ae34
 
c73acfa
 
 
 
 
 
 
2f3ae34
98e7849
 
2f3ae34
 
 
 
 
 
98e7849
 
2f3ae34
 
 
 
 
 
eaa20c8
 
ff650b2
 
 
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
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
# modules/ui/views/landing_view.py
import gradio as gr
import os
from pathlib import Path
from ...database.sql_db import store_application_request
from datetime import datetime
import uuid

##########################################################
def get_asset_path(filename, asset_type='img_logo'):
    """
    Obtiene la ruta completa de un asset
    
    Args:
        filename (str): Nombre del archivo
        asset_type (str): Tipo de asset ('img_logo', 'img_social-media', etc.)
    
    Returns:
        str: Ruta completa al asset
    """
    current_dir = Path(__file__).parent.parent  # sube a /modules/ui
    asset_path = current_dir / 'assets' / asset_type / filename
    return str(asset_path)

    custom_css = """
        /* Variables de color corporativo */
        :root {
            --color-primary: rgb(174, 0, 37);    /* Rojo corporativo */
            --color-secondary: rgb(7, 60, 99);   /* Azul corporativo */
            --color-background: #ffffff;
            --color-border: #e0e0e0;
        }
        
        /* Sobreescribir los estilos por defecto de Gradio */
        .dark button.primary-btn,
        button.primary-btn {
            background-color: var(--color-primary) !important;
            border-color: var(--color-primary) !important;
            color: white !important;
        }
        
        .dark button.secondary-btn,
        button.secondary-btn {
            background-color: var(--color-secondary) !important;
            border-color: var(--color-secondary) !important;
            color: white !important;
        }
    
        /* Sobreescribir los estilos de los tabs */
        .tabs.svelte-1g805jl .tabitem.svelte-1g805jl.selected {
            color: var(--color-primary) !important;
            border-color: var(--color-primary) !important;
        }
    
        .tabs.svelte-1g805jl {
            border-bottom-color: var(--color-secondary) !important;
        }
    
        /* Asegurar que los botones mantengan los colores al hacer hover */
        .dark button.primary-btn:hover,
        button.primary-btn:hover {
            background-color: rgb(144, 0, 27) !important;  /* Versión más oscura del rojo */
            border-color: rgb(144, 0, 27) !important;
        }
    
        .dark button.secondary-btn:hover,
        button.secondary-btn:hover {
            background-color: rgb(5, 40, 79) !important;  /* Versión más oscura del azul */
            border-color: rgb(5, 40, 79) !important;
        }
    """
    
    # En los botones, asegúrate de que las clases se apliquen correctamente
    login_button = gr.Button(
        "Ingresar",
        elem_classes="primary-btn",
        variant="primary"
    )
    
    register_button = gr.Button(
        "Enviar Solicitud",
        elem_classes="secondary-btn",
        variant="secondary"
    )
    
    with gr.Blocks(css=custom_css) as view:
        # El resto del código permanece igual pero con algunas modificaciones en las clases
        
        # Header con logo
        with gr.Column(elem_id="header-logo"):
            gr.Image(
                value=logo_path,
                label=None,
                show_label=False,
                container=False,
                height=200
            )
        
        with gr.Row(elem_classes="container"):
            # Primera columna (25%)
            with gr.Column(scale=1):
                with gr.Tabs() as tabs:
                    # Tab de Login
                    with gr.TabItem("Iniciar Sesión", elem_classes="gr-form"):
                        with gr.Column():
                            username = gr.Textbox(
                                label="Usuario",
                                placeholder="Ingrese su usuario"
                            )
                            password = gr.Textbox(
                                label="Contraseña",
                                type="password",
                                placeholder="Ingrese su contraseña"
                            )
                            login_button = gr.Button(
                                "Ingresar",
                                variant="primary",
                                elem_classes="primary-btn"
                            )
                            login_message = gr.Markdown()

                    # Tab de Registro #####################################################################
                    with gr.TabItem("Solicitud de Acceso", elem_classes="gr-form"):
                        with gr.Column():
                            name = gr.Textbox(
                                label="Nombre Completo",
                                placeholder="Ej: Juan Pérez"
                            )
                            email = gr.Textbox(
                                label="Correo Electrónico",
                                placeholder="[email protected]"
                            )
                            institution = gr.Textbox(
                                label="Institución",
                                placeholder="Universidad, Colegio, Empresa, etc."
                            )
                            role = gr.Dropdown(
                                choices=[
                                    "Estudiante",
                                    "Profesor",
                                    "Investigador",
                                    "Otro"
                                ],
                                label="Rol",
                                value="Estudiante"
                            )
                            reason = gr.TextArea(
                                label="¿Por qué te interesa usar AIdeaText?",
                                placeholder="Describe brevemente tu interés en la plataforma...",
                                lines=4
                            )
                            register_button = gr.Button(
                                "Enviar Solicitud",
                                variant="secondary",
                                scale=0
                            )
                            register_message = gr.Markdown()

                            def handle_registration(name, email, institution, role, reason):
                                try:
                                    if not all([name, email, institution, role, reason]):
                                        return gr.Markdown("❌ Todos los campos son obligatorios")
                                    
                                    if "@" not in email or "." not in email:
                                        return gr.Markdown("❌ El correo electrónico no es válido")

                                    success = store_application_request(
                                        name=name,
                                        email=email,
                                        institution=institution,
                                        current_role=role,
                                        desired_role=role,
                                        reason=reason
                                    )

                                    if success:
                                        return gr.Markdown("✅ Solicitud enviada correctamente. Te contactaremos pronto.")
                                    else:
                                        return gr.Markdown("❌ Error al enviar la solicitud. Por favor, intenta nuevamente.")

                                except Exception as e:
                                    return gr.Markdown(f"❌ Error: {str(e)}")

                            register_button.click(
                                fn=handle_registration,
                                inputs=[name, email, institution, role, reason],
                                outputs=register_message
                            )
            
            # Segunda columna (75%)
            with gr.Column(scale=3):
                with gr.Tabs(elem_classes="content-tabs"):
                    with gr.TabItem("Introducción"):
                        # Reemplazar gr.Box con gr.Column
                        with gr.Column(elem_classes="media-box"):
                            gr.Markdown("""
                            ### ¿Qué es AIdeaText?
                            AIdeaText es una avanzada aplicación web diseñada para mejorar 
                            las habilidades de redacción y comprensión lectora a través 
                            del análisis visual de textos potenciado por distintas tecnologías 
                            de inteligencia artificial.
                            """)
                            # Aquí puedes agregar imágenes o videos con mejor diseño
                    
                    with gr.TabItem("Tutorial"):
                        with gr.Column(elem_classes="media-box"):
                            gr.Markdown("""
                            ### Cómo usar AIdeaText
                            Aprende a utilizar todas las funcionalidades de AIdeaText
                            para mejorar tu escritura académica.
                            """)
                        
                    with gr.TabItem("Ejemplos"):
                        with gr.Column(elem_classes="media-box"):
                            gr.Markdown("""
                            ### Ejemplos de Uso
                            Mira ejemplos prácticos de cómo AIdeaText puede ayudarte
                            en tus tareas de escritura.
                            """)

    # Mantener la funcionalidad de navegación existente
    start_button = gr.Button(visible=False)
    
    return view, login_button