0

I am building a web page which pulls videos from both YouTube and Vimeo, creates thumbnails for them, and should then sort the thumbnails by date. I currently am querying the vVimeo album API endpoint and the YouTube data API - which both return dates for videos in a slightly different manner.

YouTube DATE: 2012-12-20T08:00:40.000Z

VIMEO DATE: 2013-01-02 13:33:51

My question is, how do I get these two different formats into a singular format that I can then sort with JavaScript / jQuery? I'm assuming if I manage to strip the dashes, spaces, and colons, remove the "t" and "z" in the YouTube date, I'll have an actual number which could be sorted - but it seems a little janky, and I'm hoping there is a better way to format these. Anyone have any ideas?

Community
  • 1
  • 1
mheavers
  • 29,530
  • 58
  • 194
  • 315

2 Answers2

1

I would convert the dates to an Javascript Date object, then getTime() from the instance, to sort it.

Let's do an example:

var dates = [];
dates.push(new Date('2013-01-02 13:33:51'));
dates.push(new Date('2012-12-20T08:00:40.000Z'));

Now you have an array with 2 dates you want to sort. Let's do it!

function sortByDate(a, b) {
    return a.getTime() - b.getTime();
}

dates.sort(sortByDate);

If you want a descendent sort, just invert a and b:

function sortByDate(a, b) {
    return b.getTime() - a.getTime();
}

After you can check your array has sorted doing a console.log(dates).

So for the answer the question, you just need to convert the date string in a Date object, then you will be able to compare to sort.

Troubles with Internet Explorer, check this:

Updated:

However, if you plan to have any browser compatibility, you can use advanced browsers date converter, like this project: JS Date Format

Community
  • 1
  • 1
Gabriel Gartz
  • 2,840
  • 22
  • 24
  • `a.getDate() - b.getDate()` is incorrect. For example the code will incorrectly imply that `2012-01-10` is greater than `2012-02-09`. Use `.getTime()`. – Salman A Jan 06 '13 at 18:34
  • @SalmanA you are right, I was lite tired yesterday night when I write this piece of code, when I was testing I have used `.getTime()` and I don't know why have I write the example with `.getDate()`. I'm comparing timestamp, to ensure the sort will work. I have tested with grather then too and worked, but is logical this way. – Gabriel Gartz Jan 06 '13 at 19:55
  • Sorry - I've unchecked this as the right answer, as Chrome is the only browser in which I can get this to work. – mheavers Jan 14 '13 at 11:28
  • @mheavers you are right, even it's ok with ES3 specification but Firefox return NaN in the first function, I don't know about IE. But I have added a project that may help you to convert for any browser this time. – Gabriel Gartz Jan 14 '13 at 15:49
0

Just parse the date into the number of milliseconds since January 1, 1970. That's what JavaScript uses.

Brad
  • 159,648
  • 54
  • 349
  • 530
  • IE7 (and perhaps 8) will have problems with such dates. – Salman A Jan 05 '13 at 17:32
  • @SalmanA, What are you talking about? Care to explain with an example? – Brad Jan 05 '13 at 17:34
  • In IE7, `new Date('2013-01-02 13:33:51')` and `new Date('2013-01-02')` return NaN. – Salman A Jan 05 '13 at 17:40
  • @SalmanA, Ah, yes if you actually use JavaScript's date parser, you can run into trouble. I've never had luck with that anyway (mainly due to oddball formats) and end up parsing it myself. I was suggesting mheavers parse the date with his code, and store a simple integer. – Brad Jan 05 '13 at 17:46