Javascript text input editing: How to turn multiple string text shader in one text input into another representation?

Question

So I want to have 2 input feilds, one editable. I need some script that would turn such shader text input:

    #ifdef GL_ES
    precision highp float;
    #endif

    varying vec4 v_color;

    void main (void)
    {
      gl_FragColor = v_color; 
    }

into such output:

    "#ifdef GL_ES\n"
    "precision highp float;\n"
    "#endif\n"
    "\n"
    "varying vec4 v_color;\n"
    "\n"
    "void main (void)\n"
    "{\n"
    "    gl_FragColor = v_color;    \n"
    "}"

(such output can be turned into openGL shader static char* )

So how to create such simple tool with Javascript?

Answer 1

try regular expressions.

html:

<textarea id="text1">#ifdef GL_ES
precision highp float;
#endif

varying vec4 v_color;

void main (void)
{
gl_FragColor = v_color;
}
</textarea>
<textarea id="text2"></textarea>

javascript:

var text = document.getElementById("text1").value;
text = text.replace(/\n/g, "\\n\"\n\"");
document.getElementById("text2").value = "\""+text+"\\n\"";

http://jsfiddle.net/t9sgA/1/