glam/es5/tests/material/flat-test.js

Experimental WebGL Engine

'use strict';

var _tape = require('tape');

var _tape2 = _interopRequireDefault(_tape);

var _readPixel = require('../read-pixel');

var _readPixel2 = _interopRequireDefault(_readPixel);

var _mesh = require('../../lib/mesh');

var _mesh2 = _interopRequireDefault(_mesh);

var _perspective = require('../../lib/camera/perspective');

var _perspective2 = _interopRequireDefault(_perspective);

var _flat = require('../../lib/material/flat');

var _flat2 = _interopRequireDefault(_flat);

var _forward = require('../../lib/renderer/forward');

var _forward2 = _interopRequireDefault(_forward);

var _scene = require('../../lib/scene');

var _scene2 = _interopRequireDefault(_scene);

var _geometry = require('../../lib/geometry');

var _geometry2 = _interopRequireDefault(_geometry);

var _geo3dBox = require('geo-3d-box');

var _geo3dBox2 = _interopRequireDefault(_geo3dBox);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

(0, _tape2.default)("Flat Material", function (t) {

	var scene = (0, _scene2.default)({
		autoStart: false,
		renderer: (0, _forward2.default)({
			autoResizeCanvas: false,
			width: 100,
			height: 100
		})
	});
	var gl = scene.renderer.gl;
	var camera = (0, _perspective2.default)();
	var material = (0, _flat2.default)();
	var geometry = (0, _geometry2.default)((0, _geo3dBox2.default)({ size: 5 }));
	var mesh = (0, _mesh2.default)(geometry, material);

	scene.add(camera);
	scene.add(mesh);

	material.shading.color = [1, 0, 0];
	mesh.transform.position[2] = 0;
	camera.transform.position[2] = 20;

	t.test("creates a scene with a red box", function (t) {
		t.plan(5);

		scene.render(camera);

		t.deepLooseEqual((0, _readPixel2.default)(gl, 50, 50), [255, 0, 0], "The center is red");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 35, 35), [255, 0, 0], "The top left is red");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 65, 65), [255, 0, 0], "The bottom right is red");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 30, 30), [255, 255, 255], "The top left outside is white");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 70, 70), [255, 255, 255], "The bottom right outside is white");
	});

	t.test("can change the box's color", function (t) {
		t.plan(5);

		material.shading.color = [0, 1, 1];
		scene.render(camera);

		t.deepLooseEqual((0, _readPixel2.default)(gl, 50, 50), [0, 255, 255], "The center is cyan");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 35, 35), [0, 255, 255], "The top left is cyan");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 65, 65), [0, 255, 255], "The bottom right is cyan");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 30, 30), [255, 255, 255], "The top left outside is white");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 70, 70), [255, 255, 255], "The bottom right outside is white");
	});

	t.test("the box can scale", function (t) {
		t.plan(5);

		material.shading.color = [255, 0, 255];
		mesh.transform.scale = [0.2, 0.2, 0.2];
		scene.render(camera);

		t.deepLooseEqual((0, _readPixel2.default)(gl, 50, 50), [255, 0, 255], "The center is magenta");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 48, 48), [255, 0, 255], "The top left is magenta");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 52, 52), [255, 0, 255], "The bottom right is magenta");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 45, 45), [255, 255, 255], "The top left outside is white");
		t.deepLooseEqual((0, _readPixel2.default)(gl, 55, 55), [255, 255, 255], "The bottom right outside is white");

		scene.renderer.destroy();
	});
});