## Tuesday, June 16, 2015

### Embedding single WeBWorK problems in HTML pages

Whether writing a full text book or just an explanation and worksheet for a class it is often useful to include an active (even better an interactive example) within the text itself. You can always use a link to refer to a WeBWorK homework set but that doesn’t have the immediacy of a problem embedded in the page itself.

Now you can use WeBWorK to do that -- there is a new mechanism that allows you to export the content of an individual problem without all of the buttons and navigation items that usually appear for a standard homework set. Here is an example.

Problem 1 -- interval notation

In many websites this problem is interactive, try it.   After the jump I have attached a link to an HTML page with many more examples which you can try out. You can also download the page and modify it to display other questions.  On the HTML page I have wrapped each example with a "knowl" slide down javaScript that allows you to slide open or to close each example question individually.

You can download this HTML page, save it, and modify the contents to create your own collection
of displayed questions.  You can adjust parameters of each iframe so as to display any problem in the OPL library.  Here is the short script for the iframe element:

WeBWork problem in an iframe -- the contents above may not display from this blog due to changes in blog protocol. It should display however if you copy/paste this iframe snippet into an html document
<iframe height="600" src="https://hosted2.webwork.rochester.edu/webwork2/html2xml?
&sourceFilePath=Library/Rochester/setAlgebra01RealNumbers/lhp1_31-34_mo.pg
&problemSeed=123567890
&displayMode=MathJax
&courseID=daemon_course
&userID=daemon
&outputformat=simple" width="540">
</iframe>

(warning -- don't put spaces around the equal sign or at the end of lines).

The question being displayed has the path Library/Rochester/setAlgebra01RealNumbers/lhp1_31-34_mo.pg . It is exactly the same as the path that is used in the library browser or which appears in the homework editor. You can adjust the display mode to either "MathJax" or "images".  You can
change the problemSeed to get a different version of the problem.

The question is being rendered through the course "daemon_course" on the webwork site "https://hosted2.webwork.rochester.edu/webwork2". There is a user in the daemon_course named "daemon" who has "login_proctor" privileges (see addendum below) and whose password is "daemon".  There are no "real" students in this course -- it's sole purpose is to serve stand alone questions.

The output format can be changed. The various output formats are defined on the server in the file webwork2/lib/WebworkClient.pm.  The choices are "simple", "standard" which adds some additional warning message output, and "debug" which reveals  all of the variables returned by the WeBWorK question renderer.

For those running WeBWorK 2.10 or later, you should be able to point the url of the iframe to a course at your webwork site and have the question rendered.  The user needs to have at least TA privileges.  For security's sake it is best to create a separate course with no "real" students if you plan to allow this capability to be public.  The hosted2 server uses the newest "develop" branch so your output format may look slightly different since we are continuing to add small tweaks to the develop branch to improve the presentation.  Once this is stable it will become part of the 2.11 release later this summer.

It is also possible to encode the template of a PG problem with url and base64 encoding and then to insert the encoding directly into the html page. This version takes a bit more work at the moment but basic tools will be soon be available in the "develop" branch (webwork2/clients/urlbase64encode.pl )  once the pull requests have been vetted.

Use cases:
We are designing this feature so that examples can be placed in opensource textbooks.  Specifically we will be working with Robert Beezer and his MBX system which will help to automate insertion of webwork problems in text (See http://buzzard.ups.edu/talks/beezer-2015-manitoba/beezer-2015-manitoba-mbx.html).

We expect that this embedding feature can be made useful for other purposes as well.  Please share  your examples and suggestions. (Signing up on the wiki http://webwork.maa.org/wiki and sharing your insights on the forum link in the left column is a good way to communicate to the WeBWorK community.

1. Thank you for your sharing. I could not get the single question when i follow your step on my server. For example, when i visit hosted2.webwork.rochester.edu/webwork2/html2xml, it will show me the html2xml function. However, when i visit localhost/webwork2/html2xml, it display nothing. Could you give me some advice?

2. Not having spaces at the end of lines are important because the iframe tag is going to be wrapped up to a single href line. Most browsers can handle a single return at the end of the line, but not any additional spaces.

Try entering the snippet above all on one line and make sure there are no spaces or returns in the line. Let me know if this works.

Setting the user "daemon" to have "login_proctor" (instead of TA as I originally suggested) reduces the privileges available to the "daemon" user. In particular as a TA they could change passwords. Since the name and password of "daemon" are easily readable from the HTML of the problem this is a security risk.

You can remove this risk by choosing "Course configuration" on the webwork instructors page and then the "permissions" tab. On the permissions page set the "allowed to change their password" permission level to be above "login_proctor" -- then "daemon" will not be able to change their password. You can adjust permissions for changing email as well.

Other students in the course will also loose the ability to change their passwords but if you are using this site as a "production" site for a large number of requests from html pages it is best not to have any users in the course except for "daemon" and administrators of the course.

4. I get the following error when trying this (on my own server):

Error messages

Can't call method "ssl_opts" on an undefined value at /usr/local/share/perl/5.18.2/SOAP/Lite.pm line 484, line 751.
Call stack

The information below can help locate the source of the problem.

in SOAP::Transport::__ANON__ called at line 149 of /opt/webwork/webwork2/lib/WebworkClient.pm
in WebworkClient::xmlrpcCall called at line 172 of /opt/webwork/webwork2/lib/WeBWorK/ContentGenerator/renderViaXMLRPC.pm
in WeBWorK::ContentGenerator::renderViaXMLRPC::pre_header_initialize called at line 183 of /opt/webwork/webwork2/lib/WeBWorK/ContentGenerator.pm
in WeBWorK::ContentGenerator::go called at line 380 of /opt/webwork/webwork2/lib/WeBWorK.pm

5. This could be one of a number of issues. Mostly involving incompatible versions of SOAP::Lite. See the thread at
https://github.com/openwebwork/webwork2/issues/567
to see if that helps. You can start at the bottom ;-) which might be the right fix but the other information might also be relevant to your system.

6. Actually I had already looked at that page. I have tried using cpan to force install both LWP::Protocol::https and SOAP::Lite. The same error occurs.

7. Hmmm. I don't have a concrete suggestion at this point. I'm still pretty sure that it involves compatibility with SOAP::Lite. I suggest posting to the WW forum (reached by a link on the left margin of http://webwork.maa.org/wiki ) You will have to register on the wiki first to obtain permission to post. One of the system admin wizards on the forum may have further suggestions. Googling the error message is another option. Are there two copies of SOAP::Lite on your machine? I have, more than once, updated a copy of a file and then found out the copy wasn't the one being used by the apache server.

Sorry I can't help more. Good luck.

-- Mike