File size: 4,316 Bytes
ae266c2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
c7bb9fe
 
ae266c2
 
c498f71
ae266c2
edc5be6
 
 
a010c38
edc5be6
 
c7bb9fe
a010c38
ae266c2
 
c498f71
ae266c2
c7bb9fe
ae266c2
7b1f17e
ae266c2
6bfae71
ae266c2
 
 
c498f71
ae266c2
c498f71
ae266c2
1e0ec75
ae266c2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
77c4959
 
ae266c2
 
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
"""Tagba Translator"""
import streamlit as st
import requests

api_url = "https://31d7-196-13-207-151.ngrok-free.app/"


if 'source_lang' not in st.session_state:
    st.session_state.source_lang = 'Français'
if 'target_lang' not in st.session_state:
    st.session_state.target_lang = 'Tagba'

st.markdown(
    """
    <style>
    .stApp {
        background-color: #003366;
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
    }
    .col-container {
        font-weight: bold;
        font-size: 25px;
        font-family: calibri(corps);
        color: antiquewhite;
        border: 2px solid antiquewhite;
        border-radius: 50px;
        display: inline-flex;
        justify-content: center;
        text-align: center;
        padding: 2px 4px;
        margin-top: 30px;
        margin-left: 90px;
    }
    .stColumns > div {
            border: 2px solid #000;
        }
    .title {
        text-align: center;
        font-size: 48px;
        font-weight: bold;
        margin-bottom: 10px;
        font-family: 'Brush Script MT', cursive;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        letter-spacing: 1px;
        position: relative;
    }
    .title::after {
        content: "";
        position: absolute;
        bottom: -5px;
        left: 10%;
        width: 80%;
        height: 2px;
        background-color: #FFFFFF;
    }
    .footer {
        color: antiquewhite;
    }
    .block-container {
        background: rgba(255, 255, 255, 0.3);
        min-width: 500px;
        min-height: 600px;
        padding: 30px;
        box-sizing: border-box;
        border-radius: 10px;
        box-shadow: 3px 6px 40px rgba(0, 0, 0, 0.1);
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        heigh: 100%;
        position: absolute;
    }
    .stButton>button {
        display: block;
        margin:: 0 auto;
        position: absolute;
        margin-top: 20px;
    }
    </style>
    """,
    unsafe_allow_html=True
)

st.markdown('<h1 class="title">Tagba Translator</h1>', unsafe_allow_html=True)

col1, col_swap, col2 = st.columns([1, 0.05, 1], gap="small")


if "text_to_translate" not in st.session_state:
    st.session_state.text_to_translate = ""

if "translation" not in st.session_state:
    st.session_state.translation = ""

with col_swap:
    st.write("")
    swap = st.button("⇄")

    if swap:
        st.session_state.source_lang, st.session_state.target_lang = st.session_state.target_lang, st.session_state.source_lang
        st.session_state.text_to_translate, st.session_state.translation = st.session_state.translation, st.session_state.text_to_translate

with col1:
    st.markdown('<h3 class="col-container">'+st.session_state.source_lang+'</h3>', unsafe_allow_html=True)
    st.session_state.text_to_translate = st.text_area(
        label=" ",
        value=st.session_state.text_to_translate,
        height=200,
        placeholder="Entrez un texte ici"
    )
    

st.markdown('</div>', unsafe_allow_html=True)
if st.button("Traduire"):
    if st.session_state.text_to_translate:
        try:
            response = requests.post('https://17a8-102-180-109-59.ngrok-free.app/translate/', json={"text": st.session_state.text_to_translate, "lang": st.session_state.target_lang}, timeout=600)
            if response.status_code == 200:
                translation = response.json()["translation"] #   st.session_state.text_to_translate = " "
                st.session_state.translation = translation
            else:
                st.error("Erreur lors de la traduction.")
                response.raise_for_status()
        except requests.exceptions.RequestException as e:
            st.error("Erreur lors de la traduction.")
            print(e)
    else:
        st.warning("Veuillez entrer du texte à traduire.")

with col2:
    st.markdown('<h3 class="col-container style="margin-top: 10px; margin-bottom: 10px;">'+st.session_state.target_lang+'</h3>', unsafe_allow_html=True)
    st.text_area(
        label=" ",
        value=st.session_state.translation,
        height=200
    )

        
st.markdown('</div>', unsafe_allow_html=True)