Bump material-ui version

package.json

@@ -14,7 +14,7 @@
     "crypto-browserify": "^3.12.0",
     "history": "2.0.1",
     "html-webpack-plugin": "^5.6.0",
-    "material-ui": "^0.16.6",
+    "material-ui": "^0.20.2",
     "nosleep": "bhspitmonkey/NoSleep.js",
     "probability-distributions": "^0.9.1",
     "prop-types": "^15.8.1",
@@ -33,7 +33,7 @@
     "webpack-dev-server": "^5.0.2"
   },
   "scripts": {
-    "build": "npm run make-dist",
+    "build": "tsc && npm run make-dist",
     "clean": "rm -rf build",
     "start": "webpack serve --mode=development",
     "make-dist": "rm -rf build && webpack --mode=production --progress && cp -r manifest.json css img build && cd build && sw-precache"

src/application.tsx

@@ -160,7 +160,7 @@ class Application extends React.Component {
           title={this.state.appBarTitle}
           iconElementLeft={this.state.appBarLeftElement}
           iconElementRight={this.state.appBarRightElement}
-          onLeftIconButtonTouchTap={this.toggleDrawer}
+          onLeftIconButtonClick={this.toggleDrawer}
           style={{position: "fixed", top: 0, left: 0}}
         />
         <Drawer
@@ -170,7 +170,7 @@ class Application extends React.Component {
           {
             Object.keys(this.menuItems).map(function (text) {
               let item = this.menuItems[text];
-              return <MenuItem onTouchTap={this.drawerMenuItemTouched} key={text} leftIcon={item.icon}>{text}</MenuItem>
+              return <MenuItem onClick={this.drawerMenuItemTouched} key={text} leftIcon={item.icon}>{text}</MenuItem>
             }.bind(this))
           }
         </Drawer>

src/common/practice-intro.tsx

@@ -95,7 +95,7 @@ class PracticeIntro extends React.Component {
     this.setState({started: true});
     this.context.appbar(
       this.props.title,
-      <IconButton onTouchTap={this.end}><NavigationBackIcon /></IconButton>
+      <IconButton onClick={this.end}><NavigationBackIcon /></IconButton>
     );
   }
 
@@ -107,7 +107,7 @@ class PracticeIntro extends React.Component {
     this.context.appbar(
       this.props.title,
       null,
-      <FlatButton label="Start" onTouchTap={this.start} />
+      <FlatButton label="Start" onClick={this.start} />
     );
   }
 

src/modes/perfect-pitch-practice.tsx

@@ -216,12 +216,12 @@ export default class PerfectPitchPractice extends React.Component {
         <CardTitle title="What note is being played?" />
         <CardText>
           <div style={{textAlign: "center"}}>
-            <FloatingActionButton onTouchTap={this.playSound} style={{textAlign: "center", margin: "20px auto 40px"}}>
+            <FloatingActionButton onClick={this.playSound} style={{textAlign: "center", margin: "20px auto 40px"}}>
               <PlayArrow />
             </FloatingActionButton>
           </div>
           <KeyboardButtons onEntry={this.handleGuess} style={{margin: "10px auto"}} showLabels={this.props.prefs["keyboardLabels"]} enableSound={false} />
-          <FlatButton label="Next" onTouchTap={this.newQuestion} style={{display: "block", margin: "40px auto 20px"}} />
+          <FlatButton label="Next" onClick={this.newQuestion} style={{display: "block", margin: "40px auto 20px"}} />
         </CardText>
       </Card>
     )

src/modes/sight-reading-practice.tsx

@@ -500,7 +500,7 @@ export default class SightReadingPractice extends React.Component {
           />
           <FlatButton
             label="Skip"
-            onTouchTap={this.newQuestion}
+            onClick={this.newQuestion}
             style={{display: "block", margin: "40px auto 20px"}}
           />
         </CardText>