Selecting Other now asks you to specify the region

- When we updated the extension to use an object to represent the selected tenant this stopped users being able to select "Other" and specify the tenant short code. - This change asks the user to also specify a Region and then generates a tenant object which is set correctly.
techfromsage · Sep 16, 2020 · 5a68a58 · 5a68a58
1 parent c5b20be
commit 5a68a58
Show file tree

Hide file tree

Showing 5 changed files with 88 additions and 23 deletions.
diff --git a/_locales/cy/messages.json b/_locales/cy/messages.json
@@ -6,7 +6,7 @@
     "description": {
         "message": "Talis Aspire Rhestrau Darllen Offeryn Nod Tudalen",
         "description": "Extension description"
-    },    
+    },
     "browserActionTitle": {
         "message": "Ychwanegu Llyfrnod at Rhestr Ddarllen",
         "description": "Message when hovering over extension button"
@@ -31,6 +31,18 @@
         "message": "Arall",
         "description": "Manually specify tenant short code option"
     },
+    "optionsRegionLabel": {
+        "message": "Rhanbarth",
+        "description": "Manually specify region for the given tenant short code optionu"
+    },
+    "optionsRegionEUAPACLabel": {
+        "message": "EU / APAC",
+        "description": "This option sets the region to EU / APAC"
+    },
+    "optionsRegionCALabel": {
+        "message": "CA",
+        "description": "This option sets the region to CA"
+    },
     "optionsShortCodeLabel": {
         "message": "Cod byr:",
         "description": "Manually add tenant by short code input label"
@@ -47,4 +59,4 @@
         "message": "Nodwch sefydliad mewn lleoliadau ymestyn",
         "description": "Alert presented if no institution has been set"
     }
-}
+}
diff --git a/_locales/en/messages.json b/_locales/en/messages.json
@@ -6,7 +6,7 @@
     "description": {
         "message": "Talis Aspire Reading Lists Bookmarking",
         "description": "Extension description"
-    },    
+    },
     "browserActionTitle": {
         "message": "Bookmark to Talis Aspire Reading Lists",
         "description": "Message when hovering over extension button"
@@ -31,6 +31,18 @@
         "message": "Other",
         "description": "Manually specify tenant short code option"
     },
+    "optionsRegionLabel": {
+        "message": "Region",
+        "description": "Manually specify region for the given tenant short code option"
+    },
+    "optionsRegionEUAPACLabel": {
+        "message": "EU / APAC",
+        "description": "This option sets the region to EU / APAC"
+    },
+    "optionsRegionCALabel": {
+        "message": "CA",
+        "description": "This option sets the region to CA"
+    },
     "optionsShortCodeLabel": {
         "message": "Short code:",
         "description": "Manually add tenant by short code input label"
@@ -47,4 +59,4 @@
         "message": "Please specify an institution in extension settings",
         "description": "Alert presented if no institution has been set"
     }
-}
+}
diff --git a/js/options.js b/js/options.js
@@ -9,20 +9,21 @@ $(function() {
         }
     });
     $('#save').on('click', function() {
-        getTenants(function(tenants) {
-            for (var tenantCode in tenants) {
-                if (tenantCode === $('#tenantCode').val()) {
-                  saveActiveTenant(tenants[tenantCode], function() {
-                    // Update status to let user know options were saved.
-                    $('#status').html('<div class="alert alert-success">' + chromeOrBrowser().i18n.getMessage('optionsSettingsSaved') + '</div>');
-                    $('#optionsHelp').addClass('hidden');
-                    setTimeout(function() {
-                      $('#status').textContent = '';
-                    }, 750);
-                  });
+        if ($('#specifyTenant:selected').length > 0) {
+            var otherTenantCode = $('#tenantCode').val();
+            var otherTenantRegion = $('#tenantRegion').val();
+            saveActiveTenantAndUpdateStatus(
+                buildTenant(otherTenantCode, otherTenantRegion)
+            );
+        } else {
+            getTenants(function(tenants) {
+                for (var tenantCode in tenants) {
+                    if (tenantCode === $('#tenantCode').val()) {
+                        saveActiveTenantAndUpdateStatus(tenants[tenantCode]);
+                    }
                 }
-            }
-        });
+            });
+        }
     });
 
     var objects = document.getElementsByTagName('*'), i;
@@ -34,6 +35,17 @@ $(function() {
     loadTenantList();
 });
 
+function saveActiveTenantAndUpdateStatus(tenant) {
+    saveActiveTenant(tenant, function() {
+        // Update status to let user know options were saved.
+        $('#status').html('<div class="alert alert-success">' + chromeOrBrowser().i18n.getMessage('optionsSettingsSaved') + '</div>');
+        $('#optionsHelp').addClass('hidden');
+        setTimeout(function() {
+            $('#status').textContent = '';
+        }, 750);
+    });
+}
+
 function loadTenantList() {
     getActiveTenant(function(activeTenant) {
         if (!activeTenant) {

diff --git a/js/tenants.js b/js/tenants.js
@@ -158,3 +158,21 @@ function getTenantList(cb) {
         cb(tenants);
     });
 }
+
+/**
+ * Simple helper function that returns a tenant object based on a specified
+ * code and region
+ *
+ * @param {string} tenantCode - the tenant short code
+ * @param {string} tenantRegion - the region for this tenancy
+ */
+function buildTenant(tenantCode, tenantRegion) {
+  return {
+    "name" : tenantCode,
+    "code" : tenantCode,
+    "apps" : {
+      "rl" : true
+    },
+    "region" : tenantRegion
+  }
+}
diff --git a/options.html b/options.html
@@ -31,13 +31,24 @@
                 <button id="save" data-message="optionsSave">Save</button>
             </div>
         </div>
-        <div class="row hidden" id="manualEntry">
-            <div class="col-xs-2" data-message="optionsShortCodeLabel">Short code:</div>
-            <div class="col-xs-8">
-                <input type="text" id="tenantCode" />
+        <div class="hidden" id="manualEntry">
+            <div class="row">
+                <div class="col-xs-2" data-message="optionsShortCodeLabel">Short code:</div>
+                <div class="col-xs-2">
+                    <input type="text" id="tenantCode" />
+                </div>
             </div>
+            <div class="row">
+                <div class="col-xs-2" data-message="optionsRegionLabel">Region:</div>
+                <div class="col-xs-2">
+                    <select id="tenantRegion">
+                        <option value="" data-message="optionsChooseOneOptionLabel">Choose one</option>
+                        <option id="EUAPAC" value="EUAPAC" data-message="optionsRegionEUAPACLabel">EU / APAC</option>
+                        <option id="CA" value="CA" data-message="optionsRegionCALabel">Canada</option>
+                    </select>
+                </div>
+                </div>
         </div>
-
     </div>
 </body>
-</html>
+</html>