API tools faq
paste
Guest User

Untitled

a guest
Jan 17th, 2020
167
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 24.38 KB | None | 0 0
raw download clone embed print report
  1. class Gfx {
  2.     constructor() {
  3.         this.canvas = document.getElementById("canvas");
  4.         this.gl = canvas.getContext("webgl");
  5.  
  6.         this.x_viewPos = 0;
  7.         this.y_viewPos = 0;
  8.         this.viewZoom = 1;
  9.         this.viewPosMoveRate = 1.5;
  10.  
  11.         this.tileWidth = Math.floor(32*this.viewZoom/2)*2;
  12.         this.tileHeight = Math.floor(32*this.viewZoom/2)*2;
  13.         this.tileBorderThickness = Math.floor(1*this.viewZoom);
  14.         this.bodyPadding = $('body').innerWidth()-$('body').width();
  15.  
  16.         this.redrawInterval = 0;
  17.         this.ticksUntilRedraw = this.redrawInterval;
  18.  
  19.         this.visibleSigFigs = 5;
  20.     }
  21.     init() {
  22.         //this.ctx.scale(this.viewZoom, this.viewZoom);
  23.         this.resizeCanvas(window.innerWidth, window.innerHeight);
  24.         //this.x_viewPos = Math.round(this.x_tilePosToPxPos(GLOBAL.map.worldWidth)/2 - this.canvas.width/2);
  25.         //this.y_viewPos = Math.round(this.y_tilePosToPxPos(GLOBAL.map.worldHeight)/2 - this.canvas.height/2);
  26.         this.x_viewPos = 0;
  27.         this.y_viewPos = 0;
  28.         $("#game-speed").html(GLOBAL.timing.gameSpeed);
  29.         this.updateGameInfoBox();
  30.  
  31.         const vsSource = `
  32.             attribute vec4 aVertPos;
  33.        
  34.             uniform mat4 uMVMat;
  35.             uniform mat4 uProjMat;
  36.        
  37.             void main() {
  38.                 gl_Position = uProjMat * uMVMat * aVertPos;
  39.             }
  40.         `;
  41.         const fsSource = `
  42.             precision mediump float;
  43.  
  44.             uniform vec2 uViewPos;
  45.             uniform vec2 uTileColorSampSize;
  46.             uniform sampler2D uTileColorSamp;
  47.            
  48.             void main() {
  49.                 const float lineThickness = (1.0/33.0);
  50.  
  51.                 //gridMult components will either be 0.0 or 1.0. This is used to place the grid lines
  52.                 vec2 gridMult = vec2(
  53.                     ceil(max(0.0, fract((gl_FragCoord.x-uViewPos.x)/33.0) - lineThickness)),
  54.                     ceil(max(0.0, fract((gl_FragCoord.y-uViewPos.y)/33.0) - lineThickness))
  55.                 );
  56.                 vec2 tileIndex = vec2(
  57.                     floor((gl_FragCoord.x-uViewPos.x)/33.0),
  58.                     floor((gl_FragCoord.y-uViewPos.y)/33.0)
  59.                 );
  60.  
  61.                 vec4 tileColor = texture2D(uTileColorSamp, vec2(
  62.                     (tileIndex.x+0.5)/uTileColorSampSize.x,
  63.                     (tileIndex.y+0.5)/uTileColorSampSize.y
  64.                 ));
  65.  
  66.                 gl_FragColor = vec4(
  67.                     tileColor.x * gridMult.x * gridMult.y,
  68.                     tileColor.y * gridMult.x * gridMult.y,
  69.                     tileColor.z * gridMult.x * gridMult.y,
  70.                     1.0
  71.                 );
  72.             }
  73.         `;
  74.         const shader = this.buildShader(vsSource, fsSource);
  75.         this.programInfo = {
  76.             program: shader,
  77.             attribLocs: {
  78.                 vertexPosition: this.gl.getAttribLocation(shader, 'aVertPos')
  79.             },
  80.             uniformLocs: {
  81.                 projMat: this.gl.getUniformLocation(shader, 'uProjMat'),
  82.                 MVMat: this.gl.getUniformLocation(shader, 'uMVMat'),
  83.                 viewPos: this.gl.getUniformLocation(shader, 'uViewPos'),
  84.                 tileColorSamp: this.gl.getUniformLocation(shader, 'uTileColorSamp'),
  85.                 tileColorSampSize: this.gl.getUniformLocation(shader, 'uTileColorSampSize')
  86.             }
  87.         };
  88.         const buffers = this.initBuffers();
  89.  
  90.         if (!this.gl.getExtension("OES_texture_float")) {
  91.             alert("Sorry, your browser/GPU/driver doesn't support floating point textures");
  92.         }
  93.  
  94.         this.gl.clearColor(0.0, 0.0, 0.15, 1.0);
  95.         this.gl.clearDepth(1.0);
  96.         this.gl.enable(this.gl.DEPTH_TEST);
  97.         this.gl.depthFunc(this.gl.LEQUAL);
  98.  
  99.         const FOV = 45 * Math.PI / 180;   // in radians
  100.         const aspect = this.gl.canvas.width / this.gl.canvas.height;
  101.         const zNear = 0.0;
  102.         const zFar = 100.0;
  103.         this.projMat = glMatrix.mat4.create();
  104.         glMatrix.mat4.perspective(this.projMat, FOV, aspect, zNear, zFar);
  105.         this.MVMat = glMatrix.mat4.create();
  106.         glMatrix.mat4.translate(this.MVMat, this.MVMat, [-0.0, -0.0, -1.0]);
  107.  
  108.         const numComponents = 2;  // pull out 2 values per iteration
  109.         const type = this.gl.FLOAT;    // the data in the buffer is 32bit floats
  110.         const normalize = false;  // don't normalize
  111.         const stride = 0;         // how many bytes to get from one set of values to the next
  112.                                     // 0 = use type and numComponents above
  113.         const offset = 0;         // how many bytes inside the buffer to start from
  114.         this.gl.bindBuffer(this.gl.ARRAY_BUFFER, buffers.position);
  115.         this.gl.vertexAttribPointer(
  116.             this.programInfo.attribLocs.vertPos,
  117.             numComponents,
  118.             type,
  119.             normalize,
  120.             stride,
  121.             offset
  122.         );
  123.         this.gl.enableVertexAttribArray(this.programInfo.attribLocs.vertPos);
  124.  
  125.         this.glDraw();
  126.     }
  127.     glDraw() {
  128.         this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT);
  129.         this.gl.useProgram(this.programInfo.program);
  130.  
  131.         let x_tileColorSampSize = Math.ceil(this.x_pxPosToTilePos(this.canvas.width))+2;
  132.         let y_tileColorSampSize = Math.ceil(this.y_pxPosToTilePos(this.canvas.height))+2;
  133.  
  134.         let colorArray = this.getTileColorArray();
  135.  
  136.         let colorTex = this.colorMapTexFromArray(
  137.             x_tileColorSampSize,
  138.             y_tileColorSampSize,
  139.             colorArray
  140.         );
  141.         let textureUnit = 3;  // from 0 to 15 is ok
  142.         this.gl.activeTexture(this.gl.TEXTURE0 + textureUnit);
  143.         this.gl.bindTexture(this.gl.TEXTURE_2D, colorTex);
  144.         this.gl.uniform1i(
  145.             this.programInfo.uniformLocs.tileColorSamp,
  146.             textureUnit
  147.         );
  148.         this.gl.uniform2fv(
  149.             this.programInfo.uniformLocs.tileColorSampSize,
  150.             [x_tileColorSampSize, y_tileColorSampSize]
  151.         );
  152.  
  153.         this.gl.uniformMatrix4fv(
  154.             this.programInfo.uniformLocs.projMat,
  155.             false,
  156.             this.projMat
  157.         );
  158.         this.gl.uniformMatrix4fv(
  159.             this.programInfo.uniformLocs.MVMat,
  160.             false,
  161.             this.MVMat
  162.         );
  163.         this.gl.uniform2fv(
  164.             this.programInfo.uniformLocs.viewPos,
  165.             [-this.x_viewPos, this.y_viewPos]
  166.         );
  167.  
  168.         const offset = 0;
  169.         const vertNum = 4;
  170.         this.gl.drawArrays(this.gl.TRIANGLE_STRIP, offset, vertNum);
  171.     }
  172.     colorMapTexFromArray(width, height, colorArray) {
  173.         let float32Arr = Float32Array.from(colorArray);
  174.         let oldActive = this.gl.getParameter(this.gl.ACTIVE_TEXTURE);
  175.         this.gl.activeTexture(this.gl.TEXTURE15);
  176.        
  177.         var texture = this.gl.createTexture();
  178.         this.gl.bindTexture(this.gl.TEXTURE_2D, texture);
  179.         this.gl.texImage2D(
  180.             this.gl.TEXTURE_2D, 0, this.gl.RGBA,
  181.             32, 16, 0,
  182.             this.gl.RGBA, this.gl.FLOAT, float32Arr
  183.         );
  184.  
  185.         this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MAG_FILTER, this.gl.NEAREST);
  186.         this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MIN_FILTER, this.gl.NEAREST);
  187.         this.gl.bindTexture(this.gl.TEXTURE_2D, null);
  188.        
  189.         this.gl.activeTexture(oldActive);
  190.        
  191.         return texture;
  192.     }
  193.     initBuffers() {
  194.         const posBuff = this.gl.createBuffer();
  195.         this.gl.bindBuffer(this.gl.ARRAY_BUFFER, posBuff);
  196.         const positions = [
  197.             -1.0,  1.0,
  198.              1.0,  1.0,
  199.             -1.0, -1.0,
  200.              1.0, -1.0,
  201.         ];
  202.         this.gl.bufferData(
  203.             this.gl.ARRAY_BUFFER,
  204.             new Float32Array(positions),
  205.             this.gl.STATIC_DRAW
  206.         );
  207.         return {
  208.             position: posBuff
  209.         };
  210.     }
  211.     buildShader(vsSource, fsSource) {
  212.         const vertShader = this.loadShader(this.gl.VERTEX_SHADER, vsSource);
  213.         const fragShader = this.loadShader(this.gl.FRAGMENT_SHADER, fsSource);
  214.  
  215.         const filter = this.gl.createProgram();
  216.         this.gl.attachShader(filter, vertShader);
  217.         this.gl.attachShader(filter, fragShader);
  218.         this.gl.linkProgram(filter);
  219.  
  220.         if (!this.gl.getProgramParameter(filter, this.gl.LINK_STATUS)) {
  221.             console.error('Unable to initialize the shader program: ' + gl.getProgramInfoLog(filter));
  222.             return null;
  223.         }
  224.  
  225.         return filter;
  226.     }
  227.     loadShader(type, source) {
  228.         const shader = this.gl.createShader(type);      
  229.         this.gl.shaderSource(shader, source);
  230.         this.gl.compileShader(shader);
  231.      
  232.         if (!this.gl.getShaderParameter(shader, this.gl.COMPILE_STATUS)) {
  233.             console.error('An error occurred compiling the shaders: ' + this.gl.getShaderInfoLog(shader));
  234.             this.gl.deleteShader(shader);
  235.             return null;
  236.         }
  237.         return shader;
  238.     }
  239.  
  240.  
  241.     drawCanvas() {
  242.         //this.ctx.setTransform(1,0,0,1,0,0);
  243.         //this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
  244.         //this.ctx.translate(-this.x_viewPos, -this.y_viewPos);
  245.         //this.drawGrid();
  246.         this.glDraw();
  247.     }
  248.     getTileColorArray() {
  249.         let i_min = Math.max(0, Math.floor(this.x_pxPosToTilePos(this.x_viewPos)));
  250.         let i_max = Math.min(GLOBAL.map.worldWidth-1, i_min + Math.ceil(this.x_pxPosToTilePos(this.canvas.width)) + 1);
  251.         let j_min = Math.max(0, Math.floor(this.y_pxPosToTilePos(this.y_viewPos)));
  252.         let j_max = Math.min(GLOBAL.map.worldHeight-1, j_min + Math.ceil(this.y_pxPosToTilePos(this.canvas.height)) + 1);
  253.  
  254.         let colorArray = [];
  255.         for (let i=i_min; i <= i_max; i++) {
  256.             for (let j=j_min; j <= j_max; j++) {
  257.                 colorArray = colorArray.concat(GLOBAL.map.tileGrid[i][j].color);
  258.             }
  259.         }
  260.         return colorArray;
  261.     }
  262.  
  263.  
  264.  
  265.  
  266.  
  267.  
  268.  
  269.  
  270.  
  271.  
  272.  
  273.  
  274.  
  275.  
  276.  
  277.  
  278.  
  279.  
  280.  
  281.  
  282.  
  283.  
  284.  
  285.  
  286.  
  287.  
  288.  
  289.  
  290.  
  291.  
  292.  
  293.  
  294.  
  295.  
  296.     zoomIn() {
  297.         if (this.viewZoom < 1) {
  298.             this.viewZoom *= 2;
  299.             this.tileWidth = Math.floor(32*this.viewZoom/2)*2;
  300.             this.tileHeight = Math.floor(32*this.viewZoom/2)*2;
  301.             this.tileBorderThickness = Math.floor(1*this.viewZoom);
  302.             this.ctx.scale(this.viewZoom, this.viewZoom);
  303.             this.moveView(0,0);
  304.             this.drawCanvas();
  305.             if (this.viewZoom >= 1) {
  306.                 this.alterInterface(
  307.                     ["#zoom-in-button"], //disable
  308.                     ["#zoom-out-button"] //enable
  309.                 );
  310.             } else {
  311.                 this.alterInterface(
  312.                     [], //disable
  313.                     ["#zoom-out-button"] //enable
  314.                 );
  315.             }
  316.         }
  317.     }
  318.     zoomOut() {
  319.         if (this.tileWidth/2 >= 2 && this.tileHeight/2 >= 2) {
  320.             this.viewZoom /= 2;
  321.             this.ctx.scale(this.viewZoom, this.viewZoom);
  322.             this.tileWidth = Math.floor(32*this.viewZoom/2)*2;
  323.             this.tileHeight = Math.floor(32*this.viewZoom/2)*2;
  324.             this.tileBorderThickness = Math.floor(1*this.viewZoom);
  325.             this.resizeCanvas(window.innerWidth, window.innerHeight);
  326.             this.moveView(-this.canvas.width, -this.canvas.height);
  327.             this.drawCanvas();
  328.             if (this.tileWidth/2 < 2 || this.tileHeight/2 < 2) {
  329.                 this.alterInterface(
  330.                     ["#zoom-out-button"], //disable
  331.                     ["#zoom-in-button"] //enable
  332.                 );
  333.             } else {
  334.                 this.alterInterface(
  335.                     [], //disable
  336.                     ["#zoom-in-button"] //enable
  337.                 );
  338.             }
  339.         }
  340.     }
  341.     resizeCanvas(baseWidth, baseHeight) {
  342.         let widthMod = 0;
  343.         let heightMod = 0;
  344.        
  345.         widthMod -= $("#control-panel").outerWidth();
  346.         widthMod -= $("#info-panel").outerWidth();
  347.         widthMod -= this.bodyPadding;
  348.         widthMod -= $('#canvas').outerWidth() - $('#canvas').width();
  349.         heightMod -= this.bodyPadding;
  350.         heightMod -= $('#canvas').outerHeight() - $('#canvas').height();
  351.         this.canvas.width = baseWidth + widthMod;
  352.         this.canvas.height = baseHeight + heightMod;
  353.         this.gl.viewport(0, 0, this.gl.canvas.width, this.gl.canvas.height);
  354.     }
  355.     moveView(x_delta, y_delta) {
  356.         let worldWidthPx = this.x_tilePosToPxPos(GLOBAL.map.worldWidth);
  357.         let worldHeightPx = this.y_tilePosToPxPos(GLOBAL.map.worldHeight);
  358.  
  359.         if (worldWidthPx >= this.canvas.width) {
  360.             this.x_viewPos -= Math.round(x_delta);
  361.             this.x_viewPos = Math.max(this.x_viewPos, 0);
  362.             this.x_viewPos = Math.min(this.x_viewPos, worldWidthPx-this.canvas.width);
  363.         } else {
  364.             this.x_viewPos = Math.round(-(this.canvas.width-worldWidthPx)/2);
  365.         }
  366.         if (worldHeightPx >= this.canvas.height) {
  367.             this.y_viewPos -= Math.round(y_delta);
  368.             this.y_viewPos = Math.max(this.y_viewPos, 0);
  369.             this.y_viewPos = Math.min(this.y_viewPos, worldHeightPx-this.canvas.height);
  370.         } else {
  371.             this.y_viewPos = Math.round(-(this.canvas.height-worldHeightPx)/2);
  372.         }
  373.         this.drawCanvas();
  374.     }
  375.  
  376.  
  377.  
  378.  
  379.  
  380.  
  381.     drawTile(x, y) {
  382.         let tile = GLOBAL.map.tileGrid[x][y];
  383.         let color = tile.color;
  384.         let gosperIndex = tile.gosperIndex;
  385.         let isSelected = false;
  386.         let x_tileBasePos = this.tileBorderThickness+(x*(this.tileWidth+this.tileBorderThickness));
  387.         let y_tileBasePos = this.tileBorderThickness+(y*(this.tileHeight+this.tileBorderThickness));
  388.  
  389.         if (GLOBAL.map.tileSelected) {
  390.             if (GLOBAL.map.tileSelected.x === x && GLOBAL.map.tileSelected.y === y) {
  391.                 isSelected = true;
  392.                 this.ctx.fillStyle = "yellow";
  393.                 this.ctx.fillRect(
  394.                     x_tileBasePos-this.tileBorderThickness,
  395.                     y_tileBasePos-this.tileBorderThickness,
  396.                     this.tileWidth+2,
  397.                     this.tileHeight+2
  398.                 );
  399.             }
  400.         } else if (GLOBAL.map.gosperSelected) {
  401.             if (GLOBAL.map.gosperSelected.x === x && GLOBAL.map.gosperSelected.y === y) {
  402.                 isSelected = true;
  403.                 this.ctx.fillStyle = "cyan";
  404.                 this.ctx.fillRect(
  405.                     x_tileBasePos-this.tileBorderThickness,
  406.                     y_tileBasePos-this.tileBorderThickness,
  407.                     this.tileWidth+2,
  408.                     this.tileHeight+2
  409.                 );
  410.             }
  411.         }
  412.        
  413.         this.ctx.fillStyle = color;
  414.         this.ctx.fillRect(
  415.             x_tileBasePos+isSelected,
  416.             y_tileBasePos+isSelected,
  417.             this.tileWidth-(isSelected*2),
  418.             this.tileHeight-(isSelected*2)
  419.         );
  420.  
  421.         if (gosperIndex !== null) {
  422.             let gosper = GLOBAL.map.gosperList[gosperIndex];
  423.             if (this.viewZoom >= 0.5) {
  424.                 let borderRed = 255;
  425.                 let borderBlue = 255;
  426.                 let borderGreen = 255;
  427.                 if (gosper.age <= gosper.minReproductiveAge) {
  428.                     borderRed = 255/gosper.minReproductiveAge*gosper.age;
  429.                     borderBlue = 255/gosper.minReproductiveAge*gosper.age;
  430.                 } else if (gosper.age >= gosper.maxReproductiveAge) {
  431.                     borderRed = 255*(gosper.maxAge-gosper.age)/(gosper.maxAge-gosper.maxReproductiveAge);
  432.                     borderGreen = 255*(gosper.maxAge-gosper.age)/(gosper.maxAge-gosper.maxReproductiveAge);
  433.                 }
  434.  
  435.                 if (gosper.energy <= gosper.maxEnergy * 0.2) {
  436.                     borderRed = Math.max(0, borderRed - 255*(1-(gosper.energy/(gosper.maxEnergy*0.2))));
  437.                     borderBlue = Math.max(0, borderBlue - 255*(1-(gosper.energy/(gosper.maxEnergy*0.2))));
  438.                     borderGreen = Math.max(0, borderGreen - 255*(1-(gosper.energy/(gosper.maxEnergy*0.2))));
  439.                 }
  440.  
  441.                 this.ctx.fillStyle = this.rgbToHex(borderRed, borderGreen, borderBlue);
  442.                 this.ctx.fillRect(
  443.                     x_tileBasePos+Math.floor(this.viewZoom*4),
  444.                     y_tileBasePos+Math.floor(this.viewZoom*4),
  445.                     this.tileWidth-Math.floor(this.viewZoom*8),
  446.                     this.tileHeight-Math.floor(this.viewZoom*8)
  447.                 );
  448.                 this.ctx.fillStyle = this.rgbToHex(gosper.color[0], gosper.color[1], gosper.color[2]);
  449.                 this.ctx.fillRect(
  450.                     x_tileBasePos+Math.floor(this.viewZoom*6),
  451.                     y_tileBasePos+Math.floor(this.viewZoom*6),
  452.                     this.tileWidth-Math.floor(this.viewZoom*12),
  453.                     this.tileHeight-Math.floor(this.viewZoom*12)
  454.                 );
  455.                 if (gosper.action === "move") {
  456.                     this.ctx.fillStyle = "white";
  457.                     this.ctx.fillRect(
  458.                         x_tileBasePos+Math.floor(this.viewZoom*14),
  459.                         y_tileBasePos+Math.floor(this.viewZoom*14),
  460.                         this.tileWidth-Math.floor(this.viewZoom*28),
  461.                         this.tileHeight-Math.floor(this.viewZoom*28)
  462.                     );
  463.                 } else if (gosper.action === "bud") {
  464.                     this.ctx.fillStyle = "black";
  465.                     this.ctx.fillRect(
  466.                         x_tileBasePos+Math.floor(this.viewZoom*14),
  467.                         y_tileBasePos+Math.floor(this.viewZoom*14),
  468.                         this.tileWidth-Math.floor(this.viewZoom*28),
  469.                         this.tileHeight-Math.floor(this.viewZoom*28)
  470.                     );
  471.                 }
  472.             } else {
  473.                 this.ctx.fillStyle = "white";
  474.                 this.ctx.fillRect(
  475.                     x_tileBasePos,
  476.                     y_tileBasePos,
  477.                     this.tileWidth,
  478.                     this.tileHeight
  479.                 );
  480.                 this.ctx.fillStyle = this.rgbToHex(gosper.color[0], gosper.color[1], gosper.color[2]);
  481.                 this.ctx.fillRect(
  482.                     x_tileBasePos+1,
  483.                     y_tileBasePos+1,
  484.                     this.tileWidth-2,
  485.                     this.tileHeight-2
  486.                 );
  487.             }
  488.         }
  489.     }
  490.     updateCanvas(tickDelta) {
  491.         this.ticksUntilRedraw -= tickDelta;
  492.         if (this.ticksUntilRedraw <= 0) {
  493.             this.ticksUntilRedraw = this.redrawInterval;
  494.             this.drawCanvas();
  495.         }
  496.     }
  497.     selectEntity(x_screnPos, y_screenPos) {
  498.         let x = x_screnPos - this.bodyPadding - 174 + this.x_viewPos;
  499.         let y = y_screenPos - this.bodyPadding + this.y_viewPos;
  500.         let x_tilePos = this.x_pxPosToTilePos(x);
  501.         let y_tilePos = this.y_pxPosToTilePos(y);
  502.         let tile = GLOBAL.map.tileGrid[x_tilePos][y_tilePos];
  503.         let gosperIndex = tile.gosperIndex;
  504.         let gosper = GLOBAL.map.gosperList[gosperIndex];
  505.  
  506.         if (GLOBAL.input.selectType === "tile") {
  507.             this.setTileInfo(tile);
  508.         } else {
  509.             this.setGosperInfo(gosper);
  510.         }
  511.     }
  512.     setTileInfo(tile) {
  513.         let gosper = GLOBAL.map.gosperList[tile.gosperIndex];
  514.         GLOBAL.map.tileSelected = tile;
  515.         GLOBAL.map.gosperSelected = null;
  516.  
  517.         $("#tile-difficulty").html(tile.difficulty.toFixed(this.visibleSigFigs));
  518.         $("#tile-advantage").html(tile.advantage.toFixed(this.visibleSigFigs));
  519.         $("#tile-light").html(tile.light.toFixed(this.visibleSigFigs));
  520.         if (gosper) {
  521.             $("#tile-gosper").html(gosper.name);
  522.         } else {
  523.             $("#tile-gosper").html("");
  524.         }
  525.         $("#tilex").html(tile.x);
  526.         $("#tiley").html(tile.y);
  527.         this.drawCanvas();
  528.     }
  529.  
  530.     setGosperInfo(gosper) {
  531.         if (gosper) {
  532.             GLOBAL.map.gosperSelected = gosper;
  533.             GLOBAL.map.tileSelected = null;
  534.  
  535.             $("#gosper-name").html(gosper.name);
  536.             $("#gosper-action").html(gosper.action);
  537.             $("#gosper-action-progress").html(gosper.actionProgress.toFixed(this.visibleSigFigs));
  538.             $("#gosper-alive").html(gosper.isAlive);
  539.             $("#gosper-photosynth").html(gosper.photoSynth.toFixed(this.visibleSigFigs));
  540.             $("#gosper-energy").html(gosper.energy.toFixed(this.visibleSigFigs));
  541.             $("#gosper-max-energy").html(gosper.maxEnergy.toFixed(this.visibleSigFigs));
  542.             $("#gosper-age").html(gosper.age.toFixed(this.visibleSigFigs));
  543.             $("#gosper-max-age").html(gosper.maxAge.toFixed(this.visibleSigFigs));
  544.             $("#gosper-light-pref").html(gosper.lightPref.toFixed(this.visibleSigFigs));
  545.             $("#gosper-advantage-pref").html(gosper.advantagePref.toFixed(this.visibleSigFigs));
  546.             $("#gosper-difficulty-pref").html(gosper.difficultyPref.toFixed(this.visibleSigFigs));
  547.             $("#gosper-move-freq").html(gosper.moveFreq.toFixed(this.visibleSigFigs));
  548.             $("#gosper-bud-freq").html(gosper.budFreq.toFixed(this.visibleSigFigs));
  549.             $("#gosper-min-bud-age").html(gosper.minBudAge.toFixed(this.visibleSigFigs));
  550.             $("#gosper-max-bud-age").html(gosper.maxBudAge.toFixed(this.visibleSigFigs));
  551.             $("#gosper-move-speed").html(gosper.moveSpeed.toFixed(this.visibleSigFigs));
  552.             $("#gosper-bud-speed").html(gosper.budSpeed.toFixed(this.visibleSigFigs));
  553.             this.drawCanvas();
  554.         }
  555.     }
  556.     alterInterface(selectArray=[], enableArray=[], hideArray=[], unhideArray=[], clearArray=[]) {
  557.         for (let i=0; i<selectArray.length; i++) {
  558.             $(selectArray[i]).removeClass("enabled-button");
  559.             $(selectArray[i]).addClass("disabled-button");
  560.         }
  561.         for (let i=0; i<enableArray.length; i++) {
  562.             $(enableArray[i]).removeClass("disabled-button");
  563.             $(enableArray[i]).addClass("enabled-button");
  564.         }
  565.         for (let i=0; i<hideArray.length; i++) {
  566.             $(hideArray[i]).addClass("hidden");
  567.         }
  568.         for (let i=0; i<unhideArray.length; i++) {
  569.             $(unhideArray[i]).removeClass("hidden");
  570.         }
  571.         for (let i=0; i<clearArray.length; i++) {
  572.             $(clearArray[i]).html("");
  573.         }
  574.     }
  575.     updateGameInfoBox() {
  576.         $("#game-fps").html(GLOBAL.timing.fps.toFixed(this.visibleSigFigs));
  577.         $("#game-total-gospers").html(GLOBAL.map.totalGosperCount);
  578.         $("#game-live-gospers").html(GLOBAL.map.liveGosperCount);
  579.         $("#game-longest-lineage").html(GLOBAL.map.longestLineage);
  580.         setTimeout(this.updateGameInfoBox.bind(this), 500);
  581.     }
  582.     x_tilePosToPxPos(x_tilePos) {
  583.         return Math.max(0, x_tilePos*(this.tileWidth+(this.tileBorderThickness))+this.tileBorderThickness);
  584.     }
  585.     y_tilePosToPxPos(y_tilePos) {
  586.         return Math.max(0, y_tilePos*(this.tileHeight+(this.tileBorderThickness))+this.tileBorderThickness);
  587.     }
  588.     x_pxPosToTilePos(x_pxPos) {
  589.         return Math.max(0, Math.floor((x_pxPos-this.tileBorderThickness)/(this.tileWidth+this.tileBorderThickness)));
  590.     }
  591.     y_pxPosToTilePos(y_pxPos) {
  592.         return Math.max(0, Math.floor((y_pxPos-this.tileBorderThickness)/(this.tileHeight+this.tileBorderThickness)));
  593.     }
  594.     hslToHex(h, s, l) {
  595.         let rgb = this.hslToRgb(h, s, l);
  596.         return this.rgbToHex(
  597.             Math.round(rgb[0]*255),
  598.             Math.round(rgb[1]*255),
  599.             Math.round(rgb[2]*255)
  600.         );
  601.     }
  602.     hslToRgb(h, s, l, a=1.0) {
  603.         let r, g, b;
  604.         if(s == 0){
  605.             r = g = b = l; // achromatic
  606.         }else{
  607.             let hue2rgb = (p, q, t) => {
  608.                 if(t < 0) t += 1;
  609.                 if(t > 1) t -= 1;
  610.                 if(t < 1/6) return p + (q - p) * 6 * t;
  611.                 if(t < 1/2) return q;
  612.                 if(t < 2/3) return p + (q - p) * (2/3 - t) * 6;
  613.                 return p;
  614.             }
  615.             let q = l < 0.5 ? l * (1 + s) : l + s - l * s;
  616.             let p = 2 * l - q;
  617.             r = hue2rgb(p, q, h + 1/3);
  618.             g = hue2rgb(p, q, h);
  619.             b = hue2rgb(p, q, h - 1/3);
  620.         }
  621.         return [r, g, b, a];
  622.     }
  623.     rgbToHex(r, g, b) {
  624.         let componentToHex = (c) => {
  625.             var hex = Math.floor(c).toString(16);
  626.             return hex.length == 1 ? "0" + hex : hex;
  627.         }
  628.         return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
  629.     }
  630. }
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!