page.js 2.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. // Copyright (c) Jupyter Development Team.
  2. // Distributed under the terms of the Modified BSD License.
  3. define([
  4. 'jquery',
  5. 'base/js/events',
  6. ], function($, events){
  7. "use strict";
  8. var Page = function (header_div_selector, site_div_selector) {
  9. /**
  10. * Constructor
  11. *
  12. * Parameters
  13. * header_div_selector: string
  14. * site_div_selector: string
  15. */
  16. this.header_div_element = $(header_div_selector || 'div#header');
  17. this.site_div_element = $(site_div_selector || 'div#site');
  18. this.bind_events();
  19. };
  20. Page.prototype.bind_events = function () {
  21. // resize site on:
  22. // - window resize
  23. // - header change
  24. // - page load
  25. var _handle_resize = $.proxy(this._resize_site, this);
  26. $(window).resize(_handle_resize);
  27. // On document ready, resize codemirror.
  28. $(document).ready(_handle_resize);
  29. events.on('resize-header.Page', _handle_resize);
  30. };
  31. Page.prototype.show = function () {
  32. /**
  33. * The header and site divs start out hidden to prevent FLOUC.
  34. * Main scripts should call this method after styling everything.
  35. */
  36. this.show_header();
  37. this.show_site();
  38. };
  39. Page.prototype.show_header = function () {
  40. /**
  41. * The header and site divs start out hidden to prevent FLOUC.
  42. * Main scripts should call this method after styling everything.
  43. */
  44. this.header_div_element.css('display','block');
  45. };
  46. Page.prototype.show_site = function () {
  47. /**
  48. * The header and site divs start out hidden to prevent FLOUC.
  49. * Main scripts should call this method after styling everything.
  50. */
  51. this.site_div_element.css('display', 'block');
  52. this._resize_site();
  53. };
  54. Page.prototype._resize_site = function(e) {
  55. /**
  56. * Update the site's size.
  57. */
  58. // In the case an event is passed in, only trigger if the event does
  59. // *not* have a target DOM node (i.e., it is not bubbling up). See
  60. // https://bugs.jquery.com/ticket/9841#comment:8
  61. if (!(e && e.target && e.target.tagName)) {
  62. $('div#site').height($(window).height() - $('#header').height());
  63. }
  64. };
  65. return {'Page': Page};
  66. });