Asked  7 Months ago    Answers:  5   Viewed   31 times

I have a little problem with my if(isset($_POST['submit'])) code. What I want is some echos and a table to not appear when the script is open but I do want it to show when the submit button for the form has been clicked. The problem is though that when I include the if(isset($_POST['submit'])) function, when I click on the submit button it does not display the echos and the table at all. Why is this and can you help me out with this issue please.

Below is the code:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>Exam Interface</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>

<p><strong>NOTE: </strong>If a search box is left blank, then the form will search for all data under that specific field</p>

<form action="exam_interface.php" method="post" name="sessionform">        <!-- This will post the form to its own page"-->
<p>Session ID: <input type="text" name="sessionid" /></p>      <!-- Enter Session Id here-->
<p>Module Number: <input type="text" name="moduleid" /></p>      <!-- Enter Module Id here-->
<p>Teacher Username: <input type="text" name="teacherid" /></p>      <!-- Enter Teacher here-->
<p>Student Username: <input type="text" name="studentid" /></p>      <!-- Enter User Id here-->
<p>Grade: <input type="text" name="grade" /></p>      <!-- Enter Grade here-->
<p>Order Results By: <select name="order">
<option value="ordersessionid">Session ID</option>
<option value="ordermoduleid">Module Number</option>
<option value="orderteacherid">Teacher Username</option>
<option value="orderstudentid">Student Username</option>
<option value="ordergrade">Grade</option>
</select>
<p><input type="submit" value="Submit" /></p>
</form>

<?php

$username="xxx";
$password="xxx";
$database="mobile_app";

mysql_connect('localhost',$username,$password);

@mysql_select_db($database) or die("Unable to select database");

$sessionid = isset ($_POST['sessionid']) ? $_POST['sessionid'] : "";
$moduleid = isset ($_POST['moduleid']) ? $_POST['moduleid'] : "";
$teacherid = isset ($_POST['teacherid']) ? $_POST['teacherid'] : "";
$studentid = isset ($_POST['studentid']) ? $_POST['studentid'] : "";
$grade = isset ($_POST['grade']) ? $_POST['grade'] : "";
$orderfield = isset ($_POST['order']) ? $_POST['order'] : "";

$sessionid = mysql_real_escape_string($sessionid);
$moduleid = mysql_real_escape_string($moduleid);
$teacherid = mysql_real_escape_string($teacherid);
$studentid = mysql_real_escape_string($studentid);
$grade = mysql_real_escape_string($grade);

switch ($orderfield) {
    case 'ordersessionid': $orderfield = 'gr.SessionId';
    break;
    case 'ordermoduleid': $orderfield = 'm.ModuleId'; 
    break;
    case 'orderteacherid': $orderfield = 's.TeacherId';
    break;
    case 'orderstudentid': $orderfield = 'gr.StudentId'; 
    break;
    case 'ordergrade': $orderfield = 'gr.Grade';
    break;
}

$ordertable = $orderfield;

$result = mysql_query("SELECT * FROM Module m INNER JOIN Session s ON m.ModuleId = s.ModuleId JOIN Grade_Report gr ON s.SessionId = gr.SessionId JOIN Student st ON gr.StudentId = st.StudentId WHERE ('$sessionid' = '' OR gr.SessionId = '$sessionid') AND ('$moduleid' = '' OR m.ModuleId = '$moduleid') AND ('$teacherid' = '' OR s.TeacherId = '$teacherid') AND ('$studentid' = '' OR gr.StudentId = '$studentid') AND ('$grade' = '' OR gr.Grade = '$grade') ORDER BY $ordertable ASC");

$num=mysql_numrows($result);

if(isset($_POST['submit'])){

echo "<p>Your Search: <strong>Session ID:</strong> "; if (empty($sessionid))echo "'All Sessions'"; else echo "'$sessionid'";echo ", <strong>Module ID:</strong> "; if (empty($moduleid))echo "'All Modules'"; else echo "'$moduleid'";echo ", <strong>Teacher Username:</strong> "; if (empty($teacherid))echo "'All Teachers'"; else echo "'$teacherid'";echo ", <strong>Student Username:</strong> "; if (empty($studentid))echo "'All Students'"; else echo "'$studentid'";echo ", <strong>Grade:</strong> "; if (empty($grade))echo "'All Grades'"; else echo "'$grade'"; "</p>";

echo "<p>Number of Records Shown in Result of the Search: <strong>$num</strong></p>";

echo "<table border='1'>
<tr>
<th>Student Id</th>
<th>Forename</th>
<th>Session Id</th>
<th>Grade</th>
<th>Mark</th>
<th>Module</th>
<th>Teacher</th>
</tr>";

while ($row = mysql_fetch_array($result)){

 echo "<tr>";
  echo "<td>" . $row['StudentId'] . "</td>";
  echo "<td>" . $row['Forename'] . "</td>";
  echo "<td>" . $row['SessionId'] . "</td>";
  echo "<td>" . $row['Grade'] . "</td>";
  echo "<td>" . $row['Mark'] . "</td>";
  echo "<td>" . $row['ModuleName'] . "</td>";
  echo "<td>" . $row['TeacherId'] . "</td>";
  echo "</tr>";
}

echo "</table>";

}

mysql_close();


 ?>

</body>
</html>

Any help will be much appreciated, Thank You.

 Answers

69

You need to give your submit <input> a name or it won't be available using $_POST['submit']:

<p><input type="submit" value="Submit" name="submit" /></p>
Wednesday, March 31, 2021
 
dzm
answered 7 Months ago
dzm
50

Because

$a = array("x" => "0");

if ($a["x"])
  echo "This branch is not executed";

if (isset($a["x"]))
  echo "But this will";

(See also http://hk.php.net/manual/en/function.isset.php and http://hk.php.net/manual/en/language.types.boolean.php#language.types.boolean.casting)

Wednesday, March 31, 2021
 
Pradip
answered 7 Months ago
85

Sadly that's the only way to do it. But there are approaches for dealing with larger arrays. For instance something like this:

$required = array('myvar', 'foo', 'bar', 'baz');
$missing = array_diff($required, array_keys($_GET));

The variable $missing now contains a list of values that are required, but missing from the $_GET array. You can use the $missing array to display a message to the visitor.

Or you can use something like that:

$required = array('myvar', 'foo', 'bar', 'baz');
$missing = array_diff($required, array_keys($_GET));
foreach($missing as $m ) {
    $_GET[$m] = null;
}

Now each required element at least has a default value. You can now use if($_GET['myvar'] == 'something') without worrying that the key isn't set.

Update

One other way to clean up the code would be using a function that checks if the value is set.

function getValue($key) {
    if (!isset($_GET[$key])) {
        return false;
    }
    return $_GET[$key];
}

if (getValue('myvar') == 'something') {
    // Do something
}
Monday, June 14, 2021
 
Gilko
answered 5 Months ago
85

I want to light to the texture plane but this is not work. Light on solid sphere is very well, but texture plane is not light.

This is an issue caused by the Gouraud Shading model of the OpenGLs standard light model. While Phong shading in common means the technique, which does the light calculations per fragment, at Gouraud Shading, the light calculations are done per vertex. The calculated light is interpolated according to the Barycentric coordinate of the fragment on the primitive.

This means that in your case the light is calculated for the corners of the ground quad. This so calculated light is interpolated for all the fragments in between. The angel of the normal vector at the corners to the light vector tends to 90°. Because of that the entire ground quad looks almost unlit.

Since the light is calculated per vertex, then the light is calculated for more positions than the the 4 corners of the quad and the quality increases. Note, the light on the spheres looks almost perfect, because a sphere consists of a lot of vertices around its shape.

Try the following code, which splits the quad into tiles:

int   tiles = 5;
float u_max = height*tile_x;
float v_max = width*tile_x

glBegin(GL_QUADS);
glNormal3f(0, 1, 0);

for (int x=0; x < tiles; ++x)
{
    for (int y=0; y < tiles; ++y)
    {
        x0 = (float)x/(float)tiles;
        x1 = (float)(x+1)/(float)tiles;
        y0 = (float)y/(float)tiles;
        y1 = (float)(y+1)/(float)tiles;

        glTexCoord2f(u_max*x0, v_max*y0);  glVertex3f(height*x0, 0, widht*y0);
        glTexCoord2f(u_max*x1, v_max*y0);  glVertex3f(height*x0, 0, widht*y1);
        glTexCoord2f(u_max*x1, v_max*y1);  glVertex3f(height*x1, 0, widht*y1);
        glTexCoord2f(u_max*x0, v_max*y1);  glVertex3f(height*x1, 0, widht*y0);
    }
}
glEnd();

Of course you can also write your own shader and implement per fragment lighting. But the deprecated fixed function pipeline OpenGL standard light model does not support per fragment lighting.

See the difference in the WebGL example:

(function loadscene() {

var resize, gl, gouraudDraw, phongDraw, vp_size;
var bufSphere = {};

function render(delteMS){

    var shading = document.getElementById( "shading" ).value;
    var shininess = document.getElementById( "shininess" ).value;
    var ambientCol = [0.2, 0.2, 0.2];
    var diffuseCol = [0.6, 0.6, 0.6];
    var specularCol = [0.8, 0.8, 0.8];

    Camera.create();
    Camera.vp = vp_size;
        
    gl.enable( gl.DEPTH_TEST );
    gl.clearColor( 0.0, 0.0, 0.0, 1.0 );
    gl.clear( gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT );

    gl.disable(gl.CULL_FACE);
    
    
    var progDraw = shading == 0 ? gouraudDraw : phongDraw;;
    // set up draw shader
    ShaderProgram.Use( progDraw.prog );
    ShaderProgram.SetUniformM44( progDraw.prog, "u_projectionMat44", Camera.Perspective() );
    ShaderProgram.SetUniformM44( progDraw.prog, "u_viewMat44", Camera.LookAt() );
    ShaderProgram.SetUniformF3( progDraw.prog, "u_lightSource.lightPos", [0.0, 0.0, 0.25] )
    ShaderProgram.SetUniformF3( progDraw.prog, "u_lightSource.ambient", ambientCol )
    ShaderProgram.SetUniformF3( progDraw.prog, "u_lightSource.diffuse", diffuseCol )
    ShaderProgram.SetUniformF3( progDraw.prog, "u_lightSource.specular", specularCol )
    ShaderProgram.SetUniformF1( progDraw.prog, "u_lightSource.shininess", shininess )
    var modelMat = IdentityMat44()
    modelMat = RotateAxis( modelMat, -1.5, 0 );
    modelMat = RotateAxis( modelMat, CalcAng( delteMS, 17.0 ), 1 );
    ShaderProgram.SetUniformM44( progDraw.prog, "u_modelMat44", modelMat );
    
    // draw scene
    VertexBuffer.Draw( bufSphere );
   
    requestAnimationFrame(render);
}

function resize() {
    //vp_size = [gl.drawingBufferWidth, gl.drawingBufferHeight];
    vp_size = [window.innerWidth, window.innerHeight]
    canvas.width = vp_size[0];
    canvas.height = vp_size[1];
    gl.viewport( 0, 0, vp_size[0], vp_size[1] );
}

function initScene() {

    canvas = document.getElementById( "canvas");
    gl = canvas.getContext( "experimental-webgl" );
    if ( !gl )
      return null;

    gouraudDraw = {}
    gouraudDraw.prog = ShaderProgram.Create( 
      [ { source : "gouraud-shader-vs", stage : gl.VERTEX_SHADER },
        { source : "gouraud-shader-fs", stage : gl.FRAGMENT_SHADER }
      ],
      [ "u_projectionMat44", "u_viewMat44", "u_modelMat44", 
        "u_lightSource.lightDir", "u_lightSource.ambient", "u_lightSource.diffuse", "u_lightSource.specular", "u_lightSource.shininess", ] );
    if ( gouraudDraw.prog == 0 )
      return;  
    gouraudDraw.inPos = gl.getAttribLocation( gouraudDraw.prog, "inPos" );
    gouraudDraw.inNV  = gl.getAttribLocation( gouraudDraw.prog, "inNV" );
    gouraudDraw.inCol = gl.getAttribLocation( gouraudDraw.prog, "inCol" );

    phongDraw = {}
    phongDraw.prog = ShaderProgram.Create( 
      [ { source : "phong-shader-vs", stage : gl.VERTEX_SHADER },
        { source : "phong-shader-fs", stage : gl.FRAGMENT_SHADER }
      ],
      [ "u_projectionMat44", "u_viewMat44", "u_modelMat44", 
        "u_lightSource.lightDir", "u_lightSource.ambient", "u_lightSource.diffuse", "u_lightSource.specular", "u_lightSource.shininess", ] );
    if ( phongDraw.prog == 0 )
      return;
    phongDraw.inPos = gl.getAttribLocation( phongDraw.prog, "inPos" );
    phongDraw.inNV  = gl.getAttribLocation( phongDraw.prog, "inNV" );
    phongDraw.inCol = gl.getAttribLocation( phongDraw.prog, "inCol" );
    
    // create cube
    var layer_size = 16, circum_size = 32;
    var rad_circum = 1.0;
    var rad_tube = 0.5;
    var sphere_pts = [-1.0, -1.0, 0.0, 1.0, -1.0, 0.0, 1.0, 1.0, 0.0, -1.0, 1.0, 0.0];
    var sphere_nv  = [0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0];
    var sphere_col = [0.8, 0.6, 0.3, 0.8, 0.6, 0.3, 0.8, 0.6, 0.3, 0.8, 0.6, 0.3];
    var sphere_inx = [0, 1, 2, 0, 2, 3];
    bufSphere = VertexBuffer.Create(
    [ { data : sphere_pts, attrSize : 3, attrLoc : gouraudDraw.inPos },
      { data : sphere_nv, attrSize : 3, attrLoc : gouraudDraw.inNV },
      { data : sphere_col, attrSize : 3, attrLoc : gouraudDraw.inCol } ],
      sphere_inx );
      
    window.onresize = resize;
    resize();
    requestAnimationFrame(render);
}

function Fract( val ) { 
    return val - Math.trunc( val );
}
function CalcAng( deltaTime, intervall ) {
    return Fract( deltaTime / (1000*intervall) ) * 2.0 * Math.PI;
}
function CalcMove( deltaTime, intervall, range ) {
    var pos = self.Fract( deltaTime / (1000*intervall) ) * 2.0
    var pos = pos < 1.0 ? pos : (2.0-pos)
    return range[0] + (range[1] - range[0]) * pos;
}    
function EllipticalPosition( a, b, angRag ) {
    var a_b = a * a - b * b
    var ea = (a_b <= 0) ? 0 : Math.sqrt( a_b );
    var eb = (a_b >= 0) ? 0 : Math.sqrt( -a_b );
    return [ a * Math.sin( angRag ) - ea, b * Math.cos( angRag ) - eb, 0 ];
}

glArrayType = typeof Float32Array !="undefined" ? Float32Array : ( typeof WebGLFloatArray != "undefined" ? WebGLFloatArray : Array );

function IdentityMat44() {
  var m = new glArrayType(16);
  m[0]  = 1; m[1]  = 0; m[2]  = 0; m[3]  = 0;
  m[4]  = 0; m[5]  = 1; m[6]  = 0; m[7]  = 0;
  m[8]  = 0; m[9]  = 0; m[10] = 1; m[11] = 0;
  m[12] = 0; m[13] = 0; m[14] = 0; m[15] = 1;
  return m;
};

function RotateAxis(matA, angRad, axis) {
    var aMap = [ [1, 2], [2, 0], [0, 1] ];
    var a0 = aMap[axis][0], a1 = aMap[axis][1]; 
    var sinAng = Math.sin(angRad), cosAng = Math.cos(angRad);
    var matB = new glArrayType(16);
    for ( var i = 0; i < 16; ++ i ) matB[i] = matA[i];
    for ( var i = 0; i < 3; ++ i ) {
        matB[a0*4+i] = matA[a0*4+i] * cosAng + matA[a1*4+i] * sinAng;
        matB[a1*4+i] = matA[a0*4+i] * -sinAng + matA[a1*4+i] * cosAng;
    }
    return matB;
}

function Cross( a, b ) { return [ a[1] * b[2] - a[2] * b[1], a[2] * b[0] - a[0] * b[2], a[0] * b[1] - a[1] * b[0], 0.0 ]; }
function Dot( a, b ) { return a[0]*b[0] + a[1]*b[1] + a[2]*b[2]; }
function Normalize( v ) {
    var len = Math.sqrt( v[0] * v[0] + v[1] * v[1] + v[2] * v[2] );
    return [ v[0] / len, v[1] / len, v[2] / len ];
}

var Camera = {};
Camera.create = function() {
    this.pos    = [0, 2, 0.0];
    this.target = [0, 0, 0];
    this.up     = [0, 0, 1];
    this.fov_y  = 90;
    this.vp     = [800, 600];
    this.near   = 0.5;
    this.far    = 100.0;
}
Camera.Perspective = function() {
    var fn = this.far + this.near;
    var f_n = this.far - this.near;
    var r = this.vp[0] / this.vp[1];
    var t = 1 / Math.tan( Math.PI * this.fov_y / 360 );
    var m = IdentityMat44();
    m[0]  = t/r; m[1]  = 0; m[2]  =  0;                              m[3]  = 0;
    m[4]  = 0;   m[5]  = t; m[6]  =  0;                              m[7]  = 0;
    m[8]  = 0;   m[9]  = 0; m[10] = -fn / f_n;                       m[11] = -1;
    m[12] = 0;   m[13] = 0; m[14] = -2 * this.far * this.near / f_n; m[15] =  0;
    return m;
}
Camera.LookAt = function() {
    var mz = Normalize( [ this.pos[0]-this.target[0], this.pos[1]-this.target[1], this.pos[2]-this.target[2] ] );
    var mx = Normalize( Cross( this.up, mz ) );
    var my = Normalize( Cross( mz, mx ) );
    var tx = Dot( mx, this.pos );
    var ty = Dot( my, this.pos );
    var tz = Dot( [-mz[0], -mz[1], -mz[2]], this.pos ); 
    var m = IdentityMat44();
    m[0]  = mx[0]; m[1]  = my[0]; m[2]  = mz[0]; m[3]  = 0;
    m[4]  = mx[1]; m[5]  = my[1]; m[6]  = mz[1]; m[7]  = 0;
    m[8]  = mx[2]; m[9]  = my[2]; m[10] = mz[2]; m[11] = 0;
    m[12] = tx;    m[13] = ty;    m[14] = tz;    m[15] = 1; 
    return m;
} 

var ShaderProgram = {};
ShaderProgram.Create = function( shaderList ) {
    var shaderObjs = [];
    for ( var i_sh = 0; i_sh < shaderList.length; ++ i_sh ) {
        var shderObj = this.CompileShader( shaderList[i_sh].source, shaderList[i_sh].stage );
        if ( shderObj == 0 )
            return 0;
        shaderObjs.push( shderObj );
    }
    var progObj = this.LinkProgram( shaderObjs )
    if ( progObj != 0 ) {
        progObj.attribIndex = {};
        var noOfAttributes = gl.getProgramParameter( progObj, gl.ACTIVE_ATTRIBUTES );
        for ( var i_n = 0; i_n < noOfAttributes; ++ i_n ) {
            var name = gl.getActiveAttrib( progObj, i_n ).name;
            progObj.attribIndex[name] = gl.getAttribLocation( progObj, name );
        }
        progObj.unifomLocation = {};
        var noOfUniforms = gl.getProgramParameter( progObj, gl.ACTIVE_UNIFORMS );
        for ( var i_n = 0; i_n < noOfUniforms; ++ i_n ) {
            var name = gl.getActiveUniform( progObj, i_n ).name;
            progObj.unifomLocation[name] = gl.getUniformLocation( progObj, name );
        }
    }
    return progObj;
}
ShaderProgram.AttributeIndex = function( progObj, name ) { return progObj.attribIndex[name]; } 
ShaderProgram.UniformLocation = function( progObj, name ) { return progObj.unifomLocation[name]; } 
ShaderProgram.Use = function( progObj ) { gl.useProgram( progObj ); } 
ShaderProgram.SetUniformI1  = function( progObj, name, val ) { if(progObj.unifomLocation[name]) gl.uniform1i( progObj.unifomLocation[name], val ); }
ShaderProgram.SetUniformF1  = function( progObj, name, val ) { if(progObj.unifomLocation[name]) gl.uniform1f( progObj.unifomLocation[name], val ); }
ShaderProgram.SetUniformF2  = function( progObj, name, arr ) { if(progObj.unifomLocation[name]) gl.uniform2fv( progObj.unifomLocation[name], arr ); }
ShaderProgram.SetUniformF3  = function( progObj, name, arr ) { if(progObj.unifomLocation[name]) gl.uniform3fv( progObj.unifomLocation[name], arr ); }
ShaderProgram.SetUniformF4  = function( progObj, name, arr ) { if(progObj.unifomLocation[name]) gl.uniform4fv( progObj.unifomLocation[name], arr ); }
ShaderProgram.SetUniformM33 = function( progObj, name, mat ) { if(progObj.unifomLocation[name]) gl.uniformMatrix3fv( progObj.unifomLocation[name], false, mat ); }
ShaderProgram.SetUniformM44 = function( progObj, name, mat ) { if(progObj.unifomLocation[name]) gl.uniformMatrix4fv( progObj.unifomLocation[name], false, mat ); }
ShaderProgram.CompileShader = function( source, shaderStage ) {
    var shaderScript = document.getElementById(source);
    if (shaderScript)
      source = shaderScript.text;
    var shaderObj = gl.createShader( shaderStage );
    gl.shaderSource( shaderObj, source );
    gl.compileShader( shaderObj );
    var status = gl.getShaderParameter( shaderObj, gl.COMPILE_STATUS );
    if ( !status ) alert(gl.getShaderInfoLog(shaderObj));
    return status ? shaderObj : null;
} 
ShaderProgram.LinkProgram = function( shaderObjs ) {
    var prog = gl.createProgram();
    for ( var i_sh = 0; i_sh < shaderObjs.length; ++ i_sh )
        gl.attachShader( prog, shaderObjs[i_sh] );
    gl.linkProgram( prog );
    status = gl.getProgramParameter( prog, gl.LINK_STATUS );
    if ( !status ) alert("Could not initialise shaders");
    gl.useProgram( null );
    return status ? prog : null;
}

var VertexBuffer = {};
VertexBuffer.Create = function( attributes, indices ) {
    var buffer = {};
    buffer.buf = [];
    buffer.attr = []
    for ( var i = 0; i < attributes.length; ++ i ) {
        buffer.buf.push( gl.createBuffer() );
        buffer.attr.push( { size : attributes[i].attrSize, loc : attributes[i].attrLoc } );
        gl.bindBuffer( gl.ARRAY_BUFFER, buffer.buf[i] );
        gl.bufferData( gl.ARRAY_BUFFER, new Float32Array( attributes[i].data ), gl.STATIC_DRAW );
    }
    buffer.inx = gl.createBuffer();
    gl.bindBuffer( gl.ELEMENT_ARRAY_BUFFER, buffer.inx );
    gl.bufferData( gl.ELEMENT_ARRAY_BUFFER, new Uint16Array( indices ), gl.STATIC_DRAW );
    buffer.inxLen = indices.length;
    gl.bindBuffer( gl.ARRAY_BUFFER, null );
    gl.bindBuffer( gl.ELEMENT_ARRAY_BUFFER, null );
    return buffer;
}
VertexBuffer.Draw = function( bufObj ) {
  for ( var i = 0; i < bufObj.buf.length; ++ i ) {
        gl.bindBuffer( gl.ARRAY_BUFFER, bufObj.buf[i] );
        gl.vertexAttribPointer( bufObj.attr[i].loc, bufObj.attr[i].size, gl.FLOAT, false, 0, 0 );
        gl.enableVertexAttribArray( bufObj.attr[i].loc );
    }
    gl.bindBuffer( gl.ELEMENT_ARRAY_BUFFER, bufObj.inx );
    gl.drawElements( gl.TRIANGLES, bufObj.inxLen, gl.UNSIGNED_SHORT, 0 );
    for ( var i = 0; i < bufObj.buf.length; ++ i )
       gl.disableVertexAttribArray( bufObj.attr[i].loc );
    gl.bindBuffer( gl.ARRAY_BUFFER, null );
    gl.bindBuffer( gl.ELEMENT_ARRAY_BUFFER, null );
}

initScene();

})();
html,body {
    height: 100%;
    width: 100%;
    margin: 0;
    overflow: hidden;
}

#gui {
    position : absolute;
    top : 0;
    left : 0;
}
<script id="gouraud-shader-vs" type="x-shader/x-vertex">
  precision mediump float;
  
  attribute vec3 inPos;
  attribute vec3 inNV;
  attribute vec3 inCol;
  
  varying vec3 vertPos;
  varying vec3 vertNV;
  varying vec3 vertCol;
  
  uniform mat4 u_projectionMat44;
  uniform mat4 u_viewMat44;
  uniform mat4 u_modelMat44;

  struct TLightSource
  {
      vec3  lightPos;
      vec3  ambient;
      vec3  diffuse;
      vec3  specular;
      float shininess;
  };

  uniform TLightSource u_lightSource;
  
  vec3 Light( vec3 eyeV, vec3 N, vec3 P )
  {
      vec3  lightCol  = u_lightSource.ambient;
      vec3  L         = normalize( u_lightSource.lightPos-P );
      float NdotL     = max( 0.0, dot( N, L ) );
      lightCol       += NdotL * u_lightSource.diffuse;
      vec3  H         = normalize( eyeV + L );
      float NdotH     = max( 0.0, dot( N, H ) );
      float kSpecular = ( u_lightSource.shininess + 2.0 ) * pow( NdotH, u_lightSource.shininess ) / ( 2.0 * 3.14159265 );
      lightCol       += kSpecular * u_lightSource.specular;
      return lightCol; 
  }
  
  void main()
  {
      vec3 modelNV  = mat3( u_modelMat44 ) * normalize( inNV );
      vertNV        = mat3( u_viewMat44 ) * modelNV;
      vec4 modelPos = u_modelMat44 * vec4( inPos, 1.0 );
      vec4 viewPos  = u_viewMat44 * modelPos;
      vertPos       = viewPos.xyz / viewPos.w;
      vec3 eyeV     = normalize( -vertPos );
      vec3 normalV  = normalize( vertNV ) * sign(vertNV.z);
      vertCol       = inCol * Light( eyeV, normalV, vertPos );
      gl_Position   = u_projectionMat44 * viewPos;
  }
  </script>
  
  <script id="gouraud-shader-fs" type="x-shader/x-fragment">
  precision mediump float;
  
  varying vec3 vertPos;
  varying vec3 vertNV;
  varying vec3 vertCol;
  
  void main()
  {
      gl_FragColor = vec4( vertCol, 1.0 );
  }
  </script>

<script id="phong-shader-vs" type="x-shader/x-vertex">
precision mediump float;

attribute vec3 inPos;
attribute vec3 inNV;
attribute vec3 inCol;

varying vec3 vertPos;
varying vec3 vertNV;
varying vec3 vertCol;

uniform mat4 u_projectionMat44;
uniform mat4 u_viewMat44;
uniform mat4 u_modelMat44;

void main()
{
  vec3 modelNV  = mat3( u_modelMat44 ) * normalize( inNV );
  vertNV        = mat3( u_viewMat44 ) * modelNV;
  vertCol       = inCol;
  vec4 modelPos = u_modelMat44 * vec4( inPos, 1.0 );
  vec4 viewPos  = u_viewMat44 * modelPos;
  vertPos       = viewPos.xyz / viewPos.w;
  gl_Position   = u_projectionMat44 * viewPos;
}
</script>

<script id="phong-shader-fs" type="x-shader/x-fragment">
precision mediump float;

varying vec3 vertPos;
varying vec3 vertNV;
varying vec3 vertCol;

struct TLightSource
{
  vec3  lightPos;
  vec3  ambient;
  vec3  diffuse;
  vec3  specular;
  float shininess;
};

uniform TLightSource u_lightSource;

vec3 Light( vec3 eyeV, vec3 N, vec3 P )
{
  vec3  lightCol  = u_lightSource.ambient;
  vec3  L         = normalize( u_lightSource.lightPos - P );
  float NdotL     = max( 0.0, dot( N, L ) );
  lightCol       += NdotL * u_lightSource.diffuse;
  vec3  H         = normalize( eyeV + L );
  float NdotH     = max( 0.0, dot( N, H ) );
  float kSpecular = ( u_lightSource.shininess + 2.0 ) * pow( NdotH, u_lightSource.shininess ) / ( 2.0 * 3.14159265 );
  lightCol       += kSpecular * u_lightSource.specular;
  return lightCol; 
}

void main()
{
  vec3 eyeV    = normalize( -vertPos );
  vec3 normalV = normalize( vertNV ) * sign(vertNV.z);
  vec3 color   = vertCol * Light( eyeV, normalV, vertPos );
  gl_FragColor = vec4( color, 1.0 );
}
</script>

<form id="gui" name="inputs"><table><tr>
    <td><font color= #CCF>Shading:</font></td> 
    <td><select id="shading">>
        <option value="0">Gouraud</option>
        <option value="1">Phong</option>
    </select></td>
    </tr><tr>
    <td><font color= #CCF>Shininess:</font></td>
    <td><input type="range" id="shininess" min="0" max="100" value="10"/></td>
</tr></table></form>
<canvas id="canvas" style="border: none;" width="100%" height="100%"></canvas>
Saturday, July 31, 2021
 
sholsinger
answered 3 Months ago
66

You are attempting to write testimage.jpg to the / directory. The executing program probably doesn't have sufficient permissions to write to that directory. Based on your comment, you probably want

//trying to save to current directory
bool maybe = imwrite("./testimage.jpg", picture);

Since . denotes the current working directory.

Monday, August 30, 2021
 
Xun Yang
answered 2 Months ago
Only authorized users can answer the question. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :