diff --git a/README.md b/README.md
index 8e60ac6..4a0ba0e 100644
--- a/README.md
+++ b/README.md
@@ -1,171 +1,302 @@
 Django User Map
 =================
 
-[![Stories in Ready](https://badge.waffle.io/aifdr/inasafe-user-map.png?label=ready&title=Ready)](http://waffle.io/aifdr/inasafe-user-map)
-[![Develop Branch](https://api.travis-ci.org/AIFDR/inasafe-user-map.svg?branch=develop)](https://travis-ci.org/AIFDR/inasafe-user-map)
-[![Coverage Status](https://coveralls.io/repos/AIFDR/inasafe-user-map/badge.png?branch=develop)](https://coveralls.io/r/AIFDR/inasafe-user-map?branch=develop)
+Django User Map is a reusable django application for making community user's map. This app relies on the active auth user model and extend that model with OneToOne relationship. Users can add themselves on the map by providing some additional information:
 
+1. Location on the map
+2. Roles (the choices can be configured through setting)
+3. Image, and
+4. Website
 
-A django application for making community user's map. Users can 
-add themselves on the map by providing some information:
+Read here for the documentation: www.akbargumbira.com/django-user-map
 
-1. Name
-2. E-mail - will be used for authentication
-3. Password - will be used for authentication
-4. Website
-5. Role - The choices can be configured through setting.
-6. Location on the map
-
-Live site: http://users.inasafe.org
-
-Installation
-============
-1. Install django-user-map with pip:
-   ```
-    pip install django-user-map
-   ```
-
-2. Make sure you have all of these items in INSTALLED_APPS of your django 
-   project settings.py:
-   ```
-    INSTALLED_APPS = (
-        'django.contrib.admin',
-        'django.contrib.auth',
-        'django.contrib.contenttypes',
-        'django.contrib.sessions',
-        'django.contrib.messages',
-        'django.contrib.staticfiles',
-        'django.contrib.gis',
-        'user_map',
-        'leaflet',
-        'bootstrapform'
-    )
-   ```
-
-3. Include user-map URLconf in your project urls.py with namespace user_map (required) e.g:
-   ```
-    url(r'^user-map/', include('user_map.urls', namespace='user_map')),
-   ```
-
-3. Add authentication user model and authentication backend in your django 
-   project settings.py:
-   ```
-   AUTH_USER_MODEL = 'user_map.User'
-   AUTHENTICATION_BACKENDS = [
-    'user_map.auth_backend.UserMapAuthBackend',
-    'django.contrib.auth.backends.ModelBackend']
-   ```
-  
-4. Make sure to add template context processors needed by user-map: 
-   ```
-   TEMPLATE_CONTEXT_PROCESSORS = (
-    'django.contrib.auth.context_processors.auth',
-    'django.core.context_processors.request',
-    'django.contrib.messages.context_processors.messages',
-    'user_map.context_processors.user_map_settings',
-   )
-   ```
-
-5. Make sure to add mail server configuration on your project's settings.py 
-   so that this apps can send e-mail for some routines e.g sending confirmation 
-   e-mail after registration. If you are going to use SMTP server using your 
-   Gmail account, the configuration looks like this:
-    ```
-    EMAIL_USE_TLS = True
-    EMAIL_HOST = 'smtp.gmail.com'
-    EMAIL_PORT = 587
-    EMAIL_HOST_USER = 'YOUR GMAIL ADDRESS'
-    EMAIL_HOST_PASSWORD = 'YOUR GMAIL PASSWORD'
-    DEFAULT_FROM_MAIL = 'MAIL ADDRESS AS THE DEFAULT SENDER'
-    ```
-
-6. Run ```python manage.py migrate``` to create the user_map models. 
-
-7. Create a superuser so that you can log in to django admin to administer 
-user:
-    ```python manage.py  createsuperuser``` 
-
-7. Run ```python manage.py runserver``` to start the development server.
-
-8. Visit http://127.0.0.1:8000/user-map/ to open the apps.
-
-9. Visit your admin page (the default is http://127.0.0.1:8000/admin) to 
-manage user as an admin. 
-
-
-Apps Configurations
-==================
-
-Tile Layer
-------------
-
-You can configure the basemap of the form that uses LeafletWidget and the 
-basemap of the homepage by adding 'LEAFLET_CONFIG' in settings.py e.g:
+## Installation
+* Install django-user-map with pip:
+
+```python
+pip install django-user-map
 ```
-LEAFLET_CONFIG = {
-    'TILES': [
-        (
-            'OpenStreetMap', # The title
-            'http://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png', # The tile URL
-            ('© <a href="http://www.openstreetmap.org" '
-             'target="_parent">OpenStreetMap</a> and contributors, under an '
-             '<a href="http://www.openstreetmap.org/copyright" '
-             'target="_parent">open license</a>') # The attribution
+
+* Make sure you have these modules in INSTALLED_APPS of your django project settings.py:
+
+```python
+INSTALLED_APPS = (
+    'django.contrib.gis',
+    'user_map',
+    'leaflet',
+    'bootstrapform',
+    'rest_framework',
+    'rest_framework_gis'
+)
+```
+
+* Include user-map URLconf in your project urls.py with namespace user_map (required) e.g:
+
+```python
+url(r'^user-map/', include('user_map.urls', namespace='user_map')),
+```
+
+* Configure user map with USER_MAP variable in your project's settings.py or override some templates. See [Configurations](#configurations) section for further information.
+
+* Run ```python manage.py migrate user_map``` to migrate the ```user_map``` 
+models. 
+
+* Visit the URL that you set before to see the apps.
+
+
+## Configurations
+You can configure Django User Map with one single USER_MAP variable in project's settings.py. The setting below is the default. Add this default to your project's setting and configure the necessary bits that you want to change:
+
+```python   
+USER_MAP = {
+    'project_name': 'Django',
+    'favicon_file': '',
+    'login_view': 'django.contrib.auth.views.login',
+    'marker': {
+        # See leaflet icon valid options here:
+        # http://leafletjs.com /reference.html#icon-iconurl
+        'iconUrl': 'static/user_map/img/user-icon.png',
+        'shadowUrl': 'static/user_map/img/shadow-icon.png',
+        'iconSize': [19, 32],
+        'shadowSize': [42, 35],
+        'iconAnchor': [10, 0],
+        'shadowAnchor': [12, 0],
+    },
+    'leaflet_config': {
+        'TILES': [(
+            # The title
+            'MapQuest',
+            # Tile's URL
+            'http://otile{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png',
+            # More valid leaflet option are passed here
+            # See here: http://leafletjs.com/reference.html#tilelayer
+            {
+                'attribution':
+                    '© <a href="http://www.openstreetmap.org" '
+                    'target="_parent">OpenStreetMap'
+                    '</a> and contributors, under an <a '
+                    'href="http://www.openstreetmap.org/copyright" '
+                    'target="_parent">open license</a>. Tiles Courtesy of '
+                    '<a '
+                    'href="http://www.mapquest.com/">MapQuest</a> <img '
+                    'src="http://developer.mapquest.com/content/osm/mq_logo'
+                    '.png"',
+                'subdomains': '1234'
+
+            }
         )]
+    },
+    'roles': [
+        {
+            'id': 1,
+            'name': 'Django User',
+            'badge': 'user_map/img/badge-user.png'
+        },
+        {
+            'id': 2,
+            'name': 'Django Trainer',
+            'badge': 'user_map/img/badge-trainer.png'
+        },
+        {
+            'id': 3,
+            'name': 'Django Developer',
+            'badge': 'user_map/img/badge-developer.png'
+        }
+    ],
+    'api_user_fields': [
+        # e.g 'username', 'first_name', 'last_name'
+    ],
+}
+```
+
+### Project Name
+This variable (```project_name```) represents the project name of the apps. If this is not specified, 'Django' will be used.
+
+### Favicon
+This variable (```favicon_file```) represents the file path to the favicon on the browser's tab. You can point it to any files in your static dirs from any apps.
+   
+### Login View
+Django User Map relies on the auth user model in your project. For users to be able to add (or update) themselves, they need to log in first. You can point it to the view function e.g ```'login_view': 'django.contrib.auth.views.login'``` or even to the view name e.g ```'login_view': 'fe_login'```
+
+### Marker
+This variable represents the marker icon on the map. You can use any valid Leaflet ```L.icon``` options. Read here for the valid options http://leafletjs.com/reference.html#icon-iconurl 
+
+An example for this variable:
+
+```python
+'marker': {
+    'iconUrl': 'static/user_map/img/user-icon.png',
+    'shadowUrl': 'static/user_map/img/shadow-icon.png',
+    'iconSize': [19, 32],
+    'shadowSize': [42, 35],
+    'iconAnchor': [10, 0],
+    'shadowAnchor': [12, 0],
 }
 ```
 
-Configurable variables
-----------------------
+### Map Configuration
+You can configure the basemap of the form that uses LeafletWidget and the basemap of the homepage through  ```leaflet_config``` variable in settings.py. You can also pass leaflet tile layer options (read here: http://leafletjs.com/reference.html#tilelayer):
+
+```python
+'leaflet_config': {
+    'TILES': [(
+        # The title
+        'MapQuest',
+        # Tile's URL
+        'http://otile{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png',
+        # More valid leaflet option are passed here
+        {
+            'attribution':
+                '© <a href="http://www.openstreetmap.org" '
+                'target="_parent">OpenStreetMap'
+                '</a> and contributors, under an <a '
+                'href="http://www.openstreetmap.org/copyright" '
+                'target="_parent">open license</a>. Tiles Courtesy of '
+                '<a '
+                'href="http://www.mapquest.com/">MapQuest</a> <img '
+                'src="http://developer.mapquest.com/content/osm/mq_logo'
+                '.png"',
+            'subdomains': '1234'
 
-You can also configure some variables by adding these items on your 
-django settings.py:
+        }
+    )]
+},
+```
+
+### Roles
 
-1. USER_MAP_PROJECT_NAME (string). This variable represents the project name of 
-   the apps. If this is not specified, 'InaSAFE' will be used.
-     
-2. USER_MAP_BRAND_LOGO (string). This variable represents the file path to 
-   the brand logo in navigation bar. If not specified, 
-   'user_map/img/logo.png' will be used.
+Using ```roles```, you can specify the user's role, its name, and its badge path. User can select multiple roles. On the map, visitors of the apps can also filter the marker (users) based on their role(s).If not specified, this variable will take this as the default:
    
-3. USER_MAP_FAVICON_FILE (string). This variable represents the file path to 
-   the favicon on the browser's tab. If not specified, 
-   the default is 'user_map/img/user-icon.png'
+```python
+'roles': [
+        {
+            'id': 1,
+            'name': 'Django User',
+            'badge': 'user_map/img/badge-user.png'
+        },
+        {
+            'id': 2,
+            'name': 'Django Trainer',
+            'badge': 'user_map/img/badge-trainer.png'
+        },
+        {
+            'id': 3,
+            'name': 'Django Developer',
+            'badge': 'user_map/img/badge-developer.png'
+        }
+    ],
+}
+```
    
-4. USER_MAP_USER_ROLES (list of dictionary). Using this variable, 
-   you can specify the user's role and the icon path for the role. If not  
-   specified, this variable will take this as the default:
-   ```
-   default_user_roles = [
-      dict(
-        name='User',
-        icon='user_map/img/user-icon.png',
-        shadow_icon='user_map/img/shadow-icon.png'),
-      dict(
-        name='Trainer',
-        icon='user_map/img/trainer-icon.png',
-        shadow_icon='user_map/img/shadow-icon.png'),
-      dict(
-        name='Developer',
-        icon='user_map/img/developer-icon.png',
-        shadow_icon='user_map/img/shadow-icon.png')]
-   ```
-   While you can add as many roles as you want, note that we only create 
-   three  css classes for the marker clusterer (it makes clusters of users 
-   based on the role). If you want to have more than three roles, 
-   you need to add these two classes with this pattern:
-   ```
-   .marker-cluster-role4 {
-        background-color: rgba(253, 156, 115, 0.6);
-   }
-   .marker-cluster-role4 div {
-        background-color: rgba(241, 128, 23, 0.6);
-   }
-   ```
-
-
-Testing
---------
+### User Fields
+User fields are list of field from user model (AUTH_USER_MODEL) that will be shown on the popup content and will be added to the REST API. To specify which fields that should be visible from user model, you can configure it through ```api_user_fields``` as a list of fields. For example if you want to show username field from the user model, you must add this setting:`
+
+```python
+'api_user_fields': ['username'],
+```
+
+## Updating Roles
+If in any case you need to update or change roles in ```settings.py``` after the ```user_map``` models are migrated, you must run django management command:
+ 
+```python
+python manage.py update_roles
+```
+
+Bear in mind that you should not change the id's and just change the name or the badge path. 
+
+This command also will only update the role table, not the usermap table that uses the role table. So, adding roles is fine (as long as the new id's are unique). Removing roles has no effect (it will not remove the row in the table). Well, it could give you problems as it means that some of the users might not have valid roles defined in the role table.
+
+
+## Changing Template
+You can change the content of the data privacy (the modal popped up when user clicks 'Data Privacy' link at the bottom left of the map) or add navigation  menu. By  default, there is no navigation menu - the map will use the whole screen.
+ 
+### Data Privacy
+To modify data privacy content, create a directory ```user_map``` under ```templates``` dir of your Django project and create html file named ```data_privacy.html```. The default content of this template looks like this:
+
+```html
+<script id="data-privacy-content-section" type="text/template">
+  The data you enter on this site may be visible to others. We suggest that
+  you approximate your physical location to the nearest
+  town or major center. Parts of your data will be made available for
+  others to download and use. Click the REST API link to see the data that are
+  available for public to use.
+</script>
+```
+
+In the new ```data_privacy.html``` file, copy that and edit the wording yourself. Note that the ```<script>``` tag is needed completely with the same ```id``` and ```type```.
+
+
+### Navigation
+By default, the map showing all users does not have navigation menu. This is how it looks like without the navigation menu:
+
+![User Map without Navigation](docs/img/without_nav.png)
+
+But you can add a navigation menu so it looks like this as an example:
+
+![User Map with Navigation](docs/img/with_nav.png)
+
+To add navigation menu, add html file named ```navigation.html``` in ```user_map/templates/``` dir under your project's directory (along with your custom data privacy content). Django User Map uses Bootstrap 3, so you can use style classes and other stuffs from Bootstrap 3. 
+ 
+ As an example the content could be something like this tresulting the above screenshot:
+ 
+```html
+<nav class="navbar navbar-default" style="margin-bottom: 0px;">
+  <div class="container-fluid">
+    <!-- Brand and toggle get grouped for better mobile display -->
+    <div class="navbar-header">
+      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+      <a class="navbar-brand" href="#">Brand</a>
+    </div>
+
+    <!-- Collect the nav links, forms, and other content for toggling -->
+    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+      <ul class="nav navbar-nav">
+        <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
+        <li><a href="#">Link</a></li>
+        <li class="dropdown">
+          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li role="separator" class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+            <li role="separator" class="divider"></li>
+            <li><a href="#">One more separated link</a></li>
+          </ul>
+        </li>
+      </ul>
+      <form class="navbar-form navbar-left" role="search">
+        <div class="form-group">
+          <input type="text" class="form-control" placeholder="Search">
+        </div>
+        <button type="submit" class="btn btn-default">Submit</button>
+      </form>
+      <ul class="nav navbar-nav navbar-right">
+        <li><a href="#">Link</a></li>
+        <li class="dropdown">
+          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li role="separator" class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </li>
+      </ul>
+    </div><!-- /.navbar-collapse -->
+  </div><!-- /.container-fluid -->
+</nav>
+
+```
+
+## Testing
 
 You can run the test suite by using django manage.py from your django project:
 ```
@@ -177,3 +308,6 @@ or you can do it from the root of this django apps by running:
 python setup.py test
 ```
 
+## Status
+[![Develop Branch](https://api.travis-ci.org/akbargumbira/django-user-map.svg?branch=develop)](https://travis-ci.org/akbargumbira/django-user-map)
+[![Coverage Status](https://coveralls.io/repos/github/akbargumbira/django-user-map/badge.svg?branch=develop)](https://coveralls.io/github/akbargumbira/django-user-map?branch=develop)
diff --git a/docs/img/with_nav.png b/docs/img/with_nav.png
new file mode 100644
index 0000000..f931418
Binary files /dev/null and b/docs/img/with_nav.png differ
diff --git a/docs/img/without_nav.png b/docs/img/without_nav.png
new file mode 100644
index 0000000..ec8f45d
Binary files /dev/null and b/docs/img/without_nav.png differ
diff --git a/requirements.txt b/requirements.txt
index b274f95..68bb5d3 100644
--- a/requirements.txt
+++ b/requirements.txt
@@ -1,5 +1,8 @@
-Django==1.7
-django-leaflet==0.14.1
-psycopg2==2.5.4
-factory-boy==2.4.1
-django-bootstrap-form==3.1
+Django>=1.8
+django-leaflet==0.18.0
+psycopg2==2.6.1
+factory-boy==2.6.0
+django-bootstrap-form==3.2
+djangorestframework==3.3.2
+djangorestframework-gis==0.10.1
+Pillow==3.1.1
diff --git a/setup.py b/setup.py
index cf16a59..fc85213 100644
--- a/setup.py
+++ b/setup.py
@@ -10,7 +10,7 @@
 
 setup(
     name='django-user-map',
-    version='0.1.2',
+    version='1.0.0',
     author='Akbar Gumbira',
     author_email='akbargumbira@gmail.com',
     packages=find_packages(),
@@ -23,11 +23,16 @@
                  'django web site.'),
     long_description=open('README.md').read(),
     install_requires=[
-        "Django==1.7",
-        "django-leaflet==0.14.1",
-        "psycopg2==2.5.4",
-        "factory-boy==2.4.1",
-        "django-bootstrap-form==3.1",
+        "Django>=1.8",
+        "django-leaflet",
+        "psycopg2",
+        "django-bootstrap-form",
+        "djangorestframework",
+        "djangorestframework-gis",
+        "Pillow"
+    ],
+    tests_require=[
+        "factory-boy>=2.4.1",
     ],
     test_suite='user_map.run_tests.run',
 )
diff --git a/user_map/admin.py b/user_map/admin.py
index 2bf49c3..bbeda57 100644
--- a/user_map/admin.py
+++ b/user_map/admin.py
@@ -2,27 +2,16 @@
 """Model Admin Class."""
 
 from django.contrib.gis import admin
-from leaflet.admin import LeafletGeoAdmin
 
-from user_map.models import User, Role
+from leaflet.admin import LeafletGeoAdmin
 
+from user_map.models import UserMap, Role
 
-class UserAdmin(LeafletGeoAdmin):
-    """Admin Class for User Model."""
-    list_display = ('name', 'email', 'role', 'website', 'email_updates',
-                    'last_login', 'is_confirmed', 'is_admin')
-    list_filter = ['role', 'is_confirmed', 'is_admin']
-    search_fields = ['name', 'email']
-    fieldsets = [
-        ('Basic Information', {
-            'fields': [
-                'name', 'email', 'website', 'role', 'email_updates']}),
-        ('Location', {'fields': ['location']}),
-        ('Advanced Information', {
-            'fields': ['is_confirmed', 'is_active', 'is_admin', 'last_login']
-        }),
-    ]
 
+class UserMapAdmin(LeafletGeoAdmin):
+    """Admin Class for User Map Model."""
+    model = UserMap
+    can_delete = False
 
-admin.site.register(User, UserAdmin)
+admin.site.register(UserMap, UserMapAdmin)
 admin.site.register(Role)
diff --git a/user_map/app_settings.py b/user_map/app_settings.py
index f3a86e3..012c1a1 100644
--- a/user_map/app_settings.py
+++ b/user_map/app_settings.py
@@ -4,51 +4,100 @@
 ..note: By design, you can override these settings from your project's
     settings.py with prefix 'USER_MAP' on the variable e.g
     'USER_MAP_USER_ICONS'.
-
-    For mailing. as the default, it wil use 'DEFAULT_FROM_MAIL' setting from
-    the project.
 """
 from django.conf import settings
 
-# PROJECT_NAME: The project name for this apps e.g InaSAFE
-default_project_name = 'InaSAFE'
-PROJECT_NAME = getattr(settings, 'USER_MAP_PROJECT_NAME', default_project_name)
 
-# LOGO/BRAND
-default_brand_logo = 'user_map/img/logo.png'
-BRAND_LOGO = getattr(settings, 'USER_MAP_BRAND_LOGO', default_brand_logo)
+# USER_MODEL: The auth user model is set in project's settings
+USER_MODEL = settings.AUTH_USER_MODEL
+
+# USER MAP Settings
+default_setting = {
+    'project_name': 'Django',
+    'favicon_file': '',
+    'login_view': 'django.contrib.auth.views.login',
+    'marker': {
+        # See leaflet icon valid options here:
+        # http://leafletjs.com /reference.html#icon-iconurl
+        'iconUrl': 'static/user_map/img/user-icon.png',
+        'shadowUrl': 'static/user_map/img/shadow-icon.png',
+        'iconSize': [19, 32],
+        'shadowSize': [42, 35],
+        'iconAnchor': [10, 0],
+        'shadowAnchor': [12, 0],
+    },
+    'leaflet_config': {
+        'TILES': [(
+            # The title
+            'MapQuest',
+            # Tile's URL
+            'http://otile{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png',
+            # More valid leaflet option are passed here
+            # See here: http://leafletjs.com/reference.html#tilelayer
+            {
+                'attribution':
+                    '© <a href="http://www.openstreetmap.org" '
+                    'target="_parent">OpenStreetMap'
+                    '</a> and contributors, under an <a '
+                    'href="http://www.openstreetmap.org/copyright" '
+                    'target="_parent">open license</a>. Tiles Courtesy of '
+                    '<a '
+                    'href="http://www.mapquest.com/">MapQuest</a> <img '
+                    'src="http://developer.mapquest.com/content/osm/mq_logo'
+                    '.png"',
+                'subdomains': '1234'
+
+            }
+        )]
+    },
+    'roles': [
+        {
+            'id': 1,
+            'name': 'Django User',
+            'badge': 'user_map/img/badge-user.png'
+        },
+        {
+            'id': 2,
+            'name': 'Django Trainer',
+            'badge': 'user_map/img/badge-trainer.png'
+        },
+        {
+            'id': 3,
+            'name': 'Django Developer',
+            'badge': 'user_map/img/badge-developer.png'
+        }
+    ],
+    'api_user_fields': [
+        # e.g 'username', 'first_name', 'last_name'
+    ],
+}
+
+user_map_settings = getattr(settings, 'USER_MAP', default_setting)
+
+# PROJECT_NAME: The project name for this apps e.g InaSAFE
+PROJECT_NAME = user_map_settings.get(
+    'project_name', default_setting['project_name'])
 
 # FAVICON_FILE: Favicon for this apps
-default_favicon_file = 'user_map/img/user-icon.png'
-FAVICON_FILE = getattr(settings, 'USER_MAP_FAVICON_FILE', default_favicon_file)
-
-#  USER ROLES: All user roles and their icons
-default_user_roles = [
-    dict(
-        name='User',
-        icon='user_map/img/user-icon.png',
-        shadow_icon='user_map/img/shadow-icon.png'),
-    dict(
-        name='Trainer',
-        icon='user_map/img/trainer-icon.png',
-        shadow_icon='user_map/img/shadow-icon.png'),
-    dict(
-        name='Developer',
-        icon='user_map/img/developer-icon.png',
-        shadow_icon='user_map/img/shadow-icon.png')]
-USER_ROLES = getattr(settings, 'USER_MAP_USER_ROLES', default_user_roles)
-
-# MAIL SENDER
-default_mail_sender = 'noreply@inasafe.org'
-DEFAULT_FROM_MAIL = getattr(settings, 'DEFAULT_FROM_MAIL', default_mail_sender)
-
-# LEAFLET CONFIG
-default_leaflet_tiles = (
-    'OpenStreetMap',
-    'http://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png',
-    ('© <a href="http://www.openstreetmap.org" target="_parent">OpenStreetMap'
-     '</a> and contributors, under an <a '
-     'href="http://www.openstreetmap.org/copyright" target="_parent">open '
-     'license</a>')
-)
-LEAFLET_TILES = getattr(settings, 'LEAFLET_TILES', default_leaflet_tiles)
+FAVICON_FILE = user_map_settings.get(
+    'favicon_file', default_setting['favicon_file'])
+
+
+# LOGIN_VIEW: The view to the login page
+LOGIN_VIEW = user_map_settings.get(
+    'login_view', default_setting['login_view'])
+
+# MARKER
+MARKER = user_map_settings.get(
+    'marker', default_setting['marker'])
+
+LEAFLET_CONFIG = user_map_settings.get(
+    'leaflet_config', default_setting['leaflet_config'])
+LEAFLET_TILES = LEAFLET_CONFIG['TILES']
+
+#  ROLES: All user roles and their badges
+ROLES = user_map_settings.get('roles', default_setting['roles'])
+
+#  API_USER_FIELDS
+API_USER_FIELDS = user_map_settings.get(
+    'api_user_fields', default_setting['api_user_fields'])
diff --git a/user_map/auth_backend.py b/user_map/auth_backend.py
deleted file mode 100644
index a21dfba..0000000
--- a/user_map/auth_backend.py
+++ /dev/null
@@ -1,44 +0,0 @@
-# coding=utf-8
-"""Authentication backend class for InaSAFE User Map."""
-from user_map.models.user import User
-
-
-class UserMapAuthBackend(object):
-    """A custom authentication backend for InaSAFE User Map.
-
-    It allows users to log in using their email address.
-    """
-    def get_user(self, user_id):
-        """Get user based on the id.
-
-        :param user_id: The id of the user record. In our backend, this should
-            be an email address.
-        :type user_id: str
-
-        :return: The user object if exist, otherwise None.
-        """
-        try:
-            user = User.objects.get(pk=user_id)
-            if user.is_active:
-                return user
-            return None
-        except User.DoesNotExist:
-            return None
-
-    def authenticate(self, email=None, password=None):
-        """Authentication method.
-
-        :param email: The email of the user.
-        :type email: str
-
-        :param password: The password of the user.
-        :type password: str
-
-        :return: The user object if it is authenticated successfully.
-        """
-        try:
-            user = User.objects.get(email=email)
-            if user.check_password(password):
-                return user
-        except User.DoesNotExist:
-            return None
diff --git a/user_map/context_processors.py b/user_map/context_processors.py
deleted file mode 100644
index 7f5ad0e..0000000
--- a/user_map/context_processors.py
+++ /dev/null
@@ -1,17 +0,0 @@
-# coding=utf-8
-"""Module for custom context processor for InaSAFE User Map."""
-from user_map import app_settings
-
-
-def user_map_settings(request):
-    """Add media configuration for user map e.g favicon path so that we can
-    use it directly on template.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    return {
-        'PROJECT_NAME': app_settings.PROJECT_NAME,
-        'BRAND_LOGO': app_settings.BRAND_LOGO,
-        'FAVICON_PATH': app_settings.FAVICON_FILE,
-    }
diff --git a/user_map/forms/custom_widget.py b/user_map/forms/custom_widget.py
new file mode 100644
index 0000000..47d7d8b
--- /dev/null
+++ b/user_map/forms/custom_widget.py
@@ -0,0 +1,40 @@
+from django.utils.safestring import mark_safe
+from django.utils.html import escape, conditional_escape
+from django.utils.encoding import force_unicode
+from django.forms.widgets import ClearableFileInput, Input, CheckboxInput
+
+
+class CustomClearableFileInput(ClearableFileInput):
+    """A custom ClearableFileInput widget.
+
+    ..note:: Adapted from django.forms.widgets.ClearableFileInput and also
+        utilising img-responsive bootstrap class.
+    """
+    def render(self, name, value, attrs=None):
+        """Render the custom widget."""
+        substitutions = {
+            'input_text': self.input_text,
+            'clear_template': '',
+            'clear_checkbox_label': self.clear_checkbox_label,
+            }
+        template = '%(input)s'
+        substitutions['input'] = Input.render(self, name, value, attrs)
+
+        if value and hasattr(value, "url"):
+            template = ('%(initial)s %(clear_template)s<br />%(input_text)s: '
+                        '%(input)s')
+            substitutions['initial'] = (
+                '<img class="img-responsive" src="%s" alt="%s"/>' % (
+                    escape(value.url), escape(force_unicode(value))))
+            if not self.is_required:
+                checkbox_name = self.clear_checkbox_name(name)
+                checkbox_id = self.clear_checkbox_id(checkbox_name)
+                substitutions['clear_checkbox_name'] = conditional_escape(
+                    checkbox_name)
+                substitutions['clear_checkbox_id'] = conditional_escape(
+                    checkbox_id)
+                substitutions['clear'] = CheckboxInput().render(
+                    checkbox_name, False, attrs={'id': checkbox_id})
+                substitutions['clear_template'] = \
+                    self.template_with_clear % substitutions
+        return mark_safe(template % substitutions)
diff --git a/user_map/forms/user.py b/user_map/forms/user.py
index 3b24006..8c07253 100644
--- a/user_map/forms/user.py
+++ b/user_map/forms/user.py
@@ -1,167 +1,28 @@
 # coding=utf-8
 """Django forms for User related routines."""
 from django.contrib.gis import forms
-from django.contrib.auth.forms import PasswordResetForm
+
 from leaflet.forms.widgets import LeafletWidget
 
-from user_map.models import User, Role
+from user_map.models import UserMap
+from user_map.app_settings import LEAFLET_TILES
+from user_map.forms.custom_widget import CustomClearableFileInput
 
 
-class RegistrationForm(forms.ModelForm):
+class UserMapForm(forms.ModelForm):
     """Form for user model."""
-    name = forms.CharField(
-        required=True,
-        label='Your name',
-        widget=forms.TextInput(
-            attrs={'placeholder': 'John Doe'})
-    )
-    email = forms.EmailField(
-        required=True,
-        label='Your email',
-        widget=forms.EmailInput(
-            attrs={
-                'placeholder': 'john@doe.com'})
-    )
-    password = forms.CharField(
-        required=True,
-        label='Your password',
-        widget=forms.PasswordInput()
-    )
-    password2 = forms.CharField(
-        required=True,
-        label='Your password (again)',
-        widget=forms.PasswordInput()
-    )
-    website = forms.URLField(
-        required=False,
-        label='Your website',
-        widget=forms.URLInput(
-            attrs={'placeholder': 'http://john.doe.com'})
-    )
-    location = forms.PointField(
-        label='Click your location on the map',
-        widget=LeafletWidget())
-    role = forms.ModelChoiceField(
-        label='Your role',
-        queryset=Role.objects.filter(sort_number__gte=1),
-        initial=1)
-    email_updates = forms.BooleanField(
-        required=False,
-        label='Receive project news and updates')
-
-    class Meta:
-        """Association between models and this form."""
-        model = User
-        fields = ['name', 'email', 'password', 'password2', 'website', 'role',
-                  'location', 'email_updates']
-
-    def clean(self):
-        """Verifies that the values entered into the password fields match."""
-        cleaned_data = super(RegistrationForm, self).clean()
-        if 'password' in cleaned_data and 'password2' in cleaned_data:
-            if cleaned_data['password'] != cleaned_data['password2']:
-                raise forms.ValidationError(
-                    "Passwords don't match. Please enter both fields again.")
-        return cleaned_data
-
-    def save(self, commit=True):
-        """Save form.
-
-        :param commit: Whether committed to db or not.
-        :type commit: bool
-        """
-        user = super(RegistrationForm, self).save(commit=False)
-        user.set_password(self.cleaned_data['password'])
-        if commit:
-            user.save()
-        return user
-
-
-class LoginForm(forms.Form):
-    """Form for user to log in."""
-    class Meta:
-        """Meta of the form."""
-        fields = ['email', 'password']
-
-    email = forms.EmailField(
-        widget=forms.EmailInput(
-            attrs={
-                'class': 'form-control',
-                'placeholder': 'john@doe.com',
-            })
-    )
-    password = forms.CharField(
-        widget=forms.PasswordInput(
-            attrs={
-                'class': 'form-control',
-                'placeholder': 'Your s3cr3T password'
-            })
-    )
-
-
-class BasicInformationForm(forms.ModelForm):
-    """Form for Basic Information model."""
-    name = forms.CharField(
-        required=True,
-        label='Your name',
-        widget=forms.TextInput(
-            attrs={
-                'placeholder': 'John Doe'})
-    )
-    email = forms.EmailField(
-        required=True,
-        label='Your email',
-        widget=forms.EmailInput(
-            attrs={
-                'readonly': 'readonly',
-                'placeholder': 'john@doe.com'})
-    )
-    website = forms.URLField(
-        required=False,
-        label='Your website',
-        widget=forms.URLInput(
-            attrs={
-                'placeholder': 'http://john.doe.com'})
-    )
-    role = forms.ModelChoiceField(
-        label='Your role',
-        queryset=Role.objects.filter(sort_number__gte=1),
-        initial=1)
-    email_updates = forms.BooleanField(
-        required=False,
-        label='Receive project news and updates')
-    location = forms.PointField(
-        label='Click your location on the map',
-        widget=LeafletWidget())
-
-    class Meta:
-        """Association between models and this form."""
-        model = User
-        fields = ['name', 'email', 'website', 'role', 'location',
-                  'email_updates']
-
-    def save(self, commit=True):
-        """Save form.
-
-        :param commit: Whether committed to db or not.
-        :type commit: bool
-        """
-        user = super(BasicInformationForm, self).save(commit=False)
-        if commit:
-            user.save()
-        return user
-
-
-class CustomPasswordResetForm(PasswordResetForm):
-    """Form for password reset containing email input."""
-    email = forms.EmailField(
-        required=True,
-        label='Email',
-        widget=forms.EmailInput(
-            attrs={
-                'placeholder': 'john@doe.com'})
-    )
 
     class Meta:
         """Association between models and this form."""
-        model = User
+        model = UserMap
+        exclude = ['user']
+        widgets = {
+            'location': LeafletWidget(attrs={
+                'settings_overrides': {
+                    'TILES': LEAFLET_TILES
+            }}),
+            'roles': forms.CheckboxSelectMultiple(),
+            'image': CustomClearableFileInput(),
+            'website': forms.URLInput(
+                attrs={'placeholder': 'http://john.doe.com'})
+        }
diff --git a/user_map/management/__init__.py b/user_map/management/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/user_map/management/commands/__init__.py b/user_map/management/commands/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/user_map/management/commands/update_roles.py b/user_map/management/commands/update_roles.py
new file mode 100644
index 0000000..8294ab0
--- /dev/null
+++ b/user_map/management/commands/update_roles.py
@@ -0,0 +1,55 @@
+# coding=utf-8
+from django.core.management.base import BaseCommand
+
+from user_map.app_settings import ROLES
+from user_map.models.role import Role
+
+
+class Command(BaseCommand):
+    help = 'Update the roles in the database'
+
+    def handle(self, *args, **options):
+        """This command should be called after changing the roles in
+        settings in the case that you have called migrate (roles table is
+        already filled with some data)
+
+        Bear in mind that you should keep the ids the same and just change
+        the name or the badge path. And this command will only update the role
+        table, not the usermap table that uses the role table.
+
+        So, adding roles is fine (as long as the new ids are unique). Removing
+        roles has no effect (it will not remove the row in the table). Well, it
+        could give you problems as it means that some of the users might not
+        have valid roles defined in the role table.
+
+        How to use this:
+            python manage.py update_roles
+        """
+        for new_role in ROLES:
+            try:
+                role = Role.objects.get(pk=new_role['id'])
+                old_name = role.name
+                old_badge = role.badge
+                role.name = new_role['name']
+                role.badge = new_role['badge']
+                role.save()
+                self.stdout.write(
+                    'Role (%s, %s, %s) has been updated to (%s, %s, %s)' % (
+                        role.id, old_name, old_badge,
+                        role.id, role.name, role.badge
+                    )
+                )
+            except Role.DoesNotExist:
+                # It means a new role
+                role = Role.objects.create(
+                    id=new_role['id'],
+                    name=new_role['name'],
+                    badge=new_role['badge']
+                )
+                self.stdout.write(
+                    'New Role (%s, %s, %s) has been added' % (
+                        role.id, role.name, role.badge,
+                    )
+                )
+
+        self.stdout.write('> The operation update_role is run successfully.')
diff --git a/user_map/migrations/0001_initial.py b/user_map/migrations/0001_initial.py
index 3ca5ff6..ae2769e 100644
--- a/user_map/migrations/0001_initial.py
+++ b/user_map/migrations/0001_initial.py
@@ -1,53 +1,35 @@
 # -*- coding: utf-8 -*-
 from __future__ import unicode_literals
 
-from django.db import models, migrations
-import django.utils.timezone
+from django.db import migrations, models
+from django.conf import settings
+import user_map.models.user
 import django.contrib.gis.db.models.fields
 
 
 class Migration(migrations.Migration):
 
     dependencies = [
+        ('auth', '0006_require_contenttypes_0002'),
     ]
 
     operations = [
         migrations.CreateModel(
-            name='User',
+            name='Role',
             fields=[
-                ('id', models.AutoField(verbose_name='ID', serialize=False, auto_created=True, primary_key=True)),
-                ('password', models.CharField(max_length=128, verbose_name='password')),
-                ('last_login', models.DateTimeField(default=django.utils.timezone.now, verbose_name='last login')),
-                ('name', models.CharField(help_text=b'Your name.', max_length=100, verbose_name=b'Name')),
-                ('email', models.EmailField(help_text=b'Your email.', unique=True, max_length=75, verbose_name=b'E-mail')),
-                ('website', models.URLField(help_text=b'Optional link to your personal or organisation web site.', verbose_name=b'Website', blank=True)),
-                ('location', django.contrib.gis.db.models.fields.PointField(help_text=b'Where are you?', srid=4326, max_length=255, verbose_name=b'Location')),
-                ('email_updates', models.BooleanField(default=False, help_text=b'Tick this to receive occasional news email messages.', verbose_name=b'Receiving Updates')),
-                ('date_joined', models.DateTimeField(auto_now_add=True, verbose_name=b'Join Date')),
-                ('is_active', models.BooleanField(default=True, help_text=b'Whether this user is still active or not (a user could be banned or deleted).', verbose_name=b'Active Status')),
-                ('is_admin', models.BooleanField(default=False, help_text=b'Whether this user is admin or not.', verbose_name=b'Admin Status')),
-                ('is_confirmed', models.BooleanField(default=False, help_text=b'Whether this user has approved their entry by email.', verbose_name=b'Confirmation Status')),
-                ('key', models.CharField(help_text=b'Confirmation key for user to activate their account.', max_length=40, verbose_name=b'Confirmation Key')),
+                ('id', models.IntegerField(serialize=False, primary_key=True)),
+                ('name', models.CharField(help_text=b'How would you define your participation?', unique=True, max_length=100)),
+                ('badge', models.CharField(help_text=b'The path to the badge', max_length=100)),
             ],
-            options={
-            },
-            bases=(models.Model,),
         ),
         migrations.CreateModel(
-            name='Role',
+            name='UserMap',
             fields=[
-                ('id', models.AutoField(verbose_name='ID', serialize=False, auto_created=True, primary_key=True)),
-                ('name', models.CharField(help_text=b'How would you define your participation?', unique=True, max_length=100)),
-                ('sort_number', models.IntegerField(help_text=b'Sorting order for role in role list.', null=True, blank=True)),
+                ('user', models.OneToOneField(primary_key=True, serialize=False, to=settings.AUTH_USER_MODEL)),
+                ('location', django.contrib.gis.db.models.fields.PointField(help_text=b'Where are you?', srid=4326, max_length=255, verbose_name=b'Location')),
+                ('image', models.ImageField(validators=[user_map.models.user.validate_image], upload_to=user_map.models.user.image_path, blank=True, help_text=b'Your photo', verbose_name=b'Image')),
+                ('is_hidden', models.BooleanField(default=False, help_text=b'Do you wish to hide yourself on the map?', verbose_name=b'Hidden Status')),
+                ('roles', models.ManyToManyField(to='user_map.Role', verbose_name=b'Roles')),
             ],
-            options={
-            },
-            bases=(models.Model,),
-        ),
-        migrations.AddField(
-            model_name='user',
-            name='role',
-            field=models.ForeignKey(verbose_name=b'Role', to='user_map.Role'),
-            preserve_default=True,
         ),
     ]
diff --git a/user_map/migrations/0002_populate_roles.py b/user_map/migrations/0002_populate_roles.py
index 838fb98..e4e7252 100644
--- a/user_map/migrations/0002_populate_roles.py
+++ b/user_map/migrations/0002_populate_roles.py
@@ -3,7 +3,7 @@
 
 from django.db import models, migrations
 
-from user_map.app_settings import USER_ROLES
+from user_map.app_settings import ROLES
 
 
 def populate_roles(apps, schema_editor):
@@ -16,8 +16,12 @@ def populate_roles(apps, schema_editor):
     :type schema_editor: django.db.backends.schema
     """
     Role = apps.get_model('user_map', 'Role')
-    for idx, user_role in enumerate(USER_ROLES):
-        Role.objects.create(name=user_role['name'], sort_number=(idx + 1))
+    for idx, user_role in enumerate(ROLES):
+        Role.objects.create(
+            id=user_role['id'],
+            name=user_role['name'],
+            badge=user_role['badge']
+        )
 
 
 class Migration(migrations.Migration):
diff --git a/user_map/migrations/0003_usermap_website.py b/user_map/migrations/0003_usermap_website.py
new file mode 100644
index 0000000..c042bc2
--- /dev/null
+++ b/user_map/migrations/0003_usermap_website.py
@@ -0,0 +1,19 @@
+# -*- coding: utf-8 -*-
+from __future__ import unicode_literals
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('user_map', '0002_populate_roles'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='usermap',
+            name='website',
+            field=models.URLField(help_text=b'Optional link to your personal or organisation web site', verbose_name=b'Website', blank=True),
+        ),
+    ]
diff --git a/user_map/models/__init__.py b/user_map/models/__init__.py
index 2f384a1..3b65a35 100644
--- a/user_map/models/__init__.py
+++ b/user_map/models/__init__.py
@@ -1,3 +1,2 @@
 from user_map.models.user import *
 from user_map.models.role import *
-from user_map.models.user_manager import *
diff --git a/user_map/models/role.py b/user_map/models/role.py
index 64095db..778b4e4 100644
--- a/user_map/models/role.py
+++ b/user_map/models/role.py
@@ -8,17 +8,18 @@ class Role(models.Model):
     class Meta:
         """Meta class."""
         app_label = 'user_map'
-
+    id = models.IntegerField(primary_key=True)
     name = models.CharField(
         help_text='How would you define your participation?',
         max_length=100,
         null=False,
         blank=False,
         unique=True)
-    sort_number = models.IntegerField(
-        help_text='Sorting order for role in role list.',
-        null=True,
-        blank=True)
+    badge = models.CharField(
+        help_text='The path to the badge',
+        max_length=100,
+        null=False,
+        blank=False)
 
     def __unicode__(self):
         return self.name
diff --git a/user_map/models/user.py b/user_map/models/user.py
index 1f3cb8a..668be4f 100644
--- a/user_map/models/user.py
+++ b/user_map/models/user.py
@@ -1,38 +1,55 @@
 # coding=utf-8
 """Model class of custom user for InaSAFE User Map."""
-from django.contrib.auth.models import AbstractBaseUser
+import os
+import uuid
+
 from django.contrib.gis.db import models
-from django.utils.crypto import get_random_string
+from django.core.exceptions import ValidationError
 
-from user_map.models.user_manager import CustomUserManager
 from user_map.models.role import Role
-
 from user_map.utilities.utilities import wrap_number
+from user_map.app_settings import USER_MODEL
+
+
+def validate_image(fieldfile_obj):
+    """Validate the image uploaded by user.
+
+    :param fieldfile_obj: The object of the file field.
+    :type fieldfile_obj: File (django.core.files)
+    """
+    file_size = fieldfile_obj.file.size
+    size_limit_mb = 2.0
+    size_limit = size_limit_mb * 1024 * 1024
+    if file_size > size_limit:
+        raise ValidationError(
+            'Maximum image size is %s MB' % size_limit_mb)
+
 
+def image_path(instance, file_name):
+    """Return the proper image path to upload.
 
-class User(AbstractBaseUser):
-    """User class for InaSAFE User Map."""
+    :param file_name: The original file name.
+    :type file_name: str
+    """
+    _, ext = os.path.splitext(file_name)
+
+    file_name = '%s%s' % (uuid.uuid4().hex, ext)
+    return os.path.join(
+        'user_map',
+        'images',
+        file_name)
+
+
+class UserMap(models.Model):
+    """User Map class as a OneToOne to AUTH_USER_MODEL."""
     class Meta:
         """Meta class."""
         app_label = 'user_map'
 
-    name = models.CharField(
-        verbose_name='Name',
-        help_text='Your name.',
-        max_length=100,
-        null=False,
-        blank=False)
-    email = models.EmailField(
-        verbose_name='E-mail',
-        help_text='Your email.',
-        null=False,
-        blank=False,
-        unique=True)
-    website = models.URLField(
-        verbose_name='Website',
-        help_text='Optional link to your personal or organisation web site.',
-        null=False,
-        blank=True)
+    user = models.OneToOneField(
+        USER_MODEL,
+        on_delete=models.CASCADE,
+        primary_key=True)
     location = models.PointField(
         verbose_name='Location',
         help_text='Where are you?',
@@ -40,102 +57,42 @@ class Meta:
         max_length=255,
         null=False,
         blank=False)
-    role = models.ForeignKey(Role, verbose_name='Role', blank=False)
-    email_updates = models.BooleanField(
-        verbose_name='Receiving Updates',
-        help_text='Tick this to receive occasional news email messages.',
-        default=False)
-    date_joined = models.DateTimeField(
-        verbose_name='Join Date',
-        auto_now_add=True)
-    is_active = models.BooleanField(
-        verbose_name='Active Status',
-        help_text='Whether this user is still active or not (a user could be '
-                  'banned or deleted).',
-        default=True)
-    is_admin = models.BooleanField(
-        verbose_name='Admin Status',
-        help_text='Whether this user is admin or not.',
-        default=False)
-    is_confirmed = models.BooleanField(
-        verbose_name='Confirmation Status',
-        help_text='Whether this user has approved their entry by email.',
+    roles = models.ManyToManyField(
+        Role,
+        verbose_name='Roles',
+        blank=False)
+    image = models.ImageField(
+        verbose_name='Image',
+        help_text='Your photo',
+        upload_to=image_path,
+        null=False,
+        blank=True,
+        validators=[validate_image])
+    website = models.URLField(
+        verbose_name='Website',
+        help_text='Optional link to your personal or organisation web site',
         null=False,
+        blank=True)
+    is_hidden = models.BooleanField(
+        verbose_name='Hidden Status',
+        help_text='Do you wish to hide yourself on the map?',
         default=False)
-    key = models.CharField(
-        verbose_name='Confirmation Key',
-        help_text='Confirmation key for user to activate their account.',
-        max_length=40)
-
-    objects = CustomUserManager()
-
-    USERNAME_FIELD = 'email'
-    REQUIRED_FIELDS = ['name']
-
-    def __unicode__(self):
-        return self.name
-
-    def get_full_name(self):
-        """ A longer formal identifier of the user.
-
-        :return: The full name of a user.
-        :rtype: str
-        """
-        return self.name
-
-    def get_short_name(self):
-        """ A shorter formal identifier of the user.
-
-        :return: The full name of a user.
-        :rtype: str
-        """
-        return self.name
-
-    @property
-    def is_staff(self):
-        """The staff status of a user.
-
-        Staff is determined by the admin status of a user.
-
-        :return: True if the user is an admin, otherwise False.
-        :rtype: bool
-        """
-        return self.is_admin
-
-    # noinspection PyUnusedLocal
-    def has_perm(self, perm, obj=None):
-        """Returns true if the user has the named permission.
-
-        :param perm: The permission.
-        :type perm: str
-
-        :param obj: The object that will be used to check the permission.
-        :type obj: object
-
-        :return: The permission status.
-        :rtype: bool
-        """
-        return self.is_admin
-
-    # noinspection PyUnusedLocal
-    def has_module_perms(self, app_label):
-        """Returns True if the user has permission to access models of the app.
-
-        :param app_label: The application.
-        :type app_label: str
-
-        :return: The permission status.
-        :rtype: bool
-        """
-        return self.is_admin
 
     def save(self, *args, **kwargs):
-        """Override save method."""
-        if not self.pk:
-            # New object here
-            self.key = get_random_string()
+        # """Override save method."""
+        is_new = not bool(UserMap.objects.filter(pk=self.pk).count())
+        if not is_new:
+            # Saving a not new object
+            usermap = UserMap.objects.get(pk=self.pk)
+            # Remove the old image if it's new image
+            if usermap.image != self.image:
+                usermap.image.delete(save=False)
+
         # Wrap location data
         self.location.x = wrap_number(self.location.x, [-180, 180])
         self.location.y = wrap_number(self.location.y, [-90, 90])
 
-        super(User, self).save()
+        super(UserMap, self).save()
+
+    def __str__(self):
+        return unicode(self.user).encode('utf-8')
diff --git a/user_map/models/user_manager.py b/user_map/models/user_manager.py
deleted file mode 100644
index 110becd..0000000
--- a/user_map/models/user_manager.py
+++ /dev/null
@@ -1,110 +0,0 @@
-# coding=utf-8
-"""Custom User Manager for user of InaSAFE User Map."""
-from django.contrib.gis.db.models import GeoManager
-from django.contrib.auth.models import BaseUserManager
-from django.contrib.gis.geos import Point
-from django.utils.crypto import get_random_string
-
-from user_map.models.role import Role
-
-
-class CustomUserManager(BaseUserManager, GeoManager):
-    """Custom user manager for user map."""
-    class Meta:
-        """Meta class."""
-        app_label = 'user_map'
-
-    def create_user(
-            self,
-            name,
-            email,
-            location,
-            role,
-            email_updates,
-            website='',
-            password=None):
-        """Create and save a User.
-
-        :param name: The name of the user.
-        :type name: str
-
-        :param email: The email of the user.
-        :type email: str
-
-        :param location: The location of the user in (long, lat)
-        :type location: Point
-
-        :param role: The role of the user.
-        :type role: Role
-
-        :param email_updates: The status email_updates of the user.
-        :type email_updates: bool
-
-        :param website: The website of the user.
-        :type website: str
-
-        :param password: The password of the user.
-        :type password: str
-        """
-        if not name:
-            raise ValueError('User must have name.')
-
-        if not email:
-            raise ValueError('User must have an email address.')
-
-        if not location:
-            raise ValueError('User must have location.')
-
-        if not role:
-            raise ValueError('User must have role.')
-
-        if not email_updates:
-            raise ValueError('User must have email_updates status.')
-
-        user = self.model(
-            name=name,
-            email=self.normalize_email(email),
-            location=location,
-            role=role,
-            email_updates=email_updates,
-            website=website,
-            key=get_random_string()
-        )
-
-        user.set_password(password)
-        user.save(using=self._db)
-        return user
-
-    def create_superuser(self, name, email, password):
-        """Create and save a superuser.
-
-        :param name: The name of the superuser.
-        :type name: str
-
-        :param email: The email of the superuser.
-        :type email: str
-
-        :param password: The password of the superuser.
-        :type password:  str
-        """
-        # Use predefined location, role, email_updates, is_active, is_admin
-        location = Point(106.8, -6.2)
-        try:
-            role = Role.objects.get(name='Super User')
-        except Role.DoesNotExist:
-            role = Role(name='Super User', sort_number=-999)
-            role.save()
-
-        user = self.create_user(
-            name,
-            email,
-            location=location,
-            role=role,
-            email_updates=True,
-            password=password)
-        user.email_updates = True
-        user.is_confirmed = True
-        user.is_active = True
-        user.is_admin = True
-        user.save(using=self._db)
-        return user
diff --git a/user_map/serializers.py b/user_map/serializers.py
new file mode 100644
index 0000000..e06904c
--- /dev/null
+++ b/user_map/serializers.py
@@ -0,0 +1,27 @@
+# coding=utf-8
+"""Serializers for User Map."""
+from django.contrib.auth import get_user_model
+
+from rest_framework_gis.serializers import GeoFeatureModelSerializer
+from rest_framework.serializers import ModelSerializer
+
+from user_map.models import UserMap
+from user_map.app_settings import API_USER_FIELDS
+
+
+class UserSerializer(ModelSerializer):
+    """User Serializer."""
+    class Meta:
+        model = get_user_model()
+        fields = tuple(field for field in API_USER_FIELDS)
+
+
+class UserMapSerializer(GeoFeatureModelSerializer):
+    """User Map Serializer."""
+    user = UserSerializer(read_only=True)
+
+    class Meta:
+        model = UserMap
+        id_field = False
+        geo_field = 'location'
+        fields = ('user', 'roles', 'image', 'website')
diff --git a/user_map/static/user_map/css/MarkerCluster.user-map.css b/user_map/static/user_map/css/MarkerCluster.user-map.css
index 993be57..577e427 100644
--- a/user_map/static/user_map/css/MarkerCluster.user-map.css
+++ b/user_map/static/user_map/css/MarkerCluster.user-map.css
@@ -1,21 +1,21 @@
-.marker-cluster-role1 {
+.marker-cluster-small {
 	background-color: rgba(253, 156, 115, 0.6);
 	}
-.marker-cluster-role1 div {
+.marker-cluster-small div {
 	background-color: rgba(241, 128, 23, 0.6);
 	}
 
-.marker-cluster-role2 {
+.marker-cluster-medium {
 	background-color: rgba(181, 226, 140, 0.6);
 	}
-.marker-cluster-role2 div {
+.marker-cluster-medium div {
 	background-color: rgba(110, 204, 57, 0.6);
 	}
 
-.marker-cluster-role3 {
+.marker-cluster-large {
 	background-color: rgba(0, 180, 255, 0.6);
 	}
-.marker-cluster-role3 div {
+.marker-cluster-large div {
 	background-color: rgba(0, 210, 255, 0.6);
 	}
 
diff --git a/user_map/static/user_map/css/user-map.css b/user_map/static/user_map/css/user-map.css
index f69a624..509de99 100644
--- a/user_map/static/user_map/css/user-map.css
+++ b/user_map/static/user_map/css/user-map.css
@@ -1,63 +1,47 @@
 /* ******************** */
 /*         Map          */
 /* ******************** */
+html {
+    height: 100%;
+}
+
 body {
+  display: -webkit-flex;
+  display: flex;
+  -webkit-flex-direction: column;
+  flex-direction: column;
+  height:100%;
 
 }
 
-html, body, #map {
-    height: 100%;
+.container {
+  width: 100%;
 }
 
-body > .container {
-  margin-top: 70px;
+#map {
+  height: 100%;
 }
 
 #map .leaflet-top {
-  padding-top: 50px;
+  padding-top: 10px;
 }
 
 .transparent {
    background-color: rgba(250, 250, 250, 0.5);
 }
 
-.navbar li { color: #000 }
-
-.navbar-header {
-  padding-left: 50px;
-}
-
-.navbar-right {
-  padding-right: 20px;
-}
-.navbar-btn {
-  margin-left: 5px;
-  margin-right: 5px;
-}
-
 .footer {
   color: rgb(120, 120, 120);
   margin-bottom: 20px;
 }
 
 .registration-form {
-  max-width: 700px;
+  max-width: 600px;
 }
 
-.login-form {
-  max-width: 500px;
-}
-
-.ask-password-reset-form {
-  max-width: 400px;
-}
-
-.set-new-password-form {
-  max-width: 500px;
-}
-
-.profile-content {
-  max-width: 700px;
+.form-group .multiple-checkbox ul {
+    padding-left: 0;
+    list-style: outside none none;
 }
 
 /* ******************** */
@@ -75,6 +59,14 @@ body > .container {
   border-radius: 5px;
 }
 
+.filter-menu {
+  padding: 10px 20px 10px 10px ;
+  background: white;
+  background: rgba(255,255,255,0.8);
+  box-shadow: 0 0 15px rgba(0,0,0,0.2);
+  border-radius: 5px;
+}
+
 .info h4 {
   margin: 4px;
   color: #777;
@@ -89,3 +81,7 @@ body > .container {
   line-height: 18px;
   color: #555;
 }
+
+.leaflet-popup-content p {
+    margin: 5px 0px !important;
+}
diff --git a/user_map/static/user_map/img/badge-developer.png b/user_map/static/user_map/img/badge-developer.png
new file mode 100644
index 0000000..9d69170
Binary files /dev/null and b/user_map/static/user_map/img/badge-developer.png differ
diff --git a/user_map/static/user_map/img/badge-trainer.png b/user_map/static/user_map/img/badge-trainer.png
new file mode 100644
index 0000000..ab191ab
Binary files /dev/null and b/user_map/static/user_map/img/badge-trainer.png differ
diff --git a/user_map/static/user_map/img/badge-user.png b/user_map/static/user_map/img/badge-user.png
new file mode 100644
index 0000000..dc215a7
Binary files /dev/null and b/user_map/static/user_map/img/badge-user.png differ
diff --git a/user_map/static/user_map/img/developer-icon.png b/user_map/static/user_map/img/developer-icon.png
deleted file mode 100644
index d9238ef..0000000
Binary files a/user_map/static/user_map/img/developer-icon.png and /dev/null differ
diff --git a/user_map/static/user_map/img/trainer-icon.png b/user_map/static/user_map/img/trainer-icon.png
deleted file mode 100644
index b920b47..0000000
Binary files a/user_map/static/user_map/img/trainer-icon.png and /dev/null differ
diff --git a/user_map/static/user_map/js/jsrender.min.js b/user_map/static/user_map/js/jsrender.min.js
new file mode 100644
index 0000000..66fbbb1
--- /dev/null
+++ b/user_map/static/user_map/js/jsrender.min.js
@@ -0,0 +1,4 @@
+/*! JsRender v0.9.73 (Beta): http://jsviews.com/#jsrender */
+/*! **VERSION FOR WEB** (For NODE.JS see http://jsviews.com/download/jsrender-node.js) */
+!function(e){var t=(0,eval)("this"),n=t.jQuery;"function"==typeof define&&define.amd?define(e):"object"==typeof exports?module.exports=n?e(n):function(t){if(t&&!t.fn)throw"Provide jQuery or null";return e(t)}:e(!1)}(function(e){"use strict";function t(e,t){return function(){var n,r=this,i=r.base;return r.base=e,n=t.apply(r,arguments),r.base=i,n}}function n(e,n){return G(n)&&(n=t(e?e._d?e:t(a,e):a,n),n._d=1),n}function r(e,t){for(var r in t.props)_e.test(r)&&(e[r]=n(e[r],t.props[r]))}function i(e){return e}function a(){return""}function s(e){try{throw"dbg breakpoint"}catch(t){}return this.base?this.baseApply(arguments):e}function o(e){re._dbgMode=e!==!1}function d(t){this.name=(e.link?"JsViews":"JsRender")+" Error",this.message=t||this.name}function p(e,t){var n;for(n in t)e[n]=t[n];return e}function l(e,t,n){return(0!==this||e)&&(se=e?e.charAt(0):se,oe=e?e.charAt(1):oe,de=t?t.charAt(0):de,pe=t?t.charAt(1):pe,le=n||le,e="\\"+se+"(\\"+le+")?\\"+oe,t="\\"+de+"\\"+pe,D="(?:(\\w+(?=[\\/\\s\\"+de+"]))|(\\w+)?(:)|(>)|(\\*))\\s*((?:[^\\"+de+"]|\\"+de+"(?!\\"+pe+"))*?)",ne.rTag="(?:"+D+")",D=new RegExp("(?:"+e+D+"(\\/)?|\\"+se+"(\\"+le+")?\\"+oe+"(?:(?:\\/(\\w+))\\s*|!--[\\s\\S]*?--))"+t,"g"),P=new RegExp("<.*>|([^\\\\]|^)[{}]|"+e+".*"+t)),[se,oe,de,pe,le]}function u(e,t){t||e===!0||(t=e,e=void 0);var n,r,i,a,s=this,o=!t||"root"===t;if(e){if(a=t&&s.type===t&&s,!a)if(n=s.views,s._.useKey){for(r in n)if(a=t?n[r].get(e,t):n[r])break}else for(r=0,i=n.length;!a&&i>r;r++)a=t?n[r].get(e,t):n[r]}else if(o)for(;s.parent;)a=s,s=s.parent;else for(;s&&!a;)a=s.type===t?s:void 0,s=s.parent;return a}function c(){var e=this.get("item");return e?e.index:void 0}function f(){return this.index}function g(e){var t,n=this,r=n.linkCtx,i=(n.ctx||{})[e];return void 0===i&&r&&r.ctx&&(i=r.ctx[e]),void 0===i&&(i=ee[e]),i&&G(i)&&!i._wrp&&(t=function(){return i.apply(this&&this!==L?this:n,arguments)},t._wrp=n,p(t,i)),t||i}function v(e){return e&&(e.fn?e:this.getRsc("templates",e)||X(e))}function m(e,t,n,i){var a,s,o="number"==typeof n&&t.tmpl.bnds[n-1],d=t.linkCtx;return void 0!==i?n=i={props:{},args:[i]}:o&&(n=o(t.data,t,z)),s=n.args[0],(e||o)&&(a=d&&d.tag,a||(a=p(new ne._tg,{_:{inline:!d,bnd:o,unlinked:!0},tagName:":",cvt:e,flow:!0,tagCtx:n}),d&&(d.tag=a,a.linkCtx=d),n.ctx=K(n.ctx,(d?d.view:t).ctx)),a._er=i&&s,r(a,n),n.view=t,a.ctx=n.ctx||{},n.ctx=void 0,s=a.cvtArgs(a.convert||"true"!==e&&e)[0],s=o&&t._.onRender?t._.onRender(s,t,a):s),void 0!=s?s:""}function h(e){var t=this,n=t.tagCtx,r=n.view,i=n.args;return e=t.convert||e,e=e&&(""+e===e?r.getRsc("converters",e)||M("Unknown converter: '"+e+"'"):e),i=i.length||n.index?e?i.slice():i:[r.data],e&&(e.depends&&(t.depends=ne.getDeps(t.depends,t,e.depends,e)),i[0]=e.apply(t,i)),i}function w(e,t){for(var n,r,i=this;void 0===n&&i;)r=i.tmpl&&i.tmpl[e],n=r&&r[t],i=i.parent;return n||z[e][t]}function x(e,t,n,i,a,s){t=t||Z;var o,d,p,l,u,c,f,g,v,m,h,w,x,b,_,y,k,j,C,T="",A=t.linkCtx||0,V=t.ctx,$=n||t.tmpl,N="number"==typeof i&&t.tmpl.bnds[i-1];for("tag"===e._is?(o=e,e=o.tagName,i=o.tagCtxs,p=o.template):(d=t.getRsc("tags",e)||M("Unknown tag: {{"+e+"}} "),p=d.template),void 0!==s?(T+=s,i=s=[{props:{},args:[]}]):N&&(i=N(t.data,t,z)),g=i.length,f=0;g>f;f++)m=i[f],(!A||!A.tag||f&&!A.tag._.inline||o._er)&&((w=$.tmpls&&m.tmpl)&&(w=m.content=$.tmpls[w-1]),m.index=f,m.tmpl=w,m.render=R,m.view=t,m.ctx=K(m.ctx,V)),(n=m.props.tmpl)&&(m.tmpl=t.getTmpl(n)),o||(o=new d._ctr,x=!!o.init,o.parent=c=V&&V.tag,o.tagCtxs=i,C=o.dataMap,A&&(o._.inline=!1,A.tag=o,o.linkCtx=A),(o._.bnd=N||A.fn)?o._.arrVws={}:o.dataBoundOnly&&M("{^{"+e+"}} tag must be data-bound")),i=o.tagCtxs,C=o.dataMap,m.tag=o,C&&i&&(m.map=i[f].map),o.flow||(h=m.ctx=m.ctx||{},l=o.parents=h.parentTags=V&&K(h.parentTags,V.parentTags)||{},c&&(l[c.tagName]=c),l[o.tagName]=h.tag=o);if(!(o._er=s)){for(r(o,i[0]),o.rendering={},f=0;g>f;f++)m=o.tagCtx=i[f],k=m.props,y=o.cvtArgs(),(b=k.dataMap||C)&&(y.length||k.dataMap)&&(_=m.map,(!_||_.src!==y[0]||a)&&(_&&_.src&&_.unmap(),_=m.map=b.map(y[0],k,void 0,!o._.bnd)),y=[_.tgt]),o.ctx=m.ctx,f||(x&&(j=o.template,o.init(m,A,o.ctx),x=void 0),A&&(A.attr=o.attr=A.attr||o.attr),u=o.attr,o._.noVws=u&&u!==Ce),v=void 0,o.render&&(v=o.render.apply(o,y)),y.length||(y=[t]),void 0===v&&(v=m.render(y[0],!0)||(a?void 0:"")),T=T?T+(v||""):v;o.rendering=void 0}return o.tagCtx=i[0],o.ctx=o.tagCtx.ctx,o._.noVws&&o._.inline&&(T="text"===u?Y.html(T):""),N&&t._.onRender?t._.onRender(T,t,o):T}function b(e,t,n,r,i,a,s,o){var d,p,l,u=this,f="array"===t;u.content=o,u.views=f?[]:{},u.parent=n,u.type=t||"top",u.data=r,u.tmpl=i,l=u._={key:0,useKey:f?0:1,id:""+ke++,onRender:s,bnds:{}},u.linked=!!s,n?(d=n.views,p=n._,p.useKey?(d[l.key="_"+p.useKey++]=u,u.index=Ve,u.getIndex=c):d.length===(l.key=u.index=a)?d.push(u):d.splice(a,0,u),u.ctx=e||n.ctx):u.ctx=e}function _(e){var t,n,r,i,a,s,o;for(t in Ee)if(a=Ee[t],(s=a.compile)&&(n=e[t+"s"]))for(r in n)i=n[r]=s(r,n[r],e,0),i._is=t,i&&(o=ne.onStore[t])&&o(r,i,s)}function y(e,t,r){function i(){var t=this;t._={inline:!0,unlinked:!0},t.tagName=e}var a,s,o,d=new ne._tg;if(G(t)?t={depends:t.depends,render:t}:""+t===t&&(t={template:t}),s=t.baseTag){t.flow=!!t.flow,t.baseTag=s=""+s===s?r&&r.tags[s]||te[s]:s,d=p(d,s);for(o in t)d[o]=n(s[o],t[o])}else d=p(d,t);return void 0!==(a=d.template)&&(d.template=""+a===a?X[a]||X(a):a),d.init!==!1&&((i.prototype=d).constructor=d._ctr=i),r&&(d._parentTmpl=r),d}function k(e){return this.base.apply(this,e)}function j(t,n,r,i){function a(n){var a,o;if(""+n===n||n.nodeType>0&&(s=n)){if(!s)if(/^\.\/[^\\:*?"<>]*$/.test(n))(o=X[t=t||n])?n=o:s=document.getElementById(n);else if(e.fn&&!P.test(n))try{s=e(document).find(n)[0]}catch(d){}s&&(i?n=s.innerHTML:(a=s.getAttribute(Ae),a?a!==Re?(n=X[a],delete X[a]):e.fn&&(n=e.data(s)[Re]):(t=t||(e.fn?Re:n),n=j(t,s.innerHTML,r,i)),n.tmplName=t=t||a,t!==Re&&(X[t]=n),s.setAttribute(Ae,t),e.fn&&e.data(s,Re,n))),s=void 0}else n.fn||(n=void 0);return n}var s,o,d=n=n||"";return 0===i&&(i=void 0,d=a(d)),i=i||(n.markup?n:{}),i.tmplName=t,r&&(i._parentTmpl=r),!d&&n.markup&&(d=a(n.markup))&&d.fn&&(d=d.markup),void 0!==d?(d.fn||n.fn?d.fn&&(o=d):(n=T(d,i),N(d.replace(ve,"\\$&"),n)),o||(_(i),o=p(function(){return n.render.apply(n,arguments)},n)),t&&!r&&t!==Re&&(Me[t]=o),o):void 0}function C(e){function t(t,n){this.tgt=e.getTgt(t,n)}return G(e)&&(e={getTgt:e}),e.baseMap&&(e=p(p({},e.baseMap),e)),e.map=function(e,n){return new t(e,n)},e}function T(t,n){var r,i=re.wrapMap||{},a=p({tmpls:[],links:{},bnds:[],_is:"template",render:R},n);return a.markup=t,n.htmlTag||(r=we.exec(t),a.htmlTag=r?r[1].toLowerCase():""),r=i[a.htmlTag],r&&r!==i.div&&(a.markup=e.trim(a.markup)),a}function A(e,t){function n(i,a,s){var o,d,p,l;if(i&&typeof i===Te&&!i.nodeType&&!i.markup&&!i.getTgt){for(p in i)n(p,i[p],a);return z}return void 0===a&&(a=i,i=void 0),i&&""+i!==i&&(s=a,a=i,i=void 0),l=s?s[r]=s[r]||{}:n,d=t.compile,null===a?i&&delete l[i]:(a=d?d(i,a,s,0):a,i&&(l[i]=a)),d&&a&&(a._is=e),a&&(o=ne.onStore[e])&&o(i,a,d),a}var r=e+"s";z[r]=n}function R(e,t,n,r,i,a){var s,o,d,p,l,u,c,f,g=r,v="";if(t===!0?(n=t,t=void 0):typeof t!==Te&&(t=void 0),(d=this.tag)?(l=this,g=g||l.view,p=g.getTmpl(d.template||l.tmpl),arguments.length||(e=g)):p=this,p){if(!g&&e&&"view"===e._is&&(g=e),g&&e===g&&(e=g.data),u=!g,ie=ie||u,g||((t=t||{}).root=e),!ie||re.useViews||p.useViews||g&&g!==Z)v=V(p,e,t,n,g,i,a,d);else{if(g?(c=g.data,f=g.index,g.index=Ve):(g=Z,g.data=e,g.ctx=t),W(e)&&!n)for(s=0,o=e.length;o>s;s++)g.index=s,g.data=e[s],v+=p.fn(e[s],g,z);else g.data=e,v+=p.fn(e,g,z);g.data=c,g.index=f}u&&(ie=void 0)}return v}function V(e,t,n,r,i,a,s,o){function d(e){_=p({},n),_[x]=e}var l,u,c,f,g,v,m,h,w,x,_,y,k="";if(o&&(w=o.tagName,y=o.tagCtx,n=n?K(n,o.ctx):o.ctx,e===i.content?m=e!==i.ctx._wrp?i.ctx._wrp:void 0:e!==y.content?e===o.template?(m=y.tmpl,n._wrp=y.content):m=y.content||i.content:m=i.content,y.props.link===!1&&(n=n||{},n.link=!1),(x=y.props.itemVar)&&("~"!==x.charAt(0)&&$("Use itemVar='~myItem'"),x=x.slice(1))),i&&(s=s||i._.onRender,n=K(n,i.ctx)),a===!0&&(v=!0,a=0),s&&(n&&n.link===!1||o&&o._.noVws)&&(s=void 0),h=s,s===!0&&(h=void 0,s=i._.onRender),n=e.helpers?K(e.helpers,n):n,_=n,W(t)&&!r)for(c=v?i:void 0!==a&&i||new b(n,"array",i,t,e,a,s),i&&i._.useKey&&(c._.bnd=!o||o._.bnd&&o),x&&(c.it=x),x=c.it,l=0,u=t.length;u>l;l++)x&&d(t[l]),f=new b(_,"item",c,t[l],e,(a||0)+l,s,m),g=e.fn(t[l],f,z),k+=c._.onRender?c._.onRender(g,f):g;else x&&d(t),c=v?i:new b(_,w||"data",i,t,e,a,s,m),o&&!o.flow&&(c.tag=o),k+=e.fn(t,c,z);return h?h(k,c):k}function M(e,t,n){var r=re.onError(e,t,n);if(""+e===e)throw new ne.Err(r);return!t.linkCtx&&t.linked?Y.html(r):r}function $(e){M("Syntax error\n"+e)}function N(e,t,n,r,i){function a(t){t-=f,t&&v.push(e.substr(f,t).replace(fe,"\\n"))}function s(t,n){t&&(t+="}}",$((n?"{{"+n+"}} block has {{/"+t+" without {{"+t:"Unmatched or missing {{/"+t)+", in template:\n"+e))}function o(o,d,c,h,w,x,b,_,y,k,j,C){(b&&d||y&&!c||_&&":"===_.slice(-1)||k)&&$(o),x&&(w=":",h=Ce),y=y||n&&!i;var T=(d||n)&&[[]],A="",R="",V="",M="",N="",E="",S="",U="",K=!y&&!w;c=c||(_=_||"#data",w),a(C),f=C+o.length,b?u&&v.push(["*","\n"+_.replace(/^:/,"ret+= ").replace(ge,"$1")+";\n"]):c?("else"===c&&(he.test(_)&&$('for "{{else if expr}}" use "{{else expr}}"'),T=m[7]&&[[]],m[8]=e.substring(m[8],C),m=g.pop(),v=m[2],K=!0),_&&I(_.replace(fe," "),T,t).replace(me,function(e,t,n,r,i,a,s,o){return r="'"+i+"':",s?(R+=a+",",M+="'"+o+"',"):n?(V+=r+a+",",E+=r+"'"+o+"',"):t?S+=a:("trigger"===i&&(U+=a),A+=r+a+",",N+=r+"'"+o+"',",l=l||_e.test(i)),""}).slice(0,-1),T&&T[0]&&T.pop(),p=[c,h||!!r||l||"",K&&[],F(M,N,E),F(R,A,V),S,U,T||0],v.push(p),K&&(g.push(m),m=p,m[8]=f)):j&&(s(j!==m[0]&&"else"!==m[0]&&j,m[0]),m[8]=e.substring(m[8],C),m=g.pop()),s(!m&&j),v=m[2]}var d,p,l,u=re.allowCode||t&&t.allowCode,c=[],f=0,g=[],v=c,m=[,,c];return u&&(t.allowCode=u),n&&(void 0!==r&&(e=e.slice(0,-r.length-2)+pe),e=se+e+pe),s(g[0]&&g[0][2].pop()[0]),e.replace(D,o),a(e.length),(f=c[c.length-1])&&s(""+f!==f&&+f[8]===f[8]&&f[0]),n?(d=U(c,e,n),E(d,[c[0][7]])):d=U(c,t),d}function E(e,t){var n,r,i=0,a=t.length;for(e.deps=[];a>i;i++){r=t[i];for(n in r)"_jsvto"!==n&&r[n].length&&(e.deps=e.deps.concat(r[n]))}e.paths=r}function F(e,t,n){return[e.slice(0,-1),t.slice(0,-1),n.slice(0,-1)]}function S(e,t){return"\n	"+(t?t+":{":"")+"args:["+e[0]+"]"+(e[1]||!t?",\n	props:{"+e[1]+"}":"")+(e[2]?",\n	ctx:{"+e[2]+"}":"")}function I(e,t,n){function r(r,h,w,x,b,_,y,k,j,C,T,A,R,V,M,E,F,S,I,U){function K(e,n,r,s,o,d,u,c){var f="."===r;if(r&&(b=b.slice(n.length),f||(e=(s?'view.hlp("'+s+'")':o?"view":"data")+(c?(d?"."+d:s?"":o?"":"."+r)+(u||""):(c=s?"":o?d||"":r,"")),e+=c?"."+c:"",e=n+("view.data"===e.slice(0,9)?e.slice(5):e)),p)){if(q="linkTo"===i?a=t._jsvto=t._jsvto||[]:l.bd,B=f&&q[q.length-1]){if(B._jsv){for(;B.sb;)B=B.sb;B.bnd&&(b="^"+b.slice(1)),B.sb=b,B.bnd=B.bnd||"^"===b.charAt(0)}}else q.push(b);m[g]=I+(f?1:0)}return e}x=p&&x,x&&!k&&(b=x+b),_=_||"",w=w||h||A,b=b||j,C=C||F||"";var J,O,q,B,L;if(!y||d||o){if(p&&E&&!d&&!o&&(!i||s||a)&&(J=m[g-1],U.length-1>I-(J||0))){if(J=U.slice(J,I+r.length),O!==!0)if(q=a||u[g-1].bd,B=q[q.length-1],B&&B.prm){for(;B.sb&&B.sb.prm;)B=B.sb;L=B.sb={path:B.sb,bnd:B.bnd}}else q.push(L={path:q.pop()});E=oe+":"+J+" onerror=''"+de,O=f[E],O||(f[E]=!0,f[E]=O=N(E,n,!0)),O!==!0&&L&&(L._jsv=O,L.prm=l.bd,L.bnd=L.bnd||L.path&&L.path.indexOf("^")>=0)}return d?(d=!R,d?r:A+'"'):o?(o=!V,o?r:A+'"'):(w?(m[g]=I++,l=u[++g]={bd:[]},w):"")+(S?g?"":(c=U.slice(c,I),(i?(i=s=a=!1,"\b"):"\b,")+c+(c=I+r.length,p&&t.push(l.bd=[]),"\b")):k?(g&&$(e),p&&t.pop(),i=b,s=x,c=I+r.length,x&&(p=l.bd=t[i]=[]),b+":"):b?b.split("^").join(".").replace(ue,K)+(C?(l=u[++g]={bd:[]},v[g]=!0,C):_):_?_:M?(v[g]=!1,l=u[--g],M+(C?(l=u[++g],v[g]=!0,C):"")):T?(v[g]||$(e),","):h?"":(d=R,o=V,'"'))}$(e)}var i,a,s,o,d,p=t&&t[0],l={bd:p},u={0:l},c=0,f=n?n.links:p&&(p.links=p.links||{}),g=0,v={},m={},h=(e+(n?" ":"")).replace(ce,r);return!g&&h||$(e)}function U(e,t,n){var r,i,a,s,o,d,p,l,u,c,f,g,v,m,h,w,x,b,_,y,k,j,C,A,R,V,M,N,F,I,K=0,J=re.useViews||t.useViews||t.tags||t.templates||t.helpers||t.converters,O="",q={},B=e.length;for(""+t===t?(b=n?'data-link="'+t.replace(fe," ").slice(1,-1)+'"':t,t=0):(b=t.tmplName||"unnamed",t.allowCode&&(q.allowCode=!0),t.debug&&(q.debug=!0),f=t.bnds,x=t.tmpls),r=0;B>r;r++)if(i=e[r],""+i===i)O+='\n+"'+i+'"';else if(a=i[0],"*"===a)O+=";\n"+i[1]+"\nret=ret";else{if(s=i[1],k=!n&&i[2],o=S(i[3],"params")+"},"+S(v=i[4]),N=i[5],I=i[6],j=i[8]&&i[8].replace(ge,"$1"),(R="else"===a)?g&&g.push(i[7]):(K=0,f&&(g=i[7])&&(g=[g],K=f.push(1))),J=J||v[1]||v[2]||g||/view.(?!index)/.test(v[0]),(V=":"===a)?s&&(a=s===Ce?">":s+a):(k&&(_=T(j,q),_.tmplName=b+"/"+a,_.useViews=_.useViews||J,U(k,_),J=_.useViews,x.push(_)),R||(y=a,J=J||a&&(!te[a]||!te[a].flow),A=O,O=""),C=e[r+1],C=C&&"else"===C[0]),F=N?";\ntry{\nret+=":"\n+",m="",h="",V&&(g||I||s&&s!==Ce)){if(M="return {"+o+"};",w='c("'+s+'",view,',M=new Function("data,view,j,u"," // "+b+" "+K+" "+a+"\n"+M),M._er=N,m=w+K+",",h=")",M._tag=a,n)return M;E(M,g),c=!0}if(O+=V?(n?(N?"\ntry{\n":"")+"return ":F)+(c?(c=void 0,J=u=!0,w+(g?(f[K-1]=M,K):"{"+o+"}")+")"):">"===a?(p=!0,"h("+v[0]+")"):(l=!0,"((v="+(v[0]||"data")+')!=null?v:"")')):(d=!0,"\n{view:view,tmpl:"+(k?x.length:"0")+","+o+"},"),y&&!C){if(O="["+O.slice(0,-1)+"]",w='t("'+y+'",view,this,',n||g){if(O=new Function("data,view,j,u"," // "+b+" "+K+" "+y+"\nreturn "+O+";"),O._er=N,O._tag=y,g&&E(f[K-1]=O,g),n)return O;m=w+K+",undefined,",h=")"}O=A+F+w+(K||O)+")",g=0,y=0}N&&(J=!0,O+=";\n}catch(e){ret"+(n?"urn ":"+=")+m+"j._err(e,view,"+N+")"+h+";}\n"+(n?"":"ret=ret"))}O="// "+b+"\nvar v"+(d?",t=j._tag":"")+(u?",c=j._cnvt":"")+(p?",h=j.converters.html":"")+(n?";\n":',ret=""\n')+(q.debug?"debugger;":"")+O+(n?"\n":";\nreturn ret;"),re._dbgMode&&(O="try {\n"+O+"\n}catch(e){\nreturn j._err(e, view);\n}");try{O=new Function("data,view,j,u",O)}catch(L){$("Compiled template code:\n\n"+O+'\n: "'+L.message+'"')}return t&&(t.fn=O,t.useViews=!!J),O}function K(e,t){return e&&e!==t?t?p(p({},t),e):e:t&&p({},t)}function J(e){return je[e]||(je[e]="&#"+e.charCodeAt(0)+";")}function O(e){var t,n,r=[];if(typeof e===Te)for(t in e)n=e[t],n&&n.toJSON&&!n.toJSON()||G(n)||r.push({key:t,prop:n});return r}function q(t,n,r){var i=this.jquery&&(this[0]||M('Unknown template: "'+this.selector+'"')),a=i.getAttribute(Ae);return R.call(a?e.data(i)[Re]:X(i),t,n,r)}function B(e){return void 0!=e?be.test(e)&&(""+e).replace(ye,J)||e:""}var L=(0,eval)("this"),Q=e===!1;e=e&&e.fn?e:L.jQuery;var H,D,P,Z,z,G,W,X,Y,ee,te,ne,re,ie,ae="v0.9.73",se="{",oe="{",de="}",pe="}",le="^",ue=/^(!*?)(?:null|true|false|\d[\d.]*|([\w$]+|\.|~([\w$]+)|#(view|([\w$]+))?)([\w$.^]*?)(?:[.[^]([\w$]+)\]?)?)$/g,ce=/(\()(?=\s*\()|(?:([([])\s*)?(?:(\^?)(!*?[#~]?[\w$.^]+)?\s*((\+\+|--)|\+|-|&&|\|\||===|!==|==|!=|<=|>=|[<>%*:?\/]|(=))\s*|(!*?[#~]?[\w$.^]+)([([])?)|(,\s*)|(\(?)\\?(?:(')|("))|(?:\s*(([)\]])(?=\s*[.^]|\s*$|[^([])|[)\]])([([]?))|(\s+)/g,fe=/[ \t]*(\r\n|\n|\r)/g,ge=/\\(['"])/g,ve=/['"\\]/g,me=/(?:\x08|^)(onerror:)?(?:(~?)(([\w$_\.]+):)?([^\x08]+))\x08(,)?([^\x08]+)/gi,he=/^if\s/,we=/<(\w+)[>\s]/,xe=/[\x00`><"'&]/g,be=/[\x00`><\"'&]/,_e=/^on[A-Z]|^convert(Back)?$/,ye=xe,ke=0,je={"&":"&amp;","<":"&lt;",">":"&gt;","\x00":"&#0;","'":"&#39;",'"':"&#34;","`":"&#96;"},Ce="html",Te="object",Ae="data-jsv-tmpl",Re="jsvTmpl",Ve="For #index in nested block use #getIndex().",Me={},$e=L.jsrender,Ne=$e&&e&&!e.render,Ee={template:{compile:j},tag:{compile:y},helper:{},converter:{}};if(z={jsviews:ae,settings:function(e){p(re,e),o(re._dbgMode),re.jsv&&re.jsv()},sub:{View:b,Err:d,tmplFn:N,parse:I,extend:p,extendCtx:K,syntaxErr:$,onStore:{},_ths:r,_tg:function(){}},map:C,_cnvt:m,_tag:x,_err:M},(d.prototype=new Error).constructor=d,c.depends=function(){return[this.get("item"),"index"]},f.depends="index",b.prototype={get:u,getIndex:f,getRsc:w,getTmpl:v,hlp:g,_is:"view"},!($e||e&&e.render)){for(H in Ee)A(H,Ee[H]);X=z.templates,Y=z.converters,ee=z.helpers,te=z.tags,ne=z.sub,re=z.settings,ne._tg.prototype={baseApply:k,cvtArgs:h},Z=ne.topView=new b,e?(e.fn.render=q,e.observable&&(p(ne,e.views.sub),z.map=e.views.map)):(e={},Q&&(L.jsrender=e),e.renderFile=e.__express=e.compile=function(){throw"Node.js: use npm jsrender, or jsrender-node.js"},e.isFunction=function(e){return"function"==typeof e},e.isArray=Array.isArray||function(e){return"[object Array]"==={}.toString.call(e)},ne._jq=function(t){t!==e&&(p(t,e),e=t,e.fn.render=q,delete e.jsrender)},e.jsrender=ae),G=e.isFunction,W=e.isArray,e.render=Me,e.views=z,e.templates=X=z.templates,re({debugMode:o,delimiters:l,onError:function(e,t,n){return t&&(e=void 0===n?"{Error: "+(e.message||e)+"}":G(n)?n(e,t):n),void 0==e?"":e},_dbgMode:!1}),te({"if":{render:function(e){var t=this,n=t.tagCtx,r=t.rendering.done||!e&&(arguments.length||!n.index)?"":(t.rendering.done=!0,t.selected=n.index,n.render(n.view,!0));return r},flow:!0},"for":{render:function(e){var t,n=!arguments.length,r=this,i=r.tagCtx,a="",s=0;return r.rendering.done||(t=n?i.view.data:e,void 0!==t&&(a+=i.render(t,n),s+=W(t)?t.length:1),(r.rendering.done=s)&&(r.selected=i.index)),a},flow:!0},props:{baseTag:"for",dataMap:C(O),flow:!0},include:{flow:!0},"*":{render:i,flow:!0},":*":{render:i,flow:!0},dbg:ee.dbg=Y.dbg=s}),Y({html:B,attr:B,url:function(e){return void 0!=e?encodeURI(""+e):null===e?e:""}}),l()}return Ne&&$e.views.sub._jq(e),e||$e});
+//# sourceMappingURL=jsrender.min.js.map
\ No newline at end of file
diff --git a/user_map/static/user_map/js/user-map.js b/user_map/static/user_map/js/user-map.js
index 1d67b34..e18f326 100644
--- a/user_map/static/user_map/js/user-map.js
+++ b/user_map/static/user_map/js/user-map.js
@@ -9,89 +9,66 @@
 /**
  * Add users to the respective layer based on role.
  * @param {string} url The url view to get users.
- * @param {object} role The role object.
+ * @param {object} users_layer Passed users' layer
+ * @param {object} icon The icon object for marker
  * @name L The Class from Leaflet.
  * @property geoJson Property of L class.
  * @property users Property of response object.
  * @function addTo add child element to the map.
  * @property properties Property of a feature.
- * @property popupContent Property of properties.
+ * @property popup_content property of properties.
  * @function bindPopup Bind popup to marker
  */
-function addUsers(url, role) {
+function addUsers(url, users_layer, icon) {
   $.ajax({
     type: 'GET',
     url: url,
     dataType: 'json',
-    data: {
-      user_role: role['name']
-    },
     success: function (response) {
-      L.geoJson(
-          response.users,
-          {
-            onEachFeature: onEachFeature,
-            pointToLayer: function (feature, latlng) {
-              return L.marker(latlng,{icon: role['icon'] });
-            }
-          }).addTo(role['layer']);
+       L.geoJson(response, {
+         onEachFeature: function (feature, layer) {
+           var feature_roles = [];
+           for (i = 0; i < feature.properties.roles.length; ++i){
+             feature_roles.push(roles_dict[feature.properties.roles[i]]);
+           }
+           var data = {
+             properties: feature.properties,
+             roles: feature_roles
+           };
+           var popup_content = popup_template.render(data);
+           layer.bindPopup(popup_content);
+         },
+         pointToLayer: function(feature, latlng) {
+           return L.marker(latlng, {icon: icon})
+         }
+       }).addTo(users_layer);
+
+      filterUsers();
     }
   });
-  function onEachFeature(feature, layer) {
-    // Set the popup content if it does have the content
-    if (feature.properties && feature.properties.popupContent) {
-      layer.bindPopup(feature.properties.popupContent);
-    }
-  }
 }
 
 /**
- * Create basemap instance to be used.
- * @param {string} url The URL for the tiles layer
- * @param {string} attribution The attribution of the layer
- * @property tileLayer
- * @returns {object} base_map
+ * Filter users based on the filter control
  */
-function createBasemap(url, attribution) {
-  var base_map;
-  base_map = L.tileLayer(url, {
-    attribution: attribution,
-    maxZoom: 18
+function filterUsers() {
+  // Clear previous displayed_users
+  displayed_users.clearLayers();
+
+  // Get all selected roles
+  var checked_roles = [];
+  $("input:checkbox[class=role-filter]:checked").each(function () {
+        checked_roles.push($(this).val());
   });
-  return base_map;
-}
 
-/**
- * Create IconMarkerBase that will be used for icon marker.
- * @param {string} shadow_icon_path The path to shadow icon.
- * @returns {object} IconMarkerBase
- * @property Icon
- */
-function createIconMarkerBase(shadow_icon_path) {
-  var IconMarkerBase;
-  IconMarkerBase = L.Icon.extend({
-    options: {
-      shadowUrl: shadow_icon_path,
-      iconSize: [19, 32],
-      shadowSize: [42, 35],
-      iconAnchor: [12, 32],
-      shadowAnchor: [12, 32],
-      popupAnchor: [-2, -32]
+  users_layer.eachLayer(function(layer) {
+    for (var i = 0; i < checked_roles.length; i++) {
+      if (layer.feature.properties.roles.indexOf(parseInt(checked_roles[i])) !== -1) {
+        displayed_users.addLayer(layer);
+        break;
+      }
     }
   });
-  return IconMarkerBase;
-}
-
-/**
- * Create leaflet icon marker.
- *
- * @param {string} icon_path The icon path.
- * @param {string} shadow_path The shadow path.
- * @return {IconMarkerBase} icon_marker
- */
-function createIconMarker(icon_path, shadow_path) {
-  var IconMarkerBase = createIconMarkerBase(shadow_path);
-  return new IconMarkerBase({iconUrl: icon_path});
 }
 
 /**
@@ -153,14 +130,8 @@ function createUserMenuControl(options) {
       if (options.indexOf('edit') != -1)
         user_menu_container.innerHTML += $("#user-menu-edit-button").html();
 
-      if (options.indexOf('delete') != -1)
-        user_menu_container.innerHTML += $("#user-menu-delete-button").html();
-
-      if (options.indexOf('download') != -1)
-        user_menu_container.innerHTML += $("#user-menu-download-button").html();
-
-      if (options.indexOf('forgot') != -1)
-        user_menu_container.innerHTML += $("#user-menu-forgot-button").html();
+      if (options.indexOf('api') != -1)
+        user_menu_container.innerHTML += $("#user-menu-api-button").html();
 
       //Prevent firing drag and onClickMap event when clicking this control
       var stop = L.DomEvent.stopPropagation;
@@ -203,6 +174,33 @@ function createLegendControl(){
   return control;
 }
 
+/**
+ * Create filter control instance on the top right of the map.
+ *
+ * @returns {object} control
+ */
+function createFilterControl() {
+  var control;
+  control = L.Control.extend({
+    options: {
+      position: 'topright'
+    },
+    onAdd: function () {
+      var filter_container = L.DomUtil.create('div', 'filter-menu filter');
+      filter_container.innerHTML += $("#role-filter").html();
+
+      //Prevent firing drag and onClickMap event when clicking this control
+      var stop = L.DomEvent.stopPropagation;
+      L.DomEvent
+          .on(filter_container, 'mousedown', stop)
+          .on(filter_container, 'dblclick', stop);
+      return filter_container;
+    }
+  });
+  return control;
+}
+
+
 /**
  * Open an information modal. There is only one modal to use for showing information.
  * This function should be used if there is no other specific behaviour about the modal.
diff --git a/user_map/templates/user_map/account/edit_user.html b/user_map/templates/user_map/account/edit_user.html
deleted file mode 100644
index da61661..0000000
--- a/user_map/templates/user_map/account/edit_user.html
+++ /dev/null
@@ -1,124 +0,0 @@
-{% extends "user_map/base_page.html" %}
-{% load leaflet_tags %}
-{% load bootstrap %}
-
-{% block head_resources %}
-  {{ block.super }}
-  {% leaflet_js plugins="forms" %}
-  {% leaflet_css plugins="forms" %}
-{% endblock head_resources %}
-
-{% block main_content %}
-  <div class="container">
-    <div class="page-header">
-    <h2>Update Profile
-      <br><small>So I heard you want to update your information </small></h2>
-    </div>
-
-    <div class="update-provile-nav">
-      <div class="col-md-2 well">
-        <ul id="profile_tab" class="nav nav-stacked">
-          <li>
-            <a data-toggle="tab" href="#basic-information">Basic Information</a>
-          </li>
-          <li>
-            <a data-toggle="tab" href="#security">Security</a>
-          </li>
-          <li>
-            <a data-toggle="tab" href="#account-setting">Account Settings</a>
-          </li>
-        </ul>
-      </div>
-    </div>
-
-    <div class="col-lg-9">
-      <div id="profile_content" class="tab-content profile-content">
-        {% if messages %}
-          {% for message in messages %}
-            {% if 'success' in message.tags %}
-              <div class="alert alert-success">
-                <a class="close" href="#" data-dismiss="alert">x</a>
-                {{ message }}
-              </div>
-            {% endif %}
-          {% endfor %}
-        {% endif %}
-
-        <div id="basic-information" class="tab-pane fade">
-          <div class="panel panel-default">
-             <div class="panel-heading">
-               <h3 class="panel-title">Basic Information</h3>
-             </div>
-             <div class="panel-body">
-               <form id="form-basic-info" class="form-horizontal" method="POST">
-                {% csrf_token %}
-                {{ basic_info_form|bootstrap_horizontal:'col-lg-3'}}
-                <div class="form-group">
-                  <div class="col-lg-offset-3 col-lg-6">
-                    <input type="submit" name="change_basic_info" value="Submit" class="btn btn-default">
-                  </div>
-                </div>
-               </form>
-             </div>
-          </div>
-        </div>
-
-        <div id="security" class="tab-pane fade">
-           <div class="panel panel-default">
-             <div class="panel-heading">
-               <h3 class="panel-title">Change Password</h3>
-             </div>
-             <div class="panel-body">
-               <form id="form-security" class="form-horizontal" method="POST">
-                 {% csrf_token %}
-                 {{ change_password_form|bootstrap_horizontal:'col-lg-3'}}
-                 <div class="form-group">
-                   <div class="col-lg-offset-3 col-lg-6">
-                     <input type="submit" name="change_password" value="Submit" class="btn btn-default">
-                   </div>
-                 </div>
-               </form>
-             </div>
-           </div>
-        </div>
-
-        <div id="account-setting" class="tab-pane fade">
-          <div class="panel panel-default">
-            <div class="panel-heading">
-              <h3 class="panel-title">Delete Account</h3>
-            </div>
-            <div class="panel-body">
-              <p>
-                Once you delete your account, you will be no longer available
-                on the map. However, you can register again any time you
-                want!
-              </p>
-              <form method="POST" action="{% url 'user_map:delete_user' %}">
-                {% csrf_token %}
-                <input type="submit" value="Delete my account" class="btn btn-danger">
-              </form>
-            </div>
-          </div>
-        </div>
-    </div>
-  </div>
-</div>
-{% endblock main_content %}
-
-{% block js_container %}
-  <script type="text/javascript">
-    $(document).on('shown.bs.tab', function(event) {
-      var scrollmem = $('body').scrollTop();
-      window.location.hash = $(event.target).attr('href');
-      $('html,body').scrollTop(scrollmem);
-    });
-
-    $(document).ready(function () {
-      var anchor_id = window.location.hash;
-      if (anchor_id == "") {
-        anchor_id = "{{ anchor_id }}"
-      }
-      $('#profile_tab a[href="'+ anchor_id +'"]').tab('show');
-    });
-  </script>
-{% endblock js_container %}
diff --git a/user_map/templates/user_map/account/login.html b/user_map/templates/user_map/account/login.html
deleted file mode 100644
index 33d9b6e..0000000
--- a/user_map/templates/user_map/account/login.html
+++ /dev/null
@@ -1,39 +0,0 @@
-{% extends "user_map/base_page.html" %}
-{% load leaflet_tags %}
-{% load bootstrap %}
-
-{% block head_resources %}
-  {{ block.super }}
-  {% leaflet_js plugins="forms" %}
-  {% leaflet_css plugins="forms" %}
-{% endblock head_resources %}
-
-{% block main_content %}
-   {{ block.super }}
-  <div class="container autoheight">
-    <div class="page-header">
-    <h2>Sign In <br><small>Please provide your account information on the form
-      below.</small></h2>
-    </div>
-    <div class="login-form">
-      <form class="form-horizontal" action='#' method='POST'>
-        {% csrf_token %}
-        {{ form|bootstrap_horizontal:'col-lg-2'}}
-        <div class="form-group">
-          <div class="col-lg-offset-2 col-lg-4">
-            <input type="submit" value="Sign In" class="btn btn-default">
-          </div>
-        </div>
-        <div class="form-group">
-        <div class="col-lg-offset-2 col-lg-6">
-          <a href="{% url 'user_map:password_reset'%}">Forgot your password?</a>
-        </div>
-      </div>
-      </form>
-    </div>
-  </div>
-{% endblock main_content %}
-
-{% block js_container %}
-  {{ block.super }}
-{% endblock js_container %}
diff --git a/user_map/templates/user_map/account/password_reset_complete.html b/user_map/templates/user_map/account/password_reset_complete.html
deleted file mode 100644
index c83b429..0000000
--- a/user_map/templates/user_map/account/password_reset_complete.html
+++ /dev/null
@@ -1,16 +0,0 @@
-{% extends 'user_map/base_page.html' %}
-
-{% block main_content %}
-  <div class="container autoheight">
-    <div class="main-content">
-      <div class="page-header">
-      <h2>Reset Password Complete</h2>
-      </div>
-    </div>
-
-    <p>Your password has been reset.  You may go ahead and log in now.</p>
-    <p><a href="{% url 'user_map:login' %}">Log in</a></p>
-
-  </div>
-{% endblock main_content%}
-
diff --git a/user_map/templates/user_map/account/password_reset_confirm.html b/user_map/templates/user_map/account/password_reset_confirm.html
deleted file mode 100644
index aaacc82..0000000
--- a/user_map/templates/user_map/account/password_reset_confirm.html
+++ /dev/null
@@ -1,31 +0,0 @@
-{% extends 'user_map/base_page.html' %}
-{% load bootstrap %}
-
-{% block title %}Reset Password{% endblock %}
-
-{% block main_content %}
-  <div class="container autoheight">
-    <div class="main-content">
-      <div class="page-header">
-      <h2>Reset Your Password
-        <br><small>Please enter your new password on the form below.</small></h2>
-      </div>
-    </div>
-
-    {% if validlink %}
-      <div class="set-new-password-form">
-        <form class="form-horizontal" action='#' method='POST'>
-          {% csrf_token %}
-          {{ form|bootstrap_horizontal:'col-lg-3'}}
-          <div class="form-group">
-            <div class="col-lg-offset-3 col-lg-3">
-              <input type="submit" value="Submit" class="btn btn-default">
-            </div>
-          </div>
-        </form>
-      </div>
-    {% else %}
-      <p>Ooops! This reset link is no longer valid!</p>
-    {% endif %}
-  </div>
-{% endblock main_content %}
diff --git a/user_map/templates/user_map/account/password_reset_done.html b/user_map/templates/user_map/account/password_reset_done.html
deleted file mode 100644
index ed38bee..0000000
--- a/user_map/templates/user_map/account/password_reset_done.html
+++ /dev/null
@@ -1,19 +0,0 @@
-{% extends 'user_map/base_page.html' %}
-
-{% block main_content %}
-  <div class="container autoheight">
-    <div class="main-content">
-      <div class="page-header">
-      <h2>Reset Password</h2>
-      </div>
-    </div>
-
-    <p>We've e-mailed you instructions for setting your password to the e-mail address you submitted.</p>
-    <p>You should be receiving it shortly.</p>
-    <br>
-    <p>
-      If you don't receive an email, please make sure you've entered the
-      address you registered with, and check your spam folder.
-    </p>
-  </div>
-{% endblock main_content%}
diff --git a/user_map/templates/user_map/account/password_reset_email.html b/user_map/templates/user_map/account/password_reset_email.html
deleted file mode 100644
index c5d627c..0000000
--- a/user_map/templates/user_map/account/password_reset_email.html
+++ /dev/null
@@ -1,9 +0,0 @@
-{% autoescape off %}
-Hi {{ user.name}},
-
-You're receiving this email because you requested a password reset for your user account at {{ site_name }}
-Please go to the following page to set a new password:
-{{ protocol}}://{{ domain }}{% url 'user_map:password_reset_confirm' uidb64=uid token=token %}
-
-Thanks for using our site!
-{% endautoescape %}
diff --git a/user_map/templates/user_map/account/password_reset_form.html b/user_map/templates/user_map/account/password_reset_form.html
deleted file mode 100644
index 3e0399d..0000000
--- a/user_map/templates/user_map/account/password_reset_form.html
+++ /dev/null
@@ -1,27 +0,0 @@
-{% extends 'user_map/base_page.html' %}
-{% load bootstrap %}
-
-{% block title %}Reset Password {% endblock %}
-
-{% block main_content %}
-  <div class="container autoheight">
-    <div class="main-content">
-      <div class="page-header">
-      <h2>Reset Password <br><small>Please provide your account information
-        on the form below.</small></h2>
-      </div>
-    </div>
-
-    <div class="ask-password-reset-form">
-      <form class="form-horizontal" action='#' method='POST'>
-      {% csrf_token %}
-      {{ form|bootstrap_horizontal:'col-lg-2'}}
-      <div class="form-group">
-        <div class="col-lg-offset-2 col-lg-4">
-          <input type="submit" value="Submit" class="btn btn-default">
-        </div>
-      </div>
-    </form>
-    </div>
-  </div>
-{% endblock main_content %}
diff --git a/user_map/templates/user_map/account/registration.html b/user_map/templates/user_map/account/registration.html
deleted file mode 100644
index 98fca09..0000000
--- a/user_map/templates/user_map/account/registration.html
+++ /dev/null
@@ -1,40 +0,0 @@
-{% extends "user_map/base_page.html" %}
-{% load leaflet_tags %}
-{% load bootstrap %}
-
-{% block head_resources %}
-  {{ block.super }}
-  {% leaflet_js plugins="forms" %}
-  {% leaflet_css plugins="forms" %}
-{% endblock head_resources %}
-
-{% block main_content %}
-  <div class="container">
-    <div class="page-header">
-    <h2>Add me to map! <br><small>Please provide your information on the
-      form
-      below.</small></h2>
-    </div>
-    <div class="registration-form">
-      {% if messages %}
-        {% for message in messages %}
-          {% if 'success' in message.tags %}
-            <div class="alert alert-success">
-              <a class="close" href="#" data-dismiss="alert">x</a>
-              {{ message }}
-            </div>
-          {% endif %}
-        {% endfor %}
-      {% endif %}
-      <form class="form-horizontal" method="POST" >
-        {% csrf_token %}
-        {{ form|bootstrap_horizontal:'col-lg-3'}}
-        <div class="form-group">
-          <div class="col-lg-offset-3 col-lg-4">
-            <input type="submit" value="Submit" class="btn btn-default">
-          </div>
-        </div>
-      </form>
-     </div>
-  </div>
-{% endblock main_content %}
diff --git a/user_map/templates/user_map/account/registration_confirmation_email.html b/user_map/templates/user_map/account/registration_confirmation_email.html
deleted file mode 100644
index 9724de3..0000000
--- a/user_map/templates/user_map/account/registration_confirmation_email.html
+++ /dev/null
@@ -1,19 +0,0 @@
-Dear {{ user.name }},
-
-Thank you for adding yourself to the {{ project_name }} User Map at
-{{ site_name }}. To activate your account, please click this link:
-{{ protocol}}://{{ domain }}{% url 'user_map:confirm_registration' uid=uid key=key %}
-
-Please note that the following information in your user record will be freely downloadable
-by anyone visiting the user map page:
-    - Your name
-    - your location (longitude, latitude)
-    - your role (user, developer, trainer)
-
-If you are concerned about your privacy, we recommend you edit your record (you can
-do so using the link provided below) and generalise the position of your point (for example
-to the centre of your nearest town / state or province or country).
-
-Thank you for taking the time to register yourself on our site!
-
-Regards
diff --git a/user_map/templates/user_map/base.html b/user_map/templates/user_map/base.html
index d90e684..741e731 100644
--- a/user_map/templates/user_map/base.html
+++ b/user_map/templates/user_map/base.html
@@ -1,37 +1,40 @@
 {% load staticfiles %}
+{% load leaflet_tags %}
 <!DOCTYPE html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
-  <link rel="shortcut icon" href="{% static FAVICON_PATH %}">
-  <title>{% block title %} {{ PROJECT_NAME }} User Map{% endblock %}</title>
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
+    <link rel="shortcut icon" href="{% static FAVICON_PATH %}">
+    <title>{% block title %} {{ PROJECT_NAME }} User Map{% endblock %}</title>
 
-  {% block head_resources %}
-    <!--Base Stylesheet -->
-    <link rel="stylesheet" href="{% static 'user_map/css/bootstrap.css' %}" type="text/css"/>
-    <link rel="stylesheet" href="{% static 'user_map/css/user-map.css' %}" type="text/css"/>
+    {% block head_resources %}
+      {% leaflet_js %}
+      {% leaflet_css %}
+      <!--Base Stylesheet -->
+      <link rel="stylesheet" href="{% static 'user_map/css/bootstrap.css' %}" type="text/css"/>
+      <link rel="stylesheet" href="{% static 'user_map/css/user-map.css' %}" type="text/css"/>
 
-    <!-- Base Javascript -->
-    <script language="javascript" type="text/javascript" src="{% static 'user_map/js/jquery.js' %}"></script>
-    <script language="javascript" type="text/javascript" src="{% static 'user_map/js/bootstrap.min.js' %}"></script>
-    <script language="javascript" type="text/javascript" src="{% static 'user_map/js/validate.js' %}"></script>
-  {% endblock head_resources %}
-</head>
+      <!-- Base Javascript -->
+      <script language="javascript" type="text/javascript" src="{% static 'user_map/js/jquery.js' %}"></script>
+      <script language="javascript" type="text/javascript" src="{% static 'user_map/js/bootstrap.min.js' %}"></script>
+      <script language="javascript" type="text/javascript" src="{% static 'user_map/js/validate.js' %}"></script>
 
-<body>
-  <div class="user_map_navbar ">
-    {% block navbar %}
-    {% endblock navbar %}
-   </div>
+    {% endblock head_resources %}
+  </head>
 
-  {% block main_content %}
-  {% endblock main_content %}
+  <body>
+    <div id="navigation">
+      {% include 'user_map/navigation.html' %}
+    </div>
 
-  {% block footer %}
-  {% endblock footer %}
+    {% block main_content %}
+    {% endblock main_content %}
 
-  {% block js_container %}
-  {% endblock js_container %}
+    {% block footer %}
+    {% endblock footer %}
+
+    {% block js_container %}
+    {% endblock js_container %}
   </body>
 </html>
diff --git a/user_map/templates/user_map/base_page.html b/user_map/templates/user_map/base_page.html
index 90b444c..55110fd 100644
--- a/user_map/templates/user_map/base_page.html
+++ b/user_map/templates/user_map/base_page.html
@@ -1,46 +1,6 @@
 {% extends "user_map/base.html" %}
 {% load staticfiles %}
 
-{% block navbar %}
-  <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
-    <div class="navbar-header">
-      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
-        <span class="sr-only">Toggle navigation</span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-      </button>
-      <a class="navbar-brand container" rel="home" href="{% url 'user_map:index' %}" title="InaSAFE">
-        <img style="max-width:100px; margin-top: -7px;" src="{% static BRAND_LOGO %}">
-      </a>
-    </div>
-    <!-- Collect the nav links, forms, and other content for toggling -->
-    <div class="collapse navbar-collapse navbar-ex1-collapse">
-      <ul class="nav navbar-nav navbar-right">
-        {% if not user.is_authenticated %}
-          <a href="{% url 'user_map:login' %}">
-            <button type="button"
-                    class="btn btn-default navbar-btn navbar-left">Log In</button>
-          </a>
-          <a href="{% url 'user_map:register' %}">
-            <button type="button"
-                    class="btn btn-default navbar-btn navbar-left">Sign Up</button>
-          </a>
-        {% endif %}
-        {% if user.is_authenticated %}
-          <li class="dropdown">
-            <a href="#" class="dropdown-toggle" data-toggle="dropdown"><b>Hi, {{ user.name }}</b> <b class="caret"></b></a>
-            <ul class="dropdown-menu">
-              <li><a href="{% url 'user_map:update_user' %}">Edit Profile</a></li>
-              <li><a href="{% url 'user_map:logout' %}">Log Out</a></li>
-            </ul>
-          </li>
-        {% endif %}
-      </ul>
-    </div><!-- /.navbar-collapse -->
-  </nav>
-{% endblock navbar %}
-
 {% block main_content %}
 {% endblock main_content %}
 
diff --git a/user_map/templates/user_map/data_privacy.html b/user_map/templates/user_map/data_privacy.html
index 93136d3..d98523b 100644
--- a/user_map/templates/user_map/data_privacy.html
+++ b/user_map/templates/user_map/data_privacy.html
@@ -2,11 +2,6 @@
   The data you enter on this site may be visible to others. We suggest that
   you approximate your physical location to the nearest
   town or major center. Parts of your data will be made available for
-  others to download and use. We will <strong>not</strong> share:</br>
-  <ul>
-    <li>your email address</li>
-    <li>your password</li>
-  </ul>
-  If you would like your data removed from this site, please log in to your
-  account.
+  others to download and use. Click the REST API link to see the data that are
+  available for public to use.
 </script>
diff --git a/user_map/templates/user_map/filter_menu.html b/user_map/templates/user_map/filter_menu.html
new file mode 100644
index 0000000..c9b1909
--- /dev/null
+++ b/user_map/templates/user_map/filter_menu.html
@@ -0,0 +1,8 @@
+<script id="role-filter" type="text/template">
+  {% for role in roles %}
+    <label>
+      <input type="checkbox" class="role-filter" value="{{ role.id }}"
+             onclick="filterUsers()" checked> {{ role.name }}
+     </label><br>
+  {% endfor %}
+</script>
diff --git a/user_map/templates/user_map/index.html b/user_map/templates/user_map/index.html
index 31da34e..2ead2d2 100644
--- a/user_map/templates/user_map/index.html
+++ b/user_map/templates/user_map/index.html
@@ -3,51 +3,16 @@
 {% load leaflet_tags %}
 
 {% block navbar %}
-  <nav class="navbar navbar-fixed-top" role="navigation">
-    <div class="navbar-header">
-      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
-        <span class="sr-only">Toggle navigation</span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-      </button>
-    </div>
-    <!-- Collect the nav links, forms, and other content for toggling -->
-    <div class="collapse navbar-collapse navbar-ex1-collapse">
-      <ul class="nav navbar-nav navbar-right">
-        {% if not user.is_authenticated %}
-          <a href="{% url 'user_map:login' %}">
-            <button type="button"
-                    class="btn btn-default navbar-btn navbar-left">Log In</button>
-          </a>
-          <a href="{% url 'user_map:register' %}">
-            <button type="button"
-                    class="btn btn-default navbar-btn navbar-left">Sign Up</button>
-          </a>
-        {% endif %}
-        {% if user.is_authenticated %}
-          <li class="dropdown">
-            <a href="#" class="dropdown-toggle" data-toggle="dropdown"><b>Hi, {{ user.name }}</b> <b class="caret"></b></a>
-            <ul class="dropdown-menu">
-              <li><a href="{% url 'user_map:update_user' %}">Edit Profile</a></li>
-              <li><a href="{% url 'user_map:logout' %}">Log Out</a></li>
-            </ul>
-          </li>
-        {% endif %}
-      </ul>
-    </div><!-- /.navbar-collapse -->
-  </nav>
 {% endblock navbar%}
 
 {% block head_resources %}
   {{ block.super }}
-  {% leaflet_js %}
-  {% leaflet_css %}
   <link rel="stylesheet" href="{% static 'user_map/css/MarkerCluster.css' %}"/>
   <link rel="stylesheet" href="{% static 'user_map/css/MarkerCluster.user-map.css' %}"/>
   <!--[if lte IE 8]>
   <link rel="stylesheet"  href="{% static 'user_map/css/MarkerCluster.user-map.ie.css' %}" />
   <![endif]-->
+  <script language="javascript" type="text/javascript" src="{% static 'user_map/js/jsrender.min.js' %}"></script>
   <script language="javascript" type="text/javascript" src="{% static 'user_map/js/leaflet.markercluster-src.js' %}"></script>
   <script language="javascript" type="text/javascript" src="{% static 'user_map/js/user-map.js' %}"></script>
 {% endblock head_resources %}
@@ -61,21 +26,30 @@
   {{ user_menu_button | safe }}
   {{ information_modal | safe }}
   {{ data_privacy_content | safe }}
-  {{ legend | safe }}
-  {{ user_form_template | safe }}
+  {{ filter_menu | safe }}
+  {{ user_info_popup_template | safe }}
+
+  {% if messages %}
+    <div class="messages" style="display: none;">
+      {% for message in messages %}
+        <p>{{ message }}</p>
+      {% endfor %}
+    </div>
+  {% endif %}
 {% endblock main_content %}
 
 
 {% block js_container %}
   <script type="text/javascript">
     var map, base_map, data_privacy_content, data_privacy_control,
-        user_menu_control;
+        user_menu_control, users_layer;
     var is_authenticated = '{{ user.is_authenticated }}' == 'True';
+    var is_mapped = '{{ is_mapped }}' == 'True';
+    var leaflet_tiles = {{ leaflet_tiles | safe}};
+    var marker_icon = L.icon({{ marker | safe}});
 
     //Initialize Basemap Layer
-    base_map = createBasemap(
-        '{{ leaflet_tiles.url }}',
-        '{{ leaflet_tiles.attribution | safe }}');
+    base_map = L.tileLayer(leaflet_tiles['url'], leaflet_tiles['option']);
 
     //Create Map with prepared base_map
     map = L.map('map', {
@@ -83,54 +57,50 @@
     });
     map.fitWorld().zoomIn();
 
+    // Center the popup when opened
+    map.on('popupopen', function(e) {
+      var px = map.project(e.popup._latlng);
+      px.y -= e.popup._container.clientHeight/2;
+      map.panTo(map.unproject(px),{animate: true});
+    });
+
     // Create Data Privacy Control
     data_privacy_control = createDataPrivacyControl();
     map.addControl(new data_privacy_control);
 
     // Create User Menu Control and add some tooltips
-    var user_menu = (is_authenticated? ['edit', 'delete', 'download'] : ['add', 'download', 'forgot']);
+    var user_menu = (is_mapped? ['edit', 'api'] : ['add', 'api']);
     user_menu_control = createUserMenuControl(user_menu);
     map.addControl(new user_menu_control);
     $(".user-menu-control").tooltip({placement: 'right', container: 'body'});
 
-    // Create Legend Control:
-    legend_control = createLegendControl();
-    map.addControl(new legend_control);
-
-    //Add all user layers based on role
-    var get_users_url = '{% url "user_map:get_users" %}';
-    var overlays_layer = [];
-    var user_roles = {{ user_roles | safe }};
-    var static_files = '{% static "" %}';
-
-    for (var i = 0; i < user_roles.length; ++i) {
-      var icon_path = static_files + user_roles[i]['icon'];
-      var shadow_icon_path = static_files + user_roles[i]['shadow_icon'];
-      user_roles[i]['icon'] = createIconMarker(icon_path, shadow_icon_path);
-
-      var class_name = 'marker-cluster marker-cluster-role' + (i + 1);
-      user_roles[i]['layer'] = new L.markerClusterGroup({
-        iconCreateFunction: (function(class_name) {
-            return function (cluster) {
-              return L.divIcon({
-                html: '<div><span>' + cluster.getChildCount() + '</span></div>',
-                className:class_name,
-                iconSize: L.point(40, 40)});
-            }
-        })(class_name)
-      });
-
-      //Add All Users who's got this role
-      addUsers(get_users_url, user_roles[i]);
-
-      //Add All users layer to map
-      user_roles[i]['layer'].addTo(map);
-
-      //Add layer to overlays layer
-      overlays_layer[user_roles[i]['name']] = user_roles[i]['layer'];
+    // Create Filter Control
+    filter_control = createFilterControl();
+    map.addControl(new filter_control);
+
+    // Structure roles object
+    var roles = {{ roles|safe }};
+    var roles_dict = {};
+    for (i = 0; i < roles.length; ++i) {
+      var content = {};
+      content["name"] = roles[i]["name"];
+      content["badge"] =  {% static ''%} + roles[i]["badge"];
+      roles_dict[roles[i]["id"]] = content;
     }
 
-    //Plug overlays_layers in layer control
-    L.control.layers(null, overlays_layer).addTo(map);
+    // Get displayed_users on the map
+    var usermap_list_url = '{% url "user_map:usermap-list" %}';
+    var users_layer = L.markerClusterGroup();
+    var displayed_users = L.markerClusterGroup().addTo(map);
+    addUsers(usermap_list_url, users_layer, marker_icon);
+
+    // Show messages if any
+    var messages = $('div.messages').html();
+    if (messages)
+        showInformationModal('Information', messages);
+
+    // Use jsRender to render popup content
+    $.views.settings.delimiters("<%","%>");
+    popup_template = $.templates("#popup-content");
   </script>
 {% endblock js_container %}
diff --git a/user_map/templates/user_map/information.html b/user_map/templates/user_map/information.html
deleted file mode 100644
index b649fa9..0000000
--- a/user_map/templates/user_map/information.html
+++ /dev/null
@@ -1,15 +0,0 @@
-{% extends "user_map/base_page.html" %}
-
-{% block main_content %}
-  <div class="container autoheight">
-    <div class="page-header">
-      <h2>{{ page_header_title }}
-        {% if page_header_description %}
-          <br>
-          <small>{{ page_header_description }}</small>
-        {% endif %}
-      </h2>
-    </div>
-    {{ information }}
-  </div>
-{% endblock main_content %}
diff --git a/user_map/templates/user_map/legend.html b/user_map/templates/user_map/legend.html
deleted file mode 100644
index e07498f..0000000
--- a/user_map/templates/user_map/legend.html
+++ /dev/null
@@ -1,8 +0,0 @@
-{% load staticfiles %}
-<script id="legend" type="text/template">
-  <h4>Legend</h4>
-  {% for user_role in user_roles %}
-      <img height='25' width='20' src='{% static user_role.icon %}'> {{user_role.name }}<br>
-  {% endfor %}
-</script>
-
diff --git a/user_map/templates/user_map/navigation.html b/user_map/templates/user_map/navigation.html
new file mode 100644
index 0000000..8b13789
--- /dev/null
+++ b/user_map/templates/user_map/navigation.html
@@ -0,0 +1 @@
+
diff --git a/user_map/templates/user_map/user_add_update.html b/user_map/templates/user_map/user_add_update.html
new file mode 100644
index 0000000..85c30bc
--- /dev/null
+++ b/user_map/templates/user_map/user_add_update.html
@@ -0,0 +1,29 @@
+{% extends "user_map/base_page.html" %}
+{% load leaflet_tags %}
+{% load bootstrap %}
+
+{% block head_resources %}
+  {{ block.super }}
+  {% leaflet_js plugins="forms" %}
+  {% leaflet_css plugins="forms" %}
+{% endblock head_resources %}
+
+{% block main_content %}
+  <div class="container">
+    <div class="page-header">
+    <h2>{{ title }}<br><small> {{ description }} </small></h2>
+    </div>
+    <div class="registration-form">
+      <form class="form-horizontal" method="POST" enctype="multipart/form-data">
+        {% csrf_token %}
+        {{ form|bootstrap_horizontal:'col-md-2'}}
+        <div class="form-group">
+          <div class="col-md-offset-2 col-md-4">
+            <input type="submit" value="Submit" class="btn btn-primary">
+            <a href="{% url "user_map:index" %}" class="btn btn-default" role="button">Cancel</a>
+          </div>
+        </div>
+      </form>
+     </div>
+  </div>
+{% endblock main_content %}
diff --git a/user_map/templates/user_map/user_info_popup_content.html b/user_map/templates/user_map/user_info_popup_content.html
index a4522b7..67fd928 100644
--- a/user_map/templates/user_map/user_info_popup_content.html
+++ b/user_map/templates/user_map/user_info_popup_content.html
@@ -1,6 +1,19 @@
-{% spaceless %}
-  <span class='glyphicon glyphicon-user'></span> {{ user.name }}<br>
-  {% if user.website != "" %}
-    <span class='glyphicon glyphicon-home'></span><a href='{{ user.website }}' target='_blank'> Website</a>
-  {% endif %}
-{% endspaceless %}
+<script id="popup-content" type="text/x-jsrender">
+  <div align='center'>
+    <%if properties.image%>
+      <img class='img-responsive' width='200px' src='<%:properties.image%>'>
+    <%/if%>
+
+    <%props properties.user%>
+      <p><b><%>prop%></b></p>
+    <%/props%>
+
+    <%if properties.website %>
+      <p align='center'><a href='<%:properties.website %>' target='_blank'>Website</a><p align='center'>
+    <%/if %>
+
+    <%for roles%>
+      <img class='img-rounded' style='margin: 0px 4px 0px 4px' height='20px' width='20px' src='<%:badge %>' data-toggle='tooltip' title='<%:name %>'>
+    <%/for%>
+ </div>
+</script>
diff --git a/user_map/templates/user_map/user_menu_button.html b/user_map/templates/user_map/user_menu_button.html
index 6acda23..3c71213 100644
--- a/user_map/templates/user_map/user_menu_button.html
+++ b/user_map/templates/user_map/user_menu_button.html
@@ -1,48 +1,26 @@
-{% if not user.is_authenticated %}
-<script id="user-menu-add-button" type="text/template">
-  <button type="button" class="btn btn-default btn-sm user-menu-control"
-          id="add-user-button" onclick="window.open('{% url "user_map:register" %}', '_self');"
-          data-toggle="tooltip" data-original-title="Add me to map!">
-    <span class="glyphicon glyphicon-user"></span>
-  </button>
-</script>
+{% if not user.is_authenticated or not is_mapped %}
+  <script id="user-menu-add-button" type="text/template">
+    <button type="button" class="btn btn-default btn-sm user-menu-control"
+            id="add-user-button" onclick="window.open('{% url "user_map:add" %}', '_self');""
+            data-toggle="tooltip" data-original-title="Add me to map!">
+      <span class="glyphicon glyphicon-user"></span>
+    </button>
+  </script>
 {% else %}
-<script id="user-menu-edit-button" type="text/template">
-  <button type="button" class="btn btn-default btn-sm user-menu-control"
-          id="edit-user-button" onclick="window.open('{% url "user_map:update_user" %}', '_self');""
-          data-toggle="tooltip" data-original-title='Edit my profile!'>
-    <span class='glyphicon glyphicon-pencil'></span>
-  </button>
-</script>
-{% endif %}
-
-{% if user.is_authenticated %}
-  <script id="user-menu-delete-button" type="text/template">
+  <script id="user-menu-edit-button" type="text/template">
     <button type="button" class="btn btn-default btn-sm user-menu-control"
-            id="delete-user-button"
-            onclick="window.open('{% url "user_map:update_user" %}#account-setting', '_self');""
-            data-toggle="tooltip" data-original-title="Delete me from the map!">
-      <span class="glyphicon glyphicon-trash"></span>
+            id="edit-user-button" onclick="window.open('{% url "user_map:update" %}', '_self');""
+            data-toggle="tooltip" data-original-title='Edit my profile!'>
+      <span class='glyphicon glyphicon-pencil'></span>
     </button>
   </script>
 {% endif %}
 
-<script id="user-menu-download-button" type="text/template">
-  <button type="button" class="btn btn-default btn-sm user-menu-control"
-          id="download-button" onclick="window.open('{% url "user_map:download" %}', '_self');"
-          data-toggle="tooltip"
-          data-original-title="Download all users as CSV file!">
-    <span class="glyphicon glyphicon-download-alt"></span>
-  </button>
-</script>
-
-{% if not user.is_authenticated %}
-<script id="user-menu-forgot-button" type="text/template">
+<script id="user-menu-api-button" type="text/template">
   <button type="button" class="btn btn-default btn-sm user-menu-control"
-          id="forgot-button" onclick="window.open('{% url "user_map:password_reset" %}', '_self');"
+          id="download-button" onclick="window.open('{% url "user_map:usermap-list" %}');"
           data-toggle="tooltip"
-          data-original-title="Forgot your password?">
-    <span class="glyphicon glyphicon-question-sign"></span>
+          data-original-title="REST API">
+    <span class="glyphicon glyphicon-transfer"></span>
   </button>
 </script>
-{% endif %}
diff --git a/user_map/templates/user_map/users.json b/user_map/templates/user_map/users.json
deleted file mode 100644
index f15dea2..0000000
--- a/user_map/templates/user_map/users.json
+++ /dev/null
@@ -1,18 +0,0 @@
-{
-  "users": {
-    "type": "FeatureCollection",
-    "features": [ {% for user in users %}
-      {
-        "type": "Feature",
-        "properties": {
-          "name": "{{ user.name }}",
-          "popupContent": "{% spaceless %} {% include 'user_map/user_info_popup_content.html'%} {% endspaceless %}"
-        },
-        "geometry": {
-          "type": "Point",
-          "coordinates": [{{ user.location.x }}, {{ user.location.y }}]
-        }
-      }{% if not forloop.last %},{% endif %}{% endfor %}
-    ]
-  }
-}
diff --git a/user_map/tests/model_factories.py b/user_map/tests/model_factories.py
index af509ce..421f1c9 100644
--- a/user_map/tests/model_factories.py
+++ b/user_map/tests/model_factories.py
@@ -1,10 +1,21 @@
 # coding=utf-8
 """Model factories definition for models."""
+from django.conf import settings
 from django.contrib.gis.geos import Point
+
 import factory
 from factory import DjangoModelFactory
 
-from user_map.models import Role, User
+from user_map.models import Role, UserMap
+
+
+class UserFactory(DjangoModelFactory):
+    class Meta:
+        model = settings.AUTH_USER_MODEL
+
+    username = factory.Sequence(lambda n: 'user{0}'.format(n))
+    password = factory.PostGenerationMethodCall(
+        'set_password', 'default_password')
 
 
 class RoleFactory(DjangoModelFactory):
@@ -13,21 +24,31 @@ class Meta:
         """Meta definition."""
         model = Role
 
+    id = factory.Sequence(lambda n: n)
     name = factory.Sequence(lambda n: 'Role %s' % n)
-    sort_number = 1
+    badge = factory.Sequence(
+        lambda n: 'path/to/badge/role%s' % n)
 
 
-class UserFactory(DjangoModelFactory):
-    """Factory class for User Model"""
+class UserMapFactory(DjangoModelFactory):
+    """Factory class for UserMap Model"""
     class Meta:
         """"Meta definition."""
-        model = User
-        django_get_or_create = ('email',)
+        model = UserMap
 
     # Taking others as default value defined in model but not these:
-    name = 'John Doe'
-    email = factory.Sequence(lambda n: 'john.doe%s@example.com' % n)
-    password = factory.PostGenerationMethodCall(
-        'set_password', 'default_password')
+    user = factory.SubFactory(UserFactory)
     location = Point(105.567, 123)
-    role = factory.SubFactory(RoleFactory)
+    # image = factory.Sequence(
+    #     lambda n: 'path/to/image/user%s' % n)
+
+    @factory.post_generation
+    def roles(self, create, extracted, **kwargs):
+        if not create:
+            # Simple build, do nothing.
+            return
+
+        if extracted:
+            # A list of groups were passed in, use them
+            for role in extracted:
+                self.roles.add(role)
diff --git a/user_map/tests/test_models.py b/user_map/tests/test_models.py
index a1d6875..20b1ca1 100644
--- a/user_map/tests/test_models.py
+++ b/user_map/tests/test_models.py
@@ -1,12 +1,17 @@
 # coding=utf-8
 """Module related to test for all the models."""
-from django.test import TestCase
+from django.test import TransactionTestCase
+from django.contrib.gis.geos import Point
 
-from user_map.tests.model_factories import RoleFactory, UserFactory
+from user_map.tests.model_factories import (
+    RoleFactory, UserFactory, UserMapFactory)
+from user_map.models.role import Role
 
 
-class TestRole(TestCase):
+class TestRole(TransactionTestCase):
     """Class to test Role model."""
+    reset_sequences = True
+
     def setUp(self):
         pass
 
@@ -18,11 +23,20 @@ def test_create_role(self):
 
     def test_read_role(self):
         """Method to test reading role."""
-        role_name = 'Testing Role'
-        role = RoleFactory.create(name=role_name)
-        message = 'The role name should be %s, but it gives %s' % (
-            role_name, role.name)
-        self.assertEqual(role_name, role.name, message)
+        for i in range(3):
+            RoleFactory(__sequence=i)
+
+        for i in range(3):
+            role_name = 'Role %s' % i
+            role_badge = 'path/to/badge/role%s' % i
+
+            role = Role.objects.get(pk=i)
+            message = 'The role name should be %s, but it gives %s' % (
+                role_name, role.name)
+            self.assertEqual(role_name, role.name, message)
+            message = 'The role badge should be %s, but it gives %s' % (
+                role_badge, role.badge)
+            self.assertEqual(role_badge, role.badge, message)
 
     def test_update_role(self):
         """Method to test updating role."""
@@ -43,55 +57,60 @@ def test_delete_role(self):
         self.assertIsNone(role.id, message)
 
 
-class TestUser(TestCase):
+class TestUserMap(TransactionTestCase):
     """Class to test User model."""
     def setUp(self):
         pass
 
-    def test_create_user(self):
-        """Method to test user creation."""
-        user = UserFactory.create()
-        message = 'The user is not instantiated successfully.'
-        self.assertIsNotNone(user.id, message)
-
-        # email_updates, is_admin, is_confirmed =  False
-        message = 'email_updates must be False'
-        self.assertFalse(user.email_updates, message)
-        message = 'is_admin must be False'
-        self.assertFalse(user.is_admin, message)
-        message = 'is_confirmed must be False'
-        self.assertFalse(user.is_confirmed, message)
-
-        # is_active = True
-        message = 'is_active must be True'
-        self.assertTrue(user.is_active, message)
-
-    def test_read_user(self):
-        """Method to test reading user."""
-        user_name = 'John Doe'
-        user_website = 'www.johndoe.com'
-        user = UserFactory.create(name=user_name, website=user_website)
-        message = 'The user name should be %s, but it gives %s' % (
-            user_name, user.name)
-        self.assertEqual(user_name, user.name, message)
-        message = 'The user website should be %s, but it gives %s' % (
-            user_website, user.website)
-        self.assertEqual(user_website, user.website, message)
-
-    def test_update_user(self):
-        """Method to test update user."""
-        user = UserFactory.create()
-        user_name = 'Updated John Doe'
-        user.name = user_name
-        user.save()
-        message = 'The user name should be %s, but it gives %s' % (
-            user_name, user.name)
-        self.assertEqual(user_name, user.name, message)
+    def test_create_usermap(self):
+        """Method to test user map creation."""
+        user_map = UserMapFactory.create()
+        message = 'The user map is not instantiated successfully.'
+        self.assertIsNotNone(user_map.user, message)
+
+    def test_read_usermap(self):
+        """Method to test reading user map."""
+        user = UserFactory(username='John Doe')
+        location = Point(5, 5)
+        image = '/john/doe/image.png'
+
+        usermap = UserMapFactory.create(
+            user=user, location=location, image=image)
+
+        message = 'The username should be %s, but it gives %s' % (
+            user.username, usermap.user.username)
+        self.assertEqual(user.username, usermap.user.username, message)
+
+        message = 'The user location should be %s, but it gives %s' % (
+            location, usermap.location)
+        self.assertEqual(location, usermap.location, message)
+
+        message = 'The user image should be %s, but it gives %s' % (
+            image, usermap.image)
+        self.assertEqual(image, usermap.image, message)
+
+    def test_update_usermap(self):
+        """Method to test updating usermap."""
+        user_map = UserMapFactory()
+
+        new_location = Point(10, 10)
+        user_map.location = new_location
+        user_map.save()
+        message = 'The user map location should be %s, but it gives %s' % (
+            new_location, user_map.location)
+        self.assertEqual(new_location, user_map.location, message)
+
+        new_image = '/new/image.png'
+        user_map.image = new_image
+        user_map.save()
+        message = 'The user map image should be %s, but it gives %s' % (
+            new_image, user_map.image)
+        self.assertEqual(new_image, user_map.image, message)
 
     def test_delete_user(self):
-        """Method to test delete user."""
-        user = UserFactory.create()
-        self.assertIsNotNone(user.id)
-        user.delete()
-        message = 'The user is not deleted.'
-        self.assertIsNone(user.id, message)
+        """Method to test deleting user map."""
+        user_map = UserMapFactory.create()
+        self.assertIsNotNone(user_map.pk)
+        user_map.delete()
+        message = 'The user map is not deleted.'
+        self.assertIsNone(user_map.pk, message)
diff --git a/user_map/tests/test_settings.py b/user_map/tests/test_settings.py
index 9909ef4..068f594 100644
--- a/user_map/tests/test_settings.py
+++ b/user_map/tests/test_settings.py
@@ -1,4 +1,6 @@
+# coding=utf-8
 import os
+
 local_path = lambda path: os.path.join(os.path.dirname(__file__), path)
 
 SITE_ID = 1
@@ -14,43 +16,114 @@
     }
 }
 
-INSTALLED_APPS = [
+INSTALLED_APPS = (
+    'django.contrib.admin',
+    'django.contrib.auth',
     'django.contrib.contenttypes',
-    'django.contrib.sites',
     'django.contrib.sessions',
+    'django.contrib.messages',
     'django.contrib.staticfiles',
-    'django.contrib.auth',
-    'django.contrib.admin',
+
     'django.contrib.gis',
+    'django.contrib.sites',
+    'user_map',
     'leaflet',
     'bootstrapform',
-    'user_map',
-]
+    'rest_framework',
+    'rest_framework_gis',
+)
 
 ROOT_URLCONF = 'user_map.tests.urls'
 
-TEMPLATE_CONTEXT_PROCESSORS = (
-    'django.contrib.auth.context_processors.auth',
-    'django.core.context_processors.request',
-    'django.contrib.messages.context_processors.messages',
-    'user_map.context_processors.user_map_settings',
-)
+TEMPLATES = [
+    {
+        'BACKEND': 'django.template.backends.django.DjangoTemplates',
+        'DIRS': [],
+        'APP_DIRS': True,
+        'OPTIONS': {
+            'context_processors': [
+                'django.template.context_processors.debug',
+                'django.template.context_processors.request',
+                'django.contrib.auth.context_processors.auth',
+                'django.contrib.messages.context_processors.messages',
+            ],
+        },
+    },
+]
 
 MIDDLEWARE_CLASSES = (
     'django.contrib.sessions.middleware.SessionMiddleware',
     'django.middleware.common.CommonMiddleware',
     'django.middleware.csrf.CsrfViewMiddleware',
     'django.contrib.auth.middleware.AuthenticationMiddleware',
+    'django.contrib.auth.middleware.SessionAuthenticationMiddleware',
     'django.contrib.messages.middleware.MessageMiddleware',
     'django.middleware.clickjacking.XFrameOptionsMiddleware',
-)
+    'django.middleware.security.SecurityMiddleware',
 
-AUTH_USER_MODEL = 'user_map.User'
-AUTHENTICATION_BACKENDS = [
-    'user_map.auth_backend.UserMapAuthBackend',
-    'django.contrib.auth.backends.ModelBackend']
+    'django.contrib.auth.middleware.AuthenticationMiddleware'
+)
 
 STATIC_ROOT = local_path('static/')
 STATIC_URL = '/static/'
 
 SECRET_KEY = 'django-user-map'
+
+USER_MAP = {
+    'project_name': 'Test Project',
+    'favicon_file': '',
+    'login_view': 'django.contrib.auth.views.login',
+    'marker': {
+        'iconUrl': 'static/user_map/img/user-icon.png',
+        'shadowUrl': 'static/user_map/img/shadow-icon.png',
+        'iconSize': [19, 32],
+        'shadowSize': [42, 35],
+        'iconAnchor': [10, 0],
+        'shadowAnchor': [12, 0],
+    },
+    'leaflet_config': {
+        'TILES': [(
+            # The title
+            'MapQuest',
+            # Tile's URL
+            'http://otile{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png',
+            # More valid leaflet option are passed here
+            # See here: http://leafletjs.com/reference.html#tilelayer
+            {
+                'attribution':
+                    '© <a href="http://www.openstreetmap.org" '
+                    'target="_parent">OpenStreetMap'
+                    '</a> and contributors, under an <a '
+                    'href="http://www.openstreetmap.org/copyright" '
+                    'target="_parent">open license</a>. Tiles Courtesy of '
+                    '<a '
+                    'href="http://www.mapquest.com/">MapQuest</a> <img '
+                    'src="http://developer.mapquest.com/content/osm/mq_logo'
+                    '.png"',
+                'subdomains': '1234'
+
+            }
+        )]
+    },
+    'roles': [
+        {
+            'id': 1,
+            'name': 'User',
+            'badge': 'user_map/img/badge-user.png'
+        },
+        {
+            'id': 2,
+            'name': 'Trainer',
+            'badge': 'user_map/img/badge-trainer.png'
+        },
+        {
+            'id': 3,
+            'name': 'Developer',
+            'badge': 'user_map/img/badge-developer.png'
+        }
+    ],
+    'api_user_fields': [
+        'username'
+    ],
+
+}
diff --git a/user_map/tests/test_views.py b/user_map/tests/test_views.py
index 6eecb87..26d9784 100644
--- a/user_map/tests/test_views.py
+++ b/user_map/tests/test_views.py
@@ -3,145 +3,116 @@
 from django.test import TestCase
 from django.test.client import Client
 from django.core.urlresolvers import reverse
-from django.utils.http import urlsafe_base64_encode
-from django.utils.encoding import force_bytes
+from django.contrib.gis.geos import Point
 
-from user_map.tests.model_factories import UserFactory
+from user_map.tests.model_factories import UserFactory, UserMapFactory
+from user_map.app_settings import LOGIN_VIEW
+from user_map.models import UserMap
 
 
 class UserMapViewTests(TestCase):
     """Class for testing user map view."""
     def setUp(self):
         """Run for each test."""
-        self.email = 'test@gmail.com'
-        self.password = 'test'
-        self.user = UserFactory.create(
-            email=self.email,
-            password=self.password,
-            role__name='Test User',
-            is_confirmed=True)
+        self.not_mapped_username = 'test@gmail.com'
+        self.not_mapped_password = 'test'
+        self.not_mapped_user = UserFactory.create(
+            username=self.not_mapped_username,
+            password=self.not_mapped_password)
+
+        self.mapped_username = 'test2@gmail.com'
+        self.mapped_password = 'test2'
+        self.mapped_user = UserFactory.create(
+            username=self.mapped_username,
+            password=self.mapped_password)
+        self.mapped_user_map = UserMapFactory(user=self.mapped_user)
+
         self.client = Client()
 
     def test_index(self):
         """Test for index view."""
         response = self.client.get(reverse('user_map:index'))
         self.assertEqual(response.status_code, 200)
-        self.assertTemplateUsed(response, 'user_map/legend.html')
         self.assertTemplateUsed(response, 'user_map/data_privacy.html')
-        self.assertContains(response, 'Sign Up')
-        self.assertContains(response, 'Log In')
+        self.assertTemplateUsed(response, 'user_map/index.html')
 
-    def test_index_login(self):
-        """Test for index view after logging in."""
+    def test_index_login_mapped(self):
+        """Test for index view after logging in for mapped user."""
         self.assertTrue(
-            self.client.login(email=self.email, password=self.password))
+            self.client.login(
+                username=self.mapped_username,
+                password=self.mapped_password))
         response = self.client.get(reverse('user_map:index'))
-        self.assertNotContains(response, 'Sign Up')
-        self.assertNotContains(response, 'Log In')
-        self.assertContains(response, 'Hi, %s' % self.user.name)
-
-    def test_get_users(self):
-        """Test for get_users view."""
-        response = self.client.get(
-            reverse('user_map:get_users'),
-            {'user_role': 'Test User'})
+        self.assertNotContains(response, 'user-menu-add-button')
+        self.assertContains(response, 'user-menu-edit-button')
+
+    def test_list_users(self):
+        """Test for listing all the users through REST API."""
+        response = self.client.get(reverse('user_map:usermap-list'))
         self.assertEqual(response['Content-Type'], 'application/json')
         self.assertContains(response, 'FeatureCollection')
-        self.assertContains(response, self.user.name)
+        self.assertContains(response, self.mapped_user.username)
 
-    def test_get_users_with_post(self):
-        """Test get_users view."""
-        response = self.client.post(
-            reverse('user_map:get_users'),
-            {'user_role': 'Test User'})
-        self.assertEqual(response.status_code, 404)
+    def test_list_users_with_post(self):
+        """Test list user view."""
+        response = self.client.post(reverse('user_map:usermap-list'))
+        self.assertEqual(response.status_code, 405)  # 405 = not allowed
 
-    def test_show_register_page(self):
-        """Test register view using get."""
-        response = self.client.get(reverse('user_map:register'))
-        self.assertEqual(response.status_code, 200)
-        self.assertTemplateUsed(response, 'user_map/account/registration.html')
+    def test_add_user_page_without_login(self):
+        """Test showing 'add user' page without log in first.
 
-    def test_register_success(self):
-        """Test register view using post."""
-        response = self.client.post(
-            reverse('user_map:register'),
-            {
-                'name': 'John Doe',
-                'email': 'john.doe@gmail.com',
-                'password': 'password',
-                'password2': 'password',
-                'website': '',
-                'role': '1',
-                'location': ('{"type":"Point","coordinates":[22.5,'
-                             '-16.63619187839765]}')
-            })
+        Should redirect to index page"""
+        response = self.client.get(reverse('user_map:add'))
         self.assertRedirects(
             response,
-            reverse('user_map:register'),
+            reverse(LOGIN_VIEW) + '?next=' + reverse('user_map:add'),
             302,
             200)
 
-    def test_confirm_registration_invalid(self):
-        """Test confirm_registration using invalid link."""
-        response = self.client.get(
-            reverse('user_map:confirm_registration', args=('l1nk', 'inV4lid')))
-        self.assertTemplateUsed(response, 'user_map/information.html')
-        self.assertContains(response, 'Your link is not valid')
-
-    def test_confirm_registration_valid(self):
-        """Test confirm_registration using valid link."""
-        # Create unconfirmed user first
-        user = UserFactory.create(is_confirmed=False)
-        uid = urlsafe_base64_encode(force_bytes(user.pk))
-        response = self.client.get(
-            reverse('user_map:confirm_registration', args=(uid, user.key)))
-        self.assertTemplateUsed(response, 'user_map/information.html')
-        self.assertContains(
-            response,
-            'Congratulations! Your account has been successfully confirmed.')
-
-    def test_show_login_page(self):
-        """Test if showing login page is OK."""
-        response = self.client.get(reverse('user_map:login'))
+    def test_add_user_page_with_unmapped_user(self):
+        """Test showing 'add user' view using get."""
+        # login with unmapped user
+        self.assertTrue(
+            self.client.login(
+                username=self.not_mapped_username,
+                password=self.not_mapped_password))
+        response = self.client.get(reverse('user_map:add'))
         self.assertEqual(response.status_code, 200)
-        self.assertTemplateUsed(response, 'user_map/account/login.html')
-
-    def test_login_invalid(self):
-        """Test login with invalid user."""
-        response = self.client.post(
-            reverse('user_map:login'),
-            {
-                'email': 'invalid@user.com',
-                'password': 'invaliduserpass'
-            }
-        )
-        self.assertTemplateUsed(response, 'user_map/account/login.html')
-        self.assertContains(
-            response, 'Please enter a correct email and password')
+        self.assertTemplateUsed(response, 'user_map/user_add_update.html')
 
-    def test_login_valid(self):
-        """Test login with valid user."""
-        # Create a user first with is_confirmed = True
-        UserFactory.create(
-            email='test@mail.com', password='test', is_confirmed=True)
+    def test_add_user_page_with_mapped_user(self):
+        """Test accessing 'add user page' with mapped user.
 
-        response = self.client.post(
-            reverse('user_map:login'),
-            {
-                'email': 'test@mail.com',
-                'password': 'test'
-            }
-        )
+        Should redirect to index page.
+        """
+        # login with mapped user
+        self.assertTrue(
+            self.client.login(
+                username=self.mapped_username,
+                password=self.mapped_password))
+        response = self.client.get(reverse('user_map:add'))
         self.assertRedirects(
             response,
             reverse('user_map:index'),
             302,
             200)
 
-    def test_logout(self):
-        """Test logout view."""
-        response = self.client.post(reverse('user_map:logout'))
+    def test_add_user_success(self):
+        """Test adding user map using post."""
+        # login with unmapped user
+        self.assertTrue(
+            self.client.login(
+                username=self.not_mapped_username,
+                password=self.not_mapped_password))
+        response = self.client.post(
+            reverse('user_map:add'),
+            {
+                'roles': '1',
+                'location': ('{"type":"Point","coordinates":[22.5,'
+                             '-16.63619187839765]}'),
+                'image': '',
+                'csrfmiddlewaretoken': u'yxeoT16pTxofWArnbgfAOudInBqAOpyq'
+            })
         self.assertRedirects(
             response,
             reverse('user_map:index'),
@@ -150,93 +121,41 @@ def test_logout(self):
 
     def test_show_update_page(self):
         """Test showing update user page view."""
-        # Login first
+        # Login first with mapped user
         self.assertTrue(
-            self.client.login(email=self.email, password=self.password))
+            self.client.login(
+                username=self.mapped_username,
+                password=self.mapped_password))
 
-        response = self.client.get(reverse('user_map:update_user'))
+        response = self.client.get(reverse('user_map:update'))
         self.assertEqual(response.status_code, 200)
-        self.assertTemplateUsed(response, 'user_map/account/edit_user.html')
+        self.assertTemplateUsed(response, 'user_map/user_add_update.html')
 
-    def test_update_basic_information(self):
-        """Test update basic information."""
-        # Login first
+    def test_update_user(self):
+        """Test update user."""
+        # Login first with mapped user
         self.assertTrue(
-            self.client.login(email=self.email, password=self.password))
+            self.client.login(
+                username=self.mapped_username,
+                password=self.mapped_password))
 
         form_content = dict(
             {
-                'name': 'UpdatedName',
-                'email': self.email,
-                'website': 'http://updated-site.com',
-                'role': '1',
-                'location': ('{"type":"Point","coordinates":[22.5, '
+                'roles': '1',
+                'location': ('{"type":"Point","coordinates":[22.5,'
                              '-16.63619187839765]}'),
-                'email_updates': 'on',
-                'change_basic_info': 'Submit'
+                # 'image': 'john/doe/cool.png',
+                'csrfmiddlewaretoken': u'yxeoT16pTxofWArnbgfAOudInBqAOpyq'
             }
         )
         response = self.client.post(
-            reverse('user_map:update_user'), form_content)
+            reverse('user_map:update'), form_content)
         self.assertRedirects(
             response,
-            reverse('user_map:update_user') + '#basic-information',
-            302,
-            200)
-        user = UserFactory(email=self.email)
-        self.assertEqual(user.name, form_content['name'])
-
-    def test_change_password(self):
-        """Test change password."""
-        # Login first
-        self.assertTrue(
-            self.client.login(email=self.email, password=self.password))
-
-        new_password = 'UpdatedPassword'
-        form_content = dict(
-            {
-                'old_password': self.password,
-                'new_password1': new_password,
-                'new_password2': new_password,
-                'change_password': 'Submit'
-            }
-        )
-        response = self.client.post(
-            reverse('user_map:update_user'), form_content)
-        self.assertRedirects(
-            response,
-            reverse('user_map:update_user') + '#security',
+            reverse('user_map:index'),
             302,
             200)
-
-        # Logout
-        self.client.logout()
-
-        # Login with old password will fail
-        self.assertFalse(
-            self.client.login(email=self.email, password=self.password))
-
-        # Login with new password
-        self.assertTrue(
-            self.client.login(email=self.email, password=new_password))
-
-    def test_delete_user(self):
-        """Test delete_user view."""
-        # Login first
-        self.assertTrue(
-            self.client.login(email=self.email, password=self.password))
-
-        response = self.client.post(reverse('user_map:delete_user'))
-
-        self.assertTemplateUsed(response, 'user_map/information.html')
-        self.assertContains(
-            response, 'You have deleted your account')
-
-    def test_download(self):
-        """Test download view."""
-        response = self.client.post(reverse('user_map:download'))
-        self.assertEqual(response['Content-Type'], 'text/csv')
-        self.assertEqual(
-            response['Content-Disposition'],
-            'attachment; filename="users.csv"')
-        self.assertContains(response, self.user.name)
+        user_map = UserMap.objects.get(user=self.mapped_user)
+        new_point = Point(22.5, -16.63619187839765)
+        self.assertAlmostEqual(user_map.location.x, new_point.x)
+        self.assertAlmostEqual(user_map.location.y, new_point.y)
diff --git a/user_map/tests/urls.py b/user_map/tests/urls.py
index ed94ce2..6881c67 100644
--- a/user_map/tests/urls.py
+++ b/user_map/tests/urls.py
@@ -1,6 +1,13 @@
+# coding=utf-8
 from django.conf.urls import patterns, include, url
+from django.contrib import admin
 
 urlpatterns = patterns(
     '',
-    url(r'^user-map/', include('user_map.urls', namespace='user_map'))
+    url(r'^user-map/', include('user_map.urls', namespace='user_map')),
+    url(r'^login/$',
+        'django.contrib.auth.views.login',
+        {'template_name': 'admin/login.html'},
+        name='my_login'),
+    url(r'^admin/', include(admin.site.urls)),
 )
diff --git a/user_map/urls.py b/user_map/urls.py
index af674de..9940d0c 100644
--- a/user_map/urls.py
+++ b/user_map/urls.py
@@ -1,32 +1,23 @@
 # coding=utf-8
 """URI Routing configuration for this apps."""
-from django.conf.urls import patterns, url
+from django.conf.urls import url
+from django.contrib.auth.decorators import login_required
+from django.conf import settings
 
-urlpatterns = patterns(
-    '',
-    url(r'^$', 'user_map.views.index', name='index'),
-    url(r'^users.json', 'user_map.views.get_users', name='get_users'),
+import user_map.views
 
-    url(r'^register$', 'user_map.views.register', name='register'),
-    url(r'^account-confirmation/(?P<uid>[0-9A-Za-z_\-]+)/(?P<key>.+)/$',
-        'user_map.views.confirm_registration',
-        name='confirm_registration'),
-
-    url(r'^login$', 'user_map.views.login', name='login'),
-    url(r'^logout$', 'user_map.views.logout', name='logout'),
-    url(r'^update-profile$', 'user_map.views.update_user', name='update_user'),
-    url(r'^delete-user$', 'user_map.views.delete_user', name='delete_user'),
-
-    url(r'^password-reset/$', 'user_map.views.password_reset',
-        name='password_reset'),
-    url(r'^password-reset/done/$', 'user_map.views.password_reset_done',
-        name='password_reset_done'),
-    url(r'^password-reset/confirm/(?P<uidb64>[0-9A-Za-z_\-]+)/(?P<token>.+)/$',
-        'user_map.views.password_reset_confirm',
-        name='password_reset_confirm'),
-    url(r'^password-reset/complete/$',
-        'user_map.views.password_reset_complete',
-        name='password_reset_complete'),
-
-    url(r'^download$', 'user_map.views.download', name='download'),
-)
+urlpatterns = [
+    url(r'^$', user_map.views.IndexView.as_view(), name='index'),
+    url(r'^add',
+        login_required(
+            user_map.views.UserAddView.as_view(),
+            login_url=settings.USER_MAP['login_view']),
+        name='add'),
+    url(r'^update$',
+        login_required(
+            user_map.views.UserUpdateView.as_view(),
+            login_url=settings.USER_MAP['login_view']),
+        name='update'),
+    url(r'^usermaps/$', user_map.views.UserMapList.as_view(),
+        name='usermap-list'),
+]
diff --git a/user_map/views.py b/user_map/views.py
index 02a5c2d..a5086a6 100644
--- a/user_map/views.py
+++ b/user_map/views.py
@@ -1,419 +1,182 @@
 # coding=utf-8
 """Views of the apps."""
-import csv
+from exceptions import AttributeError
 import json
 
-from django.shortcuts import render, render_to_response
-from django.http import HttpResponse, HttpResponseRedirect, Http404
-from django.template import RequestContext, loader
-from django.forms.util import ErrorList
-from django.forms.forms import NON_FIELD_ERRORS
+from django.http import HttpResponseRedirect
+from django.template import loader
 from django.core.urlresolvers import reverse
-from django.core.mail import send_mail
 from django.contrib import messages
-from django.contrib.auth import (
-    login as django_login,
-    authenticate,
-    logout as django_logout)
-from django.contrib.auth.views import (
-    password_reset as django_password_reset,
-    password_reset_done as django_password_reset_done,
-    password_reset_confirm as django_password_reset_confirm,
-    password_reset_complete as django_password_reset_complete)
-from django.contrib.auth.forms import PasswordChangeForm, SetPasswordForm
-from django.contrib.auth.decorators import login_required
-from django.utils.http import urlsafe_base64_encode, urlsafe_base64_decode
-from django.utils.encoding import force_bytes
-from django.contrib.sites.models import get_current_site
+from django.views.generic.edit import CreateView, UpdateView
+from django.core.exceptions import ObjectDoesNotExist
+from django.views.generic import TemplateView
+
+from rest_framework import generics
 
 from user_map.forms import (
-    RegistrationForm,
-    LoginForm,
-    BasicInformationForm,
-    CustomPasswordResetForm)
-from user_map.models import User
+    UserMapForm)
+from user_map.models import UserMap, Role
 from user_map.app_settings import (
-    PROJECT_NAME, USER_ROLES, DEFAULT_FROM_MAIL, LEAFLET_TILES)
-from user_map.utilities.decorators import login_forbidden
-
-
-def index(request):
-    """Index page of user map.
-
-    :param request: A django request object.
-    :type request: request
-
-    :returns: Response will be a nice looking map page.
-    :rtype: HttpResponse
-    """
-    information_modal = loader.render_to_string(
-        'user_map/information_modal.html')
-    data_privacy_content = loader.render_to_string(
-        'user_map/data_privacy.html')
-
-    user_menu_button = loader.render_to_string(
-        'user_map/user_menu_button.html', {'user': request.user})
-
-    legend = loader.render_to_string(
-        'user_map/legend.html', {'user_roles': USER_ROLES})
-
-    leaflet_tiles = dict(
-        url=LEAFLET_TILES[1],
-        attribution=LEAFLET_TILES[2]
-    )
-    context = {
-        'data_privacy_content': data_privacy_content,
-        'information_modal': information_modal,
-        'user_menu_button': user_menu_button,
-        'user_roles': json.dumps(USER_ROLES),
-        'legend': legend,
-        'leaflet_tiles': leaflet_tiles
-    }
-    return render(request, 'user_map/index.html', context)
-
-
-def get_users(request):
-    """Return a json document of users with given role.
-
-    This will only fetch users who have approved by email and still active.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    if request.method == 'GET':
-        # Get data:
-        user_role = str(request.GET['user_role'])
-
-        # Get user
-        users = User.objects.filter(
-            role__name=user_role,
-            is_confirmed=True,
-            is_active=True)
-        users_json = loader.render_to_string(
-            'user_map/users.json', {'users': users})
-
-        # Return Response
-        return HttpResponse(users_json, content_type='application/json')
-    else:
-        raise Http404
-
-
-@login_forbidden
-def register(request):
-    """User registration view.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    if request.method == 'POST':
-        form = RegistrationForm(data=request.POST)
-        if form.is_valid():
-            user = form.save()
-
-            current_site = get_current_site(request)
-            site_name = current_site.name
-            domain = current_site.domain
-            context = {
-                'project_name': PROJECT_NAME,
-                'protocol': 'http',
-                'domain': domain,
-                'site_name': site_name,
-                'uid': urlsafe_base64_encode(force_bytes(user.pk)),
-                'user': user,
-                'key': user.key
+    LEAFLET_TILES, MARKER, FAVICON_FILE, PROJECT_NAME)
+from user_map.serializers import UserMapSerializer
+
+
+class BaseTemplateMixin(object):
+    """Mixin for Base Template."""
+
+    @property
+    def is_mapped(self):
+        """Get status is_mapped of the self.request.user."""
+        try:
+            # noinspection PyUnresolvedReferences
+            is_mapped = bool(self.request.user.usermap)
+        except (ObjectDoesNotExist, AttributeError):
+            is_mapped = False
+        return is_mapped
+
+    def get_context_data(self, **kwargs):
+        # noinspection PyUnresolvedReferences
+        context = super(BaseTemplateMixin, self).get_context_data(**kwargs)
+        context['FAVICON_PATH'] = FAVICON_FILE
+        context['PROJECT_NAME'] = PROJECT_NAME
+        return context
+
+
+class IndexView(BaseTemplateMixin, TemplateView):
+    """Index page of user map."""
+    template_name = 'user_map/index.html'
+
+    @property
+    def information_modal(self):
+        """Get information modal."""
+        return loader.render_to_string(
+            'user_map/information_modal.html')
+
+    @property
+    def data_privacy(self):
+        """Get data privacy content."""
+        return loader.render_to_string(
+            'user_map/data_privacy.html')
+
+    @property
+    def leaflet_tiles(self):
+        """Get leaflet tiles for the template."""
+        return dict(
+            url=LEAFLET_TILES[0][1],
+            option=LEAFLET_TILES[0][2]
+        )
+
+    @property
+    def user_popup(self):
+        """Get user popup template."""
+        return loader.render_to_string(
+            'user_map/user_info_popup_content.html')
+
+    def get_user_menu(self):
+        """Get user menu at the left side."""
+        return loader.render_to_string(
+            'user_map/user_menu_button.html',
+            {'user': self.request.user, 'is_mapped': self.is_mapped}
+        )
+
+    def get_filter_menu(self):
+        """Get filter menu at the right side."""
+        roles = Role.objects.all()
+        return loader.render_to_string(
+            'user_map/filter_menu.html',
+            {'roles': roles}
+        )
+
+    def get_context_data(self, **kwargs):
+        context = super(IndexView, self).get_context_data(**kwargs)
+        context.update(
+            {
+                'data_privacy_content': self.data_privacy,
+                'information_modal': self.information_modal,
+                'user_menu_button': self.get_user_menu(),
+                'filter_menu': self.get_filter_menu(),
+                'leaflet_tiles': json.dumps(self.leaflet_tiles),
+                'is_mapped': self.is_mapped,
+                'marker': json.dumps(MARKER),
+                'user_info_popup_template': self.user_popup,
+                'roles': json.dumps(list(Role.objects.all().values()))
             }
-            email = loader.render_to_string(
-                'user_map/account/registration_confirmation_email.html',
-                context)
-
-            subject = '%s User Registration' % PROJECT_NAME
-            sender = '%s - No Reply <%s>' % (PROJECT_NAME, DEFAULT_FROM_MAIL)
-            send_mail(
-                subject, email, sender, [user.email], fail_silently=False)
-
-            messages.success(
-                request,
-                ('Thank you for registering in our site! Please check your '
-                 'email to confirm your registration'))
-            return HttpResponseRedirect(reverse('user_map:register'))
-    else:
-        form = RegistrationForm()
-    return render_to_response(
-        'user_map/account/registration.html',
-        {'form': form},
-        context_instance=RequestContext(request)
-    )
-
-
-@login_forbidden
-def confirm_registration(request, uid, key):
-    """The view containing form to reset password and process it.
-
-    :param request: A django request object.
-    :type request: request
-
-    :param uid: A unique id for a user.
-    :type uid: str
-
-    :param key: Key to confirm the user.
-    :type key: str
-    """
-    decoded_uid = urlsafe_base64_decode(uid)
-    try:
-        user = User.objects.get(pk=decoded_uid)
-
-        if not user.is_confirmed:
-            if user.key == key:
-                user.is_confirmed = True
-                user.save(update_fields=['is_confirmed'])
-                information = (
-                    'Congratulations! Your account has been successfully '
-                    'confirmed. Please continue to log in.')
-            else:
-                information = (
-                    'Your link is not valid. Please make sure that you use '
-                    'confirmation link we sent to your email.')
-        else:
-            information = ('Your account is already confirmed. Please '
-                           'continue to log in.')
-    except (TypeError, ValueError, OverflowError, User.DoesNotExist):
-        information = ('Your link is not valid. Please make sure that you use '
-                       'confirmation link we sent to your email.')
-
-    context = {
-        'page_header_title': 'Registration Confirmation',
-        'information': information
-    }
-    return render_to_response(
-        'user_map/information.html',
-        context,
-        context_instance=RequestContext(request)
-    )
-
-
-@login_forbidden
-def login(request):
-    """Login view.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    if request.method == 'POST':
-        next_page = request.GET.get('next', '')
-        if next_page == '':
-            next_page = reverse('user_map:index')
-        form = LoginForm(data=request.POST)
-        if form.is_valid():
-            user = authenticate(
-                email=request.POST['email'],
-                password=request.POST['password']
-            )
-            if user is not None:
-                if user.is_active and user.is_confirmed:
-                    django_login(request, user)
-
-                    return HttpResponseRedirect(next_page)
-                if not user.is_active:
-                    errors = form._errors.setdefault(
-                        NON_FIELD_ERRORS, ErrorList())
-                    errors.append(
-                        'The user is not active. Please contact our '
-                        'administrator to resolve this.')
-                if not user.is_confirmed:
-                    errors = form._errors.setdefault(
-                        NON_FIELD_ERRORS, ErrorList())
-                    errors.append(
-                        'Please confirm you registration email first!')
-            else:
-                errors = form._errors.setdefault(
-                    NON_FIELD_ERRORS, ErrorList())
-                errors.append(
-                    'Please enter a correct email and password. '
-                    'Note that both fields may be case-sensitive.')
-    else:
-        form = LoginForm()
-
-    return render_to_response(
-        'user_map/account/login.html',
-        {'form': form},
-        context_instance=RequestContext(request))
-
-
-def logout(request):
-    """Log out view.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    django_logout(request)
-    return HttpResponseRedirect(reverse('user_map:index'))
-
-
-@login_required(login_url='user_map:login')
-def update_user(request):
-    """Update user view.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    anchor_id = '#basic-information'
-    if request.method == 'POST':
-        if 'change_basic_info' in request.POST:
-            anchor_id = '#basic-information'
-            basic_info_form = BasicInformationForm(
-                data=request.POST, instance=request.user)
-            change_password_form = PasswordChangeForm(user=request.user)
-            if basic_info_form.is_valid():
-                user = basic_info_form.save()
-                messages.success(
-                    request, 'You have successfully changed your information!')
-                return HttpResponseRedirect(
-                    reverse('user_map:update_user') + anchor_id)
-            else:
-                anchor_id = '#basic-information'
-        elif 'change_password' in request.POST:
-            anchor_id = '#security'
-            change_password_form = PasswordChangeForm(
-                data=request.POST, user=request.user)
-            basic_info_form = BasicInformationForm(instance=request.user)
-            if change_password_form.is_valid():
-                user = change_password_form.save()
-                messages.success(
-                    request, 'You have successfully changed your password!')
-                return HttpResponseRedirect(
-                    reverse('user_map:update_user') + anchor_id)
-            else:
-                anchor_id = '#security'
-    else:
-        basic_info_form = BasicInformationForm(instance=request.user)
-        change_password_form = PasswordChangeForm(user=request.user)
-
-    return render_to_response(
-        'user_map/account/edit_user.html',
-        {
-            'basic_info_form': basic_info_form,
-            'change_password_form': change_password_form,
-            'anchor_id': anchor_id,
-        },
-        context_instance=RequestContext(request)
-    )
-
-
-@login_required(login_url='user_map:index')
-def delete_user(request):
-    """Delete user view.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    if request.method == 'POST':
-        user = request.user
-        user.delete()
-        django_logout(request)
-
-        information = ('You have deleted your account. Please register to '
-                       'this site any time you want.')
-        context = {
-            'page_header_title': 'Delete Account',
-            'information': information
-        }
-        return render_to_response(
-            'user_map/information.html',
-            context,
-            context_instance=RequestContext(request)
         )
-    else:
-        raise Http404
-
-
-@login_forbidden
-def password_reset(request):
-    """The view for reset password that contains a form to ask for email.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    return django_password_reset(
-        request,
-        password_reset_form=CustomPasswordResetForm,
-        template_name='user_map/account/password_reset_form.html',
-        email_template_name='user_map/account/password_reset_email.html',
-        post_reset_redirect=reverse('user_map:password_reset_done'))
-
-
-@login_forbidden
-def password_reset_done(request):
-    """The view telling the user that an email has been sent.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    return django_password_reset_done(
-        request,
-        template_name='user_map/account/password_reset_done.html')
-
-
-@login_forbidden
-def password_reset_confirm(request, uidb64=None, token=None):
-    """The view containing form to reset password and process it.
-
-    :param request: A django request object.
-    :type request: request
-
-    :param uidb64: An unique ID of the user.
-    :type uidb64: str
-
-    :param token: Token to check if the reset password link is valid.
-    :type token: str
-    """
-    return django_password_reset_confirm(
-        request,
-        uidb64=uidb64,
-        token=token,
-        template_name='user_map/account/password_reset_confirm.html',
-        set_password_form=SetPasswordForm,
-        post_reset_redirect=reverse('user_map:password_reset_complete'))
-
-
-@login_forbidden
-def password_reset_complete(request):
-    """The view telling the user that reset password has been completed.
-
-    :param request: A django request object.
-    :type request: request
-    """
-    return django_password_reset_complete(
-        request,
-        template_name='user_map/account/password_reset_complete.html')
-
-
-def download(request):
-    """The view to download users data as CSV.
-
-    :param request: A django request object.
-    :type request: request
-
-    :return: A CSV file.
-    :type: HttpResponse
-    """
-    response = HttpResponse(content_type='text/csv')
-    response['Content-Disposition'] = 'attachment; filename="users.csv"'
-
-    users = User.objects.filter(role__sort_number__gte=1)
-    writer = csv.writer(response)
-
-    fields = ['name', 'website', 'role', 'location']
-    headers = ['No.']
-    for field in fields:
-        verbose_name_field = users.model._meta.get_field(field).verbose_name
-        headers.append(verbose_name_field)
-    writer.writerow(headers)
-
-    for idx, user in enumerate(users):
-        row = [idx + 1]
-        for field in fields:
-            field_value = getattr(user, field)
-            row.append(field_value)
-        writer.writerow(row)
-
-    return response
+        return context
+
+
+class UserMapList(generics.ListAPIView):
+    """List of User Map with REST."""
+    queryset = UserMap.objects.filter(is_hidden=False)
+    serializer_class = UserMapSerializer
+
+
+class UserAddView(BaseTemplateMixin, CreateView):
+    """View to add user to the map."""
+    model = UserMap
+    form_class = UserMapForm
+    template_name = 'user_map/user_add_update.html'
+
+    def form_valid(self, form):
+        form.instance.user = self.request.user
+        messages.add_message(
+            self.request,
+            messages.INFO,
+            'You have been added successfully to the map!'
+        )
+        return super(UserAddView, self).form_valid(form)
+
+    def get_success_url(self):
+        return reverse('user_map:index')
+
+    def dispatch(self, request, *args, **kwargs):
+        if self.is_mapped:
+            return HttpResponseRedirect(reverse('user_map:index'))
+        return super(UserAddView, self).dispatch(request, *args, **kwargs)
+
+    def get_context_data(self, **kwargs):
+        context = super(UserAddView, self).get_context_data(**kwargs)
+        context['title'] = 'Add me to the map!'
+        context['description'] = ('Hey %s, please provide your information '
+                                  'on the form below.') % self.request.user
+        return context
+
+
+class UserUpdateView(BaseTemplateMixin, UpdateView):
+    """View to update a user."""
+    model = UserMap
+    form_class = UserMapForm
+    template_name = 'user_map/user_add_update.html'
+
+    def get(self, request, **kwargs):
+        try:
+            self.object = self.request.user.usermap
+        except ObjectDoesNotExist:
+            return HttpResponseRedirect(reverse('user_map:index'))
+
+        form_class = self.get_form_class()
+        form = self.get_form(form_class)
+        context = self.get_context_data(object=self.object, form=form)
+        return self.render_to_response(context)
+
+    def get_object(self, queryset=None):
+        return self.request.user.usermap
+
+    def get_success_url(self):
+        return reverse('user_map:index')
+
+    def form_valid(self, form):
+        # form.instance.user = self.request.user
+        messages.add_message(
+            self.request,
+            messages.INFO,
+            'You are successfully updated!'
+        )
+        return super(UserUpdateView, self).form_valid(form)
+
+    def get_context_data(self, **kwargs):
+        context = super(UserUpdateView, self).get_context_data(**kwargs)
+        context['title'] = 'Update Profile'
+        context['description'] = ('Hey %s, please change the information you '
+                                  'want to update below!') % self.request.user
+        return context