Summer of Code/2015/Kushan Javascript

About me

What is your name?

  Kushan Joshi

What is your email address?

  0o3ko0@gmail.com, ikushan@me.com

What is your Sugar Labs wiki username?

Kushan2020

What is your IRC nickname on irc.freenode.net?

kepta

What is your first language? (We have mentors who speak multiple languages and can match you with one of them if you'd prefer.)

English

Where are you located, and what hours (UTC) do you tend to work? (We also try to match mentors by general time zone if possible.)

India, 8:30am - 12:30pm (UTC) & 3:30pm- 7:30pm (UTC)

Have you participated in an open-source project before? If so, please send us URLs to your profile pages for those projects, or some other demonstration of the work that you have done in open-source. If not, why do you want to work on an open-source project this summer?

I have been contributing to open source frequently. Below is my profile of bugzilla at Mozilla Foundation.

Bugzilla profile https://bugzilla.mozilla.org/user_profile?user_id=500998

• Adding touch action regions [1]: This bug involved declaring candidate regions for default touch behaviours as set by w3 consortium.[http://www.w3.org/TR/pointerevents/#declaring-candidate-regions-for-default-touch-behaviors [2 ]].Firefox as of yet hasn't implemented pointer events for default touch action regions, this bug required me to create touch action regions, and forward them to composter. The regions were further divided into no_Action_Region, horizontal_Pan_Region and vertical_Pan_region , which had to be processed separately. This bug was quite interesting as it had me working on the components of CSS implementation of the browser.
• Use of new xpcshell test cases [3]: The use of new globally available xpcshell tests, required change in the code of calendar and lighting app of mozilla suite. In this bug I am upgrading the unit testing code of the suite to follow the change in Assert.jsm.
• Using getters/setters[4] : This was fairly simply bug which required upgradation of existing firefox code to use getters/setters method.

About your project

What is the name of your project?

Interactive Javascript Shell

Describe your project in 10-20 sentences.

	Brief This project is geared towards learning javascript, unlike other similar projects on the internet. The developer must have this in mind while developing the shell. The interactivity of this whole project can be brought upon on various levels. I aim to add different levels of learning, just like a video game. You are given a task and if you complete it successfully you are rewarded virtually and you proceed on to the next level. No learning of javascript is complete without involvement of HTML. The application I intend to develop will have HTML functionality embeded in the whole app experience. That is one thing that differentiates scripting language from others, you dont need to compile and worry stuff related to that.
	Application The UI of the app has to be consistent with the XO, below is a mockup of the design of the application I intend to develop this summer. As you can see, I intend to divide the screen into halves. On the left side the user can enter the code she desires. She can copy paste any code here, and can also use the builtin stepover button to go through her code line wise. This will be of great help as the student can actually see the whole program working sequentially right infront of her. The pink line in the design mockup will show the line at which program is at. On the right half of the screen, lie three interesting things DOM : I assume the student already knows HTML (thanks to the sister project WEB confusion), showing a beautiful tree will add to the learning experience. As javascript is known for DOM manipulations. When a student will actually see her javascript code appending an element to the DOM tree, she will actually be learning by visuals and visual learning has a very high memory retention. The DOM illustrator will also help when a student has to find a particular element. She can go through the tree and better decide her strategy for tackling the problem. HTML: The student must be able to type in the desired HTML code, for which he plans to add Javasript. In the design above, student is actually solving a problem statement which requires her to append some elements to an already existing ul element. The student would be guided through a help section right at the top in the nav bar. Whenever he she is stuck can see the objectives of the current problem and also get a hint. The simulated problem part is a feature of this application. A student can also work on a blank project. Preview: Preview of the HTML code is a basic necessity for learning javascript. The student upon clicking the Preview button will see the live preview of code uptil that moment. In case she makes changes, she will have to click the run button at the top again. Console: The console part is very important, as the interactivty we wish to achieve wouldnt be possible without it. The console shown in the mockup, will provide basic outputs like console.log, errors, etc. The user can anytime query any variable just like the console which comes with modern day browsers. Help: As I mentioned earlier to aid the learning of javascript, the user can opt to go through basic tasks. As shown in the design, the user is shown what she has to do in this task and upon completion can move to the next advanced task. The help button will also fascilitate as guide to interface, just like its done in the web version of turtle . https://turtle.sugarlabs.org.
	Early stage version of the app To actually show the working of my idea, I created this very early prototype of the app. (Please note it currently only supports alert() for outputs, and has no way to interact with HTML elements.) I request you to try it out. https://dl.dropboxusercontent.com/u/35525804/JS-Interpreter/index.html]

Who are you making it for, and why do they need it?

This project is entirely focused on the learning part of javascript, by no way it intends to be a substitute to professional suites like JSfiddle. The students who will be using this app, can consider this as a stepping stone to a wide array of web technologies. Getting the gist of the programming language and being profecient in it, is all that is required according to me. Experience will always come with time, no technology or app can skip the need for experience.

What is the name of your project?

What technologies (programming languages, etc.) will you be using?

What is the name of your project?

What is the timeline for development of your project? The Summer of Code work period is from May 19 - August 22; tell us what you will be working on each week. (As the summer goes on, you and your mentor will adjust your schedule, but it 's good to have a plan at the beginning so you have an idea of where you're headed.) Note that you should probably plan to have something "working and 90% done" by the midterm evaluation (27 June); the last steps always take longer than you think, and we will consider cancelling projects which are not mostly working by then.

Convince us, in 5-15 sentences, that you will be able to successfully complete your project in the timeline you have described. This is usually where people describe their past experiences, credentials, prior projects, schoolwork, and that sort of thing, but be creative. Link to prior work or other resources as relevant.

If your project is successfully completed, what will its impact be on the Sugar Labs community? Give 3 answers, each 1-3 paragraphs in length. The first one should be yours. The other two should be answers from members of the Sugar Labs community, at least one of whom should be a Sugar Labs GSoC mentor. Provide email contact information for non-GSoC mentors.

What will you do if you get stuck on your project and your mentor isn 't around? How do you propose you will be keeping the community informed of your progress and any problems or questions you might have over the course of the project?

We want to make sure that you can set up a development environment before the summer starts. Please do one of the following: Send us a link to a screenshot of your Sugar development environment with the following modification: when you hover over the XO-person icon in the middle of Home view, the drop-down text should have your email in place of "logout". Send us a link to a pull request or merge request you have made on a Sugar or Sugar activity bug. It's normal to need assistance with this, so please visit our IRC channel, #sugar on irc.freenode.net, and ask for help.

Describe a great learning experience you had as a child. Is there anything else we should have asked you or anything else that we should know that might make us like you or your project more?