@xpadev-net/niconicomments 0.1.3 → 0.1.4

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.
Files changed (4) hide show
  1. package/LICENSE +7 -7
  2. package/README.md +24 -24
  3. package/dist/bundle.js +78 -66
  4. package/package.json +33 -33
package/LICENSE CHANGED
@@ -1,7 +1,7 @@
1
- Copyright (c) 2021 xpadev https://xpadev.net
2
-
3
- Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
4
-
5
- The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
6
-
7
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
1
+ Copyright (c) 2021 xpadev https://xpadev.net
2
+
3
+ Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
4
+
5
+ The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
6
+
7
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
package/README.md CHANGED
@@ -1,24 +1,24 @@
1
- # [niconicomments](https://xpadev.net/niconicomments/)
2
- [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/xpadev-net/niconicomments/blob/master/LICENSE)
3
- ニコニコ動画の公式プレイヤーに多少の互換性を持つコメント描画ライブラリです
4
- This is a comment drawing library that is somewhat compatible with the official Nico Nico Douga player.
5
- Reference: https://xpadev.net/niconicomments/docs/
6
- Github: https://github.com/xpadev-net/niconicomments
7
-
8
- ## Installation
9
- ```html
10
- <script src="https://cdn.jsdelivr.net/npm/@xpadev-net/niconicomments@latest/dist/bundle.min.js"></script>
11
- ```
12
- or
13
- ```
14
- npm i @xpadev-net/niconicomments
15
- ```
16
-
17
- ## Examples
18
- ```javascript
19
- const niconiComments = new NiconiComments(canvas, comments);
20
- niconiComments.drawCanvas(vpos)
21
- ```
22
-
23
- ## Sample
24
- https://xpadev.net/niconicomments/sample.html
1
+ # [niconicomments](https://xpadev.net/niconicomments/)
2
+ [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/xpadev-net/niconicomments/blob/master/LICENSE)
3
+ ニコニコ動画の公式プレイヤーに多少の互換性を持つコメント描画ライブラリです
4
+ This is a comment drawing library that is somewhat compatible with the official Nico Nico Douga player.
5
+ Reference: https://xpadev.net/niconicomments/docs/
6
+ Github: https://github.com/xpadev-net/niconicomments
7
+
8
+ ## Installation
9
+ ```html
10
+ <script src="https://cdn.jsdelivr.net/npm/@xpadev-net/niconicomments@latest/dist/bundle.min.js"></script>
11
+ ```
12
+ or
13
+ ```
14
+ npm i @xpadev-net/niconicomments
15
+ ```
16
+
17
+ ## Examples
18
+ ```javascript
19
+ const niconiComments = new NiconiComments(canvas, comments);
20
+ niconiComments.drawCanvas(vpos)
21
+ ```
22
+
23
+ ## Sample
24
+ https://xpadev.net/niconicomments/sample.html
package/dist/bundle.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- niconicomments.js v0.1.3
2
+ niconicomments.js v0.1.4
3
3
  (c) 2021 xpadev-net https://xpadevn.et
4
4
  Released under the MIT License.
5
5
  */
@@ -10,12 +10,12 @@
10
10
  })(this, (function () { 'use strict';
11
11
 
12
12
  class NiconiComments {
13
- /**
14
- * NiconiComments Constructor
15
- * @param {HTMLCanvasElement} canvas - 描画対象のキャンバス
16
- * @param {[]} data - 描画用のコメント
17
- * @param {boolean} useLegacy - defontにsans-serifを適用するか(trueでニコニコ公式に準拠)
18
- * @param {boolean} formatted - dataが独自フォーマットに変換されているか
13
+ /**
14
+ * NiconiComments Constructor
15
+ * @param {HTMLCanvasElement} canvas - 描画対象のキャンバス
16
+ * @param {[]} data - 描画用のコメント
17
+ * @param {boolean} useLegacy - defontにsans-serifを適用するか(trueでニコニコ公式に準拠)
18
+ * @param {boolean} formatted - dataが独自フォーマットに変換されているか
19
19
  */
20
20
  constructor(canvas, data, useLegacy = false, formatted = false) {
21
21
  this.canvas = canvas;
@@ -24,7 +24,13 @@
24
24
  this.context.textAlign = "left";
25
25
  this.context.textBaseline = "top";
26
26
  this.context.lineWidth = "6";
27
- this.commentYOffset = 0.25;
27
+
28
+ if (useLegacy) {
29
+ this.commentYOffset = 0.25;
30
+ } else {
31
+ this.commentYOffset = 0.125;
32
+ }
33
+
28
34
  this.commentYMarginTop = 10;
29
35
  this.fontSize = {
30
36
  "small": {
@@ -40,6 +46,16 @@
40
46
  "resized": 57.5
41
47
  }
42
48
  };
49
+ this.doubleResizeMaxWidth = {
50
+ full: {
51
+ legacy: 3020,
52
+ default: 3220
53
+ },
54
+ normal: {
55
+ legacy: 2540,
56
+ default: 2740
57
+ }
58
+ };
43
59
 
44
60
  if (formatted) {
45
61
  this.data = data;
@@ -67,10 +83,10 @@
67
83
  this.fpsCount = 0;
68
84
  }, 500);
69
85
  }
70
- /**
71
- * ニコニコが吐き出したデータを処理しやすいように変換する
72
- * @param {[]} data - ニコニコが吐き出したコメントデータ
73
- * @returns {*[]} - 独自フォーマットのコメントデータ
86
+ /**
87
+ * ニコニコが吐き出したデータを処理しやすいように変換する
88
+ * @param {[]} data - ニコニコが吐き出したコメントデータ
89
+ * @returns {*[]} - 独自フォーマットのコメントデータ
74
90
  */
75
91
 
76
92
 
@@ -114,8 +130,8 @@
114
130
  });
115
131
  return data_;
116
132
  }
117
- /**
118
- * 事前に当たり判定を考慮してコメントの描画場所を決定する
133
+ /**
134
+ * 事前に当たり判定を考慮してコメントの描画場所を決定する
119
135
  */
120
136
 
121
137
 
@@ -124,8 +140,8 @@
124
140
  this.getCommentSize();
125
141
  this.getCommentPos();
126
142
  }
127
- /**
128
- * コマンドをもとに各コメントに適用するフォントを決定する
143
+ /**
144
+ * コマンドをもとに各コメントに適用するフォントを決定する
129
145
  */
130
146
 
131
147
 
@@ -144,8 +160,8 @@
144
160
  this.data[i].content = this.data[i].content.replaceAll("\t", " ");
145
161
  }
146
162
  }
147
- /**
148
- * コメントの描画サイズを計算する
163
+ /**
164
+ * コメントの描画サイズを計算する
149
165
  */
150
166
 
151
167
 
@@ -172,8 +188,8 @@
172
188
  }
173
189
  }
174
190
  }
175
- /**
176
- * 計算された描画サイズをもとに各コメントの配置位置を決定する
191
+ /**
192
+ * 計算された描画サイズをもとに各コメントの配置位置を決定する
177
193
  */
178
194
 
179
195
 
@@ -361,11 +377,11 @@
361
377
  }
362
378
  }
363
379
  }
364
- /**
365
- * context.measureTextの複数行対応版
366
- * 画面外にはみ出すコメントの縮小も行う
367
- * @param comment - 独自フォーマットのコメントデータ
368
- * @returns {{resized: boolean, width: number, width_max: number, fontSize: number, width_min: number, height: number}} - 描画サイズとリサイズの情報
380
+ /**
381
+ * context.measureTextの複数行対応版
382
+ * 画面外にはみ出すコメントの縮小も行う
383
+ * @param comment - 独自フォーマットのコメントデータ
384
+ * @returns {{resized: boolean, width: number, width_max: number, fontSize: number, width_min: number, height: number}} - 描画サイズとリサイズの情報
369
385
  */
370
386
 
371
387
 
@@ -427,16 +443,12 @@
427
443
  this.context.font = parseFont(comment.font, comment.fontSize, this.useLegacy);
428
444
  return this.measureText(comment);
429
445
  } else if (comment.loc !== "naka" && comment.tateRisized && comment.yokoResized) {
430
- if (comment.full && width_max > 3420) {
446
+ if (comment.full && width_max > this.doubleResizeMaxWidth.full[this.useLegacy ? "legacy" : "default"]) {
431
447
  comment.fontSize -= 1;
432
- comment.resized = true;
433
- comment.yokoResized = true;
434
448
  this.context.font = parseFont(comment.font, comment.fontSize, this.useLegacy);
435
449
  return this.measureText(comment);
436
- } else if (!comment.full && width_max > 2940) {
437
- comment.fontSize -= 1;
438
- comment.resized = true;
439
- comment.yokoResized = true;
450
+ } else if (!comment.full && width_max > this.doubleResizeMaxWidth.normal[this.useLegacy ? "legacy" : "default"]) {
451
+ comment.fontSize -= 1.;
440
452
  this.context.font = parseFont(comment.font, comment.fontSize, this.useLegacy);
441
453
  return this.measureText(comment);
442
454
  }
@@ -451,10 +463,10 @@
451
463
  "fontSize": comment.fontSize
452
464
  };
453
465
  }
454
- /**
455
- * コマンドをもとに所定の位置にコメントを表示する
456
- * @param comment - 独自フォーマットのコメントデータ
457
- * @param {number} vpos - 動画の現在位置の100倍 ニコニコから吐き出されるコメントの位置情報は主にこれ
466
+ /**
467
+ * コマンドをもとに所定の位置にコメントを表示する
468
+ * @param comment - 独自フォーマットのコメントデータ
469
+ * @param {number} vpos - 動画の現在位置の100倍 ニコニコから吐き出されるコメントの位置情報は主にこれ
458
470
  */
459
471
 
460
472
 
@@ -512,10 +524,10 @@
512
524
  this.context.strokeStyle = "rgba(0,0,0,0.7)";
513
525
  }
514
526
  }
515
- /**
516
- * コメントに含まれるコマンドを解釈する
517
- * @param comment- 独自フォーマットのコメントデータ
518
- * @returns {{loc: string, size: string, color: string, fontSize: number, ender: boolean, font: string, full: boolean, _live: boolean}}
527
+ /**
528
+ * コメントに含まれるコマンドを解釈する
529
+ * @param comment- 独自フォーマットのコメントデータ
530
+ * @returns {{loc: string, size: string, color: string, fontSize: number, ender: boolean, font: string, full: boolean, _live: boolean}}
519
531
  */
520
532
 
521
533
 
@@ -725,9 +737,9 @@
725
737
  _live
726
738
  };
727
739
  }
728
- /**
729
- * キャンバスを描画する
730
- * @param vpos - 動画の現在位置の100倍 ニコニコから吐き出されるコメントの位置情報は主にこれ
740
+ /**
741
+ * キャンバスを描画する
742
+ * @param vpos - 動画の現在位置の100倍 ニコニコから吐き出されるコメントの位置情報は主にこれ
731
743
  */
732
744
 
733
745
 
@@ -771,8 +783,8 @@
771
783
  this.context.fillText("Count:" + this.timeline[vpos].length, 100, 200);
772
784
  }
773
785
  }
774
- /**
775
- * キャンバスを消去する
786
+ /**
787
+ * キャンバスを消去する
776
788
  */
777
789
 
778
790
 
@@ -781,12 +793,12 @@
781
793
  }
782
794
 
783
795
  }
784
- /**
785
- * 配列を複数のキーでグループ化する
786
- * @param {{}} array
787
- * @param {string} key
788
- * @param {string} key2
789
- * @returns {{}}
796
+ /**
797
+ * 配列を複数のキーでグループ化する
798
+ * @param {{}} array
799
+ * @param {string} key
800
+ * @param {string} key2
801
+ * @returns {{}}
790
802
  */
791
803
 
792
804
 
@@ -808,12 +820,12 @@
808
820
 
809
821
  return data;
810
822
  };
811
- /**
812
- * フォント名とサイズをもとにcontextで使えるフォントを生成する
813
- * @param {string} font
814
- * @param {number} size
815
- * @param {boolean} useLegacy
816
- * @returns {string}
823
+ /**
824
+ * フォント名とサイズをもとにcontextで使えるフォントを生成する
825
+ * @param {string} font
826
+ * @param {number} size
827
+ * @param {boolean} useLegacy
828
+ * @returns {string}
817
829
  */
818
830
 
819
831
 
@@ -834,11 +846,11 @@
834
846
 
835
847
  }
836
848
  };
837
- /**
838
- * phpのarray_push的なあれ
839
- * @param array
840
- * @param {string} key
841
- * @param push
849
+ /**
850
+ * phpのarray_push的なあれ
851
+ * @param array
852
+ * @param {string} key
853
+ * @param push
842
854
  */
843
855
 
844
856
 
@@ -853,10 +865,10 @@
853
865
 
854
866
  array[key].push(push);
855
867
  };
856
- /**
857
- * Hexからrgbに変換する(_live用)
858
- * @param {string} hex
859
- * @return {array} RGB
868
+ /**
869
+ * Hexからrgbに変換する(_live用)
870
+ * @param {string} hex
871
+ * @return {array} RGB
860
872
  */
861
873
 
862
874
 
package/package.json CHANGED
@@ -1,33 +1,33 @@
1
- {
2
- "name": "@xpadev-net/niconicomments",
3
- "version": "0.1.3",
4
- "description": "NiconiComments is a comment drawing library that is somewhat compatible with the official Nico Nico Douga player.",
5
- "main": "dist/bundle.js",
6
- "scripts": {
7
- "test": "echo \"Error: no test specified\" && exit 1",
8
- "build": "rollup -c rollup.config.js",
9
- "prepublishOnly": "rollup -c rollup.config.js"
10
- },
11
- "repository": {
12
- "type": "git",
13
- "url": "git+https://github.com/xpadev-net/niconicomments.git"
14
- },
15
- "keywords": [
16
- "niconico"
17
- ],
18
- "author": "xpadev(xpadev.net)",
19
- "bugs": {
20
- "url": "https://github.com/xpadev-net/niconicomments/issues"
21
- },
22
- "files": [
23
- "dist/bundle.js"
24
- ],
25
- "homepage": "https://xpadev.net/niconicomments/docs/",
26
- "license": "MIT",
27
- "devDependencies": {
28
- "rollup": "^2.61.1"
29
- },
30
- "dependencies": {
31
- "@rollup/plugin-babel": "^5.3.0"
32
- }
33
- }
1
+ {
2
+ "name": "@xpadev-net/niconicomments",
3
+ "version": "0.1.4",
4
+ "description": "NiconiComments is a comment drawing library that is somewhat compatible with the official Nico Nico Douga player.",
5
+ "main": "dist/bundle.js",
6
+ "scripts": {
7
+ "test": "echo \"Error: no test specified\" && exit 1",
8
+ "build": "rollup -c rollup.config.js",
9
+ "prepublishOnly": "rollup -c rollup.config.js"
10
+ },
11
+ "repository": {
12
+ "type": "git",
13
+ "url": "git+https://github.com/xpadev-net/niconicomments.git"
14
+ },
15
+ "keywords": [
16
+ "niconico"
17
+ ],
18
+ "author": "xpadev(xpadev.net)",
19
+ "bugs": {
20
+ "url": "https://github.com/xpadev-net/niconicomments/issues"
21
+ },
22
+ "files": [
23
+ "dist/bundle.js"
24
+ ],
25
+ "homepage": "https://xpadev.net/niconicomments/docs/",
26
+ "license": "MIT",
27
+ "devDependencies": {
28
+ "rollup": "^2.61.1"
29
+ },
30
+ "dependencies": {
31
+ "@rollup/plugin-babel": "^5.3.0"
32
+ }
33
+ }