Browse Source

Fixing UI in LP view using new Bootstrap elements.

Julio Montoya 11 years ago
parent
commit
429236de6c

+ 22 - 5
main/css/base.css

@@ -3959,11 +3959,11 @@ footer {
 /* Default LP left column values */
 
 #learning_path_left_zone {
-    float: left;
+    /*float: left;
     width: 280px;
     height: 100%;
     padding-left: 8px;
-    padding-right: 4px;
+    padding-right: 4px;*/
 }
 
 #learning_path_left_zone #header {
@@ -4004,15 +4004,12 @@ footer {
 
 #learning_path_toc {
     font-size: 9pt;
-    margin: 0;
 }
 
 #scorm_title {
-    background: none repeat scroll 0 0 #EEEEEE;
     color: #444444;
     font-size: 16px;
     font-weight: bold;
-    padding: 1px 5px 3px 8px;
 }
 
 .progresstext {
@@ -4039,6 +4036,26 @@ footer {
     margin-right: 10px;
 }
 
+
+.list-group-item > .badge_lp {
+    float: right;
+}
+
+.badge_lp {
+    /* background-color: #999999; */
+    border-radius: 10px;
+    color: #FFFFFF;
+    display: inline-block;
+    font-size: 12px;
+    font-weight: bold;
+    line-height: 1;
+    min-width: 10px;
+    padding: 3px 7px;
+    text-align: center;
+    vertical-align: baseline;
+    white-space: nowrap;
+}
+
 .inner_lp_toc .scorm_item_highlight {
     border: 1px solid #999;
     background: #999;

+ 7 - 0
main/inc/lib/template.lib.php

@@ -331,12 +331,19 @@ class Template
         $_p = array(
             'web' => api_get_path(WEB_PATH),
             'web_course' => api_get_path(WEB_COURSE_PATH),
+            'web_course_path' => api_get_path(WEB_COURSE_PATH),
+            'web_code_path' => api_get_path(WEB_CODE_PATH),
             'web_main' => api_get_path(WEB_CODE_PATH),
             'web_css' => api_get_path(WEB_CSS_PATH),
+            'web_css_path' => api_get_path(WEB_CSS_PATH),
             'web_ajax' => api_get_path(WEB_AJAX_PATH),
+            'web_ajax_path' => api_get_path(WEB_AJAX_PATH),
             'web_img' => api_get_path(WEB_IMG_PATH),
+            'web_img_path' => api_get_path(WEB_IMG_PATH),
             'web_plugin' => api_get_path(WEB_PLUGIN_PATH),
+            'web_plugin_path' => api_get_path(WEB_PLUGIN_PATH),
             'web_lib' => api_get_path(WEB_LIBRARY_PATH),
+            'web_library_path' => api_get_path(WEB_LIBRARY_PATH),
             'public_web' => api_get_path(WEB_PUBLIC_PATH)
         );
 

+ 47 - 39
main/newscorm/learnpath.class.php

@@ -2273,10 +2273,11 @@ class learnpath
         $tbl_lp_item_view = Database :: get_course_table(TABLE_LP_ITEM_VIEW);
 
         // Getting all the information about the item.
-        $sql = "SELECT * FROM ".$tbl_lp_item." as lp INNER  JOIN ".$tbl_lp_item_view." as lp_view on lp.id = lp_view.lp_item_id ".
-            "WHERE  lp.id = '".$_SESSION['oLP']->current."' AND
-                        lp.c_id = $course_id AND
-                        lp_view.c_id = $course_id";
+        $sql = "SELECT * FROM ".$tbl_lp_item." as lp
+                INNER  JOIN ".$tbl_lp_item_view." as lp_view on lp.id = lp_view.lp_item_id
+                WHERE  lp.id = '".$_SESSION['oLP']->current."' AND
+                       lp.c_id = $course_id AND
+                       lp_view.c_id = $course_id";
         $result = Database::query($sql);
         $row = Database::fetch_assoc($result);
         $output = '';
@@ -2303,17 +2304,17 @@ class learnpath
             }
 
             // The mp3 player.
-            $output = '<div id="container">';
-            $output .= '<script type="text/javascript" src="../inc/lib/mediaplayer/swfobject.js"></script>';
+            $url = api_get_path(WEB_LIBRARY_PATH).'mediaplayer/';
+            $fileUrl = api_get_path(WEB_COURSE_PATH).$_course['path'].'/document/audio/'.$row['audio'].'&autostart='.$autostart_audio;
+            $output = '<div id="container-player">';
+            $output .= '<script type="text/javascript" src="'.$url.'swfobject.js"></script>';
             $output .= '<script type="text/javascript">
-                            var s1 = new SWFObject("../inc/lib/mediaplayer/player.swf","ply","250","20","9","#FFFFFF");
+                            var s1 = new SWFObject("'.$url.'player.swf","ply","250","20","9","#FFFFFF");
                             s1.addParam("allowscriptaccess","always");
-                                s1.addParam("flashvars","file='.api_get_path(
-                WEB_COURSE_PATH
-            ).$_course['path'].'/document/audio/'.$row['audio'].'&autostart='.$autostart_audio.'");
-                            s1.write("container");
-						</script>
-                        </div>';
+                            s1.addParam("flashvars","file='.$fileUrl.'");
+                            s1.write("container-player");
+						</script></div>';
+            echo $output;
         }
 
         return $output;
@@ -3108,7 +3109,8 @@ class learnpath
 
     /**
      * Uses the table generated by get_toc() and returns an HTML-formatted string ready to display
-     * @return    string    HTML TOC ready to display
+     * @param array
+     * @return  string HTML TOC ready to display
      */
     public function get_html_toc($toc_list = null)
     {
@@ -3121,7 +3123,7 @@ class learnpath
         if (empty($toc_list)) {
             $toc_list = $this->get_toc();
         }
-        $html = '<div id="scorm_title" class="scorm_title">'.Security::remove_XSS($this->get_name()).'</div>';
+        $html = '';
 
         $hide_teacher_icons_lp = isset($_configuration['hide_teacher_icons_lp']) ? $_configuration['hide_teacher_icons_lp'] : true;
 
@@ -3144,7 +3146,6 @@ class learnpath
                 $html .= '</div>';
             }
         }
-        $html .= '<div id="inner_lp_toc" class="inner_lp_toc">';
         require_once 'resourcelinker.inc.php';
 
         // Temporary variables.
@@ -3164,13 +3165,9 @@ class learnpath
                 'browsed' => 'completed.png',
             );
 
-            $style = 'scorm_item';
-            $scorm_color_background = 'scorm_item';
             $style_item = 'scorm_item';
-            $current = false;
 
             if ($item['id'] == $this->current) {
-                $style = 'scorm_item_highlight';
                 $scorm_color_background = 'scorm_item_highlight';
             } else {
                 if ($color_counter % 2 == 0) {
@@ -3183,6 +3180,24 @@ class learnpath
                 }
             }
 
+            $html .= '<li class="list-group-item">';
+
+            $imageStatus = null;
+
+            if ($item['type'] == 'quiz') {
+                if ($item['status'] == 'completed') {
+                    $imageStatus = "&nbsp;".Display::return_icon($icon_name[$item['status']], substr($item['status'], 0, 1), array('id' => "toc_img_".$item['id'], 'width' => '14'));
+                } else {
+                    $imageStatus = "&nbsp;".Display::return_icon($icon_name['not attempted'], substr('not attempted', 0, 1), array('id' => "toc_img_".$item['id'], 'width' => '14'));
+                }
+            } else {
+                if ($item['type'] != 'dokeos_chapter' && $item['type'] != 'dokeos_module' && $item['type'] != 'dir') {
+                    $imageStatus = "&nbsp;".Display::return_icon($icon_name[$item['status']], substr($item['status'], 0, 1), array('id' => "toc_img_".$item['id'], 'width' => '14'));
+                }
+            }
+
+            $html .= '<span class="badge_lp">'.$imageStatus."</span>";
+
             if ($scorm_color_background != '') {
                 $html .= '<div id="toc_'.$item['id'].'" class="'.$scorm_color_background.'">';
             }
@@ -3190,38 +3205,27 @@ class learnpath
             // The anchor will let us center the TOC on the currently viewed item &^D
             if ($item['type'] != 'dokeos_module' && $item['type'] != 'dokeos_chapter') {
                 $html .= '<div class="'.$style_item.'" style="padding-left: '.($item['level'] * 1.5).'em; padding-right:'.($item['level'] / 2).'em"  title="'.$item['description'].'" >';
-                $html .= '<a name="atoc_'.$item['id'].'" />';
+                $html .= '<a name="atoc_'.$item['id'].'"></a>';
             } else {
                 $html .= '<div class="'.$style_item.'" style="padding-left: '.($item['level'] * 2).'em; padding-right:'.($item['level'] * 1.5).'em"  title="'.$item['description'].'" >';
             }
+
             $title = $item['title'];
-            if (empty ($title)) {
+
+            if (empty($title)) {
                 $title = rl_get_resource_name(api_get_course_id(), $this->get_id(), $item['id']);
             }
 
             $title = Security::remove_XSS($title);
             if ($item['type'] != 'dokeos_chapter' && $item['type'] != 'dir' && $item['type'] != 'dokeos_module') {
                 $url = $this->get_link('http', $item['id'], $toc_list);
-                $html .= '<a href="" onClick="switch_item('.$mycurrentitemid.','.$item['id'].');'.'return false;" >'.stripslashes(
-                    $title
-                ).'</a>';
+                $html .= '<a href="" onclick="switch_item('.$mycurrentitemid.','.$item['id'].');'.'return false;" >'.stripslashes($title).'</a>';
             } elseif ($item['type'] == 'dokeos_module' || $item['type'] == 'dokeos_chapter') {
-                $html .= Display::return_icon('lp_dokeos_module.png', $title);
+                $html .= Display::return_icon('lp_dokeos_module.png', $title).'&nbsp;'.$title;
             } elseif ($item['type'] == 'dir') {
                 $html .= stripslashes($title);
             }
 
-            if ($item['type'] == 'quiz') {
-                if ($item['status'] == 'completed') {
-                    $html .= "&nbsp;".Display::return_icon($icon_name[$item['status']], substr($item['status'], 0, 1), array('id' => "toc_img_".$item['id'], 'width' => '14'));
-                } else {
-                    $html .= "&nbsp;".Display::return_icon($icon_name['not attempted'], substr('not attempted', 0, 1), array('id' => "toc_img_".$item['id'], 'width' => '14'));
-                }
-            } else {
-                if ($item['type'] != 'dokeos_chapter' && $item['type'] != 'dokeos_module' && $item['type'] != 'dir') {
-                    $html .= "&nbsp;".Display::return_icon($icon_name[$item['status']], substr($item['status'], 0, 1), array('id' => "toc_img_".$item['id'], 'width' => '14'));
-                }
-            }
 
             $html .= "</div>";
 
@@ -3229,10 +3233,10 @@ class learnpath
                 $html .= '</div>';
             }
 
+            $html .= '</li>';
+
             $color_counter++;
         }
-        $html .= "</div>";
-
         return $html;
     }
 
@@ -10653,6 +10657,10 @@ EOD;
         }
         return $cats;
     }
+
+    public function setError($error) {
+        $this->error = $error;
+    }
 }
 
 if (!function_exists('trim_value')) {

+ 5 - 4
main/newscorm/lp_ajax_last_update_status.php

@@ -129,7 +129,8 @@ function last_update_status($lp_id, $user_id, $view_id, $item_id) {
 }
 error_log(__LINE__);
 echo last_update_status(
-            $_REQUEST['lid'],
-            $_REQUEST['uid'],
-            $_REQUEST['vid'],
-            $_REQUEST['iid']);
+    $_REQUEST['lid'],
+    $_REQUEST['uid'],
+    $_REQUEST['vid'],
+    $_REQUEST['iid']
+);

+ 7 - 1
main/newscorm/lp_nav.php

@@ -18,12 +18,18 @@ $language_file[] = 'scorm';
 $language_file[] = 'learnpath';
 
 require_once '../inc/global.inc.php';
+
+$app['template.show_footer'] = false;
+$app['template.show_header'] = false;
+$app['default_layout'] = 'default/layout/blank.tpl';
+
 require_once 'learnpath.class.php';
 require_once 'scorm.class.php';
 require_once 'aicc.class.php';
 
+
 $htmlHeadXtra[] = '<script>
-      var chamilo_xajax_handler = window.parent.oxajax;
+  var chamilo_xajax_handler = window.parent.oxajax;
 </script>';
 
 $progress_bar = '';

+ 94 - 288
main/newscorm/lp_view.php

@@ -61,14 +61,12 @@ if (empty($_SESSION['oLP'])) {
 }
 
 $debug = 0;
+/** @var learnpath $learnPath */
+$learnPath = $_SESSION['oLP'];
 
-if ($debug) {
-    error_log('------ Entering lp_view.php -------');
-}
-
-$_SESSION['oLP']->error = '';
-$lp_item_id = $_SESSION['oLP']->get_current_item_id();
-$lp_type = $_SESSION['oLP']->get_type();
+$learnPath->setError(null);
+$lp_item_id = $learnPath->get_current_item_id();
+$lp_type = $learnPath->get_type();
 
 $course_code = api_get_course_id();
 $course_id = api_get_course_int_id();
@@ -76,35 +74,26 @@ $user_id = api_get_user_id();
 $platform_theme = api_get_setting('stylesheets');
 $my_style = $platform_theme;
 
-//$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'javascript/lp_minipanel/jquery.lp_minipanel.js" type="text/javascript"></script>';
-$htmlHeadXtra[] = $app['template']->fetch('default/javascript/newscorm/minipanel.tpl');
-$htmlHeadXtra[] = '<script>
-$(document).ready(function(){
-	$("div#log_content_cleaner").bind("click", function() {
-    	$("div#log_content").empty();
-	});
-});
-var chamilo_xajax_handler = window.oxajax;
-</script>';
-
+//$htmlHeadXtra[] = $app['template']->fetch('default/javascript/newscorm/minipanel.tpl');
+/*
 if ($_SESSION['oLP']->mode == 'embedframe' || $_SESSION['oLP']->get_hide_toc_frame() == 1) {
     $htmlHeadXtra[] = '<script>
         $(document).ready(function(){
             toogle_minipanel();
         });
         </script>';
-}
+}*/
 
-//Impress js
-if ($_SESSION['oLP']->mode == 'impress') {
-    $lp_id = $_SESSION['oLP']->get_id();
-    $url = api_get_path(WEB_CODE_PATH)."newscorm/lp_impress.php?lp_id=$lp_id&".api_get_cidreq();
+// Impress js
+$lpId = $learnPath->get_id();
+if ($learnPath->mode == 'impress') {
+    $url = api_get_path(WEB_CODE_PATH)."newscorm/lp_impress.php?lp_id=$lpId&".api_get_cidreq();
     header("Location: $url");
     exit;
 }
 
 // Prepare variables for the test tool (just in case) - honestly, this should disappear later on.
-$_SESSION['scorm_view_id'] = $_SESSION['oLP']->get_view_id();
+$_SESSION['scorm_view_id'] = $learnPath->get_view_id();
 $_SESSION['scorm_item_id'] = $lp_item_id;
 
 // Reinit exercises variables to avoid spacename clashes (see exercise tool)
@@ -114,26 +103,13 @@ if (isset($exerciseResult) || isset($_SESSION['exerciseResult'])) {
 unset($_SESSION['objExercise']);
 unset($_SESSION['questionList']);
 
-// additional APIs
-$htmlHeadXtra[] = '<script>
-chamilo_courseCode = "'.$course_code.'";
-</script>';
-// Document API
-$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_CODE_PATH).'newscorm/js/documentapi.js" type="text/javascript"></script>';
-// Storage API
-$htmlHeadXtra[] = '<script>
-var sv_user = \''.api_get_user_id().'\';
-var sv_course = chamilo_courseCode;
-var sv_sco = \''.intval($_REQUEST['lp_id']).'\';
-</script>'; // FIXME fetch sco and userid from a more reliable source directly in sotrageapi.js
-$htmlHeadXtra[] = '<script type="text/javascript" src="'.api_get_path(WEB_CODE_PATH).'newscorm/js/storageapi.js"></script>';
-
-if ($debug) {
-    error_log(" src: $src ");
-    error_log(" lp_type: $lp_type ");
-}
+/** @var Template $template */
+
+$template = $app['template'];
+$template->assign('course_code', $course_code);
 
-$get_toc_list = $_SESSION['oLP']->get_toc();
+$template->assign('lp_id', $lpId);
+$get_toc_list = $learnPath->get_toc();
 $type_quiz = false;
 
 foreach ($get_toc_list as $toc) {
@@ -146,44 +122,43 @@ if (!isset($src)) {
     $src = null;
     switch ($lp_type) {
         case 1:
-            $_SESSION['oLP']->stop_previous_item();
+            $learnPath->stop_previous_item();
             $htmlHeadXtra[] = '<script src="'.api_get_path(WEB_CODE_PATH).'newscorm/scorm_api.php" type="text/javascript"></script>';
-            $prereq_check = $_SESSION['oLP']->prerequisites_match($lp_item_id);
+            $prereq_check = $learnPath->prerequisites_match($lp_item_id);
             if ($prereq_check === true) {
-                $src = $_SESSION['oLP']->get_link('http', $lp_item_id, $get_toc_list);
+                $src = $learnPath->get_link('http', $lp_item_id, $get_toc_list);
 
-                //Prevents FF 3.6 + Adobe Reader 9 bug see BT#794 when calling a pdf file in a LP.
+                // Prevents FF 3.6 + Adobe Reader 9 bug see BT#794 when calling a pdf file in a LP.
                 $file_info = parse_url($src);
                 $file_info = pathinfo($file_info['path']);
                 if (isset($file_info['extension']) && api_strtolower(substr($file_info['extension'], 0, 3) == 'pdf')) {
                     $src = api_get_path(WEB_CODE_PATH).'newscorm/lp_view_item.php?lp_item_id='.$lp_item_id;
                 }
-                $_SESSION['oLP']->start_current_item(); // starts time counter manually if asset
+                $learnPath->start_current_item(); // starts time counter manually if asset
             } else {
                 $src = 'blank.php?error=prerequisites';
             }
             break;
         case 2:
             // save old if asset
-            $_SESSION['oLP']->stop_previous_item(); // save status manually if asset
+            $learnPath->stop_previous_item(); // save status manually if asset
             $htmlHeadXtra[] = '<script src="'.api_get_path(WEB_CODE_PATH).'newscorm/scorm_api.php" type="text/javascript" language="javascript"></script>';
-            $prereq_check = $_SESSION['oLP']->prerequisites_match($lp_item_id);
+            $prereq_check = $learnPath->prerequisites_match($lp_item_id);
             if ($prereq_check === true) {
-                $src = $_SESSION['oLP']->get_link('http', $lp_item_id, $get_toc_list);
-                $_SESSION['oLP']->start_current_item(); // starts time counter manually if asset
+                $src = $learnPath->get_link('http', $lp_item_id, $get_toc_list);
+                $learnPath->start_current_item(); // starts time counter manually if asset
             } else {
                 $src = 'blank.php?error=prerequisites';
             }
             break;
         case 3:
             // aicc
-            $_SESSION['oLP']->stop_previous_item(); // save status manually if asset
-            $htmlHeadXtra[] = '<script src="'.$_SESSION['oLP']->get_js_lib(
-            ).'" type="text/javascript" language="javascript"></script>';
-            $prereq_check = $_SESSION['oLP']->prerequisites_match($lp_item_id);
+            $learnPath->stop_previous_item(); // save status manually if asset
+            $htmlHeadXtra[] = '<script src="'.$learnPath->get_js_lib().'" type="text/javascript" language="javascript"></script>';
+            $prereq_check = $learnPath->prerequisites_match($lp_item_id);
             if ($prereq_check === true) {
-                $src = $_SESSION['oLP']->get_link('http', $lp_item_id, $get_toc_list);
-                $_SESSION['oLP']->start_current_item(); // starts time counter manually if asset
+                $src = $learnPath->get_link('http', $lp_item_id, $get_toc_list);
+                $learnPath->start_current_item(); // starts time counter manually if asset
             } else {
                 $src = 'blank.php';
             }
@@ -194,23 +169,15 @@ if (!isset($src)) {
 }
 
 $autostart = 'true';
-// Update status, total_time from lp_item_view table when you finish the exercises in learning path.
-
-if ($debug) {
-    error_log('$type_quiz: '.$type_quiz);
-    error_log('$_REQUEST[exeId]: '.intval($_REQUEST['exeId']));
-    error_log('$lp_id: '.$lp_id);
-    error_log('$_GET[lp_item_id]: '.intval($_GET['lp_item_id']));
-}
 
-if (!$_SESSION['oLP']->check_attempts()) {
+if (!$learnPath->check_attempts()) {
     api_not_allowed(true);
 }
 
 if ($type_quiz && !empty($_REQUEST['exeId']) && isset($lp_id) && isset($_GET['lp_item_id'])) {
     global $src;
 
-    $_SESSION['oLP']->items[$_SESSION['oLP']->current]->write_to_db();
+    $learnPath->items[$learnPath->current]->write_to_db();
 
     $TBL_TRACK_EXERCICES = Database::get_main_table(TABLE_STATISTIC_TRACK_E_EXERCICES);
     $TBL_LP_ITEM_VIEW = Database::get_course_table(TABLE_LP_ITEM_VIEW);
@@ -241,7 +208,7 @@ if ($type_quiz && !empty($_REQUEST['exeId']) && isset($lp_id) && isset($_GET['lp
         }
         Database::query($sql_upd_max_score);
 
-        $sql_last_attempt = "SELECT id FROM $TBL_LP_ITEM_VIEW  WHERE c_id = $course_id AND lp_item_id = '$safe_item_id' AND lp_view_id = '".$_SESSION['oLP']->lp_view_id."' order by id desc limit 1";
+        $sql_last_attempt = "SELECT id FROM $TBL_LP_ITEM_VIEW  WHERE c_id = $course_id AND lp_item_id = '$safe_item_id' AND lp_view_id = '".$learnPath->lp_view_id."' order by id desc limit 1";
         $res_last_attempt = Database::query($sql_last_attempt);
         if ($debug) {
             error_log($sql_last_attempt);
@@ -274,23 +241,15 @@ if ($type_quiz && !empty($_REQUEST['exeId']) && isset($lp_id) && isset($_GET['lp
     $autostart = 'false';
 }
 
-$_SESSION['oLP']->set_previous_item($lp_item_id);
-$nameTools = Security :: remove_XSS($_SESSION['oLP']->get_name());
+$learnPath->set_previous_item($lp_item_id);
+$lpName = Security::remove_XSS($learnPath->get_name());
 
 $save_setting = api_get_setting('show_navigation_menu');
 global $_setting;
 $_setting['show_navigation_menu'] = 'false';
 $scorm_css_header = true;
-$lp_theme_css = $_SESSION['oLP']->get_theme(
-); // Sets the css theme of the LP this call is also use at the frames (toc, nav, message).
-
-if ($_SESSION['oLP']->mode == 'fullscreen') {
-    $htmlHeadXtra[] = "<script>window.open('$src','content_id','toolbar=0,location=0,status=0,scrollbars=1,resizable=1');</script>";
-}
-
-// Not in fullscreen mode.
-
-Display::display_reduced_header($nameTools);
+// Sets the css theme of the LP this call is also use at the frames (toc, nav, message).
+$lp_theme_css = $learnPath->get_theme();
 
 // Check if audio recorder needs to be in studentview.
 if (isset($_SESSION['status']) && $_SESSION['status'][$course_code] == 5) {
@@ -305,11 +264,11 @@ $_SESSION['loaded_lp_view'] = true;
 $display_none = '';
 $margin_left = '305px';
 
-//Media player code
+// Media player code
 
-$display_mode = $_SESSION['oLP']->mode;
+$display_mode = $learnPath->mode;
 $scorm_css_header = true;
-$lp_theme_css = $_SESSION['oLP']->get_theme();
+$lp_theme_css = $learnPath->get_theme();
 
 // Setting up the CSS theme if exists.
 if (!empty ($lp_theme_css) && !empty ($mycourselptheme) && $mycourselptheme != -1 && $mycourselptheme == 1) {
@@ -318,14 +277,14 @@ if (!empty ($lp_theme_css) && !empty ($mycourselptheme) && $mycourselptheme != -
     $lp_theme_css = $my_style;
 }
 
-$progress_bar = $_SESSION['oLP']->get_progress_bar('', -1, '', true);
-$navigation_bar = $_SESSION['oLP']->get_navigation_bar();
-$mediaplayer = $_SESSION['oLP']->get_mediaplayer($autostart);
+$progress_bar = $learnPath->get_progress_bar('', -1, '', true);
+$navigation_bar = $learnPath->get_navigation_bar();
+$mediaplayer = $learnPath->get_mediaplayer($autostart);
 
 $tbl_lp_item = Database::get_course_table(TABLE_LP_ITEM);
 $show_audioplayer = false;
 // Getting all the information about the item.
-$sql = "SELECT audio FROM ".$tbl_lp_item." WHERE c_id = $course_id AND lp_id = '".$_SESSION['oLP']->lp_id."'";
+$sql = "SELECT audio FROM ".$tbl_lp_item." WHERE c_id = $course_id AND lp_id = '".$learnPath->lp_id."'";
 $res_media = Database::query($sql);
 
 if (Database::num_rows($res_media) > 0) {
@@ -337,212 +296,59 @@ if (Database::num_rows($res_media) > 0) {
     }
 }
 
-echo '<div id="learning_path_main">';
-$is_allowed_to_edit = api_is_allowed_to_edit(null, true, false, false);
+$template->assign('api_is_allowed_to_edit', api_is_allowed_to_edit(null, true, false, false));
 if ($is_allowed_to_edit) {
-    echo '<div class="row">';
-        echo '<div id="learning_path_breadcrumb_zone" class="col-md-12">';
-        global $interbreadcrumb;
-        $interbreadcrumb[] = array(
-            'url' => 'lp_controller.php?action=list&isStudentView=false',
-            'name' => get_lang('LearningPaths')
-        );
-        $interbreadcrumb[] = array(
-            'url' => api_get_self()."?action=add_item&type=step&lp_id=".$_SESSION['oLP']->lp_id."&isStudentView=false",
-            'name' => $_SESSION['oLP']->get_name()
-        );
-        $interbreadcrumb[] = array('url' => '#', 'name' => get_lang('Preview'));
-        echo $app['template']->returnBreadcrumb($interbreadcrumb, null, null);
-        echo '</div>';
-    echo '</div>';
+    global $interbreadcrumb;
+    $interbreadcrumb[] = array(
+        'url' => 'lp_controller.php?action=list&isStudentView=false',
+        'name' => get_lang('LearningPaths')
+    );
+    $interbreadcrumb[] = array(
+        'url' => api_get_self()."?action=add_item&type=step&lp_id=".$learnPath->lp_id."&isStudentView=false",
+        'name' => $learnPath->get_name()
+    );
+    $interbreadcrumb[] = array('url' => '#', 'name' => get_lang('Preview'));
+    $template->assign('breadcrumb', $app['template']->returnBreadcrumb($interbreadcrumb, null, null));
 }
-echo '<div class="row">';
-
-echo '<div id="learning_path_left_zone" class="col-md-2" style="'.$display_none.'"> ';
-echo '<div id="header">
-            <table>
-                <tr>
-                    <td>';
-echo '<a href="lp_controller.php?action=return_to_course_homepage&'.api_get_cidreq().'" target="_self" onclick="javascript: window.parent.API.save_asset();">
-        '.Display::return_icon('lp_arrow.gif').'
-      </a>
-                    </td>
-                    <td>';
-if ($is_allowed_to_edit) {
-    echo '<a class="link no-border" href="lp_controller.php?isStudentView=false&action=return_to_course_homepage&'.api_get_cidreq(
-    ).'" target="_self" onclick="javascript: window.parent.API.save_asset();">';
+
+if ($learnPath->get_preview_image() != '') {
+    $picture = getimagesize(api_get_path(SYS_COURSE_PATH).api_get_course_path().'/upload/learning_path/images/'.$learnPath->get_preview_image());
+    $style = null;
+    if ($picture['1'] < 96) {
+        $style = ' style="padding-top:'.((94 - $picture['1']) / 2).'px;" ';
+    }
+    $size = ($picture['0'] > 104 && $picture['1'] > 96) ? ' width="104" height="96" ' : $style;
+    $my_path = $learnPath->get_preview_image_path();
+    $picture = $my_path;
 } else {
-    echo '<a class="link no-border" href="lp_controller.php?action=return_to_course_homepage&'.api_get_cidreq(
-    ).'" target="_self" onclick="javascript: window.parent.API.save_asset();">';
+    $picture = Display::return_icon('unknown_250_100.jpg', null, array(), ICON_SIZE_SMALL, false, true);
 }
-echo get_lang('CourseHomepageLink').'
-                        </a>
-                    </td>
-                </tr>
-            </table>
-        </div>';
-?>
-<!-- end header -->
-
-<!-- Author image preview -->
-<div id="author_image">
-    <div id="author_icon">
-        <?php
-        if ($_SESSION['oLP']->get_preview_image() != '') {
-            $picture = getimagesize(
-                api_get_path(SYS_COURSE_PATH).api_get_course_path(
-                ).'/upload/learning_path/images/'.$_SESSION['oLP']->get_preview_image()
-            );
-            $style = null;
-            if ($picture['1'] < 96) {
-                $style = ' style="padding-top:'.((94 - $picture['1']) / 2).'px;" ';
-            }
-            $size = ($picture['0'] > 104 && $picture['1'] > 96) ? ' width="104" height="96" ' : $style;
-            $my_path = $_SESSION['oLP']->get_preview_image_path();
-            echo '<img src="'.$my_path.'">';
-        } else {
-            echo Display :: display_icon('unknown_250_100.jpg');
-        }
-        ?>
-    </div>
-    <div id="lp_navigation_elem">
-        <?php echo $navigation_bar; ?>
-        <div id="progress_bar">
-            <?php echo $progress_bar; ?>
-        </div>
-    </div>
-</div>
-<!-- end image preview Layout -->
-
-<div id="author_name">
-    <?php echo $_SESSION['oLP']->get_author(); ?>
-</div>
-
-<!-- media player layout -->
-<?php
-if ($show_audioplayer) {
-    echo '<div id="lp_media_file">';
-    echo $mediaplayer;
-    echo '</div>';
-}
-?>
-<!-- end media player layout -->
-
-<!-- TOC layout -->
-<div id="toc_id" name="toc_name" style="overflow: auto; padding:0;margin-top:0px;width:100%;float:left">
-    <div id="learning_path_toc">
-        <?php echo $_SESSION['oLP']->get_html_toc($get_toc_list); ?>
-    </div>
-</div>
-<!-- end TOC layout -->
-</div>
-<!-- end left zone -->
-
-<!-- right zone -->
-<div id="learning_path_right_zone" class="col-md-9" style="margin-left:<?php echo $margin_left;?>;height:100%">
-    <?php
-    // hub 26-05-2010 Fullscreen or not fullscreen
-    $height = '100%';
-    if ($_SESSION['oLP']->mode == 'fullscreen') {
-        echo '<iframe id="content_id_blank" name="content_name_blank" src="blank.php" border="0" frameborder="0" style="width:100%;height:'.$height.'" allowFullScreen></iframe>';
-    } else {
-        echo '<iframe id="content_id" name="content_name" src="'.$src.'" border="0" frameborder="0" style="display: block; width:100%;height:'.$height.'" allowFullScreen></iframe>';
-    }
-    ?>
-</div>
-<!-- end right Zone -->
-</div>
-</div>
-
-
-<script>
-    // Resize right and left pane to full height (HUB 20-05-2010).
-    function updateContentHeight() {
-        document.body.style.overflow = 'hidden';
-        var IE = window.navigator.appName.match(/microsoft/i);
-        var hauteurHeader = document.getElementById('header').offsetHeight;
-        var hauteurAuthorImg = document.getElementById('author_image').offsetHeight;
-        var hauteurAuthorName = document.getElementById('author_name').offsetHeight;
-
-        var hauteurMedia = 0;
-        if ($("#lp_media_file").length != 0) {
-            hauteurMedia = document.getElementById('lp_media_file').offsetHeight;
-        }
 
-        var hauteurTitre = document.getElementById('scorm_title').offsetHeight;
-        var hauteurAction = 0;
-        if (document.getElementById('actions_lp')) hauteurAction = document.getElementById('actions_lp').offsetHeight;
-        var hauteurHaut = hauteurHeader + hauteurAuthorImg + hauteurAuthorName + hauteurMedia + hauteurTitre + hauteurAction;
-        var innerHauteur = (IE) ? document.body.clientHeight : window.innerHeight;
-        var debugsize = 0;
-        // -40 is a static adjustement for margin, spaces on the page
-    <?php if (!empty($_SESSION['oLP']->scorm_debug)) {
-        echo 'debugsize = 150;';
-    } ?>
-        document.getElementById('inner_lp_toc').style.height = innerHauteur - hauteurHaut - 40 - debugsize + "px";
-        if (document.getElementById('content_id')) {
-            document.getElementById('content_id').style.height = innerHauteur + 'px';
-        }
+$app['template']->assign('course_url', api_get_cidreq());
+$app['template']->assign('picture', $picture);
+$app['template']->assign('navigation_bar', $navigation_bar);
+$app['template']->assign('progress_bar', $progress_bar);
+$app['template']->assign('author', $learnPath->get_author());
+$app['template']->assign('mediaplayer', $mediaplayer);
+$app['template']->assign('table_of_contents', $learnPath->get_html_toc($get_toc_list));
+$app['template']->assign('lp_name', $lpName);
+
+// hub 26-05-2010 Fullscreen or not fullscreen
+$height = '100%';
+if ($learnPath->mode == 'fullscreen') {
+    $iframe = '<iframe id="content_id_blank" name="content_name_blank" src="blank.php" border="0" frameborder="0" style="width:100%;height:'.$height.'" allowFullScreen></iframe>';
+} else {
+    $iframe = '<iframe id="content_id" name="content_name" src="'.$src.'" border="0" frameborder="0" style="display: block; width:100%; height:'.$height.'" allowFullScreen></iframe>';
+}
+$app['template']->assign('iframe', $iframe);
+$app['template']->assign('show_glossary', api_get_setting('show_glossary_in_extra_tools'));
+$app['template']->assign('glossary_type', api_get_setting('show_glossary_in_documents'));
 
-        // Loads the glossary library.
-    <?php
-    if (api_get_setting('show_glossary_in_extra_tools') == 'true') {
-        if (api_get_setting('show_glossary_in_documents') == 'ismanual') {
-            ?>
-            $.frameReady(function () {
-                        //  $("<div>I am a div courses</div>").prependTo("body");
-                    }, "top.content_name",
-                    { load:[
-                        {type:"script", id:"_fr1", src:"<?php echo api_get_path(
-                            WEB_LIBRARY_PATH
-                        ); ?>javascript/jquery.js"},
-                        {type:"script", id:"_fr4", src:"<?php echo api_get_path(
-                            WEB_LIBRARY_PATH
-                        ); ?>javascript/jquery-ui/js/jquery-ui.custom.js"},
-                        {type:"stylesheet", id:"_fr5", src:"<?php echo api_get_path(
-                            WEB_LIBRARY_PATH
-                        ); ?>javascript/jquery-ui/css/smoothness/jquery-ui.custom.min.css"},
-                        {type:"script", id:"_fr2", src:"<?php echo api_get_path(
-                            WEB_LIBRARY_PATH
-                        ); ?>javascript/jquery.highlight.js"}
-
-                    ] }
-            );
-            <?php
-        } elseif (api_get_setting('show_glossary_in_documents') == 'isautomatic') {
-            ?>
-            $.frameReady(function () {
-                        //  $("<div>I am a div courses</div>").prependTo("body");
-                    }, "top.content_name",
-                    { load:[
-                        {type:"script", id:"_fr1", src:"<?php echo api_get_path(
-                            WEB_LIBRARY_PATH
-                        ); ?>javascript/jquery.js"},
-                        {type:"script", id:"_fr4", src:"<?php echo api_get_path(
-                            WEB_LIBRARY_PATH
-                        ); ?>javascript/jquery-ui/js/jquery-ui.custom.js"},
-                        {type:"stylesheet", id:"_fr5", src:"<?php echo api_get_path(
-                            WEB_LIBRARY_PATH
-                        ); ?>javascript/jquery-ui/css/smoothness/jquery-ui-custom.css"},
-                        {type:"script", id:"_fr2", src:"<?php echo api_get_path(
-                            WEB_LIBRARY_PATH
-                        ); ?>javascript/jquery.highlight.js"}
-
-                    ] }
-            );
-            <?php
-        }
-    }
-    ?>
-    }
-    window.onload = updateContentHeight;
-    window.onresize = updateContentHeight;
-</script>
-<?php
 // Restore a global setting.
 $_setting['show_navigation_menu'] = $save_setting;
 
-if ($debug) {
-    error_log(' ------- end lp_view.php ------');
-}
-Display::display_footer();
+//$content = $app['template']->fetch('default/javascript/newscorm/lp.tpl');
+$app['template.show_footer'] = false;
+$app['template.show_header'] = false;
+
+$app['default_layout'] = 'default/learnpath/lp.tpl';

+ 78 - 0
main/template/default/learnpath/lp.tpl

@@ -0,0 +1,78 @@
+{% extends app.template_style ~ "/layout/no_layout.tpl" %}
+{% block body %}
+
+{% include app.template_style ~ "/learnpath/lp_js.tpl" %}
+
+<div id="learning_path_main">
+    {% if api_is_allowed_to_edit %}
+        <div class="row">
+            <div id="learning_path_breadcrumb_zone" class="col-md-12">
+                {{ breadcrumb }}
+            </div>
+        </div>
+    {% endif %}
+    <div class="row">
+        <div id="learning_path_left_zone" class="col-md-2">
+            <div id="header">
+                <a href="{{ _p.web_code_path }}lp_controller.php?action=return_to_course_homepage&{{ course_url }}" target="_self" onclick="javascript: window.parent.API.save_asset();">
+                    <img src="{{ _p.web_img_path }}lp_arrow.gif" />
+                </a>
+                {% if api_is_allowed_to_edit %}
+                    {% set course_home_url = _p.web_code_path ~ 'newscorm/lp_controller.php?isStudentView=false&action=return_to_course_homepage&' ~ course_url %}
+                {% else %}
+                    {% set course_home_url = _p.web_code_path ~ 'newscorm/lp_controller.php?action=return_to_course_homepage&' ~ course_url %}
+                {% endif %}
+
+                <a class="btn btn-default" href="{{ course_home_url }}" target="_self" onclick="javascript: window.parent.API.save_asset();">
+                    {{ 'CourseHomepageLink' | trans }}
+                </a>
+            </div>
+
+            <div id="toc_id" name="toc_name">
+                <div id="learning_path_toc" class="panel panel-default">
+                    <div id="scorm_title" class="panel-heading">
+                        {{ lp_name }}
+                    </div>
+                    <div class="panel-body">
+                        <ul class="media-list">
+                            <li class="media">
+                                <a class="pull-left" href="#">
+                                    <img class="media-object" src="{{ picture }}">
+                                </a>
+                                <div class="media-body">
+                                    {{ navigation_bar }}
+                                    {{ progress_bar }}
+                                </div>
+                            </li>
+                        </ul>
+                        {{ author }}
+
+                        {% if mediaplayer %}
+                            <div id="lp_media_file">
+                                {{ mediaplayer }}
+                            </div>
+                        {% endif %}
+
+                    </div>
+                    <ul id="inner_lp_toc" class="list-group" style="overflow: auto; padding:0;margin-top:0px;width:100%;float:left">
+                        {{ table_of_contents }}
+                    </ul>
+                </div>
+            </div>
+        </div>
+
+        <div id="learning_path_right_zone" class="col-md-10" style="height: 100%;overflow: hidden;">
+            <div id="learning_path_right_zone2" style="
+                overflow: hidden;
+                width: 100%;
+                height: 100%;
+                min-height: 100%;
+                background:  #eed3d7;
+                display: block; ">
+            </div>
+            {{ iframe }}
+        </div>
+    </div>
+</div>
+
+{% endblock %}

+ 100 - 0
main/template/default/learnpath/lp_js.tpl

@@ -0,0 +1,100 @@
+<script>
+$(document).ready(function(){
+    $("div#log_content_cleaner").bind("click", function() {
+        $("div#log_content").empty();
+    });
+});
+
+var chamilo_xajax_handler = window.oxajax;
+chamilo_courseCode = '{{ course_code }}';
+</script>
+<script>
+    var sv_user = {{ _u.user_id }};
+    var sv_course = chamilo_courseCode;
+    var sv_sco = {{ lp_id }};
+
+        // Resize right and left pane to full height (HUB 20-05-2010).
+    function updateContentHeight() {
+        document.body.style.overflow = 'hidden';
+        var IE = window.navigator.appName.match(/microsoft/i);
+        var hauteurHeader = document.getElementById('header').offsetHeight;
+        var hauteurTitre = document.getElementById('scorm_title').offsetHeight;
+        var topBar = $('#learning_path_breadcrumb_zone').length > 0 ? $('#learning_path_breadcrumb_zone').outerHeight() : 0;
+        var panel_body = $('.panel-body').length > 0 ? $('.panel-body').outerHeight() : 0;
+        var totalHeight = hauteurHeader + hauteurTitre + panel_body+topBar;
+        var innerHauteur = (IE) ? document.body.clientHeight : window.innerHeight;
+
+        document.getElementById('inner_lp_toc').style.height = innerHauteur - totalHeight + "px";
+
+        if (document.getElementById('content_id')) {
+            document.getElementById('content_id').style.height = innerHauteur - topBar + 'px';
+        }
+    }
+    window.onload = updateContentHeight;
+    window.onresize = updateContentHeight;
+</script>
+<script src="{{ _p.web_code_path }}newscorm/js/documentapi.js" type="text/javascript"></script>
+<script src="{{ _p.web_code_path }}newscorm/js/storageapi.js"></script>
+
+{% if lp.mode == 'fullscreen' %}
+    <script>window.open('$src','content_id','toolbar=0,location=0,status=0,scrollbars=1,resizable=1');</script>
+{% endif %}
+
+{% if show_glossary == 'true' %}
+
+    {% if glossary_type == 'ismanual' %}
+        <script>
+        $.frameReady(function () {},
+            "top.content_name", {
+                load:[
+                {
+                    type:"script",
+                    id:"_fr1",
+                    src:"{{ _p.web_library_path}}javascript/jquery.js"
+                },
+                {
+                    type:"script",
+                    id:"_fr4",
+                    src:"{{ _p.web_library_path}}javascript/jquery-ui/js/jquery-ui.custom.js"
+                },
+                {
+                    type:"stylesheet",
+                    id:"_fr5",
+                    src:"{{ _p.web_library_path}}javascript/jquery-ui/css/smoothness/jquery-ui.custom.min.css"
+                },
+                {
+                    type:"script",
+                    id:"_fr2",
+                    src:"{{ _p.web_library_path}}javascript/jquery.highlight.js"
+                }
+                ]
+            }
+        );
+        </script>
+    {% else %}
+        <script>
+            $.frameReady(function () {},
+                "top.content_name",
+                { load:[
+                    {
+                        type:"script",
+                        id:"_fr1",
+                        src:"{{ _p.web_library_path}}javascript/jquery.js"},
+                    {
+                        type:"script",
+                        id:"_fr4",
+                        src:"{{ _p.web_library_path}}javascript/jquery-ui/js/jquery-ui.custom.js"},
+                    {
+                        type:"stylesheet",
+                        id:"_fr5",
+                        src:"{{ _p.web_library_path}}javascript/jquery-ui/css/smoothness/jquery-ui-custom.css"},
+                    {
+                        type:"script",
+                        id:"_fr2",
+                        src:"{{ _p.web_library_path}}javascript/jquery.highlight.js"
+                    }
+                ]}
+            );
+        </script>
+    {% endif %}
+{% endif %}