Spaces:
Running
Running
File size: 7,237 Bytes
b745ed4 a10fd3d b004a26 b745ed4 fa3acc1 2e59aad b004a26 2e59aad b004a26 2e59aad b004a26 2e59aad 1df8851 2e59aad 1df8851 7914ef5 1df8851 7914ef5 1df8851 7914ef5 a28fac5 1df8851 a28fac5 1df8851 a28fac5 c799faa 75abf31 fa3acc1 2e59aad 75abf31 2e59aad fa3acc1 b0b7ebc e367e85 b004a26 b0b7ebc 7914ef5 c799faa 75abf31 fa3acc1 e4d445f 0ad07c3 139e5e1 e4d445f fa3acc1 75abf31 1c07e28 7a8a0c7 fa3acc1 e4d445f fa3acc1 35420fd fa3acc1 0ad07c3 fa3acc1 e4d445f fa3acc1 0ad07c3 008a245 0ad07c3 fa3acc1 e4d445f c9e4dc1 fa3acc1 e4d445f fa3acc1 e4d445f 2d5d7e4 2e59aad fa3acc1 e4d445f fa3acc1 e4d445f fa3acc1 e4d445f fa3acc1 e4d445f fa3acc1 e4d445f fa3acc1 0ad07c3 a6ab6b1 0ad07c3 7914ef5 7463ba8 75abf31 7463ba8 9ab2a4e b0b7ebc 7914ef5 7a8a0c7 e367e85 7463ba8 e367e85 7463ba8 fa3acc1 7463ba8 b0b7ebc 07f8bf6 fa3acc1 0ad4bec 744edd0 7914ef5 2e59aad 75abf31 7463ba8 07f8bf6 b0b7ebc c799faa |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 |
import gradio as gr
import html
import io
from contextlib import redirect_stdout
# --- Python runner ---
def run_python(code):
f = io.StringIO()
try:
with redirect_stdout(f):
exec(code, {}, {})
except Exception as e:
f.write(str(e))
output = f.getvalue()
return f'<pre style="color:#00ff00; font-family: monospace;">{html.escape(output)}</pre>'
# --- Web runner (working sandbox-safe version) ---
def run_web(code):
# Wrap HTML fragment in full document if needed
if "<html" in code.lower() or "<!doctype" in code.lower():
html_content = code
else:
html_content = f"""
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<style>
body {{
font-family: monospace;
background: #1e1e1e;
color: #00ff00;
padding: 20px;
}}
a {{
color: #00ffff;
}}
img {{
border-radius: 8px;
margin-top: 10px;
}}
button {{
background-color: #00ff00;
color: #1e1e1e;
border: none;
border-radius: 4px;
padding: 6px 12px;
cursor: pointer;
margin-top: 10px;
}}
button:hover {{
background-color: #00cc00;
}}
</style>
</head>
<body>
{code}
</body>
</html>
"""
# Escape quotes for safe embedding
safe_html = html_content.replace('"', """).replace("'", "'")
# Allow interactive content inside iframe safely
return f"""
<iframe
style="width:100%; height:400px; border:none; border-radius:8px; background:#1e1e1e;"
sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
srcdoc="{safe_html}">
</iframe>
"""
# --- JavaScript runner ---
def run_js(code):
return f'<iframe style="width:100%; height:100%; border:none; border-radius:8px; background:#1e1e1e;" srcdoc="<script>{html.escape(code)}</script>"></iframe>'
# --- Bash runner (simulated) ---
def run_bash(code):
return f'<pre style="color:#00ff00; font-family: monospace;">$ {html.escape(code)}\nCommand simulated.</pre>'
# --- Main runner ---
def run_code(code, lang):
if lang == "Python":
return run_python(code)
elif lang == "JavaScript":
return run_js(code)
elif lang == "Bash":
return run_bash(code)
else:
return run_web(code)
# --- Starter templates ---
starter_python = """# Python example
print("Hello World!")
for i in range(5):
print(f"Line {i+1}")"""
starter_web = """<h1 style="background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
-webkit-background-clip: text; color: transparent;">
Hello, Rainbow World!
</h1>"""
starter_js = """// JavaScript example
console.log("Hello JavaScript!");
for(let i=0;i<5;i++){
console.log("Line "+(i+1));
}"""
starter_bash = """# Bash example
echo "Hello Bash!"
for i in {1..5}; do
echo "Line $i"
done"""
# --- Gradio app ---
with gr.Blocks(css="""
body {
margin:0; padding:0;
font-family:'Poppins', sans-serif;
overflow-x:hidden;
color:#e0e0e0;
background: linear-gradient(to bottom, #0a0a23, #1a0a3a, #00001a);
}
.gradio-container { max-width:1200px; margin:auto; padding:20px; }
.gr-column { display:flex; flex-direction: column; gap:8px !important; }
#editor-container, #output-panel {
width:100% !important;
margin:0 !important;
padding:8px !important;
border-radius:8px;
box-sizing:border-box;
}
#output-panel {
height:150px !important;
background:#1e1e1e;
color:#00ff00;
overflow:auto;
box-shadow:0 4px 8px rgba(0,0,0,0.5);
font-family: monospace;
}
#editor-container .CodeMirror {
height:300px !important;
min-height:300px !important;
font-family: monospace;
font-size:14px;
white-space: pre-wrap;
overflow-wrap: break-word;
border-radius:8px;
padding:8px !important;
}
.gr-radio { color:#e0e0e0; margin:0 0 8px 0 !important; font-size:0.95em; }
button, .gr-button { background-color:#F714C5 !important; color:#fff !important; border-radius:6px !important; padding:8px 16px !important; }
footer { display:none !important; }
header { background:#000000; padding:16px; color:#F714C5; font-size:1.4em; text-align:center; margin-top:20px; }
header img { vertical-align:middle; height:20px; margin-right:8px; }
canvas#particles { position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; }
""") as demo:
# --- Particle background ---
gr.HTML("""<canvas id="particles"></canvas>
<script>
const canvas = document.getElementById('particles');
const ctx = canvas.getContext('2d');
let stars = [];
function resize(){ canvas.width = window.innerWidth; canvas.height = window.innerHeight; }
window.addEventListener('resize', resize); resize();
for(let i=0;i<150;i++){
stars.push({ x: Math.random()*canvas.width, y: Math.random()*canvas.height,
r: Math.random()*1.5, dx: (Math.random()-0.5)*0.3, dy: (Math.random()-0.5)*0.3 });
}
function animate(){
ctx.clearRect(0,0,canvas.width,canvas.height);
for(let s of stars){
ctx.beginPath(); ctx.arc(s.x,s.y,s.r,0,Math.PI*2); ctx.fillStyle='white'; ctx.fill();
s.x+=s.dx; s.y+=s.dy;
if(s.x<0) s.x=canvas.width; if(s.x>canvas.width) s.x=0;
if(s.y<0) s.y=canvas.height; if(s.y>canvas.height) s.y=0;
}
requestAnimationFrame(animate);
}
animate();
</script>""")
# --- Header ---
gr.Markdown("""
<h2 style="color:#F714C5; text-align:center; margin-bottom:10px;">
πΈ'π ππππ & ππππ ππ ππ’ ππππππππ, πππππ’ ππππππ!
</h2>
""")
# --- Language selector ---
lang_selector = gr.Radio(
choices=["Python", "Web (HTML/CSS/JS)", "JavaScript", "Bash"],
value="Web (HTML/CSS/JS)",
label="Select Language"
)
# --- Output above input ---
with gr.Column():
output_frame = gr.HTML(label="Output", elem_id="output-panel")
code_input = gr.Code(
value=starter_web,
language="html",
label="Type your code here",
interactive=True,
lines=15
)
render_button = gr.Button("Render")
# --- Footer ---
gr.Markdown("""
<header>
<img src="https://simpleandstatic.com/favicon.ico" alt="Logo" />
ππππππ & ππππππ
</header>
""")
# --- Update template on language change ---
def update_template(lang):
if lang == "Python":
return starter_python
elif lang == "JavaScript":
return starter_js
elif lang == "Bash":
return starter_bash
else:
return starter_web
lang_selector.change(update_template, inputs=lang_selector, outputs=code_input)
render_button.click(run_code, inputs=[code_input, lang_selector], outputs=output_frame)
demo.launch()
|