Update app.py
Browse files
app.py
CHANGED
@@ -1,157 +1,6 @@
|
|
1 |
import streamlit as st
|
2 |
|
3 |
-
import time
|
4 |
|
5 |
-
# Set page config
|
6 |
-
st.set_page_config(page_title="Floating Status Button", layout="wide")
|
7 |
-
|
8 |
-
# Initialize session state variables for tracking status
|
9 |
-
if 'processing' not in st.session_state:
|
10 |
-
st.session_state.processing = False
|
11 |
-
if 'section' not in st.session_state:
|
12 |
-
st.session_state.section = 'top'
|
13 |
-
|
14 |
-
# Functions to update state
|
15 |
-
def start_processing():
|
16 |
-
st.session_state.processing = True
|
17 |
-
|
18 |
-
def end_processing():
|
19 |
-
st.session_state.processing = False
|
20 |
-
|
21 |
-
def go_to_section(section):
|
22 |
-
st.session_state.section = section
|
23 |
-
|
24 |
-
# Add CSS for floating button
|
25 |
-
st.markdown("""
|
26 |
-
<style>
|
27 |
-
/* Floating action button style */
|
28 |
-
.float-button {
|
29 |
-
position: fixed;
|
30 |
-
width: 60px;
|
31 |
-
height: 60px;
|
32 |
-
bottom: 40px;
|
33 |
-
right: 40px;
|
34 |
-
background-color: #0066ff;
|
35 |
-
color: #FFF;
|
36 |
-
border-radius: 50px;
|
37 |
-
text-align: center;
|
38 |
-
box-shadow: 2px 2px 3px #999;
|
39 |
-
z-index: 99999;
|
40 |
-
display: flex;
|
41 |
-
justify-content: center;
|
42 |
-
align-items: center;
|
43 |
-
font-size: 16px;
|
44 |
-
text-decoration: none;
|
45 |
-
font-weight: bold;
|
46 |
-
}
|
47 |
-
|
48 |
-
.float-button.processing {
|
49 |
-
background-color: #ff9800;
|
50 |
-
animation: pulse 1.5s infinite;
|
51 |
-
}
|
52 |
-
|
53 |
-
@keyframes pulse {
|
54 |
-
0% {
|
55 |
-
transform: scale(0.95);
|
56 |
-
box-shadow: 0 0 0 0 rgba(255, 152, 0, 0.7);
|
57 |
-
}
|
58 |
-
|
59 |
-
70% {
|
60 |
-
transform: scale(1);
|
61 |
-
box-shadow: 0 0 0 10px rgba(255, 152, 0, 0);
|
62 |
-
}
|
63 |
-
|
64 |
-
100% {
|
65 |
-
transform: scale(0.95);
|
66 |
-
box-shadow: 0 0 0 0 rgba(255, 152, 0, 0);
|
67 |
-
}
|
68 |
-
}
|
69 |
-
|
70 |
-
/* Hide the default scrollbar */
|
71 |
-
::-webkit-scrollbar {
|
72 |
-
display: none;
|
73 |
-
}
|
74 |
-
</style>
|
75 |
-
""", unsafe_allow_html=True)
|
76 |
-
|
77 |
-
# Create a floating button that shows status and allows navigating to top
|
78 |
-
button_class = "float-button processing" if st.session_state.processing else "float-button"
|
79 |
-
button_text = "⌛" if st.session_state.processing else "⬆️"
|
80 |
-
|
81 |
-
# Use a dummy button to navigate
|
82 |
-
st.markdown(f"""
|
83 |
-
<a href="#top" class="{button_class}" id="status-float-button">{button_text}</a>
|
84 |
-
""", unsafe_allow_html=True)
|
85 |
-
|
86 |
-
# Main content with sections and navigation
|
87 |
-
st.title("App with Floating Status", anchor="top")
|
88 |
-
st.write("This app demonstrates a floating status button that also lets you navigate back to top")
|
89 |
-
|
90 |
-
# Create navigation tabs
|
91 |
-
tabs = st.tabs(["Section 1", "Section 2", "Section 3"])
|
92 |
-
|
93 |
-
with tabs[0]:
|
94 |
-
st.header("Section 1")
|
95 |
-
st.write("Content for section 1")
|
96 |
-
|
97 |
-
# Add a button that triggers processing
|
98 |
-
if st.button("Start Process 1", on_click=start_processing):
|
99 |
-
with st.spinner("Running process..."):
|
100 |
-
# Simulate work
|
101 |
-
progress = st.progress(0)
|
102 |
-
for i in range(100):
|
103 |
-
time.sleep(0.02)
|
104 |
-
progress.progress(i + 1)
|
105 |
-
end_processing()
|
106 |
-
st.success("Process 1 completed!")
|
107 |
-
|
108 |
-
# Add content for scrolling
|
109 |
-
for i in range(10):
|
110 |
-
st.write(f"Content line {i} in section 1")
|
111 |
-
|
112 |
-
with tabs[1]:
|
113 |
-
st.header("Section 2")
|
114 |
-
st.write("Content for section 2")
|
115 |
-
|
116 |
-
# Add a button that triggers processing
|
117 |
-
if st.button("Start Process 2", on_click=start_processing):
|
118 |
-
with st.spinner("Running process..."):
|
119 |
-
# Simulate more complex work
|
120 |
-
progress = st.progress(0)
|
121 |
-
for i in range(100):
|
122 |
-
time.sleep(0.03)
|
123 |
-
progress.progress(i + 1)
|
124 |
-
end_processing()
|
125 |
-
st.success("Process 2 completed!")
|
126 |
-
|
127 |
-
# Add content for scrolling
|
128 |
-
for i in range(10):
|
129 |
-
st.write(f"Content line {i} in section 2")
|
130 |
-
|
131 |
-
with tabs[2]:
|
132 |
-
st.header("Section 3")
|
133 |
-
st.write("Content for section 3")
|
134 |
-
|
135 |
-
# Add a button that triggers processing
|
136 |
-
if st.button("Start Process 3", on_click=start_processing):
|
137 |
-
with st.spinner("Running process..."):
|
138 |
-
# Simulate complex work
|
139 |
-
progress = st.progress(0)
|
140 |
-
for i in range(100):
|
141 |
-
time.sleep(0.04)
|
142 |
-
progress.progress(i + 1)
|
143 |
-
end_processing()
|
144 |
-
st.success("Process 3 completed!")
|
145 |
-
|
146 |
-
# Add content for scrolling
|
147 |
-
for i in range(10):
|
148 |
-
st.write(f"Content line {i} in section 3")
|
149 |
-
|
150 |
-
# Add more content to ensure sufficient scrolling
|
151 |
-
st.markdown("---")
|
152 |
-
st.header("Additional Content")
|
153 |
-
for i in range(20):
|
154 |
-
st.write(f"Additional content line {i}")
|
155 |
|
156 |
# --- SHARED ON ALL PAGES ---
|
157 |
st.logo(image="images/menu_book_60dp_75FBFD.png")
|
|
|
1 |
import streamlit as st
|
2 |
|
|
|
3 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
4 |
|
5 |
# --- SHARED ON ALL PAGES ---
|
6 |
st.logo(image="images/menu_book_60dp_75FBFD.png")
|