Student Application Template

To fill this in, copy the source text. Please don't rename the template.

This is a suggestion for the kind of information we'll find useful from students in their submissions. Remember -- you're going to be committing to several months' work. The more information and planning you can provide up-front, the more we (and Google!) will have to go on when we're ranking your application. Do not forget adding your submission at SummerOfCode2016/StudentApplications

Source Browsing - The SPA can request for the whole packages sources list, the frontend can use filtering to let user to search for packages. Then, the users should choose the package and the suite.

After that, I suggest a collapsable menu on the left as the folder of the package source, it will defaultly open as user need to browse for the file they want. When they have chosen the file, the left side menu will collapse and the code will be loaded up. When users are browsing for files/folders, the details of the folders/files including the permission and file size will be hidden; users can perform the hold-click on folders/files, then a popup with the details will be shown.

But the real difficulties just arrived, everyone knows that it is such a nightmare to view code on a small screen. And it is not easy to be solved. Yet, here’s my idea. On the left hand side of the screen, the line numbers will still be shown; the font size of the code cannot be too small, therefore, it is not possible to show the whole line of codes, and horizontal scrolling shouldn’t be turned on while the vertical scrolling is possible as it will be quite troublesome to just scroll down. But there must be a way for the user to view the whole line of code: the user need to click on the line number, then that line of code will be slightly highlighted (other lines will be slightly dimmer), at this moment, the vertical scrolling will be disabled and horizontal scrolling will be allowed on that line. Whenever the user want to stop focusing on that line, the user just need to click anywhere beyond that line, the vertical scrolling will be back.

Statistic - For the statistic, there’re images on the desktop version desktop version, but that might not be favorable to mobile, as the size of the graph might not fit well. I suggest that we might use Chart.js, a html5 js library to do the client side graph rendering. The frontend (might be Angular) will just get the data from the json API and will plot it with Chart.js. It will be much clearer and users can actually click on the graph, to see a little bit more details on a particular point on the graph.