private _updateStyles()

in src/web/Animated.tsx [750:836]
62 lines of code
21 McCabe index (conditional complexity)

        private _updateStyles(props: RX.Types.CommonStyledProps<RX.Types.StyleRuleSet<any>, C>) {
            this._propsWithoutStyle = _.omit(props, 'style');

            const rawStyles = Styles.combine(props.style || {});
            this._processedStyle = {};

            const newAnimatedAttributes: { [transform: string]: Value } = {};

            for (const attrib in rawStyles) {
                // Handle transforms separately.
                if (attrib === 'staticTransforms' || attrib === 'animatedTransforms') {
                    continue;
                }

                // Is this a dynamic (animated) value?
                if (rawStyles[attrib] instanceof Value) {
                    const valueObj = rawStyles[attrib] as Value;
                    this._processedStyle[attrib] = this._generateCssAttributeValue(attrib, valueObj._getOutputValue());
                    newAnimatedAttributes[attrib] = valueObj;
                } else {
                    // Copy the static style value.
                    this._processedStyle[attrib] = rawStyles[attrib];
                }
            }

            // Handle transforms, which require special processing because they need to
            // be combined into a single 'transform' CSS attribute.
            this._staticTransforms = rawStyles.staticTransforms || {};
            const newAnimatedTransforms: { [transform: string]: Value } = rawStyles.animatedTransforms || {};

            // Update this._animatedAttributes and this._animatedTransforms so they match
            // the updated style.

            // Remove any previous animated attributes that are no longer present
            // or associated with different value objects.
            _.each(this._animatedAttributes, (value, attrib) => {
                if (!newAnimatedAttributes[attrib] || newAnimatedAttributes[attrib] !== value.valueObject) {
                    if (value.activeTransition) {
                        if (AppConfig.isDevelopmentMode()) {
                            console.error('Animated style attribute removed while the animation was active');
                        }
                    }
                    value.valueObject._removeListener(this);
                    delete this._animatedAttributes[attrib];
                }
            });

            // Add new animated attributes.
            _.each(newAnimatedAttributes, (value, attrib) => {
                if (!this._animatedAttributes[attrib]) {
                    this._animatedAttributes[attrib] = { valueObject: value };
                    if (this._mountedComponent) {
                        value._addListener(this);
                    }
                }
            });

            // Remove any previous animated transforms that are no longer present
            // or associated with different value objects.
            _.each(this._animatedTransforms, (value, transform) => {
                if (!newAnimatedTransforms[transform] || newAnimatedTransforms[transform] !== value.valueObject) {
                    if (value.activeTransition) {
                        if (AppConfig.isDevelopmentMode()) {
                            console.warn('Should not remove an animated transform attribute while the animation is active');
                        }
                    }
                    value.valueObject._removeListener(this);
                    delete this._animatedTransforms[transform];
                }
            });

            // Add new animated transforms.
            _.each(newAnimatedTransforms, (value, transform) => {
                if (!this._animatedTransforms[transform]) {
                    this._animatedTransforms[transform] = { valueObject: value };
                    if (this._mountedComponent) {
                        value._addListener(this);
                    }
                }
            });

            // Update the transform attribute in this._processedStyle.
            const transformList = this._generateCssTransformList(true);
            if (transformList) {
                this._processedStyle.transform = transformList;
            }
        }