Challenge Overview
This challenge is part of the HPE Live Blitz Challenge Series. Make sure to check it out!
The goal of this challenge is to integrate the ionic app with client API, the output of this challenge will be a working app on both Android and iOS devices.
Challenge Requirements
API Info
Please refer here for the API documentation, we are using a single endpoint which is /search endpoint that will be used in the listing dashboard and to view details screen.
http://docs.oercommons.org/api/
Please check forums for access key to use for the api.
API Constraints:
- Right now it’s set to a limit of 200 calls for beta testing. When this is consumed, please post in forums to see if we can reset it with the client team help.
- The API is not currently designed to handle large amounts of requests at one time. Client recommends distributing calls to 2 req/sec.
Integration Screens
Dashboard Screen
This screen is similar to this page from client website https://www.oercommons.org/browse?f.provider=23andme
Basically the API will return list without the need to to specify any query string in the call, so you need to allow passing pagination parameters to limit number of items to be returned. The batch size should be configurable.
The mapping between the API#Result entity and the Dashboard Item is similar to the items rendered in the client website mentioned above, to summarize it :
- The API does not have an entry for the dashboard item image, so we will keep using the image as in the mobile app.
- Title is Result#title
- Subtitle is using the abstract but will subtract if the string is longer than a line width as in the app.
- The stars is set using result#rating, if not set then there is no rating, and it is empty 5 stars.
- Subject is result#f.general_subject, you need to read value attribute, split it by comma, and render the array properly.
- Type is result#f.material_types and you need to do same as item (5)
- Author is the provider
The page will support pagination via auto scrolling, so when reaching button of the list it will load more items.
Tapping on item will take user to content details.
Content Details Screen
This screen will simply render the selected item from dashboard, we don’t have separate api for it. We are only implementing the first tab where it list details of the content.
This screen corresponds to this screen in client website https://www.oercommons.org/courses/human-prehistory-101-part-3-of-3-agriculture-rocks-our-world
The mapping should be straightforward by comparing both screens, if you need any clarifications please ask in forums.
Share and Download options are not in scope.
View option will open the content in web view, the content is the result#url.
Any xml item with comma separated values should be parsed and rendered properly.
Tapping on the tag at bottom will open search filtered using that tag. Basically make API calls by passing the tag value, it corresponds to f.keyword query string.
Search/Filter Option
We have two search in the dashboard :
Simple Search :
This basically uses f.search in the API call.
Advanced Search :
- When tapping on the filter icon it will take user to the advanced search/filter screen.
- The list should be updated to fill the one mentioned in the documentation http://docs.oercommons.org/api/ which is similar to the client website screen https://www.oercommons.org/advanced-search , the prototype is supposed to have these populated properly but you need to copy the values properly and make sure all options work in the call.
- User will be able to select multiple filter values, and when tapping Search will make the api call and render result.
- If reset is clicked it should reset the filter option.
- In search result screen, user can delete a tag which will re-do another call to the API with that tag dropped with other parameters kept in the call.
- User can update ordering of the result.
- Clicking cancel will cancel search and take user back to the dashboard screen.
- User can tap on the filter icon to the left of the tags in search result to go back to filter and edit existing search filter options.
- Tapping on item will take user to content details.
Notes
- Your solution must work properly on both Android and iOS.
- If there is any CSS issue you are required to fix it here.
UI Prototype
Provided in challenge forums.
���
Final Submission Guidelines
Deliverable
- Updated UI Prototype integrated with the API Login.
- Updated README file with instructions.
- Verification Document.