Skip to content

Commit ca85ac5

Browse files
Justin-dynamsoftJustin-dynamsoft
committed
Add Google Tag Manager integration and update license key across multiple HTML files
- Integrated Google Tag Manager (GTM) by adding noscript and script tags to enable tracking. - Updated the Dynamsoft license key in various scenarios to ensure continued functionality.
1 parent 541b1d0 commit ca85ac5

23 files changed

Lines changed: 666 additions & 22 deletions

File tree

‎basics/hello-world.html‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,34 @@
1616
</head>
1717

1818
<body>
19+
<noscript>
20+
<iframe
21+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
22+
height="0"
23+
width="0"
24+
style="display: none; visibility: hidden"
25+
></iframe>
26+
</noscript>
27+
<script>
28+
if (!navigator.webdriver) {
29+
setTimeout(() => {
30+
(function (w, d, s, l, i) {
31+
w[l] = w[l] || [];
32+
w[l].push({
33+
"gtm.start": new Date().getTime(),
34+
event: "gtm.js",
35+
});
36+
var f = d.getElementsByTagName(s)[0],
37+
j = d.createElement(s),
38+
dl = l != "dataLayer" ? "&l=" + l : "";
39+
40+
j.async = true;
41+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
42+
f.parentNode.insertBefore(j, f);
43+
})(window, document, "script", "dataLayer", "GTM-538F83");
44+
}, 0);
45+
}
46+
</script>
1947
<h1 class="barcode-scanner-title">
2048
Hello World (Scan Barcode via Camera)
2149
</h1>
@@ -42,7 +70,7 @@ <h1 class="barcode-scanner-title">
4270
* For more information, see https://www.dynamsoft.com/barcode-reader/docs/web/programming/javascript/user-guide/index.html#license&utm_source=samples or contact support@dynamsoft.com.
4371
* LICENSE ALERT - THE END
4472
*/
45-
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");
73+
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAwLWRicl9qc19zYW1wbGVzIiwib3JnYW5pemF0aW9uSUQiOiIyMDAwMDAifQ==");
4674
(async () => {
4775
const cameraView = await Dynamsoft.DCE.CameraView.createInstance();
4876
const cameraEnhancer = await Dynamsoft.DCE.CameraEnhancer.createInstance(cameraView);

‎basics/read-an-image.html‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,34 @@
1515
</head>
1616

1717
<body>
18+
<noscript>
19+
<iframe
20+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
21+
height="0"
22+
width="0"
23+
style="display: none; visibility: hidden"
24+
></iframe>
25+
</noscript>
26+
<script>
27+
if (!navigator.webdriver) {
28+
setTimeout(() => {
29+
(function (w, d, s, l, i) {
30+
w[l] = w[l] || [];
31+
w[l].push({
32+
"gtm.start": new Date().getTime(),
33+
event: "gtm.js",
34+
});
35+
var f = d.getElementsByTagName(s)[0],
36+
j = d.createElement(s),
37+
dl = l != "dataLayer" ? "&l=" + l : "";
38+
39+
j.async = true;
40+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
41+
f.parentNode.insertBefore(j, f);
42+
})(window, document, "script", "dataLayer", "GTM-538F83");
43+
}, 0);
44+
}
45+
</script>
1846
<h1>Hello World (Read an Image)</h1>
1947
<input id="input-file" type="file" accept=".jpg,.jpeg,.icon,.gif,.svg,.webp,.png,.bmp" />
2048
<span id="decoding" style="display: none;">Decoding...</span>
@@ -30,7 +58,7 @@ <h1>Hello World (Read an Image)</h1>
3058
* For more information, see https://www.dynamsoft.com/barcode-reader/docs/web/programming/javascript/user-guide/index.html#license&utm_source=samples or contact support@dynamsoft.com.
3159
* LICENSE ALERT - THE END
3260
*/
33-
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");
61+
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAwLWRicl9qc19zYW1wbGVzIiwib3JnYW5pemF0aW9uSUQiOiIyMDAwMDAifQ==");
3462

3563
const resultsContainer = document.querySelector("#results");
3664
const pInit = (async () => {

‎basics/scan-a-single-barcode.html‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,34 @@
1616
</head>
1717

1818
<body>
19+
<noscript>
20+
<iframe
21+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
22+
height="0"
23+
width="0"
24+
style="display: none; visibility: hidden"
25+
></iframe>
26+
</noscript>
27+
<script>
28+
if (!navigator.webdriver) {
29+
setTimeout(() => {
30+
(function (w, d, s, l, i) {
31+
w[l] = w[l] || [];
32+
w[l].push({
33+
"gtm.start": new Date().getTime(),
34+
event: "gtm.js",
35+
});
36+
var f = d.getElementsByTagName(s)[0],
37+
j = d.createElement(s),
38+
dl = l != "dataLayer" ? "&l=" + l : "";
39+
40+
j.async = true;
41+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
42+
f.parentNode.insertBefore(j, f);
43+
})(window, document, "script", "dataLayer", "GTM-538F83");
44+
}, 0);
45+
}
46+
</script>
1947
<h1 class="barcode-scanner-title">
2048
Hello World (Scan One Single Barcode via Camera)
2149
</h1>
@@ -40,7 +68,7 @@ <h1 class="barcode-scanner-title">
4068
* For more information, see https://www.dynamsoft.com/barcode-reader/docs/web/programming/javascript/user-guide/index.html#license&utm_source=samples or contact support@dynamsoft.com.
4169
* LICENSE ALERT - THE END
4270
*/
43-
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");
71+
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAwLWRicl9qc19zYW1wbGVzIiwib3JnYW5pemF0aW9uSUQiOiIyMDAwMDAifQ==");
4472
const pInit = (async () => {
4573
const cameraView = await Dynamsoft.DCE.CameraView.createInstance();
4674
const cameraEnhancer = await Dynamsoft.DCE.CameraEnhancer.createInstance(cameraView);

‎index.html‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,34 @@
1313
</head>
1414

1515
<body>
16+
<noscript>
17+
<iframe
18+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
19+
height="0"
20+
width="0"
21+
style="display: none; visibility: hidden"
22+
></iframe>
23+
</noscript>
24+
<script>
25+
if (!navigator.webdriver) {
26+
setTimeout(() => {
27+
(function (w, d, s, l, i) {
28+
w[l] = w[l] || [];
29+
w[l].push({
30+
"gtm.start": new Date().getTime(),
31+
event: "gtm.js",
32+
});
33+
var f = d.getElementsByTagName(s)[0],
34+
j = d.createElement(s),
35+
dl = l != "dataLayer" ? "&l=" + l : "";
36+
37+
j.async = true;
38+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
39+
f.parentNode.insertBefore(j, f);
40+
})(window, document, "script", "dataLayer", "GTM-538F83");
41+
}, 0);
42+
}
43+
</script>
1644
<!-- This is a sample routing page. SDK users do not need to study this html. -->
1745
<style>
1846
body {

‎scenarios/batch-inventory/index.html‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,34 @@
1313
</head>
1414

1515
<body>
16+
<noscript>
17+
<iframe
18+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
19+
height="0"
20+
width="0"
21+
style="display: none; visibility: hidden"
22+
></iframe>
23+
</noscript>
24+
<script>
25+
if (!navigator.webdriver) {
26+
setTimeout(() => {
27+
(function (w, d, s, l, i) {
28+
w[l] = w[l] || [];
29+
w[l].push({
30+
"gtm.start": new Date().getTime(),
31+
event: "gtm.js",
32+
});
33+
var f = d.getElementsByTagName(s)[0],
34+
j = d.createElement(s),
35+
dl = l != "dataLayer" ? "&l=" + l : "";
36+
37+
j.async = true;
38+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
39+
f.parentNode.insertBefore(j, f);
40+
})(window, document, "script", "dataLayer", "GTM-538F83");
41+
}, 0);
42+
}
43+
</script>
1644
<div class="barcode-reader-view">
1745
<div class="scanner-view">
1846
<div class="loading-view">
@@ -74,7 +102,7 @@
74102
let totalUniqueBarcodesCount = 0;
75103
let startTime;
76104

77-
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");
105+
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAwLWRicl9qc19zYW1wbGVzIiwib3JnYW5pemF0aW9uSUQiOiIyMDAwMDAifQ==");
78106
const pInit = (async () => {
79107
const cameraView = await Dynamsoft.DCE.CameraView.createInstance();
80108
const cameraEnhancer = await Dynamsoft.DCE.CameraEnhancer.createInstance(cameraView);

‎scenarios/cart-builder/index.html‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,34 @@
1414
</head>
1515

1616
<body>
17+
<noscript>
18+
<iframe
19+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
20+
height="0"
21+
width="0"
22+
style="display: none; visibility: hidden"
23+
></iframe>
24+
</noscript>
25+
<script>
26+
if (!navigator.webdriver) {
27+
setTimeout(() => {
28+
(function (w, d, s, l, i) {
29+
w[l] = w[l] || [];
30+
w[l].push({
31+
"gtm.start": new Date().getTime(),
32+
event: "gtm.js",
33+
});
34+
var f = d.getElementsByTagName(s)[0],
35+
j = d.createElement(s),
36+
dl = l != "dataLayer" ? "&l=" + l : "";
37+
38+
j.async = true;
39+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
40+
f.parentNode.insertBefore(j, f);
41+
})(window, document, "script", "dataLayer", "GTM-538F83");
42+
}, 0);
43+
}
44+
</script>
1745
<header>
1846
<h1>🛒 Scan Barcode to Add Items to Cart</h1>
1947
</header>
@@ -52,7 +80,7 @@ <h2>Simulated Shopping Cart</h2>
5280
<script>
5381
const dragDiv = document.querySelector(".floatingDiv");
5482

55-
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");
83+
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAwLWRicl9qc19zYW1wbGVzIiwib3JnYW5pemF0aW9uSUQiOiIyMDAwMDAifQ==");
5684

5785
const pInit = (async () => {
5886
const cameraView = await Dynamsoft.DCE.CameraView.createInstance();

‎scenarios/debug/public/index.html‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,34 @@
1010
</head>
1111

1212
<body>
13+
<noscript>
14+
<iframe
15+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
16+
height="0"
17+
width="0"
18+
style="display: none; visibility: hidden"
19+
></iframe>
20+
</noscript>
21+
<script>
22+
if (!navigator.webdriver) {
23+
setTimeout(() => {
24+
(function (w, d, s, l, i) {
25+
w[l] = w[l] || [];
26+
w[l].push({
27+
"gtm.start": new Date().getTime(),
28+
event: "gtm.js",
29+
});
30+
var f = d.getElementsByTagName(s)[0],
31+
j = d.createElement(s),
32+
dl = l != "dataLayer" ? "&l=" + l : "";
33+
34+
j.async = true;
35+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
36+
f.parentNode.insertBefore(j, f);
37+
})(window, document, "script", "dataLayer", "GTM-538F83");
38+
}, 0);
39+
}
40+
</script>
1341
<h1 style="font-size: 1.5em">Read Barcodes from Camera - Debug</h1>
1442
<button id="btn-start-capturing">start capturing</button>
1543
<button id="btn-stop-capturing">stop capturing</button>
@@ -36,7 +64,7 @@ <h1 style="font-size: 1.5em">Read Barcodes from Camera - Debug</h1>
3664
* To use the library, you need to first specify a license key using the API "initLicense()" as shown below.
3765
*/
3866

39-
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");
67+
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAwLWRicl9qc19zYW1wbGVzIiwib3JnYW5pemF0aW9uSUQiOiIyMDAwMDAifQ==");
4068

4169
/**
4270
* You can visit https://www.dynamsoft.com/customer/license/trialLicense?utm_source=samples&product=dbr&package=js to get your own trial license good for 30 days.

‎scenarios/locate-an-item-with-barcode/index.html‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,34 @@
1515
</head>
1616

1717
<body>
18+
<noscript>
19+
<iframe
20+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
21+
height="0"
22+
width="0"
23+
style="display: none; visibility: hidden"
24+
></iframe>
25+
</noscript>
26+
<script>
27+
if (!navigator.webdriver) {
28+
setTimeout(() => {
29+
(function (w, d, s, l, i) {
30+
w[l] = w[l] || [];
31+
w[l].push({
32+
"gtm.start": new Date().getTime(),
33+
event: "gtm.js",
34+
});
35+
var f = d.getElementsByTagName(s)[0],
36+
j = d.createElement(s),
37+
dl = l != "dataLayer" ? "&l=" + l : "";
38+
39+
j.async = true;
40+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
41+
f.parentNode.insertBefore(j, f);
42+
})(window, document, "script", "dataLayer", "GTM-538F83");
43+
}, 0);
44+
}
45+
</script>
1846
<!-- Container to retrieve user input -->
1947
<div id="inputs-container">
2048
<div style="border-bottom: 2px solid #fe8e14; padding: 0 2rem">
@@ -87,7 +115,7 @@ <h6 id="camera-switch-notification"></h6>
87115
/** LICENSE ALERT - README
88116
* To use the library, you need to first specify a license key using the API "initLicense()" as shown below.
89117
*/
90-
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");
118+
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAwLWRicl9qc19zYW1wbGVzIiwib3JnYW5pemF0aW9uSUQiOiIyMDAwMDAifQ==");
91119
/**
92120
* You can visit https://www.dynamsoft.com/customer/license/trialLicense?utm_source=samples&product=dbr&package=js to get your own trial license good for 30 days.
93121
* Note that if you downloaded this sample from Dynamsoft while logged in, the above license key may already be your own 30-day trial license.

‎scenarios/pick-one-to-fill/index.html‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,34 @@
1313
</head>
1414

1515
<body>
16+
<noscript>
17+
<iframe
18+
src="https://www.googletagmanager.com/ns.html?id=GTM-538F83"
19+
height="0"
20+
width="0"
21+
style="display: none; visibility: hidden"
22+
></iframe>
23+
</noscript>
24+
<script>
25+
if (!navigator.webdriver) {
26+
setTimeout(() => {
27+
(function (w, d, s, l, i) {
28+
w[l] = w[l] || [];
29+
w[l].push({
30+
"gtm.start": new Date().getTime(),
31+
event: "gtm.js",
32+
});
33+
var f = d.getElementsByTagName(s)[0],
34+
j = d.createElement(s),
35+
dl = l != "dataLayer" ? "&l=" + l : "";
36+
37+
j.async = true;
38+
j.src = "//www.googletagmanager.com/gtm.js?id=" + i + dl;
39+
f.parentNode.insertBefore(j, f);
40+
})(window, document, "script", "dataLayer", "GTM-538F83");
41+
}, 0);
42+
}
43+
</script>
1644
<div class="container">
1745
<!-- This div will host the barcode scanner's camera view -->
1846
<div class="barcode-scanner-view"></div>
@@ -58,7 +86,7 @@
5886
const scanBtns = document.querySelectorAll(".open-btn");
5987
const decodeBtns = document.querySelectorAll(".decode-btn");
6088

61-
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");
89+
Dynamsoft.License.LicenseManager.initLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAwLWRicl9qc19zYW1wbGVzIiwib3JnYW5pemF0aW9uSUQiOiIyMDAwMDAifQ==");
6290
const pInit = (async () => {
6391
const cameraView = await Dynamsoft.DCE.CameraView.createInstance();
6492
const cameraEnhancer = await Dynamsoft.DCE.CameraEnhancer.createInstance(cameraView);

0 commit comments

Comments
 (0)