Fix animations and lots of cyclic requires

tns-core-modules/ui/core/view-base.ts

@@ -4,14 +4,21 @@ import { Property, InheritedProperty, Style, clearInheritedProperties, propagate
 import { Binding, BindingOptions, Bindable } from "ui/core/bindable";
 import { isIOS, isAndroid } from "platform";
 import { fromString as gestureFromString } from "ui/gestures";
-import { CssState, StyleScope, applyInlineStyle } from "ui/styling/style-scope";
 import { SelectorCore } from "ui/styling/css-selector";
 import { KeyframeAnimation } from "ui/animation/keyframe-animation";
 
 import { enabled as traceEnabled, write as traceWrite, categories as traceCategories, notifyEvent as traceNotifyEvent, isCategorySet } from "trace";
 
+import * as ssm from "ui/styling/style-scope";
+let styleScopeModule: typeof ssm;
+function ensureStyleScopeModule() {
+    if (!styleScopeModule){
+        styleScopeModule = require("ui/styling/style-scope");
+    }
+}
+
 export {
-    KeyframeAnimation, Observable, EventData, Binding, BindingOptions, Bindable, isIOS, isAndroid,
+    Observable, EventData, Binding, BindingOptions, Bindable, isIOS, isAndroid,
     gestureFromString, traceEnabled, traceWrite, traceCategories, traceNotifyEvent, isCategorySet
 };
 export * from "./properties";
@@ -113,7 +120,7 @@ export class ViewBase extends Observable implements ViewBaseDefinition {
     public _context: any;
     public _isAddedToNativeVisualTree: any;
 
-    public _cssState: CssState;
+    public _cssState: ssm.CssState;
     constructor() {
         super();
         this._domId = viewIdCounter++;
@@ -202,12 +209,12 @@ export class ViewBase extends Observable implements ViewBaseDefinition {
         if (!rootPage || !rootPage.isLoaded) {
             return;
         }
-        let scope: StyleScope = (<any>rootPage)._getStyleScope();
+        let scope: ssm.StyleScope = (<any>rootPage)._getStyleScope();
         scope.applySelectors(this);
     }
 
     // TODO: Make sure the state is set to null and this is called on unloaded to clean up change listeners...
-    _setCssState(next: CssState): void {
+    _setCssState(next: ssm.CssState): void {
         const previous = this._cssState;
         this._cssState = next;
 
@@ -333,7 +340,8 @@ export class ViewBase extends Observable implements ViewBaseDefinition {
         if (typeof inlineStyle === "string") {
             try {
                 // this.style._beginUpdate();
-                applyInlineStyle(this, inlineStyle);
+                ensureStyleScopeModule();
+                styleScopeModule.applyInlineStyle(this, inlineStyle);
             } finally {
                 // this.style._endUpdate();
             }

tns-core-modules/ui/core/view-common.ts

@@ -1,6 +1,5 @@
 import { View as ViewDefinition, Point, Size } from "ui/core/view";
 import { Color } from "color";
-import { Animation, AnimationPromise } from "ui/animation";
 import { Source } from "utils/debug";
 import { Background } from "ui/styling/background";
 import {
@@ -10,7 +9,6 @@ import {
 } from "./view-base";
 import { observe as gestureObserve, GesturesObserver, GestureTypes, GestureEventData } from "ui/gestures";
 import { Font, parseFont, FontStyle, FontWeight } from "ui/styling/font";
-import { fontSizeConverter } from "../styling/converters";
 
 // Only types:
 import { Order, FlexGrow, FlexShrink, FlexWrapBefore, AlignSelf } from "ui/layouts/flexbox-layout";
@@ -24,10 +22,17 @@ export * from "./view-base";
 
 export {
     GestureTypes, GesturesObserver, GestureEventData,
-    Animation, AnimationPromise,
     Background, Font, Color
 }
 
+import * as am from "ui/animation";
+let animationModule: typeof am;
+function ensureAnimationModule() {
+    if (!animationModule){
+        animationModule = require("ui/animation");
+    }
+}
+
 // registerSpecialProperty("class", (instance: ViewDefinition, propertyValue: string) => {
 //     instance.className = propertyValue;
 // });
@@ -831,13 +836,14 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
         };
     }
 
-    public animate(animation: any): AnimationPromise {
+    public animate(animation: any): am.AnimationPromise {
         return this.createAnimation(animation).play();
     }
 
-    public createAnimation(animation: any): any {
+    public createAnimation(animation: any): am.Animation {
+        ensureAnimationModule();
         animation.target = this;
-        return new Animation([animation]);
+        return new animationModule.Animation([animation]);
     }
 
     public toString(): string {
@@ -1983,7 +1989,7 @@ const fontProperty = new ShorthandProperty<Style, string>({
             ];
         } else {
             let font = parseFont(value);
-            let fontSize = fontSizeConverter(font.fontSize);
+            let fontSize = parseFloat(font.fontSize);
 
             return [
                 [fontStyleProperty, font.fontStyle],

tns-core-modules/ui/core/view.d.ts

@@ -1,6 +1,5 @@
 declare module "ui/core/view" {
     import { GestureTypes, GesturesObserver, GestureEventData, TouchGestureEventData, TouchAction } from "ui/gestures";
-    import { Animation, AnimationDefinition, AnimationPromise } from "ui/animation";
     import {
         ViewBase, Property, CssProperty, InheritedCssProperty, Style, EventData, ShorthandProperty
     } from "ui/core/view-base";
@@ -10,9 +9,9 @@ declare module "ui/core/view" {
 
     export {
         GestureTypes, GesturesObserver, GestureEventData, TouchGestureEventData, TouchAction,
-        Animation, AnimationDefinition, AnimationPromise,
         Background, Font, Color
     }
+    import { Animation, AnimationDefinition, AnimationPromise } from "ui/animation";
 
     export * from "ui/core/view-base";