view.tpl 8.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201
  1. <div id="learning_path_main" style="width:100%; height: 100%;">
  2. {% if is_allowed_to_edit %}
  3. <div class="row">
  4. <div id="learning_path_breadcrumb_zone" class="col-md-12">
  5. {{ breadcrumb }}
  6. </div>
  7. </div>
  8. {% endif %}
  9. <button id="touch-button" class="btn btn-primary"><i class="fa fa-bars"></i></button>
  10. <div class="container-fluid">
  11. <div class="row">
  12. <div id="learning_path_left_zone" class="sidebar-scorm">
  13. {% if gamification_mode == 1 %}
  14. <div class="row">
  15. <div class="col-xs-8">
  16. {% set lp_stars = oLP.getCalculateStars() %}
  17. {% if lp_stars > 0%}
  18. {% for i in 1..lp_stars %}
  19. <i class="fa fa-star fa-2x"></i>
  20. {% endfor %}
  21. {% endif %}
  22. {% if lp_stars < 4 %}
  23. {% for i in 1..4 - lp_stars %}
  24. <i class="fa fa-star-o fa-2x"></i>
  25. {% endfor %}
  26. {% endif %}
  27. </div>
  28. <div class="col-xs-4 text-right">
  29. {{ "XPoints"|get_lang|format(oLP.getCalculateScore()) }}
  30. </div>
  31. </div>
  32. {% else %}
  33. <div id="scorm-info" class="panel panel-default">
  34. <div class="panel-heading">
  35. <a id="ui-option">
  36. <i id="icon-down" class="fa fa-chevron-down hidden"></i>
  37. <i id="icon-up" class="fa fa-chevron-up"></i>
  38. </a>
  39. </div>
  40. {# Author image preview #}
  41. <div id="panel-scorm" class="panel-body">
  42. <a href="{{ button_home_url }}" class="btn btn-success btn-block" target="_self" onclick="javascript: window.parent.API.save_asset();">
  43. <i class="fa fa-home"></i> {{ button_home_text }}
  44. </a>
  45. <div class="image-avatar">
  46. {% if oLP.get_preview_image() %}
  47. <img src="{{ oLP.get_preview_image_path() }}" width="104" height="96">
  48. {% else %}
  49. <img src="{{ "unknown_250_100.jpg"|icon }}" width="104" height="96">
  50. {% endif %}
  51. </div>
  52. <div id="lp_navigation_elem" class="navegation-bar">
  53. {{ navigation_bar }}
  54. <div id="progress_bar">
  55. {{ progress_bar }}
  56. </div>
  57. </div>
  58. <div class="description-autor">
  59. {{ oLP.get_author() }}
  60. </div>
  61. {% if show_audio_player %}
  62. <div id="lp_media_file">
  63. {{ media_player }}
  64. </div>
  65. {% endif %}
  66. </div>
  67. </div>
  68. {% endif %}
  69. {# TOC layout #}
  70. <div id="toc_id" name="toc_name">
  71. <div id="learning_path_toc" class="scorm-list">
  72. {{ oLP.get_html_toc(toc_list) }}
  73. </div>
  74. </div>
  75. {# end TOC layout #}
  76. </div>
  77. {# end left zone #}
  78. {# <div id="hide_bar" class="scorm-toggle" style="display:inline-block; width: 25px; height: 1000px;"></div> #}
  79. {# right zone #}
  80. <div id="learning_path_right_zone" style="height:100%" class="content-scorm">
  81. {% if oLP.mode == 'fullscreen' %}
  82. <iframe id="content_id_blank" name="content_name_blank" src="blank.php" border="0" frameborder="0" style="width: 100%; height: 100%" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
  83. {% else %}
  84. <iframe id="content_id" name="content_name" src="{{ iframe_src }}" border="0" frameborder="0" style="display: block; width: 100%; height: 100%" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
  85. {% endif %}
  86. </div>
  87. {# end right Zone #}
  88. {{ navigation_bar_bottom }}
  89. </div>
  90. </div>
  91. </div>
  92. <script>
  93. // Resize right and left pane to full height (HUB 20-05-2010).
  94. var updateContentHeight = function () {
  95. document.body.style.overflow = 'hidden';
  96. var IE = window.navigator.appName.match(/microsoft/i);
  97. /* Identified new height */
  98. var heightControl = $('#control-bottom').height();
  99. var heightBreadcrumb = ($('#learning_path_breadcrumb_zone').height()) ? $('#learning_path_breadcrumb_zone').height() : 0;
  100. var heightScormInfo = $('#scorm-info').height();
  101. var heightTop = heightScormInfo + 100;
  102. //heightTop = (heightTop > 300)? heightTop : 300;
  103. var innerHeight = $(window).height();
  104. if (innerHeight <= 640) {
  105. $('#inner_lp_toc').css('height', innerHeight - heightTop + "px");
  106. $('#content_id').css('height', innerHeight - heightControl + "px");
  107. } else {
  108. $('#inner_lp_toc').css('height', innerHeight - heightBreadcrumb - heightTop + "px");
  109. $('#content_id').css('height', innerHeight - heightControl + "px");
  110. }
  111. //var innerHeight = (IE) ? document.body.clientHeight : window.innerHeight ;
  112. // Loads the glossary library.
  113. {% if glossary_extra_tools in glossary_tool_availables %}
  114. {% if show_glossary_in_documents == 'ismanual' %}
  115. $.frameReady(
  116. function(){
  117. // $("<div>I am a div courses</div>").prependTo("body");
  118. },
  119. "top.content_name",
  120. {
  121. load: [
  122. { type:"script", id:"_fr1", src:"{{ jquery_web_path }}"},
  123. { type:"script", id:"_fr4", src:"{{ jquery_ui_js_web_path }}"},
  124. { type:"stylesheet", id:"_fr5", src:"{{ jquery_ui_css_web_path }}"},
  125. { type:"script", id:"_fr2", src:"{{ _p.web_lib }}javascript/jquery.highlight.js"}
  126. ]
  127. }
  128. );
  129. {% elseif show_glossary_in_documents == 'isautomatic' %}
  130. $.frameReady(
  131. function(){
  132. // $("<div>I am a div courses</div>").prependTo("body");
  133. },
  134. "top.content_name",
  135. {
  136. load: [
  137. { type:"script", id:"_fr1", src:"{{ jquery_web_path }}"},
  138. { type:"script", id:"_fr4", src:"{{ jquery_ui_js_web_path }}"},
  139. { type:"stylesheet", id:"_fr5", src:"{{ jquery_ui_css_web_path }}"},
  140. { type:"script", id:"_fr2", src:"{{ _p.web_lib }}javascript/jquery.highlight.js"}
  141. ]
  142. }
  143. );
  144. {% endif %}
  145. {% endif %}
  146. };
  147. $(document).ready(function() {
  148. updateContentHeight();
  149. $('#touch-button').children().click(function(){
  150. updateContentHeight();
  151. });
  152. $(window).resize(function() {
  153. updateContentHeight();
  154. });
  155. });
  156. window.onload = updateContentHeight();
  157. window.onresize = updateContentHeight();
  158. $(document).ready(function(){
  159. $("#icon-down").click(function(){
  160. $("#icon-up").removeClass("hidden");
  161. $(this).addClass("hidden");
  162. $('#panel-scorm').slideDown("slow",function(){
  163. updateContentHeight();
  164. });
  165. });
  166. $("#icon-up").click(function(){
  167. $("#icon-down").removeClass("hidden");
  168. $(this).addClass("hidden");
  169. $('#panel-scorm').slideUp("slow",function(){
  170. updateContentHeight();
  171. });
  172. });
  173. });
  174. </script>