Added NJT: New Jersey Transit train finder

[mattr555]

What does your instant answer do?
Finds the next New Jersey Transit train from one station to another.

What problem does your instant answer solve (Why is it better than organic links)?
It lets travellers search for a train instead of using a timetable.

What is the data source for your instant answer? (Provide a link if possible)
I was playing with transit data this weekend and made an endpoint myself. It is hosted for free on Google App Engine. It should stay within the free quotas unless it gets really bogged down, but response time seems fast enough. It exposes data sourced from a General Transit Feed Specification (GTFS) feed downloadable from the NJT website.

Why did you choose this data source?
The GTFS feed is the official source providing lines, stops, and schedules.

Are there any other alternative (better) data sources?
Not that I could find.

What are some example queries that trigger this instant answer?
next train from metropark to new york, njt from atlantic city to philadelphia

Which communities will this instant answer be especially useful for? (gamers, book lovers, etc)
Commuters that use NJ Transit

Is this instant answer connected to a DuckDuckHack instant answer idea?
No, but this is kind of a "warm up" to doing an MTA subway IA

Which existing instant answers will this one supersede/overlap with?
None

Are you having any problems? Do you need our help with anything?
Maybe design suggestions? Though I think it looks good as it is. Unfortunately, NJT doesn't really provide real-time data, only an XML Feed that isn't standard. NJT has DepartureVision that appears to be scrapeable, I'll see what I can do in my API.

Checklist

Please place an 'X' where appropriate.

[x] Added metadata and attribution information
[x] Wrote test file and added to t/ directory
[x] Verified that instant answer adheres to design guidelines(https://github.com/duckduckgo/duckduckgo-documentation/blob/master/duckduckhack/styleguides/design_styleguide.md)
[/] Tested cross-browser compatability

    Please let us know which browsers/devices you've tested on:
    - Windows 8
        [] Google Chrome   
        [] Firefox         
        [] Opera           
        [] IE 10           

    - Windows 7
        [] Google Chrome   
        [] Firefox         
        [] Opera           
        [] IE 8            
        [] IE 9            
        [] IE 10           

    - Windows XP
        [] IE 7            
        [] IE 8            

    - Mac OSX
        [] Google Chrome   
        [] Firefox         
        [] Opera           
        [] Safari          

    - iOS (iPhone)
        [x] Safari Mobile   
        [x] Google Chrome   
        [] Opera           

    - iOS (iPad)
        [x] Safari Mobile   
        [x] Google Chrome   
        [] Opera            

    - Android
        [] Firefox         
        [] Native Browser  
        [] Google Chrome   
        [] Opera

    - Linux (Ubuntu)
        [x] Firefox

[mattr555]

I went ahead and implemented a scraper from NJT's DepartureVision site. The IA looks like this:

Also, I just found #862. Should I redesign this IA like the mockup there?

[chrismorast]

@mattr555 this is looking great. I'd like to specify colors that match our palette better. Aside from red and yellow, are there any other colors that I need to consider while doing this?

[bsstoner]

I'm really excited for this one, the NJ Transit website is so bad. Thanks!

For MTA we should look at using the map, (maybe there's a way to use map for this one too? But as is the tiles alone are really useful). Happy to do the work internally to build out the map API for whatever we might need there. I think I submitted or voted for both these IA's 😄

[mattr555]

@chrismorast thanks. I can't really think of any other statuses now, but do you think that a specified "in X Min" should get a different color?

[chrismorast]

@mattr555 , I actually like the gray for the on time. @bsstoner, I'l be stoked to get maps working for this as well. It makes a lot if sense to put in the time if this IA is scalable to public transit in other cities.

[bsstoner]

We'd need 2 additional pieces of data I think to do the map:

1. polygon data for the train tracks
2. either lat/long of current train location or some kind of average speed from which we could estimate lat/long

Seems worth at least having a standard UI for these transit IA's. We also have the SEPTA one #862. I thought that was working with tiles, but seems like it's not triggering anymore.

[chrismorast]

Here are the colors. Id explore green as the option for "All Aboard" but open to using the yellow. Either way, here are color values for both.

[mattr555]

@chrismorast I take "All Aboard" to mean "hurry up or you'll miss the train" so I'll use yellow for that one. I also found use of "Boarding" and "Stand By" on the DepartureVision boards and assigned the green color to those.

@bsstoner The GTFS data from NJT can fulfill part 1. You may want to check out the GTFS spec on that one. It basically defines points along the track. Unfortunately, though, it looks like the closest real time data we have for the trains is the DepartureVision boards. I guess we could try calculating average speeds, but trains rarely run completely on time. I compensated for this fact by displaying trains from up to five minutes ago in the tiles.

[chrismorast]

@mattr555 Thanks! That works for me.

[moollaza]

@chrismorast @mattr555 I feel like the yellow should be reserved for "delayed" trains if that's possible? Green is always associated with "good" stuff, but yellows make me worried about what I'm looking at. Knowing SEPTA though, we'll be seeing a lot of yellow ;)

[chrismorast]

@moollaza , I agree but that wasn't listed as a status above. @mattr555 , is there a delayed status? If not, I can see the argument for using Yellow for "All Aboard" as it's more of a warning than green is.

[mattr555]

@moollaza @chrismorast I haven't encountered a "Delayed" yet, but sometimes an "In X Min" reflects that. The board would say "In 10 Min" if the train arrives at 1:10, even if the scheduled arrival time is 1:00. I fixed the API to return delayed trains, and will do some math in the JS to figure out if the train is delayed.

So, yellow for delayed trains, does that mean I should make the "All Aboard" green?

[chrismorast]

I'd say either green (#60ae50) or gray (#696969). There are pros and cons to each though.

open to either but I'm leaning towards green.

[mattr555]

I like the gray. I think there should be some difference between "Boarding" and "All Aboard".

[chrismorast]

Actually, one quick change on the yellow; can we change the color to #eea43e and make the text white? Let me know if that's visible enough.

[mattr555]

LGTM!

[mattr555]

@chrismorast Oh yeah, one more thing: I can display the track number if it's known. Should I put it in the footer with a · like how github does it? Or something else?

Also, (not directed at anyone in particular) would DuckDuckGo be interested in hosting the api themselves? I open-sourced the Google App Engine version here, and would be happy to port it to flask or another lightweight python framework. Maybe it would be worthwhile if we're planning on adding MTA data?

[chrismorast]

let me play around a bit with it. It's important to include it if it's available. However, with the added element it might take a minute to rework the format for optimum readability

[moollaza]

Any chance you can check the "to" and "from" destinations against a list of accepted NJT destinations? If we're going to have several train/subway instant answers we'll need to make sure we can prevent making unneeded API calls. No reason to query SEPTA if you're looking for NJT train times.

[mattr555]

This kind of fixes it on mobile, but we'll probably need to add a height value:

It kind of makes the tiles big on desktop though:

[moollaza]

Why don't we drop the track onto it's own line then? That seems to be causing the height/width issues

[chrismorast]

Yeah, I'd like to keep it to 1-line but it's just not working with the delayed line layout. Let's try moving track # to another line.

[mattr555]

Unfortunately, I'm still getting pretty large boxes:

I don't know a lot about the base class, is there a way I can have more control over the width?

[chrismorast]

Yeah, we should be shaving off about 50px (give or take a few) in width on each tile. Should look more like this. Also added a little more spacing (4px) between the status and the colored dot & line indicator.

(may need to add an extra pixel or two to the padding between the track number and the bottom edge of the tile too)

[jagtalon]

@mattr555 Yeah, you can set the width if you want like the airlines IA which is super wide:

[mattr555]

@jagtalon Cool!

[jagtalon]

I think this is ready!

https://ddh1.duckduckgo.com/?q=next+train+from+metropark+to+new+york
https://ddh1.duckduckgo.com/?q=train+times+to+Trenton+from+Secaucus
https://ddh1.duckduckgo.com/?q=next+train+from+Metropark+to+New+York+Penn

@zekiel @chrismorast @moollaza @russellholt What do you guys think?

[mwmiller]

@jagtalon Sorry if I'm butting in after this has already been discussed: Is there a different sort function which could be used such that 1:02 pm will sort after 12:34 pm?

[jagtalon]

@mwmiller Good catch

@mattr555 I wrote a function a while back for airlines which sorts the dates https://github.com/duckduckgo/zeroclickinfo-spice/blob/master/share/spice/airlines/airlines.js#L92 (maybe I should've put it in Spice.add, though)

[mattr555]

@mwmiller Thanks!

I also increased the width of the tiles a little because the "delayed from" message was being cut off with an ellipsis.

[mattr555]

After looking at the realtime data from DepartureVision, I really only noticed "Boarding" used at NY Penn Station and maybe Philadelphia. Other stations just use "All Aboard," so I decided to switch to the green color there. I also pushed a few changes to the api backend to improve reliability for times after midnight. I've updated the spice accordingly.

[jagtalon]

@mattr555 Oh that looks sweet. @chrismorast @zekiel What do you guys think?

[chrismorast]

A couple of things, can we change the font color on the cancelled train tiles to # bob? Also, should we link to the source on tile click?

BTW, other than that, this is looking awesome @mattr555 , Nice work!

[mattr555]

@chrismorast I think you mean #bbb? Unless you really want purple text :)

Re: the source URL, DepartureVision has a page for each train and the estimated stop times at each station. You can check this out by going to a station's DV page (eg http://dv.njtransit.com/mobile/tid-mobile.aspx?sid=MP) and clicking on one of the train's rows. I think this would be a good page to link to for each train.

[mattr555]

Excited for this!

[zekiel]

This is great! Really awesome work @mattr555

I'm trying to identify why some cases might be showing an instant answer when others don't. For example, if I use only a city name (without proper station callsign)

https://ddh1.duckduckgo.com/?q=next+train+princeton+junction+to+trenton (works)
https://ddh1.duckduckgo.com/?q=next+train+princeton+to+trenton (doesn't work)

or if I just pick cities from the list:

https://ddh1.duckduckgo.com/?q=next+train+from+matawan+to+plauderville
https://ddh1.duckduckgo.com/?q=next+train+from+east+orange+to+clifton

any insight there?

[mattr555]

@zekiel Right, I should've made this more clear from the beginning: The IA doesn't do connections, only two points accessible by one train ride.

Re: the Princeton/Princeton Junction example, they're actually two different stations. A shuttle runs between them connecting Princeton to the Northeast Corridor line. You can check out a map here.

[zekiel]

ahh, gotcha! thanks @mattr555

[chrismorast]

haha, yep @mattr555 , I meant # bbb... damn auto correct ;)

[jagtalon]

👍

[jagtalon]

@mattr555 It's live! :D https://duckduckgo.com/?q=next+train+from+metropark+to+new+york