CMU-CREATE-Lab · yliankuo · Feb 4, 2021 · Feb 4, 2021 · Mar 25, 2021 · Mar 25, 2021
diff --git a/config.xml b/config.xml
@@ -24,6 +24,7 @@
     <allow-navigation href="https://api.smellpittsburgh.org/*" />
     <allow-navigation href="https://staging.api.smellpittsburgh.org/*" />
     <platform name="android">
+        <preference name="AndroidXEnabled" value="true" />
         <allow-intent href="market:*" />
         <preference name="backgroundColor" value="0xffffffff" />
         <splash density="port-hdpi" src="res/screen/android/splash-port-hdpi.png" />
@@ -113,27 +114,21 @@
     <plugin name="cordova-plugin-spinner" spec="1.1.0" />
     <plugin name="cordova-plugin-statusbar" spec="2.4.3" />
     <plugin name="cordova-plugin-whitelist" spec="1.3.4" />
-    <plugin name="cordova.plugins.diagnostic" spec="5.0.2" />
-    <plugin name="cordova-plugin-geolocation" spec="4.0.2" />
-    <plugin name="cordova-plugin-splashscreen" spec="5.0.3" />
+    <plugin name="cordova.plugins.diagnostic" spec="6.0.3" />
+    <plugin name="cordova-plugin-geolocation" spec="4.1.0" />
+    <plugin name="cordova-plugin-splashscreen" spec="6.0.0" />
     <preference name="ShowSplashScreenSpinner" value="false" />
     <preference name="SplashScreen" value="screen" />
     <preference name="DisallowOverscroll" value="true" />
     <plugin name="cordova-plugin-nativegeocoder" spec="3.4.1" />
-    <plugin name="cordova-plugin-ionic-keyboard" spec="2.1.3" />
-    <plugin name="cordova-plugin-globalization" spec="^1.11.0" />
     <!--
-       Any version higher causes a Multidex build error because of the addtional firebase methods added.
-       We can either use the https://github.com/adriano-di-giovanni/cordova-plugin-enable-multidex plugin
-       or wait until the firebase plugin gets split up into modules.
+      Version 2.2.0 misbehaves with the app
     -->
-    <plugin name="cordova-plugin-firebasex" spec="7.0.2" />
-    <plugin name="cordova-plugin-androidx" spec="1.0.2" />
-    <plugin name="cordova-plugin-androidx-adapter" spec="1.1.1" />
-    <plugin name="cordova-plugin-wkwebview-engine" spec="1.2.1" />
-    <plugin name="cordova-plugin-migrate-localstorage" spec="0.0.2" />
+    <plugin name="cordova-plugin-ionic-keyboard" spec="2.1.3" />
+    <plugin name="cordova-plugin-globalization" spec="^1.11.0" />
+    <plugin name="cordova-plugin-firebasex" spec="12.1.0" />
     <plugin name="cordova-custom-config" spec="5.1.0" />
-    <engine name="browser" spec="^5.0.4" />
-    <engine name="ios" spec="^5.1.1" />
-    <engine name="android" spec="^8.1.0" />
+    <engine name="browser" spec="^6.0.0" />
+    <engine name="ios" spec="^6.2.0" />
+    <engine name="android" spec="^9.0.0" />
 </widget>
diff --git a/www/css/index.css b/www/css/index.css
@@ -73,7 +73,7 @@ div[data-role="panel"] {
   position: absolute !important;
   width: calc(100% - 60px) !important;
   padding-left: 30px !important;
-  bottom: 5% !important;
+  bottom: -6px !important;
   -webkit-box-sizing: content-box;
   -moz-box-sizing: content-box;
   box-sizing: content-box;

diff --git a/www/index.html b/www/index.html
@@ -37,6 +37,7 @@
     <script src="js/pages/aboutpage.js"></script>
     <script src="js/pages/overviewpage.js"></script>
     <script src="js/pages/howitworkspage.js"></script>
+    <script src="js/pages/communityguidelines.js"></script>
     <script src="js/pages/maperrorpage.js"></script>
     <!-- <script src="js/pages/locationselectpage.js"></script> -->
     <script src="js/firebase.js"></script>
@@ -80,6 +81,7 @@ <h1 class="modal-title">{{predictionModal.h1}}</h1>
          <li><a href="#overview" data-transition="none">{{panel.li1}}</a></li>
          <li><a href="#howitworks" data-transition="none">{{panel.li2}}</a></li>
          <li><a href="#settings" data-transition="none">{{panel.li3}}</a></li>
+         <li><a href="#communityguidelines" data-transition="none">{{panel.li5}}</a></li>
          <li><a href="#about" data-transition="none">{{panel.li4}}</a></li>
        </ul><br/>
        <!-- <a class="close-button" href="#" data-rel="close" data-role="button" data-icon="carat-l" data-inline="true">{{panel.a}}</a> -->
@@ -179,6 +181,7 @@ <h1 class="modal-title">{{modal.h1}}</h1>
           <li><a href="#overview" data-transition="none">{{panel.li1}}</a></li>
           <li><a href="#howitworks" data-transition="none">{{panel.li2}}</a></li>
           <li><a href="#settings" data-transition="none">{{panel.li3}}</a></li>
+          <li><a href="#communityguidelines" data-transition="none">{{panel.li5}}</a></li>
           <li><a href="#about" data-transition="none">{{panel.li4}}</a></li>
         </ul><br/>
         <!-- <a class="close-button" href="#" data-rel="close" data-role="button" data-icon="carat-l" data-inline="true">{{panel.a}}</a> -->
@@ -219,6 +222,7 @@ <h3>{{{newCity.h3}}}</h3>
             <li><a href="#overview" data-transition="none">{{panel.li1}}</a></li>
             <li><a href="#howitworks" data-transition="none">{{panel.li2}}</a></li>
             <li><a href="#" class="ui-btn ui-btn-active" data-transition="none">{{panel.li3}}</a></li>
+            <li><a href="#communityguidelines" data-transition="none">{{panel.li5}}</a></li>
             <li><a href="#about" data-transition="none">{{panel.li4}}</a></li>
           </ul><br/>
            <!-- <a class="close-button"href="#" data-rel="close" data-role="button" data-icon="carat-l" data-inline="true">{{panel.a}}</a> -->
@@ -244,10 +248,24 @@ <h3>{{contact.h3}}</h3>
             <p class="regulatory-agency-note">{{{contact.regulatoryAgencyNote}}}</p>
           </div>
           <div id="notificationsCollapsible" data-role="collapsible">
-            <h3>{{notification.h3}}</h3>
+            <h3>{{notification.head1}}</h3>
             <label class="settings-description">{{notification.label1}}</label>
-            <label for="checkbox_notifications">{{notification.label2}}<label class="settings-description-smaller">{{notification.label3}}</label></label>
-            <input type="checkbox" id="checkbox_notifications" />
+            <div id="locNotificationsCollapsible" data-role="collapsible">
+            <h3>{{notification.head2}}</h3>
+              <label class="settings-description">{{notification.label2}}</label>
+            </div>
+            <div id="typeNotificationsCollapsible" data-role="collapsible">
+            <h3>{{notification.head3}}</h3>
+              <label class="settings-description">{{notification.label7}}</label>
+              <label for="reminder_notifications">{{notification.label8}}</label>
+              <input type="checkbox" id="reminder_notifications" />
+              <label for="aqi_notifications">{{notification.label9}}</label>
+              <input type="checkbox" id="aqi_notifications" />
+              <label for="report_notifications">{{notification.label10}}</label>
+              <input type="checkbox" id="report_notifications"/>
+              <label for="predict_notifications">{{notification.label11}}<label class="settings-description-smaller">{{notification.label12}}</label></label>
+              <input type="checkbox" id="predict_notifications" />
+            </div>            
           </div>
 
       </div>
@@ -329,6 +347,7 @@ <h3>{{h3}}</h3>
          <li><a href="#overview" data-transition="none">{{panel.li1}}</a></li>
          <li><a href="#howitworks" data-transition="none">{{panel.li2}}</a></li>
          <li><a href="#settings" data-transition="none">{{panel.li3}}</a></li>
+         <li><a href="#communityguidelines" data-transition="none">{{panel.li5}}</a></li>
          <li><a href="#about" data-transition="none">{{panel.li4}}</a></li>
        </ul><br/>
        <!-- <a class="close-button" href="#" data-rel="close" data-role="button" data-icon="carat-l" data-inline="true">{{panel.a}}</a> -->
@@ -361,6 +380,7 @@ <h3>{{h3}}</h3>
             <li><a href="#overview" data-transition="none">{{panel.li1}}</a></li>
             <li><a href="#howitworks" data-transition="none">{{panel.li2}}</a></li>
             <li><a href="#settings" data-transition="none">{{panel.li3}}</a></li>
+            <li><a href="#communityguidelines" data-transition="none">{{panel.li5}}</a></li>
             <li><a href="#" class="ui-btn ui-btn-active"  data-transition="none">{{panel.li4}}</a></li>
          </ul><br/>
          <!-- <a class="close-button" href="#" data-rel="close" data-role="button" data-icon="carat-l" data-inline="true">{{panel.a}}</a> -->
@@ -402,6 +422,7 @@ <h2 class="local-partners-heading">{{h2_4}}</h2>
             <li><a href="#" class="ui-btn ui-btn-active" data-transition="none">{{panel.li1}}</a></li>
             <li><a href="#howitworks" data-transition="none">{{panel.li2}}</a></li>
             <li><a href="#settings" data-transition="none">{{panel.li3}}</a></li>
+            <li><a href="#communityguidelines" data-transition="none">{{panel.li5}}</a></li>
             <li><a href="#about" data-transition="none">{{panel.li4}}</a></li>
          </ul><br/>
          <!-- <a class="close-button" href="#" data-rel="close" data-role="button" data-icon="carat-l" data-inline="true">{{panel.a}}</a> -->
@@ -448,6 +469,7 @@ <h2>{{h2_5}}</h2>
            <li><a href="#overview" data-transition="none">{{panel.li1}}</a></li>
            <li><a href="#" class="ui-btn ui-btn-active" data-transition="none">{{panel.li2}}</a></li>
            <li><a href="#settings" data-transition="none">{{panel.li3}}</a></li>
+           <li><a href="#communityguidelines" data-transition="none">{{panel.li5}}</a></li>
            <li><a href="#about" data-transition="none">{{panel.li4}}</a></li>
          </ul><br/>
          <!-- <a class="close-button" href="#" data-rel="close" data-role="button" data-icon="carat-l" data-inline="true">{{panel.a}}</a> -->
@@ -498,6 +520,42 @@ <h1>{{header.h1}}</h1>
          </div>
        </div>
     </script>
+    <!--communityguidelines page template-->
+    <script id="communityguidelines-tpl" type="text/template">
+      <!-- panel -->
+       <div data-role="panel" id="communityguidelines-panel" data-display="overlay" data-theme="none" data-position-fixed="true">
+         <ul data-role="listview" data-inset="false" data-icon="false">
+           <li><a href="#overview" data-transition="none">{{panel.li1}}</a></li>
+           <li><a href="#howitworks" data-transition="none">{{panel.li2}}</a></li>
+           <li><a href="#settings" data-transition="none">{{panel.li3}}</a></li>
+           <li><a href="#" class="ui-btn ui-btn-active" data-transition="none">{{panel.li5}}</a></li>
+           <li><a href="#about" data-transition="none">{{panel.li4}}</a></li>
+         </ul><br/>
+         <!-- <a class="close-button" href="#" data-rel="close" data-role="button" data-icon="carat-l" data-inline="true">{{panel.a}}</a> -->
+       </div>
+       <!-- header -->
+       <div data-role="header" data-position="fixed" data-tap-toggle="false">
+         <a href="#communityguidelines-panel" class="ui-btn ui-corner-all ui-shadow ui-icon-bars ui-btn-icon-left">{{header.a}}</a>
+         <h1>{{header.h1}}</h1>
+         <a class="back-x ui-btn ui-btn-right ui-corner-all ui-shadow ui-icon-delete ui-btn-icon-notext"></a>
+       </div>
+       <!-- main -->
+       <div role="main" class="ui-content">
+         <h2>{{h2_1}}</h2>
+         <p>{{{p1}}}</p>
+         <p>{{p2}}</p>
+         <div>{{{note}}}</div>
+       </div>
+       <!-- footer -->
+       <div data-role="footer" data-position="fixed" data-id="settings_1" data-tap-toggle="false">
+         <div data-role="navbar">
+           <ul>
+             <li><a href="#home" data-transition="none"><span class="ui-icon-edit ui-btn-icon-notext inlineIcon"></span>{{footer.li1}}</a></li>
+             <li><a href="#map" data-transition="none"><span class="ui-icon-user ui-btn-icon-notext inlineIcon"></span>{{footer.li2}}</a></li>
+           </ul>
+         </div>
+       </div>
+    </script>
     <!--locationselect page template-->
     <script id="locationselect-tpl" type="text/template"></script>
     <div data-role="page" id="home">
@@ -516,6 +574,8 @@ <h1>{{header.h1}}</h1>
     </div>
     <div data-role="page" id="howitworks">
     </div>
+    <div data-role="page" id="communityguidelines">
+    </div>
     <div data-role="page" id="maperror">
     </div>
     <div data-role="page" id="locationselect" class="page-fullscreened">
@@ -525,6 +585,7 @@ <h1>{{header.h1}}</h1>
            <li><a href="#overview" data-transition="none">{{panel.li1}}</a></li>
            <li><a href="#howitworks" data-transition="none">{{panel.li2}}</a></li>
            <li><a href="#settings" data-transition="none">{{panel.li3}}</a></li>
+           <li><a href="#communityguidelines" data-transition="none">{{panel.li5}}</a></li>
            <li><a href="#about" data-transition="none">{{panel.li4}}</a></li>
         </ul>
         <br/>

diff --git a/www/js/app.js b/www/js/app.js
@@ -94,6 +94,9 @@ var App = {
       case Constants.HOW_IT_WORKS_PAGE:
         HowItWorksPage.initialize();
         break;
+      case Constants.COMMUNITY_GUIDELINES:
+        CommunityGuidelines.initialize();
+        break;
       case Constants.LOCATION_SELECT_PAGE:
         if (callbackType == App.CallbackType.CREATE) {
           LocationSelectPage.initialize();
@@ -135,9 +138,15 @@ var App = {
     window.addEventListener('keyboardDidHide', onKeyboardHide);
 
     // Logic for deciding when to display the new update features page
+    // Disabled for now but we'll subscribe old users who were subbed to old 
+    // notifications topics to the new ones
     if(new Date(LocalStorage.get("last_update_notification")) < (new Date(Constants.UPDATE_NEEDING_NOTIFICATION_DATE))){
       LocalStorage.set("last_update_notification", Constants.UPDATE_NEEDING_NOTIFICATION_DATE);
       LocalStorage.set("new_user_update",true);
+      // Disabled for now but we'll subscribe old users who were subbed to old 
+      // notifications topics to the new ones
+      // Firebase.unsubscribe("ReminderNotification");
+      // Firebase.subscribe("RMD");
     }
     if (LocalStorage.get("firsttime_startup")) {
       App.navigateToPage(Constants.STARTUP_PAGE);
@@ -154,6 +163,8 @@ var App = {
       }
     }
 
+
+
     // iOS fix for links
     $(document).on("click", "a[target='_blank']", function(e) {
       e.preventDefault();

diff --git a/www/js/constants.js b/www/js/constants.js
@@ -22,6 +22,7 @@ var Constants = {
   OVERVIEW_PAGE: "overview",
   LOCATION_SELECT_PAGE: "locationselect",
   HOW_IT_WORKS_PAGE: "howitworks",
+  COMMUNITY_GUIDELINES: "communityguidelines",
   MAP_ERROR_PAGE: "maperror",
 
   // Local Storage keys
@@ -34,13 +35,32 @@ var Constants = {
   NAME_KEY: "name",
   PHONE_KEY: "phone",
 
+
   // Topic strings
   GLOBAL_TOPIC: "GlobalTopic",
   PITTSBURGH_AQI_TOPIC: "pghaqi",
   SMELL_REPORT_TOPIC: "SmellReports",
 
+
+  // No Longer needed as we now pull locations from the server
+  // // Locations
+  // BAYAREA_TOPIC: "BA",
+  // LOUISVILLE_TOPIC: "LOU",
+
+  // // Todo: Change to PGH for consistency, currently pghaqi for backcompatability
+  // PITTSBURGH_TOPIC: "pghaqi",
+  // PORTLAND_TOPIC: "PDX",
+
+ //Notification Types 
+  REMINDER_TOPIC: "RMD",
+  AQI_TOPIC: "AQI",
+  REPORT_TOPIC: "RPT",
+  PREDICT_TOPIC: "PRED",
+
   //Make associated topic on Firebase
   REMINDER_NOTIFICATION_TOPIC: "ReminderNotification",
+
+
   // Location services enums
   AuthorizationEnum: {
     NOT_REQUESTED: "not requested",

diff --git a/www/js/pages/communityguidelines.js b/www/js/pages/communityguidelines.js
@@ -0,0 +1,38 @@
+var CommunityGuidelines = {
+
+  text: null, //the text for the page's template
+  didInitialLoad: false,
+
+
+  loadTemplate: function() {
+    this.text = App.text.communityguidelines;
+    var communityguidelinesTpl = Handlebars.compile($("#communityguidelines-tpl").html());
+    $('#communityguidelines').html(communityguidelinesTpl(this.text));
+    $('#communityguidelines').trigger('create');
+  },
+
+
+  setListeners: function() {
+    // add back (x) button functionality
+    $(".back-x").click(function() {App.navigateToPastPage()});
+  },
+
+
+  onCreate: function() {
+    if (!CommunityGuidelines.didInitialLoad) {
+      CommunityGuidelines.didInitialLoad = true;
+      this.loadTemplate();
+      this.setListeners();
+    }
+  },
+
+
+  initialize: function () {
+    console.log("CommunityGuidelines.initialize (deprecated; start using onCreate instead)");
+    CommunityGuidelines.onCreate();
+  },
+
+
+  // helper functions
+
+}
diff --git a/www/js/pages/homepage.js b/www/js/pages/homepage.js
@@ -385,10 +385,17 @@ var HomePage = {
         HomePage.clearForm();
         HomePage.request = null;
         HomePage.submittingReport = false;
-        MapPage.centerLocation = [ data["latitude"], data["longitude"] ];
-        App.navigateToPage(Constants.MAP_PAGE);
-        //Popup notifying user of successful submission
-        App.showPopup("success-popup",4000);
+
+
+        if(data.error){
+          alert(data.error);
+        }else{
+          MapPage.centerLocation = [ data["latitude"], data["longitude"] ];
+          App.navigateToPage(Constants.MAP_PAGE);
+          //Popup notifying user of successful submission
+          App.showPopup("success-popup",4000);      
+        }
+
       },
 
       error: function(msg) {
@@ -406,7 +413,12 @@ var HomePage = {
             alert("Request timed out. Please try again.");
             break;
           default:
-            alert("There was a problem submitting this report. Error code: S2");
+            if(msg.responseText.error){
+              alert(msg.responseText.error);
+            }
+            else{
+              alert("There was a problem submitting this report. Error code: S2");
+            }
             break;
         }
       },