Skip to content

Commit

Permalink
mudanças na interface
Browse files Browse the repository at this point in the history
  • Loading branch information
@tiagoramalho
tiagoramalho committed Nov 16, 2017
1 parent 3bb9354 commit 1c16b94
Show file tree
Hide file tree
Showing 16 changed files with 11,292 additions and 125 deletions.
215 changes: 113 additions & 102 deletions TicTacToe.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,132 +3,143 @@
<html>

<head>

<title>tic tac toe &mdash; Textures</title>

<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>tic tac toe &mdash; Textures</title>

<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<script id="shader-vs" type="x-shader/x-vertex">

attribute vec3 aVertexPosition;

attribute vec2 aTextureCoord;

uniform mat4 uMVMatrix;
<link rel="stylesheet" href="css/bootstrap-grid.css" type="text/css">
<link rel="stylesheet" href="css/bootstrap.css" type="text/css">
<script id="shader-vs" type="x-shader/x-vertex">

uniform mat4 uPMatrix;
attribute vec3 aVertexPosition;

varying vec2 vTextureCoord;

void main(void) {

gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0);

// For the fragment shader

vTextureCoord = aTextureCoord;
}
</script>
attribute vec2 aTextureCoord;

<script id="shader-fs" type="x-shader/x-fragment">

precision mediump float;
uniform mat4 uMVMatrix;

varying vec2 vTextureCoord;
uniform mat4 uPMatrix;

uniform sampler2D uSampler;
varying vec2 vTextureCoord;

void main(void) {

gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t));
}

</script>
void main(void) {

<!-- The JS files -->
gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0);

<!-- Some useful functions for browser compatibility -->
// For the fragment shader

<script type="text/javascript" src="webgl-utils.js"></script>
vTextureCoord = aTextureCoord;
}
</script>

<!-- Handling vectors and matrices -->
<script id="shader-fs" type="x-shader/x-fragment">

<script type="text/javascript" src="maths.js"></script>
precision mediump float;

<!-- WebGL code -->
varying vec2 vTextureCoord;

<script type="text/javascript" src="initShaders.js"></script>
uniform sampler2D uSampler;

<script type="text/javascript" src="TicTacToe.js"></script>
void main(void) {

gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t));
}

</script>

<!-- The JS files -->

<!-- Some useful functions for browser compatibility -->

<script type="text/javascript" src="webgl-utils.js"></script>

<!-- Handling vectors and matrices -->

<script type="text/javascript" src="maths.js"></script>

<!-- WebGL code -->

<script type="text/javascript" src="initShaders.js"></script>

<script type="text/javascript" src="TicTacToe.js"></script>

</head>

<body onload="runWebGL();">
<div class="container" style="width: 100%">
<div class="row">
<div class="col-md-3">
<h2 style="text-align: center; margin-top: 50px"> Jogador 1 </h2>
<div style="display: flex; margin-top: 30px">
<img src="ramalho.jpg" style="margin: auto">
</div>
<h2 style="text-align: center; margin-top: 30px">Vitórias: 2</h2>
</div>
<div class="col-md-6">
<div style="text-align: center">

<p><h1> Tic Tac Toe 3D </h1></p>

<canvas id="my-canvas" style="border:1px solid #000000;" width="800" height="800"></canvas>

<p>Use cursor keys to spin and <code>Page Up</code>/<code>Page Down</code> to zoom out/in.</p>

<p>Press any mouse button and move the cursor to rotate the models.</p>

<p>XX rotation:

<button id="XX-on-off-button">On / Off</button>

<button id="XX-direction-button">Change Direction</button>

<button id="XX-slower-button">Slower</button>

<button id="XX-faster-button">Faster</button>

</p>

<p>YY rotation:

<button id="YY-on-off-button">On / Off</button>

<button id="YY-direction-button">Change Direction</button>

<button id="YY-slower-button">Slower</button>

<button id="YY-faster-button">Faster</button>

</p>

<p>ZZ rotation:

<button id="ZZ-on-off-button">On / Off</button>

<button id="ZZ-direction-button">Change Direction</button>

<button id="ZZ-slower-button">Slower</button>

<button id="ZZ-faster-button">Faster</button>

</p>


<p>

<div style="text-align: center">

<p><h1> Tic Tac Toe 3D </h1></p>

<canvas id="my-canvas" style="border:1px solid #000000;" width="800" height="800"></canvas>

<p>Use cursor keys to spin and <code>Page Up</code>/<code>Page Down</code> to zoom out/in.</p>

<p>Press any mouse button and move the cursor to rotate the models.</p>

<p>XX rotation:

<button id="XX-on-off-button">On / Off</button>

<button id="XX-direction-button">Change Direction</button>

<button id="XX-slower-button">Slower</button>

<button id="XX-faster-button">Faster</button>

</p>

<p>YY rotation:

<button id="YY-on-off-button">On / Off</button>

<button id="YY-direction-button">Change Direction</button>

<button id="YY-slower-button">Slower</button>

<button id="YY-faster-button">Faster</button>

</p>

<p>ZZ rotation:

<button id="ZZ-on-off-button">On / Off</button>

<button id="ZZ-direction-button">Change Direction</button>

<button id="ZZ-slower-button">Slower</button>

<button id="ZZ-faster-button">Faster</button>

</p>

<!-- <p>Choose the <b>projection type</b>:
<select id="projection-selection">
<option value="0">Orthogonal Projection</option>
<option value="1">Perspective Projection</option>
</select>
</p>-->

<p>

<button id="reset-button">Reset</button>

</p>

</div>
<button id="reset-button">Reset</button>

</p>
</div>
</div>
<div class="col-md-3">
<h2 style="text-align: center; margin-top: 50px"> Jogador 2 </h2>
<div style="display: flex; margin-top: 30px">
<img src="branco.jpg" style="margin: auto;">
</div>
<h2 style="text-align: center; margin-top: 30px">Vitórias: 0</h2>
</div>
</div>
</div>
</body>

</html>
Loading

0 comments on commit 1c16b94

Please sign in to comment.