The Text Extractor interaction permites textual elements to be dragged
are dropped into targets, thus creating a special type of matching. Instead of defining this as a special class of
<matchInteraction>
, we use a <customInteraction>
with the following signature:
<customInteraction class="tei-textextractor" identifier="RESPONSE"/>
Wiring source draggers to targets is easy. Create a <div>
element around the selectable content. Then add <span>
's around the source draggers, and include id's to
distinguish one source dragger from another. For the drag targets, create div markup with the following signature, one for each target (making sure to
add the int-ext-dropBay
class to each target):
<div id="bay1" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"/div>
<div id="bay2" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"/div>
The following is the complete <customInteraction> where the Text Extractor interaction is enabled:
<customInteraction class="tei-textextractor" responseIdentifier="RESPONSE"> <!-- use the customMarkup element to place drop targets and encapsulating div --> <customMarkup><![CDATA[ <div id="bays"> <div id="bay1" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"></div> <div id="bay2" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"></div> <div id="bay3" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"></div> <div id="bay4" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"></div> </div> ]]></customMarkup> <!-- use the customOption element to specify the selectable span's and the drop targets --> <customOption><![CDATA[ { contentDiv: "extractableContent", bays: { div: "bays" }, style: { bayBorderWidth: "1", bayBorderColor: "#aaaaaa" }, selectable: [ "S1","S2","S3","S4","S5","S6","S7","S8","S9","S10","S11","S12", "S13","S14","S15","S16","S17","S18","S19","S20","S21","S22" ] } ]]></customOption> </customInteraction>
Get Responses: | [ Click Get Responses ] |
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <assessmentItem xmlns="http://www.imsglobal.org/xsd/imsqti_v2p1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" adaptive="false" identifier="customInteraction-textextractor-1" timeDependent="false" title="TextExtractor - MissyG" xsi:schemaLocation="http://www.imsglobal.org/xsd/imsqti_v2p1 http://www.imsglobal.org/xsd/imsqti_v2p1.xsd"> <responseDeclaration identifier="RESPONSE" cardinality="multiple" baseType="directedPair"> <correctResponse> <value>S1 bay</value> <value>S2 bay</value> <value>S8 bay</value> <value>S10 bay</value> </correctResponse> </responseDeclaration> <outcomeDeclaration baseType="integer" cardinality="single" identifier="SCORE"/> <itemBody> <div class="row"> <div class="span6"> <div class="passage-scrolling passage440"> <div id="extractableContent"> <p> <strong>On-location Newscaster:</strong> Behind me is <span id="S1">the latest damage</span> done by <span id="S2">the graffiti vandal</span> who calls herself Missy-G. This is <span id="S3">the latest chapter</span> in a <span id="S4">raging controversy</span> here in Steeletown. Some call Missy-G <span id="5">an artist beautifying the city</span> while <span id="S6">others say she's a criminal</span>, plain and simple. These <span id="S7">before-and-after photos</span> show <span id="S8">the damage that she has left in her wake</span>. We have been trying to reach the Chief of Police for comment. Bill is back at the station, and he tells me that Chief Patterson has just called in. Bill, do you have the chief <span id="S9">on the line</span>? </p> <p> <strong>Station Newscaster:</strong> Yes, Paula. Chief Patterson, what do you make of Missy-G's <span id="S10">latest attack on our fair city</span> ? </p> <p> <strong>Chief Patterson:</strong> If Missy-G did not have the owner's permission to <span id="S11">deface</span> this wall, then she is <span id="S12">in violation of city code</span> . In this case, we must apply the law and <span id="S13">seek her arrest</span>. </p> <p> <strong>Station Newscaster:</strong> What about <span id="S14">her supporters</span> who call her work art? </p> <p> <strong>Chief Patterson:</strong> It is not our job to decide whether her markings are <span id="S15">attractive</span>. I'm sure there's <span id="S16">an arsonist</span> out there who thinks the ashes he leaves behind are <span id="S17">a thing of beauty</span>. That doesn't make <span id="S18">arson legal</span>. </p> <p> <strong>Station Newscaster:</strong> Thank you, Chief. Now it's time for <span id="S19">your opinion</span>. The emails have been streaming in. Here's one from Ron in Oak Hills. </p> <p> <strong>Ron in Oak Hills:</strong> Missy-G is just doing this <span id="S20">for her own commercial gain</span>: to make money. She might as well put <span id="S21">COMING TO A GALLERY NEAR YOU SOON</span> at the bottom of every wall she has <span id="S22">vandalized</span>. </p> <br /><br /> </div> </div> </div> <div class="span6"> <div class="well"> <p> Which of the highlighted phrases are examples of biased language used by the newscasters? Drag, to the boxes below, four examples of the newscasters' biased language that extend beyond the news report's coverage of others' viewpoints. </p> <customInteraction class="tei-textextractor" responseIdentifier="RESPONSE"> <customMarkup><![CDATA[ <div id="bays"> <div id="bay1" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"></div> <div id="bay2" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"></div> <div id="bay3" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"></div> <div id="bay4" class="int-ext-dropBay" style="height: 70px; margin-top: 20px;"></div> </div> ]]></customMarkup> <customOption><![CDATA[ { contentDiv: "extractableContent", bays: { div: "bays" }, style: { bayBorderWidth: "1", bayBorderColor: "#aaaaaa" }, selectable: [ "S1","S2","S3","S4","S5","S6","S7","S8","S9","S10","S11","S12", "S13","S14","S15","S16","S17","S18","S19","S20","S21","S22" ] } ]]></customOption> </customInteraction> </div> </div> </div> </itemBody> <!-- responseProcessing should select the first three characters (substring) of the second part of the tuple saved for each response and match the resulting tuple to each of the <correct>'s. e.g. [S15 bay2] should be transformed to [S15 bay], and matched to a <correct>. --> </assessmentItem>
On-location Newscaster: Behind me is the latest damage done by the graffiti vandal who calls herself Missy-G. This is the latest chapter in a raging controversy here in Steeletown. Some call Missy-G an artist beautifying the city while others say she's a criminal, plain and simple. These before-and-after photos show the damage that she has left in her wake. We have been trying to reach the Chief of Police for comment. Bill is back at the station, and he tells me that Chief Patterson has just called in. Bill, do you have the chief on the line?
Station Newscaster: Yes, Paula. Chief Patterson, what do you make of Missy-G's latest attack on our fair city?
Chief Patterson: If Missy-G did not have the owner's permission to deface this wall, then she is in violation of city code. In this case, we must apply the law and seek her arrest.
Station Newscaster: What about her supporters who call her work art?
Chief Patterson: It is not our job to decide whether her markings are attractive. I'm sure there's an arsonist out there who thinks the ashes he leaves behind are a thing of beauty. That doesn't make arson legal.
Station Newscaster: Thank you, Chief. Now it's time for your opinion. The emails have been streaming in. Here's one from Ron in Oak Hills.
Ron in Oak Hills: Missy-G is just doing this for her own commercial gain: to make money. She might as well put COMING TO A GALLERY NEAR YOU SOON at the bottom of every wall she has vandalized.
Which of the highlighted phrases are examples of biased language used by the newscasters? Drag, to the boxes below, four examples of the newscasters' biased language that extend beyond the news report's coverage of others' viewpoints.