add some static glowing to the actionpanel light

This commit is contained in:
Audric Ackermann 2021-06-29 15:20:21 +10:00
parent 504a9afc0a
commit 447f862ace
No known key found for this signature in database
GPG key ID: 999F434D76324AD4
5 changed files with 32 additions and 10 deletions

View file

@ -164,6 +164,9 @@ export const ActionPanelOnionStatusLight = (props: {
iconType={SessionIconType.Circle}
iconColor={iconColor}
onClick={handleClick}
glowDuration={10}
glowStartDelay={0}
noScale={true}
isSelected={isSelected}
theme={theme}
/>

View file

@ -12,6 +12,7 @@ export type SessionIconProps = {
glowDuration?: number;
borderRadius?: number;
glowStartDelay?: number;
noScale?: boolean;
theme?: DefaultTheme;
};
@ -46,6 +47,7 @@ type StyledSvgProps = {
borderRadius?: number;
glowDuration?: number;
glowStartDelay?: number;
noScale?: boolean;
iconColor?: string;
};
@ -91,16 +93,22 @@ const animation = (props: {
glowDuration?: number;
glowStartDelay?: number;
iconColor?: string;
noScale?: boolean;
}) => {
if (props.rotateDuration) {
return css`
${rotate} ${props.rotateDuration}s infinite linear;
`;
} else if (
props.glowDuration !== undefined &&
props.glowStartDelay !== undefined &&
props.iconColor
) {
}
if (props.noScale) {
return css``;
}
if (props.glowDuration === 10) {
console.warn('scake', props);
}
if (props.glowDuration !== undefined && props.glowStartDelay !== undefined && props.iconColor) {
return css`
${glow(
props.iconColor,
@ -108,9 +116,9 @@ const animation = (props: {
props.glowStartDelay
)} ${props.glowDuration}s ease infinite;
`;
} else {
return;
}
return;
};
//tslint:disable no-unnecessary-callback-wrapper
@ -119,6 +127,7 @@ const Svg = styled.svg<StyledSvgProps>`
transform: ${props => `rotate(${props.iconRotation}deg)`};
animation: ${props => animation(props)};
border-radius: ${props => props.borderRadius};
filter: ${props => (props.noScale ? `drop-shadow(0px 0px 4px ${props.iconColor})` : '')};
`;
//tslint:enable no-unnecessary-callback-wrapper
@ -132,6 +141,7 @@ const SessionSvg = (props: {
rotateDuration?: number;
glowDuration?: number;
glowStartDelay?: number;
noScale?: boolean;
borderRadius?: number;
theme: DefaultTheme;
}) => {
@ -146,6 +156,7 @@ const SessionSvg = (props: {
glowDuration: props.glowDuration,
glowStartDelay: props.glowStartDelay,
iconColor: props.iconColor,
noScale: props.noScale,
};
return (
@ -166,6 +177,7 @@ export const SessionIcon = (props: SessionIconProps) => {
glowDuration,
borderRadius,
glowStartDelay,
noScale,
} = props;
let { iconSize, iconRotation } = props;
iconSize = iconSize || SessionIconSize.Medium;
@ -189,6 +201,7 @@ export const SessionIcon = (props: SessionIconProps) => {
rotateDuration={rotateDuration}
glowDuration={glowDuration}
glowStartDelay={glowStartDelay}
noScale={noScale}
borderRadius={borderRadius}
iconRotation={iconRotation}
iconColor={iconColor}

View file

@ -20,6 +20,9 @@ export const SessionIconButton = (props: SProps) => {
isSelected,
notificationCount,
theme,
glowDuration,
glowStartDelay,
noScale,
} = props;
const clickHandler = (e: any) => {
if (props.onClick) {
@ -42,6 +45,9 @@ export const SessionIconButton = (props: SProps) => {
iconColor={iconColor}
iconRotation={iconRotation}
theme={themeToUSe}
glowDuration={glowDuration}
glowStartDelay={glowStartDelay}
noScale={noScale}
/>
{Boolean(notificationCount) && <SessionNotificationCount count={notificationCount} />}
</div>

View file

@ -39,7 +39,7 @@ export interface SnodeResponse {
export const NEXT_NODE_NOT_FOUND_PREFIX = 'Next node not found: ';
export const CLOCK_OUT_OF_SYNC_MESSAGE_ERROR =
'You clock is out of sync with the network. Check your clock';
'Your clock is out of sync with the network. Check your clock.';
// Returns the actual ciphertext, symmetric key that will be used
// for decryption, and an ephemeral_key to send to the next hop

View file

@ -216,7 +216,7 @@ describe('OnionPathsErrors', () => {
throw new Error('Error expected');
} catch (e) {
expect(e.message).to.equal(
'You clock is out of sync with the network. Check your clock.'
'Your clock is out of sync with the network. Check your clock.'
);
// this makes sure that this call would not be retried
expect(e.name).to.equal('AbortError');
@ -237,7 +237,7 @@ describe('OnionPathsErrors', () => {
throw new Error('Error expected');
} catch (e) {
expect(e.message).to.equal(
'You clock is out of sync with the network. Check your clock.'
'Your clock is out of sync with the network. Check your clock.'
);
// this makes sure that this call would not be retried
expect(e.name).to.equal('AbortError');