tiahchia commited on
Commit
2e59aad
·
verified ·
1 Parent(s): 2d5d7e4

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +45 -13
app.py CHANGED
@@ -1,18 +1,33 @@
1
  import gradio as gr
2
 
3
- def run_web_code(code):
4
- # Escape quotes and newlines safely
 
 
 
 
 
 
 
 
 
 
5
  safe_code = code.replace('"', '"').replace('\n', ' ')
6
- # Build iframe using normal string concatenation
7
- iframe_html = (
8
- '<iframe '
9
- 'style="width:100%; height:400px; border:1px solid #ccc; border-radius:10px; background:white;" '
10
  'srcdoc="' + safe_code + '">'
11
  '</iframe>'
12
  )
13
- return iframe_html
14
 
15
- starter_code = """<!DOCTYPE html>
 
 
 
 
 
 
 
 
16
  <html>
17
  <head>
18
  <style>
@@ -28,23 +43,40 @@ button:hover { background-color: #ff8a75; }
28
  </body>
29
  </html>"""
30
 
 
 
 
 
 
 
 
31
  with gr.Blocks(css="""
32
  body { background: linear-gradient(to right, #ffe8d6, #ffd6d6); font-family: 'Poppins', sans-serif; }
33
  .gr-row { gap: 20px; }
34
  .gr-textbox { border-radius: 10px; font-family: monospace; }
35
  """) as demo:
36
- gr.Markdown("## 🎨 Fun Web Code Playground - Live Preview")
 
 
 
 
 
37
  with gr.Row():
38
  code_input = gr.Textbox(
39
  lines=20,
40
- value=starter_code,
41
- label="Type your HTML/CSS/JS here",
42
  placeholder="Start coding...",
43
  interactive=True
44
  )
45
  output_frame = gr.HTML(label="Output")
46
 
47
- # Live update whenever code_input changes
48
- code_input.change(run_web_code, inputs=code_input, outputs=output_frame)
 
 
 
 
 
49
 
50
  demo.launch()
 
1
  import gradio as gr
2
 
3
+ # Python runner
4
+ def run_python(code):
5
+ try:
6
+ local_vars = {}
7
+ exec(code, {}, local_vars)
8
+ # Convert output dict to readable string
9
+ return "\n".join(f"{k} = {v}" for k, v in local_vars.items())
10
+ except Exception as e:
11
+ return str(e)
12
+
13
+ # Web runner (HTML/CSS/JS)
14
+ def run_web(code):
15
  safe_code = code.replace('"', '&quot;').replace('\n', ' ')
16
+ return (
17
+ '<iframe style="width:100%; height:400px; border:1px solid #ccc; border-radius:10px; background:white;" '
 
 
18
  'srcdoc="' + safe_code + '">'
19
  '</iframe>'
20
  )
 
21
 
22
+ # Main runner that switches based on language
23
+ def run_code(code, lang):
24
+ if lang == "Python":
25
+ return run_python(code)
26
+ else:
27
+ return run_web(code)
28
+
29
+ # Starter templates
30
+ starter_web = """<!DOCTYPE html>
31
  <html>
32
  <head>
33
  <style>
 
43
  </body>
44
  </html>"""
45
 
46
+ starter_python = """# Try some Python code
47
+ a = 5
48
+ b = 10
49
+ c = a + b
50
+ c"""
51
+
52
+ # Gradio interface
53
  with gr.Blocks(css="""
54
  body { background: linear-gradient(to right, #ffe8d6, #ffd6d6); font-family: 'Poppins', sans-serif; }
55
  .gr-row { gap: 20px; }
56
  .gr-textbox { border-radius: 10px; font-family: monospace; }
57
  """) as demo:
58
+
59
+ gr.Markdown("## 🎨 Fun Code Playground - Python + Web Live Preview")
60
+
61
+ # Language selector
62
+ lang_selector = gr.Radio(choices=["Python", "Web (HTML/CSS/JS)"], value="Web (HTML/CSS/JS)", label="Select Language")
63
+
64
  with gr.Row():
65
  code_input = gr.Textbox(
66
  lines=20,
67
+ value=starter_web,
68
+ label="Type your code here",
69
  placeholder="Start coding...",
70
  interactive=True
71
  )
72
  output_frame = gr.HTML(label="Output")
73
 
74
+ # Update starter template when language changes
75
+ def update_template(lang):
76
+ return starter_python if lang=="Python" else starter_web
77
+ lang_selector.change(update_template, inputs=lang_selector, outputs=code_input)
78
+
79
+ # Live update on code change
80
+ code_input.change(run_code, inputs=[code_input, lang_selector], outputs=output_frame)
81
 
82
  demo.launch()