view class doc
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547/// FOURJS_START_COPYRIGHT(D,2017)
/// Property of Four Js*
/// (c) Copyright Four Js 2017, 2022. All Rights Reserved.
/// * Trademark of Four Js Development Tools Europe Ltd
///   in the United States and elsewhere
///
/// This file can be modified by licensees according to the
/// product manual.
/// FOURJS_END_COPYRIGHT

"use strict";

modulum('TableWidgetBase', ['WidgetGroupBase', 'WidgetFactory'],
  function(context, cls) {

    /**
     * TableWidgetBase widget (abstract class for TableWidget & ListViewWidget).
     * @class TableWidgetBase
     * @memberOf classes
     * @extends classes.WidgetGroupBase
     * @publicdoc
     */
    cls.TableWidgetBase = context.oo.Class(cls.WidgetGroupBase, function($super) {
      return /** @lends classes.TableWidgetBase.prototype */ {
        __name: "TableWidgetBase",

        /** @type {boolean} */
        __virtual: true,

        /** @type {number} */
        _currentRow: 0,
        /** @type {number} */
        _size: 0,
        /** @type {number} */
        _offset: 0,
        /** @type {number} */
        _pageSize: 0,
        /** @type {number} */
        _bufferSize: 0,
        /** @type {?number} */
        _firstPageSize: null,
        /** @type {boolean} */
        _fixedPageSize: false,
        /** @type {number} */
        _visibleRows: 0,

        /** @type {boolean} */
        _inputMode: false,
        /** @type {number} */
        _rowHeight: 0,

        /** @type {?boolean} */
        _rowActionTriggerByDoubleClick: true,
        /** @type {?string} */
        _highlightColor: null,
        /** @type {?string} */
        _highlightTextColor: null,
        /** @type {?boolean} */
        _highlightCurrentRow: null,
        /** @type {?boolean} */
        _highlightCurrentCell: null,
        /** @type {classes.UserInterfaceWidget} */
        _uiWidget: null,
        /** @type {classes.FolderWidgetBase} */
        _folderPageWidget: null,

        /** Handlers */
        /** @function */
        _uiActivateHandler: null,
        /** @function */
        _pageActivateHandler: null,

        /** @type {HTMLElement} */
        _scrollAreaElement: null,

        /** @type {classes.ContextMenuWidget} */
        _rowBoundWidget: null,

        /** @type {boolean} */
        _hasReduceFilter: false,

        /** @type {boolean} */
        _isTreeView: false,

        /** @type {boolean} */
        _focusOnField: false,

        /**
         * @constructs
         * @param {*} opts - Options passed to the constructor
         */
        constructor: function(opts) {
          opts = opts || {};
          this._uiWidget = opts.uiWidget;
          this._folderPageWidget = opts.folderPageWidget;
          this._isTreeView = Boolean(opts.isTreeView);

          $super.constructor.call(this, opts);
        },

        /**
         * @inheritDoc
         */
        destroy: function() {
          if (this._uiActivateHandler) {
            this._uiActivateHandler();
            this._uiActivateHandler = null;
          }
          if (this._pageActivateHandler) {
            this._pageActivateHandler();
            this._pageActivateHandler = null;
          }
          this._uiWidget = null;
          this._folderPageWidget = null;
          this._scrollAreaElement = null;
          this._rowBoundWidget = null;

          $super.destroy.call(this);
        },

        /**
         * @inheritDoc
         */
        _initElement: function() {
          $super._initElement.call(this);
          this.setFocusable(true);

          // TODO instead of having UserInterfaceWidget which emits an activate signal
          // TODO it should be directly the WindowWidget which should emit the signal
          // TODO also seems buggy we receive activate signal even when window is not added to DOM
          this._uiActivateHandler = this._uiWidget.onActivate(this._whenParentActivated.bind(this));
          if (this._folderPageWidget) {
            this._pageActivateHandler = this._folderPageWidget.onActivate(this._whenParentActivated.bind(this));
          }
        },

        /**
         * When a parent widget is activated (added to DOM actually)
         * Used when parent window or parent folder page are removed from DOM and added again
         * we need to reapply context which are lost when table is removed from DOM
         * (scroll position)
         * @param {Object} opt - option of the emitted signal
         * @private
         */
        _whenParentActivated: function(opt) {},

        /**
         * @inheritDoc
         */
        resetLayout: function() {
          $super.resetLayout.call(this);
          this._rowHeight = 0;
        },

        /**
         * @inheritDoc
         */
        managePriorityKeyDown: function(keyString, domKeyEvent, repeat) {
          var keyProcessed = false;
          if (this._rowBoundWidget && this._rowBoundWidget.isVisible()) {
            keyProcessed = this._rowBoundWidget.managePriorityKeyDown(keyString, domKeyEvent, repeat);
          }
          return keyProcessed;
        },

        /**
         * Set the DOM focus to the widget
         * @param {boolean} [noScroll] - if true try to disable auto scroll
         * @publicdoc
         */
        domFocus: function(noScroll) {
          if (this._element) {
            if (!noScroll) {
              this._element.domFocus();
            } else {
              // try to not scroll when focus
              this._element.domFocus(null, this.getFormWidget().getContainerElement());
            }
          }
        },

        /**
         * Change current row
         * @param {number} row - new current row
         * @param {boolean} [ensureRowVisible] - if true scroll to be sure row is visible (useful when first row is partially visible)
         */
        setCurrentRow: function(row, ensureRowVisible) {
          // TO BE IMPLEMENTED
        },

        /**
         * Returns current row
         * @returns {number} current row
         * @publicdoc
         */
        getCurrentRow: function() {
          return this._currentRow;
        },

        /**
         * Change current column
         * @param {number} col - new current column
         */
        setCurrentColumn: function(col) {
          // TO BE IMPLEMENTED, IF NEEDED
        },

        /**
         * Defines the table pageSize
         * @param {number} pageSize - page size
         */
        setPageSize: function(pageSize) {
          this._setFirstPageSize(pageSize);
          this._pageSize = pageSize;
        },

        /**
         * Keep the first pageSize
         * @param {number} pageSize - page size
         */
        _setFirstPageSize: function(pageSize) {
          if (this._firstPageSize === null && pageSize > 0) {
            this._firstPageSize = pageSize;
          }
        },

        /**
         * Returns page size
         * @returns {?number} the page size
         * @publicdoc
         */
        getPageSize: function() {
          return this._pageSize;
        },

        /**
         * Defines the table bufferSize
         * @param {number} bufferSize - buffer size
         */
        setBufferSize: function(bufferSize) {
          this._bufferSize = bufferSize;
        },

        /**
         * Defines if pageSize is fixed
         * @param {boolean} fixed - true if page size is fixed
         */
        setFixedPageSize: function(fixed) {
          if (this._fixedPageSize !== fixed) {
            this._fixedPageSize = fixed;
            this._layoutInformation.getStretched().setDefaultY(!fixed);
          }
        },

        /**
         * Returns if pageSize is fixed
         * @returns {boolean} true if pageSize is fixed
         * @publicdoc
         */
        isFixedPageSize: function() {
          return this._fixedPageSize;
        },

        /**
         * Returns table size
         * @returns {number} the table size
         * @publicdoc
         */
        getSize: function() {
          return this._size;
        },

        /**
         * Defines the table size (total number of row)
         * @param {number} size - size value
         */
        setSize: function(size) {
          this._size = size;
        },

        /**
         * Defines the table offset
         * @param {number} offset - offset value
         */
        setOffset: function(offset) {
          this._offset = offset;
        },

        /**
         * Returns table offset
         * @returns {number} the table offset
         * @publicdoc
         */
        getOffset: function() {
          return this._offset;
        },

        /**
         * Sets the number of visible rows
         * @param {number} visibleRows - number of visible rows
         */
        setVisibleRows: function(visibleRows) {
          this._visibleRows = visibleRows;
        },

        /**
         * Returns number of visible rows
         * @returns {number} the number of visible rows
         */
        getVisibleRows: function() {
          return this._visibleRows;
        },

        /**
         * Sets if table is in "input" mode.
         * @param {boolean} b - input mode
         * @publicdoc
         */
        setInputMode: function(b) {
          if (this._inputMode !== b) {
            this._inputMode = b;
            this._element.toggleClass("inputMode", Boolean(b));
          }
        },

        /**
         * Returns if table is in input mode.
         * @returns {boolean} true if input mode
         * @publicdoc
         */
        isInputMode: function() {
          return this._inputMode;
        },

        /**
         * Returns if table is in display mode.
         * @returns {boolean} true if display mode
         * @publicdoc
         */
        isDisplayMode: function() {
          return !this._inputMode;
        },

        /**
         * Sets the height of rows
         * @param {number} height - row height (pixels)
         * @publicdoc
         */
        setRowHeight: function(height) {
          this._rowHeight = height;
        },

        /**
         * Returns the row height in pixels
         * @returns {number} row height
         * @publicdoc
         */
        getRowHeight: function() {
          return this._rowHeight;
        },

        /**
         * Call when a widget in the table request the focus
         * @param {classes.WidgetBase} widget - widget that request focus
         * @param {Object} event - event that request focus
         */
        requestFocusFromWidget: function(widget, event) {
          if (this.isEnabled()) {
            widget.emit(context.constants.widgetEvents.requestFocus, event);
          }
        },

        /**
         * @returns {number} table data area height
         */
        getDataAreaHeight: function() {
          return Math.round(this.getLayoutInformation().getAllocated().getHeight() - this.getLayoutInformation().getDecorating().getHeight());
        },

        /**
         * @returns {number} table data area width
         */
        getDataAreaWidth: function() {
          return this.getLayoutInformation().getAllocated().getWidth() - this.getLayoutInformation().getDecorating().getWidth();
        },

        /**
         * Indicates how the row action must be triggered.
         * @param {boolean} b - true if action is triggered by double click (else it is single click)
         */
        setRowActionTriggerByDoubleClick: function(b) {
          this._rowActionTriggerByDoubleClick = b;
        },

        /**
         * Indicates how the row action must be triggered.
         * @returns {boolean} true if action is triggered by double click (else it is single click)
         */
        isRowActionTriggerByDoubleClick: function() {
          return this._rowActionTriggerByDoubleClick;
        },

        /**
         * Defines the highlight color of rows for the table
         * @param {string} color - CSS color
         */
        setHighlightColor: function(color) {
          // TO BE IMPLEMENTED
        },

        /**
         * Defines the highlighted text color of rows for the table
         * @param {string} color - CSS color
         */
        setHighlightTextColor: function(color) {
          // TO BE IMPLEMENTED
        },

        /**
         * Indicates if the current row must be highlighted
         * @param {boolean} b - true if current row must be highlighted
         */
        setHighlightCurrentRow: function(b) {
          this._highlightCurrentRow = b;
        },

        /**
         * Return if the current row must be highlighted
         * @returns {?boolean} true if current row must be highlighted
         * @publicdoc
         */
        isHighlightCurrentRow: function() {
          return this._highlightCurrentRow;
        },

        /**
         * Indicates if the current cell must be highlighted in a table
         * @param {boolean} b - true if current cell must be highlighted
         */
        setHighlightCurrentCell: function(b) {
          this._highlightCurrentCell = b;
        },

        /**
         * Return if the current cell must be highlighted
         * @returns {?boolean} true if current cell must be highlighted
         * @publicdoc
         */
        isHighlightCurrentCell: function() {
          return this._highlightCurrentCell;
        },

        /**
         * Update vertical scroll
         * @param {boolean} [forceScroll] - true to force scrolling
         */
        updateVerticalScroll: function(forceScroll) {
          this.setVerticalScroll(this._size, this._pageSize, this._offset, forceScroll);
        },

        /**
         * Sets vertical scroll parameters
         * BEWARE this code should be the same as ScrollGridWidget::setVerticalScroll
         * @param {?number} size
         * @param {?number} pageSize
         * @param {?number} offset
         * @param {boolean} forceScroll
         */
        setVerticalScroll: function(size, pageSize, offset, forceScroll) {
          // TO BE IMPLEMENTED
        },

        /**
         * Returns scrollable area DOM Element
         * @returns {HTMLElement} scrollable area DOM Element
         */
        getScrollableArea: function() {
          // TO BE IMPLEMENTED
        },

        /**
         * Returns rowBound widget
         * @returns {classes.ContextMenuWidget} rowBound
         */
        getRowBoundWidget: function() {
          return this._rowBoundWidget;
        },

        /**
         * Returns if rowBound is activated
         * @returns {boolean} rowBound activated ?
         */
        hasRowBound: function() {
          return this._rowBoundWidget !== null;
        },

        /**
         * Indicates if the table can have a reduce filter
         * @param {boolean} b - true if table can have a reduce filter
         */
        setReduceFilter: function(b) {
          this._hasReduceFilter = b;
        },

        /**
         * Return if the table can have a reduce filter
         * @returns {boolean} true if table can have a reduce filter
         */
        hasReduceFilter: function() {
          return this._hasReduceFilter;
        },

        /**
         * Returns if table is a tree
         * @returns {boolean} true if table is a tree
         * @publicdoc
         */
        isTreeView: function() {
          return this._isTreeView;
        },

        /**
         * Sets table is scrolling
         * @param {boolean} up - scrolling up
         * @param {boolean} down - scrolling down
         */
        setScrolling: function(up, down) {},

        /**
         * Defines if focus in on a field (table item) or (default) on a row
         * @param {boolean} focusOnField - true if focus on field activated
         */
        setFocusOnField: function(focusOnField) {
          this._focusOnField = focusOnField;
        },

        /**
         * Returns if focus is on a field (table item) (by default focus is on a row)
         * @returns {boolean} true if focus on field activated
         */
        hasFocusOnField: function() {
          return this._focusOnField;
        },
      };
    });
  });