dConnectBrowserのヘルプ画面の調整

## 更新内容
* dConnectBrowserのヘルプ画面の、Preview用カメラ切り替え処理調整。
* Android側のManagerの修正分をiOS側に反映。

Author: TakayukiHoshi1984

dConnectSDK/dConnectBrowserForIOS9/dConnectBrowserForIOS9/demo/css/accordion.css

@@ -27,6 +27,7 @@ img.plus {
 
 .ac_menu div.ac_content {
     box-shadow:0px 1px 5px #AAA inset;
+    border-bottom: thin solid #558BCA;
     background :#f4f4f4;
     -webkit-transition: all 0.5s;
     -moz-transition: all 0.5s;

dConnectSDK/dConnectBrowserForIOS9/dConnectBrowserForIOS9/demo/css/checker.css

@@ -3,6 +3,15 @@ body {
     margin: 0px;
     padding: 0px;
 }
+div.title {
+    background-color: #5B9CFC;
+    padding: 10px;
+    font-weight: bold;
+    color: #FFFFFF;
+}
+a.back{
+    color:#FFFFFF;
+}
 
 div.request_param {
     padding: 12px 8px 8px 8px;
@@ -200,12 +209,31 @@ div.test {
 input, select {
     vertical-align: middle;
 }
-div.title {
-    background-color: #5B9CFC;
-    padding: 10px;
-    font-weight: bold;
-    color: #FFFFFF;
+
+label {
+    animation-name: fadeIn;
+    animation-duration: 0.3s;
+    animation-iteration-count: 1;
+    animation-timing-function: ease-out;
+    animation-fill-mode: backwards;
 }
-a.back{
-    color:#FFFFFF;
+
+.ac_menu div.ac_content {
+    animation-name: fadeIn;
+    animation-duration: 0.3s;
+    animation-iteration-count: 1;
+    animation-timing-function: ease-out;
+    animation-fill-mode: backwards;
+}
+
+@keyframes fadeIn {
+    from {
+        transform:translateY(300px);
+        opacity: 0.0;
+    }
+
+    to {
+        transform:translateY(0px);
+        opacity: 1.0;
+    }
 }

dConnectSDK/dConnectBrowserForIOS9/dConnectBrowserForIOS9/demo/css/index.css

@@ -6,6 +6,15 @@
 body {
     background-color: #FBFBFB;
 }
+div.title {
+    background-color: #5B9CFC;
+    padding: 10px;
+    font-weight: bold;
+    color: #FFFFFF;
+}
+a.back{
+    color:#FFFFFF;
+}
 
 img.icon {
     width: 42px;
@@ -38,20 +47,28 @@ div.profileName {
     border-right: solid 1px #E5E5E5;
     box-shadow: 0px 0px 2px #F3F3F3;
     color: #5B9CFC;
-}
 
+    animation-name: fadeIn;
+    animation-duration: 0.3s;
+    animation-iteration-count: 1;
+    animation-timing-function: cubic-bezier(0, 1.1, 1, 1.1);
+    animation-fill-mode: backwards;
+}
 
 a { text-decoration: none; }
 a:link { color: #5B9CFC; }
 a:visited { color: #5B9CFC; }
 a:hover { color: #5B9CFC; }
 a:active { color: #5B9CFC; }
-div.title {
-    background-color: #5B9CFC;
-    padding: 10px;
-    font-weight: bold;
-    color: #FFFFFF;
-}
-a.back{
-    color:#FFFFFF;
+
+@keyframes fadeIn {
+    from {
+        transform: scale(0.0, 0.0);
+        opacity: 0.0;
+    }
+
+    to {
+        transform: scale(1.0, 1.0);
+        opacity: 1.0;
+    }
 }

dConnectSDK/dConnectBrowserForIOS9/dConnectBrowserForIOS9/demo/css/resource.css

@@ -10,3 +10,4 @@ div.title {
 a.back{
     color:#FFFFFF;
 }
+

dConnectSDK/dConnectBrowserForIOS9/dConnectBrowserForIOS9/demo/index.html

@@ -17,7 +17,7 @@
     <script id="profileCell" type="text/x-template">
         <a href="{#url}">
             <div class="grid">
-                <div>
+                <div style="animation-delay: {#delay}s;">
                     <img class="icon" src="{#icon}"><br>
                     <div class="profileName">{#content}</div>
                 </div>

dConnectSDK/dConnectBrowserForIOS9/dConnectBrowserForIOS9/demo/js/checker.js

@@ -1,18 +1,20 @@
 
 var main = (function(parent, global) {
 
+    var delay = 0;
+
     function init() {
         util.init(function(name, json) {
             createSupportApis(json);
         });
+            
     }
     parent.init = init;
 
     function back() {
             location.href = "./index.html?serviceId=" + util.getServiceId();
     }
     parent.back = back;
-
     function onChangeValue(nav, name) {
         var elem = document.forms[nav];
         elem['t_' + name].value = elem[name].value;
@@ -124,15 +126,15 @@ var main = (function(parent, global) {
             setRequestText(nav, createRequest(method + " " + path));
 
             if (method == 'PUT') {
-                dConnect.addEventListener(uri, function(json) {
+                util.addEventListener(uri, function(json) {
                     setEventText(nav, createEvent(util.formatJSON(json)));
                 }, function(json) {
                     setResponseText(nav, createResponse(util.formatJSON(JSON.stringify(json))));
                 }, function(errorCode, errorMessage) {
                     setResponseText(nav, createResponse("errorCode=" + errorCode + " errorMessage=" + errorMessage));
                 });
             } else {
-                dConnect.removeEventListener(uri, function(json) {
+                util.removeEventListener(uri, function(json) {
                     setResponseText(nav, createResponse(util.formatJSON(JSON.stringify(json))));
                 }, function(errorCode, errorMessage) {
                     setResponseText(nav, createResponse("errorCode=" + errorCode + " errorMessage=" + errorMessage));
@@ -246,7 +248,6 @@ var main = (function(parent, global) {
         };
         return util.createTemplate('param_slider', data);
     }
-
     function createBooleanParam(name, value, on) {
         var data = {
             'name' : name,
@@ -256,6 +257,7 @@ var main = (function(parent, global) {
         };
         return util.createTemplate('param_boolean', data);
     }
+            
 
     function createRequest(body) {
         var data = {
@@ -346,8 +348,10 @@ var main = (function(parent, global) {
         var data = {
             'title': method.toUpperCase() + ' ' + createDConnectPath(basePath, path),
             'nav' : method + '_' + path,
-            'content' : createParameter(method, basePath, path, param['x-type'], param.parameters)
+            'content' : createParameter(method, basePath, path, param['x-type'], param.parameters),
+            'delay' : delay
         };
+        delay += 0.1;
         return util.createTemplate('command', data);
     }
 

dConnectSDK/dConnectBrowserForIOS9/dConnectBrowserForIOS9/demo/js/index.js

@@ -25,6 +25,8 @@ var main = (function(parent, global) {
         'connection' : 'images/icon33_connect6.png',
     };
 
+    var delay = 0;
+
     function init() {
         util.init(function(name, json) {
             createProfileList(json.supports);
@@ -39,8 +41,10 @@ var main = (function(parent, global) {
         var data = {
             'url' : url,
             'content' : content,
-            'icon' : icon
+            'icon' : icon,
+            'delay' : delay
         };
+        delay += 0.08;
         return util.createTemplate('profileCell', data);
     }