Merge pull request #917 from sebastianbarry/places-survey

Trip additions complete end to end

www/css/main.diary.css

@@ -199,10 +199,11 @@ a.item-content {
 }
 
 .unified-diary-item {
-  padding: 0;
-  margin: 0 1rem 0 1rem;
+  padding: 6px;
+  margin: 0 10px;
   border-width: 0;
   background-color: transparent;
+  height: min-content;
   /* height: 250px; */
 }
 
@@ -216,6 +217,25 @@ a.item-content {
   overflow: hidden;
   box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
   display: flex;
+  flex-wrap: wrap;
+}
+
+/* used for place list items */
+.diary-card.short {
+  /*height: 100px;*/
+  background-color: rgba(128, 208, 255, 0.8);
+  margin: auto;
+  text-align: center;
+}
+
+.place-title {
+  color: #222;
+  display: flex;
+  justify-content: center;
+}
+
+.place-title b {
+  margin-left: 10px;
 }
 
 .diary-button {
@@ -337,6 +357,11 @@ a.item-content {
   /* height must be specified in the html */
 }
 
+/* when trip notes are enabled, the map has rounded right corners */
+.enhanced-trip-item .diary-map {
+  border-radius: 30px 0px 30px 0px;
+}
+
 .diary-map-shell {
   width: 50%;
 }
@@ -351,6 +376,11 @@ a.item-content {
   height: 50%;
 }
 
+/* to center the enketo/multilabel button */
+.diary-infos:nth-child(2) {
+  justify-content: center;
+}
+
 .diary-distance-time {
   font-style: normal;
   font-weight: bold;
@@ -443,3 +473,40 @@ div.labelfilterlist {
   border-top-right-radius: 5px;
   border-bottom-right-radius: 5px;
 }
+
+.enketo-button button {
+  border-color: rgba(0,0,0, .2);
+  box-shadow: 0 3px 6px rgba(0,0,0,0.1), 0 3px 6px rgba(0,0,0,0.1);
+}
+
+.enketo-button b {
+  vertical-align: middle;
+  margin-left: .5em;
+}
+
+.enketo-button, .enketo-button .icon:before {
+  line-height: 100%;
+}
+
+enketo-notes-list, .notes-list {
+  width: 100%;
+  margin-bottom: 0px;
+}
+
+.notes-list {
+  padding: 0 5px 5px 5px;
+  text-align: center;
+}
+
+.notes-list-entry {
+  display: grid;
+  grid-template-columns: 10fr 9fr 1fr;
+  place-items: center;
+  overflow: hidden;
+  font-size: 13px;
+  height: 40px;
+}
+
+.notes-list-entry .icon {
+  font-size: 24px;
+}

www/index.html

@@ -105,6 +105,7 @@
     <script src="js/diary/list.js"></script>
     <script src="js/diary/diary_list_item.js"></script>
     <script src="js/diary/infinite_scroll_trip_item.js"></script>
+    <script src="js/diary/infinite_scroll_place_item.js"></script>
     <script src="js/diary/infinite_scroll_list.js"></script>
     <script src="js/diary/infinite_scroll_detail.js"></script>
     <script src="js/diary/current.js"></script>
@@ -124,6 +125,8 @@
     <script src="js/survey/enketo/infinite_scroll_filters.js"></script>
     <script src="js/survey/enketo/enketo-trip-button.js"></script>
     <script src="js/survey/enketo/enketo-demographics.js"></script>
+    <script src="js/survey/enketo/enketo-add-note-button.js"></script>
+    <script src="js/survey/enketo/enketo-notes-list.js"></script>
     <script src="js/survey/enketo/enketo-preview.js"></script>
     <script src="js/heatmap.js"></script>
     <script src="js/metrics.js"></script>

www/js/config/dynamic_config.js

@@ -45,7 +45,9 @@ angular.module('emission.config.dynamic', ['emission.plugin.logger'])
             Logger.displayError("Invalid source", "Configurations from "+source+" not supported, please contact the app developer");
             return;
         };
-        const downloadURL = "https://raw.githubusercontent.com/e-mission/nrel-openpath-deploy-configs/main/configs/"+label+".nrel-op.json"
+        // The URL prefix from which config files will be downloaded and read.
+        // Change this if you supply your own config files. TODO: on merge, change this from sebastianbarry's branch to the master e-mission branch
+        const downloadURL = "https://raw.githubusercontent.com/sebastianbarry/nrel-openpath-deploy-configs/surveys-info-and-surveys-data/configs/"+label+".nrel-op.json"
         Logger.log("Downloading data from "+downloadURL);
         return $http.get(downloadURL).then((result) => {
             Logger.log("Successfully found the "+downloadURL+", result is " + JSON.stringify(result.data).substring(0,10));
@@ -56,8 +58,6 @@ angular.module('emission.config.dynamic', ['emission.plugin.logger'])
                 +" for "+parsedConfig.intro.translated_text.en.deployment_name
                 +" and data collection URL "+connectionURL);
             return parsedConfig;
-        }).catch((fetchErr) => {
-            Logger.displayError("Unable to download study config", fetchErr);
         });
     }
 
@@ -77,6 +77,37 @@ angular.module('emission.config.dynamic', ['emission.plugin.logger'])
             .catch((err) => Logger.displayError("Unable to read saved config", err));
     }
 
+    /**
+     * loadNewConfig download and load a new config from the server if it is a differ
+     * @param {[]} urlComponents specify the label and source of the config to load
+     * @param {} thenGoToIntro whether to go to the intro screen after loading the config
+     * @param {} [existingVersion=null] if the new config's version is the same, we won't update
+     * @returns {boolean} boolean representing whether the config was updated or not
+     */
+    var loadNewConfig = function (urlComponents, thenGoToIntro, existingVersion=null) {
+        return readConfigFromServer(urlComponents.label, urlComponents.source).then((downloadedConfig) => {
+            if (downloadedConfig.version == existingVersion) {
+                Logger.log("UI_CONFIG: Not updating config because version is the same");
+                return Promise.resolve(false);
+            }
+            // we can use angular.extend since urlComponents is not nested
+            // need to change this to angular.merge if that changes
+            const toSaveConfig = angular.extend(downloadedConfig, {joined: urlComponents});
+            const storeConfigPromise = $window.cordova.plugins.BEMUserCache.putRWDocument(
+                CONFIG_PHONE_UI, toSaveConfig);
+            const logSuccess = (storeResults) => Logger.log("UI_CONFIG: Stored dynamic config successfully, result = "+JSON.stringify(storeResults));
+            // loaded new config, so it is both ready and changed
+            return storeConfigPromise.then(logSuccess)
+                .then(dc.saveAndNotifyConfigChanged(downloadedConfig))
+                .then(dc.saveAndNotifyConfigReady(downloadedConfig))
+                .then(() => {
+                    if (thenGoToIntro) $state.go("root.intro")
+                })
+                .then(() => true)
+                .catch((storeError) => Logger.displayError("Error storing downloaded study configuration", storeError));
+        });
+    }
+
     dc.saveAndNotifyConfigReady = function(newConfig) {
         dc.config = newConfig;
         dc.isConfigReady = true;
@@ -136,29 +167,33 @@ angular.module('emission.config.dynamic', ['emission.plugin.logger'])
                 $rootScope.$apply(() => dc.saveAndNotifyConfigReady);
                 return; // labels are the same
             }
-            // if the labels are different
-            return readConfigFromServer(urlComponents.label, urlComponents.source).then((downloadedConfig) => {
-                // we can use angular.extend since urlComponents is not nested
-                // need to change this to angular.merge if that changes
-                const toSaveConfig = angular.extend(downloadedConfig, {joined: urlComponents});
-                const storeConfigPromise = $window.cordova.plugins.BEMUserCache.putRWDocument(
-                    CONFIG_PHONE_UI, toSaveConfig);
-                const logSuccess = (storeResults) => Logger.log("UI_CONFIG: Stored dynamic config successfully, result = "+JSON.stringify(storeResults));
-                // loaded new config, so it is both ready and changed
-                return storeConfigPromise.then(logSuccess)
-                    .then(dc.saveAndNotifyConfigChanged(downloadedConfig))
-                    .then(dc.saveAndNotifyConfigReady(downloadedConfig))
-                    .then($state.go("root.intro"))
-                    .catch((storeError) => Logger.displayError("Error storing downloaded study configuration", storeError));
-            });
+            // if the labels are different, we need to download the new config
+            return loadNewConfig(urlComponents, true)
+                .catch((fetchErr) => {
+                    Logger.displayError("Unable to download study config", fetchErr);
+                });
         });
     };
-    dc.initAtLaunch = function() {
+    dc.initAtLaunch = function () {
         loadSavedConfig().then((existingConfig) => {
-            if(existingConfig) {
-                // the user has already configured the app, let's cache the
-                // config and notify others that we are done
-                Logger.log("UI_CONFIG: finished loading config on app start");
+            if (!existingConfig) {
+                return Logger.log("UI_CONFIG: No existing config, skipping");
+            }
+            // if 'autoRefresh' is set, we will check for updates
+            if (existingConfig.autoRefresh) {
+                loadNewConfig(existingConfig.joined, false, existingConfig.version)
+                    .then((wasUpdated) => {
+                        if (!wasUpdated) {
+                            // config was not updated so we will proceed with existing config
+                            $rootScope.$evalAsync(() => dc.saveAndNotifyConfigReady(existingConfig));
+                        }
+                    }).catch((fetchErr) => {
+                        // if we can't check for an updated config, we will proceed with the existing config
+                        Logger.log("UI_CONFIG: Unable to check for update, skipping", fetchErr);
+                        $rootScope.$evalAsync(() => dc.saveAndNotifyConfigReady(existingConfig));
+                    });
+            } else {
+                Logger.log("UI_CONFIG: autoRefresh is false, not checking for updates. Using existing config")
                 $rootScope.$apply(() => dc.saveAndNotifyConfigReady(existingConfig));
             }
         }).catch((err) => {

www/js/diary/detail.js

@@ -11,10 +11,17 @@ angular.module('emission.main.diary.detail',['ui-leaflet', 'ng-walkthrough',
                                         $state, $stateParams, ClientStats, $ionicActionSheet,
                                         leafletData, leafletMapEvents, nzTour, KVStore,
                                         Logger, Timeline, DiaryHelper, SurveyOptions, Config, ImperialConfig,
-                                        CommHelper, PostTripManualMarker, $translate) {
-  console.log("controller DiaryDetailCtrl called with params = "+
-    JSON.stringify($stateParams));
-  $scope.surveyOpt = SurveyOptions.MULTILABEL;
+                                        DynamicConfig, CommHelper, PostTripManualMarker, $translate) {
+  console.log("controller DiaryDetailCtrl called with params = "+JSON.stringify($stateParams));
+
+  $ionicPlatform.ready().then(function () {
+    DynamicConfig.configReady().then((configObj) => {
+      const surveyOptKey = configObj.survey_info['trip-labels'];
+      $scope.surveyOpt = SurveyOptions[surveyOptKey];
+      console.log('surveyOpt in details.js is', $scope.surveyOpt);
+    });
+  });
+
   $scope.tripFilterFactory = $injector.get($scope.surveyOpt.filter);
   $scope.filterInputs = $scope.tripFilterFactory.configuredFilters;
 

www/js/diary/diary_list_item.js

@@ -12,19 +12,18 @@ angular.module('emission.main.diary.diarylistitem', [
     return{
         restrict: 'E',
         scope: {
-            tripgj: '='
+            tripgj: '=',
+            config: '=',
         },
         controller: 'DiaryListItemCtrl',
         templateUrl: 'templates/diary/diary_list_item.html'
     };
 })
 
-.controller("DiaryListItemCtrl", function(
-                                        $scope,
-                                        SurveyOptions,
-                                        $state, Config
-){
-    $scope.surveyOpt = SurveyOptions.MULTILABEL;
+.controller("DiaryListItemCtrl", function($scope, SurveyOptions, $state, Config) {
+    const surveyOptKey = $scope.config?.survey_info?.['trip-labels'];
+    $scope.surveyOpt = SurveyOptions[surveyOptKey];
+    console.log('surveyOpt in diary_list_item.js is', $scope.surveyOpt);
     const DEFAULT_ITEM_HT = 335;
     $scope.itemHt = DEFAULT_ITEM_HT;
 

www/js/diary/infinite_scroll_detail.js

@@ -11,12 +11,19 @@ angular.module('emission.main.diary.infscrolldetail',['ui-leaflet', 'ng-walkthro
                                         $state, $stateParams, ClientStats, $ionicActionSheet,
                                         leafletData, leafletMapEvents, nzTour, KVStore,
                                         Logger, Timeline, DiaryHelper, SurveyOptions, Config, ImperialConfig,
-                                        CommHelper, PostTripManualMarker, $translate) {
+                                        DynamicConfig, CommHelper, PostTripManualMarker, $translate) {
   console.log("controller InfiniteDiaryDetailCtrl called with params = "+
     JSON.stringify($stateParams));
-  $scope.surveyOpt = SurveyOptions.MULTILABEL;
-  $scope.tripFilterFactory = $injector.get($scope.surveyOpt.filter);
-  $scope.filterInputs = $scope.tripFilterFactory.configuredFilters;
+
+  $ionicPlatform.ready().then(function () {
+    DynamicConfig.configReady().then((configObj) => {
+      const surveyOptKey = configObj.survey_info['trip-labels'];
+      $scope.surveyOpt = SurveyOptions[surveyOptKey];
+      console.log('surveyOpt in infinite_scroll_details.js is', $scope.surveyOpt);
+      $scope.tripFilterFactory = $injector.get($scope.surveyOpt.filter);
+      $scope.filterInputs = $scope.tripFilterFactory.configuredFilters;
+    });
+  });
 
   $scope.mapCtrl = {};
   angular.extend($scope.mapCtrl, {