{"_id":"typeshaders","_rev":"40-a335b088aaedef6e1a49cfd06ae9e08d","name":"typeshaders","dist-tags":{"latest":"1.1.1","beta":"1.1.0-beta.13"},"versions":{"1.0.0":{"name":"typeshaders","version":"1.0.0","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typescript":"^3.9.6"},"gitHead":"d56b9220371f445ababc3b96d2749a00fefab1ce","_id":"typeshaders@1.0.0","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-mpj9JXyy0oTUsAoOJbtpTC0cn80LkLouHp0blvjde73vIzSv2GrvqW17m8yQOztPBMHmDtxffaNXpr6ulujUzQ==","shasum":"e25fc436fc746387b2b4ce041d485319769e17c5","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.0.tgz","fileCount":18,"unpackedSize":23656,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDGyfCRA9TVsSAnZWagAA49EP/2KFXys4Cx7VRe3I9fQG\n7ds5cCJ5xF0fFmkFrKohtpV3bef78Ehkfd7DQFUVbvDrIJcppB/DOcYhy6Pz\nP5s3dqDBOwlqtPuHhwEKonsC/CNVwPTwpd3G0K9zUBbn4UBMsGobUCg77xqi\n4OsRbPDbYZsp4EEullt57YqZP0STf0OQYRyZIE7X7FzunTYK/EY6GX7fYoZg\noOovSvk0UEQRDlS5CVo6t5jxepBuN5QGSiyCiwznfcTNYlL5Mg3RIONAB5QQ\nFegLH2NPLJcTS3WXW9SqVTiLELZWqkQPOEggJO0FErmaTegenbjjaXJ4QK1k\nHTGyFIS8mDeHUp32ySVrAbcN2e8igijdulK7bDm8CwvBNehMl2YEhNBUaNYJ\n9pdC6QSd1lstUcdojd1BEAi3lXgvSheYB3/e6kb4qbiT84WqFTNQ1MIOqgoj\n5vYqeLJiuXgmHs7MPqjUydpVw+h6GkSbdz0FqhF/U7X61RiEL4P7iFUBFEPo\nxeA/O75gv8Tddltho4D/MSE5Cyd/bhHv/mr08wEOQuF9ZSOnQX8hTV/mz+aj\nsw39XL4O+K4hV9NLvZFZ9p0JB0gWJiPMDKP6Wvjt5xolZuMNw0A88IjNvD/i\nAiSotJ5JTyvTaauhXql3FEPunXhUWSFJsYxX3nzDh4zTbsYcQLGIkERKalln\nZtmf\r\n=fFFl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDUy6LMKw2M2npEXvxXeXm2P+BG/zQgAMSeopyv5pmEDAiEAuNtRzLO+lplJRmHtcnFO9Qo82rRxxldpnXMAitDsLXc="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.0_1594649759522_0.8155861479210675"},"_hasShrinkwrap":false},"1.0.1":{"name":"typeshaders","version":"1.0.1","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typescript":"^3.9.6"},"gitHead":"522751bbf1f06b07a45cec2a4f2c542089b76afc","_id":"typeshaders@1.0.1","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-MumZ1BwmuD1QdMZivwoUFuZwEp3nTNfSnyGrfpiXefFvizsVrMLwbzOWtHOuM55ajW/uLKBSjU1UFqPRRp93KQ==","shasum":"df70216f7cbc5109c5949747036e43f8f4a49bb3","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.1.tgz","fileCount":18,"unpackedSize":23559,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDG1ZCRA9TVsSAnZWagAAmksP+gK+4TiwxTm8pWI13Qh5\nWl2HtdS3nYFPbXD52Fq87ZxE2OpHgp6D82auwb1lXwNGMaiKrymub8WVc8JD\nyj9cAplrmi2loiWSVnf78EDyi86eKMuDYQOsbDltjsp7CGF6/rmqqEcd4+qU\nXEgpHs63+mzIBJmzbO8Sp2HUdx/kpDCEq2pXUH2sL5+68PRSAm6x+bNGDbtA\nI/Pf48qHJ5GjMigRnrosQ3ezBYjMfbg/dwf6B3eHHiV2i8upyk9jwySSzJjr\nfGIACKAFGTnTwGdxSQzYqbYRQOOufqB9DWWnUnHjtoIhQ8ySmllVwCM7Y7Sw\n6Lm2cJeBt9RAznHaTATRLZsNg2/N5z80cq1XiLIsPcgaOw9tjbMEkD/zffjF\nALj8Mj3N05jkI0AVW8+FrTJyDs106RA6KRtHgAWzzwb/XHpSVov39Jm2XjnZ\nr96AlQe+DDfWw8vRa3QUZE9o8Xv3GzOTFK5qJZ8ZGXj4TIE4vAm82tkj8Cut\nYLItodFZbnMWkC3SoFTRgg+cu90QajnQ3i3ef1ATbokerki/hHt3d+tHCrWg\n68tMu0ehkpWzPJuH1W4UFH33Piw/Sd4zNZ/ONAFKv0KvIu/S/plCP6HlPpOE\nkzO5T4mQ3qbtbhGvb/aYepmcKZnHLIjX0N1YUWAvqKS9MKAj2xn6NM9c102M\nzdX/\r\n=Qiy6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC6gpB3CpzTNmsaxNQy0YusXJggjQDJfw8+kN/4OWdmSQIgH16/4Sp8ang0Yc5Lv89ASok/hlgwY92UB17kyLBNVLw="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.1_1594649945122_0.65102186030907"},"_hasShrinkwrap":false},"1.0.2":{"name":"typeshaders","version":"1.0.2","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typescript":"^3.9.6"},"gitHead":"e48ef380ad907ee9b1e141d3ca6c1a4dc0f7f942","_id":"typeshaders@1.0.2","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-0k2z3PqCXFYNffYM7suOi4pri9+NjTJEf4HWzu5IKT5SKpRHCCpFNmPQ/iPTMmXwoJCdOPHGRXmijyCfW/8vng==","shasum":"e2da4cabef35f2ca87b6c3ad51075eb6ee8fcab5","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.2.tgz","fileCount":18,"unpackedSize":23673,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDHOjCRA9TVsSAnZWagAATGAQAItsUFUOGm/mOKe05Rpo\nY7R5uWjYypBvuIuxryXY8EzUjjnwS6GZYRYnPiEhJp1j1f3c4oRkcLkguBSA\nPh2AncuZ4FMOdbzi19XLxtJW4xhU60A0BPCDwtrd/BVA7pdGveO7XoGVjemI\nB9DccaXaxW1gRFv/GXjdtQq4n/ASQ/ypdO5x+7E2jwBVWA685dsqyARPdg2W\nlXDp/7UMhXJFAYdiqbwJuv2hjmTSf59/xn41yyBSA8zixJfTo21nuC5D8HQF\nVFX9mG+TZnHrgJCJNE4fcOsgJGZ4SUvBq14duTHQ8tbi+yV18fNgK/Jg4Tou\nCSMvX3cxvlYqXZrPGrlL0iK9gU77jFeHTu5b8Nj3o+9zqeBzHw4qGGuroKxI\nz022nNdDEwv9uBkb7z4h4dMgSbKKNC+/i9U1puq5CmrQZsacBkgb9DDe1S+U\nQgFmRVge1IM/i7BpDwv4AYbXZmsYikMwnWPV1GeNlw75hglBHSvmkQo69UZq\nt+IMl3IFGEgKxy/qa9RNKlKGv8WXASapB6tvV8fcGnujotdXTceGDl9pG9Mx\nY3sn2W/njsoG0KRpSowTvWtBhpYrO7iVuGJ7dc7X1c3cGh8tfUjORVpc8mQh\nTE9SFqfXrZBL5XOOPs2KMwR5RgUIrZApdxoKFnPoFbNNMXWEkbw54byyjrMQ\nupGA\r\n=SIxG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD0LFniE9kwQP4/XtU1wH+nJFh3WVTvajqwU335zJfCpwIhAOvsF5P3SkpnDeMQRttABhXCO83YV51wSAcdhx3Dh6pX"}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.2_1594651555185_0.6963156799130046"},"_hasShrinkwrap":false},"1.0.3":{"name":"typeshaders","version":"1.0.3","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typescript":"^3.9.6"},"gitHead":"fc1b3bcc55f86fffcca1ee36b7a1658501fb21ca","_id":"typeshaders@1.0.3","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-xjmJJbyCbSTw8I0sznnFywg/eVcrsgoZL3o7YZ+yJUm58Ie0kRK10aSLKVnIoQpygv6ikEyc2m+70fi1UnOeQQ==","shasum":"0433ee2edecd7ab0c729be1d5132b3f5ea643140","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.3.tgz","fileCount":18,"unpackedSize":23654,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDHrpCRA9TVsSAnZWagAAEBQP/iIXoX6eH8lODW6XFxE9\nJSp9v0S3bvYjZMqWL9bEzqmyTmS9JsUDFacNLUHw5bRjQ914vjRtdi7+f5KS\nijep4GY6A4I07tKwRLZuQ0mFRBWNhV866HhYySXrZ9MAvbtByWK3M+QRaD9G\nmvQPXFR10gs1sQeIjnQcsyY32+VuThjERkP055e5hGrhIDvJK9/WgSWacDjF\ng4a8j+l6EOXtlWYypsN4UpLmqIdP+/STvoQ/Xu24aQGcHaCGuBijvJlpon+P\n0Ncp71Ahqdx2yyHa/N4378+/wyxklp5Oiul2iZ1KMg7X3Gehg35/ipx/LDp1\np2mAxWIX1YCryx8rKhLXCagimtkMr+5blev/xDIhM5XgqQ7lywGo8N6Ov6Cu\nsodDGATcyYFMqcNgkS6WR6ACYI2S46BdoFvyNfYvaY622OpbxTzXrIiKTrlD\ndRAfH4uUV6cHlzdytwfVhZiRoVVjh3lIIDh5C2pmD5yMpr1aMWDCqQzgJ+Ao\n5QAUlGZJnBmpZCHXVY9Be5rKuPEOIyWJRTWh3EioneN/dCR/dqTXhKfGI0ii\nZh5OEK+vPh6dt6tTCNBQUg+faei+HLtQkNMO/O2QX3PjnIZaZwh76fEk+993\nmA4iou9kOMZ7h2ugg+VhvOXlY5ZWK8o4QeoiZbIYErbI8zKrHzI5zK3ofa57\nthFd\r\n=Ny30\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICTplbv3pScKHcgb/neLjDdssfRV72RgnURj/z1N174tAiEA6KrKyj8t216mL6sJHZ8prjH98xB4CThnhu+Rnk0N6/0="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.3_1594653416974_0.43392262820239647"},"_hasShrinkwrap":false},"1.0.4":{"name":"typeshaders","version":"1.0.4","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typescript":"^3.9.6"},"gitHead":"7cdfba1a9a599a534df20b40a38a4bb05a58d1da","_id":"typeshaders@1.0.4","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-VrobFaPoQO3fa4cAVxw8okyGDgXqQY2CdAQBpxKPnu2WzZFSTbflVgtb2/YgCJX4clcYkK5HpQG3KrNfne3aAA==","shasum":"dc60777fa8ff919f4300808aaff5bedf4ada4a68","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.4.tgz","fileCount":16,"unpackedSize":29708,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDhSiCRA9TVsSAnZWagAAcgsQAIBVY8FNsKkOD6ETaM5D\nyV8w0B9fVrtEi7E+fUREAgDTElf6vii181z/Ung1Hm9PZcw2o1gI3/tg1NDL\n1psceQ6ukpyqXcY7qk42RMcwryyZ4tq5D6m7dRt+AhBTfASK8b2IGzKbm90+\n0hUadx2tjBrAJHxVo7TIimdpKub9Vqf6Gp5BB21mk8Sb9bY0lbE+ARSZTEfb\n8Ne0ji5jZsGvEsUvpDtwqHG52nHJaioYk3RvNNv1AdYzggQJlguQP2VQ/1eG\nF5buvQxjFLoTnbXNVueW5HqIHgpmMZkdQou/gWkpnZISfmeMt5KL1bvyP7Y6\n5JSA0v14C/OT9Hpe7Wuf2szApDd/lE8fU2FFNSpIqOlYkyQOeZr7/0xqn2Xa\n9NnDJR4iryqszsvlDwuKIIZcMOv4WNgoXjHuRFTTsBqiDAq09UNqRG4AMOso\nA5+lbLLGsMeY/YhnFkc9qnSOK1aP27Txa0Ze1SaFaHPVEX29E7CS0Cj3kuco\ntCHPgsBBU19/GEbqeF8n42Y9zd6R8hiGZwKxRfjcbFzDv4vaB+RkgMF1OFlp\nyVMy6xICncT2Ms0JiLukDIOJY6bhxp7Yl46lXl7TNDef07X7EsPPtb/Lu0t0\nm8HBqp8T+UC8mhQpGXKKmfu8S9YngJ87jLZTA8Q/vX/DiIfqHaxta6UqsX8b\nKSuC\r\n=ZG/x\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFiXq5+y39dkoe1/0yeOyC53XajQQfJMRCaSWJMzHx7dAiB8ylJaXVGnb+4tA9bgfgFKfCAq2sS+dNUu5ckNuYTSpw=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.4_1594758305348_0.9129310070722987"},"_hasShrinkwrap":false},"1.0.5":{"name":"typeshaders","version":"1.0.5","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typescript":"^3.9.6"},"gitHead":"4c782675bd6b42ffd159d55081a267ac03499404","_id":"typeshaders@1.0.5","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-3z60mwGv2hpUGlxKSBU2ef9eZYJPSQ1w/4j4xf3Uiw6kJw5iGNnms0hh605sywMskBBSlwhBb3i3dNb830xS1w==","shasum":"1d257bc8ad610e8f65c1ebf6adb7f56551b47a06","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.5.tgz","fileCount":16,"unpackedSize":33759,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDinaCRA9TVsSAnZWagAAyAwQAJTEpy3XaMDazHs/brIM\nGpfsGYOIkM9NaMSjljRldp3+gCz/tPrzznVi4RCAet+Lfx8xnTfO99rjchw8\nuOJglya5x6VBfxSkzyavUJtdKtTAOYubqFstiGLuEt18AW44TCirCylxOVpF\nf/qeGfHkdbv26hHtb3HkoTkeAIN4gOmM0hmDtzc8e5brj0kVBsTJOFMWE+GQ\nT1+H8F/SA3aApGQYt/DNNR4/uhjGbsZD7P9R1FLp4Deu5mNgcQjijRIk4hwM\n+VR4a03VDo0BM3nysvX8zfEYM0sJJV0oKHv/f5g4lZj+jNGx5SLPXi3Xe6+C\n5hp6ad9COqnFGdtnLMpGFRKW3bjNOKj3Tjb1OC9BvRE8PD6kFv+AWTYUN0HZ\npEnlYWrDr5/nrPozyWy8TgXqdMi+m5d12YzvW9RQ4NHy5qzOrTnmmp75KN1g\na1mw4DGXFJeF6ECypdWsC5om7hfiPdYoS60wCDE7i8aii+eZW3uBsA5tbEN0\nD4skL1BuvOwC7Vl1eXQiPvOZS65t4ETUtiZrhyfuql6ADLM3SWFzK1xGIjrK\n74BQV/6O3WB5rMLu7yHh92ngyjnk/HVANnJ93/17fBuoxSUSYu0Ok+QRX8xL\nSfvoo5eiPP0nT4HEWBH5m+0Ks3luU5mVHlMzIOdnGApAqhejy6bSz2uzjxKq\nedsl\r\n=sbc1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFo0y/a640ygDHmUMZclvQ1LH/lPd1rxcoCTm0gtVFpeAiBZBVtHDzyXY8OwpqRczWp37TCwwliZxMPBCztMkqM5FQ=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.5_1594763738489_0.9849308710496483"},"_hasShrinkwrap":false},"1.0.6":{"name":"typeshaders","version":"1.0.6","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typescript":"^3.9.6"},"gitHead":"bada987253ca8f4c3f1cb20336050305cc673944","_id":"typeshaders@1.0.6","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-Mo862tNba0ChTlPUSWgbgOUGP0HXzGPM2zzoM5a4zJYn4SRs1qzVCgJkcNWsxA8QJZ7a9bcbrX+nCHWScojn5w==","shasum":"63408a81cbea098ef7ebe9ea69869711c9499f55","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.6.tgz","fileCount":16,"unpackedSize":34809,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDvgmCRA9TVsSAnZWagAA9HQP/RpwrnQQ6iTI/pQfSEyO\nNG7MfH7Lu+4ebMhDU4/DR/GAKDI7JSDk3RsRCtnJL9Q2fhzzGt64WQg+2mmH\n/ksf2jCn1t48z+EU/ipYzXiyND5ue3I2c+FxeWbYs+gAmcn1rZVC7eFsOp86\nFkvV08gJW27EKwzlaVqSXfR5u92+Ouz8MULj3lFNMcPxcdcNAetDaluzqhMA\n9vuuYwrYopzPU+L6owg22w5xJPYvcHBUwFXnouZG4+r6Pf5KNNxvccKUlp6w\nymK2UQjU5JgqJ8TVNB/F3mNWUjICBIdy8CoNLW2dc7tdY//OpDnp+FR+S6FR\nCdlL/sSMGQb7BvrRm1GC7oyrDF5QG/RLEF3/rFB2oyZ/SGWXr3agMmCf6qDo\nmdrBofy5XilE3jXXTDfvxkxxqq8cXUSYnZq62OhXBoqoD2Kgg+WdOKNEzaDK\nb9QiBz1UfLIWFbfrWRIsil+bllGiS0//QJ89xedIrxHf3Pm0ZzRNYwGS+Qlm\nyumFWYosJqBBAvpVAFzem8jT7y28RTNm0wO9LpqNkUXM98VuOB0ua2cFGzil\nn2LPNI85mS/iSs3JDeH4SMhsijir88Ee822ThoSp+INLXO606wR4f9HKo1s3\nIuGtqVa8JH12qbwqgDZ0rf9xev6UWzVmq18BJgUZEEbi9HDZOgzDoU+7TCte\nH9Es\r\n=srGA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCF4AxaasoVvhZO8NtJ5+zwaKkOBpBYQ7gvUysuchOFUgIgXmcW1m7wVS5APaQK3vbpppyeoiQwAj9+/3ujz29sMfY="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.6_1594816549583_0.6473203462878259"},"_hasShrinkwrap":false},"1.0.7":{"name":"typeshaders","version":"1.0.7","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typescript":"^3.9.6"},"gitHead":"218113dfc9cf87bbc060ff130c092f2ebe17e803","_id":"typeshaders@1.0.7","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-FLuj6k4UFgZ4Zh75dQkRbDvBrNQkJpYZOXpphlILV5woDnswlOucZR1wz/OvZJfScydut7UqGLinDxIyaHv20w==","shasum":"0592bfabad43f6cb2679f588461cb9d266f6341c","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.7.tgz","fileCount":16,"unpackedSize":34806,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDwR4CRA9TVsSAnZWagAAzOMP/Axt8wFAPX+cSniUmmkb\nMz/l56BcB2qAuX3K6h7Qqe1StBqWLnYEiEZkkio5aT0YIDbAczWgWAkK5CpG\nHdoFjbGvbVCz3UnJdtrd7+Q0Ls73Gvx9vJj/ALAKgl5UEJwcBBuVLkjcZSFK\nJohGzoxhs5munpO3Do9u1VUCyakgUqwYAYnxhiqm3Imqw1JuGCxUtvq0C/cP\nM+9WsyUcjuIGRFbuRQYmd4CkYFzfrqQ8od7ejZ1ZwCu0b2s61sTzbTpE+n9N\ncPMy/HmU8KRQCdXYKHX72R8O1KYhw/swnU9eXq7jZExCvAxPU++oWWW7Fl/R\n8EqphZUUQkJ0FSgreSop1mTNZZHtD0oZ0tFCgeBBix6G4JanLfopmrowmXT1\n+b6sHn7SzjgtXkngib7KzamLDUocw9mWazu7/po/KBxeUeC7o+QkS4ZBVfcW\nUxKj91z4kF6+TJXoFc/3Bp4yvmXbrEEExh2WKR6DVsFeoqkRL+VyKZlzX8jl\nclW6paVyz+vlsxcAooOg707hftSv57T+15L4tkPqK3KrPQw7IE9T2zPc19Hw\nGgR/kR2AcmNv53TdkySihYAV3tD8AJInzifRHQt79NEqOG2DQEZuHIntonuy\nz9VisDMdM9P/PLZmb4WDfeIIlX9nluMrbzJ0MpLyOfUf6V8pfrp/3mrxT8JK\nH6Rz\r\n=Aqgf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD4foEtWbAsc8Ezeo6O6freK5s/JvViEJIgcJghLDjrVQIhAM5pz/6sfiGQ3ALgo0WPYA1ZIgABes0k+aVNwJ44cZzc"}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.7_1594819703559_0.3618035669980544"},"_hasShrinkwrap":false},"1.0.8":{"name":"typeshaders","version":"1.0.8","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"364d18687ab70e6d826885ec30065199a6e1c9ee","_id":"typeshaders@1.0.8","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-CHC8PzAEOH0ptds4TXntVo16IFcYgaLXWHzJgIiinRbjyEi1yLg/rdNfnvuBM0Cb6zPomt7lfG4fNRfrWfNEug==","shasum":"3660b1341db6bcf1a46b103ca95173d6c3501c28","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.8.tgz","fileCount":16,"unpackedSize":34864,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfF1vsCRA9TVsSAnZWagAAZIkQAJvHENLmstlQlv5B14xT\nh1nl3Zevw8jnmrXwqrp1a18dZOdTo5A26QuvqQm395AzcYR4ERRQcQu/CaMp\n34l8w+0/Pxrf7sgOzpumIOeCmlfGXtITUURC28k8vBtCRUDrJw9WByY3lGIQ\n4Zb/PJwosyWo5sMPqbQ9EtCOgpsLNlWepSz3CQzA0n/Uc7/2Ry2ouNfEaJ/c\ng3aRfBYXczwo1fli1PpQx/r4PHSyIUCsSHTDNFO5iLckQN9//wiDuw5WrXI/\nYC7iLynd0dX6f4m309nk0TImdb+PMvHH56r417l2bDvu6oG952pZT65asxMy\nrTNZu1qnFjARa+RhAEq2W4kZXQwCvixf97gHbOMMqE30s2ATSQFnrr9DDLMT\nbXLamze33RzTszsQB7KRCTXH/4qH4rUqL1G46ngce5s2zloEtKGkZPXHeydu\nTybI83O1iTyKzFmiQkJ8r5Vj3k8IZJ36WTXmitNrBGGJSuRYfOyrG8lHJ8Oi\n9/Ixu2en/UDiedbnkimz8DgRjndUtYWtrxCbMtL0Q9MFCzWYGhfq5Tv8OyIW\nxYz+iTvtp22o4ix7wnCG6+8urZaQQg6DJNkI86NqAcODg0yIGEOu57G6DcFA\nPg40FOA/K26UrFnjLUf17kefZLWqs+s4Mtgz+VbE0NR8VOdJrx74eyD/ooT6\n/VmB\r\n=saah\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBBAzeuSYw06u1NsGTst6DPMA4/jpUKNzYN6YbP4KTpXAiEAwL9gcwEYC8dfg4UfiQzMME13FbuZjCXbpX/oIAV2m3Q="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.8_1595366379486_0.5781237534854433"},"_hasShrinkwrap":false},"1.0.9":{"name":"typeshaders","version":"1.0.9","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"485126d5f6ebc7d15cee215133835b6778b82e8b","_id":"typeshaders@1.0.9","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-eGUBxWd8PWoSnW2B3aGy2159txe+VxNhBARyeQNAW1lUNi0oxkbx67mqQsozh4llX4p1i275XymbyPoef0x/+g==","shasum":"efbf458fffa1a06a2e3f6ac3da011afac09c11fc","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.9.tgz","fileCount":16,"unpackedSize":34864,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfF11QCRA9TVsSAnZWagAAsboP/3fkwBx4XYVg2NVCkmp1\nkeB5eY6x25kjAVK7Ung9/KZ28GdDcmI45i7ibq5WEmsenyNfgxCayygN0+Ow\n+1ATvPCfaS6HZ/dTuOXjZe5WpD8J9CfR2dTs3qM8HTLD6iluZaSw2rojVJ4o\nK4IrYnaU0+jkxzpj2CnfpTcNCpcSlpsBs3AH1EHLuMe6WB5ts8R1jiggf/AE\nSwH/eZ4PN5uVT4UF6DQLT94ArvoZPceZfUNv73lyBkwfYheE/z/rGvqMUM+e\nmjGCxwtHhLFH4aZA6Qck/fSk2wFam7fjN2wv2KmneEBb4MIhz1IiumcpmtM+\nrj4esR+4gnHjpwnn3T7RX9+pPPUSGWmKo7nfZEb8k9m2D+sW2W16RddFH2Hw\nVGeQnF7stDTcAi5bv+nfszwpnb+HU/3i0HYZVTIL5vDeMO93iqOvHOFxutMw\namO48pJLxcjxJg3NqSKrCHFH++GVL77Y2FQ407AiJY3dg+BuYt3YGvb5y9w0\nPMAURFKj00UbOblnBVqqE8+JUzu/KqkeTjEwFg4z680rZ7r91u88kRe/h+7E\nWQAdBisXgrmaeUjqzKdXulmJMRIuOFxinTto7O7copplm8wjE43c6RgZ3yXo\nvqTd8oqwF2Tky/NsHDjjcdMKRJA09QKoaN00uf2FedrYVljFY2ACErWoFJJE\n3h1Q\r\n=/sOF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCn4vLlLkrL3rgjoGfy6x2R+XYqHbe6SQ5HCt7/AZEXqgIgZEz22479RHiHyDfdXNxL+h+y/tg7hNilce0Hn+xO37c="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.9_1595366736507_0.5467267207794415"},"_hasShrinkwrap":false},"1.0.10":{"name":"typeshaders","version":"1.0.10","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"3a1bde17c70579e93df3efb4a20982ae6b2b4399","_id":"typeshaders@1.0.10","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-FQ/QW4nM0487BE8TfzM18jtztCQ7orHI510EUviefM3I9caoAjRb1I87iqrVglQ3AGEa6MO3kd+7rILSBuIJAA==","shasum":"7a6238ed5d8fcb38b3f75f8cfdc556b60f867492","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.10.tgz","fileCount":16,"unpackedSize":35661,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfF145CRA9TVsSAnZWagAAUBsP/0W8oNvvkN42OKzsAUj6\ntssvycf6KURIZBf8LZ+VLESREjOWrK/nKf+/IPry7RL6nQjxH9XAYEsaK33J\nokzZ+yY5sKwssFunUdknt/P4qgFW8p1y+3FmyOKrwGz7Bo69tys07jHY1ci8\n+BHoSdIZcwPhRIQrvxriQW0zwiH2KdP++5p46+yO2S3vOvE6Qjl94ps0e0VH\niZepdHAkKszR3D+kUg1/0dX00D+XMfJOPfeeysoxw6Dxxyd1urVqEbXmfOee\nUwLKVkn7NzBcEBm+GDRwmCfYXdui1TzOUPXjeZMHaYeOo4lq93ebJ4elpesj\no4vUAIGbmpootEyQzeVf2RAnRVXg9uCXZnFSpDVme98rOZP0L4mfz+aAORAP\nAPioKVb4mfoQ2ndvTsfCexV/5bvfDnIJn+CNtFUcx4l1Hw9kMgBhRDNlh26F\ncGtzFxZ2xj2ckxUw67B0iW4cBdxTccrbplkSQzQj/lmZJHNcA+ycMBhSYQf0\nfCiV4CB21Pjc725rwB4ofD/BDokd7aCJ2VDQyhQ4kMBbpAcqjEzG8JHtGsNA\nDAi0uJ6AXCzVnJW79X62mMn6yC7vWoQi5gfwS1hlcvg9KOISwoza8QgJSyjT\n42Sr7+LZwkPF4851BwbLgDsJBKiMU03gF7EJtUDWmRtpK5/4qMnXRAz21sby\nm1fB\r\n=n18V\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAeidzlP9OSic6hSsTSvb71A4WRvNvzSdpNDpMcZHdE0AiEAmbUrm/Lpdc1rM6h0q24TW1DlVtdR2WeGxhj336ljkGA="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.10_1595366969405_0.3467837014171664"},"_hasShrinkwrap":false},"1.0.11":{"name":"typeshaders","version":"1.0.11","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"082c9dab9d63797cba70de348ca967f152a12a7e","_id":"typeshaders@1.0.11","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-mG+KwItkgecJHsA2iDs9Xn6axJv3cuQWtw3lkmocLa0vacAxpizLLKvlXJIO9K1C5ymUeD+w0HA0YK+EDRKVtA==","shasum":"7fdf2dedee9ef19d29bdb05153cf4d2f75138d44","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.11.tgz","fileCount":16,"unpackedSize":35661,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfF2KVCRA9TVsSAnZWagAAohkP/1KOZcT1do/cY1jHWPvS\ntQxwvaGXvMepkvf9GaItmKnlzWgbafC0l2u7b60Bz9xDYy69bBWCFyqLicx8\nftuqqeeWNHROGLIE+f5ZXTfjU7KE1NUAliSX9cRwT2BmOSMooK/cMgCMxZFL\nfWABUuSazpuLwvLN0azMvAq2qrMHWedSZ40xupVb0ZQ71T5OCpNRCHkIasbO\nDtq6HruiYDK0egkNvdeOWtbSf4ZwHZcwo02HQgGs+AnhIBdciPs7bejTNQ3A\nsyGBgZ6oDNANy+DBbBXguPLZm0M7e5IB3ec8vfXflpsExgMwWdp5jiWoWf7z\ncYFgSlbgiPKotao84swIgN5XR4GwSjSauGG7+MveHDNKvQP9utmYNYahISXh\nEcABc3T2TnNwbGDsekXZN3wqDT+ljo/fhuVCckEKZ1MmIQJ5+vGegjOXwvix\n+9ppZDGpwDdX3WakvDwQC4qJnkalwi/ucqcJn2psROAKIYA8GljlaILaAICc\npQ7/di1AKoFNUP9Gj/ZNIvD0MHQtmQfEn0/RekuJWs3h+kfdjbscMWY1m1HX\nO+eizjJZLmrhhwHimyadWC6GT221tLVSThEOOFUlB+fY7K0gyGhkaJQcGu0g\nPYYeD4mLfJDqzdvp1LzwBmxkan0j/+NFad7Zp16/SEh36u8WqNVybOltlaVj\n0H26\r\n=iKj5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDJW7fJgm+f/gt4vZYjLceBdiekRQUGBlHoUivHIXjeEQIgTPdyx2rRQIwgSFP5kLOpH7Q5vEdI4dKmRoXRkq2ltfo="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.11_1595368084592_0.0005707145607338759"},"_hasShrinkwrap":false},"1.0.12":{"name":"typeshaders","version":"1.0.12","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"3fa44439ec7164211ea0fe832e62e13d87cfacf1","_id":"typeshaders@1.0.12","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-A8L4jOySfaR6Phb7t2vGLxv4142lCLNCDwX1TrfaT2GgfH9THVq/dimm5qYscWKbByNV5NLfe7KnqWmPZvFJ2w==","shasum":"22464dfedcde8e0d18695a0420a4233efc5c7a5b","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.12.tgz","fileCount":16,"unpackedSize":35641,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfF2LdCRA9TVsSAnZWagAAG8gP/3MJHICLDilercWIjRGC\n1Ots+gWZ5P2xV4e8PH0CnGEwUtxC7s+vxtdoY/omOlGYYKHPO3y2tS71yMUa\ndd3PMUzt+EJVZO6IAv+DFwxbNVnRP0caV3e7dcxr0HBswGckDAGquxugGiTS\n+prm1ufVgnIqy0aOx/qLGLrRmKjSLLVZr6kG3zBNmkGP60biu6XmZuYWA6ha\n0GSxDZv0OgvWRqz8As+ovok+oLELXVsxoLVISntb22IikVFCJuVEQW/zDgng\nrhsDpBHnXVlgWcjVzkxdwsmU9IFejHduivlw9r3dFhzavkQSBij+cUZBiwOz\nLFd78cd2VMT2y+NNxSZFAPLXaEQYHT41mDCQA/be1EHFFklp6nhxsVa1G9AY\nSvG2sXsl2HGg3joi6VUJbDyPTXsU2j0DlTvQG1DLN++W6wh/ec6FhFuSwyAi\nq8UENbgLGHO73IRltpaMsLJXrBmSwvKZohfx6c/iMG3rgncO3+Je/nQJRMDX\n0eLACc7UXQXJ7ao7/ebB32Hp1jV7ZJLSvGsAHCo5+1n++rtJRbxqamhqjkaQ\nMoqdpV7fzmwqfxZLBfgLAkyJaAZ08PVFIZ62lmlHS897IDMAtBtix5cOEItf\n23dArwc87iLJj2VVkl337q2EwhyOQufl0JGMmoiKL3vxpDi6iBizYgbVs4pf\nDYbI\r\n=N1gk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDTIVVC83tt7jzhtSEheJ0sgtBHOybMeahJuEiFBbdMvAIhAOeS5AlEAXm5MAo/AZva6MtLLvdl+DljoQaVoMR9JoGz"}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.12_1595368157371_0.26037464196050264"},"_hasShrinkwrap":false},"1.0.13":{"name":"typeshaders","version":"1.0.13","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"152c7a7bc40e50e8ad3cc352447751d22a317224","_id":"typeshaders@1.0.13","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-cgE8616S9RlssXoPQkscw1lKx5Gna66mu7w7OCpVvDQDX+FZigJWxO7e5LBf47xkgwzJdeEcJlTTeY7kYzvHOA==","shasum":"bc7ce9c6386f95ca6dacfdfd8839097873f3141e","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.13.tgz","fileCount":16,"unpackedSize":35638,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfF2OoCRA9TVsSAnZWagAAstIP/jQ9m3nOs4wkR4HDahoo\nwOh7y5USuAU1Th8ueSNR9VaTkr3q4s7OcHh3TNwbLR8kKQjRcS9gsmNPaqqV\n/DKIehd92M8t3w2S/Jm8doPOoS3HXNi3i7eNuZhvg3oapX1ikNFJaJYmnOyg\nFO/k/fghgp8lOS3FTutAs63EGhFWM5No/uNn0eIl5PjkWcSfbW3HRnuYnldu\nTSlxExFtVhHim8pCgotfS4u8EPPOUF9nc/6wdIIFa3v6YmLzu3CrsrfN0PEX\nR5SnudY0mwmbr8Yw34VsNPZab3mJZ0u2Sbu1M3apiNe9+pVKF7HHgVfcN+n9\ngvn19FAw+kJEJ/MriDoGw8E3MZ6/A2Kz59ib3E3fd1+pYI0t8n3UmoGjQG7B\nR1gc3DHmSQkOcejpkG+8kMSjuf3V3utjnLRjJXHddxvBkIkT4MD1E3mD3sUs\nHdUakGV03L5ke3rPe0YQUz9fCYM9nEIQ3DWKn3ukdWfCEWjj2Icu6N+zF+YW\nf7u1tPYpmCUD6G08wjRy8uKmhC352zYuA5eAvI2F8CFzYzJOot6ocdCkQq2Q\n/jxlCMu52n/gDC0Jcc5bpxMpK73VOu9UpTIVUQIxaBHDLb0TySCjLsBoiNj6\n84Hph3aaT6puUXb7lTkJNu3U7C74/5QWqSbAK8WYQMqGrZ+MxoJyufGkqsDT\n+GP4\r\n=N4fV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC3s2nB1G2+pZAvbDSe4l/9kfgbZRfuD+Z6ZKmnNVcFCwIgG3bPC+jO3mcxVAYOHtr6Q0mFhdyyQAHeOkgwwSQ514w="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.13_1595368360156_0.5654705213626028"},"_hasShrinkwrap":false},"1.0.14":{"name":"typeshaders","version":"1.0.14","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsc","lint":"tslint -p tsconfig.json"},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"prettier":"^2.0.5","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"523c6413744d68ab9e96fab2b6cba1575443af23","_id":"typeshaders@1.0.14","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-bztbMzu6Jqj2mHRSTVjRte/Gm4md+HetWlg4uUTy3xiZTbYu9EGF8lt/uRwPcckm7BWzznuGQYj85plD3fdEwQ==","shasum":"09aa29f775b2581196b0902e9494e2d973046ef0","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.14.tgz","fileCount":16,"unpackedSize":35691,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfF2S1CRA9TVsSAnZWagAAPH0P/05S+QinUNxCVKKKw0ka\nLrzXFFW1MtvY7C/uc2ThiVDDaXUhhD8Sp4PUgknD9/9PmORw5m6ctFoibMQI\nJ9os/eXm8o1M8riM5WCzAOto9VMnUiVDJPxop/ZCht5BJhYLJZ1qObTZZLxP\nUrdJbczueGZCr7QHLFy/a0ucmghQucM6xm4XdtTgRW+FFXiTNyZNsriyutlP\nOmPrdThj0SijdFXSSUMcKG5kByZIfMSj7W0l3922YQ1/qSB50edMxw8FRTpg\nGidbMMNgJpHuXABmpADl2ZuOcU2AVxfA1fyYfn0501+TEO+pYj0U9G8dNceY\n/XW5MmiJAIJiaUSfiAEaaIaoOZZCLSbtFdgjT06y5LWyAS0Rs1aYzrEU9Qj0\niRN4FeXyQbqKKYrXHWeP856rsi2fmqei6KAVsf28AWQbIugTh0vI1QAfEocW\nISpmXe9ZN8cvIcrLogxSkWP9TSiIlC2MdPoTpbN13bWA42DzNsvrQj77fKJY\nLAH9FCXetSIE52rAKJOqGudFXLPg9vwYHrMmvKELxeSpCImUKjB7s5BRQFEE\njSFRLqp01v9wdskH2BN8ti3VV/M68TBNvgauMrP+qNi3YmKfLAF/LGASgdaF\nnoA/oUUBwAagnYAk1bPfnL7wEdiD4dUgwkzeo0w9TUIWW1/xc+y7k6D3OIY8\nRISs\r\n=3TgH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFmtRwl+pHo+eI+Hs56NwkQalYnoJaMLfshRxykTX0/zAiEAztowbCPIyY0XKSQR6jyEOjwxPWWdQvvdcQqw7NUA4xg="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.14_1595368629122_0.982117308781808"},"_hasShrinkwrap":false},"0.0.14-beta.0":{"name":"typeshaders","version":"0.0.14-beta.0","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"b537484b55a14aae89531db20a809a0591c560cb","_id":"typeshaders@0.0.14-beta.0","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-idGGKwjddiTFsj2FaLjJ8CDqBEzogiqqza5RjNc91O+rifjxJJF1A+jaj7/VRk5aM+iFj/oNnQmTn3L07ng5zQ==","shasum":"b1731ed0aaa6fb2119f4d53b75c2fa99aa8a651e","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-0.0.14-beta.0.tgz","fileCount":16,"unpackedSize":36288,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfGEBFCRA9TVsSAnZWagAAw/kP/0YpsMVEMrsJvGjiEGab\nKyauwPTkJ3pzfuldjYO+5HT+WSd1XyRsCGxA7Jkm1qvSair5ghdY7ROjbTMz\nBshb05fwlzacHSzRifIjDEHGZS9uLJ+PEMYc8KmHh/C0RWHqglbd0sHXkrIF\nPPiqWUQepWiIzzCX1ku3X3kRsNiMjbWqf5gRfhDo2eiCLS3d/If0LCxrgzhg\nTgOXUF/m/6KPmtWy3tEEiM2xX2/jtnFEw2ntdIvzdW/yrqt7djarqZzJWhns\ncP87ZJMhWAz8iXSOg2NfuZE5f2OEdpUg/etHAO3dukPK3PrRmJ6IV3FRiJ/6\nD98g8YLT+Lf42bRiF6zlQyMimksENuFHrhNTZjXX52wObp2Wo4mhEaSRcNsD\nAz569iNqwmdrxlQ65TBd32aTs04HRTeLLPfedx2oah/u1ioXA+nx/o/gKWz+\n9YvXxnyTNk6LjsCxdTne8UnoCrDjmyLWql2dSEy3C+V+7hQFdNYoqgIdJWPN\n1fMqQMX++Ber67jGCVmP8dNvGBTL0U4jao9olB56JtZlOLWqXGSvGGpLBVo9\nhvX2+DlL4y7S75IQ13XWscAtfOza/wCvFcoXgEtbjO+mPPELaIGemEi7KelQ\niMP+eOK1mzQiknvNr0OrKprNSGnuqANvD5a4/9/okMRDgX3wibtFuAO28hEs\np31m\r\n=WBJl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFL4ZxSRjoYfO01BU+7rF2MTZsSmu2+7gQSj5U/wKKpxAiEAuvOl+bZLiggZzzyAUvSbAA3MNaYxLwwwXKLeLecbnTA="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_0.0.14-beta.0_1595424836798_0.34529075613730176"},"_hasShrinkwrap":false},"0.0.14-beta.1":{"name":"typeshaders","version":"0.0.14-beta.1","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"7aa2b2f69ceabb7fd31d350caba442c20f784f25","_id":"typeshaders@0.0.14-beta.1","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-xsj6gP0z4r4Xwns9USMdA0lZNFWFceIVfNsJc0LlbnJGLO3D7ZcK8Z4OBIAEZOqIjhmMRJB9Es2mTOwzyd4dJw==","shasum":"ef6a5edbbb563cbd55ad09f2b7db3758373fd1bc","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-0.0.14-beta.1.tgz","fileCount":16,"unpackedSize":36248,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfGEWqCRA9TVsSAnZWagAAD0UP/00lGQES8myi4gGtEch9\nlQzUt050T/NuHzyejR/Fuk6ViSrhVsy4F+wqbrvIqCeJ2v4AnvLhVna1lfSm\nJkzJy7YBnzsdhLArjkvkW0ygABZylZVxWNeM2dzr6y7MeT801Dpt/MEkbAMW\nStqlHTzzdryQ6hjy16PpOr0sRQ7XBicmi0R31gLlNWPKZgCjbIg0QcqZhfA6\nmCK9hJFqJu97hY62b4zLvWhSMLKG0V4lAMiN8dyM/9uT8MPY/sKhEfHb9nQu\nNbE9JHiyp2BXwWs7syfZmYoPwmBVZKxBct+KOMPwpu+gfe61mkj7Fb0J4FbR\n0PruSDWf0wEC3qSqRL4Qe5zv5XwFn7HiZkAXsZ6ds6b1u8q/rAwIKeGcxfPl\nv04sugZp8AP4WU9zqzvHJ90b+iXdEfEffESdQwmqXCnAg6D3oU3SzXqhmIsh\nKQJJh4dmx8TK1iBUYxOXhf8lgrMAk+7l4n8GWJTmVNe9sPLlvfGruApJW9p4\n298Xx9xyst7kgwd1i7AnDSILgKVhi6By3AReMEF/fizRPoFWMp96bEQXl/XH\nm4IZEJimnDxLi760QshcmhcWBXeW79fxlEU2GOp6WtKyefA1RiLl1q4PyVKx\nE/9MZlIkhzuNHlXvAzPvUOkSK0puHKb/kHbOKshNRZ3IMh23kgZw5tjXgNgP\ncthu\r\n=iIjk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGqdShe/KZqVLrdk21Y8Bl02m7KJzrK26dHDuto5HS9TAiEAu+AjpudX1Fm3AlMi7wtLnu4Go1rQhocvFxtrgxC5BI0="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_0.0.14-beta.1_1595426218538_0.700539106909243"},"_hasShrinkwrap":false},"1.0.14-beta.2":{"name":"typeshaders","version":"1.0.14-beta.2","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"f783a15725b3bfd2b5891dd13cccb5c4aaf625e0","_id":"typeshaders@1.0.14-beta.2","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-iDUxCdCCeQJPsdc25nf5lJ+k0KFwylfhoRrVBoKCcHZhOWAA4N6LDutlQmvXn4iqICup3d/OUVkAVHxk9Mbx8A==","shasum":"c5206548b8bd5587e9751b68ef3d68bc96de4d4a","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.14-beta.2.tgz","fileCount":16,"unpackedSize":36248,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHYHpCRA9TVsSAnZWagAAdu4P/3BzTBovWwdJyGMHRthC\n+2ZoRo0dIZoi3chTWsX58aNGKJhgDYwJhdbluPMCXuSfXoAya2xt6JzU/o2R\nXhN/jrsk8bnTupPunEAiMCvm7TH4K8GScqrWezU4vVY1Ob+4j2ygf6hVoSFB\nCDWF71E5XeUQE8QAEZGj128wBtBCswe6wBQeAkmouAKkQgc7CNes4aVouvJV\n6kSFYdI34OLlSq2zyliqKLedGpPBzhlCTieTC4qwO7Snt+yfA7/BdAXyfbEk\n0QMwhlVC044NAfLD4t1fsFzYywewYbopUSlfQbepFqSsFjjERFCdhqjCKVRE\nKc9DXA3UP5iP5cs+Y9GSiq9cryUIJUVFDz9AbpWgtedhN4VAKGg9pdCirs8V\nuY5ICF9bHAp5FZ1Hq6nKIUuo2Vo4OlK/cGwjgtjbAfAl2Y6aZTphyv6SeiSy\namAhrRLQMLR5ZWOQldlKFBalmwXZjzuIk8zIW0g73Z09UY++Kt7QiEaElP4V\nHuxJHIXLcinD6MyOwBf1SXg+lppnSvKajzYsOVOYENx6OKc/hJDMa05Yleod\n9ZfUYuN62L34VQDpGoQiM5vtc7R5A3LiEUzQrftPkkjNJQ4k2yAqmbFke3WM\nBtrbdP0JPD/0BKHIO1vx03XpYbwQpCrE4Top3kB6PiZvfu5ZnaVSrjmQZlmK\nBZo4\r\n=unqE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDQvCH/ZGYuKTQW6mT/lkayUIp1H6EYVH5pFNvLbFnNjQIgGLq8mwu57b1/VUz+qpe9AOAagfrh0SFKTDr5EybedwU="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.14-beta.2_1595769321163_0.16208351068175486"},"_hasShrinkwrap":false},"1.0.15":{"name":"typeshaders","version":"1.0.15","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"1e64196ebbc63f1cb99314f35643da6bd230df29","_id":"typeshaders@1.0.15","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-8x5i/5CxNV9PJRQ39A/kQfpj7Sqrtd2xsQiJK/BojA64g/ZhVBMnBwC1JMVFEdnXPLhiQFRROCyY0Ty1ILCLhQ==","shasum":"3bd620e03372dd402e626280853fd3a37ba039be","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.15.tgz","fileCount":16,"unpackedSize":36241,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHYMwCRA9TVsSAnZWagAAT30P/ApU+Bnn2HZrLJkuyK2t\nwQ8ujMy0+bk+hpwu1918GyYsZ8GF11QzQsuF/x/3RSytRwek8VZSZlbbcnPZ\nyH57FbI21Soc7rU0TH2eemjVhVC9DAYXNT+x59BrRALz9tabYjGYw3Ak1HsA\nxypXrh179JBtAKtRc68BBTs6BdnwzT/95HHBgPpT/3ZKOggdIal915pWtAoU\n7e7ILmyShMLj51LFrytb+00hWHemQkYzBK8OJ9VV3nhuu3sqAm08EvQiWeYm\nAxpzmx72pWGUca/f3sIv0Xbg9/ab//FJjwvhRnXcaYc8xZSsHmaXxCXaO+ZX\nmaK3pXRZ/GPKjDDf3wXDwKn6hcWR9vb7TMMLpPfj3eVNIWK8NTQC8h9S+6H/\n7lfiAngg8mpKCC6sBo2lIbrOWHIzIT1PD1B5EuQm1jvf4UYEYiEJrxOWXSMX\n+LUe1PMmtgi2K05jJ1C6QMXk2hDUiNAuYCIuzVawkXGADRVIQ4IwFKseqcxq\n75SI9kF8raCV93wK6aZvKdRi44txY6z2u9NUFiC7qisYYTAZPvJDvgC3tcWI\nXHNDvmcMZriMN+gU96W9gG3qDRLVw+4bjWIxn51XMhsXhZFKGTBlpZhQf756\nR2ySyrcK7q9oBMLEarEuOp6HiIofLQ+3ZfpeuhydxoSA4dypH7gUsQrQxn9B\nk3U6\r\n=rH0d\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGwucPe0LxPqt+Cp4dszuEvsOhBEJOSW9/8DeP/L39M5AiBNhZ+4ZZXdCoNWYKXGiMkYGmvbDYIIlKms3Tt+RAPkTw=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.15_1595769648072_0.10602252678065249"},"_hasShrinkwrap":false},"1.0.16":{"name":"typeshaders","version":"1.0.16","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"ba186a26340257cec1b944108cbecfb8bc8cf101","_id":"typeshaders@1.0.16","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-42IrEbvcY6qNPioTqGqe2ObHaajozYLJlH8BCm1EIfbpHMh5phVzqImdsqd8OBgJJVSgf/h6CID3I7UMwTEzOw==","shasum":"6b4a1bd5ec0a529890428b78f3e4253f22748631","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.16.tgz","fileCount":16,"unpackedSize":36503,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHYPYCRA9TVsSAnZWagAAtq4P/1J6ooS/P8m//3lWjrVx\n/AN61b5dgZv0vE9cxxyl9UDojEIvujnYh08fcdX3yx/48B79tllrcTUhnnrE\nECcV+MPw2UIrzm7an8t+amyZhUfgRriuJtu3LoesmndYS9fvTdgzis5VGOGr\nBqL+FSHheZbcgy9TUAAOD38xf9LvAVjO33/fxn2EoCahSAjQFjr0xI+07e5C\nMOGOXc+gkpR8T1gtmq1wII8S8WZKEe8CrLupKNik1TEhU9kAEXpNSxmd2Kfx\newthXkhnLTNdKeeDxKBl1a4JDwvq/tpz1T0q8TbykRUXpXO7XGAk+nW+tEzD\nytGzndYyJ7AUMH7RSBr1/WCG8XNXQbcgO71QKwHSw+eiiW+ZphOZCUAyAeEn\nd9dQF9iHMwMuIYPrSgkL44ZcgjoGNPjRt+vUu21rd3leWy8W2+h1tWX/1UQ+\n4G6XRe332KerLJWARcqUw6HYKuicxoJQ4PAbiWIw2pL++hmpsG/7mpt9UIgY\n5GOekZLYn2NzzzzewsEwUrrXvlEqpsSNB9YSLVmhQw6qVhjn2317zFkbJEbo\nDxq0TygefP1GMmBaC32Hs0gAwCxW7z54WdbYXqIJ69VEzBuxtrflGhe01UyD\nnxuOqq+JJOF3lB1pJiW2ZKCYke+ADVTXAjtmZmF0Yn8UXycdz+lKrLWaXPFq\nxzyF\r\n=WYIs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDgIltlZgVF80CC3yyMOZAEGMhtL4PI+Y9fCf4eIPesJAIgc04shVXFC/8tgXBIAKPmYJ8tfLnVLJKeE6/B1q6MtDA="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.16_1595769816287_0.3533682193761265"},"_hasShrinkwrap":false},"1.0.17":{"name":"typeshaders","version":"1.0.17","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"3cb9638df07d96cf2af57fcc8c9cfea4367c29e5","_id":"typeshaders@1.0.17","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-BW9+NqXnBZJ51vWPN20erLElH4Cu+VqQ1jilQjF3OE5Flc7ChGwcMEXMisuTKaKCQeD9OG21O+j2D8PZMjAe6Q==","shasum":"3fbfe4b986b9410cf36915d9e932b8a0e93ec7f2","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.17.tgz","fileCount":16,"unpackedSize":36534,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHYUWCRA9TVsSAnZWagAAhYoP/2rZA+4bqZTJBnHaTtCV\nxJhba1Y4VDEL9dBvZlR9YSBLRGR6TTBlKBD5T7hcMdTY91z6Z6If678sALnV\n+Jci2WiQTM6rgjwZMB36oSUKhmINfxjHKfdBrNueAqZuO4PzRTRRqnNGFjLj\nd786XQEu+LEjZ7qjpPYpvmXVm/nCYvQ2Tyn6rmZDzxFqctHCAVyxrzjggMSg\nKccnkqYg2izuKbTCzid+AdDxG3DOnqd7O6GqqzF6JOiCFgpsac0G3M1STYCa\niGN+jdMnuExVCfag1r1a+ni67L3Tv10nXdVyEHGMl9HgvUcOpnQQpBP11GCr\npfQo8DQCtRUeZOhahV2vGEPSFMy3BLOARmF4dN7jfJ6zElgj/w0GXT9ZNcfp\nBIbt4vxB1ihpD5sA2S/tVJGjA0DTUgi4gWpUJDt0miJSFZJtzfMBuVeZRjnr\n4S2ZS98WMDsF1lFI4KqadPN2OOH4jxkVqxzcr5LhWjtJCp3a8dKMRMtlZD9B\nkY7ytQEU3stXCHdoobsISTKWA3wAKjT+NfXtUeElWFFATaFouk/oJhMxslmw\nwengsTjXDQb96jqR6biR/KY2qEOa4Cwz1Aw3eLCgM9R9/C8AqZN+0jEoFVgi\n1+Bk+uJQrYFlzM+N+icXckBdKnpnyeVLSbmMFYJtXmvnPADH4fYGOAquTMrH\nzDgq\r\n=YpyV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGYVV8SjbpCEas1FKKZ3Y3/25MAlL6psUr+DyDM2khnOAiBybnXumsypF/kdyQFMuXaBdeNM8nh/3P6O7hTUiT8yIA=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.17_1595770134461_0.12915476722162422"},"_hasShrinkwrap":false},"1.0.17-beta.0":{"name":"typeshaders","version":"1.0.17-beta.0","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"0585cab964fe09c3f8eed1eec3d7fe31e2a91c17","_id":"typeshaders@1.0.17-beta.0","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-/N8UYiDCJJbhPATxvTXyTXWT5wB3mNu+wfTM+fHTrQ+EZuAtPmzkZSoJQQNljG7R3DiLeCYvyIiEmfHNTDXIJw==","shasum":"13d4fc38fb6b5f312082fd8a1cdf5f62378df763","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.17-beta.0.tgz","fileCount":16,"unpackedSize":36541,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHYfnCRA9TVsSAnZWagAAcyMP+wc72SmkyfB2F+qRVdkk\nEqtWJjytw5hKCBMGrpGosMF8y4ZYq+HJBAhfFVFXiRGegy+S0d2gWseQ7CF2\nvkFx9aabu2UB4qUZZ5an/xl28Zj5f8f2pvYH3DEFHJ/L4d0JMaPt4rMSpUlG\ntvq9cRIhqDH3zUiB6Rrn/Bj44ApJ0qO7B4EKw6GZhngX/f0b3ZVMGBkyWR4H\n1iLqRj6UcymTkLQfvJQfoFqAH8ZpCKG3t0kHYvhmi33/Tkeg3CZPksaT1waA\nSVhYqQmi7GKiysxGfc/k+jef2R6S9S1L3b0tPKuncf4Ba+orlyInwPgClUBF\nlg8w0xLsgF/73RhUh5W/ebVnKQHI8VsEANzQAaFl1GfBIdctLoL2MBNf991e\n61D8lq2RgwM8jjmEKisHxGPWQrcRWaJc33n6o5Dxf4aAb5eO0yTPd1v5g943\nk317W29Qq+JR7wO0U4OWsBZqkqBabDvRURptRpp5ZRDXOpOwre1tLUIz9ozU\n6NnjzeMC6uOkl42hmaVcw5n+/bptdr5uQe7xLbOMQOyeD7m/kOGivqOq5NfV\no+qvpMmJlkoxDtGxgzwV9kmvanyFvcvA9nzzMhFzf7jr0fmykF16wYKQx2ci\noFSlezEXGZhE7TcEeu5qh/PcXJVDLsWS79ktGGkhpjA9NTDRhvZG3Eb+8rtj\nlGHb\r\n=pNyj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIERDG76fwRtzlQHTQDPXB/UwUrVPBDi05SF6mpPDoN9dAiAYwbShLNw/6fj80LNEY0ZTtVLuR9dSwd81IY9IZ1SYLw=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.17-beta.0_1595770854751_0.9845468535472164"},"_hasShrinkwrap":false},"1.0.17-beta.2":{"name":"typeshaders","version":"1.0.17-beta.2","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"050c293c2e7f46daf2e88567ad2c4dadb61f1670","_id":"typeshaders@1.0.17-beta.2","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-D7vNHlHKOf3WbLSrzHgkQyXVVE24yQiRCkbYcC3kLYx20dMC7zjfLxcNpk3WdJIFs5FxlJKoC8UuwxYUwQzneA==","shasum":"807114cb2e67c9ee3f6b64759cef694941dfaa32","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.17-beta.2.tgz","fileCount":16,"unpackedSize":36510,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHYlrCRA9TVsSAnZWagAAbdIP/jHvIVgg3hp+HteCgoxA\nPF4kZXUErfSN/V+3XDK52jSdgpLM/VtQ5Mvvd3MFwtzvzBRN2O8P51YL6L/G\nOCL/uvf3WvybdahkoSdrsb9Rwl4MnisAI0OIAzui0X17bn5L6oBm0aDIROP/\nJ4XgnwxlwEvnhMLCFx3ZFWm1FTYS7fVJprngm4Eyc6mqRQSc4z07jLLYsqGx\nBjn3ezw7ZptUnyaxduKunBu3dXl4sUmPQq9QKCCkNRfYG96PpqCm+uRMp+Zb\nHtCFEgftoxBGg1u1xXYpKc4xyoQpVVgwG84OXYNz2suSUOeH241mVHS5s+7y\nxcl7SC2esrK80YAmhuw1CkjXHwEX6RYXsix2Od/6w9cMRipYDvbTIbbtsPEE\nDDVSq84DsgXe3aUA1swRV7AYmeKQxkniwMoNviyOGDJhZy8SegMwutzLsrHJ\nE+OasMdhcoUs2dg7zHBIpAwSFpbGD7ezN3DsRxgS9c8M53j6WJNB68z9OtOk\nTUcUx6gN9lEDMcJ08tY+FLnyOPHA2cXq21rdYsjE+rpGrAeB/4WAzInNkniN\noiWxCVeoqcM22BVfLmSIuiY3nQP3Q534aR68blnvIGgHXjL4hY0olvBDdQ0Y\n0qQW9XDd0CV9L3G8QsVEdI2oo9eP9VtuYtvsmvb5NL/1T4to9iQ2FIz5yYMX\nXgkJ\r\n=e7J6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBkm5RX1zu46vMxMRxnpnzo2rz9Arp+8J9+R+IS3SGvyAiBJNvxG18Ds/uL/7Bjq+s56OpWzMZt/Y2g5RVrM21nHiQ=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.17-beta.2_1595771242964_0.9048030937933322"},"_hasShrinkwrap":false},"1.0.17-beta.3":{"name":"typeshaders","version":"1.0.17-beta.3","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"6c24e3ff3850079898a630512eef47d332aad341","_id":"typeshaders@1.0.17-beta.3","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-Zvf7D6lz5FO8MQFJqs/YVH4U5ZuuYUfGn9yuTuabeDM8CeFxIJ51O9RNGCaQ95qKiBRpByjRXRY3QgzJx8v6Tw==","shasum":"cd1b06b2186bd4f1f376c489a761cf51fd14b5a7","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.17-beta.3.tgz","fileCount":16,"unpackedSize":36510,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHY4pCRA9TVsSAnZWagAAfv4QAKBHBj6WUMe12spMQjPx\nVAVGcX32u9tG6k91cUaMsk2PB/kjoCmNd11KzxowsLEdCRoFtiwyhUCUZ7sb\njsAlW+9dhG+3+ygI/NyllNiukBR/0dv5347jrSYEPLr2KNvETJP1TUYlmKP6\noq4DmFC4WjEU0yq7ty9imwSPM4vjIKzlbLOd0sI29B8BhkXMLWcHkVREBPlZ\nV8L6ZSmsxTQCYBSVa3+EDVduXU5mobvEjyWRpuMDHS9Xoax0paNJdqpc3HKb\nRcmOuWgeA6kD9KMZ6wS0SKvtHZ/ccj+AycRAem1RYS619CkEeCtVSrmMxyN9\nwGx+MgIk36Y5PJbwX/m3HKR7vkRpc3BP2N/okJ+cXWPWXuQEx8C/C2eE6E9q\nfrvilDDul8oobD4DU6fp0cRC7XdrPHeb2YA7b1XuGJqwT4sWQWrc6ZM8MQkD\n7hSvgGZ5mUNpYFzPihfXoEfcLlWT9/nUAAk3KwDhNehytx7jn7fj6gwiyLXc\nmByscQjrhTEm65ouBItak9ZC2VulcLX+vUgPGNv800w9S50T7mUaCf4gsSzV\nT8zeOFuR9fmVXZcFhQf43x1QgXCGA2qskujUgZtR4ukEtC4I6z8Wf5WXH8JA\nZBNFJ3nTn5Y7Qnp70A1zLSjZ6BDcPxDppjm0Q/1n+mJkqHlXgrJ9G1B9g/ZC\nOM/w\r\n=WZaq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAEBJGDv8uXbyHfMG1LkYvfRymNkojjJcJIPYGNcLPaGAiEAhGo3hSmawLiMRhfTIL6dWHDLgiN5D12PrVqoAGEQABA="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.17-beta.3_1595772456842_0.77755515513493"},"_hasShrinkwrap":false},"1.0.17-beta.4":{"name":"typeshaders","version":"1.0.17-beta.4","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"14345de590bcad98edf4b694e57509a2676329f0","_id":"typeshaders@1.0.17-beta.4","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-RGLw9wEtFJsH+0gur6E4UrPAacoWWtLnzY3ousTkt+UrPtPeUlCDy8t2J19b58WQ7HdrcicwVmuRAkYKunmBuw==","shasum":"a2a75c29bdcc9c565604ded71dedc99e24474da0","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.0.17-beta.4.tgz","fileCount":16,"unpackedSize":36567,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHY7LCRA9TVsSAnZWagAAxYEP/1hpDOPj1VifPiSCvy+a\nA0iSS6yI0KBYOzN22RPhzR+gGqVqFB7Awpw7b3PUNXvNyQGIVqbxv/TH8X29\ngisvnJZ4sLmC0VnlIZ6ufUUnchIu92I77zmm1eKHtxdD43vWOYRilorvQMFP\na/+i8yZYiSswMEKTex//wCbbpTQw0QISVAUIhcZ2Jy6E7+oKNq85q1K++qa/\n46bWZOXC7TDRFYeTMdF7+rhlM389dpvpHBVNStpJnjS36QakgP7NlA3S3tvl\nAixtA9W9+kSIaTGDCv/MAgnPfs1ROSBiJZ69VJXeP1kmLJf6xkgeqoKz3b3x\nQq1ew+Okqgzhj6oO3qHbbRGYEzB7jfX197xdygWglxuOWoJvv0sPFbgA4eRD\n0eLiUBJmXAsmFk0Y0iOT3DTqP9OBCrr/SQjcfVfRM/Jlwl+Dr8IIyIhujUYJ\neKI6+Ka5BQiH0ZD+Z9GruKsm08hEgiIS+EKy7RQpXWqhD3TzWKQ74DbKLCC/\nzZPBN3QL5mdk/bzft4dI0AITNUrRB2N7CMY+tLiX6h40YAi8nAV3583MRakU\nYssc1FgL//6/WUExNWjDfBHKVRQAanciljMlFCPZw0OqwPClz7VSHFzEcoDc\nhcgai6b4GphT6hRN34eQejE3pDJ0bJ4OkbPOrJJihNvZCrLic7eaet+Aarwh\nhfmZ\r\n=rMI4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC/BdPvgQ/jp//6OiFEoHRiDG6HmUkX0deYLZAYaNlcEgIgUNreUBavYyDSJAriJJRglJY9JmvYtSrgkQGRzfgcKwI="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.0.17-beta.4_1595772619094_0.06399462688169022"},"_hasShrinkwrap":false},"1.1.17":{"name":"typeshaders","version":"1.1.17","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"542fb49c32727b6d10345bc92cdb53f052bc0f60","_id":"typeshaders@1.1.17","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-catraEnGFsqJZFjk+91DTwCmkU+QgQc3cZ83Qg3kKZOzObSTaloH1j8po5edbQHISdyW1sMOpv4RAqVa7W7djg==","shasum":"6cca1d94dd5b5b60d37a4a67981b17d68388c5a2","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.17.tgz","fileCount":16,"unpackedSize":36622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHY/QCRA9TVsSAnZWagAAdwsP/A+U+UbgRzPxODrpXLIT\na2bYZO7EfbhYYV1aXX8TR6b+Hgczs9yrWnp3BBAJqfmaBemLqWlS1FGI02mX\n2ZZi5Zu+AHwmLAW8kvmVLFT1d19YEj2zuKJOyF9aMyQA3xJHtDbYm5jwQx/B\ncPXMYjQMIZhXoPUu0HZWzwS/DvdMekvBpfwLhGxLOVlx+54j7TWTcfMUa2RL\nckcRZY22vo5zwWDuWNMOPpPM2NWhSXUpHv137zbLcVclPu1wzu047fbQpTsQ\nfjZlo6RF6wxxhBNlBvqQMvQ0crwnrv9AaUvOoh12kMUeUWym8QR247Sew4Ua\nTDOfDyH9Aubs0TVgFb6LPRWR+Gg96A6/4HCdoisuLkxc0RkuAu/ZGSQeCVYI\nUPnpJFNi15be81YRbNIEGJyBpEMmLF6SDzaU9fC4Q6SurGz/hMzJwAKRWAvC\ncpHjldf7FvB31/zORFp2bgGisxkqZxOcwq0STtWgj42Y+25AasGTJBWLUllc\nICKKmVJNURXF7NvxaKlhzzGmoZmMqax/kQRwcBH8dJQ/thHPLtuSdn6Fr168\nC62V5uF2eo4COjOhdYDTeLVJ260nV6WdhndC8cLpQIe6bO2bgfnCqLikFWP/\ncXl4VAAbXvf2HQbDBjNvEGP533hhzt6yibCRvZQdOu0+dweoOc1JVIcjMomD\nDLQa\r\n=gNnF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID1YX/f1a0mlJqgFpOO18LklxUMwAdlDX7d7ebwePssqAiAvfFrq26D6CNba9p9YXSbI9PVCEWWdBYhSZUaixRUo5w=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.17_1595772879967_0.6909705491360849"},"_hasShrinkwrap":false},"1.1.0":{"name":"typeshaders","version":"1.1.0","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"9735f29f5edb1e71f02ea3227e55a91be29bb438","_id":"typeshaders@1.1.0","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-vBUec3Cg6slDh0CxIIXvhWfKoMrr8MCm1SJ9KklvsQiHoPMXoeb8y7flspLByxO/qaFLHZz4KYG99z7fz8JsAg==","shasum":"66320f4e31e77a21e0625cf1861d9d6ea40e4871","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0.tgz","fileCount":16,"unpackedSize":36621,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHY/tCRA9TVsSAnZWagAAWpgP/3KTr97K68XycwE0UiJu\nwa9evoc9FStaFxEAzfnOuQErMXR9ePiblayRrDokYvx+SlYx1h08Oq6kV0M3\nFKqz27o0PqlC1O41ojNBHwHmChVi+k0ca30cSSXZEaKT5twQRVApKGow+q3P\na/rAwBQJzC0NVe7QFh74ibWlXZ5BKeaoxZwmabOFurlBz6CDLWSaBa2469t6\nYvlnUMnwbsD5gnYSguAIXKTEVKJGllRuG64/dKGbA8YCUnNqr6nK/cdcNlhT\nOrs99iwKxTJhCySIxGogr6XnjZLIwq1F8kbDAbD+ok44XdD4PxuASk4Gzavx\nFMBY5o5kCHphbAUlh0Thp0sz4cH4EO+NGj1PX2yu/cvSgNmL5R1LDpu9KJIW\nP4GpYaxzZ0rgU1fwWQOEfaE8qAfS4CprcHi2STzWom8BmGPyKpZTscGEkFw7\nRVNIKbnUUyQwEIPqJacJ+P4RsyTffqN3lATTydgjAbCv2KKl8H6nXzNpDn0d\nwjbUNX8xCudK7LnLdChJM0IO8Lwte0m7hDDtwytkv4VjpWQbAs3m88N2bbti\nuvYwoPR8x+Rm5JIIx0c259LNdgMTi+4MEt+JPeyjpfnmHECQ3+v/cQV8h8Wy\nBOY0ZQ9oW7isMLG6w2lWMB9hUpiXuvQalL+yrW1CljXHrEmgGWf6Wlb5X1TS\n/IZh\r\n=3hkJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDlIxKBX77LG/c8/ZHWlHUFCukcvjBPTqWQ1NspoFXMVgIgGhoedpmhn14ocbF0qwu9iSmbUmdLug4n39YdBweigp4="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0_1595772908614_0.7776752756313645"},"_hasShrinkwrap":false},"1.1.0-beta.0":{"name":"typeshaders","version":"1.1.0-beta.0","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"f45f44b30ff7d45b767be39ec0d1471551540054","_id":"typeshaders@1.1.0-beta.0","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-EfL9fbZyslhe6whqHI7i7chJkWEWBSWBS4sCeRRDr2mJXUePnFIV9vCum5WtSuAe3B5xV4LFbXG3sdikhpnDww==","shasum":"19c171fbad30d8a855afa98cecf990db724a7edb","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.0.tgz","fileCount":16,"unpackedSize":39723,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfc0XSCRA9TVsSAnZWagAAcrEP/jwFAVfLw7ArqXGwUCCp\nYU4Ffo1Y+X/fDl7l7oKxeoDSTYyrY66376Cz4NnVKWeT4VA6CvgcOTTxk9dc\nG1Yr1ck4logR8GQaRl/4V0+ZNMDACjJFXJXpPQtp8zJ0WEYXlo08VqT3c4dy\nv5bP1A2T+oDOx8pmDgherD5jiIlxcbNh8hcxdNVJej0fIAa+WQ2Cqm8eEr8v\n8FmqdL8S421eqZCn5iQpFSIBaXeaFrryEMxAsrNyY/8H8c8LQIfJmWjvn+mV\nzGs/p2Sd/eyjzkGDH2zfVc7BKG3AZU3QSajgAi60kU4jjvws5/xxMGIHWHp4\nCPQua6LRwv7qGBgGmGA8IlkhMNAavlel284VWj2qdL+XdxIfTpS/1PeH4lms\nKIIalXXhHHcsA7XCjxLyiAO6HfSsbG7PsgCRE8DELDDihHpb+X6clsxWLB3b\nz0jrGi3rMgcqxnnhVNxmBjS5ibBC5sZ8a2qA340j5P4hjTyt7XOLtYv57ku9\n8jhZmyuUZVjwwqtnCFTBcjnv/EdaaHm+kpO1zGeE+UwAaAmFT9M7EVMwWI7L\nWbg1N3ZwJd5vEk5oAFJ7fBw6lhMypLbKlcVTUsn2YFFZmL58i6lbYFBCFIe4\nol3SSdOhlxDdJN599TVuKNtKAgjL0/AuKfSTDPI/Kgv/YXyLHa1dOUNs+359\nQm+f\r\n=ZoHz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCulCLlDBqZs/oRVl/6EtNaluOhhJXzVI84mb2qmCMnwgIgK5Ko+SztuhIrG3ZfaMDr9ZMskmDpq0Be9OlDDUEAcKA="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.0_1601390033719_0.45905293256123714"},"_hasShrinkwrap":false},"1.1.0-beta.3":{"name":"typeshaders","version":"1.1.0-beta.3","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"42ea70f5a891e5799eef6debccee953e74d87432","_id":"typeshaders@1.1.0-beta.3","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-cmYQcx1m4OeHQcjeFJUmQf7o9Xu+KqadFsbIolNLl+Gel59BGNdMP5IPrMRGcwX5mYhYWy8/2kH58i+lsXLOXA==","shasum":"2b85c1c52cddc1dedbbbfc4a0f86852a1f04de91","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.3.tgz","fileCount":16,"unpackedSize":39810,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfdKApCRA9TVsSAnZWagAAcSMP+wVrmrHQzerspHjsDmw2\nvWibPzFuEQEEocs6Ath/4R5NWqwX2cs816/T6tgQi0wObhASH40uEM1WRCNF\nao/C03wmR/CYBsSWaEZFKfMFLLgMYZsq/00+mR7/ZU0hGK9xO6atxM5cHOEz\nekasQYN3WuFWHgRaANB5BOMGLVnF0WZp89RAY9d6LJMKFncjXn8FmMpyMOW8\na1LB3HixnTMO1GKEanorfhlgk61XG9Bl6TiRq+ORKZing1Pei3SUZVVpytE6\nemfZ2FWLkAozZRYWSVOJmZ5hv4rDaZ1tiswNFFFZXsLgVxPhY84sAOnIMF5P\nU652jl5Rym1mn7JsyxzHCMCHZN4eSa5PLTMC1lteDwUb8CMx+S1jQBl+AOIO\nE3bS7vfERRi+IgrwvbiZS2Jo/D//KUZw7OHnnMuL1mz4WN2sdKs4d/OSurbh\nfuyrROh1vHtUaKGtQIX5UhTzo0GfJkn/xauwyWBsld86tKEG+j8Kjz1/I/fd\n8il6F7Tzt2X8bzwVM9vG39z9PoAIm15Lht96Ms9dXFc92qYmBfDs3WWeZW2l\n8r4G4YqoL5he3NiCfsYTmwtPsoGLTTCGIqSD9ucEKpJvq2zztlq+jheTCtzd\nR5d9fivypgAas4Pt+4pclF7cKZ2co8ET/sjf/RNfGcuFKctaRxBdYlkLAHZg\nj2dk\r\n=65nL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFv+LqQ7YiW7OsTvHXXMqu+m2xkJAQ7OnaEC3WPeDdq1AiA4ZTIvGsZYcMAr59v4T5xn4YqW2zTGC05Ns12P7kPPGQ=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.3_1601478696925_0.5269977251772762"},"_hasShrinkwrap":false},"1.1.0-beta.4":{"name":"typeshaders","version":"1.1.0-beta.4","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"1c4813579529a8374c54c83bbb67d2cb5f3ac586","_id":"typeshaders@1.1.0-beta.4","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-h3UpD2Ysddwe80PRIWvraQL+xG0PMAFieuRnRnQ0dUPYr7f1OTvfxSwI/tj+Ooy5wgE2vSW24es5Tb5rpUixzw==","shasum":"ce3966163254576036028865b1721c81035c4086","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.4.tgz","fileCount":16,"unpackedSize":39976,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfdKOTCRA9TVsSAnZWagAAJ7QP/3aYlqKQ/1jkjlzGFa6I\nR5LB8uKZ57EozTlnrAZ/5YrSqX7AAVLlzQJ6JRdWapDLrvvWGemC2/1V/QgV\npbWb+cXadkqFl8KleZgs//t0DxfbCv7jUaLiZBeEF5KC7M56+zCZnL2y/pQV\nTJPz5TrXlAY9hSiZ4A7kyHqO3nFQNtwyF1HRqDHRyh96Uqmt8pv9n4v8sKDW\nApK+e8kW31lIgMUwaksgCZNEKwJ6+VO3c1N5n2hoSmHYoUQYx71Pe8eThkZp\nqqQWjaxAiQ76mFBfTCLqYrsfaC6JqUpsXk9caUec+R1Ibm6rdJ61hkoc5YgY\npNTZ6ZjFxLDddIYAWlM9xNJ1cxMIrUJtgktMeTOfrsp5UPxaw8GIhbsgewxo\nbn+KB3IhPvLeHyLtcV3vFXLOoOH6TVxATAi/N1FQs/2SUbw2ND5LW1kSGkxR\n7AcTe6vbttWG0pivhihsX3mQtu+Cy3B75lgcbAN9Kzb7f/L4+/OVjE+J0Ktw\nM2K0gWK5CtEK6GooWn76juW4nRkC29kpQ6gAA5cK33AXDTRD+gRKa/4idkz7\nPRkfafjovgnvQ+E1coVQj8MofwnL6qwUV9kMCG1RI820fDz5df7fS8+mKHMG\nI62AtoEo7gbpLa0KXRqbo0MfJl3ObBWbB3oINrAso3hqld5mqjxKjz7kbn9v\nONPx\r\n=da7Z\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDk3cTBlh6kwTgDc78NMhCNzvL16yoMQ93QLcIJoKK+/AiBeLk8UmobibBwpLRAOtr0Yg3VL9xCuos7GGQrC4/XwNA=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.4_1601479570745_0.20115730440348378"},"_hasShrinkwrap":false},"1.1.0-beta.5":{"name":"typeshaders","version":"1.1.0-beta.5","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"01e4dac14c0b2ee1f7eb3ed3345e50a9ba06dea7","_id":"typeshaders@1.1.0-beta.5","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-BZVP509knLEgJ9jRN6LDPWgiLe379U+db9afo9MNaFNEM3N7TSYpKFF0JzltS3wZCgkPTO8IMm3RJfB1PEQYBw==","shasum":"7d6bb2611744fbf74fec7f1a6f8d5e363fadb268","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.5.tgz","fileCount":16,"unpackedSize":40730,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfddpwCRA9TVsSAnZWagAAZZMP/jt6jUsIAvwZzl9IEZti\n/EiD5t3qVrS+ZxmyltIyN/5q+EE9ur38TGio4P3v7Hjfb4xR/uWpEycPK+Fk\nl3OWEjTOf6oFr8EN1S6VB4bASx0vVXp2fuuUhVUS8PiE+30SP6Ir5Rpkv5fl\nyhLBuCBemITKu709OfpmOpWYpA+Pbg4zGHTrF9fNVIxCjSeL/kg0OYIl5ITN\nUigz+cSWPr1awpuehP/CMu1Mno3n6lsBFk31lHWUAUgRWqB52UIZq7TzaBZm\ndfBlN4YNmufD/mlUSuq0tZPsy8jXR//UUKOLcsfkQQpnPCmP8ypxY1EGflRR\nbsPl4fIf3BEIOEscDqoydphboKJT8TKamQDUoJDXRFvxQq1JZXWgBppb0KZh\nQsAmHTbuy01ESfeDcMXPOyKuYLpMy65aEkMKMpEnrHjUadzRBQZuKMZe/PdL\nZIhABJKFATz8HIH5t7HBkh0NCYngnmjR4hiwBeRXNpZrPFjrAqZJjdaHorG9\n4NMHuE7lZJqwoUzHpTbLgAJnPm3kN4CKSLBTHrps1wCmyfjQ/Ksf6ec093Hf\nUGbPGshVT+ZbE7nf58CylnUa0ylb4DQ9npXoLuMPmUArz3cGCz0c7MTxR30q\n1QgNwllxBlaIE3uZytK9+rnHrZ80Fg24QWs9/wWLkJLpRuEH0bhg19kBsT39\nW2yk\r\n=XeCY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHeeHN9PvJDAzRKq+QAoR/ngosZhI3M9phcIQyE/UgRwAiEA4ziwNt/VF+SCFAip3P6o30oiHc7Sz/tGFJtysVQLvWs="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.5_1601559151798_0.4300729244243269"},"_hasShrinkwrap":false},"1.1.0-beta.6":{"name":"typeshaders","version":"1.1.0-beta.6","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"b6c647951272e65b1425661bb0ed88b83af0a217","_id":"typeshaders@1.1.0-beta.6","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-b+YQXN00HFgeJHaCH14FGud6FDXPgYmbNBEXdtG0BFCPDyIm50HI16zh2JJCLKoioKJU7UTRk+7Z7KI9MUJ5ug==","shasum":"b9e48805bc116e2d931545529cab17ee64227762","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.6.tgz","fileCount":16,"unpackedSize":40845,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfddy3CRA9TVsSAnZWagAA/kwP/jDX0XFJOpEzF74JLMqQ\np236TxiqOzNy31d322UrxyBkJ6Eu/oRDCAi5wpc3O5aH/pGj/VSXNEZN66i+\nJTpdfRDlQ459oHFRaG2WQW4vPDc44TSRp7jWLpvFkjHJLECnHDcbWRAEozoz\n0IjW4ggsDJqk+o0zC5TENbcO+ZtoSUmRIHTO2QPRRjToh7pEGZ5OJJjCvbSy\nV2uTOC3+IhHZllebCN70ZVSVBmu7ZIdHxry0n/erx3BYIKbO20K4iDMUb55j\nQkSauTpceCkwfbmRo2N8dTMYwTJzmDubIsKtzH2+7VdPKsyCW3o3N3/f/9DV\nc30f8/W3oyWnhPQKWDUdR0yMfHyGCrnJll4LQVpVtsObgptgZunts/YaNlV1\n0yGbS+HwL2AfSdJ6AAxpmerw4KwsamaXtynzbIY4PZjPq7VztzTvRrZU9FOa\nBcD+2ZAi2BU8SyvpTv/XCd+PAimmGpBbbB9g8hzXrI0Q09awT1Q/y9Qfa8yQ\nfrvD8fePCdT7pmjyn6kzxXcCo6/2zCMf/27BDXkUUdNtHEbwQo+2s5EkvPzE\nJimaq0qHUyIC1eceIIXeR5PYH7zvOuhtyXgvfhftdPmXSb0PitffIL0MqUtY\ni7hgq3clV4t+qzZcqWtOx1lEAl5edMTb4ZDi6lS//CVw89rqbMhCZrW9cbdl\n2v+2\r\n=2bil\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCfRe7dpYmBsQcmGNreQ1F0V/m0reBQ+0aFXCEpfCE61wIgRNv02UmXpg1ZFTv2NovHCwnGsluoA/X/MEvxOcVAHl8="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.6_1601559734731_0.08583088457213228"},"_hasShrinkwrap":false},"1.1.0-beta.7":{"name":"typeshaders","version":"1.1.0-beta.7","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"42d21d42a26edd0a6cd9465399e90d188c0a8917","_id":"typeshaders@1.1.0-beta.7","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-psDU3jKoFPVr20O0/HxqnAYHGP6c39UsHy+UN58L1k4cOLqmQLmnPiFZxMILxuAEUGQhmm/6BpAlY/xm8eUyJA==","shasum":"217fa5833cea910cf5f51ae7f135a793c602e8fa","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.7.tgz","fileCount":16,"unpackedSize":40689,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfdeVeCRA9TVsSAnZWagAAxfoQAJheWfXBodT3nRwzRSmI\n5K595PD/Mi7/AJwQlGWDWTJn/EC1t/eb8o7Lhp2WCctz8uOVl1WF6vTKXYdF\n7g5WG+V8Pr7rsLzXoarhqOfDGjqs3r5wumk6dTD7LKzW29EPfn4ZfyvjxrJh\nufeZbyMlgdzXFNiWoTK+AI3QfOX9yFBkSwjA9AfBWC4z/FDKG7GPfy+kMRGp\nglzEOSpt8SnFRcmbmY61xGtKM+RSNS3zclSo9prZjteV6vXYmv2wujtAJnCs\n9+N2CXbORLQntfMcNbz70ujDx6pMZTnjEzFolBTXoo7YvLTEH+JTFzQkZQ+S\nlbgEIxvMraErieISCs0kaG1hh8vQTp9RUreokKCbIg9APo7Th4M/KVugrYHT\nDd0ByoH240rxpFMWG3e5XqFO78ah1U8zajgLdpWqr0PGAiPJ+v9O7IT2gShu\ngrUjbCIxWx60DM0pa5Oz8v4/fZaMOTsJARVyrDG4tvmJw6zldHO++ZB1JBOk\nqcFwyU92G/6RSXZNMtSV6gvWaar7K9zHqlvDaWZTyiOHfPZ8gC3E5jnoC6Ed\nJrcbZvvjIX7fpIGSaTlZC6Fe7yvLhvTfIS9r60YwtlT+qHz331K27HnMEXqj\n3EbkfJ2gUioo7IQRxgQQHfSmgtIaP2ab1MV9yxHzGcWhEmgBR2UgT6Nduzkq\nFgFL\r\n=JA/f\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEBxaoRh6P2mJ93EjbDFLE79dGLSxad1FV2W71tilx//AiEA+ALweGD6LYtbJBsDdCYa4CPlrvt7qKwzRBEdJAtXJ28="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.7_1601561949881_0.5177074938851616"},"_hasShrinkwrap":false},"1.1.0-beta.8":{"name":"typeshaders","version":"1.1.0-beta.8","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","tslint-microsoft-contrib":"^6.2.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"4d4c954c35a7940806baf20de7f2613cf523a033","_id":"typeshaders@1.1.0-beta.8","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-4ctnFqRI9I4C449sULdrTxdPzywdQEk6QiRWv0sNV2jrQaBSfRux0pmHApuZVhZrGf4BVAvDOHTqG2F32rFbFg==","shasum":"161490e58c6bea65d23ff29dd6823a7e78c8b3eb","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.8.tgz","fileCount":16,"unpackedSize":40318,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfder7CRA9TVsSAnZWagAArtEQAJYB/CHJomI0mk/lsLu2\nMLOZcg5mgIsmSMHDYZCFIQlKwL/uoqh3lQJRrykTDQCQQO/3yE1x1Uf2l2KL\nJi94Z+f+B5jYMhLwxlPw5b2LkqtAxP4PZPeTkJNbAqy9BydXwPXV8CKYHiMV\nIPo03nAH9/V5+1cwLpJfl1oIjuvRNZBUDP/447B3HxF26oa8qM+uspowyzgr\nM6gD/RyHFFT7481JtES6eYgoXNuPLgi5iD02RT7uUM9Fe36Dzezq2lUu8v24\n3LADEV8O8drEtfQdVd0uTvFg04+3fSb9ET8r7Ly63b2Aa04qI9Ff1PXN6qYl\no2wQ90HVuP24QRuy7YlEsJ5ADaNTxf7Yg8pUkuUBI8ptt6xNXilZ13eyagwC\nTSIPOaEbItIw34VHs7MtWI4foxenGvAyN9D/myul3LiJmxmXmzzT3f7l/ViL\nbcf1NcAuxL8D5bIFEy7NH/F7f09o0DYyo+ZrNsyS1sgaSufXZS23Y5Awxl8i\nrFB372+68agjcfkCVLD94bbEhZBPf8wfiqIvbJyk53J8W1DR84HiUmRhEhJV\nYW8lizm1B1I0KQiku5FF+7id2LvlkqBbxvaFsyL0PQBV7tY/yZN1UCGY+Pyb\nPdWsfwDl6+dRWUPuBTMpvbI3E9JxNgnI8HPcGJBS4yIllz29tF5EOuFAipWl\n/98t\r\n=a2K3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIH1mNaTWcwjUamyAS/VoZ9g/Qvte8JEYltFz97CW1LIxAiBH8CGZotLS40XUohKpkjJ2GcA5+TrhIlo8GljtdEN/aA=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.8_1601563387425_0.9914003026456866"},"_hasShrinkwrap":false},"1.1.0-beta.9":{"name":"typeshaders","version":"1.1.0-beta.9","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","tslint-microsoft-contrib":"^6.2.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"4d802f8891aa59594605d79c393d41b4a4bd8693","_id":"typeshaders@1.1.0-beta.9","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-yW4Qpu//UtmwIvusdSxiVrsJ5de37Xw8DypsEcsqTgi/zKponre3M7oBXhC8QJ2aQljMBnZfpj0tyBU5jMVRyA==","shasum":"40e022e4f329750ea102b65051f6e246ff212858","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.9.tgz","fileCount":16,"unpackedSize":40318,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfde1fCRA9TVsSAnZWagAAhGoP/Rnct39RNSfz/ttLjvLC\nrsuhv/VI1KJAFVfALwzzAvYTjsloNzNBXRq9pWIRqD9lKGh9fKXfGRa9CKa4\ne4CDjyYpP+0/H9YK/HyxEThcuGT2dHqiptfoE4u1HdfgKsJ6RhWS9NuXh5Ft\nrTBOTkyyn18XrNy0mEujGsaVQn3GR4NBs0EvIiYo0UXNfvVdGhDIh1iEi0zm\n7eVjNfqYIohbmqDsTEjYpsOjybrNeCIlzz9I34FTGRdEqm2bPqeP+asZOtN6\nBh54U/9c4oXDvX0IjHfF6hVmmtKqKShvSwIY+RUO53aaSmpf9Cjb/YWkqC/J\n8ZC8VAve/4EIJM1wb+dwbotGey/1ggHZnDpr2VxHMXUc7DTKInDoLWEs/4nb\nXgRgA/npfi493TurLIaJtI+3HvrHDoKo6xJJy8EnY94aarl5A9sdFSscdzwu\nMqE/jkxQzjLPtbrDLlSrBjkStunXdX8EjHu+onpshsNQHt0hhxvdWWTHHLm7\n4Lr4ueLLLn4kQAShKPlliyUwHix2M5o0wCutAWePkE2rInW7IDJm6X9yQgQy\nmjRlQ1D0x34AzNe8Wuep4trlW7R3SRp3JjqpKSDgOyHUNPPSe9vXi899wLyX\n8tJvpG6BiH7YAHfg+bIVkuA8aZJjpwKN/9SFliN+EWIZWL9sJdYtuyyXgu6x\n5KiI\r\n=MPYS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDcyiJoIiN3h34RzWACahH4EmyqwNfgD7kIHEvSnjXVpgIhANeYYZoAvULRMJaKdxEQ9gazSbAfGCfh9yfQry2OzJaC"}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.9_1601563998824_0.12796209753127763"},"_hasShrinkwrap":false},"1.1.0-beta.10":{"name":"typeshaders","version":"1.1.0-beta.10","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","tslint-microsoft-contrib":"^6.2.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"d3229695b11c49ac0bd754b8a4643c692e5d067e","_id":"typeshaders@1.1.0-beta.10","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-M/+8JtJbFTQVTqtBYu9JvghofvjTNLjw8+9yvvd26KMnTXkcUT2V3zuuhQkbglleRQ8AnsNHlfDbj8hUJICbXw==","shasum":"43edb40ec0d303ee0414409fc29b326f43b7e97a","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.10.tgz","fileCount":16,"unpackedSize":40319,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfde3fCRA9TVsSAnZWagAAHrMQAJbrw6esDVPxpnKX2K8K\nZi6nFz0G2hQw33xEINw/g6hMsLVXR3rXO29r4L5YYc2cLSFpRxlCKo+0R33e\nfXAGrGqx6i3BmiX2Pt+RyhLb3vAUhOmrTtQRRrTDHwSv1eWvKSsBTnJF8w6i\n4g++2vpt9x2cwom47uF3hDi1lL6POSp+q7qGGP367kEb/gqEikDXUlcvXnp3\nRw9VncZcpsLg/O/LTlif7klnxPs3+weWmKJFGWSCXRKOy84EfBujx+en5cBX\nyaQaGp+IfdgB2skvPioIS7+7q6C5M1UFspARPXFY+jM1E4legKqqxYjUZUSH\nA+LPddmWXOQuxZxYWLJSlGtt+MttdqPpruhs+ihr+cpKS6dgN3RoWWZ4h1wA\nQmML9pKs3ZFqxPMKtQ9OmQv/iocXg6n0mbiiQD5kjtAUzb3t+prE5jt6hJyH\nRcFleW87mCyya3q7jXUuR5dPGZoZYV90C284HBP6z32HeVfXwpQmznqYpKBV\nHOqRh32QKc3O5y4Y/yaSLACHfn18kUD9Z4N9IIJyoemTZbKhX3sN5wzy9kK7\ns3TL5NKR5uCqAvSsO/iF6R/ZXlqLLfFRcyoUtTadlOSmKPccqCrg3bmfmtmZ\nfMkKfuOgIpJtbGISa8sQAbXJJOhtVYtdPALvAz13OlCCSs9Uqi/3xZ1GHO9h\nzBMO\r\n=URN+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDN2SotD6Ap2Dy8eJEoWbpqOmx4i2JnbeBy9aiVAaDDuQIhAIrIlzF7M1sIERGbTApVNaGODgvezAutmii63InsdVHs"}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.10_1601564127115_0.3798060554406455"},"_hasShrinkwrap":false},"1.1.0-beta.11":{"name":"typeshaders","version":"1.1.0-beta.11","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","tslint-microsoft-contrib":"^6.2.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"184ab4f07e090f49d0ef2acbb77054780a100ac8","_id":"typeshaders@1.1.0-beta.11","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-xI6n/TNMuEAZBswPvSu4dPr8Qb8s5HcnwG9a2MFZeexQhJ+Ob9nDORFFOumUBYtTSVBTNXOPyZ9CnBTo67/IxQ==","shasum":"7fa48211f855db78a2e43fa21d0e4211f24682c6","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.11.tgz","fileCount":16,"unpackedSize":40350,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfde5dCRA9TVsSAnZWagAAZTAP/RwuIm+u7V5syMhxtARm\nPX9KPfX7SvV6nv5h1oO+rghtf9AK8WdGRaZeMfKsMzUvrPWAcMT9OY0cn1cV\nv5iWpdAnT8vCTx/4JgQJaGdokdKJoZEvVgWxRN8u4gI+tLXEcEafCTM12fHe\nAczzvPC9n9QjJ9F3bxpVc+jB8rQEUXEnwvpcNunKaPBQCTLKWUvNj8UNwKLQ\nOg9nCrdjSWUXoF8ZHsEN9RKzOa9bpyydF1MCwyOvSKywk3FcGY/O96tvPrtd\nNU2cNVUdaZ9p7BgXogrR/YuviSkgPziMGkYTaV3ufVxihNBZzaEAL50ZIa+K\n67DD3nqYi7nDHKLnwmoKZCQMW00hJzH7mljeC+J1j0jp/7TVMOHS7slUgQx0\nh+jG9qyktRWnpobs40aX3Jcg0QVGDphhXcolHF5ufdmkQgN+8El0mNEf6gmA\n6voUKownfiy8yGLjS13qqnW06ReJP/XZIC/OyWJ4A4PDJMZWNJUP5JooH5dk\niaMyLkM7ptFVBG0csk52gQSIAR/MEvk5pyrIeXilst1vmaFP1R0jIO2kPJpe\nIkXBqPiVJY5HG1itKX4M/OD3roZd4nA3kQhquxmnpGdqKrsW6T2ukQpAwqH2\nHnfOFZFuwMifriLfp0wDlLfuobOSrxybGKrNsOpnB/sdFjrMOqWznSZU18xc\nBXhg\r\n=4suj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHnd+ZtTy+JMDXLnF0yFhiA6PDasurZBaThIVGm7LByCAiBv4fXgl5jLhd2xXsJ0nzsEM59C2S5hsIbfv8d/OaDBiA=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.11_1601564253590_0.7369474715149742"},"_hasShrinkwrap":false},"1.1.0-beta.12":{"name":"typeshaders","version":"1.1.0-beta.12","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","tslint-microsoft-contrib":"^6.2.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"1d0a474988cd5a8e4f9b68a4a3fb6e27aa2ec0f1","_id":"typeshaders@1.1.0-beta.12","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-Sq4f+J21OVGHCJb4bbBnSGxpg7bxghYWCDt5gateSTy9Vq7K79LEPaIz+s9EzeUB3KyXt3hb6lXItQAuwlkuRA==","shasum":"4afb39128874a3a5245cb05872a2f8496087a3db","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.12.tgz","fileCount":16,"unpackedSize":40350,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfde51CRA9TVsSAnZWagAApHsP/jf6sO7ExV06bZwmYZPt\nGKqDdamMlQdsS2/G6B62zvQwGOZbLxZVU/sYLE1+KxmDqziLltDtCXirRLal\nmvALb1lBkX7Ma3t9N6vS4xV7K6IJ1m/jT4E39iuI+wopV/yqN5tFz3Z3yKDW\n2azWoapRX9xPQNKVNAVnSjm1TvDxPbozFOOm2iiwZyJMdeRETrSc6FZYrhh1\nPvd07UdhHtmkeMPdGIxTa6oMCNS8ubGSi8f8+HqtnS2/neUy+SVmJ9RuMPuv\n+0wBkw2zYBbfgReVmIq31aUuLnJ8nWcSn8YMi67osjtlvmtKMaKliVoXc8xb\nlZfRiQNj7Je4H4vDXj3Mnc0/BUfl9PiMHdYeXR+7szW0MP4ZSE8G+PER0zzg\n20pXzBb3vD75NQ6UZaM5SJuYyRkV7cXOMHjlwaOlio8w0PWUuBm23X9EPkhd\nkpuzCSLD05WtFcgOMh2GZfv9Vld+6GZ7Wpbm2R4+g3/HguRE4FMDrtenccyb\nIGZ3qoDzxlHX0j2gJxn9gWPQstDLnj7NZJRPHA1cVPjdDJhMnQmpCgulE37b\nBo6vTN1R+E7ANQVAbLq6kNAUmboPpPSIRCPeQs7MeYFqxQjHdo7xLJsApzw9\nZqI3GjmH802NPdNPAJqm6fBn53qL5mDfTy3qoCcUWdMa0lNlGgexPyL7UsWa\nWRHV\r\n=hHmf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDzGAoCKoov+BLo0MN9pzPIqjB2Z5Sahuy+jfxPmK88bwIhAMx+GeOSrqg7dp/Nx72GEFg9CzqahRnACzQphvd7p72V"}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.12_1601564277021_0.8981372009842925"},"_hasShrinkwrap":false},"1.1.0-beta.13":{"name":"typeshaders","version":"1.1.0-beta.13","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json","prep":"npm run lint && npm run build && git add -A"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","tslint-microsoft-contrib":"^6.2.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md","gitHead":"ee409413cc73b11d76a32362ae5500944114f767","_id":"typeshaders@1.1.0-beta.13","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-+uVPKDFllvoqnmWoWYF+O4B36mcFhY6Vs3oyAmxpTag2hfKMBHVTtIv5nDwQNFg0paTYffWbZgaeDy3xfzNcbA==","shasum":"ad06558e8b08318561db3de23f323e168e2b774a","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.0-beta.13.tgz","fileCount":16,"unpackedSize":40413,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfdfFbCRA9TVsSAnZWagAACHIP/3voReziK28k+QMdjto8\nrOouYp0QZvJV0Tra/RUfSsfGn2asSnIAss+tgxIU6FgSU1pLm3UnCPGlNQLG\n99AxdRE/A3Q3t6G9ARf6ewkUv6XzQ4KzcASjUIPwqaj6NwiJjPNMEGRxveAj\n45Xp5mfiz8+UiAL8KenuDxjYltIu2z2HGbjXmIbIWimDKpps0/ETSg2kVjk4\nxWThKDiCoUmRym2Lgfoo8/olxRmIxN4n5HhxS2KridWo9l+CqqVKFy9XNXtW\n1gMMFbawK2nWo9VOngvfvEazvkJ4sBHGuSPfXOJG239SQbTsIBkio66GEI1s\n6b6qWUbqJsJZpA7ZRZZNi8UlfjT68v2PFDKF6zEq/6dKT5uACUjGkpVixeWZ\nKyKRx84AYlZwhRGWb+JlQK/gxaspnLGwphNwhPbU3ciPo02JaJt0EM9GL/Ku\njDUdwxEKFEnyPAvrvUD+/z6OdEAl/DOYCvYv55XG637g/d2bAfCFWHvJeQxW\nnia3dfptC0wo+qUBMR2oPj8Rf6OI6ogiaMZrUc3CpG2QxRd6qJvRq77lgOPu\nuXT1wmMgqEUP9VApPwLfb9ygNGNjski4zB63Fen2B4WjNs2ArdaVWRRE4pk7\nLAriZpkECvl3E8ObdsEqfIR96IQEKIdn2eiYGUPtbUI1wdDpJW0gJPrmnEZ0\nipsh\r\n=zcMw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEzALwG2lyXxupHNdcFzGOg16/15hbcWx9EAwmXLKp2QAiB4MhvPRUSNECbHSgm60NU1LKEaOkrVZyeKCDYlEHeyfQ=="}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.0-beta.13_1601565019379_0.831998522405784"},"_hasShrinkwrap":false},"1.1.1":{"name":"typeshaders","version":"1.1.1","description":"WebGL shader playground in Typescript","main":"index.js","scripts":{"test":"jest","build":"tsc","lint":"tslint -p tsconfig.json"},"jest":{"transform":{"^.+\\.(t|j)sx?$":"ts-jest"},"testRegex":"(/test/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$","moduleFileExtensions":["ts","tsx","js","jsx","json","node"],"setupFiles":["jest-webgl-canvas-mock"]},"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"keywords":["shader","WebGL","typescript","animation"],"author":{"name":"Andrin Rehmann"},"license":"ISC","bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"homepage":"https://github.com/andrinr/typeshaders#readme","dependencies":{"@types/webgl2":"0.0.5"},"devDependencies":{"@types/jest":"^26.0.5","canvas":"^2.6.1","jest":"^26.1.0","jest-webgl-canvas-mock":"^0.2.3","prettier":"^2.0.5","ts-jest":"^26.1.3","tslint":"^6.1.2","tslint-config-prettier":"^1.18.0","typedoc":"^0.17.8","typescript":"^3.9.6"},"gitHead":"bcf17e5b583326cbf17c1afa7338765902c5fc9c","_id":"typeshaders@1.1.1","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-lNs8srjO/XQ75Bau+N60OUOjhklasrAfWEvzsnZ7KpxNKmL9bpqdbscv7bf6LKWccrpM+svHjnzEkkhDZts+aw==","shasum":"421e740c1d88249bb74ed696df09e0692e55c1f7","tarball":"https://registry.npmjs.org/typeshaders/-/typeshaders-1.1.1.tgz","fileCount":16,"unpackedSize":40472,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfdyBoCRA9TVsSAnZWagAA8DwP/2VJhpANr6pVhQgX4DSE\nqM17F8u/QWIz/TR1lsXy5thP9RNP44Cjk1fjNwmBCZehktHgSITyP6o0o9Ej\nR6/qVHnVfqbLpa8YqbMgcnEWKYfGqsmCWSnarNz9x/Ls8JcgoRQ3aojMQVvZ\nPtTFHwgsTzj8iZVkF7keuXLGM2MMQmZlbjKOuXYpkQu1+bRXbMmcXJJtgv3d\nV+CM92e2zGWUOA00u+54Xw5om42HIfEM5srhvjhudfPZNvyT51K8B9emqWTF\nhhPUvZRwG45ZgTfeur92Fp1afRono5gA8K+PCKCHqd5+yETg5TRPBiLJJqCO\nJicaP3WemgnNboqbHEIE7I71lwdGupLvTx5AYK1rAXgGNcMfW32/hGmCc9CB\nIh61+Ox2nko0xTBk2m9QDfCfyC79KpmezVw52PvXdv8aJKvEv7PTTniygzmR\n+PM8bPCmThFTKjfnzOUy5A2/rQuk+jzQnApY8QgKrN1flAW2akdPm99rzFEE\nVnleuHa0P6Z4DK4JyEd3WwaFBur+4tZk/fffwqbLlXApihCLfQ8sndSRIVxL\nICakwOIIGsaIjUJj7N3OQb+AImZcmR4SAvgdkdOcSWDkB5PBfm1BSJViz++X\n2jOJo143QzXTLHW1JK5RIhOIqseJ551U0gujR7ego5z93WwAaPYaQ8Q78D9c\nWGcU\r\n=zOhy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDXdvWd7Z8fZb3mUUzBtWTfIs3enC6zIv+ztuLvyQfZ7AIhAJA+ZD/oexukzTTxz8KoxONlz3xRggifospaBQAUApM1"}]},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"_npmUser":{"name":"andrinr","email":"andrinrehmann@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/typeshaders_1.1.1_1601642599895_0.6473373798226549"},"_hasShrinkwrap":false}},"time":{"created":"2020-07-13T14:15:59.521Z","1.0.0":"2020-07-13T14:15:59.641Z","modified":"2022-05-22T14:02:48.155Z","1.0.1":"2020-07-13T14:19:05.365Z","1.0.2":"2020-07-13T14:45:55.312Z","1.0.3":"2020-07-13T15:16:57.055Z","1.0.4":"2020-07-14T20:25:05.898Z","1.0.5":"2020-07-14T21:55:38.604Z","1.0.6":"2020-07-15T12:35:49.724Z","1.0.7":"2020-07-15T13:28:23.681Z","1.0.8":"2020-07-21T21:19:39.671Z","1.0.9":"2020-07-21T21:25:36.639Z","1.0.10":"2020-07-21T21:29:29.638Z","1.0.11":"2020-07-21T21:48:04.732Z","1.0.12":"2020-07-21T21:49:17.464Z","1.0.13":"2020-07-21T21:52:40.248Z","1.0.14":"2020-07-21T21:57:09.282Z","0.0.14-beta.0":"2020-07-22T13:33:56.943Z","0.0.14-beta.1":"2020-07-22T13:56:58.763Z","1.0.14-beta.2":"2020-07-26T13:15:21.337Z","1.0.15":"2020-07-26T13:20:48.230Z","1.0.16":"2020-07-26T13:23:36.398Z","1.0.17":"2020-07-26T13:28:54.650Z","1.0.17-beta.0":"2020-07-26T13:40:54.854Z","1.0.17-beta.2":"2020-07-26T13:47:23.140Z","1.0.17-beta.3":"2020-07-26T14:07:36.937Z","1.0.17-beta.4":"2020-07-26T14:10:19.196Z","1.1.17":"2020-07-26T14:14:40.180Z","1.1.0":"2020-07-26T14:15:08.723Z","1.1.0-beta.0":"2020-09-29T14:33:53.822Z","1.1.0-beta.3":"2020-09-30T15:11:37.066Z","1.1.0-beta.4":"2020-09-30T15:26:10.932Z","1.1.0-beta.5":"2020-10-01T13:32:32.055Z","1.1.0-beta.6":"2020-10-01T13:42:14.846Z","1.1.0-beta.7":"2020-10-01T14:19:10.029Z","1.1.0-beta.8":"2020-10-01T14:43:07.540Z","1.1.0-beta.9":"2020-10-01T14:53:18.977Z","1.1.0-beta.10":"2020-10-01T14:55:27.237Z","1.1.0-beta.11":"2020-10-01T14:57:33.709Z","1.1.0-beta.12":"2020-10-01T14:57:57.117Z","1.1.0-beta.13":"2020-10-01T15:10:19.510Z","1.1.1":"2020-10-02T12:43:19.998Z"},"maintainers":[{"name":"andrinr","email":"andrinrehmann@gmail.com"}],"description":"WebGL shader playground in Typescript","homepage":"https://github.com/andrinr/typeshaders#readme","keywords":["shader","WebGL","typescript","animation"],"repository":{"type":"git","url":"git+https://github.com/andrinr/typeshaders.git"},"author":{"name":"Andrin Rehmann"},"bugs":{"url":"https://github.com/andrinr/typeshaders/issues"},"license":"ISC","readme":"# typeshaders\r\n\r\nEasy WebGL shader playground in Typescript with WEbGL 1.0 support.\r\n\r\n## State of the project\r\nThis project is still in early stages, \r\nand there will be major changes and added examples in the future.\r\n\r\n### Roadmap:\r\n\r\n- Enable Multi Texture Outputs with WebGL1.0 -> branch: \"multi-texture\", currently on npm as typeshaders@beta\r\n\r\n\r\n## Get started\r\n\r\n#### 0. Installation\r\n\r\n```npm i typeshaders```\r\n\r\n#### 1. Create a canvas object \r\n\r\nMake sure to add a custom id to the object. \r\nThe shader will be rendered on this canvas.\r\n\r\n````html\r\n<canvas id = \"canvasID\"/>\r\n````\r\n\r\n#### 2. Create a new manager\r\n\r\nPass the custom id to the ``Manager``.\r\n\r\nThe ``Manager`` function will handle the animation frames, as well as the ``Scene``\r\nand its corresponding ``Renderer``'s. \r\n\r\n````typescript\r\nconst manager = new Manager(\"canvasID\");\r\n````\r\n\r\n#### 3. Create a new Scene\r\n\r\nImplement the ``start`` and if desired the ``update`` method. \r\nThe ``start`` function is called when the Scene is initialized, \r\nthe ``update`` function is called once in each frame. \r\n\r\nDon't override the constructor and use the ``start`` function,\r\nunless you know what you are doing.\r\n\r\n````typescript\r\nclass myScene extends Scene{\r\n\r\n    start(){\r\n \r\n    }\r\n\r\n    update(){\r\n    \r\n    }\r\n}\r\n````\r\n\r\n##### 3.1 Create a new Shader\r\n\r\nEach ``Shader`` requires a codestring, shadertype and an array containing the required ``IUniform`` objects. \r\nThe name of the uniform object needs to be written just as in the codestring describing the shader.\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    uniform vec4 uColor;\r\n    void main () {\r\n        gl_FragColor = uColor;\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'uColor',\r\n        source:  [0,1,1,1],\r\n        type: EUniformTypes.f4\r\n      }\r\n    ] \r\n)\r\n````\r\n\r\n##### 3.2 Create a new Renderer\r\n\r\nA scene can have several renderers, which are all pushed into the ``renderers`` array. Each ``Renderer`` consists of a fragment shader, vertex shader, geometry object and\r\noptionally a ``FBO`` (frameBufferObject). Optionally one can set the number of iterations\r\nthe program will be run in each frame. In case the shader requires a feedback loop,\r\nwe can set ``autoFeedback`` to true.\r\n\r\n````typescript\r\nstart(){\r\n    this.renderers.push(\r\n        new Renderer(\r\n            {\r\n                vertex: Shader,\r\n                fragment: Shader,\r\n                geo: Geometry,\r\n                fbo: FBO,\r\n                iterations: 1,\r\n                autoFeedback: false\r\n            }\r\n        )   \r\n    )\r\n}\r\n````\r\n\r\nIn most cases we only want to render on a plain 2D plane. \r\nIn that case we can simply use the ``baseVertexShader`` and ``baseGeo``\r\nwhich can be found inside the ``Manger`` class.\r\n\r\n**IMPORTANT:** the last element of the ``renderers`` array is expected\r\nto have no ``FBO`` object attached and will automatically render to the canvas object. \r\n\r\n##### 3.3 Feedback loops\r\n\r\nTo create a feedback loop, we need to set ``autoFeedback`` parameter of the specific ``Renderer`` to true.\r\nFurthermore inside the fragment shader the very first sampler2D variable needs to be called\r\n*feedback*. *Typeshaders* uses a ping pong technique where each ``FBO`` object has two textures, which are\r\nalternately associated the role of the read and write texture. \r\n\r\nA standard fragment shader which can used along the ``baseVertexShader``\r\nlooks like this:\r\n\r\n````glsl\r\nprecision mediump float;\r\nvarying vec2 vUv;\r\nvarying vec2 vL;\r\nvarying vec2 vR;\r\nvarying vec2 vT;\r\nvarying vec2 vB;\r\n\r\nuniform sampler2D feedback;\r\n\r\nvoid main() {\r\n    gl_FragColor = texture2D(feedback,vUv) + vec4(0.002,0,0,0);\r\n}\r\n````\r\n\r\n##### 3.4 FBO's\r\n\r\nInside the ``Scene`` class we can create a ``FBO`` as following:\r\n````typescript\r\nconst fbo1 = new FBO(this.manager, true)\r\n````\r\n\r\nThe second parameter enables the feedback inside the ``FBO``. \r\n\r\nThe reason for differentiation between the two variables: \r\n``autoFeedback`` of the ``Renderer`` class and ``feedback`` of the ``FBO`` class is as follows:\r\n\r\nThere are certain scenarios where we want to have the possibility of a feedback loop, but not \r\nmake use of it in each frame. Then one would set ``àutoFeedback`` to false, ``feedback`` to true,\r\nand manually swap the ``FBO`` write and read textures. We can for example simply call ``FBO.output(true)``\r\nto get the output of the ``FBO`` object and swap the textures. \r\n\r\nWe can then pass this ``FBO`` to a ``Renderer``:\r\n\r\n````typescript\r\nnew Renderer(\r\n    {\r\n        vertex: Shader,\r\n        fragment: Shader,\r\n        geo: Geometry,\r\n        fbo: fbo1,\r\n        iterations: 1,\r\n        autoFeedback: true\r\n    }\r\n)   \r\n````\r\n\r\nAnd use the output of the ``FBO`` as a uniform for a fragment shader:\r\n\r\n````typescript\r\nnew Shader(\r\n    `\r\n    precision mediump float;\r\n    varying vec2 vUv;\r\n    varying vec2 vL;\r\n    varying vec2 vR;\r\n    varying vec2 vT;\r\n    varying vec2 vB;\r\n    \r\n    uniform sampler2D feedback;\r\n    uniform sampler2D fbo1;\r\n\r\n    void main () {\r\n        gl_FragColor = texture2D(feedback,vUv) + texture2D(fbo1,vUv);\r\n    }\r\n    `,\r\n    EShaderTypes.fragment,\r\n    [\r\n      {\r\n        name: 'fbo1',\r\n        source: () => fbo1.output(),\r\n        type: EUniformTypes.tex\r\n      }\r\n    ] \r\n)\r\n````\r\n","readmeFilename":"README.md"}