Suggestion for Reduce food glow ? #236

[pllsner]

// Modify the redraw()-function to replace  b.globalCompositeOperation = "lighter"; to "hard-light".
var original_redraw = window.redraw.toString();
var new_redraw = original_redraw.replace('b.globalCompositeOperation = "lighter";', 'b.globalCompositeOperation = "hard-light";');
window.redraw = new Function(new_redraw.substring(new_redraw.indexOf('{')+1,new_redraw.lastIndexOf('}')));

I tried inserting this into var userInterface = window.userInterface = (function() in the bot version 1.2.9, but i get a black screen. (not sure where it should go) Replacing lighter to hard-light with resource-override #274 takes away all the annoying glow. One of you javascript savvy guys could tweak this to get it working..

https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation has a great write-up on all the rendering options.

original game with lighter composition zoomed way out.. game with hard-light composition.

[ermiyaeskandary]

@pllsner Great find! Is this in the slither.io-code ? If so, can you comment where ?

[ermiyaeskandary]

Linked to #236

[tjorim]

Wow, great finding @pllsner ! Check this branch: https://github.com/ErmiyaEskandary/Slither.io-bot/tree/custom_oef

[pllsner]

starting at line 2555 of [http://slither.io/s/game9c8ns.js] there are 10 references to lighter. i opened up developer tools in chrome. hit the {} to pretty the code, and starting from 2555 to 3244 is all the b.globalCompositeOperation = "lighter";. some functions are to color the snakes, and others are to color the prey and food. Thanks for the link i shall check it out. Glad i could help out. :) Also..........this is the food drawing function in the game script. line 1835 'for (j = 2.8; 18.8 >= j; j += 1) { var cc = document.createElement("canvas") , sz = Math.ceil(2.5 * j + 28); cc.width = cc.height = sz; <---- controls how big the food is on the screen ctx = cc.getContext("2d"); ctx.fillStyle = o.cs; ctx.arc(sz / 2, sz / 2, .65 * j, 0, pi2); ctx.shadowBlur = 12; <---------increases the blur diameter 3 or 4 times larger than the food dot.. ctx.shadowOffsetY = 0; ctx.shadowColor = "#" + rs + gs + bs; ctx.globalAlpha = .8; <------- reduces the intensity of the color ctx.fill(); ctx.globalAlpha = 1;' i removed the ctx.shadowBlur =12; and replace the globalAlpha = .8; to a '1' just for fun i replaced the ctx.arc function and drew stars. i replaced the prey dot with a pacman . :) prey drawing function. line 1896 'for (j = 3; 24 >= j; j += 1) cc = document.createElement("canvas"), sz = Math.ceil(2 * j + 38), cc.width = cc.height = sz, ctx = cc.getContext("2d"), ctx.fillStyle = o.cs, ctx.arc(sz / 2, sz / 2, j / 2, 0, pi2), ctx.shadowBlur = 22, ctx.shadowOffsetY = 0, ctx.shadowColor = "#" + rs + gs + bs, ctx.fill(), ctx.fill(), o.pr_imgs.push(cc), o.pr_fws.push(sz), o.pr_fhs.push(sz), o.pr_fw2s.push(sz / 2), o.pr_fh2s.push(sz / 2) '

[pllsner]

star and pacman i put into the script instead of ctx.arc function... '// 5 pointed star ctx.beginPath(); var starx= sz/2; var stary= sz/2; var starsize = j * 1.5; var M_PI = Math.PI; ctx.lineTo(starx, stary - starsize, starx + starsize * Math.sin(M_PI/5), stary + starsize * Math.cos(M_PI/5)); ctx.lineTo(starx + starsize * Math.sin(M_PI/5), stary + starsize * Math.cos(M_PI/5),starx - starsize * Math.cos(M_PI/10), stary - starsize * Math.sin(M_PI/10)); ctx.lineTo(starx - starsize * Math.cos(M_PI/10), stary - starsize * Math.sin(M_PI/10),starx + starsize * Math.cos(M_PI/10), stary - starsize * Math.sin(M_PI/10)); ctx.lineTo(starx + starsize * Math.cos(M_PI/10), stary - starsize * Math.sin(M_PI/10),starx - starsize * Math.sin(M_PI/5), stary + starsize * Math.cos(M_PI/5)); ctx.lineTo(starx - starsize * Math.sin(M_PI/5), stary + starsize * Math.cos(M_PI/5),starx, stary - starsize); ctx.closePath(); // end of 5 ponted star

// pacman
ctx.beginPath(); ctx.arc(sz / 2, sz / 2, j / 3,Math.PI/7,-Math.PI/7,false); ctx.lineTo(sz / 2-(j / 3)+2, sz / 2); ctx.fill(); // end of pacman

// pacman ghost var srx = (sz /2)-7; var sry = (sz/2)+7; ctx.beginPath(); ctx.moveTo(srx,sry); ctx.lineTo(srx,sry-6); ctx.bezierCurveTo(srx,sry-11,srx+2.5,sry-14,srx+7,sry-14); ctx.bezierCurveTo(srx+11,sry-14,srx+14,sry-11,srx+14,sry-7); ctx.lineTo(srx+14,sry); ctx.lineTo(srx+11.5,sry-2.5); ctx.lineTo(srx+9,sry); ctx.lineTo(srx+7,sry-2.5); ctx.lineTo(srx+4.5,sry); ctx.lineTo(srx+2,sry-2.5); ctx.lineTo(srx,sry); ctx.fill(); // draw the eyes ctx.fillStyle = "white"; ctx.beginPath(); ctx.moveTo(srx+4,sry-10); ctx.bezierCurveTo(srx+2.5,sry-10,srx+2,sry-8.5,srx+2,sry-7.5); ctx.bezierCurveTo(srx+2,sry-6.5,srx+2.5,sry-5,srx+4,sry-5); ctx.bezierCurveTo(srx+4.5,sry-5,srx+6,sry-6.5,srx+6,sry-7.5); ctx.bezierCurveTo(srx+6,sry-8.5,srx+6.5,sry-10,srx+4,sry-10); ctx.moveTo(srx+10,sry-10); ctx.bezierCurveTo(srx+8.5,sry-10,srx+8,sry-8.5,srx+8,sry-7.5); ctx.bezierCurveTo(srx+8,sry-6.5,srx+8.2,sry-5,srx+10,sry-5); ctx.bezierCurveTo(srx+11.5,sry-5,srx+12,sry-6.5,srx+12,sry-7.5); ctx.bezierCurveTo(srx+12,sry-8.5,srx+11.5,sry-10,srx+10,sry-10); ctx.fill(); // draw the pupils ctx.fillStyle = "black"; ctx.beginPath(); ctx.arc(srx+9,sry-7,2,0,Math.PI_2,true); ctx.fill(); ctx.beginPath(); ctx.arc(srx+3,sry-7,2,0,Math.PI_2,true); ctx.fill(); // end of pacman ghost '

[pllsner]

@tjorim thanks for implementing this so quickly. but i think you have the search and replace backwards. typo correction new_redraw_string = new_redraw_string.replace(/b.globalCompositeOperation="hard-light"/gi, 'b.globalCompositeOperation="lighter"'); should read... new_redraw_string = new_redraw_string.replace(/b.globalCompositeOperation="lighter"/gi, 'b.globalCompositeOperation="hard-light"');

then the bot script will reduce the intensity of all the overlapping dots being turned into white glow. if you replace all the ctx.shadowBlur = ?? (whatever number) with a 0, or just remove shadowBlur, game will not have any blurring globally.

[tjorim]

@pllsner Thanks for the heads-up! I appreciate your help :+1:

[pllsner]

you are very welcome @tjorim. Thank you

[ChadSki]

Fixed in #311.