MDL-9378, new visualization for scorm, see tracker, head only

diff --git a/mod/scorm/player.php b/mod/scorm/player.php
index 7ac0f3f372041bfaeac613f047603d928cd48c89..41566c118d9fb5b59cf5643d1d98c1706a3dc419 100755 (executable)
--- a/mod/scorm/player.php
+++ b/mod/scorm/player.php
@@ -4,7 +4,6 @@
 
     require_once('../../config.php');
     require_once('locallib.php');
-
     //
     // Checkin' script parameters
     //
@@ -59,7 +58,6 @@
     }
 
     $pagetitle = strip_tags("$course->shortname: ".format_string($scorm->name));
-
     if (!$cm->visible and !has_capability('moodle/course:viewhiddenactivities', get_context_instance(CONTEXT_COURSE,$course->id))) {
         $navlinks[] = array('name' => format_string($scorm->name,true), 'link' => "view.php?id=$cm->id", 'type' => 'activityinstance');
         $navigation = build_navigation($navlinks);
@@ -68,7 +66,6 @@
                  '', '', true, update_module_button($cm->id, $course->id, $strscorm), '', false);
         notice(get_string("activityiscurrentlyhidden"));
     }
-
     //
     // TOC processing
     //
@@ -138,6 +135,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))) {
@@ -157,25 +162,88 @@
 <?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 = '&amp;currentorg='.$currentorg;
+
+            if (($scorm->hidenav == 0) && ($sco->previd != 0) && ($sco->previous == 0)) {
+
+                // Print the prev LO button
+
+                $scostr = '&amp;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 = '&amp;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
@@ -193,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 = '&amp;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 = '&amp;scoid='.$sco->previd;
                 $url = $CFG->wwwroot.'/mod/scorm/player.php?id='.$cm->id.$orgstr.$modestr.$scostr;
-                echo '<a href="'.$url.'">&lt; '.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 = '&amp;scoid='.$sco->nextid;
                 $url = $CFG->wwwroot.'/mod/scorm/player.php?id='.$cm->id.$orgstr.$modestr.$scostr;
-                echo '            &nbsp;<a href="'.$url.'">'.get_string('next','scorm').' &gt;</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
             }
         ?>
 
@@ -219,7 +305,7 @@
 <?php
         } 
 ?>
-            </div>
+            </div> <!-- Scormtop -->
 <?php
     } // The end of the very big test
 ?>
@@ -233,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);
@@ -266,15 +350,10 @@
                         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            
@@ -289,5 +368,7 @@
     <?php if (!empty($THEME->customcorners)) {
         print_container_end();
     } ?>
-    <div class="clearer">&nbsp;</div>
-<?php print_footer(); ?>
+    </div> <!-- Content -->
+    </div> <!-- Page -->
+</body>
+</html>

diff --git a/mod/scorm/rd.js b/mod/scorm/rd.js
new file mode 100644 (file)
index 0000000..f54dc52
--- /dev/null
+++ b/mod/scorm/rd.js
@@ -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';
+    }
+
+}
+-->

diff --git a/mod/scorm/styles.php b/mod/scorm/styles.php
index 5dbc1582d04290f276ece3611f6ee492e87e6859..d637b3bcb31c8410774d79f1aa7875dc8cda12c2 100644 (file)
--- a/mod/scorm/styles.php
+++ b/mod/scorm/styles.php
@@ -1,82 +1,292 @@
 .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 {
+
+  position: relative;
+
   text-align: center;
-  font-weight: bold;
-}
-#mod-scorm-player #scormbox {
-  right: 0px;
+
+  top: 3px;
+
+  height: 30px;  
+  
+  
+
 }
+
 #mod-scorm-player .toc {
-  float: right;
+
   width: 80%; 
-  right: 0px;
-  top: 0px;
+
+  margin-left: 20%; 
+  
+  
+  
+
 }
+
 #mod-scorm-player .no-toc {
+
   width: 100%;
+  
+  
+
 }
+
 #mod-scorm-player #scormobject {
- /* border: 1px solid black; */
+
+  height: 400px; 
+  
+  
+  
+
 }
+
 #mod-scorm-player #scormtop {
+
+  position: relative;
+
   width: 100%;
-  height: auto;
+
+  height: 30px;
+  
+  
+
 }
-#mod-scorm-player #scormmode {
-  float: left;
-  width: 50%;
+
+#mod-scorm-player #scormbrowse {
+
+  position: absolute;
+
   left: 5px;
+
   top: 0px;
+  
+  
+  
+
 }
+
 #mod-scorm-player #scormnav {
-  float: right;
+
+  position: absolute;
+
   right: 5px;
+
   top: 0px;
+
+  text-align: center;
+
+  top: 3px;
+
+  width: 100%;
+  
+  
+  
+
 }
-#mod-scorm-player .structurelist {
+
+
+
+#mod-scorm-view .structurehead {
+
+  text-align: center;
+  
+  
+
+}
+
+
+
+#mod-scorm-view .structurelist  {
+
   list-style-type: none;
-  text-indent:-4ex;
-  font-size: small;
+
+  white-space: nowrap;
+  
+  
+
 }
 
-#mod-scorm-view .structurehead {
-  font-weight: bold;
+
+
+#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;
+
 }
+