-
Notifications
You must be signed in to change notification settings - Fork 341
Bonfire Friendly Date Ranges
Created by Rafase282
Github | FreeCodeCamp | CodePen | LinkedIn | Website | E-Mail
- Difficulty: 4/5
Implement a way of converting two dates into a more friendly date range that could be presented to a user.
It must not show any redundant information in the date range.
For example, if the year and month are the same then only the day range should be displayed.
Secondly, if the starting year is the current year, and the ending year can be inferred by the reader, the year should be omitted.
Input date is formatted as YYYY-MM-DD
Remember to use Read-Search-Ask if you get stuck. Try to pair program. Write your own code.
function friendly(str) {
return str;
}
friendly(['2015-07-01', '2015-07-04']);
- Create a program that will take two dates and convert them into a more easy to understand date such as
January 1st, 2017
. It will also check the difference between them, and handles cases with no difference, more than a day, more than a month, more than a year, and more than a month and less than a year respectively.
- Split the string into an array where you get the "YYYY", "MM", "DD"
- You need to handle the case for "st", "nd", and "th". Note that 13 is "th" not "rd".
- If you are using
Date()
to create instances of dates to work with, then use UTC time to avoid errors due to time zone difference between servers.
Solution ahead!
function friendly(str) {
var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
// COnverst a YYYY-MM-DD string into a date object.
function convertDate(str) {
// Split the dates to work independently.
var dateStr = str.split('-');
// Force the dates into Universal time to avoid issues due to timezones.
return (new Date(Date.UTC(dateStr[0], dateStr[1] - 1, dateStr[2])));
}
// Handles the case of the day's endings.
function dateEnding(val) {
switch (val) {
case 1:
case 21:
case 31:
return val + 'st';
case 2:
case 22:
return val + 'nd';
case 3:
case 23:
return val + 'rd';
default:
return val + 'th';
}
}
// Checks for the real difference in months to avoid errors
function monthDiff(date1, date2) {
var month2 = date2.getUTCFullYear() * 12 + date2.getUTCMonth();
var month1 = date1.getUTCFullYear() * 12 + date1.getUTCMonth();
return month2 - month1;
}
// Get's the right month string.
function getMonth(date) {
return months[date.getUTCMonth()];
}
function displayDate() {
// Handles same day
if (date2.getTime() - date1.getTime() === 0) {
return [getMonth(date1) + ' ' + dateEnding(date1.getUTCDate()) + ', ' + date1.getUTCFullYear()];
}
// Handles same month
if (date1.getUTCMonth() === date2.getUTCMonth() && date1.getUTCFullYear() === date2.getUTCFullYear()) {
return [getMonth(date1) + ' ' + dateEnding(date1.getUTCDate()), dateEnding(date2.getUTCDate())];
}
// Handles more than a month of difference, but less than 12 months
if (monthDiff(date1, date2) < 12) {
return [getMonth(date1) + ' ' + dateEnding(date1.getUTCDate()), getMonth(date2) + ' ' + dateEnding(date2.getUTCDate())];
}
// Handles cases with more than 12 months apaprt.
return [getMonth(date1) + ' ' + dateEnding(date1.getUTCDate()) + ', ' + date1.getUTCFullYear(), getMonth(date2) + ' ' + dateEnding(date2.getUTCDate()) + ', ' + date2.getUTCFullYear()];
}
var date1 = convertDate(str[0]);
var date2 = convertDate(str[1]);
return displayDate();
}
- Explain your code here
If you found this page useful, you can give thanks by copying and pasting this on the main chat: thanks @Rafase282
NOTE: Please add your username only if you have added any relevant main contents to the wiki page. (Please don't remove any existing usernames.)
Thanks for visiting, if you like this please feel free to star my repo, follow me or even contact me about contributing as it will be a lot of work and having help would be cool.
- HTML5 and CSS
- Responsive Design with Bootstrap
- Gear up for Success
- jQuery
- Basic JavaScript
- Object Oriented and Functional Programming
- Basic Algorithm Scripting
- Basic Front End Development Projects
- Intermediate Algorithm Scripting
- JSON APIs and Ajax
- Intermediate Front End Development Projects
- Claim Your Front End Development Certificate
- Upper Intermediate Algorithm Scripting
- Automated Testing and Debugging
- Advanced Algorithm Scripting
- AngularJS (Legacy Material)
- Git
- Node.js and Express.js
- MongoDB
- API Projects
- Dynamic Web Applications
- Claim Your Back End Development Certificate
- Greefield Nonprofit Project 1
- Greefield Nonprofit Project 2
- Legacy Nonprofit Project 1
- Legacy Nonprofit Project 2
- Claim your Full Stack Development Certification
- Whiteboard Coding Interview Training
- Critical Thinking Interview Training
- Mock Interview 1
- Mock Interview 2
- Mock Interview 3