diff --git a/.gitignore b/.gitignore
index f9366b84..1ccf35a8 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
+/src/dataloaderinterface/static/data
 /src/WebSDL/.idea
 # Created by .ignore support plugin (hsz.mobi)
 ### Python template
diff --git a/requirements.txt b/requirements.txt
index 9168b6b2..39346d35 100644
--- a/requirements.txt
+++ b/requirements.txt
@@ -1,19 +1,17 @@
 beautifulsoup4==4.5.1
+codegen==1.0
 coverage==4.2
 Django==1.10.3
-django-autocomplete-light==3.2.1
-django-bootstrap-form==3.2.1
-django-crispy-forms==1.6.1
+django-debug-toolbar==1.6
 django-discover-runner==1.0
-django-filter==1.0.0
-django-formset-js==0.5.0
-django-jquery-js==2.1.4
 django-webtest==1.8.0
 django-widget-tweaks==1.4.1
 djangorestframework==3.5.3
 Markdown==2.6.7
-mysqlclient==1.3.9
+patterns==0.3
+psycopg2==2.7.1
 six==1.10.0
+sqlparse==0.2.2
 waitress==1.0.1
 WebOb==1.6.2
 WebTest==2.0.23
diff --git a/src/WebSDL/settings/base.py b/src/WebSDL/settings/base.py
index facda1d1..bf035e5a 100644
--- a/src/WebSDL/settings/base.py
+++ b/src/WebSDL/settings/base.py
@@ -32,22 +32,22 @@
     print("The secret key is required in the settings.json file.")
     exit(1)
 
-ALLOWED_HOSTS = []
+ALLOWED_HOSTS = ['*']
 
 
 # Application definition
 
 INSTALLED_APPS = [
+    'rest_framework',
+    'dataloader',
+    'dataloaderservices',
+    'dataloaderinterface',
     'django.contrib.admin',
     'django.contrib.auth',
     'django.contrib.contenttypes',
     'django.contrib.sessions',
     'django.contrib.messages',
     'django.contrib.staticfiles',
-    'rest_framework',
-    'dataloader',
-    'dataloaderservices',
-    'dataloaderinterface',
     'widget_tweaks'
 ]
 
@@ -131,14 +131,10 @@
 
 LANGUAGE_CODE = 'en-us'
 
-TIME_ZONE = 'UTC'
-
 USE_I18N = True
 
 USE_L10N = True
 
-USE_TZ = True
-
 LOGIN_URL = 'login'
 
 DATABASE_ROUTERS = ['WebSDL.db_routers.WebSDLRouter']
@@ -154,4 +150,17 @@
 
 RECAPTCHA_USER_KEY = data["recaptcha_user_key"] if "recaptcha_user_key" in data else ""
 
-RECAPTCHA_VERIFY_URL = "https://www.google.com/recaptcha/api/siteverify"
\ No newline at end of file
+RECAPTCHA_VERIFY_URL = "https://www.google.com/recaptcha/api/siteverify"
+
+
+EMAIL_SENDER = data['email_sender'] if 'email_sender' in data else '',
+
+DEFAULT_FROM_EMAIL = EMAIL_SENDER[0] if isinstance(EMAIL_SENDER, tuple) else EMAIL_SENDER
+
+EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'
+
+EMAIL_SERVER = data['email_host'] if 'email_host' in data else '',
+
+EMAIL_HOST = EMAIL_SERVER[0] if isinstance(EMAIL_SERVER, tuple) else EMAIL_SERVER
+
+DATETIME_FORMAT = "N j, Y, H:m"
diff --git a/src/WebSDL/settings/development.py b/src/WebSDL/settings/development.py
index d86e3553..b5725919 100644
--- a/src/WebSDL/settings/development.py
+++ b/src/WebSDL/settings/development.py
@@ -4,9 +4,9 @@
 
 INTERNAL_IPS = (
     '127.0.0.1',
-    '129.123.51.198'
 )
 
+STATIC_ROOT = os.path.join(os.path.join(BASE_DIR, os.pardir), 'dataloaderinterface', 'static')
 STATIC_URL = '/static/'
 SITE_URL = ''
 
diff --git a/src/WebSDL/settings/settings_template.json b/src/WebSDL/settings/settings_template.json
new file mode 100644
index 00000000..ec721c1b
--- /dev/null
+++ b/src/WebSDL/settings/settings_template.json
@@ -0,0 +1,28 @@
+{
+  "secret_key": "",
+  "host": "-optional",
+  "recaptcha_secret_key": "-optional",
+  "recaptcha_user_key": "-optional",
+  "email_sender": "password.reset@data.envirodiy.org",
+  "email_host": "mail.usu.edu",
+  "databases": [
+    {
+      "name": "default",
+      "schema": "",
+      "engine": "",
+      "user": "",
+      "password": "",
+      "host": "",
+      "port": ""
+    },
+    {
+      "name": "odm2",
+      "schema": "",
+      "engine": "",
+      "user": "",
+      "password": "",
+      "host": "",
+      "port": ""
+    }
+  ]
+}
diff --git a/src/WebSDL/urls.py b/src/WebSDL/urls.py
index 85de5df7..280895d5 100644
--- a/src/WebSDL/urls.py
+++ b/src/WebSDL/urls.py
@@ -14,15 +14,13 @@
     2. Add a URL to urlpatterns:  url(r'^blog/', include('blog.urls'))
 """
 from django.conf import settings
-from django.contrib.auth import views as auth_views
 from django.conf.urls import url, include
 from django.contrib import admin
+from django.contrib.auth import views as auth_views
 from django.core.urlresolvers import reverse_lazy
-from django.views.generic.edit import CreateView
 
-from dataloader.models import Organization
-from dataloaderinterface.forms import UserRegistrationForm
-from dataloaderinterface.views import UserRegistrationView
+from dataloaderinterface.views import UserRegistrationView, UserUpdateView
+
 
 BASE_URL = settings.SITE_URL[1:]
 
@@ -34,11 +32,24 @@
     'next_page': reverse_lazy('home')
 }
 
+password_reset_configuration = {
+    'post_reset_redirect': 'password_reset_done'
+}
+
+password_done_configuration = {
+    'post_reset_redirect': 'password_reset_complete'
+}
+
 urlpatterns = [
+    url(r'^' + BASE_URL + 'password-reset/$', auth_views.password_reset, password_reset_configuration, name='password_reset'),
+    url(r'^' + BASE_URL + 'password-reset/done/$', auth_views.password_reset_done, name='password_reset_done'),
+    url(r'^' + BASE_URL + 'password-reset/(?P<uidb64>[0-9A-Za-z]+)-(?P<token>.+)/$', auth_views.password_reset_confirm, password_done_configuration, name='password_reset_confirm'),
+    url(r'^' + BASE_URL + 'password-reset/completed/$', auth_views.password_reset_complete, name='password_reset_complete'),
     url(r'^' + BASE_URL + 'admin/', admin.site.urls),
     url(r'^' + BASE_URL + 'login/$', auth_views.login, login_configuration, name='login'),
     url(r'^' + BASE_URL + 'logout/$', auth_views.logout, logout_configuration, name='logout'),
     url(r'^' + BASE_URL + 'register/$', UserRegistrationView.as_view(), name='user_registration'),
+    url(r'^' + BASE_URL + 'account/$', UserUpdateView.as_view(), name='user_account'),
     url(r'^' + BASE_URL + 'api-auth/', include('rest_framework.urls', namespace='rest_framework')),
     url(BASE_URL, include('dataloaderinterface.urls')),
     url(BASE_URL, include('dataloaderservices.urls')),
diff --git a/src/dataloader/models.py b/src/dataloader/models.py
index 1635ef43..4140694f 100644
--- a/src/dataloader/models.py
+++ b/src/dataloader/models.py
@@ -1,15 +1,17 @@
 from __future__ import unicode_literals
 
+import inspect
+import sys
 import uuid
 
-from django.db import models
-from django.utils.encoding import python_2_unicode_compatible
-
 from dataloader.querysets import AffiliationQuerySet, RelatedActionManager, ResultManager, \
-    DataLoggerFileManager, EquipmentModelManager, DataLoggerFileColumnManager, InstrumentOutputVariableManager, \
+    DataLoggerFileManager, InstrumentOutputVariableManager, \
     EquipmentManager, CalibrationReferenceEquipmentManager, EquipmentUsedManager, MaintenanceActionManager, \
     RelatedEquipmentManager, CalibrationActionManager, ODM2QuerySet, ActionQuerySet, ActionByQuerySet, \
-    FeatureActionQuerySet, TimeSeriesValuesQuerySet
+    FeatureActionQuerySet, TimeSeriesValuesQuerySet, EquipmentModelQuerySet
+from django.conf import settings
+from django.db import models
+from django.utils.encoding import python_2_unicode_compatible
 
 
 # TODO: function to handle the file upload folder for file fields.
@@ -120,7 +122,7 @@ class ResultValue(models.Model):
     value_datetime_utc_offset = models.IntegerField(db_column='valuedatetimeutcoffset')
 
     def __str__(self):
-        return '%s %s' % self.value_datetime, self.data_value
+        return '%s %s' % (self.value_datetime, self.data_value)
 
     def __repr__(self):
         return "<%s('%s', '%s', Result['%s', '%s'], '%s')>" % (
@@ -137,7 +139,7 @@ class ResultValueAnnotation(models.Model):
     annotation = models.ForeignKey('Annotation', db_column='annotationid')
 
     def __str__(self):
-        return '%s %s' % self.value_datetime, self.data_value
+        return '%s %s' % (self.value_datetime, self.data_value)
 
     def __repr__(self):
         return "<%s('%s', Annotation['%s', '%s'], ResultValue['%s', '%s')>" % (
@@ -191,6 +193,9 @@ class XIntendedComponent(models.Model):
     intended_x_spacing = models.FloatField(db_column='intendedxspacing')
     intended_x_spacing_unit = models.ForeignKey('Unit', related_name='+', db_column='intendedxspacingunitsid', blank=True, null=True)
 
+    class Meta:
+        abstract = True
+
 
 class YIntendedComponent(models.Model):
     intended_y_spacing = models.FloatField(db_column='intendedyspacing')
@@ -407,7 +412,7 @@ class Meta:
 class Organization(ODM2Model):
     organization_id = models.AutoField(db_column='organizationid', primary_key=True)
     organization_type = models.ForeignKey('OrganizationType', db_column='organizationtypecv')
-    organization_code = models.CharField(db_column='organizationcode', max_length=50)
+    organization_code = models.CharField(db_column='organizationcode', max_length=50, unique=True)
     organization_name = models.CharField(db_column='organizationname', max_length=255)
     organization_description = models.CharField(db_column='organizationdescription', blank=True, max_length=500)
     organization_link = models.CharField(db_column='organizationlink', blank=True, max_length=255)
@@ -447,7 +452,7 @@ def role_status(self):
         return 'Primary contact' if self.is_primary_organization_contact else 'Secondary contact'
 
     def __str__(self):
-        return '%s (%s) - %s' % (self.person, self.primary_email, self.organization)
+        return '%s - %s' % (self.person, self.organization)
 
     def __repr__(self):
         return "<Affiliation('%s', Person['%s', '%s'], Organization['%s', '%s'], '%s', '%s', '%s')>" % (
@@ -547,7 +552,7 @@ class SamplingFeature(models.Model):
     sampling_feature_id = models.AutoField(db_column='samplingfeatureid', primary_key=True)
     sampling_feature_uuid = models.UUIDField(default=uuid.uuid4, editable=False, db_column='samplingfeatureuuid')
     sampling_feature_type = models.ForeignKey('SamplingFeatureType', db_column='samplingfeaturetypecv')
-    sampling_feature_code = models.CharField(db_column='samplingfeaturecode', max_length=50)
+    sampling_feature_code = models.CharField(db_column='samplingfeaturecode', max_length=50, unique=True)
     sampling_feature_name = models.CharField(db_column='samplingfeaturename', blank=True, max_length=255)
     sampling_feature_description = models.CharField(db_column='samplingfeaturedescription', blank=True, max_length=500)
     sampling_feature_geo_type = models.ForeignKey('SamplingFeatureGeoType', db_column='samplingfeaturegeotypecv', blank=True, null=True)
@@ -562,6 +567,12 @@ class SamplingFeature(models.Model):
     external_identifiers = models.ManyToManyField('ExternalIdentifierSystem', related_name='sampling_features',
                                                   through='SamplingFeatureExternalIdentifier')
 
+    @property
+    def latest_updated_result(self):
+        return self.feature_actions.with_results()\
+            .filter(results__value_count__gt=0)\
+            .latest('results__result_datetime').results.first()
+
     def __str__(self):
         return '%s %s' % (self.sampling_feature_code, self.sampling_feature_name)
 
@@ -690,7 +701,7 @@ class Unit(models.Model):
     unit_link = models.CharField(db_column='unitslink', blank=True, max_length=255)
 
     def __str__(self):
-        return '%s: %s (%s)' % (self.unit_type_id, self.unit_abbreviation, self.unit_name)
+        return '%s: %s (%s)' % (self.unit_type_id, self.unit_name, self.unit_abbreviation)
 
     def __repr__(self):
         return "<Unit('%s', '%s', '%s', '%s')>" % (
@@ -717,7 +728,7 @@ class Variable(models.Model):
                                                   through='VariableExternalIdentifier')
 
     def __str__(self):
-        return '%s: %s (%s)' % (self.variable_name_id, self.variable_code, self.variable_type_id)
+        return '%s: %s' % (self.variable_name_id, self.variable_code)
 
     def __repr__(self):
         return "<Variable('%s', '%s', '%s', '%s')>" % (
@@ -777,7 +788,7 @@ class Meta:
 @python_2_unicode_compatible
 class DataLoggerProgramFile(models.Model):
     program_id = models.AutoField(db_column='programid', primary_key=True)
-    affiliation_id = models.ForeignKey('Affiliation', db_column='affiliationid')
+    affiliation = models.ForeignKey('Affiliation', db_column='affiliationid', related_name='data_logger_programs')
     program_name = models.CharField(db_column='programname', max_length=255)
     program_description = models.CharField(db_column='programdescription', blank=True, max_length=500)
     program_version = models.CharField(db_column='programversion', blank=True, max_length=50)
@@ -798,7 +809,7 @@ class Meta:
 @python_2_unicode_compatible
 class DataLoggerFile(models.Model):
     data_logger_file_id = models.AutoField(db_column='dataloggerfileid', primary_key=True)
-    program = models.ForeignKey('DataLoggerProgramFile', db_column='programid')
+    program = models.ForeignKey('DataLoggerProgramFile', db_column='programid', related_name='data_logger_files')
     data_logger_file_name = models.CharField(db_column='dataloggerfilename', max_length=255)
     data_logger_file_description = models.CharField(db_column='dataloggerfiledescription', blank=True, max_length=500)
     data_logger_file_link = models.FileField(db_column='dataloggerfilelink', blank=True)
@@ -833,8 +844,6 @@ class DataLoggerFileColumn(models.Model):
     recording_interval_unit = models.ForeignKey('Unit', related_name='recording_interval_data_logger_file_columns', db_column='recordingintervalunitsid', blank=True, null=True)
     aggregation_statistic = models.ForeignKey('AggregationStatistic', related_name='data_logger_file_columns', db_column='aggregationstatisticcv', blank=True)
 
-    objects = DataLoggerFileColumnManager()
-
     def __str__(self):
         return '%s %s' % (self.column_label, self.column_description)
 
@@ -861,10 +870,10 @@ class EquipmentModel(models.Model):
     output_variables = models.ManyToManyField('Variable', related_name='instrument_models', through='InstrumentOutputVariable')
     output_units = models.ManyToManyField('Unit', related_name='instrument_models', through='InstrumentOutputVariable')
 
-    objects = EquipmentModelManager()
+    objects = EquipmentModelQuerySet.as_manager()
 
     def __str__(self):
-        return '%s: %s' % (self.model_name, self.model_description)
+        return '%s %s' % (self.model_manufacturer, self.model_name)
 
     def __repr__(self):
         return "<EquipmentModel('%s', '%s', '%s', Organization[%s, %s])>" % (
@@ -1849,7 +1858,7 @@ class Meta:
         db_table = 'pointcoverageresults'
 
 
-class ProfileResult(ExtendedResult, AggregatedComponent, XOffsetComponent, YOffsetComponent, YIntendedComponent, ZIntendedComponent, TimeIntendedComponent):
+class ProfileResult(ExtendedResult, AggregatedComponent, XOffsetComponent, YOffsetComponent, ZIntendedComponent, TimeIntendedComponent):
     class Meta:
         db_table = 'profileresults'
 
@@ -2068,3 +2077,19 @@ class Meta:
         db_table = 'transectresultvalueannotations'
 
 # endregion
+
+
+# TODO: make something more sophisticated than this later on
+sql_schema_fix = 'odm2].['   # for SQL databases
+psql_schema_fix = 'odm2"."'  # for postgres databases
+clsmembers = inspect.getmembers(sys.modules[__name__], inspect.isclass)
+classes = [model for name, model in clsmembers if issubclass(model, models.Model)]
+database_manager = settings.DATABASES['odm2']['ENGINE']
+
+for model in classes:
+    if database_manager == u'sql_server.pyodbc':
+        model._meta.db_table = sql_schema_fix.upper() + model._meta.db_table
+    elif database_manager == u'django.db.backends.postgresql_psycopg2':
+        model._meta.db_table = psql_schema_fix + model._meta.db_table
+
+            # can add more fixes there depending on the database engine
diff --git a/src/dataloader/querysets.py b/src/dataloader/querysets.py
index 377af979..93d260fc 100644
--- a/src/dataloader/querysets.py
+++ b/src/dataloader/querysets.py
@@ -47,7 +47,7 @@ def for_display(self):
         return self.select_related('action').prefetch_related('sampling_feature')
 
     def with_results(self):
-        return self.prefetch_related('results__timeseriesresult__values', 'results__variable')
+        return self.prefetch_related('results__timeseriesresult__values', 'results__variable', 'results__unit')
 
 
 class RelatedActionManager(models.Manager):
@@ -80,10 +80,9 @@ def get_queryset(self):
 # region ODM2 Equipment Extension
 
 
-class EquipmentModelManager(models.Manager):
-    def get_queryset(self):
-        queryset = super(EquipmentModelManager, self).get_queryset()
-        return queryset.prefetch_related('model_manufacturer')
+class EquipmentModelQuerySet(ODM2QuerySet):
+    def for_display(self):
+        return self.prefetch_related('model_manufacturer')
 
 
 class InstrumentOutputVariableManager(models.Manager):
diff --git a/src/dataloader/tests/test_models.py b/src/dataloader/tests/test_models.py
index 7b89e06e..3a8b89b2 100644
--- a/src/dataloader/tests/test_models.py
+++ b/src/dataloader/tests/test_models.py
@@ -1,6 +1,6 @@
+from dataloader.models import *
 from django.test import TestCase
 
-from dataloader.models import *
 from dataloader.tests.data import data_manager
 
 models_data = data_manager.test_data['models']['data']
diff --git a/src/dataloaderinterface/csv_serializer.py b/src/dataloaderinterface/csv_serializer.py
new file mode 100644
index 00000000..b8325afe
--- /dev/null
+++ b/src/dataloaderinterface/csv_serializer.py
@@ -0,0 +1,67 @@
+import codecs
+import csv
+import os
+
+from datetime import timedelta
+from django.contrib.staticfiles.storage import staticfiles_storage
+from unicodecsv.py2 import UnicodeWriter
+
+
+class SiteResultSerializer:
+    headers = ('DateTime', 'TimeOffset', 'DateTimeUTC', 'Value', 'CensorCode', 'QualifierCode', )
+    date_format = '%Y-%m-%d %H:%M:%S'
+
+    def __init__(self, result):
+        self.result = result
+
+    def get_file_path(self):
+        filename = "{0}_{1}_{2}.csv".format(self.result.feature_action.sampling_feature.sampling_feature_code,
+                                            self.result.variable.variable_code, self.result.result_id)
+        return os.path.join('data', filename)
+
+    def open_csv_file(self):
+        csv_file = staticfiles_storage.open(self.get_file_path(), 'ab+')
+        return csv_file
+
+    def create_csv_file(self):
+        csv_file = staticfiles_storage.open(self.get_file_path(), 'wb')
+        return csv_file
+
+    def get_metadata_template(self):
+        with codecs.open(os.path.join(os.path.dirname(__file__), 'metadata_template.txt'), 'r', encoding='utf-8') as metadata_file:
+            return metadata_file.read()
+
+    def generate_metadata(self):
+        action = self.result.feature_action.action
+        equipment_model = self.result.data_logger_file_columns.first().instrument_output_variable.model
+        affiliation = action.action_by.filter(is_action_lead=True).first().affiliation
+        return self.get_metadata_template().format(
+            sampling_feature=self.result.feature_action.sampling_feature,
+            variable=self.result.variable,
+            unit=self.result.unit,
+            model=equipment_model,
+            result=self.result,
+            action=action,
+            affiliation=affiliation
+        ).encode('utf-8')
+
+    def build_csv(self):
+        with self.create_csv_file() as output_file:
+            output_file.write(self.generate_metadata())
+            csv_writer = UnicodeWriter(output_file)
+            csv_writer.writerow(self.headers)
+
+    def add_data_value(self, data_value):
+        self.add_data_values([data_value])
+
+    def add_data_values(self, data_values):
+        data = [(data_value.value_datetime.strftime(self.date_format),
+                 '{0}:00'.format(data_value.value_datetime_utc_offset),
+                 (data_value.value_datetime - timedelta(hours=data_value.value_datetime_utc_offset)).strftime(self.date_format),
+                 data_value.data_value,
+                 data_value.censor_code_id,
+                 data_value.quality_code_id)
+                for data_value in data_values]
+        with self.open_csv_file() as output_file:
+            csv_writer = UnicodeWriter(output_file)
+            csv_writer.writerows(data)
diff --git a/src/dataloaderinterface/forms.py b/src/dataloaderinterface/forms.py
index 0956dbde..c1b51a55 100644
--- a/src/dataloaderinterface/forms.py
+++ b/src/dataloaderinterface/forms.py
@@ -1,13 +1,14 @@
 from datetime import datetime
 
+from dataloader.models import SamplingFeature, People, Organization, Affiliation, Result, Site, EquipmentModel, Medium, \
+    OrganizationType, ActionBy, SiteType
 from django import forms
-from django.contrib.auth.forms import UserCreationForm
+from django.contrib.auth.forms import UserCreationForm, UserChangeForm
+from django.contrib.auth.models import User
 from django.db.models.query_utils import Q
 from django.forms.formsets import formset_factory
 
 from dataloaderinterface.models import ODM2User
-from dataloader.models import SamplingFeature, Action, People, Organization, Affiliation, Result, ActionBy, Method, \
-    Site, EquipmentModel, Medium, OrganizationType
 
 
 # AUTHORIZATION
@@ -20,7 +21,7 @@ class UserRegistrationForm(UserCreationForm):
     last_name = forms.CharField(required=True, max_length=50)
     email = forms.EmailField(required=True, max_length=254)
     organization = forms.ModelChoiceField(
-        queryset=Organization.objects.all().exclude(organization_type__in=['Vendor', 'Manufacturer']), required=False)
+        queryset=Organization.objects.all().exclude(organization_type__in=['Vendor', 'Manufacturer']), required=False, help_text='Begin to enter the common name of your organization to choose from the list. If "No results found", then clear your entry, click on the drop-down-list to select "Add New Organization".')
     agreement = forms.BooleanField(required=True)
 
     def save(self, commit=True):
@@ -31,26 +32,76 @@ def save(self, commit=True):
         user.agreement = self.cleaned_data['agreement']
         organization = self.cleaned_data['organization']
 
-        person = People.objects.filter(person_first_name=user.first_name, person_last_name=user.last_name).first() or \
-            People.objects.create(person_first_name=user.first_name, person_last_name=user.last_name)
-        affiliation = Affiliation.objects.filter(person=person, organization=organization).first() or \
-            Affiliation.objects.create(person=person, organization=organization, affiliation_start_date=datetime.now())
-
         if commit:
             user.save()
+            person = People.objects.create(person_first_name=user.first_name, person_last_name=user.last_name)
+            affiliation = Affiliation.objects.create(person=person, organization=organization, affiliation_start_date=datetime.now(), primary_email=user.email)
             ODM2User.objects.create(user=user, affiliation_id=affiliation.affiliation_id)
 
         return user
 
+    class Meta:
+        model = User
+        fields = ['first_name', 'last_name', 'email', 'username', 'organization']
+
+
+class UserUpdateForm(UserChangeForm):
+    use_required_attribute = False
+
+    first_name = forms.CharField(required=True, max_length=50)
+    last_name = forms.CharField(required=True, max_length=50)
+    email = forms.EmailField(required=True, max_length=254)
+    organization = forms.ModelChoiceField(
+        queryset=Organization.objects.all().exclude(organization_type__in=['Vendor', 'Manufacturer']),
+        required=False,
+        help_text='Begin to enter the common name of your organization to choose from the list. If "No results found", then clear your entry, click on the drop-down-list to select "Add New Organization".')
+
+    def save(self, commit=True):
+        user = super(UserUpdateForm, self).save(commit=False)
+        organization = self.cleaned_data['organization']
+
+        if commit:
+            affiliation = user.odm2user.affiliation
+            person = affiliation.person
+
+            person.person_first_name = user.first_name
+            person.person_last_name = user.last_name
+            affiliation.primary_email = user.email
+            affiliation.organization = organization
+
+            user.save()
+            person.save()
+            affiliation.save()
+
+        return user
+
+    class Meta:
+        model = User
+        fields = ['first_name', 'last_name', 'email', 'password', 'username', 'organization']
+
 
 # ODM2
 
+class ActionByForm(forms.ModelForm):
+    use_required_attribute = False
+    affiliation = forms.ModelChoiceField(queryset=Affiliation.objects.all(), required=False, help_text='', label='Deployed By')
+
+    class Meta:
+        model = ActionBy
+        fields = ['affiliation']
+
+
 class OrganizationForm(forms.ModelForm):
     use_required_attribute = False
-    organization_type = forms.ModelChoiceField(queryset=OrganizationType.objects.all().exclude(name__in=['Vendor', 'Manufacturer']), required=False)
+    organization_type = forms.ModelChoiceField(queryset=OrganizationType.objects.all().exclude(name__in=['Vendor', 'Manufacturer']), required=False, help_text='Choose the type of organization')
 
     class Meta:
         model = Organization
+        help_texts = {
+            'organization_code': 'Enter a brief, but unique code to identify your organization (e.g., "USU" or "USGS")',
+            'organization_name': 'Enter the name of your organization',
+            'organization_description': 'Enter a description for your organization'
+        }
         fields = [
             'organization_code',
             'organization_name',
@@ -61,9 +112,15 @@ class Meta:
 
 class SamplingFeatureForm(forms.ModelForm):
     use_required_attribute = False
+    sampling_feature_name = forms.CharField(required=True, label='Site Name', help_text='Enter a brief but descriptive name for your site (e.g., "Delaware River near Phillipsburg")')
 
     class Meta:
         model = SamplingFeature
+        help_texts = {
+            'sampling_feature_code': 'Enter a brief and unique text string to identify your site (e.g., "Del_Phil")',
+            'elevation_m': 'Enter the elevation of your site in meters',
+            'elevation_datum': 'Choose the elevation datum for your site\'s elevation. If you don\'t know it, choose "MSL"'
+        }
         fields = [
             'sampling_feature_code',
             'sampling_feature_name',
@@ -72,16 +129,28 @@ class Meta:
         ]
         labels = {
             'sampling_feature_code': 'Site Code',
-            'sampling_feature_name': 'Site Name',
             'elevation_m': 'Elevation',
         }
 
 
 class SiteForm(forms.ModelForm):
+    allowed_site_types = [
+        'Aggregate groundwater use', 'Ditch', 'Atmosphere', 'Estuary', 'House', 'Land', 'Pavement', 'Stream', 'Spring',
+        'Lake, Reservoir, Impoundment', 'Laboratory or sample-preparation area', 'Soil hole', 'Storm sewer', 'Tidal stream', 'Wetland'
+    ]
+
+    site_type = forms.ModelChoiceField(
+        queryset=SiteType.objects.filter(name__in=allowed_site_types), help_text='Select the type of site you are deploying (e.g., "Stream")'
+    )
     use_required_attribute = False
 
     class Meta:
         model = Site
+        help_texts = {
+            'site_type': '',
+            'latitude': 'Enter the latitude of your site in decimal degrees (e.g., 40.6893)',
+            'longitude': 'Enter the longitude of your site in decimal degrees (e.g., -75.2033)',
+        }
         fields = [
             'site_type',
             'latitude',
@@ -94,16 +163,25 @@ def __init__(self, *args, **kwargs):
         super(ResultForm, self).__init__(*args, **kwargs)
         self.empty_permitted = False
 
-    equipment_model = forms.ModelChoiceField(queryset=EquipmentModel.objects.all())
+    equipment_model = forms.ModelChoiceField(queryset=EquipmentModel.objects.for_display(), help_text='Choose the model of your sensor')
     sampled_medium = forms.ModelChoiceField(queryset=Medium.objects.filter(
         Q(pk='Air') |
         Q(pk='Soil') |
-        Q(pk='Liquid aqueous')
-    ))
+        Q(pk='Liquid aqueous') |
+        Q(pk='Equipment') |
+        Q(pk='Not applicable')
+    ), help_text='Choose the sampled medium')
 
     class Meta:
         model = Result
+        help_texts = {
+            'equipment_model': 'Choose the model of your sensor',
+            'variable': 'Choose the measured variable',
+            'unit': 'Choose the measured units',
+            'sampled_medium': 'Choose the sampled medium'
+        }
         fields = [
+            'result_id',
             'equipment_model',
             'variable',
             'unit',
@@ -116,4 +194,4 @@ class Meta:
         }
 
 
-ResultFormSet = formset_factory(ResultForm, extra=0, can_order=False, min_num=0)
+ResultFormSet = formset_factory(ResultForm, extra=0, can_order=False, min_num=1, can_delete=True)
diff --git a/src/dataloader/migrations/__init__.py b/src/dataloaderinterface/management/__init__.py
similarity index 100%
rename from src/dataloader/migrations/__init__.py
rename to src/dataloaderinterface/management/__init__.py
diff --git a/src/dataloaderinterface/migrations/__init__.py b/src/dataloaderinterface/management/commands/__init__.py
similarity index 100%
rename from src/dataloaderinterface/migrations/__init__.py
rename to src/dataloaderinterface/management/commands/__init__.py
diff --git a/src/dataloaderinterface/management/commands/add_equipment_medium.py b/src/dataloaderinterface/management/commands/add_equipment_medium.py
new file mode 100644
index 00000000..730d76a1
--- /dev/null
+++ b/src/dataloaderinterface/management/commands/add_equipment_medium.py
@@ -0,0 +1,30 @@
+from django.core.management.base import BaseCommand
+from django.db.models.aggregates import Count
+from django.db.models.query_utils import Q
+
+from dataloader.models import Result, Medium
+from dataloaderinterface.models import SiteSensor
+
+
+class Command(BaseCommand):
+    help = ''
+
+    def get_medium_data(self):
+        equipment_data = {
+            'term': 'equipment',
+            'name': 'Equipment',
+            'definition': 'An instrument, sensor or other piece of human-made equipment upon which a measurement is made,'
+                          ' such as datalogger temperature or battery voltage.',
+        }
+        return equipment_data
+
+    def handle(self, *args, **options):
+        equipment_medium_variables = ['EnviroDIY_Mayfly_Temp', 'EnviroDIY_Mayfly_Volt', 'EnviroDIY_Mayfly_FreeSRAM']
+        equipment_medium = Medium.objects.filter(pk='Equipment').first()
+        if not equipment_medium:
+            equipment_medium = Medium.objects.create(**self.get_medium_data())
+
+        results = Result.objects.prefetch_related('variable').filter(variable__variable_code__in=equipment_medium_variables)
+        sensors = SiteSensor.objects.filter(variable_code__in=equipment_medium_variables)
+        results.update(sampled_medium=equipment_medium)
+        sensors.update(sampled_medium=equipment_medium.name)
diff --git a/src/dataloaderinterface/management/commands/fix_data.py b/src/dataloaderinterface/management/commands/fix_data.py
new file mode 100644
index 00000000..0b473ed0
--- /dev/null
+++ b/src/dataloaderinterface/management/commands/fix_data.py
@@ -0,0 +1,148 @@
+
+from dataloader.models import DataLoggerProgramFile, DataLoggerFile, ActionBy, TimeSeriesResult, DataLoggerFileColumn, \
+    InstrumentOutputVariable, Result
+from django.core.management.base import BaseCommand
+
+from dataloaderinterface.models import DeviceRegistration
+
+
+class Command(BaseCommand):
+    help = 'Fix corrupted or incomplete odm2 data in the scope of this application.'
+
+    @staticmethod
+    def guess_equipment_model(result):
+        return InstrumentOutputVariable.objects.filter(variable=result.variable, instrument_raw_output_unit=result.unit).first()
+
+    @staticmethod
+    def check_sampling_feature(registration):
+        sampling_feature = registration.sampling_feature
+        if sampling_feature.feature_actions.count() == 0:
+            # site doesn't have any sensors. delete site and registration.
+
+            data_logger_program = DataLoggerProgramFile.filter(
+                affiliation=registration.user.affiliation,
+                program_name='%s' % sampling_feature.sampling_feature_code
+            ).all()
+
+            data_logger_file = DataLoggerFile.filter(
+                program=data_logger_program,
+                data_logger_file_name='%s' % sampling_feature.sampling_feature_code
+            ).all()
+
+            # TODO: columns.
+
+            print("* site doesn't have any sensors. deleting.")
+            sampling_feature.site and sampling_feature.site.delete()
+            print("- site instance deleted.")
+            sampling_feature.delete()
+            print("- sampling feature instance deleted.")
+            registration.delete()
+            print("- registration instance deleted.")
+
+    @staticmethod
+    def delete_entire_registration():
+        pass
+
+    def handle(self, *args, **options):
+        registrations = DeviceRegistration.objects.all()
+        print("%s site registrations found." % registrations.count())
+        print("----------------------------------------------------")
+
+        for registration in registrations:
+            if not registration.user and registration.user.affiliation and registration.sampling_feature:
+                # doesn't have an affiliation or sampling feature. no way of fixing this.
+                print("* unrepairable registration found. deleting." % registration)
+                registration.delete()
+                continue
+
+            affiliation = registration.user.affiliation
+            sampling_feature = registration.sampling_feature
+            print("---- retrieving registration for site %s, deployment by %s." % (sampling_feature, affiliation))
+
+            if sampling_feature.feature_actions.count() == 0:
+                # site doesn't have any sensors. delete site and registration.
+                print("* site doesn't have any sensors. deleting.")
+                sampling_feature.site and sampling_feature.site.delete()
+                print("- site instance deleted.")
+                sampling_feature.delete()
+                print("- sampling feature instance deleted.")
+                registration.delete()
+                print("- registration instance deleted.")
+                continue
+
+            data_logger_program, created = DataLoggerProgramFile.objects.get_or_create(
+                affiliation=affiliation,
+                program_name='%s' % sampling_feature.sampling_feature_code
+            )
+            print("- data logger program found for this site." if not created else "* no data logger program found for this site. creating.")
+
+            data_logger_file, created = DataLoggerFile.objects.get_or_create(
+                program=data_logger_program,
+                data_logger_file_name='%s' % sampling_feature.sampling_feature_code
+            )
+            print("- data logger file found for this site." if not created else "* no data logger file found for this site. creating.")
+
+            print("-- loading feature actions")
+            for feature_action in sampling_feature.feature_actions.all():
+                result = feature_action.results.first()
+                action = feature_action.action
+
+                if not result:
+                    print("* feature action has no associated result. deleting.")
+                    feature_action.delete()
+                    print("- feature action instance deleted.")
+                    action.action_by and action.action_by.all().delete()
+                    print("- action by instance deleted.")
+                    action.delete()
+                    print("- action instance deleted.")
+                    continue
+
+                print("- retrieving result %s." % result)
+                action = feature_action.action
+                action_by, created = ActionBy.objects.get_or_create(action=action, affiliation=affiliation, is_action_lead=True)
+                print("- action by instance found." if not created else "* action by instance not found. creating.")
+
+                time_series_result, created = TimeSeriesResult.objects.get_or_create(
+                    result=result,
+                    aggregation_statistic_id='Average',
+                )
+                print("- time series result instance found." if not created else "* no time series result instance found for this site. creating.")
+
+                column = result.data_logger_file_columns.first()
+                column_label = '%s(%s)' % (result.variable.variable_code, result.unit.unit_abbreviation)
+                if not column:
+                    print("* no data logger file column associated with this result. creating.")
+                    DataLoggerFileColumn.objects.create(
+                        result=result,
+                        data_logger_file=data_logger_file,
+                        instrument_output_variable=self.guess_equipment_model(result),
+                        column_label=column_label
+                    )
+                else:
+                    if column.data_logger_file != data_logger_file:
+                        print("* data logger column doesn't belong to retrieved data logger file. matching up.")
+                        column.data_logger_file = data_logger_file
+                        column.save()
+                    if column.column_label != column_label:
+                        column.column_label = column_label
+                        column.save()
+
+                    # data_logger_file_column = result.data_logger_file_columns.first()
+                    # data_logger_file_column.instrument_output_variable = instrument_output_variable
+                    # data_logger_file_column.column_label = '%s(%s)' % (
+                    # result.variable.variable_code, result.unit.unit_abbreviation)
+
+            if sampling_feature.feature_actions.count() == 0:
+                # TODO: delete sampling feature.
+                pass
+
+        # Remove rogue Time Series Results.
+        site_registrations = [str(uuid['deployment_sampling_feature_uuid']) for uuid in DeviceRegistration.objects.all().values('deployment_sampling_feature_uuid')]
+        rogue_results = Result.objects.exclude(feature_action__sampling_feature__sampling_feature_uuid__in=(site_registrations))
+        for rogue_result in rogue_results:
+            rogue_result.timeseriesresult and rogue_result.timeseriesresult.values.all().delete()
+            rogue_result.timeseriesresult and rogue_result.timeseriesresult.delete()
+            rogue_result.delete()
+
+
+        print("check complete!")
diff --git a/src/dataloaderinterface/management/commands/generate_csv_data.py b/src/dataloaderinterface/management/commands/generate_csv_data.py
new file mode 100644
index 00000000..23e5949a
--- /dev/null
+++ b/src/dataloaderinterface/management/commands/generate_csv_data.py
@@ -0,0 +1,32 @@
+from django.core.management.base import BaseCommand
+
+from dataloader.models import Result, TimeSeriesResult
+from dataloaderinterface.csv_serializer import SiteResultSerializer
+
+
+class Command(BaseCommand):
+    help = ''
+
+    def handle(self, *args, **options):
+        results = TimeSeriesResult.objects.prefetch_related(
+            'result__variable',
+            'result__unit',
+            'result__processing_level',
+            'result__data_logger_file_columns__instrument_output_variable__model',
+            'result__feature_action__sampling_feature__site',
+            'result__feature_action__action__method',
+            'result__feature_action__action__action_by__affiliation__person',
+            'result__feature_action__action__action_by__affiliation__organization'
+        ).all()
+        # falta como una musica de elevador. wtf.
+        for time_series_result in results:
+            print('result %s:' % time_series_result.result_id)
+            serializer = SiteResultSerializer(result=time_series_result.result)
+            serializer.build_csv()
+            print('-file with metadata created')
+            if time_series_result.result.value_count > 0:
+                values = time_series_result.values.all()
+                serializer.add_data_values(values)
+                print('-data values written to file')
+
+            print('--csv generated.')
diff --git a/src/dataloaderinterface/management/commands/migrate_site_registrations.py b/src/dataloaderinterface/management/commands/migrate_site_registrations.py
new file mode 100644
index 00000000..28e7e3c7
--- /dev/null
+++ b/src/dataloaderinterface/management/commands/migrate_site_registrations.py
@@ -0,0 +1,84 @@
+from django.core.management.base import BaseCommand
+
+from dataloader.models import SamplingFeature
+from dataloaderinterface.models import DeviceRegistration, SiteRegistration, SiteSensor
+
+
+class Command(BaseCommand):
+    help = 'Fix corrupted or incomplete odm2 data in the scope of this application.'
+
+    @staticmethod
+    def create_site_registration(device_registration):
+        existing_site_registration = SiteRegistration.objects.filter(registration_token=device_registration.authentication_token).first()
+        if existing_site_registration:
+            return existing_site_registration
+
+        affiliation = device_registration.user.affiliation
+        sampling_feature = device_registration.sampling_feature
+
+        registration_data = {
+            'registration_token': device_registration.authentication_token,
+            'registration_date': device_registration.registration_date(),
+            'django_user': device_registration.user.user,
+            'affiliation_id': device_registration.user.affiliation_id,
+            'person': str(affiliation.person),
+            'organization': str(affiliation.organization) or '',
+            'sampling_feature_id': sampling_feature.sampling_feature_id,
+            'sampling_feature_code': sampling_feature.sampling_feature_code,
+            'sampling_feature_name': sampling_feature.sampling_feature_name,
+            'elevation_m': sampling_feature.elevation_m,
+            'latitude': sampling_feature.site.latitude,
+            'longitude': sampling_feature.site.longitude,
+            'site_type': sampling_feature.site.site_type_id
+        }
+
+        site_registration = SiteRegistration(**registration_data)
+        site_registration.save()
+        return site_registration
+
+    @staticmethod
+    def create_site_sensor(result, site_registration):
+        existing_site_sensor = SiteSensor.objects.filter(result_id=result.result_id).first()
+        if existing_site_sensor:
+            return existing_site_sensor
+
+        model = result.data_logger_file_columns.first().instrument_output_variable.model
+        values_manager = result.timeseriesresult.values
+        last_value = values_manager.latest('value_datetime') if values_manager.count() > 0 else None
+
+        sensor_data = {
+            'result_id': result.result_id,
+            'result_uuid': result.result_uuid,
+            'registration': site_registration,
+            'model_name': model.model_name,
+            'model_manufacturer':  model.model_manufacturer.organization_name,
+            'variable_name': result.variable.variable_name_id,
+            'variable_code': result.variable.variable_code,
+            'unit_name': result.unit.unit_name,
+            'unit_abbreviation': result.unit.unit_abbreviation,
+            'sampled_medium': result.sampled_medium_id,
+            'activation_date': result.valid_datetime,
+            'activation_date_utc_offset': result.valid_datetime_utc_offset,
+            'last_measurement_id': last_value and last_value.value_id
+        }
+
+        site_sensor = SiteSensor(**sensor_data)
+        site_sensor.save()
+        return site_sensor
+
+    def handle(self, *args, **options):
+        sampling_features = SamplingFeature.objects.all()
+        print("%s sites found." % sampling_features.count())
+        print("----------------------------------------------------")
+
+        for sampling_feature in sampling_features:
+            device_registration = DeviceRegistration.objects.filter(deployment_sampling_feature_uuid=sampling_feature.sampling_feature_uuid).first()
+            if not device_registration:
+                print('**** Sampling Feature %s (%s) exists without a site registration!!!' % (sampling_feature.sampling_feature_id, sampling_feature.sampling_feature_code))
+                continue
+
+            site_registration = self.create_site_registration(device_registration)
+            for feature_action in sampling_feature.feature_actions.all():
+                result = feature_action.results.first()
+                self.create_site_sensor(result, site_registration)
+            print('- site %s migrated!' % sampling_feature.sampling_feature_code)
diff --git a/src/dataloaderinterface/management/commands/patch_results_datetime.py b/src/dataloaderinterface/management/commands/patch_results_datetime.py
new file mode 100644
index 00000000..b1b9c5a9
--- /dev/null
+++ b/src/dataloaderinterface/management/commands/patch_results_datetime.py
@@ -0,0 +1,26 @@
+from django.core.management.base import BaseCommand
+from django.db.models.aggregates import Count
+
+from dataloader.models import Result
+
+
+class Command(BaseCommand):
+    help = ''
+
+    @staticmethod
+    def fix_results_value_count():
+        results = Result.objects.annotate(number_of_values=Count('timeseriesresult__values'))
+        for result in results:
+            result.value_count = result.number_of_values
+            result.save()
+
+
+    def handle(self, *args, **options):
+        self.fix_results_value_count()
+        results = Result.objects.prefetch_related('timeseriesresult__values').filter(value_count__gt=0)
+        for result in results:
+            first_value = result.timeseriesresult.values.order_by('value_datetime').first()
+            result.valid_datetime = first_value.value_datetime
+            result.valid_datetime_utc_offset = first_value.value_datetime_utc_offset
+            result.save()
+            print('result %s: set first valid datetime to %s' % (result.pk, result.valid_datetime))
diff --git a/src/dataloaderinterface/management/commands/regenerate_datalogger_metadata.py b/src/dataloaderinterface/management/commands/regenerate_datalogger_metadata.py
new file mode 100644
index 00000000..1e29a687
--- /dev/null
+++ b/src/dataloaderinterface/management/commands/regenerate_datalogger_metadata.py
@@ -0,0 +1,53 @@
+from django.core.management.base import BaseCommand
+
+from dataloader.models import DataLoggerFileColumn, DataLoggerProgramFile, DataLoggerFile, InstrumentOutputVariable, \
+    EquipmentModel
+from dataloaderinterface.models import SiteRegistration, SiteSensor
+
+
+class Command(BaseCommand):
+    help = ''
+
+    @staticmethod
+    def delete_datalogger_data():
+        print('%s program files found vs %s registrations' % (DataLoggerProgramFile.objects.count(), SiteRegistration.objects.count()))
+        print('%s datalogger files found' % DataLoggerFile.objects.count())
+        print('%s datalogger file columns found vs %s sensors registered' % (DataLoggerFileColumn.objects.count(), SiteSensor.objects.count()))
+        DataLoggerProgramFile.objects.all().delete()
+        DataLoggerFileColumn.objects.all().delete()
+        DataLoggerFile.objects.all().delete()
+
+    def handle(self, *args, **options):
+        self.delete_datalogger_data()
+
+        registrations = SiteRegistration.objects.prefetch_related('sensors').all()
+        for registration in registrations:
+            data_logger_program = DataLoggerProgramFile.objects.create(
+                affiliation_id=registration.affiliation_id,
+                program_name='%s' % registration.sampling_feature_code
+            )
+
+            data_logger_file = DataLoggerFile.objects.create(
+                program=data_logger_program,
+                data_logger_file_name='%s' % registration.sampling_feature_code
+            )
+
+            print('--- Program and file created for site %s' % registration.sampling_feature_code)
+
+            sensors = registration.sensors.all()
+            for sensor in sensors:
+                instrument_output_variable = InstrumentOutputVariable.objects.filter(
+                    model__model_name=sensor.model_name,
+                    variable__variable_code=sensor.variable_code,
+                    instrument_raw_output_unit__unit_name=sensor.unit_name,
+                ).first()
+                if not instrument_output_variable:
+                    print('***** instrument output variable not found for result %s' % sensor.result_id)
+
+                DataLoggerFileColumn.objects.create(
+                    result=sensor.result,
+                    data_logger_file=data_logger_file,
+                    instrument_output_variable=instrument_output_variable,
+                    column_label='%s(%s)' % (sensor.variable_code, sensor.unit_abbreviation)
+                )
+                print('---- Datalogger file column created for %s' % sensor.sensor_identity)
diff --git a/src/dataloaderinterface/metadata_template.txt b/src/dataloaderinterface/metadata_template.txt
new file mode 100644
index 00000000..bd6457c3
--- /dev/null
+++ b/src/dataloaderinterface/metadata_template.txt
@@ -0,0 +1,52 @@
+# ----------------------------------------------------------------------------------
+# WARNING: These data are provisional and subject to revision. The data are provided
+# as is with no warranty and on the condition that neither the data collector nor
+# any of the participants in or developers of http://data.envirodiy.org may be held
+# liable for any damages resulting from thier use.
+#
+# The following metadata describe the data in this file:
+# ----------------------------------------------------------------------------------
+#
+# Site Information
+# ---------------------------
+# SiteCode: {sampling_feature.sampling_feature_code}
+# SiteName: {sampling_feature.sampling_feature_name}
+# SiteDescription: {sampling_feature.sampling_feature_description}
+# Latitude: {sampling_feature.site.latitude}
+# Longitude: {sampling_feature.site.longitude}
+# Elevation: {sampling_feature.elevation_m}
+# VerticalDatum: {sampling_feature.elevation_datum_id}
+# SiteType: {sampling_feature.site.site_type_id}
+#
+# Variable and Unit Information
+# -----------------------------
+# VariableCode: {variable.variable_code}
+# VariableName: {variable.variable_name_id}
+# VariableType: {variable.variable_type_id}
+# VariableDefinition: {variable.variable_definition}
+# NoDataValue: {variable.no_data_value}
+# VariableUnitsName: {unit.unit_name}
+# VariableUnitsType: {unit.unit_type_id}
+# VariableUnitsAbbreviation: {unit.unit_abbreviation}
+#
+# Result Information
+# -----------------------------
+# ResultType: {result.result_type}
+# ProcessingLevelCode: {result.processing_level.processing_level_code}
+# ProcessingLevelDefinition: {result.processing_level.definition}
+# ProcessingLevelExplanation: {result.processing_level.explanation}
+# ResultStatus: {result.status}
+# SampledMedium: {result.sampled_medium_id}
+# ValueCount: {result.value_count}
+#
+# Instrument Deployment Information
+# ---------------------------------
+# SensorModel: {model}
+# MethodTypeCV: {action.method.method_type_id}
+# MethodCode: {action.method.method_code}
+# MethodName: {action.method.method_name}
+# MethodDescription: {action.method.method_description}
+# ResponsiblePerson: {affiliation.person}
+# Email: {affiliation.primary_email}
+# Affiliation: {affiliation.organization}
+#
diff --git a/src/dataloaderinterface/models.py b/src/dataloaderinterface/models.py
index 3304f09f..197757a1 100644
--- a/src/dataloaderinterface/models.py
+++ b/src/dataloaderinterface/models.py
@@ -1,11 +1,130 @@
 from __future__ import unicode_literals
 
+# Create your models here.
+import uuid
+
+from django.db.models.aggregates import Min
+
+from dataloader.models import SamplingFeature, Affiliation, Result, TimeSeriesResultValue, EquipmentModel, Variable, \
+    Unit, Medium
 from django.contrib.auth.models import User
 from django.db import models
 
 
-# Create your models here.
-from dataloader.models import SamplingFeature, Affiliation
+class SiteRegistration(models.Model):
+    registration_id = models.AutoField(primary_key=True, db_column='RegistrationID')
+    registration_token = models.CharField(max_length=64, editable=False, db_column='RegistrationToken', unique=True)
+
+    registration_date = models.DateTimeField(db_column='RegistrationDate')
+    deployment_date = models.DateTimeField(db_column='DeploymentDate', blank=True, null=True)
+
+    django_user = models.ForeignKey(User, on_delete=models.CASCADE, db_column='User', related_name='registrations')
+    affiliation_id = models.IntegerField(db_column='AffiliationID')
+    person = models.CharField(max_length=765, db_column='Person')
+    organization = models.CharField(max_length=255, db_column='Organization', blank=True, null=True)
+
+    sampling_feature_id = models.IntegerField(db_column='SamplingFeatureID')
+    sampling_feature_code = models.CharField(max_length=50, unique=True, db_column='SamplingFeatureCode')
+    sampling_feature_name = models.CharField(max_length=255, blank=True, db_column='SamplingFeatureName')
+    elevation_m = models.FloatField(blank=True, null=True, db_column='Elevation')
+
+    latitude = models.FloatField(db_column='Latitude')
+    longitude = models.FloatField(db_column='Longitude')
+    site_type = models.CharField(max_length=765, db_column='SiteType')
+
+    followed_by = models.ManyToManyField(User, related_name='followed_sites')
+
+    @property
+    def sampling_feature(self):
+        return SamplingFeature.objects.get(pk=self.sampling_feature_id)
+
+    @property
+    def odm2_affiliation(self):
+        return Affiliation.objects.get(pk=self.affiliation_id)
+
+    @property
+    def deployment_date(self):
+        min_datetime = self.sensors.aggregate(first_light=Min('activation_date'))
+        return min_datetime['first_light']
+
+    @property
+    def last_measurements(self):
+        if not self.deployment_date:
+            return []
+
+        measurement_ids = [long(measurement.last_measurement_id) for measurement in self.sensors.all() if measurement.last_measurement_id]
+        measurements = TimeSeriesResultValue.objects.filter(pk__in=measurement_ids)
+        return measurements
+
+    @property
+    def latest_measurement(self):
+        if not self.deployment_date:
+            return None
+        return self.last_measurements.latest('value_datetime')
+
+    def __str__(self):
+        return '%s by %s from %s on %s' % (self.sampling_feature_code, self.person, self.organization, self.registration_date)
+
+    def __repr__(self):
+        return "<SiteRegistration('%s', '%s', '%s', '%s')>" % (
+            self.registration_id, self.registration_date, self.sampling_feature_code, self.person
+        )
+
+
+class SiteSensor(models.Model):
+    registration = models.ForeignKey('SiteRegistration', db_column='RegistrationID', related_name='sensors')
+    result_id = models.IntegerField(db_column='ResultID', unique=True)
+    result_uuid = models.UUIDField(default=uuid.uuid4, editable=False, db_column='ResultUUID', unique=True)
+    model_name = models.CharField(db_column='ModelName', max_length=255)
+    model_manufacturer = models.CharField(db_column='ModelManufacturer', max_length=255)
+    variable_name = models.CharField(max_length=255, db_column='VariableName')
+    variable_code = models.CharField(max_length=50, db_column='VariableCode')
+    unit_name = models.CharField(max_length=255, db_column='UnitsName')
+    unit_abbreviation = models.CharField(max_length=255, db_column='UnitAbbreviation')
+    sampled_medium = models.CharField(db_column='SampledMedium', max_length=255)
+    last_measurement_id = models.IntegerField(db_column='LastMeasurementID', unique=True, blank=True, null=True)
+    activation_date = models.DateTimeField(db_column='ActivationDate', blank=True, null=True)
+    activation_date_utc_offset = models.IntegerField(db_column='ActivationDateUtcOffset', blank=True, null=True)
+
+    @property
+    def equipment_model(self):
+        return EquipmentModel.objects.filter(model_name=self.model_name).first()
+
+    @property
+    def variable(self):
+        return Variable.objects.filter(variable_code=self.variable_code).first()
+
+    @property
+    def unit(self):
+        return Unit.objects.filter(unit_name=self.unit_name).first()
+
+    @property
+    def medium(self):
+        return Medium.objects.filter(name=self.sampled_medium).first()
+
+    @property
+    def make_model(self):
+        return "{0}_{1}".format(self.model_manufacturer, self.model_name)
+
+    @property
+    def sensor_identity(self):
+        return "{0}_{1}_{2}".format(self.registration.sampling_feature_code, self.variable_code, self.result_id)
+
+    @property
+    def last_measurement(self):
+        return TimeSeriesResultValue.objects.filter(pk=self.last_measurement_id).first()
+
+    @property
+    def result(self):
+        return Result.objects.get(pk=self.result_id)
+
+    def __str__(self):
+        return '%s %s' % (self.variable_name, self.unit_abbreviation)
+
+    def __repr__(self):
+        return "<SiteSensor('%s', [%s], '%s', '%s')>" % (
+            self.id, self.registration, self.variable_code, self.unit_abbreviation,
+        )
 
 
 class DeviceRegistration(models.Model):
@@ -13,17 +132,22 @@ class DeviceRegistration(models.Model):
     deployment_sampling_feature_uuid = models.UUIDField(db_column='SamplingFeatureUUID')
     authentication_token = models.CharField(max_length=64, editable=False, db_column='AuthenticationToken')
     user = models.ForeignKey('ODM2User', db_column='User')
+    # deployment_date = models.DateTimeField(db_column='DeploymentDate')
+
+    def registration_date(self):
+        action = self.sampling_feature.actions.first()
+        return action and action.begin_datetime
+
+    @property
+    def deployment_date(self):
+        sampling_feature = self.sampling_feature
+        min_datetime = sampling_feature.feature_actions.aggregate(first_light=Min('results__valid_datetime'))
+        return min_datetime['first_light']
 
     @property
     def sampling_feature(self):
         return SamplingFeature.objects.get(sampling_feature_uuid__exact=self.deployment_sampling_feature_uuid)
 
-    def registration_date(self):
-        return self.sampling_feature.actions.first().begin_datetime.strftime('%Y/%m/%d')
-
-    def device_name(self):
-        return self.sampling_feature.sampling_feature_code
-
     def __str__(self):
         action = self.sampling_feature.actions.first()
         return '{}\t{}: {}'.format(self.sampling_feature.sampling_feature_code, action.action_type_id, action.begin_datetime.strftime('%Y/%m/%d'))
@@ -36,3 +160,6 @@ class ODM2User(models.Model):
     @property
     def affiliation(self):
         return Affiliation.objects.get(pk=self.affiliation_id)
+
+    def can_administer_site(self, registration):
+        return self.user.is_staff or registration.user == self
diff --git a/src/dataloaderinterface/static/dataloaderinterface/css/browse-sites.css b/src/dataloaderinterface/static/dataloaderinterface/css/browse-sites.css
index 2e04c87c..200c0a8f 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/css/browse-sites.css
+++ b/src/dataloaderinterface/static/dataloaderinterface/css/browse-sites.css
@@ -20,22 +20,6 @@ span.map-tip {
     padding: 7px 15px;
 }
 
-div#marker-content {
-    padding: 5px;
-}
-
-.site-field, .site-link {
-    padding: 3px;
-}
-
-span.site-label {
-    font-weight: bold;
-}
-
-span.site-label::after {
-    content: ': ';
-}
-
 .browse-sites-header {
     display: inline-block;
     position: absolute;
@@ -49,4 +33,5 @@ span.site-label::after {
 
 .browse-sites-header .page-title {
     margin: 0;
+    font-size: 14px;
 }
diff --git a/src/dataloaderinterface/static/dataloaderinterface/css/my-sites.css b/src/dataloaderinterface/static/dataloaderinterface/css/my-sites.css
index 74ab738c..e69de29b 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/css/my-sites.css
+++ b/src/dataloaderinterface/static/dataloaderinterface/css/my-sites.css
@@ -1,15 +0,0 @@
-div#marker-content {
-    padding: 5px;
-}
-
-.site-field, .site-link {
-    padding: 3px;
-}
-
-span.site-label {
-    font-weight: bold;
-}
-
-span.site-label::after {
-    content: ': ';
-}
\ No newline at end of file
diff --git a/src/dataloaderinterface/static/dataloaderinterface/css/style.css b/src/dataloaderinterface/static/dataloaderinterface/css/style.css
index 6c1fc9f8..9f24f119 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/css/style.css
+++ b/src/dataloaderinterface/static/dataloaderinterface/css/style.css
@@ -35,7 +35,8 @@ button.navbar-toggle {
 
 @media (max-width: 890px) {
     .navbar-header {
-        float: none; !important;
+        float: none;
+    !important;
     }
 
     .navbar-left, .navbar-right {
@@ -53,7 +54,8 @@ button.navbar-toggle {
 
     .navbar-fixed-top {
         top: 0;
-        border-width: 0 0 1px; !important;
+        border-width: 0 0 1px;
+    !important;
     }
 
     .navbar-collapse.collapse {
@@ -66,12 +68,14 @@ button.navbar-toggle {
     }
 
     .navbar-nav > li {
-        float: none; !important;
+        float: none;
+    !important;
     }
 
     .navbar-nav > li > a {
         padding-top: 10px;
-        padding-bottom: 10px; !important;
+        padding-bottom: 10px;
+    !important;
     }
 
     .collapse.in {
@@ -111,7 +115,6 @@ button.navbar-toggle {
 
 div.map-info {
     margin: 5px;
-    top: 5px !important;
     left: 0 !important;
     box-shadow: rgba(0, 0, 0, 0.298039) 0 1px 4px -1px;
     background-color: rgba(255, 255, 255, .95);
@@ -120,7 +123,6 @@ div.map-info {
     padding: 7px 15px;
 }
 
-
 .control-row {
     clear: both;
 }
@@ -190,8 +192,9 @@ div.separator {
 .modal-header {
     padding: 15px;
     border-bottom: 1px solid #e5e5e5;
-    background-color: #353535;
-    color: #FFF;
+    background-color: #f6f7f9;
+    color: #000;
+    border-radius: 4px;
 }
 
 .select2-results__option[aria-disabled="true"] {
@@ -213,43 +216,51 @@ div.form-field {
 }
 
 /*#results-template {*/
-    /*display: none;*/
-    /*visibility: hidden;*/
+/*display: none;*/
+/*visibility: hidden;*/
 /*}*/
 
 /*span.remove-result {*/
-    /*font-size: 1.3em;*/
-    /*cursor: pointer;*/
-    /*position: absolute;*/
-    /*top: 14px;*/
-    /*right: 30px;*/
+/*font-size: 1.3em;*/
+/*cursor: pointer;*/
+/*position: absolute;*/
+/*top: 14px;*/
+/*right: 30px;*/
 /*}*/
 
 .inline {
     display: inline-block;
 }
 
+td[data-behaviour="delete"] input {
+    display: none;
+}
+
+tr.deleted-row {
+    display: none;
+}
+
 #new-result-button {
     vertical-align: baseline;
     margin-left: 10px;
     padding: 4px 10px;
 }
 
-span.copy-icon {
-    font-size: 1.3em;
-    cursor: pointer;
-    vertical-align: text-bottom;
+div.registration-data {
+    margin-top: 2px;
+    margin-bottom: 20px;
+    overflow: auto;
 }
 
-span.copy-key-icon {
+div.registration-data i, div.registration-data .material-icons {
+    width: 10px;
     margin-right: 10px;
-    font-size: 1.4em;
-    cursor: pointer;
 }
 
-div.registration-data {
-    margin-bottom: 20px;
-    overflow: auto;
+div.registration-data .material-icons {
+    font-size: 15px;
+    margin-left: -2px;
+    margin-right: 12px;
 }
 
 div.registration-field {
@@ -261,34 +272,84 @@ div.registration-field span.control-label {
     font-weight: 700;
 }
 
-div.registration-field span.control-field {
-
-}
-
 .plot_box {
     float: left;
     width: 100%;
-    margin-bottom: 15px;
+    margin-bottom: 30px;
     border-radius: 2px;
-    border: 1px solid #DDD;
-    min-height: 174px;
+    min-height: 180px;
+}
+
+svg.stale {
+    background-color: #ffefef;
+}
+
+svg.not-stale {
+    background-color: #f8fff7;
+}
+
+.last-observation {
+    font-weight: bold;
 }
 
 .plot_box .mdl-card__actions {
     border-top: 0;
+    background: #f6f6f6;
+}
+
+.white-shadow {
+    text-shadow: 0 1px 0 #fff;
+}
+
+.help-icon {
+    font-size: 18px;
+    line-height: 0;
+    vertical-align: sub;
+    cursor: default;
+}
+
+.buttons-toolbar .button-link {
+    margin-bottom: 20px;
+    width: 100%;
+}
+
+.buttons-toolbar .button-link:hover {
+    text-decoration: none;
 }
 
 .table-trigger {
     cursor: pointer;
 }
 
+.table-trigger.disabled, .download-trigger.disabled, .tsa-trigger.disabled {
+    pointer-events: none;
+    color: #c5c5c5;
+}
+
+.measurements-table {
+    max-height: 350px;
+    overflow: auto;
+}
+
+.measurements-table .mdl-data-table tbody tr:hover {
+    background-color: initial;
+}
+
 .variable-description {
     width: 120px;
-    padding: 20px;
 }
 
 .variable-name {
-    padding: 8px 20px;
+    font-size: 0.8em;
+}
+
+.variable-info {
+    font-size: 0.8em;
+}
+
+.variable-info td {
+    padding-right: 10px;
+    padding-bottom: 3px;
 }
 
 .variable-data {
@@ -303,21 +364,21 @@ div.registration-field span.control-field {
     margin-bottom: 3px;
 }
 
-.variable-code {
-    font-size: 0.8em;
-    margin-bottom: 3px;
-}
-
 .latest-value {
     font-weight: bold;
     font-size: 1.5em;
-    margin-top: 5px;
+    margin: 5px 0;
+}
+
+.unit {
+    font-size: 0.8em;
 }
 
 .graph-container {
     border: 1px solid #DDD;
     height: 80px;
     margin: 10px;
+    margin-bottom: 5px;
 }
 
 .plot_box div p {
@@ -349,8 +410,7 @@ div.registration-field span.control-field {
 }
 
 .line {
-    fill: rgb(232, 237, 240);
-    stroke: steelblue;
+    fill: none;
     stroke-width: 2px;
 }
 
@@ -388,6 +448,11 @@ span.form-message.error {
     margin-top: 5px;
 }
 
+.sampling-feature-fields .help-icon {
+    float: right;
+    margin-top: 10px;
+}
+
 div.form-group.sampling-feature-fields {
     display: -webkit-box;
     display: -moz-box;
@@ -418,22 +483,13 @@ div.form-field[data-field="elevation_m"], div.form-field[data-field="elevation_d
     order: 2;
 }
 
-div.form-field[data-field="affiliation"] .select2-selection {
-    border: none;
-    border-radius: 0;
-    box-shadow: none;
-    font-size: 2em;
-}
-
-div.form-field[data-field="affiliation"] .select2-selection__arrow b {
-    border-width: 8px 6px;
-    margin-left: -14px !important;
-    margin-top: 9px;
+.select2-selection__rendered {
+    font-family: Roboto, Helvetica, Arial, sans-serif;
 }
 
-div.form-field[data-field="affiliation"] .select2-container--bootstrap.select2-container--open .select2-selection__arrow b {
-    border-width: 8px 6px;
-    margin-top: 1px;
+span.select2-selection__clear {
+    font-size: 1.4em;
+    line-height: 1.1em;
 }
 
 span.name-dropdown {
@@ -454,7 +510,6 @@ ul.errorlist {
     color: rgb(232, 0, 0);
 }
 
-
 .organization-fields, .organization-fields .form-field {
     padding-left: 15px;
 }
@@ -502,18 +557,6 @@ ul.errorlist {
     min-height: 80px;
 }
 
-/*DATATABLES STYLING*/
-table.data-values, table.dataTable {
-    display: table;  !important
-}
-
-table.dataTable {
-    margin-bottom: 0;
-}
-
-table.dataTable.table-bordered > thead > tr > th {
-    border-bottom-width: 1px;
-}
 /*FOOTER STYLING*/
 footer {
     background-color: #353535;
@@ -558,21 +601,111 @@ footer .separator {
 
 /*GENERAL STYLING*/
 
-.btn-copy {
-    background-color: #FFF !important;
-    cursor: default;
+#btn-follow {
+    top: -3px;
+    left: 15px;
+    position: absolute;
+}
+
+#icon-follow, #icon-unfollow {
+    position: absolute;
+    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+    -wekbit-transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+    display: block;
+}
+
+.follow-status {
+    margin-bottom: 20px;
+}
+
+.follow-status.following #btn-follow {
+    background-color: orange;
 }
 
-.plot_box .input-group-copy {
-    width: calc(100% - 50px);
+.follow-status:not(.following) #icon-unfollow {
+    opacity: 0;
+    visibility: hidden;
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+    top: 8px;
+    left: 8px;
 }
-.input-group-copy .material-icons {
+
+.follow-status.following #icon-follow {
+    opacity: 0;
+    visibility: hidden;
+    top: 8px;
+    left: 8px;
+    -webkit-transform: rotate(225deg);
+    transform: rotate(225deg);
+}
+
+.chip-follow .fa-check-circle-o {
+    font-size: 18px;
+    vertical-align: middle;
+    display: inline-block;
+    margin-bottom: 2px;
+}
+
+.chip-follow {
+    padding: 0;
+    margin-left: 10px;
+    transition: width 0.4s;
+    -wekbit-transition: width 0.4s;
+    overflow: hidden;
+}
+
+.follow-status.following #follow-chip {
+    width: 225px;
+}
+
+.text-green {
+    color: #00bf00;
+}
+
+.follow-status:not(.following) #follow-chip {
+    width: 0;
+}
+
+.chip-follow .mdl-chip__text {
+    padding-left: 35px;
+}
+
+.my-sites-action {
+    margin-top: 32px;
+    text-align: left;
+}
+
+.my-sites-action:hover {
+    text-decoration: none;
+}
+
+.center-icon {
+    display: inline-block;
+    vertical-align: middle;
+    margin-bottom: 2px;
+}
+
+#btn-delete-site {
+    background-color: #d9534f;
+    border-color: #d43f3a;
+}
+
+.result-uuid {
+    border-bottom: 0 !important;
+}
+
+.site-tokens .material-icons {
     font-size: 14px;
 }
 
-.plot_box .table-trigger {
+.site-tokens {
+    margin-bottom: 20px;
+}
+
+.plot_box .fa {
     margin-left: 13px;
-    margin-top: 2px;
+    margin-top: 10px;
 }
 
 dialog#data-table-dialog {
@@ -583,25 +716,15 @@ dialog#data-table-dialog .mdl-dialog__content {
     color: #555;
 }
 
-.input-group-copy .input-group-addon {
-    background-color: #FFF !important;
-}
-
 .site-tokens .input-group-copy .input-group-addon:first-child {
     width: 186px;
     text-align: left;
 }
 
-.btn-copy:hover {
-    background-color: #eeeeee  !important;
-}
-
-.btn-copy:active {
-    background-color: #DDD  !important;
-}
 .full-width {
     width: 100%;
 }
+
 .mdl-data-table td:last-of-type {
     white-space: normal;
 }
@@ -643,13 +766,17 @@ dialog#data-table-dialog .mdl-dialog__content {
 }
 
 .ribbon-blue {
-    background-color: #337ab7
+    background-color: #337ab7;
 }
 
 .ribbon-green {
     background-color: #62843e;
 }
 
+.ribbon-dark {
+    background-color: #494949;
+}
+
 .ribbon-content {
     margin-top: -35vh;
     -webkit-flex-shrink: 0;
@@ -669,7 +796,7 @@ dialog#data-table-dialog .mdl-dialog__content {
 }
 
 .shadow {
-    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
+    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12), 0 2px 4px -1px rgba(0, 0, 0, .2);
 }
 
 .text-shadow {
@@ -677,7 +804,7 @@ dialog#data-table-dialog .mdl-dialog__content {
 }
 
 .btn.sharp {
-  border-radius:0;
+    border-radius: 0;
 }
 
 .card {
@@ -686,6 +813,10 @@ dialog#data-table-dialog .mdl-dialog__content {
     margin-bottom: 50px;
 }
 
+#how-it-works .card {
+    height: 300px;
+}
+
 .card h4 {
     font-size: 18px;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
@@ -704,9 +835,16 @@ dialog#data-table-dialog .mdl-dialog__content {
 
 .site-card .mdl-card__supporting-text {
     color: #252525;
+    width: 100%;
+}
+
+.site-card .mdl-card__title-text a {
+    color: #FFF;
+    font-weight: 300;
 }
 
 .site-card .mdl-card__title {
+    padding-right: 60px;
     background-color: #92d050;
     color: #FFF;
 }
@@ -718,26 +856,48 @@ dialog#data-table-dialog .mdl-dialog__content {
 .site-card {
     margin-top: 20px;
     width: auto;
+    height: 100%;
+}
+
+.flex {
+    display: flex;
+}
+
+.mdl-dialog__title {
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    font-size: 1.5rem;
+}
+
+.site {
+    flex-shrink: 0;
 }
 
 i.material-icons.site-card-icon {
     margin-right: 8px;
     color: #92d050;
+    max-width: 24px;
 }
 
 .page-title, .section-title {
     margin: 40px auto;
     text-transform: uppercase;
     color: rgba(0, 0, 0, 0.541176);
-    font-size: 16px;
+    font-size: 18px;
     font-weight: 500;
     font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
 }
 
+.section-subtitle {
+    margin-top: -30px;
+    margin-bottom: 30px;
+}
 
 #new-result-button {
-    margin-left: 20px;
+    margin-left: 10px;
     margin-bottom: -10px;
+    vertical-align: sub;
 }
 
 /*LOGIN STYLING*/
@@ -772,10 +932,124 @@ a.orange:hover {
     background-color: rgb(101, 101, 101);
 }
 
+.buttons-toolbar {
+    margin-bottom: 20px;
+}
+
+.noselect {
+    -webkit-touch-callout: none; /* iOS Safari */
+    -webkit-user-select: none; /* Safari */
+    -moz-user-select: none; /* Firefox */
+    -ms-user-select: none; /* Internet Explorer/Edge */
+    user-select: none;
+    /* Non-prefixed version, currently supported by Chrome and Opera */
+}
+
+#code-output {
+    height: auto;
+    font-size: 12px;
+}
+
+#site-table-header {
+    font-weight: 500;
+    font-size: 16px;
+    border-top: 6px solid #90a877;
+}
+
 label.checkbox-label {
     color: #FFF !important;
 }
 
 #agreement-icon {
     margin-left: 18px;
+}
+
+/*PROFILE STYLING*/
+#profile-banner {
+    height: 35vh;
+    background: #5d688a;
+    margin: -80px -4vw 40px -4vw;
+    padding-right: 4vw;
+    padding-left: 4vw;
+    display: flex;
+    color: #FFF;
+
+}
+
+#profile-banner h3 {
+    align-self: flex-end;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+
+.profile-name > i {
+    font-size: 84px;
+    display: block;
+}
+
+#btn-edit-profile {
+    margin-top: -68px;
+}
+
+#btn-cancel-profile-edit, #btn-update-user {
+    margin-top: -60px;
+}
+
+#btn-cancel-profile-edit {
+    right: 145px;
+    background-color: #ffffff;
+}
+
+#profile-details-table tr td:first-child {
+    padding-right: 24px;
+}
+
+.d-block {
+    display: block;
+}
+
+.alert-error {
+    color: #a94442;
+    background-color: #f2dede;
+    border-color: #ebccd1;
+}
+
+/*TRANSITIONS*/
+.mdl-button--trans {
+    -webkit-transition: all 300ms;
+    -moz-transition: all 300ms;
+    -ms-transition: all 300ms;
+    -o-transition: all 300ms;
+    transition: all 300ms;
+    transform: scale(0);
+}
+
+.fab-trans {
+    transform: scale(1);
+}
+
+/*MARKERS TABLE*/
+
+.site-field {
+    padding-bottom: 3px;
+}
+
+.marker-info tr:not(.site-link) {
+    border-bottom: 1px solid #DDD;
+}
+
+.marker-info th, .marker-info td {
+    padding: 6px;
+}
+
+.marker-info td {
+    max-width: 150px;
+}
+
+.marker-info th {
+    display: inline-block;
+}
+
+.site-link {
+    margin-top: 20px;
+    display: block;
 }
\ No newline at end of file
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/bootstrap-toolkit.min.js b/src/dataloaderinterface/static/dataloaderinterface/js/bootstrap-toolkit.min.js
new file mode 100644
index 00000000..018fae27
--- /dev/null
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/bootstrap-toolkit.min.js
@@ -0,0 +1,8 @@
+/*!
+ * Responsive Bootstrap Toolkit
+ * Author:    Maciej Gurban
+ * License:   MIT
+ * Version:   2.5.1 (2015-11-02)
+ * Origin:    https://github.com/maciej-gurban/responsive-bootstrap-toolkit
+ */
+;var ResponsiveBootstrapToolkit=function(i){var e={detectionDivs:{bootstrap:{xs:i('<div class="device-xs visible-xs visible-xs-block"></div>'),sm:i('<div class="device-sm visible-sm visible-sm-block"></div>'),md:i('<div class="device-md visible-md visible-md-block"></div>'),lg:i('<div class="device-lg visible-lg visible-lg-block"></div>')},foundation:{small:i('<div class="device-xs show-for-small-only"></div>'),medium:i('<div class="device-sm show-for-medium-only"></div>'),large:i('<div class="device-md show-for-large-only"></div>'),xlarge:i('<div class="device-lg show-for-xlarge-only"></div>')}},applyDetectionDivs:function(){i(document).ready(function(){i.each(o.breakpoints,function(i){o.breakpoints[i].appendTo(".responsive-bootstrap-toolkit")})})},isAnExpression:function(i){return"<"==i.charAt(0)||">"==i.charAt(0)},splitExpression:function(i){var e=i.charAt(0),o="="==i.charAt(1)?!0:!1,s=1+(o?1:0),n=i.slice(s);return{operator:e,orEqual:o,breakpointName:n}},isAnyActive:function(e){var s=!1;return i.each(e,function(i,e){return o.breakpoints[e].is(":visible")?(s=!0,!1):void 0}),s},isMatchingExpression:function(i){var s=e.splitExpression(i),n=Object.keys(o.breakpoints),r=n.indexOf(s.breakpointName);if(-1!==r){var t=0,a=0;"<"==s.operator&&(t=0,a=s.orEqual?++r:r),">"==s.operator&&(t=s.orEqual?r:++r,a=void 0);var c=n.slice(t,a);return e.isAnyActive(c)}}},o={interval:300,framework:null,breakpoints:null,is:function(i){return e.isAnExpression(i)?e.isMatchingExpression(i):o.breakpoints[i]&&o.breakpoints[i].is(":visible")},use:function(i,s){o.framework=i.toLowerCase(),o.breakpoints="bootstrap"===o.framework||"foundation"===o.framework?e.detectionDivs[o.framework]:s,e.applyDetectionDivs()},current:function(){var e="unrecognized";return i.each(o.breakpoints,function(i){o.is(i)&&(e=i)}),e},changed:function(i,e){var s;return function(){clearTimeout(s),s=setTimeout(function(){i()},e||o.interval)}}};return i(document).ready(function(){i('<div class="responsive-bootstrap-toolkit"></div>').appendTo("body")}),null===o.framework&&o.use("bootstrap"),o}(jQuery);
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/browse-sites.js b/src/dataloaderinterface/static/dataloaderinterface/js/browse-sites.js
index d8e5610e..df61464e 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/js/browse-sites.js
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/browse-sites.js
@@ -1,17 +1,32 @@
 function initMap() {
-    const DEFAULT_ZOOM = 6;
-    const DEFAULT_LATITUDE = 37.0902;
+    const DEFAULT_ZOOM = 5;
+    const DEFAULT_SPECIFIC_ZOOM = 12;
+    const DEFAULT_LATITUDE = 40.0902;
     const DEFAULT_LONGITUDE = -95.7129;
     const DEFAULT_POSITION = { lat: DEFAULT_LATITUDE, lng: DEFAULT_LONGITUDE };
+    var ZOOM_LEVEL = sessionStorage && parseInt(sessionStorage.getItem('CURRENT_ZOOM')) || DEFAULT_ZOOM;
+    var temp = sessionStorage.getItem('CURRENT_CENTER');
+    var MAP_CENTER = DEFAULT_POSITION;
+
+    if(sessionStorage.getItem('CURRENT_CENTER')) {
+        MAP_CENTER = getLatLngFromString(temp);
+    } else if (navigator.geolocation) {
+        navigator.geolocation.getCurrentPosition(function getLocation(locatedPosition) {
+            map.setCenter({ lat: locatedPosition.coords.latitude, lng: locatedPosition.coords.longitude });
+            map.setZoom(DEFAULT_SPECIFIC_ZOOM);
+        }, undefined, { timeout: 5000 });
+    }
 
     var markerData = JSON.parse(document.getElementById('sites-data').innerHTML);
+
     var map = new google.maps.Map(document.getElementById('map'), {
-        center: DEFAULT_POSITION,
-        zoom: DEFAULT_ZOOM,
+        center: MAP_CENTER,
+        zoom: ZOOM_LEVEL,
         disableDefaultUI: true,
+        gestureHandling: 'greedy',
         zoomControl: true,
         zoomControlOptions: {
-          position: google.maps.ControlPosition.LEFT_BOTTOM
+            position: google.maps.ControlPosition.LEFT_BOTTOM
         },
         mapTypeId: google.maps.MapTypeId.ROADMAP,
         scaleControl: true
@@ -21,6 +36,19 @@ function initMap() {
         content: ''
     });
 
+    map.addListener('zoom_changed', function(){
+        var CURRENT_ZOOM = map.getZoom();
+
+        sessionStorage.setItem('CURRENT_ZOOM', CURRENT_ZOOM);
+    });
+
+    map.addListener('center_changed', function(){
+        var CURRENT_CENTER = map.getCenter();
+
+        sessionStorage.setItem('CURRENT_CENTER', CURRENT_CENTER);
+    });
+
+
     markerData.forEach(function(site) {
         var marker = new google.maps.Marker({
             position: { lat: site.latitude, lng: site.longitude },
@@ -35,7 +63,7 @@ function initMap() {
                 $(element).find('.site-data').text(site[field]);
             });
             contentElement.find('.site-link a').attr('href', site.detail_link);
-            
+
             var infoContent = $('<div></div>').append(contentElement.html()).html();
             infoWindow.setContent(infoContent);
             infoWindow.open(marker.get('map'), marker);
@@ -55,3 +83,10 @@ $( window ).resize(function() {
   $(".map-container").css("height", $("#wrapper").height());
     $("body").css("overflow", "hidden")
 });
+
+function getLatLngFromString(location) {
+    var latlang = location.replace(/[()]/g,'');
+    var latlng = latlang.split(',');
+    var locate = new google.maps.LatLng(parseFloat(latlng[0]) , parseFloat(latlng[1]));
+    return locate;
+}
\ No newline at end of file
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/common-forms.js b/src/dataloaderinterface/static/dataloaderinterface/js/common-forms.js
index 06585424..c4b21b4a 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/js/common-forms.js
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/common-forms.js
@@ -4,11 +4,15 @@
 
 function initializeSelect(select) {
     setTimeout(function () {
-        select.select2({
-            theme: "bootstrap",
-            containerCssClass : "input-sm",
-            dropdownAutoWidth: true,
-            width: 'auto'
+        select.each(function(index, selectElement) {
+            $(selectElement).select2({
+                theme: "bootstrap",
+                containerCssClass : "input-sm",
+                dropdownAutoWidth: true,
+                width: 'auto',
+                allowClear: true,
+                placeholder: $(selectElement).attr('placeholder')
+            });
         });
     });
 }
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/copyToClipboard.js b/src/dataloaderinterface/static/dataloaderinterface/js/copyToClipboard.js
index 463d4b39..c84d9b63 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/js/copyToClipboard.js
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/copyToClipboard.js
@@ -24,6 +24,7 @@ $(document).ready(function () {
 });
 
 function copyToClipboard(elem, event) {
+    var tempScrollTop = $(window).scrollTop();  // Save current scroll position
     // create hidden text element, if it doesn't already exist
     var targetId = "_hiddenCopyText_";
     var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA";
@@ -76,5 +77,7 @@ function copyToClipboard(elem, event) {
         target.remove();
     }
 
+    $(window).scrollTop(tempScrollTop);  // Restore scroll position
+
     return succeed;
 }
\ No newline at end of file
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/device-detail.js b/src/dataloaderinterface/static/dataloaderinterface/js/device-detail.js
index 6289cdb2..2a51cad3 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/js/device-detail.js
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/device-detail.js
@@ -1,38 +1,18 @@
-$(document).ready(function () {
-    var dialog = document.querySelector('#data-table-dialog');
-    if (!dialog.showModal) {
-        dialogPolyfill.registerDialog(dialog);
-    }
-
-    $(".table-trigger").click(function(){
-        var box = $(this).parents('.plot_box');
-        var id = box.data('result-id');
-        var tables = $('table.data-values');
-        tables.hide();
-
-        tables.filter('[data-result-id="' + id + '"]').show();
-        $(dialog).find('.mdl-dialog__title').text(box.data('variable-name') + ' (' + box.data('variable-code') + ')');
-
-        dialog.showModal();
-    });
-
-    dialog.querySelector('.dialog-close').addEventListener('click', function () {
-        dialog.close();
-    });
-});
-
+const EXTENT_HOURS = 72;
+const GAP_HOURS = 6;
+const STALE_DATA_CUTOFF = new Date(new Date() - 1000 * 60 * 60 * EXTENT_HOURS);
 
 function initMap() {
     var defaultZoomLevel = 18;
     var latitude = parseFloat($('#site-latitude').val());
     var longitude = parseFloat($('#site-longitude').val());
-    var sitePosition = { lat: latitude, lng: longitude };
+    var sitePosition = {lat: latitude, lng: longitude};
 
     var map = new google.maps.Map(document.getElementById('map'), {
         center: sitePosition,
-        scrollwheel: false,
+        gestureHandling: 'greedy',
         zoom: defaultZoomLevel,
-        mapTypeId: google.maps.MapTypeId.ROADMAP
+        mapTypeId: google.maps.MapTypeId.SATELLITE
     });
 
     var marker = new google.maps.Marker({
@@ -41,85 +21,278 @@ function initMap() {
     });
 }
 
-function plotValues(result_id, values) {
-    var plotBox = $('div.plot_box[data-result-id="' + result_id + '"] div.graph-container');
+// Makes all site cards have the same height.
+function fixViewPort() {
+    var cards = $('.plot_box');
 
-    var margin = {top: 0, right: 0, bottom: 0, left: 0};
+    var maxHeight = 0;
+    for (var i = 0; i < cards.length; i++) {
+        maxHeight = Math.max($(cards[i]).height(), maxHeight);
+    }
+
+    // set to new max height
+    for (var i = 0; i < cards.length; i++) {
+        $(cards[i]).height(maxHeight);
+    }
+}
+
+function bindDeleteDialogEvents() {
+    var deleteDialog = document.querySelector('#site-delete-dialog');
+    var deleteButton = document.querySelector('#btn-delete-site');
+
+    if (!deleteButton) {
+        return;
+    }
+
+    if (!deleteDialog.showModal) {
+        dialogPolyfill.registerDialog(deleteDialog);
+    }
+
+    deleteButton.addEventListener('click', function () {
+        deleteDialog.showModal();
+    });
+
+    deleteDialog.querySelector('.dialog-close').addEventListener('click', function () {
+        deleteDialog.close();
+    });
+
+    deleteDialog.querySelector('.confirm-delete').addEventListener('click', function () {
+        deleteDialog.close();
+    });
+}
+
+// Returns the most recent 72 hours since the last reading
+function getRecentData(timeSeriesData) {
+    var lastRead = Math.max.apply(Math, timeSeriesData.map(function(value){
+        return new Date(value.DateTime);
+    }));
+
+    var dataTimeOffset = new Date(lastRead - 1000 * 60 * 60 * EXTENT_HOURS);
+    return timeSeriesData.filter(function (value) {
+        return (new Date(value.DateTime)) >= dataTimeOffset;
+    });
+}
+
+function fillValueTable(table, data) {
+    var rows = data.map(function (dataValue) {
+        return "<tr><td class='mdl-data-table__cell--non-numeric'>" + dataValue.DateTime + "</td><td class='mdl-data-table__cell--non-numeric'>" + dataValue.TimeOffset + "</td><td>" + dataValue.Value + "</td></tr>";
+    });
+    table.append($(rows.join('')));
+}
+
+function drawSparklineOnResize(seriesInfo, seriesData) {
+    var resizeTimer;
+    window.addEventListener('resize', function (event) {
+        clearTimeout(resizeTimer);
+        resizeTimer = setTimeout(function () {
+            drawSparklinePlot(seriesInfo, seriesData);
+        }, 500);
+    });
+}
+
+function drawSparklinePlot(seriesInfo, seriesData) {
+    var card = $('div.plot_box[data-result-id="' + seriesInfo['resultId'] + '"]');
+    var plotBox = card.find(".graph-container");
+    var $lastObservation = card.find(".last-observation");
+
+    plotBox.empty();
+
+    var margin = {top: 5, right: 1, bottom: 5, left: 1};
     var width = plotBox.width() - margin.left - margin.right;
     var height = plotBox.height() - margin.top - margin.bottom;
 
+    if (seriesData.length === 0) {
+        card.find(".table-trigger").toggleClass("disabled", true);
+        card.find(".download-trigger").toggleClass("disabled", true);
+        card.find(".tsa-trigger").toggleClass("disabled", true);
+
+        // Append message when there is no data
+        d3.select(plotBox.get(0)).append("svg")
+            .attr("width", width + margin.left + margin.right)
+            .attr("height", height + margin.top + margin.bottom)
+            .append("text")
+                .text("No data exist for this variable.")
+                .attr("font-size", "12px")
+                .attr("fill", "#AAA")
+                .attr("text-anchor", "left")
+                .attr("transform", "translate(" + (margin.left + 10) + "," + (margin.top + 20) + ")");
+        return;
+    }
+
+    $('.plot_box[data-result-id=' + seriesInfo['resultId'] + ' ]').find('.latest-value').text(seriesData[seriesData.length - 1].Value);
+
+    var lastRead = Math.max.apply(Math, seriesData.map(function(value){
+        return new Date(value.DateTime);
+    }));
+
+    $lastObservation.text(formatDate(lastRead));
+
+    var dataTimeOffset = new Date(lastRead - 1000 * 60 * 60 * EXTENT_HOURS);
+
     var xAxis = d3.scaleTime().range([0, width]);
     var yAxis = d3.scaleLinear().range([height, 0]);
 
-    xAxis.domain(d3.extent(values, function (d) {
-        return d.index;
-    }));
-    yAxis.domain(d3.extent(values, function (d) {
-        return parseFloat(d.value);
+    xAxis.domain([dataTimeOffset, lastRead]);
+    yAxis.domain(d3.extent(seriesData, function(d) {
+        return parseInt(d.Value);
     }));
 
     var line = d3.line()
         .x(function(d) {
-            return xAxis(d.index);
+            var date = new Date(d.DateTime);
+            return xAxis(date);
         })
         .y(function(d) {
-            return yAxis(d.value);
+            return yAxis(d.Value);
         });
+
     var svg = d3.select(plotBox.get(0)).append("svg")
         .attr("width", width + margin.left + margin.right)
+        .attr("class", function() {
+            if (lastRead <= STALE_DATA_CUTOFF) {
+                return "stale";
+            }
+
+            return "not-stale";
+        })
         .attr("height", height + margin.top + margin.bottom)
         .append("g")
         .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
 
-    svg.append("path").data([values]).attr("class", "line").attr("d", line);
-}
+    // Rendering the paths
+    var gapOffset;  // The minimum date required before being considered a gap.
+    var previousDate;
+    var start = 0;  // Latest start detected after a gap. Initially set to the start of the list.
+    var paths = [];
+
+    for (var i = 0; i < seriesData.length; i++) {
+        var currentDate = new Date(seriesData[i].DateTime);
+
+        if (previousDate) {
+            gapOffset = new Date(currentDate - 1000 * 60 * 60 * GAP_HOURS);
+        }
+
+        if (previousDate && previousDate < gapOffset) {
+            paths.push(seriesData.slice(start, i));
+            start = i;
+        }
+        previousDate = currentDate;
+    }
 
-function drawSparklinePlots(tableData) {
-    $('div.graph-container').empty();
-    for (var index = 0; index < tableData.length; index++) {
-        plotValues(tableData[index]['id'], tableData[index]['data']);
+    if (start > 0) {
+        paths.push(seriesData.slice(start, seriesData.length));
+    }
+    else {
+        paths.push(seriesData); // No gaps were detected. Just plot the entire original data.
+    }
+
+    // Plot all paths separately to display gaps between them.
+    for (var i = 0; i < paths.length; i++) {
+        if (paths[i].length == 1) {
+            svg.append("circle")
+                .attr("r", 2)
+                .style("fill", "steelblue")
+                .attr("transform", "translate(" + xAxis(new Date(paths[i][0].DateTime)) + ", " + yAxis(paths[i][0].Value) + ")")
+        }
+        else {
+            svg.append("path")
+            .data([paths[i]])
+            .attr("class", "line").attr("d", line)
+            .attr("stroke", "steelblue");
+        }
     }
 }
 
-function initializeTable(table) {
-    return table.dataTable({
-        info: false,
-        ordering: true,
-        paging: false,
-        searching: false,
-        scrollY: '700',
-        scrollCollapse: true
+function getTimeSeriesData(sensorInfo) {
+    Papa.parse(sensorInfo['csvPath'], {
+        download: true,
+        header: true,
+        worker: true,
+        comments: "#",
+        skipEmptyLines: true,
+        complete: function (result) {
+            if (result.data) {
+                var recentValues = getRecentData(result.data);
+                fillValueTable($('table.data-values[data-result-id=' + sensorInfo['resultId'] + ']'), recentValues);
+                drawSparklineOnResize(sensorInfo, recentValues);
+                drawSparklinePlot(sensorInfo, recentValues);
+            }
+        }
     });
 }
 
-$(document).ready(function() {
-    $('nav .menu-sites-list').addClass('active');
-    
-    var resizeTimer;
-    var tablesData = [];
-    var plotBoxes = $('div.plot_box');
-
-    var tables = initializeTable($('table.data-values'));
-
-    for (var index = 0; index < tables.length; index++) {
-        var table = $(tables.get(index));
-        tablesData[index] = {
-            table: table,
-            id: table.data('result-id'),
-            data: tables.api().table(index).data().map(function(data, index) {
-                return { index: index, value: data[1] }
-            })
-        }
+$(document).ready(function () {
+    var dialog = document.querySelector('#data-table-dialog');
+    if (!dialog.showModal) {
+        dialogPolyfill.registerDialog(dialog);
     }
-    tables.api().destroy();
 
-    $(window).on('resize', function(event) {
-      clearTimeout(resizeTimer);
-      resizeTimer = setTimeout(function() {
-          drawSparklinePlots(tablesData);
-      }, 500);
+    $("#btn-follow").on("click", function () {
+        var statusContainer = $(".follow-status");
+        var followForm = $("#follow-site-form");
+        var following = statusContainer.hasClass('following');
+        var tooltip = $(".mdl-tooltip[data-mdl-for='btn-follow']");
+
+        $.ajax({
+            url: $('#follow-site-api').val(),
+            type: 'post',
+            data: {
+                csrfmiddlewaretoken: followForm.find('input[name="csrfmiddlewaretoken"]').val(),
+                sampling_feature_code: followForm.find('input[name="sampling_feature_code"]').val(),
+                action: (following)?'unfollow':'follow'
+            }}).done(function(data) {
+                statusContainer.toggleClass("following");
+                tooltip.text((following)?'Follow':'Unfollow');
+            });
+    });
+
+    $(".table-trigger").click(function () {
+        var box = $(this).parents('.plot_box');
+        var id = box.data('result-id');
+        var tables = $('table.data-values');
+        tables.hide();
+
+        tables.filter('[data-result-id="' + id + '"]').show();
+        var title = box.data('variable-name') + ' (' + box.data('variable-code') + ')';
+        $(dialog).find('.mdl-dialog__title').text(title);
+        $(dialog).find('.mdl-dialog__title').attr("title", title);
+
+        dialog.showModal();
     });
 
-    drawSparklinePlots(tablesData);
-    plotBoxes.first().trigger('click');
+    dialog.querySelector('.dialog-close').addEventListener('click', function () {
+        dialog.close();
+    });
+
+    $('nav .menu-sites-list').addClass('active');
+
+
+    var sensors = document.querySelectorAll('.device-data .plot_box');
+    for (var index = 0; index < sensors.length; index++) {
+        var sensorInfo = sensors[index].dataset;
+        getTimeSeriesData(sensorInfo);
+    }
+
+    bindDeleteDialogEvents();
+
+    // Executes when page loads
+    fixViewPort();
+
+    // Executes each time window size changes
+    $(window).resize(
+        ResponsiveBootstrapToolkit.changed(function () {
+            $('.plot_box').height("initial");   // Reset height
+            fixViewPort();
+        }));
 });
+
+function formatDate(date) {
+    date = new Date(date);
+
+    var options = {
+        year: "numeric", month: "short",
+        day: "numeric", hour: "2-digit", minute: "2-digit"
+    };
+
+    return date.toLocaleTimeString("en-us", options);
+}
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/my-sites.js b/src/dataloaderinterface/static/dataloaderinterface/js/my-sites.js
index b0b414db..23d2efdf 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/js/my-sites.js
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/my-sites.js
@@ -7,21 +7,45 @@ function initMap() {
     const DEFAULT_LATITUDE = 37.0902;
     const DEFAULT_LONGITUDE = -95.7129;
     const DEFAULT_POSITION = { lat: DEFAULT_LATITUDE, lng: DEFAULT_LONGITUDE };
+    var ZOOM_LEVEL = sessionStorage && parseInt(sessionStorage.getItem('MY_CURRENT_ZOOM')) || DEFAULT_ZOOM;
+    var temp = sessionStorage.getItem('MY_CURRENT_CENTER');
+
+    if(sessionStorage.getItem('MY_CURRENT_CENTER')){
+        var CUR_CENTER = getLatLngFromString(temp);
+        var MAP_CENTER =  CUR_CENTER;
+    }
+    else{
+        var MAP_CENTER = DEFAULT_POSITION;
+    }
 
     var markerData = JSON.parse(document.getElementById('sites-data').innerHTML);
+
     var map = new google.maps.Map(document.getElementById('map'), {
-        center: DEFAULT_POSITION,
-        zoom: DEFAULT_ZOOM,
-        scrollwheel: false,
+        center: MAP_CENTER,
+        zoom: ZOOM_LEVEL,
         disableDefaultUI: true,
         zoomControl: true,
+        gestureHandling: 'greedy',
         zoomControlOptions: {
-          position: google.maps.ControlPosition.LEFT_BOTTOM
+            position: google.maps.ControlPosition.LEFT_BOTTOM
         },
         mapTypeId: google.maps.MapTypeId.ROADMAP,
         scaleControl: true
     });
 
+    map.addListener('zoom_changed', function(){
+        var CURRENT_ZOOM = map.getZoom();
+
+        sessionStorage.setItem('MY_CURRENT_ZOOM', CURRENT_ZOOM);
+    });
+
+    map.addListener('center_changed', function(){
+        var CURRENT_CENTER = map.getCenter();
+
+        sessionStorage.setItem('MY_CURRENT_CENTER', CURRENT_CENTER);
+    });
+
+    var bounds = new google.maps.LatLngBounds();
     var infoWindow = new google.maps.InfoWindow({
         content: ''
     });
@@ -32,6 +56,8 @@ function initMap() {
             map: map
         });
 
+        bounds.extend(marker.getPosition());
+
         marker.addListener('click', function() {
             var infoContent = createInfoWindowContent(site);
             infoWindow.setContent(infoContent);
@@ -46,8 +72,16 @@ function initMap() {
             var infoContent = createInfoWindowContent(data);
             event.data['info-window'].setContent(infoContent);
             event.data['info-window'].open(marker.get('map'), marker);
+
+            $('html, body').animate({
+                scrollTop: 0
+            }, 150);
         });
     });
+
+    if (!sessionStorage.getItem('MY_CURRENT_CENTER')){
+        map.fitBounds(bounds);
+    }
 }
 
 function createInfoWindowContent(siteInfo) {
@@ -62,7 +96,39 @@ function createInfoWindowContent(siteInfo) {
     return $('<div></div>').append(contentElement.html()).html();
 }
 
-$(document).ready(function() {
+// Makes all site cards have the same height.
+function fixViewPort() {
+    var cards = $('.site-card');
+
+    var maxHeight = 0;
+    for (var i = 0; i < cards.length; i++) {
+        maxHeight = Math.max($(cards[i]).height(), maxHeight);
+    }
+
+    // set to new max height
+    for (var i = 0; i < cards.length; i++) {
+        $(cards[i]).height(maxHeight);
+    }
+}
+
+$(document).ready(function () {
     $('nav .menu-sites-list').addClass('active');
 
-});
\ No newline at end of file
+    // Executes when page loads
+    fixViewPort();
+
+    // Executes each time window size changes
+    $(window).resize(
+        ResponsiveBootstrapToolkit.changed(function () {
+            $('.site-card').height("initial");   // Reset height
+            fixViewPort();
+        })
+    );
+});
+
+function getLatLngFromString(location) {
+    var latlang = location.replace(/[()]/g,'');
+    var latlng = latlang.split(',');
+    var locate = new google.maps.LatLng(parseFloat(latlng[0]) , parseFloat(latlng[1]));
+    return locate;
+}
\ No newline at end of file
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/papaparse.min.js b/src/dataloaderinterface/static/dataloaderinterface/js/papaparse.min.js
new file mode 100644
index 00000000..e88f353d
--- /dev/null
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/papaparse.min.js
@@ -0,0 +1,7 @@
+/*!
+	Papa Parse
+	v4.3.5
+	https://github.com/mholt/PapaParse
+	License: MIT
+*/
+!function(a,b){"function"==typeof define&&define.amd?define([],b):"object"==typeof module&&"undefined"!=typeof exports?module.exports=b():a.Papa=b()}(this,function(){"use strict";function a(a,b){b=b||{};var c=b.dynamicTyping||!1;if(r(c)&&(b.dynamicTypingFunction=c,c={}),b.dynamicTyping=c,b.worker&&z.WORKERS_SUPPORTED){var h=k();return h.userStep=b.step,h.userChunk=b.chunk,h.userComplete=b.complete,h.userError=b.error,b.step=r(b.step),b.chunk=r(b.chunk),b.complete=r(b.complete),b.error=r(b.error),delete b.worker,void h.postMessage({input:a,config:b,workerId:h.id})}var i=null;return"string"==typeof a?i=b.download?new d(b):new f(b):a.readable===!0&&r(a.read)&&r(a.on)?i=new g(b):(t.File&&a instanceof File||a instanceof Object)&&(i=new e(b)),i.stream(a)}function b(a,b){function c(){"object"==typeof b&&("string"==typeof b.delimiter&&1===b.delimiter.length&&z.BAD_DELIMITERS.indexOf(b.delimiter)===-1&&(j=b.delimiter),("boolean"==typeof b.quotes||b.quotes instanceof Array)&&(h=b.quotes),"string"==typeof b.newline&&(k=b.newline),"string"==typeof b.quoteChar&&(l=b.quoteChar),"boolean"==typeof b.header&&(i=b.header))}function d(a){if("object"!=typeof a)return[];var b=[];for(var c in a)b.push(c);return b}function e(a,b){var c="";"string"==typeof a&&(a=JSON.parse(a)),"string"==typeof b&&(b=JSON.parse(b));var d=a instanceof Array&&a.length>0,e=!(b[0]instanceof Array);if(d&&i){for(var g=0;g<a.length;g++)g>0&&(c+=j),c+=f(a[g],g);b.length>0&&(c+=k)}for(var h=0;h<b.length;h++){for(var l=d?a.length:b[h].length,m=0;m<l;m++){m>0&&(c+=j);var n=d&&e?a[m]:m;c+=f(b[h][n],m)}h<b.length-1&&(c+=k)}return c}function f(a,b){if("undefined"==typeof a||null===a)return"";a=a.toString().replace(m,l+l);var c="boolean"==typeof h&&h||h instanceof Array&&h[b]||g(a,z.BAD_DELIMITERS)||a.indexOf(j)>-1||" "===a.charAt(0)||" "===a.charAt(a.length-1);return c?l+a+l:a}function g(a,b){for(var c=0;c<b.length;c++)if(a.indexOf(b[c])>-1)return!0;return!1}var h=!1,i=!0,j=",",k="\r\n",l='"';c();var m=new RegExp(l,"g");if("string"==typeof a&&(a=JSON.parse(a)),a instanceof Array){if(!a.length||a[0]instanceof Array)return e(null,a);if("object"==typeof a[0])return e(d(a[0]),a)}else if("object"==typeof a)return"string"==typeof a.data&&(a.data=JSON.parse(a.data)),a.data instanceof Array&&(a.fields||(a.fields=a.meta&&a.meta.fields),a.fields||(a.fields=a.data[0]instanceof Array?a.fields:d(a.data[0])),a.data[0]instanceof Array||"object"==typeof a.data[0]||(a.data=[a.data])),e(a.fields||[],a.data||[]);throw"exception: Unable to serialize unrecognized input"}function c(a){function b(a){var b=p(a);b.chunkSize=parseInt(b.chunkSize),a.step||a.chunk||(b.chunkSize=null),this._handle=new h(b),this._handle.streamer=this,this._config=b}this._handle=null,this._paused=!1,this._finished=!1,this._input=null,this._baseIndex=0,this._partialLine="",this._rowCount=0,this._start=0,this._nextChunk=null,this.isFirstChunk=!0,this._completeResults={data:[],errors:[],meta:{}},b.call(this,a),this.parseChunk=function(a){if(this.isFirstChunk&&r(this._config.beforeFirstChunk)){var b=this._config.beforeFirstChunk(a);void 0!==b&&(a=b)}this.isFirstChunk=!1;var c=this._partialLine+a;this._partialLine="";var d=this._handle.parse(c,this._baseIndex,!this._finished);if(!this._handle.paused()&&!this._handle.aborted()){var e=d.meta.cursor;this._finished||(this._partialLine=c.substring(e-this._baseIndex),this._baseIndex=e),d&&d.data&&(this._rowCount+=d.data.length);var f=this._finished||this._config.preview&&this._rowCount>=this._config.preview;if(v)t.postMessage({results:d,workerId:z.WORKER_ID,finished:f});else if(r(this._config.chunk)){if(this._config.chunk(d,this._handle),this._paused)return;d=void 0,this._completeResults=void 0}return this._config.step||this._config.chunk||(this._completeResults.data=this._completeResults.data.concat(d.data),this._completeResults.errors=this._completeResults.errors.concat(d.errors),this._completeResults.meta=d.meta),!f||!r(this._config.complete)||d&&d.meta.aborted||this._config.complete(this._completeResults,this._input),f||d&&d.meta.paused||this._nextChunk(),d}},this._sendError=function(a){r(this._config.error)?this._config.error(a):v&&this._config.error&&t.postMessage({workerId:z.WORKER_ID,error:a,finished:!1})}}function d(a){function b(a){var b=a.getResponseHeader("Content-Range");return null===b?-1:parseInt(b.substr(b.lastIndexOf("/")+1))}a=a||{},a.chunkSize||(a.chunkSize=z.RemoteChunkSize),c.call(this,a);var d;u?this._nextChunk=function(){this._readChunk(),this._chunkLoaded()}:this._nextChunk=function(){this._readChunk()},this.stream=function(a){this._input=a,this._nextChunk()},this._readChunk=function(){if(this._finished)return void this._chunkLoaded();if(d=new XMLHttpRequest,this._config.withCredentials&&(d.withCredentials=this._config.withCredentials),u||(d.onload=q(this._chunkLoaded,this),d.onerror=q(this._chunkError,this)),d.open("GET",this._input,!u),this._config.downloadRequestHeaders){var a=this._config.downloadRequestHeaders;for(var b in a)d.setRequestHeader(b,a[b])}if(this._config.chunkSize){var c=this._start+this._config.chunkSize-1;d.setRequestHeader("Range","bytes="+this._start+"-"+c),d.setRequestHeader("If-None-Match","webkit-no-cache")}try{d.send()}catch(a){this._chunkError(a.message)}u&&0===d.status?this._chunkError():this._start+=this._config.chunkSize},this._chunkLoaded=function(){if(4==d.readyState){if(d.status<200||d.status>=400)return void this._chunkError();this._finished=!this._config.chunkSize||this._start>b(d),this.parseChunk(d.responseText)}},this._chunkError=function(a){var b=d.statusText||a;this._sendError(b)}}function e(a){a=a||{},a.chunkSize||(a.chunkSize=z.LocalChunkSize),c.call(this,a);var b,d,e="undefined"!=typeof FileReader;this.stream=function(a){this._input=a,d=a.slice||a.webkitSlice||a.mozSlice,e?(b=new FileReader,b.onload=q(this._chunkLoaded,this),b.onerror=q(this._chunkError,this)):b=new FileReaderSync,this._nextChunk()},this._nextChunk=function(){this._finished||this._config.preview&&!(this._rowCount<this._config.preview)||this._readChunk()},this._readChunk=function(){var a=this._input;if(this._config.chunkSize){var c=Math.min(this._start+this._config.chunkSize,this._input.size);a=d.call(a,this._start,c)}var f=b.readAsText(a,this._config.encoding);e||this._chunkLoaded({target:{result:f}})},this._chunkLoaded=function(a){this._start+=this._config.chunkSize,this._finished=!this._config.chunkSize||this._start>=this._input.size,this.parseChunk(a.target.result)},this._chunkError=function(){this._sendError(b.error)}}function f(a){a=a||{},c.call(this,a);var b,d;this.stream=function(a){return b=a,d=a,this._nextChunk()},this._nextChunk=function(){if(!this._finished){var a=this._config.chunkSize,b=a?d.substr(0,a):d;return d=a?d.substr(a):"",this._finished=!d,this.parseChunk(b)}}}function g(a){a=a||{},c.call(this,a);var b=[],d=!0;this.stream=function(a){this._input=a,this._input.on("data",this._streamData),this._input.on("end",this._streamEnd),this._input.on("error",this._streamError)},this._nextChunk=function(){b.length?this.parseChunk(b.shift()):d=!0},this._streamData=q(function(a){try{b.push("string"==typeof a?a:a.toString(this._config.encoding)),d&&(d=!1,this.parseChunk(b.shift()))}catch(a){this._streamError(a)}},this),this._streamError=q(function(a){this._streamCleanUp(),this._sendError(a.message)},this),this._streamEnd=q(function(){this._streamCleanUp(),this._finished=!0,this._streamData("")},this),this._streamCleanUp=q(function(){this._input.removeListener("data",this._streamData),this._input.removeListener("end",this._streamEnd),this._input.removeListener("error",this._streamError)},this)}function h(a){function b(){if(x&&o&&(l("Delimiter","UndetectableDelimiter","Unable to auto-detect delimiting character; defaulted to '"+z.DefaultDelimiter+"'"),o=!1),a.skipEmptyLines)for(var b=0;b<x.data.length;b++)1===x.data[b].length&&""===x.data[b][0]&&x.data.splice(b--,1);return c()&&d(),g()}function c(){return a.header&&0===w.length}function d(){if(x){for(var a=0;c()&&a<x.data.length;a++)for(var b=0;b<x.data[a].length;b++)w.push(x.data[a][b]);x.data.splice(0,1)}}function e(b){return a.dynamicTypingFunction&&void 0===a.dynamicTyping[b]&&(a.dynamicTyping[b]=a.dynamicTypingFunction(b)),(a.dynamicTyping[b]||a.dynamicTyping)===!0}function f(a,b){return e(a)?"true"===b||"TRUE"===b||"false"!==b&&"FALSE"!==b&&k(b):b}function g(){if(!x||!a.header&&!a.dynamicTyping)return x;for(var b=0;b<x.data.length;b++){for(var c=a.header?{}:[],d=0;d<x.data[b].length;d++){var e=d,g=x.data[b][d];a.header&&(e=d>=w.length?"__parsed_extra":w[d]),g=f(e,g),"__parsed_extra"===e?(c[e]=c[e]||[],c[e].push(g)):c[e]=g}x.data[b]=c,a.header&&(d>w.length?l("FieldMismatch","TooManyFields","Too many fields: expected "+w.length+" fields but parsed "+d,b):d<w.length&&l("FieldMismatch","TooFewFields","Too few fields: expected "+w.length+" fields but parsed "+d,b))}return a.header&&x.meta&&(x.meta.fields=w),x}function h(b,c,d){for(var e,f,g,h=[",","\t","|",";",z.RECORD_SEP,z.UNIT_SEP],j=0;j<h.length;j++){var k=h[j],l=0,m=0,n=0;g=void 0;for(var o=new i({delimiter:k,newline:c,preview:10}).parse(b),p=0;p<o.data.length;p++)if(d&&1===o.data[p].length&&0===o.data[p][0].length)n++;else{var q=o.data[p].length;m+=q,"undefined"!=typeof g?q>1&&(l+=Math.abs(q-g),g=q):g=q}o.data.length>0&&(m/=o.data.length-n),("undefined"==typeof f||l<f)&&m>1.99&&(f=l,e=k)}return a.delimiter=e,{successful:!!e,bestDelimiter:e}}function j(a){a=a.substr(0,1048576);var b=a.split("\r"),c=a.split("\n"),d=c.length>1&&c[0].length<b[0].length;if(1===b.length||d)return"\n";for(var e=0,f=0;f<b.length;f++)"\n"===b[f][0]&&e++;return e>=b.length/2?"\r\n":"\r"}function k(a){var b=q.test(a);return b?parseFloat(a):a}function l(a,b,c,d){x.errors.push({type:a,code:b,message:c,row:d})}var m,n,o,q=/^\s*-?(\d*\.?\d+|\d+\.?\d*)(e[-+]?\d+)?\s*$/i,s=this,t=0,u=!1,v=!1,w=[],x={data:[],errors:[],meta:{}};if(r(a.step)){var y=a.step;a.step=function(d){if(x=d,c())b();else{if(b(),0===x.data.length)return;t+=d.data.length,a.preview&&t>a.preview?n.abort():y(x,s)}}}this.parse=function(c,d,e){if(a.newline||(a.newline=j(c)),o=!1,a.delimiter)r(a.delimiter)&&(a.delimiter=a.delimiter(c),x.meta.delimiter=a.delimiter);else{var f=h(c,a.newline,a.skipEmptyLines);f.successful?a.delimiter=f.bestDelimiter:(o=!0,a.delimiter=z.DefaultDelimiter),x.meta.delimiter=a.delimiter}var g=p(a);return a.preview&&a.header&&g.preview++,m=c,n=new i(g),x=n.parse(m,d,e),b(),u?{meta:{paused:!0}}:x||{meta:{paused:!1}}},this.paused=function(){return u},this.pause=function(){u=!0,n.abort(),m=m.substr(n.getCharIndex())},this.resume=function(){u=!1,s.streamer.parseChunk(m)},this.aborted=function(){return v},this.abort=function(){v=!0,n.abort(),x.meta.aborted=!0,r(a.complete)&&a.complete(x),m=""}}function i(a){a=a||{};var b=a.delimiter,c=a.newline,d=a.comments,e=a.step,f=a.preview,g=a.fastMode,h=a.quoteChar||'"';if(("string"!=typeof b||z.BAD_DELIMITERS.indexOf(b)>-1)&&(b=","),d===b)throw"Comment character same as delimiter";d===!0?d="#":("string"!=typeof d||z.BAD_DELIMITERS.indexOf(d)>-1)&&(d=!1),"\n"!=c&&"\r"!=c&&"\r\n"!=c&&(c="\n");var i=0,j=!1;this.parse=function(a,k,l){function m(a){x.push(a),A=i}function n(b){return l?p():("undefined"==typeof b&&(b=a.substr(i)),z.push(b),i=s,m(z),w&&q(),p())}function o(b){i=b,m(z),z=[],E=a.indexOf(c,i)}function p(a){return{data:x,errors:y,meta:{delimiter:b,linebreak:c,aborted:j,truncated:!!a,cursor:A+(k||0)}}}function q(){e(p()),x=[],y=[]}if("string"!=typeof a)throw"Input must be a string";var s=a.length,t=b.length,u=c.length,v=d.length,w=r(e);i=0;var x=[],y=[],z=[],A=0;if(!a)return p();if(g||g!==!1&&a.indexOf(h)===-1){for(var B=a.split(c),C=0;C<B.length;C++){var z=B[C];if(i+=z.length,C!==B.length-1)i+=c.length;else if(l)return p();if(!d||z.substr(0,v)!==d){if(w){if(x=[],m(z.split(b)),q(),j)return p()}else m(z.split(b));if(f&&C>=f)return x=x.slice(0,f),p(!0)}}return p()}for(var D=a.indexOf(b,i),E=a.indexOf(c,i),F=new RegExp(h+h,"g");;)if(a[i]!==h)if(d&&0===z.length&&a.substr(i,v)===d){if(E===-1)return p();i=E+u,E=a.indexOf(c,i),D=a.indexOf(b,i)}else if(D!==-1&&(D<E||E===-1))z.push(a.substring(i,D)),i=D+t,D=a.indexOf(b,i);else{if(E===-1)break;if(z.push(a.substring(i,E)),o(E+u),w&&(q(),j))return p();if(f&&x.length>=f)return p(!0)}else{var G=i;for(i++;;){var G=a.indexOf(h,G+1);if(G===-1)return l||y.push({type:"Quotes",code:"MissingQuotes",message:"Quoted field unterminated",row:x.length,index:i}),n();if(G===s-1){var H=a.substring(i,G).replace(F,h);return n(H)}if(a[G+1]!==h){if(a[G+1]===b){z.push(a.substring(i,G).replace(F,h)),i=G+1+t,D=a.indexOf(b,i),E=a.indexOf(c,i);break}if(a.substr(G+1,u)===c){if(z.push(a.substring(i,G).replace(F,h)),o(G+1+u),D=a.indexOf(b,i),w&&(q(),j))return p();if(f&&x.length>=f)return p(!0);break}}else G++}}return n()},this.abort=function(){j=!0},this.getCharIndex=function(){return i}}function j(){var a=document.getElementsByTagName("script");return a.length?a[a.length-1].src:""}function k(){if(!z.WORKERS_SUPPORTED)return!1;if(!w&&null===z.SCRIPT_PATH)throw new Error("Script path cannot be determined automatically when Papa Parse is loaded asynchronously. You need to set Papa.SCRIPT_PATH manually.");var a=z.SCRIPT_PATH||s;a+=(a.indexOf("?")!==-1?"&":"?")+"papaworker";var b=new t.Worker(a);return b.onmessage=l,b.id=y++,x[b.id]=b,b}function l(a){var b=a.data,c=x[b.workerId],d=!1;if(b.error)c.userError(b.error,b.file);else if(b.results&&b.results.data){var e=function(){d=!0,m(b.workerId,{data:[],errors:[],meta:{aborted:!0}})},f={abort:e,pause:n,resume:n};if(r(c.userStep)){for(var g=0;g<b.results.data.length&&(c.userStep({data:[b.results.data[g]],errors:b.results.errors,meta:b.results.meta},f),!d);g++);delete b.results}else r(c.userChunk)&&(c.userChunk(b.results,f,b.file),delete b.results)}b.finished&&!d&&m(b.workerId,b.results)}function m(a,b){var c=x[a];r(c.userComplete)&&c.userComplete(b),c.terminate(),delete x[a]}function n(){throw"Not implemented."}function o(a){var b=a.data;if("undefined"==typeof z.WORKER_ID&&b&&(z.WORKER_ID=b.workerId),"string"==typeof b.input)t.postMessage({workerId:z.WORKER_ID,results:z.parse(b.input,b.config),finished:!0});else if(t.File&&b.input instanceof File||b.input instanceof Object){var c=z.parse(b.input,b.config);c&&t.postMessage({workerId:z.WORKER_ID,results:c,finished:!0})}}function p(a){if("object"!=typeof a)return a;var b=a instanceof Array?[]:{};for(var c in a)b[c]=p(a[c]);return b}function q(a,b){return function(){a.apply(b,arguments)}}function r(a){return"function"==typeof a}var s,t=function(){return"undefined"!=typeof self?self:"undefined"!=typeof window?window:"undefined"!=typeof t?t:{}}(),u=!t.document&&!!t.postMessage,v=u&&/(\?|&)papaworker(=|&|$)/.test(t.location.search),w=!1,x={},y=0,z={};if(z.parse=a,z.unparse=b,z.RECORD_SEP=String.fromCharCode(30),z.UNIT_SEP=String.fromCharCode(31),z.BYTE_ORDER_MARK="\ufeff",z.BAD_DELIMITERS=["\r","\n",'"',z.BYTE_ORDER_MARK],z.WORKERS_SUPPORTED=!u&&!!t.Worker,z.SCRIPT_PATH=null,z.LocalChunkSize=10485760,z.RemoteChunkSize=5242880,z.DefaultDelimiter=",",z.Parser=i,z.ParserHandle=h,z.NetworkStreamer=d,z.FileStreamer=e,z.StringStreamer=f,z.ReadableStreamStreamer=g,t.jQuery){var A=t.jQuery;A.fn.parse=function(a){function b(){if(0===f.length)return void(r(a.complete)&&a.complete());var b=f[0];if(r(a.before)){var e=a.before(b.file,b.inputElem);if("object"==typeof e){if("abort"===e.action)return void c("AbortError",b.file,b.inputElem,e.reason);if("skip"===e.action)return void d();"object"==typeof e.config&&(b.instanceConfig=A.extend(b.instanceConfig,e.config))}else if("skip"===e)return void d()}var g=b.instanceConfig.complete;b.instanceConfig.complete=function(a){r(g)&&g(a,b.file,b.inputElem),d()},z.parse(b.file,b.instanceConfig)}function c(b,c,d,e){r(a.error)&&a.error({name:b},c,d,e)}function d(){f.splice(0,1),b()}var e=a.config||{},f=[];return this.each(function(a){var b="INPUT"===A(this).prop("tagName").toUpperCase()&&"file"===A(this).attr("type").toLowerCase()&&t.FileReader;if(!b||!this.files||0===this.files.length)return!0;for(var c=0;c<this.files.length;c++)f.push({file:this.files[c],inputElem:this,instanceConfig:A.extend({},e)})}),b(),this}}return v?t.onmessage=o:z.WORKERS_SUPPORTED&&(s=j(),document.body?document.addEventListener("DOMContentLoaded",function(){w=!0},!0):w=!0),d.prototype=Object.create(c.prototype),d.prototype.constructor=d,e.prototype=Object.create(c.prototype),e.prototype.constructor=e,f.prototype=Object.create(f.prototype),f.prototype.constructor=f,g.prototype=Object.create(c.prototype),g.prototype.constructor=g,z});
\ No newline at end of file
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/device-form.js b/src/dataloaderinterface/static/dataloaderinterface/js/site-form.js
similarity index 90%
rename from src/dataloaderinterface/static/dataloaderinterface/js/device-form.js
rename to src/dataloaderinterface/static/dataloaderinterface/js/site-form.js
index fa302833..39a3d518 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/js/device-form.js
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/site-form.js
@@ -5,15 +5,15 @@
 
 function updateSitePosition(map, position) {
     map.panTo(position);
-    $('input[name="latitude"]').val(Math.round(position.lat() * 100000) / 100000);
-    $('input[name="longitude"]').val(Math.round(position.lng() * 100000) / 100000);
+    $('input[name="latitude"]').val(Math.round(position.lat() * 100000) / 100000).trigger('keypress');
+    $('input[name="longitude"]').val(Math.round(position.lng() * 100000) / 100000).trigger('keypress');
 }
 
 function updateSiteElevation(position) {
     var elevator = new google.maps.ElevationService();
      elevator.getElevationForLocations({'locations':[position]}, function(results, status) {
           if (status == google.maps.ElevationStatus.OK && results[0]) {
-              $('input[name="elevation_m"]').val(Math.round(results[0].elevation));
+              $('input[name="elevation_m"]').val(Math.round(results[0].elevation)).trigger('keypress');
           }
      });
 }
@@ -32,7 +32,7 @@ function initMap() {
         center: { lat: mapPosition.lat || DEFAULT_LATITUDE, lng: mapPosition.lng || DEFAULT_LONGITUDE },
         zoom: mapZoom || DEFAULT_ZOOM,
         mapTypeId: google.maps.MapTypeId.TERRAIN,
-        scrollwheel: false,
+        gestureHandling: 'greedy',
         draggableCursor: 'pointer',
         disableDefaultUI: true,
         zoomControl: true,
@@ -217,7 +217,6 @@ function initializeResultsForm() {
                 fieldsParents.find('.errorlist').remove();
                 fieldsParents.removeClass('has-error');
             }
-
         } else {
             $(this).find('#add-sensor-button').hide();
             $(this).find('#edit-sensor-button').show();
@@ -228,14 +227,20 @@ function initializeResultsForm() {
         validateResultForm().done(function(data, message, xhr) {
             if (xhr.status == 200) {
                 // valid
-                var newIndex = $('div#formset tr.result-form').length;
-                $('input[name="form-TOTAL_FORMS"]').val(newIndex + 1);
+                var rows = $('div#formset tr.result-form');
+                var highestIndex = rows.toArray().reduce(function(value, current, index, list) {
+                    var currentValue = parseInt(current.dataset.result.replace('form-', ''));
+                    return Math.max(value, currentValue);
+                }, -1);
+                var newIndex = highestIndex + 1;
+                $('input[name="form-TOTAL_FORMS"]').val(rows.length + 1);
         
                 var newRow = $($('#sensor-row').html().replace(new RegExp('__prefix__', 'g'), newIndex));
                 updateRowData(newRow);
                 bindResultEditEvent(newRow);
+                bindResultDeleteEvent(newRow);
         
-                $('div.results-table table').DataTable().row.add(newRow).draw();
+                $('div.results-table table').append(newRow);
                 $('#result-dialog').modal('toggle');
                 
             } else if (xhr.status == 206) {
@@ -316,33 +321,31 @@ function bindResultEditEvent(row) {
     });
 }
 
+function bindResultDeleteEvent(row) {
+    row.find('td[data-behaviour="delete"] button').on('click', function(event) {
+        var sensor = $(this).parents('tr');
+        $('#confirm-delete').data('to-delete', sensor).modal('toggle');
+    });
+}
+
+function initializeResultsTable() {
+    var rows = $('div.results-table tbody tr');
+    bindResultEditEvent(rows);
+    bindResultDeleteEvent(rows);
+}
+
 $(document).ready(function() {
     $('nav .menu-register-site').addClass('active');
 
     initializeResultsForm();
-
-    $('table.sensors').dataTable({
-        info: false,
-        ordering: false,
-        paging: false,
-        searching: false,
-        scrollY: '100%',
-        scrollCollapse: true
-    });
-
-    $('#confirm-delete').on('show.bs.modal', function(event) {
-        var sensor = $(event.relatedTarget).parents('tr.result-form');
-        $(event.target).data('to-delete', sensor);
-    });
+    initializeResultsTable();
 
     $('#btn-confirm-delete').on('click', function(event) {
         var dialog = $('#confirm-delete');
-        var sensor = dialog.data('to-delete');
-
-        var totalForms = $('input[name="form-TOTAL_FORMS"]');
-        totalForms.val(totalForms.val() - 1);
+        // var totalForms = $('input[name="form-TOTAL_FORMS"]');
+        // totalForms.val(totalForms.val() - 1);
 
-        $('div.results-table table').DataTable().row(sensor).remove().draw();
+        dialog.data('to-delete').addClass('deleted-row').find('input[name*="DELETE"]').prop('checked', true);
         dialog.modal('toggle');
     });
 });
diff --git a/src/dataloaderinterface/static/dataloaderinterface/js/user-form.js b/src/dataloaderinterface/static/dataloaderinterface/js/user-form.js
index c68a93eb..681eb4b4 100644
--- a/src/dataloaderinterface/static/dataloaderinterface/js/user-form.js
+++ b/src/dataloaderinterface/static/dataloaderinterface/js/user-form.js
@@ -5,6 +5,7 @@
 
 function cleanOrganizationForm() {
     $('.organization-fields input, .organization-fields select').val('');
+    initializeSelect($('.organization-fields select'));
 }
 
 function generateErrorList(errors) {
@@ -21,7 +22,7 @@ $(document).ready(function() {
     var organizationSelect = $('form').find('[name="organization"]');
     initializeSelect(organizationForm.find('[name="organization_type"]'));
 
-    $('<option value="new">Add New Organization</option>').insertAfter(organizationSelect.children().first());
+    $('<option value="new">Add New Organization...</option>').insertAfter(organizationSelect.children().first());
     organizationSelect.on('change', function() {
         if ($(this).val() == 'new') {
             cleanOrganizationForm();
@@ -46,7 +47,7 @@ $(document).ready(function() {
             if (xhr.status == 201) {
                 // organization created
                 var newOption = $('<option value="' + data.organization_id + '">' + data.organization_name + '</option>');
-                $('.organization-fields select[name="organization"]').append(newOption).val(data.organization_id);
+                $('.user-fields select[name="organization"]').append(newOption).val(data.organization_id);
                 $('#organization-dialog').modal('toggle');
             } else if (xhr.status == 206) {
                 // organization form error
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/base.html b/src/dataloaderinterface/templates/dataloaderinterface/base.html
index adb0d8ca..cd51902f 100644
--- a/src/dataloaderinterface/templates/dataloaderinterface/base.html
+++ b/src/dataloaderinterface/templates/dataloaderinterface/base.html
@@ -21,7 +21,7 @@
             <link rel="stylesheet"
                   href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
             <link rel="stylesheet" href="{% static 'dataloaderinterface/css/font-awesome.min.css' %}">
-            <link href='http://fonts.googleapis.com/css?family=Roboto:400,100,‌​100italic,300,300ita‌​lic,400italic,500,50‌​0italic,700,700itali‌​c,900italic,900' rel='stylesheet' type='text/css'>
+            <link href='https://fonts.googleapis.com/css?family=Roboto:400,100,‌​100italic,300,300ita‌​lic,400italic,500,50‌​0italic,700,700itali‌​c,900italic,900' rel='stylesheet' type='text/css'>
 
             <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 
@@ -29,6 +29,10 @@
             <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-blue.min.css">
             <link rel="stylesheet" href="{% static 'dataloaderinterface/css/style.css' %}">
         {% endblock %}
+
+        {% block forced_scripts %}
+
+        {% endblock %}
     </head>
 
     <body>
@@ -54,14 +58,15 @@
                         <!-- 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">
+                                {% if user.is_authenticated %}
                                 <li class="menu-sites-list"><a href="{% url 'sites_list' %}">My Sites</a></li>
+                                {% endif %}
                                 <li class="menu-browse-sites"><a href="{% url 'browse_sites' %}">Browse Sites</a></li>
-                                <li class="menu-register-site"><a href="{% url 'site_registration' %}">Register a Site</a></li>
                             </ul>
 
                             <ul class="nav navbar-nav navbar-right">
                                 {% if user.is_authenticated %}
-                                     <li><a href="#" class="user-info"><i class="fa fa-user" aria-hidden="true"></i> Logged in as {{ user }}</a></li>
+                                     <li><a href="{% url 'user_account' %}"><i class="fa fa-user" aria-hidden="true"></i> Logged in as {{ user }}</a></li>
                                     <li><a href="{% url 'logout' %}"><i class="fa fa-sign-out" aria-hidden="true"></i> Logout</a></li>
                                 {% else %}
                                     <li><a href="{% url 'login' %}"><i class="fa fa-sign-in" aria-hidden="true"></i> Log In</a></li>
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/browse-sites.html b/src/dataloaderinterface/templates/dataloaderinterface/browse-sites.html
index 1f582b13..2c8d7240 100644
--- a/src/dataloaderinterface/templates/dataloaderinterface/browse-sites.html
+++ b/src/dataloaderinterface/templates/dataloaderinterface/browse-sites.html
@@ -6,9 +6,16 @@
     <div class="container-fluid">
         <div class="row">
             <div class="browse-sites-header mdl-shadow--2dp">
-                <div class="page-title">Browse Data Collection Sites</div>
-                <br class="hidden-xs">
-                <span class="subtitle hidden-xs">Browse all sites that have been registered in the database by all users. Clicking on a site shows it's details and provides a link to view the data collected at that site.</span>
+                <div class="page-title">
+                    <span>Browse Data Collection Sites&nbsp;</span>
+                    <i class="glyphicon glyphicon-info-sign"  data-toggle="collapse"
+                     data-target="#browseDescription" aria-expanded="true" aria-controls="#browseDescription"></i>
+                </div>
+
+                <div class="collapse" id="browseDescription">
+                    <br>
+                    <span class="subtitle">Browse all sites that have been registered in the database by all users. Clicking on a site shows it's details and provides a link to view the data collected at that site.</span>
+                </div>
             </div>
 
             <div class="map-container full-screen-map-container">
@@ -17,18 +24,18 @@
 
             <script id="sites-data" type="application/json">
                 [
-                {% for sampling_feature in sites %}
-                    {% with registration=sampling_feature|get_registration %}
+                {% for site in sites %}
                     {
-                        "id": "{{ sampling_feature.sampling_feature_id }}",
-                        "code": "{{ sampling_feature.sampling_feature_code }}",
-                        "name": "{{ sampling_feature.sampling_feature_name }}",
-                        "latitude": {{ sampling_feature.site.latitude|default_if_none:0 }},
-                        "longitude": {{ sampling_feature.site.longitude|default_if_none:0 }},
-                        "elevation": {{ sampling_feature.elevation_m|default_if_none:'""' }},
-                        "detail_link": "{% if registration %}{% url 'site_detail' registration.registration_id %}{% endif %}"
+                    "id": "{{ site.sampling_feature_id }}",
+                    "code": "{{ site.sampling_feature_code }}",
+                    "name": "{{ site.sampling_feature_name }}",
+                    "latitude": {{ site.latitude|default_if_none:0 }},
+                    "longitude": {{ site.longitude|default_if_none:0 }},
+                    "elevation": {{ site.elevation_m|default_if_none:'""' }},
+                    "latest-measurement": "{% if site.latest_measurement.value_datetime %}{{ site.latest_measurement.value_datetime }} ({{ site.latest_measurement.value_datetime|timesince }} ago){% else %}-{% endif %}",
+                    "detail_link": "{% url 'site_detail' site.sampling_feature_code %}",
+                        "detail_link": "{% url 'site_detail' site.sampling_feature_code %}"
                     }{% if not forloop.last %},{% endif %}
-                    {% endwith %}
                 {% endfor %}
                 ]
             </script>
@@ -36,29 +43,35 @@
             <script id="site-marker-content" type="text/plain">
                 <div>
                     <div id="marker-content">
-                        <div data-field="code" class="site-field">
-                            <span class="site-label">Site Code</span>
-                            <span class="site-data"></span>
-                        </div>
-                        <div data-field="name" class="site-field">
-                            <span class="site-label">Site Name</span>
-                            <span class="site-data"></span>
-                        </div>
-                        <div data-field="latitude" class="site-field">
-                            <span class="site-label">Latitude</span>
-                            <span class="site-data"></span>
-                        </div>
-                        <div data-field="longitude" class="site-field">
-                            <span class="site-label">Longitude</span>
-                            <span class="site-data"></span>
-                        </div>
-                        <div data-field="elevation" class="site-field">
-                            <span class="site-label">Elevation</span>
-                            <span class="site-data"></span> <span class="elevation-units">m</span>
-                        </div>
-                        <div class="site-link">
-                            <a>View data for this site</a>
-                        </div>
+                        <table class="marker-info">
+                            <tr class="site-field" data-field="code">
+                                <th class="site-label">Site Code</th>
+                                <td class="site-data"></td>
+                            </tr>
+                            <tr class="site-field" data-field="name">
+                                <th>Site Name</th>
+                                <td class="site-data"></td>
+                            </tr>
+                            <tr class="site-field" data-field="latitude">
+                                <th>Latitude</th>
+                                <td class="site-data"></td>
+                            </tr>
+                            <tr class="site-field" data-field="longitude">
+                                <th>Longitude</th>
+                                <td class="site-data"></td>
+                            </tr>
+                            <tr class="site-field" data-field="elevation">
+                                <th>Elevation</th>
+                                <td><span class="site-data"></span> <span class="elevation-units">m</span></td>
+                            </tr>
+                            <tr class="site-field" data-field="latest-measurement">
+                                <th>Latest Measurement</th>
+                                <td><span class="site-data"></span></td>
+                            </tr>
+                            <tr class="site-link">
+                                <td colspan="2"><a>View data for this site</a></td>
+                            </tr>
+                        </table>
                     </div>
                 </div>
             </script>
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/device_detail.html b/src/dataloaderinterface/templates/dataloaderinterface/device_detail.html
deleted file mode 100644
index cd8cd3e8..00000000
--- a/src/dataloaderinterface/templates/dataloaderinterface/device_detail.html
+++ /dev/null
@@ -1,243 +0,0 @@
-{% extends 'dataloaderinterface/base.html' %}
-{% load staticfiles %}
-
-{% block styles %}
-    {{ block.super }}
-    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css">
-    <link rel="stylesheet"
-          href="https://cdn.datatables.net/v/bs-3.3.6/dt-1.10.12/fh-3.1.2/r-2.1.0/sc-1.4.2/datatables.min.css"/>
-    <link rel="stylesheet" href="{% static 'dataloaderinterface/css/dialog-polyfill.css' %}">
-{% endblock %}
-
-{% block content %}
-    <div class="ribbon ribbon-green">
-
-    </div>
-
-    <div class="ribbon-container">
-        <div class="container ribbon-content mdl-color--white mdl-shadow--4dp">
-            <div class="row">
-                <section class="device-data col-lg-12">
-                    <header>
-                        <div class="page-title">
-                            {% if sampling_feature.sampling_feature_name %}
-                                {{ sampling_feature.sampling_feature_name }} ({{ sampling_feature.sampling_feature_code }})
-                            {% else %}
-                                {{ sampling_feature.sampling_feature_code }}
-                            {% endif %}
-                        </div>
-
-                        {% if messages %}
-                            {% for message in messages %}
-                                <p>{{ message }}</p>
-                            {% endfor %}
-                        {% endif %}
-
-                        <div class="row">
-                            <div class="col-xs-12 col-sm-6 site-tokens">
-                                <div class="input-group input-group-copy">
-                                    <span class="input-group-addon"><i class="material-icons">local_offer</i> Registration Token</span>
-                                    <input type="text" id="authToken" class="form-control click-select-all" readonly
-                                           aria-label="Registration Token"
-                                           value="{{ object.authentication_token }}">
-                                    <span class="input-group-addon clipboard-copy btn-copy"
-                                          data-target="authToken">Copy</span>
-                                </div>
-
-                                <br>
-
-                                <div class="input-group input-group-copy">
-                                    <span class="input-group-addon"><i class="material-icons">settings_remote</i> Sampling Feature UUID</span>
-                                    <input type="text" id="featureUUID" class="form-control click-select-all" readonly
-                                           aria-label="Sampling Feature UUID"
-                                           value="{{ sampling_feature.sampling_feature_uuid }}">
-                                    <span class="input-group-addon clipboard-copy btn-copy"
-                                          data-target="featureUUID">Copy</span>
-                                </div>
-                            </div>
-
-                        </div>
-                        <br>
-                    </header>
-
-
-                    <div class="row">
-                        <div class="registration-data col-xs-12 col-sm-6">
-                            {# Deployment fields #}
-
-                            <table class="mdl-data-table mdl-js-data-table mdl-data-table-no-hover full-width">
-                                <tr>
-                                    <td class="mdl-data-table__cell--non-numeric">Deployment by</td>
-                                    <td class="mdl-data-table__cell--non-numeric">{{ affiliation }}</td>
-                                </tr>
-
-                                <tr>
-                                    <td class="mdl-data-table__cell--non-numeric">Deployment Date</td>
-                                    <td class="mdl-data-table__cell--non-numeric">{{ deployment.begin_datetime }}</td>
-                                </tr>
-
-                                <tr>
-                                    <td class="mdl-data-table__cell--non-numeric">Latitude</td>
-                                    <td class="mdl-data-table__cell--non-numeric">{{ site.latitude }}</td>
-                                </tr>
-
-                                <tr>
-                                    <td class="mdl-data-table__cell--non-numeric">Longitude</td>
-                                    <td class="mdl-data-table__cell--non-numeric">{{ site.longitude }}</td>
-                                </tr>
-
-                                <tr>
-                                    <td class="mdl-data-table__cell--non-numeric">Elevation (m)</td>
-                                    <td class="mdl-data-table__cell--non-numeric">{{ sampling_feature.elevation_m }}</td>
-                                </tr>
-
-                                <tr>
-                                    <td class="mdl-data-table__cell--non-numeric">Site Type</td>
-                                    <td class="mdl-data-table__cell--non-numeric">{{ site.site_type_id }}</td>
-                                </tr>
-
-                                <tr>
-                                    <td class="mdl-data-table__cell--non-numeric">Deployment Method</td>
-                                    <td class="mdl-data-table__cell--non-numeric"><span>{{ deployment.method }}</span></td>
-                                </tr>
-
-                            </table>
-
-                        </div>
-
-                        <div class="detail-map-container col-xs-12 col-sm-6">
-                            <div id="map"></div>
-                            <input type="hidden" id="site-latitude" value="{{ site.latitude }}">
-                            <input type="hidden" id="site-longitude" value="{{ site.longitude }}">
-                        </div>
-                    </div>
-
-                    <div class="row">
-                        <div class="col-xs-12">
-                            <table>
-                                <tr>
-                                    <td><i class="material-icons text-muted">watch_later</i>&nbsp;&nbsp;</td>
-                                    <td><h5 class="section-title">Recent Measurements</h5></td>
-                                </tr>
-                            </table>
-                        </div>
-
-                        <div class="sparkline-plots col-xs-12">
-                            <div class="alert alert-warning" role="alert">Only last 24 hours shown on sparkline plots
-                                and tables
-                            </div>
-                            <div class="row">
-                                {% for feature_action in feature_actions %}
-                                    {% with feature_action.results.all.0 as result %}
-                                        <div class="col-xs-12 col-sm-6">
-                                            <div class="plot_box mdl-card" data-result-id="{{ result.result_id }}"
-                                                 data-variable-name="{{ result.variable.variable_name_id }}"
-                                                 data-variable-code="{{ result.variable.variable_code }}">
-
-                                                <div class="mdl-card__actions mdl-card--border mdl-card__supporting-text">
-                                                    <div class="input-group input-group-copy pull-left">
-                                                        <span class="input-group-addon">Result UUID</span>
-                                                        <input type="text" id="resultUUID{{ forloop.counter }}"
-                                                               class="form-control click-select-all" readonly
-                                                               aria-label="Amount (to the nearest dollar)"
-                                                               value="{{ result.result_uuid }}">
-                                                        <span class="input-group-addon clipboard-copy btn-copy"
-                                                              data-target="resultUUID{{ forloop.counter }}">Copy</span>
-                                                    </div>
-
-                                                    <span id="table-trigger-{{ forloop.counter0 }}"
-                                                          class="fa fa-table fa-2x table-trigger"
-                                                          aria-hidden="true"></span>
-                                                    <div class="mdl-tooltip mdl-tooltip--left"
-                                                         data-mdl-for="table-trigger-{{ forloop.counter0 }}">
-                                                        View Data Table
-                                                    </div>
-                                                </div>
-
-                                                <div class="variable-name">
-                                                    <strong>{{ result.variable.variable_name_id }} </strong><span
-                                                        class="variable-code">({{ result.variable.variable_code }})</span>
-                                                </div>
-
-                                                <table class="full-width">
-                                                    <tr>
-                                                        <td class="variable-description">
-                                                            <div class="variable-data text-center">
-                                                                <div class="latest-value">{{ result.timeseriesresult.values.last.data_value|floatformat:-3 }}</div>
-                                                                <div class="unit">{{ result.unit.unit_abbreviation }}</div>
-                                                            </div>
-                                                        </td>
-                                                        <td>
-                                                            <div id="graph{{ forloop.counter0 }}" class="graph-container"></div>
-                                                        </td>
-                                                    </tr>
-                                                </table>
-                                            </div>
-                                        </div>
-                                    {% endwith %}
-                                {% endfor %}
-                            </div>
-                        </div>
-                    </div>
-                </section>
-            </div>
-        </div>
-    </div>
-
-    <div id="clipboard-snackbar" class="mdl-js-snackbar mdl-snackbar">
-        <div class="mdl-snackbar__text"></div>
-        <button class="mdl-snackbar__action hidden" type="button"></button>
-    </div>
-
-    <dialog class="mdl-dialog" id="data-table-dialog">
-        <h4 class="mdl-dialog__title">Temperature (Mayfly-Temp)</h4>
-
-        <div class="mdl-dialog__content">
-            <div class="measurements-table">
-                {#                            <button data-result-id#}
-                {#                                    class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect pull-right download-data-button">#}
-                {#                                <i class="fa fa-download" aria-hidden="true"></i> Download <span#}
-                {#                                    class="variable-name"></span> Raw Data#}
-                {#                            </button>#}
-
-                {% for feature_action in feature_actions %}
-                    {% with feature_action.results.first as result %}
-                        <table class="table table-striped table-bordered data-values {{ result.variable.variable_code }}"
-                               cellspacing="0" width="100%" data-result-id="{{ result.result_id }}">
-                            <thead>
-                            <tr>
-                                <th>Timestamp</th>
-                                <th>Value</th>
-                            </tr>
-                            </thead>
-
-                            <tbody>
-                            {% for series_value in result.timeseriesresult.values.recent %}
-                                <tr>
-                                    <td>{{ series_value.value_datetime }}</td>
-                                    <td>{{ series_value.data_value }}</td>
-                                </tr>
-                            {% endfor %}
-                            </tbody>
-                        </table>
-                    {% endwith %}
-                {% endfor %}
-            </div>
-        </div>
-        <div class="mdl-dialog__actions">
-            <button type="button" class="mdl-button dialog-close">Close</button>
-        </div>
-    </dialog>
-
-{% endblock %}
-
-{% block scripts %}
-    {{ block.super }}
-    <script src="https://d3js.org/d3.v4.min.js"></script>
-    <script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
-    <script src="{% static 'dataloaderinterface/js/device-detail.js' %}"></script>
-    <script src="{% static 'dataloaderinterface/js/dialog-polyfill.js' %}"></script>
-    <script src="{% static 'dataloaderinterface/js/copyToClipboard.js' %}"></script>
-    <script async defer
-            src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAiUxiuZaPEPtB4EhAquguz7kNzYU7bnnc&callback=initMap"></script>
-{% endblock %}
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/footer.html b/src/dataloaderinterface/templates/dataloaderinterface/footer.html
index 0cc8df5f..a418def1 100644
--- a/src/dataloaderinterface/templates/dataloaderinterface/footer.html
+++ b/src/dataloaderinterface/templates/dataloaderinterface/footer.html
@@ -19,7 +19,7 @@ <h5> All content on this website is licensed as <a target="_blank"
 
         <div class="col-xs-12 col-sm-3">
             <h5 class="footer-section-title">PRESENTED BY</h5>
-            <h5>EnviroDIY™ is presented by <a href="http://www.stroudcenter.org/ " target="_blank">Stroud Water Research
+            <h5>EnviroDIY™ is presented by <a href="https://www.stroudcenter.org/ " target="_blank">Stroud Water Research
                 Center</a>, which seeks to advance knowledge and stewardship of fresh water through research, education,
                 and restoration.</h5>
             <img id="stroud-logo" src="{% static 'dataloaderinterface/images/logo_stroud.png' %}"
@@ -34,8 +34,8 @@ <h5>EnviroDIY™ is presented by <a href="http://www.stroudcenter.org/ " target=
         <div class="col-xs-12 col-sm-3">
             <h5 class="footer-section-title">DEVELOPED BY</h5>
             <h5>Utah Water Research Laboratory at Utah State University with contributions from <a
-                    href="http://www.stroudcenter.org/" target="_blank">Stroud Water Research Center</a> and <a
-                    href="http://www.limno.com/" target="_blank">LimnoTech</a></h5>
+                    href="https://www.stroudcenter.org/" target="_blank">Stroud Water Research Center</a> and <a
+                    href="https://www.limno.com/" target="_blank">LimnoTech</a></h5>
         </div>
 
         <div class="col-xs-12 visible-xs">
@@ -44,12 +44,12 @@ <h5>Utah Water Research Laboratory at Utah State University with contributions f
 
         <div class="col-xs-12 col-sm-3">
             <h5 class="footer-section-title">WITH SUPPORT FROM</h5>
-            <h5><a href="http://www.williampennfoundation.org/" target="_blank">William Penn Foundation</a></h5>
+            <h5><a href="https://www.williampennfoundation.org/" target="_blank">William Penn Foundation</a></h5>
             <h5><a href="https://www.nsf.gov/index.jsp" target="_blank">National Science Foundation</a> awards <a
                     href="https://www.nsf.gov/awardsearch/showAward?AWD_ID=1331856" target="_blank">EAR-1331856</a>
                 and <a href="https://www.nsf.gov/awardsearch/showAward?AWD_ID=1339834" target="_blank">ACI-1339834</a>
             </h5>
-            <h5><a href="http://www.stroudcenter.org/" target="_blank">Stroud Water Research Center</a></h5>
+            <h5><a href="https://www.stroudcenter.org/" target="_blank">Stroud Water Research Center</a></h5>
         </div>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/index.html b/src/dataloaderinterface/templates/dataloaderinterface/index.html
index 1c05e9a8..cae02e81 100644
--- a/src/dataloaderinterface/templates/dataloaderinterface/index.html
+++ b/src/dataloaderinterface/templates/dataloaderinterface/index.html
@@ -31,7 +31,7 @@ <h4 class="text-center"><a href="{% url 'user_registration' %}">SIGN UP</a></h4>
                     <div class="text-center section-title">How it works</div>
                     <div class="row">
                         <div class="col-xs-10 col-xs-offset-1 col-md-8 col-md-offset-2">
-                            <div class="row">
+                            <div class="row" id="how-it-works">
                                 <div class="col-xs-12 col-sm-4 text-center">
                                     <div class="card">
                                         <h3 class="step-number">1</h3>
@@ -88,7 +88,7 @@ <h4 class="text-left">A community of enthusiasts sharing do-it-yourself ideas fo
                             science and
                             monitoring
                         </h4>
-                        <h4 class="visit-link text-left"><a href="http://envirodiy.org/" target="_blank">VISIT SITE <i
+                        <h4 class="visit-link text-left"><a href="https://envirodiy.org/" target="_blank">VISIT SITE <i
                                 class="glyphicon glyphicon-chevron-right"></i></a></h4>
                     </div>
                 </div>
@@ -102,7 +102,7 @@ <h4 class="visit-link text-left"><a href="http://envirodiy.org/" target="_blank"
                         <h3 class="text-left">WikiWatershed</h3>
                         <h4 class="text-left">Web tools for collaboratively advancing knowledge and stewardship of fresh
                             water</h4>
-                        <h4 class="visit-link text-left"><a href="http://wikiwatershed.org/" target="_blank">VISIT SITE
+                        <h4 class="visit-link text-left"><a href="https://wikiwatershed.org/" target="_blank">VISIT SITE
                             <i class="glyphicon glyphicon-chevron-right"></i></a></h4>
                     </div>
                 </div>
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/my-sites.html b/src/dataloaderinterface/templates/dataloaderinterface/my-sites.html
index 76a3efe6..20045f59 100644
--- a/src/dataloaderinterface/templates/dataloaderinterface/my-sites.html
+++ b/src/dataloaderinterface/templates/dataloaderinterface/my-sites.html
@@ -4,13 +4,24 @@
 {% block content %}
     <div class="container">
         <div class="row">
-            <section class="sites-list col-lg-12">
+            <section class="sites-list col-xs-12 col-sm-5">
                 <div class="page-title">Registered Sites</div>
             </section>
+            <div class="col-xs-12 col-sm-7 text-right">
+                <a href="{% url 'status' %}"
+                   class="button-link my-sites-action mdl-button mdl-js-button mdl-button--raised mdl-button--default mdl-js-ripple-effect">
+                    <i class="material-icons center-icon">assignment</i> Status
+                </a>
+                <a href="{% url 'site_registration' %}" id="btn-new-site"
+                   class="button-link my-sites-action mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                    <i class="material-icons center-icon">add_circle_outline</i> Register A New Site
+                </a>
+                <br><br>
+            </div>
         </div>
     </div>
 
-    <div class="container-fluid">
+    <div class="container">
         <div class="row">
             <div class="full-width-map-container my-sites">
                 <div id="map"></div>
@@ -21,134 +32,225 @@
     <div class="container main-content">
         <div class="row">
             <div class="col-xs-12">
-                <br>
-                <a href="{% url 'site_registration' %}">
-                    <button id="btn-add-new-site"
-                            class="mdl-button mdl-js-button mdl-button--fab
-                   mdl-button--mini-fab mdl-js-ripple-effect mdl-button--colored">
-                        <i class="material-icons">add</i>
-                    </button>
-                </a>
-
-                <div class="mdl-tooltip" data-mdl-for="btn-add-new-site">
-                    Add New Site
-                </div>
+                <h4>My sites</h4>
             </div>
+            {% if sites %}
+                {% for site in sites %}
+                    <div class="col-xs-12 col-sm-4 col-md-3 site" data-site="{{ site.sampling_feature_id }}">
+                        <div class="mdl-card mdl-shadow--2dp site-card">
+                            <div class="mdl-card__title">
+                                <h2 class="mdl-card__title-text"><a href="{% url 'site_detail' site.sampling_feature_code %}">{{ site.sampling_feature_name }}</a></h2>
+                            </div>
 
-            {% for registration in object_list %}
-                <div class="col-xs-12 col-sm-3 site" data-site="{{ registration.sampling_feature.sampling_feature_id }}">
-                    <div class="mdl-card mdl-shadow--2dp site-card">
-                        <div class="mdl-card__title">
-                            <h2 class="mdl-card__title-text">{{ registration.device_name }}</h2>
-                        </div>
-
-                        <div class="mdl-card__supporting-text">
-                            <table>
-                                <tbody>
-                                <tr>
-                                    <td><i class="material-icons site-card-icon">settings_remote</i></td>
-                                    <td>
-                                        <span> Sampling Feature</span>
-                                    </td>
-                                </tr>
-                                <tr>
-                                    <td></td>
-                                    <td><strong>{{ registration.sampling_feature }}</strong></td>
-                                </tr>
-                                </tbody>
-                            </table>
-                            <br>
-                            <table>
-                                <tbody>
-                                <tr>
-                                    <td><i class="material-icons site-card-icon">today</i></td>
-                                    <td>
-                                        <span> Registration Date</span>
-                                    </td>
-                                </tr>
-                                <tr>
-                                    <td></td>
-                                    <td><strong>{{ registration.registration_date }}</strong></td>
-                                </tr>
-                                </tbody>
-                            </table>
-                        </div>
+                            <div class="mdl-card__supporting-text">
+                                <table>
+                                    <tbody>
+                                    <tr>
+                                        <td><i class="material-icons site-card-icon">settings_remote</i></td>
+                                        <td>
+                                            <span style="color:#92d050;"> Sampling Feature</span>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td></td>
+                                        <td>{{ site.sampling_feature_name }}</td>
+                                    </tr>
+                                    </tbody>
+                                </table>
+                                <br>
+                                <table>
+                                    <tbody>
+                                    <tr>
+                                        <td><i class="material-icons site-card-icon">today</i></td>
+                                        <td>
+                                            <span style="color:#92d050;"> Registration Date</span>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td></td>
+                                        <td>{{ site.registration_date }}</td>
+                                    </tr>
+                                    </tbody>
+                                </table>
+                                <br>
+                                {% with latest_result=site.sampling_feature.latest_updated_result %}
+                                    {% if latest_result %}
+                                    <table>
+                                        <tbody>
+                                        <tr>
+                                            <td><i class="material-icons site-card-icon">query_builder</i></td>
+                                            <td>
+                                                <span style="color:#92d050;"> Latest Measurement</span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                            <td>{{ latest_result.result_datetime }} ({{ latest_result.result_datetime|timesince }} ago)</td>
+                                        </tr>
+                                        </tbody>
+                                    </table>
+                                    {% endif %}
+                                {% endwith %}
+                            </div>
 
-                        <div class="mdl-card__actions mdl-card--border">
-                            <a href="{% url 'site_detail' registration.registration_id %}"
-                               class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
-                                VIEW SITE
-                            </a>
+                            <div class="mdl-card__menu">
+                                <!-- Right aligned menu below button -->
+                                <button id="site-card-menu-{{ forloop.counter0 }}"
+                                        class="mdl-button mdl-js-button mdl-button--icon view-on-map">
+                                    <i class="material-icons">map</i>
+                                </button>
+                                <div class="mdl-tooltip" data-mdl-for="site-card-menu-{{ forloop.counter0 }}">
+                                    View on map
+                                </div>
+                            </div>
                         </div>
+                    </div>
+                {% endfor %}
+            {% else %}
+                <div class="col-xs-12">
+                    <p>No sites to display</p>
+                </div>
+            {% endif %}
 
-                        <div class="mdl-card__menu">
-                            <!-- Right aligned menu below button -->
-                            <button id="site-card-menu-{{ forloop.counter0 }}"
-                                    class="mdl-button mdl-js-button mdl-button--icon">
-                                <i class="material-icons">more_vert</i>
-                            </button>
+            <div class="col-xs-12">
+                <h4 style="margin-top: 40px;">Followed Sites</h4>
+            </div>
+            {% if followed_sites %}
+                {% for site in followed_sites %}
+                    <div class="col-xs-12 col-sm-4 col-md-3 site" data-site="{{ site.sampling_feature_id }}">
+                        <div class="mdl-card mdl-shadow--2dp site-card">
+                            <div class="mdl-card__title">
+                                <h2 class="mdl-card__title-text"><a href="{% url 'site_detail' site.sampling_feature_code %}">{{ site.sampling_feature_name }}</a></h2>
+                            </div>
 
-                            <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
-                                for="site-card-menu-{{ forloop.counter0 }}">
-                                <li class="mdl-menu__item view-on-map">
-                                    <span class="mdl-list__item-primary-content">
-                                        View on map
-                                    </span>
-                                </li>
-                            </ul>
+                            <div class="mdl-card__supporting-text">
+                                <table>
+                                    <tbody>
+                                    <tr>
+                                        <td><i class="material-icons site-card-icon">settings_remote</i></td>
+                                        <td>
+                                            <span style="color:#92d050;"> Sampling Feature</span>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td></td>
+                                        <td>{{ site.sampling_feature_name }}</td>
+                                    </tr>
+                                    </tbody>
+                                </table>
+                                <br>
+                                <table>
+                                    <tbody>
+                                    <tr>
+                                        <td><i class="material-icons site-card-icon">today</i></td>
+                                        <td>
+                                            <span style="color:#92d050;"> Registration Date</span>
+                                        </td>
+                                    </tr>
+                                    <tr>
+                                        <td></td>
+                                        <td>{{ site.registration_date }}</td>
+                                    </tr>
+                                    </tbody>
+                                </table>
+                                <br>
+                                {% with latest_result=site.sampling_feature.latest_updated_result %}
+                                    {% if latest_result %}
+                                    <table>
+                                        <tbody>
+                                        <tr>
+                                            <td><i class="material-icons site-card-icon">query_builder</i></td>
+                                            <td>
+                                                <span style="color:#92d050;"> Latest Measurement</span>
+                                            </td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                            <td>{{ latest_result.result_datetime }} ({{ latest_result.result_datetime|timesince }} ago)</td>
+                                        </tr>
+                                        </tbody>
+                                    </table>
+                                    {% endif %}
+                                {% endwith %}
+                            </div>
+                            <div class="mdl-card__menu">
+                                <!-- Right aligned menu below button -->
+                                <button id="site-card-menu-{{ forloop.counter0 }}"
+                                        class="mdl-button mdl-js-button mdl-button--icon view-on-map">
+                                    <i class="material-icons">map</i>
+                                </button>
+                                <div class="mdl-tooltip" data-mdl-for="site-card-menu-{{ forloop.counter0 }}">
+                                    View on map
+                                </div>
+                            </div>
                         </div>
-
                     </div>
+                {% endfor %}
+            {% else %}
+                <div class="col-xs-12">
+                    <p>No followed sites to display</p>
                 </div>
-            {% endfor %}
-
+            {% endif %}
         </div>
 
         <script id="sites-data" type="application/json">
             [
-            {% for registration in object_list %}
-                {% with sampling_feature=registration.sampling_feature %}
-                {
-                    "id": "{{ sampling_feature.sampling_feature_id }}",
-                    "code": "{{ sampling_feature.sampling_feature_code }}",
-                    "name": "{{ sampling_feature.sampling_feature_name }}",
-                    "latitude": {{ sampling_feature.site.latitude|default_if_none:0 }},
-                    "longitude": {{ sampling_feature.site.longitude|default_if_none:0 }},
-                    "elevation": {{ sampling_feature.elevation_m|default_if_none:'""' }},
-                    "detail_link": "{% if registration %}{% url 'site_detail' registration.registration_id %}{% endif %}"
-                }{% if not forloop.last %},{% endif %}
-                {% endwith %}
+            {% for site in sites %}
+                 {
+                    "id": "{{ site.sampling_feature_id }}",
+                    "code": "{{ site.sampling_feature_code }}",
+                    "name": "{{ site.sampling_feature_name }}",
+                    "latitude": {{ site.latitude|default_if_none:0 }},
+                    "longitude": {{ site.longitude|default_if_none:0 }},
+                    "elevation": {{ site.elevation_m|default_if_none:'""' }},
+                    "latest-measurement": "{% if site.latest_measurement.value_datetime %}{{ site.latest_measurement.value_datetime }} ({{ site.latest_measurement.value_datetime|timesince }} ago){% else %}-{% endif %}",
+                    "detail_link": "{% url 'site_detail' site.sampling_feature_code %}"
+                 }{% if not forloop.last %},{% endif %}
+            {% endfor %}
+            {% for site in followed_sites %}
+                 {
+                    "id": "{{ site.sampling_feature_id }}",
+                    "code": "{{ site.sampling_feature_code }}",
+                    "name": "{{ site.sampling_feature_name }}",
+                    "latitude": {{ site.latitude|default_if_none:0 }},
+                    "longitude": {{ site.longitude|default_if_none:0 }},
+                    "elevation": {{ site.elevation_m|default_if_none:'""' }},
+                    "latest-measurement": "{% if site.latest_measurement.value_datetime %}{{ site.latest_measurement.value_datetime }} ({{ site.latest_measurement.value_datetime|timesince }} ago){% else %}-{% endif %}",
+                    "detail_link": "{% url 'site_detail' site.sampling_feature_code %}"
+                 }{% if not forloop.last %},{% endif %}
             {% endfor %}
             ]
         </script>
 
         <script id="site-marker-content" type="text/plain">
-            <div>
-                <div id="marker-content">
-                    <div data-field="code" class="site-field">
-                        <span class="site-label">Site Code</span>
-                        <span class="site-data"></span>
-                    </div>
-                    <div data-field="name" class="site-field">
-                        <span class="site-label">Site Name</span>
-                        <span class="site-data"></span>
-                    </div>
-                    <div data-field="latitude" class="site-field">
-                        <span class="site-label">Latitude</span>
-                        <span class="site-data"></span>
-                    </div>
-                    <div data-field="longitude" class="site-field">
-                        <span class="site-label">Longitude</span>
-                        <span class="site-data"></span>
-                    </div>
-                    <div data-field="elevation" class="site-field">
-                        <span class="site-label">Elevation</span>
-                        <span class="site-data"></span> <span class="elevation-units">m</span>
-                    </div>
-                    <div class="site-link">
-                        <a>View data for this site</a>
-                    </div>
-                </div>
+            <table class="marker-info">
+                <tr data-field="code" class="site-field">
+                    <th><span class="site-label">Site Code</span></th>
+                    <td><span class="site-data"></span></td>
+                </tr>
+                <tr data-field="name" class="site-field">
+                    <th><span class="site-label">Site Name</span></th>
+                    <td><span class="site-data"></span></td>
+                </tr>
+                <tr data-field="latitude" class="site-field">
+                    <th><span class="site-label">Latitude</span></th>
+                    <td><span class="site-data"></span></td>
+                </tr>
+                <tr data-field="longitude" class="site-field">
+                    <th><span class="site-label">Longitude</span></th>
+                    <td><span class="site-data"></span></td>
+                </tr>
+                <tr data-field="elevation" class="site-field">
+                    <th><span class="site-label">Elevation</span></th>
+                    <td><span class="site-data"></span> <span class="elevation-units">m</span></td>
+                </tr>
+                <tr data-field="latest-measurement" class="site-field">
+                    <th><span class="site-label">Latest Measurement</span></th>
+                    <td><span class="site-data"></span></td>
+                </tr>
+                <tr class="site-link">
+                    <td colspan="2"><a>View data for this site</a></td>
+                </tr>
             </div>
         </script>
     </div>
@@ -166,6 +268,8 @@ <h2 class="mdl-card__title-text">{{ registration.device_name }}</h2>
 
 {% block scripts %}
     {{ block.super }}
+    <script src="{% static 'dataloaderinterface/js/bootstrap-toolkit.min.js' %}"></script>
     <script src="{% static 'dataloaderinterface/js/my-sites.js' %}"></script>
+
     <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAiUxiuZaPEPtB4EhAquguz7kNzYU7bnnc&callback=initMap"></script>
 {% endblock %}
\ No newline at end of file
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/site_details.html b/src/dataloaderinterface/templates/dataloaderinterface/site_details.html
new file mode 100644
index 00000000..d59d6e57
--- /dev/null
+++ b/src/dataloaderinterface/templates/dataloaderinterface/site_details.html
@@ -0,0 +1,386 @@
+{% extends 'dataloaderinterface/base.html' %}
+{% load staticfiles %}
+{% load site %}
+
+{% block styles %}
+    {{ block.super }}
+    <link rel="stylesheet" href="{% static 'dataloaderinterface/css/dialog-polyfill.css' %}">
+{% endblock %}
+
+{% block forced_scripts %}
+    <script src="{% static 'dataloaderinterface/js/papaparse.min.js' %}"></script>
+{% endblock %}
+
+{% block content %}
+    <div class="ribbon ribbon-green"></div>
+
+    <div class="ribbon-container">
+        <div class="container ribbon-content mdl-color--white mdl-shadow--4dp">
+            <div class="row">
+                <section class="device-data col-sm-12">
+                    <header>
+                        <div class="page-title">
+                            {% if site.sampling_feature_name %}
+                                {{ site.sampling_feature_name }} ({{ site.sampling_feature_code }})
+                            {% else %}
+                                {{ site.sampling_feature_code }}
+                            {% endif %}
+                        </div>
+                        <div class="buttons-toolbar">
+                            <div class="row">
+                                    <div class="col-xs-12 col-sm-5">
+                                    {% if site.django_user_id != request.user.id %}
+                                        <div class="follow-status {% if is_followed %}following{% endif %}">
+
+                                            <span id="follow-chip" class="mdl-chip chip-follow mdl-chip--contact">
+                                                <span id="follow-text" class="mdl-chip__text">
+                                                    You are following this site&nbsp;
+                                                    <i class="fa fa-check-circle-o text-green" aria-hidden="true"></i>
+                                                </span>
+                                            </span>
+
+                                            {# this is the button to trigger the follow/unfollow action #}
+                                            <form id="follow-site-form">
+                                                {% csrf_token %}
+                                                <input name="sampling_feature_code" type="hidden" value="{{ site.sampling_feature_code }}">
+                                            </form>
+
+                                            <button id="btn-follow"
+                                                    class="btn-follow mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored">
+                                                <i id="icon-follow" class="material-icons">add</i>
+                                                <i id="icon-unfollow" class="material-icons">remove</i>
+                                            </button>
+
+                                            <div class="mdl-tooltip" data-mdl-for="btn-follow">
+                                                {% if is_followed %}
+                                                    Unfollow
+                                                {% else %}
+                                                    Follow
+                                                {% endif %}
+                                            </div>
+                                        </div>
+                                    {% endif %}
+                                    </div>
+
+                                {# TODO: make and use template tag  #}
+                                {% if site.django_user_id == request.user.id or request.user.is_staff %}
+                                    <div class="col-xs-12 col-sm-7 text-right">
+                                        <div class="row">
+                                            <div class="col-sm-5 col-xs-12">
+                                                <a href="#" data-toggle="modal" data-target="#code-output-modal"
+                                                   class="button-link mdl-button mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect"
+                                                   id="code-visiblity-toggle">
+                                                    <i class="material-icons center-icon clickable-float-left">code</i>
+                                                    View code snippet
+                                                </a>
+                                            </div>
+                                            <div class="col-sm-3 col-xs-12">
+                                                <a href="{% url 'site_update' site.sampling_feature_code %}"
+                                                   id="btn-edit-site"
+                                                   class="button-link mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                                                    <i class="material-icons center-icon">mode_edit</i> Edit Site
+                                                </a>
+                                            </div>
+                                            <div class="col-sm-4 col-xs-12">
+                                                <a href="#" id="btn-delete-site"
+                                                   class="button-link mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                                                    <i class="material-icons center-icon">delete_forever</i> Delete Site
+                                                </a>
+                                            </div>
+                                        </div>
+                                    </div>
+                                {% endif %}
+                            </div>
+                        </div>
+
+                        {% if messages %}
+                            {% for message in messages %}
+                                <p>{{ message }}</p>
+                            {% endfor %}
+                        {% endif %}
+                    </header>
+
+                    <div class="row">
+                        <div class="registration-data col-xs-12 col-sm-6">
+                            {# Deployment fields #}
+                            <table class="mdl-data-table mdl-js-data-table mdl-data-table-no-hover full-width">
+                                <tr>
+                                    <td class="mdl-data-table__cell--non-numeric" id="site-table-header" colspan="2">
+                                        Details for {{ site.sampling_feature_code }}
+                                    </td>
+                                </tr>
+
+                                <tr>
+                                    <td class="mdl-data-table__cell--non-numeric">
+                                        <i class="fa fa-user-o" aria-hidden="true"></i> Deployment By
+                                    </td>
+                                    <td class="mdl-data-table__cell--non-numeric">{{ site.person }} - {{ site.organization }}</td>
+                                </tr>
+
+                                <tr>
+                                    <td class="mdl-data-table__cell--non-numeric">
+                                        <i class="material-icons">today</i> Registration Date
+                                    </td>
+                                    <td class="mdl-data-table__cell--non-numeric">{{ site.registration_date }}</td>
+                                </tr>
+
+                                <tr>
+                                    <td class="mdl-data-table__cell--non-numeric">
+                                        <i class="fa fa-calendar-check-o" aria-hidden="true"></i> Deployment Date
+                                    </td>
+                                    <td class="mdl-data-table__cell--non-numeric">{{ site.deployment_date }}</td>
+                                </tr>
+
+                                <tr>
+                                    <td class="mdl-data-table__cell--non-numeric">
+                                        <i class="fa fa-map-marker" aria-hidden="true"></i> Latitude
+                                    </td>
+                                    <td class="mdl-data-table__cell--non-numeric">{{ site.latitude }}</td>
+                                </tr>
+
+                                <tr>
+                                    <td class="mdl-data-table__cell--non-numeric">
+                                        <i class="fa fa-map-marker" aria-hidden="true"></i> Longitude
+                                    </td>
+                                    <td class="mdl-data-table__cell--non-numeric">{{ site.longitude }}</td>
+                                </tr>
+
+                                <tr>
+                                    <td class="mdl-data-table__cell--non-numeric">
+                                        <i class="fa fa-long-arrow-up" aria-hidden="true"></i> Elevation (m)
+                                    </td>
+                                    <td class="mdl-data-table__cell--non-numeric">{{ site.elevation_m }}</td>
+                                </tr>
+
+                                <tr>
+                                    <td class="mdl-data-table__cell--non-numeric">
+                                        <i class="fa fa-circle" aria-hidden="true"></i> Site Type
+                                    </td>
+                                    <td class="mdl-data-table__cell--non-numeric">{{ site.site_type }}</td>
+                                </tr>
+                            </table>
+                        </div>
+
+                        <div class="detail-map-container col-xs-12 col-sm-6">
+                            <div id="map"></div>
+                            <input type="hidden" id="site-latitude" value="{{ site.latitude }}">
+                            <input type="hidden" id="site-longitude" value="{{ site.longitude }}">
+                        </div>
+                    </div>
+
+                    <div class="row">
+                        <div class="col-xs-12">
+                            <table>
+                                <tr>
+                                    <td><i class="material-icons text-muted">query_builder</i>&nbsp;&nbsp;</td>
+                                    <td><h5 class="section-title">Recent Measurements</h5></td>
+                                </tr>
+                            </table>
+                        </div>
+
+                        <div class="sparkline-plots col-xs-12">
+                            <div class="alert alert-info" role="alert">Only the most recent 72 hours of available data
+                                are shown on the sparkline plots. The plots are broken when there are gaps in the data
+                                longer than 6 hours. Plots shaded in green have recent data. Plots shaded in red have
+                                not reported data in the last 72 hours.
+                            </div>
+                            <div class="row">
+                                {% for sensor in site.sensors.all %}
+                                <div class="col-xs-12 col-sm-6">
+                                    <div class="plot_box mdl-card mdl-shadow--2dp" data-result-id="{{ sensor.result_id }}"
+                                         data-variable-name="{{ sensor.variable_name }}"
+                                         data-variable-code="{{ sensor.variable_code }}"
+                                         data-csv-path="{% static sensor|get_sensor_csv_path %}">
+
+                                        <div class="mdl-card__actions mdl-card--border mdl-card__supporting-text">
+                                            <div class="row">
+                                                <div class="col-xs-12 col-md-5 pull-right">
+                                                    {#  View data table button  #}
+                                                    <span id="table-trigger-{{ forloop.counter0 }}"
+                                                          class="fa fa-table table-trigger pull-right white-shadow"
+                                                          aria-hidden="true"></span>
+                                                    <div class="mdl-tooltip mdl-tooltip--left"
+                                                         data-mdl-for="table-trigger-{{ forloop.counter0 }}">
+                                                        View Data Table
+                                                    </div>
+
+                                                    {#  Download data button  #}
+                                                    <a href="{% static sensor|get_sensor_csv_path %}">
+                                                        <span id="download-trigger-{{ forloop.counter0 }}"
+                                                              class="fa fa-cloud-download download-trigger pull-right white-shadow"></span>
+                                                    </a>
+                                                    <div class="mdl-tooltip mdl-tooltip--left"
+                                                         data-mdl-for="download-trigger-{{ forloop.counter0 }}">
+                                                        Download Data
+                                                    </div>
+
+                                                    {#  View on TSA button  #}
+                                                    {# TODO: (Juan) Add to url patterns #}
+                                                    <a target="_blank" href="http://data.envirodiy.org/tsa/?sitecode={{ site.sampling_feature_code }}&variablecode={{ sensor.variable_code }}&view=visualization&plot=true">
+                                                        <span id="tsa-trigger-{{ forloop.counter0 }}"
+                                                           class="fa fa-external-link tsa-trigger pull-right white-shadow"
+                                                           aria-hidden="true"></span>
+                                                    </a>
+                                                    <div class="mdl-tooltip mdl-tooltip--left"
+                                                         data-mdl-for="tsa-trigger-{{ forloop.counter0 }}">
+                                                        Open in Time Series Analyst
+                                                    </div>
+                                                </div>
+                                                <div class="col-xs-12 col-md-7 white-shadow variable-info">
+                                                    <table>
+                                                        <tr>
+                                                            <td>Variable:</td>
+                                                            <th>{{ sensor.variable_name }} </th>
+                                                        </tr>
+                                                        <tr>
+                                                            <td>Medium:</td>
+                                                            <th>{{ sensor.sampled_medium }}</th>
+                                                        </tr>
+                                                        <tr>
+                                                            <td>Sensor:</td>
+                                                            <th>{{ sensor.make_model }}</th>
+                                                        </tr>
+                                                    </table>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <table class="full-width">
+                                            <tr>
+                                                <td class="variable-description">
+                                                    <div class="variable-data text-center">
+                                                        <div class="variable-name">{{ sensor.variable_name }}</div>
+                                                                <div class="latest-value"></div>
+                                                        <div class="unit">({{ sensor.unit_abbreviation }})</div>
+                                                    </div>
+                                                </td>
+                                                <td>
+                                                    <div id="graph{{ forloop.counter0 }}"
+                                                         class="graph-container">
+                                                    </div>
+                                                    <small style="margin-left:9px; display:block;"
+                                                           class="text-muted last-obs-container text-center">
+                                                        Date of last observation
+                                                        <div class="last-observation text-center">-</div>
+                                                    </small>
+                                                </td>
+                                            </tr>
+                                        </table>
+                                    </div>
+                                </div>
+                                {% endfor %}
+                            </div>
+                        </div>
+                    </div>
+                </section>
+            </div>
+        </div>
+    </div>
+
+    <div id="clipboard-snackbar" class="mdl-js-snackbar mdl-snackbar">
+        <div class="mdl-snackbar__text"></div>
+        <button class="mdl-snackbar__action hidden" type="button"></button>
+    </div>
+
+    <dialog class="mdl-dialog" id="data-table-dialog">
+        <h4 class="mdl-dialog__title"></h4>
+
+        <div class="mdl-dialog__content">
+            <div class="measurements-table">
+                {% for sensor in site.sensors.all %}
+                    <table class="mdl-data-table mdl-shadow--2dp data-values" cellspacing="0"
+                           width="100%" data-result-id="{{ sensor.result_id }}">
+                        <thead>
+                            <tr>
+                                <th class="mdl-data-table__cell--non-numeric">
+                                    Timestamp
+                                </th>
+                                <th class="mdl-data-table__cell--non-numeric">
+                                    UTC Offset
+                                </th>
+                                <th>
+                                    Value
+                                </th>
+                            </tr>
+                        </thead>
+                        <tbody></tbody>
+                    </table>
+                {% endfor %}
+            </div>
+        </div>
+        <div class="mdl-dialog__actions">
+            <button type="button" class="mdl-button dialog-close">Close</button>
+        </div>
+    </dialog>
+
+     <dialog class="mdl-dialog" id="site-delete-dialog">
+        <h4 class="mdl-dialog__title">Delete Site</h4>
+        <div class="mdl-dialog__content">
+            <div>
+                <p>
+                    <strong>WARNING:</strong> All data associated with this site will be deleted.<br><br>
+                    <strong>Are you really really really sure you want to do this?</strong>
+                </p>
+            </div>
+        </div>
+        <div class="mdl-dialog__actions">
+            <form method="POST" action="{% url 'site_delete' site.sampling_feature_code %}">
+                {% csrf_token %}
+                <input type="submit" class="mdl-button confirm-delete" value="Delete Site">
+            </form>
+
+            <button type="button" class="mdl-button dialog-close">Close</button>
+        </div>
+    </dialog>
+
+    {% if site.django_user_id == request.user.id or request.user.is_staff %}
+    <div id="code-output-modal" class="modal fade" role="dialog" aria-hidden="true">
+        <div class="vertical-alignment-helper">
+            <div class="modal-dialog vertical-align-center">
+                <div class="modal-content">
+                    <div class="modal-header">
+                        <h4>Code Output</h4>
+                    </div>
+                    <div class="modal-body">
+
+                                <pre class="form-control" id="code-output">
+const char *REGISTRATION_TOKEN = "{{ site.registration_token }}";   // Device registration token
+const char *SAMPLING_FEATURE = "{{ site.sampling_feature.sampling_feature_uuid }}";     // Sampling feature UUID
+const char *UUIDs[] =                                                      // UUID array for device sensors
+{{% for sensor in site.sensors.all %}
+    "{{ sensor.result.result_uuid }}"{% if not forloop.last %},  {% else %}   {% endif %} // {{ sensor.variable_name }} ({{ sensor.variable_code }}){% endfor %}
+};</pre>
+
+                    </div>
+                    <div class="modal-footer">
+                        <button data-dismiss="modal"
+                                class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect">
+                            Close
+                        </button>
+                        <button
+                                class="clipboard-copy btn-copy mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent"
+                                data-target="code-output">
+                            <i class="material-icons">content_copy</i> Copy
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    {% endif %}
+{% endblock %}
+
+{% block services_urls %}
+    {{ block.super }}
+    <input id="follow-site-api" type="hidden" value="{% url 'follow_site' %}">
+{% endblock %}
+
+{% block scripts %}
+    {{ block.super }}
+    <script src="{% static 'dataloaderinterface/js/bootstrap-toolkit.min.js' %}"></script>
+    <script src="https://d3js.org/d3.v4.min.js"></script>
+    <script src="{% static 'dataloaderinterface/js/device-detail.js' %}"></script>
+    <script src="{% static 'dataloaderinterface/js/dialog-polyfill.js' %}"></script>
+    <script src="{% static 'dataloaderinterface/js/copyToClipboard.js' %}"></script>
+    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAiUxiuZaPEPtB4EhAquguz7kNzYU7bnnc&callback=initMap"></script>
+{% endblock %}
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/device_registration.html b/src/dataloaderinterface/templates/dataloaderinterface/site_registration.html
similarity index 65%
rename from src/dataloaderinterface/templates/dataloaderinterface/device_registration.html
rename to src/dataloaderinterface/templates/dataloaderinterface/site_registration.html
index 83fbb963..d0245d63 100644
--- a/src/dataloaderinterface/templates/dataloaderinterface/device_registration.html
+++ b/src/dataloaderinterface/templates/dataloaderinterface/site_registration.html
@@ -1,6 +1,7 @@
 {% extends 'dataloaderinterface/base.html' %}
 {% load staticfiles %}
 {% load widget_tweaks %}
+{% load site_form_util %}
 
 {% block content %}
     <div class="ribbon ribbon-blue">
@@ -11,7 +12,8 @@
             <div class="row">
                 <section class="device-data col-lg-12">
                     <header class="section-header">
-                        <div class="page-title">Register a Site</div>
+                        <div class="page-title">{% if request.resolver_match.view_name == "site_update" %}Edit Site
+                            Information{% else %}Register a Site{% endif %}</div>
                         {% if messages %}
                             {% for message in messages %}
                                 <span class="form-message {{ message.tags }}">{{ message }}</span>
@@ -25,25 +27,46 @@
                             <input name="user_first_name" type="hidden" value="{{ user.first_name }}">
                             <input name="user_last_name" type="hidden" value="{{ user.last_name }}">
 
-
                             <fieldset>
                                 <br>
                                 <div class="row">
                                     <div class="form-group col-sm-4 col-xs-12 sampling-feature-fields">
+                                        {% if user.is_staff %}
+                                            {% for field in action_by_form %}
+                                                <div class="form-field {% if field.field.required %} required-field{% endif %}{% if field.errors %} has-error{% endif %}"
+                                                     data-field="{{ field.name }}">
+                                                    <label class="control-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
+                                                    <i id="sampling-feature-help{{ forloop.counter0 }}" class="material-icons text-muted help-icon">help</i>
+                                                    {{ field.errors }}
+                                                    <div class="mdl-tooltip mdl-tooltip--large mdl-tooltip--left" data-mdl-for="sampling-feature-help{{ forloop.counter0 }}">
+                                                        {{ field.help_text }}
+                                                    </div>
+                                                    {{ field|add_class:"form-control input-sm" }}
+                                                </div>
+                                            {% endfor %}
+                                        {% endif %}
 
                                         {% for field in sampling_feature_form %}
                                             <div class="form-field {% if field.field.required %} required-field{% endif %}{% if field.errors %} has-error{% endif %}"
                                                  data-field="{{ field.name }}">
-                                                <label class="control-label"
-                                                       for="{{ field.id_for_label }}">{{ field.label }}</label>
+                                                <label class="control-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
+                                                <i id="sampling-feature-help{{ forloop.counter0 }}" class="material-icons text-muted help-icon">help</i>
+                                                {{ field.errors }}
+                                                <div class="mdl-tooltip mdl-tooltip--large mdl-tooltip--left" data-mdl-for="sampling-feature-help{{ forloop.counter0 }}">
+                                                    {{ field.help_text }}
+                                                </div>
                                                 {{ field|add_class:"form-control input-sm" }}
                                             </div>
                                         {% endfor %}
                                         {% for field in site_form %}
                                             <div class="form-field {% if field.field.required %} required-field{% endif %}{% if field.errors %} has-error{% endif %}"
                                                  data-field="{{ field.name }}">
-                                                <label class="control-label"
-                                                       for="{{ field.id_for_label }}">{{ field.label }}</label>
+                                                <label class="control-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
+                                                <i id="site-help{{ forloop.counter0 }}" class="material-icons text-muted help-icon">help</i>
+                                                {{ field.errors }}
+                                                <div class="mdl-tooltip mdl-tooltip--large mdl-tooltip--left" data-mdl-for="site-help{{ forloop.counter0 }}">
+                                                    {{ field.help_text }}
+                                                </div>
                                                 {{ field|add_class:"form-control input-sm" }}
                                             </div>
                                         {% endfor %}
@@ -76,37 +99,39 @@
                                         </div>
 
                                         {{ results_formset.management_form }}
-                                        <table class="table table-striped table-bordered sensors">
+                                        <table class="table table-stripped table-bordered sensors full-width">
                                             <thead>
                                             <tr>
-                                                <th>Equipment Model</th>
-                                                <th>Measured Variable</th>
-                                                <th>Units</th>
-                                                <th>Sampled Medium</th>
-                                                <th>Edit</th>
-                                                <th>Delete</th>
+                                                <th class="mdl-data-table__cell--non-numeric">Equipment Model</th>
+                                                <th class="mdl-data-table__cell--non-numeric">Measured Variable</th>
+                                                <th class="mdl-data-table__cell--non-numeric">Units</th>
+                                                <th class="mdl-data-table__cell--non-numeric">Sampled Medium</th>
+                                                <th class="mdl-data-table__cell--non-numeric">Edit</th>
+                                                <th class="mdl-data-table__cell--non-numeric">Delete</th>
                                             </tr>
                                             </thead>
                                             <tbody>
                                             {% for result_form in results_formset %}
-                                                {% if result_form.is_bound %}
-                                                    <tr class="result-form" data-result="{{ result_form.prefix }}">
+                                                {% if result_form|has_data %}
+                                                    <tr class="result-form {% if result_form|is_deleted %} deleted-row {% endif %}" data-result="{{ result_form.prefix }}">
+                                                        <input type="hidden" name="{{ result_form.prefix }}-result_id" class="field-value" value="{{ result_form.initial.result_id }}" />
                                                         {% for field in result_form %}
-                                                            <td data-field="{{ field.name }}">
-                                                                <span class="field-text">{{ field.data }}</span>
-                                                                <input type="hidden" name="{{ field.html_name }}"
-                                                                       class="field-value"
-                                                                       value=""/>
+                                                            {% if field.name != "DELETE" %}
+                                                            <td data-field="{{ field.name }}" class="mdl-data-table__cell--non-numeric">
+                                                              <span class="field-text">{{ result_form|get_field_data:field.name }}</span>
+                                                                <input type="hidden" name="{{ field.html_name }}" class="field-value" value="{{ field.value }}"/>
                                                             </td>
+                                                            {% endif %}
                                                         {% endfor %}
-                                                        <td data-behaviour="edit">
+                                                        <td data-behaviour="edit" class="mdl-data-table__cell--non-numeric">
                                                             <button class="btn btn-primary btn-xs" type="button">
                                                                 <span class="glyphicon glyphicon-pencil"></span>
                                                             </button>
                                                         </td>
-                                                        <td data-behaviour="delete">
+                                                        <td data-behaviour="delete" class="mdl-data-table__cell--non-numeric">
                                                             <button class="btn btn-danger btn-xs" type="button">
                                                                 <span class="glyphicon glyphicon-trash"></span>
+                                                                {{ result_form.DELETE }}
                                                             </button>
                                                         </td>
                                                     </tr>
@@ -116,52 +141,56 @@
                                         </table>
 
                                         <script id="sensor-row" type="text/plain">
-                                            <tr class="result-form" data-result="">
-                                                <td data-field="equipment_model">
+                                            <tr class="result-form" data-result="form-__prefix__">
+                                                <td data-field="equipment_model" class="mdl-data-table__cell--non-numeric">
                                                     <span class="field-text"></span>
                                                     <input type="hidden" name="form-__prefix__-equipment_model" class="field-value" value="" />
                                                 </td>
-                                                <td data-field="variable">
+                                                <td data-field="variable" class="mdl-data-table__cell--non-numeric">
                                                     <span class="field-text"></span>
                                                     <input type="hidden" name="form-__prefix__-variable" class="field-value" value="" />
                                                 </td>
-                                                <td data-field="unit">
+                                                <td data-field="unit" class="mdl-data-table__cell--non-numeric">
                                                     <span class="field-text"></span>
                                                     <input type="hidden" name="form-__prefix__-unit" class="field-value" value="" />
                                                 </td>
-                                                <td data-field="sampled_medium">
+                                                <td data-field="sampled_medium" class="mdl-data-table__cell--non-numeric">
                                                     <span class="field-text"></span>
                                                     <input type="hidden" name="form-__prefix__-sampled_medium" class="field-value" value="" />
                                                 </td>
-                                                <td data-behaviour="edit">
+                                                <td data-behaviour="edit" class="mdl-data-table__cell--non-numeric">
                                                     <button class="btn btn-primary btn-xs" type="button">
                                                         <span class="glyphicon glyphicon-pencil"></span>
                                                     </button>
                                                 </td>
-                                                <td data-behaviour="delete">
-                                                    <button class="btn btn-danger btn-xs" type="button" data-toggle="modal" data-target="#confirm-delete">
+                                                <td data-behaviour="delete" class="mdl-data-table__cell--non-numeric">
+                                                    <button class="btn btn-danger btn-xs" type="button" data-toggle="modal">
                                                         <span class="glyphicon glyphicon-trash"></span>
+                                                        <input type="checkbox" name="form-__prefix__-DELETE" class="field-value"/>
                                                     </button>
                                                 </td>
                                             </tr>
-
-
                                         </script>
                                     </div>
                                 </div>
                             </fieldset>
 
                             <br>
-                            <button type="submit" value="Register Site"
-                                    class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
-                                Register Site
-                            </button>
+
+                            <div>
+                                <button id="btnRegisterSite" type="submit"
+                                        class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                                    {{ help }}{% if request.resolver_match.view_name == "site_update" %}Save
+                                        Edits{% else %}Register Site{% endif %}
+                                </button>
+                            </div>
                         </form>
                     </div>
                 </section>
             </div>
         </div>
     </div>
+
     <div id="result-dialog" class="modal fade" role="dialog" aria-hidden="true">
         <div class="vertical-alignment-helper">
             <div class="modal-dialog vertical-align-center">
@@ -173,11 +202,14 @@ <h4>Add Sensor</h4>
                         <div class="row">
                             <div class="form-group col-lg-12 result-form">
                             {% for field in results_formset.empty_form %}
+                                {% if field.name != "DELETE" %}
                                 <div class="form-field col-lg-12 {% if field.field.required %}required-field{% endif %} {% if field.errors %}has-error{% endif %}">
-                                    <label class="control-label"
-                                           for="{{ field.id_for_label }}">{{ field.label }}</label> {{ field.errors }}
-                                    {{ field|add_class:"form-control input-sm" }}
+                                    <label class="control-label" for="{{ field.id_for_label }}">{{ field.label }}</label> {{ field.errors }}
+                                    {% with "placeholder:"|add:field.help_text as placeholder %}
+                                        {{ field|add_class:"form-control input-sm"|attr:placeholder }}
+                                    {% endwith %}
                                 </div>
+                                {% endif %}
                             {% endfor %}
                         </div>
                         </div>
@@ -212,8 +244,10 @@ <h4>Add Sensor</h4>
                     <h4 class="modal-title">Delete sensor</h4>
                 </div>
                 <div class="modal-body">
-                    <p>Are you sure you want to remove this sensor from the list?</p>
-                    <input id="" type="hidden" value="">
+                    <p>
+                        <span id="data-removal-warning" class="hidden">All stored data corresponding to this sensor will be deleted.<br/></span>
+                        Are you sure you want to remove this sensor?
+                    </p>
                 </div>
                 <div class="modal-footer">
                     <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
@@ -233,16 +267,13 @@ <h4 class="modal-title">Delete sensor</h4>
 {% block styles %}
     {{ block.super }}
     <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet"/>
-    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2-bootstrap-theme/0.1.0-beta.6/select2-bootstrap.min.css"
-          rel="stylesheet"/>
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2-bootstrap-theme/0.1.0-beta.6/select2-bootstrap.min.css" rel="stylesheet"/>
 {% endblock %}
 
 {% block scripts %}
     {{ block.super }}
-    <script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.full.min.js"></script>
     <script src="{% static 'dataloaderinterface/js/common-forms.js' %}"></script>
-    <script src="{% static 'dataloaderinterface/js/device-form.js' %}"></script>
-    <script async defer
-            src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAiUxiuZaPEPtB4EhAquguz7kNzYU7bnnc&callback=initMap"></script>
+    <script src="{% static 'dataloaderinterface/js/site-form.js' %}"></script>
+    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAiUxiuZaPEPtB4EhAquguz7kNzYU7bnnc&callback=initMap"></script>
 {% endblock %}
diff --git a/src/dataloaderinterface/templates/dataloaderinterface/status.html b/src/dataloaderinterface/templates/dataloaderinterface/status.html
new file mode 100644
index 00000000..91442bd6
--- /dev/null
+++ b/src/dataloaderinterface/templates/dataloaderinterface/status.html
@@ -0,0 +1,163 @@
+{% load site staticfiles %}
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="refresh" content="60">
+    <title>Sites Status</title>
+    <link rel="icon"
+          type="image/png"
+          href="{% static 'dataloaderinterface/images/favicon.png' %}">
+    <style>
+        body {
+            margin: 0 45px;
+        }
+        table {
+            border-collapse: collapse;
+            max-width: 100%;
+        }
+
+        table tr:not(.subheader):nth-child(odd) {
+            background-color: rgb(227, 236, 244);
+        }
+
+        tr:not(.subheader) th, td {
+            text-align: left;
+            padding: 8px;
+            border: 1px solid black;
+        }
+
+        tr:not(.subheader) th {
+            background-color: steelblue;
+            color: #FFF;
+        }
+
+        tr:not(.subheader) td:first-child:not(.no-sites) {
+            font-weight: bold;
+        }
+
+        tr a {
+            text-decoration: none;
+        }
+
+        td.numeric {
+            text-align: right;
+        }
+
+        td.no-sites {
+            background-color: #FFF;
+            text-align: center;
+        }
+
+        tr.subheader {
+            padding-top: 20px;
+            padding-bottom: 10px;
+            border: 0;
+            display: block;
+        }
+    </style>
+</head>
+<body>
+<h2>Sites Status</h2>
+<hr>
+<a href="{% url 'home' %}">Home</a>
+{% if user.is_authenticated %}
+    - <a href="{% url 'sites_list' %}">My Sites</a>
+{% endif %}
+- <a href="{% url 'browse_sites' %}">Browse Sites</a>
+
+<table>
+    <thead>
+    <tr class="subheader">
+        <th colspan="7"><h3>My Sites ({{ sites|length }})</h3></th>
+    </tr>
+    <tr>
+        <th>Site Code</th>
+        <th>Site Name</th>
+        <th>Latest Sample</th>
+        <th>Battery</th>
+        <th>Temperature</th>
+        <th>Free SRAM</th>
+    </tr>
+    </thead>
+    <tbody>
+    {% for site in sites %}
+        {% with voltage=site|get_site_sensor:"EnviroDIY_Mayfly_Volt" temperature=site|get_site_sensor:"EnviroDIY_Mayfly_Temp" sram=site|get_site_sensor:"EnviroDIY_Mayfly_FreeSRAM" %}
+            <tr>
+                <td><a href="{% url 'site_detail' site.sampling_feature_code %}">{{ site.sampling_feature_code }}</a></td>
+                <td>{{ site.sampling_feature_name }}</td>
+                <td>{% if not site.latest_measurement.value_datetime %}
+                    -{% else %}
+                    {{ site.latest_measurement.value_datetime }}
+                    ({{ site.latest_measurement.value_datetime|timesince }} ago)
+                {% endif %}</td>
+                <td class="numeric">{{ voltage.last_measurement.data_value|default:"-" }}</td>
+                <td class="numeric">{{ temperature.last_measurement.data_value|default:"-" }}</td>
+                <td class="numeric">{{ sram.last_measurement.data_value|default:"-" }}</td>
+            </tr>
+        {% endwith %}
+    {% endfor %}
+    {% if sites|length == 0 %}
+        <tr>
+            <td colspan="7" class="no-sites">No sites to display</td>
+        </tr>
+    {% endif %}
+    <tr class="subheader">
+        <th colspan="7"><h3>Followed Sites ({{ followed_sites|length }})</h3></th>
+    </tr>
+    <tr>
+        <th>Site Code</th>
+        <th>Site Name</th>
+        <th>Latest Sample</th>
+        <th>Battery</th>
+        <th>Temperature</th>
+        <th>Free SRAM</th>
+    </tr>
+
+    {% for site in followed_sites %}
+        {% with voltage=site|get_site_sensor:"EnviroDIY_Mayfly_Volt" temperature=site|get_site_sensor:"EnviroDIY_Mayfly_Temp" sram=site|get_site_sensor:"EnviroDIY_Mayfly_FreeSRAM" %}
+            <tr>
+                <td><a href="{% url 'site_detail' site.sampling_feature_code %}">{{ site.sampling_feature_code }}</a></td>
+                <td>{{ site.sampling_feature_name }}</td>
+                <td>{% if not site.latest_measurement.value_datetime %}
+                    -{% else %}
+                    {{ site.latest_measurement.value_datetime }}
+                    ({{ site.latest_measurement.value_datetime|timesince }} ago)
+                {% endif %}</td>
+                <td class="numeric">{{ voltage.last_measurement.data_value|default:"-" }}</td>
+                <td class="numeric">{{ temperature.last_measurement.data_value|default:"-" }}</td>
+                <td class="numeric">{{ sram.last_measurement.data_value|default:"-" }}</td>
+            </tr>
+        {% endwith %}
+    {% endfor %}
+    {% if followed_sites|length == 0 %}
+        <tr>
+            <td colspan="7" class="no-sites">No followed sites to display</td>
+        </tr>
+    {% endif %}
+    </tbody>
+</table>
+{##}
+{#{% for site in sites %}#}
+{#    <h4>{{ site.sampling_feature_code }}</h4>#}
+{#    <table>#}
+{#    <thead>#}
+{#        <tr>#}
+{#        {% for sensor in site.sensors.all %}#}
+{#            <th>{{ sensor.variable_code }}</th>#}
+{#        {% endfor %}#}
+{#        </tr>#}
+{#    </thead>#}
+{#    <tbody>#}
+{#        <tr>#}
+{#        {% for sensor in site.sensors.all %}#}
+{#            <td>{% if sensor.last_measurement %}{{ sensor.last_measurement.data_value }}{% endif %}</td>#}
+{#        {% endfor %}#}
+{#        </tr>#}
+{#    </tbody>#}
+{#    </table>#}
+{#    <br><br>#}
+{#{% endfor %}#}
+</body>
+</html>
\ No newline at end of file
diff --git a/src/dataloaderinterface/templates/registration/account.html b/src/dataloaderinterface/templates/registration/account.html
new file mode 100644
index 00000000..53c4fb67
--- /dev/null
+++ b/src/dataloaderinterface/templates/registration/account.html
@@ -0,0 +1,245 @@
+{% extends "dataloaderinterface/base.html" %}
+{% load widget_tweaks %}
+{% load static %}
+
+{% block page_title %}
+    <title>Account Details</title>
+{% endblock %}
+
+{% block content %}
+    <div class="ribbon ribbon-dark"></div>
+
+    <div class="ribbon-container">
+        <div class="container ribbon-content mdl-color--white mdl-shadow--4dp">
+            <div id="profile-banner" class="row ribbon-content-close">
+                <h3 data-profile-mode="view" class="display-3 profile-name">
+                    <i class="material-icons">person</i>{{ user.first_name }} {{ user.last_name }}</h3>
+
+                <h3 data-profile-mode="edit" class="display-3 hidden">Edit Profile Information</h3>
+            </div>
+
+            <button id="btn-edit-profile"
+                    class="mdl-button--trans fab-trans pull-right mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored mdl-shadow--2dp">
+                <i class="material-icons">mode_edit</i>
+            </button>
+
+            <div data-profile-mode="edit" class="mdl-tooltip" data-mdl-for="btn-edit-profile">
+                Edit Profile Information
+            </div>
+
+            <span id="btn-cancel-profile-edit"
+                  class="pull-right mdl-button--trans mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect">
+                                Cancel
+            </span>
+
+            <button id="btn-update-user" type="submit" value="Register User"
+                    class="pull-right mdl-button--trans mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                Save Changes
+            </button>
+
+            <div class="row">
+                <section class="page-content user-registration col-lg-12">
+                    <header>
+                        {% if messages %}
+                            {% for message in messages %}
+                                <span class="alert alert-{{ message.tags }} alert-dismissible d-block"  role="alert">
+                                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
+                                            aria-hidden="true">&times;</span></button>
+                                    {{ message }}
+                                </span>
+                            {% endfor %}
+                        {% endif %}
+                    </header>
+                </section>
+            </div>
+
+            <div class="row" data-profile-mode="view">
+                <div class="col-sm-12">
+                    <table id="profile-details-table">
+                        <tr>
+                            <td><h6 class="title text-muted"><i class="fa fa-user-circle-o" aria-hidden="true"></i> Username:</h6>
+                            </td>
+                            <td><h6>{{ user.username }}</h6></td>
+                        </tr>
+                        <tr>
+                            <td><h6 class="title text-muted"><i class="fa fa-envelope" aria-hidden="true"></i> Email Address:</h6>
+                            </td>
+                            <td><h6>{{ user.email }}</h6></td>
+                        </tr>
+                        <tr>
+                            <td><h6 class="title text-muted"><i class="fa fa-building" aria-hidden="true"></i> Organization:</h6>
+                            </td>
+                            <td><h6>{{ user.odm2user.affiliation.organization }}</h6></td>
+                        </tr>
+                    </table>
+                </div>
+            </div>
+
+            <div class="row hidden" data-profile-mode="edit">
+                <div class="col-xs-12 col-sm-6">
+                    <form id="profile-form" method="post" enctype="multipart/form-data" role="form">
+                        {% csrf_token %}
+                        <fieldset class="form-fieldset">
+                            <div class="form-group user-fields">
+                                <div class="row">
+                                    <div class="col-xs-12 col-sm-6">
+                                        <div class="form-field required-field {% if form.first_name.errors %}has-error{% endif %}">
+                                            <label class="control-label" for="id_first_name">
+                                                <i class="fa fa-user" aria-hidden="true"></i>
+                                                Enter a first name
+                                            </label>
+                                            {{ form.first_name|add_class:"form-control input-sm"|attr:"placeholder: First Name"|attr:"autofocus" }}
+                                            {{ form.first_name.errors }}
+                                        </div>
+                                    </div>
+
+                                    <div class="col-xs-12 col-sm-6">
+                                        <div class="form-field required-field {% if form.last_name.errors %}has-error{% endif %}">
+                                            <label class="control-label" for="id_last_name">
+                                                <i class="fa fa-user" aria-hidden="true"></i>
+                                                Enter a last name
+                                            </label>
+                                            {{ form.last_name|add_class:"form-control input-sm"|attr:"placeholder: Last Name" }}
+                                            {{ form.last_name.errors }}
+                                        </div>
+                                    </div>
+
+                                    <div class="col-xs-12">
+                                        <div class="form-field required-field {% if form.email.errors %}has-error{% endif %}">
+                                            <label class="control-label" for="id_email_address">
+                                                <i class="fa fa-envelope" aria-hidden="true"></i>
+                                                Enter your email address
+                                            </label>
+                                            {{ form.email|add_class:"form-control input-sm"|attr:"placeholder: Email Address" }}
+                                            {{ form.email.errors }}
+                                        </div>
+                                    </div>
+
+                                    <div class="col-xs-12">
+                                        <div class="form-field required-field {% if form.username.errors %}has-error{% endif %}">
+                                            <label class="control-label" for="id_username">
+                                                <i class="fa fa-user-circle-o" aria-hidden="true"></i> Choose a
+                                                username
+                                            </label>
+                                            {{ form.username|add_class:"form-control input-sm"|attr:"placeholder: Username" }}
+                                            {{ form.username.errors }}
+                                        </div>
+                                    </div>
+
+                                    <div class="col-xs-12">
+                                        <div class="form-field {% if form.organization.errors %}has-error{% endif %}">
+                                            <label class="control-label" for="id_organization">
+                                                <i class="fa fa-building" aria-hidden="true"></i>
+                                                Organization
+                                            </label>
+                                            <i id="organization-help" class="material-icons text-muted help-icon">help</i>
+                                            <div class="mdl-tooltip mdl-tooltip--large mdl-tooltip--right"
+                                                 data-mdl-for="organization-help">
+                                                {{ form.organization.help_text }}
+                                            </div>
+                                            {{ form.organization|add_class:"form-control input-sm"|attr:"placeholder: Choose your affiliated organization" }}
+                                            {{ form.organization.errors }}
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </fieldset>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div id="organization-dialog" class="modal fade" role="dialog" aria-hidden="true">
+        <div class="vertical-alignment-helper">
+            <div class="modal-dialog vertical-align-center">
+                <div class="modal-content">
+                    <div class="modal-header">
+                        <h4>New Organization</h4>
+                    </div>
+                    <div class="modal-body">
+                        <div class="form-group col-lg-12 organization-fields">
+                            {% for field in organization_form %}
+                                <div class="form-field col-lg-12 {% if field.field.required %}required-field{% endif %} {% if field.errors %}has-error{% endif %}">
+                                    <label class="control-label"
+                                           for="{{ field.id_for_label }}">{{ field.label }}</label> {{ field.errors }}
+                                    {% with "placeholder:"|add:field.help_text as placeholder %}
+                                        {{ field|add_class:"form-control input-sm"|attr:placeholder }}
+                                    {% endwith %}
+                                </div>
+                            {% endfor %}
+                        </div>
+                        <div class="clearfix"></div>
+                    </div>
+                    <div class="modal-footer">
+                        <button id="organization-modal-close" data-dismiss="modal"
+                                class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect">
+                            Close
+                        </button>
+                        <button id="new-organization-button" type="button"
+                                class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                            Add New Organization
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+{% endblock %}
+
+{% block services_urls %}
+    {{ block.super }}
+    <input id="new-organization-api" type="hidden" value="{% url 'organization_service' %}">
+{% endblock %}
+
+{% block styles %}
+    {{ block.super }}
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet"/>
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2-bootstrap-theme/0.1.0-beta.6/select2-bootstrap.min.css"
+          rel="stylesheet"/>
+{% endblock %}
+
+{% block scripts %}
+    {{ block.super }}
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.full.min.js"></script>
+    <script src="{% static 'dataloaderinterface/js/common-forms.js' %}"></script>
+    <script src="{% static 'dataloaderinterface/js/user-form.js' %}"></script>
+    <script src='https://www.google.com/recaptcha/api.js'></script>
+
+    <script>
+        function setMode(mode) {
+            if (mode == "edit") {
+                $("[data-profile-mode='view']").toggleClass("hidden", true);
+                $("[data-profile-mode='edit']").toggleClass("hidden", false);
+                $("#btn-edit-profile").removeClass("fab-trans");
+                $("#btn-cancel-profile-edit").addClass("fab-trans");
+                $("#btn-update-user").addClass("fab-trans");
+            }
+            else {
+                $("[data-profile-mode='edit']").toggleClass("hidden", true);
+                $("[data-profile-mode='view']").toggleClass("hidden", false);
+                $("#btn-edit-profile").addClass("fab-trans");
+                $("#btn-cancel-profile-edit").removeClass("fab-trans");
+                $("#btn-update-user").removeClass("fab-trans");
+            }
+        }
+
+        $(document).ready(function () {
+            $("#btn-edit-profile").on("click", function(){
+                setMode("edit");
+            });
+
+            $("#btn-cancel-profile-edit").on("click", function(){
+                setMode("view");
+            });
+
+            if ($(".user-registration .alert-error").length > 0) {
+                setMode("edit");
+            }
+
+            $("#btn-update-user").on("click", function() {
+                $("#profile-form").submit();
+            });
+        });
+    </script>
+{% endblock %}
\ No newline at end of file
diff --git a/src/dataloaderinterface/templates/registration/login.html b/src/dataloaderinterface/templates/registration/login.html
index 60ded858..e24e2d99 100644
--- a/src/dataloaderinterface/templates/registration/login.html
+++ b/src/dataloaderinterface/templates/registration/login.html
@@ -55,6 +55,10 @@ <h3 class="panel-title">Log In</h3>
                                     <span class="form-message">Don't have an account?</span>
                                     <div><a class="orange" href="{% url 'user_registration' %}">Sign Up</a></div>
                                 </div>
+                                <br>
+                                <div class="text-center">
+                                    <div><a class="orange" href="{% url 'password_reset' %}">Forgot Password?</a></div>
+                                </div>
                             </form>
                         </div>
                     </div>
@@ -78,4 +82,4 @@ <h3 class="panel-title">Log In</h3>
             $("#wrapper").css('background-repeat', 'no-repeat');
         });
     </script>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/src/dataloaderinterface/templates/registration/password_reset_complete.html b/src/dataloaderinterface/templates/registration/password_reset_complete.html
new file mode 100644
index 00000000..04cc6767
--- /dev/null
+++ b/src/dataloaderinterface/templates/registration/password_reset_complete.html
@@ -0,0 +1,52 @@
+{% extends "dataloaderinterface/base.html" %}
+{% load widget_tweaks staticfiles %}
+
+{% block title %}Password reset complete{% endblock %}
+
+{% block content %}
+    <div class="container-fluid">
+        <div class="container main-content">
+            <div class="row">
+                <section class="page-content login col-lg-12">
+            <header>
+                {% if form.errors %}
+                    <span class="form-message error">Your username and password didn't match. Please try again.</span>
+                {% endif %}
+            </header>
+
+            <div class="row">
+                <div class="col-xs-12 col-sm-4 col-sm-offset-4">
+                    <br>
+                    <br>
+                    <div class="panel panel-default panel-login shadow">
+                        <div class="panel-heading">
+                            <h3 class="panel-title">Password Reset Completed</h3>
+                        </div>
+                        <div class="panel-body">
+
+                        <p>Your password has been reset.<br> You may go ahead and log in now.</p>
+                        <p><a href="{{ login_url }}">Log in</a></p>
+
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+            </div>
+        </div>
+    </div>
+    <span id="bg-image" data-image-url="{% static "dataloaderinterface/images/login_bg.jpg" %}" class="hidden"></span>
+
+{% endblock %}
+
+{% block scripts %}
+    {{ block.super }}
+    <script>
+        $(document).ready(function(){
+            var path = $("#bg-image").attr("data-image-url");
+            $("#wrapper").css('background-image', 'url("' + path + '")');
+            $("#wrapper").css('background-size', 'cover');
+            $("#wrapper").css('background-repeat', 'no-repeat');
+        });
+    </script>
+{% endblock %}
diff --git a/src/dataloaderinterface/templates/registration/password_reset_confirm.html b/src/dataloaderinterface/templates/registration/password_reset_confirm.html
new file mode 100644
index 00000000..8b03c62d
--- /dev/null
+++ b/src/dataloaderinterface/templates/registration/password_reset_confirm.html
@@ -0,0 +1,111 @@
+{% extends "dataloaderinterface/base.html" %}
+{% load widget_tweaks staticfiles %}
+
+{% block title %}Setting New password{% endblock %}
+
+{% block content %}
+    <div class="container-fluid">
+        <div class="container main-content">
+            <div class="row">
+                <section class="page-content login col-lg-12">
+                    <header>
+                        {% if form.new_password1.errors %}
+                            <span class="form-message error">{{ form.new_password1.errors }}</span>
+                        {% endif %}
+                        {% if form.new_password2.errors %}
+                            <span class="form-message error">{{ form.new_password2.errors }}</span>
+                        {% endif %}
+                    </header>
+
+                    <div class="row">
+                        <div class="col-xs-12 col-sm-4 col-sm-offset-4">
+                            <br>
+                            <br>
+                            <div class="panel panel-default panel-login shadow">
+                                <div class="panel-heading">
+                                    <h3 class="panel-title">Password Reset</h3>
+                                </div>
+                                <div class="panel-body">
+
+                                    {% if validlink %}
+                                        <p>Please enter your new password twice<br/>
+                                            to verify you typed it in correctly.</p>
+                                        <form action="" method="post">
+                                            <div style="display:none">
+                                                <input type="hidden" value="{{ csrf_token }}"
+                                                       name="csrfmiddlewaretoken">
+                                            </div>
+
+                                            <fieldset class="form-fieldset">
+                                                <div class="form-group user-fields">
+                                                    <table>
+                                                        <tr>
+                                                            <td>
+                                                                <label for="id_new_password1">New password:</label></td>
+                                                            <td>
+                                                                <div class="form-field required-field ">
+                                                                    {{ form.new_password1|add_class:"form-control input-sm"|attr:"placeholder: Password" }}
+                                                                </div>
+                                                            </td>
+
+                                                        </tr>
+                                                        <tr>
+                                                            <td>
+                                                                <label for="id_new_password2">Confirm password:</label>
+                                                            </td>
+                                                            <td>
+                                                                <div class="form-field required-field ">
+                                                                    {{ form.new_password2|add_class:"form-control input-sm"|attr:"placeholder: Password" }}
+                                                                </div>
+                                                            </td>
+
+                                                        </tr>
+                                                        <tr>
+                                                            <td></td>
+                                                            <td>
+
+                                                                <div class="text-center">
+                                                                    <button type="submit" id="btn-login"
+                                                                            value="Change my password"
+                                                                            class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                                                                        Login
+                                                                    </button>
+                                                                </div>
+
+                                                            </td>
+                                                        </tr>
+
+                                                    </table>
+
+                                                </div>
+                                            </fieldset>
+                                        </form>
+                                    {% else %}
+                                        <h1>Password reset unsuccessful</h1>
+                                        <p>The password reset link was invalid, <br/>
+                                            possibly because it has already been used. <br/>
+                                            Please request a new password reset.</p>
+                                    {% endif %}
+
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </section>
+            </div>
+        </div>
+    </div>
+    <span id="bg-image" data-image-url="{% static "dataloaderinterface/images/login_bg.jpg" %}" class="hidden"></span>
+{% endblock %}
+
+{% block scripts %}
+    {{ block.super }}
+    <script>
+        $(document).ready(function () {
+            var path = $("#bg-image").attr("data-image-url");
+            $("#wrapper").css('background-image', 'url("' + path + '")');
+            $("#wrapper").css('background-size', 'cover');
+            $("#wrapper").css('background-repeat', 'no-repeat');
+        });
+    </script>
+{% endblock %}
diff --git a/src/dataloaderinterface/templates/registration/password_reset_done.html b/src/dataloaderinterface/templates/registration/password_reset_done.html
new file mode 100644
index 00000000..ac914d14
--- /dev/null
+++ b/src/dataloaderinterface/templates/registration/password_reset_done.html
@@ -0,0 +1,47 @@
+{% extends "dataloaderinterface/base.html" %}
+{% load widget_tweaks staticfiles %}
+
+{% block title %}Password reset successful{% endblock %}
+
+{% block content %}
+    <div class="container-fluid">
+        <div class="container main-content">
+            <div class="row">
+                <section class="page-content login col-lg-12">
+                    <div class="row">
+                        <div class="col-xs-12 col-sm-4 col-sm-offset-4">
+                            <br>
+                            <br>
+                            <div class="panel panel-default panel-login shadow">
+                                <div class="panel-heading">
+                                    <h3 class="panel-title">Password Reset Email Sent</h3>
+                                </div>
+                                <div class="panel-body">
+
+                                    <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>
+
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </section>
+            </div>
+        </div>
+    </div>
+    <span id="bg-image" data-image-url="{% static "dataloaderinterface/images/login_bg.jpg" %}" class="hidden"></span>
+
+{% endblock %}
+
+{% block scripts %}
+    {{ block.super }}
+    <script>
+        $(document).ready(function () {
+            var path = $("#bg-image").attr("data-image-url");
+            $("#wrapper").css('background-image', 'url("' + path + '")');
+            $("#wrapper").css('background-size', 'cover');
+            $("#wrapper").css('background-repeat', 'no-repeat');
+        });
+    </script>
+{% endblock %}
diff --git a/src/dataloaderinterface/templates/registration/password_reset_email.html b/src/dataloaderinterface/templates/registration/password_reset_email.html
new file mode 100644
index 00000000..a364fb66
--- /dev/null
+++ b/src/dataloaderinterface/templates/registration/password_reset_email.html
@@ -0,0 +1,15 @@
+{% autoescape off %}
+You're receiving this e-mail because you requested a password reset for your user account at {{ site_name }}.
+
+Please go to the following page and choose a new password:
+{% block reset_link %}
+{{ protocol }}://{{ domain }}{% url 'password_reset_confirm' uidb64=uid token=token %}
+{% endblock %}
+
+Your username, in case you've forgotten: {{ user.username }}
+
+Thanks for using our site!
+
+The {{ site_name }} team.
+
+{% endautoescape %}
diff --git a/src/dataloaderinterface/templates/registration/password_reset_form.html b/src/dataloaderinterface/templates/registration/password_reset_form.html
new file mode 100644
index 00000000..949dce61
--- /dev/null
+++ b/src/dataloaderinterface/templates/registration/password_reset_form.html
@@ -0,0 +1,73 @@
+{% extends "dataloaderinterface/base.html" %}
+{% load widget_tweaks staticfiles %}
+
+{% block title %}Reset Password{% endblock %}
+
+{% block content %}
+    <div class="container-fluid">
+        <div class="container main-content">
+            <div class="row">
+                <section class="page-content login col-lg-12">
+                    <header>
+                        {% if form.errors %}
+                            <span class="form-message error">An error was encountered, please try again.</span>
+                        {% endif %}
+                    </header>
+
+                    <div class="row">
+                        <div class="col-xs-12 col-sm-4 col-sm-offset-4">
+                            <br>
+                            <br>
+                            <div class="panel panel-default panel-login shadow">
+                                <div class="panel-heading">
+                                    <h3 class="panel-title">Account Recovery</h3>
+                                </div>
+                                <div class="panel-body">
+
+                                    <p>Please specify your email address to receive instructions for resetting it.</p>
+
+                                    <form action="" method="post">
+                                        <div style="display:none">
+                                            <input type="hidden" value="{{ csrf_token }}" name="csrfmiddlewaretoken">
+                                        </div>
+                                        {{ form.email.errors }}
+                                        <fieldset class="form-fieldset">
+                                            <div class="form-group user-fields">
+                                                <div class="form-field required-field ">
+                                                    <p><label for="id_email">E-mail address:</label>
+                                                        {{ form.email|add_class:"form-control input-sm"|attr:"placeholder: Email"|attr:"autofocus" }}
+                                                    <div class="text-center">
+                                                        <button type="submit" id="btn-login" value="Reset password"
+                                                                class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                                                            Reset Password
+                                                        </button>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </fieldset>
+                                    </form>
+
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </section>
+            </div>
+        </div>
+    </div>
+    <span id="bg-image" data-image-url="{% static "dataloaderinterface/images/login_bg.jpg" %}" class="hidden"></span>
+
+{% endblock %}
+
+
+{% block scripts %}
+    {{ block.super }}
+    <script>
+        $(document).ready(function () {
+            var path = $("#bg-image").attr("data-image-url");
+            $("#wrapper").css('background-image', 'url("' + path + '")');
+            $("#wrapper").css('background-size', 'cover');
+            $("#wrapper").css('background-repeat', 'no-repeat');
+        });
+    </script>
+{% endblock %}
diff --git a/src/dataloaderinterface/templates/registration/register.html b/src/dataloaderinterface/templates/registration/register.html
index 3a568951..d65a3367 100644
--- a/src/dataloaderinterface/templates/registration/register.html
+++ b/src/dataloaderinterface/templates/registration/register.html
@@ -87,10 +87,12 @@ <h3 class="panel-title">Sign Up</h3>
 
                                                 <div class="col-xs-12">
                                                     <div class="form-field {% if form.organization.errors %}has-error{% endif %}">
-                                                        <label class="control-label" for="id_organization"><i
-                                                                class="fa fa-building" aria-hidden="true"></i>
-                                                            Organization</label>
-                                                        {{ form.organization|add_class:"form-control input-sm select2-hidden-accessible"|attr:"placeholder: Choose an organization" }}
+                                                        <label class="control-label" for="id_organization"><i class="fa fa-building" aria-hidden="true"></i> Organization</label>
+                                                        <i id="organization-help" class="material-icons text-muted help-icon">help</i>
+                                                        <div class="mdl-tooltip mdl-tooltip--large mdl-tooltip--right" data-mdl-for="organization-help">
+                                                            {{ form.organization.help_text }}
+                                                        </div>
+                                                        {{ form.organization|add_class:"form-control input-sm select2-hidden-accessible"|attr:"placeholder: Choose your affiliated organization" }}
                                                         {{ form.organization.errors }}
                                                     </div>
                                                 </div>
@@ -154,18 +156,24 @@ <h4>New Organization</h4>
                                     <div class="form-group col-lg-12 organization-fields">
                                         {% for field in organization_form %}
                                             <div class="form-field col-lg-12 {% if field.field.required %}required-field{% endif %} {% if field.errors %}has-error{% endif %}">
-                                                <label class="control-label"
-                                                       for="{{ field.id_for_label }}">{{ field.label }}</label> {{ field.errors }}
-                                                {{ field|add_class:"form-control input-sm" }}
+                                                <label class="control-label" for="{{ field.id_for_label }}">{{ field.label }}</label> {{ field.errors }}
+                                                {% with "placeholder:"|add:field.help_text as placeholder %}
+                                                    {{ field|add_class:"form-control input-sm"|attr:placeholder }}
+                                                {% endwith %}
                                             </div>
                                         {% endfor %}
                                     </div>
                                     <div class="clearfix"></div>
                                 </div>
                                 <div class="modal-footer">
-                                    <button id="organization-modal-close" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-                                    <button id="new-organization-button" type="button" class="btn btn-primary">Add New
-                                        Organization
+                                    <button id="organization-modal-close" data-dismiss="modal"
+                                            class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect">
+                                        Close
+                                    </button>
+
+                                    <button id="new-organization-button" type="button"
+                                            class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect">
+                                        Add New Organization
                                     </button>
                                 </div>
                             </div>
diff --git a/src/dataloaderinterface/templatetags/site.py b/src/dataloaderinterface/templatetags/site.py
index 74e51e4b..0fbaaf3a 100644
--- a/src/dataloaderinterface/templatetags/site.py
+++ b/src/dataloaderinterface/templatetags/site.py
@@ -1,14 +1,37 @@
+from dataloader.models import SamplingFeature, Result
 from django import template
 
-from dataloader.models import SamplingFeature
-from dataloaderinterface.models import DeviceRegistration
+from dataloaderinterface.csv_serializer import SiteResultSerializer
+from dataloaderinterface.models import DeviceRegistration, SiteSensor, SiteRegistration
 
 register = template.Library()
+#
+#
+# @register.filter(name='get_registration')
+# def get_registration(sampling_feature):
+#     if not isinstance(sampling_feature, SamplingFeature):
+#         return
+#
+#     return DeviceRegistration.objects.filter(deployment_sampling_feature_uuid__exact=sampling_feature.sampling_feature_uuid).first()
 
 
-@register.filter(name='get_registration')
-def get_registration(sampling_feature):
-    if not isinstance(sampling_feature, SamplingFeature):
+@register.filter(name='get_sensor_csv_path')
+def get_sensor_csv_path(sensor):
+    if not isinstance(sensor, SiteSensor):
         return
 
-    return DeviceRegistration.objects.filter(deployment_sampling_feature_uuid__exact=sampling_feature.sampling_feature_uuid).first()
+    return SiteResultSerializer(sensor.result).get_file_path()
+
+
+@register.filter(name='get_site_sensor')
+def get_site_sensor(site, variable_code):
+    if not isinstance(site, SiteRegistration):
+        return
+
+    return site.sensors.filter(variable_code=variable_code).first()
+
+
+@register.filter(name='can_administer_site')
+def can_administer_site():
+    pass
+    # return DeviceRegistration.objects.filter(deployment_sampling_feature_uuid__exact=sampling_feature.sampling_feature_uuid).first()
diff --git a/src/dataloaderinterface/templatetags/site_form_util.py b/src/dataloaderinterface/templatetags/site_form_util.py
new file mode 100644
index 00000000..b8956c6d
--- /dev/null
+++ b/src/dataloaderinterface/templatetags/site_form_util.py
@@ -0,0 +1,18 @@
+from django import template
+
+register = template.Library()
+
+
+@register.filter(name='get_field_data')
+def get_field_data(form, field_name):
+    return form[field_name].field.to_python(form[field_name].data) or form[field_name].initial
+
+
+@register.filter(name='has_data')
+def has_data(form):
+    return len(form.changed_data) or len(form.initial)
+
+
+@register.filter(name='is_deleted')
+def is_deleted(form):
+    return 'DELETE' in form.changed_data
diff --git a/src/dataloaderinterface/urls.py b/src/dataloaderinterface/urls.py
index f9a1d94c..aa836060 100644
--- a/src/dataloaderinterface/urls.py
+++ b/src/dataloaderinterface/urls.py
@@ -15,14 +15,17 @@
 """
 from django.conf.urls import url
 
-from dataloaderinterface.views import DevicesListView, DeviceDetailView, DeviceRegistrationView, DeviceUpdateView, \
-    HomeView, BrowseSitesListView
+from dataloaderinterface.views import SitesListView, SiteDetailView, SiteRegistrationView, \
+    HomeView, BrowseSitesListView, SiteUpdateView, SiteDeleteView, StatusListView
 
 urlpatterns = [
     url(r'^$', HomeView.as_view(), name='home'),
-    url(r'^sites/$', DevicesListView.as_view(), name='sites_list'),
-    url(r'^sites/browse/$', BrowseSitesListView.as_view(), name='browse_sites'),
-    url(r'^sites/register/$', DeviceRegistrationView.as_view(), name='site_registration'),
-    url(r'^sites/register/update/(?P<slug>[-_\w]+)/$', DeviceUpdateView.as_view(), name='site_update'),
-    url(r'^sites/(?P<slug>[-_\w]+)/$', DeviceDetailView.as_view(), name='site_detail'),
+    url(r'^sites/$', SitesListView.as_view(), name='sites_list'),
+    url(r'^status/$', StatusListView.as_view(), name='status'),
+    url(r'^browse/$', BrowseSitesListView.as_view(), name='browse_sites'),
+    url(r'^sites/register/$', SiteRegistrationView.as_view(), name='site_registration'),
+    url(r'^sites/update/(?P<sampling_feature_code>.*)/$', SiteUpdateView.as_view(), name='site_update'),
+    url(r'^sites/delete/(?P<sampling_feature_code>.*)/$', SiteDeleteView.as_view(), name='site_delete'),
+    url(r'^sites/(?P<sampling_feature_code>.*)/$', SiteDetailView.as_view(), name='site_detail'),
+
 ]
diff --git a/src/dataloaderinterface/views.py b/src/dataloaderinterface/views.py
index 9b6f5388..10f5be87 100644
--- a/src/dataloaderinterface/views.py
+++ b/src/dataloaderinterface/views.py
@@ -1,29 +1,27 @@
 from datetime import datetime
 from uuid import uuid4
 
+from dataloader.models import FeatureAction, Result, ProcessingLevel, TimeSeriesResult, SamplingFeature, \
+    SpatialReference, \
+    ElevationDatum, SiteType, ActionBy, Action, Method, DataLoggerProgramFile, DataLoggerFile, \
+    InstrumentOutputVariable, DataLoggerFileColumn, TimeSeriesResultValue
 from django.contrib import messages
 from django.contrib.auth import login
 from django.contrib.auth.decorators import login_required
 from django.contrib.auth.models import User
 from django.core.urlresolvers import reverse, reverse_lazy
-from django.db.models.query_utils import Q
-from django.http.response import HttpResponseRedirect
+from django.http.response import HttpResponseRedirect, Http404
 from django.shortcuts import render
-
 # Create your views here.
-from django import http
-from django.utils import six
 from django.views.generic.base import TemplateView
 from django.views.generic.detail import DetailView
-from django.views.generic.edit import FormView, UpdateView, CreateView, ModelFormMixin
+from django.views.generic.edit import UpdateView, CreateView, DeleteView
 from django.views.generic.list import ListView
 
-from dataloader.models import FeatureAction, SamplingFeatureType, ActionType, OrganizationType, Result, ResultType, \
-    ProcessingLevel, Status, TimeSeriesResult, AggregationStatistic, SamplingFeature, Organization, SpatialReference, \
-    ElevationDatum, SiteType, Affiliation, Medium, ActionBy, Action, Method
+from dataloaderinterface.csv_serializer import SiteResultSerializer
 from dataloaderinterface.forms import SamplingFeatureForm, ResultFormSet, SiteForm, UserRegistrationForm, \
-    OrganizationForm
-from dataloaderinterface.models import DeviceRegistration
+    OrganizationForm, UserUpdateForm, ActionByForm
+from dataloaderinterface.models import ODM2User, SiteRegistration, SiteSensor
 
 
 class LoginRequiredMixin(object):
@@ -35,15 +33,45 @@ def as_view(cls):
 class HomeView(TemplateView):
     template_name = 'dataloaderinterface/index.html'
 
+    # def get_context_data(self, **kwargs):
+    #     context = super(HomeView, self).get_context_data()
+    #     context['device_results'] = []
+    #     for device in DeviceRegistration.objects.get_queryset().filter(user=self.request.user.id):
+    #         sampling_feature = SamplingFeature.objects.get(sampling_feature_uuid__exact=device.deployment_sampling_feature_uuid)
+    #         feature_actions = sampling_feature.feature_actions.prefetch_related('results__timeseriesresult__values', 'results__variable').all()
+    #         context['device_results'].append({'device': device, 'feature_actions': feature_actions})
+    #     return context
+
+
+class UserUpdateView(UpdateView):
+    form_class = UserUpdateForm
+    template_name = 'registration/account.html'
+
+    def get_object(self, queryset=None):
+        return self.request.user
+
+    def get_form(self, form_class=None):
+        user = self.get_object()
+        organization = user.odm2user.affiliation.organization
+        form = UserUpdateForm(instance=user, initial={'organization': organization})
+        return form
+
     def get_context_data(self, **kwargs):
-        context = super(HomeView, self).get_context_data()
-        context['device_results'] = []
-        for device in DeviceRegistration.objects.get_queryset().filter(user=self.request.user.id):
-            sampling_feature = SamplingFeature.objects.get(sampling_feature_uuid__exact=device.deployment_sampling_feature_uuid)
-            feature_actions = sampling_feature.feature_actions.prefetch_related('results__timeseriesresult__values', 'results__variable').all()
-            context['device_results'].append({'device': device, 'feature_actions': feature_actions})
+        context = super(UserUpdateView, self).get_context_data(**kwargs)
+        context['organization_form'] = OrganizationForm()
         return context
 
+    def post(self, request, *args, **kwargs):
+        user = User.objects.get(pk=request.user.pk)
+        form = UserUpdateForm(request.POST, instance=user, initial={'organization': user.odm2user.affiliation.organization})
+        if form.is_valid():
+            form.save()
+            messages.success(request, 'Your information has been updated successfully.')
+            return HttpResponseRedirect(reverse('user_account'))
+        else:
+            messages.error(request, 'There were some errors in the form.')
+            return render(request, self.template_name, {'form': form, 'organization_form': OrganizationForm()})
+
 
 class UserRegistrationView(CreateView):
     template_name = 'registration/register.html'
@@ -65,46 +93,245 @@ def post(self, request, *args, **kwargs):
         return response
 
 
-class DevicesListView(LoginRequiredMixin, ListView):
-    model = DeviceRegistration
+class SitesListView(LoginRequiredMixin, ListView):
+    model = SiteRegistration
+    context_object_name = 'sites'
     template_name = 'dataloaderinterface/my-sites.html'
 
     def get_queryset(self):
-        return super(DevicesListView, self).get_queryset().filter(user_id=self.request.user.id)
+        return super(SitesListView, self).get_queryset().filter(django_user_id=self.request.user.id)
+
+    def get_context_data(self, **kwargs):
+        context = super(SitesListView, self).get_context_data()
+        context['followed_sites'] = self.request.user.followed_sites.all()
+        return context
 
 
-class BrowseSitesListView(LoginRequiredMixin, ListView):
-    model = SamplingFeature
+class StatusListView(ListView):
+    model = SiteRegistration
     context_object_name = 'sites'
-    template_name = 'dataloaderinterface/browse-sites.html'
+    template_name = 'dataloaderinterface/status.html'
 
     def get_queryset(self):
-        return super(BrowseSitesListView, self).get_queryset().select_related('site').filter()
+        return super(StatusListView, self).get_queryset().filter(django_user_id=self.request.user.id)
+
+    def get_context_data(self, **kwargs):
+        context = super(StatusListView, self).get_context_data(**kwargs)
+        context['followed_sites'] = self.request.user.followed_sites.all()
+        return context
+
+
+class BrowseSitesListView(ListView):
+    model = SiteRegistration
+    context_object_name = 'sites'
+    template_name = 'dataloaderinterface/browse-sites.html'
 
 
-class DeviceDetailView(LoginRequiredMixin, DetailView):
-    slug_field = 'registration_id'
-    model = DeviceRegistration
-    template_name = 'dataloaderinterface/device_detail.html'
+class SiteDetailView(DetailView):
+    model = SiteRegistration
+    context_object_name = 'site'
+    slug_field = 'sampling_feature_code'
+    slug_url_kwarg = 'sampling_feature_code'
+    template_name = 'dataloaderinterface/site_details.html'
 
     def get_context_data(self, **kwargs):
-        context = super(DeviceDetailView, self).get_context_data()
-        sampling_feature = SamplingFeature.objects.get(sampling_feature_uuid__exact=self.object.deployment_sampling_feature_uuid)
-        context['sampling_feature'] = sampling_feature
-        context['deployment'] = sampling_feature.actions.first()
-        context['feature_actions'] = sampling_feature.feature_actions.with_results().all()
-        context['affiliation'] = context['deployment'].action_by.first().affiliation
-        context['site'] = sampling_feature.site
+        context = super(SiteDetailView, self).get_context_data()
+        context['is_followed'] = self.request.user.is_authenticated and self.request.user.followed_sites.filter(sampling_feature_code=self.object.sampling_feature_code).exists()
         return context
 
 
-class DeviceRegistrationView(LoginRequiredMixin, CreateView):
-    template_name = 'dataloaderinterface/device_registration.html'
+class SiteDeleteView(LoginRequiredMixin, DeleteView):
+    model = SiteRegistration
+    slug_field = 'sampling_feature_code'
+    slug_url_kwarg = 'sampling_feature_code'
     success_url = reverse_lazy('sites_list')
-    model = DeviceRegistration
+
+    def post(self, request, *args, **kwargs):
+        site = self.get_object(self.get_queryset())
+        if not site:
+            raise Http404
+
+        if request.user.id != site.django_user_id:
+            # temporary error. TODO: do something a little bit more elaborate. or maybe not...
+            raise Http404
+
+        sampling_feature = site.sampling_feature
+        data_logger_program = DataLoggerProgramFile.objects.filter(
+            affiliation_id=site.affiliation_id,
+            program_name__contains=sampling_feature.sampling_feature_code
+        ).first()
+        data_logger_file = data_logger_program.data_logger_files.first()
+
+        feature_actions = sampling_feature.feature_actions.with_results().all()
+        for feature_action in feature_actions:
+            result = feature_action.results.first()
+            delete_result(result)
+
+        data_logger_file.delete()
+        data_logger_program.delete()
+        sampling_feature.site.delete()
+        sampling_feature.delete()
+        site.sensors.all().delete()
+        site.delete()
+        return HttpResponseRedirect(self.success_url)
+
+    def get(self, request, *args, **kwargs):
+        raise Http404
+
+
+class SiteUpdateView(LoginRequiredMixin, UpdateView):
+    template_name = 'dataloaderinterface/site_registration.html'
+    model = SiteRegistration
+    slug_field = 'sampling_feature_code'
+    slug_url_kwarg = 'sampling_feature_code'
     object = None
     fields = []
 
+    def get_success_url(self):
+        print 'Getting success url'
+        return reverse_lazy('site_detail', kwargs={'sampling_feature_code': self.object.sampling_feature_code})
+
+    def get_formset_initial_data(self, *args):
+        if self.get_object().django_user != self.request.user and not self.request.user.is_staff:
+            raise Http404
+        registration = self.get_object()
+        result_form_data = [
+            {
+                'result_id': sensor.result_id,
+                'equipment_model': sensor.equipment_model,
+                'variable': sensor.variable,
+                'unit': sensor.unit,
+                'sampled_medium': sensor.medium
+            }
+            for sensor in registration.sensors.all()
+        ]
+        return result_form_data
+
+    def get_context_data(self, **kwargs):
+        if self.get_object().django_user != self.request.user and not self.request.user.is_staff:
+            raise Http404
+        context = super(SiteUpdateView, self).get_context_data()
+        data = self.request.POST if self.request.POST else None
+        sampling_feature = self.get_object().sampling_feature
+        action_by = sampling_feature.feature_actions.first().action.action_by.first()
+
+        context['sampling_feature_form'] = SamplingFeatureForm(data=data, instance=sampling_feature)
+        context['site_form'] = SiteForm(data=data, instance=sampling_feature.site)
+        context['results_formset'] = ResultFormSet(data=data, initial=self.get_formset_initial_data())
+        context['action_by_form'] = ActionByForm(data=data, instance=action_by)
+        context['zoom_level'] = data['zoom-level'] if data and 'zoom-level' in data else None
+        return context
+
+    def post(self, request, *args, **kwargs):
+        if self.get_object().django_user != self.request.user and not self.request.user.is_staff:
+            raise Http404
+        site_registration = SiteRegistration.objects.filter(sampling_feature_code=self.kwargs['sampling_feature_code']).first()
+        sampling_feature = site_registration.sampling_feature
+
+        sampling_feature_form = SamplingFeatureForm(data=self.request.POST, instance=sampling_feature)
+        site_form = SiteForm(data=self.request.POST, instance=sampling_feature.site)
+        results_formset = ResultFormSet(data=self.request.POST, initial=self.get_formset_initial_data())
+        action_by_form = ActionByForm(request.POST)
+        registration_form = self.get_form()
+
+        if all_forms_valid(registration_form, sampling_feature_form, site_form, action_by_form, results_formset):
+            affiliation = action_by_form.cleaned_data['affiliation'] or request.user.odm2user.affiliation
+            data_logger_file = DataLoggerFile.objects.filter(data_logger_file_name=site_registration.sampling_feature_code).first()
+            data_logger_program = data_logger_file.program
+
+            # Update sampling feature
+            sampling_feature_form.instance.save()
+
+            # Update Site
+            site_form.instance.save()
+
+            # Update datalogger program and datalogger file names
+            data_logger_program.program_name = '%s' % sampling_feature.sampling_feature_code
+            data_logger_program.affiliation = affiliation
+            data_logger_program.save()
+
+            data_logger_file.data_logger_file_name = '%s' % sampling_feature.sampling_feature_code
+            data_logger_file.save()
+
+            # Update Site Registration
+            site_registration.affiliation_id = affiliation.affiliation_id
+            site_registration.django_user = User.objects.filter(odm2user__affiliation_id=affiliation.affiliation_id).first()
+            site_registration.person = str(affiliation.person)
+            site_registration.organization = str(affiliation.organization)
+            site_registration.sampling_feature_code = sampling_feature.sampling_feature_code
+            site_registration.sampling_feature_name = sampling_feature.sampling_feature_name
+            site_registration.elevation_m = sampling_feature.elevation_m
+            site_registration.latitude = sampling_feature.site.latitude
+            site_registration.longitude = sampling_feature.site.longitude
+            site_registration.site_type = sampling_feature.site.site_type_id
+            registration_form.instance = site_registration
+            site_registration.save()
+
+            for result_form in results_formset.forms:
+                is_new_result = 'result_id' not in result_form.initial
+                to_delete = result_form['DELETE'].data
+
+                if is_new_result and to_delete:
+                    continue
+                elif is_new_result:
+                    create_result(site_registration, result_form, sampling_feature, affiliation, data_logger_file)
+                    continue
+                elif to_delete:
+                    result = Result.objects.get(result_id=result_form.initial['result_id'])
+                    delete_result(result)
+                    continue
+
+                # Update Result
+                result = Result.objects.get(result_id=result_form.initial['result_id'])
+                result.variable = result_form.cleaned_data['variable']
+                result.sampled_medium = result_form.cleaned_data['sampled_medium']
+                result.unit = result_form.cleaned_data['unit']
+                result.save()
+
+                # Update Data Logger file column
+                instrument_output_variable = InstrumentOutputVariable.objects.filter(
+                    model=result_form.cleaned_data['equipment_model'],
+                    instrument_raw_output_unit=result.unit,
+                    variable=result.variable,
+                ).first()
+
+                data_logger_file_column = result.data_logger_file_columns.first()
+                data_logger_file_column.instrument_output_variable = instrument_output_variable
+                data_logger_file_column.column_label = '%s(%s)' % (result.variable.variable_code, result.unit.unit_abbreviation)
+                data_logger_file_column.save()
+
+                # Update action by
+                action_by = result.feature_action.action.action_by.first()
+                action_by.affiliation = affiliation
+                action_by.save()
+
+                # Update Site Sensor
+                site_sensor = SiteSensor.objects.filter(result_id=result.result_id).first()
+                site_sensor.model_name = instrument_output_variable.model.model_name
+                site_sensor.model_manufacturer = instrument_output_variable.model.model_manufacturer.organization_name
+                site_sensor.variable_name = result.variable.variable_name_id
+                site_sensor.variable_code = result.variable.variable_code
+                site_sensor.unit_name = result.unit.unit_name
+                site_sensor.unit_abbreviation = result.unit.unit_abbreviation
+                site_sensor.sampled_medium = result.sampled_medium_id
+                site_sensor.save()
+
+            messages.success(request, 'The site has been updated successfully.')
+            return self.form_valid(registration_form)
+        else:
+            messages.error(request, 'There are still some required fields that need to be filled out.')
+            return self.form_invalid(registration_form)
+
+
+class SiteRegistrationView(LoginRequiredMixin, CreateView):
+    template_name = 'dataloaderinterface/site_registration.html'
+    model = SiteRegistration
+    object = None
+    fields = []
+
+    def get_success_url(self):
+        return reverse_lazy('site_detail', kwargs={'sampling_feature_code': self.object.sampling_feature_code})
+
     @staticmethod
     def get_default_data():
         data = {
@@ -115,11 +342,12 @@ def get_default_data():
 
     def get_context_data(self, **kwargs):
         default_data = self.get_default_data()
-        context = super(DeviceRegistrationView, self).get_context_data()
+        context = super(SiteRegistrationView, self).get_context_data()
         data = self.request.POST if self.request.POST else None
-        context['sampling_feature_form'] = SamplingFeatureForm(data=data, initial=default_data)
-        context['site_form'] = SiteForm(data=data, initial=default_data)
-        context['results_formset'] = ResultFormSet(data=data, initial=[default_data])
+        context['sampling_feature_form'] = SamplingFeatureForm(data, initial=default_data)
+        context['site_form'] = SiteForm(data, initial=default_data)
+        context['results_formset'] = ResultFormSet(data)
+        context['action_by_form'] = ActionByForm(data)
         context['zoom_level'] = data['zoom-level'] if data and 'zoom-level' in data else None
         return context
 
@@ -127,10 +355,11 @@ def post(self, request, *args, **kwargs):
         sampling_feature_form = SamplingFeatureForm(request.POST)
         site_form = SiteForm(request.POST)
         results_formset = ResultFormSet(request.POST)
+        action_by_form = ActionByForm(request.POST)
         registration_form = self.get_form()
 
-        if self.all_forms_valid(sampling_feature_form, site_form, results_formset):
-            affiliation = request.user.odm2user.affiliation
+        if all_forms_valid(registration_form, sampling_feature_form, site_form, action_by_form, results_formset):
+            affiliation = action_by_form.cleaned_data['affiliation'] or request.user.odm2user.affiliation
 
             # Create sampling feature
             sampling_feature = sampling_feature_form.instance
@@ -143,61 +372,133 @@ def post(self, request, *args, **kwargs):
             site.spatial_reference = SpatialReference.objects.get(srs_name='WGS84')
             site.save()
 
-            for result_form in results_formset.forms:
-                # Create action
-                action = Action(
-                    method=Method.objects.filter(method_type_id='Instrument deployment').first(),
-                    action_type_id='Instrument deployment',
-                    begin_datetime=datetime.now(), begin_datetime_utc_offset=-7
-                )
-                action.save()
-
-                # Create feature action
-                feature_action = FeatureAction(action=action, sampling_feature=sampling_feature)
-                feature_action.save()
-
-                # Create action by
-                action_by = ActionBy(action=action, affiliation=affiliation, is_action_lead=True)
-                action_by.save()
+            # Create Data Logger file
+            data_logger_program = DataLoggerProgramFile.objects.create(
+                affiliation=affiliation,
+                program_name='%s' % sampling_feature.sampling_feature_code
+            )
+
+            data_logger_file = DataLoggerFile.objects.create(
+                program=data_logger_program,
+                data_logger_file_name='%s' % sampling_feature.sampling_feature_code
+            )
+
+            # Create Site Registration TODO: maybe do it in another function.
+            registration_data = {
+                'registration_token': uuid4(),
+                'registration_date': datetime.now(),
+                'django_user': request.user,
+                'affiliation_id': affiliation.affiliation_id,
+                'person': str(affiliation.person),
+                'organization': str(affiliation.organization),
+                'sampling_feature_id': sampling_feature.sampling_feature_id,
+                'sampling_feature_code': sampling_feature.sampling_feature_code,
+                'sampling_feature_name': sampling_feature.sampling_feature_name,
+                'elevation_m': sampling_feature.elevation_m,
+                'latitude': sampling_feature.site.latitude,
+                'longitude': sampling_feature.site.longitude,
+                'site_type': sampling_feature.site.site_type_id
+            }
+
+            site_registration = SiteRegistration(**registration_data)
+            registration_form.instance = site_registration
+            site_registration.save()
 
-                # Create Results
-                result = result_form.instance
-                result.feature_action = feature_action
-                result.result_type_id = 'Time series coverage'
-                result.processing_level = ProcessingLevel.objects.get(processing_level_code='Raw')
-                result.status_id = 'Ongoing'
-                result.save()
+            for result_form in results_formset.forms:
+                create_result(site_registration, result_form, sampling_feature, affiliation, data_logger_file)
 
-                # Create TimeSeriesResults
-                time_series_result = TimeSeriesResult(result=result)
-                time_series_result.aggregation_statistic_id = 'Average'
-                time_series_result.save()
-
-                # maybe create equipments and equipment used for actions so we can keep track of the equipment model
-                # for when we implement the update form.
-                # equipment fields:
-                # code: whatever. an uuid maybe?
-                # name: whatever. same as equipment model name maybe?
-                # equipment type: Sensor
-                # model id: result_form.cleaned_data['equipment model']
-                # serial number: is it relevant?
-                # owner: affiliation.
-                # vendor: is it relevant?
-                # purchase date: definitely not relevant.
-
-            registration_form.instance.deployment_sampling_feature_uuid = sampling_feature.sampling_feature_uuid
-            registration_form.instance.user_id = request.user.id
-            registration_form.instance.authentication_token = uuid4()
-            registration_form.instance.save()
             return self.form_valid(registration_form)
         else:
             messages.error(request, 'There are still some required fields that need to be filled out!')
             return self.form_invalid(registration_form)
 
-    @staticmethod
-    def all_forms_valid(*forms):
-        return reduce(lambda all_valid, form: all_valid and form.is_valid(), forms, True)
-
 
-class DeviceUpdateView(LoginRequiredMixin, UpdateView):
-    pass
+def all_forms_valid(*forms):
+    return reduce(lambda all_valid, form: all_valid and form.is_valid(), forms, True)
+
+
+def create_result(site_registration, result_form, sampling_feature, affiliation, data_logger_file):
+    # Create action
+    action = Action(
+        method=Method.objects.filter(method_type_id='Instrument deployment').first(),
+        action_type_id='Instrument deployment',
+        begin_datetime=datetime.utcnow(), begin_datetime_utc_offset=0
+    )
+    action.save()
+
+    # Create feature action
+    feature_action = FeatureAction(action=action, sampling_feature=sampling_feature)
+    feature_action.save()
+
+    # Create action by
+    action_by = ActionBy(action=action, affiliation=affiliation, is_action_lead=True)
+    action_by.save()
+
+    # Create Results
+    result = result_form.instance
+    result.feature_action = feature_action
+    result.result_type_id = 'Time series coverage'
+    result.processing_level = ProcessingLevel.objects.get(processing_level_code='Raw')
+    result.status_id = 'Ongoing'
+    result.save()
+
+    # Create TimeSeriesResults
+    time_series_result = TimeSeriesResult(result=result)
+    time_series_result.aggregation_statistic_id = 'Average'
+    time_series_result.save()
+
+    # Create Data Logger file column
+    instrument_output_variable = InstrumentOutputVariable.objects.filter(
+        model=result_form.cleaned_data['equipment_model'],
+        variable=result_form.cleaned_data['variable'],
+        instrument_raw_output_unit=result_form.cleaned_data['unit'],
+    ).first()
+
+    DataLoggerFileColumn.objects.create(
+        result=result,
+        data_logger_file=data_logger_file,
+        instrument_output_variable=instrument_output_variable,
+        column_label='%s(%s)' % (result.variable.variable_code, result.unit.unit_abbreviation)
+    )
+
+    sensor_data = {
+        'result_id': result.result_id,
+        'result_uuid': result.result_uuid,
+        'registration': site_registration,
+        'model_name': instrument_output_variable.model.model_name,
+        'model_manufacturer': instrument_output_variable.model.model_manufacturer.organization_name,
+        'variable_name': result.variable.variable_name_id,
+        'variable_code': result.variable.variable_code,
+        'unit_name': result.unit.unit_name,
+        'unit_abbreviation': result.unit.unit_abbreviation,
+        'sampled_medium': result.sampled_medium_id
+    }
+
+    site_sensor = SiteSensor(**sensor_data)
+    site_sensor.save()
+
+    # Create csv file to hold the sensor data.
+    # TODO: have this send a signal and the call to create the file be somewhere else.
+    # lol should've done it.
+    # once more i regret not doing it...
+    serializer = SiteResultSerializer(result)
+    serializer.build_csv()
+
+    return result
+
+
+def delete_result(result):
+    result_id = result.result_id
+    feature_action = result.feature_action
+    action = feature_action.action
+
+    result.data_logger_file_columns.all().delete()
+    result.timeseriesresult.values.all().delete()
+    result.timeseriesresult.delete()
+
+    action.action_by.all().delete()
+    result.delete()
+
+    feature_action.delete()
+    action.delete()
+    SiteSensor.objects.filter(result_id=result_id).delete()
diff --git a/src/dataloaderservices/auth.py b/src/dataloaderservices/auth.py
index 77b8e601..0302f607 100644
--- a/src/dataloaderservices/auth.py
+++ b/src/dataloaderservices/auth.py
@@ -2,7 +2,7 @@
 from rest_framework import authentication
 from rest_framework import exceptions
 
-from dataloaderinterface.models import DeviceRegistration
+from dataloaderinterface.models import DeviceRegistration, SiteRegistration
 
 
 class UUIDAuthentication(authentication.BaseAuthentication):
@@ -10,6 +10,7 @@ def authenticate(self, request):
         if request.META['REQUEST_METHOD'] != 'POST':
             return None
 
+        print 'Request data: {}'.format(request.data)
         if 'HTTP_TOKEN' not in request.META:
             raise exceptions.ParseError("Registration Token not present in the request.")
         elif 'sampling_feature' not in request.data:
@@ -17,13 +18,12 @@ def authenticate(self, request):
 
         # Get auth_token(uuid) from header, get registration object with auth_token, get the user from that registration, verify sampling_feature uuid is registered by this user, be happy.
         token = request.META['HTTP_TOKEN']
-        registration_queryset = DeviceRegistration.objects.using('default').filter(authentication_token=token)
-        if not registration_queryset.exists():
+        registration = SiteRegistration.objects.filter(registration_token=token).first()
+        if not registration:
             raise exceptions.PermissionDenied('Invalid Security Token')
-        registration = registration_queryset.get()
 
         # request needs to have the sampling feature uuid of the registration -
-        if str(registration.deployment_sampling_feature_uuid) != request.data['sampling_feature']:
+        if str(registration.sampling_feature.sampling_feature_uuid) != request.data['sampling_feature']:
             raise exceptions.AuthenticationFailed(
                 'Site Identifier is not associated with this Token')  # or other related exception
 
diff --git a/src/dataloaderservices/migrations/__init__.py b/src/dataloaderservices/migrations/__init__.py
deleted file mode 100644
index e69de29b..00000000
diff --git a/src/dataloaderservices/serializers.py b/src/dataloaderservices/serializers.py
index 2b673493..204b30ee 100644
--- a/src/dataloaderservices/serializers.py
+++ b/src/dataloaderservices/serializers.py
@@ -1,5 +1,6 @@
+from dataloader.models import People, Organization, Affiliation, EquipmentModel, Variable, Unit, TimeSeriesResultValue, \
+    TimeSeriesResult
 from rest_framework import serializers
-from dataloader.models import People, Organization, Affiliation, EquipmentModel, Variable, Unit
 
 
 class VariableSerializer(serializers.ModelSerializer):
diff --git a/src/dataloaderservices/urls.py b/src/dataloaderservices/urls.py
index 84208fef..96785de3 100644
--- a/src/dataloaderservices/urls.py
+++ b/src/dataloaderservices/urls.py
@@ -16,10 +16,11 @@
 from django.conf.urls import url
 from rest_framework.urlpatterns import format_suffix_patterns
 
-from dataloaderservices.views import TimeSeriesValuesApi, OrganizationApi, ModelVariablesApi, ResultApi
+from dataloaderservices.views import TimeSeriesValuesApi, OrganizationApi, ModelVariablesApi, ResultApi, FollowSiteApi
 
 urlpatterns = [
     url(r'^api/data-stream/$', TimeSeriesValuesApi.as_view(), name='api_post'),
+    url(r'^api/follow-site/$', FollowSiteApi.as_view(), name='follow_site'),
     url(r'^api/sensor-form/$', ResultApi.as_view(), name='result_validation_service'),
     url(r'^api/organization/$', OrganizationApi.as_view(), name='organization_service'),
     url(r'^api/equipment-variables/$', ModelVariablesApi.as_view(), name='model_variables_service')
diff --git a/src/dataloaderservices/views.py b/src/dataloaderservices/views.py
index ca5b7c93..1faa7a21 100644
--- a/src/dataloaderservices/views.py
+++ b/src/dataloaderservices/views.py
@@ -1,23 +1,20 @@
-from datetime import datetime
+from datetime import datetime, timedelta
 
+from dataloader.models import SamplingFeature, TimeSeriesResultValue, Unit, EquipmentModel, TimeSeriesResult
 from django.db.models.expressions import F
-from django.shortcuts import render
-
 # Create your views here.
-from django.views.decorators.csrf import csrf_exempt
+from django.utils.dateparse import parse_datetime
+from rest_framework import exceptions
 from rest_framework import status
 from rest_framework.authentication import SessionAuthentication
 from rest_framework.response import Response
 from rest_framework.views import APIView
-from rest_framework import exceptions
 
-from dataloader.models import SamplingFeature, TimeSeriesResultValue, CensorCode, QualityCode, Unit, Affiliation, \
-    EquipmentModel
-from dataloaderinterface.forms import ResultForm, ResultFormSet
-from dataloaderinterface.models import DeviceRegistration
+from dataloaderinterface.csv_serializer import SiteResultSerializer
+from dataloaderinterface.forms import ResultForm
+from dataloaderinterface.models import SiteSensor, SiteRegistration
 from dataloaderservices.auth import UUIDAuthentication
-from dataloaderservices.serializers import AffiliationSerializer, PersonSerializer, OrganizationSerializer, \
-    EquipmentModelSerializer
+from dataloaderservices.serializers import OrganizationSerializer
 
 
 class ResultApi(APIView):
@@ -66,28 +63,56 @@ def post(self, request, format=None):
         return Response(error_data, status=status.HTTP_206_PARTIAL_CONTENT)
 
 
+class FollowSiteApi(APIView):
+    authentication_classes = (SessionAuthentication,)
+
+    def post(self, request, format=None):
+        action = request.data['action']
+        sampling_feature_code = request.data['sampling_feature_code']
+        site = SiteRegistration.objects.get(sampling_feature_code=sampling_feature_code)
+
+        if action == 'follow':
+            request.user.followed_sites.add(site)
+        elif action == 'unfollow':
+            request.user.followed_sites.remove(site)
+
+        return Response({}, status.HTTP_200_OK)
+
+
 class TimeSeriesValuesApi(APIView):
     authentication_classes = (UUIDAuthentication, )
 
     def post(self, request, format=None):
         #  make sure that the data is in the request (sampling_feature, timestamp(?), ...) if not return error response
         # if 'sampling_feature' not in request.data or 'timestamp' not in request.data:
-        if not all(key in request.data for key in ('timestamp', )):
-            raise exceptions.ParseError("Keys sampling_feature or timestamp values not present in the request.")
+        if not all(key in request.data for key in ('timestamp', 'sampling_feature')):
+            raise exceptions.ParseError("Required data not found in request.")
 
         # parse the received timestamp
-        values_timestamp = try_parsing_date(request.data['timestamp'])
+        try:
+            measurement_datetime = parse_datetime(request.data['timestamp'])
+        except ValueError:
+            raise exceptions.ParseError('The timestamp value is not valid.')
+
+        if not measurement_datetime:
+            raise exceptions.ParseError('The timestamp value is not well formatted.')
+
+        if not measurement_datetime.utcoffset():
+            raise exceptions.ParseError('The timestamp value requires timezone information.')
+
+        utc_offset = int(measurement_datetime.utcoffset().total_seconds() / timedelta(hours=1).total_seconds())
+        measurement_datetime = measurement_datetime.replace(tzinfo=None)
 
         # get odm2 sampling feature if it matches sampling feature uuid sent
-        sampling_feature_uuid = request.data['sampling_feature']
-        sampling_feature = SamplingFeature.objects.filter(sampling_feature_uuid__exact=sampling_feature_uuid).first()
+        sampling_feature = SamplingFeature.objects.filter(sampling_feature_uuid__exact=request.data['sampling_feature']).first()
         if not sampling_feature:
-            raise exceptions.ParseError('Sampling Feature UUID does not match any existing Sampling Feature')
+            raise exceptions.ParseError('Sampling Feature code does not match any existing site.')
 
         # get all feature actions related to the sampling feature, along with the results, results variables, and actions.
         feature_actions = sampling_feature.feature_actions.prefetch_related('results__variable', 'action').all()
         for feature_action in feature_actions:
             result = feature_action.results.all().first()
+            is_first_value = result.value_count == 0
 
             # don't create a new TimeSeriesValue for results that are not included in the request
             if str(result.result_uuid) not in request.data:
@@ -95,8 +120,8 @@ def post(self, request, format=None):
 
             result_value = TimeSeriesResultValue(
                 result_id=result.result_id,
-                value_datetime_utc_offset=feature_action.action.begin_datetime_utc_offset,
-                value_datetime=values_timestamp,
+                value_datetime_utc_offset=utc_offset,
+                value_datetime=measurement_datetime,
                 censor_code_id='Not censored',
                 quality_code_id='None',
                 time_aggregation_interval=1,
@@ -112,18 +137,24 @@ def post(self, request, format=None):
                 ))
 
             result.value_count = F('value_count') + 1
-            result.result_datetime = values_timestamp
-            result.result_datetime_utc_offset = feature_action.action.begin_datetime_utc_offset
-            result.save(update_fields=['result_datetime', 'value_count', 'result_datetime_utc_offset'])
+            result.result_datetime = measurement_datetime
+            result.result_datetime_utc_offset = utc_offset
 
-        return Response({}, status.HTTP_201_CREATED)
+            site_sensor = SiteSensor.objects.filter(result_id=result.result_id).first()
+            site_sensor.last_measurement_id = result_value.value_id
 
+            if is_first_value:
+                result.valid_datetime = measurement_datetime
+                result.valid_datetime_utc_offset = utc_offset
+                site_sensor.activation_date = measurement_datetime
+                site_sensor.activation_date_utc_offset = utc_offset
 
-def try_parsing_date(text):
-    for fmt in ('%Y-%m-%d %H:%M:%S', '%Y-%m-%d %H:%M', '%Y-%m-%d'):
-        try:
-            return datetime.strptime(text, fmt)
-        except ValueError:
-            continue
+            site_sensor.save(update_fields=['last_measurement_id', 'activation_date', 'activation_date_utc_offset'])
+            result.save(update_fields=['result_datetime', 'value_count', 'result_datetime_utc_offset', 'valid_datetime', 'valid_datetime_utc_offset'])
 
-    raise exceptions.ParseError('no valid date format found')
+            # Write data to result's csv file
+            # TODO: have this send a signal and the call to add data to the file be somewhere else.
+            serializer = SiteResultSerializer(result)
+            serializer.add_data_value(result_value)
+
+        return Response({}, status.HTTP_201_CREATED)