Skip to content

Commit 91221cf

Browse files
KeillionKeillion
committed
fix nextjs
1 parent cbaabb6 commit 91221cf

24 files changed

+133
-590
lines changed

‎1.hello-world/7.read-video-nextjs/.eslintrc.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

‎1.hello-world/7.read-video-nextjs/.gitignore

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
/node_modules
55
/.pnp
66
.pnp.js
7+
.yarn/install-state.gz
78

89
# testing
910
/coverage
@@ -23,7 +24,6 @@
2324
npm-debug.log*
2425
yarn-debug.log*
2526
yarn-error.log*
26-
.pnpm-debug.log*
2727

2828
# local env files
2929
.env*.local
@@ -34,3 +34,5 @@ yarn-error.log*
3434
# typescript
3535
*.tsbuildinfo
3636
next-env.d.ts
37+
38+
package-lock.json

‎1.hello-world/7.read-video-nextjs/README.md

Lines changed: 22 additions & 349 deletions
Large diffs are not rendered by default.

‎1.hello-world/7.read-video-nextjs/public/favicon.ico renamed to ‎1.hello-world/7.read-video-nextjs/app/favicon.ico

File renamed without changes.

‎1.hello-world/7.read-video-nextjs/styles/globals.css renamed to ‎1.hello-world/7.read-video-nextjs/app/globals.css

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
/* :root {
1+
:root {
22
--max-width: 1100px;
33
--border-radius: 12px;
4-
--font-mono: ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono',
5-
'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro',
6-
'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace;
4+
--font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono",
5+
"Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro",
6+
"Fira Mono", "Droid Sans Mono", "Courier New", monospace;
77

88
--foreground-rgb: 0, 0, 0;
99
--background-start-rgb: 214, 219, 220;
@@ -104,4 +104,4 @@ a {
104104
html {
105105
color-scheme: dark;
106106
}
107-
} */
107+
}

‎1.hello-world/7.read-video-nextjs/app/layout.tsx

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import type { Metadata } from "next";
2+
import { Inter } from "next/font/google";
3+
import "./globals.css";
4+
5+
const inter = Inter({ subsets: ["latin"] });
6+
7+
export const metadata: Metadata = {
8+
title: "Create Next App",
9+
description: "Generated by create next app",
10+
};
11+
12+
export default function RootLayout({
13+
children,
14+
}: Readonly<{
15+
children: React.ReactNode;
16+
}>) {
17+
return (
18+
<html lang="en">
19+
<body className={inter.className}>{children}</body>
20+
</html>
21+
);
22+
}

‎1.hello-world/7.read-video-nextjs/styles/Home.module.css renamed to ‎1.hello-world/7.read-video-nextjs/app/page.module.css

Lines changed: 5 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -42,8 +42,8 @@
4242
.grid {
4343
display: grid;
4444
grid-template-columns: repeat(4, minmax(25%, auto));
45-
width: var(--max-width);
4645
max-width: 100%;
46+
width: var(--max-width);
4747
}
4848

4949
.card {
@@ -70,6 +70,7 @@
7070
font-size: 0.9rem;
7171
line-height: 1.5;
7272
max-width: 30ch;
73+
text-wrap: balance;
7374
}
7475

7576
.center {
@@ -97,60 +98,16 @@
9798

9899
.center::before,
99100
.center::after {
100-
content: '';
101+
content: "";
101102
left: 50%;
102103
position: absolute;
103104
filter: blur(45px);
104105
transform: translateZ(0);
105106
}
106107

107-
.logo,
108-
.thirteen {
108+
.logo {
109109
position: relative;
110110
}
111-
112-
.thirteen {
113-
display: flex;
114-
justify-content: center;
115-
align-items: center;
116-
width: 75px;
117-
height: 75px;
118-
padding: 25px 10px;
119-
margin-left: 16px;
120-
transform: translateZ(0);
121-
border-radius: var(--border-radius);
122-
overflow: hidden;
123-
box-shadow: 0px 2px 8px -1px #0000001a;
124-
}
125-
126-
.thirteen::before,
127-
.thirteen::after {
128-
content: '';
129-
position: absolute;
130-
z-index: -1;
131-
}
132-
133-
/* Conic Gradient Animation */
134-
.thirteen::before {
135-
animation: 6s rotate linear infinite;
136-
width: 200%;
137-
height: 200%;
138-
background: var(--tile-border);
139-
}
140-
141-
/* Inner Square */
142-
.thirteen::after {
143-
inset: 0;
144-
padding: 1px;
145-
border-radius: var(--border-radius);
146-
background: linear-gradient(
147-
to bottom right,
148-
rgba(var(--tile-start-rgb), 1),
149-
rgba(var(--tile-end-rgb), 1)
150-
);
151-
background-clip: content-box;
152-
}
153-
154111
/* Enable hover only on non-touch devices */
155112
@media (hover: hover) and (pointer: fine) {
156113
.card:hover {
@@ -164,10 +121,6 @@
164121
}
165122

166123
@media (prefers-reduced-motion) {
167-
.thirteen::before {
168-
animation: none;
169-
}
170-
171124
.card:hover span {
172125
transform: none;
173126
}
@@ -262,8 +215,7 @@
262215
filter: invert(1);
263216
}
264217

265-
.logo,
266-
.thirteen img {
218+
.logo {
267219
filter: invert(1) drop-shadow(0 0 0.3rem #ffffff70);
268220
}
269221
}
@@ -276,10 +228,3 @@
276228
transform: rotate(0deg);
277229
}
278230
}
279-
280-
.UIElement {
281-
margin: 2vmin auto;
282-
text-align: center;
283-
font-size: medium;
284-
width: 80vw;
285-
}

‎1.hello-world/7.read-video-nextjs/app/page.tsx

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
"use client";
2+
3+
import styles from "./page.module.css";
4+
import VideoDecode from '@/component/VideoDecode';
5+
import ImgDecode from '@/component/ImgDecode';
6+
import { useState } from 'react'
7+
8+
9+
export default function Home() {
10+
const [bShowScanner, setBShowScanner] = useState(true);
11+
const [bShowImgDecode, setBShowImgDecode] = useState(false);
12+
13+
return (<div className={styles.helloWorld}>
14+
<h1 className={styles.header}>Hello World for Next.js</h1>
15+
<div>
16+
<button className={styles.button} style={{ marginRight: '10px', backgroundColor: bShowScanner ? 'rgb(255,174,55)' : 'white' }}
17+
onClick={()=>{
18+
setBShowScanner(true);
19+
setBShowImgDecode(false);
20+
}}
21+
>Video Decode</button>
22+
<button className={styles.button} style={{ backgroundColor: bShowImgDecode ? 'rgb(255,174,55)' : 'white' }}
23+
onClick={()=>{
24+
setBShowScanner(false);
25+
setBShowImgDecode(true);
26+
}}
27+
>Image Decode</button>
28+
</div>
29+
<div className={styles.container}>
30+
{bShowScanner && <VideoDecode></VideoDecode>}
31+
{bShowImgDecode && <ImgDecode></ImgDecode>}
32+
</div>
33+
</div>
34+
);
35+
}

‎1.hello-world/7.read-video-nextjs/styles/ImgDecode.module.css renamed to ‎1.hello-world/7.read-video-nextjs/component/ImgDecode.module.css

File renamed without changes.

‎1.hello-world/7.read-video-nextjs/components/ImgDecode.tsx renamed to ‎1.hello-world/7.read-video-nextjs/component/ImgDecode.tsx

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,26 @@
11
import React, { ChangeEvent, Component } from 'react'
22
import { BarcodeReader } from "dynamsoft-javascript-barcode";
3-
import styles from '@/styles/ImgDecode.module.css'
3+
import "@/lib/dbr"; // import side effects. The license, engineResourcePath, so on.
4+
import styles from './ImgDecode.module.css'
45

56
export default class ImgDecode extends Component {
6-
pReader: Promise<BarcodeReader> = BarcodeReader.createInstance();
7+
pReader: Promise<BarcodeReader>|null = null;
8+
9+
async componentDidMount() {
10+
this.pReader = BarcodeReader.createInstance();
11+
}
712

813
decodeImg = async (e: ChangeEvent<HTMLInputElement>) => {
914
try {
10-
const reader = await this.pReader;
15+
const reader = (await this.pReader)!;
1116
let results = await reader.decode(e.target.files![0]);
1217
for (let result of results) {
1318
alert(result.barcodeText);
1419
}
1520
if (!results.length) { alert('No barcode found'); }
1621
} catch (ex: any) {
17-
if (ex.message.indexOf("network connection error")) {
18-
let customMsg = "Failed to connect to Dynamsoft License Server: network connection error. Check your Internet connection or contact Dynamsoft Support ([email protected]) to acquire an offline license.";
19-
console.log(customMsg);
20-
alert(customMsg);
21-
}
22+
console.error(ex);
23+
alert(ex?.message);
2224
throw ex;
2325
}
2426
e.target.value = '';

‎1.hello-world/7.read-video-nextjs/styles/VideoDecode.module.css renamed to ‎1.hello-world/7.read-video-nextjs/component/VideoDecode.module.css

File renamed without changes.

‎1.hello-world/7.read-video-nextjs/components/VideoDecode.tsx renamed to ‎1.hello-world/7.read-video-nextjs/component/VideoDecode.tsx

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { BarcodeScanner } from "dynamsoft-javascript-barcode";
2+
import "@/lib/dbr"; // import side effects. The license, engineResourcePath, so on.
23
import React from 'react';
3-
import styles from '@/styles/VideoDecode.module.css'
4+
import styles from './VideoDecode.module.css'
45

56
class VideoDecode extends React.Component {
67
pScanner: Promise<BarcodeScanner>|null = null;
@@ -23,11 +24,8 @@ class VideoDecode extends React.Component {
2324
}
2425
await scanner.open();
2526
} catch (ex: any) {
26-
if (ex.message.indexOf("network connection error")) {
27-
let customMsg = "Failed to connect to Dynamsoft License Server: network connection error. Check your Internet connection or contact Dynamsoft Support ([email protected]) to acquire an offline license.";
28-
console.log(customMsg);
29-
alert(customMsg);
30-
}
27+
console.error(ex);
28+
alert(ex?.message);
3129
throw ex;
3230
}
3331
}

‎1.hello-world/7.read-video-nextjs/components/HelloWorld.tsx

Lines changed: 0 additions & 62 deletions
This file was deleted.

‎1.hello-world/7.read-video-nextjs/dbr.ts renamed to ‎1.hello-world/7.read-video-nextjs/lib/dbr.ts

File renamed without changes.

‎1.hello-world/7.read-video-nextjs/next.config.js

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎1.hello-world/7.read-video-nextjs/next.config.mjs

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
/** @type {import('next').NextConfig} */
2+
const nextConfig = {};
3+
4+
export default nextConfig;

‎1.hello-world/7.read-video-nextjs/package.json

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,17 @@
99
"lint": "next lint"
1010
},
1111
"dependencies": {
12-
"@types/node": "18.15.3",
13-
"@types/react": "18.0.28",
14-
"@types/react-dom": "18.0.11",
15-
"dynamsoft-javascript-barcode": "9.6.42",
16-
"next": "13.2.4",
17-
"react": "18.2.0",
18-
"react-dom": "18.2.0",
19-
"typescript": "4.9.5"
12+
"react": "^18",
13+
"react-dom": "^18",
14+
"next": "14.2.3",
15+
"dynamsoft-javascript-barcode": "9.6.42"
16+
},
17+
"devDependencies": {
18+
"typescript": "^5",
19+
"@types/node": "^20",
20+
"@types/react": "^18",
21+
"@types/react-dom": "^18",
22+
"eslint": "^8",
23+
"eslint-config-next": "14.2.3"
2024
}
2125
}

‎1.hello-world/7.read-video-nextjs/pages/_app.tsx

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎1.hello-world/7.read-video-nextjs/pages/_document.tsx

Lines changed: 0 additions & 13 deletions
This file was deleted.

0 commit comments

Comments
 (0)