Generating 7 days in a week as formatted object - javascript

so I am using the momentJS library as the moment to create an array of 7 days in a week like this:
const moment = require('moment')
var startOfWeek = moment().startOf('week');
var endOfWeek = moment().endOf('week');
var days = [];
var day = startOfWeek;
while (day <= endOfWeek) {
days.push(day.format("MMMM ddd DD, YYYY "));
day = day.clone().add(1, 'd');
}
console.log(days);
And the result return an array of 7 days a week like this:
["December Sun 25, 2022 ","December Mon 26, 2022 ", "December Tue 27, 2022 " , "December Wed 28, 2022 ", "December Thu 29, 2022 ", "December Fri 30, 2022 ", "December Sat 31, 2022 "]
But the result that I look for is something like this:
const weekday = [
{
day: Mon,
date: 26
},
{
day: Tue,
date: 27
},
{
day: Wed,
date: 28
},
{
day: Thu,
date: 26
},
{
day: Fri,
date: 26
},
{
day: Sat,
date: 26
},
]
I am stuck on how to convert the data, could anyone able to help me ? Thanks

Without momentjs, you can use toLocaleDateString and other native Date methods to achieve the result:
const day = new Date(); // Today
day.setDate(day.getDate() - day.getDay() - 1); // Most recent Saturday (not today)
const weekday = Array.from({length: 7}, () => (
day.setDate(day.getDate() + 1), {
day: day.toLocaleDateString("en-US", { weekday: "short" }),
date: day.getDate(),
}
));
console.log(weekday);

If you wish to keep the original output to use elsewhere and not modify the original code, you can map over the days array and construct a new array based on the formatted string (converting to an integer as necessary).
const days = ["December Sun 25, 2022 ", "December Mon 26, 2022 ", "December Tue 27, 2022 ", "December Wed 28, 2022 ", "December Thu 29, 2022 ", "December Fri 30, 2022 ", "December Sat 31, 2022 "]
const weekday = days.map((formattedDate) => {
const [_, day, dateString] = formattedDate.split(" ");
return {
day,
date: parseInt(dateString)
};
});
console.log(weekday);
Alternatively, you can modify your original code
//const moment = require('moment')
const startOfWeek = moment().startOf('week');
const endOfWeek = moment().endOf('week');
// uncomment if you still want `days`
// const days = [];
const weekday = [];
let day = startOfWeek;
while (day <= endOfWeek) {
// days.push(day.format("MMMM ddd DD, YYYY "));
weekday.push({ day: day.format("ddd"), date: day.date() });
day = day.clone().add(1, 'd');
}
console.log(weekday);
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.4/moment.min.js"></script>

Related

Subtracting months from current date is returning unexpected results. Same Month (March) is being returned twice

I have created a method that returns the past months according to the current date and how many months from the past you need, seems like the javascript date object is
behaving wrongly.
I guess the problem has only popped up today as it's the 29th of the current month and subtracting 1 month from 29 March which is supposed to be 29 February (doesn't exist) lead javascript to fallback to +1 day...
Can someone please suggest a great fix for this.
Thanks 🙌
export type Config = {
n: number;
i18n: i18n;
};
export default function NMonthsAgo(config: Config): MonthsAgo[] {
const date = new Date();
const { i18n } = config;
let { n } = config;
n = Math.max(n, 0);
// add one month in future to include the current one.
date.setMonth(date.getMonth() + 1);
return Array.from({ length: n || 1 })
.map(() => {
date.setMonth(date.getMonth() - 1);
console.log(date.toDateString()); ===> console print.
return {
monthName: formatDate(i18n, date, { month: 'long' }),
monthNameShort: formatDate(i18n, date, { month: 'short' }),
year: formatDate(i18n, date, { year: 'numeric' }),
};
})
.reverse();
}
Output:
NMonthsAgo.js:36 Wed Dec 29 2021
NMonthsAgo.js:36 Mon Nov 29 2021
NMonthsAgo.js:36 Fri Oct 29 2021
NMonthsAgo.js:36 Wed Sep 29 2021
NMonthsAgo.js:36 Sun Aug 29 2021
NMonthsAgo.js:36 Thu Jul 29 2021
NMonthsAgo.js:36 Tue Jun 29 2021
NMonthsAgo.js:36 Sat May 29 2021
NMonthsAgo.js:36 Thu Apr 29 2021
NMonthsAgo.js:36 Mon Mar 29 2021 <=== Mars is returned twice...
NMonthsAgo.js:36 Mon Mar 01 2021 <=== Mars is returned twice...
NMonthsAgo.js:36 Mon Feb 01 2021
NMonthsAgo.js:36 Fri Jan 01 2021
NMonthsAgo.js:36 Wed Dec 29 2021

Why is momentjs converting the time zone the wrong way?

I have a form that schedules events. Part of the form is setting the event start time. The form has selection fields for Date, Time, and Timezone. I use this information with momentJS to build a dateTime called eventTime. The form should not submit if the selected DateTime is in the past. So I wrote some simple logic that says:
timeDiff = moment(eventTime).diff(currentTime).
If timeDiff is less than zero the no submit.(More below) This is fine but I am having issues with timezones. So here is what I am trying to do:
If I currently reside in EST and it is 2:00pm then my form should not submit if select 1:45 EST on the given day. But if I change the "Time Zone" dropdown to "Central Time" Then it should submit. Assuming I am not thinking incorrectly
1:45 CST = 2:45 EST
Therefore since it is currently 2:00 CST the form should submit, but momentJS is going the other way and it is thinking the time is 1:45 EST. Based on the moment objects below (in UTC time) I would expect "Central Zone Moment Object" to be Thu Jun 25 2020 10: 45: 00 GMT instead of Thu Jun 25 2020 08: 45: 00 GMT what am I missing.
Thanks
let date = "2020-06-25";
let time = "13:45";
let timezoneEST = "America/New_York";
let timezoneCST = "America/Chicago";
let currentTime = moment().tz(moment.tz.guess());
let eventTimeEST = moment.tz(moment(date).set({ "hour": time.substring(0, 2), "minute": time.substring(3, 5) }), timezoneEST);
let eventTimeCST = moment.tz(moment(date).set({ "hour": time.substring(0, 2), "minute": time.substring(3, 5) }), timezoneCST);
timeDiff = moment([eventTimeEST or eventTimeCST]).diff(currentTime)
if (timeDiff > 0) {
// allow submit
}
console.log(eventTimeEST)
// Eastern Zone Moment Object
// {
// _isAMomentObject: true
// _d: Thu Jun 25 2020 09: 45: 00 GMT - 0400(Eastern Daylight Time)
// _i: Thu Jun 25 2020 00: 00: 00 GMT - 0400(Eastern Daylight Time)
// _isAMomentObject: true
// _isUTC: true
// _isValid: true
// _locale: Locale { _calendar: { … }, _longDateFormat: { … }, _invalidDate: "Invalid date", _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, ordinal: ƒ, … }
// _offset: -240
// _pf: { empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, … }
// _z: Zone { name: "America/New_York", abbrs: Array(236), untils: Array(236), offsets: Array(236), population: 21000000 }
// }
console.log(eventTimeCST)
// Central Zone Moment Object
// {
// _isAMomentObject: true
// _d: Thu Jun 25 2020 08: 45: 00 GMT - 0400(Eastern Daylight Time)
// _i: Thu Jun 25 2020 00: 00: 00 GMT - 0400(Eastern Daylight Time)
// _isAMomentObject: true
// _isUTC: true
// _isValid: true
// _locale: Locale { _calendar: { … }, _longDateFormat: { … }, _invalidDate: "Invalid date", _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, ordinal: ƒ, … }
// _offset: -240
// _pf: { empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, … }
// _z: Zone { name: "America/New_York", abbrs: Array(236), untils: Array(236), offsets: Array(236), population: 21000000 }
// }
console.log(currentTime)
// Current Time(EST) Moment Object
// {
// _d: Thu Jun 25 2020 09: 00: GMT - 0400(Eastern Daylight Time)
// _isAMomentObject: true
// _isUTC: true
// _isValid: true
// _locale: Locale { _calendar: { … }, _longDateFormat: { … }, _invalidDate: "Invalid date", _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, ordinal: ƒ, … }
// _offset: -240
// _pf: { empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, … }
// _z: Zone { name: "America/New_York", abbrs: Array(236), untils: Array(236), offsets: Array(236), population: 21000000 }
// __proto__: Object
// }
let currentTime = moment().tz(moment.tz.guess());
let eventTimeEST = moment.tz(moment(date).set({ "hour": time.substring(0, 2), "minute": time.substring(3, 5) }), timezoneEST);
let eventTimeCST = moment.tz(moment(date).set({ "hour": time.substring(0, 2), "minute": time.substring(3, 5) }), timezoneCST);
This code is basically setting a date in your current TZ and then translating it into another timezone (America/New York-America/Chicago).
The second statement is basically doing EDT to EDT.
The third statement is doing EDT to CDT.
That's why it goes back an hour. Because 1:45 PM EDT is 12:45 PM CDT.
But what you really want to do is to get the time at that timezone.
Eg. 1:45 PM CDT.
The way you do it is by basically setting the time on that timezone.
let date = "2020-06-25";
let timezoneEDT = "America/New_York";
let timezoneCDT = "America/Chicago";
let notBefore = { hour : 14, minute : 0 };
let clock = { hour : 13, minute : 45 };
let a = moment(date).tz(timezoneEDT).set(notBefore); //14:00 EDT
let b = moment(date).tz(timezoneCDT).set(clock); //13:45 CDT -> 14:45 EDT
let c = moment(date).tz(timezoneEDT).set(clock); //13:45 EDT
console.log(test(a, b)); //14:00 EDT against 14:45 EDT prints valid
console.log(test(a, c)); //13:45 EDT against 14:00 EDT prints invalid
function test(a,b){
return a.diff(b) > 0 ? 'Invalid date' : 'Valid date';
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.31/moment-timezone-with-data-2012-2022.js"></script>
As expected
let eventTimeCST = moment.tz(moment(date).set({ "hour": time.substring(0, 2), "minute": time.substring(3, 5) }), timezoneCST);
creates a moment object in my timezone (EST) and the .tz adjusts that time zone. I needed to create a new moment object in the CST timeZone, compare it to my timezone.
That can be achieved like;
let eventTimeCST = moment.tz({'year': 2020, 'month': 06, 'day': 26, 'hour': 9, 'minute': 30}, timezoneCST)
So I just parsed out date and time and built the object.
FYI replacing
{'year': 2020, 'month': 06, 'day': 26, 'hour': 9, 'minute': 30}
with
date + " " time
also worked but threw a deprecation warning

JavaScript: Return associative array instead of common array

I'm referring to this answer again.
var firstEvents = events.reduce(function(ar, e) {
var id = e.getId();
if (e.isRecurringEvent() && e.isAllDayEvent() && !ar.some(function(f) {return f.eventId == id})) {
ar.push({eventTitle: e.getTitle(), eventId: id, startDate: e.getAllDayStartDate(), endDate: e.getAllDayEndDate()});
}
return ar;
}, []);
What do I have to change to get an array with the event titles (Strings) as keys and the start dates (Date objects) as values so I can retrieve a certain start date (Date object) via firstEvents['some event title']?
EDIT:
Current Ouput:
firstEvents = [{eventTitle=Event title 1, eventId=xyz1#google.com, startDate=Sun Mar 18 00:00:00 GMT+01:00 2018, endDate=Mon Mar 19 00:00:00 GMT+01:00 2018},
{eventTitle=Event title 2, eventId=xyz2#google.com, startDate=Tue Mar 19 00:00:00 GMT+01:00 2019, endDate=Wed Mar 20 00:00:00 GMT+01:00 2019},
{eventTitle=Event title 3, eventId=xyz3#google.com, startDate=Fri Mar 20 00:00:00 GMT+01:00 2020, endDate=Sat Mar 21 00:00:00 GMT+01:00 2020}]
Needed Output (Pseudo):
firstEvents = ['Event title 1' => Sun Mar 18 00:00:00 GMT+01:00 2018,
'Event title 2' => Tue Mar 19 00:00:00 GMT+01:00 2019,
'Event title 3' => Fri Mar 20 00:00:00 GMT+01:00 2020]
Do not use push, but set to object with key.
ar = {}; // You may need to change source parameter too
// you cannot change input Array [] to Object {} type inside function
// you can get Array and return Object, but source variable will not change
ar[e.getTitle()] = e.getAllDayStartDate();
Or using some demo data:
var ar = [
{
eventTitle: 'one',
eventId: '#1',
startDate: new Date(),
endDate: new Date()
},
{
eventTitle: 'two',
eventId: 'secondId',
startDate: new Date(),
endDate: new Date()
}];
var retVal = {};
for (var i of ar) {
retVal[i.eventId] = i;
}
console.log(JSON.stringify(retVal, null, 2));
console.log(retVal['#1']);
console.log(retVal.secondId);

How to use different arrays for different days?

I have two arrays both of sets of dates and times for a school bell schedule. The school uses a different bell schedule on Wednesdays. How do I pull the array for Wednesday only on Wednesday and allow for the other array to work on every day besides Wednesday? This code will take the start and end times in the array and if the time is between the start and end times it will take the time between the two and display a countdown timer.
//start of code
var d = new Date(2019);
function getTimeRemaining(endtime) {
var t = Date.parse(endtime) - Date.parse(new Date());
var seconds = Math.floor((t / 1000) % 60);
var minutes = Math.floor((t / 1000 / 60) % 60);
return {
'total': t,
'minutes': minutes,
'seconds': seconds
};
}
var myVar;
myVar = setInterval(function(){window.location.reload(1);}, 1000);
function myStopFunction() {
clearTimeout(myVar);
}
function initializeClock(id, endtime) {
var clock = document.getElementById(id);
clock.style.display = 'block';
var minutesSpan = clock.querySelector('.minutes');
var secondsSpan = clock.querySelector('.seconds');
function updateClock() {
var t = getTimeRemaining(endtime);
minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
}
updateClock();
var timeinterval = setInterval(updateClock, 1000);
}
var windowObjectReference;
function openRequestedPopup() {
windowObjectReference = window.open(
"file:///C:/Users/Darren%20Blount/OneDrive/COUNTDOWN/5_timer.html",
"DescriptiveWindowName", 'height=30000,width=40000, left=40000, resizable=yes,scrollbars=yes,toolbar=yes, status=yes');
var monthNames = ["January", "February", "March", "April", "May", "June",
"July", "August", "September", "October", "November",
"December"];
var d = new Date();
var currentMonth = monthNames[d.getMonth()];
var DayNames = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11",
"12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23",
"24", "25", "26", "27", "28", "29", "30", "31"];
var g = new Date();
var currentDay = DayNames[g.getDay()];
var wednesday /* Havenot worked into code*/= [
// Daily Bell Schedule
['Oct 30, 2018 7:50:49', 'Oct 30, 2018 8:00:49'],
//AAP
['Oct 30, 2018 9:29:49', 'Oct 30, 2018 9:34:49'],
//1st Block - 2nd Block
['Oct 30, 2018 9:58:49', 'Oct 30, 2018 10:03:49'],
//2nd Block - 1st Half 3rd Block
['Oct 30, 2018 11:49:49', 'Oct 30, 2018 11:37:49'],
//1st Lunch - 3rd Block
['Oct 30, 2018 12:02:49', 'Oct 30, 2018 12:07:49'],
//2nd Lunch - 2nd Half of 3rd Block
['Oct 30, 2018 12:42:49', 'Oct 30, 2018 12:47:49'],
//3rd Block - 4th Block
['Oct 30, 2018 13:36:49', 'Oct 30, 2018 13:41:49']
];
const schedule /*Everyday*/= [
['Sep 11, 2018 7:50:49', 'Sep 11, 2018 8:00:49'],
//AAP
['Sep 11, 2018 9:29:49', 'Sep 11, 2018 9:34:49'],
//1st Block - 2nd Block
['Sep 11, 2018 9:58:49', 'Sep 11, 2018 10:03:49'],
//2nd Block - 1st Half 3rd Block
['Sep 11, 2018 11:49:49', 'Sep 11, 2018 11:37:49'],
//1st Lunch - 3rd Block
['Sep 11, 2018 12:02:49', 'Sep 11, 2018 12:07:49'],
//2nd Lunch - 2nd Half of 3rd Block
['Sep 11, 2018 12:42:49', 'Sep 11, 2018 12:47:49'],
//3rd Block - 4th Block
['Sep 11, 2018 1:36:49', 'Sep 11, 2018 1:41:49']
];
const schedule = [
[currentMonth + currentDay + '2019 13:40:00', currentMonth + currentDay
+ '2019 14:30:00']
]
for(let i=0; i<schedule.length; i++){
// pull them straight into Date objects
const startDate = new Date(schedule[i][0]);
const endDate = new Date(schedule[i][1]);
// Make a new Date for setting it for today, then set the hours based off
the schedule
let startTime = new Date();
startTime.setHours(startDate.getHours(), startDate.getMinutes(),
startDate.getSeconds());
let endTime = new Date();
endTime.setHours(endDate.getHours(), endDate.getMinutes(),
endDate.getSeconds());
// Easier way to just get the ms and then the same check
const currentMs = Date.now();
if(endTime.valueOf() > currentMs && currentMs >= startTime.valueOf() ){
initializeClock('clockdiv', endDate);
openRequestedPopup();
myStopFunction();
setInterval(function(){window.location.reload(5);}, 306000);
setTimeout(function () { windowObjectReference.close();}, 305000);
}
}
To achieve expected result , below option of getting current day using getDay()
(starts with Sunday - 0 and for Wednesday it is 3)
var d = new Date();
var today = d.getDay();
var wednesday = [
// Daily Bell Schedule
['Oct 30, 2018 7:50:49', 'Oct 30, 2018 8:00:49'],
//AAP
['Oct 30, 2018 9:29:49', 'Oct 30, 2018 9:34:49'],
//1st Block - 2nd Block
['Oct 30, 2018 9:58:49', 'Oct 30, 2018 10:03:49'],
//2nd Block - 1st Half 3rd Block
['Oct 30, 2018 11:49:49', 'Oct 30, 2018 11:37:49'],
//1st Lunch - 3rd Block
['Oct 30, 2018 12:02:49', 'Oct 30, 2018 12:07:49'],
//2nd Lunch - 2nd Half of 3rd Block
['Oct 30, 2018 12:42:49', 'Oct 30, 2018 12:47:49'],
//3rd Block - 4th Block
['Oct 30, 2018 13:36:49', 'Oct 30, 2018 13:41:49']
];
var everyday = [
['Sep 11, 2018 7:50:49', 'Sep 11, 2018 8:00:49'],
//AAP
['Sep 11, 2018 9:29:49', 'Sep 11, 2018 9:34:49'],
//1st Block - 2nd Block
['Sep 11, 2018 9:58:49', 'Sep 11, 2018 10:03:49'],
//2nd Block - 1st Half 3rd Block
['Sep 11, 2018 11:49:49', 'Sep 11, 2018 11:37:49'],
//1st Lunch - 3rd Block
['Sep 11, 2018 12:02:49', 'Sep 11, 2018 12:07:49'],
//2nd Lunch - 2nd Half of 3rd Block
['Sep 11, 2018 12:42:49', 'Sep 11, 2018 12:47:49'],
//3rd Block - 4th Block
['Sep 11, 2018 1:36:49', 'Sep 11, 2018 1:41:49']
];
if(today ===3){
console.log("Wednesday", wednesday)
}else{
console.log("not wednesday", everyday)
}

How to ignore time-zone on new Date()?

I have JavaScript function called updateLatestDate that receive as parameter array of objects.
One of the properties of the object in array is the MeasureDate property of date type.
The function updateLatestDate returns the latest date existing in array.
Here is the function:
function updateLatestDate(sensorsData) {
return new Date(Math.max.apply(null, sensorsData.map(function (e) {
return new Date(e.MeasureDate);
})));
}
And here is the example of parameter that function receive:
[{
"Address": 54,
"AlertType": 1,
"Area": "North",
"MeasureDate": "2009-11-27T18:10:00",
"MeasureValue": -1
},
{
"Address": 26,
"AlertType": 1,
"Area": "West",
"MeasureDate": "2010-15-27T15:15:00",
"MeasureValue": -1
},
{
"Address": 25,
"AlertType": 1,
"Area": "North",
"MeasureDate": "2012-10-27T18:10:00",
"MeasureValue": -1
}]
The function updateLatestDate will return MeasureDate value of last object in the array.
And it will look like that:
var latestDate = Sat Oct 27 2012 21:10:00 GMT+0300 (Jerusalem Daylight Time)
As you can see the time of the returned result is different from the time of the input object.The time changed according to GMT.
But I don't want the time to be changed according to GMT.
The desired result is:
var latestDate = Sat Oct 27 2012 18:10:00
Any idea how can I ignore time zone when date returned from updateLatestDate function?
As Frz Khan pointed, you can use the .toISOString() function when returning the date from your function, but if you're seeking the UTC format, use the .toUTCString(), it would output something like Mon, 18 Apr 2016 18:09:32 GMT
function updateLatestDate(sensorsData) {
return new Date(Math.max.apply(null, sensorsData.map(function (e) {
return new Date(e.MeasureDate).toUTCString();
})));
}
The Date.toISOString() function is what you need
try this:
var d = new Date("2012-10-27T18:10:00");
d.toISOString();
result:
"2012-10-27T18:10:00.000Z"
If you use moment it will be
moment('Sat Oct 27 2012 21:10:00 GMT+0300', 'ddd MMM DD DDDD HH:mm:SS [GMT]ZZ').format('ddd MMM DD YYYY HH:mm:SS')

Categories