I have just completed the conversion of a java simulation to javascript. However, I cannot find a way to read and set values of variables and elements from the html page. In the old java flavour we used
NameOfApplet._setVariables('variable=x')
and
NameOfApplet._getVariable('variable')
With ejss I cannot do this. I found the pdf with the instruction for using e.g.
Re: How to get and set variables from the html page -
John Val
13 Posts
Hi George, I experiences somtething similar. Calling a custom function ( e.g. compute_solution_from_field() ) in the java version was done _model.compute_solution_from_field(); I could not do the same in the javascript version.
In the javascript file generate for your model get a _model object is generated with which you can acces functionality predefined.
I managed to add the custom function to _model in the following way: In the custom section you might define something like
function shout() { alert("Can you hear me?"); }
// to "export" this function to the _model object you than add to the custom section
_model._shout = function() { shout() };
In a script you now can call <script language="JavaScript" type="text/javascript"> _model._shout();
May your problem is solved if you add to the custom section of your model
_model.getView = function() { return _view;}
Then in you script hopefully the following will work. <script language="JavaScript" type="text/javascript"> _model.getView().plottingPanel.setProperty("Display","none");
Re: Re: How to get and set variables from the html page -
Francisco Esquembre
237 Posts
> In the custom > section you might define something like > > function shout( > > { > alert("Can you hear me?"); > } > > // to "export" > this function to the _model object you than add to > the custom section > > _model._shout = function() { shout() > }; > > In a script you now can call > <script language="JavaScript"<br />> type="text/javascript"> > _model._shout(); > </script<br />> >
where Flag is a variable that controls the movement of a view element (every time it is set to 1, the view element advances by a certain distance). This formulation give the error
_model.getView(...).Flag is undefined
So I need your help in two more points.
1) How do I set the value of such a variable. Perhaps I should add to the custom page this:
_model.setValue = function() { ... ;};
but I cannot even guess what should be in the place of the fullstops.
2) How do I read the value of a variable which may or may not be a property of a view element (for instance, read the value of "Display" for the plotting panel, or the value of the variable that controls the movement of a view element).
Re: Re: Re: Re: How to get and set variables from the html page -
John Val
13 Posts
Dear George Barouxis If Flag is one of your model variables than this is a sultion I found for setting the values from a javascript command. // start var ejsjson='{"model":{"xmin":'+ xmin+',"xmax":'+ xmax+',"functionString":"'+ mathexpression + '","analyticFunctionString":"'+ solutionstring + '","tmin":'+ tmin+',"tmax":'+ tmax+',"vmin":'+ vmin+',"vmax":'+ vmax+',"t0":'+ t0+',"v0":'+ v0+',"t":'+ 0+',"xf":'+ x0+',"xb":'+ x0+',"x0":'+ x0+',"a_isdrawn":false}}'; _modelOrde2.pause();// stop the animation _modelOrde2.reset();// reset the animation _modelOrde2.unserialize(ejsjson); // end
You could probaby also do the following: In custom define
Re: Re: Re: Re: Re: How to get and set variables from the html page -
George Barouxis
8 Posts
John, thank you very much for your help.
I wouldn't dare mess with json as I am completely ignorant on this front, but your second suggestion with the function seems fine. However, I have a lot of such flags in my simulation, and so I tried for a more general solution of the form
_model.setValue = function (vrblName, vrblValue) { _model.vrblName = vrblValue; };
which would theoretically give me a functionality similar to _setVariables('variable=x') of the Java version.
However, it does not work. Debugging this, I see that vrblName and vrblValue in
function (vrblName, vrblValue)
have the correct values (vrblName="Flag1" and vrblValue = 1), but the value of vrblName is not used in _model.vrblName, which the debugger shows that it is undefined.
I have tried various other solutions such as _model[vrblName], etc.
Re: Re: Re: Re: Re: Re: Re: How to get and set variables from the html page -
Francisco Esquembre
237 Posts
Hi,
Variables in EjsS JS models are NOT properties of the _model object. This is because we want the author to write code like this: myValue = 0; instead of _model.myValue = 0;
Hence, you must modify them using similar constructions. If you want a "generic" setValue function, you can add this to your Custom page:
_model.setValue = function (variable, value) { console.log ("Setting value of "+variable +" to "+value); if (variable=="x") x = value; else if (variable=="y") y = value; _update(); }
Notice that I compare the name of the variable to Strings that I code with this name. Attached is an example that uses this function from the HTML in another panel. Notice also that you must call _update() so that the possible Fixed relations pages are called AND the view is updated. Otherwise, the model variables will change but you will not see it in the view.
Re: Re: Re: Re: Re: Re: Re: Re: How to get and set variables from the html page -
George Barouxis
8 Posts
Hi,
So I guess this means there is no generic way of setting (or reading) the value of a variable from the HTML page, and so you woulld need a switch structure for all variables you will need to set from the page, and a similar structure for all variables you would need to read the values of.
You mention above that variables are not properties of the _model object. I tried with the window object, and again I could not access variables. Are they properties of any other object through which we could access them? Or is any other way to access them?
I insist on that becase I have two simulations to convert to EjsS which have a lot of variables, so after I read your answer I searched around and found out that a generic function for reading and setting values of variable can work if you use eval. Should I assume that it is too dangerous in this case and I shouldn't do it?
Re: Re: Re: Re: Re: Re: Re: Re: Re: How to get and set variables from the html page -
Francisco Esquembre
237 Posts
Hi,
There is no way of accessing the variables except from within the function that defines them. Which is the one that creates and returns the model.
Since you have access to the source code in EjsS, it is much better and simpler to add your own custom functions to add whatever control you want. Using eval would do basically the same thing...
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: How to get and set variables from the html page -
George Barouxis
8 Posts
All right, thank you for your help.
I will use eval then.
On the other hand, out of curiosity, how could I add a custom function that would make all variables accessible? Perhaps add them as properties to an object? In that case I would need a way to enumerate the variables in a loop structure. Is there a way to do this?
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: How to get and set variables from the html page -
John Val
13 Posts
Dear George, As mentioned in my first reply there is a way to set all or some variables in one go without the necessity to write your own functions. There was an error which has been repaired in the latest release 10-10-2105
So in your javascript function you write something like
// generate this string for all the variables you would like to set // for my model e.g. xmin,xmax ,...,isdrawn.
_model.pause();// stop the animation _model.reset();// reset the animation // with the unserialize function you now set the values (update is called) _model.unserialize(ejsjson);
The other way around can be done in the following way
// catch all variables var everything=_model.serialize(); // extract the model parameters var modelpars= JSON.parse(everything).model; //use one alert( modelpars.xmin )
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: How to get and set variables from the html page -
George Barouxis
8 Posts
Hi John, I have made it work using eval with two functions that duplicate exactly the functionality of _getVariable() and _setVariables() of the Java version.
However, eval has its dangers, so I will try to implement your suggestion.
So, two questions.
First, I am not clear if the functions you give should go to the custom functions page of the simulation in EjsS, or in the javascript of the HTML page.
And second, would this work without using _model.reset(), as I am changing values in the middle of presentation, so it is not possible to reset the model each time returning it in its original state.
