Track Changes: prevent set date when scroll

src/calendar/day/basic/style.js

@@ -36,6 +36,7 @@ export default function styleConstructor(theme = {}) {
       borderRadius: 16
     },
     todayText: {
+      fontWeight: '600',
       color: appStyle.todayTextColor
     },
     selectedText: {

src/expandableCalendar/calendarProvider.js

@@ -9,7 +9,6 @@ import {xdateToData} from '../interface';
 import styleConstructor from './style';
 import CalendarContext from './calendarContext';
 
-
 const commons = require('./commons');
 const UPDATE_SOURCES = commons.UPDATE_SOURCES;
 const iconDown = require('../img/down.png');
@@ -37,8 +36,10 @@ class CalendarProvider extends Component {
     /** Today button's style */
     todayButtonStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.number, PropTypes.array]),
     /** The opacity for the disabled today button (0-1) */
-    disabledOpacity: PropTypes.number
-  }
+    disabledOpacity: PropTypes.number,
+    /** Today button's style */
+    todayComponent: PropTypes.any
+  };
 
   constructor(props) {
     super(props);
@@ -81,14 +82,14 @@ class CalendarProvider extends Component {
     if (!sameMonth) {
       _.invoke(this.props, 'onMonthChange', xdateToData(XDate(date)), updateSource);
     }
-  }
+  };
 
-  setDisabled = (disabled) => {
+  setDisabled = disabled => {
     if (this.props.showTodayButton && disabled !== this.state.disabled) {
       this.setState({disabled});
       this.animateOpacity(disabled);
     }
-  }
+  };
 
   getButtonIcon(date) {
     if (!this.props.showTodayButton) {
@@ -146,29 +147,22 @@ class CalendarProvider extends Component {
   onTodayPress = () => {
     const today = XDate().toString('yyyy-MM-dd');
     this.setDate(today, UPDATE_SOURCES.TODAY_PRESS);
-  }
+  };
 
   renderTodayButton() {
-    const {disabled, opacity, buttonY, buttonIcon} = this.state;
-    const todayString = XDate.locales[XDate.defaultLocale].today || commons.todayString;
-    const today = todayString.charAt(0).toUpperCase() + todayString.slice(1);
+    const {disabled} = this.state;
 
     return (
-      <Animated.View style={[this.style.todayButtonContainer, {transform: [{translateY: buttonY}]}]}>
-        <TouchableOpacity style={[this.style.todayButton, this.props.todayButtonStyle]} onPress={this.onTodayPress} disabled={disabled}>
-          <Animated.Image style={[this.style.todayButtonImage, {opacity}]} source={buttonIcon}/>
-          <Animated.Text allowFontScaling={false} style={[this.style.todayButtonText, {opacity}]}>{today}</Animated.Text>
-        </TouchableOpacity>
-      </Animated.View>
+      <TouchableOpacity style={[this.props.todayButtonStyle]} onPress={this.onTodayPress} disabled={disabled}>
+        {this.props.todayComponent}
+      </TouchableOpacity>
     );
   }
 
   render() {
     return (
       <CalendarContext.Provider value={this.getProviderContextValue()}>
-        <View style={[{flex: 1}, this.props.style]}>
-          {this.props.children}
-        </View>
+        <View style={[{flex: 1}, this.props.style]}>{this.props.children}</View>
         {this.props.showTodayButton && this.renderTodayButton()}
       </CalendarContext.Provider>
     );

src/expandableCalendar/style.js

@@ -1,13 +1,12 @@
 import {StyleSheet, Platform} from 'react-native';
 import * as defaultStyle from '../style';
 
-
 const commons = require('./commons');
 const STYLESHEET_ID = 'stylesheet.expandable.main';
 
 export default function styleConstructor(theme = {}) {
   const appStyle = {...defaultStyle, ...theme};
-  
+
   return StyleSheet.create({
     containerShadow: {
       backgroundColor: appStyle.calendarBackground,
@@ -44,7 +43,7 @@ export default function styleConstructor(theme = {}) {
       backgroundColor: '#e8ecf0'
     },
     sectionText: {
-      fontWeight: 'bold', 
+      fontWeight: 'bold',
       fontSize: 12,
       lineHeight: 16,
       color: '#7a92a5',
@@ -72,8 +71,8 @@ export default function styleConstructor(theme = {}) {
       color: appStyle.monthTextColor
     },
     weekDayNames: {
-      flexDirection: 'row', 
-      justifyContent: 'space-between' 
+      flexDirection: 'row',
+      justifyContent: 'space-between'
     },
     weekday: {
       width: 32,
@@ -89,13 +88,11 @@ export default function styleConstructor(theme = {}) {
     week: {
       marginTop: 7,
       marginBottom: 7,
-      paddingRight: 15,
-      paddingLeft: 15,
       flexDirection: 'row',
       justifyContent: 'space-around'
     },
     dayContainer: {
-      flex: 1, 
+      flex: 1,
       alignItems: 'center'
     },
     emptyDayContainer: {
@@ -115,13 +112,13 @@ export default function styleConstructor(theme = {}) {
     },
     todayButtonContainer: {
       alignItems: appStyle.todayButtonPosition === 'right' ? 'flex-end' : 'flex-start',
-      position: 'absolute', 
-      left: 20, 
-      right: 20, 
-      bottom : 0
+      position: 'absolute',
+      left: 20,
+      right: 20,
+      bottom: 0
     },
     todayButton: {
-      height: commons.isTablet ? 40 : 28, 
+      height: commons.isTablet ? 40 : 28,
       paddingHorizontal: commons.isTablet ? 20 : 12,
       borderRadius: commons.isTablet ? 20 : 14,
       flexDirection: appStyle.todayButtonPosition === 'right' ? 'row-reverse' : 'row',
@@ -142,12 +139,12 @@ export default function styleConstructor(theme = {}) {
     },
     todayButtonText: {
       color: appStyle.todayButtonTextColor,
-      fontSize: commons.isTablet ? appStyle.todayButtonFontSize + 2 : appStyle.todayButtonFontSize, 
+      fontSize: commons.isTablet ? appStyle.todayButtonFontSize + 2 : appStyle.todayButtonFontSize,
       fontWeight: appStyle.todayButtonFontWeight,
       fontFamily: appStyle.todayButtonFontFamily
     },
     todayButtonImage: {
-      tintColor: appStyle.todayButtonTextColor, 
+      tintColor: appStyle.todayButtonTextColor,
       marginLeft: appStyle.todayButtonPosition === 'right' ? 7 : undefined,
       marginRight: appStyle.todayButtonPosition === 'right' ? undefined : 7
     },

src/expandableCalendar/weekCalendar.js

@@ -134,7 +134,7 @@ class WeekCalendar extends Component {
       const {items} = this.state;
       this.page = newPage;
 
-      _.invoke(this.props.context, 'setDate', items[this.page], UPDATE_SOURCES.WEEK_SCROLL);
+      // _.invoke(this.props.context, 'setDate', items[this.page], UPDATE_SOURCES.WEEK_SCROLL);
 
       if (this.page === items.length - 1) {
         for (let i = 0; i <= NUMBER_OF_PAGES; i++) {