henine
/
escher
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

add video title

Browse Source
trunk
HeNine 2 years ago
parent e3dd9f3ef8
commit 2b2806457e
5 changed files with 59 additions and 7 deletions
Show Stats Download Patch File Download Diff File

37
web/package-lock.json generated
Unescape Escape View File

@ -14,6 +14,7 @@
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"sass": "^1.54.1",
"web-vitals": "^2.1.4"
},
"devDependencies": {
@ -8689,6 +8690,11 @@
"url": "https://opencollective.com/immer"
}
},
"node_modules/immutable": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.1.0.tgz",
"integrity": "sha512-oNkuqVTA8jqG1Q6c+UglTOD1xhC1BtjKI7XkCXRkZHrN5m18/XsnUp8Q89GkQO/z+0WjonSvl0FLhDYftp46nQ=="
},
"node_modules/import-fresh": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@ -14426,6 +14432,22 @@
"resolved": "https://registry.npmjs.org/sanitize.css/-/sanitize.css-13.0.0.tgz",
"integrity": "sha512-ZRwKbh/eQ6w9vmTjkuG0Ioi3HBwPFce0O+v//ve+aOq1oeCy7jMV2qzzAlpsNuqpqCBjjriM1lbtZbF/Q8jVyA=="
},
"node_modules/sass": {
"version": "1.54.1",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.54.1.tgz",
"integrity": "sha512-GHJJr31Me32RjjUBagyzx8tzjKBUcDwo5239XANIRBq0adDu5iIG0aFO0i/TBb/4I9oyxkEv44nq/kL1DxdDhA==",
"dependencies": {
"chokidar": ">=3.0.0 <4.0.0",
"immutable": "^4.0.0",
"source-map-js": ">=0.6.2 <2.0.0"
},
"bin": {
"sass": "sass.js"
},
"engines": {
"node": ">=12.0.0"
}
},
"node_modules/sass-loader": {
"version": "12.6.0",
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-12.6.0.tgz",
@ -22876,6 +22898,11 @@
"resolved": "https://registry.npmjs.org/immer/-/immer-9.0.15.tgz",
"integrity": "sha512-2eB/sswms9AEUSkOm4SbV5Y7Vmt/bKRwByd52jfLkW4OLYeaTP3EEiJ9agqU0O/tq6Dk62Zfj+TJSqfm1rLVGQ=="
},
"immutable": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.1.0.tgz",
"integrity": "sha512-oNkuqVTA8jqG1Q6c+UglTOD1xhC1BtjKI7XkCXRkZHrN5m18/XsnUp8Q89GkQO/z+0WjonSvl0FLhDYftp46nQ=="
},
"import-fresh": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@ -26836,6 +26863,16 @@
"resolved": "https://registry.npmjs.org/sanitize.css/-/sanitize.css-13.0.0.tgz",
"integrity": "sha512-ZRwKbh/eQ6w9vmTjkuG0Ioi3HBwPFce0O+v//ve+aOq1oeCy7jMV2qzzAlpsNuqpqCBjjriM1lbtZbF/Q8jVyA=="
},
"sass": {
"version": "1.54.1",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.54.1.tgz",
"integrity": "sha512-GHJJr31Me32RjjUBagyzx8tzjKBUcDwo5239XANIRBq0adDu5iIG0aFO0i/TBb/4I9oyxkEv44nq/kL1DxdDhA==",
"requires": {
"chokidar": ">=3.0.0 <4.0.0",
"immutable": "^4.0.0",
"source-map-js": ">=0.6.2 <2.0.0"
}
},
"sass-loader": {
"version": "12.6.0",
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-12.6.0.tgz",

1
web/package.json
Unescape Escape View File

@ -9,6 +9,7 @@
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"sass": "^1.54.1",
"web-vitals": "^2.1.4"
},
"scripts": {

10
web/public/mock/results.json
Unescape Escape View File

@ -28,7 +28,10 @@
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
}
],
"video": "https://youtu.be/k-OMEk7UUvM",
"video": {
"title": "DB2021 - Recite a Meme Song as if Dramatic Poem (Magical Trevor by Graham)",
"id": "k-OMEk7UUvM"
},
"chat": [
{
"sender": "thorsokar",
@ -117,7 +120,10 @@
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
}
],
"video": "https://youtu.be/k-OMEk7UUvM",
"video": {
"title": "DB2021 - Recite a Meme Song as if Dramatic Poem (Magical Trevor by Graham)",
"id": "k-OMEk7UUvM"
},
"chat": [
{
"sender": "thorsokar",

5
web/src/Results.js
Unescape Escape View File

@ -97,13 +97,12 @@ function TranscriptLine(props) {
*/
function Video(props) {
const video_id = props.video.split("/").at(-1);
const width = 300;
return (
<div className='video'>
<iframe width={width} height={Math.round(width / 16 * 9)} src={`https://www.youtube.com/embed/${video_id}`} title="YouTube video player"
<div className='video_title'>{props.video.title}</div>
<iframe width={width} height={Math.round(width / 16 * 9)} src={`https://www.youtube.com/embed/${props.video.id}`} title="YouTube video player"
frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowFullScreen></iframe>
</div>

13
web/src/Results.scss
Unescape Escape View File

@ -47,7 +47,7 @@
max-width: 6.5in;
flex-basis: 2in;
max-height: 2in;
max-height: 2.5in;
overflow-y: scroll;
scrollbar-width: thin;
@ -73,6 +73,15 @@
flex-grow: 0;
flex-shrink: 0;
margin: 3px;
width: 300px;
.video_title {
background-color: constants.$dark_gray;
hyphens: auto;
margin: 0px 0px 3px 0px;
padding: 0.25em 0.5em;
}
}
.chat {
@ -81,7 +90,7 @@
max-width: 6.5in;
flex-basis: 2in;
max-height: 2in;
max-height: 2.5in;
overflow-y: scroll;
scrollbar-width: thin;

Write Preview
Loading…
Cancel
Save