From 0708b5eb7593fff5b74ad2e8b47b12adc8fc5098 Mon Sep 17 00:00:00 2001 From: Christopher Chedeau Date: Mon, 28 Apr 2014 13:06:00 -0700 Subject: [PATCH] autogen c version of text from js --- src/Layout-test-utils.js | 8 ++++---- src/Layout.c | 14 +++++++++----- src/Layout.js | 33 +++++++++++++++++++++++++-------- src/transpile.html | 6 +++++- 4 files changed, 43 insertions(+), 18 deletions(-) diff --git a/src/Layout-test-utils.js b/src/Layout-test-utils.js index 6adc85e4..cfe073fe 100644 --- a/src/Layout-test-utils.js +++ b/src/Layout-test-utils.js @@ -238,21 +238,21 @@ var layoutTestUtils = (function() { reduceTest: reduceTest, text: function(text) { var body = iframeText.contentDocument.body; - var fn = function(width) { + var fn = function(type, width) { // Constants for testing purposes between C/JS and other platforms // Comment this block of code if you want to use the browser to // generate proper sizes if (text === 'small') { - if (width === 'grow' || width === 'shrink') { + if (type === 'grow' || type === 'shrink') { return {width: 33, height: 18} } return {width: width, height: 18}; } if (text === 'loooooooooong with space') { - if (width === 'grow') { + if (type === 'grow') { return {width: 171, height: 18}; } - if (width === 'shrink') { + if (type === 'shrink') { return {width: 100, height: 36}; } return {width: width, height: width >= 171 ? 18 : 36}; diff --git a/src/Layout.c b/src/Layout.c index 8c7d2497..99343304 100644 --- a/src/Layout.c +++ b/src/Layout.c @@ -275,6 +275,10 @@ bool isPosDefined(css_node_t *node, css_position_t pos) { return !isUndefined(node->style.position[pos]); } +bool isMeasureDefined(css_node_t *node) { + return node->style.measure; +} + float getPosition(css_node_t *node, css_position_t pos) { float result = node->style.position[pos]; if (!isUndefined(result)) { @@ -328,7 +332,7 @@ void layoutNode(css_node_t *node) { node->layout.position[leading[crossAxis]] += getMargin(node, leading[crossAxis]) + getRelativePosition(node, crossAxis); - if (node->style.measure) { + if (isMeasureDefined(node)) { float width = CSS_UNDEFINED; css_measure_type_t type = CSS_MEASURE_VALUE; @@ -340,23 +344,22 @@ void layoutNode(css_node_t *node) { type = CSS_MEASURE_GROW; } - css_dim_t dim = node->style.measure( + css_dim_t measure_dim = node->style.measure( node->style.measure_context, type, width ); if (!isDimDefined(node, CSS_FLEX_DIRECTION_ROW)) { - node->layout.dimensions[CSS_WIDTH] = dim.dimensions[CSS_WIDTH] + + node->layout.dimensions[CSS_WIDTH] = measure_dim.dimensions[CSS_WIDTH] + getPaddingAndBorderAxis(node, CSS_FLEX_DIRECTION_ROW); } if (!isDimDefined(node, CSS_FLEX_DIRECTION_COLUMN)) { - node->layout.dimensions[CSS_HEIGHT] = dim.dimensions[CSS_HEIGHT] + + node->layout.dimensions[CSS_HEIGHT] = measure_dim.dimensions[CSS_HEIGHT] + getPaddingAndBorderAxis(node, CSS_FLEX_DIRECTION_COLUMN); } return; } - // Layout non flexible children and count children by type // mainContentDim is accumulation of the dimensions and margin of all the @@ -397,6 +400,7 @@ void layoutNode(css_node_t *node) { } } + // Layout flexible children and allocate empty space // In order to position the elements in the main axis, we have two diff --git a/src/Layout.js b/src/Layout.js index 016ffc25..48803b2a 100755 --- a/src/Layout.js +++ b/src/Layout.js @@ -112,6 +112,10 @@ var computeLayout = (function() { return !isUndefined(node.style[pos]); } + function isMeasureDefined(node) { + return 'measure' in node.style; + } + function getPosition(node, pos) { if (pos in node.style) { return node.style[pos]; @@ -170,6 +174,8 @@ var computeLayout = (function() { return b; } + var CSS_UNDEFINED = undefined; + var CSS_FLEX_DIRECTION_ROW = 'row'; var CSS_FLEX_DIRECTION_COLUMN = 'column'; @@ -187,6 +193,10 @@ var computeLayout = (function() { var CSS_POSITION_RELATIVE = 'relative'; var CSS_POSITION_ABSOLUTE = 'absolute'; + var CSS_MEASURE_VALUE = 'value'; + var CSS_MEASURE_GROW = 'grow'; + var CSS_MEASURE_SHRINK = 'shrink'; + return function layoutNode(node) { var/*css_flex_direction_t*/ mainAxis = getFlexDirection(node); var/*css_flex_direction_t*/ crossAxis = mainAxis === CSS_FLEX_DIRECTION_ROW ? @@ -204,22 +214,29 @@ var computeLayout = (function() { node.layout[leading[crossAxis]] += getMargin(node, leading[crossAxis]) + getRelativePosition(node, crossAxis); - if ('measure' in node.style) { - var width; + if (isMeasureDefined(node)) { + var/*float*/ width = CSS_UNDEFINED; + var/*css_measure_type_t*/ type = CSS_MEASURE_VALUE; + if (isDimDefined(node, CSS_FLEX_DIRECTION_ROW)) { width = node.style.width; - } else if (getPositionType(node) === CSS_POSITION_ABSOLUTE) { - width = 'shrink'; + } else if (getPositionType(node) == CSS_POSITION_ABSOLUTE) { + type = CSS_MEASURE_SHRINK; } else { - width = 'grow'; + type = CSS_MEASURE_GROW; } - var dimensions = node.style.measure(width); + + var/*css_dim_t*/ measure_dim = node.style.measure( + /*!node->style.measure_context,*/ + type, + width + ); if (!isDimDefined(node, CSS_FLEX_DIRECTION_ROW)) { - node.layout.width = dimensions.width + + node.layout.width = measure_dim.width + getPaddingAndBorderAxis(node, CSS_FLEX_DIRECTION_ROW); } if (!isDimDefined(node, CSS_FLEX_DIRECTION_COLUMN)) { - node.layout.height = dimensions.height + + node.layout.height = measure_dim.height + getPaddingAndBorderAxis(node, CSS_FLEX_DIRECTION_COLUMN); } return; diff --git a/src/transpile.html b/src/transpile.html index a5dcb457..e895d631 100644 --- a/src/transpile.html +++ b/src/transpile.html @@ -15,6 +15,8 @@ textarea {

Tests