[Examples] Upgrade for the new format

examples/browserify-gulp-example/package.json

@@ -15,7 +15,7 @@
     "babel-preset-react": "^6.3.13",
     "babelify": "^7.2.0",
     "browser-sync": "^2.11.0",
-    "browserify": "^12.0.1",
+    "browserify": "^13.0.0",
     "gulp": "^3.8.10",
     "gulp-notify": "^2.1.0",
     "gulp-util": "^3.0.1",

examples/browserify-gulp-example/src/app/Main.jsx

@@ -0,0 +1,79 @@
+/**
+ * In this file, we create a React component
+ * which incorporates components providedby material-ui.
+ */
+
+import React from 'react';
+import RaisedButton from 'material-ui/lib/raised-button';
+import Dialog from 'material-ui/lib/dialog';
+import Colors from 'material-ui/lib/styles/colors';
+import FlatButton from 'material-ui/lib/flat-button';
+import getMuiTheme from 'material-ui/lib/styles/getMuiTheme';
+import themeDecorator from 'material-ui/lib/styles/theme-decorator';
+
+const styles = {
+  container: {
+    textAlign: 'center',
+    paddingTop: 200,
+  },
+};
+
+const muiTheme = getMuiTheme({
+  accent1Color: Colors.deepOrange500,
+});
+
+class Main extends React.Component {
+  constructor(props, context) {
+    super(props, context);
+    this.handleRequestClose = this.handleRequestClose.bind(this);
+    this.handleTouchTap = this.handleTouchTap.bind(this);
+
+    this.state = {
+      open: false,
+    };
+  }
+
+  handleRequestClose() {
+    this.setState({
+      open: false,
+    });
+  }
+
+  handleTouchTap() {
+    this.setState({
+      open: true,
+    });
+  }
+
+  render() {
+    const standardActions = (
+      <FlatButton
+        label="Okey"
+        secondary={true}
+        onTouchTap={this.handleRequestClose}
+      />
+    );
+
+    return (
+      <div style={styles.container}>
+        <Dialog
+          open={this.state.open}
+          title="Super Secret Password"
+          actions={standardActions}
+          onRequestClose={this.handleRequestClose}
+        >
+          1-2-3-4-5
+        </Dialog>
+        <h1>material-ui</h1>
+        <h2>example project</h2>
+        <RaisedButton
+          label="Super Secret Password"
+          primary={true}
+          onTouchTap={this.handleTouchTap}
+        />
+      </div>
+    );
+  }
+}
+
+export default themeDecorator(muiTheme)(Main);

examples/browserify-gulp-example/src/app/app.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import injectTapEventPlugin from 'react-tap-event-plugin';
-import Main from './components/main'; // Our custom react component
+import Main from './Main'; // Our custom react component
 
 //Needed for onTouchTap
 //Can go away when react 1.0 release

examples/webpack-example/package.json

@@ -21,7 +21,7 @@
     "eslint": "^1.10.3",
     "eslint-loader": "^1.1.1",
     "eslint-plugin-react": "^3.13.1",
-    "html-webpack-plugin": "^1.7.0",
+    "html-webpack-plugin": "^2.7.2",
     "react-hot-loader": "^1.3.0",
     "transfer-webpack-plugin": "^0.1.4",
     "webpack": "^1.12.9",
@@ -30,7 +30,7 @@
   "dependencies": {
     "material-ui": "^0.14.3",
     "react": "^0.14.3",
-    "react-dom":"^0.14.3",
+    "react-dom": "^0.14.3",
     "react-tap-event-plugin": "^0.2.1"
   }
 }

examples/webpack-example/src/app/Main.jsx

@@ -0,0 +1,79 @@
+/**
+ * In this file, we create a React component
+ * which incorporates components providedby material-ui.
+ */
+
+import React from 'react';
+import RaisedButton from 'material-ui/lib/raised-button';
+import Dialog from 'material-ui/lib/dialog';
+import Colors from 'material-ui/lib/styles/colors';
+import FlatButton from 'material-ui/lib/flat-button';
+import getMuiTheme from 'material-ui/lib/styles/getMuiTheme';
+import themeDecorator from 'material-ui/lib/styles/theme-decorator';
+
+const styles = {
+  container: {
+    textAlign: 'center',
+    paddingTop: 200,
+  },
+};
+
+const muiTheme = getMuiTheme({
+  accent1Color: Colors.deepOrange500,
+});
+
+class Main extends React.Component {
+  constructor(props, context) {
+    super(props, context);
+    this.handleRequestClose = this.handleRequestClose.bind(this);
+    this.handleTouchTap = this.handleTouchTap.bind(this);
+
+    this.state = {
+      open: false,
+    };
+  }
+
+  handleRequestClose() {
+    this.setState({
+      open: false,
+    });
+  }
+
+  handleTouchTap() {
+    this.setState({
+      open: true,
+    });
+  }
+
+  render() {
+    const standardActions = (
+      <FlatButton
+        label="Okey"
+        secondary={true}
+        onTouchTap={this.handleRequestClose}
+      />
+    );
+
+    return (
+      <div style={styles.container}>
+        <Dialog
+          open={this.state.open}
+          title="Super Secret Password"
+          actions={standardActions}
+          onRequestClose={this.handleRequestClose}
+        >
+          1-2-3-4-5
+        </Dialog>
+        <h1>material-ui</h1>
+        <h2>example project</h2>
+        <RaisedButton
+          label="Super Secret Password"
+          primary={true}
+          onTouchTap={this.handleTouchTap}
+        />
+      </div>
+    );
+  }
+}
+
+export default themeDecorator(muiTheme)(Main);

examples/webpack-example/src/app/app.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import injectTapEventPlugin from 'react-tap-event-plugin';
-import Main from './components/main'; // Our custom react component
+import Main from './Main'; // Our custom react component
 
 //Needed for onTouchTap
 //Can go away when react 1.0 release