Skip to content

Commit df6eb0a

Browse files
author
Pietro Passarelli
committed
Saving progress
1 parent 4bce95d commit df6eb0a

File tree

4 files changed

+33
-178
lines changed

4 files changed

+33
-178
lines changed

‎package.json

+1-4
Original file line numberDiff line numberDiff line change
@@ -53,14 +53,11 @@
5353
"pretty-quick": "^2.0.1"
5454
},
5555
"dependencies": {
56-
"@emotion/css": "^11.1.3",
5756
"@fortawesome/fontawesome-svg-core": "^1.2.15",
5857
"@fortawesome/free-solid-svg-icons": "^5.12.1",
5958
"@fortawesome/react-fontawesome": "^0.1.5",
6059
"@storybook/addon-storysource": "^5.3.18",
61-
"difflib": "^0.2.4",
6260
"docx": "4.7.1",
63-
"number-to-words": "^1.2.4",
6461
"prop-types": "^15.7.2",
6562
"react-bootstrap": "^1.0.1",
6663
"sbd": "^1.0.18",
@@ -75,4 +72,4 @@
7572
"pre-commit": "pretty-quick --staged"
7673
}
7774
}
78-
}
75+
}

‎src/components/index.js

+25-169
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { useState, useEffect, useMemo, useCallback } from 'react';
2-
import PropTypes from 'prop-types';
2+
import PropTypes, { string } from 'prop-types';
33
import path from 'path';
44
import Button from 'react-bootstrap/Button';
55
import DropdownButton from 'react-bootstrap/DropdownButton';
@@ -18,18 +18,7 @@ import { createEditor, Editor, Transforms } from 'slate';
1818
// Import the Slate components and React plugin.
1919
import { Slate, Editable, withReact, ReactEditor } from 'slate-react';
2020
import { withHistory } from 'slate-history';
21-
import { css } from '@emotion/css';
22-
import {
23-
faSave,
24-
faFileDownload,
25-
faUndo,
26-
faSync,
27-
faInfoCircle,
28-
// faMehBlank,
29-
faPause,
30-
// faMusic,
31-
// faClosedCaptioning,
32-
} from '@fortawesome/free-solid-svg-icons';
21+
import { faSave, faFileDownload, faUndo, faSync, faInfoCircle, faPause } from '@fortawesome/free-solid-svg-icons';
3322
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
3423
import { shortTimecode } from '../util/timecode-converter';
3524
import download from '../util/downlaod/index.js';
@@ -38,10 +27,8 @@ import convertDpeToSlate from '../util/dpe-to-slate';
3827
import insertTimecodesInline from '../util/inline-interval-timecodes';
3928
import pluck from '../util/pluk';
4029
import subtitlesExportOptionsList from '../util/export-adapters/subtitles-generator/list.js';
41-
// import updateTimestamps from '../util/update-timestamps';
4230
import updateTimestamps from '../util/export-adapters/slate-to-dpe/update-timestamps';
4331
import exportAdapter from '../util/export-adapters';
44-
import isEmpty from '../util/is-empty';
4532
import generatePreviousTimingsUpToCurrent from '../util/dpe-to-slate/generate-previous-timings-up-to-current';
4633
import getSelectionNodes from '../util/get-selection-nodes';
4734

@@ -72,53 +59,6 @@ export default function SlateTranscriptEditor(props) {
7259
// used isContentModified to avoid unecessarily run alignment if the slate value contnet has not been modified by the user since
7360
// last save or alignment
7461
const [isContentModified, setIsContentIsModified] = useState(false);
75-
const [search, setSearch] = useState();
76-
// const getCurrrentTime = () => {
77-
// return currentTime;
78-
// };
79-
// const decorate = useCallback(
80-
// ([node, path]) => {
81-
// console.log('decorate', node, path);
82-
// const currentTime = 20; //getCurrrentTime();
83-
// console.log('currentTime', currentTime);
84-
// const ranges = [];
85-
// // currentTime
86-
87-
// // if (currentTime && Text.isText(node)) {
88-
// if (node.children && node.children[0] && node.children[0].words) {
89-
// console.log('inside if');
90-
// const previousWords = node.children[0].words.filter((word) => {
91-
// return word.start <= currentTime;
92-
// });
93-
// console.log('previousWords', previousWords);
94-
// // if (search && Text.isText(node)) {
95-
// // const { text } = node;
96-
// // const parts = text.split(search);
97-
// // let offset = 0;
98-
// if (previousWords) {
99-
// ranges.push({
100-
// anchor: { path, offset: previousWords.length },
101-
// focus: { path, offset: previousWords.length },
102-
// highlight: true,
103-
// });
104-
// }
105-
106-
// // parts.forEach((part, i) => {
107-
// // if (i !== 0) {
108-
// // ranges.push({
109-
// // anchor: { path, offset: offset - search.length },
110-
// // focus: { path, offset },
111-
// // highlight: true,
112-
// // });
113-
// // }
114-
115-
// // offset = offset + part.length + search.length;
116-
// // });
117-
// }
118-
// return ranges;
119-
// },
120-
// [search]
121-
// );
12262

12363
useEffect(() => {
12464
if (isProcessing) {
@@ -262,10 +202,6 @@ export default function SlateTranscriptEditor(props) {
262202
data-start={children.props.parent.start}
263203
data-previous-timings={children.props.parent.previousTimings}
264204
title={children.props.parent.start}
265-
// className={css`
266-
// font-weight: ${leaf.bold && 'bold'};
267-
// background-color: ${leaf.highlight && '#ffeeba'};
268-
// `}
269205
{...attributes}
270206
>
271207
{children}
@@ -475,19 +411,6 @@ export default function SlateTranscriptEditor(props) {
475411
* to provide current paragaph's highlight.
476412
* @param {Number} currentTime - float in seconds
477413
*/
478-
// const generatePreviousTimingsUpToCurrent = (currentTime) => {
479-
// // edge case - empty transcription
480-
// if (isEmpty(props.transcriptData)) {
481-
// return '';
482-
// }
483-
// const lastWordStartTime = props.transcriptData.words[props.transcriptData.words.length - 1].start;
484-
// const lastWordStartTimeInt = parseInt(lastWordStartTime);
485-
// const emptyListOfTimes = Array(lastWordStartTimeInt);
486-
// const listOfTimesInt = [...emptyListOfTimes.keys()];
487-
// const listOfTimesUpToCurrentTimeInt = listOfTimesInt.splice(0, currentTime, 0);
488-
// const stringlistOfTimesUpToCurrentTimeInt = listOfTimesUpToCurrentTimeInt.join(' ');
489-
// return stringlistOfTimesUpToCurrentTimeInt;
490-
// };
491414

492415
const handleSetPauseWhileTyping = () => {
493416
setIsPauseWhiletyping(!isPauseWhiletyping);
@@ -530,7 +453,7 @@ export default function SlateTranscriptEditor(props) {
530453
}
531454
`}
532455
</style>
533-
<style scope>
456+
<style scoped>
534457
{`.editor-wrapper-container{
535458
padding: 8px 16px;
536459
background: #f9f9f9;
@@ -664,7 +587,6 @@ export default function SlateTranscriptEditor(props) {
664587
}}
665588
>
666589
<Editable
667-
// decorate={decorate}
668590
readOnly={typeof props.isEditable === 'boolean' ? !props.isEditable : false}
669591
renderElement={renderElement}
670592
renderLeaf={renderLeaf}
@@ -888,34 +810,6 @@ export default function SlateTranscriptEditor(props) {
888810
</span>
889811
</OverlayTrigger>
890812
</Col>
891-
{/* <Col xs={2} sm={12} md={12} lg={12} xl={12} className={'p-1 mx-auto'}>
892-
<OverlayTrigger
893-
OverlayTrigger
894-
delay={TOOTLIP_LONGER_DELAY}
895-
placement={'bottom'}
896-
overlay={<Tooltip id="tooltip-disabled">Export in caption format</Tooltip>}
897-
>
898-
<DropdownButton
899-
disabled={isProcessing}
900-
id="dropdown-basic-button"
901-
title={<FontAwesomeIcon icon={faClosedCaptioning} />}
902-
variant="light"
903-
>
904-
{subtitlesExportOptionsList.map(({ type, label, ext }, index) => {
905-
return (
906-
<Dropdown.Item
907-
key={index + label}
908-
onClick={() => {
909-
handleExport({ type, ext, isDownload: true });
910-
}}
911-
>
912-
{label} (<code>.{ext}</code>)
913-
</Dropdown.Item>
914-
);
915-
})}
916-
</DropdownButton>
917-
</OverlayTrigger>
918-
</Col> */}
919813
<Col xs={2} sm={12} md={12} lg={12} xl={12} className={'p-1 mx-auto'}>
920814
<OverlayTrigger
921815
OverlayTrigger
@@ -928,44 +822,6 @@ export default function SlateTranscriptEditor(props) {
928822
</Button>
929823
</OverlayTrigger>
930824
</Col>
931-
{/* <Col xs={2} sm={12} md={12} lg={12} xl={12} className={'p-1 mx-auto'}>
932-
<OverlayTrigger
933-
delay={TOOTLIP_DELAY}
934-
placement={'bottom'}
935-
overlay={
936-
<Tooltip id="tooltip-disabled">
937-
To insert a paragraph break, and split a pargraph in two, put the cursor at a point where you'd want to add a paragraph break in
938-
the text and either click this button or hit enter key
939-
</Tooltip>
940-
}
941-
>
942-
<Button disabled={isProcessing} onClick={breakParagraph} variant="light">
943-
↵
944-
</Button>
945-
</OverlayTrigger>
946-
</Col> */}
947-
{/* <Col xs={2} sm={12} md={12} lg={12} xl={12} className={'p-1 mx-auto'}>
948-
<OverlayTrigger
949-
delay={TOOTLIP_DELAY}
950-
placement={'bottom'}
951-
overlay={
952-
<Tooltip id="tooltip-disabled">Put the cursor at a point where you'd want to add [INAUDIBLE] text, and click this button</Tooltip>
953-
}
954-
>
955-
<Button disabled={isProcessing} onClick={insertTextInaudible} variant="light">
956-
<FontAwesomeIcon icon={faMehBlank} />
957-
</Button>
958-
</OverlayTrigger>
959-
</Col> */}
960-
{/* <Col xs={2} sm={12} md={12} lg={12} xl={12} className={'p-1 mx-auto'}>
961-
<OverlayTrigger delay={TOOTLIP_DELAY} placement={'bottom'} overlay={<Tooltip id="tooltip-disabled">Insert a ♫ in the text</Tooltip>}>
962-
<span className="d-inline-block">
963-
<Button onClick={handleInsertMusicNote} variant={'light'}>
964-
<FontAwesomeIcon icon={faMusic} />
965-
</Button>
966-
</span>
967-
</OverlayTrigger>
968-
</Col> */}
969825
<Col xs={2} sm={12} md={12} lg={12} xl={12} className={'p-1 mx-auto'}>
970826
<OverlayTrigger
971827
delay={TOOTLIP_DELAY}
@@ -1032,25 +888,25 @@ export default function SlateTranscriptEditor(props) {
1032888
);
1033889
}
1034890

1035-
SlateTranscriptEditor.propTypes = {
1036-
transcriptData: PropTypes.object.isRequired,
1037-
mediaUrl: PropTypes.string.isRequired,
1038-
handleSaveEditor: PropTypes.func,
1039-
handleAutoSaveChanges: PropTypes.func,
1040-
autoSaveContentType: PropTypes.string,
1041-
isEditable: PropTypes.boolean,
1042-
showTimecodes: PropTypes.boolean,
1043-
showSpeakers: PropTypes.boolean,
1044-
title: PropTypes.string,
1045-
showTitle: PropTypes.boolean,
1046-
mediaType: PropTypes.string,
1047-
transcriptDataLive: PropTypes.object,
1048-
};
1049-
1050-
SlateTranscriptEditor.defaultProps = {
1051-
showTitle: false,
1052-
showTimecodes: true,
1053-
showSpeakers: true,
1054-
mediaType: 'digitalpaperedit',
1055-
isEditable: true,
1056-
};
891+
// SlateTranscriptEditor.propTypes = {
892+
// transcriptData: PropTypes.object.isRequired,
893+
// mediaUrl: PropTypes.string.isRequired,
894+
// handleSaveEditor: PropTypes.func,
895+
// handleAutoSaveChanges: PropTypes.func,
896+
// autoSaveContentType: PropTypes.string,
897+
// isEditable: PropTypes.boolean,
898+
// showTimecodes: PropTypes.boolean,
899+
// showSpeakers: PropTypes.boolean,
900+
// title: PropTypes.string,
901+
// showTitle: PropTypes.boolean,
902+
// mediaType: PropTypes.string,
903+
// transcriptDataLive: PropTypes.object,
904+
// };
905+
906+
// SlateTranscriptEditor.defaultProps = {
907+
// showTitle: false,
908+
// showTimecodes: true,
909+
// showSpeakers: true,
910+
// mediaType: 'digitalpaperedit',
911+
// isEditable: true,
912+
// };

‎src/util/export-adapters/slate-to-dpe/update-timestamps/index.js

+1-2
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import { shortTimecode } from '../../../timecode-converter';
77
import { generatePreviousTimingsUpToCurrentOne } from '../../../dpe-to-slate';
88
import countWords from '../../../count-words';
99
import updateTimestampsHelper from './update-timestamps-helper';
10-
import getWordsForParagraph from '../../../get-words-for-paragraph';
1110
/**
1211
* Transposes the timecodes from stt json list of words onto
1312
* slateJs value paragraphs
@@ -27,6 +26,7 @@ export const createSlateContentFromSlateJsParagraphs = (currentContent, newEntit
2726
const wordsInBlock = countWords(text);
2827
const blockEntites = newEntities.slice(totalWords, totalWords + wordsInBlock);
2928
let speaker = block.speaker;
29+
console.log('blockEntites', blockEntites);
3030
const start = parseFloat(blockEntites[0].start);
3131
const end = parseFloat(blockEntites[blockEntites.length - 1].end);
3232
const currentParagraph = { start, end };
@@ -43,7 +43,6 @@ export const createSlateContentFromSlateJsParagraphs = (currentContent, newEntit
4343
{
4444
text,
4545
words: blockEntites,
46-
// getWordsForParagraph(currentParagraph, newEntities)
4746
},
4847
],
4948
};

‎src/util/export-adapters/slate-to-dpe/update-timestamps/update-timestamps-helper.js

+6-3
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,18 @@ import slateToText from '../../txt';
1313
* @param {*} words - list of stt words
1414
* @return slateJS value
1515
*/
16-
export const updateTimestampsHelper = (currentContent, words) => {
17-
let tmpWords = words;
16+
export const updateTimestampsHelper = (currentContent, dpeTranscript) => {
17+
// trying to align only text that changed
18+
19+
// covert t=slate to text to use alignment module
1820
const currentText = slateToText({
1921
value: currentContent,
2022
speakers: false,
2123
timecodes: false,
2224
atlasFormat: false,
2325
});
24-
const alignedWords = alignSTT(tmpWords, currentText);
26+
const alignedWords = alignSTT(dpeTranscript, currentText);
27+
// clean up
2528
const alignedWordsCleanedUp = alignedWords.filter((word) => {
2629
if (word.text) {
2730
return word;

0 commit comments

Comments
 (0)