move the button links to actual buttons, fix some bugs

- by using normal buttons we get the native look&feel and space can activate
  the buttons which is what users expect. Unfortunately it seems that the
  buttons are currently hard-coded to a small font size; hopefully this will
  be fixed in a future toolkit release
- remove the space hack from webview
- move the times into the ease buttons
- set a default button on a few screens
- fix a bug with clearing progress after an error

aqt/deckbrowser.py

@@ -74,7 +74,8 @@ class DeckBrowser(object):
 #            ("synced", _("Synced")),
             ("refresh", _("Refresh")),
         ]
-        h = "".join(["<a class=but href=%s>%s</a>" % row for row in items])
+        h = "".join([self.mw.button(
+            link=row[0], name=row[1]) for row in items])
         return h
 
     # Event handlers
@@ -214,11 +215,9 @@ a { font-size: 80%; }
             # no counts
             buf += "<td colspan=2></td>"
         # options
-        buf += "<td class=opts><a class=but href='opts:%d'>%s&#9660;</a></td>" % (
-            c, "Options")
+        buf += "<td class=opts>%s</td>" % (
+            self.mw.button(link="opts:%d"%c, name=_("Options")+'&#9660'))
         buf += "</tr>"
-        # if c != max:
-        #     buf += "<tr><td colspan=4><hr noshade></td></tr>"
         return buf
 
     def _summary(self):

aqt/main.py

@@ -142,41 +142,25 @@ class AnkiQt(QMainWindow):
 
     sharedCSS = """
 body {
-/*background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#bbb));*/
-background: #eee;
+background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#bbb));
+/*background: #eee;*/
 margin: 2em;
 }
 a:hover { background-color: #aaa; }
-.but {
-    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
-    -webkit-user-drag: none;
-    -webkit-user-select: none;
-    background-color: #ccc;
-    border-radius: 5px;
-    border: 1px solid #aaa;
-    color: #000;
-    display: inline-block;
-    font-size: 80%;
-    margin: 0 5 0 5;
-    padding: 3;
-    text-decoration: none;
-    text-align: center;
-}
-.but:focus, .but:hover { background-color: #aaa; }
-.gbut { background-color: #7c7; }
-.gbut:hover, .gbut:focus  { background-color: #5a5; }
 h1 { margin-bottom: 0.2em; }
 hr { margin:5 0 5 0; border:0; height:1px; background-color:#ccc; }
 """
 
-    def button(self, link, name, key=None, class_=""):
+    def button(self, link, name, key=None, class_="", id=""):
         class_ = "but "+ class_
         if key:
-             key = _("Shortcut key: %s") % key
+            key = _("Shortcut key: %s") % key
         else:
             key = ""
-        return '<a class="%s" title="%s" href="%s">%s</a>' % (
-            class_, key, link, name)
+        return '''
+<button id="%s" class="%s" onclick="py.link('%s');return false;"
+title="%s">%s</button>''' % (
+            id, class_, link, key, name)
 
     # Signal handling
     ##########################################################################

aqt/overview.py

@@ -31,7 +31,7 @@ class Overview(object):
 
     def _keyHandler(self, evt):
         txt = evt.text()
-        if evt.key() == Qt.Key_Space:
+        if txt == "s":
             self._linkHandler("study")
         elif txt == "c":
             self._linkHandler("cram")
@@ -88,7 +88,8 @@ class Overview(object):
 %(opts)s
 </center>
 
-<script id="source" language="javascript" type="text/javascript">
+<script>
+$("#study").focus();
 $(function () {
     var d = %(fcdata)s;
     if (d) {
@@ -122,7 +123,7 @@ $(function () {
         buf += line % (
             "<a href=chgrp>%s</a>" % _("Selected Groups"),
             counts[0], counts[1],
-            but("study", _("Study"), _("space"), "gbut") +
+            but("study", _("Study"), _("s"), "gbut", id="study") +
             but("cram", _("Cram"), "c"))
         buf += line % (
             _("Whole Deck"),

aqt/progress.py

@@ -117,7 +117,7 @@ class ProgressManager(object):
         "Restore the interface after an error."
         if self._levels:
             self._levels = 1
-            self.finishProgress()
+            self.finish()
 
     def _maybeShow(self):
         delta = time.time() - self._firstTime

aqt/reviewer.py

@@ -78,8 +78,8 @@ class Reviewer(object):
 <div id=a></div>
 <div id=filler></div>
 </td></tr></table>
-<a id=ansbut class="but ansbut" href=ans onclick="showans();">
-<div class=ansbut>%(showans)s</div>
+<a id=ansbut class="ansbut ansbutbig" href=ans onclick="showans();">
+<div class=ansbuttxt>%(showans)s</div>
 </a>
 <div id=easebuts>
 </div>
@@ -110,6 +110,7 @@ function showans () {
         location.hash = "a";
     }
     $("#ansbut").hide();
+    $("#defease").focus();
 };
 $(document).ready(function () {
 $(".ansbut").focus();
@@ -183,14 +184,13 @@ $(".ansbut").focus();
             else:
                 extra = ""
             return '''
-<a %s class="but easebut" href=ease%d>%s</a>''' % (extra, i, label)
+<a %s class="ansbut easebut" href=ease%d>%s</a>''' % (extra, i, label)
         for i in range(0, len(labels)):
-            times.append(self._buttonTime(i, default-1))
-            buttons.append(but(labels[i], i+1))
-        buf = ("<table><tr><td align=center>" +
-               "</td><td align=center>".join(times) + "</td></tr>")
-        buf += ("<tr><td>" +
-                "</td><td>".join(buttons) + "</td></tr></table>")
+            l = labels[i]
+            l += "<br><small>%s</small>" % self._buttonTime(i, default-1)
+            buttons.append(but(l, i+1))
+        buf = ("<table><tr><td>" +
+               "</td><td>".join(buttons) + "</td></tr></table>")
         return "<center>" + buf + "</center>"
         return buf
 
@@ -202,7 +202,6 @@ $(".ansbut").focus();
             txt = '<span style="color: #700">%s</span>' % txt
         elif i == green:
             txt = '<span style="color: #070">%s</span>' % txt
-        txt = '<span class=time>%s</span>' % txt
         return txt
 
     # Answering a card
@@ -261,19 +260,34 @@ $(".ansbut").focus();
     ##########################################################################
 
     _css = """
-a.ansbut {
+.ansbut {
+    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
+    -webkit-user-drag: none;
+    -webkit-user-select: none;
+    background-color: #ddd;
+    border-radius: 5px;
+    border: 1px solid #aaa;
+    color: #000;
+    display: inline-block;
+    font-size: 80%;
+    margin: 0 5 0 5;
+    padding: 3;
+    text-decoration: none;
+    text-align: center;
+}
+.but:focus, .but:hover { background-color: #aaa; }
+.ansbutbig {
     bottom: 1em;
     height: 40px;
     left: 50%;
-    margin-left: -125px;
+    margin-left: -125px !important;
     position: fixed;
     width: 250px;
     font-size: 100%;
 }
-a.ansbut:focus {
-background: #c7c7c7;
+.ansbut:focus {
 }
-div.ansbut {
+div.ansbuttxt {
   position: relative; top: 25%;
 }
 
@@ -283,7 +297,7 @@ margin: 0px;
 
 #easebuts {
   bottom: 1em;
-  height: 55px;
+  height: 47px;
   left: 50%;
   margin-left: -200px;
   position: fixed;
@@ -446,12 +460,12 @@ div#filler {
 <center>
 %s
 <p>
-<a class=but id=ov href=ov>%s</a>
-<a class=but href=dlist>%s</a>
+%s %s
 <script>$("#ov").focus();</script>
 </center>""" % (self.mw.deck.sched.finishedMsg(),
-                _("Overview"),
-                _("Deck List"))
+                self.mw.button(key="o", name=_("Overview"), link="ov", id='ov'),
+                self.mw.button(key="o", name=_("Deck List"), link="dlist"))
+
         self.web.stdHtml(buf, css=self.mw.sharedCSS)
         runHook('deckFinished')
 

aqt/webview.py

@@ -84,13 +84,6 @@ class AnkiWebView(QWebView):
 <html><head><style>%s</style>
 <script src="qrc:/jquery.min.js"></script>
 <script src="qrc:/jquery.flot.min.js"></script>
-<script>
-$(document).keydown(function(e) {
-    if(e.which==32 && document.activeElement.nodeName == "A") {
-        py.link(document.activeElement.href);
-    }
-});
-</script>
 </head>
 <body class="%s">%s</body></html>""" % (css, bodyClass, body), loadCB)
         # ensure we're focused