Flutter iOS and Android app showing documents from server -- 2
Budget: $250 – $750 USD
Overview: Show PDF, JPEG and PNG files from a server, grouped by day
Design concept: https://www.figma.com/proto/u15fyQz5YG3xwOfJffPV5q/Untitled
Functionality:
- Screen 1: User types provided name and password. Load files through WebDAV for that user (details below). Go to Screen 3 on success. On failure, show an error message "Invalid Login".
. "Kein Zugangscode" -> popup (Screen 2)
. Button next to "Sanascreen": Link to https://sanascreen.com
- Screen 3: Calendar view with documents per day. In WebDAV folder, there are folders named after the date, e.g. "2023_03_28". Show all the documents for the given day in a list, with a small icon indicating the document type (details below). When the user taps a document, show it full-screen => Screens 5 and 6 (depending on device orientation).
Some documents should be cached on the device s.t. it works offline, too. Documents one week back and and two weeks in advance. At end/start of list, if online show a loading icon until the contents are loaded and if offline show a message that the device is offline.
- Screen 4: When clicking the profile icon on top of Screen 3, show a popup with the current account name and a button to log out, i.e. to return to Screen 1.
- Screen 5:
. shrink font to show full title if name too long
- Screen 6:
. disappearing navigation bar (only show when scrolling up / tapping on screen)
Server folder structure:
- USERNAME/
- permanent_start/
- permanent_end/
- special/
- configuration.json
- 2023_03_28/
- 2023_03_29/
- ...
Document types: PDF, JPEG, PNG, slideshows (folder with the aforementioned documents) (no further recursion)
- slideshows should automatically switch contents (on Screens 5 and 6) according to special/configuration.json -> SLIDESHOW_AUTO_ADVANCE_SECONDS
Document selection: For a given day, show a list of the documents for that day. Start with the documents in permanent_start, then the documents in the day's folder (e.g. 2023_03_28), then the documents in permanent_end. Sort each folder alphabetically by file name when compiling the list.
- The documents names displayed should drop any leading numbers and whitespaces, the file extension and any characters starting from an underscore.
Title bar in Screen 3: load second line from folder special/configuration.json -> ACCOUNT_DISPLAY_NAME
Localization: Use system language for text localization. If language not available, default to English. Texts in language files for German, French, English.
WebDAV access: First field in Screen 1 is USERNAME. Use USERNAME + "_appuser" and password from second field to access WebDAV.
Colors:
- Screen 1 as in design. Other screens personalized as follows.
- background with color gradient, top to bottom
- read colors from special/configuration.json
. BACKGROUND_COLOR_TOP (dark blue), BACKGROUND_COLOR_BOTTOM (light blue), MENU_TEXT_COLOR (gray), LIST_TITLEBAR_COLOR (red), LIST_BACKGROUND_COLOR (gray), LIST_TEXT_COLOR (black)
Deliverables:
- Code and assets for the iOS and Android apps, in a state that the code can be adapted and extended in the future. I.e. it should be human-readable, have good code quality and include any code and instructions needed to generate parts of the code.
- The apps should adhere to the rules of the Apple App Store and the Google Play Store, so that they can be published as is.
- To the extent allowed by law, all the rights to the code and assets shall be transferred to the hiring party. Open-source code can be used only if it has a permissive license (e.g. MIT, BSD, Apache).
Design concept: https://www.figma.com/proto/u15fyQz5YG3xwOfJffPV5q/Untitled
Functionality:
- Screen 1: User types provided name and password. Load files through WebDAV for that user (details below). Go to Screen 3 on success. On failure, show an error message "Invalid Login".
. "Kein Zugangscode" -> popup (Screen 2)
. Button next to "Sanascreen": Link to https://sanascreen.com
- Screen 3: Calendar view with documents per day. In WebDAV folder, there are folders named after the date, e.g. "2023_03_28". Show all the documents for the given day in a list, with a small icon indicating the document type (details below). When the user taps a document, show it full-screen => Screens 5 and 6 (depending on device orientation).
Some documents should be cached on the device s.t. it works offline, too. Documents one week back and and two weeks in advance. At end/start of list, if online show a loading icon until the contents are loaded and if offline show a message that the device is offline.
- Screen 4: When clicking the profile icon on top of Screen 3, show a popup with the current account name and a button to log out, i.e. to return to Screen 1.
- Screen 5:
. shrink font to show full title if name too long
- Screen 6:
. disappearing navigation bar (only show when scrolling up / tapping on screen)
Server folder structure:
- USERNAME/
- permanent_start/
- permanent_end/
- special/
- configuration.json
- 2023_03_28/
- 2023_03_29/
- ...
Document types: PDF, JPEG, PNG, slideshows (folder with the aforementioned documents) (no further recursion)
- slideshows should automatically switch contents (on Screens 5 and 6) according to special/configuration.json -> SLIDESHOW_AUTO_ADVANCE_SECONDS
Document selection: For a given day, show a list of the documents for that day. Start with the documents in permanent_start, then the documents in the day's folder (e.g. 2023_03_28), then the documents in permanent_end. Sort each folder alphabetically by file name when compiling the list.
- The documents names displayed should drop any leading numbers and whitespaces, the file extension and any characters starting from an underscore.
Title bar in Screen 3: load second line from folder special/configuration.json -> ACCOUNT_DISPLAY_NAME
Localization: Use system language for text localization. If language not available, default to English. Texts in language files for German, French, English.
WebDAV access: First field in Screen 1 is USERNAME. Use USERNAME + "_appuser" and password from second field to access WebDAV.
Colors:
- Screen 1 as in design. Other screens personalized as follows.
- background with color gradient, top to bottom
- read colors from special/configuration.json
. BACKGROUND_COLOR_TOP (dark blue), BACKGROUND_COLOR_BOTTOM (light blue), MENU_TEXT_COLOR (gray), LIST_TITLEBAR_COLOR (red), LIST_BACKGROUND_COLOR (gray), LIST_TEXT_COLOR (black)
Deliverables:
- Code and assets for the iOS and Android apps, in a state that the code can be adapted and extended in the future. I.e. it should be human-readable, have good code quality and include any code and instructions needed to generate parts of the code.
- The apps should adhere to the rules of the Apple App Store and the Google Play Store, so that they can be published as is.
- To the extent allowed by law, all the rights to the code and assets shall be transferred to the hiring party. Open-source code can be used only if it has a permissive license (e.g. MIT, BSD, Apache).