Deploying your Tutor - CMUCTAT/CTAT GitHub Wiki

Table of Contents

  1. Deploying your Tutor
    1. Local, running tutors for local testing
    2. TutorShop, a Custom LMS for CTAT tutors
      1. Create a package .zip file
      2. Deploy to TutorShop
    3. Deploying to other Learner Management Systems
      1. SCORM (Moodle, Blackboard))
      2. LTI
      3. OLI
    4. Web Server Deployment (Apache or other web server)

Deploying your Tutor

CTAT tutors can be deployed in a variety of environments, ranging from our TutorShop site to common Learning Management Systems (LMSs) to your own simple web server. Our goal has been to make deployment as easy and as flexible as possible. Your tutors are not very useful if you can't get them in front of your students!

When providing your tutor to one of the many existing Learner Management Systems, you provide the same .html file you created with the CTAT HTML Editor (or a file you created manually). You do not need to change your interface file to specify configuration parameters; instead, the necessary parameters are set either within the LMS itself or from the LMS Package Wizard in CTAT, depending on the specific deployment environment.

Please take the following criteria into account if you want to deploy to one of the listed LMSs:

  • Always use an "https" source for external files, e.g. .css and .js files not bundled with your tutor. For example <https://cdn.ctat.cs.cmu.edu/releases/latest/ctat.min.js> is a valid url to use but <http://cdn.ctat.cs.cmu.edu/releases/latest/ctat.min.js> might not work in all environments.
  • If you have added configuration parameters (such as logging parameters and the BRD file name) in your html file, they can be overwritten by the LMS. For example, if you have the question_file parameter set in your .html file, it is only used when you run your tutor through your own web server. In every other case, the BRD file name will be provided by the LMS.

Running Tutors for Local Testing

Most of the time you will want a quick and easy way to try out your tutor and get a sense of what it looks like deployed on a server or learner management system (LMS). One very quick and easy way to do this is to run an instance of the node web server through javascript. Follow the steps below to get started:

  1. Create a new directory where you can try out your tutor

  2. Change to that directory and create another sub folder called 'content', that is where you can place your tutor files as-is.

  3. In your test directory create a javascript file called: server.js In that file past the following code:

const http = require('http');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
});

server.listen(port, hostname, () => {
  console.log(`Node test server running at http://${hostname}:${port}/`);
});
  1. Now create a file called run.sh and paste the content below in it (you can also run this directly from the command line)
http-server

Execute the script and you will be able to go to the URL below to see your tutor:

http://localhost:3000/content

TutorShop, a Custom LMS for CTAT tutors

TutorShop was designed to support deployment of CTAT tutors. You can upload a .zip file containing your interface, graphs, and other assets needed for your tutor, set some configuration parameters in TutorShop, and test your tutors.

In order to deploy to a TutorShop site, you will need a "content developer" account. If you do not have an account, you can request one:

  1. Open the TutorShop web site.
  2. Click on the Contact Us button.
  3. In the contact form, choose "I'd like a developer account" for the Message Type.
  4. Fill out the remaining fields as appropriate. In the Message field, be sure to provide information describing your intended use of TutorShop.

Create a package .zip file

Before you can upload your tutor to TutorShop, you need to bundle all of your tutor's files into a .zip file. TutorShop expects files to be organized with the following directory structure:

<package-name>\
  FinalBRDs\
  HTML\
    Assets\

This is the same directory structure that the CTAT HTML Editor uses by default.

To bundle your tutor with the CTAT HTML Editor:

  1. First, be sure you've saved your student interface to the package and your .brd files (created in CTAT) to the package's FinalBRDs subfolder.
  2. Then, in the CTAT HTML Editor, choose File > Download Package. Click on the package folder you want to download and click OK. This will download a .zip file named for your package ("MyTutor.zip", e.g.) to your browser's default Download folder (or prompt you for a destination folder, depending on your browser settings).

Deploy to TutorShop

Once you have an account on TutorShop and a package .zip file, you can deploy it to TutorShop.

To deploy the package on the TutorShop LMS:

  1. Log in to TutorShop, click on Packages in the menu, then click the Load Packages button at the lower right; wait a bit for TutorShop to revise its package list.
  2. After a pause, you'll see a split screen. Depending on the access you have been given, you will see either
    • A tree of folders (with root AllTutors) above and a list of packages below (if you have access to SVN), or
    • A tree with one folder above for the project you have access to and a list of packages below for that project, or
    • No folder above and no packages below.
  3. Scroll to the bottom of the page, click the Upload Zip button near the bottom center, and use the file chooser dialogue to find your package's .zip file. TutorShop will create a package named for the folder inside your .zip file (e.g., "MyTutor"). If you're revising an existing package, TutorShop will just replace its files.
  4. Find and click on your package in the list; note the search box at the upper right.
  5. On your Package's detail screen (e.g., titled "Package: MyTutor") first choose the Problems tab and define the problems in your package. For TutorShop, a problem is defined by pairing a student interface (.html file) with a problem-specific behavior graph (.brd file) or model file (.nools). Within a package, any pairing is possible; often many .brd files are paired with a single student interface. All problems in a package can share any additional files, such as images and others found in the HTML/Assets subfolder.

    Note: When selecting a student interface, be sure to select the .html file, not the .ed.html file.

  6. On the Problem Sets tab, define a problem set, which is a group of problems sequenced by an outer loop mechanism (could be random, a fixed order, adaptive or custom). All problems in a problem set must be in a single package.

    Note: Some or all of the problems defined in the preceding step need to be added to the Problems tab in the problem set.

Test your problem set by clicking on the green "play" button (triangular icon) under Actions on the Problem Sets tab.

Deploying to other Learner Management Systems

Tutors can be deployed to any LMS that supports the SCORM 1.2 or Learning Tools Interoperability (LTI) standards. They can also be deployed to Open Learning Initiative (OLI) courses or OpenEdX. We encourage you to use the Export feature available in CTAT for these LMSs. Selecting File > Export... from the CTAT menu will start the LMS Package Wizard, which will guide you through the process of packaging your tutor for a specific LMS.

Image

Note

A package created with the LMS wizard contains one student interface and one BRD file. If you have more than one BRD file for your student interface, you will need to create a separate package for each one.

Please consult the platform specific notes below for any information that will help you once you've produced an LMS package with the wizard.

SCORM (Moodle, Blackboard)

CTAT currently supports SCORM 1.2, which is compatible with most platforms that support SCORM packages. We have tested our code against Moodle and Blackboard, and we expect any other system that supports SCORM to behave similarly.

To create a single-tutor package for a SCORM-compliant LMS such as Moodle:

  1. In CTAT, choose File > Export from the menu, and click Next in the LMS Package Wizard dialog.
  2. On page 2 of the dialog, choose Tutor Type “HTML5 Tutor,” specify your problem’s BRD file and HTML file (the .html file, not the .ed.html file), choose "Built-in Javascript Tracer" as the Tutor Engine. Optional: Enable logging if desired and specify a DataShop URL (https://pslc-qa.andrew.cmu.edu/log/server is okay for testing, not for production) and set a Dataset Name that is descriptive of your tutor or research study; do not leave the default name. Click Next.
  3. On page 3 of the dialog, list any files other than the BRD and HTML that are part of your tutor. These are typically CSS, JS and image files which, by convention, are in the HTML/Assets/ subdirectory of your tutor; you can simply add the whole directory. Click Next.
  4. On page 4 of the dialog, choose the "SCORM" option and click Next.
  5. On page 5 of the dialog, enter a description and a name for the output ZIP file.

Import the .ZIP file into your LMS. For example, if you are deploying to Moodle, navigate to the proper course and topic. Choose Administration > SCORM package administration > Edit settings from the menu. Drag the ZIP into the Package panel shown, then click one of the Save buttons at the bottom.

  • For more information on Blackboard, please see this page for details.
  • For Moodle, please consult the following documentation.

LTI

CTAT supports the Learning Tools Interoperability (LTI) standard, allowing tutors hosted on TutorShop to be used in an LMS that also supports LTI. TutorShop is an LTI Tool Provider and OpenEdX (for example) is an LTI Consumer. See Learning Tools Interoperability for more information on the LTI standard. See section TutorShop, a Custom LMS for CTAT tutors for instructions on how to deploy CTAT tutors to TutorShop.

Note

The names of the available options might vary slightly depending on the version of edX you are using.

  1. In TutorShop, add or generate a consumer key/consumer secret pair on a TutorShop school's Settings page. You will need this pair of values when you set up your course in Open edX. If you don't have access to the Schools page in TutorShop, you will need to ask an administrator to do this for you.
  2. In the Open edX studio site
    1. Click on a course, then go to the Settings menu to see the Advanced Options.
    2. In Advanced Options first you need to add "lti" to the Advanced Module List. (In newer versions "lti" has been replaced with "lti_consumer".)
    3. The LTI passport needs to be added as a string to the LTI Passports list. Enter the Consumer Key and Consumer Secret values (from the TutorShop school's Settings page) in the following format: "{lti_id}:{client_key}:{client_secret}"

      Tip

      A good value for lti_id is "CTAT", so an example passport string might look like "CTAT:Test_LTI_k9PelM05g91:Syqms3XcPuy7HpK41Gb279uWmQJ9O05Gka7bn". Note that the string must be surrounded by quotation marks.

    4. Select Advanced from the Add New Component section, select "LTI" (or "LTI Consumer") from the list, and then click Edit to get to the options dialog.
    5. In the LTI unit being added to the course, enter the lti_id and add the LTI URL in the following format: https://tutorshop.web.cmu.edu/run_lti_problem_set/{package_name}/{problem_set_name}

      Tip

      The LTI URL can be copied from the LTI Launch URL field in your problem set's Settings page in TutorShop. For example, given package_name "MyTutor" and problem_set_name "Two Problems", the URL would be "https://tutorshop.web.cmu.edu/run_lti_problem_set/MyTutor/Two%20Problems"

Note that the LTI passport is stored in the course settings. The LTI ID acts as an identifier for the passport, allowing you to just use the ID on each LTI Unit so that you don't have to put the consumer key and secret on every unit in the course.

Open edX has several useful settings for the LTI unit that might be of interest for running CTAT tutors. For example:

  • The Open in New Page option determines if the tutor opens in a new page.
  • The Scored option determines if the LTI tool (e.g., TutorShop) sends scores back to the LMS.

OLI

The Open Learning Initiative (OLI) provides a platform for online courses. Integration with OLI can be quite elaborate if you start from a fresh new curriculum. The documentation for this process is therefore quite substantial. For information on how to import the generated tutor package, please see the official OLI deployment documentation.

Importing CTAT tutors into OLI starts exactly the same as every other Learner Management System and you can therefore use the steps in CTAT's LMS Package Wizard (shown above) to produce an OLI ready zip file. Once you have this zip you will have to go through a number of OLI-specific steps to upload and integrate your generated tutor package. The steps below are a rough guide; some additional steps might be needed for which you might need to contact the OLI team.

  1. First check out the content package generated for you by the OLI team. Upon request they will provide you will a template package that consists of a number of folders and files required to build a content package.

    Let's say that your package is called 'ctat_demo', then you would want to use SVN to check out a localcopy by issuing the following command on a command line shell:
    svn checkout https://svn.oli.cmu.edu/svn/content/oli/experimental/branches/ctat_demo You can also do this through a GUI based SVN tool such as TortoiseSVN or SmartSVN.

  2. Once you have your 'empty' content package checked out locally you should have a folder that has the following folders and files in it:

content [directory]
organizations [directory]
others [directory]
tools [directory]
build.xml
log4j.properties
log4j.properties.sample
  1. Remove all the contents you see listed above, you want to end up with a clean directory and only one subfolder called .svn.

  2. Take the zip file generated by the Export Wizard and unzip its contents over the versions you see above. Our zip file essentially contains the same structure and content but modified to run your tutor.

  3. Using SVN add all the new contents to the repository. Most SVN applications allow you to find all unversioned files and add them all at once.

  4. Commit all changes to the repository to make sure your new tutor package is now on OLI's server.

  5. Log into the OLI server with the ssh account you were provided by the OLI team.

  6. Download the tutor you just commited by running the exact same SVN command to check out your latest work from the server, for example if we were using the ctat_demo content package we would again run:
    svn checkout https://svn.oli.cmu.edu/svn/content/oli/experimental/branches/ctat_demo

  7. Navigate to the ctat_demo folder and issue the following commands, they will check, compile and deploy the tutor to the OLI webserver:
    ant clean

    ant

    ./tools/oli/deploy.sh

  8. You can now log into the OLI webserver and add your tutor do any course by finding it in the curriculum browser.

OpenEdX (XBlock)

TBD

Web Server Deployment (Apache or other web server)

Most of the time you will want to use an LMS to run your tutor because an LMS provides grading and better student tracking. For those who want to run tutors on their own web site (or just test tutors before deploying to an LMS), you will need to install a web server such as the Apache HTTP server.

For tutors deployed on a web server, you need a way to set configuration parameters that control the tutor's behavior. At a minimum, you must set the question_file parameter, which specifies the BRD file to use for the current problem. Note that the path to the .brd file is relative to the directory containing the .html file for you tutor interface. See the documentation for the available configuration parameters in Tutor Configuration.

Tip

Many of the configuration parameters have default values defined; if the default value is what you want, you do not need to set the parameter explicitly.

There are two ways you can set configuration parameters for your tutors.

  1. Specify configuration parameters in the HTML interface's URL as a query string. For example, if you simply want to test a particular problem for your tutor, you could type a URL like the following in your browser:

    http:\\localhost\MyTutors\studentInterface.html?question_file=../FinalBRDs/problem1.brd

    Alternatively, you could create a simple web page with links that include a different query string for each problem:

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
      <title>Factors Problems</title>
      <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    </head>
    <body><h1>Factors Problems</h1>
       <hr>
       <p>Complete each of the problems below:
          <ol>
             <li><a target="blank" href="HTML/factors.html?question_file=../FinalBRDs/balloons.brd">Balloons</a></li>
             <li><a target="blank" href="HTML/factors.html?question_file=../FinalBRDs/cookies.brd">Cookies</a></li>
          </ol>
       </p>
    </body>
    </html>
  2. Specify configuration parameters in the HTML file. However, if you use this method and have multiple BRD files for the same tutor interface, you would need a separate .html file for each problem.

    If your tutor interface is embedded in another HTML page, you can use an <iframe> and set configuration parameters in the data-params attribute:

    <html>
    <head>
      <title>Cookie Tutor</title>
    </head>
    <body>
      <h3>Cookie Tutor</h3>
      <iframe id="tutor_iframe" src="HTML/factors.html" 
              data-params='{"question_file":"../FinalBRDs/cookies.brd","problem_name":"cookies"}'
              height="650px" width="100%" scrolling="yes" frameborder="1">
      </iframe>
    </body>
    </html>

    If your tutor interface is not embedded in another HTML file, you can set the parameters in the interface directly with a JavaScript variable and use that variable to initialize the tutor with a ctatOnload() function:

    <script>
       var myVars =
       {
          question_file: "../FinalBRDs/balloons.brd",
          tutoring_service_communication: "javascript"
       };
    
       // The CTAT JavaScript code looks for a ctatOnload() function and
       // executes it automatically if it is defined in your tutor.
       function ctatOnload() {
         initTutor(myVars);
       }
    </script>

In general, hard-coding configuration parameters directly in the HTML tutor interface is the least flexible method. If you plan to deploy your tutor to an LMS later, you need to be aware of which parameters set from the LMS override parameters set in the interface.

If you plan to host your tutors on your own web server (rather than deploying them to an LMS) and want your tutors to log to DataShop, you will need to set configuration parameters for logging and provide a unique value for the user_guid parameter so you can distinguish one student from another. Depending on your needs, you can use a single method of setting parameters or a combination of both methods. For example, you might set parameters that are always the same for every student in the .html file but set parameters specific to each student in the query string.

Image Important

You must run your tutor from an address in your browser that starts with http:// or https://. You can not run a tutor by double-clicking on the .html file, which will open the file in a browser with a URL like file://tutor.html. This will cause an error when the tutor tries to load a BRD file.

Next Topic >>

⚠️ **GitHub.com Fallback** ⚠️