From 1255e6bd4acd44a030ae7f6f0525894043fced0a Mon Sep 17 00:00:00 2001
From: Rossen Hristov <rossen.hristov@telerik.com>
Date: Mon, 19 Dec 2016 11:56:32 +0200
Subject: [PATCH 1/3] Visibility

---
 .../activity-indicator.android.ts             | 33 +++++++++++---
 .../activity-indicator.ios.ts                 | 10 ++---
 tns-core-modules/ui/core/view-base.ts         | 11 -----
 tns-core-modules/ui/core/view-common.ts       | 22 +++++++--
 tns-core-modules/ui/core/view.android.ts      | 45 ++++++++++---------
 tns-core-modules/ui/core/view.d.ts            | 11 ++++-
 tns-core-modules/ui/core/view.ios.ts          | 20 ++++++---
 tns-core-modules/ui/styling/converters.ts     | 10 -----
 tns-core-modules/ui/styling/style.d.ts        |  4 +-
 tns-core-modules/ui/styling/style.ts          |  4 +-
 10 files changed, 105 insertions(+), 65 deletions(-)

diff --git a/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts b/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts
index 489607fd0..b0a1d2246 100644
--- a/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts
+++ b/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts
@@ -1,4 +1,4 @@
-import { ActivityIndicatorBase, busyProperty, colorProperty, visibilityProperty } from "./activity-indicator-common";
+import { ActivityIndicatorBase, busyProperty, colorProperty, visibilityProperty, Visibility } from "./activity-indicator-common";
 
 export * from "./activity-indicator-common";
 
@@ -22,12 +22,33 @@ export class ActivityIndicator extends ActivityIndicatorBase {
         this._progressBar.setVisibility(value ? android.view.View.VISIBLE : android.view.View.INVISIBLE);
     }
 
-    get [visibilityProperty.native](): number {
-        return this._progressBar.getVisibility();
+    get [visibilityProperty.native](): Visibility {
+        let nativeVisibility = this._progressBar.getVisibility();
+        switch (nativeVisibility) {
+            case android.view.View.VISIBLE:
+                return Visibility.VISIBLE;
+            case android.view.View.INVISIBLE:
+                return Visibility.HIDDEN;
+            case android.view.View.GONE:
+                return Visibility.COLLAPSE;
+            default: 
+                throw new Error(`Unsupported android.view.View visibility: ${nativeVisibility}. Currently supported values are android.view.View.VISIBLE, android.view.View.INVISIBLE, android.view.View.GONE.`);
+        }
     }
-    set [visibilityProperty.native](value: number) {
-        this.busy = value === android.view.View.VISIBLE;
-        this._progressBar.setVisibility(value);
+    set [visibilityProperty.native](value: Visibility) {
+        switch (value) {
+            case Visibility.VISIBLE:
+                this._progressBar.setVisibility(android.view.View.VISIBLE);
+                break;
+            case Visibility.HIDDEN:
+                this._progressBar.setVisibility(android.view.View.INVISIBLE);
+                break;
+            case Visibility.COLLAPSE:
+                this._progressBar.setVisibility(android.view.View.GONE);
+                break;
+            default: 
+                throw new Error(`Invalid visibility value: ${value}. Valid values are: "${Visibility.VISIBLE}", "${Visibility.HIDDEN}", "${Visibility.COLLAPSE}".`);
+        }
     }
 
     get [colorProperty.native](): number {
diff --git a/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts b/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts
index d96349ee9..6198f6bb0 100644
--- a/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts
+++ b/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts
@@ -1,4 +1,4 @@
-import { ActivityIndicatorBase, busyProperty, colorProperty, visibilityProperty } from "./activity-indicator-common";
+import { ActivityIndicatorBase, busyProperty, colorProperty, visibilityProperty, Visibility } from "./activity-indicator-common";
 import { ios } from "utils/utils";
 
 export * from "./activity-indicator-common";
@@ -33,11 +33,11 @@ export class ActivityIndicator extends ActivityIndicatorBase {
         }
     }
 
-    get [visibilityProperty.native](): string {
-        return this.nativeView.hidden ? "collapse" : "visible";
+    get [visibilityProperty.native](): Visibility {
+        return this.nativeView.hidden ? Visibility.COLLAPSE : Visibility.VISIBLE;
     }
-    set [visibilityProperty.native](value: string) {
-        this.nativeView.hidden = value !== "visible";
+    set [visibilityProperty.native](value: Visibility) {
+        this.nativeView.hidden = value !== Visibility.VISIBLE;
     }
 
     get [colorProperty.native](): UIColor {
diff --git a/tns-core-modules/ui/core/view-base.ts b/tns-core-modules/ui/core/view-base.ts
index 6e3045d29..e31524dc9 100644
--- a/tns-core-modules/ui/core/view-base.ts
+++ b/tns-core-modules/ui/core/view-base.ts
@@ -500,17 +500,6 @@ export class ViewBase extends Observable implements ViewBaseDefinition {
     }
 }
 
-export const visibilityProperty = new CssProperty<Style, "visible" | "hidden" | "collapse" | "collapsed">({
-    name: "visibility", cssName: "visibility", defaultValue: "visible", affectsLayout: isIOS, valueChanged: (target, newValue) => {
-        if (newValue !== "visible" && newValue !== "collapse" && newValue !== "collapsed" && newValue !== "hidden") {
-            throw new Error(`Invalid visibility value: ${newValue}`);
-        }
-
-        target.view.isCollapsed = (newValue === "collapse" || newValue === "collapsed");
-    }
-});
-visibilityProperty.register(Style);
-
 export const bindingContextProperty = new InheritedProperty<ViewBase, any>({ name: "bindingContext" });
 bindingContextProperty.register(ViewBase);
 
diff --git a/tns-core-modules/ui/core/view-common.ts b/tns-core-modules/ui/core/view-common.ts
index 6980cb159..3c25e6613 100644
--- a/tns-core-modules/ui/core/view-common.ts
+++ b/tns-core-modules/ui/core/view-common.ts
@@ -396,10 +396,10 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
         this.style.verticalAlignment = value;
     }
 
-    get visibility(): "visible" | "hidden" | "collapse" | "collapsed" {
+    get visibility(): Visibility {
         return this.style.visibility;
     }
-    set visibility(value: "visible" | "hidden" | "collapse" | "collapsed") {
+    set visibility(value: Visibility) {
         this.style.visibility = value;
     }
 
@@ -1863,4 +1863,20 @@ const fontProperty = new ShorthandProperty<Style>({
         ]
     }
 })
-fontProperty.register(Style);
\ No newline at end of file
+fontProperty.register(Style);
+
+export type Visibility = "visible" | "hidden" | "collapse";
+export namespace Visibility {
+    export const VISIBLE: "visible" = "visible";
+    export const HIDDEN: "hidden" = "hidden";
+    export const COLLAPSE: "collapse" = "collapse";
+    export const isValid = makeValidator<Visibility>(VISIBLE, HIDDEN, COLLAPSE);
+    export const parse = makeParser(isValid, VISIBLE);
+}
+
+export const visibilityProperty = new CssProperty<Style, Visibility>({
+    name: "visibility", cssName: "visibility", defaultValue: Visibility.VISIBLE, affectsLayout: isIOS, valueConverter: Visibility.parse, valueChanged: (target, newValue) => {
+        target.view.isCollapsed = (newValue === Visibility.COLLAPSE);
+    }
+});
+visibilityProperty.register(Style);
\ No newline at end of file
diff --git a/tns-core-modules/ui/core/view.android.ts b/tns-core-modules/ui/core/view.android.ts
index 3b0427eff..9450b9743 100644
--- a/tns-core-modules/ui/core/view.android.ts
+++ b/tns-core-modules/ui/core/view.android.ts
@@ -8,7 +8,7 @@ import {
     rotateProperty, scaleXProperty, scaleYProperty,
     translateXProperty, translateYProperty, zIndexProperty, backgroundInternalProperty,
     Background, GestureTypes, GestureEventData, applyNativeSetters, Property,
-    traceEnabled, traceWrite, traceCategories, traceNotifyEvent
+    traceEnabled, traceWrite, traceCategories, traceNotifyEvent, Visibility
 } from "./view-common";
 
 export * from "./view-common";
@@ -425,27 +425,32 @@ export class View extends ViewCommon {
         }
     }
 
-    get [visibilityProperty.native](): "visible" | "hidden" | "collapse" {
-        let visibility = this.nativeView.getVisibility();
-        if (visibility === android.view.View.VISIBLE) {
-            return "visible";
-        }
-        else if (visibility === android.view.View.INVISIBLE) {
-            return "hidden";
-        }
-        else {
-            return "collapse";
+    get [visibilityProperty.native](): Visibility {
+        let nativeVisibility = this.nativeView.getVisibility();
+        switch (nativeVisibility) {
+            case android.view.View.VISIBLE:
+                return Visibility.VISIBLE;
+            case android.view.View.INVISIBLE:
+                return Visibility.HIDDEN;
+            case android.view.View.GONE:
+                return Visibility.COLLAPSE;
+            default: 
+                throw new Error(`Unsupported android.view.View visibility: ${nativeVisibility}. Currently supported values are android.view.View.VISIBLE, android.view.View.INVISIBLE, android.view.View.GONE.`);
         }
     }
-    set [visibilityProperty.native](value: string) {
-        if (value === "visible") {
-            this.nativeView.setVisibility(android.view.View.VISIBLE);
-        }
-        else if (value === "hidden") {
-            this.nativeView.setVisibility(android.view.View.INVISIBLE);
-        }
-        else {
-            this.nativeView.setVisibility(android.view.View.GONE);
+    set [visibilityProperty.native](value: Visibility) {
+        switch (value) {
+            case Visibility.VISIBLE:
+                this.nativeView.setVisibility(android.view.View.VISIBLE);
+                break;
+            case Visibility.HIDDEN:
+                this.nativeView.setVisibility(android.view.View.INVISIBLE);
+                break;
+            case Visibility.COLLAPSE:
+                this.nativeView.setVisibility(android.view.View.GONE);
+                break;
+            default: 
+                throw new Error(`Invalid visibility value: ${value}. Valid values are: "${Visibility.VISIBLE}", "${Visibility.HIDDEN}", "${Visibility.COLLAPSE}".`);
         }
     }
 
diff --git a/tns-core-modules/ui/core/view.d.ts b/tns-core-modules/ui/core/view.d.ts
index b287e7e7f..60a106bf6 100644
--- a/tns-core-modules/ui/core/view.d.ts
+++ b/tns-core-modules/ui/core/view.d.ts
@@ -283,7 +283,7 @@ declare module "ui/core/view" {
         /**
          * Gets or sets the visibility of the view.
          */
-        visibility: "visible" | "hidden" | "collapse" | "collapsed";
+        visibility: Visibility;
 
         /**
          * Gets or sets the opacity style property.
@@ -774,4 +774,13 @@ declare module "ui/core/view" {
         export function isValid(value: any): boolean;
         export function parse(value: string): BackgroundRepeat;
     }
+
+    export type Visibility = "visible" | "hidden" | "collapse";
+    export namespace Visibility {
+        export const VISIBLE: "visible";
+        export const HIDDEN: "hidden";
+        export const COLLAPSE: "collapse";
+        export function isValid(value: any): boolean;
+        export function parse(value: string): Visibility;
+    }
 }
\ No newline at end of file
diff --git a/tns-core-modules/ui/core/view.ios.ts b/tns-core-modules/ui/core/view.ios.ts
index 0c84854fd..0e7de2000 100644
--- a/tns-core-modules/ui/core/view.ios.ts
+++ b/tns-core-modules/ui/core/view.ios.ts
@@ -7,7 +7,7 @@ import {
     paddingLeftProperty, paddingTopProperty, paddingRightProperty, paddingBottomProperty,
     rotateProperty, scaleXProperty, scaleYProperty,
     translateXProperty, translateYProperty, zIndexProperty, backgroundInternalProperty,
-    clipPathProperty, layout, traceEnabled, traceWrite, traceCategories, Background
+    clipPathProperty, layout, traceEnabled, traceWrite, traceCategories, Background, Visibility
 } from "./view-common";
 
 export * from "./view-common";
@@ -349,11 +349,21 @@ export class View extends ViewCommon {
         this._nativeView.userInteractionEnabled = value;
     }
 
-    get [visibilityProperty.native](): "visible" | "hidden" | "collapse" | "collapsed"{
-        return "visible"
+    get [visibilityProperty.native](): Visibility {
+        return this._nativeView.hidden ? Visibility.COLLAPSE : Visibility.VISIBLE;
     }
-    set [visibilityProperty.native](value: "visible" | "hidden" | "collapse" | "collapsed") {
-        this._nativeView.hidden = (value !== "visible");
+    set [visibilityProperty.native](value: Visibility) {
+        switch (value) {
+            case Visibility.VISIBLE:
+                this._nativeView.hidden = false;
+                break;
+            case Visibility.HIDDEN:
+            case Visibility.COLLAPSE:
+                this._nativeView.hidden = true;
+                break;
+            default: 
+                throw new Error(`Invalid visibility value: ${value}. Valid values are: "${Visibility.VISIBLE}", "${Visibility.HIDDEN}", "${Visibility.COLLAPSE}".`);
+        }
     }
 
     get [opacityProperty.native](): number {
diff --git a/tns-core-modules/ui/styling/converters.ts b/tns-core-modules/ui/styling/converters.ts
index f8b0d2a73..2c9f26a07 100644
--- a/tns-core-modules/ui/styling/converters.ts
+++ b/tns-core-modules/ui/styling/converters.ts
@@ -17,16 +17,6 @@ export function fontSizeConverter(value: string): number {
 
 export const numberConverter = parseFloat;
 
-export function visibilityConverter(value: string): string {
-    value = value.toLowerCase();
-    if (value === "collapsed" || value === "collapse") {
-        return "collapse";
-    } else if (value === "hidden") {
-        return "hidden";
-    }
-    return "visible";
-}
-
 export function opacityConverter(value: string): number {
     let result = parseFloat(value);
     result = Math.max(0.0, result);
diff --git a/tns-core-modules/ui/styling/style.d.ts b/tns-core-modules/ui/styling/style.d.ts
index b8299b6c3..f80b263cc 100644
--- a/tns-core-modules/ui/styling/style.d.ts
+++ b/tns-core-modules/ui/styling/style.d.ts
@@ -1,5 +1,5 @@
 declare module "ui/styling/style" {
-    import { Length, PercentLength, Color, Background, Font, ViewBase, Observable, BackgroundRepeat} from "ui/core/view";
+    import { Length, PercentLength, Color, Background, Font, ViewBase, Observable, BackgroundRepeat, Visibility} from "ui/core/view";
     import { TextAlignment, TextDecoration, TextTransform, WhiteSpace } from "ui/text-base";
     import { FontStyle, FontWeight } from "ui/styling/font";
 
@@ -84,7 +84,7 @@ declare module "ui/styling/style" {
 
         public zIndex: number;
         public opacity: number;
-        public visibility: "visible" | "hidden" | "collapse" | "collapsed";
+        public visibility: Visibility;
 
         public letterSpacing: number;
         public textAlignment: TextAlignment;
diff --git a/tns-core-modules/ui/styling/style.ts b/tns-core-modules/ui/styling/style.ts
index a20076318..9808c50bd 100644
--- a/tns-core-modules/ui/styling/style.ts
+++ b/tns-core-modules/ui/styling/style.ts
@@ -1,5 +1,5 @@
 import { Style as StyleDefinition } from "ui/styling/style";
-import { Length, PercentLength, Color, Background, Font, ViewBase, BackgroundRepeat } from "ui/core/view";
+import { Length, PercentLength, Color, Background, Font, ViewBase, BackgroundRepeat, Visibility } from "ui/core/view";
 import { Observable } from "data/observable";
 import { resetStyleProperties } from "ui/core/properties";
 
@@ -63,7 +63,7 @@ export class Style extends Observable implements StyleDefinition {
 
     public zIndex: number;
     public opacity: number;
-    public visibility: "visible" | "hidden" | "collapse" | "collapsed";
+    public visibility: Visibility;
 
     public letterSpacing: number;
     public textAlignment: TextAlignment;

From 9be5d4301af5eeed102121dc16d6fb26c71b233e Mon Sep 17 00:00:00 2001
From: Rossen Hristov <rossen.hristov@telerik.com>
Date: Mon, 19 Dec 2016 13:13:59 +0200
Subject: [PATCH 2/3] Add several missing types to view.d.ts

---
 tns-core-modules/ui/core/view.d.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/tns-core-modules/ui/core/view.d.ts b/tns-core-modules/ui/core/view.d.ts
index 60a106bf6..e64b642cd 100644
--- a/tns-core-modules/ui/core/view.d.ts
+++ b/tns-core-modules/ui/core/view.d.ts
@@ -27,7 +27,7 @@ declare module "ui/core/view" {
         BindingOptions, Observable, EventData
     } from "ui/core/view-base";
     import { Background } from "ui/styling/background";
-    import { Font } from "ui/styling/font";
+    import { Font, FontWeight, FontStyle } from "ui/styling/font";
     import { Color } from "color";
 
     export {
@@ -735,7 +735,7 @@ declare module "ui/core/view" {
     export const borderBottomLeftRadiusProperty: CssProperty<Style, number>;
 
     export const zIndexProperty: CssProperty<Style, number>;
-    export const visibilityProperty: CssProperty<Style, string>;
+    export const visibilityProperty: CssProperty<Style, Visibility>;
     export const opacityProperty: CssProperty<Style, number>;
 
     export const minWidthProperty: CssProperty<Style, Length>;
@@ -759,8 +759,8 @@ declare module "ui/core/view" {
 
     export const fontSizeProperty: InheritedCssProperty<Style, number>;
     export const fontFamilyProperty: InheritedCssProperty<Style, string>;
-    export const fontStyleProperty: InheritedCssProperty<Style, string>;
-    export const fontWeightProperty: InheritedCssProperty<Style, string>;
+    export const fontStyleProperty: InheritedCssProperty<Style, FontStyle>;
+    export const fontWeightProperty: InheritedCssProperty<Style, FontWeight>;
 
     export const backgroundInternalProperty: CssProperty<Style, Background>;
     export const fontInternalProperty: InheritedCssProperty<Style, Font>;

From 35c06ba855bac24e55a59d8cd3f0427699df52e8 Mon Sep 17 00:00:00 2001
From: Rossen Hristov <rossen.hristov@telerik.com>
Date: Mon, 19 Dec 2016 14:57:53 +0200
Subject: [PATCH 3/3] Fixed the ActivityIndicator busy/visibility problems.

---
 .../activity-indicator.android.ts             | 20 ++++++-------------
 .../activity-indicator.ios.ts                 |  7 -------
 2 files changed, 6 insertions(+), 21 deletions(-)

diff --git a/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts b/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts
index b0a1d2246..ad0b5497e 100644
--- a/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts
+++ b/tns-core-modules/ui/activity-indicator/activity-indicator.android.ts
@@ -16,29 +16,21 @@ export class ActivityIndicator extends ActivityIndicatorBase {
     }
 
     get [busyProperty.native](): boolean {
-        return this._progressBar.getVisibility() === android.view.View.VISIBLE;
+        return false;
     }
     set [busyProperty.native](value: boolean) {
-        this._progressBar.setVisibility(value ? android.view.View.VISIBLE : android.view.View.INVISIBLE);
+        if (this.visibility === Visibility.VISIBLE) {
+            this._progressBar.setVisibility(value ? android.view.View.VISIBLE : android.view.View.INVISIBLE);
+        }
     }
 
     get [visibilityProperty.native](): Visibility {
-        let nativeVisibility = this._progressBar.getVisibility();
-        switch (nativeVisibility) {
-            case android.view.View.VISIBLE:
-                return Visibility.VISIBLE;
-            case android.view.View.INVISIBLE:
-                return Visibility.HIDDEN;
-            case android.view.View.GONE:
-                return Visibility.COLLAPSE;
-            default: 
-                throw new Error(`Unsupported android.view.View visibility: ${nativeVisibility}. Currently supported values are android.view.View.VISIBLE, android.view.View.INVISIBLE, android.view.View.GONE.`);
-        }
+        return Visibility.HIDDEN;       
     }
     set [visibilityProperty.native](value: Visibility) {
         switch (value) {
             case Visibility.VISIBLE:
-                this._progressBar.setVisibility(android.view.View.VISIBLE);
+                this._progressBar.setVisibility(this.busy ? android.view.View.VISIBLE : android.view.View.INVISIBLE);
                 break;
             case Visibility.HIDDEN:
                 this._progressBar.setVisibility(android.view.View.INVISIBLE);
diff --git a/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts b/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts
index 6198f6bb0..e1bd97fb5 100644
--- a/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts
+++ b/tns-core-modules/ui/activity-indicator/activity-indicator.ios.ts
@@ -33,13 +33,6 @@ export class ActivityIndicator extends ActivityIndicatorBase {
         }
     }
 
-    get [visibilityProperty.native](): Visibility {
-        return this.nativeView.hidden ? Visibility.COLLAPSE : Visibility.VISIBLE;
-    }
-    set [visibilityProperty.native](value: Visibility) {
-        this.nativeView.hidden = value !== Visibility.VISIBLE;
-    }
-
     get [colorProperty.native](): UIColor {
         return this.nativeView.color;
     }