Google Summer of Code – Week # 7

As the Abstracts section’s implementation was completed last week, it was time to move forward. The plan was to implement the ‘Schedule’ Section but unfrotunately my mentor, Sir Christian Garbers, told that they still had not finalized the Schedule JSON Format and he would be AFK for next few days. So I decided to skip ‘Schedule’ section for the moment and go on…

for_blog_week7

Maps:

The basic task was to port the map activity for new version and layout from previous version, which I managed to do easily. The next step was to activate Google Maps API V2 by getting API key from Google. Google has outlined the process for getting API Key for your android app here: https://developers.google.com/maps/documentation/android/start

I decided to extend the maps functionality for adding Navigation option so user can route himself or get directions for any of the marked locations on map from his/her current position, by clicking on the Marker infoWindow on the Map. For this purpose, I drafted custom layout for the marker infoWindow to add a ‘route’ icon alongwith the location label. Here’s how I did that:


 //adapter for custom info-window - added icon for navigation
 supportMap.setInfoWindowAdapter(new InfoWindowAdapter() {

 @Override
 public View getInfoWindow(Marker arg0) {
 // TODO Auto-generated method stub
 return null;
 }

 @Override
 public View getInfoContents(Marker arg0) {
 // TODO Auto-generated method stub
 // Getting view from the layout file info_window_layout
 View v = getLayoutInflater().inflate(R.layout.info_window_layout, null);

 // Getting reference to the TextView to set title
 TextView note = (TextView) v.findViewById(R.id.note);

 note.setText(arg0.getTitle() ); //sets marker title

 // Returning the view containing InfoWindow contents
 return v;
 }
 });

Note the R.layout.info_window_layout in getInfoContents method. That’s the layout file for the marker custom infoWindow – loaded with a TextView and an icon.

The layout is now ready – Next step was to implement navigation feature via Googel Maps App i.e. when user would click on the marker, it should open Google Maps application with marker pointed at that location. The functionality of  ‘Route’ / Navigation already exists in Google Maps app. Android provides option for GeoIntents – Intents that open Google maps app automatically. You just pass that intent with Longitude, Latitude and Label as parameters – Rest it handles itself. So in  setOnInfoWindowClickListener, I first got Title, Longitude and Latitude values for that marker and then passed that with GeoIntent. The GeoIntent URI format is: geo:0,0?q=lat,lng(label)  – This is how i did that:

Map.setOnInfoWindowClickListener(new OnInfoWindowClickListener() {
 public void onInfoWindowClick(Marker marker) {
 LatLng position = marker.getPosition();
 Intent navigateIntent = new Intent(Intent.ACTION_VIEW);

 String currentLat = String.valueOf(position.latitude);  //Get Lat value
 String currentLong = String.valueOf(position.longitude);  //Get Long value
 String currLabel = marker.getTitle();  //Get Title of Location

 //Format URI as per required format which is > geo:0,0?q=lat,lng(label)
 String geoLocation = "geo:0,0?q=" + currentLat + "," + currentLong + "(" + currLabel + ")";
 navigateIntent.setData(Uri.parse(geoLocation));
 startActivity(navigateIntent);

 }
 });

The complete code for Map feature can be found here: https://github.com/shumail92/GCA-Android/blob/~gca/map/MapActivity.java

Following are the screenshots of map activity:

maps_module_screenshot

 

Tabbed layout for AbstractContent Activity

The app is also supposed to have ‘Notes’ Section for Abstracts so user can take note against some particular Abstract. But before implementation of Notes section, I had to do something with Layout of AbstractContent Activity for making space for Notes. I did a lot of research on it and the only good solution was to implement tabbed layout with ViewPager and Fragments. 

Uptill now, I had never worked with Fragments so I was little confused and this was a challenging task. Thanks to the Documentation and Androidhive guy, he has a great tutorial on Viewpager and Fragments, I finally managed to convert the AbstractContent Activity into Viewpager with 2 Fragments layout.

The new structure goes something like this: AbstractContent Activity is now parent activity that hosts the ViewPager. ViewPager hosts Tabbed layout with 2 Tabs and 2 Fragments respectively via custom FragmentPagerAdapter (Needed to override some methods ). AbstractContentTabFragment is the fragment for the default tab and shows all the Abstract Content just like it used to in previous activity. The other Fragment is AbstractNotesFragment which is for the 2nd tab i.e ‘Notes’.

I won’t go into detail of code for each of these but here is the link for the commit where I converted the Activity into Viewpager and Fragments. abf8cdfbefa806348058afcd857c9376bfa63fa4

If you have any question about the code or related, feel free to ask in comments and do share your thoughts and feedback on it in comments below. I’ll be looking forward to any suggestions or feedback.

GSoC Week # 7 – (30 June 2014 – 06 July 2014)

Google Summer of Code – Week 4 – 6 & Mid-Term Evaluations

First of all, I’m very delighted that I have passed the GSoC Mid-Term evaluation of my project that’s the most recent development in my GSoC journey.

Right after first 2 weeks, I had my final semester exams scheduled. Thus, I requested my mentor to give me off for my final exams and he granted me leave for 10 days. So, I couldn’t work on anything during 3rd week.

Screenshot of the email that made my day 😀

passed_gsoc_screenshot

Abstracts Section:

Right after my exams, I resumed my programming. G-Node has now developed a web portal for conferences as well recently and rather than providing me with the JSON files for ‘Abstracts’ my mentor told me about the web portal and it’s RESTful API. So app would communicate with their online server via REST API for fetching the latest data. The major change that reflected here was the new JSON Model for Abstracts Data. They had completely changed the JSON Model for the Abstract. Mentor that’s why asked me to port the app for new model – and an amazing challenge started 😀

Initially, I started working on old model and started changing it for new model but i wasn’t getting any luck with that. After few time, I decided to go for writing it from scratch and I’m glad i took that decision. I had to change whole DB schema for the new model, DBHelper class, JSON parsing function for making up to the new model. But somehow I got it managed.

schema_diagram

The other problem was: Like in previous version there was option for ‘Next’ & ‘Prev’ navigation of Abstracts – that wasn’t working now. The reason was that for previous model the ID was numeric and auto-increment. So for navigating to the next abstract, all it required was to increment current ID value by 1 and fetch data for that ID. But in new model, the ID has been changed to UUID rather than numeric. But thanks to SQLite, it has functionality of ROWID for each record which is unique and the ROWID is integer & auto-increment. Thus I used ROWID for getting UUID of Next and Previous record like below:

String getCurrentRowIDQuery = "SELECT ROWID FROM ABSTRACT_DETAILS WHERE UUID = '" + currentID + "';";
--currentID is UUID of current abstract

And then incremented or decremented for getting ROWID of next or previous record respectively. After getting the ROWID of required record, the next query that executed was:


String getNextAbstractUUID = "SELECT UUID FROM ABSTRACT_DETAILS WHERE ROWID = " + newRecordRowID + ";";

--newRecordRowID is Row ID of new record to be fetched 

Favorite Abstracts Functionality:

The other feature I worked on during this time was to add functionality for user to ‘Add an Abstract to Favorites’. Because the Conference would be having huge number of Abstracts and user might be interested in few so he/she can now add Abstracts of his/her interest to ‘Favorites’ just by clicking a Star icon in Actionbar.

For maintaining the record of Favorite Abstracts, I added a new Table in Database: ABSTRACT_FAVORITES – with 1 column only (UUID). This table maintains UUID of Abstracts that user has favourited. And then in FavouriteAbstract Activity, the SQL Query for getting favorite Abstracts goes like this:


String query = "SELECT UUID AS _id , TOPIC, TITLE, ABSRACT_TEXT, STATE, SORTID, REASONFORTALK, MTIME, TYPE,DOI, COI, ACKNOWLEDGEMENTS FROM ABSTRACT_DETAILS WHERE _id IN (SELECT ABSTRACT_UUID FROM ABSTRACT_FAVORITES);";

--Subquery runs for getting UUIDs of favorite abstracts from ABSTRACT_FAVORITES table.<a href="http://shumailmohyuddin.com/wp-content/uploads/2014/07/abstracts_module_screenshots.jpg">
</a>

 The code for whole Abstracts Module is available on Github.
You can explore it here: https://github.com/shumail92/GCA-Android/tree/master/Conference-v2/src/com/g_node/gca/abstracts

Share your thoughts in comments below. I’ll be looking forward to any suggestions or feedback.

abstracts_module_screenshots

Google Summer of Code – First 2 Weeks

Hello everyone, I know I mentioned in my earlier blog post (that was the first blog post about my Google Summer of Code journey), that I shall be posting details regarding my Google Summer of Code project as it continues. But unfortunately I couldn’t update because of my hectic summers and schedule. But here it is ! An overview of First 2 weeks my GSoC.

first_2_week_blog_image

Now coming to the project updates, let’s first have a look of what’s done till now. The first feature I decided to implement was the “NewsRoom” Section – Section where details of recent news/updates, press releases or highlights of the organization will be displayed. Currently, ‘International Neuroinformatics Coodinating Facility’ website www.incf.org has a news section already that they regularly update. Link of their online newsroom section is: www.incf.org/newsroom/ . For those news to appear in android app, I had to find some way that can be used as data source from website. After I explored a little, I managed to find RSS Feed for those news/updates at incf.org website. So now I had found the source.

Next task was to integrate that source into mobile app. The approach I used for this purpose is to first download that RSS Feed into mobile and save that file as ‘news.xml‘ and then use android XMLPullParser for parsing RSS Feed  to extract the relevant information i.e. Date of publishing, Title, Text of the update. Besides the extraction of keys from RSS, another challange I had to face was to extract the image from html source embedded with Update Text and display that image thumbnail along the left side of news. For this purpose, I used ‘JAVA HTML Parser Library – jsoup ‘ – It works great like jQuery for extracting DOM elements. Following is the piece of code I used for extracting image:

Document doc = Jsoup.parse(curText);   //curText is the Raw HTML from which image is to be extracted
 Element e = doc.select("img[src]").first();
 if(null != e) {
 String imgUrl = e.attr("src");
 Log.i("incf", "Image URL extracted = " + imgUrl);
 currentRssItem.setImgUrl(imgUrl);  //here it sets the extracted image URI
 }

I also had to do custom ListView implementation because default ListView only supports text. But I wanted to display the each newsfeed item such that each list item is divided into 2 parts – the part on left side would be having thumbnail image and part on right side was supposed to have 3 things: News Title, News Text & Publishing Date. The Adapter for Newsfeed ListView is implemented in file NewsAdapter.java

If you want to explore all source code for NewsRoom module that I implemented, that’s available on Github repo of this project. Here is it’s link: https://github.com/shumail92/GCA-Android/tree/master/Conference-v2/src/com/g_node/gca/newsroom

After all these efforts, I managed to finally implement this successfully and move on next module implementation. Following is the preview screenshot fo NewsRoom Module:

newsroom_screenshot

Share your thoughts on this in comments below – I shall be looking forward to any suggestions or feedback :)

Yaaayyy !!! Selected in Google Summer of Code 2014

Hello everyone ! I have been selected as student for Google Summer of Code 2014 (GSoC2014).  This summer I shall be working with International Neuroinformatics Coodinating Facility (INCF). More specifically, i shall be working with INCF’s Germany node – German Neuroinformatics Node.

incf_gsoc_blog_logo

For those who don’t know what Google Summer of Code is : (from GSoC site)

Google Summer of Code is a global program that offers students stipends to write code for open source projects. We have worked with the open source community to identify and fund exciting projects for the upcoming summer.

Project Details: 

My project with INCF focuses android development. There  were many ideas listed on INCF GSoC ideas page but i decided to go for one that involves Android programming because I need to brush up my Android skills and implement whatever i learnt recently in University of Maryland’s online Android course . (I successfully took and passed this course with distinction)

To keep it short, it’s Android App for their annual conference with a lot of features ranging from simple conference schedule, Abstracts detail and information to some advance features like option for taking notes against Abstracts, synchronization with their online server for frequently updating of Data using RESTful API’s, itinerary planner and much more. In coming weeks, i shall be sharing more details on my project and will keep updating about my GSoC experience and details here.

It’s worth mentioning Sir Christian Garbers – my GSoC Mentor and a nice person who helps me whenever I need help, replies to my all emails and clears my doubts and confusion.

About INCF:

International Neuroinformatics Coodinating Facility (INCF) develops collaborative neuroinformatics infrastructure and promotes the sharing of data and computing resources to the international research community. Their  mission is to facilitate the work of neuroscientists around the world, and to catalyze and coordinate the global development of neuroinformatics. More details regarding INCF can be found on their website:  http://www.incf.org/about

Looking forward to a great summer ahead full of learning and ending up with a wiser, more knowledgeable and not to mention, richer iteration of myself – starting a journey in  FOSS  (Free and open-source software) Community.

Updating Java Servlet without restarting Tomcat in Tomcat 8.0 ownwards

Problem: Recently i started learning Java Servlets and faced an issue regarding updating of Servlet after recompiling the servlet class. Initially, I what i did was shutting down Tomcat and restarting again after making any changings to servlet and recompiling it. But then i did some digging and found the solution for this issue. Following are the steps for handling this problem.

The Guide is for Tomcat 8 ownwards.

Open Tomcat directory and navigate to conf Folder. In Conf folder, you will find a file tomcat-users.xml . Open that xml file and you will something like following in that file:


<?xml version='1.0' encoding='utf-8'?>
<tomcat-users>
<!--
<role rolename="tomcat"/>
<role rolename="role1"/>
<user username="tomcat" password="tomcat" roles="tomcat"/>
<user username="both" password="tomcat" roles="tomcat,role1"/>
<user username="role1" password="tomcat" roles="role1"/>
-->
</tomcat-users>

There you can see the default users. The next step is to add a new User here. Edit that file and add following code for a new user before closing ‘tomcat-users’ tag.


<role rolename="manager-gui"/>
<user username="admin" password="shumail" roles="manager-gui,manager-jmx,manager-script,manager-status"/>
<!-- Just add above 2 lines for creating a new user -->

After addition of this code, the tomcat-users.xml file will look something like this:

<?xml version='1.0' encoding='utf-8'?>
<tomcat-users>
<!--
<role rolename="tomcat"/>
<role rolename="role1"/>
<user username="tomcat" password="tomcat" roles="tomcat"/>
<user username="both" password="tomcat" roles="tomcat,role1"/>
<user username="role1" password="tomcat" roles="role1"/>
-->

<!-- Following is the code for new user -->
<role rolename="manager-gui"/>
<user username="admin" password="shumail" roles="manager-gui,manager-jmx,manager-script,manager-status"/>

</tomcat-users>

Save the xml file. At this point, we have successfully created a new user with username admin and password shumail and assigned 4 roles to this user – manager-gui, manager-jmx, manager-script, manager-status.

We are almost done. Now whenever you do any changes in servlet code and recompile it, all you need to do is open following URL in browser that uses Tomcat Manager Application to redeploy the servlet:

http://localhost:8080/manager/text/reload?path=/

This will prompt for username and password. Enter username and password of the user we created earlier here i.e admin/shumail. You should see this type of message if it will be successful.

OK - Reloaded application at context path /

Refresh your application URL and you will see the updated version.
Share your thoughts in comments below – Don’t forget to share this article – Sharing is Caring..