Stack workers
Contents
- 1 Data Element Bulk Editor
- 1.1 Overview
- 1.2 Features
- 1.3 Architechture and Technologies
- 1.4 Time schedule
- 1.5 Milestone 1 (1st November)
- 1.6 Milestone 2 (15th November)
- 1.7 Milestone 3 (30th November)
- 1.8 How you are dividing tasks within the group
- 1.9 Screenshots and screen flows
- 1.10 Demo
- 1.11 Documented learning during project
- 1.12 Suggested improvements to APIs etc
- 1.13 Link to repository
- 1.14 Download link to sample web app or Android app
Data Element Bulk Editor
Overview
Data Elements Bulk Editor is a DHIS webapp. It enables administrators, and users, to manage data fields associated with forms and various value types in DHIS. The app is visually designed in a similar manner to the current Data Element Editor, however, under the hood it is a faster, lighter, and more server-independant app.
When we started this project the goal was to make a smarter editor that allows for quick search and edit operations on form data fields.
List of group members
- Magnus Lien (Magnus)
- Hanieh Alibakhsh(Hanieh)
- Shayan Yazdanmehr (Shayan)
Features
- Filtering fields
Sort result set based on aggregate and tracker (Not implemented yet)- Edit fields without leaving page (Editing is not feature complete yet)
- Add and remove fields (Add is not implemented yet)
- Detailed view of fields
- Responsive layout that adapts to screen size
Tested and verified on :
- Chrome ver: 39.0.2171.71
- FireFox ver: 32.0.3
- Internet Explorer ver: 11.0.9600.17416
- Internet Explorer Mobile (Lumia 920) ver: 11
- Safari ver: 5.1.7
- Safari Mobile (Iphone 5) ver: ?
Architechture and Technologies
Application Framework
- HTML5, CSS, JS
- Bootstrap
- Angular
- UI-Angular
- UI-Bootstrap
Developers' Tools
- Webstorm
- Sublime Text 3
- Chrome, Safari, IE, Firefox (debugging with integrated tools, and testing)
- OS X, Ubuntu, Windows 7 & 8
- Git w/ Github
HTML5, CSS and JS
These are the core technologies that make up the front end of modern web applications.
AngularJS
We primarily rely on angularJS for our project framework. We chose this technology because we wanted our app to be a single page application. The result is that all the pages are build as partial HTML templates and we inject their content into a single page. Angular is an exellent engine for building solid SPAs. We benefit from double databinding, templating, routing, data services and many of the other powerful features that angular provides.
We extended angular by adding better routing functionality and directive templates using ui-router and ui-bootstrap, respectively. These plugins work seamlessly with angular.
Bootstrap
Bootstrap is used for easy, seamless and modern styling of our app.
Time schedule
Milestone 1 (1st November)
- Document features and architecture on Wiki
- Show understanding of DHIS2 web apps
Milestone 2 (15th November)
- First bare-bone version - static HTML
- Uploadable as DHIS2 web app
Milestone 3 (30th November)
- Finished, if applicable also with mobile app.
Final delivery: 8th December
Presentation 9th December
How you are dividing tasks within the group
We worked a lot as a group. So we agreed on individual tasks during meetings, and we used facebook private group as a messaging board.
Screenshots and screen flows
(*) Navigating and browsing using Internet Explorer 11 Mobile on a Lumia 920
(*) The index page with Chrome on PC
Demo
https://www.youtube.com/watch?v=0IhbFgngYzg&feature=youtu.be
Documented learning during project
We used many different approaches for learning Angular and JS. Here are the channels we used the most for educating ourselves, and debugging the app, while working the project.
YouTube
- Learn Angular basics in 60 minutes - https://www.youtube.com/watch?v=i9MHigUZKEM
- Introuction to Angular in 50 parts - https://www.youtube.com/watch?v=TRrL5j3MIvo
StackOverflow
- Observed forum talks and used the support channels
- If it isn't here, it doesn't exist.
Suggested improvements to APIs etc
We suggest the API documentation can be better and helps developers by adding more examples which explain how developers can send request and what objects can they get from the server. In addition we think the documentation for working with the RESTfull service,Adding,deleteing and saving, is a little bit ambiguous.
Link to repository
https://github.com/magnli10/inf5750-debe
Download link to sample web app or Android app
NB: Due to login redirection not working properly, it is required to login with DHIS before opening the app. The DHIS API does not accept requests from anonymous clients.
http://inf5750-21.uio.no/dhis-web-maintenance-appmanager/appList.action