pixuireactcomponents 1.1.22 → 1.1.23

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "pixuireactcomponents",
-    "version": "1.1.22",
+    "version": "1.1.23",
     "description": "pixui react components",
     "main": "index.js",
     "scripts": {

package/ui/components/slapface/Slapface.js

@@ -25,6 +25,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { h, Component } from "preact";
+//@ts-ignore
 import SlapfaceLess from "./less/Slapface.less";
 //默认配置项
 var settingsitems = {
@@ -37,24 +38,24 @@ var jumpButton = {
     pic_yaxia: '',
     pic_xuanfu: ''
 };
-var node = /** @class */ (function () {
-    function node(par_index) {
+var slapfaceNode = /** @class */ (function () {
+    function slapfaceNode(par_index) {
         if (par_index == undefined)
             this.index = -1;
         else
             this.index = par_index;
         this.next = null;
     }
-    return node;
+    return slapfaceNode;
 }());
-var nodeList = /** @class */ (function () {
-    function nodeList(groupArr) {
-        this.head = new node();
+var slapfaceNodeList = /** @class */ (function () {
+    function slapfaceNodeList(groupArr) {
+        this.head = new slapfaceNode();
         var cur = this.head;
         this.size = 0;
         if (groupArr) {
             for (var i = 0; i < groupArr.length; i++) {
-                cur.next = new node(i);
+                cur.next = new slapfaceNode(i);
                 cur = cur.next;
             }
             this.groupArr = groupArr;
@@ -62,13 +63,13 @@ var nodeList = /** @class */ (function () {
         }
         this.tail = cur;
     }
-    nodeList.prototype.Add = function (index, next) {
-        this.tail.next = new node(index);
+    slapfaceNodeList.prototype.Add = function (index, next) {
+        this.tail.next = new slapfaceNode(index);
         this.tail = this.tail.next;
         ++this.size;
         return this.tail;
     };
-    nodeList.prototype.DeleteNext = function (curParam) {
+    slapfaceNodeList.prototype.DeleteNext = function (curParam) {
         if (curParam.next == null)
             return;
         else {
@@ -76,7 +77,7 @@ var nodeList = /** @class */ (function () {
         }
         --this.size;
     };
-    nodeList.prototype.CheckReady = function () {
+    slapfaceNodeList.prototype.CheckReady = function () {
         var cur = this.head;
         while (cur.next != null) {
             if (this.groupArr[cur.next.index].isLoadDone) {
@@ -90,7 +91,7 @@ var nodeList = /** @class */ (function () {
         }
         return -1;
     };
-    return nodeList;
+    return slapfaceNodeList;
 }());
 var Slapface = /** @class */ (function (_super) {
     __extends(Slapface, _super);
@@ -136,9 +137,10 @@ var Group = /** @class */ (function (_super) {
             }
         ];
         _this.groupArr = emptyGroup.concat(_this.props.LoadGroup);
-        _this.groupIndexList = new nodeList(_this.groupArr);
+        _this.groupIndexList = new slapfaceNodeList(_this.groupArr);
         _this.loadDisplay = "hidden";
         _this.elseDisplay = "visible";
+        _this.firstFrameDisplay = "none";
         _this.state = {
             curIndex: _this.groupIndexList.CheckReady()
         };
@@ -146,11 +148,15 @@ var Group = /** @class */ (function (_super) {
     }
     Group.prototype.componentDidMount = function () {
         var _this = this;
-        if (this.picBack.style.visibility == 'hidden') {
+        // if(this.picBack.style.display == 'none'){
+        //     setTimeout(()=>{this.picBack.style.display = 'flex';
+        //     this.closeClick()},300)
+        // }
+        if (this.firstFrameDisplay == "none") {
             setTimeout(function () {
-                _this.picBack.style.visibility = 'visible';
+                _this.firstFrameDisplay = 'flex';
                 _this.closeClick();
-            }, 600);
+            }, 0);
         }
     };
     Group.prototype.componentDidUpdate = function () {
@@ -164,10 +170,12 @@ var Group = /** @class */ (function (_super) {
         }, 1000);
     };
     Group.prototype.closeClick = function (e) {
-        var _this = this;
         e === null || e === void 0 ? void 0 : e.stopPropagation();
         var nextIndex = this.groupIndexList.CheckReady();
-        setTimeout(function () { _this.loadDisplay = "visible"; }, 1000);
+        // setTimeout(() => {
+        //     this.loadDisplay = "visible"
+        // }, 1);
+        this.loadDisplay = "visible";
         this.elseDisplay = "hidden";
         if (nextIndex != -1) {
             if (this.props.settingsitems.ani_switch_type == 2) {
@@ -184,7 +192,7 @@ var Group = /** @class */ (function (_super) {
         if (this.state.curIndex == -1) {
             this.setState({ curIndex: this.groupIndexList.CheckReady() });
         }
-        return (h("div", { ref: function (div) { _this.picBack = div; }, style: { width: '100%', height: '100%', alignItems: 'center', justifyContent: 'center', position: 'absolute', visibility: 'hidden' }, onAnimationEnd: function () { _this.picBack.className = SlapfaceLess.groupBackReverse; } },
+        return (h("div", { ref: function (div) { _this.picBack = div; }, style: { width: '100%', height: '100%', alignItems: 'center', justifyContent: 'center', position: 'absolute' }, onAnimationEnd: function () { setTimeout(function () { _this.picBack.className = SlapfaceLess.groupBackReverse; }, 10); } },
             h("div", { onClick: function () { if (_this.props.settingsitems.is_mask == false)
                     return; _this.closeClick(); }, style: { position: "absolute", width: "100%", height: "100%" } }),
             h("div", null,
@@ -195,8 +203,9 @@ var Group = /** @class */ (function (_super) {
                         _this.forceUpdate();
                     } } }),
                 h("div", { ref: function (div) { _this.loadPic = div; }, className: SlapfaceLess.loading_anim, style: { backgroundImage: "url(".concat(this.props.pic_loading, ")"), width: this.groupArr[this.state.curIndex].width, height: this.groupArr[this.state.curIndex].height, position: "absolute", visibility: this.loadDisplay } }, " "),
-                h(CloseButton, { btn_closeButton: this.props.btn_closeButton, elseDisplay: this.elseDisplay, onClick: function (e) { _this.closeClick(e); } }),
-                h(JumpButton, { elseDisplay: this.elseDisplay, jumpButton: this.props.jumpButton }))));
+                h("div", { style: { width: '100%', height: '100%', visibility: this.firstFrameDisplay } },
+                    h(CloseButton, { btn_closeButton: this.props.btn_closeButton, elseDisplay: this.elseDisplay, onClick: function (e) { _this.closeClick(e); _this.loadDisplay = "hidden"; } }),
+                    h(JumpButton, { elseDisplay: this.elseDisplay, jumpButton: this.props.jumpButton })))));
     };
     return Group;
 }(Component));
@@ -206,7 +215,7 @@ var CloseButton = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     CloseButton.prototype.render = function () {
-        return (h("button", { className: SlapfaceLess.closeButton, style: { visibility: this.props.elseDisplay, backgroundImage: "url(".concat(this.props.btn_closeButton, ")") }, onClick: this.props.onClick }));
+        return (h("button", { className: SlapfaceLess.closeButton, style: { visibility: this.props.elseDisplay, backgroundSize: "contain", backgroundImage: "url(".concat(this.props.btn_closeButton, ")") }, onClick: this.props.onClick }));
     };
     return CloseButton;
 }(Component));
@@ -217,7 +226,7 @@ var JumpButton = /** @class */ (function (_super) {
     }
     JumpButton.prototype.render = function () {
         var _this = this;
-        return (h("div", { className: SlapfaceLess.jumpButton, style: { visibility: this.props.elseDisplay }, onMouseDown: function () { _this.jumpbtnImg.src = _this.props.jumpButton.pic_yaxia; }, onMouseUp: function () { _this.jumpbtnImg.src = _this.props.jumpButton.pic_xuanfu; }, onMouseOver: function () { _this.jumpbtnImg.src = _this.props.jumpButton.pic_xuanfu; }, onMouseOut: function () { _this.jumpbtnImg.src = _this.props.jumpButton.pic_changtai; } },
+        return (h("div", { className: SlapfaceLess.jumpButton, style: { visibility: this.props.elseDisplay }, onMouseDown: function () { _this.jumpbtnImg.src = _this.props.jumpButton.pic_yaxia; console.log("yaxia"); }, onMouseUp: function () { _this.jumpbtnImg.src = _this.props.jumpButton.pic_xuanfu; }, onMouseOver: function () { _this.jumpbtnImg.src = _this.props.jumpButton.pic_xuanfu; }, onMouseOut: function () { _this.jumpbtnImg.src = _this.props.jumpButton.pic_changtai; } },
             h("img", { ref: function (img) { _this.jumpbtnImg = img; }, src: this.props.jumpButton.pic_changtai })));
     };
     return JumpButton;

package/ui/components/slapface/less/Slapface.less

@@ -81,19 +81,6 @@
     top:50%;
     transform:translate(-50%,-50%);
 }
-.frame {
-    border: 12px solid rgb(60, 65, 71); 
-    display: flex;
-    /* flex-direction: row; */
-    /* flex-basis: content; */
-    /* justify-content: space-around; */
-    width: 1128px;
-    height: 604px;
-    position: relative;
-    top:-12px;
-    background-color: rgb(60, 65, 71);
-}
-
 .mask{
     // background:url(images/coupon-logo.gif) no-repeat;
     height:100px;background-color:#fff;