Spaces:
Runtime error
Runtime error
| import gradio as gr | |
| # from mistralai import Mistral, UserMessage | |
| from chatbot_gaia.src.main_flow import kickoff | |
| import pandas as pd | |
| import os | |
| from func_utils import * | |
| def go_to_page_1(): | |
| return gr.Column(visible=True), gr.Column(visible=False) | |
| with gr.Blocks() as demo: | |
| with gr.Row(): | |
| page_1 = gr.Column(visible=True) | |
| with page_1: | |
| gr.HTML( | |
| """ | |
| <style> | |
| .gradio-container { | |
| background-color: #FFFFFF; | |
| color: #000000; | |
| }, | |
| .font-color{ | |
| color: #000000; | |
| } | |
| .white-background { | |
| background-color: #FFFFFF !important; | |
| } | |
| .card { | |
| background-color: #FFFFFF !important; | |
| border: solid 1px; | |
| border-radius: 10px; | |
| border-color: #000000; | |
| display: flex; | |
| align-content: center; | |
| padding: 20px; | |
| } | |
| .box { | |
| background-color: #FFFFFF !important; | |
| # border-radius: 10px; | |
| display: flex; | |
| align-content: center; | |
| padding: 20px; | |
| } | |
| .result-page { | |
| background-color: #FFFFFF !important; | |
| border-radius: 10px; | |
| display: flex; | |
| align-content: center; | |
| padding: 20px; | |
| border: solid 1px; | |
| border-color: #000000; | |
| } | |
| .selected.svelte-1tcem6n.svelte-1tcem6n { | |
| color: #28C896; | |
| border-bottom-color: #28C896; | |
| } | |
| .selected.svelte-1tcem6n.svelte-1tcem6n:after { | |
| background-color: #28C896; | |
| } | |
| button.svelte-1tcem6n.svelte-1tcem6n { | |
| color: #000000 !important; | |
| border-radius: 20px; | |
| } | |
| p { | |
| color: #000000 !important; | |
| } | |
| .tab { | |
| color: #28C896; | |
| } | |
| .adress-card { | |
| background-color: #FFFFFF !important; | |
| color: #000000; | |
| } | |
| span.svelte-1gfkn6j { | |
| color: #000000 !important; | |
| } | |
| span.has-info.svelte-1gfkn6j { | |
| color: #000000 !important; | |
| } | |
| textarea.svelte-173056l.svelte-173056l { | |
| background-color: #FFFFFF !important; | |
| } | |
| .culture_box { | |
| background-color: #52525b; | |
| border-radius: 10px; | |
| display: flex; | |
| align-content: center; | |
| } | |
| .summary { | |
| border: solid 1px; | |
| border-radius: 10px; | |
| padding: 20px; | |
| } | |
| .padding.svelte-phx28p{ | |
| padding: 0px; | |
| } | |
| .ok-button { | |
| background-color: #28C896; | |
| width: 200px !important; | |
| border-radius: 20px; | |
| } | |
| .back-button { | |
| background-color: #FFFFFF; | |
| width: 200px !important; | |
| border-radius: 20px; | |
| } | |
| .secondary.svelte-1ixn6qd { | |
| background: linear-gradient(#28C896, #96E600); | |
| color: #FFFFFF; | |
| border-radius: 40px; | |
| width: 200px !important; | |
| } | |
| input[type=number].svelte-7ha85a.svelte-7ha85a { | |
| background-color: #FFFFFF; | |
| color: #000000 !important; | |
| } | |
| .culture-box { | |
| background-color: #FFFFFF; | |
| color: #000000 !important; | |
| } | |
| .block.svelte-11xb1hd{ | |
| background-color: #FFFFFF !important; | |
| color: #000000 !important; | |
| } | |
| .culture_box { | |
| background-color: #FFFFFF !important; | |
| color: #000000 !important; | |
| } | |
| .wrap.svelte-1hfxrpf.svelte-1hfxrpf { | |
| background-color: #FFFFFF !important; | |
| color: #000000 !important; | |
| } | |
| input.svelte-1hfxrpf.svelte-1hfxrpf { | |
| background-color: #FFFFFF !important; | |
| color: #000000 !important; | |
| } | |
| .svelte-1hfxrpf{ | |
| background-color: #FFFFFF !important; | |
| color: #000000 !important; | |
| } | |
| button.svelte-1tcem6n.svelte-1tcem6n:hover:not(:disabled):not(.selected) { | |
| background-color: #28C896; | |
| } | |
| textarea.svelte-173056l.svelte-173056l { | |
| color: #000000 !important; | |
| } | |
| .primary.svelte-1ixn6qd{ | |
| background: #FFFFFF; | |
| color: #000000; | |
| border-radius: 40px; | |
| width: 200px !important; | |
| border: solid 1px; | |
| border-color: #000000; | |
| } | |
| .primary.svelte-1ixn6qd:hover,.primary[disabled].svelte-1ixn6qd { | |
| background: #3f3f46; | |
| } | |
| .primary.svelte-1ixn6qd:hover { | |
| border-color: #000000; | |
| border-shadow: #000000; | |
| } | |
| .secondary.svelte-1ixn6qd:hover,.secondary[disabled].svelte-1ixn6qd { | |
| background: var(--button-secondary-background-fill-hover); | |
| color: var(--button-secondary-text-color-hover) | |
| } | |
| h3 { | |
| color:black !important; | |
| } | |
| h4 { | |
| color:black !important; | |
| } | |
| ul { | |
| color:black !important; | |
| } | |
| li { | |
| color:black !important; | |
| } | |
| strong { | |
| color:black !important; | |
| } | |
| .options.svelte-y6qw75 { | |
| background-color: #FFFFFF; | |
| border-color: #000000; | |
| } | |
| .item.svelte-y6qw75:hover,.active.svelte-y6qw75 { | |
| background: #c0c0c0; | |
| } | |
| </style> | |
| """ | |
| ) | |
| demo.title = "Démo GAIA - Les bénéfices de l'ombrage" | |
| gr.HTML( | |
| "<h1 style='text-align: center; color: #000000; font-size:xx-large'>Les bénéfices de l'ombrage</h1>" | |
| ) | |
| gr.HTML( | |
| "<p style='color: #000000; font-size:x-large; font-weight: 700'>Découvrez le potentiel de l'ombrage sur votre exploitation !</p>" | |
| ) | |
| with gr.Blocks() as infos: | |
| infos.title = "Informations sur votre exploitation" | |
| gr.HTML( | |
| "<h2 style='color: #000000'>Renseignez les informations relatives à votre projet</h2>" | |
| ) | |
| with gr.Row(equal_height=True): | |
| with gr.Column( | |
| variant="panel", scale=1, elem_classes=["white-background"] | |
| ): | |
| with gr.Row(equal_height=True, elem_classes=["card"]): | |
| with gr.Tab(label="Adresse", scale=1, elem_classes="tab"): | |
| address = gr.Textbox( | |
| label="Addresse", | |
| placeholder="Entrez une adresse", | |
| elem_classes=["adress-card"], | |
| ) | |
| with gr.Tab(label="Coordonnées GPS", scale=1): | |
| lat = gr.Number( | |
| label="Latitude", elem_classes=["white-background"] | |
| ) | |
| lon = gr.Number( | |
| label="Longitude", elem_classes=["white-background"] | |
| ) | |
| place_btn = gr.Button( | |
| value="Valider la localisation", | |
| size="md", | |
| elem_classes=["ok-button"], | |
| ) | |
| place_cancel_btn = gr.Button( | |
| value="Réinitialiser la localisation", | |
| size="md", | |
| elem_classes=["back-button"], | |
| variant="primary", | |
| ) | |
| with gr.Row(elem_classes=["card"]): | |
| culture = gr.Dropdown( | |
| label="Culture", | |
| scale=1, | |
| elem_classes="culture_box", | |
| choices=[ | |
| "Blé tendre d'hiver", | |
| "Colza d'hiver", | |
| "Orge d'hiver", | |
| ], | |
| ) | |
| with gr.Column(variant="panel", scale=3): | |
| map = gr.HTML() | |
| simulation_btn = gr.Button( | |
| value="Lancer la simulation", size="md", elem_classes=["ok-button"] | |
| ) | |
| gr.HTML( | |
| "<p style='font-size:small;'>* Quand vous lancez une simulation, soyez patient: on calcule pour vous...</p>" | |
| ) | |
| go_to_page_2_btn = gr.Button( | |
| "Aller aux résultats", | |
| visible=False, | |
| elem_classes=["ok-button"], | |
| variant="primary", | |
| ) | |
| page_2 = gr.Column(visible=False) | |
| with page_2: | |
| with gr.Blocks() as results: | |
| gr.HTML( | |
| "<h2 style='padding: 30px; color: #000000'>Résultats de la simulation : les conséquences du changement climatique pour l'exploitation jusqu'en 2099</h2>" | |
| ) | |
| go_to_page_1_btn = gr.Button( | |
| value="Retour", | |
| size="md", | |
| elem_classes=["back-button"], | |
| variant="primary", | |
| ) | |
| with gr.Row(equal_height=True, elem_classes="result-page"): | |
| with gr.Tab(label="Prévisions climatiques", scale=1): | |
| with gr.Column(elem_classes="box"): | |
| with gr.Row(): | |
| gr.HTML( | |
| "<h2 style='color: #000000'>Prévisions climatiques</h2>" | |
| ) | |
| with gr.Row(): | |
| plot_1 = gr.Plot() | |
| with gr.Row(): | |
| plot_2 = gr.Plot() | |
| with gr.Row(): | |
| plot_3 = gr.Plot() | |
| with gr.Tab( | |
| label="Prévisions pour l'exploitation sans ombrage", scale=1 | |
| ): | |
| with gr.Row(elem_classes="box"): | |
| with gr.Column(): | |
| gr.HTML( | |
| "<h2 style='color: #000000'>Prévisions spécifiques à l'exploitation, sans solution d'ombrage</h2>" | |
| ) | |
| current_situation_summary = gr.Markdown( | |
| elem_classes="summary" | |
| ) | |
| with gr.Row(elem_classes="box"): | |
| with gr.Column(): | |
| gr.HTML( | |
| "<h2 style='color: #000000'>Déficit hydrique</h2>" | |
| ) | |
| plot_4 = gr.Plot() | |
| with gr.Column(): | |
| gr.HTML("<h2 style='color: #000000'>Rendements</h2>") | |
| current_plot_yields = gr.Plot() | |
| with gr.Tab( | |
| label="Prévisions pour l'exploitation avec ombrage", scale=1 | |
| ): | |
| with gr.Row(elem_classes="box"): | |
| with gr.Column(): | |
| gr.HTML( | |
| "<h2 style='color: #000000'>Synthèse des bénéfices pour l'exploitation suite à la mise en place d'une solution d'ombrage</h2>" | |
| ) | |
| agripv_summary = gr.Markdown(elem_classes="summary") | |
| with gr.Row(elem_classes="box"): | |
| with gr.Column(): | |
| gr.HTML( | |
| "<h2 style='color: #000000'>Déficit hydrique</h2>" | |
| ) | |
| plot_5 = gr.Plot() | |
| with gr.Column(): | |
| gr.HTML("<h2 style='color: #000000'>Rendements</h2>") | |
| shaded_plot_yields = gr.Plot() | |
| demo.load(on_init, [lat, lon, address], [lat, lon, map]) | |
| place_btn.click(on_init, [lat, lon, address], [lat, lon, map]) | |
| place_cancel_btn.click(on_delete, [lat, lon, map], [lat, lon, address, map]) | |
| go_to_page_2_btn.click( | |
| fn=go_to_page_2, | |
| inputs="", | |
| outputs=[page_1, page_2], | |
| ) | |
| go_to_page_1_btn.click( | |
| fn=go_to_page_1, | |
| inputs="", | |
| outputs=[page_1, page_2], | |
| ) | |
| simulation_btn.click( | |
| launch_simulation, | |
| [lat, lon, address, culture], | |
| [ | |
| current_situation_summary, | |
| agripv_summary, | |
| plot_1, | |
| plot_2, | |
| plot_3, | |
| plot_4, | |
| plot_5, | |
| current_plot_yields, | |
| shaded_plot_yields, | |
| page_1, | |
| page_2, | |
| go_to_page_2_btn, | |
| ], | |
| ) | |
| demo.title = "Démo GAIA - Les bénéfices de l'ombrage" | |
| demo.launch() | |