Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Subtitle Editor #638

Merged
merged 213 commits into from
Oct 13, 2022
Merged
Changes from 1 commit
Commits
Show all changes
213 commits
Select commit Hold shift + click to select a range
b5ec4f7
Basic view for selecting a subtitle to edit
Arnei Feb 9, 2022
700b779
Display subtitle edit buttons based on languages specified in the con…
Arnei Feb 10, 2022
7010cac
Handle longer words in subtitle edit button title
Arnei Feb 10, 2022
451aaf8
Properly centered subtitle edit buttons
Arnei Feb 10, 2022
91f8f8a
Add page switching functionaility
Arnei Feb 10, 2022
08922e9
Rough sketch of an edit view
Arnei Feb 10, 2022
ce88c79
Merge remote-tracking branch 'upstream/main' into subtitle-edit-view
Arnei Feb 11, 2022
b30e4f1
Added a check to only display unicode flags if the countryCode is valid
Arnei Feb 11, 2022
4179da4
Removed demo segment number
Arnei Feb 11, 2022
455e7b0
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Feb 11, 2022
352287c
Dont display empty div if there is no valid flag
Arnei Feb 11, 2022
3724a8e
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Feb 11, 2022
0ba6b07
Fixed last commit
Arnei Feb 11, 2022
42f6e57
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Feb 11, 2022
7328a2b
Merge remote-tracking branch 'upstream/main' into subtitle-select-view
Arnei Feb 11, 2022
3f5e185
Made player more responsive
Arnei Feb 14, 2022
94ff3ec
Basic Substitle segment List View
Arnei Feb 14, 2022
29d984d
Made player more responsive
Arnei Feb 14, 2022
28e4fc3
Generalize Timeline for subtitle editor view
Arnei Feb 16, 2022
b402c61
Added a subtitle timeline
Arnei Feb 16, 2022
170de10
Fixed warnings that prevented build
Arnei Feb 17, 2022
86533c1
Test code for getting and parsing subtitles
Arnei Feb 18, 2022
7032d33
Got some basic parsing working using webvtt-parser
Arnei Feb 22, 2022
5bda77d
Added a button to add subtitles with
Arnei Feb 22, 2022
277e195
Make edit view fill the whole viewport height
Arnei Feb 22, 2022
3c3e6a6
Always display subtitle select view when clicking on the subtitle mai…
Arnei Feb 23, 2022
56191cf
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Feb 23, 2022
0e07561
Merge branch 'subtitle-edit-view' into subtitle-edit-list-view
Arnei Feb 23, 2022
e70c0c9
Fixed unused import
Arnei Feb 23, 2022
aefa027
Merge branch 'subtitle-edit-view' into subtitle-edit-list-view
Arnei Feb 23, 2022
1ee328b
Move SubtitleListEditor to new file
Arnei Feb 23, 2022
3515d26
Button placement and visibility experiments
Arnei Feb 23, 2022
51f73d4
Prep Code for creating a segment if there are none
Arnei Feb 23, 2022
c58513d
Buttons now only appear on hover or focus
Arnei Feb 23, 2022
f9dae79
Merge branch 'subtitle-edit-list-view-BUTTONS' into subtitle-edit-lis…
Arnei Feb 23, 2022
483b71c
Fixed dummy data for demonstration purposes
Arnei Feb 24, 2022
ac0fd35
Prep code for adding a new segment when pressing enter in the textarea
Arnei Feb 24, 2022
73dd439
Try and fix subtitle editor height again for many segments
Arnei Feb 24, 2022
8576998
Merge branch 'subtitle-edit-view' into subtitle-edit-timeline
Arnei Feb 24, 2022
d2bd117
Basic restyling according to Matthias idea
Arnei Feb 25, 2022
b917900
achive basic draggability for timeline subtitle segments
Arnei Feb 25, 2022
f1acbd5
Change cursor on mouse over for timeline subtitle segments
Arnei Feb 25, 2022
168e902
Fixed timeline scaling
Arnei Feb 25, 2022
261fcdc
Merge remote-tracking branch 'upstream/main' into subtitle-select-view
Arnei Feb 28, 2022
4d9f4e8
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Feb 28, 2022
fd9a016
Merge branch 'subtitle-edit-view' into subtitle-edit-list-view
Arnei Feb 28, 2022
bc4a833
Merge branch 'subtitle-edit-view' into subtitle-edit-timeline
Arnei Feb 28, 2022
998b5b4
Merge branch 'subtitle-edit-view' into webvtt-parsing
Arnei Feb 28, 2022
95661df
Reorganized code into redux slices
Arnei Feb 28, 2022
fe56d71
Display parsing errors
Arnei Feb 28, 2022
c813b21
Merge branch 'subtitle-edit-list-view' into subtitle-combine-webvtt-w…
Arnei Mar 1, 2022
2ed98f1
Merge branch 'subtitle-edit-timeline' into subtitle-combine-webvtt-wi…
Arnei Mar 1, 2022
ba36bae
Turn flavors to keys for subtitle config
Arnei Mar 1, 2022
018fceb
Merge branch 'webvtt-parsing' into subtitle-combine-webvtt-with-views
Arnei Mar 1, 2022
294e4e9
Only allow to select languages for subtitles that have a subtitle fil…
Arnei Mar 1, 2022
a8cd446
Add functionality to the add subtitles button
Arnei Mar 1, 2022
c2c730a
Update title in subtitle editor view with subtitle name
Arnei Mar 1, 2022
c5c4d21
Avoid bloating dom tree with hidden elements
Arnei Mar 1, 2022
730611f
Merge branch 'subtitle-edit-view' into subtitle-edit-list-view
Arnei Mar 1, 2022
51e29cb
Merge branch 'subtitle-edit-view' into subtitle-edit-timeline
Arnei Mar 1, 2022
3257b20
Merge branch 'subtitle-edit-view' into webvtt-parsing
Arnei Mar 1, 2022
e2cbb31
Merge branch 'webvtt-parsing' into subtitle-combine-webvtt-with-views
Arnei Mar 1, 2022
3fc061b
Fixed bool sign error
Arnei Mar 1, 2022
aa06348
Merge branch 'subtitle-edit-view' into subtitle-edit-list-view
Arnei Mar 1, 2022
04bf3fa
Merge branch 'subtitle-edit-view' into subtitle-edit-timeline
Arnei Mar 1, 2022
c56422e
Merge branch 'subtitle-edit-view' into webvtt-parsing
Arnei Mar 1, 2022
94cdc26
Merge branch 'webvtt-parsing' into subtitle-combine-webvtt-with-views
Arnei Mar 1, 2022
bbdad2b
Rework get request error messages for subtitles to be specific to eac…
Arnei Mar 2, 2022
0b18959
Initial commit for the video area of the subtitle editor view
Arnei Mar 3, 2022
8d7610d
Fixed warnings
Arnei Mar 3, 2022
ec51e96
Fix warning
Arnei Mar 3, 2022
74dde79
Merge branch 'webvtt-parsing' into subtitle-combine-webvtt-with-views
Arnei Mar 3, 2022
dbf1a10
Added dummy subtitles to the subtitle video player
Arnei Mar 3, 2022
1e4fb03
Hacky fix for subtitles not loading
Arnei Mar 4, 2022
2641c73
Restore editor settings
Arnei Mar 4, 2022
4a42d5f
Merge branch 'subtitle-edit-player' into subtitle-combine-webvtt-with…
Arnei Mar 4, 2022
768653b
Moved subtitle timeline code to own file
Arnei Mar 4, 2022
2099df7
Merge branch 'subtitle-edit-timeline' into subtitle-combine-webvtt-wi…
Arnei Mar 4, 2022
48f8e7e
Add back accidentally removed import statement
Arnei Mar 4, 2022
0c0d551
Fixed track selection to not show caption tracks
Arnei Mar 4, 2022
5ac091e
Merge branch 'webvtt-parsing' into subtitle-combine-webvtt-with-views
Arnei Mar 4, 2022
07f86bd
Added basic add and delete functionality to the subtitle list view
Arnei Mar 7, 2022
b536bb2
Fixed caption tracks showing in the video player select dropdown
Arnei Mar 7, 2022
b4918be
Fixed adding subtitle list segment on enter above instead of below
Arnei Mar 7, 2022
fb00075
Use real data in timeline
Arnei Mar 7, 2022
ca57be4
Added functionality to the time fields in the subtitle list view
Arnei Mar 7, 2022
482679a
Made subtitle video player use the real subtitles instead of dummy va…
Arnei Mar 7, 2022
3188b89
Remove on-screen debugging
Arnei Mar 7, 2022
4b9f78d
Formatting
Arnei Mar 7, 2022
85dcb0e
Replace MiniTimeline with the normal scroll bar
Arnei Mar 8, 2022
1e4baad
Merge branch 'subtitle-edit-timeline' into subtitle-combine-webvtt-wi…
Arnei Mar 8, 2022
8d47f6a
Undo scrollbar, go back to mini timeline
Arnei Mar 8, 2022
6dbcf14
Merge branch 'subtitle-edit-timeline' into subtitle-combine-webvtt-wi…
Arnei Mar 8, 2022
9b3a829
Add more padding to prevent scroll bar from shown when not necessary
Arnei Mar 8, 2022
e2a9aac
Merge branch 'subtitle-edit-list-view' into subtitle-combine-webvtt-w…
Arnei Mar 8, 2022
479cff1
Fix scrollbar hiding
Arnei Mar 9, 2022
165ebc5
Merge branch 'subtitle-edit-timeline' into subtitle-combine-webvtt-wi…
Arnei Mar 9, 2022
0c928d2
Time input fields in the subtitle list now provide a readable format..
Arnei Mar 9, 2022
4eaee0c
Merge main with keyboard Controls into subtitle-select-view
Arnei Mar 14, 2022
2c995ab
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Mar 14, 2022
3a2a286
Merge branch 'subtitle-edit-view' into subtitle-edit-list-view
Arnei Mar 14, 2022
51245e5
Merge branch 'subtitle-edit-view' into subtitle-edit-timeline
Arnei Mar 14, 2022
cba3829
Merge branch 'subtitle-edit-view' into subtitle-edit-player
Arnei Mar 14, 2022
166094d
Merge branch 'subtitle-edit-view' into webvtt-parsing
Arnei Mar 14, 2022
dc997cd
Merge branch 'subtitle-edit-list-view' into subtitle-combine-webvtt-w…
Arnei Mar 14, 2022
cdc78f7
Merge branch 'subtitle-edit-timeline' into subtitle-combine-webvtt-wi…
Arnei Mar 14, 2022
5ab068b
Merge branch 'webvtt-parsing' into subtitle-combine-webvtt-with-views
Arnei Mar 14, 2022
478b000
Merge remote-tracking branch 'upstream/main' into subtitle-select-view
Arnei Mar 14, 2022
ce3d3b0
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Mar 14, 2022
f043cd5
Merge branch 'subtitle-edit-view' into subtitle-edit-list-view
Arnei Mar 14, 2022
f50235e
Merge branch 'subtitle-edit-view' into subtitle-edit-timeline
Arnei Mar 14, 2022
97c14c1
Merge branch 'subtitle-edit-view' into subtitle-edit-player
Arnei Mar 14, 2022
af0dd36
Merge branch 'subtitle-edit-view' into webvtt-parsing
Arnei Mar 14, 2022
0ada25f
Merge branch 'subtitle-edit-list-view' into subtitle-combine-webvtt-w…
Arnei Mar 14, 2022
8e818c4
Merge branch 'subtitle-edit-timeline' into subtitle-combine-webvtt-wi…
Arnei Mar 14, 2022
98009f8
Merge branch 'subtitle-edit-player' into subtitle-combine-webvtt-with…
Arnei Mar 14, 2022
f07ab04
Click on timeline segment scrolls to beginning of segment
Arnei Mar 14, 2022
a18bdab
Memoize subtitle list segments
Arnei Mar 14, 2022
5b5c1b6
Memoize subtitle timeline segments
Arnei Mar 14, 2022
4407185
Fix time fields in subtitle list view not updating when changed from …
Arnei Mar 15, 2022
b33bf90
Added basic resizable code to timeline segment, but does not work fully
Arnei Mar 16, 2022
76a75c5
Fixed subsequent subtitle segments in the subtitle timeline not showing
Arnei Mar 16, 2022
1ce2449
Improve subtitle data structure to simplify code
Arnei Mar 16, 2022
e5c38b9
Enforce correct ordering (by startTime) of subtitle cue arrays
Arnei Mar 16, 2022
a680435
Avoid any accidental rerendering of waveforms by storing paths to the…
Arnei Mar 16, 2022
e34cb33
Fixed tracks selection
Arnei Mar 17, 2022
7275e1a
Don't JSON parse a response that won't hold a JSON anyway
Arnei Mar 17, 2022
b2bd38a
Fixed accessing wrong state when parsing tracks from Opencast
Arnei Mar 17, 2022
30ee7ce
Allows video player hotkeys in the subtitle editor by changing the wa…
Arnei Mar 17, 2022
a4083da
Added custom function to get all hotkeys for display
Arnei Mar 17, 2022
f3c3cfc
Added scrubber controls to subtitle edit view
Arnei Mar 17, 2022
ef954b0
Do not allow certain global hotkeys when focusing textareas, inputs, …
Arnei Mar 17, 2022
39dad28
Fixed hotkey names not showing in overview after putting global confi…
Arnei Mar 17, 2022
d4ad0df
Added focus callback in subtitle list view
Arnei Mar 18, 2022
7ea07b2
Fixed excessive rerendering of subtitle video due to aspect ratio
Arnei Mar 18, 2022
aef2521
Merge remote-tracking branch 'upstream/main' into subtitle-select-view
Arnei Mar 21, 2022
694ba1b
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Mar 21, 2022
23f843b
Merge branch 'subtitle-edit-view' into subtitle-edit-list-view
Arnei Mar 21, 2022
e76803c
Merge branch 'subtitle-edit-view' into subtitle-edit-timeline
Arnei Mar 21, 2022
e03009d
Merge branch 'subtitle-edit-view' into subtitle-edit-player
Arnei Mar 21, 2022
d04dfe8
Merge branch 'subtitle-edit-view' into webvtt-parsing
Arnei Mar 21, 2022
732c07c
Merge branch 'subtitle-edit-list-view' into subtitle-combine-webvtt-w…
Arnei Mar 21, 2022
107a222
Merge branch 'subtitle-edit-timeline' into subtitle-combine-webvtt-wi…
Arnei Mar 21, 2022
986a74b
Merge branch 'subtitle-edit-player' into subtitle-combine-webvtt-with…
Arnei Mar 21, 2022
fda7f65
Merge branch 'webvtt-parsing' into subtitle-combine-webvtt-with-views
Arnei Mar 21, 2022
2580dd6
Merge branch 'subtitle-combine-webvtt-with-views-HOTKEYS' into subtit…
Arnei Mar 21, 2022
6e2abee
Fix language file
Arnei Mar 21, 2022
773ea9b
Merge branch 'subtitle-edit-player' into subtitle-combine-webvtt-with…
Arnei Mar 21, 2022
3a647a8
Merge branch 'subtitle-combine-webvtt-with-views' into subtitle-combi…
Arnei Mar 21, 2022
5169249
Improved performance by memoizing forwardRef callback function
Arnei Mar 21, 2022
6b9535e
Removed debugging comments
Arnei Mar 21, 2022
d797d3e
Fix shift+enter not creating a newline in subtitle text area
Arnei Mar 21, 2022
2367180
Fix hotkey names not being displayed in keyboardcontrols
Arnei Mar 21, 2022
ba22c1f
Focus segment in subtitle list view when newly added
Arnei Mar 21, 2022
692b8f7
Added hotkeys for subtitle list
Arnei Mar 21, 2022
ee44835
Fix subtitle time parsing issues, display error more prominently
Arnei Mar 21, 2022
e758ce4
Fix hotkeys accidentally triggering inside textfields etc
Arnei Mar 21, 2022
9dba61a
Added black background to videos in case the aspect ratio calculation…
Arnei Mar 21, 2022
29f2bfb
Update current subtitle time when textarea in subtitle list segment g…
Arnei Mar 22, 2022
c904635
Add distance between elements in the subtitle editor view
Arnei Mar 22, 2022
be423e7
Properly sort subtitle list after adding new segment
Arnei Mar 22, 2022
dab9229
Trying out indiana drag for the subtitle timeline
Arnei Mar 22, 2022
81c1862
Revert "Trying out indiana drag for the subtitle timeline"
Arnei Mar 22, 2022
2ab1e94
Added tooltips and aria tooltips to the subtitle editor
Arnei Mar 22, 2022
f613ce7
Styling subtitle editor view seperator
Arnei Mar 22, 2022
f032d72
Save subtitles to Opencast
Arnei Mar 25, 2022
0e54a0c
Kinda fixed subtitle hotloading in react-player
Arnei Apr 4, 2022
58cd6de
Improved captionTrackSelector to reduce rerender calls
Arnei Apr 4, 2022
36dea00
Cleanup
Arnei Apr 4, 2022
ae24448
Introduced react-window to reduce initial load time of subtitle edito…
Arnei Apr 6, 2022
3069544
Fixed buttons not overlaying correctly in subtitle editor list view
Arnei Apr 6, 2022
a0b35c6
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Apr 7, 2022
269fa1d
Remove dead imports
Arnei Apr 7, 2022
866d543
Add functionality to preview button in subtitle edit view
Arnei Apr 7, 2022
d16e9a4
Merge remote-tracking branch 'upstream/main' into subtitle-select-view
Arnei Apr 8, 2022
0c6dc52
Merge remote-tracking branch 'upstream/main' into subtitle-edit-view
Arnei Apr 8, 2022
b704fda
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Apr 8, 2022
4816594
Fix fontawesome icon type error
Arnei Apr 8, 2022
8b3768e
Merge branch 'subtitle-select-view' into subtitle-edit-view
Arnei Apr 8, 2022
0f88be6
Merge branch 'subtitle-edit-view' into subtitle-combine-webvtt-with-v…
Arnei Apr 8, 2022
fa8757c
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei May 11, 2022
c0fd673
Update fontawesome svg-core to avoid type mismatches
Arnei May 11, 2022
5b82f79
Fixed error caused by mui-rff update
Arnei May 11, 2022
cf5ae2c
Make subtitle list segment buttons triggerable through keyboard input…
Arnei May 11, 2022
d045ac7
Fiddle with CSS to avoid vertical scrollbar in the subtitle editor wh…
Arnei May 11, 2022
0b1a3da
Updating currentlyAt value based on scrolling
Arnei May 12, 2022
55cab3b
Workaround for subtitles not loading in firefox
Arnei May 11, 2022
4fb4452
Merge branch 'subtitle-combine-webvtt-with-views-FIREFOX-SUBTITLE-WOR…
Arnei May 12, 2022
3513d69
Quickfix warning in workaround
Arnei May 12, 2022
dba546d
Only trigger onEndScroll on human input
Arnei May 13, 2022
3430235
Merge branch 'subtitle-combine-webvtt-with-views' into subtitle-combi…
Arnei May 13, 2022
9dfaebb
Reinstall indiana drag scroll
Arnei May 13, 2022
ef8cea1
Cleanup comments
Arnei May 13, 2022
5a5e5aa
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei May 13, 2022
b0b548c
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Jun 15, 2022
afd980c
Removed debugging console.log statements
Arnei Jun 15, 2022
f62bf54
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Jun 15, 2022
1a58781
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Jul 6, 2022
43dd96a
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Sep 13, 2022
14d0b71
Remove triangle from position indicator in the Subtitle Editor
Arnei Sep 14, 2022
d7ed45d
Fix various dark mode issue with the subtitle editor
Arnei Sep 15, 2022
2f8e0c3
Invert position indicator color in subtitle editor for darkmode
Arnei Sep 15, 2022
e168f01
Make MiniTimeline look more like a player bar in the Subtitle Editor
Arnei Sep 15, 2022
fa683e9
Dont test for react-select enumeration in playwright tests
Arnei Sep 16, 2022
088f9f6
Cleanup subtitle editor config
Arnei Sep 16, 2022
7967cec
Adapt to backend changing to sending subtitles seperately
Arnei Sep 30, 2022
c1d787f
Adapt to subtitles being sent as full text instead of uri
Arnei Oct 5, 2022
6a49989
Video select in subtitle view does not display current selected video…
Arnei Oct 5, 2022
11a1fc1
Fix subtitle serialization with undefined metadata values
Arnei Oct 5, 2022
31751e1
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Oct 5, 2022
a6b11d2
Bump webvtt serializer to fix edge cases in serialization
Arnei Oct 5, 2022
c6393f2
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Oct 6, 2022
f12bb1b
Merge remote-tracking branch 'upstream/main' into subtitle-combine-we…
Arnei Oct 12, 2022
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Always display subtitle select view when clicking on the subtitle mai…
…n menu item
Arnei committed Feb 23, 2022

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
commit 3c3e6a60f95ea1ac913a074ca3fe259e9754ae17
4 changes: 4 additions & 0 deletions src/main/MainMenu.tsx
Original file line number Diff line number Diff line change
@@ -19,6 +19,7 @@ import './../i18n/config';
import { useTranslation } from 'react-i18next';
import { resetPostRequestState as metadataResetPostRequestState } from "../redux/metadataSlice";
import { resetPostRequestState } from "../redux/workflowPostSlice";
import { setIsDisplayEditView } from "../redux/subtitleSlice";

/**
* A container for selecting the functionality shown in the main part of the app
@@ -67,6 +68,9 @@ const MainMenuButton: React.FC<{iconName: any, stateName: mainMenu["value"]}> =
if (stateName === MainMenuStateNames.finish) {
dispatch(setPageNumber(0))
}
if (stateName === MainMenuStateNames.subtitles) {
dispatch(setIsDisplayEditView(false))
}
// Halt ongoing events
dispatch(setIsPlaying(false))
// Reset states
13 changes: 5 additions & 8 deletions src/main/Subtitle.tsx
Original file line number Diff line number Diff line change
@@ -3,10 +3,12 @@ import { css } from "@emotion/react";
import { useState } from "react";
import SubtitleEditor from "./SubtitleEditor";
import SubtitleSelect from "./SubtitleSelect";
import { useSelector } from "react-redux";
import { selectIsDisplayEditView } from "../redux/subtitleSlice";

const Subtitle : React.FC<{}> = () => {

const [displayEditView, setDisplayEditView] = useState(false);
const displayEditView = useSelector(selectIsDisplayEditView)

const pageSelectStyle = css({
display: !displayEditView ? 'block' :'none',
@@ -17,18 +19,13 @@ const Subtitle : React.FC<{}> = () => {
height: '100%',
})

const setEditViewCallback = (displayEditView: boolean) => {
console.log("Callback called: " + displayEditView)
setDisplayEditView(displayEditView);
}

return (
<>
<div css={pageSelectStyle} >
<SubtitleSelect displayEditView={setEditViewCallback}/>
<SubtitleSelect />
</div>
<div css={pageEditStyle} >
<SubtitleEditor displayEditView={setEditViewCallback}/>
<SubtitleEditor />
</div>
</>
);
14 changes: 9 additions & 5 deletions src/main/SubtitleEditor.tsx
Original file line number Diff line number Diff line change
@@ -5,11 +5,13 @@ import ReactPlayer from "react-player";
import { basicButtonStyle } from "../cssStyles";
import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { useDispatch } from "react-redux";
import { setIsDisplayEditView } from "../redux/subtitleSlice";

/**
* Displays a menu for selecting what should be done with the current changes
*/
const SubtitleEditor : React.FC<{displayEditView: (e: boolean) => void}> = (displayEditView) => {
const SubtitleEditor : React.FC<{}> = () => {

const subtitleEditorStyle = css({
display: 'flex',
@@ -65,7 +67,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
return (
<div css={subtitleEditorStyle}>
<div css={headerRowStyle}>
<BackButton displayEditView={displayEditView.displayEditView}/>
<BackButton />
<div css={[titleStyle, titleStyleBold]}>
Subtitle Editor - [Language Name]
</div>
@@ -148,7 +150,9 @@ const SubtitleVideoPlayer : React.FC<{}> = () => {
/**
* Takes you to a different page
*/
export const BackButton : React.FC<{displayEditView: (e: boolean) => void}> = ({displayEditView}) => {
export const BackButton : React.FC<{}> = () => {

const dispatch = useDispatch();

const backButtonStyle = css({
width: '50px',
@@ -161,9 +165,9 @@ const SubtitleVideoPlayer : React.FC<{}> = () => {
return (
<div css={[basicButtonStyle, backButtonStyle]}
role="button" tabIndex={0}
onClick={ () => displayEditView(false) }
onClick={ () => dispatch(setIsDisplayEditView(false)) }
onKeyDown={(event: React.KeyboardEvent<HTMLDivElement>) => { if (event.key === " " || event.key === "Enter") {
displayEditView(false)
dispatch(setIsDisplayEditView(false))
}}}>
<FontAwesomeIcon icon={faChevronLeft} size="1x" />
<span>{"Back"}</span>
16 changes: 9 additions & 7 deletions src/main/SubtitleSelect.tsx
Original file line number Diff line number Diff line change
@@ -2,11 +2,13 @@ import React from "react";
import { css } from "@emotion/react";
import { basicButtonStyle, flexGapReplacementStyle } from "../cssStyles";
import { settings } from '../config'
import { useDispatch } from "react-redux";
import { setIsDisplayEditView } from "../redux/subtitleSlice";

/**
* Displays a menu for selecting what should be done with the current changes
*/
const SubtitleSelect : React.FC<{displayEditView: (e: boolean) => void}> = (displayEditView) => {
const SubtitleSelect : React.FC<{}> = () => {

const subtitleSelectStyle = css({
display: 'grid',
@@ -28,7 +30,7 @@ import { settings } from '../config'
let key = lan // left side
let value = settings.subtitles.languages[lan] // right side
buttons.push(
<SubtitleSelectButton title={key} iconIdentifier={parseCountryCode(value)} segmentNumber={0} key={key} displayEditView={displayEditView.displayEditView}/>
<SubtitleSelectButton title={key} iconIdentifier={parseCountryCode(value)} segmentNumber={0} key={key} />
)
}
return buttons
@@ -42,12 +44,12 @@ import { settings } from '../config'
}

const SubtitleSelectButton: React.FC<{
title: string, iconIdentifier: string | undefined, segmentNumber: number, displayEditView: (e: boolean) => void
title: string, iconIdentifier: string | undefined, segmentNumber: number,
}> = ({
title, iconIdentifier, segmentNumber, displayEditView
title, iconIdentifier, segmentNumber,
}) => {

// const { t } = useTranslation();
const dispatch = useDispatch();

const subtitleSelectButtonStyle = css({
width: '250px',
@@ -91,9 +93,9 @@ const SubtitleSelectButton: React.FC<{
return (
<div css={[basicButtonStyle, subtitleSelectButtonStyle]}
role="button" tabIndex={0}
onClick={ () => displayEditView(true) }
onClick={ () => dispatch(setIsDisplayEditView(true)) }
onKeyDown={(event: React.KeyboardEvent<HTMLDivElement>) => { if (event.key === " " || event.key === "Enter") {
displayEditView(true)
dispatch(setIsDisplayEditView(true))
}}}
>
{iconIdentifier && getFlagEmoji(iconIdentifier) && <div css={flagStyle}>{getFlagEmoji(iconIdentifier)}</div>}
9 changes: 8 additions & 1 deletion src/redux/store.ts
Original file line number Diff line number Diff line change
@@ -6,9 +6,10 @@ import workflowPostReducer from './workflowPostSlice'
import workflowPostAndProcessReducer from './workflowPostAndProcessSlice'
import endReducer from './endSlice'
import metadataReducer from './metadataSlice'
import subtitleReducer from './subtitleSlice'
import errorReducer from './errorSlice'

export default configureStore({
export const store = configureStore({
reducer: {
mainMenuState: mainMenuStateReducer,
finishState: finishStateReducer,
@@ -17,6 +18,12 @@ export default configureStore({
workflowPostAndProcessState: workflowPostAndProcessReducer,
endState: endReducer,
metadataState: metadataReducer,
subtitleState: subtitleReducer,
errorState: errorReducer,
}
})

export default store;

// Infer the `RootState` and `AppDispatch` types from the store itself
export type RootState = ReturnType<typeof store.getState>
34 changes: 34 additions & 0 deletions src/redux/subtitleSlice.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import { createSlice, PayloadAction } from '@reduxjs/toolkit'
import type { RootState } from '../redux/store'

export interface subtitle {
isDisplayEditView: boolean // Should the edit view be displayed
}

const initialState: subtitle = {
isDisplayEditView: false,
}

/**
* Slice for the subtitle editor state
*/
export const subtitleSlice = createSlice({
name: 'subtitleState',
initialState,
reducers: {
setIsDisplayEditView: (state, action: PayloadAction<subtitle["isDisplayEditView"]>) => {
state.isDisplayEditView = action.payload;
},

}
})

// Export Actions
export const { setIsDisplayEditView } = subtitleSlice.actions

// Export Selectors
export const selectIsDisplayEditView = (state: RootState) =>
state.subtitleState.isDisplayEditView


export default subtitleSlice.reducer