VPython in a browser now available

[Bruce Sherwood]

Run VPython programs in a browser!

Now in GlowScript (glowscript.org) you can write and run VPython programs. Although there are some restrictions, many existing VPython programs can run in a browser, which means that you can send a link to a colleague who can immediately run your program without installing Python and VPython. It also means that students can write and run VPython programs using existing programming instructions and without installing anything, though one must use a modern browser and a modern graphics capability (GPU). I'll mention that the 4th edition of the textbook "Matter & Interactions", available in January, includes explicit instruction in VPython.

You cannot import Python modules such as numpy, nor create your own modules to import.

Here are examples of VPython programs that run in either classic VPython or in GlowScript (when reading the program you can click "Run this program" to execute the program):

http://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/program/Bounce-VPython/edit

http://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/program/GlowScriptObjects-VPython/edit

More demo programs in VPython will be added to the examples at glowscript.org.

In addition to classic VPython and this new browser VPython at glowscript.org, a third way to run a VPython program is in an IPython notebook, in a browser, thanks to the ivisual module created by John Coady.

A few VPython objects are not currently available in GlowScript: convex, extrusion (and the paths and shapes libraries), faces, frame, and the 3D text object. For details, see http://www.glowscript.org/docs/VPythonDocs/index.html.

Please report bugs!

Bruce

[Josh Gates]

Thanks for this, Bruce!

Things seem to be working well for me, except for trails. It does create trails, but sometimes they're too small to be seen. In VPython, I can do a sim of a satellite's motion with the actual size of the satellite - the trail is always some minimum size to ensure visibility. It looks like it's a set fraction of the object size now, so I have to make my LEO satellite 200 km in radius for the trail to be seen. Ditto for simulations of the solar system, etc. I always thought that the "always visible" trail was a great feature.  Here's an example: http://www.glowscript.org/#/user/DeltaGPhys/folder/My_Programs/program/OrbitProgram/edit

Thanks again for this new feature!

jg

[Bruce Sherwood]

I'll take a look, Josh.

Note that you can change the trail radius:

ball = sphere(.....)

ball.trail_object.radius = 1e37

[Bruce Sherwood]

Okay, I see the problem. You're right -- setting the default radius to a fraction of the object's radius is inconsistent with classic VPython, and I should change that. Thanks!

[Bruce Sherwood]

Ugh. Having looked into the matter, it's not easy to fix. In classic VPython the default curve object paints a curve one pixel wide. In the GlowScript environment we don't have at this time a way to create a curve whose width is a pixel -- the radius has to be given in world coordinates. Currently, as a stop gap, the default curve radius is a small fraction of scene.range, but with autoscaling that range isn't known until the objects have been created. One thing you can do is specify scene.range appropriately, though I admit that smells like a kludge, albeit one that will continue to work in both environments. 

The best solution would be to bite the bullet and implement a 1-pixel-width curve option in GlowScript.

[Bruce Sherwood]

I was able to fix it after all. Try it and see. Thanks again for the report.

[Josh Gates]

Thanks for the fix! Trails are definitely working now. Do point trails have a similar fix (or, are they possible? I thought that I remembered something about them not working)?

Thanks,

jg

[Bruce Sherwood]

There is (currently) no points object in the GlowScript environment, so make_trail uses spheres. The trick I used to make thin curves is harder to exploit in the case of these spheres, so currently their size is determined by the size of the moving object.

Incidentally, note that one of the big advantages of the GlowScript environment is that it is possible to fix things immediately for all users, whereas with classic VPython, even if a new version is created quickly (which isn't easy) you won't get the benefit unless you explicitly install that new version. Cloud computing has its points.

[Josh Gates]

I do like those updates. I guess that it has potential downsides - maybe the VPython that I use in class today won't work as I expected or will fight with hardware, etc. tomorrow. Installed versions are stable for the individual.

The big benefit, for me, is making the barrier to entry lower for students. No installations and easier code-sharing (I can see and run their programs without having to download, open, etc.) outweigh the potential concern above, for sure.

jg

On Fri, Nov 21, 2014 at 11:39 AM, Bruce Sherwood <bruce.s...@gmail.com> wrote:

There is (currently) no points object in the GlowScript environment, so make_trail uses spheres. The trick I used to make thin curves is harder to exploit in the case of these spheres, so currently their size is determined by the size of the moving object.

Incidentally, note that one of the big advantages of the GlowScript environment is that it is possible to fix things immediately for all users, whereas with classic VPython, even if a new version is created quickly (which isn't easy) you won't get the benefit unless you explicitly install that new version. Cloud computing has its points.

--
You received this message because you are subscribed to a topic in the Google Groups "VPython-users" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/vpython-users/SCjG40kpWyA/unsubscribe.
To unsubscribe from this group and all its topics, send an email to vpython-user...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Joshua Gates
CTYOnline Science Instructor
Johns Hopkins University
5801 Smith Ave, Ste 400
Baltimore, MD 21209

Email:  jga...@ctyonline.net

Phone: (585) 298-0868
Fax:  (866) 646-3816
Office Hours:  Weekdays 7-8am (EST)

[Bruce Sherwood]

Note that in principle the version number associated with GlowScript programs can protect you from some of the dangers of a program suddenly not working. Incompatible or large changes in GlowScript trigger an increase in the version number, while the libraries for older versions remain available. This isn't full protection, because 1) a fix to a current version, such as the one I just made, might break something in the current version, and 2) changes in the browser world might mean that an old version no longer works with a new browser.

[Peter Farrell]

This is great news! 

I immediately copied and pasted in a simple program and it doesn't like my position vector?

http://www.glowscript.org/#/user/Peter_Farrell/folder/My_Programs/program/PythonTest

It gives me the error "Property 'pos' must be a vec." I tried calling the vectors "vector" but it still gives me that error.

Encouraged nonetheless!

Peter Farrell

[Josh Gates]

It doesn't automatically assume that pos is a vector (unlike VPython), but I've been just fine calling vectors either vec or vector in my scripts.

jg

[Bruce Sherwood]

The error message is unfortunately not informative about what the real problem is. I failed to document the fact that earth.pos += earth.velocity*dt does not work in the GlowScript environment, where you need to write earth.pos = earth.pos + earth.velocity*dt. This is the case for the pos, axis, size, color, and up vectors associated with 3D objects. I'll try to do something about this, at least in the conversion program that I've provided. And of course you do need to include a rate statement such as rate(20).

GlowScript accepts either vector or vec; the underlying object is named vec. There is quite a bit of preprocessing of the VPython code before handing it to the RapydScript compiler, and this includes prepending the statement "vector = vec", which has the effect of "vector" being a synonym for "vec". Similarly, if you take a program from GlowScript to classic VPython, you can place the statement "vec = vector" at the start of your program to handle any vec's in your program. Eventually the intent is that like GlowScript, classic VPython would accept either vec or vector.

[Bruce Sherwood]

I'll add the following to the first page of the VPython Help at glowscript.org, and I hope I can upgrade the conversion program to deal with this:

Another word about vectors: In the GlowScript environment pos, size, axis, color, and up are all vectors, and they are somewhat special vectors that track changes in order to trigger correct rendering of the 3D scene when one of these object attributes changes. One result of this structure is that ball.pos += vector(1,2,3) must be rewritten as ball.pos = ball.pos + vector(1,2,3). This is something the conversion program should probably be able to deal with, but it doesn't at the moment.

[Peter Farrell]

Thanks, Bruce!

On Fri, Nov 21, 2014 at 9:29 PM, Bruce Sherwood <bruce.s...@gmail.com> wrote:

I'll add the following to the first page of the VPython Help at glowscript.org, and I hope I can upgrade the conversion program to deal with this:

Another word about vectors: In the GlowScript environment pos, size, axis, color, and up are all vectors, and they are somewhat special vectors that track changes in order to trigger correct rendering of the 3D scene when one of these object attributes changes. One result of this structure is that ball.pos += vector(1,2,3) must be rewritten as ball.pos = ball.pos + vector(1,2,3). This is something the conversion program should probably be able to deal with, but it doesn't at the moment.

--

[Peter Farrell]

Is anybody else having a problem with their VPython programs freezing up? That file I linked to still won't run. GS just freezes up.

[Bruce Sherwood]

As is true in classic VPython 6.10, there must be a rate statement in the animation loop. The format is rate(30) for 30 iterations per second. Your program would freeze up in classic VPython 6.10, too.

[Peter Farrell]

Thanks, again, Bruce! 

That did the trick. Congratulations on all your progress getting VPython working in the browser!

On Sat, Nov 22, 2014 at 11:02 AM, Bruce Sherwood <bruce.s...@gmail.com> wrote:

As is true in classic VPython 6.10, there must be a rate statement in the animation loop. The format is rate(30) for 30 iterations per second. Your program would freeze up in classic VPython 6.10, too.

--

[Bruce Sherwood]

I managed to fix the "points" kind of trail after all, so that the default is a trail of spheres whose radii don't depend on the size of the object being trailed:

http://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/program/BinaryStar-VPython

[Josh Gates]

Just after I told my kids in class yesterday that they could just do curve trails, one of them said "hey, point trails work!"

:)

Thanks,

jg

--
You received this message because you are subscribed to a topic in the Google Groups "VPython-users" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/vpython-users/SCjG40kpWyA/unsubscribe.
To unsubscribe from this group and all its topics, send an email to vpython-user...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Bruce Sherwood]

It's lovely to see how engaged your students are, Josh! And thanks again for stimulating these fixes.

[Josh Gates]

Thanks for all of the quick progress on this, Bruce - it's looking great. 

Is there a way to use sliders, etc. within the VPython in the browser? The help sends you over to the Glowscript side - can widgets in GS be used in a VP script?

Thanks,

jg

[Bruce Sherwood]

Yes, you can use the jquery machinery in GlowScript VPython. However, as is pointed out in the VPyton Help,  there isn't currently a way to make a button that works both in classic wxPython-based VPython and GlowScript VPython.

There is now in the Example programs a VPython version of the ButtonsSlidersMenus program:

http://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/program/ButtonsSlidersMenus-VPython/edit

Probably it will be important to create some standard buttons, sliders, and pulldown menus whose code looks the same in all flavors of VPython, and which are simpler than either the wxPython or jquery widgets. I consider the jquery machinery to be quite complex, almost necessarily so because it has to make the complex connections between JavaScript code and HTML web page coding.

You'll see dollar signs ("$") all through the widget example. It is a standard abbreviation for jquery.

[Bruce Sherwood]

In addition to seeing unfamiliar dollar signs throughout the new program, representing jquery invocation, I should mention another oddity. It is common practice in JavaScript programs and jquery structures to use what are called "anonymous" functions, and the RapydScript-to-JavaScript compiler extends Python to permit anonymous functions. Consider the following code, which binds the function "process_click" to a click event, so that when you click, the function is executed:

def process_click():

    print('You clicked')

scene.bind('click', process_click)

Now consider the equivalent code, which works with RapydScript (and GlowScript VPython):

scene.bind('click', def ():

    print('You clicked')

)

See the "anonymous" function? Now when you click, the anonymous function is executed.

[Bruce Sherwood]

I've improved the GlowScript documentation concerning widgets (buttons, sliders, pulldown menus).

[Josh Gates]

Oops - posted this to GS group just now:

I'm trying to implement a stacked set of motion graphs (x,v,a). I've done it before in GS, using:

xGraph.wrapper.css ("float", "right")

and so forth for the others.

That doesn't seem to have the same effect in VP (though it does move it to the right). Either way, my graphs stack upon each other. 

Here's an example:

http://www.glowscript.org/#/user/jgates/folder/My_Programs/program/KinematicsGraphPractice/edit

Any ideas?

Second issue: the max() function (returns max-value item in a list) doesn't seem to be recognized in the browser VP. I don't think that it comes from a weird library.

Thanks in advance,

jg

On Sun, Nov 30, 2014 at 12:11 PM, Bruce Sherwood <bruce.s...@gmail.com> wrote:

I've improved the GlowScript documentation concerning widgets (buttons, sliders, pulldown menus).

--

You received this message because you are subscribed to a topic in the Google Groups "VPython-users" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/vpython-users/SCjG40kpWyA/unsubscribe.
To unsubscribe from this group and all its topics, send an email to vpython-user...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Bruce Sherwood]

This set of graphs spread across the page sort of works:

GlowScript 1.1 VPython

scene1 = gdisplay(width=300, height=300, title='An example of a graph', xtitle='<b>Time</b>', ytitle='<i>Response</i>')

funct1 = gcurve(color=color.cyan, dot=True)

scene2 = gdisplay(width=300, height=300)

funct2 = gvbars(delta=0.5, color=color.red)

scene3 = gdisplay(width=300, height=300)

funct3 = gdots(color=color.yellow)

scene1.wrapper.css("float", "left")

scene2.wrapper.css("float", "right")

scene3.wrapper.css("float", "right")

for t in arange(-30, 74, 1):

    rate(100)

    funct1.plot( pos=(t, 5.0+5.0*cos(-0.2*t)*exp(0.015*t)) )

for t in arange(-30, 74, 1):

    rate(100)

    funct2.plot( pos=(t, 2.0+5.0*cos(-0.1*t)*exp(0.015*t)) )

    

for t in arange(-30, 74, 1):

    rate(100)

    funct3.plot( pos=(t, 2.0+5.0*cos(-0.1*t)*exp(0.015*t)) )

[Josh Gates]

After playing with it for a while, setting all of the wrappers to "center" seems to do a good job of stacking graphs. It's harder to have two columns - one column has to have an object of equivalent height to the whole stack that's on the other side.

I also had an issue getting there to be buttons on the screen along with the graphs, unless there was a VP 3D window. My current workaround is to make that 3D window have a height of 1, so that it looks like a line.

Thanks,

jg

--

You received this message because you are subscribed to a topic in the Google Groups "VPython-users" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/vpython-users/SCjG40kpWyA/unsubscribe.
To unsubscribe from this group and all its topics, send an email to vpython-user...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Bruce Sherwood]

I'm puzzled by the word "stacking". I would have thought that "stacking three graphs" would mean "put them one on top of each other, vertically". But I gather you're trying to put them side by side? Or have I misunderstood?

[Josh Gates]

You're correct - vertically for the graphs, but I sometimes want to have that graph stack alongside another window,  whether that's text, buttons, or animation.

Thanks,
jg

On Dec 1, 2014 11:45 PM, "Bruce Sherwood" <bruce.s...@gmail.com> wrote:

I'm puzzled by the word "stacking". I would have thought that "stacking three graphs" would mean "put them one on top of each other, vertically". But I gather you're trying to put them side by side? Or have I misunderstood?

--

[kakadu kakaduson]

This is awesome! Thanks, Mr Sherwood.

On Wednesday, November 19, 2014 at 5:25:02 AM UTC+8, Bruce Sherwood wrote:

Run VPython programs in a browser!

Now in GlowScript (glowscript.org) you can write and run VPython programs. Although there are some restrictions, many existing VPython programs can run in a browser, which means that you can send a link to a colleague who can immediately run your program without installing Python and VPython. It also means that students can write and run VPython programs using existing programming instructions and without installing anything, though one must use a modern browser and a modern graphics capability (GPU). I'll mention that the 4th edition of the textbook "Matter & Interactions", available in January, includes explicit instruction in VPython.

You cannot import Python modules such as numpy, nor create your own modules to import.

Here are examples of VPython programs that run in either classic VPython or in GlowScript (when reading the program you can click "Run this program" to execute the program):

http://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/program/Bounce-VPython/edit

http://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/program/GlowScriptObjects-VPython/edit

More demo programs in VPython will be added to the examples at glowscript.org.

In addition to classic VPython and this new browser VPython at glowscript.org, a third way to run a VPython program is in an IPython notebook, in a browser, thanks to the ivisual module created by John Coady.

A few VPython objects are not currently available in GlowScript: convex, extrusion (and the paths and shapes libraries), faces, frame, and the 3D text object. For details, see http://www.glowscript.org/docs/VPythonDocs/index.html.

Please report bugs!

Bruce