@xpadev-net/niconicomments 0.2.33 → 0.2.35

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/README.en.md ADDED
@@ -0,0 +1,41 @@
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
+ [[日本語](https://github.com/xpadev-net/niconicomments/blob/develop/README.md)]
5
+
6
+ Comment rendering library that is somewhat compatible with the official Nico Nico Douga player
7
+ Reference: https://xpadev-net.github.io/niconicomments/
8
+ Github: https://github.com/xpadev-net/niconicomments
9
+ npm: https://www.npmjs.com/package/@xpadev-net/niconicomments
10
+
11
+ ## For users who use this library for domestic use in Japan
12
+ This library may infringe on Dwango's patents depending on how it is used
13
+ Please carefully review the following applicable patents and case law before using this library with caution.
14
+ [JP,2006-333851](https://www.j-platpat.inpit.go.jp/c1800/PU/JP-2006-333851/7294651F33633E1EBF3DEC66FAE0ECAD878D19E1829C378FC81D26BBD0A4263B/10/en)
15
+ [JP,2010-267283](https://www.j-platpat.inpit.go.jp/c1800/PU/JP-4734471/9085C128B7ED7D57F6C2F09D9BE4FCB496E638331DB9EC7ADE1E3A44999A3878/15/en)
16
+ [JP,2018-202475](https://www.j-platpat.inpit.go.jp/c1800/PU/JP-6526304/D8AF77CFB92D96C785FEECBD690C53E2F9023F1739E7A5BBDAB588E2ECAC5316/15/en)
17
+ [2018: Case No. Heisei 28 (wa) 38565, Patent Infringement Injunction, etc. Patent Right Civil Litigation](https://www.courts.go.jp/app/files/hanrei_jp/073/088073_hanrei.pdf)
18
+ [2022: Heisei 30 (ne) 10077 Appeal for Patent Infringement Injunction, etc. Patent Right Civil Litigation](https://www.courts.go.jp/app/files/hanrei_jp/418/091418_hanrei.pdf)
19
+
20
+ ## Installation
21
+ ```html
22
+ <script src="https://cdn.jsdelivr.net/npm/@xpadev-net/niconicomments@latest/dist/bundle.min.js"></script>
23
+ ```
24
+ or
25
+ ```
26
+ npm i @xpadev-net/niconicomments
27
+ ```
28
+
29
+ ## Examples
30
+ ```javascript
31
+ const canvas = document.getElementById("canvas");
32
+ const video = document.getElementById("video");
33
+ const req = await fetch("sample.json");
34
+ const res = await req.json();
35
+ const niconiComments = new NiconiComments(canvas, res);
36
+ //If video.ontimeupdate is used, the comments will be choppy due to the small number of calls.
37
+ setInterval(() => niconiComments.drawCanvas(Math.floor(video.currentTime * 100)), 10);
38
+ ```
39
+
40
+ ## Sample
41
+ [Sample](https://xpadev-net.github.io/niconicomments/sample/)
package/README.md CHANGED
@@ -1,21 +1,21 @@
1
1
  # [niconicomments](https://xpadev.net/niconicomments/)
2
2
  [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/xpadev-net/niconicomments/blob/master/LICENSE)
3
3
 
4
- [日本語](https://github.com/xpadev-net/niconicomments/blob/develop/README.ja.md)
4
+ [[English](https://github.com/xpadev-net/niconicomments/blob/develop/README.en.md)]
5
5
 
6
- Comment rendering library that is somewhat compatible with the official Nico Nico Douga player
6
+ ニコニコ動画の公式プレイヤー互換の高パフォーマンスなコメント描画ライブラリ
7
+ High peformance High compatibility comment drawing library
7
8
  Reference: https://xpadev-net.github.io/niconicomments/
8
9
  Github: https://github.com/xpadev-net/niconicomments
9
10
  npm: https://www.npmjs.com/package/@xpadev-net/niconicomments
10
11
 
11
- ## For users who use this library for domestic use in Japan
12
- This library may infringe on Dwango's patents depending on how it is used
13
- Please carefully review the following applicable patents and case law before using this library with caution.
14
- [JP,2006-333851](https://www.j-platpat.inpit.go.jp/c1800/PU/JP-2006-333851/7294651F33633E1EBF3DEC66FAE0ECAD878D19E1829C378FC81D26BBD0A4263B/10/en)
15
- [JP,2010-267283](https://www.j-platpat.inpit.go.jp/c1800/PU/JP-4734471/9085C128B7ED7D57F6C2F09D9BE4FCB496E638331DB9EC7ADE1E3A44999A3878/15/en)
16
- [JP,2018-202475](https://www.j-platpat.inpit.go.jp/c1800/PU/JP-6526304/D8AF77CFB92D96C785FEECBD690C53E2F9023F1739E7A5BBDAB588E2ECAC5316/15/en)
17
- [2018: Case No. Heisei 28 (wa) 38565, Patent Infringement Injunction, etc. Patent Right Civil Litigation](https://www.courts.go.jp/app/files/hanrei_jp/073/088073_hanrei.pdf)
18
- [2022: Heisei 30 (ne) 10077 Appeal for Patent Infringement Injunction, etc. Patent Right Civil Litigation](https://www.courts.go.jp/app/files/hanrei_jp/418/091418_hanrei.pdf)
12
+ ## [重要]このライブラリを使用される方へ
13
+ ニコニコ運営が画面にコメントを流すアドオンを特許侵害だと騒ぎ立てて潰して回っているようです
14
+ このライブラリ本体は描画部分のみのため特許侵害に当たるとは考えていませんが、ニコニコ動画運営(とその近辺の人)に叩かれる可能性があります
15
+ (名前は出しませんがすでにいくつかのOSSに被害が出ています)
16
+ また、このライブラリを使用するかどうかに関わらず、リアルタイムでコメントを取得、画面を描画、コメントの投稿という一連の流れを実装した場合、ニコニコの特許を侵害する可能性があります
17
+ 詳しくはこちら[ニコニコが保有する特許について](https://github.com/xpadev-net/niconicomments/blob/develop/ABOUT_PATENT.md)を参照してください
18
+ **※当ライブラリを削除する予定は一切ありません**
19
19
 
20
20
  ## Installation
21
21
  ```html
@@ -33,9 +33,9 @@ const video = document.getElementById("video");
33
33
  const req = await fetch("sample.json");
34
34
  const res = await req.json();
35
35
  const niconiComments = new NiconiComments(canvas, res);
36
- //If video.ontimeupdate is used, the comments will be choppy due to the small number of calls.
36
+ //video.ontimeupdateを使用すると、呼び出し回数の関係でコメントカクつく
37
37
  setInterval(() => niconiComments.drawCanvas(Math.floor(video.currentTime * 100)), 10);
38
38
  ```
39
39
 
40
40
  ## Sample
41
- [Sample](https://xpadev-net.github.io/niconicomments/sample/)
41
+ [サンプル](https://xpadev-net.github.io/niconicomments/sample/)
package/dist/bundle.d.ts CHANGED
@@ -61,11 +61,6 @@ declare let imageCache: {
61
61
  declare const resetImageCache: () => void;
62
62
 
63
63
 
64
- declare let canvas: HTMLCanvasElement;
65
- declare let context: CanvasRenderingContext2D;
66
- declare const initCanvas: () => void;
67
-
68
-
69
64
  declare let nicoScripts: nicoScript;
70
65
  declare const resetNicoScripts: () => void;
71
66
 
@@ -610,7 +605,7 @@ declare class NiconiComments {
610
605
 
611
606
  declare const getLineHeight: (fontSize: commentSize, isFlash: boolean, resized?: boolean) => number;
612
607
  declare const getCharSize: (fontSize: commentSize, isFlash: boolean) => number;
613
- declare const measure: (comment: measureInput) => {
608
+ declare const measure: (comment: measureInput, context: CanvasRenderingContext2D) => {
614
609
  height: number;
615
610
  width: number;
616
611
  lineWidth: number[];
package/dist/bundle.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- niconicomments.js v0.2.33
2
+ niconicomments.js v0.2.35
3
3
  (c) 2021 xpadev-net https://xpadev.net
4
4
  Released under the MIT License.
5
5
  */
@@ -132,7 +132,6 @@
132
132
  "date",
133
133
  "date_usec",
134
134
  "anonymity",
135
- "user_id",
136
135
  "mail",
137
136
  "leaf",
138
137
  "premium",
@@ -1330,18 +1329,6 @@
1330
1329
  return result;
1331
1330
  };
1332
1331
 
1333
- var canvas;
1334
- var context;
1335
- var initCanvas = function () {
1336
- canvas = document.createElement("canvas");
1337
- var _context = canvas.getContext("2d");
1338
- if (_context === null)
1339
- throw new Error("fail to get Context2D");
1340
- context = _context;
1341
- context.textAlign = "start";
1342
- context.textBaseline = "alphabetic";
1343
- };
1344
-
1345
1332
  var getLineHeight = function (fontSize, isFlash, resized) {
1346
1333
  if (resized === void 0) { resized = false; }
1347
1334
  var lineCounts = getConfig(config.lineCounts, isFlash), commentStageSize = getConfig(config.commentStageSize, isFlash), lineHeight = commentStageSize.height / lineCounts.doubleResized[fontSize], defaultLineCount = lineCounts.default[fontSize];
@@ -1357,11 +1344,11 @@
1357
1344
  var lineCounts = getConfig(config.lineCounts, isFlash), commentStageSize = getConfig(config.commentStageSize, isFlash);
1358
1345
  return commentStageSize.height / lineCounts.doubleResized[fontSize];
1359
1346
  };
1360
- var measure = function (comment) {
1361
- var width = measureWidth(comment);
1347
+ var measure = function (comment, context) {
1348
+ var width = measureWidth(comment, context);
1362
1349
  return _assign(_assign({}, width), { height: comment.lineHeight * (comment.lineCount - 1) + comment.charSize });
1363
1350
  };
1364
- var measureWidth = function (comment) {
1351
+ var measureWidth = function (comment, context) {
1365
1352
  var _a = getFontSizeAndScale(comment.charSize), fontSize = _a.fontSize, scale = _a.scale, lineWidth = [], itemWidth = [];
1366
1353
  context.font = parseFont(comment.font, fontSize);
1367
1354
  var currentWidth = 0;
@@ -1528,13 +1515,13 @@
1528
1515
  comment.lineHeight = lineHeight_1;
1529
1516
  comment.resized = true;
1530
1517
  comment.resizedY = true;
1531
- var measureResult = measure(comment);
1518
+ var measureResult = measure(comment, this.context);
1532
1519
  height = measureResult.height;
1533
1520
  width = measureResult.width;
1534
1521
  itemWidth = measureResult.itemWidth;
1535
1522
  }
1536
1523
  else {
1537
- var measureResult = measure(comment);
1524
+ var measureResult = measure(comment, this.context);
1538
1525
  height = measureResult.height;
1539
1526
  width = measureResult.width;
1540
1527
  itemWidth = measureResult.itemWidth;
@@ -1546,14 +1533,14 @@
1546
1533
  _comment.charSize = (_comment.charSize || 0) * scale_1;
1547
1534
  _comment.lineHeight = (_comment.lineHeight || 0) * scale_1;
1548
1535
  _comment.fontSize = _comment.charSize * 0.8;
1549
- var result = measure(_comment);
1536
+ var result = measure(_comment, this.context);
1550
1537
  if (result.width > widthLimit) {
1551
1538
  while (result.width >= widthLimit) {
1552
1539
  var originalCharSize = _comment.charSize;
1553
1540
  _comment.charSize -= 1;
1554
1541
  _comment.lineHeight *= _comment.charSize / originalCharSize;
1555
1542
  _comment.fontSize = _comment.charSize * 0.8;
1556
- result = measure(_comment);
1543
+ result = measure(_comment, this.context);
1557
1544
  }
1558
1545
  }
1559
1546
  else {
@@ -1564,7 +1551,7 @@
1564
1551
  _comment.charSize += 1;
1565
1552
  _comment.lineHeight *= _comment.charSize / originalCharSize;
1566
1553
  _comment.fontSize = _comment.charSize * 0.8;
1567
- result = measure(_comment);
1554
+ result = measure(_comment, this.context);
1568
1555
  }
1569
1556
  _comment = lastComment;
1570
1557
  }
@@ -1578,7 +1565,7 @@
1578
1565
  comment.lineHeight = _comment.lineHeight;
1579
1566
  }
1580
1567
  comment.fontSize = (comment.charSize || 0) * 0.8;
1581
- result = measure(comment);
1568
+ result = measure(comment, this.context);
1582
1569
  width = result.width;
1583
1570
  height = result.height;
1584
1571
  itemWidth = result.itemWidth;
@@ -1715,14 +1702,13 @@
1715
1702
  "@@HTML5@@" +
1716
1703
  __spreadArray([], this.comment.mail, true).sort().join(","), cache = imageCache[cacheKey];
1717
1704
  if (cache) {
1705
+ this.image = cache.image;
1706
+ window.setTimeout(function () {
1707
+ delete _this.image;
1708
+ }, this.comment.long * 10 + config.cacheAge);
1718
1709
  clearTimeout(cache.timeout);
1719
1710
  cache.timeout = window.setTimeout(function () {
1720
- if (_this.image) {
1721
- delete _this.image;
1722
- }
1723
- if (cache) {
1724
- delete imageCache[cacheKey];
1725
- }
1711
+ delete imageCache[cacheKey];
1726
1712
  }, this.comment.long * 10 + config.cacheAge);
1727
1713
  return cache.image;
1728
1714
  }
@@ -1777,14 +1763,12 @@
1777
1763
  }
1778
1764
  }
1779
1765
  this.image = image;
1766
+ window.setTimeout(function () {
1767
+ delete _this.image;
1768
+ }, this.comment.long * 10 + config.cacheAge);
1780
1769
  imageCache[cacheKey] = {
1781
1770
  timeout: window.setTimeout(function () {
1782
- if (cache) {
1783
- delete imageCache[cacheKey];
1784
- }
1785
- if (_this.image) {
1786
- delete _this.image;
1787
- }
1771
+ delete imageCache[cacheKey];
1788
1772
  }, this.comment.long * 10 + config.cacheAge),
1789
1773
  image: image,
1790
1774
  };
@@ -2131,8 +2115,6 @@
2131
2115
  var height = (comment.fontSize * comment.lineHeight * lineCount +
2132
2116
  config.commentYPaddingTop[comment.resizedY ? "resized" : "default"]) *
2133
2117
  this.scale;
2134
- if (Number.isNaN(height))
2135
- console.log(comment, lineCount, this.scale);
2136
2118
  if (comment.loc !== "naka") {
2137
2119
  var widthLimit = getConfig(config.commentStageSize, true)[comment.full ? "fullWidth" : "width"];
2138
2120
  if (width_max > widthLimit && !comment.resizedX) {
@@ -2231,12 +2213,7 @@
2231
2213
  else {
2232
2214
  this.context.globalAlpha = 1;
2233
2215
  }
2234
- try {
2235
- this.context.drawImage(this.image, posX, posY);
2236
- }
2237
- catch (e) {
2238
- console.log(this.comment, e);
2239
- }
2216
+ this.context.drawImage(this.image, posX, posY);
2240
2217
  }
2241
2218
  if (showCollision) {
2242
2219
  this.context.strokeStyle = "rgba(255,0,255,1)";
@@ -2273,14 +2250,13 @@
2273
2250
  "@@FLASH@@" +
2274
2251
  __spreadArray([], this.comment.mail, true).sort().join(","), cache = imageCache[cacheKey];
2275
2252
  if (cache) {
2253
+ this.image = cache.image;
2254
+ window.setTimeout(function () {
2255
+ delete _this.image;
2256
+ }, this.comment.long * 10 + config.cacheAge);
2276
2257
  clearTimeout(cache.timeout);
2277
2258
  cache.timeout = window.setTimeout(function () {
2278
- if (_this.image) {
2279
- delete _this.image;
2280
- }
2281
- if (cache) {
2282
- delete imageCache[cacheKey];
2283
- }
2259
+ delete imageCache[cacheKey];
2284
2260
  }, this.comment.long * 10 + config.cacheAge);
2285
2261
  return cache.image;
2286
2262
  }
@@ -2336,6 +2312,16 @@
2336
2312
  }
2337
2313
  }
2338
2314
  }
2315
+ this.image = image;
2316
+ window.setTimeout(function () {
2317
+ delete _this.image;
2318
+ }, this.comment.long * 10 + config.cacheAge);
2319
+ imageCache[cacheKey] = {
2320
+ timeout: window.setTimeout(function () {
2321
+ delete imageCache[cacheKey];
2322
+ }, this.comment.long * 10 + config.cacheAge),
2323
+ image: image,
2324
+ };
2339
2325
  return image;
2340
2326
  };
2341
2327
  return FlashComment;
@@ -2347,7 +2333,6 @@
2347
2333
  if (initOptions === void 0) { initOptions = {}; }
2348
2334
  var constructorStart = performance.now();
2349
2335
  initConfig();
2350
- initCanvas();
2351
2336
  if (!typeGuard.config.initOptions(initOptions))
2352
2337
  throw new Error("Please see document: https://xpadev-net.github.io/niconicomments/#p_options");
2353
2338
  setOptions(Object.assign(defaultOptions, initOptions));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xpadev-net/niconicomments",
3
- "version": "0.2.33",
3
+ "version": "0.2.35",
4
4
  "description": "NiconiComments is a comment drawing library that is somewhat compatible with the official Nico Nico Douga player.",
5
5
  "main": "dist/bundle.js",
6
6
  "types": "dist/bundle.d.ts",
package/README.ja.md DELETED
@@ -1,41 +0,0 @@
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
- [English](https://github.com/xpadev-net/niconicomments/blob/develop/README.md)
5
-
6
- ニコニコ動画の公式プレイヤー互換の高パフォーマンスなコメント描画ライブラリ
7
- High peformance High compatibility comment drawing library
8
- Reference: https://xpadev-net.github.io/niconicomments/
9
- Github: https://github.com/xpadev-net/niconicomments
10
- npm: https://www.npmjs.com/package/@xpadev-net/niconicomments
11
-
12
- ## [重要]このライブラリを使用される方へ
13
- ニコニコ運営が画面にコメントを流すアドオンを特許侵害だと騒ぎ立てて潰して回っているようです
14
- このライブラリ本体は描画部分のみのため特許侵害に当たるとは考えていませんが、ニコニコ動画運営(とその近辺の人)に叩かれる可能性があります
15
- (名前は出しませんがすでにいくつかのOSSに被害が出ています)
16
- また、このライブラリを使用するかどうかに関わらず、リアルタイムでコメントを取得、画面を描画、コメントの投稿という一連の流れを実装した場合、ニコニコの特許を侵害する可能性があります
17
- 詳しくはこちら[ニコニコが保有する特許について](https://github.com/xpadev-net/niconicomments/blob/develop/ABOUT_PATENT.md)を参照してください
18
- **※当ライブラリを削除する予定は一切ありません**
19
-
20
- ## Installation
21
- ```html
22
- <script src="https://cdn.jsdelivr.net/npm/@xpadev-net/niconicomments@latest/dist/bundle.min.js"></script>
23
- ```
24
- or
25
- ```
26
- npm i @xpadev-net/niconicomments
27
- ```
28
-
29
- ## Examples
30
- ```javascript
31
- const canvas = document.getElementById("canvas");
32
- const video = document.getElementById("video");
33
- const req = await fetch("sample.json");
34
- const res = await req.json();
35
- const niconiComments = new NiconiComments(canvas, res);
36
- //video.ontimeupdateを使用すると、呼び出し回数の関係でコメントカクつく
37
- setInterval(() => niconiComments.drawCanvas(Math.floor(video.currentTime * 100)), 10);
38
- ```
39
-
40
- ## Sample
41
- [サンプル](https://xpadev-net.github.io/niconicomments/sample/)