minipanel.tpl 3.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <script>
  2. /* For licensing terms, see /license.txt */
  3. /*
  4. Learning Path minipanel - Chamilo 1.8.8
  5. Adding mini panel to browse Learning Paths
  6. Requirements: JQuery 1.4.4, JQuery UI 1.8.7
  7. @author Alberto Torreblanca @albert1t0
  8. @author Julio Montoya Cleaning/fixing some code
  9. **/
  10. // Copy little progress bar in <tr></tr>
  11. function toogle_minipanel() {
  12. // Construct mini panel
  13. var panel = $('#lp_navigation_elem div:first').clone();
  14. $(panel).attr('id', 'control');
  15. $('#learning_path_main').append(panel);
  16. $('#learning_path_main #control tr').after('<tr></tr>');
  17. $('#learning_path_main #control tr:eq(1)').append($('#progress_bar').html());
  18. $('#learning_path_main #control tr:eq(1) #progress_img_limit_left').attr('height','5');
  19. $('#learning_path_main #control tr:eq(1) #progress_img_full').attr('height','5');
  20. $('#learning_path_main #control tr:eq(1) #progress_img_limit_middle').attr('height','5');
  21. $('#learning_path_main #control tr:eq(1) #progress_img_empty').attr('height','5');
  22. $('#learning_path_main #control tr:eq(1) #progress_bar_img_limit_right').attr('height','5');
  23. $('#learning_path_main #control tr:eq(1) #progress_text').remove();
  24. $('#learning_path_main #control tr:eq(1) div').css('width','');
  25. $('#learning_path_main #control .buttons').attr('text-align','center');
  26. $('#content_id').css({ height: $('#content_id').height() - ($('#control').height() + 10) });
  27. $('#learning_path_main #control .buttons img').click(function(){
  28. $('#learning_path_main #control tr:eq(1)').remove();
  29. toogle_minipanel();
  30. });
  31. // Hiding navigation left zone
  32. $('#learning_path_left_zone').hide(50);
  33. $('#learning_path_right_zone').css('margin-left','10px');
  34. $('#hide_bar table').css('backgroundImage','url(../img/hide2.png)').css('backgroundColor','#EEEEEE');
  35. }
  36. var left_width_mini = 20; // (relative) hide_bar position
  37. $(document).ready(function() {
  38. var left_width = $('learning_path_left_zone').width();
  39. //Adding div to hide panel
  40. $('#learning_path_right_zone').before('<div id="hide_bar" style="float: left; width: 10px; height: 1000px;">' +
  41. '<table style="border: 0 none; width: 100%; height: 100%; cursor: pointer; background-color: #EEEEEE">' +
  42. '<tr><td></td></tr></table></div>');
  43. $('#hide_bar table').css({backgroundImage: "url(../img/hide0.png)", backgroundRepeat: "no-repeat", backgroundPosition: "center center"});
  44. //Adding effects to hide bar
  45. $('#hide_bar table').hover(function () {
  46. if ($('#hide_bar').position().left >= left_width)
  47. $(this).css('backgroundImage','url(../img/hide1.png)').css('backgroundColor','#888888');
  48. else if($('#hide_bar').position().left <= left_width_mini)
  49. $(this).css('backgroundImage','url(../img/hide3.png)').css('backgroundColor','#888888');
  50. },function (){
  51. if($('#hide_bar').position().left >= left_width)
  52. $(this).css('backgroundImage','url(../img/hide0.png)').css('backgroundColor','#EEEEEE');
  53. else if($('#hide_bar').position().left <= left_width_mini)
  54. $(this).css('backgroundImage','url(../img/hide2.png)').css('backgroundColor','#EEEEEE');
  55. }
  56. );
  57. var original = $('#content_id').height();
  58. // Adding functionality
  59. $('#hide_bar table').toggle(function(){
  60. if ($('#hide_bar').position().left >= left_width) {
  61. toogle_minipanel();
  62. }
  63. },
  64. function() {
  65. // Show navigation left zone
  66. $('#learning_path_left_zone').show(50);
  67. $('#learning_path_right_zone').css('marginLeft', left_width + 10 + 'px');
  68. $('#hide_bar table').css('backgroundImage','url(../img/hide0.png)').css('backgroundColor','#EEEEEE');
  69. $('#learning_path_main #control').remove();
  70. $('#content_id').css({ height: original});
  71. });
  72. });