diff --git a/example/sandbox/index.html b/example/sandbox/index.html
index ad13405..8387199 100644
--- a/example/sandbox/index.html
+++ b/example/sandbox/index.html
@@ -5,6 +5,7 @@
index
+
diff --git a/example/sandbox/manifest.json b/example/sandbox/manifest.json
new file mode 100644
index 0000000..2f1271c
--- /dev/null
+++ b/example/sandbox/manifest.json
@@ -0,0 +1,14 @@
+{
+ "short_name": "Quagga Sandbox",
+ "name": "Sandbox for Barcode-Scanning with Quagga",
+ "icons": [
+ {
+ "src": "static/icon.png",
+ "sizes": "192x192",
+ "type": "image/png"
+ }
+ ],
+ "start_url": "index.html",
+ "display": "standalone",
+ "orientation": "portrait"
+}
diff --git a/example/sandbox/src/components/App.js b/example/sandbox/src/components/App.js
index 61eb033..95f9227 100644
--- a/example/sandbox/src/components/App.js
+++ b/example/sandbox/src/components/App.js
@@ -25,9 +25,9 @@ export default class App extends React.Component {
}]
};
+ _handleToggle = () => this.setState({drawerOpen: !this.state.drawerOpen});
_handleClose = () => this.setState({drawerOpen: false});
- _handleOpen = () => this.setState({drawerOpen: true});
- _handleOpenChange = () => (drawerOpen) => this.setState({drawerOpen});
+ _onRequestChange = drawerOpen => this.setState({drawerOpen});
_startScanning = (e) => {
e.preventDefault();
@@ -54,7 +54,7 @@ export default class App extends React.Component {
docked={false}
width={200}
open={this.state.drawerOpen}
- onRequestChange={this._handleOpenChange}
+ onRequestChange={this._onRequestChange}
>
@@ -63,7 +63,7 @@ export default class App extends React.Component {
style={{position: 'fixed', top: '0px'}}
title="QuaggaJS"
iconClassNameRight="muidocs-icon-navigation-expand-more"
- onLeftIconButtonTouchTap={this._handleOpen}
+ onLeftIconButtonTouchTap={this._handleToggle}
/>
- X
-
+
);
}
componentDidMount() {
diff --git a/example/sandbox/static/icon.png b/example/sandbox/static/icon.png
new file mode 100644
index 0000000..ab20e8c
Binary files /dev/null and b/example/sandbox/static/icon.png differ
diff --git a/example/sandbox/static/style.css b/example/sandbox/static/style.css
index bae3638..1f0d324 100644
--- a/example/sandbox/static/style.css
+++ b/example/sandbox/static/style.css
@@ -1,3 +1,16 @@
-video {
+.overlay__content {
+ position: relative;
+}
+
+.overlay__content video, .overlay__content canvas {
+ max-width: 100%;
+}
+
+.overlay__content canvas {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
max-width: 100%;
}