slideDown

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://demo.webwork.rochester.edu/webwork2/html2xml?
&answersSubmitted=0
&sourceFilePath=Library/Rochester/setAlgebra01RealNumbers/lhp1_31-34_mo.pg
&problemSeed=123567890
&displayMode=MathJax
&courseID=daemon_course
&userID=daemon
&course_password=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.

For a quick check of this feature you can use your own professor user login and password in any of your courses but you shouldn't make public any html that reveals your password.

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.








11 comments:

  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?

    ReplyDelete
  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.

    ReplyDelete
  3. Security Addendum


    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.

    ReplyDelete
  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

    ReplyDelete
  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.

    ReplyDelete
  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.

    ReplyDelete
  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

    ReplyDelete
  8. I'm attempting to embed WeBWorK problems in my LMS using HTML and by calling my university's WeBWorK server. I'm getting a bunch of errors when some .js files aren't being loaded (for example: jquery.js, MathJax.js, Base64.js, knowl.js, problem.js, and math4.js). Are these normally part of a standard WeBWorK server? When I point to the Rochester server, my code works fine.

    I don't have admin access to the server I'm using, but I've contacted the admin and I'm asking here to help diagnose the problem. Are these addons that the admin would need to install for the embedding to work? We're currently using version 2.13.

    ReplyDelete
    Replies
    1. Those files are in the webwork server (in subdirectories under the directory webwork2/htdocs/js

      A good place to ask this question would be on the forum attached to the WeBWorK wiki at http://webwork.maa.org/wiki.
      (The link to the forum is on the left. You have to register on the wiki before you will be allowed to post to the forum. ) Perhaps others have run into and solved this problem.

      It will be useful to know what the error messages say -- e.g. they say fail to load from siteAddressXYZ or whatever -- does that site address seem correct? Can you reach that site from the location blank on your browser?


      If you try to contact your local webwork server from an embedded webwork on an ordinary HTML page (say a file on your desktop computer) -- does that work? The LMS may be doing some redirects to get to the webwork server and these redirects are not being uniformly applied when the page makes callbacks to retrieve the additional .js and .css components.

      Hope this helps.

      Good luck

      -- Mike

      Delete
    2. Thanks for your reply.

      The webwork server admin was able to fix the problem, but I didn't ask what the fix was. It was apparently and easy fix on his end, though.

      For what it's worth: I tried both embedding in the LMS and in an html file on my local machine. Both had the same issue.

      I wasn't able to find anyone with a similar issue in the forums. Maybe I should ask the admin what the fix was and post it in the forums in case someone else has the same problem...

      Thanks again.

      Delete
    3. If you get a chance to find out the fix (and the detailed cause of the problem) and post it on the forums that would be great. Thanks.

      Glad things worked out.

      Delete