# all files / src/js/base/module/ Fullscreen.js

96.97% Statements 32/33
75% Branches 3/4
100% Functions 6/6
96.97% Lines 32/33

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    551×

    1×
    93×
    92×

    92×
    92×
    92×
    92×

    92×
    92×

    92×
    1×

    1×
    2×
    2×
    2×

    1×
    2×
    2×
    1×
    1×
    1×
    1×
    1×

    1×
    1×
    1×
    1×

    2×

    1×
    7×

    1×
     import $ from 'jquery';

    export default class Fullscreen {
      constructor(context) {
        this.context = context;

        this.$editor = context.layoutInfo.editor;
        this.$toolbar = context.layoutInfo.toolbar;
        this.$editable = context.layoutInfo.editable;
        this.$codable = context.layoutInfo.codable;

        this.$window = $(window);
        this.$scrollbar = $('html, body');

        this.onResize = () => {
          this.resizeTo({
            h: this.$window.height() - this.$toolbar.outerHeight()
          });
        };
      }

      resizeTo(size) {
        this.$editable.css('height', size.h);
        this.$codable.css('height', size.h);
        Iif (this.$codable.data('cmeditor')) {
          this.$codable.data('cmeditor').setsize(null, size.h);
        }
      }

      /**
       * toggle fullscreen
       */
      toggle() {
        this.$editor.toggleClass('fullscreen');
        if (this.isFullscreen()) {
          this.$editable.data('orgHeight', this.$editable.css('height'));
          this.$editable.data('orgMaxHeight', this.$editable.css('maxHeight'));
          this.$editable.css('maxHeight', '');
          this.$window.on('resize', this.onResize).trigger('resize');
          this.$scrollbar.css('overflow', 'hidden');
        } else {
          this.$window.off('resize', this.onResize);
          this.resizeTo({ h: this.$editable.data('orgHeight') });
          this.$editable.css('maxHeight', this.$editable.css('orgMaxHeight'));
          this.$scrollbar.css('overflow', 'visible');
        }

        this.context.invoke('toolbar.updateFullscreen', this.isFullscreen());
      }

      isFullscreen() {
        return this.$editor.hasClass('fullscreen');
      }
    }