Update app.py

app.py

@@ -177,6 +177,28 @@ async def fetch_space_file_content(space_url, file_path):
     except Exception as e:
         return f"Error: {e}"
 
+# CodePen to Text Converter
+async def fetch_codepen_project(codepen_url):
+    """Fetches the HTML, CSS, and JavaScript content from a CodePen project."""
+    try:
+        # Extract the project ID from the URL
+        if "codepen.io" not in codepen_url:
+            return "Error: Please enter a valid CodePen URL.", "", ""
+
+        # Fetch the CodePen project page
+        response = await asyncio.to_thread(requests.get, codepen_url, timeout=5)
+        response.raise_for_status()
+        soup = BeautifulSoup(response.text, "html.parser")
+
+        # Extract HTML, CSS, and JS content
+        html_content = soup.find("textarea", {"id": "html-input"}).text if soup.find("textarea", {"id": "html-input"}) else ""
+        css_content = soup.find("textarea", {"id": "css-input"}).text if soup.find("textarea", {"id": "css-input"}) else ""
+        js_content = soup.find("textarea", {"id": "js-input"}).text if soup.find("textarea", {"id": "js-input"}) else ""
+
+        return html_content, css_content, js_content
+    except Exception as e:
+        return f"Error: {e}", "", ""
+
 # Create the Gradio interface
 with gr.Blocks() as demo:
     gr.HTML(copy_button_html)  # Add the "Copy Code" script
@@ -279,5 +301,30 @@ with gr.Blocks() as demo:
                 outputs=[space_content_output]
             )
 
+        # Tab 4: CodePen to Text Converter
+        with gr.Tab("CodePen to Text Converter"):
+            gr.Markdown("## CodePen to Text Converter")
+            gr.Markdown("Enter a CodePen project URL to fetch its HTML, CSS, and JavaScript content.")
+            
+            with gr.Row():
+                codepen_url_input = gr.Textbox(label="CodePen URL", placeholder="https://codepen.io/.../pen/...")
+            
+            with gr.Row():
+                html_output = gr.Textbox(label="HTML Content", interactive=True, elem_id="html-output")
+                css_output = gr.Textbox(label="CSS Content", interactive=True, elem_id="css-output")
+                js_output = gr.Textbox(label="JavaScript Content", interactive=True, elem_id="js-output")
+            
+            with gr.Row():
+                gr.HTML("<button onclick='copyCode(\"html-output\")'>Copy HTML</button>")
+                gr.HTML("<button onclick='copyCode(\"css-output\")'>Copy CSS</button>")
+                gr.HTML("<button onclick='copyCode(\"js-output\")'>Copy JS</button>")
+            
+            submit_codepen_button = gr.Button("Fetch CodePen Content")
+            submit_codepen_button.click(
+                fn=fetch_codepen_project,
+                inputs=[codepen_url_input],
+                outputs=[html_output, css_output, js_output]
+            )
+
 # Launch the interface
 demo.launch()