JSFiddle - React, Tailwind, and code Playground
by TeslaNick
HTML
<canvas id="f"></canvas>JavaScript
var __extends=this.__extends||function(a,b){function c(){this.constructor=a}c.prototype=b.prototype,a.prototype=new c},Viewport;(function(a){function b(a){var b=a.charCodeAt(0),c=32,d;return b>64&&b<91?d=b-65-c:b>96&&b<123?d=b-71-c:b>47&&b<58?d=b+4-c:d=b+19-c,d}function c(a){var c=[],d=a.split(":");return d.forEach(function(a){var d,e=[];for(d=0;d<a.length;d+=2)e.push([b(a[d]),b(a[d+1])]);c.push(e)}),c}function d(a,b){for(var c=0,d=b.length;c<d;c+=1)typeof a[b[c]]!="undefined"&&(this[b[c]]=a[b[c]])}var e=function(){function a(){}return a}(),f=function(){function a(){this.keyframes=null,this.points=null,this.scale=1,this.keyframes=new j}return a.prototype._drawControlPoints=function(a,b){var c=this.keyframes._getKeyframes(a),d=function(a){if(!a)return;var c=a.vector.apply(200);b.strokeStyle="green",b.beginPath(),b.moveTo(a.vector.x,a.vector.y),b.lineTo(c.x,c.y),b.stroke(),b.fillStyle="red",b.fillRect(a.vector.x-2,a.vector.y-2,4,4)};d(c[0]),d(c[1])},a.prototype.draw=function(a,b){var c=this.keyframes.location(a),d=this.keyframes._getKeyframes(a),e=this.points,f=this.scale,g,h,i,j,k;this._drawControlPoints(a,b),b.save(),b.translate(c.x,c.y),b.rotate(c.r),b.strokeStyle="#fff";if(e)for(h=0,j=e.length;h<j;h+=1){b.beginPath(),b.moveTo(e[h][0][0]*f,e[h][0][1]*f);for(g=1,i=e[h].length;g<i;g+=1)b.lineTo(e[h][g][0]*f,e[h][g][1]*f);b.closePath(),b.stroke()}b.restore()},a}();a.Mover=f;var g=function(a){function b(){a.apply(this,arguments),this.points=c("gWYlZonool:eiiijggbdg")}return __extends(b,a),b}(f);a.Ship=g;var h=function(){function a(a){this.x=0,this.y=0,this.r=0,d.call(this,a,["x","y","r"])}return a}();a.Location=h;var i=function(a){function b(b){a.call(this,b),this.dx=0,this.dy=0,this.dr=0,d.call(this,b,["dx","dy","dr"])}return __extends(b,a),b.prototype.apply=function(a){return new b({x:this.x+this.dx*a,y:this.y+this.dy*a,r:this.r+this.dr*a,dx:this.dx,dy:this.dy,dr:this.dr})},b}(h);a.Vector=i;var j=function(){function a(){this.keyframes=[]}return...