Issue #SB-16649 fix: webview update popup

buildConfig/data/staging/form/form-config_webview_version_get.json

@@ -0,0 +1,32 @@
+{
+    "id": "api.form.read",
+    "params": {
+        "resmsgid": "cc557f06-5fcf-4feb-919d-627944163857",
+        "msgid": "f0dcdf53-4949-431c-b804-2dbf21886153",
+        "status": "successful"
+    },
+    "responseCode": "OK",
+    "result": {
+        "form": {
+            "type": "config",
+            "subtype": "webview_version",
+            "action": "get",
+            "component": "*",
+            "framework": "*",
+            "data": {
+                "templateName": "webview_version",
+                "action": "get",
+                "fields": [
+                    {
+                        "version": "54"
+                    }
+                ]
+            },
+            "created_on": "2020-01-07T10:51:43.203Z",
+            "last_modified_on": null,
+            "rootOrgId": "*"
+        }
+    },
+    "ts": "2020-01-07T10:52:04.924Z",
+    "ver": "1.0"
+}

build_config

@@ -12,6 +12,7 @@ cordova-plugin=cordova-plugin-inappbrowser
 cordova-plugin=cordova-plugin-console
 cordova-plugin=cordova-plugin-network-information
 cordova-plugin=cordova-plugin-statusbar
+cordova-plugin=cordova-plugin-webview-checker
 cordova-plugin=https://github.com/adriano-di-giovanni/cordova-plugin-shared-preferences.git
 cordova-plugin=https://github.com/katzer/cordova-plugin-local-notifications.git
 cordova-plugin=https://github.com/swayangjit/cordova-plugin-fcm-with-dependecy-updated.git

config.xml

@@ -143,5 +143,6 @@
     <plugin name="cordova-plugin-sunbirdsplash" spec="https://github.com/project-sunbird/cordova-plugin-sunbirdsplash.git#release-2.3.0" />
     <plugin name="cordova-plugin-file-support" spec="https://github.com/project-sunbird/cordova-plugin-file-support.git" />
     <plugin name="cordova-plugin-networkspeed" spec="https://github.com/swayangjit/cordova-plugin-networkspeed.git" />
+    <plugin name="cordova-plugin-webview-checker" spec="^1.0.1" />
     <engine name="android" spec="^8.1.0" />
 </widget>

package.json

@@ -79,6 +79,7 @@
     "cordova-plugin-statusbar": "^2.4.3",
     "cordova-plugin-sunbirdsplash": "git+https://github.com/project-sunbird/cordova-plugin-sunbirdsplash.git#release-2.3.0",
     "cordova-plugin-uniquedeviceid": "^1.3.2",
+    "cordova-plugin-webview-checker": "^1.0.1",
     "cordova-plugin-whitelist": "^1.3.4",
     "cordova-plugin-x-socialsharing": "^5.6.2",
     "cordova-plugin-zip": "^3.1.0",
@@ -184,10 +185,11 @@
         "ANDROID_SUPPORT_VERSION": "28.0.0"
       },
       "cordova-plugin-openrap": {},
-      "cordova-plugin-networkspeed": {}
+      "cordova-plugin-networkspeed": {},
+      "cordova-plugin-webview-checker": {}
     },
     "platforms": [
       "android"
     ]
   }
-}
+}

src/app/app.component.html

@@ -38,4 +38,26 @@
       </ion-row>
     </ion-grid>
   </div>
+
+  <div id="update-webview-container"
+  style="position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 10;background-color: rgba(0, 0, 0, 0.59);opacity: 1;display: none;">
+    <div id="update-webview-content" 
+      style="position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 11;width: 80%;height: 195px;background-color: #eee; margin: auto;">
+      <div style="height:195px;position: relative;">
+        <div>
+          <h3 
+            style="text-align: center;background-color: #024f9d; color: #fff;margin: 0;padding: 8px; font-size: 18px;">
+            {{'UPDATE_REQUIRED' | translate}}
+          </h3>
+        </div>
+        <div style="padding: 15px 0; font-size: 16px; color: #333;width:80%;margin: auto;">
+          <p style="margin: 0;">{{'WEBVIEW_UPDATE_TEXT' | translate}}</p>
+        </div>
+        <div style="position: absolute; width: 100%; bottom: 15px;text-align: center;">
+          <button (click)="openPlaystore()" style="color: #fff;background: #024f9d;padding: 10px;width: 80%;margin: auto;">{{'DOWNLOAD_NOW' | translate}}</button>
+        </div>
+      </div>
+    </div>
+  </div>
+
 </ion-app>

src/app/app.component.ts

@@ -132,9 +132,33 @@ export class AppComponent implements OnInit, AfterViewInit {
       this.appRatingService.checkInitialDate();
       this.getUtmParameter();
       this.checkForCodeUpdates();
+      this.checkAndroidWebViewVersion();
     });
   }
 
+  checkAndroidWebViewVersion() {
+    var that = this;
+    plugins['webViewChecker'].getAndroidWebViewPackageInfo()
+    .then(function(packageInfo) {
+      that.formAndFrameworkUtilService.getWebviewConfig().then(function(webviewVersion) {
+        if (parseInt(packageInfo.versionName.split('.')[0], 10) <= webviewVersion) {
+          document.getElementById('update-webview-container').style.display = 'block';
+        }
+      }).catch(function(err) {
+        if (parseInt(packageInfo.versionName.split('.')[0], 10) <= 54) {
+          document.getElementById('update-webview-container').style.display = 'block';
+        }
+      });
+    })
+    .catch(function(error) { });
+  }
+
+  openPlaystore() {
+    plugins['webViewChecker'].openGooglePlayPage()
+    .then(function() { })
+    .catch(function(error) { });
+  }
+
   getSystemConfig() {
     const getSystemSettingsRequest: GetSystemSettingsRequest = {
       id: SystemSettingsIds.COURSE_FRAMEWORK_ID

src/assets/i18n/en.json

@@ -624,5 +624,8 @@
   "TRAINING_ENDED_START_ASSESSMENT": "The training has ended. You may take the assessment but, your progress will not be recorded.",
   "REDO_ASSESSMENT": "Redo Assessment",
   "TRAINING_ENDED_REDO_ASSESSMENT": "The training has ended. You may redo the assessment but, your progress will not be recorded.",
-  "REDO": "Redo"
+  "REDO": "Redo",
+  "UPDATE_REQUIRED": "Update Required",
+  "DOWNLOAD_NOW": "Download Now",
+  "WEBVIEW_UPDATE_TEXT": "For an effective experience, download the latest version of webview from Google Play store."
 }

src/services/formandframeworkutil.service.ts

@@ -545,4 +545,26 @@ export class FormAndFrameworkUtilService {
                 });
         });
     }
+
+    // get the required webview version
+    getWebviewConfig() {
+        return new Promise((resolve, reject) => {
+            const req: FormRequest = {
+                type: 'config',
+                subType: 'webview_version',
+                action: 'get',
+            };
+            // form api call
+            this.formService.getForm(req).toPromise()
+                .then((res: any) => {
+                    if (res.form && res.form.data && res.form.data.fields[0].version) {
+                        resolve(parseInt(res.form.data.fields[0].version, 10));
+                    } else {
+                        resolve(54);
+                    }
+                }).catch((error: any) => {
+                    reject(error);
+                });
+        });
+    }
 }