graphics: Change the number of floats for a vertex from 10 to 12

This is a preparation for Metal, that forces 4 floats for a vertex
position.
This commit is contained in:
Hajime Hoshi 2018-11-17 15:30:09 +09:00
parent d2595c5be7
commit 7586c660d5
4 changed files with 64 additions and 54 deletions

View File

@ -488,10 +488,10 @@ func (i *Image) DrawTriangles(vertices []Vertex, indices []uint16, img *Image, o
filter = graphics.Filter(img.filter) filter = graphics.Filter(img.filter)
} }
vs := make([]float32, len(vertices)*10) vs := make([]float32, len(vertices)*graphics.VertexFloatNum)
src := img.mipmap.original() src := img.mipmap.original()
for idx, v := range vertices { for idx, v := range vertices {
src.PutVertex(vs[idx*10:idx*10+10], float32(v.DstX), float32(v.DstY), v.SrcX, v.SrcY, v.ColorR, v.ColorG, v.ColorB, v.ColorA) src.PutVertex(vs[idx*graphics.VertexFloatNum:(idx+1)*graphics.VertexFloatNum], float32(v.DstX), float32(v.DstY), v.SrcX, v.SrcY, v.ColorR, v.ColorG, v.ColorB, v.ColorA)
} }
i.mipmap.original().DrawImage(img.mipmap.original(), vs, indices, options.ColorM.impl, mode, filter) i.mipmap.original().DrawImage(img.mipmap.original(), vs, indices, options.ColorM.impl, mode, filter)
i.disposeMipmaps() i.disposeMipmaps()

View File

@ -25,7 +25,7 @@ type verticesBackend struct {
const ( const (
IndicesNum = (1 << 16) / 3 * 3 // Adjust num for triangles. IndicesNum = (1 << 16) / 3 * 3 // Adjust num for triangles.
VertexFloatNum = 10 VertexFloatNum = 12
) )
func (v *verticesBackend) slice(n int) []float32 { func (v *verticesBackend) slice(n int) []float32 {
@ -78,60 +78,68 @@ func quadVerticesImpl(x, y, u0, v0, u1, v1, a, b, c, d, tx, ty, cr, cg, cb, ca f
// Specifying a range explicitly here is redundant but this helps optimization // Specifying a range explicitly here is redundant but this helps optimization
// to eliminate boundry checks. // to eliminate boundry checks.
// //
// 4*VertexFloatNum is better than 40, but in GopherJS, optimization might not work. // 4*VertexFloatNum is better than 48, but in GopherJS, optimization might not work.
vs := theVerticesBackend.slice(4)[0:40] vs := theVerticesBackend.slice(4)[0:48]
ax, by, cx, dy := a*x, b*y, c*x, d*y ax, by, cx, dy := a*x, b*y, c*x, d*y
// Vertex coordinates // Vertex coordinates
vs[0] = tx vs[0] = tx
vs[1] = ty vs[1] = ty
vs[2] = 0
vs[3] = 1
// Texture coordinates: first 2 values indicates the actual coodinate, and // Texture coordinates: first 2 values indicates the actual coodinate, and
// the second indicates diagonally opposite coodinates. // the second indicates diagonally opposite coodinates.
// The second is needed to calculate source rectangle size in shader programs. // The second is needed to calculate source rectangle size in shader programs.
vs[2] = u0 vs[4] = u0
vs[3] = v0 vs[5] = v0
vs[4] = u1 vs[6] = u1
vs[5] = v1 vs[7] = v1
vs[6] = cr vs[8] = cr
vs[7] = cg vs[9] = cg
vs[8] = cb vs[10] = cb
vs[9] = ca vs[11] = ca
// and the same for the other three coordinates // and the same for the other three coordinates
vs[10] = ax + tx vs[12] = ax + tx
vs[11] = cx + ty vs[13] = cx + ty
vs[12] = u1 vs[14] = 0
vs[13] = v0 vs[15] = 1
vs[14] = u0 vs[16] = u1
vs[15] = v1 vs[17] = v0
vs[16] = cr vs[18] = u0
vs[17] = cg vs[19] = v1
vs[18] = cb vs[20] = cr
vs[19] = ca vs[21] = cg
vs[22] = cb
vs[23] = ca
vs[20] = by + tx vs[24] = by + tx
vs[21] = dy + ty vs[25] = dy + ty
vs[22] = u0 vs[26] = 0
vs[23] = v1 vs[27] = 1
vs[24] = u1 vs[28] = u0
vs[25] = v0 vs[29] = v1
vs[26] = cr vs[30] = u1
vs[27] = cg vs[31] = v0
vs[28] = cb vs[32] = cr
vs[29] = ca vs[33] = cg
vs[34] = cb
vs[35] = ca
vs[30] = ax + by + tx vs[36] = ax + by + tx
vs[31] = cx + dy + ty vs[37] = cx + dy + ty
vs[32] = u1 vs[38] = 0
vs[33] = v1 vs[39] = 1
vs[34] = u0 vs[40] = u1
vs[35] = v0 vs[41] = v1
vs[36] = cr vs[42] = u0
vs[37] = cg vs[43] = v0
vs[38] = cb vs[44] = cr
vs[39] = ca vs[45] = cg
vs[46] = cb
vs[47] = ca
return vs return vs
} }
@ -161,12 +169,14 @@ func PutVertex(vs []float32, width, height int, dx, dy, sx, sy float32, cr, cg,
// some machines (#696). Let's use negative numbers to represent such state. // some machines (#696). Let's use negative numbers to represent such state.
vs[0] = dx vs[0] = dx
vs[1] = dy vs[1] = dy
vs[2] = sx / wf vs[2] = 0
vs[3] = sy / hf vs[3] = 1
vs[4] = -1 vs[4] = sx / wf
vs[5] = -1 vs[5] = sy / hf
vs[6] = cr vs[6] = -1
vs[7] = cg vs[7] = -1
vs[8] = cb vs[8] = cr
vs[9] = ca vs[9] = cg
vs[10] = cb
vs[11] = ca
} }

View File

@ -87,7 +87,7 @@ func initializeArrayBuferLayout() {
parts: []arrayBufferLayoutPart{ parts: []arrayBufferLayoutPart{
{ {
name: "vertex", name: "vertex",
num: 2, num: 4,
}, },
{ {
name: "tex_coord", name: "tex_coord",

View File

@ -48,7 +48,7 @@ func shaderStr(id shaderID) string {
const ( const (
shaderStrVertex = ` shaderStrVertex = `
uniform mat4 projection_matrix; uniform mat4 projection_matrix;
attribute vec2 vertex; attribute vec4 vertex;
attribute vec4 tex_coord; attribute vec4 tex_coord;
attribute vec4 color_scale; attribute vec4 color_scale;
varying vec2 varying_tex_coord; varying vec2 varying_tex_coord;
@ -66,7 +66,7 @@ void main(void) {
varying_tex_coord_max = vec2(1, 1); varying_tex_coord_max = vec2(1, 1);
} }
varying_color_scale = color_scale; varying_color_scale = color_scale;
gl_Position = projection_matrix * vec4(vertex, 0, 1); gl_Position = projection_matrix * vertex;
} }
` `
shaderStrFragment = ` shaderStrFragment = `