{"_id":"y-danmu","_rev":"4-38acdc45ce5b3cd93326ee84d5a01523","name":"y-danmu","dist-tags":{"latest":"1.1.2"},"versions":{"1.0.0":{"name":"y-danmu","version":"1.0.0","description":"基于canvas的原生js模块化弹幕插件","private":false,"main":"dist/y-danmu.min.js","scripts":{"dev":"webpack-dev-server","start":"webpack serve --open","build":"webpack","prebuild":"npm run clean","clean":"rimraf ./dist/*"},"keywords":[],"author":{"name":"姚晗"},"license":"ISC","dependencies":{"css-loader":"^5.2.6","html-webpack-plugin":"^5.3.1","style-loader":"^2.0.0","webpack-cli":"^3.3.12"},"devDependencies":{"@webpack-cli/serve":"^1.5.1","copy-webpack-plugin":"^9.0.0","webpack":"^5.38.1","webpack-dev-server":"^3.11.2"},"gitHead":"65b6b9cf31e718a06354badb5dcab5d8df1735c0","_id":"y-danmu@1.0.0","_nodeVersion":"12.18.3","_npmVersion":"6.14.6","dist":{"integrity":"sha512-FkLLEjG8vJun9FMHhuyGEs+TzUDejQWFDaLDeG/ApjUI4xf9wzqAVxjfurwkfGTVAW947RLOMVrQmlVhLcCFgA==","shasum":"1ab158e1c48021b29be1c80196e5096b7fe896c5","tarball":"https://registry.npmjs.org/y-danmu/-/y-danmu-1.0.0.tgz","fileCount":5,"unpackedSize":4560,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg1En6CRA9TVsSAnZWagAATY4QAI1LX1CPDlH5VJgOyShZ\nat09z0phggqTRaq/UxehAp+hEC0DeWAuBCbqaglKt2pN6at0c90utqwt9jD/\nxY00wLct0WBjbED8eDq9Vb4v3O+NI+PVGfNZJWYnDh9v5Sb1Vr07HeTtKOir\naplo8tfFJoY8NObn8LU1oqLS5k+T8nWkxFMAOzHYcjFJ8uwjQ7bZ0iIypVUw\n4w4r6KbrHM3CWmWldq4Wrv13EGKTRFnkCVIhMcixbCKh7S8taO7YUuYnkBab\nVFgR4/MHGO1Sqxt3MhX7WmO/X4xmF4bW1ZhsVSg06ILttm2wc4ZO4e64il7+\naR+TQHLVzyfBZ3D/kRgzYPRiHhXw4Pzf11+lqyqa3Ac3iXLxCIWGsWJUcJCK\n7Wk5rY9eVW3gybAasBUmrD3JexTTz8ZIj6Iquby56zDoPRNJcPBiiJiGZTJL\nQnBWEfX80bh1RtSy+NyPY3Czu8EMW68upAK7oQGY05DTD6AcyorUlH/JYMpa\ngL3oDfcvTbX4PByN9b4Zgt9PRaM6PL2sX7NaovPgCjliY6FlWMjF0TAisLmV\nZyH1EB+d/XeCzcY3Glcy9peLDb6VVTHg1UbQcE/fMUvsaDdvPLeCkTQSDnHk\neZPjSM3pHOLZMpz3G1N433lQJczZSibcKZcm5g4BpnygjM22iyrUEdgFZ1zn\nXXmJ\r\n=2N4q\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDtw3mozY7waVThbhr1cPA0f5dlF9y6At/ADpcwgPNWjAIhALuwOAHcQ/LeAREUR/ZHi6LZdWz3P4Bcix0V4i2tRMk6"}]},"_npmUser":{"name":"honyau","email":"635343972@qq.com"},"directories":{},"maintainers":[{"name":"honyau","email":"635343972@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/y-danmu_1.0.0_1624525306398_0.7772578643268888"},"_hasShrinkwrap":false},"1.1.0":{"name":"y-danmu","version":"1.1.0","description":"基于canvas的原生js模块化弹幕插件","private":false,"main":"dist/y-danmu.min.js","scripts":{"dev":"webpack-dev-server","start":"webpack serve --open","build":"webpack","prebuild":"npm run clean","clean":"rimraf ./dist/*"},"keywords":[],"author":{"name":"姚晗"},"license":"ISC","dependencies":{"@babel/core":"^7.14.6","@babel/preset-env":"^7.14.7","babel-loader":"^8.0.0-beta.0","css-loader":"^5.2.6","html-webpack-plugin":"^5.3.1","style-loader":"^2.0.0","webpack-cli":"^3.3.12"},"devDependencies":{"@webpack-cli/serve":"^1.5.1","copy-webpack-plugin":"^9.0.0","webpack":"^5.40.0","webpack-dev-server":"^3.11.2"},"gitHead":"65b6b9cf31e718a06354badb5dcab5d8df1735c0","_id":"y-danmu@1.1.0","_nodeVersion":"12.18.3","_npmVersion":"6.14.6","dist":{"integrity":"sha512-tsHTtxbHLM74JDcpmoLA7hm8HWYJrnGsfz9WAJ1IQjXDJownUpPVowtWAVr7snU1k0g14UWS6aiBKr8do3Nieg==","shasum":"434e32e4310352239a38c06622d6af9b43ccc571","tarball":"https://registry.npmjs.org/y-danmu/-/y-danmu-1.1.0.tgz","fileCount":4,"unpackedSize":6265,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg1vXtCRA9TVsSAnZWagAA5WAP/1Z6wXApZ1TX+a1RGqwq\ntQ1KBfH9Qe9bWtsblsVKe+Z7fSfKLGYjoLztgJg7cNNE6OV2P/TjXbBR/P+4\nOOAULuAIQShFwDEL4Etv4KrQlPj0t+sE+HlAPy74BXQGTr3Z0PLcEAUBExip\ncrM9LiJouVZYhCE7guz216/m/5RnSCTFO3LJhxYo/udeB/NlVl+Z+P6J7ITq\noGK6gzPwfUIEUzMFSzj2pfwBrHk9HGYs79wE8KwFirOlBCTBuvjTT0HusJ/M\nfva44zJpdEG7HPj8bo0VZsvCYzo+U+zOj1shJ6MndC/+BcoNOMMaxDhqhV/q\nyEJWheZA7IcI2w/gfXH7fvoHXVWceUkH2T8gFOEJrhKlILtoOmIUxw22qLKA\nuUOEcBucnEzwWNmhGO4kvLvNcKSKUkSSmwoBd+xXs9LO3APJyzqzOgVPbBVF\nnudVXYf/ZKCJuAtDg1TVVrpEArPaDwBzgAsgsTzFFJtF16SEyE99Dy3so3p3\nSIlIdlwonF0sTp2U+zELdB2W8qlSNQO3yWCY4rCwWoyRS05qILNvj7uvYlAc\ndbwDGxIJkwje+b95Cybqln7gm5TX2VHLVlIaO8scc2KcHOaiGBZDlBaGBo+8\nYhVejaJDPC2SBei0wv+ebWmoJ0FdcajD2AFCp7qSCjnagbLZDh7lDzu9Fown\nb3KE\r\n=DPHt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCsCH7YvMatI8DWGDZP9pcq1Vb+RWHLcIUQRl1R0O3WgQIhAKPVJ4sR2n2FY+Fq9XJLW+3UchWmgRc6tesefuPrZlAK"}]},"_npmUser":{"name":"honyau","email":"635343972@qq.com"},"directories":{},"maintainers":[{"name":"honyau","email":"635343972@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/y-danmu_1.1.0_1624700397078_0.13838997586561796"},"_hasShrinkwrap":false},"1.1.1":{"name":"y-danmu","version":"1.1.1","description":"基于canvas的原生js模块化弹幕插件","private":false,"main":"dist/y-danmu.min.js","scripts":{"dev":"webpack-dev-server","start":"webpack serve --open","build":"webpack","prebuild":"npm run clean","clean":"rimraf ./dist/*"},"keywords":[],"author":{"name":"姚晗"},"license":"ISC","dependencies":{"@babel/core":"^7.14.6","@babel/preset-env":"^7.14.7","babel-loader":"^8.0.0-beta.0","css-loader":"^5.2.6","html-webpack-plugin":"^5.3.1","style-loader":"^2.0.0","webpack-cli":"^3.3.12"},"devDependencies":{"@webpack-cli/serve":"^1.5.1","copy-webpack-plugin":"^9.0.0","webpack":"^5.40.0","webpack-dev-server":"^3.11.2"},"gitHead":"65b6b9cf31e718a06354badb5dcab5d8df1735c0","_id":"y-danmu@1.1.1","_nodeVersion":"12.18.3","_npmVersion":"6.14.6","dist":{"integrity":"sha512-43R/iK2RSKvM3dwcGGTtubW8UI60YAK7m3L4Wg5PBBhguKbIH06+/ksyrEa4n5UK51YSJURsBUmK2KArSSl1uQ==","shasum":"d9e3d10ffe73fe711205f6d366a5a9b198dad6d1","tarball":"https://registry.npmjs.org/y-danmu/-/y-danmu-1.1.1.tgz","fileCount":4,"unpackedSize":6315,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg1yxpCRA9TVsSAnZWagAA/K4P/2FFFVuanTFalDu0hhxQ\nKeK2suwIec+x71NplDTQUhO+xmu8R2y1zCK8Fbz2wc7E1QVLiZ0WhNHO0G/A\n8qo2NSnPri5fSfcYK0rbcYZJ/8X86tp1+3IO7G0ythRCX5uuYlWz+zYJRYv+\nuk4g37sOAjyTiC/PytSDa/Zz/GpPgBGQcqh2fAYao+UyOLSiFreZaGbjfCif\nXTOogkOc6d7XOYjxm08xbIg8D8+vcW1QM99oq9B6TK7pLMJpT3s3D2zjynuo\nOkLSCzd9fAWzCcWq3cEuNS0t83sZBG23zqbmS+Xlv3UmX9rIvhUMeTAf5pzy\n2xHGKx429uPH8LUM8d/k+yoUonYOAKzinYefMsswnCTrW8PP6MnGSI2cFke+\nGq3O91r2ULD/Hy6FUH8LXTA0FFEtM6u8Tc+JabcuFNl8L/0iaKpJ19gZb+Z9\nQ/+LFCNdB9OQ7FdZ8V3RM4c6cKGrv3sL9+pkDoc5GtmBZB307+y8Lj5yXuK+\nV1aCUiT6n/GSFAOss6NgcB6NdcZPTk0qCdhe8BjhvllV1qn1te1aCuDD3fMX\nMlNkrjg4OxwksvvibBRe6M4JZZKMwRtdKNl9ahyHtoBpMobH163rarRKMvAU\nTlP+fgRLy7pinrXkLAW8BjSwz46cmjil2lJbJ16CrSY9yks+iRg24oqb2/kc\nFKu0\r\n=UrUw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID4DZipnQ9t0ezW8/rc+JXJpZRWufzT2lyMyBqGomt3UAiADZHVUbK7frxramz95fryULpivuvKXoesRb1KajOT9GQ=="}]},"_npmUser":{"name":"honyau","email":"635343972@qq.com"},"directories":{},"maintainers":[{"name":"honyau","email":"635343972@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/y-danmu_1.1.1_1624714344636_0.8414106241984776"},"_hasShrinkwrap":false},"1.1.2":{"name":"y-danmu","version":"1.1.2","description":"基于canvas的原生js模块化弹幕插件","private":false,"main":"dist/y-danmu.min.js","scripts":{"dev":"webpack-dev-server","start":"webpack serve --open","build":"webpack","prebuild":"npm run clean","clean":"rimraf ./dist/*"},"keywords":[],"author":{"name":"姚晗"},"license":"ISC","dependencies":{"@babel/core":"^7.14.6","@babel/preset-env":"^7.14.7","babel-loader":"^8.0.0-beta.0","css-loader":"^5.2.6","html-webpack-plugin":"^5.3.1","style-loader":"^2.0.0","webpack-cli":"^3.3.12"},"devDependencies":{"@webpack-cli/serve":"^1.5.1","copy-webpack-plugin":"^9.0.0","webpack":"^5.40.0","webpack-dev-server":"^3.11.2"},"gitHead":"65b6b9cf31e718a06354badb5dcab5d8df1735c0","_id":"y-danmu@1.1.2","_nodeVersion":"12.18.3","_npmVersion":"6.14.6","dist":{"integrity":"sha512-XzOHUIsK2POtz/LwvzkaVcU23RYI9sEnDeV7nYES0eIaK0Po/TGaOSgCu32g+DDeFE3j3LL8rq6WFOlqwnqqGg==","shasum":"3af88098ff70a906bb0d410cc95c0d7dbd04030d","tarball":"https://registry.npmjs.org/y-danmu/-/y-danmu-1.1.2.tgz","fileCount":4,"unpackedSize":9287,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg1zz/CRA9TVsSAnZWagAAqm4P/iwx4jcQGHCYwgRnwngv\nkbUkI4rj+kOEAEsMtPvuBnEMUtu1NphMcjb5pIhaQke307DNh40Pi7ju7qVa\nsMl+zUTxpdvOC0WD4RaFFRZuiUgpjKrzmNBCmjpv9DusX4nJtFttdY6HHkkb\nL8dkTyhmEXUwR9REY01OtjsOVJ4XvVwoBny3oA7Vk0b15nNA8ygQ2TVrpqfb\nzS+h3doROSoLbIw5+fzo+bzPTgCOP8Danya/PRNHuSDWJs2VKsarzWnSaSvi\niDb0Bo0G6eWazUyopyMueYQfCr+YYTz1CoyWwEqHlJXfBui8J8dSo3M1Tynq\nz05TFI4ytflxRxeA8pjShSrvEc+mkiN4XVVNcQWLLeNG7ImnTNMS728NxJYw\nzUxBBPccT1/6ec6ANQhmDqOsm6UcIsVvCvxORBz5oFBqarSUvZg0VcUA4gcu\nILLTdwHir+TUzZ78NXvUzKTQ3G98poBrpbwoIgrmES7pLes0WKv2ENrCdR3T\no51ye6T8xiiW3zHo6EWtlQnyIzMIMKcAmXvp+cgSkqPPE6Hu6FoRbwIxkFeG\npWhqkAvkmWXkqCSU/3CS28D2u0Ot0xRJRxqSKqpYC/SkGKewh6nw1N8FGwAg\nUvoVSekW5ZbGU2GEFI+Mdt0lYiSPv9+5PKKHExBKkq1plTH+FqgEivUOBa1L\nFkjC\r\n=gelr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDsdw3dQ/O1V9QYdrg9KaMe1TFMEUC9xx8R3DXkvzq78AiEAgkGYMkEqRBcClbcpex14AF98U6kpJqEFC8anIKaJrHM="}]},"_npmUser":{"name":"honyau","email":"635343972@qq.com"},"directories":{},"maintainers":[{"name":"honyau","email":"635343972@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/y-danmu_1.1.2_1624718591442_0.24834710496130352"},"_hasShrinkwrap":false}},"time":{"created":"2021-06-24T09:01:46.398Z","1.0.0":"2021-06-24T09:01:46.546Z","modified":"2022-05-25T02:48:19.245Z","1.1.0":"2021-06-26T09:39:57.193Z","1.1.1":"2021-06-26T13:32:24.765Z","1.1.2":"2021-06-26T14:43:11.594Z"},"maintainers":[{"name":"honyau","email":"635343972@qq.com"}],"description":"基于canvas的原生js模块化弹幕插件","keywords":[],"author":{"name":"姚晗"},"license":"ISC","readme":"# y-danmu\n### 基于Canvas的ESM模块化js弹幕插件\n\n# 使用\n### 引入\n#### script引入\n进入该地址，下载该文件到项目本地目录，然后直接按路径引用\n\n#### npm方式\n1. 确保安装了webpack和webpack-cli 没安装则使用以下命令： `npm i webpack webpack-cli@3 -D`\n2. 安装: `npm i y-danmu`\n3. 配置webpack.config.js，给库设置别名方便使用：\n```\nconst {resolve} = require('path')\nmodule.exports = {\n    // ...\n    resolve: {\n    alias: {\n      'y-danmu': resolve(__dirname, \"node_modules/y-danmu/y-danmu.min.js\"),\n    },\n  },\n    // ...\n}\n```\n\n### 开始\n1. 添加Html结构：\n```\n    <div class=\"container\">\n      <div class=\"video-box\">\n        <canvas id=\"Y_danmu\"></canvas>\n        <video id=\"Y_video\" src=\"./example/assets/movie.mp4\" controls></video>\n      </div>\n      <div class=\"opt-box\">\n        <input\n          type=\"text\"\n          class=\"danmu-input\"\n          id=\"Y_input\"\n          placeholder=\"发送弹幕见证当下吧！\"\n        />\n        <button class=\"danmu-btn\">咻！</button>\n        <input type=\"color\" class=\"danmu-color\" />\n        <div class=\"font-wrapper\">\n          <span>字体大小</span>\n          <span>12</span>\n          <input\n            id=\"dm-font\"\n            type=\"range\"\n            max=\"28\"\n            min=\"12\"\n            step=\"1\"\n            value=\"16\"\n          />\n          <span>28</span>\n        </div>\n        <div class=\"speed-wrapper\">\n          <span>速度</span>\n          <span>慢</span>\n          <input\n            id=\"dm-speed\"\n            type=\"range\"\n            max=\"10\"\n            min=\"1\"\n            step=\"1\"\n            value=\"2\"\n          />\n          <span>快</span>\n        </div>\n      </div>\n    </div>\n```\n2. 引入样式\n```\n<link rel=\"stylesheet\" href=\"你的项目根目录/node_modules/y-danmu/dist/index.css\">\n```\n3. 使用`$init`方法实例化弹幕：\n```\n// videoDomId--视频标签<video>的id，\n// canvasDomId--canvas标签<canvas>的id，\n// danmuData--弹幕的元数据，即初始数据。例如：\n//const danmuData = [\n//        {\n//          content: \"还好还好\", // 除content是必传参数其他可选\n//          runTime: 3,\n//          color: \"blue\",\n//          speed: 2,\n//          fontSize: 15,\n//        }\n    ]\n$init(videoDomId, canvasDomId, danmuData)\n```\n\n4. 添加发射弹幕方法：\n```\n      const dmuIpt = document.querySelector(\"#Y_input\"),\n        dmBtn = document.querySelector(\".danmu-btn\"),\n        dmColor = document.querySelector(\"input[type=color]\");\n\n      dmBtn.addEventListener(\"click\", handleShootDanmuBtn, false);\n      function handleShootDanmuBtn() {\n        if (dmuIpt.value.trim() == \"\") return;\n        // 发射弹幕\n        window.videoDanmu.addDanmu({\n          content: dmuIpt.value,\n          color: dmColor.value,\n          fontSize: dmFont.value,\n          speed: dmSpeed.value,\n        });\n        dmuIpt.value = \"\";\n      }\n\n      const dmFont = document.querySelector(\"#dm-font\");\n      const dmSpeed = document.querySelector(\"#dm-speed\");\n\n```\n","readmeFilename":"README.md"}