uicore-ts/compiledScripts/UISlideScrollerView.js

UICore is a library to build native-like user interfaces using pure Typescript. No HTML is needed at all. Components are described as TS classes and all user interactions are handled explicitly. This library is strongly inspired by the UIKit framework tha

"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var UISlideScrollerView_exports = {};
__export(UISlideScrollerView_exports, {
  UISlideScrollerView: () => UISlideScrollerView
});
module.exports = __toCommonJS(UISlideScrollerView_exports);
var import_UIButton = require("./UIButton");
var import_UIColor = require("./UIColor");
var import_UICore = require("./UICore");
var import_UIObject = require("./UIObject");
var import_UIRectangle = require("./UIRectangle");
var import_UIScrollView = require("./UIScrollView");
var import_UITimer = require("./UITimer");
var import_UIView = require("./UIView");
class UISlideScrollerView extends import_UIView.UIView {
  constructor(elementID, viewHTMLElement) {
    super(elementID, viewHTMLElement);
    this._targetIndex = 0;
    this._isAnimating = import_UIObject.NO;
    this._isAnimationOngoing = import_UIObject.NO;
    this._slideViews = [];
    this.wrapAround = import_UIObject.YES;
    this.animationDuration = 0.35;
    this.animationDelay = 2;
    this._currentPageIndex = 0;
    this._scrollView = new import_UIScrollView.UIScrollView(elementID + "ScrollView");
    this.addSubview(this._scrollView);
    this._scrollView._scrollEnabled = import_UIObject.NO;
    this._scrollView.addTargetForControlEvent(
      import_UIView.UIView.controlEvent.PointerMove,
      (sender, event2) => {
        var _a;
        if (event2 instanceof MouseEvent) {
          (_a = this._animationTimer) == null ? void 0 : _a.invalidate();
        }
      }
    );
    this._scrollView.addTargetForControlEvent(import_UIView.UIView.controlEvent.PointerLeave, () => {
      if (this._isAnimating && event instanceof MouseEvent) {
        this.startAnimating();
      }
    });
    this._scrollView.addTargetForControlEvent(import_UIView.UIView.controlEvent.PointerDown, (sender, event2) => {
      var _a;
      if (event2 instanceof TouchEvent) {
        (_a = this._animationTimer) == null ? void 0 : _a.invalidate();
      }
    });
    this._scrollView.addTargetForControlEvents([
      import_UIView.UIView.controlEvent.PointerUp,
      import_UIView.UIView.controlEvent.PointerCancel
    ], (sender, event2) => {
      if (event2 instanceof TouchEvent && this._isAnimating) {
        this.startAnimating();
      }
    });
    this.pageIndicatorsView = new import_UIView.UIView(elementID + "PageIndicatorsView");
    this.addSubview(this.pageIndicatorsView);
  }
  buttonForPageIndicatorWithIndex(index) {
    const result = new import_UIButton.UIButton(this.viewHTMLElement.id + "PageIndicatorButton" + index);
    result.addTargetForControlEvents([
      import_UIView.UIView.controlEvent.PointerUpInside,
      import_UIView.UIView.controlEvent.EnterUp
    ], (sender, event2) => {
      this.scrollToPageWithIndex(index, import_UIObject.YES);
      if (this._isAnimating) {
        this.startAnimating();
      }
    });
    result.addTargetForControlEvent(import_UIView.UIView.controlEvent.PointerMove, () => {
      var _a;
      (_a = this._animationTimer) == null ? void 0 : _a.invalidate();
    });
    result.updateContentForNormalState = () => {
      result.backgroundColor = import_UIColor.UIColor.blueColor;
      (0, import_UIObject.FIRST_OR_NIL)(result.titleLabel).textColor = import_UIColor.UIColor.whiteColor;
    };
    result.frame = new import_UIRectangle.UIRectangle(import_UIObject.nil, import_UIObject.nil, 20, 50);
    result.style.display = "table-cell";
    result.style.position = "relative";
    return result;
  }
  addSlideView(view) {
    this.slideViews.push(view);
    this.updateSlideViews();
  }
  set slideViews(views) {
    this._slideViews = views;
    this.updateSlideViews();
  }
  get slideViews() {
    return this._slideViews;
  }
  get currentPageIndex() {
    return this._currentPageIndex;
  }
  set currentPageIndex(index) {
    this._currentPageIndex = index;
    this._slideViews[index].willAppear();
    this._scrollView.contentOffset = this._scrollView.contentOffset.pointWithX(-this._slideViews[index].frame.min.x);
    this.pageIndicatorsView.subviews.everyElement.selected = import_UIObject.NO;
    this.pageIndicatorsView.subviews[index].selected = import_UIObject.YES;
  }
  scrollToPreviousPage(animated) {
    if (this.slideViews.length == 0) {
      return;
    }
    var targetIndex = this.currentPageIndex;
    if (this.wrapAround) {
      targetIndex = (this.currentPageIndex - 1) % this.slideViews.length;
    } else if (this.currentPageIndex - 1 < this.slideViews.length) {
      targetIndex = this.currentPageIndex - 1;
    } else {
      return;
    }
    this.scrollToPageWithIndex(targetIndex, animated);
  }
  scrollToNextPage(animated) {
    if (this.slideViews.length == 0) {
      return;
    }
    var targetIndex = this.currentPageIndex;
    if (this.wrapAround) {
      targetIndex = (this.currentPageIndex + 1) % this.slideViews.length;
    } else if (this.currentPageIndex + 1 < this.slideViews.length) {
      targetIndex = this.currentPageIndex + 1;
    } else {
      return;
    }
    this.scrollToPageWithIndex(targetIndex, animated);
  }
  scrollToPageWithIndex(targetIndex, animated = import_UIObject.YES) {
    this._targetIndex = targetIndex;
    this.willScrollToPageWithIndex(targetIndex);
    this._isAnimationOngoing = import_UIObject.YES;
    if (animated) {
      import_UIView.UIView.animateViewOrViewsWithDurationDelayAndFunction(
        this._scrollView.containerView,
        this.animationDuration,
        0,
        void 0,
        function() {
          this.currentPageIndex = targetIndex;
        }.bind(this),
        function() {
          this.didScrollToPageWithIndex(targetIndex);
          this._isAnimationOngoing = import_UIObject.NO;
        }.bind(this)
      );
    } else {
      this.currentPageIndex = targetIndex;
      this.didScrollToPageWithIndex(targetIndex);
    }
  }
  willScrollToPageWithIndex(index) {
    const targetView = this.slideViews[index];
    if ((0, import_UIObject.IS)(targetView) && targetView.willAppear && targetView.willAppear instanceof Function) {
      targetView.willAppear();
    }
  }
  didScrollToPageWithIndex(index) {
  }
  startAnimating() {
    var _a;
    this._isAnimating = import_UIObject.YES;
    (_a = this._animationTimer) == null ? void 0 : _a.invalidate();
    this._animationTimer = new import_UITimer.UITimer(this.animationDelay + this.animationDuration, import_UIObject.YES, () => {
      this.scrollToNextPage(import_UIObject.YES);
    });
  }
  stopAnimating() {
    var _a;
    this._isAnimating = import_UIObject.NO;
    (_a = this._animationTimer) == null ? void 0 : _a.invalidate();
  }
  updateSlideViews() {
    this._scrollView.containerView.subviews.slice().forEach(function(subview, index, array) {
      subview.removeFromSuperview();
    });
    this.pageIndicatorsView.subviews.slice().forEach(function(subview, index, array) {
      subview.removeFromSuperview();
    });
    this._slideViews.forEach((view, index) => {
      this._scrollView.addSubview(view);
      this.pageIndicatorsView.addSubview(this.buttonForPageIndicatorWithIndex(index));
    });
  }
  didReceiveBroadcastEvent(event2) {
    super.didReceiveBroadcastEvent(event2);
    if (event2.name == import_UICore.UICore.broadcastEventName.WindowDidResize) {
      this.currentPageIndex = this.currentPageIndex;
    }
  }
  set frame(frame) {
    super.frame = frame;
    this.currentPageIndex = this.currentPageIndex;
  }
  get frame() {
    return super.frame;
  }
  layoutSubviews() {
    super.layoutSubviews();
    if (this.bounds.isEqualTo(this._previousLayoutBounds)) {
      return;
    }
    const bounds = this.bounds;
    this._previousLayoutBounds = bounds;
    this._scrollView.frame = bounds;
    this._scrollView.containerView.frame = bounds.rectangleWithWidth(bounds.width * this.slideViews.length).performFunctionWithSelf(function(self) {
      self.offsetByPoint(this._scrollView.contentOffset);
      return self;
    }.bind(this));
    this._slideViews.forEach((view, index) => {
      view.frame = bounds.rectangleWithX((this.bounds.width + 1) * index);
    });
    this.layoutPageIndicators();
  }
  layoutPageIndicators() {
    this.pageIndicatorsView.centerXInContainer();
    this.pageIndicatorsView.style.bottom = "20px";
    this.pageIndicatorsView.style.height = "20px";
    this.pageIndicatorsView.style.display = "table-row";
  }
  removeFromSuperview() {
    super.removeFromSuperview();
    this.stopAnimating();
  }
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  UISlideScrollerView
});
//# sourceMappingURL=UISlideScrollerView.js.map