danmunz / counselly Goto Github PK

The data from HUD JSON serves phone number as "###-###-####" and occasionally as "###-###-####-###," which I assume is a weird way of attaching the extension. It looks like we need to:

• Grab that from the JSON
• If there are three hyphens in the string, convert the last one to an comma (this seems to work: http://stackoverflow.com/questions/9838775/problems-using-extensions-in-tel-hyperlinks-on-android-4)
• Append +1 to it in the link

These look really funky:

• Need to inherit the right font from the rest of the damn thing
• The placeholder text doesn't actually extend the full width of the dropdown

The behavior should be: After locating a user, the tool provides the 10 (or however many we require) closest counseling agencies, and does this more by filter.

Questions for @rachelross89:

• Should filtering by radius be a secondary thing?
• Is there some threshold where we just say, "sorry, there aren't 10 counselors like this within 1000 miles"? How far is too far to be useful?

When a user re-filters in a way that changes search results:

Currently, a new set of pins drops on the map, but the old set just stays there, looking useless.

Ideally, the set of result pins would refresh every time a user re-filters. But the original location pin would remain in place. Gmaps seems surprisingly bad at letting you easily clear markers, and really bad at only letting you clear some markers.

Find a way to provide info about counselors who are national but phone-based, and may not come up in georesults

While they're what's in the JSON that HUD will provide, telling a user that a counseling agency knows about "HIC" and speaks "SPA" is pretty useless. We need a data dictionary to translate these into human-readable values:

• In the selection dropdowns
• In results (list, map)

I'm calling this a bug, because honestly.

This still uses fake data. We need real data from http://data.hud.gov/housing_counseling.html. I've emailed to register for a key, but no response yet.

Should be able to enter a physical address OR use HTML5 geolocation.

Use http://dribbble.com/shots/1089488-Stripe-Flag-Set, which is now free(!)

Currently, this is handled by setting

to scroll on overflow, but a cooler solution would be to let that get as long as it likes, and just stick the map to the top of the viewport as you scroll down. I've tried a few OOTB jquery libraries for this, and position:sticky is so new it's not even in http://caniuse.com/#search=sticky. There must be a better way!

Seems like there should be a more explicit behavior for "there are no results found" than just being like 'NOPE';.

You should be able to start over without hitting F5. The back button should work. Etc.

You should really be able to preview how many counselors are in your radius before moving onto step 3. No point filtering a list full of nothing.

Or, honestly, just add a link to http://browsehappy.com/.

Let's be real, the zoomscaler() function is pretty janky. Plus, it's going to get more unpredictable as #8 becomes a thing.

This thing pretty much requires JS to work.

My reasoning for this is that files from this address get sent with a plain/text header which can cause loading issues like the ones seen in chrome:

Refused to execute script from 'https://raw.github.com/HPNeo/gmaps/master/gmaps.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled. danmunz.github.io/:1

Refused to execute script from 'https://raw.github.com/datadesk/jquery-geocodify/master/jquery.geocodify.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled. danmunz.github.io/:1

Refused to execute script from 'https://raw.github.com/documentcloud/underscore/master/underscore.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.

When you hover over a pin it highlights the listing with a background-color change. Which is cool, I guess? But it could be better/more useful.

Currently just using a dummy URL. It should probably link off to gmaps driving directions between the two lat/long pairs. (In a new window.)

These need title text since it's not entirely clear what they mean, especially the ASL one. Ideally, the Spanish flag would have title text in Spanish.

While the site "works" pretty well on mobile and there's almost no fixed-width stuff in there, the experience is poor and should be re-thought for a mobile version.

Is it possible to get, maybe from HUD, a freshness date for various entries? (Last updated X/Y/Z.)

God only knows how hard this thing is to use with a screenreader.

The current UI for entering a radius is a text input box. This is bad because:

• It deprives users of a visual sense of adjusting distance
• Inputs don't really send awesome events; onkeyup refreshes every time the user presses a key while focused on the box, including backspacing, the up arrow (which does nothing), or just re-focusing on the browser window

One suggestion would be to use a slider-type deal to do this. The HTML5 range input element seems pretty slick (http://tutorialzine.com/2011/12/what-you-need-to-know-html5-range-input/), but has only-okay support (http://caniuse.com/#search=range).

In index.html there are a few scripts being called that do not exist, for example:

<script src="js/libs/modernizr-2.5.3.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/script.js"></script>

There is no js folder or assets that match the above, can this be deleted from the markup?

Per @rachelross89, it's not clear that counseling topic is very useful.

For example, start with "Chicago, IL" as location and set your search radius to 1mi. It finds a result that's actually 1.4mi away. I'm not sure if this is because of how I do rounding, converting from miles to meters and back, or both, but in the words of @rosskarchner, it needs fixed.