Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added the loading property to google-map-search. #370

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

tekkamanendless
Copy link

I try to minimize the amount of Javascript that my elements need to function, and the lack
of a loading property on google-map-search forced me to do a lot more event handling than
I would have liked. So, I added one.

Essentially, loading defaults to false. It is set to true in the search method, and it
is set to false once again in the _gotResults method. It is updated before google-map-search-results
is fired, so that event will properly occur once all search actions are complete.

I also added a unit test around searching. I noticed that most of the tests won't run properly
without an api-key set on the google-map, so I guess that we'll all just have to insert our
own during testing? Kinda strange.

Anyway, this will now let you easily notify your users that a search is in progress. Previously,
this had to be done with a lot more hooks and events.

<google-map-search map="[[map]]" results="{{results}}" loading="{{loading}}"></google-map-search>

<template is="dom-if" if="[[loading]]">
  Loading...
</template>
<template is="dom-if" if="[[!loading]]">
  <ul>
  <template is="dom-repeat" items="[[results]]">
    <li>[[item.formatted_address]]</li>
  </template>
  </ul>
</template>

I try to minimize the amount of Javascript that my elements need to function, and the lack
of a `loading` property on `google-map-search` forced me to do a lot more event handling than
I would have liked.  So, I added one.

Essentially, `loading` defaults to false.  It is set to true in the `search` method, and it
is set to false once again in the `_gotResults` method.  It is updated before `google-map-search-results`
is fired, so that event will properly occur once all search actions are complete.

I also added a unit test around searching.  I noticed that most of the tests won't run properly
without an `api-key` set on the `google-map`, so I guess that we'll all just have to insert our
own during testing?  Kinda strange.

Anyway, this will now let you easily notify your users that a search is in progress.  Previously,
this had to be done with a lot more hooks and events.

```
<google-map-search map="[[map]]" results="{{results}}" loading="{{loading}}"></google-map-search>

<template is="dom-if" if="[[loading]]">
  Loading...
</template>
<template is="dom-if" if="[[!loading]]">
  <ul>
  <template is="dom-repeat" items="[[results]]">
    <li>[[item.formatted_address]]</li>
  </template>
  </ul>
</template>
```
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants