Merge pull request #8548 from bcbroussard/web-ui-menu

Added Hover to Views Menu in Web UI

third_party/ui/bower_components/angular-material/angular-material.js

@@ -7709,7 +7709,10 @@ function SelectProvider($$interimElementProvider) {
       var focusedNode = centeredNode || optionNodes[0];
       if (focusedNode) {
         opts.focusedNode = focusedNode;
-        focusedNode.focus();
+        // This is commented out to fix an issue where the first option remains in focus
+        // even after you mouseover to a different option.
+        // It is fixed in the compiled source and is here for reference.
+        // focusedNode.focus();
       }
 
       if (isScrollable) {

third_party/ui/bower_components/angular-material/modules/closure/select/select.js

@@ -543,7 +543,7 @@ function SelectProvider($$interimElementProvider) {
         contentEl: element.find('md-content'),
         backdrop: opts.hasBackdrop && angular.element('<md-backdrop class="md-select-backdrop">')
       });
-    
+
       var optionNodes = [];
 
       configureAria();
@@ -757,7 +757,10 @@ function SelectProvider($$interimElementProvider) {
       var focusedNode = centeredNode || optionNodes[0];
       if (focusedNode) {
         opts.focusedNode = focusedNode;
-        focusedNode.focus();
+        // This is commented out to fix an issue where the first option remains in focus
+        // even after you mouseover to a different option.
+        // It is fixed in the compiled source and is here for reference.
+        // focusedNode.focus();
       }
 
       if (isScrollable) {

www/app/assets/css/app.css

@@ -407,6 +407,17 @@ md-toolbar h1 {
   vertical-align: middle;
   padding: 2px;
 }
+md-select-menu.md-default-theme md-option:focus:not([selected]) {
+  background: #eeeeee;
+}
+md-select-menu md-option {
+  transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
+  transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
+}
+md-select-menu md-option:not([disabled]):hover,
+md-select-menu md-option:not([disabled]):focus {
+  background-color: rgba(158, 158, 158, 0.2);
+}
 .dashboard .body-wrapper {
   padding: 25px;
 }

www/app/assets/js/app.js

@@ -1938,6 +1938,359 @@ app.controller('ServiceCtrl', [
   }
 ]);
 
+angular.module('kubernetesApp.components.dashboard')
+    .factory('d3DashboardService', [
+      '$document',
+      '$q',
+      '$rootScope',
+      function($document, $q, $rootScope) {
+        var d = $q.defer();
+        function onScriptLoad() {
+          // Load client in the browser
+          $rootScope.$apply(function() { d.resolve(window.d3); });
+        }
+        // Create a script tag with d3 as the source
+        // and call our onScriptLoad callback when it
+        // has been loaded
+        var scriptTag = $document[0].createElement('script');
+        scriptTag.type = 'text/javascript';
+        scriptTag.async = true;
+        scriptTag.src = 'vendor/d3/d3.min.js';
+        scriptTag.onreadystatechange = function() {
+          if (this.readyState == 'complete') onScriptLoad();
+        };
+        scriptTag.onload = onScriptLoad;
+
+        var s = $document[0].getElementsByTagName('body')[0];
+        s.appendChild(scriptTag);
+
+        return {
+          d3: function() { return d.promise; }
+        };
+      }
+    ]);
+
+(function() {
+  'use strict';
+
+  angular.module('pods', []).service('podService', PodDataService);
+
+  /**
+   * Pod DataService
+   * Mock async data service.
+   *
+   * @returns {{loadAll: Function}}
+   * @constructor
+   */
+  function PodDataService($q) {
+    var pods = {
+    "kind": "Pod",
+    "apiVersion": "v1beta3",
+    "metadata": {
+        "name": "redis-master-c0r1n",
+        "generateName": "redis-master-",
+        "namespace": "default",
+        "selfLink": "/api/v1beta3/namespaces/default/pods/redis-master-c0r1n",
+        "uid": "f12ddfaf-ff77-11e4-8f2d-080027213276",
+        "resourceVersion": "39",
+        "creationTimestamp": "2015-05-21T05:12:14Z",
+        "labels": {
+            "name": "redis-master"
+        },
+        "annotations": {
+            "kubernetes.io/created-by": "{\"kind\":\"SerializedReference\",\"apiVersion\":\"v1beta3\",\"reference\":{\"kind\":\"ReplicationController\",\"namespace\":\"default\",\"name\":\"redis-master\",\"uid\":\"f12969e0-ff77-11e4-8f2d-080027213276\",\"apiVersion\":\"v1beta3\",\"resourceVersion\":\"26\"}}"
+        }
+    },
+    "spec": {
+        "volumes": [
+            {
+                "name": "default-token-zb4rq",
+                "secret": {
+                    "secretName": "default-token-zb4rq"
+                }
+            }
+        ],
+        "containers": [
+            {
+                "name": "master",
+                "image": "redis",
+                "ports": [
+                    {
+                        "containerPort": 6379,
+                        "protocol": "TCP"
+                    }
+                ],
+                "resources": {},
+                "volumeMounts": [
+                    {
+                        "name": "default-token-zb4rq",
+                        "readOnly": true,
+                        "mountPath": "/var/run/secrets/kubernetes.io/serviceaccount"
+                    }
+                ],
+                "terminationMessagePath": "/dev/termination-log",
+                "imagePullPolicy": "IfNotPresent",
+                "capabilities": {},
+                "securityContext": {
+                    "capabilities": {},
+                    "privileged": false
+                }
+            }
+        ],
+        "restartPolicy": "Always",
+        "dnsPolicy": "ClusterFirst",
+        "serviceAccount": "default",
+        "host": "127.0.0.1"
+    },
+    "status": {
+        "phase": "Running",
+        "Condition": [
+            {
+                "type": "Ready",
+                "status": "True"
+            }
+        ],
+        "hostIP": "127.0.0.1",
+        "podIP": "172.17.0.1",
+        "startTime": "2015-05-21T05:12:14Z",
+        "containerStatuses": [
+            {
+                "name": "master",
+                "state": {
+                    "running": {
+                        "startedAt": "2015-05-21T05:12:14Z"
+                    }
+                },
+                "lastState": {},
+                "ready": true,
+                "restartCount": 0,
+                "image": "redis",
+                "imageID": "docker://95af5842ddb9b03f7c6ec7601e65924cec516fcedd7e590ae31660057085cf67",
+                "containerID": "docker://ae2a1e0a91a8b1015191a0b8e2ce8c55a86fb1a9a2b1e8e3b29430c9d93c8c09"
+            }
+        ]
+    }
+};
+
+    // Uses promises
+    return {
+      loadAll: function() {
+        // Simulate async call
+        return $q.when(pods);
+      }
+    };
+  }
+  PodDataService.$inject = ["$q"];
+
+})();
+
+(function() {
+  'use strict';
+
+  angular.module('replicationControllers', [])
+      .service('replicationControllerService', ReplicationControllerDataService);
+
+  /**
+   * Replication Controller DataService
+   * Mock async data service.
+   *
+   * @returns {{loadAll: Function}}
+   * @constructor
+   */
+  function ReplicationControllerDataService($q) {
+    var replicationControllers = {
+    "kind": "List",
+    "apiVersion": "v1beta3",
+    "metadata": {},
+    "items": [
+        {
+            "kind": "ReplicationController",
+            "apiVersion": "v1beta3",
+            "metadata": {
+                "name": "redis-master",
+                "namespace": "default",
+                "selfLink": "/api/v1beta3/namespaces/default/replicationcontrollers/redis-master",
+                "uid": "f12969e0-ff77-11e4-8f2d-080027213276",
+                "resourceVersion": "28",
+                "creationTimestamp": "2015-05-21T05:12:14Z",
+                "labels": {
+                    "name": "redis-master"
+                }
+            },
+            "spec": {
+                "replicas": 1,
+                "selector": {
+                    "name": "redis-master"
+                },
+                "template": {
+                    "metadata": {
+                        "creationTimestamp": null,
+                        "labels": {
+                            "name": "redis-master"
+                        }
+                    },
+                    "spec": {
+                        "containers": [
+                            {
+                                "name": "master",
+                                "image": "redis",
+                                "ports": [
+                                    {
+                                        "containerPort": 6379,
+                                        "protocol": "TCP"
+                                    }
+                                ],
+                                "resources": {},
+                                "terminationMessagePath": "/dev/termination-log",
+                                "imagePullPolicy": "IfNotPresent",
+                                "capabilities": {},
+                                "securityContext": {
+                                    "capabilities": {},
+                                    "privileged": false
+                                }
+                            }
+                        ],
+                        "restartPolicy": "Always",
+                        "dnsPolicy": "ClusterFirst",
+                        "serviceAccount": ""
+                    }
+                }
+            },
+            "status": {
+                "replicas": 1
+            }
+        }
+    ]};
+
+    // Uses promises
+    return {
+      loadAll: function() {
+        // Simulate async call
+        return $q.when(replicationControllers);
+      }
+    };
+  }
+  ReplicationControllerDataService.$inject = ["$q"];
+
+})();
+
+(function() {
+  'use strict';
+
+  angular.module('services', []).service('serviceService', ServiceDataService);
+
+  /**
+   * Service DataService
+   * Mock async data service.
+   *
+   * @returns {{loadAll: Function}}
+   * @constructor
+   */
+  function ServiceDataService($q) {
+    var services = {
+    "kind": "List",
+    "apiVersion": "v1beta3",
+    "metadata": {},
+    "items": [
+        {
+            "kind": "Service",
+            "apiVersion": "v1beta3",
+            "metadata": {
+                "name": "kubernetes",
+                "namespace": "default",
+                "selfLink": "/api/v1beta3/namespaces/default/services/kubernetes",
+                "resourceVersion": "6",
+                "creationTimestamp": null,
+                "labels": {
+                    "component": "apiserver",
+                    "provider": "kubernetes"
+                }
+            },
+            "spec": {
+                "ports": [
+                    {
+                        "protocol": "TCP",
+                        "port": 443,
+                        "targetPort": 443
+                    }
+                ],
+                "portalIP": "10.0.0.2",
+                "sessionAffinity": "None"
+            },
+            "status": {}
+        },
+        {
+            "kind": "Service",
+            "apiVersion": "v1beta3",
+            "metadata": {
+                "name": "kubernetes-ro",
+                "namespace": "default",
+                "selfLink": "/api/v1beta3/namespaces/default/services/kubernetes-ro",
+                "resourceVersion": "8",
+                "creationTimestamp": null,
+                "labels": {
+                    "component": "apiserver",
+                    "provider": "kubernetes"
+                }
+            },
+            "spec": {
+                "ports": [
+                    {
+                        "protocol": "TCP",
+                        "port": 80,
+                        "targetPort": 80
+                    }
+                ],
+                "portalIP": "10.0.0.1",
+                "sessionAffinity": "None"
+            },
+            "status": {}
+        },
+        {
+            "kind": "Service",
+            "apiVersion": "v1beta3",
+            "metadata": {
+                "name": "redis-master",
+                "namespace": "default",
+                "selfLink": "/api/v1beta3/namespaces/default/services/redis-master",
+                "uid": "a6fde246-ff78-11e4-8f2d-080027213276",
+                "resourceVersion": "72",
+                "creationTimestamp": "2015-05-21T05:17:19Z",
+                "labels": {
+                    "name": "redis-master"
+                }
+            },
+            "spec": {
+                "ports": [
+                    {
+                        "protocol": "TCP",
+                        "port": 6379,
+                        "targetPort": 6379
+                    }
+                ],
+                "selector": {
+                    "name": "redis-master"
+                },
+                "portalIP": "10.0.0.124",
+                "sessionAffinity": "None"
+            },
+            "status": {}
+        }
+    ]
+};
+
+    // Uses promises
+    return {
+      loadAll: function() {
+        // Simulate async call
+        return $q.when(services);
+      }
+    };
+  }
+  ServiceDataService.$inject = ["$q"];
+
+})();
+
 (function() {
   'use strict';
 
@@ -2384,356 +2737,3 @@ app.controller('ServiceCtrl', [
       });
 
 }());
-
-angular.module('kubernetesApp.components.dashboard')
-    .factory('d3DashboardService', [
-      '$document',
-      '$q',
-      '$rootScope',
-      function($document, $q, $rootScope) {
-        var d = $q.defer();
-        function onScriptLoad() {
-          // Load client in the browser
-          $rootScope.$apply(function() { d.resolve(window.d3); });
-        }
-        // Create a script tag with d3 as the source
-        // and call our onScriptLoad callback when it
-        // has been loaded
-        var scriptTag = $document[0].createElement('script');
-        scriptTag.type = 'text/javascript';
-        scriptTag.async = true;
-        scriptTag.src = 'vendor/d3/d3.min.js';
-        scriptTag.onreadystatechange = function() {
-          if (this.readyState == 'complete') onScriptLoad();
-        };
-        scriptTag.onload = onScriptLoad;
-
-        var s = $document[0].getElementsByTagName('body')[0];
-        s.appendChild(scriptTag);
-
-        return {
-          d3: function() { return d.promise; }
-        };
-      }
-    ]);
-
-(function() {
-  'use strict';
-
-  angular.module('pods', []).service('podService', PodDataService);
-
-  /**
-   * Pod DataService
-   * Mock async data service.
-   *
-   * @returns {{loadAll: Function}}
-   * @constructor
-   */
-  function PodDataService($q) {
-    var pods = {
-    "kind": "Pod",
-    "apiVersion": "v1beta3",
-    "metadata": {
-        "name": "redis-master-c0r1n",
-        "generateName": "redis-master-",
-        "namespace": "default",
-        "selfLink": "/api/v1beta3/namespaces/default/pods/redis-master-c0r1n",
-        "uid": "f12ddfaf-ff77-11e4-8f2d-080027213276",
-        "resourceVersion": "39",
-        "creationTimestamp": "2015-05-21T05:12:14Z",
-        "labels": {
-            "name": "redis-master"
-        },
-        "annotations": {
-            "kubernetes.io/created-by": "{\"kind\":\"SerializedReference\",\"apiVersion\":\"v1beta3\",\"reference\":{\"kind\":\"ReplicationController\",\"namespace\":\"default\",\"name\":\"redis-master\",\"uid\":\"f12969e0-ff77-11e4-8f2d-080027213276\",\"apiVersion\":\"v1beta3\",\"resourceVersion\":\"26\"}}"
-        }
-    },
-    "spec": {
-        "volumes": [
-            {
-                "name": "default-token-zb4rq",
-                "secret": {
-                    "secretName": "default-token-zb4rq"
-                }
-            }
-        ],
-        "containers": [
-            {
-                "name": "master",
-                "image": "redis",
-                "ports": [
-                    {
-                        "containerPort": 6379,
-                        "protocol": "TCP"
-                    }
-                ],
-                "resources": {},
-                "volumeMounts": [
-                    {
-                        "name": "default-token-zb4rq",
-                        "readOnly": true,
-                        "mountPath": "/var/run/secrets/kubernetes.io/serviceaccount"
-                    }
-                ],
-                "terminationMessagePath": "/dev/termination-log",
-                "imagePullPolicy": "IfNotPresent",
-                "capabilities": {},
-                "securityContext": {
-                    "capabilities": {},
-                    "privileged": false
-                }
-            }
-        ],
-        "restartPolicy": "Always",
-        "dnsPolicy": "ClusterFirst",
-        "serviceAccount": "default",
-        "host": "127.0.0.1"
-    },
-    "status": {
-        "phase": "Running",
-        "Condition": [
-            {
-                "type": "Ready",
-                "status": "True"
-            }
-        ],
-        "hostIP": "127.0.0.1",
-        "podIP": "172.17.0.1",
-        "startTime": "2015-05-21T05:12:14Z",
-        "containerStatuses": [
-            {
-                "name": "master",
-                "state": {
-                    "running": {
-                        "startedAt": "2015-05-21T05:12:14Z"
-                    }
-                },
-                "lastState": {},
-                "ready": true,
-                "restartCount": 0,
-                "image": "redis",
-                "imageID": "docker://95af5842ddb9b03f7c6ec7601e65924cec516fcedd7e590ae31660057085cf67",
-                "containerID": "docker://ae2a1e0a91a8b1015191a0b8e2ce8c55a86fb1a9a2b1e8e3b29430c9d93c8c09"
-            }
-        ]
-    }
-};
-
-    // Uses promises
-    return {
-      loadAll: function() {
-        // Simulate async call
-        return $q.when(pods);
-      }
-    };
-  }
-  PodDataService.$inject = ["$q"];
-
-})();
-
-(function() {
-  'use strict';
-
-  angular.module('replicationControllers', [])
-      .service('replicationControllerService', ReplicationControllerDataService);
-
-  /**
-   * Replication Controller DataService
-   * Mock async data service.
-   *
-   * @returns {{loadAll: Function}}
-   * @constructor
-   */
-  function ReplicationControllerDataService($q) {
-    var replicationControllers = {
-    "kind": "List",
-    "apiVersion": "v1beta3",
-    "metadata": {},
-    "items": [
-        {
-            "kind": "ReplicationController",
-            "apiVersion": "v1beta3",
-            "metadata": {
-                "name": "redis-master",
-                "namespace": "default",
-                "selfLink": "/api/v1beta3/namespaces/default/replicationcontrollers/redis-master",
-                "uid": "f12969e0-ff77-11e4-8f2d-080027213276",
-                "resourceVersion": "28",
-                "creationTimestamp": "2015-05-21T05:12:14Z",
-                "labels": {
-                    "name": "redis-master"
-                }
-            },
-            "spec": {
-                "replicas": 1,
-                "selector": {
-                    "name": "redis-master"
-                },
-                "template": {
-                    "metadata": {
-                        "creationTimestamp": null,
-                        "labels": {
-                            "name": "redis-master"
-                        }
-                    },
-                    "spec": {
-                        "containers": [
-                            {
-                                "name": "master",
-                                "image": "redis",
-                                "ports": [
-                                    {
-                                        "containerPort": 6379,
-                                        "protocol": "TCP"
-                                    }
-                                ],
-                                "resources": {},
-                                "terminationMessagePath": "/dev/termination-log",
-                                "imagePullPolicy": "IfNotPresent",
-                                "capabilities": {},
-                                "securityContext": {
-                                    "capabilities": {},
-                                    "privileged": false
-                                }
-                            }
-                        ],
-                        "restartPolicy": "Always",
-                        "dnsPolicy": "ClusterFirst",
-                        "serviceAccount": ""
-                    }
-                }
-            },
-            "status": {
-                "replicas": 1
-            }
-        }
-    ]};
-
-    // Uses promises
-    return {
-      loadAll: function() {
-        // Simulate async call
-        return $q.when(replicationControllers);
-      }
-    };
-  }
-  ReplicationControllerDataService.$inject = ["$q"];
-
-})();
-
-(function() {
-  'use strict';
-
-  angular.module('services', []).service('serviceService', ServiceDataService);
-
-  /**
-   * Service DataService
-   * Mock async data service.
-   *
-   * @returns {{loadAll: Function}}
-   * @constructor
-   */
-  function ServiceDataService($q) {
-    var services = {
-    "kind": "List",
-    "apiVersion": "v1beta3",
-    "metadata": {},
-    "items": [
-        {
-            "kind": "Service",
-            "apiVersion": "v1beta3",
-            "metadata": {
-                "name": "kubernetes",
-                "namespace": "default",
-                "selfLink": "/api/v1beta3/namespaces/default/services/kubernetes",
-                "resourceVersion": "6",
-                "creationTimestamp": null,
-                "labels": {
-                    "component": "apiserver",
-                    "provider": "kubernetes"
-                }
-            },
-            "spec": {
-                "ports": [
-                    {
-                        "protocol": "TCP",
-                        "port": 443,
-                        "targetPort": 443
-                    }
-                ],
-                "portalIP": "10.0.0.2",
-                "sessionAffinity": "None"
-            },
-            "status": {}
-        },
-        {
-            "kind": "Service",
-            "apiVersion": "v1beta3",
-            "metadata": {
-                "name": "kubernetes-ro",
-                "namespace": "default",
-                "selfLink": "/api/v1beta3/namespaces/default/services/kubernetes-ro",
-                "resourceVersion": "8",
-                "creationTimestamp": null,
-                "labels": {
-                    "component": "apiserver",
-                    "provider": "kubernetes"
-                }
-            },
-            "spec": {
-                "ports": [
-                    {
-                        "protocol": "TCP",
-                        "port": 80,
-                        "targetPort": 80
-                    }
-                ],
-                "portalIP": "10.0.0.1",
-                "sessionAffinity": "None"
-            },
-            "status": {}
-        },
-        {
-            "kind": "Service",
-            "apiVersion": "v1beta3",
-            "metadata": {
-                "name": "redis-master",
-                "namespace": "default",
-                "selfLink": "/api/v1beta3/namespaces/default/services/redis-master",
-                "uid": "a6fde246-ff78-11e4-8f2d-080027213276",
-                "resourceVersion": "72",
-                "creationTimestamp": "2015-05-21T05:17:19Z",
-                "labels": {
-                    "name": "redis-master"
-                }
-            },
-            "spec": {
-                "ports": [
-                    {
-                        "protocol": "TCP",
-                        "port": 6379,
-                        "targetPort": 6379
-                    }
-                ],
-                "selector": {
-                    "name": "redis-master"
-                },
-                "portalIP": "10.0.0.124",
-                "sessionAffinity": "None"
-            },
-            "status": {}
-        }
-    ]
-};
-
-    // Uses promises
-    return {
-      loadAll: function() {
-        // Simulate async call
-        return $q.when(services);
-      }
-    };
-  }
-  ServiceDataService.$inject = ["$q"];
-
-})();

www/master/less/app/base.less

@@ -454,3 +454,20 @@ md-toolbar h1 {
   line-height: 40px; vertical-align: middle;
   padding: 2px;
 }
+
+md-select-menu.md-default-theme md-option:focus:not([selected]) {
+  background: rgb(238,238,238);
+}
+md-select-menu {
+  md-option {
+
+    &:not([disabled]):hover, &:not([disabled]):focus {
+      background-color: rgba(158,158,158,0.2);
+      // background: transparent;
+    }
+
+    transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
+    transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
+
+  }
+}