Skip to content

Commit

Permalink
toggle left right logic
Browse files Browse the repository at this point in the history
  • Loading branch information
Prasidha Karki committed Aug 12, 2020
1 parent 44b1265 commit 88385aa
Show file tree
Hide file tree
Showing 7 changed files with 53 additions and 35 deletions.
10 changes: 5 additions & 5 deletions src/nepali_date_picker/ad_bs_date_render.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ var ad_bs_sub_pub = Object.seal({
key: 0,
subscribers: {},
subscribe: function (subscriber) {
console.log("subscribing for", this.key)

this.subscribers[this.key] = subscriber;
return this.key++;
},
Expand All @@ -28,7 +28,7 @@ var ad_bs_sub_pub = Object.seal({
}
},
unsubscribe: function (key) {
console.log("unsubscribing", key)

delete this.subscribers[key];
},
});
Expand Down Expand Up @@ -58,7 +58,7 @@ const AD_BS_RENDERER = ({ adDate, adDateFormat = "DD-MM-YYYY" }) => {
let _k = ad_bs_listener.ad_bs.subscribe((dateType) => {
setCalendarType(dateType || "AD")
})
console.log("subscrr", _k)
// console.log("subscrr", _k)
new_key = _k
// _setKey(_k)
// ChatAPI.subscribeToFriendStatus(props.friend.id, handleStatusChange);
Expand All @@ -67,7 +67,7 @@ const AD_BS_RENDERER = ({ adDate, adDateFormat = "DD-MM-YYYY" }) => {

useEffect(() => {
return function cleanup() {
console.log("key is", new_key, calendarType)
// console.log("key is", new_key, calendarType)
ad_bs_listener.ad_bs.unsubscribe(new_key)
// ChatAPI.unsubscribeFromFriendStatus(props.friend.id, handleStatusChange);
};
Expand All @@ -89,7 +89,7 @@ const padDateMonth = (val) => {
}

const dateObjectToString = (dt) => {
return `${dt.day}-${dt.month}-${dt.year}`
return `${padDateMonth(dt.day)}-${padDateMonth(dt.month)}-${dt.year}`
}
const adDateStringToObject=(ad_string,_format="DD-MM-YYYY")=>{
let dtObj=moment(ad_string,_format);
Expand Down
26 changes: 13 additions & 13 deletions src/nepali_date_picker/calendar_for_range.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -104,15 +104,15 @@ class NepaliCalendarForRange extends Component {


getPreviousBSMonthData = (currentMonthData) => {
console.log("gettinng", currentMonthData)
// console.log("gettinng", currentMonthData)
var datePickerData = currentMonthData;
var prevMonth = (datePickerData.month - 1 > 0) ? datePickerData.month - 1 : 12;
var prevYear = (prevMonth !== 12) ? datePickerData.year : datePickerData.year - 1;
if (prevYear < calendarData.minBsYear || prevYear > calendarData.maxBsYear) {
return null;
}
let monthData = calendarFunctions.getBsMonthInfoByBsDate(prevYear, prevMonth, 1);
console.log(monthData)
// console.log(monthData)
return monthData
}
getNextBSMonthData = () => {
Expand All @@ -126,7 +126,7 @@ class NepaliCalendarForRange extends Component {
if (nextYear < calendarData.minBsYear || nextYear > calendarData.maxBsYear) {
return null;
}
console.log("setting next for", nextYear, nextMonth, nextDate)
// console.log("setting next for", nextYear, nextMonth, nextDate)

this.setCalendarBSData(nextYear, nextMonth, nextDate)
}
Expand Down Expand Up @@ -171,7 +171,7 @@ class NepaliCalendarForRange extends Component {
month: null,
year: null
}
console.log("rendering for",initialDate,this.props.calendarFor)
// console.log("rendering for",initialDate,this.props.calendarFor)

var currentDate = new Date();
var todayDate = new Date();
Expand All @@ -189,7 +189,7 @@ class NepaliCalendarForRange extends Component {
var currentBsDate = calendarFunctions.getBsDateByAdDate(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate());
var todayBsDate = calendarFunctions.getBsDateByAdDate(todayDate.getFullYear(), todayDate.getMonth() + 1, todayDate.getDate());

console.log("current DAta", currentDate, currentBsDate)
// console.log("current DAta", currentDate, currentBsDate)

var bsYear = currentBsDate.bsYear;
var bsMonth = currentBsDate.bsMonth;
Expand All @@ -211,7 +211,7 @@ class NepaliCalendarForRange extends Component {
this.setCalendarBSData(bsYear, bsMonth, bsDay)
}
renderBSYear = (bsYear) => {
console.log("rendering for", bsYear)
// console.log("rendering for", bsYear)
let calendarDataBS = this.state.calendarDataBS;
var prevMonth = (calendarDataBS.month);
var prevYear = bsYear;
Expand Down Expand Up @@ -296,7 +296,7 @@ class NepaliCalendarForRange extends Component {

}

console.log("changed data",{selected_data_1,selected_data_2})
// console.log("changed data",{selected_data_1,selected_data_2})
this.setState({
selected_data_1: selected_data_1,
selected_data_2: selected_data_2
Expand All @@ -309,7 +309,7 @@ class NepaliCalendarForRange extends Component {


onSelectBS = (bsYear, bsMonth, bsDay) => {
console.log("onSelectBS", bsYear, bsMonth, bsDay)
// console.log("onSelectBS", bsYear, bsMonth, bsDay)
this.setState({
selected_data: {
day: bsDay,
Expand Down Expand Up @@ -367,7 +367,7 @@ class NepaliCalendarForRange extends Component {
})
})

console.log("AD DATE FOR", calendarFunctions.getAdDateObjectByBsDate(2077, 4, 22))
// console.log("AD DATE FOR", calendarFunctions.getAdDateObjectByBsDate(2077, 4, 22))
// this.calender_picker.addEventListener('focusout',this.onFocusedOut)

}
Expand All @@ -378,7 +378,7 @@ class NepaliCalendarForRange extends Component {
}

componentDidUpdate(prevProps) {
console.log("did update",prevProps)
// console.log("did update",prevProps)
if (this.props.initialDate != prevProps.initialDate) {
this.renderCurrentMonth()
}
Expand Down Expand Up @@ -409,7 +409,7 @@ class NepaliCalendarForRange extends Component {
let _prevMonthDays = is_AD ? calendarRenderingData.adPrevMonthDays : calendarRenderingData.bsPrevMonthDays


console.log("date for", { calendarType, _month, _year, _startingDayOfWeek, _totalDaysInMonth, _dayValue, _prevMonth, _prevYear, _prevMonthDays })
// console.log("date for", { calendarType, _month, _year, _startingDayOfWeek, _totalDaysInMonth, _dayValue, _prevMonth, _prevYear, _prevMonthDays })

const { showAnother = true } = this.props;

Expand Down Expand Up @@ -495,7 +495,7 @@ class NepaliCalendarForRange extends Component {
{Array(7).fill("").map((it2, index2) => {

let cell_date = (index1 * 7) + index2 - _startingDayOfWeek + 1;
console.log("cell date", cell_date)
// console.log("cell date", cell_date)
let isCurrentMonth = true;
let main_date = {
day: cell_date,
Expand Down Expand Up @@ -594,7 +594,7 @@ class NepaliCalendarForRange extends Component {
// next month date selected
this.renderNextBSMonth()
}
console.log("clicked value is")
// console.log("clicked value is")
}}
className={`rl-picker-cell
Expand Down
11 changes: 7 additions & 4 deletions src/nepali_date_picker/custom_daterange_toggler.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,8 @@ class CustomDateRangeToggler extends Component {
{dateTo:moment().format("DD-MM-YYYY"),dateFrom:moment().subtract('day',29).format("DD-MM-YYYY"),label:"Last 30"},
{dateTo:moment().format("DD-MM-YYYY"),dateFrom:moment().subtract('day',59).format("DD-MM-YYYY"),label:"Last 60"},
{dateTo:moment().format("DD-MM-YYYY"),dateFrom:moment().subtract('day',179).format("DD-MM-YYYY"),label:"Last 180"},
{dateTo:moment().format("DD-MM-YYYY"),dateFrom:moment().subtract('day',359).format("DD-MM-YYYY"),label:"Last 360"}
{dateTo:moment().format("DD-MM-YYYY"),dateFrom:moment().subtract('day',359).format("DD-MM-YYYY"),label:"Last 360"},
{dateTo:moment().endOf('year').format("DD-MM-YYYY"),dateFrom:moment().startOf('year').format("DD-MM-YYYY"),label:'This year'}
]
return (
<div className='rl-daterange-toggler'>
Expand Down Expand Up @@ -144,16 +145,17 @@ class CustomDateRangeToggler extends Component {
if(isNaN(diff_days)){
return;
}
diff_days=Math.abs(diff_days)
this.setState({
selected_date_2:selected_date_1,
selected_date_2:dt_fr.subtract('day',1).format("DD-MM-YYYY"),
selected_date_1:dt_fr.subtract('day',diff_days).format("DD-MM-YYYY")
})
}
}}>
&#10094;
</div>
<div className='label-body'>
{rendering_val_1||"DD-MM-YYYY"} - {rendering_val_2||"DD-MM-YYYY"}
{rendering_val_1||"DD-MM-YYYY"} ~ {rendering_val_2||"DD-MM-YYYY"}
</div>
<div className='switch right-switch hand-cursor' onClick={()=>{
if(!is_disabled_right){
Expand All @@ -165,8 +167,9 @@ class CustomDateRangeToggler extends Component {
if(isNaN(diff_days)){
return;
}
diff_days=Math.abs(diff_days)
this.setState({
selected_date_1:selected_date_2,
selected_date_1:dt_to.add('day',1).format("DD-MM-YYYY"),
selected_date_2:dt_to.add('day',diff_days).format("DD-MM-YYYY")
})
}
Expand Down
8 changes: 4 additions & 4 deletions src/nepali_date_picker/helper_bs.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -189,7 +189,7 @@ export const calendarFunctions = Object.seal({

var bsMonthFirstAdDate = calendarFunctions.getAdDateByBsDate(bsYear, bsMonth, 1);

console.log("ad date", adDate)
// console.log("ad date", adDate)


var bsMonthDays = calendarFunctions.getBsMonthDays(bsYear, bsMonth);
Expand All @@ -201,17 +201,17 @@ export const calendarFunctions = Object.seal({

var adInitialDateForMonth = moment_date.clone().startOf('month');

console.log("first ad date for month", adInitialDateForMonth.format('lll'))
// console.log("first ad date for month", adInitialDateForMonth.format('lll'))
// var formattedDate = calendarFunctions.bsDateFormat(dateFormatPattern, bsYear, bsMonth, bsDate);
console.log("ad date", eqAdDate, bsDate)
// console.log("ad date", eqAdDate, bsDate)

var prevbsmonth = bsMonth - 1 !== 0 ? bsMonth - 1 : 12;
var prevbsyear = prevbsmonth == 12 ? bsYear - 1 : bsYear;
var nextbsmonth = bsMonth == 12 ? 1 : bsMonth + 1;
var nextbsyear = nextbsmonth == 1 ? bsYear + 1 : bsYear;

var prevbsmonthdays = calendarFunctions.getBsMonthDays(prevbsyear, prevbsmonth);
console.log("check for feb",prev_moment_date.toDate(),prev_moment_date.daysInMonth())
// console.log("check for feb",prev_moment_date.toDate(),prev_moment_date.daysInMonth())
// console.log("check for feb",moment_date.toDate(),moment_date.subtract('month',1).toDate(),moment_date.subtract('month',1).daysInMonth())
return {
adYear: moment_date.year(),
Expand Down
4 changes: 2 additions & 2 deletions src/nepali_date_picker/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ class NepaliDatePicker extends Component {

render() {
const { selected_date, calendarType, focused, temp_value, calendarVisible } = this.state
console.log("today data", this.ad_extras, this.bs_extras, selected_date, calendarType)
// console.log("today data", this.ad_extras, this.bs_extras, selected_date, calendarType)

let rendering_value = selected_date;
if (focused) {
Expand All @@ -88,7 +88,7 @@ class NepaliDatePicker extends Component {
// let selected_ad_date=moment(selected_date,"YYYY-MM-DD");

// let val=<AD_BS_RENDERER adDate={selected_date}/>
console.log("cal", rendering_value)
// console.log("cal", rendering_value)
return (
<div id={this.random_id} className='rl-nepali-datepicker-wrapper'>
<Input
Expand Down
4 changes: 3 additions & 1 deletion src/nepali_date_picker/nepali_date_picker.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -274,4 +274,6 @@
}
.selector-content-wrapper{
display: flex;
}
}


25 changes: 19 additions & 6 deletions src/nepali_date_picker/range_input_picker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -162,16 +162,18 @@ class NepaliRangeInputPicker extends Component {
if (calendarType == "AD") {
let new_date = moment().date(_day).month(_month - 1).year(_year);
_new_selected_date = new_date.format("DD-MM-YYYY");
this.onDateSelect(adDateStringToObject(_new_selected_date))
this.onDateSelect(adDateStringToObject(_new_selected_date),selected_date_2?false:true)
} else {
let respectiveADObject = calendarFunctions.getAdDateObjectByBsDate(_year, _month, _day);
let new_date = moment().date(respectiveADObject.adDate).month(respectiveADObject.adMonth - 1).year(respectiveADObject.adYear);
_new_selected_date = new_date.format("DD-MM-YYYY");
this.onDateSelect(adDateStringToObject(_new_selected_date))
this.onDateSelect(adDateStringToObject(_new_selected_date),selected_date_2?false:true)
}

this.left_inp.blur();
if(selected_date_2==null){
this.right_inp.focus()
}
this.setState({
temp_value1: "",
// selected_date: _new_selected_date
Expand All @@ -184,10 +186,11 @@ class NepaliRangeInputPicker extends Component {
<Input
className="input-split"
style={{
width: 50,
width: 26,
borderLeft: 0,
borderRight: 0,
pointerEvents: 'none',
padding:0
}}
placeholder="~"
disabled
Expand Down Expand Up @@ -255,7 +258,13 @@ class NepaliRangeInputPicker extends Component {
suffix={<Popover overlayClassName='popovercalendar'
visible={calendarVisible}
onVisibleChange={(visible) => {
if(selected_date_1&&selected_date_2==null){
this.setState({
selected_date_2:selected_date_1
})
}
this.setState({ calendarVisible: visible })

}}
trigger='click' placement='bottomRight'
content={<div className='rl-range-calendar'>
Expand All @@ -273,8 +282,11 @@ class NepaliRangeInputPicker extends Component {
showToday={false} />
<NepaliCalendarForRange
selected_date_1={this.state.selected_date_1}
initialDate={this.state.selected_date_2 == null ? this.state.selected_date_1 : this.state.selected_date_2}
// disableDate={(d)=>{
initialDate={this.state.selected_date_2==null?
moment(this.state.selected_date_1,"DD-MM-YYYY").isValid()?
moment(this.state.selected_date_1,"DD-MM-YYYY").add('month',1).format("DD-MM-YYYY"):
moment().add('month',1).format("DD-MM-YYYY")
:this.state.selected_date_2} // disableDate={(d)=>{
// return this.state.selected_date_1&&d<moment(this.state.selected_date_1,"DD-MM-YYYY")
// }}
selected_date_2={this.state.selected_date_2}
Expand All @@ -284,10 +296,11 @@ class NepaliRangeInputPicker extends Component {
calendarFor={2}
showToday={false} />
</div>}>
<img alt='calendar' onClick={() => {
<img alt='calendar' onClick={() => {
this.setState({
calendarVisible: true
})
this.right_inp.blur()
}} className='rl-nepali-datepicker-icon hand-cursor' src={CalendarIcon} />
</Popover>}
/>
Expand Down

0 comments on commit 88385aa

Please sign in to comment.