Add Multiple Species to a Spot

[Fish360]

Summary

An angler needs to ability to add 1 or more species to a spot.

NOTE: This wire frame and use cases is a suggestion on how to get this done. If there is a better way, then feel free to propose it. :-)

Use Case I: 1 species

• An angler is adding or editing a spot. (Fig. 1)
• The angler types in a species name in the species field and the matching species are listed.
• The angler selects a species from the list.
• Clicks save.

  Use Case I: More than 1 species

• An angler is adding or editing a spot.
• The angler types in a species name in the species field and the matching species are listed.
• The angler clicks the "+" button adjacent to the species field.
• The add species page is displayed. (Fig. 2)
• The angler types in a species name in the species field and the matching species are listed.
• The angler clicks the "+" button next to the a species from the list that he / she wants to add.
• The species is added to the "Species to add" list.
• The angler continues to add species.
• Clicks save.
• The Add/Edit spot page is displayed and the added species are displayed in the "Species" list.

  Fig. 1

Fig. 2

[yashsnehalshah]

@Fish360

Shall i take up this issue, Julio. Looks interesting to work on.

[Fish360]

@yashsnehalshah

Absolutely!
Assigned.

[yashsnehalshah]

======================================

======================================

======================================

[yashsnehalshah]

@Fish360

Hi Julio,

I have implemented major part of this feature. Some small errors lurk at someplaces for which i will ask professor to help.

The screenshots elaborate the working of the functionality. Pic 1) User wants to add a new spot. To add species, user clicks the "+" button.

Pic 2) User is redirected to the "add species" page. Here using the dropdown, user can add multiple species by selecting one at a time from dropdown and then hitting the "+" button. The species he selects keep listing below which can also be removed by clicking the trash button. Once done user clicks the check button and the data is saved and he is redirected back to the "add spot" page where he again clicks check after verifying everything.

Pic3) User wants to edit a spot. User can see all the species related to that spot in the "edit spot" page. User clicks on the pencil button to edit species for a spot.

Pic4)User is redirected to a "add/edit species" page where he can either remove any species or add new from the dropdown. His previously added species will be already listed below the dropdown and the new additions will be reflected here as well. Once done, user clicks on check. Now again he will be redirected back to the "edit spot" page where after verification, he can click check to save the edit.

[Fish360]

@yashsnehalshah,

Yash,

Very well done!

I am looking forward to testing this fishy feature!!! ;-)

[yashsnehalshah]

@Fish360

Thanks Julio. I have not created a pull request for this issue, as i am having minor technical errors which I shall discuss with professor(on his first availability) and improve the code based on his insights:-)

[yashsnehalshah]

@Fish360

@jannunzi

Hi Julio, I was thinking about one way we can redesign the page navigation. As of my current implementation, to add a new group(not present in dropdown) or add/edit multiple species to a pot, the user is redirected to different pages. Instead of this, can we have this functionality on the spot add/edit page itself? Like it will be inside a hidden div which will be displayed only when the user clicks on "add/edit species" or "add new spot group" button. This is just to reduce the number of pages in our site. What are your thoughts?

[Fish360]

@yashsnehalshah

Yash,

Brilliant! Go for it.

[yashsnehalshah]

@Fish360

Sure Julio. I wanted your consent before working on it as it will involve some redesigning. Will start on it. Thank you.

[yashsnehalshah]

@Fish360 Hi Julio,

As per our discussion, the new clean, less bulky version of the feature.

On the new spot page itself, user selects multiple species using the dropdown and "+" button. Select a specie from dropdown and click "+" to add it. You can also remove an added specie using delete button.

After this spot is saved, one can edit the species by going to the edit spot page.

Here user can delete previously added species or add new ones and then save. Everything on one page. Its a game of divs now, rather than a game of pages.

[yashsnehalshah]

I will create pull requests. Can you assign me new issues.

Thanks,

Yash

[Fish360]

Test Results

This user story works perfectly!

Well done @yashsnehalshah

[Fish360]

@jannunzi,

1. Passed re-test on test environment (https://fish360-journal-test.herokuapp.com).
2. Please deploy this bug fix to the production environment (https://fish360.herokuapp.com).