Update app2.py

app2.py

@@ -1,6 +1,4 @@
 import panel as pn
-from panel import Tabs
-
 pn.extension('katex')
 
 import pytz
@@ -25,26 +23,19 @@ paper_list = []  # Add this line to initialize paper_list as an empty list
 
 main_body = [pn.pane.LaTeX("Please select some tags!", styles={'font-size': '20pt'})]
 
-# Create the content for each tab
-tab1_content = MainBody(main_body=[pn.pane.LaTeX("Home Tab Content", styles={'font-size': '20pt'})])
-tab2_content = MainBody(main_body=[pn.pane.LaTeX("My Papers Tab Content", styles={'font-size': '20pt'})])
-
-# Create the Tabs widget and add the tab content
-tabs = Tabs(
-    ("", tab1_content.update),
-    ("", tab2_content.update),
-    tabs_location='above'  # Hide labels by placing tabs above the content
-)
-
+# Create buttons for the toggleable sidebar
+# button1 = pn.widgets.Button(name="🏠 Home", button_type='default', button_style='outline', width=140)
+# button2 = pn.widgets.Button(name='📁 My papers', button_type='default', button_style='outline', width=140)
+# button3 = pn.widgets.Toggle(name='⚙️ Settings', button_type='default', button_style='outline', width=140, value=False)
 
 # Create buttons for the toggleable sidebar
-button1 = pn.widgets.Button(icon='home', name="Daily papers", icon_size='1.5em', button_type='primary', button_style='outline', width=140)
-button2 = pn.widgets.Button(icon='calendar-filled', name="Search papers", icon_size='1.5em', button_type='primary', button_style='outline', width=140)
-button3 = pn.widgets.Button(icon='file-analytics', name='My papers', icon_size='1.5em', button_type='primary', button_style='outline', width=140)
-button4 = pn.widgets.Toggle(name='Accessibility', icon='settings', icon_size='1.5em', button_type='default', button_style='outline', width=140, value=False)
+button1 = pn.widgets.Button(icon='home', name="Daily papers", icon_size='1.5em', button_type = 'primary', button_style = 'outline', width = 140)
+button2 = pn.widgets.Button(icon='calendar-filled', name="Search papers", icon_size='1.5em', button_type = 'primary', button_style = 'outline', width = 140)
+button3 = pn.widgets.Button(icon='file-analytics', name='My papers', icon_size='1.5em', button_type = 'primary', button_style = 'outline', width = 140)
+button4 = pn.widgets.Toggle(name='Accessibility',icon='settings', icon_size='1.5em', button_type='default', button_style='outline', width=140, value=False)
 
 # Custom RadioButtonGroup widget
-select = pn.widgets.RadioButtonGroup(value="Scientic", options=["General", "Scientic"], name='String', align='center', button_type='default')
+select = pn.widgets.RadioButtonGroup(value="Scientic", options=["General", "Scientic"], name='String', align='center', button_type='default') # , align='center'
 select2 = pn.widgets.RadioButtonGroup(value="Normal", options=["Bionic", "Normal"], name='String', align='center', button_type='default')
 
 # Define a callback to display the selected value
@@ -55,6 +46,7 @@ def display_selected_value(event):
 select.param.watch(display_selected_value, 'value')
 select2.param.watch(display_selected_value, 'value')
 
+
 # Create a column layout for the buttons inside the toggleable sidebar
 buttons = pn.Column(
     button1, button2, button3,
@@ -73,6 +65,36 @@ def toggle_settings(event):
 
 button3.param.watch(toggle_settings, 'value')
 
+# Function to update the main panel content when button1 is pressed
+def update_main_panel_button1(event):
+    main_panel.clear()  # Clear the existing main panel content
+    main_panel.append(pn.pane.Markdown("You pressed button1!"))
+
+# Function to update the main panel content when button3 is pressed
+def update_main_panel_button3(event):
+    main_panel.clear()  # Clear the existing main panel content
+    main_panel.append(pn.pane.Markdown("You pressed button3!"))
+
+# Attach the functions to the on_click event of button1 and button3
+button1.on_click(update_main_panel_button1)
+button3.on_click(update_main_panel_button3)
+
+# Create the main panel with some initial content
+main_panel = pn.Column(pn.pane.Markdown("# Main Panel"))
+
+# Define a callback to show/hide the select buttons when "Settings" button is toggled
+def toggle_date_picker(event):
+    if event.new:
+        # Create a FloatPanel and place the DatePicker inside it
+        float_panel = pn.layout.FloatPanel(date_picker, name="Free Floating FloatPanel", contained=False, position='bottom_left')
+        float_panel.show()
+    else:
+        # Remove any existing FloatPanel if the toggle is set to False
+        try:
+            float_panel.close()
+        except NameError:
+            pass
+
 # List to store the entered options
 loaded_dict = TLDR.load_categories()
 
@@ -83,7 +105,7 @@ entered_options = list(loaded_dict.values())
 header_buttons = pn.Row(sizing_mode='stretch_width', css_classes=['header-buttons'])
 
 # "+" button to trigger the addition to the header
-add_to_header_button = pn.widgets.Button(name="", icon='search', icon_size='1.5em', button_style='outline', button_type='light')
+add_to_header_button = pn.widgets.Button(name="", icon='search', icon_size='1.5em', button_style = 'outline',button_type = 'light')
 
 # List to store the names of buttons to be added to the header
 buttons_to_add = []
@@ -114,7 +136,7 @@ def update_header():
     header_buttons.clear()  # Clear the existing buttons
 
     for button_name in buttons_to_add:
-        header_button = pn.widgets.Button(name=button_name, button_type='primary', button_style='outline')
+        header_button = pn.widgets.Button(name=button_name, button_type = 'primary', button_style = 'outline')
         header_button.on_click(remove_from_header)  # Add callback to remove the header button
         header_buttons.append(header_button)
     buttons_to_add
@@ -148,27 +170,15 @@ filter_list = pn.widgets.MultiChoice(
 template = pn.template.FastListTemplate(
     title="EasySciRead",
     header=[pn.Row(header_buttons, width=750, sizing_mode='stretch_width'), pn.Row(filter_list, width=250), pn.Row(add_to_header_button, width=55)],
-    main=tabs,  # Use the Tabs widget here
+    main= main_body_instance.update,
     sidebar=[buttons],
     accent_base_color="#88d8b0",
     header_background="#FFFFFF",
     header_color="#000000",
     text_align='center',
-    sidebar_width=200,
-    sizing_mode='stretch_both'  # Adjust sizing mode if needed
+    sidebar_width=160,
+    sizing_mode = 'stretch_both'
 )
 
-# CSS customization to hide tab labels
-css_style = """
-<style>
-.pn-TabBar-tabs {
-    color: transparent;
-}
-</style>
-"""
-
-# Add the CSS style to the template
-template.add_html(css_style)
-
 # Run the app
-template.servable()
+template.servable()