Cleaning..

src/Mesh/babylon.mesh.vertexData.js

@@ -663,15 +663,22 @@ var BABYLON;
             var tessellation = options.tessellation || 24;
             var subdivisions = options.subdivisions || 1;
             var hasRings = options.hasRings;
+            var enclose = options.enclose;
             var arc = (options.arc <= 0 || options.arc > 1) ? 1.0 : options.arc || 1.0;
             var sideOrientation = (options.sideOrientation === 0) ? 0 : options.sideOrientation || BABYLON.Mesh.DEFAULTSIDE;
             var faceUV = options.faceUV || new Array(3);
             var faceColors = options.faceColors;
             // default face colors and UV if undefined
-            for (var f = 0; f < 3; f++) {
+            var quadNb = (arc !== 1 && enclose) ? 2 : 0;
+            var ringNb = (hasRings) ? subdivisions : 1;
+            var colorNb = 2 + (1 + quadNb) * ringNb;
+            var f;
+            for (f = 0; f < colorNb; f++) {
                 if (faceColors && faceColors[f] === undefined) {
                     faceColors[f] = new BABYLON.Color4(1, 1, 1, 1);
                 }
+            }
+            for (f = 0; f < 3; f++) {
                 if (faceUV && faceUV[f] === undefined) {
                     faceUV[f] = new BABYLON.Vector4(0, 0, 1, 1);
                 }
@@ -688,6 +695,10 @@ var BABYLON;
             var tan = (diameterBottom - diameterTop) / 2 / height;
             var ringVertex = BABYLON.Vector3.Zero();
             var ringNormal = BABYLON.Vector3.Zero();
+            var ringFirstVertex = BABYLON.Vector3.Zero();
+            var ringFirstNormal = BABYLON.Vector3.Zero();
+            var quadNormal = BABYLON.Vector3.Zero();
+            var Y = BABYLON.Axis.Y;
             // positions, normals, uvs
             var i;
             var j;
@@ -700,9 +711,11 @@ var BABYLON;
                 for (r = 0; r < ringIdx; r++) {
                     for (j = 0; j <= tessellation; j++) {
                         angle = j * angle_step;
+                        // position
                         ringVertex.x = Math.cos(-angle) * radius;
                         ringVertex.y = -height / 2 + h * height;
                         ringVertex.z = Math.sin(-angle) * radius;
+                        // normal
                         if (diameterTop === 0 && i === subdivisions) {
                             // if no top cap, reuse former normals
                             ringNormal.x = normals[normals.length - (tessellation + 1) * 3];
@@ -715,6 +728,11 @@ var BABYLON;
                             ringNormal.y = Math.sqrt(ringNormal.x * ringNormal.x + ringNormal.z * ringNormal.z) * tan;
                             ringNormal.normalize();
                         }
+                        // keep first values for enclose
+                        if (j === 0) {
+                            ringFirstVertex.copyFrom(ringVertex);
+                            ringFirstNormal.copyFrom(ringNormal);
+                        }
                         positions.push(ringVertex.x, ringVertex.y, ringVertex.z);
                         normals.push(ringNormal.x, ringNormal.y, ringNormal.z);
                         uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x) * j / tessellation, faceUV[1].y + (faceUV[1].w - faceUV[1].y) * h);
@@ -722,20 +740,50 @@ var BABYLON;
                             colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
                         }
                     }
+                    // if enclose, add four vertices and their dedicated normals
+                    if (arc !== 1 && enclose) {
+                        positions.push(ringVertex.x, ringVertex.y, ringVertex.z);
+                        positions.push(0, ringVertex.y, 0);
+                        positions.push(0, ringVertex.y, 0);
+                        positions.push(ringFirstVertex.x, ringFirstVertex.y, ringFirstVertex.z);
+                        BABYLON.Vector3.CrossToRef(Y, ringNormal, quadNormal);
+                        quadNormal.normalize();
+                        normals.push(quadNormal.x, quadNormal.y, quadNormal.z, quadNormal.x, quadNormal.y, quadNormal.z);
+                        BABYLON.Vector3.CrossToRef(ringFirstNormal, Y, quadNormal);
+                        quadNormal.normalize();
+                        normals.push(quadNormal.x, quadNormal.y, quadNormal.z, quadNormal.x, quadNormal.y, quadNormal.z);
+                        uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x), faceUV[1].y + (faceUV[1].w - faceUV[1].y));
+                        uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x), faceUV[1].y + (faceUV[1].w - faceUV[1].y));
+                        uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x), faceUV[1].y + (faceUV[1].w - faceUV[1].y));
+                        uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x), faceUV[1].y + (faceUV[1].w - faceUV[1].y));
+                        if (faceColors) {
+                            colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
+                            colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
+                            colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
+                            colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
+                        }
+                    }
                 }
             }
             // indices
+            var e = (arc !== 1 && enclose) ? tessellation + 4 : tessellation; // correction of number of iteration if enclose
             var s;
             i = 0;
             for (s = 0; s < subdivisions; s++) {
                 for (j = 0; j < tessellation; j++) {
-                    var i0 = i * (tessellation + 1) + j;
-                    var i1 = (i + 1) * (tessellation + 1) + j;
-                    var i2 = i * (tessellation + 1) + (j + 1);
-                    var i3 = (i + 1) * (tessellation + 1) + (j + 1);
+                    var i0 = i * (e + 1) + j;
+                    var i1 = (i + 1) * (e + 1) + j;
+                    var i2 = i * (e + 1) + (j + 1);
+                    var i3 = (i + 1) * (e + 1) + (j + 1);
                     indices.push(i0, i1, i2);
                     indices.push(i3, i2, i1);
                 }
+                if (arc !== 1 && enclose) {
+                    indices.push(i0 + 2, i1 + 2, i2 + 2);
+                    indices.push(i3 + 2, i2 + 2, i1 + 2);
+                    indices.push(i0 + 4, i1 + 4, i2 + 4);
+                    indices.push(i3 + 4, i2 + 4, i1 + 4);
+                }
                 i = (hasRings) ? (i + 2) : (i + 1);
             }
             // Caps
@@ -751,7 +799,7 @@ var BABYLON;
                 var u = (isTop) ? faceUV[2] : faceUV[0];
                 var c;
                 if (faceColors) {
-                    c = (isTop) ? faceColors[2] : faceColors[0];
+                    c = (isTop) ? faceColors[colorNb - 1] : faceColors[0];
                 }
                 // cap center
                 var vbase = positions.length / 3;
@@ -1158,99 +1206,31 @@ var BABYLON;
             ];
             // index of 3 vertex makes a face of icopshere
             var ico_indices = [
-                0, 11, 5, 0, 5, 1, 0, 1, 7, 0, 7, 10, 12, 22, 23,
-                1, 5, 20, 5, 11, 4, 23, 22, 13, 22, 18, 6, 7, 1, 8,
-                14, 21, 4, 14, 4, 2, 16, 13, 6, 15, 6, 19, 3, 8, 9,
-                4, 21, 5, 13, 17, 23, 6, 13, 22, 19, 6, 18, 9, 8, 1
-            ];
-            // vertex for uv have aliased position, not for UV
-            var vertices_unalias_id = [
-                0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11,
-                // vertex alias
-                0,
-                2,
-                3,
-                3,
-                3,
-                4,
-                7,
-                8,
-                9,
-                9,
-                10,
-                11 // 23: B + 12
+                0, 11, 5, 0, 5, 1, 0, 1, 7, 0, 7, 10, 0, 10, 11,
+                1, 5, 9, 5, 11, 4, 11, 10, 2, 10, 7, 6, 7, 1, 8,
+                3, 9, 4, 3, 4, 2, 3, 2, 6, 3, 6, 8, 3, 8, 9,
+                4, 9, 5, 2, 4, 11, 6, 2, 10, 8, 6, 7, 9, 8, 1
             ];
             // uv as integer step (not pixels !)
             var ico_vertexuv = [
-                5, 1, 3, 1, 6, 4, 0, 0,
-                5, 3, 4, 2, 2, 2, 4, 0,
-                2, 0, 1, 1, 6, 0, 6, 2,
-                // vertex alias (for same vertex on different faces)
-                0, 4,
-                3, 3,
-                4, 4,
-                3, 1,
-                4, 2,
-                4, 4,
-                0, 2,
-                1, 1,
-                2, 2,
-                3, 3,
-                1, 3,
-                2, 4 // 23: B + 12
+                4, 1, 2, 1, 6, 3, 5, 4,
+                4, 3, 3, 2, 7, 4, 3, 0,
+                1, 0, 0, 1, 5, 0, 5, 2 // v8-11
             ];
-            // Vertices[0, 1, ...9, A, B] : position on UV plane
-            // '+' indicate duplicate position to be fixed (3,9:0,2,3,4,7,8,A,B)
-            // First island of uv mapping
-            // v = 4h          3+  2
-            // v = 3h        9+  4
-            // v = 2h      9+  5   B
-            // v = 1h    9   1   0
-            // v = 0h  3   8   7   A
-            //     u = 0 1 2 3 4 5 6  *a
-            // Second island of uv mapping
-            // v = 4h  0+  B+  4+
-            // v = 3h    A+  2+
-            // v = 2h  7+  6   3+
-            // v = 1h    8+  3+
-            // v = 0h
-            //     u = 0 1 2 3 4 5 6  *a
-            // Face layout on texture UV mapping
-            // ============
-            // \ 4  /\ 16 /   ======
-            //  \  /  \  /   /\ 11 /
-            //   \/ 7  \/   /  \  /
-            //    =======  / 10 \/
-            //   /\ 17 /\  =======
-            //  /  \  /  \ \ 15 /\
-            // / 8  \/ 12 \ \  /  \
-            // ============  \/ 6  \
-            // \ 18 /\  ============
-            //  \  /  \ \ 5  /\ 0  /
-            //   \/ 13 \ \  /  \  /
-            //   =======  \/ 1  \/
-            //       =============
-            //      /\ 19 /\  2 /\
-            //     /  \  /  \  /  \
-            //    / 14 \/ 9  \/  3 \
-            //   ===================
+            // Vertices [0, 1, ...9, A, B] : position on UV plane (7,8,9,10=A have duplicate position)
+            // v=5h          9+  8+  7+
+            // v=4h        9+  3   6   A+
+            // v=3h      9+  4   2   A+
+            // v=2h    9+  5   B   A+
+            // v=1h  9   1   0   A+
+            // v=0h    8   7   A
+            //     u=0 1 2 3 4 5 6 7 8 9   *a
+            //
             // uv step is u:1 or 0.5, v:cos(30)=sqrt(3)/2, ratio approx is 84/97
-            var ustep = 138 / 1024;
-            var vstep = 239 / 1024;
-            var uoffset = 60 / 1024;
-            var voffset = 26 / 1024;
-            // Second island should have margin, not to touch the first island
-            // avoid any borderline artefact in pixel rounding
-            var island_u_offset = -40 / 1024;
-            var island_v_offset = +20 / 1024;
-            // face is either island 0 or 1 :
-            // second island is for faces : [4, 7, 8, 12, 13, 16, 17, 18]
-            var island = [
-                0, 0, 0, 0, 1,
-                0, 0, 1, 1, 0,
-                0, 0, 1, 1, 0,
-                0, 1, 1, 1, 0,
-            ];
+            var ustep = 97 / 1024;
+            var vstep = 168 / 1024;
+            var uoffset = 50 / 1024;
+            var voffset = 51 / 1024;
             var indices = [];
             var positions = [];
             var normals = [];
@@ -1267,14 +1247,60 @@ var BABYLON;
             for (var face = 0; face < 20; face++) {
                 // 3 vertex per face
                 for (var v012 = 0; v012 < 3; v012++) {
-                    // look up vertex 0,1,2 to its index in 0 to 11 (or 23 including alias)
+                    // look up vertex 0,1,2 to its index in 0 to 11
                     var v_id = ico_indices[3 * face + v012];
                     // vertex have 3D position (x,y,z)
-                    face_vertex_pos[v012].copyFromFloats(ico_vertices[3 * vertices_unalias_id[v_id]], ico_vertices[3 * vertices_unalias_id[v_id] + 1], ico_vertices[3 * vertices_unalias_id[v_id] + 2]);
+                    face_vertex_pos[v012].copyFromFloats(ico_vertices[3 * v_id], ico_vertices[3 * v_id + 1], ico_vertices[3 * v_id + 2]);
                     // Normalize to get normal, then scale to radius
                     face_vertex_pos[v012].normalize().scaleInPlace(radius);
-                    // uv Coordinates from vertex ID
-                    face_vertex_uv[v012].copyFromFloats(ico_vertexuv[2 * v_id] * ustep + uoffset + island[face] * island_u_offset, ico_vertexuv[2 * v_id + 1] * vstep + voffset + island[face] * island_v_offset);
+                    // uv from vertex ID (may need fix due to unwrap on texture plan, unalias needed)
+                    // vertex may get to different UV according to belonging face (see fix below)
+                    var fix = 0;
+                    // Vertice 9 UV to be fixed
+                    if (face === 5 && v012 === 2) {
+                        fix = 1;
+                    }
+                    if (face === 15 && v012 === 1) {
+                        fix = 2;
+                    }
+                    if (face === 10 && v012 === 1) {
+                        fix = 3;
+                    }
+                    if (face === 14 && v012 === 2) {
+                        fix = 4;
+                    }
+                    // vertice 10 UV to be fixed
+                    if (face === 4 && v012 === 1) {
+                        fix = 1;
+                    }
+                    if (face === 7 && v012 === 1) {
+                        fix = 2;
+                    }
+                    if (face === 17 && v012 === 2) {
+                        fix = 3;
+                    }
+                    if (face === 8 && v012 === 0) {
+                        fix = 4;
+                    }
+                    // vertice 7 UV to be fixed
+                    if (face === 8 && v012 === 1) {
+                        fix = 5;
+                    }
+                    if (face === 18 && v012 === 0) {
+                        fix = 5;
+                    }
+                    // vertice 8 UV to be fixed
+                    if (face === 13 && v012 === 2) {
+                        fix = 5;
+                    }
+                    if (face === 14 && v012 === 1) {
+                        fix = 5;
+                    }
+                    if (face === 18 && v012 === 2) {
+                        fix = 5;
+                    }
+                    //
+                    face_vertex_uv[v012].copyFromFloats((ico_vertexuv[2 * v_id] + fix) * ustep + uoffset, (ico_vertexuv[2 * v_id + 1] + fix) * vstep + voffset);
                 }
                 // Subdivide the face (interpolate pos, norm, uv)
                 // - pos is linear interpolation, then projected to sphere (converge polyhedron to sphere)

src/Mesh/babylon.mesh.vertexData.ts

@@ -805,22 +805,30 @@
         }
 
         // Cylinder and cone 
-        public static CreateCylinder(options: { height?: number, diameterTop?: number, diameterBottom?: number, diameter?: number, tessellation?: number, subdivisions?: number, arc?: number, faceColors?: Color4[], faceUV?: Vector4[], hasRings?: boolean, sideOrientation?: number }): VertexData {
+        public static CreateCylinder(options: { height?: number, diameterTop?: number, diameterBottom?: number, diameter?: number, tessellation?: number, subdivisions?: number, arc?: number, faceColors?: Color4[], faceUV?: Vector4[], hasRings?: boolean, enclose?: boolean, sideOrientation?: number }): VertexData {
             var height: number = options.height || 2;
             var diameterTop: number = (options.diameterTop === 0) ? 0 : options.diameterTop || options.diameter || 1;
             var diameterBottom: number = options.diameterBottom || options.diameter || 1;
             var tessellation: number = options.tessellation || 24;
             var subdivisions: number = options.subdivisions || 1;
             var hasRings: boolean = options.hasRings;
+            var enclose: boolean = options.enclose;
             var arc: number = (options.arc <= 0 || options.arc > 1) ? 1.0 : options.arc || 1.0;
             var sideOrientation: number = (options.sideOrientation === 0) ? 0 : options.sideOrientation || Mesh.DEFAULTSIDE;
             var faceUV: Vector4[] = options.faceUV || new Array<Vector4>(3);
             var faceColors: Color4[] = options.faceColors;
+    
             // default face colors and UV if undefined
-            for (var f = 0; f < 3; f++) {
+            var quadNb: number = (arc !== 1 && enclose) ? 2 : 0;
+            var ringNb: number = (hasRings) ? subdivisions : 1;
+            var colorNb: number = 2 + (1 + quadNb) * ringNb;
+            var f: number;
+            for (f = 0; f < colorNb; f++) {
                 if (faceColors && faceColors[f] === undefined) {
                     faceColors[f] = new Color4(1, 1, 1, 1);
                 }
+            }
+            for (f = 0; f < 3; f++) {
                 if (faceUV && faceUV[f] === undefined) {
                     faceUV[f] = new Vector4(0, 0, 1, 1);
                 }
@@ -839,12 +847,17 @@
             var tan = (diameterBottom - diameterTop) / 2 / height;
             var ringVertex: Vector3 = Vector3.Zero();
             var ringNormal: Vector3 = Vector3.Zero();
+            var ringFirstVertex: Vector3 = Vector3.Zero();
+            var ringFirstNormal: Vector3 = Vector3.Zero();
+            var quadNormal: Vector3 = Vector3.Zero();
+            var Y: Vector3 = Axis.Y;
 
             // positions, normals, uvs
             var i: number;
             var j: number;
             var r: number;
-            var ringIdx = 1;
+            var ringIdx: number = 1;
+
             for (i = 0; i <= subdivisions; i++) {
                 h = i / subdivisions;
                 radius = (h * (diameterTop - diameterBottom) + diameterBottom) / 2;
@@ -852,9 +865,13 @@
                 for (r = 0; r < ringIdx; r++) {
                     for (j = 0; j <= tessellation; j++) {
                         angle = j * angle_step;
+
+                        // position
                         ringVertex.x = Math.cos(-angle) * radius;
                         ringVertex.y = -height / 2 + h * height;
                         ringVertex.z = Math.sin(-angle) * radius;
+
+                        // normal
                         if (diameterTop === 0 && i === subdivisions) {
                             // if no top cap, reuse former normals
                             ringNormal.x = normals[normals.length - (tessellation + 1) * 3];
@@ -867,6 +884,13 @@
                             ringNormal.y = Math.sqrt(ringNormal.x * ringNormal.x + ringNormal.z * ringNormal.z) * tan;
                             ringNormal.normalize();
                         }
+
+                        // keep first values for enclose
+                        if (j === 0) {
+                            ringFirstVertex.copyFrom(ringVertex);
+                            ringFirstNormal.copyFrom(ringNormal);
+                        }
+
                         positions.push(ringVertex.x, ringVertex.y, ringVertex.z);
                         normals.push(ringNormal.x, ringNormal.y, ringNormal.z);
                         uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x) * j / tessellation, faceUV[1].y + (faceUV[1].w - faceUV[1].y) * h);
@@ -874,21 +898,52 @@
                             colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
                         }
                     }
+
+                    // if enclose, add four vertices and their dedicated normals
+                    if (arc !== 1 && enclose) {
+                        positions.push(ringVertex.x, ringVertex.y, ringVertex.z);
+                        positions.push(0, ringVertex.y, 0);
+                        positions.push(0, ringVertex.y, 0);
+                        positions.push(ringFirstVertex.x, ringFirstVertex.y, ringFirstVertex.z);
+                        Vector3.CrossToRef(Y, ringNormal, quadNormal);
+                        quadNormal.normalize();
+                        normals.push(quadNormal.x, quadNormal.y, quadNormal.z, quadNormal.x, quadNormal.y, quadNormal.z);
+                        Vector3.CrossToRef(ringFirstNormal, Y, quadNormal);
+                        quadNormal.normalize();
+                        normals.push(quadNormal.x, quadNormal.y, quadNormal.z, quadNormal.x, quadNormal.y, quadNormal.z);
+                        uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x), faceUV[1].y + (faceUV[1].w - faceUV[1].y));
+                        uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x), faceUV[1].y + (faceUV[1].w - faceUV[1].y));
+                        uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x), faceUV[1].y + (faceUV[1].w - faceUV[1].y));
+                        uvs.push(faceUV[1].x + (faceUV[1].z - faceUV[1].x), faceUV[1].y + (faceUV[1].w - faceUV[1].y));
+                        if (faceColors) {
+                            colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
+                            colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
+                            colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
+                            colors.push(faceColors[1].r, faceColors[1].g, faceColors[1].b, faceColors[1].a);
+                        }
+                    }
                 }
             }
 
             // indices
-            var s;
+            var e: number = (arc !== 1 && enclose) ? tessellation + 4 : tessellation;     // correction of number of iteration if enclose
+            var s: number;
             i = 0;
             for (s = 0; s < subdivisions; s++) {
                 for (j = 0; j < tessellation; j++) {
-                    var i0 = i * (tessellation + 1) + j;
-                    var i1 = (i + 1) * (tessellation + 1) + j;
-                    var i2 = i * (tessellation + 1) + (j + 1);
-                    var i3 = (i + 1) * (tessellation + 1) + (j + 1);
+                    var i0 = i * (e + 1) + j;
+                    var i1 = (i + 1) * (e + 1) + j;
+                    var i2 = i * (e + 1) + (j + 1);
+                    var i3 = (i + 1) * (e + 1) + (j + 1);
                     indices.push(i0, i1, i2);
                     indices.push(i3, i2, i1);
                 }
+                if (arc !== 1 && enclose) {      // if enclose, add two quads
+                    indices.push(i0 + 2, i1 + 2, i2 + 2);
+                    indices.push(i3 + 2, i2 + 2, i1 + 2);
+                    indices.push(i0 + 4, i1 + 4, i2 + 4);
+                    indices.push(i3 + 4, i2 + 4, i1 + 4);
+                }
                 i = (hasRings) ? (i + 2) : (i + 1);
             }
 
@@ -906,7 +961,7 @@
                 var u: Vector4 = (isTop) ? faceUV[2] : faceUV[0];
                 var c: Color4;
                 if (faceColors) {
-                    c = (isTop) ? faceColors[2] : faceColors[0];
+                    c = (isTop) ? faceColors[colorNb - 1] : faceColors[0];
                 }
                 // cap center
                 var vbase = positions.length / 3;
@@ -1394,7 +1449,7 @@
             return vertexData;
         }
 
-        public static CreateIcoSphere(options: {radius?: number, radiusX?: number, radiusY?: number, radiusZ?: number, flat?: number, subdivisions?: number, sideOrientation?: number}): VertexData {
+        public static CreateIcoSphere(options: { radius?: number, radiusX?: number, radiusY?: number, radiusZ?: number, flat?: number, subdivisions?: number, sideOrientation?: number }): VertexData {
             var sideOrientation = options.sideOrientation || Mesh.DEFAULTSIDE;
             var radius = options.radius || 1;
             var flat = (options.flat === undefined) ? true : options.flat;
@@ -1414,105 +1469,33 @@
 
             // index of 3 vertex makes a face of icopshere
             var ico_indices = [
-                0, 11, 5, 0, 5, 1, 0, 1, 7, 0, 7, 10, 12, 22, 23,
-                1, 5, 20, 5, 11, 4, 23, 22, 13, 22, 18, 6, 7, 1, 8,
-                14, 21, 4, 14, 4, 2, 16, 13, 6, 15, 6, 19, 3, 8, 9,
-                4, 21, 5, 13, 17, 23, 6, 13, 22, 19, 6, 18, 9, 8, 1
-            ];
-            // vertex for uv have aliased position, not for UV
-            var vertices_unalias_id = [
-                0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11,
-                // vertex alias
-                0,  // 12: 0 + 12
-                2,  // 13: 2 + 11
-                3,  // 14: 3 + 11
-                3,  // 15: 3 + 12
-                3,  // 16: 3 + 13
-                4,  // 17: 4 + 13
-                7,  // 18: 7 + 11
-                8,  // 19: 8 + 11
-                9,  // 20: 9 + 11
-                9,  // 21: 9 + 12
-                10, // 22: A + 12
-                11 // 23: B + 12
+                0, 11, 5, 0, 5, 1, 0, 1, 7, 0, 7, 10, 0, 10, 11,
+                1, 5, 9, 5, 11, 4, 11, 10, 2, 10, 7, 6, 7, 1, 8,
+                3, 9, 4, 3, 4, 2, 3, 2, 6, 3, 6, 8, 3, 8, 9,
+                4, 9, 5, 2, 4, 11, 6, 2, 10, 8, 6, 7, 9, 8, 1
             ];
 
-
             // uv as integer step (not pixels !)
             var ico_vertexuv = [
-                5, 1, 3, 1, 6, 4, 0, 0,  // v0-3
-                5, 3, 4, 2, 2, 2, 4, 0,  // v4-7
-                2, 0, 1, 1, 6, 0, 6, 2,  // v8-11
-                // vertex alias (for same vertex on different faces)
-                0, 4, // 12: 0 + 12
-                3, 3, // 13: 2 + 11
-                4, 4, // 14: 3 + 11
-                3, 1, // 15: 3 + 12
-                4, 2, // 16: 3 + 13
-                4, 4, // 17: 4 + 13
-                0, 2, // 18: 7 + 11
-                1, 1, // 19: 8 + 11
-                2, 2, // 20: 9 + 11
-                3, 3, // 21: 9 + 12
-                1, 3, // 22: A + 12
-                2, 4  // 23: B + 12
+                4, 1, 2, 1, 6, 3, 5, 4,  // v0-3
+                4, 3, 3, 2, 7, 4, 3, 0,  // v4-7
+                1, 0, 0, 1, 5, 0, 5, 2   // v8-11
             ];
-
-            // Vertices[0, 1, ...9, A, B] : position on UV plane
-            // '+' indicate duplicate position to be fixed (3,9:0,2,3,4,7,8,A,B)
-            // First island of uv mapping
-            // v = 4h          3+  2
-            // v = 3h        9+  4
-            // v = 2h      9+  5   B
-            // v = 1h    9   1   0
-            // v = 0h  3   8   7   A
-            //     u = 0 1 2 3 4 5 6  *a
-
-            // Second island of uv mapping
-            // v = 4h  0+  B+  4+
-            // v = 3h    A+  2+
-            // v = 2h  7+  6   3+
-            // v = 1h    8+  3+
-            // v = 0h
-            //     u = 0 1 2 3 4 5 6  *a
-
-            // Face layout on texture UV mapping
-            // ============
-            // \ 4  /\ 16 /   ======
-            //  \  /  \  /   /\ 11 /
-            //   \/ 7  \/   /  \  /
-            //    =======  / 10 \/
-            //   /\ 17 /\  =======
-            //  /  \  /  \ \ 15 /\
-            // / 8  \/ 12 \ \  /  \
-            // ============  \/ 6  \
-            // \ 18 /\  ============
-            //  \  /  \ \ 5  /\ 0  /
-            //   \/ 13 \ \  /  \  /
-            //   =======  \/ 1  \/
-            //       =============
-            //      /\ 19 /\  2 /\
-            //     /  \  /  \  /  \
-            //    / 14 \/ 9  \/  3 \
-            //   ===================
+            // Vertices [0, 1, ...9, A, B] : position on UV plane (7,8,9,10=A have duplicate position)
+            // v=5h          9+  8+  7+
+            // v=4h        9+  3   6   A+
+            // v=3h      9+  4   2   A+
+            // v=2h    9+  5   B   A+
+            // v=1h  9   1   0   A+
+            // v=0h    8   7   A
+            //     u=0 1 2 3 4 5 6 7 8 9   *a
+            //
 
             // uv step is u:1 or 0.5, v:cos(30)=sqrt(3)/2, ratio approx is 84/97
-            var ustep = 138 / 1024;
-            var vstep = 239 / 1024;
-            var uoffset = 60 / 1024;
-            var voffset = 26 / 1024;
-            // Second island should have margin, not to touch the first island
-            // avoid any borderline artefact in pixel rounding
-            var island_u_offset = -40 / 1024;
-            var island_v_offset = +20 / 1024;
-            // face is either island 0 or 1 :
-            // second island is for faces : [4, 7, 8, 12, 13, 16, 17, 18]
-            var island = [
-                0, 0, 0, 0, 1, //  0 - 4
-                0, 0, 1, 1, 0, //  5 - 9
-                0, 0, 1, 1, 0, //  10 - 14
-                0, 1, 1, 1, 0, //  15 - 19
-            ];
+            var ustep = 97 / 1024;
+            var vstep = 168 / 1024;
+            var uoffset = 50 / 1024;
+            var voffset = 51 / 1024;
 
             var indices = [];
             var positions = [];
@@ -1531,20 +1514,41 @@
             for (var face = 0; face < 20; face++) {
                 // 3 vertex per face
                 for (var v012 = 0; v012 < 3; v012++) {
-                    // look up vertex 0,1,2 to its index in 0 to 11 (or 23 including alias)
+                    // look up vertex 0,1,2 to its index in 0 to 11
                     var v_id = ico_indices[3 * face + v012];
                     // vertex have 3D position (x,y,z)
                     face_vertex_pos[v012].copyFromFloats(
-                        ico_vertices[3 * vertices_unalias_id[v_id]],
-                        ico_vertices[3 * vertices_unalias_id[v_id] + 1],
-                        ico_vertices[3 * vertices_unalias_id[v_id] + 2]);
+                        ico_vertices[3 * v_id],
+                        ico_vertices[3 * v_id + 1],
+                        ico_vertices[3 * v_id + 2]);
                     // Normalize to get normal, then scale to radius
                     face_vertex_pos[v012].normalize().scaleInPlace(radius);
 
-                    // uv Coordinates from vertex ID
+                    // uv from vertex ID (may need fix due to unwrap on texture plan, unalias needed)
+                    // vertex may get to different UV according to belonging face (see fix below)
+                    var fix = 0;
+                    // Vertice 9 UV to be fixed
+                    if (face === 5 && v012 === 2) { fix = 1; }
+                    if (face === 15 && v012 === 1) { fix = 2; }
+                    if (face === 10 && v012 === 1) { fix = 3; }
+                    if (face === 14 && v012 === 2) { fix = 4; }
+                    // vertice 10 UV to be fixed
+                    if (face === 4 && v012 === 1) { fix = 1; }
+                    if (face === 7 && v012 === 1) { fix = 2; }
+                    if (face === 17 && v012 === 2) { fix = 3; }
+                    if (face === 8 && v012 === 0) { fix = 4; }
+                    // vertice 7 UV to be fixed
+                    if (face === 8 && v012 === 1) { fix = 5; }
+                    if (face === 18 && v012 === 0) { fix = 5; }
+                    // vertice 8 UV to be fixed
+                    if (face === 13 && v012 === 2) { fix = 5; }
+                    if (face === 14 && v012 === 1) { fix = 5; }
+                    if (face === 18 && v012 === 2) { fix = 5; }
+                    //
                     face_vertex_uv[v012].copyFromFloats(
-                        ico_vertexuv[2 * v_id] * ustep + uoffset + island[face] * island_u_offset,
-                        ico_vertexuv[2 * v_id + 1] * vstep + voffset + island[face] * island_v_offset);
+                        (ico_vertexuv[2 * v_id] + fix) * ustep + uoffset,
+                        (ico_vertexuv[2 * v_id + 1] + fix) * vstep + voffset);
+
                 }
 
                 // Subdivide the face (interpolate pos, norm, uv)
@@ -1584,7 +1588,7 @@
                 // centroid of triangle is needed to get help normal computation
                 //  (c1,c2) are used for centroid location
 
-                var interp_vertex = (i1: number, i2: number, c1: number, c2: number) =>{
+                var interp_vertex = (i1: number, i2: number, c1: number, c2: number) => {
                     // vertex is interpolated from
                     //   - face_vertex_pos[0..2]
                     //   - face_vertex_uv[0..2]
@@ -1884,7 +1888,7 @@
          */
         public static ComputeNormals(positions: any, indices: any, normals: any) {
             var index = 0;
-            
+
             var p1p2x = 0.0;
             var p1p2y = 0.0;
             var p1p2z = 0.0;
@@ -1949,7 +1953,7 @@
 
                 length = Math.sqrt(faceNormalx * faceNormalx + faceNormaly * faceNormaly + faceNormalz * faceNormalz);
                 length = (length === 0) ? 1.0 : length;
-                faceNormalx /= length;                                 
+                faceNormalx /= length;
                 faceNormaly /= length;
                 faceNormalz /= length;
 
@@ -2013,8 +2017,4 @@
             }
         }
     }
-}
-
-
-
-
+}

src/Mesh/babylon.meshBuilder.ts

@@ -125,7 +125,7 @@
             }
         }
 
-        public static CreateCylinder(name: string, options: { height?: number, diameterTop?: number, diameterBottom?: number, diameter?: number, tessellation?: number, subdivisions?: number, arc?: number, faceColors?: Color4[], faceUV?: Vector4[], updatable?: boolean, sideOrientation?: number }, scene: any): Mesh {
+        public static CreateCylinder(name: string, options: { height?: number, diameterTop?: number, diameterBottom?: number, diameter?: number, tessellation?: number, subdivisions?: number, arc?: number, faceColors?: Color4[], faceUV?: Vector4[], updatable?: boolean, hasRings?: boolean, enclose?: boolean, sideOrientation?: number }, scene: any): Mesh {
             var cylinder = new Mesh(name, scene);
             var vertexData = VertexData.CreateCylinder(options);
 
@@ -799,7 +799,4 @@
             return extrudedGeneric;
         }
     }
-}
-
-
-
+}

src/Tools/babylon.loadingScreen.js

@@ -21,6 +21,7 @@ var BABYLON;
         DefaultLoadingScreen.prototype.displayLoadingUI = function () {
             var _this = this;
             this._loadingDiv = document.createElement("div");
+            this._loadingDiv.id = "babylonjsLoadingDiv";
             this._loadingDiv.style.opacity = "0";
             this._loadingDiv.style.transition = "opacity 1.5s ease";
             // Loading text

src/Tools/babylon.loadingScreen.ts

@@ -21,6 +21,7 @@ module BABYLON {
 		public displayLoadingUI(): void {
 			this._loadingDiv = document.createElement("div");
 
+		    this._loadingDiv.id = "babylonjsLoadingDiv";
             this._loadingDiv.style.opacity = "0";
             this._loadingDiv.style.transition = "opacity 1.5s ease";