From 61535bcc8d8a73e527a3ff1ff2aac3eae8b56ae9 Mon Sep 17 00:00:00 2001 From: Wade Brainerd Date: Tue, 11 Nov 2008 19:42:38 +0000 Subject: Keyboard looking better. --- diff --git a/TODO b/TODO index fdb4923..5995726 100644 --- a/TODO +++ b/TODO @@ -1,11 +1,12 @@ Typing Turtle First Release -+ Working medals assignment: "You got a medal!" popup, display next to lesson. +- Working medals assignment: "You got a medal!" popup, display next to lesson. + Graphical WPM and accuracy meters. + Nice looking keyboard. + Highlighted keyboard keys when pressed. + Support for displaying modifier keys in Keyboard. ++ Allow lessons to choose between forcing correct keypresses and allowing incorrect ones (with support for Backspace). + Artwork and animations. + Background picture in main screen. + Animated turtle in main screen. @@ -17,7 +18,6 @@ First Release + Medal award sounds for each medal type: Bronze, Silver, Gold. + Incorrect key pressed sound. + Develop lessons. - + Automatically generate lessons for keyboard regions: Home row, Top row, Bottom row, Numbers, etc. + Mark some lessons as "locational" versus "textual" and translate from the English keyboard to native. Ex: Home row, Left hand, Numbers, etc. + Give each lesson criteria for each medal type based on Accuracy, WPM. diff --git a/keyboard.py b/keyboard.py index 3dd4838..a7250ca 100644 --- a/keyboard.py +++ b/keyboard.py @@ -46,6 +46,9 @@ KEY_PROPS = [ # Gap between keys. Used by 'horizontal' and 'verical' layout algorithms. { 'name': 'key-gap', 'default': 0 }, + # Text label to be displayed on keys which do not generate ASCII keys. + { 'name': 'key-label', 'default': '' }, + # Character generated by the key, when no modifier keys are pressed. { 'name': 'key-normal', 'default': '' }, @@ -66,12 +69,12 @@ KEY_PROPS = [ DEFAULT_LAYOUT = { 'layout-name': "default", - 'layout-width': 555, + 'layout-width': 775, 'layout-height': 300, 'group-layout': 'horizontal', - 'key-width': 40, + 'key-width': 45, 'key-height': 45, 'key-gap': 5, @@ -79,17 +82,18 @@ DEFAULT_LAYOUT = { { 'group-name': "row0", 'group-x': 10, - 'group-y': 7.5, - - 'key-width': 100, - 'key-height': 30, - 'key-gap': 45, - + 'group-y': 10, + + 'key-height': 35, + 'keys': [ - {'key-normal':"X",'key-shift':"X"}, - {'key-normal':"O",'key-shift':"O"}, - {'key-normal':"X",'key-shift':"X"}, - {'key-normal':"O",'key-shift':"O"} + {'key-normal':"",'key-shift':""}, # Escape + {'key-normal':"",'key-shift':""}, # Show Source + {'key-normal':"",'key-shift':"",'key-width':182}, # Zoom + {'key-normal':"",'key-shift':"",'key-width':182}, # Size + {'key-normal':"",'key-shift':"",'key-width':181}, # Volume + {'key-normal':"",'key-shift':""}, # Window + {'key-normal':"",'key-shift':""}, # Frame ] }, { @@ -98,6 +102,7 @@ DEFAULT_LAYOUT = { 'group-y': 50, 'keys': [ + {'key-normal':"`",'key-shift':"~",'key-width':35}, {'key-normal':"1",'key-shift':"!"}, {'key-normal':"2",'key-shift':"@"}, {'key-normal':"3",'key-shift':"#"}, @@ -109,7 +114,8 @@ DEFAULT_LAYOUT = { {'key-normal':"9",'key-shift':"("}, {'key-normal':"0",'key-shift':")"}, {'key-normal':"-",'key-shift':"_"}, - {'key-normal':"=",'key-shift':"+"} + {'key-normal':"=",'key-shift':"+",'key-width':65}, + {'key-label':"erase",'key-width':95} ] }, { @@ -118,6 +124,7 @@ DEFAULT_LAYOUT = { 'group-y': 100, 'keys': [ + {'key-label':"tab"}, {'key-normal':"q",'key-shift':"Q"}, {'key-normal':"w",'key-shift':"W"}, {'key-normal':"e",'key-shift':"E"}, @@ -129,7 +136,8 @@ DEFAULT_LAYOUT = { {'key-normal':"o",'key-shift':"O"}, {'key-normal':"p",'key-shift':"P"}, {'key-normal':"[",'key-shift':"{"}, - {'key-normal':"]",'key-shift':"}"} + {'key-normal':"]",'key-shift':"}",'key-width':55}, + {'key-label':"enter",'key-width':95,'key-height':95} ] }, { @@ -138,6 +146,7 @@ DEFAULT_LAYOUT = { 'group-y': 150, 'keys': [ + {'key-label':"ctrl",'key-width':55}, {'key-normal':"a",'key-shift':"A"}, {'key-normal':"s",'key-shift':"S"}, {'key-normal':"d",'key-shift':"D"}, @@ -154,10 +163,11 @@ DEFAULT_LAYOUT = { }, { 'group-name': "row4", - 'group-x': 55, + 'group-x': 10, 'group-y': 200, 'keys': [ + {'key-label':"shift",'key-width':75}, {'key-normal':"z",'key-shift':"Z"}, {'key-normal':"x",'key-shift':"X"}, {'key-normal':"c",'key-shift':"C"}, @@ -167,24 +177,27 @@ DEFAULT_LAYOUT = { {'key-normal':"m",'key-shift':"M"}, {'key-normal':",",'key-shift':"<"}, {'key-normal':".",'key-shift':">"}, - {'key-normal':"/",'key-shift':"?"} + {'key-normal':"/",'key-shift':"?"}, + {'key-label':"shift",'key-width':75}, + {'key-label':"",'key-shift':""}, # Up + {'key-label':"",'key-shift':""}, # Multiply ] }, { 'group-name': "row5", - 'group-x': 55, + 'group-x': 10, 'group-y': 250, 'keys': [ - {'key-normal':"fn",'key-shift':"fn"}, - {'key-normal':"HA",'key-shift':"HA"}, - {'key-normal':"alt",'key-shift':"alt"}, - {'key-normal':"space",'key-shift':"space", 'key-width':85}, - {'key-normal':"alt gr",'key-shift':"alt gr"}, - {'key-normal':"HA",'key-shift':"HA"}, - {'key-normal':"<-",'key-shift':"<-"}, - {'key-normal':"dn",'key-shift':"dn"}, - {'key-normal':"->",'key-shift':"->"} + {'key-label':"fn",'key-width':35}, + {'key-label':"",'key-width':55}, # LHand + {'key-label':"alt",'key-width':55}, # LAlt + {'key-normal':" ",'key-shift':" ", 'key-width':325}, + {'key-label':"alt",'key-width':55}, # RAlt + {'key-label':"",'key-width':55}, # RHand + {'key-label':""}, # Left + {'key-label':""}, # Down + {'key-label':""}, # Right ] } ] @@ -206,7 +219,7 @@ class Key: class Keyboard(gtk.DrawingArea): """A GTK widget which provides an interactive visual keyboard, with support - for data driven custom layouts.""" + for custom data driven layouts.""" def __init__(self): gtk.DrawingArea.__init__(self) @@ -332,18 +345,53 @@ class Keyboard(gtk.DrawingArea): self._update_screen_layout() # Draw the keys. - style = self.get_style() - gc = style.fg_gc[gtk.STATE_NORMAL] + cr = self.window.cairo_create() + cr.rectangle(event.area.x, event.area.y, event.area.width, event.area.height) + cr.clip() + + bounds = self.get_allocation() for k in self.keys: - # Outline rectangle. - gc.set_clip_rectangle(gtk.gdk.Rectangle(k.screen_x-1, k.screen_y-1, k.screen_width+2, k.screen_height+2)) - self.window.draw_rectangle(gc, False, k.screen_x, k.screen_y, k.screen_width, k.screen_height) + cr.save() + + x1 = k.screen_x + y1 = k.screen_y + x2 = k.screen_x + k.screen_width + y2 = k.screen_y + k.screen_height + + # Outline rounded box. + corner = 5 + cr.move_to(x1 + corner, y1) + cr.line_to(x2 - corner, y1) + cr.line_to(x2, y1 + corner) + cr.line_to(x2, y2 - corner) + cr.line_to(x2 - corner, y2) + cr.line_to(x1 + corner, y2) + cr.line_to(x1, y2 - corner) + cr.line_to(x1, y1 + corner) + cr.close_path() + + cr.set_source_rgb(1.0, 1.0, 1.0) + cr.fill_preserve() + + cr.set_source_rgb(0.1, 0.1, 0.1) + cr.stroke_preserve() + + cr.clip() # Inner text. - gc.set_clip_rectangle(gtk.gdk.Rectangle(k.screen_x+1, k.screen_y+1, k.screen_width-1, k.screen_height-1)) - self.pangolayout.set_text(k.props['key-normal']) - self.window.draw_layout(gc, k.screen_x+5, k.screen_y+5, self.pangolayout) + if k.props['key-label']: + text = k.props['key-label'] + else: + text = k.props['key-normal'] + + cr.set_font_size(16) + x_bearing, y_bearing, width, height = cr.text_extents(text)[:4] + + cr.move_to(x1+8 - x_bearing, y2-8 - height - y_bearing) + cr.show_text(text) + + cr.restore() return True diff --git a/lessons/LESSONS.en_US b/lessons/LESSONS.en_US index 83b24d8..ee0413a 100644 --- a/lessons/LESSONS.en_US +++ b/lessons/LESSONS.en_US @@ -78,10 +78,6 @@ { "instructions": "Now for the final two keys of the home row. Move your right pinky finger over and press the ' key.", "text": "'" - }, - { - "instructions": "Now, move your right pinky finger over two keys and press the Enter key.", - "text": "" } ] } diff --git a/typingturtle.py b/typingturtle.py index add253d..ab9a0c7 100755 --- a/typingturtle.py +++ b/typingturtle.py @@ -78,7 +78,6 @@ class MedalScreen(gtk.EventBox): vbox = gtk.VBox() vbox.pack_start(cert0, True, False, 0) - vbox.pack_start(gtk.HSeparator(), False, False, 20) vbox.pack_start(cert1, False, False, 0) vbox.pack_start(gtk.HSeparator(), False, False, 20) vbox.pack_start(statbox, False, False, 0) @@ -113,6 +112,11 @@ class LessonScreen(gtk.VBox): self.wpmlabel = gtk.Label() self.accuracylabel = gtk.Label() + #self.wpmarea = gtk.DrawingArea() + #self.wpmarea.connect('expose-event', self.wpm_expose_cb) + #self.accuracyarea = gtk.DrawingArea() + #self.accuracyarea.connect('expose-event', self.accuracy_expose_cb) + hbox = gtk.HBox() hbox.pack_start(stopbtn, False, False, 10) hbox.pack_start(self.wpmlabel, True, False, 10) -- cgit v0.9.1