Skip to content

Commit 07dd295

Browse files
committed
smaller H1 and add vue 3 dist pages
1 parent c7eb758 commit 07dd295

20 files changed

+113
-95
lines changed

1.hello-world/1.minimum-code.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
</head>
1717

1818
<body>
19-
<h1>Read Barcodes from a Camera</h1>
19+
<h1 style="font-size: 1.5em;">Read Barcodes from a Camera</h1>
2020
<button id="btn-show-scanner">Show Barcode Scanner</button>
2121
<script>
2222
/** LICENSE ALERT - README

1.hello-world/10.read-video-pwa/helloworld-pwa.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
</head>
1313

1414
<body>
15-
<h1>Hello World for PWA</h1>
15+
<h1 style="font-size: 1.5em;">Hello World for PWA</h1>
1616
<button id='readBarcode'>Read Barcode via Camera</button>
1717
<script>
1818
/** LICENSE ALERT - README

1.hello-world/11.read-video-requirejs.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
</head>
1010

1111
<body>
12-
<h1>Hello World for RequireJS</h1>
12+
<h1 style="font-size: 1.5em;">Hello World for RequireJS</h1>
1313
<button id="readBarcode">show scanner</button>
1414
<script src="https://cdn.jsdelivr.net/npm/[email protected]/require.js"></script>
1515
<script>

1.hello-world/12.read-video-webpack/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
</head>
1010

1111
<body>
12-
<h1>Hello World - Webpack</h1>
12+
<h1 style="font-size: 1.5em;">Hello World - Webpack</h1>
1313
<button id="readBarcode">show scanner</button>
1414
<script src="./dist/bundle.js"></script>
1515
</body>

1.hello-world/2.read-an-image.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
</head>
1717

1818
<body>
19-
<h1>Read Barcode from Images</h1>
19+
<h1 style="font-size: 1.5em;">Read Barcode from Images</h1>
2020
<input id="ipt-file" type="file" style="margin-bottom: 2vh;" accept="image/png,image/jpeg,image/bmp,image/gif">
2121
<input type="text" id="result" title="Double click to clear!" readonly="true" class="latest-result" placeholder="The Last Read Barcode">
2222
<div id="UIElement">

1.hello-world/3.read-video-angular/src/app/hello-world/hello-world.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<div class="helloWorld">
2-
<h1>Hello World for Angular<img style="height: 25px;" alt="logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg=="
2+
<h1 style="font-size: 1.5em;">Hello World for Angular<img style="height: 25px;" alt="logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg=="
33
/>
44
</h1>
55
<input type="text" [value]="resultValue" readonly="true" class="latest-result" placeholder="The Last Read Barcode">

1.hello-world/4.read-video-react/src/components/HelloWorld.js

Lines changed: 94 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -5,84 +5,102 @@ import React from 'react';
55
import BarcodeScanner from './BarcodeScanner';
66

77
class HelloWorld extends React.Component {
8-
constructor(props) {
9-
super(props);
10-
this.refDivMessage = React.createRef();
11-
this.state = {
12-
libLoaded: false,
13-
resultValue: "",
14-
resultItems: [],
15-
bShowScanner: false
16-
};
17-
}
18-
async componentDidMount() {
19-
try {
20-
await DBR.BarcodeScanner.loadWasm();
21-
this.setState(state => {
22-
state.libLoaded = true;
23-
return state;
24-
}, () => {
25-
this.showScanner();
26-
});
27-
} catch (ex) {
28-
alert(ex.message);
29-
throw ex;
8+
constructor(props) {
9+
super(props);
10+
this.refDivMessage = React.createRef();
11+
this.state = {
12+
libLoaded: false,
13+
resultValue: "",
14+
resultItems: [],
15+
bShowScanner: false
16+
};
17+
}
18+
async componentDidMount() {
19+
try {
20+
await DBR.BarcodeScanner.loadWasm();
21+
this.setState(state => {
22+
state.libLoaded = true;
23+
return state;
24+
}, () => {
25+
this.showScanner();
26+
});
27+
} catch (ex) {
28+
alert(ex.message);
29+
throw ex;
30+
}
3031
}
31-
}
3232

33-
scrollToBottom = () => {
34-
this.refDivMessage.current.scrollTop = this.refDivMessage.current.scrollHeight;
35-
}
33+
scrollToBottom = () => {
34+
this.refDivMessage.current.scrollTop = this.refDivMessage.current.scrollHeight;
35+
}
3636

37-
componentDidUpdate() {
38-
this.scrollToBottom();
39-
}
37+
componentDidUpdate() {
38+
this.scrollToBottom();
39+
}
4040

41-
appendMessage = (message) => {
42-
switch (message.type) {
43-
case "result":
44-
this.setState(prevState => {
45-
prevState.resultValue = message.format + ": " + message.text;
46-
prevState.resultItems = prevState.resultItems.concat([{ type: message.format + ": ", text: message.text }]);
47-
return prevState;
48-
});
49-
break;
50-
case "error":
51-
this.setState(prevState => {
52-
prevState.resultValue = message.msg;
53-
prevState.resultItems = prevState.resultItems.concat([{ type: "Error: ", text: message.msg }]);
54-
return prevState;
55-
});
56-
break;
57-
default: break;
41+
appendMessage = (message) => {
42+
switch (message.type) {
43+
case "result":
44+
this.setState(prevState => {
45+
prevState.resultValue = message.format + ": " + message.text;
46+
prevState.resultItems = prevState.resultItems.concat([{ type: message.format + ": ", text: message.text }]);
47+
return prevState;
48+
});
49+
break;
50+
case "error":
51+
this.setState(prevState => {
52+
prevState.resultValue = message.msg;
53+
prevState.resultItems = prevState.resultItems.concat([{ type: "Error: ", text: message.msg }]);
54+
return prevState;
55+
});
56+
break;
57+
default:
58+
break;
59+
}
60+
}
61+
showScanner = () => {
62+
this.setState({
63+
bShowScanner: true
64+
});
5865
}
59-
}
60-
showScanner = () => {
61-
this.setState({
62-
bShowScanner: true
63-
});
64-
}
65-
render() {
66-
return (
67-
<div className="helloWorld">
68-
<h1>Hello World for React<img src={reactLogo} className="App-logo" alt="logo" /></h1>
69-
<input type="text" value={this.state.resultValue} readOnly={true} className="latest-result" placeholder="The Last Read Barcode" />
70-
<div id="UIElement">
71-
{!this.state.libLoaded ? (<span style={{ fontSize: "x-large" }}>Loading Library...</span>) : ""}
72-
{this.state.bShowScanner ? (<BarcodeScanner appendMessage={this.appendMessage}></BarcodeScanner>) : ""}
73-
</div>
74-
<div>
75-
<span style={{ float: "left" }}>All Results:</span><br />
76-
<div id="results" ref={this.refDivMessage}>
77-
<ul>
78-
{this.state.resultItems.map((item, index) => (
79-
<li key={100000 + index} ><span>{item.type}</span><span className="resultText">{item.text}</span> </li>
80-
))}
81-
</ul>
82-
</div>
83-
</div>
84-
</div>
85-
);
86-
}
87-
}
88-
export default HelloWorld;
66+
render() {
67+
return ( <
68+
div className = "helloWorld" >
69+
<
70+
h1 style = "font-size: 1.5em;" > Hello World
71+
for React < img src = { reactLogo }
72+
className = "App-logo"
73+
alt = "logo" / > < /h1> <
74+
input type = "text"
75+
value = { this.state.resultValue }
76+
readOnly = { true }
77+
className = "latest-result"
78+
placeholder = "The Last Read Barcode" / >
79+
<
80+
div id = "UIElement" > {!this.state.libLoaded ? ( < span style = {
81+
{ fontSize: "x-large" }
82+
} > Loading Library... < /span>) : ""} {
83+
this.state.bShowScanner ? ( < BarcodeScanner appendMessage = { this.appendMessage } > < /BarcodeScanner>) : ""} < /
84+
div > <
85+
div >
86+
<
87+
span style = {
88+
{ float: "left" }
89+
} > All Results: < /span><br / >
90+
<
91+
div id = "results"
92+
ref = { this.refDivMessage } >
93+
<
94+
ul > {
95+
this.state.resultItems.map((item, index) => ( <
96+
li key = { 100000 + index } > < span > { item.type } < /span><span className="resultText">{item.text}</span > < /li>
97+
))
98+
} <
99+
/ul> < /
100+
div > <
101+
/div> < /
102+
div >
103+
);
104+
}
105+
}
106+
export default HelloWorld;

1.hello-world/5.read-video-vue/src/components/HelloWorld.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<div class="helloWorld">
3-
<h1>{{ msg }} <img class="applogo" alt="Vue logo" src="../assets/logo.png" /></h1>
3+
<h1 style="font-size: 1.5em;">{{ msg }} <img class="applogo" alt="Vue logo" src="../assets/logo.png" /></h1>
44
<input
55
type="text"
66
v-model="resultValue"

1.hello-world/9.read-video-electron/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
</head>
1313

1414
<body>
15-
<h1>Hello World for Electron</h1>
15+
<h1 style="font-size: 1.5em;">Hello World for Electron</h1>
1616
<button id='readBarcode'>Read Barcode via Camera</button>
1717
<div id="UIElement">
1818
<div id="barcodeScannerUI"></div>

2.ui-tweaking/1.read-video-show-result.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
</head>
1717

1818
<body>
19-
<h1>Use the Default Built-in UI</h1>
19+
<h1 style="font-size: 1.5em;">Use the Default Built-in UI</h1>
2020
<input type="text" id="result" title="Double click to clear!" readonly="true" class="latest-result" placeholder="The Last Read Barcode">
2121
<div id="UIElement">
2222
<span id='lib-load' style='font-size:x-large' hidden>Loading Library...</span><br />

0 commit comments

Comments
 (0)