Android-app-using-Kotlin/C3/URL-Request/English-timed

Time	Narration
00:01	Welcome to the Spoken Tutorial on URL Request.
00:06	In this tutorial we will learn to Pass the Foss and Language ids to the URL of Spoken Tutorial
00:15	Parse the response JSON data
00:18	Run the Kotlin App and Display the fetched data
00:23	To record this tutorial, I am using Ubuntu Linux 16.04 operating system
00:30	Android Studio version 3.x and
00:34	Android Phone with minimum of Android OS version 4.03
00:40	To follow this tutorial, you should have basic knowledge of
00:44	Java programming language and Android Studio
00:49	If not, then go through the relevant tutorials on this website.
00:54	Spoken Tutorial project has a server which has an API made for a specific purpose.
01:01	It helps to fetch the video tutorials of a FOSS in a particular language.
01:07	Specific ids of a FOSS and language are passed to the server, to fetch the exact video.
01:15	API means Application Programming Interface
01:19	An API is the messenger that allows two software programs to communicate with each other
01:27	It delivers the request to the provider and then delivers the response back to us
01:34	Spoken Tutorial URL format is shown below:
01:39	In this URL, instead of variables fossID and languageID we have to pass the actual ids.
01;48	How to make a request to the URL?
01:51	Google provides Volley library which makes requesting a URL easy and faster.
01:58	Volley is an HTTP library that makes networking for Android Apps easier.
02:05	It is an external library.
02:08	We need to add to our Android studio project so that necessary files are downloaded.
02:14	Let us open Android Studio.
02:18	Open the project ST Search.
02:22	In the left panel, under Project, click on the small triangle to open Gradle Scripts.
02:29	Double-click on build dot gradle within brackets Module colon app
02:36	A new window opens.
02:39	In the dependencies block we will add a new dependency.
02:43	At the end of the block, add a new line as shown.
02:48	We have now added the Volley library to our project.
02:53	Next we will add the dependency of Picasso, as we will display images at a later stage.
03:00	So add a new line for the dependency as shown.
03:04	This is to display the thumbnail of the spoken tutorial videos.
03:09	A Sync Now message appears at the top right corner of the IDE. Click on it.
03:16	Wait for the gradle build to complete which is shown at the bottom of the screen.
03:22	To request a URL, we need Internet connection.
03:26	So let us add code to get Internet permission for the app.
03:31	In the left panel, go to app manifests and double click on AndroidManifest dot xml
03:40	Add the below code above the application tag.
03:44	Without this line of code, our App cannot request any information from the Internet.
03:51	Now, go to SecondActivity dot kt
03:57	In onCreate method, we will add the code as shown to create a new request queue.
04:04	This will use the newRequestQueue method of volley library.
04:09	Next declare a variable url and assign the string as shown.
04:14	Here the URL is dynamic as we have to concatenate the FOSS and language ids received in intent.
04:24	So every time a different FOSS and language are selected, the URL will be different.
04:31	We will try to invoke the above URL in any web browser.
04:36	I’ll open Firefox web browser.
04:40	Type the following URL and press Enter.
04:44	Here, 10 specifies the FOSS id for Java and 22 specifies the language id for English.
04:54	We can see the json data that is displayed on the web page.
04:59	It is in readable format. For other browsers, it may look different.
05:09	Let us try for some other FOSS id and language id combination.
05:12	Change the FOSS id to 26 and language id to 22 and press Enter
05:18	This URL gives the videos of Python in English.
05:23	Now let’s change the id to 26 and 18.
05:28	This URL returns empty data which indicates that there are no videos for this combination of ids.
05:37	JSON stands for JavaScript Object Notation.
05:42	JSON is easy to read and write.
05:46	It is used to transmit data between a server and web application.
05:51	It is an alternative to XML.
05:54	Let us go back to SecondActivity dot kt
05:58	Now the next step is to make a string request.
06:02	Write the below code after val url line, in the oncreate method as shown.
06:10	If you see your code highlighted in red color, press Alt+Enter keys.
06:17	Select the appropriate option to quick fix the error.
06:23	In string request we specify four arguments:
06:27	Request dot Method, url, Response dot Listener and Response dot ErrorListener.
06:36	Response dot Listener specifies what to do when the response is received.
06:42	Response dot ErrorListener specifies what to do when there is an error.
06:48	extractJsonData is a method which we will create later, to parse the JSON data that we have received.
06:55	We have commented this line of code as of now.
06:59	Once we create the method, we will call it from the Response dot Listener
07:04	Write the code as shown after the StringRequest method.
07:11	This message “Contacting server…” indicates that still processing is going on.
07:18	Add the code in the next line as shown.
07:23	When the request is put in queue, the request is executed.
07:28	The Volley code which is required to request the URL to fetch data, is ready.
07:33	Run the app.
07:38	Search for a specific FOSS and language and press the Search button.
07:43	If you receive a toast message “Received server response!”, then your code is running fine.
07:50	As an assignment, do the following:
07:53	Disconnect the Internet/Wifi.
07:57	Now run the app and search for the FOSS and language.
08:02	Observe the error output.
08:05	We checked in the demonstration that we got the response from the server. Now we need to parse it.
08:13	Parsing means extracting useful information. Let us go back to the browser, to see the JSON format data.
08:21	Change the FOSS id and Language Id to 26 and 22.
08:27	The data in JSON is key-value pairs.
08:31	We will use the tutorial underscore name, video underscore id and tutorial underscore level fields present in the JSON data.
08:42	Switch back to Android studio interface.
08:46	On the top left panel, under project, go to app java com dot example dot spoken dot stsearch
08:57	Right-click on it.
08:59	Select New Kotlin File or Class
09:05	Type a name as VideoItem and press OK.
09:10	A new file VideoItem dot kt is created below SecondActivity.
09:16	Type this code in VideoItem dot kt.
09:20	Here we have created a class named as data class in Kotlin.
09:25	When data class is created, the getters and setters method are created while compiling.
09:32	So when we save the details of videos, we will make an object of this class for each video.
09:40	Here, video level specifies the basic, intermediate or advance level of spoken tutorials.
09:48	Now go to SecondActivity dot kt
09:52	Here we will create our method extractJsonData
09:56	So write the code after the onCreate method:
10:02	In the method we take the response received as arguments.
10:07	As we know how the JSON data will look, we can start parsing it.
10:12	First we obtain the array from response:
10:16	Write the code for it in extractJsonData method as shown.
10:22	Here we convert the response into JSONArray.
10:26	Now we know that inside this array there are many JSON objects of different videos.
10:32	So we declare a variable for storing objects one by one as shown here.
10:40	After that we need an object for VideoItem class in which we store the data. Write the code as shown:
10:49	Next we require a ArrayList for VideoItem class.
10:54	Declare a global ArrayList as shown above the onCreate method and inside the class.
11:01	In this ArrayList all the video data will be saved.
11:05	So that it will be accessible to both onCreate and extractJsonData methods.
11:12	In this ArrayList we have declared the type as VideoItem.
11:17	That means it will have objects of VideoItem class as data.
11:23	Now we go to extractJsonData method.
11:27	Type the code as shown.
11:34	while loop is to iterate all the objects in JSON array:
11:39	In this loop we first obtain the json object in singleVideoJsonObject
11:46	This line extracts all the information and makes an object of VideoItem in singleVideoItem variable.
11:54	Here we make an object of VideoItem and pass all the values from the JSON object.
12:01	The loop will extract data of all videos received and store it in our arraylist.
12:08	So after the while block we will write the code to print the items of finalResultsArrayList:
12:16	forEach method loops through all the elements of the array list.
12:21	The it variable in the println() statement points to one item in every loop.
12:28	Now in Request dot Listener of stringRequest code we had the method which is commented.
12:05	Un-comment the code, so that extractJsonData will be called from there.
12:41	So this array list will contain many objects of our class type VideoItem.
12:48	When we take any one item from the array list, we get a object of VideoItem.
12:53	We can access the values for this object such as videoId, videoTitle, videoLevel.
13:00	So in this way JSON parsing is done.
13:04	Let us now run the App.
13:08	Search for a specific FOSS and language and press the Search button.
13:15	Click the Logcat section at the bottom of the IDE.
13:20	Here we can see the output of println statement.
13:25	To find our output, search for video in search box.
13:30	Here we can see all the VideoItems shown one after the other.
13:39	This brings us to the end of this tutorial. Let us summarize.
13:44	In this tutorial we learnt to Pass the Foss and Language ids to the URL of Spoken Tutorial
13:53	Parse the response JSON data
13:56	Run the Kotlin App and Display the fetched data
14:01	The video at the following link summarises the Spoken Tutorial project.Please download and watch it.
14:08	The Spoken Tutorial Project Team conducts workshops and gives certificates on passing online tests. For more details, please write to us.
14:18	Please post your timed queries in this forum.
14:22	Spoken Tutorial project is funded by NMEICT, MHRD, Government of India. More information on this mission is available at this link.
14:34	The Android app and the script for this tutorial was contributed by Abhishek Shah.
14:40	And this is Nirmala Venkat along with the Spoken Tutorial team from IIT Bombay, signing off. Thanks for watching.

Contributors and Content Editors

PoojaMoolya