From 50d0425f430059ad11d08dd9a6ff50d6b9b83596 Mon Sep 17 00:00:00 2001
From: zepumph <michael.kauzmann@colorado.edu>
Date: Wed, 28 Mar 2018 15:12:35 -0800
Subject: [PATCH] added hover state to buttons on focus/blur with keyboard,
 https://github.com/phetsims/sun/issues/323

---
 js/JoistButton.js               | 6 ++++++
 js/NavigationBarScreenButton.js | 6 ++++++
 js/ScreenButton.js              | 8 ++++++++
 3 files changed, 20 insertions(+)

diff --git a/js/JoistButton.js b/js/JoistButton.js
index e9473a74..8007957a 100644
--- a/js/JoistButton.js
+++ b/js/JoistButton.js
@@ -94,6 +94,12 @@ define( function( require ) {
     this.addAccessibleInputListener( {
       click: function() {
         self.buttonModel.a11yClick( options.a11yEndListener );
+      },
+      focus: function() {
+        self.buttonModel.overProperty.value = true;
+      },
+      blur: function() {
+        self.buttonModel.overProperty.value = false;
       }
     } );
 
diff --git a/js/NavigationBarScreenButton.js b/js/NavigationBarScreenButton.js
index 7dec8e63..ce735810 100644
--- a/js/NavigationBarScreenButton.js
+++ b/js/NavigationBarScreenButton.js
@@ -108,6 +108,12 @@ define( function( require ) {
     this.addAccessibleInputListener( {
       click: function() {
         self.buttonModel.a11yClick();
+      },
+      focus: function() {
+        self.buttonModel.overProperty.value = true;
+      },
+      blur: function() {
+        self.buttonModel.overProperty.value = false;
       }
     } );
 
diff --git a/js/ScreenButton.js b/js/ScreenButton.js
index 4dfa0279..8108be77 100644
--- a/js/ScreenButton.js
+++ b/js/ScreenButton.js
@@ -117,6 +117,14 @@ define( function( require ) {
     this.addInputListener( { down: downListener } );
     this.addAccessibleInputListener( { click: function() { large && downListener(); } } );
     this.addAccessibleInputListener( { focus: function() { !large && downListener(); } } );
+    this.addAccessibleInputListener( {
+      focus: function() {
+        highlightedScreenIndexProperty.value = index;
+      },
+      blur: function() {
+        highlightedScreenIndexProperty.value = -1;
+      }
+    } );
 
     // Set highlight listeners to the small screen button
     if ( !large ) {