pixuireactcomponents 1.3.72 → 1.3.73
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -1
- package/src/components/tools/tools.d.ts +18 -5
- package/src/components/tools/tools.js +187 -55
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "pixuireactcomponents",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.73",
|
|
4
4
|
"description": "pixui react components",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -12,6 +12,7 @@
|
|
|
12
12
|
"dependencies": {
|
|
13
13
|
"animate.css": "^3.7.2",
|
|
14
14
|
"babel-plugin-transform-decorators-legacy": "^1.3.5",
|
|
15
|
+
"cheerio": "^1.0.0-rc.12",
|
|
15
16
|
"cpx": "^1.5.0",
|
|
16
17
|
"gamelet-pixui-frame": "0.4.9",
|
|
17
18
|
"google-protobuf": "^3.8.0",
|
|
@@ -1,7 +1,20 @@
|
|
|
1
|
-
export declare function tools(): void;
|
|
2
1
|
export declare namespace tools {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
const writeCookie: (key: string, value: string) => Promise<void>;
|
|
3
|
+
const readCookie: (key: string) => Promise<string>;
|
|
4
|
+
/**
|
|
5
|
+
* 哈希生成一个长度20的字符串
|
|
6
|
+
*/
|
|
7
|
+
const getHashStr: (str: string) => string;
|
|
8
|
+
/**
|
|
9
|
+
* 旧的富文本组件，请使用ConvertRichTextToPixuiStyle
|
|
10
|
+
* @param str
|
|
11
|
+
* @returns
|
|
12
|
+
*/
|
|
13
|
+
const convertRichText: (str: string) => string;
|
|
14
|
+
/**
|
|
15
|
+
* 富文本组件，将富文本转换成pixui的innerHtml可以使用的格式
|
|
16
|
+
* @param str
|
|
17
|
+
* @returns
|
|
18
|
+
*/
|
|
19
|
+
const ConvertRichTextToPixuiStyle: (str: string) => string;
|
|
7
20
|
}
|
|
@@ -36,61 +36,193 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
36
36
|
};
|
|
37
37
|
import { GameletAPI } from 'gamelet-pixui-frame';
|
|
38
38
|
import { sha1 } from './Sha1';
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
return
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
39
|
+
import * as cheerio from 'cheerio';
|
|
40
|
+
export var tools;
|
|
41
|
+
(function (tools) {
|
|
42
|
+
tools.writeCookie = function (key, value) {
|
|
43
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
44
|
+
var ud;
|
|
45
|
+
return __generator(this, function (_a) {
|
|
46
|
+
switch (_a.label) {
|
|
47
|
+
case 0: return [4 /*yield*/, GameletAPI.getUserData()];
|
|
48
|
+
case 1:
|
|
49
|
+
ud = _a.sent();
|
|
50
|
+
console.log('utils.writeCookie', key + GameletAPI.getAppID().toString() + ud.sOpenId, value.substring(0, 1000));
|
|
51
|
+
return [4 /*yield*/, GameletAPI.writeCookie(key + GameletAPI.getAppID().toString() + ud.sOpenId, value)];
|
|
52
|
+
case 2: return [2 /*return*/, _a.sent()];
|
|
53
|
+
}
|
|
54
|
+
});
|
|
52
55
|
});
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
56
|
+
};
|
|
57
|
+
tools.readCookie = function (key) {
|
|
58
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
59
|
+
var ud, data;
|
|
60
|
+
return __generator(this, function (_a) {
|
|
61
|
+
switch (_a.label) {
|
|
62
|
+
case 0: return [4 /*yield*/, GameletAPI.getUserData()];
|
|
63
|
+
case 1:
|
|
64
|
+
ud = _a.sent();
|
|
65
|
+
return [4 /*yield*/, GameletAPI.readCookie(key + GameletAPI.getAppID().toString() + ud.sOpenId)];
|
|
66
|
+
case 2:
|
|
67
|
+
data = _a.sent();
|
|
68
|
+
console.log('utils.readCookie', key + GameletAPI.getAppID().toString() + ud.sOpenId, data.substring(0, 1000));
|
|
69
|
+
return [2 /*return*/, data];
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
};
|
|
74
|
+
/**
|
|
75
|
+
* 哈希生成一个长度20的字符串
|
|
76
|
+
*/
|
|
77
|
+
tools.getHashStr = function (str) {
|
|
78
|
+
return sha1(str).substring(0, 20);
|
|
79
|
+
};
|
|
80
|
+
/**
|
|
81
|
+
* 旧的富文本组件，请使用ConvertRichTextToPixuiStyle
|
|
82
|
+
* @param str
|
|
83
|
+
* @returns
|
|
84
|
+
*/
|
|
85
|
+
tools.convertRichText = function (str) {
|
|
86
|
+
var res = str
|
|
87
|
+
.replaceAll(/<img([^>]*)>/g, '<img$1></img>') //传过来的这两个标签会少结束标签
|
|
88
|
+
.replaceAll(/<h[1,2,3,4,5,6]><br><\/h[1,2,3,4,5,6]>/g, '<br /><div style = "width:50px;height:15px;" ></div>')
|
|
89
|
+
.replaceAll(/<p><br><\/p>/g, '<br /><div style = "width:50px;height:15px;" ></div>')
|
|
90
|
+
.replaceAll(/<p/g, '<text')
|
|
91
|
+
.replaceAll(/<\/p>/g, '</text>') //包text否则会丢break word
|
|
92
|
+
.replaceAll(/<span/g, '<text')
|
|
93
|
+
.replaceAll(/<\/span>/g, '</text>') //包text否则会丢break word
|
|
94
|
+
.replaceAll(/ /g, ' '); //单一行只有nbsp的时候，会整个解析不出来，pixui innerHtml bug
|
|
95
|
+
for (var i = 1; i <= 6; i++) {
|
|
96
|
+
res = res.replaceAll(/(<h${i}\s[^>]*>)([^<]*)(<\/h${i}>)/g, '$1<text>$2</text>$3'); //h1-h6的内容包 text
|
|
97
|
+
}
|
|
98
|
+
res = res.replaceAll(/<br>/g, '<br /><div style = "width:50px;height:15px;" ></div>');
|
|
99
|
+
for (var i = 1; i < 10; i++) {
|
|
100
|
+
res = res.replaceAll("class=\"ql-indent-".concat(i, "\""), " style=\"padding-left: ".concat(i * 2, "rem;\""));
|
|
101
|
+
}
|
|
102
|
+
return res;
|
|
103
|
+
};
|
|
104
|
+
/**
|
|
105
|
+
* 富文本组件，将富文本转换成pixui的innerHtml可以使用的格式
|
|
106
|
+
* @param str
|
|
107
|
+
* @returns
|
|
108
|
+
*/
|
|
109
|
+
tools.ConvertRichTextToPixuiStyle = function (str) {
|
|
110
|
+
var $ = cheerio.load(str, null, false);
|
|
111
|
+
var _loop_1 = function (i) {
|
|
112
|
+
var indent = "ql-indent-".concat(i);
|
|
113
|
+
var extStyle = "padding-left: ".concat(i * 2, "rem;");
|
|
114
|
+
$(".".concat(indent)).each(function () {
|
|
115
|
+
var oriStyle = $(this).attr('style') || '';
|
|
116
|
+
$(this).attr('style', "".concat(oriStyle, " ").concat(extStyle));
|
|
117
|
+
$(this).removeClass(indent);
|
|
118
|
+
});
|
|
119
|
+
};
|
|
120
|
+
//合并ql-indent class到style中
|
|
121
|
+
for (var i = 1; i <= 10; i++) {
|
|
122
|
+
_loop_1(i);
|
|
123
|
+
}
|
|
124
|
+
//找到所有的文字节点，外层包裹text标签
|
|
125
|
+
$('*').each(function () {
|
|
126
|
+
$(this)
|
|
127
|
+
.contents()
|
|
128
|
+
.each(function () {
|
|
129
|
+
if (this.type === 'text') {
|
|
130
|
+
var text = this.data.trim();
|
|
131
|
+
if (text.length > 0) {
|
|
132
|
+
$(this).replaceWith("<text style=\"word-break: break-word;flex-shrink: 0;\">".concat(text, "</text>"));
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
});
|
|
136
|
+
});
|
|
137
|
+
//将strong em u s标签替换成text标签
|
|
138
|
+
$('strong').each(function () {
|
|
139
|
+
var html = $(this).html();
|
|
140
|
+
var style = $(this).attr('style') || '';
|
|
141
|
+
$(this).replaceWith("<text style=\"".concat(style, " font-weight: bold;flex-shrink: 0;\">").concat(html, "</text>"));
|
|
142
|
+
});
|
|
143
|
+
$('em').each(function () {
|
|
144
|
+
var html = $(this).html();
|
|
145
|
+
var style = $(this).attr('style') || '';
|
|
146
|
+
$(this).replaceWith("<text style=\"".concat(style, " font-style: italic;flex-shrink: 0;\">").concat(html, "</text>"));
|
|
147
|
+
});
|
|
148
|
+
$('u').each(function () {
|
|
149
|
+
var html = $(this).html();
|
|
150
|
+
var style = $(this).attr('style') || '';
|
|
151
|
+
$(this).replaceWith("<text style=\"".concat(style, " text-decoration: underline;flex-shrink: 0;\">").concat(html, "</text>"));
|
|
152
|
+
});
|
|
153
|
+
$('s').each(function () {
|
|
154
|
+
var html = $(this).html();
|
|
155
|
+
var style = $(this).attr('style') || '';
|
|
156
|
+
$(this).replaceWith("<text style=\"".concat(style, " text-decoration: line-through;flex-shrink: 0;\">").concat(html, "</text>"));
|
|
157
|
+
});
|
|
158
|
+
$('span').each(function () {
|
|
159
|
+
var html = $(this).html();
|
|
160
|
+
var style = $(this).attr('style') || '';
|
|
161
|
+
$(this).replaceWith("<text style=\"".concat(style, " flex-shrink: 0;\">").concat(html, "</text>"));
|
|
162
|
+
});
|
|
163
|
+
$('p').each(function () {
|
|
164
|
+
var html = $(this).html();
|
|
165
|
+
var style = $(this).attr('style') || '';
|
|
166
|
+
$(this).replaceWith("<div style=\"".concat(style, " ;flex-shrink: 0;\">").concat(html, "</div>"));
|
|
167
|
+
});
|
|
168
|
+
$('br').each(function () {
|
|
169
|
+
$(this).replaceWith("<br><div style = \"width:50px;height:15px;\" />");
|
|
170
|
+
});
|
|
171
|
+
['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'a', 'img'].forEach(function (tag) {
|
|
172
|
+
$("".concat(tag)).each(function () {
|
|
173
|
+
var style = $(this).attr('style') || '';
|
|
174
|
+
$(this).attr('style', "".concat(style, " flex-shrink: 0;"));
|
|
175
|
+
});
|
|
176
|
+
});
|
|
177
|
+
//将嵌套的text节点合并，同时合并内外的style
|
|
178
|
+
while ($('text > text').length > 0) {
|
|
179
|
+
$('text').each(function () {
|
|
180
|
+
var $this = $(this);
|
|
181
|
+
var parentStyle = $this.attr('style') || '';
|
|
182
|
+
$this.children('text').each(function () {
|
|
183
|
+
var $child = $(this);
|
|
184
|
+
var childStyle = $child.attr('style') || '';
|
|
185
|
+
// 合并style属性
|
|
186
|
+
var mergedStyle = "".concat(parentStyle, "; ").concat(childStyle);
|
|
187
|
+
// 更新子元素的style属性
|
|
188
|
+
$child.attr('style', mergedStyle);
|
|
189
|
+
});
|
|
190
|
+
//去掉父节点
|
|
191
|
+
if ($this.children('text').length > 0) {
|
|
192
|
+
$this.replaceWith($this.html() || '');
|
|
193
|
+
}
|
|
194
|
+
});
|
|
195
|
+
}
|
|
196
|
+
//去除空的text节点
|
|
197
|
+
$('text').each(function () {
|
|
198
|
+
var t = $(this).html() || '';
|
|
199
|
+
if (t.trim() == '') {
|
|
200
|
+
$(this).remove();
|
|
68
201
|
}
|
|
69
202
|
});
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
};
|
|
203
|
+
//!!并列的text节点在父节点为flexDirection:row时无法正确换行，将其修改为div，外层再包一个text节点
|
|
204
|
+
['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'div'].map(function (tag) {
|
|
205
|
+
$("".concat(tag)).each(function () {
|
|
206
|
+
$(this)
|
|
207
|
+
.children('text')
|
|
208
|
+
.each(function () {
|
|
209
|
+
var text = $(this).html();
|
|
210
|
+
var style = $(this).attr('style') || '';
|
|
211
|
+
$(this).replaceWith("<div style=\"".concat(style, "\">").concat(text, "</div>"));
|
|
212
|
+
});
|
|
213
|
+
var taghtml = $(this).html();
|
|
214
|
+
var tagstyle = $(this).attr('style') || '';
|
|
215
|
+
//自己的子节点外套一个text，自己不变
|
|
216
|
+
$(this).replaceWith("<".concat(tag, " style=\"").concat(tagstyle, "\"><text>").concat(taghtml, "</text></").concat(tag, ">"));
|
|
217
|
+
});
|
|
218
|
+
});
|
|
219
|
+
var res = $.html();
|
|
220
|
+
res = res
|
|
221
|
+
.replaceAll(/<br>/g, '<br />')
|
|
222
|
+
.replaceAll(/<img([^>]+)>/g, '<img$1 />')
|
|
223
|
+
.replaceAll(/ /g, ' ');
|
|
224
|
+
// console.log('rrrr', res);
|
|
225
|
+
res = "<div style=\"display:flex;flex-direction:column;width:100%;\">".concat(res, "</div>");
|
|
226
|
+
return res;
|
|
227
|
+
};
|
|
228
|
+
})(tools || (tools = {}));
|