import streamlit as st ss = st.session_state gc_formula_k = "short" gc_full_key = "full name" GC_FULL_NAMES = ['Hydrogen sulphide', 'Carbone dioxide', 'Nitrogen', 'Methane', 'Ethane', 'Propane', 'N-butane', 'Iso-butane', 'N-pentane', 'Iso-pentane', 'N-hexane', 'N-heptane', 'C7_PLUS_', 'Hydrogen', 'Air', 'Water', 'Oxygen'] GC_SHORT_NAMES = ['H2S', 'CO2', 'N2', "C1", "C2", "C3", "nC4", "iC4", "nC5", "iC5", "C6", "C7", "C7_PLUS_", "H2", "Air", "H2O", "O2"] GC_NAMES = [] for full_name, short_name in zip(GC_FULL_NAMES, GC_SHORT_NAMES): GC_NAMES.append({gc_full_key: full_name, gc_formula_k: short_name}) hydrocarbons = GC_NAMES[3:13] non_hc = GC_NAMES[:3] add_non_hc = GC_NAMES[13:] sg_k = 'sg_value' pc_k = 'p_crit_value' tc_k = 't_crit_value' recf_k = 'recf' lg_k = 'lg' if recf_k not in ss: ss[recf_k] = 1.04 for key in [sg_k, pc_k, tc_k, lg_k]: if key not in ss: ss[key] = 0 if st.button("Calculate"): ss[sg_k] = 30 ss[tc_k] = 15 ss[pc_k] = 20 ss[recf_k] = ss[lg_k]*1.2 UD = "User defined" CONDENSATE = "Condensate" SG_LIST = [UD, "Gas components", CONDENSATE] SG_UD, SG_GC, SG_CON = SG_LIST sg_source = st.selectbox("sg source", SG_LIST) if sg_source == UD: user_input = st.text_input("sg", value=ss[sg_k], key="input_field") ss[sg_k] = user_input else: st.text_input("sg", value=ss[sg_k], key="input_field", disabled=True, help="Calculated") if sg_source == SG_CON: with st.expander(label="Condensate", expanded=True): st.text_input("surface avg gas sg", value=0.74, key="avg sg") ss[lg_k] = float(st.text_input("liquid gravity", value=0.8, key="lg_key")) st.text_input("GOR", value=16630, key="gor") st.text_input("Recombination factor", value=ss[recf_k], key="recf_key", disabled=True, help="Calculated") def text_for_gc(col, gc): # Generate unique class names for each image hover_class = f'hoverable_{gc[gc_formula_k]}' tooltip_class = f'tooltip_{gc[gc_formula_k]}' # Define the unique CSS for each image hover_css = f''' .{hover_class} {{ display: flex; flex-direction: column; justify-content: center; height: 38px; }} .{hover_class} .{tooltip_class} {{ visibility: hidden; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); transition: opacity 0.5s; background-color: rgba(0, 0, 0, 0.8); color: #fff; padding: 4px; border-radius: 4px; text-align: center; white-space: nowrap; }} .{hover_class}:hover .{tooltip_class} {{ visibility: visible; }} ''' tooltip_css = f"" # Define the html for each image text_div = f'''