From 3e78580c91efdc270601beb53f13f6d3d9160895 Mon Sep 17 00:00:00 2001
From: rlx <0x0073@0x2620.org>
Date: Thu, 1 Aug 2013 11:28:14 +0000
Subject: [PATCH] collapse panel: add expand/collapse keyboard shortcuts

---
 source/Ox.UI/js/Panel/CollapsePanel.js | 25 +++++++++++++++++++++----
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/source/Ox.UI/js/Panel/CollapsePanel.js b/source/Ox.UI/js/Panel/CollapsePanel.js
index ebe04a82..e9715ae7 100644
--- a/source/Ox.UI/js/Panel/CollapsePanel.js
+++ b/source/Ox.UI/js/Panel/CollapsePanel.js
@@ -28,20 +28,28 @@ Ox.CollapsePanel = function(options, self) {
                 collapsed: function() {
                     // will be toggled again in toggleCollapsed
                     self.options.collapsed = !self.options.collapsed;
-                    self.$button.toggle();
                     toggleCollapsed();
                 },
                 title: function() {
                     self.$title.html(self.options.title);
                 }
             })
-            .addClass('OxPanel OxCollapsePanel');
+            .addClass('OxPanel OxCollapsePanel')
+            .bindEvent({
+                key_left: function() {
+                    !self.options.collapsed && toggleCollapsed();
+                },
+                key_right: function() {
+                    self.options.collapsed && toggleCollapsed();
+                }
+            });
 
     self.$titlebar = Ox.Bar({
             orientation: 'horizontal',
             size: self.options.size
         })
         .bindEvent({
+            anyclick: clickTitlebar,
             doubleclick: doubleclickTitlebar
         })
         .appendTo(that);
@@ -56,7 +64,9 @@ Ox.CollapsePanel = function(options, self) {
             ]
         })
         .bindEvent({
-            click: toggleCollapsed
+            click: function() {
+                toggleCollapsed(true);
+            }
         })
         .appendTo(self.$titlebar);
 
@@ -86,18 +96,25 @@ Ox.CollapsePanel = function(options, self) {
         }).hide();
     }
 
+    function clickTitlebar(e) {
+        if (!$(e.target).hasClass('OxButton')) {
+            that.gainFocus();
+        }
+    }
+
     function doubleclickTitlebar(e) {
         if (!$(e.target).hasClass('OxButton')) {
             self.$button.trigger('click');
         }
     }
 
-    function toggleCollapsed() {
+    function toggleCollapsed(fromButton) {
         // show/hide is needed in case the collapsed content
         // grows vertically when shrinking the panel horizontally
         var marginTop;
         self.options.collapsed = !self.options.collapsed;
         marginTop = self.options.collapsed ? -that.$content.height() : 0;
+        !fromButton && self.$button.toggle();
         !self.options.collapsed && that.$content.css({
             marginTop: -that.$content.height() + 'px'
         }).show();