threejs video test parametric
HTML
<script src="http://eyahuska.com/files/img.jpg"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://eyahuska.com/js/three.min.js"></script>
<script src="http://eyahuska.com/js/Detector.js"></script>
<script src="http://eyahuska.com/js/Stats.js"></script>
<script src="http://eyahuska.com/js/ParametricGeometries.js"></script>
<script src="http://eyahuska.com/js/CurveExtras.js"></script>
<video id="video" autoplay loop style="display:none">
<source src="http://eyahuska.com/files/space.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
<source src="http://eyahuska.com/files/space.ogv" type='video/ogg; codecs="theora, vorbis"'>
</video>
<div id="container"></div>
CSS
body {
font-family: Monospace;
background-color: #f0f0f0;
margin: 0px;
overflow: hidden;
}
JavaScript
var container, stats;
var video, texture, material, mesh;
var texture;
var renderingMesh;
var renderingGeometry;
var geometries = [];
var interval = 4000;
var last_t = 1,
t;
var current = 1,
next = 0;
init();
animate();
function init() {
container = document.createElement('div');
document.body.appendChild(container);
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 2000);
camera.position.y = 10;
scene.add(camera);
var light, object, materials, material, plane;
scene.add(new THREE.AmbientLight(0x404040));
light = new THREE.DirectionalLight(0xffffff);
light.position.set(0, 0, 1);
scene.add(light);
video = document.getElementById('video');
//video.style.width = '10%';
texture = new THREE.Texture(video);
texture.minFilter = THREE.LinearFilter;
texture.magFilter = THREE.LinearFilter;
texture.format = THREE.RGBFormat;
texture.generateMipmaps = false;
texture.repeat.set(4, 4);
texture.offset.set(-0.45, -1.5);
var parameters = {
color: 0xFFFFFF,
map: texture,
wireframe: true
}, material_base = new THREE.MeshLambertMaterial(parameters);
/* // materials for double sided material. DO NOT DELETE
materialS = [
new THREE.MeshLambertMaterial( { ambient: 0xffffff, map: parameters } ),
new THREE.MeshBasicMaterial( { color: 0xffffff, wireframe: false, transparent: false, opacity: 1 } )
];
*/
img = THREE.ImageUtils.loadTexture("img.jpg");
img.minFilter = THREE.LinearFilter;
img.magFilter = THREE.LinearFilter;
img.format = THREE.RGBFormat;
img.generateMipmaps = false;
img.repeat.set(4, 4);
img.offset.set(-0.45, -1.5);
material = new THREE.MeshLambertMaterial({
color: 0xffffff,
wireframe: true,
transparent: false,
opacity: 0.95,
map: img
});
var heightScale = 1;
var p = 2;
var q =...