JSON Scraping - Convert military time to standard time via Javascript

I am scraping JSON data from a url. The time is military time and I was wondering if there is a way once I retrieve on the client side to convert it to standard time.

Here is the JSON:

[
  {
    SaturdayClose: "21:00",
    SaturdayOpen: "10:00",
    SundayClose: "12:00",
    SundayOpen: "18:00",
    WeekdayClose: "21:00",
    WeekdayOpen: "10:00"
  }
]

Here is my index.html:

    <p>
        Sun: ${ SundayOpen }a - ${ SundayClose }p Mon - Sat: ${ SaturdayOpen }a ${ SaturdayClose }p
    </p>

This returns this type of ugliness:

Sun: 18:00a - 12:00p Mon - Sat: 10:00a 21:00p

I would rather return this:

Sun: 6:00a - 12:p Mon - Sat: 10:00a - 9:00p

Answers:

Answer

Using a date script will work of course. If all you need is to convert from 24 hour clock to 12 hour, you can simply subtract the time and add the period as indicated.

EDIT

I added two times as a test, 00:30, which should be 12:30 am, and 12:15, which should be 12:15 pm. See the new edit below.

var times = {
    SaturdayClose: "21:00",
    SaturdayOpen: "10:00",
    SundayClose: "12:00",
    SundayOpen: "18:00",
    WeekdayOpen: "10:00",
    WeekdayClose: "21:00",
    WeekendOpen: "12:15",
    WeekendClose: "00:30"
};

console.log(times);

for (var time in times) {
    var parts = times[time].split(':'),
        hour = parts[0],
        minutes = parts[1];

    if (hour > 12) {
        times[time] = (hour - 12) + ':' + minutes + ' pm';
    } else if (hour == 0) {
        times[time] = 12 + ':' + minutes + ' am';
    } else if (hour == 12) {
        times[time] += ' pm';
    } else {
        times[time] += ' am';
    }
}

console.log(times);

http://jsfiddle.net/tqXCL/3/

Which gives you the following after conversion:

SaturdayClose "9:00 pm" 
SaturdayOpen  "10:00 am"    
SundayClose   "12:00 pm"    
SundayOpen    "6:00 pm" 
WeekdayClose  "9:00 pm" 
WeekdayOpen   "10:00 am"    
WeekendClose  "12:30 am"    
WeekendOpen   "12:15 pm"
Answer

If you want to use the html, not the json, you can do this.

dateEl.innerHTML=dateEl.innerHTML.replace(/(\d\d)(:\d\d[ap])/g,function(m,hour,suffix) {
  return (+hour+11)%12+1+suffix;
});

Note that this assumes you've set dateEl to the appropriate element, and that that element does not contain other times that you don't want to convert.

Answer

Take a look as date.js. It is full of handy date conversion functions.

Answer

DEMO

window.onload=function() {

  var re=/(\d{2}:\d{2}[ap])/gi
  var times = document.getElementById('times').innerHTML;
  var mil = times.match(re);
  for (var i=0;i<mil.length;i++) {
    var parts = mil[i].split(":");
    var hours = parseInt(parts[0],10);
    if (hours > 12) parts[0]=hours-=12;
    else if (hours==0) parts[0]=12
    times=times.replace(mil[i],parts.join(":"))
  }
  document.getElementById('times').innerHTML = times;
}
Answer

"Military time" (a.k.a. 24-hour time) is easily converted to 12-hour time via a simple modulo 12.

JSFiddle example:

var obj = {
    SaturdayClose: "21:00",
    SaturdayOpen: "10:00",
    SundayClose: "12:00",
    SundayOpen: "18:00",
    WeekdayClose: "21:00",
    WeekdayOpen: "10:00"
}, prop, $output = $('#output'), time, x, meridiem;

for (prop in obj) {
    if (obj.hasOwnProperty(prop)) {
        x =+obj[prop].substr(0, 2);

        if (x > 12) {
            x = x % 12;
            meridiem = "pm";
        } else {
            meridiem = "am";
        }

        time = x + ":00" + meridiem;

        $output.append("<li>" + prop + " " + time + "</li>");
    }
}

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.