applying linting and formatting.

pull/1834/head
Warrick Corfe-Tan 4 years ago
parent 384340578c
commit ab3720a064

@ -153,8 +153,7 @@ $session-font-h4: 16px;
color: subtle($color);
}
@mixin pulse-color($color,$duration, $repetition) {
@mixin pulse-color($color, $duration, $repetition) {
animation: pulseColor $duration $repetition;
@keyframes pulseColor {
@ -162,12 +161,12 @@ $session-font-h4: 16px;
transform: scale(0.95);
box-shadow: 0 0 0 0 rgba($color, 0.7);
}
70% {
transform: scale(1);
box-shadow: 0 0 0 10px rgba($color, 0);
}
100% {
transform: scale(0.95);
box-shadow: 0 0 0 0 rgba($color, 0);
@ -175,7 +174,6 @@ $session-font-h4: 16px;
}
}
$session-subtle-factor: 0.6;
@function subtle($color) {

@ -180,8 +180,8 @@
border-top: themed('sessionBorder');
}
.session-icon-button {
// & > .session-icon-button {
.session-icon-button {
// & > .session-icon-button {
margin-right: $session-margin-sm;
}
.session-icon-button {
@ -354,7 +354,6 @@
}
}
}
}
.session-recording {

@ -120,11 +120,13 @@ class SessionRecordingInner extends React.Component<Props, State> {
const displayTimeMs = isRecording
? (nowTimestamp - startTimestamp) * 1000
: (this.audioElement &&
(this.audioElement?.currentTime * 1000 || this.audioElement?.duration)) ||
0;
let displayTimeString = moment.utc(displayTimeMs).format('m:ss');
(this.audioElement?.currentTime * 1000 || this.audioElement?.duration)) ||
0;
const recordingDurationMs = this.audioElement?.duration ? this.audioElement?.duration * 1000 : 1;
const displayTimeString = moment.utc(displayTimeMs).format('m:ss');
const recordingDurationMs = this.audioElement?.duration
? this.audioElement?.duration * 1000
: 1;
let remainingTimeString = '';
if (recordingDurationMs !== undefined) {
@ -140,17 +142,15 @@ class SessionRecordingInner extends React.Component<Props, State> {
onMouseEnter={this.handleHoverActions}
onMouseLeave={this.handleUnhoverActions}
>
<StyledFlexWrapper
flexDirection='row'
marginHorizontal={Constants.UI.SPACING.marginXs}
>{isRecording && (
<SessionIconButton
iconType={SessionIconType.Pause}
iconSize={SessionIconSize.Medium}
iconColor={Constants.UI.COLORS.DANGER_ALT}
onClick={actionPauseFn}
/>
)}
<StyledFlexWrapper flexDirection="row" marginHorizontal={Constants.UI.SPACING.marginXs}>
{isRecording && (
<SessionIconButton
iconType={SessionIconType.Pause}
iconSize={SessionIconSize.Medium}
iconColor={Constants.UI.COLORS.DANGER_ALT}
onClick={actionPauseFn}
/>
)}
{actionPauseAudio && (
<SessionIconButton
iconType={SessionIconType.Pause}
@ -165,7 +165,7 @@ class SessionRecordingInner extends React.Component<Props, State> {
onClick={this.playAudio}
/>
)}
{ hasRecording && (
{hasRecording && (
<SessionIconButton
iconType={SessionIconType.Delete2}
iconSize={SessionIconSize.Medium}
@ -182,30 +182,26 @@ class SessionRecordingInner extends React.Component<Props, State> {
)}
</div>
{ hasRecording && !isRecording ?
{hasRecording && !isRecording ? (
<div className={classNames('session-recording--timer', !isRecording && 'playback-timer')}>
{
displayTimeString + remainingTimeString
}
{displayTimeString + remainingTimeString}
</div>
:
null
}
) : null}
{isRecording ?
{isRecording ? (
<div className={classNames('session-recording--timer')}>
{displayTimeString}
<div className="session-recording--timer-light" />
</div>
:
null
}
) : null}
{!isRecording && (
<div className={classNames(
"send-message-button",
hasRecording && 'send-message-button---scale'
)}>
{!isRecording && (
<div
className={classNames(
'send-message-button',
hasRecording && 'send-message-button---scale'
)}
>
<SessionIconButton
iconType={SessionIconType.Send}
iconSize={SessionIconSize.Large}
@ -214,7 +210,6 @@ class SessionRecordingInner extends React.Component<Props, State> {
/>
</div>
)}
</div>
);
}
@ -366,15 +361,7 @@ class SessionRecordingInner extends React.Component<Props, State> {
}
/**
* Stops recording and sets up audio element, updates recording state.
*/
private async onStopRecordingClick() {
this.stopRecordingStream();
this.updateAudioElementAndDuration();
}
/**
* Creates an audio element using the recorded audio blob.
* Creates an audio element using the recorded audio blob.
* Updates the duration for displaying audio duration.
*/
private updateAudioElementAndDuration() {
@ -384,8 +371,8 @@ class SessionRecordingInner extends React.Component<Props, State> {
// ww adding record duration
this.setState({
recordDuration: this.audioElement.duration
})
recordDuration: this.audioElement.duration,
});
this.audioElement.loop = false;
this.audioElement.onended = () => {

@ -253,11 +253,13 @@ class SettingsViewInner extends React.Component<SettingsViewProps, State> {
return (
<div className="session-settings__version-info">
<span className="text-selectable">v{window.versionInfo.version}</span>
<span><SessionIconButton
iconSize={SessionIconSize.Medium}
iconType={SessionIconType.Oxen}
onClick={openOxenWebsite}
/></span>
<span>
<SessionIconButton
iconSize={SessionIconSize.Medium}
iconType={SessionIconType.Oxen}
onClick={openOxenWebsite}
/>
</span>
<span className="text-selectable">{window.versionInfo.commitHash}</span>
</div>
);

Loading…
Cancel
Save