Merge Conflict
continuous-integration/drone/push Build is passing
Details
Before Width: | Height: | Size: 131 KiB |
After Width: | Height: | Size: 208 KiB |
Before Width: | Height: | Size: 134 KiB After Width: | Height: | Size: 136 KiB |
@ -0,0 +1,6 @@
|
|||||||
|
export const GraphicalCharterDark = {
|
||||||
|
"body": "#141414",
|
||||||
|
"Text": "white",
|
||||||
|
"Card": "#232123",
|
||||||
|
"Line": "#403F3F"
|
||||||
|
}
|
@ -0,0 +1,6 @@
|
|||||||
|
export const GraphicalCharterLight = {
|
||||||
|
"body": "#f2f2f6",
|
||||||
|
"Text": "black",
|
||||||
|
"Card": "#fff",
|
||||||
|
"Line": "#e2e2e3"
|
||||||
|
}
|
Before Width: | Height: | Size: 322 KiB After Width: | Height: | Size: 329 KiB |
Before Width: | Height: | Size: 298 KiB After Width: | Height: | Size: 284 KiB |
Before Width: | Height: | Size: 569 KiB After Width: | Height: | Size: 590 KiB |
After Width: | Height: | Size: 760 KiB |
After Width: | Height: | Size: 766 KiB |
After Width: | Height: | Size: 756 KiB |
After Width: | Height: | Size: 778 KiB |
@ -0,0 +1,10 @@
|
|||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
export default function AdjustSize(Text: String) {
|
||||||
|
const titleLength = Text.length;
|
||||||
|
const minFontSize = 23;
|
||||||
|
const maxFontSize = 48;
|
||||||
|
const fontRatio = 1.1;
|
||||||
|
const fontSize = Math.max(minFontSize, maxFontSize - (titleLength * fontRatio));
|
||||||
|
return fontSize;
|
||||||
|
}
|
@ -1,75 +1,75 @@
|
|||||||
import { useState } from 'react';
|
import { useState } from 'react';
|
||||||
import { View, Text, Image ,PanResponder, Dimensions, StyleSheet, ImageBackground, Button, Pressable, TextInput } from 'react-native'
|
import { View, Text, Image, PanResponder, Dimensions, StyleSheet, ImageBackground, Button, Pressable, TextInput } from 'react-native'
|
||||||
import Animated, { interpolate, lessThan, multiply, useAnimatedStyle } from 'react-native-reanimated';
|
import Animated, { interpolate, lessThan, multiply, useAnimatedStyle } from 'react-native-reanimated';
|
||||||
import HalfCirlce from './HalfCircle';
|
import HalfCirlce from './HalfCircle';
|
||||||
|
|
||||||
interface CircularProps {
|
interface CircularProps {
|
||||||
background : string,
|
background: string,
|
||||||
foreground : string,
|
foreground: string,
|
||||||
progress : Animated.Value<number>,
|
progress: Animated.Value<number>,
|
||||||
radius : number;
|
radius: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
const PI= Math.PI;
|
const PI = Math.PI;
|
||||||
const FladInput = ({background, foreground, progress} : CircularProps) => {
|
const FladInput = ({ background, foreground, progress }: CircularProps) => {
|
||||||
const [focused, setFocused] = useState<boolean>(false);
|
const [focused, setFocused] = useState<boolean>(false);
|
||||||
const theta = multiply(progress,2*PI);
|
const theta = multiply(progress, 2 * PI);
|
||||||
const rotateTop = theta;
|
const rotateTop = theta;
|
||||||
const opacity = lessThan(theta, PI);
|
const opacity = lessThan(theta, PI);
|
||||||
|
|
||||||
|
|
||||||
const rotateAnimation = useAnimatedStyle(() => {
|
const rotateAnimation = useAnimatedStyle(() => {
|
||||||
const rotate = interpolate
|
const rotate = interpolate
|
||||||
( theta,
|
(theta,
|
||||||
[PI, 2*PI],
|
[PI, 2 * PI],
|
||||||
[0,PI]);
|
[0, PI]);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...StyleSheet.absoluteFillObject,
|
...StyleSheet.absoluteFillObject,
|
||||||
transform: [
|
transform: [
|
||||||
{rotate: rotate},
|
{ rotate: rotate },
|
||||||
{translateX: RADUIS/2},
|
{ translateX: RADUIS / 2 },
|
||||||
{translateY: RADUIS/2}
|
{ translateY: RADUIS / 2 }
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
const rotateAnimation2 = useAnimatedStyle(() => {
|
const rotateAnimation2 = useAnimatedStyle(() => {
|
||||||
const rotate = interpolate
|
const rotate = interpolate
|
||||||
( theta,
|
(theta,
|
||||||
[PI, 2*PI],
|
[PI, 2 * PI],
|
||||||
[0,PI]);
|
[0, PI]);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...StyleSheet.absoluteFillObject,
|
...StyleSheet.absoluteFillObject,
|
||||||
transform: [
|
transform: [
|
||||||
{rotate: theta},
|
{ rotate: theta },
|
||||||
{translateX: RADUIS/2},
|
{ translateX: RADUIS / 2 },
|
||||||
{translateY: RADUIS/2}
|
{ translateY: RADUIS / 2 }
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<View style={{zIndex : 1}}>
|
<View style={{ zIndex: 1 }}>
|
||||||
<HalfCirlce backgroundColor={background}/>
|
<HalfCirlce backgroundColor={background} />
|
||||||
<Animated.View style={{...StyleSheet.absoluteFillObject, transform : [{rotate : '180%'}], opacity}}>
|
<Animated.View style={{ ...StyleSheet.absoluteFillObject, transform: [{ rotate: '180%' }], opacity }}>
|
||||||
<HalfCirlce backgroundColor={background}/>
|
<HalfCirlce backgroundColor={background} />
|
||||||
</Animated.View>
|
</Animated.View>
|
||||||
</View>
|
</View>
|
||||||
<View style={{ transform : [{rotate : '180%'}]}}>
|
<View style={{ transform: [{ rotate: '180%' }] }}>
|
||||||
<HalfCirlce backgroundColor={background}/>
|
<HalfCirlce backgroundColor={background} />
|
||||||
<Animated.View style={{}}>
|
<Animated.View style={{}}>
|
||||||
<HalfCirlce backgroundColor={background}/>
|
<HalfCirlce backgroundColor={background} />
|
||||||
</Animated.View> </View>
|
</Animated.View> </View>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
const styles = StyleSheet.create({
|
||||||
input : {
|
input: {
|
||||||
justifyContent : 'center',
|
justifyContent: 'center',
|
||||||
alignItems : 'center',
|
alignItems: 'center',
|
||||||
placeholder : "placeholde"
|
placeholder: "placeholde"
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -0,0 +1,31 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { View, Image, StyleSheet } from 'react-native';
|
||||||
|
import normalize from './Normalize';
|
||||||
|
|
||||||
|
type Flady = {
|
||||||
|
image: string | object;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function FladyComponent(monFlady: Flady) {
|
||||||
|
const source = typeof monFlady.image === 'string' ? { uri: monFlady.image } : monFlady.image;
|
||||||
|
return (
|
||||||
|
<View style={styles.container}>
|
||||||
|
<Image source={source} style={styles.image} />
|
||||||
|
</View>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
container: {
|
||||||
|
width: normalize(152),
|
||||||
|
height: normalize(152),
|
||||||
|
borderRadius: 90,
|
||||||
|
marginHorizontal: normalize(15),
|
||||||
|
overflow: 'hidden',
|
||||||
|
},
|
||||||
|
image: {
|
||||||
|
width: normalize(220),
|
||||||
|
height: normalize(220),
|
||||||
|
marginLeft: -1
|
||||||
|
}
|
||||||
|
})
|
@ -1,18 +0,0 @@
|
|||||||
|
|
||||||
Uri getApiUrlAuthorize() => _api.identification.urlAuthorize;
|
|
||||||
|
|
||||||
String getApiRedirectUrl() => _api.identification.redirectUri;
|
|
||||||
|
|
||||||
String getIdSpotify() => _currentUser.idSpotify;
|
|
||||||
|
|
||||||
String getIdFlad() => _currentUser.idFlad;
|
|
||||||
|
|
||||||
|
|
||||||
case getCompleteMusic
|
|
||||||
|
|
||||||
playTrack(String id)
|
|
||||||
|
|
||||||
case addToPlaylist:
|
|
||||||
return {...state, spot: action.payload}
|
|
||||||
|
|
||||||
case removeFromPlaylist:
|
|
@ -1,10 +1,10 @@
|
|||||||
|
|
||||||
export const userTypes = {
|
export const userTypes = {
|
||||||
LOGIN: 'LOGIN',
|
LOGIN: 'LOGIN',
|
||||||
SIGNUP: 'SIGNUP',
|
SIGNUP: 'SIGNUP',
|
||||||
SAVE_SPOTIFY :'SAVE_SPOTIFY',
|
SAVE_SPOTIFY: 'SAVE_SPOTIFY',
|
||||||
UPDATE_USER: 'UPDATE_USER',
|
UPDATE_USER: 'UPDATE_USER',
|
||||||
UPDATE_PROFILE_PICTURE: 'UPDATE_PROFILE_PICTURE',
|
UPDATE_PROFILE_PICTURE: 'UPDATE_PROFILE_PICTURE',
|
||||||
USER_LOGOUT : 'USER_LOGOUT',
|
USER_LOGOUT: 'USER_LOGOUT',
|
||||||
RESTORE_TOKEN : "RESTORE_TOKEN"
|
RESTORE_TOKEN: "RESTORE_TOKEN",
|
||||||
}
|
CHANGE_MODE: "CHANGE_MODE"
|
||||||
|
}
|