demisk
f9b802879d
Fix hints in CTATGroupingComponent graph. Add a tutored step for CTATTable example. Update description for CTATTextField example. Point to jquery library on our CDN in tutorial example.
89 linhas
2.9 KiB
HTML
89 linhas
2.9 KiB
HTML
<html>
|
|
<head>
|
|
|
|
<link rel="stylesheet" href="https://cdn.ctat.cs.cmu.edu/releases/latest/CTAT.min.css"/>
|
|
<link rel="stylesheet" href="css/ctat_example.css"/>
|
|
|
|
<style>
|
|
.row {
|
|
display: table;
|
|
margin: 2px;
|
|
width: 500px;
|
|
height: 30px;
|
|
border: 0px solid black;
|
|
}
|
|
.text {
|
|
display: table-cell; width: 250px; height: 25px;
|
|
}
|
|
.input {
|
|
display: table-cell; width: 250px; height: 25px;
|
|
}
|
|
.input>input[type="text"] {
|
|
background-color: white;
|
|
}
|
|
</style>
|
|
|
|
<script src="https://cdn.ctat.cs.cmu.edu/releases/latest/jquery.min.js"></script>
|
|
<script src="https://cdn.ctat.cs.cmu.edu/releases/latest/ctat.min.js"></script>
|
|
<script src="https://cdn.ctat.cs.cmu.edu/releases/latest/ctatloader.js"></script>
|
|
|
|
<script>
|
|
//useDebugging=true;
|
|
|
|
var myVars =
|
|
{
|
|
question_file: "CTATGroupingComponent-UseDiv.brd",
|
|
tutoring_service_communication: "javascript"
|
|
};
|
|
|
|
function ctatOnload ()
|
|
{
|
|
initTutor(myVars);
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<div id="container" class="tutor_window" style="display: table; width: 550px; background-color: initial;">
|
|
<div style="display: table-row; width: 100%; height:100%;">
|
|
<div style="width: 100%; height:300px; border: inset; overflow-x: hidden; overflow-y: scroll;">
|
|
<div id="row1" class="CTATGroupingComponent row">
|
|
<div id="text1" class="CTATTextField text"></div>
|
|
<div id="input1" class="CTATTextInput input"></div>
|
|
</div>
|
|
<div id="row2" class="CTATGroupingComponent row">
|
|
<div id="text2" class="CTATTextField text" style="visibility: hidden;"></div>
|
|
<div id="input2" class="CTATTextInput input" style="visibility: hidden;"></div>
|
|
</div>
|
|
<div id="row3" class="CTATGroupingComponent row">
|
|
<div id="text3" class="CTATTextField text" style="visibility: hidden;"></div>
|
|
<div id="input3" class="CTATTextInput input" style="visibility: hidden;"></div>
|
|
</div>
|
|
<div id="row4" class="CTATGroupingComponent row">
|
|
<div id="text4" class="CTATTextField text" style="visibility: hidden;"></div>
|
|
<div id="input4" class="CTATTextInput input" style="visibility: hidden;"></div>
|
|
</div>
|
|
<div id="row5" class="CTATGroupingComponent row">
|
|
<div id="text5" class="CTATTextField text" style="visibility: hidden;"></div>
|
|
<div id="input5" class="CTATTextInput input" style="visibility: hidden;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="display: table-row; height: 125px;">
|
|
<div style="display: table-cell; border: 0px solid black; vertical-align: middle;">
|
|
<div id="HintWindow" class="CTATHintWindow" style="width: 100%; height: 100%"></div>
|
|
</div>
|
|
<div style="display: table-cell; width: 60px;">
|
|
<div style="border: 0px solid black; margin-bottom: 2px;">
|
|
<div id="hint-button" class="CTATHintButton"></div>
|
|
</div>
|
|
<div style="border: 0px solid black;">
|
|
<div id="done" class="CTATDoneButton"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|