fetch data | blog.fossasia.org

Fetch Five Star Skill Rating from getSkillList API in SUSI.AI Android

Post author:Arundhati Gupta
Post published:August 22, 2018
Post category:Android FOSSASIA GSoC SUSI.AI
Post comments:0 Comments

SUSI.AI had a thumbs up/down rating system till now, which has now been replaced by a five star skill rating system. Now, the user is allowed to rate the skill based on a five star rating system. The UI components include a rating bar and below the rating bar is a section that displays the skill rating statistics – total number of ratings, average rating and a graph showing the percentage of users who rated the skill with five stars, four stars and so on.

SUSI.AI Skills are rules that are defined in SUSI Skill Data repo which are basically the processed responses that SUSI returns to the user queries. When a user queries something from the SUSI Android app, a query to SUSI Server is made which in turn fetches data from SUSI Skill Data and returns a JSON response to the app. Similarly, to get skill ratings, a call to the ‘/cms/getSkillList.json’ API is made. In this API, the server checks the SUSI Skill Data repo for the skills and returns a JSON response consisting of all the required information like skill name, author name, description, ratings, etc. to the app. Then, this JSON response is parsed to extract individual fields to display the appropriate information in the skill details screen of the app.

API Information

The endpoint to fetch skills is ‘/cms/getSkillList.json’
The endpoints takes three parameters as input –

model – It tells the model to which the skill belongs. The default value is set to general.
group – It tells the group(category) to which the skill belongs. The default value is set to All.
language – It tells the language to which the skill belongs. The default value is set to en.

Since all skills have to be fetched, this API is called for every group individually. For instance, call “https://api.susi.ai/cms/getSkillList.json?group=Knowledge” to get all skills in group “Knowledge”. Similarly, call for other groups.

Here is a sample response of a skill named ‘Capital’ from the group Knowledge :

"capital": {
      "model": "general",
      "group": "Knowledge",
      "language": "en",
      "developer_privacy_policy": null,
      "descriptions": "A skill to tell user about capital of any country.",
      "image": "images/capital.png",
      "author": "chashmeet singh",
      "author_url": "https://github.com/chashmeetsingh",
      "skill_name": "Capital",
      "terms_of_use": null,
      "dynamic_content": true,
      "examples": ["What is the capital of India?"],
      "skill_rating": {
        "negative": "0",
        "positive": "4",
        "feedback_count" : 0,
        "stars": {
          "one_star": 0,
          "four_star": 1,
          "five_star": 0,
          "total_star": 1,
          "three_star": 0,
          "avg_star": 4,
          "two_star": 0
        }
      },
      "creationTime": "2018-03-17T17:11:59Z",
      "lastAccessTime": "2018-06-06T00:46:22Z",
      "lastModifiedTime": "2018-03-17T17:11:59Z"
    },

It consists of all details about the skill called ‘Capital’:

Model (model)
Group (group)
Language (language)
Developer Privacy Policy (developer_privacy_policy)
Description (descriptions)
Image (image)
Author (author)
Author URL (author_url)
Skill name (skill_name)
Terms of Use (terms_of_use)
Content Type (dynamic_content)
Examples (examples)
Skill Rating (skill_rating)
Creation Time (creationTime)
Last Access Time (lastAccessTime)
Last Modified Time (lastModifiedTime)

From among all this information, the information of interest for this blog is Skill Rating. This blog mainly deals with showing how to parse the JSON response to get the skill rating star values, so as to display the actual data in the skill rating graph.

A request to the getSkillList API is made for each group using the GET method.

@GET("/cms/getSkillList.json")
Call<ListSkillsResponse> fetchListSkills(@Query("group") String groups);

It returns a JSON response consisting of all the aforementioned information. Now, to parse the JSON response, do the following :

Add a response for the response received as a result of API call. ListSkillsResponse contains two objects – group and skills.
This blog is about getting the skill rating, so let us proceed with parsing the required response. The skills object contains the skill data that we need. Hence, next a SkillData class is created.
```
class ListSkillsResponse {
   val group: String = "Knowledge"
   val skillMap: Map<String, SkillData> = HashMap()
}
```

Now, add the SkillData class. This class defines the response that we saw for ‘Capital’ skill above. It contains skill name, author, skill rating and so on.

class SkillData : Serializable {
   var image: String = ""
   @SerializedName("author_url")
   @Expose
   var authorUrl: String = ""
   var examples: List<String> = ArrayList()
   @SerializedName("developer_privacy_policy")
   @Expose
   var developerPrivacyPolicy: String = ""
   var author: String = ""
   @SerializedName("skill_name")
   @Expose
   var skillName: String = ""
   @SerializedName("dynamic_content")
   @Expose
   var dynamicContent: Boolean? = null
   @SerializedName("terms_of_use")
   @Expose
   var termsOfUse: String = ""
   var descriptions: String = ""
   @SerializedName("skill_rating")
   @Expose
   var skillRating: SkillRating? = null
}

Now, add the SkillRating class. As what is required is the skill rating, narrowing down to the skill_rating object. The skill_rating object contains the actual rating for each skill i.e. the stars values. So, this files defines the response for the skill_rating object.
```
class SkillRating : Serializable {
   var stars: Stars? = null
}
```

Further, add a Stars class. Ultimately, the values that are needed are the number of users who rated a skill at five stars, four stars and so on and also the total number of users and the average rating. Thus, this file contains the values inside the ‘stars’ object.

class Stars : Serializable {
   @SerializedName("one_star")
   @Expose
   var oneStar: String? = null
   @SerializedName("two_star")
   @Expose
   var twoStar: String? = null
   @SerializedName("three_star")
   @Expose
   var threeStar: String? = null
   @SerializedName("four_star")
   @Expose
   var fourStar: String? = null
   @SerializedName("five_star")
   @Expose
   var fiveStar: String? = null
   @SerializedName("total_star")
   @Expose
   var totalStar: String? = null
   @SerializedName("avg_star")
   @Expose
   var averageStar: String? = null
}

Now, the parsing is all done. It is time to use these values to plot the skill rating graph and complete the section displaying the five star skill rating.

To plot these values on the skill rating graph refer to the blog on plotting horizontal bar graph using MPAndroid Chart library. In step 5 of the linked blog, replace the second parameter to the BarEntry constructor by the actual values obtained by parsing.

Here is how we do it.

To get the total number of ratings

val  totalNumberofRatings: Int = skillData.skillRating?.stars?.totalStars

To get the average rating

val averageRating: Float = skillData.skillRating?.stars?.averageStars

To get number of users who rated the skill at five stars

val fiveStarUsers: Int = skillData.skillRating?.stars?.fiveStar

Similarly, get the number of users for fourStar, threeStar, twoStar and oneStar.

Note : If the totalNumberOfRatings equals to zero, then the skill is unrated. In this case, display a message informing the user that the skill is unrated instead of plotting the graph.

Now, as the graph shows the percentage of users who rated the skill at a particular number of stars, calculate the percentage of users corresponding to each rating, parse the result to Float and place it as the second parameter to the BarEntry constructor as follows :

 entries.add(BarEntry(4f, (fiveStarUsers!!.toFloat() / totalUsers) * 100f)))

Similarly, replace the values for all five entries. Finally, add the total ratings and average rating section and display the detailed skill rating statistics for each skill, as in the following figure.

Resources

To see how to make network calls in android using Retrofit
https://guides.codepath.com/android/Consuming-APIs-with-Retrofit
To check out how to plot a chart use MPAndroidChart Library
https://github.com/PhilJay/MPAndroidChart