@qooxdoo/framework/source/class/qx/ui/splitpane/HLayout.js

The JS Framework for Coders

/* ************************************************************************

   qooxdoo - the new era of web development

   http://qooxdoo.org

   Copyright:
     2004-2008 1&1 Internet AG, Germany, http://www.1und1.de

   License:
     MIT: https://opensource.org/licenses/MIT
     See the LICENSE file in the project's top-level directory for details.

   Authors:
     * Sebastian Werner (wpbasti)
     * Fabian Jakobs (fjakobs)
     * Jonathan Weiß (jonathan_rass)

************************************************************************ */

/**
 * Layouter for horizontal split panes.
 *
 * @internal
 */
qx.Class.define("qx.ui.splitpane.HLayout", {
  extend: qx.ui.layout.Abstract,

  /*
  *****************************************************************************
     MEMBERS
  *****************************************************************************
  */

  members: {
    /*
    ---------------------------------------------------------------------------
      LAYOUT INTERFACE
    ---------------------------------------------------------------------------
    */

    // overridden
    verifyLayoutProperty: qx.core.Environment.select("qx.debug", {
      true(item, name, value) {
        this.assert(
          name === "type" || name === "flex",
          "The property '" + name + "' is not supported by the split layout!"
        );

        if (name == "flex") {
          this.assertNumber(value);
        }

        if (name == "type") {
          this.assertString(value);
        }
      },

      false: null
    }),

    // overridden
    renderLayout(availWidth, availHeight, padding) {
      var children = this._getLayoutChildren();
      var length = children.length;
      var child, type;
      var begin, splitter, slider, end;
      var paddingLeft = padding.left || 0;
      var paddingTop = padding.top || 0;

      for (var i = 0; i < length; i++) {
        child = children[i];
        type = child.getLayoutProperties().type;

        if (type === "splitter") {
          splitter = child;
        } else if (type === "slider") {
          slider = child;
        } else if (!begin) {
          begin = child;
        } else {
          end = child;
        }
      }

      if (begin && end) {
        var beginFlex = begin.getLayoutProperties().flex;
        var endFlex = end.getLayoutProperties().flex;

        if (beginFlex === undefined || beginFlex === null) {
          beginFlex = 1;
        }

        if (endFlex === undefined || endFlex === null) {
          endFlex = 1;
        }

        var beginHint = begin.getSizeHint();
        var splitterHint = splitter.getSizeHint();
        var endHint = end.getSizeHint();

        var beginWidth = beginHint.width;
        var splitterWidth = splitterHint.width;
        var endWidth = endHint.width;

        if (beginFlex > 0 && endFlex > 0) {
          var flexSum = beginFlex + endFlex;
          var flexAvailable = availWidth - splitterWidth;

          var beginWidth = Math.round((flexAvailable / flexSum) * beginFlex);
          var endWidth = flexAvailable - beginWidth;

          var sizes = qx.ui.layout.Util.arrangeIdeals(
            beginHint.minWidth,
            beginWidth,
            beginHint.maxWidth,
            endHint.minWidth,
            endWidth,
            endHint.maxWidth
          );

          beginWidth = sizes.begin;
          endWidth = sizes.end;
        } else if (beginFlex > 0) {
          beginWidth = availWidth - splitterWidth - endWidth;
          if (beginWidth < beginHint.minWidth) {
            beginWidth = beginHint.minWidth;
          }

          if (beginWidth > beginHint.maxWidth) {
            beginWidth = beginHint.maxWidth;
          }
        } else if (endFlex > 0) {
          endWidth = availWidth - beginWidth - splitterWidth;
          if (endWidth < endHint.minWidth) {
            endWidth = endHint.minWidth;
          }

          if (endWidth > endHint.maxWidth) {
            endWidth = endHint.maxWidth;
          }
        }

        begin.renderLayout(paddingLeft, paddingTop, beginWidth, availHeight);
        splitter.renderLayout(
          beginWidth + paddingLeft,
          paddingTop,
          splitterWidth,
          availHeight
        );

        end.renderLayout(
          beginWidth + splitterWidth + paddingLeft,
          paddingTop,
          endWidth,
          availHeight
        );
      } else {
        // Hide the splitter completely
        splitter.renderLayout(0, 0, 0, 0);

        // Render one child
        if (begin) {
          begin.renderLayout(paddingLeft, paddingTop, availWidth, availHeight);
        } else if (end) {
          end.renderLayout(paddingLeft, paddingTop, availWidth, availHeight);
        }
      }
    },

    // overridden
    _computeSizeHint() {
      var children = this._getLayoutChildren();
      var length = children.length;
      var child, hint, props;
      var minWidth = 0,
        width = 0,
        maxWidth = 0;
      var minHeight = 0,
        height = 0,
        maxHeight = 0;

      for (var i = 0; i < length; i++) {
        child = children[i];
        props = child.getLayoutProperties();

        // The slider is not relevant for auto sizing
        if (props.type === "slider") {
          continue;
        }

        hint = child.getSizeHint();

        minWidth += hint.minWidth;
        width += hint.width;
        maxWidth += hint.maxWidth;

        if (hint.minHeight > minHeight) {
          minHeight = hint.minHeight;
        }

        if (hint.height > height) {
          height = hint.height;
        }

        if (hint.maxHeight > maxHeight) {
          maxHeight = hint.maxHeight;
        }
      }

      return {
        minWidth: minWidth,
        width: width,
        maxWidth: maxWidth,
        minHeight: minHeight,
        height: height,
        maxHeight: maxHeight
      };
    }
  }
});