Skip to content

T
three.js

Ablesons / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 f658b6f2 编写于 作者: M Mugen87
浏览文件
操作

Docs: Clean up geometry.js and material.js

上级 782f2cde
显示空白变更内容
内联 并排
Showing with 391 addition and 454 deletion
docs/scenes/js/geometry.js
浏览文件 @ f658b6f2
......@@ -4,74 +4,6 @@
var twoPi = Math.PI * 2;
var constants = {
combine: {
"THREE.MultiplyOperation" : THREE.MultiplyOperation,
"THREE.MixOperation" : THREE.MixOperation,
"THREE.AddOperation" : THREE.AddOperation
},
side : {
"THREE.FrontSide" : THREE.FrontSide,
"THREE.BackSide" : THREE.BackSide,
"THREE.DoubleSide" : THREE.DoubleSide
},
colors : {
"THREE.NoColors" : THREE.NoColors,
"THREE.FaceColors" : THREE.FaceColors,
"THREE.VertexColors" : THREE.VertexColors
},
blendingMode : {
"THREE.NoBlending" : THREE.NoBlending,
"THREE.NormalBlending" : THREE.NormalBlending,
"THREE.AdditiveBlending" : THREE.AdditiveBlending,
"THREE.SubtractiveBlending" : THREE.SubtractiveBlending,
"THREE.MultiplyBlending" : THREE.MultiplyBlending,
"THREE.CustomBlending" : THREE.CustomBlending
},
equations : {
"THREE.AddEquation" : THREE.AddEquation,
"THREE.SubtractEquation" : THREE.SubtractEquation,
"THREE.ReverseSubtractEquation" : THREE.ReverseSubtractEquation
},
destinationFactors : {
"THREE.ZeroFactor" : THREE.ZeroFactor,
"THREE.OneFactor" : THREE.OneFactor,
"THREE.SrcColorFactor" : THREE.SrcColorFactor,
"THREE.OneMinusSrcColorFactor" : THREE.OneMinusSrcColorFactor,
"THREE.SrcAlphaFactor" : THREE.SrcAlphaFactor,
"THREE.OneMinusSrcAlphaFactor" : THREE.OneMinusSrcAlphaFactor,
"THREE.DstAlphaFactor" : THREE.DstAlphaFactor,
"THREE.OneMinusDstAlphaFactor" : THREE.OneMinusDstAlphaFactor
},
sourceFactors : {
"THREE.DstColorFactor" : THREE.DstColorFactor,
"THREE.OneMinusDstColorFactor" : THREE.OneMinusDstColorFactor,
"THREE.SrcAlphaSaturateFactor" : THREE.SrcAlphaSaturateFactor
}
};
function updateGroupGeometry( mesh, geometry ) {
mesh.children[ 0 ].geometry.dispose();
......@@ -113,7 +45,7 @@ var heartShape = new THREE.Shape();
heartShape.moveTo( x + 5, y + 5 );
heartShape.bezierCurveTo( x + 5, y + 5, x + 4, y, x, y );
heartShape.bezierCurveTo( x - 6, y, x - 6, y + 7,x - 6, y + 7 );
heartShape.bezierCurveTo( x - 6, y, x - 6, y + 7, x - 6, y + 7 );
heartShape.bezierCurveTo( x - 6, y + 11, x - 3, y + 15.4, x + 5, y + 19 );
heartShape.bezierCurveTo( x + 12, y + 15.4, x + 16, y + 11, x + 16, y + 7 );
heartShape.bezierCurveTo( x + 16, y + 7, x + 16, y, x + 10, y );
......@@ -121,15 +53,15 @@ heartShape.bezierCurveTo( x + 7, y, x + 5, y + 5, x + 5, y + 5 );
var guis = {
BoxBufferGeometry : function( mesh ) {
BoxBufferGeometry: function ( mesh ) {
var data = {
width : 15,
height : 15,
depth : 15,
widthSegments : 1,
heightSegments : 1,
depthSegments : 1
width: 15,
height: 15,
depth: 15,
widthSegments: 1,
heightSegments: 1,
depthSegments: 1
};
function generateGeometry() {
......@@ -155,15 +87,15 @@ var guis = {
},
BoxGeometry : function( mesh ) {
BoxGeometry: function ( mesh ) {
var data = {
width : 15,
height : 15,
depth : 15,
widthSegments : 1,
heightSegments : 1,
depthSegments : 1
width: 15,
height: 15,
depth: 15,
widthSegments: 1,
heightSegments: 1,
depthSegments: 1
};
function generateGeometry() {
......@@ -189,17 +121,17 @@ var guis = {
},
CylinderBufferGeometry : function( mesh ) {
CylinderBufferGeometry: function ( mesh ) {
var data = {
radiusTop : 5,
radiusBottom : 5,
height : 10,
radiusSegments : 8,
heightSegments : 1,
openEnded : false,
thetaStart : 0,
thetaLength : twoPi
radiusTop: 5,
radiusBottom: 5,
height: 10,
radiusSegments: 8,
heightSegments: 1,
openEnded: false,
thetaStart: 0,
thetaLength: twoPi
};
function generateGeometry() {
......@@ -235,17 +167,17 @@ var guis = {
},
CylinderGeometry : function( mesh ) {
CylinderGeometry: function ( mesh ) {
var data = {
radiusTop : 5,
radiusBottom : 5,
height : 10,
radiusSegments : 8,
heightSegments : 1,
openEnded : false,
thetaStart : 0,
thetaLength : twoPi
radiusTop: 5,
radiusBottom: 5,
height: 10,
radiusSegments: 8,
heightSegments: 1,
openEnded: false,
thetaStart: 0,
thetaLength: twoPi
};
function generateGeometry() {
......@@ -281,16 +213,16 @@ var guis = {
},
ConeBufferGeometry : function( mesh ) {
ConeBufferGeometry: function ( mesh ) {
var data = {
radius : 5,
height : 10,
radiusSegments : 8,
heightSegments : 1,
openEnded : false,
thetaStart : 0,
thetaLength : twoPi
radius: 5,
height: 10,
radiusSegments: 8,
heightSegments: 1,
openEnded: false,
thetaStart: 0,
thetaLength: twoPi
};
function generateGeometry() {
......@@ -324,16 +256,16 @@ var guis = {
},
ConeGeometry : function( mesh ) {
ConeGeometry: function ( mesh ) {
var data = {
radius : 5,
height : 10,
radiusSegments : 8,
heightSegments : 1,
openEnded : false,
thetaStart : 0,
thetaLength : twoPi
radius: 5,
height: 10,
radiusSegments: 8,
heightSegments: 1,
openEnded: false,
thetaStart: 0,
thetaLength: twoPi
};
function generateGeometry() {
......@@ -368,13 +300,13 @@ var guis = {
},
CircleBufferGeometry : function( mesh ) {
CircleBufferGeometry: function ( mesh ) {
var data = {
radius : 10,
segments : 32,
thetaStart : 0,
thetaLength : twoPi
radius: 10,
segments: 32,
thetaStart: 0,
thetaLength: twoPi
};
function generateGeometry() {
......@@ -398,13 +330,13 @@ var guis = {
},
CircleGeometry : function( mesh ) {
CircleGeometry: function ( mesh ) {
var data = {
radius : 10,
segments : 32,
thetaStart : 0,
thetaLength : twoPi
radius: 10,
segments: 32,
thetaStart: 0,
thetaLength: twoPi
};
function generateGeometry() {
......@@ -428,11 +360,11 @@ var guis = {
},
DodecahedronGeometry : function() {
DodecahedronGeometry: function ( mesh ) {
var data = {
radius : 10,
detail : 0
radius: 10,
detail: 0
};
function generateGeometry() {
......@@ -454,11 +386,11 @@ var guis = {
},
DodecahedronBufferGeometry : function() {
DodecahedronBufferGeometry: function ( mesh ) {
var data = {
radius : 10,
detail : 0
radius: 10,
detail: 0
};
function generateGeometry() {
......@@ -480,11 +412,11 @@ var guis = {
},
IcosahedronGeometry : function() {
IcosahedronGeometry: function ( mesh ) {
var data = {
radius : 10,
detail : 0
radius: 10,
detail: 0
};
function generateGeometry() {
......@@ -506,11 +438,11 @@ var guis = {
},
IcosahedronBufferGeometry : function() {
IcosahedronBufferGeometry: function ( mesh ) {
var data = {
radius : 10,
detail : 0
radius: 10,
detail: 0
};
function generateGeometry() {
......@@ -532,7 +464,7 @@ var guis = {
},
LatheBufferGeometry : function() {
LatheBufferGeometry: function ( mesh ) {
var points = [];
......@@ -543,9 +475,9 @@ var guis = {
}
var data = {
segments : 12,
phiStart : 0,
phiLength : twoPi
segments: 12,
phiStart: 0,
phiLength: twoPi
};
function generateGeometry() {
......@@ -568,7 +500,7 @@ var guis = {
},
LatheGeometry : function() {
LatheGeometry: function ( mesh ) {
var points = [];
......@@ -579,9 +511,9 @@ var guis = {
}
var data = {
segments : 12,
phiStart : 0,
phiLength : twoPi
segments: 12,
phiStart: 0,
phiLength: twoPi
};
function generateGeometry() {
......@@ -604,11 +536,11 @@ var guis = {
},
OctahedronGeometry : function() {
OctahedronGeometry: function ( mesh ) {
var data = {
radius : 10,
detail : 0
radius: 10,
detail: 0
};
function generateGeometry() {
......@@ -630,11 +562,11 @@ var guis = {
},
OctahedronBufferGeometry : function() {
OctahedronBufferGeometry: function ( mesh ) {
var data = {
radius : 10,
detail : 0
radius: 10,
detail: 0
};
function generateGeometry() {
......@@ -656,13 +588,13 @@ var guis = {
},
PlaneBufferGeometry : function( mesh ) {
PlaneBufferGeometry: function ( mesh ) {
var data = {
width : 10,
height : 10,
widthSegments : 1,
heightSegments : 1
width: 10,
height: 10,
widthSegments: 1,
heightSegments: 1
};
function generateGeometry() {
......@@ -686,13 +618,13 @@ var guis = {
},
PlaneGeometry : function( mesh ) {
PlaneGeometry: function ( mesh ) {
var data = {
width : 10,
height : 10,
widthSegments : 1,
heightSegments : 1
width: 10,
height: 10,
widthSegments: 1,
heightSegments: 1
};
function generateGeometry() {
......@@ -716,15 +648,15 @@ var guis = {
},
RingBufferGeometry : function( mesh ) {
RingBufferGeometry: function ( mesh ) {
var data = {
innerRadius : 5,
outerRadius : 10,
thetaSegments : 8,
phiSegments : 8,
thetaStart : 0,
thetaLength : twoPi
innerRadius: 5,
outerRadius: 10,
thetaSegments: 8,
phiSegments: 8,
thetaStart: 0,
thetaLength: twoPi
};
function generateGeometry() {
......@@ -750,15 +682,15 @@ var guis = {
},
RingGeometry : function( mesh ) {
RingGeometry: function ( mesh ) {
var data = {
innerRadius : 5,
outerRadius : 10,
thetaSegments : 8,
phiSegments : 8,
thetaStart : 0,
thetaLength : twoPi
innerRadius: 5,
outerRadius: 10,
thetaSegments: 8,
phiSegments: 8,
thetaStart: 0,
thetaLength: twoPi
};
function generateGeometry() {
......@@ -784,16 +716,16 @@ var guis = {
},
SphereBufferGeometry : function( mesh ) {
SphereBufferGeometry: function ( mesh ) {
var data = {
radius : 15,
widthSegments : 8,
heightSegments : 6,
phiStart : 0,
phiLength : twoPi,
thetaStart : 0,
thetaLength : Math.PI
radius: 15,
widthSegments: 8,
heightSegments: 6,
phiStart: 0,
phiLength: twoPi,
thetaStart: 0,
thetaLength: Math.PI
};
function generateGeometry() {
......@@ -820,16 +752,16 @@ var guis = {
},
SphereGeometry : function( mesh ) {
SphereGeometry: function ( mesh ) {
var data = {
radius : 15,
widthSegments : 8,
heightSegments : 6,
phiStart : 0,
phiLength : twoPi,
thetaStart : 0,
thetaLength : Math.PI
radius: 15,
widthSegments: 8,
heightSegments: 6,
phiStart: 0,
phiLength: twoPi,
thetaStart: 0,
thetaLength: Math.PI
};
function generateGeometry() {
......@@ -856,11 +788,11 @@ var guis = {
},
TetrahedronGeometry : function() {
TetrahedronGeometry: function ( mesh ) {
var data = {
radius : 10,
detail : 0
radius: 10,
detail: 0
};
function generateGeometry() {
......@@ -882,11 +814,11 @@ var guis = {
},
TetrahedronBufferGeometry : function() {
TetrahedronBufferGeometry: function ( mesh ) {
var data = {
radius : 10,
detail : 0
radius: 10,
detail: 0
};
function generateGeometry() {
......@@ -908,19 +840,19 @@ var guis = {
},
TextGeometry : function( mesh ) {
TextGeometry: function ( mesh ) {
var data = {
text : "TextGeometry",
size : 5,
height : 2,
curveSegments : 12,
font : "helvetiker",
weight : "regular",
bevelEnabled : false,
bevelThickness : 1,
bevelSize : 0.5,
bevelSegments : 3
text: "TextGeometry",
size: 5,
height: 2,
curveSegments: 12,
font: "helvetiker",
weight: "regular",
bevelEnabled: false,
bevelThickness: 1,
bevelSize: 0.5,
bevelSegments: 3
};
var fonts = [
......@@ -977,19 +909,19 @@ var guis = {
},
TextBufferGeometry : function( mesh ) {
TextBufferGeometry: function ( mesh ) {
var data = {
text : "TextBufferGeometry",
size : 5,
height : 2,
curveSegments : 12,
font : "helvetiker",
weight : "regular",
bevelEnabled : false,
bevelThickness : 1,
bevelSize : 0.5,
bevelSegments : 3
text: "TextBufferGeometry",
size: 5,
height: 2,
curveSegments: 12,
font: "helvetiker",
weight: "regular",
bevelEnabled: false,
bevelThickness: 1,
bevelSize: 0.5,
bevelSegments: 3
};
var fonts = [
......@@ -1046,14 +978,14 @@ var guis = {
},
TorusBufferGeometry : function( mesh ) {
TorusBufferGeometry: function ( mesh ) {
var data = {
radius : 10,
tube : 3,
radialSegments : 16,
tubularSegments : 100,
arc : twoPi
radius: 10,
tube: 3,
radialSegments: 16,
tubularSegments: 100,
arc: twoPi
};
function generateGeometry() {
......@@ -1078,14 +1010,14 @@ var guis = {
},
TorusGeometry : function( mesh ) {
TorusGeometry: function ( mesh ) {
var data = {
radius : 10,
tube : 3,
radialSegments : 16,
tubularSegments : 100,
arc : twoPi
radius: 10,
tube: 3,
radialSegments: 16,
tubularSegments: 100,
arc: twoPi
};
function generateGeometry() {
......@@ -1110,15 +1042,15 @@ var guis = {
},
TorusKnotBufferGeometry : function( mesh ) {
TorusKnotBufferGeometry: function ( mesh ) {
var data = {
radius : 10,
tube : 3,
tubularSegments : 64,
radialSegments : 8,
p : 2,
q : 3
radius: 10,
tube: 3,
tubularSegments: 64,
radialSegments: 8,
p: 2,
q: 3
};
function generateGeometry() {
......@@ -1145,15 +1077,15 @@ var guis = {
},
TorusKnotGeometry : function( mesh ) {
TorusKnotGeometry: function ( mesh ) {
var data = {
radius : 10,
tube : 3,
tubularSegments : 64,
radialSegments : 8,
p : 2,
q : 3
radius: 10,
tube: 3,
tubularSegments: 64,
radialSegments: 8,
p: 2,
q: 3
};
function generateGeometry() {
......@@ -1180,11 +1112,11 @@ var guis = {
},
ParametricBufferGeometry : function( mesh ) {
ParametricBufferGeometry: function ( mesh ) {
var data = {
slices : 25,
stacks : 25
slices: 25,
stacks: 25
};
function generateGeometry() {
......@@ -1204,11 +1136,11 @@ var guis = {
},
ParametricGeometry : function( mesh ) {
ParametricGeometry: function ( mesh ) {
var data = {
slices : 25,
stacks : 25
slices: 25,
stacks: 25
};
function generateGeometry() {
......@@ -1228,11 +1160,11 @@ var guis = {
},
TubeGeometry : function( mesh ) {
TubeGeometry: function ( mesh ) {
var data = {
segments : 20,
radius : 2,
segments: 20,
radius: 2,
radiusSegments: 8
};
......@@ -1256,11 +1188,11 @@ var guis = {
},
TubeBufferGeometry : function( mesh ) {
TubeBufferGeometry: function ( mesh ) {
var data = {
segments : 20,
radius : 2,
segments: 20,
radius: 2,
radiusSegments: 8
};
......@@ -1284,17 +1216,18 @@ var guis = {
},
ShapeGeometry: function( mesh ) {
ShapeGeometry: function ( mesh ) {
var data = {
segments : 12
segments: 12
};
function generateGeometry() {
updateGroupGeometry( mesh,
new THREE.ShapeGeometry( heartShape, data.segments )
);
var geometry = new THREE.ShapeGeometry( heartShape, data.segments );
geometry.center();
updateGroupGeometry( mesh, geometry );
}
......@@ -1305,17 +1238,18 @@ var guis = {
},
ShapeBufferGeometry: function( mesh ) {
ShapeBufferGeometry: function ( mesh ) {
var data = {
segments : 12
segments: 12
};
function generateGeometry() {
updateGroupGeometry( mesh,
new THREE.ShapeBufferGeometry( heartShape, data.segments )
);
var geometry = new THREE.ShapeBufferGeometry( heartShape, data.segments );
geometry.center();
updateGroupGeometry( mesh, geometry );
}
......@@ -1326,7 +1260,7 @@ var guis = {
},
ExtrudeGeometry: function( mesh ) {
ExtrudeGeometry: function ( mesh ) {
var data = {
steps: 2,
......@@ -1340,7 +1274,7 @@ var guis = {
var length = 12, width = 8;
var shape = new THREE.Shape();
shape.moveTo( 0,0 );
shape.moveTo( 0, 0 );
shape.lineTo( 0, width );
shape.lineTo( length, width );
shape.lineTo( length, 0 );
......@@ -1348,9 +1282,10 @@ var guis = {
function generateGeometry() {
updateGroupGeometry( mesh,
new THREE.ExtrudeGeometry( shape, data )
);
var geometry = new THREE.ExtrudeGeometry( shape, data );
geometry.center();
updateGroupGeometry( mesh, geometry );
}
......@@ -1366,7 +1301,7 @@ var guis = {
},
ExtrudeBufferGeometry: function( mesh ) {
ExtrudeBufferGeometry: function ( mesh ) {
var data = {
steps: 2,
......@@ -1380,7 +1315,7 @@ var guis = {
var length = 12, width = 8;
var shape = new THREE.Shape();
shape.moveTo( 0,0 );
shape.moveTo( 0, 0 );
shape.lineTo( 0, width );
shape.lineTo( length, width );
shape.lineTo( length, 0 );
......@@ -1388,9 +1323,10 @@ var guis = {
function generateGeometry() {
updateGroupGeometry( mesh,
new THREE.ExtrudeBufferGeometry( shape, data )
);
var geometry = new THREE.ExtrudeBufferGeometry( shape, data );
geometry.center();
updateGroupGeometry( mesh, geometry );
}
......@@ -1408,7 +1344,7 @@ var guis = {
};
function chooseFromHash ( mesh ) {
function chooseFromHash( mesh ) {
var selectedGeometry = window.location.hash.substring( 1 ) || "TorusGeometry";
......@@ -1420,7 +1356,7 @@ function chooseFromHash ( mesh ) {
if ( selectedGeometry === 'TextGeometry' || selectedGeometry === 'TextBufferGeometry' ) {
return { fixed : true };
return { fixed: true };
}
......
docs/scenes/js/material.js
浏览文件 @ f658b6f2
......@@ -6,65 +6,65 @@ var constants = {
combine: {
"THREE.MultiplyOperation" : THREE.MultiplyOperation,
"THREE.MixOperation" : THREE.MixOperation,
"THREE.AddOperation" : THREE.AddOperation
'THREE.MultiplyOperation': THREE.MultiplyOperation,
'THREE.MixOperation': THREE.MixOperation,
'THREE.AddOperation': THREE.AddOperation
},
side : {
side: {
"THREE.FrontSide" : THREE.FrontSide,
"THREE.BackSide" : THREE.BackSide,
"THREE.DoubleSide" : THREE.DoubleSide
'THREE.FrontSide': THREE.FrontSide,
'THREE.BackSide': THREE.BackSide,
'THREE.DoubleSide': THREE.DoubleSide
},
colors : {
colors: {
"THREE.NoColors" : THREE.NoColors,
"THREE.FaceColors" : THREE.FaceColors,
"THREE.VertexColors" : THREE.VertexColors
'THREE.NoColors': THREE.NoColors,
'THREE.FaceColors': THREE.FaceColors,
'THREE.VertexColors': THREE.VertexColors
},
blendingMode : {
blendingMode: {
"THREE.NoBlending" : THREE.NoBlending,
"THREE.NormalBlending" : THREE.NormalBlending,
"THREE.AdditiveBlending" : THREE.AdditiveBlending,
"THREE.SubtractiveBlending" : THREE.SubtractiveBlending,
"THREE.MultiplyBlending" : THREE.MultiplyBlending,
"THREE.CustomBlending" : THREE.CustomBlending
'THREE.NoBlending': THREE.NoBlending,
'THREE.NormalBlending': THREE.NormalBlending,
'THREE.AdditiveBlending': THREE.AdditiveBlending,
'THREE.SubtractiveBlending': THREE.SubtractiveBlending,
'THREE.MultiplyBlending': THREE.MultiplyBlending,
'THREE.CustomBlending': THREE.CustomBlending
},
equations : {
equations: {
"THREE.AddEquation" : THREE.AddEquation,
"THREE.SubtractEquation" : THREE.SubtractEquation,
"THREE.ReverseSubtractEquation" : THREE.ReverseSubtractEquation
'THREE.AddEquation': THREE.AddEquation,
'THREE.SubtractEquation': THREE.SubtractEquation,
'THREE.ReverseSubtractEquation': THREE.ReverseSubtractEquation
},
destinationFactors : {
destinationFactors: {
"THREE.ZeroFactor" : THREE.ZeroFactor,
"THREE.OneFactor" : THREE.OneFactor,
"THREE.SrcColorFactor" : THREE.SrcColorFactor,
"THREE.OneMinusSrcColorFactor" : THREE.OneMinusSrcColorFactor,
"THREE.SrcAlphaFactor" : THREE.SrcAlphaFactor,
"THREE.OneMinusSrcAlphaFactor" : THREE.OneMinusSrcAlphaFactor,
"THREE.DstAlphaFactor" : THREE.DstAlphaFactor,
"THREE.OneMinusDstAlphaFactor" : THREE.OneMinusDstAlphaFactor
'THREE.ZeroFactor': THREE.ZeroFactor,
'THREE.OneFactor': THREE.OneFactor,
'THREE.SrcColorFactor': THREE.SrcColorFactor,
'THREE.OneMinusSrcColorFactor': THREE.OneMinusSrcColorFactor,
'THREE.SrcAlphaFactor': THREE.SrcAlphaFactor,
'THREE.OneMinusSrcAlphaFactor': THREE.OneMinusSrcAlphaFactor,
'THREE.DstAlphaFactor': THREE.DstAlphaFactor,
'THREE.OneMinusDstAlphaFactor': THREE.OneMinusDstAlphaFactor
},
sourceFactors : {
sourceFactors: {
"THREE.DstColorFactor" : THREE.DstColorFactor,
"THREE.OneMinusDstColorFactor" : THREE.OneMinusDstColorFactor,
"THREE.SrcAlphaSaturateFactor" : THREE.SrcAlphaSaturateFactor
'THREE.DstColorFactor': THREE.DstColorFactor,
'THREE.OneMinusDstColorFactor': THREE.OneMinusDstColorFactor,
'THREE.SrcAlphaSaturateFactor': THREE.SrcAlphaSaturateFactor
}
......@@ -85,11 +85,12 @@ function getObjectsKeys( obj ) {
}
return keys;
}
var envMaps = (function () {
var envMaps = ( function () {
var path = "../../examples/textures/cube/SwedishRoyalCastle/";
var path = '../../examples/textures/cube/SwedishRoyalCastle/';
var format = '.jpg';
var urls = [
path + 'px' + format, path + 'nx' + format,
......@@ -105,47 +106,47 @@ var envMaps = (function () {
refractionCube.format = THREE.RGBFormat;
return {
none : null,
reflection : reflectionCube,
refraction : refractionCube
none: null,
reflection: reflectionCube,
refraction: refractionCube
};
})();
} )();
var envMapKeys = getObjectsKeys( envMaps );
var textureMaps = (function () {
var textureMaps = ( function () {
return {
none : null,
grass : new THREE.TextureLoader().load( "../../examples/textures/terrain/grasslight-thin.jpg" )
none: null,
grass: new THREE.TextureLoader().load( '../../examples/textures/terrain/grasslight-thin.jpg' )
};
})();
} )();
var textureMapKeys = getObjectsKeys( textureMaps );
function generateVertexColors ( geometry ) {
function generateVertexColors( geometry ) {
for ( var i=0, il = geometry.faces.length; i < il; i++ ) {
for ( var i = 0, il = geometry.faces.length; i < il; i ++ ) {
geometry.faces[i].vertexColors.push( new THREE.Color().setHSL(
geometry.faces[ i ].vertexColors.push( new THREE.Color().setHSL(
i / il * Math.random(),
0.5,
0.5
) );
geometry.faces[i].vertexColors.push( new THREE.Color().setHSL(
geometry.faces[ i ].vertexColors.push( new THREE.Color().setHSL(
i / il * Math.random(),
0.5,
0.5
) );
geometry.faces[i].vertexColors.push( new THREE.Color().setHSL(
geometry.faces[ i ].vertexColors.push( new THREE.Color().setHSL(
i / il * Math.random(),
0.5,
0.5
) );
geometry.faces[i].color = new THREE.Color().setHSL(
geometry.faces[ i ].color = new THREE.Color().setHSL(
i / il * Math.random(),
0.5,
0.5
......@@ -155,11 +156,11 @@ function generateVertexColors ( geometry ) {
}
function generateMorphTargets ( mesh, geometry ) {
function generateMorphTargets( mesh, geometry ) {
var vertices = [], scale;
for ( var i = 0; i < geometry.vertices.length; i++ ) {
for ( var i = 0; i < geometry.vertices.length; i ++ ) {
vertices.push( geometry.vertices[ i ].clone() );
......@@ -171,17 +172,17 @@ function generateMorphTargets ( mesh, geometry ) {
}
geometry.morphTargets.push( { name: "target1", vertices: vertices } );
geometry.morphTargets.push( { name: 'target1', vertices: vertices } );
}
function handleColorChange ( color ) {
function handleColorChange( color ) {
return function ( value ){
return function ( value ) {
if (typeof value === "string") {
if ( typeof value === 'string' ) {
value = value.replace('#', '0x');
value = value.replace( '#', '0x' );
}
......@@ -191,12 +192,12 @@ function handleColorChange ( color ) {
}
function needsUpdate ( material, geometry ) {
function needsUpdate( material, geometry ) {
return function () {
material.vertexColors = +material.vertexColors; //Ensure number
material.side = +material.side; //Ensure number
material.vertexColors = + material.vertexColors; //Ensure number
material.side = + material.side; //Ensure number
material.needsUpdate = true;
geometry.verticesNeedUpdate = true;
geometry.normalsNeedUpdate = true;
......@@ -206,7 +207,7 @@ function needsUpdate ( material, geometry ) {
}
function updateMorphs ( torus, material ) {
function updateMorphs( torus, material ) {
return function () {
......@@ -217,30 +218,30 @@ function updateMorphs ( torus, material ) {
}
function updateTexture ( material, materialKey, textures ) {
function updateTexture( material, materialKey, textures ) {
return function ( key ) {
material[materialKey] = textures[key];
material[ materialKey ] = textures[ key ];
material.needsUpdate = true;
};
}
function guiScene ( gui, scene ) {
function guiScene( gui, scene ) {
var folder = gui.addFolder('Scene');
var folder = gui.addFolder( 'Scene' );
var data = {
background : "#000000",
"ambient light" : ambientLight.color.getHex()
background: '#000000',
'ambient light': ambientLight.color.getHex()
};
var color = new THREE.Color();
var colorConvert = handleColorChange( color );
folder.addColor( data, "background" ).onChange( function ( value ) {
folder.addColor( data, 'background' ).onChange( function ( value ) {
colorConvert( value );
......@@ -248,22 +249,22 @@ function guiScene ( gui, scene ) {
} );
folder.addColor( data, "ambient light" ).onChange( handleColorChange( ambientLight.color ) );
folder.addColor( data, 'ambient light' ).onChange( handleColorChange( ambientLight.color ) );
guiSceneFog( folder, scene );
}
function guiSceneFog ( folder, scene ) {
function guiSceneFog( folder, scene ) {
var fogFolder = folder.addFolder('scene.fog');
var fogFolder = folder.addFolder( 'scene.fog' );
var fog = new THREE.Fog( 0x3f7b9d, 0, 60 );
var data = {
fog : {
"THREE.Fog()" : false,
"scene.fog.color" : fog.color.getHex()
fog: {
'THREE.Fog()': false,
'scene.fog.color': fog.color.getHex()
}
};
......@@ -281,13 +282,13 @@ function guiSceneFog ( folder, scene ) {
} );
fogFolder.addColor( data.fog, 'scene.fog.color').onChange( handleColorChange( fog.color ) );
fogFolder.addColor( data.fog, 'scene.fog.color' ).onChange( handleColorChange( fog.color ) );
}
function guiMaterial ( gui, mesh, material, geometry ) {
function guiMaterial( gui, mesh, material, geometry ) {
var folder = gui.addFolder('THREE.Material');
var folder = gui.addFolder( 'THREE.Material' );
folder.add( material, 'transparent' );
folder.add( material, 'opacity', 0, 1 );
......@@ -307,22 +308,22 @@ function guiMaterial ( gui, mesh, material, geometry ) {
}
function guiMeshBasicMaterial ( gui, mesh, material, geometry ) {
function guiMeshBasicMaterial( gui, mesh, material, geometry ) {
var data = {
color : material.color.getHex(),
envMaps : envMapKeys,
map : textureMapKeys,
specularMap : textureMapKeys,
alphaMap : textureMapKeys
color: material.color.getHex(),
envMaps: envMapKeys,
map: textureMapKeys,
specularMap: textureMapKeys,
alphaMap: textureMapKeys
};
var folder = gui.addFolder('THREE.MeshBasicMaterial');
var folder = gui.addFolder( 'THREE.MeshBasicMaterial' );
folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) );
folder.add( material, 'wireframe' );
folder.add( material, 'wireframeLinewidth', 0, 10 );
folder.add( material, 'vertexColors', constants.colors).onChange( needsUpdate( material, geometry ) );
folder.add( material, 'vertexColors', constants.colors ).onChange( needsUpdate( material, geometry ) );
folder.add( material, 'fog' );
folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
......@@ -333,13 +334,12 @@ function guiMeshBasicMaterial ( gui, mesh, material, geometry ) {
folder.add( material, 'combine', constants.combine ).onChange( updateMorphs( mesh, material ) );
folder.add( material, 'reflectivity', 0, 1 );
folder.add( material, 'refractionRatio', 0, 1 );
//folder.add( material, 'skinning' );
}
function guiMeshDepthMaterial ( gui, mesh, material, geometry ) {
function guiMeshDepthMaterial( gui, mesh, material, geometry ) {
var folder = gui.addFolder('THREE.MeshDepthMaterial');
var folder = gui.addFolder( 'THREE.MeshDepthMaterial' );
folder.add( material, 'wireframe' );
folder.add( material, 'wireframeLinewidth', 0, 10 );
......@@ -347,9 +347,9 @@ function guiMeshDepthMaterial ( gui, mesh, material, geometry ) {
}
function guiMeshNormalMaterial ( gui, mesh, material, geometry ) {
function guiMeshNormalMaterial( gui, mesh, material, geometry ) {
var folder = gui.addFolder('THREE.MeshNormalMaterial');
var folder = gui.addFolder( 'THREE.MeshNormalMaterial' );
folder.add( material, 'flatShading' ).onChange( needsUpdate( material, geometry ) );
folder.add( material, 'wireframe' );
......@@ -358,37 +358,37 @@ function guiMeshNormalMaterial ( gui, mesh, material, geometry ) {
}
function guiLineBasicMaterial ( gui, mesh, material, geometry ) {
function guiLineBasicMaterial( gui, mesh, material, geometry ) {
var data = {
color : material.color.getHex()
color: material.color.getHex()
};
var folder = gui.addFolder('THREE.LineBasicMaterial');
var folder = gui.addFolder( 'THREE.LineBasicMaterial' );
folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) );
folder.add( material, 'linewidth', 0, 10 );
folder.add( material, 'linecap', ["butt", "round", "square"] );
folder.add( material, 'linejoin', ["round", "bevel", "miter"] );
folder.add( material, 'vertexColors', constants.colors).onChange( needsUpdate( material, geometry ) );
folder.add( material, 'linecap', [ 'butt', 'round', 'square' ] );
folder.add( material, 'linejoin', [ 'round', 'bevel', 'miter' ] );
folder.add( material, 'vertexColors', constants.colors ).onChange( needsUpdate( material, geometry ) );
folder.add( material, 'fog' );
}
function guiMeshLambertMaterial ( gui, mesh, material, geometry ) {
function guiMeshLambertMaterial( gui, mesh, material, geometry ) {
var data = {
color : material.color.getHex(),
emissive : material.emissive.getHex(),
envMaps : envMapKeys,
map : textureMapKeys,
specularMap : textureMapKeys,
alphaMap : textureMapKeys
color: material.color.getHex(),
emissive: material.emissive.getHex(),
envMaps: envMapKeys,
map: textureMapKeys,
specularMap: textureMapKeys,
alphaMap: textureMapKeys
};
var envObj = {};
var folder = gui.addFolder('THREE.MeshLambertMaterial');
var folder = gui.addFolder( 'THREE.MeshLambertMaterial' );
folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) );
folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive ) );
......@@ -410,30 +410,30 @@ function guiMeshLambertMaterial ( gui, mesh, material, geometry ) {
}
function guiMeshPhongMaterial ( gui, mesh, material, geometry ) {
function guiMeshPhongMaterial( gui, mesh, material, geometry ) {
var data = {
color : material.color.getHex(),
emissive : material.emissive.getHex(),
specular : material.specular.getHex(),
envMaps : envMapKeys,
map : textureMapKeys,
lightMap : textureMapKeys,
specularMap : textureMapKeys,
alphaMap : textureMapKeys
color: material.color.getHex(),
emissive: material.emissive.getHex(),
specular: material.specular.getHex(),
envMaps: envMapKeys,
map: textureMapKeys,
lightMap: textureMapKeys,
specularMap: textureMapKeys,
alphaMap: textureMapKeys
};
var folder = gui.addFolder('THREE.MeshPhongMaterial');
var folder = gui.addFolder( 'THREE.MeshPhongMaterial' );
folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) );
folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive ) );
folder.addColor( data, 'specular' ).onChange( handleColorChange( material.specular ) );
folder.add( material, 'shininess', 0, 100);
folder.add( material, 'shininess', 0, 100 );
folder.add( material, 'flatShading' ).onChange( needsUpdate( material, geometry ) );
folder.add( material, 'wireframe' );
folder.add( material, 'wireframeLinewidth', 0, 10 );
folder.add( material, 'vertexColors', constants.colors);
folder.add( material, 'vertexColors', constants.colors );
folder.add( material, 'fog' );
folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
folder.add( data, 'map', textureMapKeys ).onChange( updateTexture( material, 'map', textureMaps ) );
......@@ -443,19 +443,19 @@ function guiMeshPhongMaterial ( gui, mesh, material, geometry ) {
}
function guiMeshStandardMaterial ( gui, mesh, material, geometry ) {
function guiMeshStandardMaterial( gui, mesh, material, geometry ) {
var data = {
color : material.color.getHex(),
emissive : material.emissive.getHex(),
envMaps : envMapKeys,
map : textureMapKeys,
lightMap : textureMapKeys,
specularMap : textureMapKeys,
alphaMap : textureMapKeys
color: material.color.getHex(),
emissive: material.emissive.getHex(),
envMaps: envMapKeys,
map: textureMapKeys,
lightMap: textureMapKeys,
specularMap: textureMapKeys,
alphaMap: textureMapKeys
};
var folder = gui.addFolder('THREE.MeshStandardMaterial');
var folder = gui.addFolder( 'THREE.MeshStandardMaterial' );
folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) );
folder.addColor( data, 'emissive' ).onChange( handleColorChange( material.emissive ) );
......@@ -465,7 +465,7 @@ function guiMeshStandardMaterial ( gui, mesh, material, geometry ) {
folder.add( material, 'flatShading' ).onChange( needsUpdate( material, geometry ) );
folder.add( material, 'wireframe' );
folder.add( material, 'wireframeLinewidth', 0, 10 );
folder.add( material, 'vertexColors', constants.colors);
folder.add( material, 'vertexColors', constants.colors );
folder.add( material, 'fog' );
folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
folder.add( data, 'map', textureMapKeys ).onChange( updateTexture( material, 'map', textureMaps ) );
......@@ -476,16 +476,16 @@ function guiMeshStandardMaterial ( gui, mesh, material, geometry ) {
}
function chooseFromHash ( gui, mesh, geometry ) {
function chooseFromHash( gui, mesh, geometry ) {
var selectedMaterial = window.location.hash.substring(1) || "MeshBasicMaterial";
var selectedMaterial = window.location.hash.substring( 1 ) || 'MeshBasicMaterial';
var material;
switch (selectedMaterial) {
switch ( selectedMaterial ) {
case "MeshBasicMaterial" :
case 'MeshBasicMaterial' :
material = new THREE.MeshBasicMaterial({color: 0x2194CE});
material = new THREE.MeshBasicMaterial( { color: 0x2194CE } );
guiMaterial( gui, mesh, material, geometry );
guiMeshBasicMaterial( gui, mesh, material, geometry );
......@@ -493,9 +493,9 @@ function chooseFromHash ( gui, mesh, geometry ) {
break;
case "MeshLambertMaterial" :
case 'MeshLambertMaterial' :
material = new THREE.MeshLambertMaterial({color: 0x2194CE});
material = new THREE.MeshLambertMaterial( { color: 0x2194CE } );
guiMaterial( gui, mesh, material, geometry );
guiMeshLambertMaterial( gui, mesh, material, geometry );
......@@ -503,9 +503,9 @@ function chooseFromHash ( gui, mesh, geometry ) {
break;
case "MeshPhongMaterial" :
case 'MeshPhongMaterial' :
material = new THREE.MeshPhongMaterial({color: 0x2194CE});
material = new THREE.MeshPhongMaterial( { color: 0x2194CE } );
guiMaterial( gui, mesh, material, geometry );
guiMeshPhongMaterial( gui, mesh, material, geometry );
......@@ -513,9 +513,9 @@ function chooseFromHash ( gui, mesh, geometry ) {
break;
case "MeshStandardMaterial" :
case 'MeshStandardMaterial' :
material = new THREE.MeshStandardMaterial({color: 0x2194CE});
material = new THREE.MeshStandardMaterial( { color: 0x2194CE } );
guiMaterial( gui, mesh, material, geometry );
guiMeshStandardMaterial( gui, mesh, material, geometry );
......@@ -523,7 +523,7 @@ function chooseFromHash ( gui, mesh, geometry ) {
break;
case "MeshDepthMaterial" :
case 'MeshDepthMaterial' :
material = new THREE.MeshDepthMaterial();
guiMaterial( gui, mesh, material, geometry );
......@@ -533,7 +533,7 @@ function chooseFromHash ( gui, mesh, geometry ) {
break;
case "MeshNormalMaterial" :
case 'MeshNormalMaterial' :
material = new THREE.MeshNormalMaterial();
guiMaterial( gui, mesh, material, geometry );
......@@ -543,15 +543,16 @@ function chooseFromHash ( gui, mesh, geometry ) {
break;
case "LineBasicMaterial" :
case 'LineBasicMaterial' :
material = new THREE.LineBasicMaterial({color: 0x2194CE});
material = new THREE.LineBasicMaterial( { color: 0x2194CE } );
guiMaterial( gui, mesh, material, geometry );
guiLineBasicMaterial( gui, mesh, material, geometry );
return material;
break;
}
}
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或