2017: Add 'Expand All' in /program.

[libreplanet-static.git] / 2017 / includes / program_js.html

<!-- start html templates -->
<script id="details-menu-up-glyph" type="text/x-generic-html-template">
    <span class="glyphicon glyphicon-menu-up" style="margin-left: 5px;"
          aria-hidden="true"></span>
</script>
<script id="details-menu-down-glyph" type="text/x-generic-html-template">
    <span class="glyphicon glyphicon-menu-down"  style="margin-left: 5px;"
          aria-hidden="true"></span>
</script>
<!-- end html templates -->

<script>
 $('.collapse').removeClass('in');

 $(window).ready(function() {
     init_toggle_all();

     $('.session-desc')
         .on('show.bs.collapse', function() {
             var id = $(this).attr('id');
             // find corresponding "Details"/"Collapse details" button.
             var btn = $('[data-target="#'+ id + '"]');
             var glyph = $('#details-menu-up-glyph').text();
             $(btn).text('Collapse details');
             $(glyph).appendTo(btn);
         });

     $('.session-desc')
         .on('hide.bs.collapse', function() {
             var id = $(this).attr('id');
             // find corresponding "Details"/"Collapse details" button.
             var btn = $('[data-target="#'+ id + '"]');
             var glyph = $('#details-menu-down-glyph').text();
             $(btn).text('Show details');
             $(glyph).appendTo(btn);
         });
 });

 $(window).resize(function() {
     reinit_toggle_all();
 });

 $(window).scroll(function() {
     position_toggle_all();
 });

 function init_toggle_all(reinit=false) {
     var id = '.program-session-details-toggle-all button';
     // on click init.
     if (!reinit)
         toggle_all_click_init();

     // positioning.
     window.toggle_all_pos = $(id).offset();
     position_toggle_all();
 }

 function reinit_toggle_all() {
     // make position static to know the real position of toggle all.
     toggle_all_static();
     init_toggle_all(true);
 }

 function toggle_all_fixed() {
     $('.program-session-details-toggle-all button').addClass('fixed');
 }

 function toggle_all_static() {
     $('.program-session-details-toggle-all button').removeClass('fixed');
 }

 function position_toggle_all() {
     var toggle_all_btn = '.program-session-details-toggle-all button';
     var t_pos = window.toggle_all_pos;
     var w_top = $(window).scrollTop();

     if(w_top > t_pos.top)
         toggle_all_fixed();
     else
         toggle_all_static();

 }

 function toggle_all_click_init() {
     var toggle_all_btn = '.program-session-details-toggle-all button';
     var details_btn = '.program-session-room-details button';

     // initially everything is collapsed.
     window.toggle_all = {
         'collapsed': true,
         'clicked': false,
     };

     $(toggle_all_btn).click(function() {

         if (window.toggle_all.collapsed) {
             $('.collapse').collapse('show');
             window.toggle_all.collapsed = false;
         } else {
             $('.collapse').collapse('hide');
             window.toggle_all.collapsed = true;
         }

         // set toggle all clicked.
         window.toggle_all.clicked = true;
     });

     $('.collapse').on('shown.bs.collapse', function() {
         update_toggle_all_text('Collapse all');
     });

     $('.collapse').on('hidden.bs.collapse', function() {
         update_toggle_all_text('Expand all');
     });
 }

 function update_toggle_all_text(txt) {
     var toggle_all_btn = '.program-session-details-toggle-all button';

     // update text only when toggle all is clicked.
     if (window.toggle_all.clicked)
         $(toggle_all_btn).text(txt);

     // reset toggle clicked
     window.toggle_all.clicked = false;
 }
</script>

<script type="text/javascript">
 $(".program-link").addClass("active");
</script>