From 0b1f1dc3bd55ad1998792423568d635a4b31745c Mon Sep 17 00:00:00 2001 From: Christoph Oberhofer Date: Sat, 25 Jun 2016 00:33:47 +0200 Subject: [PATCH] Fixed drawer; added manifest file --- example/sandbox/index.html | 1 + example/sandbox/manifest.json | 14 ++++++++++++++ example/sandbox/src/components/App.js | 8 ++++---- example/sandbox/src/components/Scanner.js | 4 +--- example/sandbox/static/icon.png | Bin 0 -> 6022 bytes example/sandbox/static/style.css | 15 ++++++++++++++- 6 files changed, 34 insertions(+), 8 deletions(-) create mode 100644 example/sandbox/manifest.json create mode 100644 example/sandbox/static/icon.png 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} > Menu Item Menu Item 2 @@ -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 0000000000000000000000000000000000000000..ab20e8c75e49b888bd84fa307acf5ec11c1590ab GIT binary patch literal 6022 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 A;s5{u literal 0 HcmV?d00001 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%; }