Sharebar?

A basic implementation of custom interaction and portableCustomInteraction

A basic implementation of custom interaction and portableCustomInteraction

Hi,

I created this post because I did not find any example of portableCustomInteraction implementation. Based on the XSD and the implementation in other systems I have created the following implementation.
I have attached a preview page that will load the examples and also added a implementation using TAO modules.
As a base I have used this pages:

The basic implementation is in pci.zip.

assessmentItem
<assessmentItem
  xmlns="http://www.imsglobal.org/xsd/imsqti_v2p1"
  xmlns:pci="http://www.imsglobal.org/xsd/portableCustomInteraction"
  xmlns:xi="http://www.w3.org/2001/XInclude"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://www.imsglobal.org/xsd/imsqti_v2p1   http://www.imsglobal.org/xsd/qti/qtiv2p1/imsqti_v2p1.xsd"
  identifier="_10001"
  title="Math_A.1_GraphEquation">
    <responseDeclaration identifier="RESPONSE" cardinality="single" baseType="string" />
    <outcomeDeclaration identifier="SCORE" cardinality="single" baseType="float" />
    <stylesheet href="../shared/graphInteraction.css" type="text/css" media="all" title="Default stylesheet" />
    <itemBody>
      <div><p>Graph the solution to the following equation: x2</p></div>
      <customInteraction responseIdentifier="RESPONSE">
        <pci:portableCustomInteraction customInteractionTypeIdentifier="graphInteraction">
          <pci:responseSchema href="http://imsglobal.org/schema/json/v1.0/response.json" />
          <pci:resources location="../shared/sharedLibraries.xml">
            <pci:libraries>
              <pci:lib id="Edmentum/d3-5.9.1" />
              <pci:lib id="Edmentum/graphInteraction-1.0.0" />
            </pci:libraries>
          </pci:resources>
          <pci:properties>
            <pci:entry key="x">-10,10</pci:entry>
            <pci:entry key="y">-10,10</pci:entry>
            <pci:entry key="showAxes">true</pci:entry>
            <pci:entry key="xStep">1</pci:entry>
            <pci:entry key="yStep">1</pci:entry>
            <pci:entry key="prompt">Use the drawing tool(s) to form the correct answer on the provided graph.</pci:entry>
          </pci:properties>
          <pci:markup>
            <div class="graph-interaction">
              <div class="graph-interaction__prompt" />
              <div class="graph-interaction__canvas" />
            </div>
          </pci:markup>
        </pci:portableCustomInteraction>
      </customInteraction>
    </itemBody>
</assessmentItem>

sharedLibraries.xml

<repository>
    <resources vendor="Edmentum">
      <libraries>
        <lib name="graphInteraction-1.0.0" href="../shared/graphInteraction.js"/>
        <lib name="d3-5.9.1" href="https://d3js.org/d3.v5.min.js"/>
      </libraries>
    </resources>
</repository>

imsmanifest.xml

<manifest xmlns="http://www.imsglobal.org/xsd/imscp_v1p1" xmlns:imsmd="http://ltsc.ieee.org/xsd/LOM" xmlns:imsqti="http://www.imsglobal.org/xsd/imsqti_metadata_v2p1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.imsglobal.org/xsd/imscp_v1p1 http://www.imsglobal.org/xsd/qti/qtiv2p1/qtiv2p1_imscpv1p2_v1p0.xsd" identifier="_1312">
    <metadata>
      <schema>QTIv2.1 Package</schema>
      <schemaversion>1.0.0</schemaversion>
    </metadata>
    <organizations />
    <resources>
      <resource identifier="test_100" type="imsqti_test_xmlv2p1" href="assessment.xml">
        <file href="assessment.xml" />
        <dependency identifierref="_10001" />
      </resource>
      <resource identifier="_10001" type="imsqti_item_xmlv2p1" href="id-10001/10001.xml">
        <file href="id-10001/10001.xml" />
        <file href="shared/sharedLibraries.xml" />
        <file href="shared/graphInteraction.js" />
        <file href="shared/graphInteraction.css" />
      </resource>
    </resources>
</manifest>

graphInteraction.js

/** GraphInteraction: A Custom Interaction Hook implemented as an AMD Module. */
define(
    ['qtiCustomInteractionContext', 'Edmentum/d3-5.9.1'],
    function(qtiCustomInteractionContext, d3) {
      function GraphInteraction(dom) {
        // render the interaction ...
        d3.select(dom.querySelector('.graph-interaction__canvas')).append('svg:svg'));
      }
      
      var graphInteractionHook = {
        getTypeIdentifier: function() { return 'graphInteraction'; },
        initialize: function(id, dom, config){
          this.id = id;
          this.interaction = new GraphInteraction(dom);
        },
        setResponse: function(response) { },
        getResponse: function() { },
        resetResponse: function() { },
        destroy: function() { },
        setSerializedState : function(state) { },
        getSerializedState: function() { },
        resetSerializedState: function() { },
      };
      
      // The Custom Interaction Hook registers to the graphInteractionHook object.
      qtiCustomInteractionContext.register(graphInteractionHook);
    });

I have also done implementation that is uses <modules> in file 'pci-modules.zip'.

Do you see anything wrong in my implementation? I tried to follow the draft v1 standard.

Hi Rosen,

Hi Rosen,

    That looks great!

    It's really good to see another PCI implementation out there.

    The only thing I see is that it is following the older spec. We had an initial PCI best practice defined by Mike Aumock, and then further change requests from OAT and from Mike Aumock so we decided to merge all of the great ideas in each together and come up with a single final version of the PCI best practice for QTI 2.x.

    That was released as a Candidate Final in October 2017 at https://www.imsglobal.org/spec/pci/v1p0

    We then held a formal vote on promoting this to a Final version, and the vote was passed, so it now should be a Public spec, however the publication of the final version of the spec has been in the backlog for some time now. Hopefully when QTI 3 is released IMS will have the bandwidth to complete the final steps in the publication process. As part of that a reference implementation of PCI, licenced under the Apache 2 licence) will also be released which implenents both the QTI Delivery Engine side of QTI and a range of PCI modules also.

    The good news is that the version you have in pci-modules is not too far from the final version. If you get in touch I should be able to give you some pointers on updating it to the latest (and final) version. I developed the IMS Reference Implementation of PCI I mentioned above, so I'd also be able to do some interoperabilty testing against that reference implementation for you and also against other delivery engine implementations of PCI that I have access to and to a range of PCI modules from a range of vendors which I have. All of these conform to the final version of the spec.

    All the best,

          Padraig

Hi Padraig,

Hi Padraig,

Do you mind sending me a latest version sample? I'm working on pci-modules as well and trying to build a testing player(delivery engine like) to load/test all pci items we create. I'm frustrated to find a working sample online. Thank you very much!

Best regards,

Jun

Hi Jun,

Hi Jun,

     If you email me at Padraig.OhIceadha at hmhco.com then I'll get you set up,

          All the best,

                Padraig