File size: 4,038 Bytes
01032e6
 
cee7b68
01032e6
cee7b68
01032e6
cee7b68
 
 
 
 
 
 
 
 
 
 
01032e6
 
 
 
 
cee7b68
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
01032e6
 
 
cee7b68
01032e6
 
 
 
 
cee7b68
 
01032e6
76b0c65
cee7b68
 
01032e6
cee7b68
01032e6
 
 
cee7b68
 
 
 
 
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
import streamlit as st
import json
from pathlib import Path

st.set_page_config(page_title="Shader + Comments JSON", layout="wide")

st.title("🌀 Shader + Comments (Hugging Face Ready)")

# -------------------------------
# Use /data folder for persistent storage
# -------------------------------
DATA_DIR = Path("./data")
DATA_DIR.mkdir(exist_ok=True)
COMMENTS_FILE = DATA_DIR / "comments.json"

# Load existing comments
if COMMENTS_FILE.exists():
    with open(COMMENTS_FILE, "r") as f:
        comments = json.load(f)
else:
    comments = []

# -------------------------------
# Determine current shader
# -------------------------------
shader_code_default = """
precision mediump float;
uniform vec2 iResolution;
uniform float iTime;

void mainImage(out vec4 fragColor, in vec2 fragCoord) {
    vec2 uv = fragCoord / iResolution.xy;
    vec3 col = 0.5 + 0.5*cos(iTime + uv.xyx + vec3(0,2,4));
    fragColor = vec4(col,1.0);
}
void main() { mainImage(gl_FragColor, gl_FragCoord.xy); }
"""

latest_shader = shader_code_default
for c in reversed(comments):
    if c.get("type") == "shader":
        latest_shader = c["content"]
        break

# -------------------------------
# Shader editor
# -------------------------------
shader_code = st.text_area("Shader Code (GLSL Fragment Shader)", latest_shader, height=250)

# -------------------------------
# WebGL Canvas
# -------------------------------
html_code = f"""
<canvas id="glcanvas" width="800" height="500"></canvas>
<script>
const canvas = document.getElementById('glcanvas');
const gl = canvas.getContext('webgl');
if (!gl) {{
  alert('WebGL not supported');
}}

const vertCode = `
attribute vec4 a_position;
void main() {{
  gl_Position = a_position;
}}
`;

const fragCode = `{shader_code}`;

function createShader(gl, type, source) {{
  const shader = gl.createShader(type);
  gl.shaderSource(shader, source);
  gl.compileShader(shader);
  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {{
    alert(gl.getShaderInfoLog(shader));
  }}
  return shader;
}}

const vertexShader = createShader(gl, gl.VERTEX_SHADER, vertCode);
const fragmentShader = createShader(gl, gl.FRAGMENT_SHADER, fragCode);

const program = gl.createProgram();
gl.attachShader(program, vertexShader);
gl.attachShader(program, fragmentShader);
gl.linkProgram(program);
gl.useProgram(program);

const positionBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
  -1, -1, 1, -1, -1, 1,
  -1, 1, 1, -1, 1, 1
]), gl.STATIC_DRAW);

const positionLoc = gl.getAttribLocation(program, "a_position");
gl.enableVertexAttribArray(positionLoc);
gl.vertexAttribPointer(positionLoc, 2, gl.FLOAT, false, 0, 0);

const iResolution = gl.getUniformLocation(program, "iResolution");
const iTime = gl.getUniformLocation(program, "iTime");

function render(time) {{
  gl.uniform2f(iResolution, canvas.width, canvas.height);
  gl.uniform1f(iTime, time * 0.001);
  gl.drawArrays(gl.TRIANGLES, 0, 6);
  requestAnimationFrame(render);
}}

requestAnimationFrame(render);
</script>
"""

st.components.v1.html(html_code, height=520)

# -------------------------------
# Comments Section
# -------------------------------
st.markdown("---")
st.subheader("💬 Comments / Add New Shader")

##comment_type = st.radio("Type", ["Normal Comment", "New Shader"])

with st.form("comment_form", clear_on_submit=True):
    user_name = st.text_input("Your name", "")
    user_content = st.text_area("Content", "", height=80)
    submitted = st.form_submit_button("Submit")

    if submitted and user_content.strip():
        new_comment = {
            "name": user_name or "Anonymous",
            "content": user_content,
            
        }
        comments.append(new_comment)

        # Save to JSON in /data folder
        with open(COMMENTS_FILE, "w") as f:
            json.dump(comments, f, indent=2)

        st.success("Saved!")

        

# Display all comments
for c in reversed(comments):
    st.markdown(f"**{c['name']}**: {c['content']}")