private THREE.Mesh MakeMesh(THREE.BoxGeometry geometry)
{
THREE.Material mat = null;
mat = new THREE.MeshLambertMaterial();
mat.color = new THREE.Color();
mat.color.setHex(Math.Random() * 0xffffff);
THREE.Mesh mesh = new THREE.Mesh(geometry, mat);
mesh.position.x = Math.Random() * 1000 - 500;
mesh.position.y = Math.Random() * 600 - 300;
mesh.position.z = Math.Random() * 800 - 400;
mesh.rotation.x = Math.Random() * 2 * Math.PI;
mesh.rotation.y = Math.Random() * 2 * Math.PI;
mesh.rotation.z = Math.Random() * 2 * Math.PI;
mesh.scale.x = Math.Random() * 2 + 1;
mesh.scale.y = Math.Random() * 2 + 1;
mesh.scale.z = Math.Random() * 2 + 1;
mesh.castShadow = true;
mesh.receiveShadow = true;
return(mesh);
}
private void CreateBoxes()
{
var geometry = new THREE.BoxGeometry(40, 40, 40);
for (var i = 0; i < 200; i++)
{
THREE.Mesh mesh = MakeMesh(geometry);
scene.add(mesh);
allObjects.Push(mesh);
}
}
public override void Init()
{
DivElement div = new DivElement( )
{
InnerHTML = @"
W = translate |
E = rotate |
+ = increase size |
- = decrise seize <br />
Press Q to toggle world/local space"
};
Container.AppendChild(div);
renderer = new THREE.WebGLRenderer();
renderer.setSize(Width, Height);
renderer.sortObjects = false;
Container.AppendChild(renderer.domElement);
//
camera = new THREE.PerspectiveCamera(70, Width /Height, 1, 3000);
camera.position.set(1000, 500, 1000);
camera.lookAt(new THREE.Vector3(0, 200, 0));
scene = new THREE.Scene();
scene.add(new THREE.GridHelper(500, 100));
var light = new THREE.DirectionalLight(0xffffff, 2);
light.position.set(1, 1, 1);
scene.add(light);
THREE.Texture texture = THREE.ImageUtils.loadTexture("textures/crate.gif", THREE.MappingMode.UVMapping, base.Render); //render
texture.mapping = THREE.MappingMode.UVMapping;
texture.anisotropy = renderer.getMaxAnisotropy();
var geometry = new THREE.BoxGeometry(200, 200, 200);
THREE.Material material = new THREE.MeshLambertMaterial();
material.map = texture;
controls = new THREE.TransformControls(camera, renderer.domElement);
controls.addEventListener("change", base.Render);
var mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
controls.attach(mesh);
scene.add(controls);
CreateTrackball();
Window.AddEventListener("keydown", this.SwitchCase, false);
}
private void CreateBoxes()
{
var geometry = new THREE.BoxGeometry(40, 40, 40);
for (var i = 0; i < 200; i++)
{
THREE.Mesh mesh = MakeMesh(geometry);
scene.add(mesh);
allObjects.Push(mesh);
}
}
public void MakeMesh()
{
THREE.Geometry g = new THREE.BoxGeometry(Width - 25, Height - 25, Depth - 25);
THREE.MeshPhongMaterial mat = new THREE.MeshPhongMaterial();
mat.color = new THREE.Color().setHex(0xaaaaaa);
mat.transparent = false;
mat.opacity = 0.5;
Mesh = new THREE.Mesh(g, mat);
Mesh.castShadow = true;
Mesh.receiveShadow = true;
Mesh.visible = Apply;
Mesh.position.copy(Center);
}
private void MakePortal()
{
// poles
var poleGeo = new THREE.BoxGeometry(5, 375, 5);
var poleMat = new THREE.MeshPhongMaterial(); // { color: 0xffffff, specular: 0x111111, shininess: 100 } );
poleMat.color = new THREE.Color().setHex(0xffffff);
poleMat.specular = new THREE.Color().setHex(0x111111);
poleMat.shininess = 100;
THREE.Mesh mesh = new THREE.Mesh(poleGeo, poleMat);
mesh.position.x = -125;
mesh.position.y = -62;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
mesh = new THREE.Mesh(poleGeo, poleMat);
mesh.position.x = 125;
mesh.position.y = -62;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
mesh = new THREE.Mesh(new THREE.BoxGeometry(255, 5, 5), poleMat);
mesh.position.y = -250 + 750 / 2;
mesh.position.x = 0;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
var gg = new THREE.BoxGeometry(10, 10, 10);
mesh = new THREE.Mesh(gg, poleMat);
mesh.position.y = -250;
mesh.position.x = 125;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
mesh = new THREE.Mesh(gg, poleMat);
mesh.position.y = -250;
mesh.position.x = -125;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IApp page)
{
// https://chrome.google.com/webstore/detail/dglmddjmdpdbijfkoaiadbpmjampfdjh/publish-delayed
#region ChromeTCPServer
dynamic self = Native.self;
dynamic self_chrome = self.chrome;
object self_chrome_socket = self_chrome.socket;
if (self_chrome_socket != null)
{
#region AtFormCreated
FormStyler.AtFormCreated =
ss =>
{
ss.Context.FormBorderStyle = System.Windows.Forms.FormBorderStyle.None;
// this is working?
var x = new ChromeTCPServerWithFrameNone.HTML.Pages.AppWindowDrag().AttachTo(ss.Context.GetHTMLTarget());
};
#endregion
chrome.Notification.DefaultTitle = "Heat Zeeker";
chrome.Notification.DefaultIconUrl = new HTML.Images.FromAssets.Promotion3D_iso1_tiltshift_128().src;
ChromeTCPServer.TheServerWithStyledForm.Invoke(
AppSource.Text,
AtFormCreated: FormStyler.AtFormCreated
);
return;
}
#endregion
Native.body.style.margin = "0px";
Native.body.style.overflow = IStyle.OverflowEnum.hidden;
// jsc, add THREE
// ... ok.
// X:\jsc.svn\examples\javascript\WebGL\WebGLOrthographicCamera\WebGLOrthographicCamera\Application.cs
// this is not isometric.
// https://sites.google.com/a/jsc-solutions.net/work/knowledge-base/15-dualvr/20151112
var camera = new THREE.OrthographicCamera(
Native.window.Width / -2, Native.window.Width / 2,
Native.window.Height / 2, Native.window.Height / -2
,
// if we change these values what will change?
-1000, 1000
);
camera.position.x = 200;
camera.position.y = 100;
camera.position.z = 200;
var scene = new THREE.Scene();
// Grid
var size = 600;
var step = 50;
Func<double> random = new Random().NextDouble;
// how do I add a new ground box?
{
var geometry = new THREE.BoxGeometry(size * 2, 2, size * 2);
var material = new THREE.MeshLambertMaterial(new
{
color = 0xB27D51
// , shading = THREE.FlatShading, overdraw = 0.5
});
{
var cube = new THREE.Mesh(geometry, material);
// why cant we get the shadows??
cube.receiveShadow = true;
cube.scale.y = Math.Floor(random() * 2 + 1);
cube.position.x = 0;
//cube.position.y = (cube.scale.y * 50) / 2;
cube.position.y = -2;
cube.position.z = 0;
scene.add(cube);
}
}
{
var geometry = new THREE.Geometry();
for (var i = -size; i <= size; i += step)
{
((IArray<THREE.Vector3>)(object)geometry.vertices).push(new THREE.Vector3(-size, 0, i));
((IArray<THREE.Vector3>)(object)geometry.vertices).push(new THREE.Vector3(size, 0, i));
((IArray<THREE.Vector3>)(object)geometry.vertices).push(new THREE.Vector3(i, 0, -size));
((IArray<THREE.Vector3>)(object)geometry.vertices).push(new THREE.Vector3(i, 0, size));
}
var material = new THREE.LineBasicMaterial(new { color = 0, opacity = 0.2 });
var line = new THREE.Line(geometry, material, mode: THREE.LinePieces);
scene.add(line);
}
var interactiveObjects = new List<THREE.Object3D>();
#region Cubes
{
for (var i = 0; i < 8; i++)
{
new HZBunker().Source.Task.ContinueWithResult(
cube =>
{
// https://github.com/mrdoob/three.js/issues/1285
//cube.children.WithEach(c => c.castShadow = true);
//cube.traverse(
// new Action<THREE.Object3D>(
// child =>
// {
// // does it work? do we need it?
// //if (child is THREE.Mesh)
// child.castShadow = true;
// child.receiveShadow = true;
// }
// )
//);
// um can edit and continue insert code going back in time?
cube.scale.x = 2.0;
cube.scale.y = 2.0;
cube.scale.z = 2.0;
//cube.castShadow = true;
//dae.receiveShadow = true;
cube.position.x = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
//cube.position.y = (cube.scale.y * 50) / 2;
cube.position.z = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
scene.add(cube);
interactiveObjects.Add(cube);
}
);
new HZWaterTower().Source.Task.ContinueWithResult(
cube =>
{
// https://github.com/mrdoob/three.js/issues/1285
// https://github.com/mrdoob/three.js/issues/1285
//cube.children.WithEach(c => c.castShadow = true);
// http://stackoverflow.com/questions/15906248/three-js-objloader-obj-model-not-casting-shadows
// http://stackoverflow.com/questions/22895120/imported-3d-objects-are-not-casting-shadows-with-three-js
//cube.traverse(
// new Action<THREE.Object3D>(
// child =>
// {
// // does it work? do we need it?
// //if (child is THREE.Mesh)
// child.castShadow = true;
// child.receiveShadow = true;
// }
// )
//);
// um can edit and continue insert code going back in time?
cube.scale.x = 2.0;
cube.scale.y = 2.0;
cube.scale.z = 2.0;
//cube.castShadow = true;
//dae.receiveShadow = true;
cube.position.x = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
//cube.position.y = (cube.scale.y * 50) / 2;
cube.position.z = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
scene.add(cube);
interactiveObjects.Add(cube);
}
);
new HZCannon().Source.Task.ContinueWithResult(
cube =>
{
// https://github.com/mrdoob/three.js/issues/1285
//cube.children.WithEach(c => c.castShadow = true);
//cube.traverse(
// new Action<THREE.Object3D>(
// child =>
// {
// // does it work? do we need it?
// //if (child is THREE.Mesh)
// child.castShadow = true;
// child.receiveShadow = true;
// }
// )
//);
// um can edit and continue insert code going back in time?
cube.scale.x = 2.0;
cube.scale.y = 2.0;
cube.scale.z = 2.0;
//cube.castShadow = true;
//dae.receiveShadow = true;
cube.position.x = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
//cube.position.y = (cube.scale.y * 50) / 2;
cube.position.z = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
// if i want to rotate, how do I do it?
//cube.rotation.z = random() + Math.PI;
//cube.rotation.x = random() + Math.PI;
cube.rotation.y = random() * Math.PI * 2;
scene.add(cube);
interactiveObjects.Add(cube);
}
);
}
}
#endregion
// we need expression evaluator with intellisense for live debugging sessions
#region Lights
var ambientLight = new THREE.AmbientLight((int)(random() * 0x10));
scene.add(ambientLight);
// can we get our shadows?
{
var directionalLight = new THREE.DirectionalLight((int)(random() * 0xffffff), 0.5);
directionalLight.position.x = random() - 0.5;
directionalLight.position.y = 400;
directionalLight.position.z = random() - 0.5;
directionalLight.position.normalize();
scene.add(directionalLight);
}
{
var directionalLight = new THREE.DirectionalLight((int)(random() * 0xffffff), 0.5);
directionalLight.position.x = random() - 0.5;
directionalLight.position.y = 400;
directionalLight.position.z = random() - 0.5;
directionalLight.position.normalize();
scene.add(directionalLight);
}
#endregion
//var renderer = new THREE.CanvasRenderer();
var renderer = new THREE.WebGLRenderer();
renderer.shadowMapEnabled = true;
// background-color: #B27D51;
renderer.setClearColor(0xB27D51);
//renderer.setSize(
// Native.window.Width ,
// Native.window.Height * 10
// );
renderer.setSize();
renderer.domElement.AttachToDocument();
Native.window.onresize +=
delegate
{
camera.left = Native.window.Width / -2;
camera.right = Native.window.Width / 2;
camera.top = Native.window.Height / 2;
camera.bottom = Native.window.Height / -2;
camera.updateProjectionMatrix();
renderer.setSize();
};
//window.addEventListener( 'resize', onWindowResize, false );
//#region Comanche
//new Comanche().Source.Task.ContinueWithResult(
// Comanche =>
// {
// Comanche.position.y = 200;
// //dae.position.z = 280;
// Comanche.AttachTo(scene);
// //scene.add(dae);
// //oo.Add(Comanche);
// // wont do it
// //dae.castShadow = true;
// // http://stackoverflow.com/questions/15492857/any-way-to-get-a-bounding-box-from-a-three-js-object3d
// //var helper = new THREE.BoundingBoxHelper(dae, 0xff0000);
// //helper.update();
// //// If you want a visible bounding box
// //scene.add(helper);
// Comanche.children[0].children[0].children.WithEach(x => x.castShadow = true);
// // the rotors?
// Comanche.children[0].children[0].children.Last().children.WithEach(x => x.castShadow = true);
// Comanche.scale.set(0.5, 0.5, 0.5);
// //helper.scale.set(0.5, 0.5, 0.5);
// var sw = Stopwatch.StartNew();
// Native.window.onframe += delegate
// {
// //dae.children[0].children[0].children.Last().al
// //dae.children[0].children[0].children.Last().rotation.z = sw.ElapsedMilliseconds * 0.01;
// //dae.children[0].children[0].children.Last().rotation.x = sw.ElapsedMilliseconds * 0.01;
// //rotation.y = sw.ElapsedMilliseconds * 0.01;
// Comanche.children[0].children[0].children.Last().rotation.y = sw.ElapsedMilliseconds * 0.001;
// //dae.children[0].children[0].children.Last().app
// };
// }
//);
//#endregion
//#region ee
//// X:\jsc.svn\examples\javascript\forms\NumericTextBox\NumericTextBox\ApplicationControl.cs
//// can we restile the window as the pin window in IDE?
//var ee = new Form { Left = 0, StartPosition = FormStartPosition.Manual };
//var ee_camera_y = new TextBox { Dock = DockStyle.Fill, Text = camera.position.y + "" }.AttachTo(ee);
////ee.AutoSize = AutoSizeMode.
////ee.ClientSize = new System.Drawing.Size(ee_camera_y.Width, ee_camera_y.Height);
//ee.ClientSize = new System.Drawing.Size(200, 24);
//ee.Show();
////ee_camera_y.
//ee_camera_y.TextChanged += delegate
//{
// camera.position.y = double.Parse(ee_camera_y.Text);
//};
//#endregion
var s = Stopwatch.StartNew();
var controls = new THREE.OrbitControls(camera, renderer.domElement);
// http://stackoverflow.com/questions/26497903/nested-webglrendertargets-in-three-js
// var effect = new THREE.OculusRiftEffect(
//renderer, new
//{
// worldScale = 100,
// //HMD
// }
//);
// effect.setSize(1920, 1080);
Native.window.onframe +=
e =>
{
// jsc, when can we have the edit and continue already?
//var timer = s.ElapsedMilliseconds * 0.1;
//var timer = s.ElapsedMilliseconds * 0.0001;
//camera.position.x = Math.Cos(timer) * 200;
//camera.position.z = Math.Sin(timer) * 200;
// camera.position.z = 200;
//camera.position.y = 100;
//camera.position.y = Math.Sin(timer * 0.1) * 200;
controls.update();
camera.position = controls.center.clone();
renderer.render(scene, camera);
//effect.render(scene, camera);
};
//var ze = new ZeProperties();
//ze.Show();
//ze.treeView1.Nodes.Clear();
//ze.Add(() => renderer);
////ze.Add(() => controls);
//ze.Add(() => scene);
//ze.Left = 0;
// view-source:http://mrdoob.github.io/three.js/examples/webgl_interactive_voxelpainter.html
//var mouse2D = new THREE.Vector3(0, 10000, 0.5);
//renderer.domElement.onclick +=
// e =>
// {
// e.preventDefault();
// mouse2D.x = (e.CursorX / (double)Native.window.Width) * 2 - 1;
// mouse2D.y = -(e.CursorY / (double)Native.window.Height) * 2 + 1;
// var vector = new THREE.Vector3(
// (e.CursorX / (double)Native.window.Width) * 2 - 1,
// -(e.CursorY / (double)Native.window.Height) * 2 + 1,
// 0.5);
// // X:\jsc.svn\examples\javascript\WebGL\WebGLInteractiveCubes\WebGLInteractiveCubes\Application.cs
// var projector = new THREE.Projector();
// projector.unprojectVector(vector, camera);
// // http://stackoverflow.com/questions/18553209/orthographic-camera-and-selecting-objects-with-raycast
// // http://stackoverflow.com/questions/20361776/orthographic-camera-and-pickingray
// // view-source:http://stemkoski.github.io/Three.js/Mouse-Click.html
// // http://stackoverflow.com/questions/11921033/projector-and-ray-with-orthographiccamera
// // use picking ray since it's an orthographic camera
// // doesnt fkin work ???
// //var raycaster = projector.pickingRay(vector, camera);
// var raycaster = projector.pickingRay(mouse2D.clone(), camera);
// //var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
// var intersects = raycaster.intersectObjects(interactiveObjects.ToArray());
// // https://github.com/mrdoob/three.js/issues/599
// Native.document.title = new { intersects.Length }.ToString();
// };
}
public void MakeMesh()
{
THREE.Geometry g = new THREE.BoxGeometry(Width - 25, Height - 25, Depth - 25);
THREE.MeshPhongMaterial mat = new THREE.MeshPhongMaterial();
mat.color = new THREE.Color().setHex(0xaaaaaa);
mat.transparent = false;
mat.opacity = 0.5;
Mesh = new THREE.Mesh(g, mat);
Mesh.castShadow = true;
Mesh.receiveShadow = true;
Mesh.visible = Apply;
Mesh.position.copy(Center);
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IApp page)
{
// "X:\opensource\github\three.js\examples\canvas_camera_orthographic.html"
// if i type THREE, would jsc be able to add THREE package on rebuild?
// Error 136 The type or namespace name 'THREE' could not be found (are you missing a using directive or an assembly reference?) X:\jsc.svn\examples\javascript\WebGL\WebGLOrthographicCamera\WebGLOrthographicCamera\Application.cs 35 26 WebGLOrthographicCamera
// X:\jsc.svn\examples\javascript\WebGL\WebGLOrthographicCamera\WebGLOrthographicCamera\Application.cs
var camera = new THREE.OrthographicCamera(Native.window.Width / -2, Native.window.Width / 2, Native.window.Height / 2, Native.window.Height / -2, -500, 1000);
camera.position.x = 200;
camera.position.y = 100;
camera.position.z = 200;
var scene = new THREE.Scene();
// Grid
var size = 500;
var step = 50;
Func<double> random = new Random().NextDouble;
{
var geometry = new THREE.Geometry();
for (var i = -size; i <= size; i += step)
{
((IArray<THREE.Vector3>)(object)geometry.vertices).push(new THREE.Vector3(-size, 0, i));
((IArray<THREE.Vector3>)(object)geometry.vertices).push(new THREE.Vector3(size, 0, i));
((IArray<THREE.Vector3>)(object)geometry.vertices).push(new THREE.Vector3(i, 0, -size));
((IArray<THREE.Vector3>)(object)geometry.vertices).push(new THREE.Vector3(i, 0, size));
}
var material = new THREE.LineBasicMaterial(new { color = 0x000000, opacity = 0.2 });
var line = new THREE.Line(geometry, material);
line.type = THREE.LinePieces;
scene.add(line);
}
#region Cubes
{
var geometry = new THREE.BoxGeometry(50, 50, 50);
var material = new THREE.MeshLambertMaterial(new { color = 0xffffff, shading = THREE.FlatShading, overdraw = 0.5 });
for (var i = 0; i < 100; i++)
{
var cube = new THREE.Mesh(geometry, material);
cube.scale.y = Math.Floor(random() * 2 + 1);
cube.position.x = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
cube.position.y = (cube.scale.y * 50) / 2;
cube.position.z = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
scene.add(cube);
}
}
#endregion
#region Lights
var ambientLight = new THREE.AmbientLight((int)(random() * 0x10));
scene.add(ambientLight);
{
var directionalLight = new THREE.DirectionalLight((int)(random() * 0xffffff));
directionalLight.position.x = random() - 0.5;
directionalLight.position.y = random() - 0.5;
directionalLight.position.z = random() - 0.5;
directionalLight.position.normalize();
scene.add(directionalLight);
}
{
var directionalLight = new THREE.DirectionalLight((int)(random() * 0xffffff));
directionalLight.position.x = random() - 0.5;
directionalLight.position.y = random() - 0.5;
directionalLight.position.z = random() - 0.5;
directionalLight.position.normalize();
scene.add(directionalLight);
}
#endregion
//var renderer = new THREE.CanvasRenderer();
var renderer = new THREE.WebGLRenderer();
renderer.setClearColor(0xf0f0f0);
//renderer.setSize(Native.window.Width, Native.window.Height);
renderer.setSize();
renderer.domElement.AttachToDocument();
//window.addEventListener( 'resize', onWindowResize, false );
var s = Stopwatch.StartNew();
Native.window.onframe +=
e =>
{
// jsc, when can we have the edit and continue already?
//var timer = s.ElapsedMilliseconds * 0.1;
var timer = s.ElapsedMilliseconds * 0.0001;
camera.position.x = Math.Cos(timer) * 200;
camera.position.z = Math.Sin(timer) * 200;
camera.lookAt(scene.position);
renderer.render(scene, camera);
};
}
private void MakePortal()
{
// poles
var poleGeo = new THREE.BoxGeometry(5, 375, 5);
var poleMat = new THREE.MeshPhongMaterial(); // { color: 0xffffff, specular: 0x111111, shininess: 100 } );
poleMat.color = new THREE.Color().setHex(0xffffff);
poleMat.specular = new THREE.Color().setHex(0x111111);
poleMat.shininess = 100;
THREE.Mesh mesh = new THREE.Mesh(poleGeo, poleMat);
mesh.position.x = -125;
mesh.position.y = -62;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
mesh = new THREE.Mesh(poleGeo, poleMat);
mesh.position.x = 125;
mesh.position.y = -62;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
mesh = new THREE.Mesh(new THREE.BoxGeometry(255, 5, 5), poleMat);
mesh.position.y = -250 + 750 / 2;
mesh.position.x = 0;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
var gg = new THREE.BoxGeometry(10, 10, 10);
mesh = new THREE.Mesh(gg, poleMat);
mesh.position.y = -250;
mesh.position.x = 125;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
mesh = new THREE.Mesh(gg, poleMat);
mesh.position.y = -250;
mesh.position.x = -125;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IApp page)
{
// "X:\opensource\github\three.js\examples\canvas_camera_orthographic.html"
// if i type THREE, would jsc be able to add THREE package on rebuild?
// Error 136 The type or namespace name 'THREE' could not be found (are you missing a using directive or an assembly reference?) X:\jsc.svn\examples\javascript\WebGL\WebGLOrthographicCamera\WebGLOrthographicCamera\Application.cs 35 26 WebGLOrthographicCamera
// X:\jsc.svn\examples\javascript\WebGL\WebGLOrthographicCamera\WebGLOrthographicCamera\Application.cs
var camera = new THREE.OrthographicCamera(Native.window.Width / -2, Native.window.Width / 2, Native.window.Height / 2, Native.window.Height / -2, -500, 1000);
camera.position.x = 200;
camera.position.y = 100;
camera.position.z = 200;
var scene = new THREE.Scene();
// Grid
var size = 500;
var step = 50;
Func <double> random = new Random().NextDouble;
{
var geometry = new THREE.Geometry();
for (var i = -size; i <= size; i += step)
{
((IArray <THREE.Vector3>)(object) geometry.vertices).push(new THREE.Vector3(-size, 0, i));
((IArray <THREE.Vector3>)(object) geometry.vertices).push(new THREE.Vector3(size, 0, i));
((IArray <THREE.Vector3>)(object) geometry.vertices).push(new THREE.Vector3(i, 0, -size));
((IArray <THREE.Vector3>)(object) geometry.vertices).push(new THREE.Vector3(i, 0, size));
}
var material = new THREE.LineBasicMaterial(new { color = 0x000000, opacity = 0.2 });
var line = new THREE.Line(geometry, material);
line.type = THREE.LinePieces;
scene.add(line);
}
#region Cubes
{
var geometry = new THREE.BoxGeometry(50, 50, 50);
var material = new THREE.MeshLambertMaterial(new { color = 0xffffff, shading = THREE.FlatShading, overdraw = 0.5 });
for (var i = 0; i < 100; i++)
{
var cube = new THREE.Mesh(geometry, material);
cube.scale.y = Math.Floor(random() * 2 + 1);
cube.position.x = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
cube.position.y = (cube.scale.y * 50) / 2;
cube.position.z = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
scene.add(cube);
}
}
#endregion
#region Lights
var ambientLight = new THREE.AmbientLight((int)(random() * 0x10));
scene.add(ambientLight);
{
var directionalLight = new THREE.DirectionalLight((int)(random() * 0xffffff));
directionalLight.position.x = random() - 0.5;
directionalLight.position.y = random() - 0.5;
directionalLight.position.z = random() - 0.5;
directionalLight.position.normalize();
scene.add(directionalLight);
}
{
var directionalLight = new THREE.DirectionalLight((int)(random() * 0xffffff));
directionalLight.position.x = random() - 0.5;
directionalLight.position.y = random() - 0.5;
directionalLight.position.z = random() - 0.5;
directionalLight.position.normalize();
scene.add(directionalLight);
}
#endregion
//var renderer = new THREE.CanvasRenderer();
var renderer = new THREE.WebGLRenderer();
renderer.setClearColor(0xf0f0f0);
//renderer.setSize(Native.window.Width, Native.window.Height);
renderer.setSize();
renderer.domElement.AttachToDocument();
//window.addEventListener( 'resize', onWindowResize, false );
var s = Stopwatch.StartNew();
Native.window.onframe +=
e =>
{
// jsc, when can we have the edit and continue already?
//var timer = s.ElapsedMilliseconds * 0.1;
var timer = s.ElapsedMilliseconds * 0.0001;
camera.position.x = Math.Cos(timer) * 200;
camera.position.z = Math.Sin(timer) * 200;
camera.lookAt(scene.position);
renderer.render(scene, camera);
};
}
// Could not connect to the feed specified at 'http://my.jsc-solutions.net/nuget'. P
public Application(IApp page)
{
//{ var ref0 = typeof(dirt_tx); }
{ var ref0 = new dirt_tx { }; }
//{ var ref0 = typeof(MarineCv2_color); }
{ var ref0 = new MarineCv2_color { }; }
// http://www.realitymeltdown.com/WebGL3/character-controller.html
// https://sites.google.com/a/jsc-solutions.net/backlog/knowledge-base/2015/201501/20150127
//Native.css
Native.body.style.margin = "0px";
Native.body.style.overflow = IStyle.OverflowEnum.hidden;
//Error CS0246 The type or namespace name 'THREE' could not be found(are you missing a using directive or an assembly reference?) WebGLSpeedBlendCharacter Application.cs 46
// used by, for?
var clock = new THREE.Clock();
//var keys = new { LEFT = 37, UP = 38, RIGHT = 39, DOWN = 40, A = 65, S = 83, D = 68, W = 87 };
var scene = new THREE.Scene();
var skyScene = new THREE.Scene();
scene.fog = new THREE.Fog(0xB0CAE1, 1000, 20000);
scene.add(new THREE.AmbientLight(0xaaaaaa));
var lightOffset = new THREE.Vector3(0, 1000, 1000.0);
var light = new THREE.DirectionalLight(0xffffff, 1.5);
light.position.copy(lightOffset);
light.castShadow = true;
var xlight = light as dynamic;
xlight.shadowMapWidth = 4096;
xlight.shadowMapHeight = 2048;
xlight.shadowDarkness = 0.5;
xlight.shadowCameraNear = 10;
xlight.shadowCameraFar = 10000;
xlight.shadowBias = 0.00001;
xlight.shadowCameraRight = 4000;
xlight.shadowCameraLeft = -4000;
xlight.shadowCameraTop = 4000;
xlight.shadowCameraBottom = -4000;
xlight.shadowCameraVisible = true;
scene.add(light);
#region renderer
var renderer = new THREE.WebGLRenderer(new { antialias = true, alpha = false });
renderer.setSize(Native.window.Width, Native.window.Height);
renderer.autoClear = false;
renderer.shadowMapEnabled = true;
renderer.shadowMapType = THREE.PCFSoftShadowMap;
renderer.domElement.AttachToDocument();
#endregion
// this will mess up
// three.OrbitControls.js
// onMouseMove
//new IStyle(renderer.domElement)
//{
// position = IStyle.PositionEnum.absolute,
// left = "0px",
// top = "0px",
// right = "0px",
// bottom = "0px",
//};
//new { }.With(
// async delegate
// {
// await Native.window.async.onresize;
// // if the reload were fast, then we could actually do that:D
// Native.document.location.reload();
// }
//);
#region create field
// THREE.PlaneGeometry: Consider using THREE.PlaneBufferGeometry for lower memory footprint.
//var planeGeometry = new THREE.PlaneGeometry(1000, 1000);
//var planeMaterial = new THREE.MeshLambertMaterial(
// new
// {
// map = THREE.ImageUtils.loadTexture(new HTML.Images.FromAssets.dirt_tx().src),
// color = 0xffffff
// }
//);
//planeMaterial.map.repeat.x = 300;
//planeMaterial.map.repeat.y = 300;
//planeMaterial.map.wrapS = THREE.RepeatWrapping;
//planeMaterial.map.wrapT = THREE.RepeatWrapping;
//var plane = new THREE.Mesh(planeGeometry, planeMaterial);
//plane.castShadow = false;
//plane.receiveShadow = true;
//{
// var parent = new THREE.Object3D();
// parent.add(plane);
// parent.rotation.x = -Math.PI / 2;
// parent.scale.set(100, 100, 100);
// scene.add(parent);
//}
var random = new Random();
var meshArray = new List<THREE.Mesh>();
//var geometry = new THREE.CubeGeometry(1, 1, 1);
var geometry = new THREE.BoxGeometry(1, 1, 1);
for (var i = 1; i < 100; i++)
{
var ii = new THREE.Mesh(geometry, new THREE.MeshLambertMaterial(
new
{
color = (Convert.ToInt32(0xffffff * random.NextDouble()))
}));
ii.position.x = i % 2 * 500 - 2.5f;
// raise it up
ii.position.y = .5f * 100;
ii.position.z = -1 * i * 400;
ii.castShadow = true;
ii.receiveShadow = true;
//ii.scale.set(100, 100, 100 * i);
ii.scale.set(100, 100 * i, 100);
meshArray.Add(ii);
scene.add(ii);
}
#endregion
var blendMesh = new THREE.SpeedBlendCharacter();
blendMesh.load(
new Models.marine_anims().Content.src,
new Action(
delegate
{
// buildScene
//blendMesh.rotation.y = Math.PI * -135 / 180;
blendMesh.castShadow = true;
// we cannot scale down we want our shadows
//blendMesh.scale.set(0.1, 0.1, 0.1);
scene.add(blendMesh);
//var characterController = new THREE.CharacterController(blendMesh);
// run
blendMesh.setSpeed(1.0);
var radius = blendMesh.geometry.boundingSphere.radius;
Native.document.title = new { radius }.ToString();
var camera = new THREE.PerspectiveCamera(45, Native.window.aspect, 1, 20000);
camera.position.set(0.0, radius * 3, radius * 3.5);
var skyCamera = new THREE.PerspectiveCamera(45, Native.window.aspect, 1, 20000);
skyCamera.position.set(0.0, radius * 3, radius * 3.5);
var controls = new THREE.OrbitControls(camera);
//controls.noPan = true;
var loader = new THREE.JSONLoader();
loader.load(new Models.ground().Content.src,
new Action<THREE.Geometry, THREE.Material[]>(
(xgeometry, materials) =>
{
// cannot see the ground?
var ground = new THREE.Mesh(xgeometry, materials[0]);
ground.scale.set(20, 20, 20);
ground.receiveShadow = true;
ground.castShadow = true;
scene.add(ground);
}
)
);
#region createSky
// gearvr has photos360 app
var urls = new[] {
new px().src, new nx().src,
new py().src, new ny().src,
new pz().src, new nz().src,
};
var textureCube = THREE.ImageUtils.loadTextureCube(urls);
dynamic shader = THREE.ShaderLib["cube"];
shader.uniforms["tCube"].value = textureCube;
// We're inside the box, so make sure to render the backsides
// It will typically be rendered first in the scene and without depth so anything else will be drawn in front
var material = new THREE.ShaderMaterial(new
{
fragmentShader = shader.fragmentShader,
vertexShader = shader.vertexShader,
uniforms = shader.uniforms,
depthWrite = false,
side = THREE.BackSide
});
// THREE.CubeGeometry has been renamed to THREE.BoxGeometry
// The box dimension size doesn't matter that much when the camera is in the center. Experiment with the values.
//var skyMesh = new THREE.Mesh(new THREE.CubeGeometry(10000, 10000, 10000, 1, 1, 1), material);
var skyMesh = new THREE.Mesh(new THREE.BoxGeometry(10000, 10000, 10000), material);
//skyMesh.renderDepth = -10;
skyScene.add(skyMesh);
#endregion
#region onframe
Native.window.onframe +=
delegate
{
var scale = 1.0;
var delta = clock.getDelta();
var stepSize = delta * scale;
if (stepSize > 0)
{
//characterController.update(stepSize, scale);
//gui.setSpeed(blendMesh.speed);
THREE.AnimationHandler.update(stepSize);
blendMesh.updateSkeletonHelper();
}
controls.center.copy(blendMesh.position);
controls.center.y += radius * 2.0;
controls.update();
var camOffset = camera.position.clone().sub(controls.center);
camOffset.normalize().multiplyScalar(750);
camera.position = controls.center.clone().add(camOffset);
skyCamera.rotation.copy(camera.rotation);
renderer.clear();
renderer.render(skyScene, skyCamera);
renderer.render(scene, camera);
};
#endregion
#region onresize
new { }.With(
async delegate
{
do
{
camera.aspect = Native.window.aspect;
camera.updateProjectionMatrix();
renderer.setSize(Native.window.Width, Native.window.Height);
} while (await Native.window.async.onresize);
}
);
#endregion
}
)
);
}
// Could not connect to the feed specified at 'http://my.jsc-solutions.net/nuget'. P
public Application(IApp page)
{
//{ var ref0 = typeof(dirt_tx); }
{ var ref0 = new dirt_tx {
}; }
//{ var ref0 = typeof(MarineCv2_color); }
{ var ref0 = new MarineCv2_color {
}; }
// http://www.realitymeltdown.com/WebGL3/character-controller.html
// https://sites.google.com/a/jsc-solutions.net/backlog/knowledge-base/2015/201501/20150127
//Native.css
Native.body.style.margin = "0px";
Native.body.style.overflow = IStyle.OverflowEnum.hidden;
//Error CS0246 The type or namespace name 'THREE' could not be found(are you missing a using directive or an assembly reference?) WebGLSpeedBlendCharacter Application.cs 46
// used by, for?
var clock = new THREE.Clock();
//var keys = new { LEFT = 37, UP = 38, RIGHT = 39, DOWN = 40, A = 65, S = 83, D = 68, W = 87 };
var scene = new THREE.Scene();
var skyScene = new THREE.Scene();
scene.fog = new THREE.Fog(0xB0CAE1, 1000, 20000);
scene.add(new THREE.AmbientLight(0xaaaaaa));
var lightOffset = new THREE.Vector3(0, 1000, 1000.0);
var light = new THREE.DirectionalLight(0xffffff, 1.5);
light.position.copy(lightOffset);
light.castShadow = true;
var xlight = light as dynamic;
xlight.shadowMapWidth = 4096;
xlight.shadowMapHeight = 2048;
xlight.shadowDarkness = 0.5;
xlight.shadowCameraNear = 10;
xlight.shadowCameraFar = 10000;
xlight.shadowBias = 0.00001;
xlight.shadowCameraRight = 4000;
xlight.shadowCameraLeft = -4000;
xlight.shadowCameraTop = 4000;
xlight.shadowCameraBottom = -4000;
xlight.shadowCameraVisible = true;
scene.add(light);
#region renderer
var renderer = new THREE.WebGLRenderer(new { antialias = true, alpha = false });
renderer.setSize(Native.window.Width, Native.window.Height);
renderer.autoClear = false;
renderer.shadowMapEnabled = true;
renderer.shadowMapType = THREE.PCFSoftShadowMap;
renderer.domElement.AttachToDocument();
#endregion
// this will mess up
// three.OrbitControls.js
// onMouseMove
//new IStyle(renderer.domElement)
//{
// position = IStyle.PositionEnum.absolute,
// left = "0px",
// top = "0px",
// right = "0px",
// bottom = "0px",
//};
//new { }.With(
// async delegate
// {
// await Native.window.async.onresize;
// // if the reload were fast, then we could actually do that:D
// Native.document.location.reload();
// }
//);
#region create field
// THREE.PlaneGeometry: Consider using THREE.PlaneBufferGeometry for lower memory footprint.
//var planeGeometry = new THREE.PlaneGeometry(1000, 1000);
//var planeMaterial = new THREE.MeshLambertMaterial(
// new
// {
// map = THREE.ImageUtils.loadTexture(new HTML.Images.FromAssets.dirt_tx().src),
// color = 0xffffff
// }
//);
//planeMaterial.map.repeat.x = 300;
//planeMaterial.map.repeat.y = 300;
//planeMaterial.map.wrapS = THREE.RepeatWrapping;
//planeMaterial.map.wrapT = THREE.RepeatWrapping;
//var plane = new THREE.Mesh(planeGeometry, planeMaterial);
//plane.castShadow = false;
//plane.receiveShadow = true;
//{
// var parent = new THREE.Object3D();
// parent.add(plane);
// parent.rotation.x = -Math.PI / 2;
// parent.scale.set(100, 100, 100);
// scene.add(parent);
//}
var random = new Random();
var meshArray = new List <THREE.Mesh>();
//var geometry = new THREE.CubeGeometry(1, 1, 1);
var geometry = new THREE.BoxGeometry(1, 1, 1);
for (var i = 1; i < 100; i++)
{
var ii = new THREE.Mesh(geometry, new THREE.MeshLambertMaterial(
new
{
color = (Convert.ToInt32(0xffffff * random.NextDouble()))
}));
ii.position.x = i % 2 * 500 - 2.5f;
// raise it up
ii.position.y = .5f * 100;
ii.position.z = -1 * i * 400;
ii.castShadow = true;
ii.receiveShadow = true;
//ii.scale.set(100, 100, 100 * i);
ii.scale.set(100, 100 * i, 100);
meshArray.Add(ii);
scene.add(ii);
}
#endregion
var blendMesh = new THREE.SpeedBlendCharacter();
blendMesh.load(
new Models.marine_anims().Content.src,
new Action(
delegate
{
// buildScene
//blendMesh.rotation.y = Math.PI * -135 / 180;
blendMesh.castShadow = true;
// we cannot scale down we want our shadows
//blendMesh.scale.set(0.1, 0.1, 0.1);
scene.add(blendMesh);
//var characterController = new THREE.CharacterController(blendMesh);
// run
blendMesh.setSpeed(1.0);
var radius = blendMesh.geometry.boundingSphere.radius;
Native.document.title = new { radius }.ToString();
var camera = new THREE.PerspectiveCamera(45, Native.window.aspect, 1, 20000);
camera.position.set(0.0, radius * 3, radius * 3.5);
var skyCamera = new THREE.PerspectiveCamera(45, Native.window.aspect, 1, 20000);
skyCamera.position.set(0.0, radius * 3, radius * 3.5);
var controls = new THREE.OrbitControls(camera);
//controls.noPan = true;
var loader = new THREE.JSONLoader();
loader.load(new Models.ground().Content.src,
new Action <THREE.Geometry, THREE.Material[]>(
(xgeometry, materials) =>
{
// cannot see the ground?
var ground = new THREE.Mesh(xgeometry, materials[0]);
ground.scale.set(20, 20, 20);
ground.receiveShadow = true;
ground.castShadow = true;
scene.add(ground);
}
)
);
#region createSky
// gearvr has photos360 app
var urls = new[] {
new px().src, new nx().src,
new py().src, new ny().src,
new pz().src, new nz().src,
};
var textureCube = THREE.ImageUtils.loadTextureCube(urls);
dynamic shader = THREE.ShaderLib["cube"];
shader.uniforms["tCube"].value = textureCube;
// We're inside the box, so make sure to render the backsides
// It will typically be rendered first in the scene and without depth so anything else will be drawn in front
var material = new THREE.ShaderMaterial(new
{
fragmentShader = shader.fragmentShader,
vertexShader = shader.vertexShader,
uniforms = shader.uniforms,
depthWrite = false,
side = THREE.BackSide
});
// THREE.CubeGeometry has been renamed to THREE.BoxGeometry
// The box dimension size doesn't matter that much when the camera is in the center. Experiment with the values.
//var skyMesh = new THREE.Mesh(new THREE.CubeGeometry(10000, 10000, 10000, 1, 1, 1), material);
var skyMesh = new THREE.Mesh(new THREE.BoxGeometry(10000, 10000, 10000), material);
//skyMesh.renderDepth = -10;
skyScene.add(skyMesh);
#endregion
#region onframe
Native.window.onframe +=
delegate
{
var scale = 1.0;
var delta = clock.getDelta();
var stepSize = delta * scale;
if (stepSize > 0)
{
//characterController.update(stepSize, scale);
//gui.setSpeed(blendMesh.speed);
THREE.AnimationHandler.update(stepSize);
blendMesh.updateSkeletonHelper();
}
controls.center.copy(blendMesh.position);
controls.center.y += radius * 2.0;
controls.update();
var camOffset = camera.position.clone().sub(controls.center);
camOffset.normalize().multiplyScalar(750);
camera.position = controls.center.clone().add(camOffset);
skyCamera.rotation.copy(camera.rotation);
renderer.clear();
renderer.render(skyScene, skyCamera);
renderer.render(scene, camera);
};
#endregion
#region onresize
new { }.With(
async delegate
{
do
{
camera.aspect = Native.window.aspect;
camera.updateProjectionMatrix();
renderer.setSize(Native.window.Width, Native.window.Height);
} while (await Native.window.async.onresize);
}
);
#endregion
}
)
);
}
/// <summary>
/// This is a javascript application.
/// </summary>
/// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
public Application(IApp page)
{
// https://chrome.google.com/webstore/detail/dglmddjmdpdbijfkoaiadbpmjampfdjh/publish-delayed
#region ChromeTCPServer
dynamic self = Native.self;
dynamic self_chrome = self.chrome;
object self_chrome_socket = self_chrome.socket;
if (self_chrome_socket != null)
{
#region AtFormCreated
FormStyler.AtFormCreated =
ss =>
{
ss.Context.FormBorderStyle = System.Windows.Forms.FormBorderStyle.None;
// this is working?
var x = new ChromeTCPServerWithFrameNone.HTML.Pages.AppWindowDrag().AttachTo(ss.Context.GetHTMLTarget());
};
#endregion
chrome.Notification.DefaultTitle = "Heat Zeeker";
chrome.Notification.DefaultIconUrl = new HTML.Images.FromAssets.Promotion3D_iso1_tiltshift_128().src;
ChromeTCPServer.TheServerWithStyledForm.Invoke(
AppSource.Text,
AtFormCreated: FormStyler.AtFormCreated
);
return;
}
#endregion
Native.body.style.margin = "0px";
Native.body.style.overflow = IStyle.OverflowEnum.hidden;
// jsc, add THREE
// ... ok.
// X:\jsc.svn\examples\javascript\WebGL\WebGLOrthographicCamera\WebGLOrthographicCamera\Application.cs
// this is not isometric.
// https://sites.google.com/a/jsc-solutions.net/work/knowledge-base/15-dualvr/20151112
var camera = new THREE.OrthographicCamera(
Native.window.Width / -2, Native.window.Width / 2,
Native.window.Height / 2, Native.window.Height / -2
,
// if we change these values what will change?
-1000, 1000
);
camera.position.x = 200;
camera.position.y = 100;
camera.position.z = 200;
var scene = new THREE.Scene();
// Grid
var size = 600;
var step = 50;
Func <double> random = new Random().NextDouble;
// how do I add a new ground box?
{
var geometry = new THREE.BoxGeometry(size * 2, 2, size * 2);
var material = new THREE.MeshLambertMaterial(new
{
color = 0xB27D51
// , shading = THREE.FlatShading, overdraw = 0.5
});
{
var cube = new THREE.Mesh(geometry, material);
// why cant we get the shadows??
cube.receiveShadow = true;
cube.scale.y = Math.Floor(random() * 2 + 1);
cube.position.x = 0;
//cube.position.y = (cube.scale.y * 50) / 2;
cube.position.y = -2;
cube.position.z = 0;
scene.add(cube);
}
}
{
var geometry = new THREE.Geometry();
for (var i = -size; i <= size; i += step)
{
((IArray <THREE.Vector3>)(object) geometry.vertices).push(new THREE.Vector3(-size, 0, i));
((IArray <THREE.Vector3>)(object) geometry.vertices).push(new THREE.Vector3(size, 0, i));
((IArray <THREE.Vector3>)(object) geometry.vertices).push(new THREE.Vector3(i, 0, -size));
((IArray <THREE.Vector3>)(object) geometry.vertices).push(new THREE.Vector3(i, 0, size));
}
var material = new THREE.LineBasicMaterial(new { color = 0, opacity = 0.2 });
var line = new THREE.Line(geometry, material, mode: THREE.LinePieces);
scene.add(line);
}
var interactiveObjects = new List <THREE.Object3D>();
#region Cubes
{
for (var i = 0; i < 8; i++)
{
new HZBunker().Source.Task.ContinueWithResult(
cube =>
{
// https://github.com/mrdoob/three.js/issues/1285
//cube.children.WithEach(c => c.castShadow = true);
//cube.traverse(
// new Action<THREE.Object3D>(
// child =>
// {
// // does it work? do we need it?
// //if (child is THREE.Mesh)
// child.castShadow = true;
// child.receiveShadow = true;
// }
// )
//);
// um can edit and continue insert code going back in time?
cube.scale.x = 2.0;
cube.scale.y = 2.0;
cube.scale.z = 2.0;
//cube.castShadow = true;
//dae.receiveShadow = true;
cube.position.x = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
//cube.position.y = (cube.scale.y * 50) / 2;
cube.position.z = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
scene.add(cube);
interactiveObjects.Add(cube);
}
);
new HZWaterTower().Source.Task.ContinueWithResult(
cube =>
{
// https://github.com/mrdoob/three.js/issues/1285
// https://github.com/mrdoob/three.js/issues/1285
//cube.children.WithEach(c => c.castShadow = true);
// http://stackoverflow.com/questions/15906248/three-js-objloader-obj-model-not-casting-shadows
// http://stackoverflow.com/questions/22895120/imported-3d-objects-are-not-casting-shadows-with-three-js
//cube.traverse(
// new Action<THREE.Object3D>(
// child =>
// {
// // does it work? do we need it?
// //if (child is THREE.Mesh)
// child.castShadow = true;
// child.receiveShadow = true;
// }
// )
//);
// um can edit and continue insert code going back in time?
cube.scale.x = 2.0;
cube.scale.y = 2.0;
cube.scale.z = 2.0;
//cube.castShadow = true;
//dae.receiveShadow = true;
cube.position.x = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
//cube.position.y = (cube.scale.y * 50) / 2;
cube.position.z = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
scene.add(cube);
interactiveObjects.Add(cube);
}
);
new HZCannon().Source.Task.ContinueWithResult(
cube =>
{
// https://github.com/mrdoob/three.js/issues/1285
//cube.children.WithEach(c => c.castShadow = true);
//cube.traverse(
// new Action<THREE.Object3D>(
// child =>
// {
// // does it work? do we need it?
// //if (child is THREE.Mesh)
// child.castShadow = true;
// child.receiveShadow = true;
// }
// )
//);
// um can edit and continue insert code going back in time?
cube.scale.x = 2.0;
cube.scale.y = 2.0;
cube.scale.z = 2.0;
//cube.castShadow = true;
//dae.receiveShadow = true;
cube.position.x = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
//cube.position.y = (cube.scale.y * 50) / 2;
cube.position.z = Math.Floor((random() * 1000 - 500) / 50) * 50 + 25;
// if i want to rotate, how do I do it?
//cube.rotation.z = random() + Math.PI;
//cube.rotation.x = random() + Math.PI;
cube.rotation.y = random() * Math.PI * 2;
scene.add(cube);
interactiveObjects.Add(cube);
}
);
}
}
#endregion
// we need expression evaluator with intellisense for live debugging sessions
#region Lights
var ambientLight = new THREE.AmbientLight((int)(random() * 0x10));
scene.add(ambientLight);
// can we get our shadows?
{
var directionalLight = new THREE.DirectionalLight((int)(random() * 0xffffff), 0.5);
directionalLight.position.x = random() - 0.5;
directionalLight.position.y = 400;
directionalLight.position.z = random() - 0.5;
directionalLight.position.normalize();
scene.add(directionalLight);
}
{
var directionalLight = new THREE.DirectionalLight((int)(random() * 0xffffff), 0.5);
directionalLight.position.x = random() - 0.5;
directionalLight.position.y = 400;
directionalLight.position.z = random() - 0.5;
directionalLight.position.normalize();
scene.add(directionalLight);
}
#endregion
//var renderer = new THREE.CanvasRenderer();
var renderer = new THREE.WebGLRenderer();
renderer.shadowMapEnabled = true;
// background-color: #B27D51;
renderer.setClearColor(0xB27D51);
//renderer.setSize(
// Native.window.Width ,
// Native.window.Height * 10
// );
renderer.setSize();
renderer.domElement.AttachToDocument();
Native.window.onresize +=
delegate
{
camera.left = Native.window.Width / -2;
camera.right = Native.window.Width / 2;
camera.top = Native.window.Height / 2;
camera.bottom = Native.window.Height / -2;
camera.updateProjectionMatrix();
renderer.setSize();
};
//window.addEventListener( 'resize', onWindowResize, false );
//#region Comanche
//new Comanche().Source.Task.ContinueWithResult(
// Comanche =>
// {
// Comanche.position.y = 200;
// //dae.position.z = 280;
// Comanche.AttachTo(scene);
// //scene.add(dae);
// //oo.Add(Comanche);
// // wont do it
// //dae.castShadow = true;
// // http://stackoverflow.com/questions/15492857/any-way-to-get-a-bounding-box-from-a-three-js-object3d
// //var helper = new THREE.BoundingBoxHelper(dae, 0xff0000);
// //helper.update();
// //// If you want a visible bounding box
// //scene.add(helper);
// Comanche.children[0].children[0].children.WithEach(x => x.castShadow = true);
// // the rotors?
// Comanche.children[0].children[0].children.Last().children.WithEach(x => x.castShadow = true);
// Comanche.scale.set(0.5, 0.5, 0.5);
// //helper.scale.set(0.5, 0.5, 0.5);
// var sw = Stopwatch.StartNew();
// Native.window.onframe += delegate
// {
// //dae.children[0].children[0].children.Last().al
// //dae.children[0].children[0].children.Last().rotation.z = sw.ElapsedMilliseconds * 0.01;
// //dae.children[0].children[0].children.Last().rotation.x = sw.ElapsedMilliseconds * 0.01;
// //rotation.y = sw.ElapsedMilliseconds * 0.01;
// Comanche.children[0].children[0].children.Last().rotation.y = sw.ElapsedMilliseconds * 0.001;
// //dae.children[0].children[0].children.Last().app
// };
// }
//);
//#endregion
//#region ee
//// X:\jsc.svn\examples\javascript\forms\NumericTextBox\NumericTextBox\ApplicationControl.cs
//// can we restile the window as the pin window in IDE?
//var ee = new Form { Left = 0, StartPosition = FormStartPosition.Manual };
//var ee_camera_y = new TextBox { Dock = DockStyle.Fill, Text = camera.position.y + "" }.AttachTo(ee);
////ee.AutoSize = AutoSizeMode.
////ee.ClientSize = new System.Drawing.Size(ee_camera_y.Width, ee_camera_y.Height);
//ee.ClientSize = new System.Drawing.Size(200, 24);
//ee.Show();
////ee_camera_y.
//ee_camera_y.TextChanged += delegate
//{
// camera.position.y = double.Parse(ee_camera_y.Text);
//};
//#endregion
var s = Stopwatch.StartNew();
var controls = new THREE.OrbitControls(camera, renderer.domElement);
// http://stackoverflow.com/questions/26497903/nested-webglrendertargets-in-three-js
// var effect = new THREE.OculusRiftEffect(
//renderer, new
//{
// worldScale = 100,
// //HMD
// }
//);
// effect.setSize(1920, 1080);
Native.window.onframe +=
e =>
{
// jsc, when can we have the edit and continue already?
//var timer = s.ElapsedMilliseconds * 0.1;
//var timer = s.ElapsedMilliseconds * 0.0001;
//camera.position.x = Math.Cos(timer) * 200;
//camera.position.z = Math.Sin(timer) * 200;
// camera.position.z = 200;
//camera.position.y = 100;
//camera.position.y = Math.Sin(timer * 0.1) * 200;
controls.update();
camera.position = controls.center.clone();
renderer.render(scene, camera);
//effect.render(scene, camera);
};
//var ze = new ZeProperties();
//ze.Show();
//ze.treeView1.Nodes.Clear();
//ze.Add(() => renderer);
////ze.Add(() => controls);
//ze.Add(() => scene);
//ze.Left = 0;
// view-source:http://mrdoob.github.io/three.js/examples/webgl_interactive_voxelpainter.html
//var mouse2D = new THREE.Vector3(0, 10000, 0.5);
//renderer.domElement.onclick +=
// e =>
// {
// e.preventDefault();
// mouse2D.x = (e.CursorX / (double)Native.window.Width) * 2 - 1;
// mouse2D.y = -(e.CursorY / (double)Native.window.Height) * 2 + 1;
// var vector = new THREE.Vector3(
// (e.CursorX / (double)Native.window.Width) * 2 - 1,
// -(e.CursorY / (double)Native.window.Height) * 2 + 1,
// 0.5);
// // X:\jsc.svn\examples\javascript\WebGL\WebGLInteractiveCubes\WebGLInteractiveCubes\Application.cs
// var projector = new THREE.Projector();
// projector.unprojectVector(vector, camera);
// // http://stackoverflow.com/questions/18553209/orthographic-camera-and-selecting-objects-with-raycast
// // http://stackoverflow.com/questions/20361776/orthographic-camera-and-pickingray
// // view-source:http://stemkoski.github.io/Three.js/Mouse-Click.html
// // http://stackoverflow.com/questions/11921033/projector-and-ray-with-orthographiccamera
// // use picking ray since it's an orthographic camera
// // doesnt fkin work ???
// //var raycaster = projector.pickingRay(vector, camera);
// var raycaster = projector.pickingRay(mouse2D.clone(), camera);
// //var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
// var intersects = raycaster.intersectObjects(interactiveObjects.ToArray());
// // https://github.com/mrdoob/three.js/issues/599
// Native.document.title = new { intersects.Length }.ToString();
// };
}
