Add Help panel showing keyboard controls.

2 files changed, 83 insertions, 1 deletions

diff --git a/colors.py b/colors.py
index 9fa2602..5222c89 100755
--- a/colors.py
+++ b/colors.py
@@ -315,6 +315,48 @@ class ProgressPanel(gtk.VBox):
 
         self.pack_start(vbox, True, False)
 
+# This is the overlay that appears when the Help button is pressed. 
+class HelpPanel(gtk.VBox):
+    def __init__ (self):
+        gtk.VBox.__init__(self)
+
+        # Add the context sensitive help.
+        self.helplabel = gtk.Label()
+        self.helplabel.set_padding(10, 10)
+        self.helplabel.set_markup( 
+            '''
+<span font_family="monospace" size="large" color="#ffffff">
+Keyboard controls:                    Gamepad controls:
+
+Space     - Open palette              Up     - Zoom in  
+v         - Video paint               Down   - Zoom in
+Hand drag - Scroll drag               Left   - Center canvas
+Arrows    - Scroll                    Right  - Scroll drag
+Alt click - Pick up color             Square - Open palette
+Ctrl Up   - Zoom in                   Check  - Undo
+Ctrl Down - Zoom in                   Circle - Pick
+Ctrl A    - Center canvas             X      - Paint
+Ctrl Z    - Undo
+Ctrl C    - Copy to clipboard
+Ctrl E    - Erase image
+Alt Enter - Full screen
+
+
+                    Alt + letter - Save brush
+                          letter - Restore brush
+</span>
+'''
+        )
+        self.helpbox = gtk.EventBox()
+        self.helpbox.modify_bg(gtk.STATE_NORMAL, self.helpbox.get_colormap().alloc_color('#000000'))
+        self.helpbox.add(self.helplabel)
+
+        vbox = gtk.VBox()
+        vbox.set_property("spacing", 20)
+        vbox.pack_start(self.helpbox, True, True)
+        
+        self.pack_start(vbox, True, True)
+
 # This is the main Colors! activity class.
 # 
 # It owns the main application window, the painting canvas, and all the various toolbars and options.
@@ -377,6 +419,9 @@ class Colors(activity.Activity, ExportedGObject):
         # Build the progress display popup window.
         self.build_progress()
         
+        # Build the help popup window.
+        self.build_help()
+        
         # Start camera processing.
         self.init_camera()
         
@@ -393,6 +438,7 @@ class Colors(activity.Activity, ExportedGObject):
         self.show_all()
         self.brush_controls.hide()
         self.progress.hide()
+        self.help.hide()
         self.overlay_active = False
         
         # Start it running.
@@ -451,6 +497,11 @@ class Colors(activity.Activity, ExportedGObject):
         self.progress.set_size_request(gtk.gdk.screen_width(), gtk.gdk.screen_height())
         self.easelarea.put(self.progress, 0, 0)
 
+    def build_help (self):
+        self.help = HelpPanel()
+        self.help.set_size_request(gtk.gdk.screen_width(), gtk.gdk.screen_height())
+        self.easelarea.put(self.help, 0, 0)
+
     def build_toolbar (self):
         self.add_accel_group(gtk.AccelGroup())
         
@@ -538,6 +589,12 @@ class Colors(activity.Activity, ExportedGObject):
         self.clearbtn.connect('clicked', self.on_clear)
         self.clearbtn.props.accelerator = '<Ctrl>E'
         
+        self.helpbtn = toggletoolbutton.ToggleToolButton('help')
+        self.helpbtn.set_active(False)
+        self.helpbtn.set_tooltip(_("Show Help"))
+        #self.helpbtn.props.accelerator = '<Ctrl>H'
+        self.helpbtn.connect('clicked', self.on_help)
+        
         #editbox = activity.EditToolbar()
         #editbox.undo.props.visible = False
         #editbox.redo.props.visible = False
@@ -561,10 +618,11 @@ class Colors(activity.Activity, ExportedGObject):
         #paintbox.insert(self.showrefbtn, -1)
         paintbox.insert(self.videopaintsep, -1)
         paintbox.insert(self.videopaintbtn, -1)
+        paintbox.insert(self.helpbtn, -1)
         #paintbox.insert(self.videopaintitem, -1)
         paintbox.insert(self.clearsep, -1)
         paintbox.insert(self.clearbtn, -1)
-        
+
         # Playback controls
         self.startbtn = toolbutton.ToolButton('media-playback-start')
         self.startbtn.set_tooltip(_("Start Playback"))
@@ -2050,6 +2108,21 @@ class Colors(activity.Activity, ExportedGObject):
         del ds
     
     #-----------------------------------------------------------------------------------------------------------------
+    # Help dialog
+    
+    def on_help(self, widget):
+        if widget.get_active():
+            self.help.set_size_request(self.width, self.height)
+            self.help.show_all()
+            self.easelarea.set_double_buffered(True)
+            self.overlay_active = True
+            self.flush_entire_canvas()
+        else:
+            self.help.hide_all()
+            self.overlay_active = False
+            self.flush_entire_canvas()
+    
+    #-----------------------------------------------------------------------------------------------------------------
     # Benchmarking
     # 
     # Simply causes the C++ code to do a bunch of work and prints out the time used.  Useful for testing the benefits
diff --git a/icons/help.svg b/icons/help.svg
new file mode 100755
index 0000000..4611d8a
--- /dev/null
+++ b/icons/help.svg
@@ -0,0 +1,9 @@
+<?xml version="1.0" ?><!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd' [
+	<!ENTITY stroke_color "#000">
+	<!ENTITY fill_color "#eee">
+]><svg height="55px" viewBox="0 0 55 55" width="55px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" stroke-linecap="round" stroke-linejoin="round" stroke-width="3.5" stroke="&stroke_color;" fill="&fill_color;">
+ <g>
+  <path d="M 50 27.625 C 50 39.9681 39.8431 50.125 27.5 50.125 C 15.1569 50.125 5 39.9681 5 27.625 C 5 15.2819 15.1569 5.125 27.5 5.125 C 39.8431 5.125 50 15.2819 50 27.625 Z " />
+  <path d="M 23.956 27.167 C 23.956 25.546 25.756 25.277 27.601 24.781 C 29.401 24.286 31.201 23.566 31.201 20.956 C 31.201 18.976 29.356 17.536 27.467 17.536 C 23.687 17.536 23.102 21.991 20.221 21.991 C 18.601 21.991 17.476 20.731 17.476 18.751 C 17.476 14.025 23.416 11.326 27.467 11.326 C 33.273 11.326 38.223 14.926 38.223 20.957 C 38.223 25.952 35.073 28.878 30.438 30.048 L 30.438 31.667 C 30.438 33.468 29.087 34.772 27.197 34.772 C 25.172 34.772 23.957 33.467 23.957 31.667 L 23.957 27.167 Z M 23.686 40.937 C 23.686 39.002 25.261 37.427 27.196 37.427 C 29.132 37.427 30.706 39.002 30.706 40.937 C 30.706 42.873 29.132 44.449 27.196 44.449 C 25.261 44.448 23.686 42.872 23.686 40.937 Z " fill="&stroke_color;" stroke="none" />
+ </g>
+</svg>
\ No newline at end of file