PageRenderTime 49ms CodeModel.GetById 24ms RepoModel.GetById 0ms app.codeStats 0ms

/sites/all/modules/contrib/ctools/js/mc.js

https://github.com/dudym/drupalmel
JavaScript | 178 lines | 111 code | 24 blank | 43 comment | 42 complexity | e16a8f19e53950dc768fdd4152a2cb48 MD5 | raw file
  1. /**
  2. * Modified modalContent jQuery Plugin
  3. */
  4. (function ($) {
  5. // Make sure our objects are defined.
  6. Drupal.CTools = Drupal.CTools || {};
  7. Drupal.CTools.Modal = Drupal.CTools.Modal || {};
  8. /**
  9. * modalContent
  10. * @param content string to display in the content box
  11. * @param css obj of css attributes
  12. * @param animation (fadeIn, slideDown, show)
  13. * @param speed (valid animation speeds slow, medium, fast or # in ms)
  14. */
  15. Drupal.CTools.Modal.modalContent = function(content, css, animation, speed) {
  16. // If our animation isn't set, make it just show/pop
  17. if (!animation) {
  18. animation = 'show';
  19. }
  20. else {
  21. // If our animation isn't "fadeIn" or "slideDown" then it always is show
  22. if (animation != 'fadeIn' && animation != 'slideDown') {
  23. animation = 'show';
  24. }
  25. }
  26. if (!speed) {
  27. speed = 'fast';
  28. }
  29. // Build our base attributes and allow them to be overriden
  30. css = jQuery.extend({
  31. position: 'absolute',
  32. left: '0px',
  33. margin: '0px',
  34. background: '#000',
  35. opacity: '.55'
  36. }, css);
  37. content.hide();
  38. // if we already ahve a modalContent, remove it
  39. if ( $('#modalBackdrop')) $('#modalBackdrop').remove();
  40. if ( $('#modalContent')) $('#modalContent').remove();
  41. // position code lifted from http://www.quirksmode.org/viewport/compatibility.html
  42. if (self.pageYOffset) { // all except Explorer
  43. var wt = self.pageYOffset;
  44. } else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
  45. var wt = document.documentElement.scrollTop;
  46. } else if (document.body) { // all other Explorers
  47. var wt = document.body.scrollTop;
  48. }
  49. // Get our dimensions
  50. // Get the docHeight and (ugly hack) add 50 pixels to make sure we dont have a *visible* border below our div
  51. var docHeight = $(document).outerHeight() + 50;
  52. var docWidth = $(document).innerWidth();
  53. var winHeight = $(window).height();
  54. var winWidth = $(window).innerWidth();
  55. if( docHeight < winHeight ) docHeight = winHeight;
  56. // Create our divs
  57. $('body').append('<div id="modalBackdrop" style="z-index: 1000; display: none;"></div><div id="modalContent" style="z-index: 1001; position: absolute;">' + $(content).html() + '</div>');
  58. // Keyboard and focus event handler ensures focus stays on modal elements only
  59. modalEventHandler = function( event ) {
  60. target = null;
  61. if ( event ) { //Mozilla
  62. target = event.target;
  63. } else { //IE
  64. event = window.event;
  65. target = event.srcElement;
  66. }
  67. if( $(target).filter('*:visible').parents('#modalContent').size()) {
  68. // allow the event only if target is a visible child node of #modalContent
  69. return true;
  70. }
  71. if ( $('#modalContent')) $('#modalContent').get(0).focus();
  72. return false;
  73. };
  74. $('body').bind( 'focus', modalEventHandler );
  75. $('body').bind( 'keypress', modalEventHandler );
  76. // Create our content div, get the dimensions, and hide it
  77. var modalContent = $('#modalContent').css('top','-1000px');
  78. var mdcTop = wt + ( winHeight / 2 ) - ( modalContent.outerHeight() / 2);
  79. var mdcLeft = ( winWidth / 2 ) - ( modalContent.outerWidth() / 2);
  80. $('#modalBackdrop').css(css).css('top', 0).css('height', docHeight + 'px').css('width', docWidth + 'px').show();
  81. modalContent.css({top: mdcTop + 'px', left: mdcLeft + 'px'}).hide()[animation](speed);
  82. // Bind a click for closing the modalContent
  83. modalContentClose = function(){close(); return false;};
  84. $('.close').bind('click', modalContentClose);
  85. // Close the open modal content and backdrop
  86. function close() {
  87. // Unbind the events
  88. $(window).unbind('resize', modalContentResize);
  89. $('body').unbind( 'focus', modalEventHandler);
  90. $('body').unbind( 'keypress', modalEventHandler );
  91. $('.close').unbind('click', modalContentClose);
  92. // Set our animation parameters and use them
  93. if ( animation == 'fadeIn' ) animation = 'fadeOut';
  94. if ( animation == 'slideDown' ) animation = 'slideUp';
  95. if ( animation == 'show' ) animation = 'hide';
  96. // Close the content
  97. modalContent.hide()[animation](speed);
  98. // Remove the content
  99. $('#modalContent').remove();
  100. $('#modalBackdrop').remove();
  101. };
  102. // Move and resize the modalBackdrop and modalContent on resize of the window
  103. modalContentResize = function(){
  104. // Get our heights
  105. var docHeight = $(document).outerHeight();
  106. var docWidth = $(document).innerWidth();
  107. var winHeight = $(window).height();
  108. var winWidth = $(window).width();
  109. if( docHeight < winHeight ) docHeight = winHeight;
  110. // Get where we should move content to
  111. var modalContent = $('#modalContent');
  112. var mdcTop = ( winHeight / 2 ) - ( modalContent.outerHeight() / 2);
  113. var mdcLeft = ( winWidth / 2 ) - ( modalContent.outerWidth() / 2);
  114. // Apply the changes
  115. $('#modalBackdrop').css('height', docHeight + 'px').css('width', docWidth + 'px').show();
  116. modalContent.css('top', mdcTop + 'px').css('left', mdcLeft + 'px').show();
  117. };
  118. $(window).bind('resize', modalContentResize);
  119. $('#modalContent').focus();
  120. };
  121. /**
  122. * unmodalContent
  123. * @param content (The jQuery object to remove)
  124. * @param animation (fadeOut, slideUp, show)
  125. * @param speed (valid animation speeds slow, medium, fast or # in ms)
  126. */
  127. Drupal.CTools.Modal.unmodalContent = function(content, animation, speed)
  128. {
  129. // If our animation isn't set, make it just show/pop
  130. if (!animation) { var animation = 'show'; } else {
  131. // If our animation isn't "fade" then it always is show
  132. if (( animation != 'fadeOut' ) && ( animation != 'slideUp')) animation = 'show';
  133. }
  134. // Set a speed if we dont have one
  135. if ( !speed ) var speed = 'fast';
  136. // Unbind the events we bound
  137. $(window).unbind('resize', modalContentResize);
  138. $('body').unbind('focus', modalEventHandler);
  139. $('body').unbind('keypress', modalEventHandler);
  140. $('.close').unbind('click', modalContentClose);
  141. // jQuery magic loop through the instances and run the animations or removal.
  142. content.each(function(){
  143. if ( animation == 'fade' ) {
  144. $('#modalContent').fadeOut(speed,function(){$('#modalBackdrop').fadeOut(speed, function(){$(this).remove();});$(this).remove();});
  145. } else {
  146. if ( animation == 'slide' ) {
  147. $('#modalContent').slideUp(speed,function(){$('#modalBackdrop').slideUp(speed, function(){$(this).remove();});$(this).remove();});
  148. } else {
  149. $('#modalContent').remove();$('#modalBackdrop').remove();
  150. }
  151. }
  152. });
  153. };
  154. })(jQuery);