2020-02-26 03:11:28 +00:00
|
|
|
import React, { memo } from 'react';
|
|
|
|
import { IoIosCamera } from 'react-icons/io';
|
|
|
|
import { FaTrashAlt, FaFileExport } from 'react-icons/fa';
|
|
|
|
import { MdRotate90DegreesCcw } from 'react-icons/md';
|
|
|
|
import { FiScissors } from 'react-icons/fi';
|
2020-03-19 15:37:38 +00:00
|
|
|
import { useTranslation } from 'react-i18next';
|
2020-02-26 03:11:28 +00:00
|
|
|
|
|
|
|
import { primaryColor } from './colors';
|
|
|
|
|
|
|
|
|
|
|
|
const RightMenu = memo(({
|
|
|
|
isRotationSet, rotation, areWeCutting, increaseRotation, deleteSource, renderCaptureFormatButton,
|
|
|
|
capture, cutClick, multipleCutSegments,
|
|
|
|
}) => {
|
|
|
|
const rotationStr = `${rotation}°`;
|
|
|
|
const CutIcon = areWeCutting ? FiScissors : FaFileExport;
|
|
|
|
|
2020-03-19 15:37:38 +00:00
|
|
|
const { t } = useTranslation();
|
|
|
|
|
2020-02-26 03:11:28 +00:00
|
|
|
return (
|
2020-02-27 09:17:35 +00:00
|
|
|
<div className="no-user-select" style={{ padding: '.3em', display: 'flex', alignItems: 'center' }}>
|
2020-02-26 03:11:28 +00:00
|
|
|
<div>
|
|
|
|
<span style={{ width: 40, textAlign: 'right', display: 'inline-block' }}>{isRotationSet && rotationStr}</span>
|
|
|
|
<MdRotate90DegreesCcw
|
|
|
|
size={26}
|
|
|
|
style={{ margin: '0 5px', verticalAlign: 'middle' }}
|
2020-03-19 15:37:38 +00:00
|
|
|
title={`${t('Set output rotation. Current: ')} ${isRotationSet ? rotationStr : t('Don\'t modify')}`}
|
2020-02-26 03:11:28 +00:00
|
|
|
onClick={increaseRotation}
|
|
|
|
role="button"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<FaTrashAlt
|
2020-03-19 15:37:38 +00:00
|
|
|
title={t('Delete source file')}
|
2020-02-26 03:11:28 +00:00
|
|
|
style={{ padding: '5px 10px' }}
|
|
|
|
size={16}
|
|
|
|
onClick={deleteSource}
|
|
|
|
role="button"
|
|
|
|
/>
|
|
|
|
|
|
|
|
{renderCaptureFormatButton({ height: 20 })}
|
|
|
|
|
|
|
|
<IoIosCamera
|
|
|
|
style={{ paddingLeft: 5, paddingRight: 15 }}
|
|
|
|
size={25}
|
2020-03-19 15:37:38 +00:00
|
|
|
title={t('Capture frame')}
|
2020-02-26 03:11:28 +00:00
|
|
|
onClick={capture}
|
|
|
|
/>
|
|
|
|
|
|
|
|
<span
|
|
|
|
style={{ background: primaryColor, borderRadius: 5, padding: '3px 7px', fontSize: 14 }}
|
|
|
|
onClick={cutClick}
|
2020-03-19 15:37:38 +00:00
|
|
|
title={multipleCutSegments ? t('Export all segments') : t('Export selection')}
|
2020-02-26 03:11:28 +00:00
|
|
|
role="button"
|
|
|
|
>
|
|
|
|
<CutIcon
|
|
|
|
style={{ verticalAlign: 'middle', marginRight: 3 }}
|
|
|
|
size={16}
|
|
|
|
/>
|
2020-03-19 15:37:38 +00:00
|
|
|
{t('Export')}
|
2020-02-26 03:11:28 +00:00
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
});
|
|
|
|
|
|
|
|
export default RightMenu;
|