OpenMRS ID UI Revamp

Google Code-in 2014 Project

The topics discussed on this page will be submitted as tasks for the 2014 year of Google Code-in.

On this page

Getting Started

The easiest way to set up a development environment is by using Nitrous.IO, which will give you a web-based code editor and linux terminal for you to work on OpenMRS ID. Follow these steps:

Press the hack button below to go to a pre-configured Nitrous box and sign up for an account:
Choose "Start hacking in a new box"
On the next screen, set your storage to 2000MB and your region to US East. OpenMRS ID and its background services need around 2GB of space to run. If you don't use US East, you'll have to manually adjust the serverURL in conf.js. Other settings can stay at their defaults.
- You can change your resource settings at any time by clicking "Settings" on your box from the "Boxes" screen within Nitrous.
Press "Create Box" and wait for the box to be provisioned.
In the webapp that launches, follow the instructions in the file opened on your screen (quickstart.md). You'll run a shell script that will install OpenMRS ID dependencies and leave you with a working environment. This may take a while, so be patient!
- If quickstart.md doesn't open automatically, you can open it by browsing to ~/workspace/openmrs-contrib-id/nitrous/quickstart.md
Once complete, you can start OpenMRS ID by navigating to "~/workspace/openmrs-contrib-id" and running "node app/app". OpenMRS ID will start on port 3000.

Alternatively, to install OpenMRS on your local machine, follow the instructions in our install document.

Background

Recently, Hannah Downey published a set of wireframes consisting of design and usability improvements for the OpenMRS ID Dashboard. The goal of this project is to implement these new designs into Dashboard HTML/CSS.

The design has been split up into ~15 distinct tickets, shown below. Each ticket should only consist of the work for that element of the new UI.

Submitting Changes

Work on each UI ticket should be submitted as a pull request on GitHub. See Using Git for tips on how to get started with Git. You could also check out GitHub's article Good Resources for Learning Git and GitHub.

Nitrous users: Nitrous comes with git preinstalled and the openmrs-contrib-id repository already checked out in ~/workspace/openmrs-contrib-id. So, all you need to do is create a fork of openmrs-contrib-id using GitHub, then add it as a git remote. From there, create a branch for your specific task, do work on it, and push your changes to GitHub. Then from GitHub you can create a pull request back to the upstream repository.

Epic Status

Error rendering macro 'jira' : Unable to locate Jira server for this macro. It may be due to Application Link configuration.

key	summary	type	created	updated	due	assignee	reporter	priority	status	resolution
Unable to locate Jira server for this macro. It may be due to Application Link configuration.

Tasks organized by component

Page Templates
- Sign up
  - As a person signing up for an ID, I expect to see a page with a single form that I need to fill out in order to create my account.
  - If there are restrictions on my username or password, those restrictions need to be presented to me
  - I need to be notified of there are any validation errors with my sign up information.
  - I want to know what OpenMRS ID is before I sign up.
  - https://issues.openmrs.org/browse/ID-71
- Session manager
  - Sign in
    - As an OpenMRS ID user, I want to sign in by entering my OpenMRS ID username and password, so that I can access the authenticated areas of the site.
    - https://issues.openmrs.org/browse/ID-72
  - Reset Password
    - As a user who has forgotten their password, I want to provide a credential I know, like my username or email address, that will allow me to reset my password.
    - As a user who has forgotten their OpenMRS ID username, I want to be able to provide my email address so that I can receive an email telling me what my OpenMRS ID is.
    - https://issues.openmrs.org/browse/ID-73
- Welcome page
  - As a new user, I want to know what I should do now that I've sign up, so that I can get connected with the community.
  - As an OpenMRS community manager, new users should be directed to the massive Discourse "introduce yourself thread".
  - As a community manager, the secondary call to action on this page should direct users to sites they can use their OpenMRS ID.
  - https://issues.openmrs.org/browse/ID-74
- Edit account page
  - As an OpenMRS ID user, I should be able to edit my basic account information from a single, centralized page.
  - https://issues.openmrs.org/browse/ID-75
  - Edit name, profile picture, password
    - As a user, I should be able to change my first and last name in my OpenMRS ID.
    - I should be able to edit my password, but for security reasons should have to enter my current password first.
    - As a community manager, users should know that they need to navigate to Confluence to change their system profile picture.
    - https://issues.openmrs.org/browse/ID-76
  - Edit email addresses
    - I should be able to add new email addresses to my profile.
    - I should be able to delete email addresses from my profile.
    - I should be able to change my default email address, the address used for system notifications.
    - An email address I enter should be verified before I can use it, to prevent another user from spamming me.
    - https://issues.openmrs.org/browse/ID-77
  - Edit location and organization/clinic affiliation
  - Edit connected OAuth apps
    - I should see apps that use my OpenMRS ID for their login. I should be able to disconnect / revoke those apps' access to my OpenMRS ID.
    - https://issues.openmrs.org/browse/ID-78
- Mailing list subscription page
  - As an OpenMRS ID user, I want to see all OpenMRS mailing lists on a single page.
  - As an OpenMRS helpdesk agent, I want users on the mailing list page to know how to add additional email addresses.
  - https://issues.openmrs.org/browse/ID-79
  - Mailing list widget
    - As a user with one email address, I want to be able to subscribe to a mailing list with a single action.
    - As a user with multiple email addresses, I need to be able to choose what address I use to subscribe to a mailing list. By default, my default email address should be used.
    - https://issues.openmrs.org/browse/ID-80
Page Layout
- Navigation bar
  - As an OpenMRS ID user, I should be able to navigate to different areas of the site easily.
  - https://issues.openmrs.org/browse/ID-68
- Site header
  - As a user, I should know that the site I'm using is an OpenMRS site.
  - Session status (included in parent ticket)
    - As a user, I should see the profile I am signed in as.
    - I should easily be able to sign out.
  - https://issues.openmrs.org/browse/ID-69
- Site footer
  - As an administrator, I want to be able to tell what version of the Dashboard is running
  - As an ID Dashboard developer, I want users to know the software that they are using, so that they may contribute to the Dashboard, file bugs, and get involved with its development
  - https://issues.openmrs.org/browse/ID-70