Possible coding options for GSoC students

[Daniel Damelin]

This is a message for folks who are interested in creating new Interactives for either of these projects:

• Create new interactives for Investigations curriculum units
• Move popular materials from Java to HTML5

The interactives that will be developed for both of these projects will be created in the the lab-interactives-site codebase  The interactives use the Lab Framework  which contains the underlying runtime for making the interactives work (the UI widgets, the model engines), and this in turn uses the Lab Grapher codebase for graphing.

Much of the work will be in creating new interactives (in the lab-interactives-site repo mentioned above), but the ideal candidate would also be able to make changes in Lab Framework (perhaps add a new UI feature, or adapt one of the computational models to add some new modeling capability), or make changes in the Lab-Grapher package. Making changes in the Lab Framework or the Lab Grapher is more difficult, but would afford you a better chance of demonstrating your current skill level.

We are looking for people who have knowledge of JavaScript, (possibly CoffeeScript too) and git. Ideally, he or she would have some scientific background in the topics we are modeling (physics and chemistry). 

We use Pivotal Tracker to manage developer work, so I’ve picked some stories from there for folks to consider attempting. These are not interactives themselves, but work on some other aspects of the Lab Framework to get a sense of your ability to work in this more complex codebase:

• Add social media links to the “share” dialog: https://www.pivotaltracker.com/story/show/37079795
• A slider can have a vertical orientation: https://www.pivotaltracker.com/story/show/39557223
• Add elasticity property to obstacles: https://www.pivotaltracker.com/story/show/90070308 
• The VDW attractive forces currently visualized by dotted lines could indicate the strength of the attraction: https://www.pivotaltracker.com/story/show/22977579 
• Add HTML5 version of a spinner UI widget: https://www.pivotaltracker.com/story/show/45873511
• Give author ability to make bond invisible: https://www.pivotaltracker.com/story/show/50625645
• A magnetic field can be applied to the whole model: https://www.pivotaltracker.com/story/show/54644576 

To do this work, fork the appropriate codebase(s), create a branch in your fork with an appropriate name related to the work, make commits, and then issue a pull request, so we can review.

I’ll be out of the office observing classes for the next few days. Feel free to ask questions on the cc-developers list if you begin to work on any of the above features.

-Dan

[Aniket Gupta]

Hi Dan,

I just began tackling with some of the issues above, so I have some queries which need to be clarified before I can get started.

• The first issue "Add media links to share dialog" - 3707975
  

In what all interactives or Website pages does it need to be added, because the example mentioned in the pivotal-tracker page and some other interactives that I opened already have the buttons for Facebook, Twitter, LinkedIn and Google+ share. Hence, please let me know if some places lack this share dialog.

• The second issue "A slider can have a vertical orientation" - 39557223
  

Please elaborate on this one a bit more. What all interactives or pages are being talked about? Is it the sliders of simulations( like the one's for temperature, no. of atoms etc.) that need to be vertical If I am correct?

Waiting eagerly for your reply.
Thanks,

Aniket Gupta
Sophomore,
Computer Science and Engineering,

IIT Roorkee,
India.
ankg.github.io

[Daniel Damelin]

Aniket I was in an all day retreat today and heading to sleep soon. I’ll try to respond some time tomorrow if nobody else does before then.

-Dan

--
--
----
post message :cc-dev...@googlegroups.com
unsubscribe: cc-developer...@googlegroups.com
more options: http://groups.google.com/group/cc-developers?hl=en
---
You received this message because you are subscribed to the Google Groups "Concord Consortium Developers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cc-developer...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Scott Cytacki]

On Thu, Mar 19, 2015 at 4:18 AM, Aniket Gupta <aniketg...@gmail.com> wrote:

Hi Dan,

I just began tackling with some of the issues above, so I have some queries which need to be clarified before I can get started.

• The first issue "Add media links to share dialog" - 3707975
  

In what all interactives or Website pages does it need to be added, because the example mentioned in the pivotal-tracker page and some other interactives that I opened already have the buttons for Facebook, Twitter, LinkedIn and Google+ share. Hence, please let me know if some places lack this share dialog.

The Lab interactives do not have the social media links. For example:

http://lab.concord.org/embeddable.html#interactives/samples/1-oil-and-water-shake.json

There is a shared dialog, but it doesn't have the social media links.

The code for this would go in lab repository: 

https://github.com/concord-consortium/lab

 

• The second issue "A slider can have a vertical orientation" - 39557223
  

Please elaborate on this one a bit more. What all interactives or pages are being talked about? Is it the sliders of simulations( like the one's for temperature, no. of atoms etc.) that need to be vertical If I am correct?

The lab framework lets a you create interactives with json files. 

For example this interactive:

http://lab.concord.org/interactives.html#interactives/samples/3-100-atoms.json

Has two sliders. If you expand the 'Interactive Editor' on that page, you can see the configuration of the two sliders.

To complete this story there should be a new 'orientation'  option in the slider configuration that can be set to horizontal or vertical. 

--

Scott Cytacki

The Concord Consortium

http://concord.org

[Aniket Gupta]

Hi Scott,

Thanks for the information. The issues above seem more clear to me now.
Also in the lab.concord.org site, interactives like http://lab.concord.org/embeddable.html#interactives/samples/1-oil-and-water-shake.json for example,
There is the type of share button that does not have a social media share. Also, it gives a embed code procedure that no end user, however pleased he might've felt by the interactions, would perform. So, does social media share needs to be added to that repository too( https://github.com/concord-consortium/lab-interactives-site )? though it is a later concern but just asking if I'm thinking correctly.

Thanks,
Aniket Gupta.

--
--
----
post message :cc-dev...@googlegroups.com
unsubscribe: cc-developer...@googlegroups.com
more options: http://groups.google.com/group/cc-developers?hl=en
---

You received this message because you are subscribed to a topic in the Google Groups "Concord Consortium Developers" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/cc-developers/FhVu0jZsSFQ/unsubscribe.
To unsubscribe from this group and all its topics, send an email to cc-developer...@googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--

Aniket Gupta,

Sophomore,
Computer Science and Engineering,

Indian Institute of Technology Roorkee,
India.

[Aniket Gupta]

Hi Sir,

I was working on the tasks mentioned above and I was almost done with some of the code required for them but the codebase has a lot of interlinked files and functions, hence I haven't been able to completely figure out in which files to add the code for the share system. I've been trying to tweak with the share-dialog.tpl & share-dialog.js in both src/ and public/ , which didn't prove to be very helpful.

Though I have been able to understand the functioning of individual functions, and the elegant use of haml and requireJS in the code. I've also almost understood the lab.js and interactives-controller.js file especially, and also most other controllers. The whole process has now become a lot more exciting :D and I've been learning at a very fast rate about lab and the interactives. :)

Please find the functional code for the share system attached. I would be highly obliged if guide me on which functions need tweaking and which files should this code be added to. Just need a little more push.

Thanks,
Aniket

[rishi shah]

Hello Scott,
  To share interactives on Facebook  we can use this technique.(http://stackoverflow.com/questions/13085564/is-there-any-facebook-share-plugin) as mentioned over there in question.
   According to my opinion  it will ease to add in our code because we just need to change this property(https://github.com/concord-consortium/lab/blob/5ed650da3155a470cfd8c1a9170115ade52a470d/src/lab/common/controllers/setup-banner.js#L136) and need to add just one function in javascript.What is your suggestion related to this approach.
   Should I go with this approach?

 Regarding to slider's orientation - Is there any vertical slider exists in any interactive? Do we have to make vertical slider or is already there to use?

Thanks,
Rishi

[Aniket Gupta]

Hey Scott,

 

To complete this story there should be a new 'orientation'  option in the slider configuration that can be set to horizontal or vertical. 

--

Scott Cytacki

 For the slider issue the only question that remains is, Who gets to control the orientation of the slider? Does the end user get this privilege or does the code randomly/logically choose one of the vertical or horizontal configurations on initiation(according to the screen size, maybe)? because a user-controllable feature would mean changes to the loadModel (and related) methods and embeddable.js file too, other than the changes to the json files of the interactives.

Also, I've sent a pull request for the first issue on github. Please, do take a look. Thanks a lot for the guidance! :)

Aniket.

[Aniket Gupta]

Hello Sir,

I forgot to mention, I felt there was some issue in the guardfile of https://github.com/concord-consortium/lab. That it tries to execute a folder which isn't there. I filed an issue out of this. Please look into it and comment.

Thank you,
Aniket Gupta,
ankg.github.io 

[Daniel Damelin]

On Mar 20, 2015, at 11:06 PM, Aniket Gupta <aniketg...@gmail.com> wrote:

 For the slider issue the only question that remains is, Who gets to control the orientation of the slider? Does the end user get this privilege or does the code randomly/logically choose one of the vertical or horizontal configurations on initiation(according to the screen size, maybe)?

The author of the interactive should have a property that allows him or her to set the orientation of the slider. That orientation will then be fixed for all those who view the interactive.

-Dan

[Piotr Janik]

2015-03-21 4:06 GMT+01:00 Aniket Gupta <aniketg...@gmail.com>:

 For the slider issue the only question that remains is, Who gets to control the orientation of the slider? Does the end user get this privilege or does the code randomly/logically choose one of the vertical or horizontal configurations on initiation(according to the screen size, maybe)? because a user-controllable feature would mean changes to the loadModel (and related) methods and embeddable.js file too, other than the changes to the json files of the interactives.

Take a look at the radio button controller - it already supports different orientations:

https://github.com/concord-consortium/lab/blob/master/src/lab/common/controllers/radio-controller.js#L100-L101

+ related metadata:

https://github.com/concord-consortium/lab/blob/master/src/lab/common/controllers/interactive-metadata.js#L689-L691

To see it working in practice, you can open this interactive:

http://lab.concord.org/interactives.html#interactives/basic-examples/pulldown-and-radio-buttons-with-custom-parameters.json

then open "Interactive Editor" and look for "angle-buttons" component. Try to change "orientation" property it and click "Update interactive". 

We want to add the same feature to the slider component and it should follow exactly the same patterns (property naming, values and approach to implementation).

So, a new option should be added to the slider metadata and then it should be handled in SliderController class:

https://github.com/concord-consortium/lab/blob/master/src/lab/common/controllers/slider-controller.js

Thanks,
Piotr

[Ryan Marren]

Hello, I have been working on implementing vertical sliders. I have finished a basic model and would like to see if this is the styling that you were hoping for. I will make a pull request tomorrow or monday, so I can make any changes you see fit.

Also this is my first post, so I'd like to say hello to all the developers / students!

[Aniket Gupta]

Hi,

I have made a pull request in the lab framework wherein I've added the Spinner UI feature. 
You can see the pull request here.

I have added the feature to the lab-interactives site for a demonstration in the pull request https://github.com/concord-consortium/lab-interactives-site/pull/34.

Please review and comment. Also, do tell if something is missing.

Thanks,
Aniket.