MDL-9378 New visualisation for SCORM - back ported to 1.8.
This commit is contained in:
piers
+113
-31
@@ -67,7 +67,6 @@
|
||||
'', '', true, update_module_button($cm->id, $course->id, $strscorm), '', false);
|
||||
notice(get_string("activityiscurrentlyhidden"));
|
||||
}
|
||||
|
||||
//
|
||||
// TOC processing
|
||||
//
|
||||
@@ -135,6 +134,14 @@
|
||||
?>
|
||||
<script type="text/javascript" src="request.js"></script>
|
||||
<script type="text/javascript" src="api.php?id=<?php echo $cm->id.$scoidstr.$modestr.$attemptstr ?>"></script>
|
||||
<script type="text/javascript" src="<?=$CFG->wwwroot?>/mod/scorm/rd.js"></script>
|
||||
<script type="text/javascript">
|
||||
<!--
|
||||
window.onresize = function() {
|
||||
scorm_resize();
|
||||
};
|
||||
-->
|
||||
</script>
|
||||
<?php
|
||||
//}
|
||||
if (($sco->previd != 0) && ((!isset($sco->previous)) || ($sco->previous == 0))) {
|
||||
@@ -154,25 +161,89 @@
|
||||
<?php
|
||||
if ($scorm->hidetoc == 0) {
|
||||
?>
|
||||
<div id="tocbox" class="generalbox">
|
||||
<div id="tochead" class="header"><?php print_string('contents','scorm') ?></div>
|
||||
<div id="toctree">
|
||||
|
||||
<div id="tocbox">
|
||||
|
||||
<?php
|
||||
|
||||
if ($scorm->hidenav ==0){
|
||||
|
||||
?>
|
||||
|
||||
<!-- Bottons nav at left-->
|
||||
|
||||
<div id="tochead">
|
||||
|
||||
<form name="tochead" method="post" action="player.php?id=<?php echo $cm->id ?>" target="_top">
|
||||
|
||||
<?php
|
||||
|
||||
$orgstr = '&currentorg='.$currentorg;
|
||||
|
||||
if (($scorm->hidenav == 0) && ($sco->previd != 0) && ($sco->previous == 0)) {
|
||||
|
||||
// Print the prev LO button
|
||||
|
||||
$scostr = '&scoid='.$sco->previd;
|
||||
|
||||
$url = $CFG->wwwroot.'/mod/scorm/player.php?id='.$cm->id.$orgstr.$modestr.$scostr;
|
||||
|
||||
?>
|
||||
|
||||
<input name="prev" type="button" value="<?php print_string('prev','scorm') ?>" onClick="document.location.href=' <?php echo $url; ?> '"/>
|
||||
|
||||
<?php
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
if (($scorm->hidenav == 0) && ($sco->nextid != 0) && ($sco->next == 0)) {
|
||||
|
||||
// Print the next LO button
|
||||
|
||||
$scostr = '&scoid='.$sco->nextid;
|
||||
|
||||
$url = $CFG->wwwroot.'/mod/scorm/player.php?id='.$cm->id.$orgstr.$modestr.$scostr;
|
||||
|
||||
?>
|
||||
|
||||
<input name="next" type="button" value="<?php print_string('next','scorm') ?>" onClick="document.location.href=' <?php echo $url; ?> '"/>
|
||||
|
||||
<?php
|
||||
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
</form>
|
||||
|
||||
</div> <!-- tochead -->
|
||||
|
||||
<?php
|
||||
|
||||
}
|
||||
?>
|
||||
<div id="toctree" class="generalbox">
|
||||
<?php echo $result->toc; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- toctree -->
|
||||
|
||||
</div> <!-- tocbox -->
|
||||
|
||||
<?php
|
||||
$class = ' class="toc"';
|
||||
} else {
|
||||
$class = ' class="no-toc"';
|
||||
}
|
||||
?>
|
||||
<div id="scormbox"<?php echo $class ?>>
|
||||
<div id="scormbox"<?php echo $class; if(($scorm->hidetoc == 2) || ($scorm->hidetoc == 1)){echo 'style="width:100%"';}?>>
|
||||
<?php
|
||||
// This very big test check if is necessary the "scormtop" div
|
||||
if (
|
||||
($mode != 'normal') || // We are not in normal mode so review or browse text will displayed
|
||||
(
|
||||
($scorm->hidenav == 0) && // Teacher want to display navigation links
|
||||
($scorm->hidetoc != 0) && // The buttons has not been displayed
|
||||
(
|
||||
(
|
||||
($sco->previd != 0) && // This is not the first learning object of the package
|
||||
@@ -190,25 +261,43 @@
|
||||
<?php echo $mode == 'browse' ? '<div id="scormmode" class="left">'.get_string('browsemode','scorm')."</div>\n" : ''; ?>
|
||||
<?php echo $mode == 'review' ? '<div id="scormmode" class="left">'.get_string('reviewmode','scorm')."</div>\n" : ''; ?>
|
||||
<?php
|
||||
if (($scorm->hidenav == 0) || ($scorm->hidetoc == 2)) {
|
||||
if (($scorm->hidenav == 0) || ($scorm->hidetoc == 2) || ($scorm->hidetoc == 1)) {
|
||||
?>
|
||||
<div id="scormnav" class="right">
|
||||
<?php
|
||||
$orgstr = '&currentorg='.$currentorg;
|
||||
if (($scorm->hidenav == 0) && ($sco->previd != 0) && ((!isset($sco->previous)) || ($sco->previous == 0))) {
|
||||
/// Print the prev LO link
|
||||
if (($scorm->hidenav == 0) && ($sco->previd != 0) && ($sco->previous == 0) && (($scorm->hidetoc == 2) || ($scorm->hidetoc == 1)) ) {
|
||||
|
||||
// Print the prev LO button
|
||||
$scostr = '&scoid='.$sco->previd;
|
||||
$url = $CFG->wwwroot.'/mod/scorm/player.php?id='.$cm->id.$orgstr.$modestr.$scostr;
|
||||
echo '<a href="'.$url.'">< '.get_string('prev','scorm').'</a>';
|
||||
?>
|
||||
|
||||
<form name="scormnavprev" method="post" action="player.php?id=<?php echo $cm->id ?>" target="_top" style= "display:inline">
|
||||
|
||||
<input name="prev" type="button" value="<?php print_string('prev','scorm') ?>" onClick="document.location.href=' <?php echo $url; ?> '"/>
|
||||
|
||||
</form>
|
||||
|
||||
<?php
|
||||
}
|
||||
if ($scorm->hidetoc == 2) {
|
||||
echo $result->tocmenu;
|
||||
}
|
||||
if (($scorm->hidenav == 0) && ($sco->nextid != 0) && ((!isset($sco->next)) || ($sco->next == 0))) {
|
||||
/// Print the next LO link
|
||||
if (($scorm->hidenav == 0) && ($sco->nextid != 0) && ($sco->next == 0) && (($scorm->hidetoc == 2) || ($scorm->hidetoc == 1))) {
|
||||
|
||||
// Print the next LO button
|
||||
$scostr = '&scoid='.$sco->nextid;
|
||||
$url = $CFG->wwwroot.'/mod/scorm/player.php?id='.$cm->id.$orgstr.$modestr.$scostr;
|
||||
echo ' <a href="'.$url.'">'.get_string('next','scorm').' ></a>';
|
||||
?>
|
||||
|
||||
<form name="scormnavnext" method="post" action="player.php?id=<?php echo $cm->id ?>" target="_top" style= "display:inline">
|
||||
|
||||
<input name="next" type="button" value="<?php print_string('next','scorm') ?>" onClick="document.location.href=' <?php echo $url; ?> '"/>
|
||||
|
||||
</form>
|
||||
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
@@ -216,7 +305,7 @@
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</div> <!-- Scormtop -->
|
||||
<?php
|
||||
} // The end of the very big test
|
||||
?>
|
||||
@@ -230,18 +319,16 @@
|
||||
<?php
|
||||
if ($result->prerequisites) {
|
||||
if ($scorm->popup == 0) {
|
||||
?>
|
||||
<iframe id="main"
|
||||
class="scoframe"
|
||||
width="<?php echo $scorm->width<=100 ? $scorm->width.'%' : $scorm->width ?>"
|
||||
height="<?php echo $scorm->height<=100 ? $scorm->height.'%' : $scorm->height ?>"
|
||||
src="loadSCO.php?id=<?php echo $cm->id.$scoidstr.$modestr ?>">
|
||||
</iframe>
|
||||
<?php
|
||||
echo " <script type=\"text/javascript\">scorm_resize();</script>\n";
|
||||
|
||||
$fullurl="loadSCO.php?id=".$cm->id.$scoidstr.$modestr;
|
||||
|
||||
echo " <iframe id=\"scoframe1\" class=\"scoframe\" name=\"scoframe1\" src=\"{$fullurl}\"></iframe>\n";
|
||||
} else {
|
||||
?>
|
||||
<script type="text/javascript">
|
||||
//<![CDATA[
|
||||
scorm_resize();
|
||||
function openpopup(url,name,options,width,height) {
|
||||
fullurl = "<?php echo $CFG->wwwroot.'/mod/scorm/' ?>" + url;
|
||||
windowobj = window.open(fullurl,name,options);
|
||||
@@ -263,15 +350,11 @@
|
||||
url = "loadSCO.php?id=<?php echo $cm->id.$scoidpop ?>";
|
||||
width = <?php p($scorm->width) ?>;
|
||||
height = <?php p($scorm->height) ?>;
|
||||
var main = openpopup(url, "scormpopup", "<?php p($scorm->options) ?>", width, height);
|
||||
var main = openpopup(url, "<?php p($scorm->name) ?>", "<?php p($scorm->options) ?>", width, height);
|
||||
//]]>
|
||||
</script>
|
||||
<noscript>
|
||||
<iframe id="main"
|
||||
class="scoframe"
|
||||
width="<?php echo $scorm->width<=100 ? $scorm->width.'%' : $scorm->width ?>"
|
||||
height="<?php echo $scorm->height<=100 ? $scorm->height.'%' : $scorm->height ?>"
|
||||
src="loadSCO.php?id=<?php echo $cm->id.$scoidstr.$modestr ?>">
|
||||
<iframe id="main" class="scoframe" src="loadSCO.php?id=<?php echo $cm->id.$scoidstr.$modestr ?>">
|
||||
</iframe>
|
||||
</noscript>
|
||||
<?php
|
||||
@@ -283,5 +366,4 @@
|
||||
</div> <!-- SCORM object -->
|
||||
</div> <!-- SCORM box -->
|
||||
</div> <!-- SCORM content -->
|
||||
<div class="clearer"> </div>
|
||||
<?php print_footer(); ?>
|
||||
<?php print_footer(); ?>
|
||||
@@ -0,0 +1,77 @@
|
||||
<!--
|
||||
function scorm_get_element_style(obj, prop, cssProp) {
|
||||
var ret = '';
|
||||
|
||||
if (obj.currentStyle) {
|
||||
ret = obj.currentStyle[prop];
|
||||
} else if (document.defaultView && document.defaultView.getComputedStyle) {
|
||||
var compStyle = document.defaultView.getComputedStyle(obj, null);
|
||||
ret = compStyle.getPropertyValue(cssProp);
|
||||
}
|
||||
|
||||
if (ret == 'auto') ret = '0';
|
||||
return ret;
|
||||
}
|
||||
|
||||
function scorm_resize () {
|
||||
var winwidth = 0, winheight = 0;
|
||||
if( typeof( window.innerWidth ) == 'number' ) {
|
||||
//Non-IE
|
||||
winwidth = window.innerWidth;
|
||||
winheight = window.innerHeight;
|
||||
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
|
||||
//IE 6+ in 'standards compliant mode'
|
||||
winwidth = document.documentElement.clientWidth;
|
||||
winheight = document.documentElement.clientHeight;
|
||||
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
|
||||
//IE 4 compatible
|
||||
winwidth = document.body.clientWidth;
|
||||
winheight = document.body.clientHeight;
|
||||
}
|
||||
|
||||
var header = document.getElementById('header');
|
||||
var content = document.getElementById('content');
|
||||
var headerheight = 0;
|
||||
if (content) {
|
||||
headerheight = content.offsetTop;
|
||||
}
|
||||
|
||||
var footer = document.getElementById('footer');
|
||||
var imsnavbar = document.getElementById('tochead');
|
||||
var scormtop = document.getElementById('scormtop');
|
||||
var footerheight = 0;
|
||||
var imsnavheight = 0;
|
||||
var scormtopheight = 0;
|
||||
if (footer) {
|
||||
footerheight = footer.offsetHeight + parseInt(scorm_get_element_style(footer, 'marginTop', 'margin-top')) + parseInt(scorm_get_element_style(footer, 'marginBottom', 'margin-bottom'));
|
||||
}
|
||||
if (imsnavbar) {
|
||||
imsnavheight = imsnavbar.offsetHeight;
|
||||
}
|
||||
if (scormtop) {
|
||||
scormtopheight = scormtop.offsetHeight;
|
||||
}
|
||||
|
||||
var topmargin = parseInt(scorm_get_element_style(document.getElementsByTagName('body')[0], 'marginTop', 'margin-top'));
|
||||
var bottommargin = parseInt(scorm_get_element_style(document.getElementsByTagName('body')[0], 'marginBottom', 'margin-bottom'));
|
||||
|
||||
var totalheight = headerheight +
|
||||
footerheight +
|
||||
scormtopheight+
|
||||
topmargin +
|
||||
bottommargin+10; // +10 to save a minor vertical scroll always present!
|
||||
|
||||
var totalheighttoc = totalheight+imsnavheight;
|
||||
var toctree = document.getElementById('toctree');
|
||||
if (toctree != null){
|
||||
var toctreeHeight = toctree.offsetHeight;
|
||||
document.getElementById('toctree').style.height = (winheight - totalheighttoc) + 'px';
|
||||
var scoframe2 = document.getElementById('scoframe1');
|
||||
document.getElementById('scormobject').style.height = (winheight - totalheight) + 'px';
|
||||
}else{
|
||||
var scoframe2 = document.getElementById('scoframe1');
|
||||
document.getElementById('scormobject').style.height = (winheight - totalheight) + 'px';
|
||||
}
|
||||
|
||||
}
|
||||
-->
|
||||
+218
-47
@@ -1,82 +1,253 @@
|
||||
.structlist {
|
||||
|
||||
list-style-type: none;
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
font-size: small;
|
||||
|
||||
}
|
||||
|
||||
.orgtitle {
|
||||
|
||||
font-weight: bold;
|
||||
|
||||
font-size: small;
|
||||
|
||||
}
|
||||
|
||||
.mod-scorm .top {
|
||||
|
||||
vertical-align: top;
|
||||
|
||||
}
|
||||
|
||||
.mod-scorm .left {
|
||||
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
|
||||
.mod-scorm .center {
|
||||
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.mod-scorm .right {
|
||||
|
||||
text-align: right;
|
||||
|
||||
}
|
||||
|
||||
.mod-scorm .scoframe {
|
||||
|
||||
position: relative;
|
||||
|
||||
width: 100%;
|
||||
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#mod-scorm-player #scormpage {
|
||||
|
||||
position: relative;
|
||||
|
||||
width: 100%;
|
||||
}
|
||||
#mod-scorm-player #tocbox {
|
||||
float: left;
|
||||
width: 17%;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
}
|
||||
#mod-scorm-player #tochead {
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
#mod-scorm-player #scormbox {
|
||||
right: 0px;
|
||||
}
|
||||
#mod-scorm-player .toc {
|
||||
float: right;
|
||||
width: 80%;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
}
|
||||
#mod-scorm-player .no-toc {
|
||||
width: 100%;
|
||||
}
|
||||
#mod-scorm-player #scormobject {
|
||||
/* border: 1px solid black; */
|
||||
}
|
||||
#mod-scorm-player #scormtop {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
#mod-scorm-player #scormmode {
|
||||
float: left;
|
||||
width: 50%;
|
||||
left: 5px;
|
||||
top: 0px;
|
||||
}
|
||||
#mod-scorm-player #scormnav {
|
||||
float: right;
|
||||
right: 5px;
|
||||
top: 0px;
|
||||
}
|
||||
#mod-scorm-player .structurelist {
|
||||
list-style-type: none;
|
||||
text-indent:-4ex;
|
||||
font-size: small;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-view .structurehead {
|
||||
font-weight: bold;
|
||||
#mod-scorm-player #tochead {
|
||||
|
||||
position: relative;
|
||||
|
||||
text-align: center;
|
||||
|
||||
top: 3px;
|
||||
|
||||
height: 30px;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-player .toc {
|
||||
|
||||
width: 80%;
|
||||
|
||||
margin-left: 20%;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-player .no-toc {
|
||||
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-player #scormobject {
|
||||
|
||||
height: 400px;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-player #scormtop {
|
||||
|
||||
position: relative;
|
||||
|
||||
width: 100%;
|
||||
|
||||
height: 30px;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-player #scormbrowse {
|
||||
|
||||
position: absolute;
|
||||
|
||||
left: 5px;
|
||||
|
||||
top: 0px;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-player #scormnav {
|
||||
|
||||
position: absolute;
|
||||
|
||||
right: 5px;
|
||||
|
||||
top: 0px;
|
||||
|
||||
text-align: center;
|
||||
|
||||
top: 3px;
|
||||
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#mod-scorm-view .structurehead {
|
||||
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#mod-scorm-view .structurelist {
|
||||
|
||||
list-style-type: none;
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#mod-scorm-player #scormbox {
|
||||
|
||||
width: 74%;
|
||||
|
||||
position: absolute;
|
||||
|
||||
right: 0px;
|
||||
|
||||
top: 0px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#mod-scorm-player #tocbox {
|
||||
|
||||
position: relative;
|
||||
|
||||
left: 0px;
|
||||
|
||||
width: 24%;
|
||||
|
||||
font-size: 0.8em;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#mod-scorm-player #tochead {
|
||||
|
||||
position: relative;
|
||||
|
||||
text-align: center;
|
||||
|
||||
top: 3px;
|
||||
|
||||
height: 30px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#toctree {
|
||||
|
||||
position:relative;
|
||||
|
||||
width:100%;
|
||||
|
||||
overflow-x: auto;
|
||||
|
||||
overflow-y: auto;
|
||||
|
||||
}
|
||||
|
||||
.structurelist {
|
||||
|
||||
list-style-type: none;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-player .structurelist {
|
||||
|
||||
position: relative;
|
||||
|
||||
list-style-type: none;
|
||||
|
||||
width: 96%;
|
||||
|
||||
margin-left:0;
|
||||
|
||||
padding-left: 0;
|
||||
|
||||
margin-right:0;
|
||||
|
||||
padding-right: 0;
|
||||
|
||||
padding-top: 0;
|
||||
|
||||
padding-bottom: 0;
|
||||
|
||||
margin-top:0;
|
||||
|
||||
margin-bottom:0;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#mod-scorm-player .structurelist ul{
|
||||
|
||||
padding-left: 0.5em;
|
||||
|
||||
margin-left: 0.5em;
|
||||
|
||||
}
|
||||
|
||||
#mod-scorm-view .structurelist {
|
||||
|
||||
list-style-type: none;
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user