From 3aa23d4c23437a5d5cf7bdbef83bd8927f0b398d Mon Sep 17 00:00:00 2001
From: minwe <minwe@yunshipei.com>
Date: Mon, 23 May 2016 13:47:12 +0800
Subject: [PATCH] [new] add legacy flebox UA className

---
 docs/getting-started/getting-started.md |  2 +-
 docs/navbar/api.md                      |  2 --
 kitchen-sink/index.html                 |  6 ------
 src/js/index.js                         |  3 +++
 src/js/utils/fallback.js                | 10 ++++++++++
 5 files changed, 14 insertions(+), 9 deletions(-)
 create mode 100644 src/js/utils/fallback.js

diff --git a/docs/getting-started/getting-started.md b/docs/getting-started/getting-started.md
index 2f6f06d..125c3c6 100644
--- a/docs/getting-started/getting-started.md
+++ b/docs/getting-started/getting-started.md
@@ -36,7 +36,7 @@
 
 - [Flexbox](http://caniuse.com/#feat=flexbox)
 
-  Amaze UI Touch 完全基于 flexbox 布局。由于[旧版规范](http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/)中没有 `flex-shrink`、`flex-basis`、`flex-wrap` 对应的属性，导致只支持旧版规范的浏览器无法正常渲染布局，暂时[没有找到解决方法（望赐教）](https://github.com/amazeui/amazeui-touch/issues/12) :( 。
+  Amaze UI Touch 完全基于 flexbox 布局。由于[旧版规范](http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/)中没有 `flex-shrink`、`flex-basis`、`flex-wrap` 对应的属性，导致只支持旧版规范的浏览器无法正常渲染布局,暂时[~~没有找到解决方法（望赐教）~~](https://github.com/amazeui/amazeui-touch/issues/12) 通过回退方式处理，在 Android UC 上测试通过，有待进行更多测试 :( 。
 - [CSS3 Transitions](http://caniuse.com/#feat=css-transitions)
 - [CSS Animation](http://caniuse.com/#feat=css-animation)
 
diff --git a/docs/navbar/api.md b/docs/navbar/api.md
index 58a4988..ea222cb 100644
--- a/docs/navbar/api.md
+++ b/docs/navbar/api.md
@@ -86,6 +86,4 @@ if (/android/i.test(ua) && /ucbrowser/i.test(ua)) {
 }
 ```
 
-由于测试面有限，上面的 JS 暂未添加到源码， 需要开发者手动添加到项目中（样式已经集成在 CSS 文件中，）。
-
 ## 示例
diff --git a/kitchen-sink/index.html b/kitchen-sink/index.html
index 6fc04e5..4597604 100644
--- a/kitchen-sink/index.html
+++ b/kitchen-sink/index.html
@@ -64,11 +64,5 @@
   <div id="sk-root" style="height: 100%; width: 100%; overflow: hidden;">
   </div>
   <script src="app__ENV__.js"></script>
-  <script>
-    var ua = navigator.userAgent;
-    if (/android/i.test(ua) && /ucbrowser/i.test(ua)) {
-      document.documentElement.className += ' ua-stupid-uc';
-    }
-  </script>
 </body>
 </html>
diff --git a/src/js/index.js b/src/js/index.js
index 36de7bf..7b585eb 100644
--- a/src/js/index.js
+++ b/src/js/index.js
@@ -36,3 +36,6 @@ export {default as View} from './View';
 
 // Mixins
 export * from './mixins';
+
+// Compatibility fallback
+import './utils/fallback';
diff --git a/src/js/utils/fallback.js b/src/js/utils/fallback.js
new file mode 100644
index 0000000..e2c693a
--- /dev/null
+++ b/src/js/utils/fallback.js
@@ -0,0 +1,10 @@
+// Android browsers legacy flexbox fallback
+try {
+  const ua = navigator.userAgent;
+
+  // TODO:
+  // - add version detecting when UC supports flexbox
+  if (/android/i.test(ua) && /ucbrowser/i.test(ua)) {
+    document.documentElement.className += ' ua-stupid-uc';
+  }
+} catch(e) {}