6.5.3

Author: swingingtom

build/three-mesh-ui.js

@@ -972,6 +972,8 @@ function textAlign( lines, ALIGNMENT, INNER_WIDTH ) {
 
 		}
 
+		line.x = offsetX;
+
 	}
 
 	// last operations for justifications alignments
@@ -1109,54 +1111,41 @@ function InlineManager( Base ) {
 
 			// Compute lines
 			const lines = this.computeLines();
+			lines.interLine = INTERLINE;
 
 			/////////////////////////////////////////////////////////////////
 			// Position lines according to justifyContent and contentAlign
 			/////////////////////////////////////////////////////////////////
 
-			// individual vertical offset
-
-			let textHeight = lines.reduce( ( offsetY, line, i, arr ) => {
-
-				const charAlignement = line.lineHeight - line.lineBase;
-
-				line.forEach( ( inline ) => {
-
-					inline.offsetY = offsetY - line.lineHeight + charAlignement + arr[ 0 ].lineHeight;
-
-				} );
-
-				return offsetY - line.lineHeight - INTERLINE;
-
-			}, 0 ) + INTERLINE;
-
-			//
-
-			textHeight = Math.abs( textHeight );
+			const textHeight = Math.abs( lines.height );
 
 			// Line vertical positioning
 
 			const justificationOffset = ( () => {
 				switch ( JUSTIFICATION ) {
 
 					case 'start':
-						return ( INNER_HEIGHT / 2 ) - lines[ 0 ].lineHeight;
+						return (INNER_HEIGHT/2);
+
 					case 'end':
-						return textHeight - lines[ 0 ].lineHeight - ( INNER_HEIGHT / 2 ) + ( lines[ lines.length - 1 ].lineHeight - lines[ lines.length - 1 ].lineHeight );
+						return textHeight - ( INNER_HEIGHT / 2 );
+
 					case 'center':
-						return ( textHeight / 2 ) - lines[ 0 ].lineHeight;
+						return ( textHeight / 2 );
+
 					default:
 						console.warn( `justifyContent: '${JUSTIFICATION}' is not valid` );
 
 				}
 			} )();
 
-			// const justificationOffset = 0;
 
 			//
 
 			lines.forEach( ( line ) => {
 
+				line.y += justificationOffset;
+
 				line.forEach( ( inline ) => {
 
 					inline.offsetY += justificationOffset;
@@ -1345,6 +1334,10 @@ function InlineManager( Base ) {
 			// Will stock the characters of each line, so that we can
 			// correct lines position before to merge
 			const lines = [ [] ];
+			lines.height = 0;
+
+			const INTERLINE = this.getInterLine();
+			console.warn(INTERLINE);
 
 			this.childrenInlines.reduce( ( lastInlineOffset, inlineComponent ) => {
 
@@ -1409,7 +1402,8 @@ function InlineManager( Base ) {
 
 			// Compute lines dimensions
 
-			lines.forEach( ( line ) => {
+			let width = 0, height =0, lineOffsetY = -INTERLINE/2;
+			lines.forEach( ( line, i ) => {
 
 				//
 
@@ -1434,6 +1428,7 @@ function InlineManager( Base ) {
 				//
 
 				line.width = 0;
+				line.height = line.lineHeight;
 				const lineHasInlines = line[ 0 ];
 
 				if ( lineHasInlines ) {
@@ -1451,11 +1446,35 @@ function InlineManager( Base ) {
 
 					// compute its width: length from firstInline:LEFT to lastInline:RIGHT
 					line.width = this.computeLineWidth( line );
+					if( line.width > width ){
+						width = line.width;
+					}
+
+					line.forEach( ( inline ) => {
+
+						inline.offsetY = (lineOffsetY - inline.height) - inline.anchor;
+
+						if( inline.lineHeight < line.lineHeight ){
+							inline.offsetY -= line.lineBase- inline.lineBase;
+						}
+
+					} );
+
+					line.y = lineOffsetY;
+					// line.x will be set by textAlign
+
+					height += ( line.lineHeight + INTERLINE );
+
+					lineOffsetY = lineOffsetY - (line.lineHeight + INTERLINE );
 
 				}
 
 			} );
 
+			lines.height = height;
+			lines.width = width;
+
+
 			return lines;
 		}
 
@@ -1472,16 +1491,7 @@ function InlineManager( Base ) {
 			} );
 
 			const lines = this.computeLines();
-
-			const INTERLINE = this.getInterLine();
-
-			const textHeight = lines.reduce( ( offsetY, line ) => {
-
-				return offsetY - line.lineHeight - INTERLINE;
-
-			}, 0 ) + INTERLINE;
-
-			return Math.abs( textHeight );
+			return Math.abs( lines.height );
 		}
 
 		/**
@@ -3384,16 +3394,17 @@ function computeMikkTSpaceTangents( geometry, MikkTSpace, negateSign = true ) {
 
 		if ( attribute.normalized || attribute.isInterleavedBufferAttribute ) {
 
+			const srcArray = attribute.isInterleavedBufferAttribute ? attribute.data.array : attribute.array;
 			const dstArray = new Float32Array( attribute.getCount() * attribute.itemSize );
 
 			for ( let i = 0, j = 0; i < attribute.getCount(); i ++ ) {
 
-				dstArray[ j ++ ] = attribute.getX( i );
-				dstArray[ j ++ ] = attribute.getY( i );
+				dstArray[ j ++ ] = MathUtils.denormalize( attribute.getX( i ), srcArray );
+				dstArray[ j ++ ] = MathUtils.denormalize( attribute.getY( i ), srcArray );
 
 				if ( attribute.itemSize > 2 ) {
 
-					dstArray[ j ++ ] = attribute.getZ( i );
+					dstArray[ j ++ ] = MathUtils.denormalize( attribute.getZ( i ), srcArray );
 
 				}
 
@@ -3732,7 +3743,7 @@ function interleaveAttributes( attributes ) {
 	let arrayLength = 0;
 	let stride = 0;
 
-	// calculate the length and type of the interleavedBuffer
+	// calculate the the length and type of the interleavedBuffer
 	for ( let i = 0, l = attributes.length; i < l; ++ i ) {
 
 		const attribute = attributes[ i ];
@@ -3902,7 +3913,7 @@ function estimateBytesUsed( geometry ) {
 /**
  * @param {BufferGeometry} geometry
  * @param {number} tolerance
- * @return {BufferGeometry}
+ * @return {BufferGeometry>}
  */
 function mergeVertices( geometry, tolerance = 1e-4 ) {
 
@@ -3920,33 +3931,22 @@ function mergeVertices( geometry, tolerance = 1e-4 ) {
 
 	// attributes and new attribute arrays
 	const attributeNames = Object.keys( geometry.attributes );
-	const tmpAttributes = {};
-	const tmpMorphAttributes = {};
+	const attrArrays = {};
+	const morphAttrsArrays = {};
 	const newIndices = [];
 	const getters = [ 'getX', 'getY', 'getZ', 'getW' ];
-	const setters = [ 'setX', 'setY', 'setZ', 'setW' ];
 
-	// Initialize the arrays, allocating space conservatively. Extra
-	// space will be trimmed in the last step.
+	// initialize the arrays
 	for ( let i = 0, l = attributeNames.length; i < l; i ++ ) {
 
 		const name = attributeNames[ i ];
-		const attr = geometry.attributes[ name ];
 
-		tmpAttributes[ name ] = new BufferAttribute(
-			new attr.array.constructor( attr.count * attr.itemSize ),
-			attr.itemSize,
-			attr.normalized
-		);
+		attrArrays[ name ] = [];
 
 		const morphAttr = geometry.morphAttributes[ name ];
 		if ( morphAttr ) {
 
-			tmpMorphAttributes[ name ] = new BufferAttribute(
-				new morphAttr.array.constructor( morphAttr.count * morphAttr.itemSize ),
-				morphAttr.itemSize,
-				morphAttr.normalized
-			);
+			morphAttrsArrays[ name ] = new Array( morphAttr.length ).fill().map( () => [] );
 
 		}
 
@@ -3984,27 +3984,26 @@ function mergeVertices( geometry, tolerance = 1e-4 ) {
 
 		} else {
 
-			// copy data to the new index in the temporary attributes
+			// copy data to the new index in the attribute arrays
 			for ( let j = 0, l = attributeNames.length; j < l; j ++ ) {
 
 				const name = attributeNames[ j ];
 				const attribute = geometry.getAttribute( name );
 				const morphAttr = geometry.morphAttributes[ name ];
 				const itemSize = attribute.itemSize;
-				const newarray = tmpAttributes[ name ];
-				const newMorphArrays = tmpMorphAttributes[ name ];
+				const newarray = attrArrays[ name ];
+				const newMorphArrays = morphAttrsArrays[ name ];
 
 				for ( let k = 0; k < itemSize; k ++ ) {
 
 					const getterFunc = getters[ k ];
-					const setterFunc = setters[ k ];
-					newarray[ setterFunc ]( nextIndex, attribute[ getterFunc ]( index ) );
+					newarray.push( attribute[ getterFunc ]( index ) );
 
 					if ( morphAttr ) {
 
 						for ( let m = 0, ml = morphAttr.length; m < ml; m ++ ) {
 
-							newMorphArrays[ m ][ setterFunc ]( nextIndex, morphAttr[ m ][ getterFunc ]( index ) );
+							newMorphArrays[ m ].push( morphAttr[ m ][ getterFunc ]( index ) );
 
 						}
 
@@ -4022,29 +4021,31 @@ function mergeVertices( geometry, tolerance = 1e-4 ) {
 
 	}
 
-	// generate result BufferGeometry
+	// Generate typed arrays from new attribute arrays and update
+	// the attributeBuffers
 	const result = geometry.clone();
-	for ( const name in geometry.attributes ) {
+	for ( let i = 0, l = attributeNames.length; i < l; i ++ ) {
 
-		const tmpAttribute = tmpAttributes[ name ];
+		const name = attributeNames[ i ];
+		const oldAttribute = geometry.getAttribute( name );
 
-		result.setAttribute( name, new BufferAttribute(
-			tmpAttribute.array.slice( 0, nextIndex * tmpAttribute.itemSize ),
-			tmpAttribute.itemSize,
-			tmpAttribute.normalized,
-		) );
+		const buffer = new oldAttribute.array.constructor( attrArrays[ name ] );
+		const attribute = new BufferAttribute( buffer, oldAttribute.itemSize, oldAttribute.normalized );
 
-		if ( ! ( name in tmpMorphAttributes ) ) continue;
+		result.setAttribute( name, attribute );
 
-		for ( let j = 0; j < tmpMorphAttributes[ name ].length; j ++ ) {
+		// Update the attribute arrays
+		if ( name in morphAttrsArrays ) {
 
-			const tmpMorphAttribute = tmpMorphAttributes[ name ][ j ];
+			for ( let j = 0; j < morphAttrsArrays[ name ].length; j ++ ) {
 
-			result.morphAttributes[ name ][ j ] = new BufferAttribute(
-				tmpMorphAttribute.array.slice( 0, nextIndex * tmpMorphAttribute.itemSize ),
-				tmpMorphAttribute.itemSize,
-				tmpMorphAttribute.normalized,
-			);
+				const oldMorphAttribute = geometry.morphAttributes[ name ][ j ];
+
+				const buffer = new oldMorphAttribute.array.constructor( morphAttrsArrays[ name ][ j ] );
+				const morphAttribute = new BufferAttribute( buffer, oldMorphAttribute.itemSize, oldMorphAttribute.normalized );
+				result.morphAttributes[ name ][ j ] = morphAttribute;
+
+			}
 
 		}
 
@@ -4061,7 +4062,7 @@ function mergeVertices( geometry, tolerance = 1e-4 ) {
 /**
  * @param {BufferGeometry} geometry
  * @param {number} drawMode
- * @return {BufferGeometry}
+ * @return {BufferGeometry>}
  */
 function toTrianglesDrawMode( geometry, drawMode ) {
 
@@ -4574,7 +4575,8 @@ class MSDFGlyph extends external_THREE_namespaceObject.PlaneGeometry {
 		const char = inline.glyph;
 		const fontSize = inline.fontSize;
 
-		super( fontSize, fontSize );
+		// super( fontSize, fontSize );
+		super( inline.width, inline.height );
 
 		// Misc glyphs
 		if ( char.match( /\s/g ) === null ) {
@@ -4583,7 +4585,7 @@ class MSDFGlyph extends external_THREE_namespaceObject.PlaneGeometry {
 
 			this.mapUVs( font, char );
 
-			this.transformGeometry( font, fontSize, char, inline );
+			this.transformGeometry( inline );
 
 			// White spaces (we don't want our plane geometry to have a visual width nor a height)
 		} else {
@@ -4662,26 +4664,11 @@ class MSDFGlyph extends external_THREE_namespaceObject.PlaneGeometry {
 	}
 
 	/** Gives the previously computed scale and offset to the geometry */
-	transformGeometry( font, fontSize, char, inline ) {
-
-		const charOBJ = font.chars.find( charOBJ => charOBJ.char === char );
-
-		const common = font.common;
-
-		const newHeight = charOBJ.height / common.lineHeight;
-		const newWidth = ( charOBJ.width * newHeight ) / charOBJ.height;
-
-		this.scale(
-			newWidth,
-			newHeight,
-			1
-		);
-
-		//
+	transformGeometry( inline ) {
 
 		this.translate(
 			inline.width / 2,
-			( inline.height / 2 ) - inline.anchor,
+				inline.height / 2,
 			0
 		);
 
@@ -4743,9 +4730,9 @@ function getGlyphDimensions( options ) {
 	const xoffset = charOBJ ? charOBJ.xoffset * SCALE_MULT : 0;
 
 	// world-space length between lowest point and the text cursor position
-	const anchor = charOBJ ? ( ( charOBJ.yoffset + charOBJ.height - FONT.common.base ) * FONT_SIZE ) / FONT.common.lineHeight : 0;
+	// const anchor = charOBJ ? ( ( charOBJ.yoffset + charOBJ.height - FONT.common.base ) * FONT_SIZE ) / FONT.common.lineHeight : 0;
 
-	// const lineHeight = FONT.common.lineHeight * SCALE_MULT;
+	const anchor = charOBJ ? charOBJ.yoffset * SCALE_MULT : 0;
 
 	// console.log( lineHeight )