Smart WebView Documentation

SWV is a framework built to develop advanced hybrid webview applications with ease. Following documentation will help you setup and configure your hybrid app on virtual and real life devices.

TABLE OF CONTENTS

SETUP

Download repo or clone the project.

git clone https://github.com/mgks/Android-SmartWebView

Download google-services.json file from Firebase (instructions).

Load project in Android Studio.

File > Open > Browse to Project and Select

Let Android Studio process the project and download support libraries and dependencies.

Just to make sure, try cleaning and rebuilding project before run.

PERMISSIONS

INTERNET
ACCESS_NETWORK_STATE
ACCESS_WIFI_STATE
WRITE_EXTERNAL_STORAGE
READ_EXTERNAL_STORAGE
CAMERA
ACCESS_FINE_LOCATION
VIBRATE

c2dm.permission.RECEIVE

hardware.location.gps
hardware.touchscreen

VARIABLES

Configuration Variables

Complete webpage URL or load local file as

file:///android_res/dir/file.html
ASWV_URL   = "https://github.com/mgks"   // domain or directory or address to any root file

Permission Variables

ASWP_JSCRIPT     = true     // enable JavaScript for webview
ASWP_FUPLOAD     = true     // upload files from local device
ASWP_MULFILE     = true     // upload multiple files
ASWP_CAMUPLOAD   = true     // enable camera file upload
ASWP_ONLYCAM     = false    // incase you want only camera for input files

ASWP_LOCATION    = true     // track GPS locations

ASWP_RATINGS     = true     // show ratings dialog; auto configured, edit method get_rating() for customizations
ASWP_PULLFRESH   = true     // pull to refresh feature
ASWP_PBAR        = true     // show progress bar
ASWP_ZOOM        = false    // zoom control for webpages
ASWP_SFORM       = false    // save form data and auto-fill information
ASWP_OFFLINE     = false    // whether the loading webpages are offline or online
ASWP_EXTURL      = true     // open external url with default browser instead of app webview

ASWP_TAB         = true;    // instead of default browser, open external URLs in chrome tab
ASWP_ADMOB       = false;   // enabled Google AdMob

Security Variables

ASWP_CERT_VERIFICATION   = true   // verify whether HTTPS port needs certificate verification

Other Variables

ASWV_ORIENTATION = 0;   // change device orientation to portrait (1)(default) or landscape (2) or unspecified (0)

ASWV_LAYOUT      = 0;   // default=0; for clear fullscreen layout and 1 to add drawer and navigation bar

// custom settings if layout `1` with search bar is set.
ASWV_SEARCH      = "https://www.google.com/search?q=";   // search query will start by the end of the present string

ASWV_SHARE_URL   = ASWV_URL+"?share=";   // URL where you process external content shared with the app
ASWV_EXC_LIST    = "";                   // domains allowed to be opened inside webview, separate domains with a comma (,)

ASWV_ADMOB       = "ca-app-pub-9276682923792397~7957851075";   // your unique publishers ID; this one is temporary

ASWV_F_TYPE      = "*/*"   // use `image/*` for image files only; check file type references for custom file type

POSTFIX_USER_AGENT      = true;     // set to true to append USER_AGENT_POSTFIX to user agent
OVERRIDE_USER_AGENT     = false;    // set to true to use USER_AGENT instead of default one
USER_AGENT_POSTFIX      = "SWVAndroid";    // useful for identifying traffic, e.g. in Google Analytics
CUSTOM_USER_AGENT       = "Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Mobile Safari/537.36";    // custom user-agent

FEATURES

Camera Input

You can either select to get input from both file manager and camera or can just choose camera to get image/video input. To get video input, add file type condition in your html input video/* and image/* for camera photos. By default ASWV_F_TYPE is set to */* and suggested not to change instead file type should be provided on web pages end.

Firebase Cloud Messaging

There are two files in the project that work together to receive and send notifications. You do not need to edit them for initial setup but to customise how notifications appear you can make changes accordingly.

FBInstanceIDService

Updates User Token/ID and logs fresh tokens

FBMessagingService

Receives data and builds notifications

To setup Firebase you need to follow certain steps (atleast for the first time).

Now let’s setup your server to send notifications:

Create a POST request with headers URL

https://fcm.googleapis.com/fcm/send
content-type: application/json
authorization: key=____your_server_key_here___ (Firebase > Settings > Cloud Messaging > Server key)

Required JSON Data

{ "notification": {
    "title": "___title_string___",
    "text": "___text_string___",
     "click_action": "Open_URI"
  },
    "data": {
    "uri": "___the_URL_where_you_want_users_to_send__"
    },
  "to" : "___user_token___"
}

To fetch fresh user tokens, SWV creates a cookie FCM_TOKEN with latest tokens everytime app opened that can be saved to your server.

Token is also saved as Log.d FCM_TOKEN in the debug terminal for testing.

AdMob

AdMob is integrated into the project but require google admob account to be setup first and have your website approved, AdMob or any online adverts won’t work on your offline applications. Follow these steps to setup.

Chrome Tabs (for Android)

Configure Chrome tab to render external links with chrome engine within your app, instead of using internal webview or web browser. Chrome tabs help keep the app intact and not let external websites/apps interfere with the main webview framework.

GPS Location

Optional feature to get current or live location of user device. SWV by default uses cookies to track micro information, in this case GPS is useful for geo mapping and location based services. There is a single file responsible for implementation for the feature – GPSTrack.

Updates User location on every 1 metre distance and 5 seconds

For Online Apps

For Offline Apps / Files

Make a url (hyperlink) request starting with offloc:refresh, that reloads the page with additional query ?loc=latitude,longitude that can be broken with javascript to get latitude and longitude separately in an array.

User Interfaces and Layouts

There are two files in use for layouts or to say there are two premade layouts for the app, one with clear fullscreen with back only feature while other includes drawer, header, search bar and button controls (if enabled).

res/activity_main

Default activity layout with clean fullscreen view without any banner or button

res/drawer_main

Drawer activity layout with drawer menu and header and search view

Setting up a default layout

Content Sharing

There is a separate file handing content sharing activities – ShareActivity.

Handles content received from other apps as intent

Setting up share intent

Rating System

Rating dialogue is enabled by default and can be handled by ASWP_RATINGS. Multiple classes handle the rating request and support Google Play and Amazon App store that can be configured as mentioned here.

ASWR_DAYS            = 3;           // after how many days of usage would you like to show the dialog
ASWR_TIMES           = 10;          // overall request launch times being ignored
ASWR_INTERVAL        = 2;           // reminding users to rate after days interval

Google Login (Plugin)

QR Reader / Scanner (Plugin)

PaperlessQL for Offline Storage (Plugin)