Add Konami Code

Ideally I would cherry pick these (or jspaint would be simply part of a monorepo of 98.js), but these changes are a culmination of these commits:

aac59ee0c1
b85d402f8e
a02125968c
3074c6d8a2
23c6a40d4e
7243bafdee
a578d1d035
cf5cce42a4
main
Isaiah Odhner 2018-04-09 00:36:51 -04:00
parent b02a4d7ff0
commit e1f4e5b862
4 changed files with 632 additions and 0 deletions

366
images/98.js.org.svg Normal file
View File

@ -0,0 +1,366 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!--
Windows 98 logo vector by George Walker: https://pkmnct.deviantart.com/art/Windows-98-Logo-Vector-211754675
JS community logo: https://github.com/voodootikigod/logo.js/
-->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
id="svg2985"
version="1.1"
inkscape:version="0.91 r13725"
width="484.18103"
height="566.12677">
<metadata
id="metadata2991">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs2989">
<inkscape:perspective
id="perspective48"
inkscape:persp3d-origin="138 : 19.666667 : 1"
inkscape:vp_z="276 : 29.5 : 1"
inkscape:vp_y="0 : 1000 : 0"
inkscape:vp_x="0 : 29.5 : 1"
sodipodi:type="inkscape:persp3d" />
</defs>
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1017"
id="namedview2987"
showgrid="false"
inkscape:zoom="0.70710678"
inkscape:cx="366.41247"
inkscape:cy="472.86846"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
inkscape:current-layer="text6745"
showborder="true"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0" />
<g
id="g3652"
transform="translate(-116.56253,-176.56085)">
<g
transform="matrix(1.0872006,0.414276,-0.414276,1.0872006,-68.950933,-262.32295)"
id="g3509">
<polygon
style="clip-rule:evenodd;fill:#a8ce81;fill-rule:evenodd"
points="329.128,342.317 329.128,342.317 347.601,342.317 347.601,372.217 329.128,372.217 "
id="polygon3234"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#f7df1e;fill-rule:evenodd"
points="329.128,372.788 329.128,372.788 347.601,372.788 347.601,402.689 329.128,402.689 "
id="polygon3236"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="306.651,343.085 306.651,343.085 325.125,343.085 325.125,372.979 306.651,372.979 "
id="polygon3238"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="306.651,373.55 306.651,373.55 325.125,373.55 325.125,403.254 306.651,403.254 "
id="polygon3240"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<path
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
inkscape:connector-curvature="0"
d="m 682.75354,363.39634 c -13.62884,-4.3943 -31.15261,-8.00947 -51.78223,-8.00947 -1.34979,0.10042 -2.60556,0.0242 -3.84791,0.0242 l 0,-80.38207 c 1.47067,-0.29088 2.92455,-0.31858 4.4758,0 20.34422,-0.31858 37.66988,3.19963 51.15434,7.25458 l 0,81.11276 0,0 0,0 z m 0,106.84487 c -13.61877,-4.07918 -31.15261,-7.69781 -51.78223,-7.94714 -1.33636,0.24933 -2.58542,0.24933 -3.84791,0 l 0,-82.41131 c 1.47067,-0.14544 2.92455,-0.16968 4.4758,0 20.34422,-0.16968 37.66988,3.34507 51.15434,7.91597 l 0,82.44248 0,0 0,0 z m 33.25117,-207.7441 c 0,0 -31.91481,-22.15157 -83.76755,-22.42167 -52.0307,0.2701 -83.95894,17.78151 -83.76755,17.78151 l 0,36.29366 c -0.19139,-0.24239 20.49531,-12.91972 56.28489,-17.80574 l 0,81.11622 c -35.99775,4.59168 -56.38898,17.95119 -56.38898,17.80575 l 0.10409,25.05686 c 0,0 20.11925,-14.23906 56.28489,-19.12507 l 0,83.75834 c -29.74574,3.49744 -49.64003,11.72853 -56.28489,15.17055 l 0,34.95357 c 8.40764,-4.22809 37.8109,-16.386 81.21235,-16.386 51.90311,-0.10042 83.81456,21.32396 83.81456,21.00538 l 2.50819,-257.20336 0,0 z"
id="path3242" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="295.799,343.27 295.799,343.27 305.51,339.08 305.51,349.364 295.799,353.553 "
id="polygon3244"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="295.799,407.07 295.799,407.07 305.51,402.881 305.51,412.975 295.799,417.348 "
id="polygon3246"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="295.799,396.594 295.799,396.594 305.51,392.404 305.51,401.738 295.799,405.928 "
id="polygon3248"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="295.799,354.696 295.799,354.696 305.51,350.506 305.51,359.838 295.799,364.028 "
id="polygon3250"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="295.799,375.645 295.799,375.645 305.51,371.455 305.51,380.787 295.799,384.977 "
id="polygon3252"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="295.799,386.12 295.799,386.12 305.51,381.93 305.51,391.262 295.799,395.451 "
id="polygon3254"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="295.799,365.17 295.799,365.17 305.51,360.98 305.51,370.313 295.799,374.502 "
id="polygon3256"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="285.134,346.507 285.134,346.507 294.467,342.317 294.467,350.506 285.134,354.505 "
id="polygon3258"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="250.856,341.174 250.856,341.174 254.666,339.467 254.666,342.889 250.856,344.602 "
id="polygon3260"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="275.423,347.269 275.423,347.269 283.61,343.65 283.61,349.935 275.423,353.553 "
id="polygon3262"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="266.662,346.507 266.662,346.507 273.33,343.65 273.33,348.412 266.662,351.268 "
id="polygon3264"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="258.663,343.84 258.663,343.84 264.188,341.555 264.188,345.174 258.663,347.65 "
id="polygon3266"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="285.134,378.501 285.134,378.501 294.467,374.502 294.467,382.501 285.134,386.5 "
id="polygon3268"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="250.856,373.169 250.856,373.169 254.666,371.455 254.666,375.074 250.856,376.597 "
id="polygon3270"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="275.423,379.263 275.423,379.263 283.61,375.645 283.61,381.93 275.423,385.548 "
id="polygon3272"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="266.662,378.501 266.662,378.501 273.33,375.645 273.33,380.406 266.662,383.263 "
id="polygon3274"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="258.663,376.026 258.663,376.026 264.188,373.55 264.188,377.168 258.663,379.644 "
id="polygon3276"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="285.134,410.301 285.134,410.301 294.467,406.111 294.467,414.117 285.134,418.299 "
id="polygon3278"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="250.856,404.785 250.856,404.785 254.666,403.254 254.666,406.689 250.856,408.402 "
id="polygon3280"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="275.423,411.063 275.423,411.063 283.61,407.443 283.61,413.545 275.423,417.164 "
id="polygon3282"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="266.662,410.301 266.662,410.301 273.33,407.443 273.33,412.021 266.662,414.879 "
id="polygon3284"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#000101;fill-rule:evenodd"
points="258.663,407.641 258.663,407.641 264.188,405.35 264.188,408.967 258.663,411.26 "
id="polygon3286"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="259.616,354.315 259.616,354.315 263.614,352.411 263.614,355.838 259.616,357.743 "
id="polygon3288"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="286.276,357.553 286.276,357.553 293.896,354.315 293.896,360.791 286.276,364.218 "
id="polygon3290"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="276.374,357.743 276.374,357.743 283.231,354.696 283.231,360.219 276.374,363.266 "
id="polygon3292"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="267.616,357.172 267.616,357.172 272.945,354.886 272.945,359.076 267.616,361.361 "
id="polygon3294"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="251.046,351.649 251.046,351.649 254.095,350.315 254.095,353.173 251.046,354.505 "
id="polygon3296"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="259.616,364.79 259.616,364.79 263.614,362.885 263.614,366.313 259.616,368.218 "
id="polygon3298"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="286.276,368.027 286.276,368.027 293.896,364.599 293.896,371.265 286.276,374.692 "
id="polygon3300"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="276.374,368.218 276.374,368.218 283.231,365.17 283.231,370.693 276.374,373.55 "
id="polygon3302"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="267.616,367.646 267.616,367.646 272.945,365.361 272.945,369.36 267.616,371.836 "
id="polygon3304"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#ef7066;fill-rule:evenodd"
points="251.046,361.933 251.046,361.933 254.095,360.6 254.095,363.647 251.046,364.98 "
id="polygon3306"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="259.616,386.31 259.616,386.31 263.614,384.596 263.614,388.024 259.616,389.738 "
id="polygon3308"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="286.276,389.738 286.276,389.738 293.896,386.31 293.896,392.976 286.276,396.404 "
id="polygon3310"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="276.374,389.738 276.374,389.738 283.231,386.881 283.231,392.213 276.374,395.261 "
id="polygon3312"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="267.616,389.357 267.616,389.357 272.945,387.072 272.945,391.071 267.616,393.356 "
id="polygon3314"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="251.046,383.644 251.046,383.644 254.095,382.311 254.095,385.357 251.046,386.691 "
id="polygon3316"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="259.616,396.785 259.616,396.785 263.614,395.07 263.614,398.5 259.616,400.213 "
id="polygon3318"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="286.276,400.213 286.276,400.213 293.896,396.785 293.896,403.451 286.276,406.689 "
id="polygon3320"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="276.374,400.213 276.374,400.213 283.231,397.166 283.231,402.689 276.374,405.736 "
id="polygon3322"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="267.616,399.834 267.616,399.834 272.945,397.355 272.945,401.547 267.616,403.832 "
id="polygon3324"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
<polygon
style="clip-rule:evenodd;fill:#6eaed7;fill-rule:evenodd"
points="251.046,394.118 251.046,394.118 254.095,392.785 254.095,395.642 251.046,396.975 "
id="polygon3326"
transform="matrix(3.357686,0,0,3.4628058,-481.17152,-914.30628)" />
</g>
</g>
<g
id="logo"
transform="matrix(0.12086097,0.04799847,-0.04799847,0.12086097,321.19738,240.49136)">
<path
d="m 165.65,526.47375 48.2125,-29.1775 C 223.16375,513.7875 231.625,527.74 251.92,527.74 c 19.45375,0 31.71875,-7.60975 31.71875,-37.21 l 0,-201.3 59.20375,0 0,202.1375 c 0,61.32 -35.94375,89.23125 -88.385,89.23125 -47.36125,0 -74.8525,-24.52875 -88.8075,-54.13"
id="j"
inkscape:connector-curvature="0" />
<path
d="m 375,520.13 48.20625,-27.91125 c 12.69,20.72375 29.1825,35.9475 58.36125,35.9475 24.53125,0 40.17375,-12.26475 40.17375,-29.18125 0,-20.29875 -16.06875,-27.48875 -43.135,-39.32625 l -14.7975,-6.3475 c -42.715,-18.18125 -71.05,-41.0175 -71.05,-89.2275 0,-44.40375 33.83125,-78.2375 86.695,-78.2375 37.6375,0 64.7025,13.11125 84.15375,47.36625 l -46.09625,29.60125 c -10.15,-18.1825 -21.1425,-25.37125 -38.0575,-25.37125 -17.33875,0 -28.335,10.995 -28.335,25.37125 0,17.7625 10.99625,24.9525 36.3675,35.94875 l 14.8,6.3425 c 50.325,21.56875 78.66,43.5575 78.66,93.03375 0,53.2875 -41.86625,82.465 -98.11,82.465 -54.97625,0 -90.5,-26.2175 -107.83625,-60.47375"
id="s"
inkscape:connector-curvature="0" />
</g>
<g
style="font-style:normal;font-weight:normal;font-size:180px;line-height:125%;font-family:sans-serif;text-align:start;letter-spacing:0px;word-spacing:0px;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
id="text6745">
<path
d="m 158.82372,539.82062 0,-12.51221 12.5122,0 0,12.51221 -12.5122,0 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:125px;font-family:arial;-inkscape-font-specification:arial;letter-spacing:-5.51000023px"
id="path6816" />
<path
d="m 184.80786,463.09943 0,-12.75635 10.98632,0 0,12.75635 -10.98632,0 z m -13.91602,101.86767 2.0752,-9.33838 q 3.29589,0.8545 5.18798,0.8545 3.35694,0 5.00489,-2.25831 1.64795,-2.19726 1.64795,-11.10839 l 0,-68.11524 10.98632,0 0,68.35938 q 0,11.96289 -3.11279,16.66259 -3.96728,6.10352 -13.18359,6.10352 -4.45557,0 -8.60596,-1.15967 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:125px;font-family:arial;-inkscape-font-specification:arial;letter-spacing:-5.51000023px"
id="path6818" />
<path
d="m 202.79639,520.47247 10.86426,-1.70898 q 0.91553,6.53076 5.06592,10.00976 4.21142,3.47901 11.71875,3.47901 7.56836,0 11.23047,-3.05176 3.6621,-3.11279 3.6621,-7.26318 0,-3.72315 -3.23486,-5.85938 -2.2583,-1.46484 -11.23047,-3.72314 -12.08496,-3.05176 -16.78467,-5.24903 -4.63867,-2.2583 -7.08007,-6.16455 -2.38037,-3.96728 -2.38037,-8.72802 0,-4.3335 1.95312,-7.99561 2.01416,-3.72314 5.43213,-6.16455 2.56348,-1.89209 6.95801,-3.17383 4.45556,-1.34277 9.52148,-1.34277 7.6294,0 13.3667,2.19726 5.79834,2.19727 8.54492,5.98145 2.74658,3.72314 3.78418,10.00976 l -10.74219,1.46485 q -0.73242,-5.00488 -4.27246,-7.8125 -3.479,-2.80762 -9.88769,-2.80762 -7.56836,0 -10.80322,2.50244 -3.23487,2.50244 -3.23487,5.85938 0,2.13623 1.34278,3.84521 1.34277,1.77002 4.21142,2.92969 1.64795,0.61035 9.70459,2.80762 11.65772,3.11279 16.23535,5.12695 4.63867,1.95313 7.26319,5.7373 2.62451,3.78418 2.62451,9.39942 0,5.49316 -3.23486,10.37598 -3.17383,4.82177 -9.21631,7.50732 -6.04248,2.62451 -13.67188,2.62451 -12.63428,0 -19.28711,-5.24902 -6.59179,-5.24903 -8.42285,-15.56397 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:125px;font-family:arial;-inkscape-font-specification:arial;letter-spacing:-5.51000023px"
id="path6820" />
<path
d="m 267.29372,539.82062 0,-12.51221 12.5122,0 0,12.51221 -12.5122,0 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:125px;font-family:arial;-inkscape-font-specification:arial;letter-spacing:-5.51000023px"
id="path6822" />
<path
d="m 289.24953,507.41095 q 0,-18.00537 10.00976,-26.67236 8.36182,-7.20215 20.38574,-7.20215 13.3667,0 21.85059,8.78906 8.48389,8.72803 8.48389,24.16992 0,12.51221 -3.78418,19.71436 -3.72315,7.14111 -10.9253,11.1084 -7.14111,3.96728 -15.625,3.96728 -13.61084,0 -22.03369,-8.72803 -8.36181,-8.72802 -8.36181,-25.14648 z m 11.2915,0 q 0,12.45117 5.43213,18.67676 5.43213,6.16455 13.67187,6.16455 8.17872,0 13.61084,-6.22559 5.43213,-6.22558 5.43213,-18.98193 0,-12.02393 -5.49316,-18.18848 -5.43213,-6.22558 -13.54981,-6.22558 -8.23974,0 -13.67187,6.16455 -5.43213,6.16455 -5.43213,18.61572 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:125px;font-family:arial;-inkscape-font-specification:arial;letter-spacing:-5.51000023px"
id="path6824" />
<path
d="m 357.2869,539.82062 0,-64.81934 9.88769,0 0,9.82666 q 3.78418,-6.89697 6.95801,-9.09424 3.23486,-2.19726 7.08008,-2.19726 5.5542,0 11.2915,3.54004 L 388.72,487.26935 q -4.02832,-2.38037 -8.05664,-2.38037 -3.60107,0 -6.46973,2.19726 -2.86865,2.13623 -4.08935,5.98145 -1.83106,5.85937 -1.83106,12.81738 l 0,33.93555 -10.98632,0 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:125px;font-family:arial;-inkscape-font-specification:arial;letter-spacing:-5.51000023px"
id="path6826" />
<path
d="m 391.63286,545.19171 10.68115,1.58692 q 0.67139,4.94384 3.72315,7.20214 4.08935,3.05176 11.16943,3.05176 7.62939,0 11.77978,-3.05176 4.15039,-3.05175 5.61524,-8.54492 0.85449,-3.35693 0.79346,-14.09912 -7.20215,8.48389 -17.94434,8.48389 -13.3667,0 -20.69092,-9.64356 -7.32422,-9.64355 -7.32422,-23.13232 0,-9.27734 3.35694,-17.08984 3.35693,-7.87354 9.70459,-12.146 6.40869,-4.27246 15.01464,-4.27246 11.47461,0 18.9209,9.27734 l 0,-7.8125 10.13184,0 0,56.03028 q 0,15.13671 -3.11279,21.42334 -3.05176,6.34765 -9.76563,10.00976 -6.65283,3.66211 -16.41846,3.66211 -11.59668,0 -18.73779,-5.24902 -7.14111,-5.18799 -6.89697,-15.68604 z m 9.09424,-38.94043 q 0,12.75635 5.06591,18.61572 5.06592,5.85938 12.69532,5.85938 7.56836,0 12.69531,-5.79834 5.12695,-5.85938 5.12695,-18.31055 0,-11.90185 -5.31006,-17.94433 -5.24902,-6.04248 -12.69531,-6.04248 -7.32422,0 -12.45117,5.98144 -5.12695,5.92041 -5.12695,17.63916 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:125px;font-family:arial;-inkscape-font-specification:arial;letter-spacing:-5.51000023px"
id="path6828" />
</g>
<g
id="g3601"
transform="matrix(1.0930603,0,0,1.1433666,-620.83772,-448.6356)">
<path
inkscape:connector-curvature="0"
d="m 586.31583,848.73795 11.22765,-0.96868 c 0.94796,4.90531 2.76538,8.46461 5.44322,10.67509 2.67787,2.21049 6.11048,3.31714 10.30083,3.31714 3.58655,0 6.73235,-0.76593 9.44642,-2.29496 2.71709,-1.53467 4.93002,-3.57902 6.64179,-6.13867 1.7118,-2.56247 3.15185,-6.01759 4.31716,-10.37379 1.16534,-4.35339 1.74802,-8.78844 1.74802,-13.30796 0,-0.48434 -0.0208,-1.21084 -0.0633,-2.17669 -2.3337,3.46637 -5.52477,6.28228 -9.56417,8.43926 -4.04547,2.1598 -8.42298,3.23547 -13.13868,3.23547 -7.86749,0 -14.52739,-2.65821 -19.97666,-7.98308 -5.44927,-5.31925 -8.17244,-12.33648 -8.17244,-21.04325 0,-8.98837 2.84391,-16.22524 8.53167,-21.7078 5.69083,-5.48257 12.81565,-8.22244 21.38054,-8.22244 6.1859,0 11.84051,1.55438 16.96977,4.6575 5.12322,3.10595 9.01472,7.52973 11.67747,13.27699 2.65973,5.74444 3.98808,14.06262 3.98808,24.9489 0,11.3312 -1.31931,20.35617 -3.95488,27.06928 -2.63862,6.71312 -6.56027,11.82398 -11.76805,15.3326 -5.20776,3.50862 -11.31516,5.26011 -18.31621,5.26011 -7.43578,0 -13.51004,-1.92326 -18.21968,-5.7726 -4.71262,-3.84371 -7.54446,-9.25306 -8.49844,-16.22242 z m 47.73935,-39.16641 c 0,-6.25693 -1.77515,-11.22137 -5.32548,-14.89613 -3.55337,-3.67475 -7.85242,-5.51072 -12.89414,-5.51072 -5.21983,0 -9.74835,1.97958 -13.57944,5.93311 -3.83414,3.95634 -5.74817,9.0841 -5.74817,15.38046 0,5.65434 1.82047,10.24708 5.45834,13.77822 3.63787,3.53396 8.1513,5.29953 13.54623,5.29953 5.40096,0 9.84496,-1.76557 13.32586,-5.29953 3.47788,-3.53114 5.2168,-8.428 5.2168,-14.68494 z"
id="path37" />
<path
inkscape:connector-curvature="0"
style="font-style:normal;font-weight:normal;font-size:43.95706177px;font-family:'Bitstream Vera Sans';fill:#000000;fill-opacity:1;stroke:none"
d="m 661.62366,821.81092 c -4.83464,-1.65319 -8.41741,-4.01209 -10.7483,-7.07669 -2.33102,-3.0645 -3.49649,-6.73389 -3.49649,-11.00819 0,-6.45161 2.48202,-11.87506 7.44611,-16.27034 4.96408,-4.39513 11.56847,-6.59273 19.81323,-6.59282 8.28783,9e-5 14.95694,2.24809 20.00744,6.74402 5.0504,4.4961 7.57558,9.96995 7.57563,16.42156 -5e-5,4.11301 -1.15476,7.69168 -3.46404,10.73601 -2.30949,3.04444 -5.81669,5.39326 -10.52172,7.04645 5.82735,1.77426 10.26264,4.63719 13.30589,8.58881 3.04315,3.95169 4.56475,8.66948 4.5648,14.15339 -5e-5,7.58075 -2.87057,13.95178 -8.6116,19.11311 -5.74116,5.16136 -13.29518,7.74203 -22.66214,7.74203 -9.36709,0 -16.92111,-2.59076 -22.66219,-7.77227 -5.74109,-5.18149 -8.6116,-11.64326 -8.6116,-19.3853 0,-5.76616 1.56476,-10.59484 4.6943,-14.48605 3.12954,-3.89113 7.58641,-6.54237 13.37068,-7.95372 l 0,0 z m -2.33097,-18.44779 c -2e-5,4.19366 1.44602,7.62112 4.33817,10.28238 2.89212,2.66137 6.64753,3.99203 11.26635,3.99198 4.48922,5e-5 8.1691,-1.32053 11.03969,-3.96174 2.87049,-2.6411 4.30577,-5.87702 4.30582,-9.70777 -5e-5,-3.99191 -1.47849,-7.3488 -4.43529,-10.07068 -2.95696,-2.72173 -6.63684,-4.08263 -11.03975,-4.08271 -4.44611,8e-5 -8.13681,1.33074 -11.07206,3.99198 -2.9353,2.6614 -4.40295,5.84691 -4.40293,9.55656 l 0,0 z m -3.75545,40.94805 c 0,3.10489 0.78776,6.10895 2.36338,9.0122 1.57552,2.90327 3.91727,5.15128 7.02526,6.74402 3.10788,1.59277 6.45324,2.38915 10.03606,2.38915 5.56838,0 10.16554,-1.6734 13.79158,-5.02022 3.62585,-3.3468 5.43882,-7.60088 5.43887,-12.76225 -5e-5,-5.24196 -1.86699,-9.57668 -5.60077,-13.00417 -3.73393,-3.42742 -8.40662,-5.14115 -14.01817,-5.14119 -5.48209,4e-5 -10.02533,1.69361 -13.62966,5.0807 -3.6044,3.38717 -5.40655,7.62109 -5.40655,12.70176 l 0,0 z"
id="text2429" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 26 KiB

View File

@ -46,5 +46,7 @@
<script src="src/menus.js"></script>
<script src="src/canvas-change.js"></script>
<script src="src/sessions.js"></script>
<script src="lib/konami.js"></script>
<script src="src/vaporwave-fun.js"></script>
</body>
</html>

55
lib/konami.js Normal file
View File

@ -0,0 +1,55 @@
/**
* @license konami-js v1.0.1
* http://mck.me/mit-license
*/
var Konami = {};
(function(Konami, window) {
'use strict';
/**
* Creates an event handler responding to the specified sequence.
* @param {...number|function()} arguments
* @return {function(Event)}
*/
var sequence = Konami.sequence = function() {
var sequence = Array.prototype.slice.call(arguments),
state = 0;
/**
* Event handler
* @param {Event|number} e
*/
return function(e) {
// patch legacy IE
e = (e || window.event);
e = (e.keyCode || e.which || e);
if (e === sequence[state] || e === sequence[(state = 0)]) {
// move next and peek
var action = sequence[++state];
// sequence complete when a function is reached
if (typeof action !== 'function') {
return;
}
// fire action
action();
// reset when sequence completed
state = 0;
}
};
};
/**
* Creates an event handler responding to the Konami Code.
* @param {function()} action completed sequence callback
* @return {function(Event)}
*/
Konami.code = function(action) {
return sequence(38, 38, 40, 40, 37, 39, 37, 39, 66, 65, action);
};
})(Konami, window);

209
src/vaporwave-fun.js Normal file
View File

@ -0,0 +1,209 @@
(function () {
var rAF_ID, rotologo, $window, space_phase_key_handler, player;
var vaporwave_active = false;
if (parent && frameElement && parent.$) {
$window = parent.$(frameElement).closest(".window");
} else {
$window = $();
}
var wait_for_youtube_api = function (callback) {
if (typeof YT !== "undefined") {
callback();
} else {
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// The YouTube API will call this global function when loaded and ready.
window.onYouTubeIframeAPIReady = function () {
callback();
};
}
};
var stop_vaporwave = function () {
vaporwave_active = false;
cancelAnimationFrame(rAF_ID);
$(rotologo).remove();
$window.css({transform: ""});
removeEventListener("keydown", space_phase_key_handler);
if (player) {
player.destroy();
player = null;
}
// vaporwave is dead. long live vaporwave.
// bepis pepsi isded pepsi isded
};
var start_vaporwave = function () {
vaporwave_active = true;
rotologo = document.createElement("img");
rotologo.classList.add("rotologo");
if (frameElement) {
frameElement.parentElement.appendChild(rotologo);
rotologo.src = "images/logo/98.js.org.svg";
} else {
document.body.appendChild(rotologo);
rotologo.src = "images/98.js.org.svg";
}
$(rotologo).css({
position: "absolute",
left: "50%",
top: "50%",
pointerEvents: "none",
transformOrigin: "0% 0%",
transition: "opacity 1s ease",
opacity: "0",
});
var animate = function () {
rAF_ID = requestAnimationFrame(animate);
$(rotologo).css({
transform:
`perspective(4000px) rotateY(${
Math.sin(Date.now() / 5000)
}turn) rotateX(${
0
}turn) translate(-50%, -50%) translateZ(500px)`,
filter:
`hue-rotate(${
Math.sin(Date.now() / 4000)
// TODO: slow down and stop when you pause
}turn)`,
});
if ($window.length) {
var el = $window[0];
var offsetLeft = 0;
var offsetTop = 0;
do {
offsetLeft += el.offsetLeft;
offsetTop += el.offsetTop;
el = el.offsetParent;
} while (el);
$window.css({
transform:
`perspective(4000px) rotateY(${
-(offsetLeft + ($window.outerWidth() - parent.innerWidth) / 2) / parent.innerWidth / 3
}turn) rotateX(${
(offsetTop + ($window.outerHeight() - parent.innerHeight) / 2) / parent.innerHeight / 3
}turn)`,
transformOrigin: "50% 50%",
transformStyle: "preserve-3d",
// FIXME: interactivity problems (with order elements are considered to have), I think related to preserve-3d
});
}
};
animate();
var player_placeholder = document.createElement("div");
document.querySelector(".canvas-area").appendChild(player_placeholder);
$(player_placeholder).css({
position: "absolute",
top: "3px", // TODO: dynamic
left: "3px",
mixBlendMode: "multiply",
pointerEvents: "none",
transition: "opacity 0.4s ease",
width: "100vw",
height: "100vh",
});
// NOTE: placeholder not a container; the YT API replaces the element passed in the DOM
// but keeps inline styles apparently, and maybe other things, I don't know; it's weird
wait_for_youtube_api(function () {
player = new YT.Player(player_placeholder, {
height: "390",
width: "640",
videoId: "8TvcyPCgKSU",
playerVars: {
autoplay: 1,
controls: 0,
},
events: {
onReady: onPlayerReady,
onStateChange: onPlayerStateChange,
},
});
// TODO: attribution for this video!
// I mean, you can see the title if you hit spacebar, but
// I could make it wave across the screen behind Paint on the desktop
// I could add a "Song Name?" button that responds "Darude Sandstorm"
// I could add a "Song At 420?" button that actually links to the video
// some number of those things or something like that
});
// The API will call this function when the video player is ready.
function onPlayerReady(event) {
player.playVideo();
player.unMute();
}
// The API calls this function when the player's state changes.
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING) {
// TODO: pause and resume this timer with the video
setTimeout(function(){
$(rotologo).css({opacity: 1});
}, 14150);
}
if (event.data == YT.PlayerState.ENDED) {
player.destroy();
player = null;
// TODO: fade to white instead of black, to work with the multiply effect
// or fade out opacity alternatively
// setTimeout/setInterval and check player.getCurrentTime() for when near the end?
// or we might switch to using soundcloud for the audio and so trigger it with that, with a separate video of just clouds
// also fade out the rotologo earlier
$(rotologo).css({opacity: 0});
// destroy rotologo once faded out
setTimeout(stop_vaporwave, 1200);
}
}
var is_theoretically_playing = true;
space_phase_key_handler = function (e) {
// press space to phase in and out of space phase スペース相 - windows 98 マイクロソフト 『WINTRAP』 X 将来のオペレーティングシステムサウンド 1998 VAPORWAVE
if (e.which === 32) {
// TODO: record player SFX
if (is_theoretically_playing) {
player.pauseVideo();
is_theoretically_playing = false;
$(player.getIframe())
.add(rotologo)
.css({opacity: "0"});
} else {
player.playVideo();
is_theoretically_playing = true;
$(player.getIframe())
.add(rotologo)
.css({opacity: ""});
}
e.preventDefault();
// player.getIframe().focus();
}
};
addEventListener("keydown", space_phase_key_handler);
};
var toggle_vaporwave = function () {
if (vaporwave_active) {
stop_vaporwave();
} else {
start_vaporwave();
}
};
addEventListener("keydown", Konami.code(toggle_vaporwave));
}());