1035760 - [B2G][Contacts] support 24 hour time format

Status: VERIFIED FIXED

(Firefox OS Graveyard :: Gaia::Contacts, defect)

Description

[howie [:howie]]

There will be a setting toggle to let user choose between 12/24 hour time format in v2.1. User story and settings spec: Bug 903683

For each app, the tasks to do after toggle is added would be:
1.Read/listen to the time format toggle value/change event.

2.Input the corresponding time format to existing mozL10n.DateTimeFormat() function. Currently the input time format should be a fixed 12 hour 
shortTimeFormat = %I:%M %p , line 201 of http://goo.gl/DR4CNe. There will be a 24 hour time format added.

3.Show the return of the function as it's doing now.

Comment 1

[Stephan Leroux]

Hey there! I'm new to the Mozilla community and would like to get started with helping out on the Gaia project. I've been reading up on this feature and I've caught up on the discussion threads on Bug 903683 regarding the API spec in discussion and wouldn't mind helping update the contacts app when the spec is ready. Let me know what some of the next steps I can take are.

Thanks!

Comment 2

[Francisco Jordano [:arcturus] [:francisco]]

Hi Stepahn!

Good to have you starting on the project.

This bug has some blockers, but we can advance some work.

The part that we can implement is adapting the time format based on a variable, and hardcode the format used.

After bug 1023735 lands, we can do a followup to get the format from settings and change screen on the fly.

Are you familiar with gaia development?

Comment 3

[Stephan Leroux]

Thanks!

This will be my first work on the Gaia project. I've explored the repo and have it setup and running. I've worked on similar products in the past (front-end OS development in Javascript). I'm a tad rusty on Javascript styling but I'm sure it can be worked out through the review process.

I figured a good place for the change would be in the gaia/apps/communications/contacts/js/contacts.js file. I see there are already event handlers here for listening for the oncontactchange event. When the API gets resolved I assume I'd add another handler for changing the time format. Is your suggestion to refactor the current time format code into a variable which we'll configure in the event handler when the API is solid?

Comment 4

[Francisco Jordano [:arcturus] [:francisco]]

Sweet!

First we need to identify the places where we use time in the contacts app.

So far in my mind I have just one place, in the settings, the import functionality, once you import from each source will tell you when you did that.

If the functionality is isolated just there we can move that to settings.js,  what do you think?

Comment 5

[Stephan Leroux]

Yup that makes the most sense. I see the time label in the import contacts list view. I'll make the update there.

Comment 6

[Stephan Leroux]

Looks like the import view is getting it's time displayed from Line 1004 inside contacts/js/views/settings.js (not sure how to link out to the actual source file) but it seems that it's using a global utility library which I can't seem to find (or it gets generated). If that's the case, the utility library might be getting used across multiple apps which would isolate the need for checking the date format change to the utilities library. Thoughts?

Comment 7

[Sudheesh Singanamalla (:ShellHacker)]

Helping Stephan by needinfo'ing Francisco :)

Comment 8

[Francisco Jordano [:arcturus] [:francisco]]

Hi Stephan,

No problem about linking to specific files or lines of code, just in github, click in the line number and you'll get a link to that specific line of code, like this:

https://github.com/mozilla-b2g/gaia/blob/master/apps/communications/contacts/js/views/settings.js#L1008

The utility library that you are mentioning, I guess here:

https://github.com/mozilla-b2g/gaia/blob/master/apps/communications/contacts/js/views/settings.js#L1021

Our code base is a bit complicated, you can find the sources for that file here:

https://github.com/mozilla-b2g/gaia/blob/master/apps/communications/contacts/js/views/settings.js#L1021

Cheers,
Francisco

Comment 9

[Stephan Leroux]

I think you accidentally pasted the same link for the utility library sources as the line that I mentioned. Do you know where the utils library lives?

Comment 10

[Stephan Leroux]

I think you accidentally pasted the same link for the utility library sources as the line that I mentioned. Do you know where the utils library lives?

Comment 11

[Stephan Leroux]

Nevermind found it here:

https://github.com/sleroux/gaia/blob/master/apps/communications/contacts/js/utilities/normalizer.js#L11

Comment 12

[Francisco Jordano [:arcturus] [:francisco]]

Sorry Stepahn, yes it was the normalizer, not the most useful name.

Comment 13

[[e-mail]]

Test steps:

1. Open settings app
2. change the Time format settings in Settings > Date & Time > Time Format panel

Expect:

The time format in contacts app will be changed.


here's the patch steps to apply correct time format:

1. include navigator.mozHour12 API shim in gaia app's html

```
<script defer src="shared/js/date_time_helper.js"></script>
```

(currently we still need at least `settings: readonly` permission in manifest, which might changed in next release)


2. detect proper time format via mozHour12 API, and get correct time format string from new 'shortTimeFormat12'/'shortTimeFormat24'.

```
var timeFormat = window.navigator.mozHour12 ? _('shortTimeFormat12') : _('shortTimeFormat24');
```

3. call mozL10n DateTimeFormat to localize it


4. listen to 'timeformatchange' event and localize time strings when its triggered


The full usage is at [3](WIP) for reference.


[3] https://github.com/mozilla-b2g/gaia/pull/22757/files

Comment 14

[Francisco Jordano [:arcturus] [:francisco]]

Hei Stephan,

do you still feel with energy to solve this bug?

Comment 15

[Stephan Leroux]

Hey sorry for going quiet on this one. I probably won't have much time to tackle this for a while. Feel free to assign it to someone else. Thanks!

Comment 16

[Francisco Jordano [:arcturus] [:francisco]]

(In reply to Stephan Leroux from comment #15)
> Hey sorry for going quiet on this one. I probably won't have much time to
> tackle this for a while. Feel free to assign it to someone else. Thanks!

No worries, I'll take this one, feel free to pick any other bug when you have time!

Comment 17

[Francisco Jordano [:arcturus] [:francisco]]

Attachment: Pointer to PR 22930

Comment 18

[Francisco Jordano [:arcturus] [:francisco]]

Attachment: 2014-08-16-15-45-06.png

Example of where we are using the new time format (only place in this app)

Comment 19

[Sergi Mansilla [:sergi] (Telenor) [PTO]]

It seems a bit cumbersome that every single app that displays dates in the device will have to do so much book-keeping (listening to events, etc) just to make sure that a date is being displayed according to users' preferences. Shouldn't every date just be updated accordingly without the app having to take care of the whole update mechanism?

Comment 20

[Francisco Jordano [:arcturus] [:francisco]]

(In reply to Sergi Mansilla [:sergi] (Telenor) from comment #19)
> It seems a bit cumbersome that every single app that displays dates in the
> device will have to do so much book-keeping (listening to events, etc) just
> to make sure that a date is being displayed according to users' preferences.
> Shouldn't every date just be updated accordingly without the app having to
> take care of the whole update mechanism?

Unfortunately we don't have a mechanism to perform this changes globally right now.

To be honest, seems this could be moved to mozL10n.DateTime in the future, marking a node as date type and that library doing all the magic.

Sounds like a great topic for dev-gaia.

Unfortunately, right now we have to do per app changes, look that blocked bug 903683 is a meta bug for hosting all in app changes :(

Comment 21

[Francisco Jordano [:arcturus] [:francisco]]

*date -> *time type ;)

Comment 22

[Sergi Mansilla [:sergi] (Telenor) [PTO]]

r+ for me. Merged at fb4e90615123a35740320ff514d64774c1e53940.

Comment 23

[Johan Lorenzo [:jlorenzo]]

Removing the in-moztrap flag. This is already handled in bug 903683 comment 90.

Comment 24

[Eric Chang [:ericcc] [:echang]]

Verified User story is fixed.  24 hour format shown after import contacts.

Gaia      2be78d83a760fa3b9638fe51c266b442d14597f1
Gecko     https://hg.mozilla.org/mozilla-central/rev/1db35d2c9a2f
BuildID   20140831160203
Version   34.0a1
ro.build.version.incremental=110
ro.build.date=Fri Jun 27 15:57:58 CST 2014
B1TC00011230

Comment 25

[Loli (:lolimartinezcr)]

Tested and working
Flame
2.1
Gecko-039bd5d
Gaia-95e9b09