franck@0: 
franck@0: /**
franck@0:  * Custom theming for the popupsLoading.
franck@0:  */
franck@0: Drupal.theme.popupLoading = function() {
franck@0:   var loading;
franck@0:   loading += '<div id="popups-loading">';
franck@0:   loading += '  <table>';
franck@0:   loading += '    <tr>';
franck@0:   loading += '      <td class="popups-tl popups-border"></td>';
franck@0:   loading += '      <td class="popups-t popups-border"></td>';
franck@0:   loading += '      <td class="popups-tr popups-border" id="popups-tr"></td>';
franck@0:   loading += '    </tr>';
franck@0:   loading += '    <tr>';
franck@0:   loading += '      <td class="popups-cl popups-border"></td>';
franck@0:   loading += '      <td class="popups-c">';
franck@0:   loading += '        <span class="popups-loading-message">Loading...</span>';
franck@0:   loading += '      </td>';
franck@0:   loading += '      <td class="popups-cr popups-border"></td>';
franck@0:   loading += '    </tr>';
franck@0:   loading += '    <tr>';
franck@0:   loading += '      <td class="popups-bl popups-border"></td>';
franck@0:   loading += '      <td class="popups-b popups-border"></td>';
franck@0:   loading += '      <td class="popups-br popups-border"></td>';
franck@0:   loading += '    </tr>';
franck@0:   loading += '  </table>';
franck@0:   loading += '</div>';
franck@0:   return loading;
franck@0: };
franck@0: 
franck@0: Drupal.theme.popupTemplate = function (popupId) {
franck@0:   var template;
franck@0:   template += '<div id="' + popupId + '" class ="popups-box">';
franck@0:   template += '  <table>';
franck@0:   template += '    <tr>';
franck@0:   template += '      <td class="popups-tl popups-border"></td>';
franck@0:   template += '      <td class="popups-t popups-border"></td>';
franck@0:   template += '      <td class="popups-tr popups-border"></td>';
franck@0:   template += '    </tr>';
franck@0:   template += '    <tr>';
franck@0:   template += '      <td class="popups-cl popups-border"></td>';
franck@0:   template += '      <td class="popups-c">';
franck@0:   template += '        <div class="popups-container">';
franck@0:   template += '          <div class="popups-title">';
franck@0:   template += '            <div class="popups-close"><a href="#">' + Drupal.t('Close') + '</a></div>';
franck@0:   template += '            <div class="title">%title</div>';
franck@0:   template += '            <div class="clear-block"></div>';
franck@0:   template += '          </div>';
franck@0:   template += '          <div class="popups-body">%body</div>';
franck@0:   template += '          <div class="popups-buttons">%buttons</div>';
franck@0:   template += '          <div class="popups-footer"></div>';
franck@0:   template += '        </div>';
franck@0:   template += '      </td>';
franck@0:   template += '      <td class="popups-cr popups-border"></td>';
franck@0:   template += '    </tr>';
franck@0:   template += '    <tr>';
franck@0:   template += '      <td class="popups-bl popups-border"></td>';
franck@0:   template += '      <td class="popups-b popups-border"></td>';
franck@0:   template += '      <td class="popups-br popups-border"></td>';
franck@0:   template += '    </tr>';
franck@0:   template += '  </table>';
franck@0:   template += '</div>';
franck@0:   return template;
franck@0: };
franck@0: 
franck@0: /**
franck@0:  * We need to resize the popups-container as well as the popups if it scrolls
franck@0:  */
franck@0: Drupal.behaviors.resizePopupsContainer = function() {
franck@0:   var popup = Popups.activePopup();
franck@0:   if (popup) {
franck@0:     var $popupsContainer = $('#' + popup.id + ' .popups-container');
franck@0:     if ($popupsContainer.length) {
franck@0:       var popupHeight = $popupsContainer.height();
franck@0:       var windowHeight = $(window).height();
franck@0:       if (popupHeight > (0.9 * windowHeight) ) { // Must fit in 90% of window.
franck@0:         // we make this slightly smaller than popups so that it fits inside
franck@0:         popupHeight = 0.85 * windowHeight;
franck@0:         $popupsContainer.height(popupHeight);
franck@0:       }
franck@0:       // needs an extra 20px as the bottom dropshadow looks cutoff
franck@0:       var $popup = popup.$popup();
franck@0:       $popup.height($popup.height() + 20);
franck@0:     }
franck@0:   }
franck@0: };