Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2025-12-16 19:57:52 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: add quill text editor

Browse Source
This commit is contained in:
thewisefarmerr
2019-11-22 06:08:27 +05:00
parent ffb2457606
commit 7c265f8eed
8 changed files with 38169 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/mobile/App.js
View File

@@ -69,7 +69,9 @@ const App = () => {
hideShadow={true}
buttonColor="#1abc9c"
title=""
onPress={() => {}}>
onPress={() => {
NavigationService.navigate('ReminderEditor');
}}>
<Icon
name="ios-clock"
style={{

59
apps/mobile/android/app/src/main/assets/fonts.css Normal file
View File

@@ -0,0 +1,59 @@
/* latin */
@font-face {
font-family: 'Quicksand';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(./fonts/Quicksand-Light.ttf) format('truetype');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
U+FEFF, U+FFFD;
}
/* latin */
@font-face {
font-family: 'Quicksand';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(./fonts/Quicksand-Regular.ttf) format('truetype');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
U+FEFF, U+FFFD;
}
/* latin */
@font-face {
font-family: 'Quicksand';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(./fonts/Quicksand-Medium.ttf) format('truetype');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
U+FEFF, U+FFFD;
}
/* latin */
@font-face {
font-family: 'Quicksand';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(./fonts/Quicksand-SemiBold.ttf) format('truetype');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
U+FEFF, U+FFFD;
}
/* latin */
@font-face {
font-family: 'Quicksand';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(./fonts/Quicksand-Bold.ttf) format('truetype');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
U+FEFF, U+FFFD;
}

23538
apps/mobile/android/app/src/main/assets/texteditor.html Normal file
View File

File diff suppressed because it is too large Load Diff

14409
apps/mobile/android/app/src/main/assets/textviewer.html Normal file
View File

File diff suppressed because it is too large Load Diff

6
apps/mobile/src/services/NavigationService.js
View File

@@ -7,6 +7,7 @@ import Lists from '../views/Lists';
import Folders from '../views/Folders';
import Favorites from '../views/Favorites';
import ListsEditor from '../views/ListsEditor';
import ReminderEditor from '../views/ReminderEditor';
const TopLevelNavigator = createStackNavigator(
{
@@ -31,9 +32,12 @@ const TopLevelNavigator = createStackNavigator(
ListsEditor: {
screen: ListsEditor,
},
ReminderEditor: {
screen: ReminderEditor,
},
},
{
initialRouteName: 'Home',
initialRouteName: 'Editor',
},
);

56
apps/mobile/src/views/Editor/index.js
View File

@@ -6,6 +6,7 @@ import {
TouchableOpacity,
TextInput,
SafeAreaView,
StatusBar,
} from 'react-native';
import {
COLOR_SCHEME,
@@ -18,7 +19,7 @@ import {
WEIGHT,
} from '../../common/common';
import Icon from 'react-native-vector-icons/Ionicons';
import RichText from 'react-native-rich-text';
const saveText = (type, title, content) => {
let data = {
type,
@@ -35,58 +36,25 @@ const Editor = ({navigation}) => {
const _textRender = createRef();
return (
<SafeAreaView>
<SafeAreaView
style={{
height: '100%',
}}>
<View
style={{
width: '100%',
paddingHorizontal: '5%',
paddingVertical: pv + 5,
borderBottomWidth: 1,
borderBottomColor: colors.navbg,
paddingVertical: pv,
alignSelf: 'center',
marginTop: 25,
}}>
<Icon name="ios-arrow-back" size={SIZE.xl} color="black" />
</View>
<TextInput
style={{
width: '100%',
maxWidth: '100%',
textAlignVertical: 'top',
fontSize: SIZE.xl,
fontFamily: WEIGHT.semibold,
paddingHorizontal: '5%',
paddingVertical: ph,
}}
allowFontScaling={true}
adjustsFontSizeToFit={true}
maxLength={50}
numberOfLines={1}
placeholderTextColor={colors.icon}
placeholder="Untitled Note"
onChangeText={value => {
_heading = value;
}}
/>
<TextInput
ref={_textRender}
style={{
width: '100%',
maxWidth: '100%',
textAlignVertical: 'top',
fontSize: SIZE.md,
fontFamily: WEIGHT.semibold,
paddingHorizontal: '5%',
paddingVertical: ph,
}}
multiline={true}
placeholder="Start writing"
placeholderTextColor={colors.icon}
onChangeText={value => {
_text = value;
}}
/>
<RichText value="">
<RichText.Editor onChangeText={text => console.log(text)} />
</RichText>
</SafeAreaView>
);
};

3
apps/mobile/src/views/ListsEditor/index.js
View File

@@ -48,7 +48,6 @@ const ListsEditor = ({navigation}) => {
const [deleteMode, setDeleteMode] = useState(false);
const forceUpdate = useForceUpdate();
const _textRender = createRef();
let prevItem = null;
let prevIndex = null;
@@ -67,7 +66,7 @@ const ListsEditor = ({navigation}) => {
}}>
<TextInput
style={{
fontSize: SIZE.xxl,
fontSize: SIZE.xl,
color: colors.pri,
fontFamily: WEIGHT.bold,
paddingVertical: 0,

142
apps/mobile/src/views/ReminderEditor/index.js
View File

@@ -0,0 +1,142 @@
import React, {useEffect, useState, createRef, useCallback} from 'react';
import {
ScrollView,
View,
Text,
TouchableOpacity,
TextInput,
SafeAreaView,
Dimensions,
FlatList,
} from 'react-native';
import {
COLOR_SCHEME,
SIZE,
br,
ph,
pv,
opacity,
FONT,
WEIGHT,
} from '../../common/common';
import Icon from 'react-native-vector-icons/Ionicons';
const w = Dimensions.get('window').width;
const h = Dimensions.get('window').height;
const saveText = (type, title, content) => {
let data = {
type,
title,
headline: content.slice(0, 60),
timestamp: Date.now(),
};
};
export function useForceUpdate() {
const [, setTick] = useState(0);
const update = useCallback(() => {
setTick(tick => tick + 1);
}, []);
return update;
}
const ReminderEditor = ({navigation}) => {
const [colors, setColors] = useState(COLOR_SCHEME);
const _textRender = createRef();
return (
<SafeAreaView>
<View
style={{
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
paddingHorizontal: '5%',
marginTop: Platform.OS == 'ios' ? h * 0.02 : h * 0.04,
marginBottom: h * 0.04,
}}>
<Text
style={{
fontSize: SIZE.xl,
color: colors.pri,
fontFamily: WEIGHT.bold,
paddingVertical: 0,
paddingHorizontal: 0,
maxWidth: '90%',
width: '90%',
}}>
Set a Reminder
</Text>
<Icon name="md-more" color={colors.icon} size={SIZE.xxl} />
</View>
<Text
style={{
width: '90%',
alignSelf: 'center',
fontFamily: WEIGHT.semibold,
color: colors.pri,
fontSize: SIZE.sm,
marginBottom: 10,
}}>
What do you want to be reminded about?
</Text>
<TextInput
ref={_textRender}
style={{
width: '90%',
maxWidth: '90%',
textAlignVertical: 'top',
fontSize: SIZE.sm,
fontFamily: WEIGHT.regular,
marginHorizontal: '5%',
paddingVertical: pv - 5,
borderRadius: 5,
paddingHorizontal: ph - 5,
backgroundColor: colors.navbg,
marginBottom: 15,
}}
maxLength={80}
placeholder="eg. Sara's Birthday"
placeholderTextColor={colors.icon}
onChangeText={value => {
_text = value;
}}
/>
<TextInput
ref={_textRender}
style={{
width: '90%',
maxWidth: '90%',
textAlignVertical: 'top',
fontSize: SIZE.sm,
fontFamily: WEIGHT.regular,
marginHorizontal: '5%',
paddingVertical: pv - 5,
borderRadius: 5,
paddingHorizontal: ph - 5,
backgroundColor: colors.navbg,
marginBottom: 10,
}}
numberOfLines={3}
maxLength={80}
multiline={true}
placeholder="You can add a short note here"
placeholderTextColor={colors.icon}
onChangeText={value => {
_text = value;
}}
/>
</SafeAreaView>
);
};
ReminderEditor.navigationOptions = {
header: null,
};
export default ReminderEditor;