lyb-pixi-js 1.12.31 → 1.12.33

package/Components/Custom/LibPixiSlide.d.ts

@@ -1,94 +0,0 @@
-import { Container } from "pixi.js";
-import { LibPixiContainer } from "../Base/LibPixiContainer";
-export interface LibPixiSlideParams {
-    /** 舞台 */
-    stage: Container;
-    /** 当前方向 */
-    direction: "x" | "y";
-    /** 滚动区域宽度 */
-    width: number;
-    /** 滚动区域高度 */
-    height: number;
-    /** 一页宽度 */
-    pageWidth?: number;
-    /** 一页高度 */
-    pageHeight?: number;
-    /** 滚动的容器 */
-    content: Container;
-    /** 元素列表 */
-    itemList: Container[];
-    /** 是否启用循环 */
-    loop?: boolean;
-    /** 景深定制回调，第二参数函数参数景深衰减值，可视区三个元素时，建议0.5，五个元素时，建议0.2 */
-    depthCallback?: (container: Container, getValue: (depthAtten: number) => number) => void;
-    /** 松手回调 */
-    slideCallback?: (index: number) => void;
-    /** 滚动回调 */
-    scrollCallback?: (x: number, index: number) => void;
-}
-/** @description 滑动页
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiSlide-滑动页
- */
-export declare class LibPixiSlide extends LibPixiContainer {
-    /** 舞台 */
-    private _stage;
-    /** 滑动加速度触发翻页 */
-    private _SPEED_THRESHOLD;
-    /** 滑动比例翻页 */
-    private _SCROLL_THRESHOLD;
-    /** 当前方向 */
-    private _direction;
-    /** 元素列表 */
-    private _itemList;
-    /** 一页宽度 */
-    private _pageWidth;
-    /** 一页高度 */
-    private _pageHeight;
-    /** 是否循环 */
-    private _loop;
-    /** 两侧预留格数，如可视区有三个，则两侧预留为1 */
-    private _freeGridNum;
-    /** 当前幻灯片索引 */
-    private _currentIndex;
-    /** 记录拖动开始时的X坐标 */
-    private _startX;
-    /** 记录拖动开始时的Y坐标 */
-    private _startY;
-    /** 偏移量 */
-    private _offsetX;
-    /** 偏移量 */
-    private _offsetY;
-    /** 最大索引 */
-    private _pageNum;
-    /** 记录开始时间 */
-    private _startTime;
-    /** 是否正在拖动 */
-    private _isDragging;
-    /** 滑动内容 */
-    private _slideArea;
-    /** 景深定制回调 */
-    private _depthCallback?;
-    /** 滑动回调 */
-    private _slideCallback?;
-    /** 滚动回调 */
-    private _scrollCallback?;
-    constructor(params: LibPixiSlideParams);
-    /** @description 更新坐标 */
-    updatePosition(v: number, index: number): void;
-    /** @description 上一页 */
-    prev(): void;
-    /** @description 下一页 */
-    next(): void;
-    /** @description 滑动到指定索引 */
-    slideTo(index: number): void;
-    /** @description 设置滚动景深 */
-    private _setDepth;
-    /** @description 开始拖动 */
-    private _onDragStart;
-    /** @description 拖动中 */
-    private _onDragMove;
-    /** @description 滚动触发 */
-    private _onScroll;
-    /** @description 结束拖动 */
-    private _onDragEnd;
-}

package/Components/Custom/LibPixiSlide.js

@@ -1,285 +0,0 @@
-import { Graphics } from "pixi.js";
-import gsap from "gsap";
-import { libPixiEvent } from "../../Utils/LibPixiEvent";
-import { LibPixiContainer } from "../Base/LibPixiContainer";
-/** @description 滑动页
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiSlide-滑动页
- */
-export class LibPixiSlide extends LibPixiContainer {
-    constructor(params) {
-        const { stage, width, height, content, depthCallback, slideCallback, scrollCallback, pageWidth = 0, pageHeight = 0, itemList, loop = false, direction, } = params;
-        super(width, height);
-        /** 滑动加速度触发翻页 */
-        this._SPEED_THRESHOLD = 0.35;
-        /** 滑动比例翻页 */
-        this._SCROLL_THRESHOLD = 0.5;
-        /** 一页宽度 */
-        this._pageWidth = 0;
-        /** 一页高度 */
-        this._pageHeight = 0;
-        /** 是否循环 */
-        this._loop = false;
-        /** 两侧预留格数，如可视区有三个，则两侧预留为1 */
-        this._freeGridNum = 0;
-        /** 当前幻灯片索引 */
-        this._currentIndex = 0;
-        /** 记录拖动开始时的X坐标 */
-        this._startX = 0;
-        /** 记录拖动开始时的Y坐标 */
-        this._startY = 0;
-        /** 偏移量 */
-        this._offsetX = 0;
-        /** 偏移量 */
-        this._offsetY = 0;
-        /** 最大索引 */
-        this._pageNum = 0;
-        /** 记录开始时间 */
-        this._startTime = new Date().getTime();
-        /** 是否正在拖动 */
-        this._isDragging = false;
-        this._stage = stage;
-        const mask = new Graphics();
-        mask.beginFill(0xffffff);
-        mask.drawRect(0, 0, this.width, this.height);
-        mask.endFill();
-        this.addChild(mask);
-        this.mask = mask;
-        this._direction = direction;
-        this._pageWidth = pageWidth;
-        this._pageHeight = pageHeight;
-        this._slideArea = content;
-        this._itemList = itemList;
-        this._loop = loop;
-        this._depthCallback = depthCallback;
-        this._slideCallback = slideCallback;
-        this._scrollCallback = scrollCallback;
-        this._pageNum = itemList.length;
-        this.addChild(this._slideArea);
-        if (this._direction === "x") {
-            this._freeGridNum = Math.floor(width / this._pageWidth / 2);
-            this._slideArea.x = this._pageWidth * this._freeGridNum;
-        }
-        else {
-            this._freeGridNum = Math.floor(height / pageHeight / 2);
-            this._slideArea.y = this._pageHeight * this._freeGridNum;
-        }
-        this.eventMode = "static";
-        this.cursor = "pointer";
-        this._setDepth();
-        libPixiEvent(this, "pointerdown", this._onDragStart.bind(this));
-        libPixiEvent(stage, "pointermove", this._onDragMove.bind(this));
-        libPixiEvent(stage, "pointerup", this._onDragEnd.bind(this));
-    }
-    /** @description 更新坐标 */
-    updatePosition(v, index) {
-        this._currentIndex = index;
-        this._setDepth();
-        if (this._direction === "x") {
-            this._slideArea.x = v;
-        }
-        else {
-            this._slideArea.y = v;
-        }
-    }
-    /** @description 上一页 */
-    prev() {
-        this.slideTo(this._currentIndex - 1);
-    }
-    /** @description 下一页 */
-    next() {
-        this.slideTo(this._currentIndex + 1);
-    }
-    /** @description 滑动到指定索引 */
-    slideTo(index) {
-        var _a;
-        this._currentIndex = index;
-        //首尾限制
-        if (this._currentIndex < 0) {
-            if (this._loop) {
-                this._currentIndex = this._pageNum - 1;
-            }
-            else {
-                this._currentIndex = 0;
-            }
-        }
-        else if (this._currentIndex >= this._pageNum) {
-            this._currentIndex = this._pageNum;
-            if (this._loop) {
-                this._currentIndex = 0;
-            }
-            else {
-                this._currentIndex--;
-            }
-        }
-        if (this._direction === "x") {
-            gsap.to(this._slideArea, {
-                x: -this._currentIndex * this._pageWidth +
-                    this._pageWidth * this._freeGridNum,
-                duration: 0.25,
-                onUpdate: () => {
-                    this._onScroll();
-                },
-            });
-        }
-        else {
-            gsap.to(this._slideArea, {
-                y: -this._currentIndex * this._pageHeight +
-                    this._pageHeight * this._freeGridNum,
-                duration: 0.25,
-                onUpdate: () => {
-                    this._onScroll();
-                },
-            });
-        }
-        // 触发滑动结束回调
-        (_a = this._slideCallback) === null || _a === void 0 ? void 0 : _a.call(this, this._currentIndex);
-    }
-    /** @description 设置滚动景深 */
-    _setDepth() {
-        if (!this._depthCallback)
-            return;
-        let t = 0;
-        let currentIndex = 0;
-        if (this._direction === "x") {
-            const x = this._slideArea.x;
-            const startX = this._freeGridNum * this._pageWidth;
-            //设置起始位置，获取当前绝对坐标
-            const absX = Math.abs(x - startX);
-            // 根据滑动宽度计算出当前位置对应的索引
-            currentIndex = Math.floor(absX / this._pageWidth);
-            // 计算当前索引在一页中的比例，越靠近当前索引的x坐标，值越小，范围0-1
-            t = (absX % this._pageWidth) / this._pageWidth;
-            //如果在起点的时候还在向左滑，则取反,避免distance显示效果计算错误
-            if (x - startX > 0) {
-                t = -t;
-                currentIndex = -currentIndex;
-            }
-        }
-        else {
-            const y = this._slideArea.y;
-            const startY = this._freeGridNum * this._pageHeight;
-            //设置起始位置，获取当前绝对坐标
-            const absY = Math.abs(y - startY);
-            // 根据滑动宽度计算出当前位置对应的索引
-            currentIndex = Math.floor(absY / this._pageHeight);
-            // 计算当前索引在一页中的比例，越靠近当前索引的x坐标，值越小，范围0-1
-            t = (absY % this._pageHeight) / this._pageHeight;
-            //如果在起点的时候还在向左滑，则取反,避免distance显示效果计算错误
-            if (y - startY > 0) {
-                t = -t;
-                currentIndex = -currentIndex;
-            }
-        }
-        this._itemList.forEach((item, i) => {
-            var _a;
-            // 计算当前项与目标索引之间的索引距离
-            const distance = Math.abs(i - currentIndex - t);
-            (_a = this._depthCallback) === null || _a === void 0 ? void 0 : _a.call(this, item, (depthAtten) => {
-                return Math.max(0, 1 - distance * depthAtten);
-            });
-        });
-    }
-    /** @description 开始拖动 */
-    _onDragStart(event) {
-        const { x, y } = this._stage.toLocal(event.global);
-        this._isDragging = true;
-        gsap.killTweensOf(this._slideArea);
-        this._startTime = new Date().getTime();
-        if (this._direction === "x") {
-            this._startX = x;
-            this._offsetX = this._slideArea.x;
-        }
-        else {
-            this._startY = y;
-            this._offsetY = this._slideArea.y;
-        }
-    }
-    /** @description 拖动中 */
-    _onDragMove(event) {
-        if (!this._isDragging)
-            return;
-        const { x, y } = this._stage.toLocal(event.global);
-        if (this._direction === "x") {
-            const moveX = x - this._startX;
-            this._slideArea.x = this._offsetX + moveX;
-        }
-        else {
-            const moveY = y - this._startY;
-            this._slideArea.y = this._offsetY + moveY;
-        }
-        this._onScroll();
-    }
-    /** @description 滚动触发 */
-    _onScroll() {
-        var _a, _b;
-        this._setDepth();
-        if (this._direction === "x") {
-            (_a = this._scrollCallback) === null || _a === void 0 ? void 0 : _a.call(this, this._slideArea.x, this._currentIndex);
-        }
-        else {
-            (_b = this._scrollCallback) === null || _b === void 0 ? void 0 : _b.call(this, this._slideArea.y, this._currentIndex);
-        }
-    }
-    /** @description 结束拖动 */
-    _onDragEnd(event) {
-        const { x, y } = this._stage.toLocal(event.global);
-        if (this._direction === "x") {
-            if (!this._isDragging)
-                return;
-            this._isDragging = false;
-            //滑动耗时
-            const slideTime = new Date().getTime() - this._startTime;
-            //滑动距离
-            const slide = this._startX - x;
-            //滑动速度
-            const slideSpeed = Math.abs(slide) / slideTime;
-            //要滑动的页数
-            const pageChange = Math.round(slide / this._pageWidth);
-            //如果滑动超过阈值，则翻页
-            if (Math.abs(slide) > this._pageWidth * this._SCROLL_THRESHOLD) {
-                this._currentIndex += pageChange;
-            }
-            //如果滑动速度大于阈值，则翻页
-            else if (slideSpeed > this._SPEED_THRESHOLD) {
-                let addIndex = slide / this._pageWidth;
-                if (addIndex > 0) {
-                    addIndex = Math.ceil(addIndex);
-                }
-                else {
-                    addIndex = Math.floor(addIndex);
-                }
-                this._currentIndex += addIndex;
-            }
-            this.slideTo(this._currentIndex);
-        }
-        else {
-            if (!this._isDragging)
-                return;
-            this._isDragging = false;
-            //滑动耗时
-            const slideTime = new Date().getTime() - this._startTime;
-            //滑动距离
-            const slide = this._startY - y;
-            //滑动速度
-            const slideSpeed = Math.abs(slide) / slideTime;
-            //要滑动的页数
-            const pageChange = Math.round(slide / this._pageHeight);
-            //如果滑动超过阈值，则翻页
-            if (Math.abs(slide) > this._pageHeight * this._SCROLL_THRESHOLD) {
-                this._currentIndex += pageChange;
-            }
-            //如果滑动速度大于阈值，则翻页
-            else if (slideSpeed > this._SPEED_THRESHOLD) {
-                let addIndex = slide / this._pageHeight;
-                if (addIndex > 0) {
-                    addIndex = Math.ceil(addIndex);
-                }
-                else {
-                    addIndex = Math.floor(addIndex);
-                }
-                this._currentIndex += addIndex;
-            }
-            this.slideTo(this._currentIndex);
-        }
-    }
-}

package/Components/Custom/LibPixiSlider.d.ts

@@ -1,82 +0,0 @@
-import { Container } from "pixi.js";
-import { LibPixiContainer } from "../Base/LibPixiContainer";
-interface LibPixiSliderParams {
-    /** 滑动区域宽度 */
-    width: number;
-    /** 滑动区域高度 */
-    height: number;
-    /** 滑动页列表 */
-    slideList: Container[];
-    /** 是否启用循环滑动 */
-    loop?: boolean;
-    /** 是否启用景深 */
-    enableDepth?: boolean;
-    /** 景深透明度 */
-    depthAlpha?: number;
-    /** 景深缩放 */
-    depthScale?: number;
-    /** 滑动回调 */
-    slideCallback: (pageIndex: number, _pageNum: number) => void;
-}
-/** @description 类似轮播图，但是不会自动轮播
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiSlider-横向滑动图
- */
-export declare class LibPixiSlider extends LibPixiContainer {
-    /** 当前幻灯片索引 */
-    private _currentIndex;
-    /** 滑动区域宽度 */
-    private _slideWidth;
-    /** 滑动区域高度 */
-    private _slideHeight;
-    /** 是否启用循环 */
-    private _loop;
-    /** 记录拖动开始时的X坐标 */
-    private _startX;
-    /** 偏移量 */
-    private _offsetX;
-    /** 最大索引 */
-    private _pageNum;
-    /** 记录开始时间 */
-    private _startTime;
-    private _isDragging;
-    /** 滑动内容 */
-    private _slideArea;
-    /** 是否启用景深 */
-    private _enableDepth;
-    /** 景深透明度 */
-    private _depthAlpha;
-    /** 景深缩放 */
-    private _depthScale;
-    /** 滑动容器列表 */
-    private _slideList;
-    /** @description 滑动回调 */
-    private slideCallback;
-    /**
-     * @param width 宽度
-     * @param height 高度
-     * @param content 内容
-     * @param slideCallback 滑动结束回调
-     */
-    constructor(params: LibPixiSliderParams);
-    /** @description 上一页 */
-    prev(): void;
-    /** @description 下一页 */
-    next(): void;
-    /** @description 滑动到指定索引
-     * @param index 索引
-     */
-    private _slideTo;
-    /** @description 开始拖动 */
-    private _onDragStart;
-    /** @description 拖动中 */
-    private _onDragMove;
-    /** @description 结束拖动 */
-    private _onDragEnd;
-    /** @description 设置滚动景深
-     * @param containerList 元素列表
-     * @param y 拖动Y坐标
-     * @param startY 内部将y - startY进行计算
-     */
-    private _setDepth;
-}
-export {};

package/Components/Custom/LibPixiSlider.js

@@ -1,165 +0,0 @@
-import { Container } from "pixi.js";
-import gsap from "gsap";
-import { LibJsLerp } from "lyb-js/Math/LibJsLerp.js";
-import { libPixiOverflowHidden } from "../../Utils/LibPixiOverflowHidden";
-import { LibPixiContainer } from "../Base/LibPixiContainer";
-import { libPixiEvent } from "../../Utils/LibPixiEvent";
-/** @description 类似轮播图，但是不会自动轮播
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiSlider-横向滑动图
- */
-export class LibPixiSlider extends LibPixiContainer {
-    /**
-     * @param width 宽度
-     * @param height 高度
-     * @param content 内容
-     * @param slideCallback 滑动结束回调
-     */
-    constructor(params) {
-        const { width, height, slideList, slideCallback, loop = false, enableDepth = false, depthAlpha = 0.5, depthScale = 0.5, } = params;
-        super(width, height);
-        /** 当前幻灯片索引 */
-        this._currentIndex = 0;
-        /** 滑动区域宽度 */
-        this._slideWidth = 0;
-        /** 滑动区域高度 */
-        this._slideHeight = 0;
-        /** 是否启用循环 */
-        this._loop = false;
-        /** 记录拖动开始时的X坐标 */
-        this._startX = 0;
-        /** 偏移量 */
-        this._offsetX = 0;
-        /** 最大索引 */
-        this._pageNum = 0;
-        /** 记录开始时间 */
-        this._startTime = new Date().getTime();
-        /* 是否正在拖动 */
-        this._isDragging = false;
-        libPixiOverflowHidden(this);
-        this._slideArea = new Container();
-        this._slideWidth = width;
-        this._slideHeight = height;
-        this._loop = loop;
-        this._slideList = slideList;
-        this._enableDepth = enableDepth;
-        this._depthAlpha = depthAlpha;
-        this._depthScale = depthScale;
-        this.slideCallback = slideCallback;
-        this._pageNum = slideList.length - 1;
-        this._slideList.forEach((item, index) => {
-            this._slideArea.addChild(item);
-            item.x = index * width + this._slideWidth / 2;
-            item.y = this._slideHeight / 2;
-            item.pivot.set(this._slideWidth / 2, this._slideHeight / 2);
-        });
-        this.addChild(this._slideArea);
-        libPixiEvent(this, "pointerdown", this._onDragStart.bind(this));
-        window.addEventListener("pointermove", this._onDragMove.bind(this));
-        window.addEventListener("pointerup", this._onDragEnd.bind(this));
-    }
-    /** @description 上一页 */
-    prev() {
-        this._slideTo(this._currentIndex - 1);
-    }
-    /** @description 下一页 */
-    next() {
-        this._slideTo(this._currentIndex + 1);
-    }
-    /** @description 滑动到指定索引
-     * @param index 索引
-     */
-    _slideTo(index) {
-        let x = 0;
-        if (this._loop) {
-            this._currentIndex =
-                (index + this._slideList.length) % this._slideList.length;
-            x = -this._currentIndex * this._slideWidth;
-        }
-        else {
-            if (index < 0) {
-                // 回弹到第一张
-                x = 0;
-                this._currentIndex = 0;
-            }
-            else if (index > this._pageNum) {
-                // 回弹到最后一张
-                x = -this._pageNum * this._slideWidth;
-                this._currentIndex = this._pageNum;
-            }
-            else {
-                // 正常滑动
-                x = -index * this._slideWidth;
-                this._currentIndex = index;
-            }
-        }
-        gsap.to(this._slideArea, {
-            x,
-            duration: 0.25,
-            onUpdate: () => {
-                this._setDepth();
-            },
-        });
-        this.slideCallback(this._currentIndex, this._pageNum);
-    }
-    /** @description 开始拖动 */
-    _onDragStart(event) {
-        this._isDragging = true;
-        this._startX = event.global.x;
-        this._offsetX = this._slideArea.x;
-        gsap.killTweensOf(this._slideArea);
-        this._startTime = new Date().getTime();
-    }
-    /** @description 拖动中 */
-    _onDragMove(event) {
-        if (!this._isDragging)
-            return;
-        const moveX = event.pageX - this._startX;
-        this._slideArea.x = this._offsetX + moveX;
-        this._setDepth();
-    }
-    /** @description 结束拖动 */
-    _onDragEnd(event) {
-        if (!this._isDragging)
-            return;
-        this._isDragging = false;
-        const endTime = new Date().getTime() - this._startTime;
-        const slide = this._startX - event.pageX;
-        const slideSpeed = Math.abs(slide) / endTime;
-        //滑动距离阈值，滑动到一半以上必定翻页
-        const slideThreshold = this._slideWidth / 2;
-        //滑动速度阈值，滑动速度大于这个值，必定翻页
-        const speedThreshold = 0.275;
-        //如果滑动距离大于阈值，或速度大于阈值翻页
-        if (Math.abs(slide) > slideThreshold || slideSpeed > speedThreshold) {
-            slide > 0 ? this._currentIndex++ : this._currentIndex--;
-        }
-        this._slideTo(this._currentIndex);
-    }
-    /** @description 设置滚动景深
-     * @param containerList 元素列表
-     * @param y 拖动Y坐标
-     * @param startY 内部将y - startY进行计算
-     */
-    _setDepth() {
-        if (!this._enableDepth)
-            return;
-        const Y = this._slideArea.x;
-        const idx = Math.floor(Math.abs(Y) / this._slideWidth);
-        const t = (Math.abs(Y) % this._slideWidth) / this._slideWidth;
-        const prevIdx = idx - 1;
-        const nextIdx = idx + 1;
-        const curItem = this._slideList[idx];
-        curItem.alpha = LibJsLerp(this._depthAlpha, 1, 1 - t);
-        curItem.scale.set(LibJsLerp(this._depthScale, 1, 1 - t));
-        if (nextIdx < this._slideList.length) {
-            const nextItem = this._slideList[nextIdx];
-            nextItem.alpha = LibJsLerp(this._depthAlpha, 1, t);
-            nextItem.scale.set(LibJsLerp(this._depthScale, 1, t));
-        }
-        if (prevIdx >= 0) {
-            const prevItem = this._slideList[prevIdx];
-            prevItem.alpha = LibJsLerp(this._depthAlpha, 1, 1 - t);
-            prevItem.scale.set(LibJsLerp(this._depthScale, 1, 1 - t));
-        }
-    }
-}

package/Components/Custom/LibPixiSubAddMinMax.d.ts

@@ -1,40 +0,0 @@
-export interface LibPixiSubAddMinMaxParams {
-    /** 初始下注索引 */
-    initialBetIndex: number;
-    /** 下注金额列表 */
-    betAmountListLength: number;
-    /** 金额更新回调
-     * @param index 金额索引
-     */
-    onAmountIndex: (index: number) => void;
-    /** 按钮置灰状态回调
-     * @param type 被置灰的按钮类型
-     */
-    onDisabled: (type?: "min" | "max") => void;
-}
-/** @description 最小、最大按钮和增减按钮功能及置灰逻辑
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiSubAddMinMax-数字控制器
- */
-export declare class LibPixiSubAddMinMax {
-    /** 步进器 */
-    private _baseNumSteper;
-    /** 金额列表数量 */
-    private _betAmountListLength;
-    /** 金额更新回调 */
-    private _onAmountIndex;
-    /** 按钮置灰状态回调 */
-    private _onDisabled;
-    constructor(params: LibPixiSubAddMinMaxParams);
-    /** @description 点击最小按钮 */
-    min(): void;
-    /** @description 点击最大按钮 */
-    max(): void;
-    /** @description 点击减少按钮 */
-    sub(): void;
-    /** @description 点击增加按钮 */
-    add(): void;
-    /** @description 改变最小最大按钮状态及回调
-     * @param index 索引
-     */
-    minMaxUpdateIndex(index: number): void;
-}