Skip to content

Instantly share code, notes, and snippets.

@nabbynz

nabbynz/Preset_Mods.user.js

Last active April 5, 2023 21:47
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nabbynz/24c9c965b93e9f12660436d26c6e4ac1 to your computer and use it in GitHub Desktop.
Save nabbynz/24c9c965b93e9f12660436d26c6e4ac1 to your computer and use it in GitHub Desktop.
Download ZIP
TagPro Preset Mods
Raw
Preset_Mods.user.js
// ==UserScript==
// @name Preset Texture Mods
// @description Apply preset mods to your texture pack. Chromium based browsers work best.
// @version 0.0.15
// @match https://*.koalabeast.com/textures*
// @match https://*.koalabeast.com/game
// @match https://*.koalabeast.com/game?*
// @match http://localhost:3001/textures*
// @match http://localhost:3001/game
// @match http://localhost:3001/game?*
// @match https://bash-tp.github.io/tagpro-vcr/game*.html
// @updateURL https://gist.github.com/nabbynz/24c9c965b93e9f12660436d26c6e4ac1/raw/Preset_Mods.user.js
// @downloadURL https://gist.github.com/nabbynz/24c9c965b93e9f12660436d26c6e4ac1/raw/Preset_Mods.user.js
// @grant GM_getValue
// @grant GM_setValue
// @grant GM_deleteValue
// @grant GM_addStyle
// @grant GM_setClipboard
// @author nabby
// ==/UserScript==
/* eslint-env jquery */
/* globals tagpro, tagproConfig, PIXI, tinycolor */
/* eslint-disable no-multi-spaces */
/* eslint-disable dot-notation */
'use strict';
console.log('START: ' + GM_info.script.name + ' (v' + GM_info.script.version + ' by ' + GM_info.script.author + ')');
//GM_deleteValue('preset');
tagpro.ready(function() {
let defaultOptions = { //all these values get updated/overwritten by the script
preset: 'value-none',
background: 'value-none',
background_angle: '90',
background_color1: '#aaaaaa',
background_color2: '#000000',
background_color3: 'auto',
background_color4: 'auto',
background_color5: 'auto',
background_size1: '0',
background_size2: '100',
background_size3: '0',
background_size4: '0',
background_size5: '0',
background_url: '',
vpcss_border_size: '0',
vpcss_border_color: '#cccccc',
vpcss_border_dashed: false,
vpcss_radius_border: '0',
vpcss_shadow1_size: '0', //spread
vpcss_shadow1_color: '#000000',
vpcss_shadow1_blur: '0',
vpcss_shadow1_xoffset: '0',
vpcss_shadow1_yoffset: '0',
vpcss_shadow1_inset: false,
vpcss_shadow2_size: '0', //spread
vpcss_shadow2_color: '#ffffff',
vpcss_shadow2_blur: '0',
vpcss_shadow2_xoffset: '0',
vpcss_shadow2_yoffset: '0',
vpcss_shadow2_inset: false,
vpcss_padding_x: '0',
vpcss_padding_y: '0',
vpcss_only_apply_in_game: true,
plainfloor: false,
plainfloor_color_use: false,
plainfloor_color: '#e0e0e0',
floortile_opacity: '1',
grid1_size: '0',
grid1_length: '40',
grid1_width: '1',
grid1_color: 'auto',
grid1_opacity: '0.2',
grid1_square: false,
grid1_rectangles: false,
grid1_lines: false,
grid1_diagonal: false,
grid1_crosses: false,
grid1_shadow: '',
grid1_gco: 'source-over',
grid2_size: '0',
grid2_length: '40',
grid2_width: '1',
grid2_color: 'auto',
grid2_opacity: '0.2',
grid2_square: false,
grid2_rectangles: false,
grid2_lines: false,
grid2_diagonal: false,
grid2_crosses: false,
grid2_shadow: '',
grid2_applytexture3togrid2: false,
hexagon_size: '0',
hexagon_margin: '5',
hexagon_stroke: true,
hexagon_stroke_linewidth: '2',
hexagon_stroke_color: 'auto',
hexagon_stroke_opacity: '1',
hexagon_fill: false,
hexagon_fill_color: '#000000',
hexagon_fill_opacity: '0.2',
hexagon_destination_out: false,
floor_filter: '',
checker1_size: '0',
checker1_margin: '0',
checker1_color: '#000000',
checker1_opacity_min: '0',
checker1_opacity: '0.05',
checker1_density: '1',
checker1_normal: false,
checker1_random: false,
checker1_straight: false,
checker1_stripes: false,
checker1_rotate: '0',
checker1_blur: '0',
floor_gradient1: false,
floor_gradient1_type: 'value-centerline',
floor_gradient1_color1: '#000000',
floor_gradient1_color2: '#ffffff',
floor_gradient1_opacity1: '0.5',
floor_gradient1_opacity2: '0.5',
floor_gradient1_repeats: '0',
floor_gradient1_size: '100',
floor_gradient2: false,
floor_gradient2_type: 'value-centerline',
floor_gradient2_color1: '#000000',
floor_gradient2_color2: '#ffffff',
floor_gradient2_opacity1: '0.5',
floor_gradient2_opacity2: '0.5',
floor_gradient2_repeats: '0',
floor_gradient2_size: '100',
floor_contour: false,
floor_contour_color: '#000000',
floor_contour_opacity: '1',
floor_contour_size: '80',
floor_contour_multiplier: '4',
plainteam: false,
plainteam_color_use: false,
plainteam_color_red:'#aa0000',
plainteam_color_blue:'#0040a0',
plainteam_color_yellow:'#aaaa00',
teamtile_gradient_type: 'value-none',
teamtile_gradient_size: '30',
teamtile_gradient_color: '#ffffff',
teamtile_gradient_opacity: '0.05',
teamtile_gradient_destination_out: false,
teamtile_checker_size: '0',
teamtile_checker_margin: '0',
teamtile_checker_color: '#000000',
teamtile_checker_opacity: '0.05',
teamtile_checker_normal: false,
teamtile_checker_random: false,
teamtile_checker_straight: false,
teamtile_checker_rotate: '0',
teamtile_checker_blur: '0',
teamtile_checker_squares: true,
teamtile_checker_circles: false,
teamtile_checker_gco: 'value-source-atop',
teamtile_filter: '',
plainendzone: false,
plainendzone_color_use: false,
plainendzone_color_red:'#aa0000',
plainendzone_color_blue:'#0040a0',
endzone_filter: '',
endzone_checker1_size: '0',
endzone_checker1_margin: '0',
endzone_checker1_color: '#000000',
endzone_checker1_opacity: '0.05',
endzone_checker1_normal: false,
endzone_checker1_random: false,
endzone_checker1_straight: false,
endzone_checker1_rotate: '0',
endzone_checker1_blur: '0',
endzone_checker2_size: '0',
endzone_checker2_margin: '0',
endzone_checker2_color: '#000000',
endzone_checker2_opacity: '0.05',
endzone_checker2_normal: false,
endzone_checker2_random: false,
endzone_checker2_straight: false,
endzone_checker2_rotate: '0',
endzone_checker2_blur: '0',
endzone_checker2_afterimage: false,
plainwalls: false,
plainwalls_color_use: false,
plainwalls_color: '#000000',
plainwalls_hardlight: false,
walls_filter: '',
wallshadow_size: '2',
wallshadow_blur: '3',
wallshadow_color: '#000000',
wallshadow_opacity: '0.7',
wallshadow_multiplier: '3',
wallshadow_inner: false,
wallshadow_outer: false,
walloutline1_size: '0',
walloutline1_color: 'auto',
walloutline2_size: '0',
walloutline2_color: 'auto',
walloutline2_dashed: false,
walloutline3_size: '0',
walloutline3_color: 'auto',
walloutline3_opacity: '1',
walloutline3_exclusion: false,
wall_light1: false,
wall_light1_position: 'topleft',
wall_light1_blur: '3',
wall_light1_surfaceScale: '3',
wall_light1_offset: '-400',
wall_light1_constant: '1.65',
wall_light1_exponent: '14',
wall_light1_z: '600',
wall_light1_color: '#e0e0e0',
wall_light2: false,
wall_light2_position: 'bottomright',
wall_light2_blur: '3',
wall_light2_surfaceScale: '3',
wall_light2_offset: '-400',
wall_light2_constant: '1.65',
wall_light2_exponent: '14',
wall_light2_z: '600',
wall_light2_color: '#b3e5fc',
wall_light_edgeonly: true,
wall_text_fontsize: '0',
wall_text_text: '',
wall_text_bold: true,
wall_text_italic: true,
wall_text_smallcaps: false,
wall_text_color: '#00dd40', //fill color
wall_text_opacity: '0.6', //fill opacity
wall_text_stroke_color: '#000000',
wall_text_stroke_opacity: '1',
wall_text_filter: '',
wall_text_flip: false,
wall_text_destinationOut: false,
map_outer_filter: '',
map_outer_shrink: false,
basecircle1_linewidth: '0',
basecircle1_radius: '300',
basecircle1_color_yellow: 'auto',
basecircle1_color_red: 'auto',
basecircle1_color_blue: 'auto',
basecircle1_opacity: '0.5',
basecircle1_blur: '0',
basecircle1_glow: '0',
basecircle1_glow_multiplier: '1',
basecircle1_dashpattern: '',
basecircle1_segments: '0',
basecircle1_gradient: false,
basecircle1_fill: false,
basecircle1_octagon: false,
basecircle2_linewidth: '0',
basecircle2_radius: '280',
basecircle2_color_yellow: 'auto',
basecircle2_color_red: 'auto',
basecircle2_color_blue: 'auto',
basecircle2_opacity: '0.5',
basecircle2_blur: '0',
basecircle2_glow: '0',
basecircle2_glow_multiplier: '1',
basecircle2_dashpattern: '40,10, 10,5, 10,10',
basecircle2_segments: '0',
basecircle2_gradient: false,
basecircle2_fill: false,
basecircle2_octagon: false,
centerline_color: 'auto',
centerline_opacity: '0.6',
centerline_linewidth: '0',
centerline_dashpattern: '5,5',
centerline_glow: '0',
centerline_nfonly: true,
flagline_color: 'auto',
flagline_opacity: '0.4',
flagline_linewidth: '0',
flagline_dashpattern: '10,4, 3,4',
flagline_glow: '0',
extras_destination_out: false,
balls_apply_red: true,
balls_apply_blue: true,
balls_opacity: '1',
balls_plain: false,
balls_plain_color_red: 'auto',
balls_plain_color_blue: 'auto',
balls_shine: false,
balls_shadow: false,
balls_clip_38px: true,
ball_gradient: false,
ball_gradient_color1_red: '#000000',
ball_gradient_color2_red: '#ffffff',
ball_gradient_opacity1_red: '0.75',
ball_gradient_opacity2_red: '0.25',
ball_gradient_color1_blue: '#000000',
ball_gradient_color2_blue: '#ffffff',
ball_gradient_opacity1_blue: '0.75',
ball_gradient_opacity2_blue: '0.25',
ball_gradient_position: '0.5',
ball_star_red: false,
ball_star_red_linewidth: '1',
ball_star_red_stroke_color: '#ffffff',
ball_star_red_stroke_opacity: '1',
ball_star_red_fill_color: '#aa0000',
ball_star_red_fill_opacity: '1',
ball_star_red_points: '4',
ball_star_red_outerradius: '18',
ball_star_red_innerradius: '1',
ball_star_red_holeradius: '4',
ball_star_red_isStar: true,
ball_star_red_destination_out: false,
ball_star_blue: false,
ball_star_blue_linewidth: '1',
ball_star_blue_stroke_color: '#ffffff',
ball_star_blue_stroke_opacity: '1',
ball_star_blue_fill_color: '#0040a0',
ball_star_blue_fill_opacity: '1',
ball_star_blue_points: '4',
ball_star_blue_outerradius: '18',
ball_star_blue_innerradius: '1',
ball_star_blue_holeradius: '4',
ball_star_blue_isStar: true,
ball_star_blue_destination_out: false,
ball_outline1: false,
ball_outline1_linewidth: '2',
ball_outline1_radius: '18',
ball_outline1_dashpattern: '',
ball_outline1_color_red: '#ffffff',
ball_outline1_color_blue: '#ffffff',
ball_outline1_opacity: '0.8',
ball_outline1_blur: false,
ball_outline1_gco: 'source-over',
ball_outline2: false,
ball_outline2_linewidth: '1',
ball_outline2_radius: '18',
ball_outline2_dashpattern: '',
ball_outline2_color_red: '#000000',
ball_outline2_color_blue: '#000000',
ball_outline2_opacity: '1',
ball_outline2_blur: false,
ball_outline2_gco: 'source-over',
ball_outline3: false,
ball_outline3_linewidth: '2',
ball_outline3_radius: '18',
ball_outline3_dashpattern: '',
ball_outline3_color_red: '#000000',
ball_outline3_color_blue: '#000000',
ball_outline3_opacity: '1',
ball_outline3_blur: false,
ball_outline3_gco: 'source-over',
ball_outline4: false,
ball_outline4_linewidth: '12',
ball_outline4_radius: '6',
ball_outline4_dashpattern: '',
ball_outline4_color_red: '#000000',
ball_outline4_color_blue: '#000000',
ball_outline4_opacity: '1',
ball_outline4_blur: false,
ball_outline4_gco: 'destination-out',
ballglow: false,
ballglow_size: '50',
ballglow_opacity: '1',
ballglow_blur: '20',
ballglow_holesize: '40',
ballglow_color_red: 'auto',
ballglow_color_blue: 'auto',
ballglow_offsetx: '0',
ballglow_offsety: '0',
ballglow_tintpups: false,
ballglow_color_tp: '#00ff00',
ballglow_color_rb: '#ff7700',
ballglow_color_jj: '#ffffff',
ballglow_behind: false,
ballglow_ellipse: false,
ballglow_flagcarrier: false,
ballglow_onlyme: false,
ballglow_19pxhole: true,
ballskins: false,
ballskins_opacity: '1',
ballskins_gco: 'source-over',
ballskins_red_x: '-1',
ballskins_red_y: '-1',
ballskins_blue_x: '-1',
ballskins_blue_y: '-1',
ballskins_scale_red: '0.83',
ballskins_scale_blue: '0.83',
ballskins_tint_red: false,
ballskins_tint_red_color: '#aa0000',
ballskins_tint_red_hardlight: false,
ballskins_tint_blue: false,
ballskins_tint_blue_color: '#0040a0',
ballskins_tint_blue_hardlight: false,
ballskins_filter_red: '',
ballskins_filter_blue: '',
spikes_filter: '',
spikes_generic: false,
spikes_generic_color: '#ffffff',
spikes_generic_points: '8',
spikes_generic_innerradius: '8',
spikes_generic_outerradius: '14',
spikes_generic_holeradius: '4',
spikes_generic_color2: 'auto',
spikes_generic_color2_position: '0',
spikes_tint: false,
spikes_tint_color: 'auto',
spikes_border_linewidth: '0',
spikes_border_radius: '14',
spikes_border_color: '#ffffff',
spikes_border_opacity: '1',
buttons_generic: false,
buttons_generic_color_inner: '#ff7700',
buttons_generic_color_outer: '#ffffff',
buttons_generic_color_border: '#000000',
buttons_generic_color_border_split: false,
buttons_shine: false,
buttons_shine_color: '#ffffff',
buttons_border_segments_size: '0',
buttons_border_segments_color: '#000000',
buttons_border_segments_opacity: '0.6',
buttons_filter: '',
bombs_tint: false,
bombs_tint_color: 'auto',
bombs_clip_30px: false,
bombs_generic: false,
bombs_generic_color: '#000000',
bombs_fuse: false,
bombs_fuse_color: '#ffffff',
bombs_shine: false,
bombs_shine_color: '#ffffff',
bombs_outline1: false,
bombs_outline1_linewidth: '2',
bombs_outline1_segments: '3',
bombs_outline1_radius: '14',
bombs_outline1_color: '#ffffff',
bombs_outline1_opacity: '0.8',
bombs_outline1_gco: 'source-over',
bombs_outline2: false,
bombs_outline2_linewidth: '2',
bombs_outline2_segments: '3',
bombs_outline2_radius: '14',
bombs_outline2_color: '#ffffff',
bombs_outline2_opacity: '0.8',
bombs_outline2_gco: 'source-over',
bombs_draw_exploded_opacity: '0',
bombs_filter: '',
gates_neutral_tile_opacity: '1',
gates_neutral_margin: '0',
gates_plain_neutral_base: false,
gates_plain_neutral_base_neutral: 'auto',
gates_plain_neutral_base_opacity: '1',
gates_plain_neutral_gradient: false,
gates_plain_neutral_gradient_color: '#777777',
gates_plain_neutral_gradient_opacity: '1',
gates_plain_neutral_gradient_type: 'value-diagonal',
gates_plain_neutral_gradient_size: '5',
gates_plain_neutral_gradient_gco: 'destination-out',
gates_plain_neutral_pyramid: false,
gates_plain_neutral_pyramid_margin: '0',
gates_plain_neutral_pyramid_useAltStyle: false,
gates_plain_neutral_cross: false,
gates_plain_neutral_cross_linewidth: '1',
gates_plain_neutral_cross_margin: '0',
gates_plain_neutral_cross_neutral: '#000000',
gates_plain_neutral_cross_opacity: '0.8',
gates_plain_neutral_cross_destinationOut: false,
gates_plain_neutral_cross_shadow: '0',
gates_plain_neutral_cutout: false,
gates_plain_neutral_cutout_linewidth: '6',
gates_plain_neutral_cutout_margin: '5',
gates_plain_neutral_cutout_strokeOpacity: '1',
gates_plain_neutral_square: false,
gates_plain_neutral_square_margin: '10',
gates_plain_neutral_square_neutral: 'auto',
gates_plain_neutral_square_fillOpacity: '1',
gates_plain_neutral_detail: false,
gates_plain_neutral_detail_linewidth: '1',
gates_plain_neutral_detail_size: '2',
gates_plain_neutral_detail_margin: '5',
gates_plain_neutral_detail_neutral: '#888888',
gates_plain_neutral_detail_opacity: '1',
gates_plain_neutral_detail_drawCircles: false,
gates_plain_neutral_detail_drawLines: false,
gates_plain_neutral_detail_drawCorners: false,
gates_plain_neutral_detail_dropShadow: false,
gates_plain_neutral_detail_dropShadowBlack: false,
gates_plain_neutral_detail_drawInCenter: false,
gates_plain_neutral_detail_destinationOut: false,
gates_plain_neutral_border: false,
gates_plain_neutral_border_linewidth: '1',
gates_plain_neutral_border_margin: '0',
gates_plain_neutral_border_neutral: 'auto',
gates_plain_neutral_border_strokeOpacity: '1',
gates_plain_neutral_border_40px: false,
gates_grb_tile_opacity: '1',
gates_grb_margin: '0',
gates_plain_grb_base: false,
gates_plain_grb_base_green: 'auto',
gates_plain_grb_base_red: 'auto',
gates_plain_grb_base_blue: 'auto',
gates_plain_grb_base_opacity: '1',
gates_plain_grb_gradient: false,
gates_plain_grb_gradient_green: '#2bee2b',
gates_plain_grb_gradient_red: '#e42121',
gates_plain_grb_gradient_blue: '#206fee',
gates_plain_grb_gradient_opacity: '1',
gates_plain_grb_gradient_type: 'value-diagonal',
gates_plain_grb_gradient_size: '5',
gates_plain_grb_gradient_gco: 'destination-out',
gates_plain_grb_pyramid: false,
gates_plain_grb_pyramid_margin: '0',
gates_plain_grb_pyramid_useAltStyle: false,
gates_plain_grb_cross: false,
gates_plain_grb_cross_linewidth: '1',
gates_plain_grb_cross_margin: '0',
gates_plain_grb_cross_green: '#000000',
gates_plain_grb_cross_red: '#000000',
gates_plain_grb_cross_blue: '#000000',
gates_plain_grb_cross_opacity: '0.8',
gates_plain_grb_cross_shadow: '0',
gates_plain_grb_cross_destinationOut: false,
gates_plain_grb_roundedRect: false,
gates_plain_grb_roundedRect_linewidth: '1',
gates_plain_grb_roundedRect_radius: '4',
gates_plain_grb_roundedRect_margin: '2',
gates_plain_grb_roundedRect_green: '#2bee2b',
gates_plain_grb_roundedRect_red: '#e42121',
gates_plain_grb_roundedRect_blue: '#206fee',
gates_plain_grb_roundedRect_opacity: '0.8',
gates_plain_grb_roundedRect_dropShadow: '0',
gates_plain_grb_roundedRect_dropShadowBlack: false,
gates_plain_grb_roundedRect_drawEdges: true,
gates_plain_grb_roundedRect_drawCorners: true,
gates_plain_grb_cutout: false,
gates_plain_grb_cutout_linewidth: '6',
gates_plain_grb_cutout_margin: '5',
gates_plain_grb_cutout_strokeOpacity: '1',
gates_plain_grb_cutout_blur: '0',
gates_plain_grb_square: false,
gates_plain_grb_square_margin: '10',
gates_plain_grb_square_green: 'auto',
gates_plain_grb_square_red: 'auto',
gates_plain_grb_square_blue: 'auto',
gates_plain_grb_square_fillOpacity: '1',
gates_plain_grb_square_blur: '0',
gates_plain_grb_square_raisedOutline: false,
gates_plain_grb_detail: false,
gates_plain_grb_detail_linewidth: '1',
gates_plain_grb_detail_size: '2',
gates_plain_grb_detail_margin: '5',
gates_plain_grb_detail_green: '#2bee2b',
gates_plain_grb_detail_red: '#e42121',
gates_plain_grb_detail_blue: '#206fee',
gates_plain_grb_detail_opacity: '1',
gates_plain_grb_detail_drawCircles: false,
gates_plain_grb_detail_drawLines: false,
gates_plain_grb_detail_drawCorners: false,
gates_plain_grb_detail_dropShadow: false,
gates_plain_grb_detail_dropShadowBlack: false,
gates_plain_grb_detail_drawInCenter: false,
gates_plain_grb_detail_destinationOut: false,
gates_plain_grb_border: false,
gates_plain_grb_border_linewidth: '1',
gates_plain_grb_border_margin: '0',
gates_plain_grb_border_green: 'auto',
gates_plain_grb_border_red: 'auto',
gates_plain_grb_border_blue: 'auto',
gates_plain_grb_border_strokeOpacity: '1',
gates_plain_grb_border_40px: false,
gates_glow: false,
gates_glow_color_green: 'auto',
gates_glow_color_red: 'auto',
gates_glow_color_blue: 'auto',
gates_glow_size: '4',
gates_glow_outline: false,
gates_glow_outline_color_green: '#ffffff',
gates_glow_outline_color_red: '#ffffff',
gates_glow_outline_color_blue: '#ffffff',
gates_glow_outline_opacity: '0.8',
gates_glow_outline_linewidth: '1',
gate_shadows: false,
gate_shadows_size: '3',
gate_shadows_blur: '3',
gate_shadows_opacity: '0.65',
flags_generic_fill: false,
flags_generic_fill_red: 'auto',
flags_generic_fill_blue: 'auto',
flags_generic_fill_yellow: 'auto',
flags_generic_stroke: false,
flags_generic_stroke_red: 'auto',
flags_generic_stroke_blue: 'auto',
flags_generic_stroke_yellow: 'auto',
flags_generic_gradient: false,
flags_generic_gradient_red: 'auto',
flags_generic_gradient_blue: 'auto',
flags_generic_gradient_yellow: 'auto',
flags_generic_gradient_opacity: '0.5',
flags_generic_pole_linewidth: '2',
flags_generic_pole_color: 'auto',
flags_outline: false,
flags_outline_linewidth: '1',
flags_outline_segments: '20',
flags_outline_color: '#ffffff',
flags_outline_opacity: '1',
flags_outline_taken_opacity: '0.25',
flags_draw_taken_opacity: '0',
flags_glow: false,
flags_glow_color_red: 'auto',
flags_glow_color_blue: 'auto',
flags_glow_color_yellow: 'auto',
pups_generic_jj_stroke: false,
pups_generic_jj_fill: false,
pups_generic_jj_color_border: 'auto',
pups_generic_jj_color_fill: 'auto',
pups_generic_jj_shadow: false,
pups_generic_rb_stroke: false,
pups_generic_rb_fill: false,
pups_generic_rb_color_border: 'auto',
pups_generic_rb_color_fill: 'auto',
pups_generic_rb_shadow: false,
pups_generic_tp_stroke: false,
pups_generic_tp_fill: false,
pups_generic_tp_color_border: 'auto',
pups_generic_tp_color_fill: 'auto',
pups_generic_tp_shadow: false,
pups_generic_empty_stroke: false,
pups_generic_empty_fill: false,
pups_generic_empty_color_border: 'auto',
pups_generic_empty_color_text: 'auto',
pups_generic_empty_shadow: false,
pups_tint_jj: false,
pups_tint_jj_color: 'auto',
pups_tint_rb: false,
pups_tint_rb_color: 'auto',
pups_tint_tp: false,
pups_tint_tp_color: 'auto',
pups_glow: false,
pups_glow_color_jj: 'auto',
pups_glow_color_rb: 'auto',
pups_glow_color_tp: 'auto',
pups_glow_opacity_coefficient: '1',
pups_glow_size_coefficient: '1',
pups_glow_outline: false,
pups_glow_outline_color_jj: '#ffffff',
pups_glow_outline_color_rb: '#ffffff',
pups_glow_outline_color_tp: '#ffffff',
pups_glow_outline_linewidth: '2',
pups_glow_outline_opacity: '1',
pups_bottom_shadow: false,
pups_bottom_shadow_opacity_coefficient: '0.75',
pups_add_shine: false,
pups_filter: '',
boosts_outline: false,
boosts_outline_linewidth: '1',
boosts_outline_segments: '12',
boosts_outline_color_red: 'auto',
boosts_outline_color_blue: 'auto',
boosts_outline_color_yellow: 'auto',
boosts_outline_opacity: '0.6',
boosts_generic: false,
boosts_generic_texture_opacity: '0',
boosts_generic_basic_circle: true,
boosts_generic_yellow_color: '#e1e100',
boosts_generic_red_color: '#ff2222',
boosts_generic_blue_color: '#0080ff',
boosts_generic_border_linewidth: '4',
boosts_generic_border_opacity: '0.35',
boosts_generic_cutsize: '4',
boosts_generic_frames: '5',
boosts_generic_segments: false,
boosts_generic_segments_yellow: '#e1e100',
boosts_generic_segments_red: '#ff2222',
boosts_generic_segments_blue: '#0080ff',
boosts_generic_segments_opacity: '1',
boosts_generic_segments_linewidth: '4',
boosts_generic_segments_blur: '0',
boosts_generic_segments_destinationout: false,
boosts_generic_inner_arrows: false,
boosts_generic_inner_arrows_linewidth: '1.5',
boosts_generic_inner_arrows_color: 'auto',
boosts_generic_inner_arrows_opacity: '0.5',
boosts_generic_inner_arrows_start: '2',
boosts_generic_inner_arrows_length: '4',
boosts_generic_inner_arrows_shift: '1',
boosts_generic_inner_arrows_heads: true,
boosts_generic_corner_arrows: false,
boosts_generic_corner_arrows_opacity: '0.5',
boosts_generic_corner_diagonals: false,
boosts_generic_corner_diagonals_linewidth: '1.5',
boosts_generic_corner_diagonals_color: 'auto',
boosts_generic_corner_diagonals_opacity: '0.5',
boosts_generic_corner_diagonals_start: '15',
boosts_generic_corner_diagonals_length: '4',
boosts_generic_corner_diagonals_shift: '1',
boosts_generic_corner_diagonals_heads: false,
boosts_generic_filter: '',
boosts_glow: false,
boosts_glow_radius: '18',
boosts_glow_color_red: 'auto',
boosts_glow_color_blue: 'auto',
boosts_glow_color_yellow: 'auto',
boosts_glow_radius_inner: '5',
boosts_glow_opacity_inner: '0.5',
boosts_glow_radius_outer: '15',
boosts_glow_opacity_outer: '1',
boosts_glow_hole_radius: '21',
boosts_glow_hole_blur: '2',
portals_outline: false,
portals_outline_linewidth: '1',
portals_outline_segments: '12',
portals_outline_color: 'auto',
portals_outline_opacity: '0.6',
portals_outline_fill: false,
portals_generic: false,
portals_generic_linewidth: '2',
portals_generic_color: '#b48393',
portals_generic_color_alt: '#7986cb',
portals_generic_color_background: '#080808',
portals_generic_color_red: '#900606',
portals_generic_color_red_alt: '#f44336',
portals_generic_color_red_background: '#350303',
portals_generic_color_blue: '#021c73',
portals_generic_color_blue_alt: '#2196f3',
portals_generic_color_blue_background: '#061132',
portals_generic_blur: '2',
portals_generic_frames: '5',
portals_generic_border_linewidth: '2',
gravitywell1_linewidth: '40',
gravitywell1_radius: '260',
gravitywell1_color: '#000000',
gravitywell1_opacity: '0.4',
gravitywell1_dashpattern: '',
gravitywell1_gradient: true,
gravitywell1_gradientAlt: false,
gravitywell1_filter: '',
gravitywell2_linewidth: '2',
gravitywell2_radius: '260',
gravitywell2_color: '#e0e0e0',
gravitywell2_opacity: '0.8',
gravitywell2_dashpattern: '',
gravitywell2_gradient: false,
gravitywell2_gradientAlt: false,
gravitywell2_filter: 'drop-shadow(0 0 1px black) drop-shadow(0 0 1px black)',
texture_floor1: 'select-none',
texture_floor1_filter: '',
texture_floor1_size: '1',
texture_floor1_gco: 'source-atop',
texture_floor2_filter: '',
texture_floor2_size: '1',
texture_floor2: 'select-none',
texture_floor2_gco: 'source-atop',
texture_floor3: 'select-none',
texture_floor3_filter: '',
texture_floor3_size: '1',
texture_floor3_gco: 'source-atop',
texture_team: 'select-none',
texture_team_filter: '',
texture_team_size: '1',
texture_team_gco: 'source-atop',
texture_endzone1: 'select-none',
texture_endzone1_filter: '',
texture_endzone1_size: '1',
texture_endzone1_gco: 'source-atop',
texture_endzone2: 'select-none',
texture_endzone2_filter: '',
texture_endzone2_size: '1',
texture_endzone2_gco: 'source-atop',
texture_walls1: 'select-none',
texture_walls1_filter: '',
texture_walls1_size: '1',
texture_walls1_gco: 'source-atop',
texture_walls2: 'select-none',
texture_walls2_filter: '',
texture_walls2_size: '1',
texture_walls2_gco: 'source-atop',
texture_base: 'select-none',
texture_base_filter: '',
texture_base_size: '1',
texture_base_destination_out: false,
texture_base_dont_draw_nf: false,
texture_base_greyscale_nf: false,
texture_base_dont_adjust_color: false,
texture_base_gradient: false,
texture_base_gradient_color1_red: '#000000',
texture_base_gradient_opacity1_red: '1',
texture_base_gradient_color2_red: '#ff2222',
texture_base_gradient_opacity2_red: '1',
texture_base_gradient_color1_blue: '#000000',
texture_base_gradient_opacity1_blue: '1',
texture_base_gradient_color2_blue: '#0080ff',
texture_base_gradient_opacity2_blue: '1',
texture_base_gradient_position: '0.5',
texture_base_gradient_opacity_global: '0.65',
texture_base_gradient_radial: false,
texture_center: 'select-none',
texture_center_filter: '',
texture_center_size: '1',
texture_center_destination_out: false,
texture_center_drawafterteamtiles: false,
texture_center_gradient: false,
texture_center_gradient_color1: '#000000',
texture_center_gradient_opacity1: '1',
texture_center_gradient_color2: '#ffffff',
texture_center_gradient_opacity2: '1',
texture_center_gradient_position: '0.5',
texture_center_gradient_opacity_global: '0.65',
texture_center_gradient_radial: false,
texture_logo_automatic: false,
texture_logo_random: false,
texture_logo_red: 'select-none',
texture_logo_red_filter: '',
texture_logo_red_size: '1',
texture_logo_red_xOffset: '0',
texture_logo_red_yOffset: '0',
texture_logo_blue: 'select-none',
texture_logo_blue_filter: '',
texture_logo_blue_size: '1',
texture_logo_blue_xOffset: '0',
texture_logo_blue_yOffset: '0',
color_scheme_color_floor: '#222222',
color_scheme_color_walls: '#cccccc',
color_scheme_color_red: '#dd2000',
color_scheme_color_blue: '#0040ff',
color_scheme_color_yellow: '#ffff00',
color_scheme_color_green: '#00ff40',
texture_ballskins: 'select-Skins',
kblogo: false,
fill_empty_with_walls: false,
clear_under_team_tiles: false,
clear_under_endzone_tiles: false,
clear_under_gate_tiles: false,
clear_under_team_tiles_color: 'auto',
clear_under_endzone_tiles_color: 'auto',
clear_under_gate_tiles_color: 'auto',
clear_under_team_tiles_destout: false,
clear_under_endzone_tiles_destout: false,
clear_under_gate_tiles_destout: false,
showall: false,
mysaves: '',
};
let defaultValues = { //you can add your own image links here...
tiles: {
'select-Light Concrete Tile (40px)': { url:'https://i.imgur.com/Y8FM5bh.jpg', filter:'', size:1 },
'select-Dark Concrete Tile (40px)': { url:'https://i.imgur.com/y76Y950.jpg', filter:'', size:1 },
'select-Dark Concrete Slate Tile (40px)': { url:'https://i.imgur.com/Xyt2I8T.jpg', filter:'', size:1 },
'select-Dark Marble Tile (40px)': { url:'https://i.imgur.com/fYHi3Rn.jpg', filter:'saturate(40%)', size:1 },
'select-Mossy Tiles (40px)': { url:'https://i.imgur.com/DQ2YjuY.jpg', filter:'', size:1 },
'select-Straight Check Tiles (40px)': { url:'https://i.imgur.com/YTJU2Db.jpg', filter:'', size:1 },
'select-White Acoustic (40px)': { url:'https://i.imgur.com/D6b8RXL.jpg', filter:'', size:1 },
'select-Stone #1 (40px)': { url:'https://i.imgur.com/DZnk0M3.jpg', filter:'', size:1 },
'select-Stone #2 (40px)': { url:'https://i.imgur.com/jW0uUr2.jpg', filter:'', size:1 },
'select-Stone #3 (40px)': { url:'https://i.imgur.com/B9o9T6w.jpg', filter:'saturate(0%)', size:1 },
'select-Stone #4 (40px)': { url:'https://i.imgur.com/Z0QRNUQ.jpg', filter:'', size:1 },
'select-Stone #6 (40px)': { url:'https://i.imgur.com/04jVuxx.jpg', filter:'', size:1 },
'select-Parquet': { url:'https://i.imgur.com/7ZYs6Kr.png', filter:'opacity(60%) saturate(50%)', size:1 }, //40px Size: 0.4706
'select-Wood Panel': { url:'https://i.imgur.com/656YfE9.jpg', filter:'opacity(40%) saturate(0%)', size:1 }, //40px Size: 0.16
'select-40px Edge': { url:'https://i.imgur.com/BgKmTGd.png', filter:'saturate(0%)', size:1 },
'select-40px Raised': { url:'https://i.imgur.com/axuW2il.png', filter:'saturate(0%)', size:1 },
'select-40px Chunky': { url:'https://i.imgur.com/pPt8jI8.png', filter:'saturate(0%)', size:1 },
'select-40px Fine': { url:'https://i.imgur.com/q5sbWaS.png', filter:'saturate(0%)', size:1 },
'select-40px Finer': { url:'https://i.imgur.com/LlSu2RI.png', filter:'saturate(0%)', size:1 },
'select-40px Bumpy': { url:'https://i.imgur.com/5uEaIv5.png', filter:'saturate(0%)', size:1 },
'select-40px Emboss': { url:'https://i.imgur.com/1te16tm.png', filter:'saturate(0%)', size:1 },
'select-40px Riveted': { url:'https://i.imgur.com/Fi5a22M.png', filter:'saturate(0%)', size:1 },
'select-40px Rough': { url:'https://i.imgur.com/Gvt0xNA.png', filter:'saturate(0%)', size:1 },
'select-40px Random': { url:'https://i.imgur.com/yQpbCkU.png', filter:'saturate(0%)', size:1 },
'select-Grid #1': { url:'https://i.imgur.com/R7M4gFp.jpg', filter:'opacity(50%)', size:1 },
'select-Texture Tile #1': { url:'https://i.imgur.com/TyFgnQt.jpg', filter:'', size:1 },
'select-Texture Tile #2': { url:'https://i.imgur.com/TPNICbS.jpg', filter:'', size:1 },
'select-Plaster Decal #1': { url:'https://i.imgur.com/sC80mZd.png', filter:'opacity(65%)', size:1 },
}, textures: {
'select-JoJo Metal 54': { url:'https://i.imgur.com/5v7qgOb.jpg', filter:'opacity(80%)', size:1 }, //https://www.deviantart.com/jojo-ojoj
'select-JoJo Metal 2-3': { url:'https://i.imgur.com/iS31AaM.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Metal 7-1a': { url:'https://i.imgur.com/oV6zezK.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Metal 7-1c': { url:'https://i.imgur.com/NySj3YD.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Metal 7-5a': { url:'https://i.imgur.com/i6FnEVt.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Metal 7-3c': { url:'https://i.imgur.com/TPJfdty.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Metal 7-2': { url:'https://i.imgur.com/tbkht6s.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Metal 7-2c': { url:'https://i.imgur.com/MfsxeRg.jpg', filter:'opacity(30%)', size:1 },
'select-JoJo Metal 7-4': { url:'https://i.imgur.com/rruV0LI.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Metal 40': { url:'https://i.imgur.com/gabhssq.jpg', filter:'opacity(60%)', size:1 },
'select-JoJo Metal 58': { url:'https://i.imgur.com/Asaedin.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Bronze 1': { url:'https://i.imgur.com/qgOcYV7.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Bronze 12': { url:'https://i.imgur.com/zxoJ4eZ.jpg', filter:'opacity(40%)', size:1 },
'select-JoJo Bronze 16': { url:'https://i.imgur.com/Bqc7NIU.jpg', filter:'opacity(40%)', size:1 },
'select-JoJo Turquoise 4': { url:'https://i.imgur.com/hPqvUiw.jpg', filter:'opacity(50%) brightness(125%)', size:0.3 },
'select-JoJo Fantasy 1-1a': { url:'https://i.imgur.com/zAGwu0j.jpg', filter:'opacity(60%) blur(2px)', size:0.3 },
'select-JoJo Metal Flowers 1': { url:'https://i.imgur.com/Ldn0yp9.jpg', filter:'opacity(75%)', size:1 },
'select-JoJo Stained Glass 3-4': { url:'https://i.imgur.com/gaCqtZ5.jpg', filter:'opacity(50%)', size:1 },
'select-JoJo Stained Glass 3-7': { url:'https://i.imgur.com/idQmNIb.jpg', filter:'opacity(30%)', size:1 },
'select-JoJo Stained Glass 3-10': { url:'https://i.imgur.com/1Kl7ECn.jpg', filter:'opacity(30%)', size:1 },
'select-JoJo Relief Lines 5': { url:'https://i.imgur.com/681taoV.jpg', filter:'opacity(60%)', size:1 },
'select-JoJo Relief Lines 7': { url:'https://i.imgur.com/YraY3LT.jpg', filter:'opacity(60%)', size:1 },
'select-JoJo Relief Lines 14': { url:'https://i.imgur.com/KKx8Sh6.jpg', filter:'opacity(60%)', size:1 },
'select-JoJo Relief Lines 23': { url:'https://i.imgur.com/4a0axxe.jpg', filter:'opacity(60%)', size:1 },
'select-JoJo Relief Dots 11': { url:'https://i.imgur.com/nSJy5eU.jpg', filter:'opacity(60%)', size:1 },
'select-JoJo Relief Dots 15': { url:'https://i.imgur.com/Sg4gFEw.jpg', filter:'opacity(60%)', size:1 },
'select-JoJo Relief Dots 17': { url:'https://i.imgur.com/dcJOQxX.jpg', filter:'opacity(60%)', size:1 },
'select-Grey Noise': { url:'https://i.imgur.com/HX9icFx.png', filter:'opacity(30%) saturate(0%)', size:1 },
'select-Abstract Lines': { url:'https://i.imgur.com/Jrbl2F6.jpg', filter:'opacity(60%) brightness(50%) saturate(60%)', size:1 },
'select-Abstract Curves': { url:'https://i.imgur.com/KaMayZX.jpg', filter:'opacity(40%) saturate(60%)', size:1 }, //CKUt7gq
'select-Abstract Aurora': { url:'https://i.imgur.com/sGe7na2.jpg', filter:'opacity(50%)', size:1 },
'select-Abstract Inky': { url:'https://i.imgur.com/L3TXFlY.jpg', filter:'opacity(50%)', size:1 },
'select-Abstract Green Glass': { url:'https://i.imgur.com/FVPsxKn.jpg', filter:'opacity(50%)', size:1 },
'select-Abstract Twisty': { url:'https://i.imgur.com/gHUMCCn.jpg', filter:'opacity(50%)', size:1 },
'select-Vertices': { url:'https://i.imgur.com/3tvWsw4.jpg', filter:'opacity(40%)', size:1 },
'select-Thorns': { url:'https://i.imgur.com/SAqSSio.jpg', filter:'opacity(25%)', size:1 },
'select-Bubbles & Swirls': { url:'https://i.imgur.com/QzTA5so.jpg', filter:'opacity(25%)', size:1 },
'select-Triangle Kaleidoscope': { url:'https://i.imgur.com/D61kjL1.jpg', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Pensieve': { url:'https://i.imgur.com/trgLYP7.jpg', filter:'opacity(15%) saturate(0%)', size:1.5 },
'select-Stranger Things': { url:'https://i.imgur.com/5VL5JK5.jpg', filter:'opacity(60%) brightness(20%) hue-rotate(330deg)', size:1 },
'select-Fire Swirls': { url:'https://i.imgur.com/HmO4fo6.jpg', filter:'opacity(60%)', size:1 },
'select-Blue Abstract': { url:'https://i.imgur.com/4HscgQP.jpg', filter:'opacity(30%) saturate(0%)', size:1 },
'select-Abstract #1': { url:'https://i.imgur.com/iPAg5go.jpg', filter:'opacity(30%) saturate(40%)', size:1 },
'select-Abstract #2': { url:'https://i.imgur.com/iSAwA6f.jpg', filter:'opacity(30%) saturate(40%)', size:1 },
'select-Blue Steel': { url:'https://i.imgur.com/UaHP8Xt.jpg', filter:'opacity(50%)', size:1 },
'select-Metal': { url:'https://i.imgur.com/QlRuQ2M.png', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Denim': { url:'https://i.imgur.com/mmS04va.jpg', filter:'', size:1 },
'select-Grey Stone': { url:'https://i.imgur.com/3umfx3X.jpg', filter:'opacity(40%) saturate(0%)', size:1 },
'select-Stars #1': { url:'https://i.imgur.com/WIZs5aX.jpg', filter:'', size:1 },
'select-Metal Floorplate': { url:'https://i.imgur.com/Q29G4D1.jpg', filter:'opacity(35%) saturate(0%)', size:0.25 },
'select-Green Lightning': { url:'https://i.imgur.com/q9CpL3Z.jpg', filter:'opacity(35%) saturate(0%)', size:1 },
'select-DvA Rust': { url:'https://i.imgur.com/gwpmUpL.jpg', filter:'opacity(80%)', size:0.3 },
'select-Patchy': { url:'https://i.imgur.com/T295R0M.png', filter:'opacity(30%) saturate(0%)', size:0.5 },
'select-Metal': { url:'https://i.imgur.com/7rEw1gi.png', filter:'opacity(45%) saturate(0%)', size:1 },
'select-Rubber Specks': { url:'https://i.imgur.com/bUT3z02.png', filter:'opacity(50%) saturate(0%)', size:0.5 },
'select-Blue/Black Lightning': { url:'https://i.imgur.com/NfViyHL.png', filter:'', size:0.4 },
'select-Lava Rocks': { url:'https://i.imgur.com/4WudVdy.jpg', filter:'saturate(200%) hue-rotate(250deg)', size:0.1 },
'select-Colorful': { url:'https://i.imgur.com/ESSRqxr.png', filter:'opacity(80%)', size:1 },
'select-Sepia Blue': { url:'https://i.imgur.com/TBCWGlO.png', filter:'opacity(80%) saturate(400%) sepia(100%) hue-rotate(150deg)', size:1 },
'select-Blue/Black Sparkles': { url:'https://i.imgur.com/MiDbkF1.jpg', filter:'opacity(50%) saturate(50%)', size:0.25 },
'select-Disco Dots': { url:'https://i.imgur.com/2Qjswtg.jpg', filter:'saturate(0%)', size:0.15 },
'select-Metro': { url:'https://i.imgur.com/m0evMLc.jpg', filter:'opacity(80%) saturate(0%)', size:0.5 },
'select-Tech #2': { url:'https://i.imgur.com/qvLx41l.jpg', filter:'hue-rotate(120deg)', size:0.25 },
'select-Tech #4': { url:'https://i.imgur.com/wDSltEC.jpg', filter:'opacity(60%) saturate(80%)', size:0.6 },
'select-Tech #6': { url:'https://i.imgur.com/qjqAvPJ.jpg', filter:'opacity(70%) saturate(70%)', size:1 },
'select-Placed Stones': { url:'https://i.imgur.com/Lk9PiLw.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Gold Squares': { url:'https://i.imgur.com/MSPvdQp.jpg', filter:'opacity(60%)', size:1 },
'select-Gold Bumps': { url:'https://i.imgur.com/aVzRxTo.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #1': { url:'https://i.imgur.com/L7kp0Qj.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #2': { url:'https://i.imgur.com/3HMNxTA.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #3': { url:'https://i.imgur.com/JWZPXAp.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #4': { url:'https://i.imgur.com/J6WGdFi.jpg', filter:'opacity(60%)', size:1 }, //0.3125
'select-HL2 Tile #5': { url:'https://i.imgur.com/xvZtLsb.jpg', filter:'opacity(60%)', size:1 }, //0.625
'select-HL2 Tile #6': { url:'https://i.imgur.com/2djhQKQ.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #7': { url:'https://i.imgur.com/sRT2aXD.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #8': { url:'https://i.imgur.com/xFAqPRG.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #9': { url:'https://i.imgur.com/u7PIXYZ.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #10': { url:'https://i.imgur.com/MYQyHHp.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #11': { url:'https://i.imgur.com/ENW1ddR.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #12': { url:'https://i.imgur.com/yX5cfiS.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #13': { url:'https://i.imgur.com/BTAONgc.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #14': { url:'https://i.imgur.com/gkTU3Mj.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #15': { url:'https://i.imgur.com/QQr6HjP.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #16': { url:'https://i.imgur.com/yIzo7AF.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #17': { url:'https://i.imgur.com/U2VJs63.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Tile #18': { url:'https://i.imgur.com/aqRSiTf.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Concrete #7': { url:'https://i.imgur.com/AvQYwnm.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Concrete #11': { url:'https://i.imgur.com/YiZAtY0.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Brick #5': { url:'https://i.imgur.com/JtPcmPN.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #1': { url:'https://i.imgur.com/BrCISq0.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #2': { url:'https://i.imgur.com/GuAOc42.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #3': { url:'https://i.imgur.com/pnBQm6Q.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #4': { url:'https://i.imgur.com/drFxYDr.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #5': { url:'https://i.imgur.com/S4o85r1.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #6': { url:'https://i.imgur.com/OK4UDYp.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #7': { url:'https://i.imgur.com/JHwmVJO.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #8': { url:'https://i.imgur.com/b48ALlD.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #9': { url:'https://i.imgur.com/Zf9o7oQ.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #10': { url:'https://i.imgur.com/XNReFkg.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #11': { url:'https://i.imgur.com/mFEYcdu.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #12': { url:'https://i.imgur.com/lKI7DTq.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #14': { url:'https://i.imgur.com/AhU5Hbk.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Metal #15': { url:'https://i.imgur.com/xivP2g3.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Roof #12': { url:'https://i.imgur.com/w4FPSTS.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Asphalt #3': { url:'https://i.imgur.com/zxqPcRU.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Asphalt #7': { url:'https://i.imgur.com/BQKudWz.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Asphalt #10': { url:'https://i.imgur.com/yQERtfX.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Asphalt #14': { url:'https://i.imgur.com/bsaySzG.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Earth #4': { url:'https://i.imgur.com/qpwj0cs.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Gravel #3': { url:'https://i.imgur.com/67r5mw0.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Ground #2': { url:'https://i.imgur.com/RAJUJTT.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Ground #4': { url:'https://i.imgur.com/qw8QMgv.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Sand #14': { url:'https://i.imgur.com/eBkkdWN.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Plaster #3': { url:'https://i.imgur.com/560lkwg.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Plaster #4': { url:'https://i.imgur.com/WDnHyVx.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Plaster #6': { url:'https://i.imgur.com/YFfUl9r.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Rock #13': { url:'https://i.imgur.com/1cS52hs.jpg', filter:'opacity(60%)', size:1 },
'select-HL2 Rock #14': { url:'https://i.imgur.com/d3ZAOVa.jpg', filter:'opacity(60%)', size:1 },
'select-DvA Tiles #3': { url:'https://i.imgur.com/SIxEgME.png', filter:'opacity(50%)', size:0.5 },
'select-Cracked Ice': { url:'https://i.imgur.com/p8ss5iu.jpg', filter:'opacity(50%)', size:1 },
'select-Icy #1': { url:'https://i.imgur.com/Qr65jS9.jpg', filter:'opacity(50%)', size:1 },
'select-Icy #2': { url:'https://i.imgur.com/Tj7GrTE.jpg', filter:'opacity(50%)', size:1 },
'select-Rusty Plate': { url:'https://i.imgur.com/7vm2y2S.jpg', filter:'opacity(50%)', size:1 },
'select-Cartoony Grass Tiles': { url:'https://i.imgur.com/O4MmMUe.jpg', filter:'opacity(50%)', size:1 },
'select-Cartoony Large Tiles': { url:'https://i.imgur.com/6GHsXTH.jpg', filter:'opacity(50%)', size:1 },
'select-Cartoony Blocks #1': { url:'https://i.imgur.com/S1WQVMY.jpg', filter:'opacity(50%)', size:1 },
'select-Cartoony Blocks #2': { url:'https://i.imgur.com/NQDrfPb.jpg', filter:'opacity(50%)', size:1 },
'select-Cartoony Blocks #3': { url:'https://i.imgur.com/ZhqIDy9.jpg', filter:'opacity(50%)', size:0.5 },
'select-Cartoony Tiles #1': { url:'https://i.imgur.com/0jT7xPd.jpg', filter:'opacity(50%)', size:1 },
'select-Cartoony Tiles #2': { url:'https://i.imgur.com/2ygfkgo.jpg', filter:'opacity(50%)', size:1 },
'select-Cartoony Tiles #3': { url:'https://i.imgur.com/xiQCzhK.jpg', filter:'opacity(80%)', size:1 },
'select-Cartoony Skulls': { url:'https://i.imgur.com/G2Ly3Cz.jpg', filter:'opacity(20%)', size:0.4 },
'select-Cartoony Bricks': { url:'https://i.imgur.com/ISXVTpP.jpg', filter:'', size:0.6 },
'select-Cartoony Ground #1': { url:'https://i.imgur.com/y7sgFet.jpg', filter:'', size:1 },
'select-Cartoony Ground #2': { url:'https://i.imgur.com/42nlhWC.jpg', filter:'', size:1 },
'select-Cartoony Ground #3': { url:'https://i.imgur.com/zMJX1Wm.jpg', filter:'', size:1 },
'select-Cartoony Moon Surface': { url:'https://i.imgur.com/M9xKSPW.jpg', filter:'', size:0.8 },
'select-Cartoony Riveted Metal #1': { url:'https://i.imgur.com/v4vhHVf.jpg', filter:'opacity(80%)', size:1.28 },
'select-Atlas Academy': { url:'https://i.imgur.com/WVJ94Io.jpg', filter:'opacity(80%)', size:1 },
'select-Hexes #6': { url:'https://i.imgur.com/b1mSf5h.jpg', filter:'opacity(50%)', size:1 },
'select-White Marble': { url:'https://i.imgur.com/Y0ruywB.jpg', filter:'opacity(50%)', size:1 },
'select-Scratched Metal': { url:'https://i.imgur.com/HBHKvi3.jpg', filter:'opacity(50%)', size:1 },
'select-Hex Parquet': { url:'https://i.imgur.com/QxeSj1x.jpg', filter:'opacity(50%)', size:1 },
'select-Fake Leather': { url:'https://i.imgur.com/Br8A2gQ.jpg', filter:'opacity(50%)', size:1 },
'select-Herringbone': { url:'https://i.imgur.com/ABm3nj3.jpg', filter:'opacity(50%)', size:0.5 },
'select-Concrete': { url:'https://i.imgur.com/GL7sgbd.jpg', filter:'opacity(50%)', size:1 },
}, patterns: {
'select-Cracks': { url:'https://i.imgur.com/iVBA4Mh.png', filter:'opacity(20%) saturate(0%)', size:0.75 },
'select-Large Cracks': { url:'https://i.imgur.com/KnyWWPm.png', filter:'opacity(20%) saturate(0%)', size:0.75 },
'select-Hexes': { url:'https://i.imgur.com/h8ZZBar.png', filter:'opacity(35%) saturate(0%)', size:0.75 },
'select-Ripples': { url:'https://i.imgur.com/AWH4YOw.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Crinkle #1': { url:'https://i.imgur.com/ds4Geee.png', filter:'opacity(30%) saturate(0%)', size:1 },
'select-Crinkle #2': { url:'https://i.imgur.com/dmG3wCE.png', filter:'opacity(10%) saturate(0%)', size:1 },
'select-Stone': { url:'https://i.imgur.com/dmUN4jU.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Rocks': { url:'https://i.imgur.com/HWsz7ws.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Moon': { url:'https://i.imgur.com/nmuo0MA.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Small Swirls': { url:'https://i.imgur.com/yjxCUnM.png', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Large Swirls': { url:'https://i.imgur.com/FzsRS82.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-CrissxCross': { url:'https://i.imgur.com/MOGf8xz.png', filter:'saturate(0%)', size:1 },
'select-Graphy': { url:'https://i.imgur.com/juAjF3Z.png', filter:'opacity(80%) saturate(0%)', size:1 },
'select-Stucco': { url:'https://i.imgur.com/86I6VL6.png', filter:'saturate(0%)', size:1 },
'select-Wall4': { url:'https://i.imgur.com/Z6iGoc0.png', filter:'saturate(0%)', size:1 },
'select-Diamond': { url:'https://i.imgur.com/hxfybwo.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Diamond Plate': { url:'https://i.imgur.com/55DkQ8w.png', filter:'opacity(50%) saturate(0%)', size:0.5 },
'select-Cracks 2': { url:'https://i.imgur.com/u9bxdJP.png', filter:'opacity(45%) saturate(0%)', size:1 },
'select-Hexes 3': { url:'https://i.imgur.com/Hsb4NXA.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Rust': { url:'https://i.imgur.com/CUyHclO.jpg', filter:'opacity(40%)', size:1 },
'select-Warble': { url:'https://i.imgur.com/agDb3VO.png', filter:'opacity(30%)', size:1 },
'select-Diagonal Bumps': { url:'https://i.imgur.com/H506yGi.png', filter:'opacity(25%) saturate(0%)', size:0.5 },
'select-Diagonal Lines': { url:'https://i.imgur.com/I0TdkMF.png', filter:'opacity(35%) saturate(0%)', size:1 },
'select-Worn Squares': { url:'https://i.imgur.com/tdWd8mV.png', filter:'opacity(40%) saturate(0%)', size:0.6 },
'select-Square Stone': { url:'https://i.imgur.com/IVMe6tW.png', filter:'opacity(50%) saturate(0%)', size:2 },
'select-Tech Pattern': { url:'https://i.imgur.com/5xhUTPM.png', filter:'opacity(40%) saturate(0%)', size:0.4 },
'select-Cobweb': { url:'https://i.imgur.com/OsDHU9O.png', filter:'opacity(40%)', size:0.3 },
'select-Cracks 1': { url:'https://i.imgur.com/XcIJIGJ.png', filter:'opacity(50%) invert(100%)', size:0.8 },
'select-Circles': { url:'https://i.imgur.com/rN8sQjk.jpg', filter:'opacity(30%) saturate(0%)', size:0.2 },
'select-Scribbles': { url:'https://i.imgur.com/4aQlwdd.jpg', filter:'opacity(20%)', size:1 },
'select-Rain #1': { url:'https://i.imgur.com/wJtBlHF.jpg', filter:'opacity(30%)', size:1 },
'select-Rain #2': { url:'https://i.imgur.com/oaV9gW1.jpg', filter:'opacity(50%)', size:0.5 },
'select-Fractal #1': { url:'https://i.imgur.com/UvjHKSx.jpg', filter:'opacity(20%)', size:1 },
'select-Grey Abstract': { url:'https://i.imgur.com/XglIOL8.png', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Cracks 2': { url:'https://i.imgur.com/L98rOLB.png', filter:'opacity(70%)', size:0.6 },
'select-Glass Shards': { url:'https://i.imgur.com/VYhDLZi.png', filter:'opacity(60%)', size:0.6 },
'select-Water Drops': { url:'https://i.imgur.com/XuFz6JD.png', filter:'opacity(70%)', size:0.8 },
'select-Sparkle Lines': { url:'https://i.imgur.com/Q5j7AS2.png', filter:'opacity(40%)', size:0.4 },
'select-Aurora': { url:'https://i.imgur.com/WOS5HNF.jpg', filter:'opacity(40%)', size:0.8 },
'select-Stars #2': { url:'https://i.imgur.com/mkOOlWY.png', filter:'opacity(50%) saturate(0)', size:0.7 },
'select-JoJo Glass #9': { url:'https://i.imgur.com/ghhe7fG.jpg', filter:'opacity(75%) saturate(0)', size:1 },
'select-JoJo Glass #22': { url:'https://i.imgur.com/gO985LR.jpg', filter:'opacity(75%) saturate(0)', size:1 },
'select-Swirly Shards': { url:'https://i.imgur.com/HbHI7jF.jpg', filter:'opacity(75%)', size:0 },
'select-Glow Squares': { url:'https://i.imgur.com/Zdi62sl.jpg', filter:'', size:1 },
'select-Disco Dots #2': { url:'https://i.imgur.com/oaVrTqD.jpg', filter:'', size:1 },
'select-Diagonal Stripes 1': { url:'https://i.imgur.com/k93bkrI.jpg', filter:'opacity(50%) saturate(0%)', size:0.4 },
'select-Diagonal Stripes 2': { url:'https://i.imgur.com/QcYxDj5.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Diagonal Stripes 3': { url:'https://i.imgur.com/rQUdR4g.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Diagonal Stripes 4': { url:'https://i.imgur.com/i102OiJ.jpg', filter:'opacity(50%)', size:1 },
'select-Diagonal Stripes 5': { url:'https://i.imgur.com/vA2tMzc.png', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Diagonal Pattern #1': { url:'https://i.imgur.com/I0TdkMF.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Diagonal Pattern #2': { url:'https://i.imgur.com/GHvLZzZ.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Diagonal Pattern #3': { url:'https://i.imgur.com/svFvbGD.png', filter:'opacity(80%)', size:1 },
'select-Big Angled Squares 1': { url:'https://i.imgur.com/4ZJHN21.png', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Big Angled Squares 2': { url:'https://i.imgur.com/HwHBGLS.png', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Fuzzy Diagonals': { url:'https://i.imgur.com/D5PJ8gQ.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Scratched Paint #1': { url:'https://i.imgur.com/cZ61f5C.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Camo Clouds': { url:'https://i.imgur.com/FqpPaTB.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
//For Ball Glow...
'select-DestOut Dots #4': { url:'https://i.imgur.com/ot8Zwv7.png', filter:'', size:0.4 },
'select-DestOut Dots #2': { url:'https://i.imgur.com/n4bY3Ot.png', filter:'', size:1 },
'select-DestOut Dither': { url:'https://i.imgur.com/2D8OSTl.png', filter:'', size:0.5 },
'select-DestOut Cracks': { url:'https://i.imgur.com/5cHCw2e.png', filter:'', size:1 },
//team...
'select-Leather': { url:'https://i.imgur.com/4mAoi3N.png', filter:'opacity(20%) saturate(0%)', size:0.5 },
'select-Bumps': { url:'https://i.imgur.com/Svphszd.png', filter:'opacity(20%) saturate(0%)', size:0.25 },
'select-Angled Pattern': { url:'https://i.imgur.com/A75wfny.png', filter:'opacity(15%) saturate(0%)', size:0.6 },
'select-Tech Pattern': { url:'https://i.imgur.com/rRzVufi.png', filter:'opacity(25%) saturate(0%)', size:0.5 },
'select-Metal Floorplate': { url:'https://i.imgur.com/4zC6wuP.png', filter:'opacity(40%) saturate(0%)', size:0.125 },
'select-Triangles': { url:'https://i.imgur.com/mv1F2dp.png', filter:'opacity(15%) saturate(0%)', size:0.6 },
'select-Shiny Pattern': { url:'https://i.imgur.com/d8jbPp1.png', filter:'opacity(40%) saturate(0%)', size:1 },
'select-Bubbles': { url:'https://i.imgur.com/Emn8TOL.png', filter:'opacity(75%) saturate(0%)', size:.6 },
'select-Crackles': { url:'https://i.imgur.com/6N96iC0.png', filter:'opacity(35%) saturate(0%)', size:.75 },
'select-Sparkles #1': { url:'https://i.imgur.com/Mt2bZKl.png', filter:'opacity(30%) saturate(0%)', size:1 },
'select-Sparkles #2': { url:'https://i.imgur.com/w3lvISP.png', filter:'opacity(20%) saturate(0%)', size:1 }, //
'select-Lightning #1': { url:'https://i.imgur.com/0t8iJf0.png', filter:'opacity(35%) saturate(0%)', size:1 }, //
'select-Lightning #2': { url:'https://i.imgur.com/vKdtHOa.png', filter:'opacity(25%) saturate(0%)', size:1 }, //
'select-Gun Metal': { url:'https://i.imgur.com/FPNMvDX.png', filter:'opacity(80%) saturate(0%)', size:1 },
'select-Dots #1': { url:'https://i.imgur.com/icihwh9.png', filter:'opacity(40%) saturate(0)', size:1 },
'select-Dots #3': { url:'https://i.imgur.com/5mazxB7.png', filter:'opacity(40%) saturate(0)', size:.4 },
'select-Bright Dots': { url:'https://i.imgur.com/sR0SSeZ.jpg', filter:'opacity(50%) saturate(0)', size:1 },
'select-Rain #3': { url:'https://i.imgur.com/yXa281T.jpg', filter:'opacity(30%) saturate(0)', size:1 },
'select-Rain #4': { url:'https://i.imgur.com/Ni5SUYl.png', filter:'opacity(30%) saturate(0)', size:0.8 },
'select-Hexellence': { url:'https://i.imgur.com/NtWwGQU.png', filter:'saturate(0%)', size:1 },
'select-Fog': { url:'https://i.imgur.com/CRiD00Q.png', filter:'opacity(60%) saturate(0)', size:1 },
'select-Sparklers': { url:'https://i.imgur.com/PM8sch8.png', filter:'opacity(60%) saturate(0)', size:1 },
'select-Eek': { url:'https://i.imgur.com/TU8ft5U.png', filter:'opacity(60%) saturate(0)', size:1 },
'select-Holes': { url:'https://i.imgur.com/GBx2M3f.png', filter:'opacity(20%) saturate(0%)', size:0.4 },
'select-HtoBS #2': { url:'https://i.imgur.com/6jc3n1I.jpg', filter:'opacity(40%) saturate(0)', size:0.15625 },
//endzone...
'select-Carbon Fibre': { url:'https://i.imgur.com/Ye7V4OG.png', filter:'opacity(90%) saturate(0%)', size:1 },
'select-Small Diagonal Checks': { url:'https://i.imgur.com/EY1YM5D.jpg', filter:'saturate(0%)', size:1 },
'select-Large Diagonal Checks': { url:'https://i.imgur.com/3DPyEdr.png', filter:'opacity(25%) saturate(0%)', size:0.8 },
'select-Small Random Checks': { url:'https://i.imgur.com/VOqzUP3.png', filter:'saturate(0%)', size:1 },
'select-Medium Random Checks': { url:'https://i.imgur.com/Eyn93az.png', filter:'saturate(0%)', size:1 },
'select-Diagonal Lines': { url:'https://i.imgur.com/mMK6rd5.png', filter:'opacity(20%) saturate(0%)', size:1 },
'select-Spaced Diagonal Lines': { url:'https://i.imgur.com/py1AYki.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Small Checks': { url:'https://i.imgur.com/Zd0mJK7.png', filter:'opacity(40%) saturate(0%)', size:1 },
'select-Criss Cross Pattern': { url:'https://i.imgur.com/mSyGafG.png', filter:'opacity(20%) saturate(0%)', size:1 },
'select-Joined Squares': { url:'https://i.imgur.com/2QgKUaf.png', filter:'opacity(25%) saturate(0%)', size:0.5 },
'select-Joined Circles': { url:'https://i.imgur.com/fmCFpbT.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Moroccan': { url:'https://i.imgur.com/5sWY3nV.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Tartan': { url:'https://i.imgur.com/k0kGc9P.png', filter:'opacity(25%) saturate(0%)', size:0.5 },
'select-Jigsaw': { url:'https://i.imgur.com/eQhKaA0.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Stars #3': { url:'https://i.imgur.com/aTdxbHQ.png', filter:'opacity(25%) saturate(0%)', size:1 },
'select-Squares 1': { url:'https://i.imgur.com/Zul9gLx.png', filter:'opacity(50%) saturate(0%)', size:0.8 },
'select-Rotated Checker': { url:'https://i.imgur.com/UlAiP6D.jpg', filter:'opacity(50%) saturate(0%)', size:0.7 },
'select-Flag': { url:'https://i.imgur.com/2tSzrKY.jpg', filter:'opacity(50%) saturate(0%)', size:0.5 },
'select-DBlocks': { url:'https://i.imgur.com/q6NLBfa.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-HexDither': { url:'https://i.imgur.com/eRXLm4e.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-ParaHex': { url:'https://i.imgur.com/7m17UZd.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-FoamPadding': { url:'https://i.imgur.com/Ytsbeut.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Abstract Squares #1': { url:'https://i.imgur.com/1Okbn0x.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Abstract Squares #2': { url:'https://i.imgur.com/ETWnSb5.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Matrix': { url:'https://i.imgur.com/ox4KNTa.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-Checkered Dither': { url:'https://i.imgur.com/9CqlZ6z.png', filter:'opacity(20%)', size:1 },
'select-Diagonal Checkered Dither': { url:'https://i.imgur.com/3BzmLKv.png', filter:'opacity(20%)', size:1 },
'select-Grunge #1': { url:'https://i.imgur.com/reqN10z.png', filter:'opacity(80%)', size:1 },
'select-Grunge #2': { url:'https://i.imgur.com/skj5NaJ.png', filter:'opacity(50%)', size:1 },
'select-Grunge #3': { url:'https://i.imgur.com/ynPNnLA.jpg', filter:'opacity(50%)', size:1 }, //https://www.deviantart.com/cloaks
'select-Grunge #4': { url:'https://i.imgur.com/XGkl8Rj.jpg', filter:'opacity(50%)', size:1 },
'select-Grunge #5': { url:'https://i.imgur.com/upaqt1f.jpg', filter:'opacity(50%)', size:1 },
'select-Grunge #6': { url:'https://i.imgur.com/NIKZZhJ.jpg', filter:'opacity(75%)', size:1 },
'select-ZigZag #1': { url:'https://i.imgur.com/2235CMB.png', filter:'opacity(50%)', size:1 },
'select-Blue Marble': { url:'https://i.imgur.com/bhQBMcW.jpg', filter:'opacity(50%)', size:1 },
'select-Modern-001': { url:'https://i.imgur.com/J72XoVG.jpg', filter:'opacity(75%)', size:1 },
'select-Modern Diagonal Lines': { url:'https://i.imgur.com/ZIwoaJz.png', filter:'opacity(75%)', size:1 },
'select-Slashes': { url:'https://i.imgur.com/v5RhFYJ.png', filter:'opacity(75%)', size:1 },
'select-Grid + Circles': { url:'https://i.imgur.com/HcejJOJ.png', filter:'opacity(75%)', size:1 },
'select-Checker #1': { url:'https://i.imgur.com/TuVjGQ0.png', filter:'opacity(75%)', size:1 },
'select-Math Nerd': { url:'https://i.imgur.com/J2qp6d3.png', filter:'opacity(75%)', size:1 },
'select-Art Deco Pattern': { url:'https://i.imgur.com/fMh734e.png', filter:'opacity(75%)', size:1 },
'select-Stars #4': { url:'https://i.imgur.com/ZeoZnWS.png', filter:'opacity(75%)', size:1 },
'select-Hearts #1': { url:'https://i.imgur.com/EURkRKu.png', filter:'opacity(75%)', size:1 },
'select-Asterisks': { url:'https://i.imgur.com/Fa1pMmp.png', filter:'opacity(75%)', size:1 },
'select-Motion Blur #1': { url:'https://i.imgur.com/lBTBElN.jpg', filter:'opacity(50%)', size:1 },
'select-Floor 40px Rough #1': { url:'https://i.imgur.com/6a5ePYR.jpg', filter:'', size:1 },
'select-Floor 40px Rough #2': { url:'https://i.imgur.com/X1Yachf.jpg', filter:'opacity(75%)', size:1 },
'select-Floor 40px Rough #3': { url:'https://i.imgur.com/Kb2S5X3.jpg', filter:'', size:1 },
'select-Floor 40px Rough #4': { url:'https://i.imgur.com/7TBVXRs.jpg', filter:'opacity(45%) saturate(0%)', size:0.5 },
'select-Floor 40px Rough #5': { url:'https://i.imgur.com/5gaUgev.jpg', filter:'', size:1 },
'select-Trans TEST 001': { url:'https://i.imgur.com/4b96sua.png', filter:'opacity(75%)', size:1 },
'select-Trans TEST 002': { url:'https://i.imgur.com/lcI4Hx1.png', filter:'opacity(75%)', size:1 },
'select-Trans TEST 003': { url:'https://i.imgur.com/fMCjAvf.png', filter:'opacity(75%)', size:1 },
'select-Trans TEST 004': { url:'https://i.imgur.com/wJNHlOZ.png', filter:'opacity(75%)', size:1 },
'select-Trans TEST 005': { url:'https://i.imgur.com/UN6zw3q.png', filter:'opacity(75%)', size:1 },
'select-Trans TEST 006': { url:'https://i.imgur.com/2TNzJGi.png', filter:'opacity(75%)', size:1 },
}, blurs: {
'select-Colorful': { url:'https://i.imgur.com/ESSRqxr.png', filter:'opacity(60%)', size:1 },
'select-Cloudy': { url:'https://i.imgur.com/RxKzBaq.jpg', filter:'opacity(50%) saturate(0%)', size:1 },
'select-RoL S5E': { url:'https://i.imgur.com/KhMaJab.jpg', filter:'opacity(80%)', size:0 },
'select-RoL H5': { url:'https://i.imgur.com/Yc8cJrN.jpg', filter:'opacity(80%)', size:0 },
'select-RoL H6': { url:'https://i.imgur.com/Yv5LAkw.jpg', filter:'opacity(80%)', size:0 },
'select-RoL H7': { url:'https://i.imgur.com/sZgRMmx.jpg', filter:'opacity(80%)', size:0 },
'select-RoL H7E': { url:'https://i.imgur.com/fLEJOC2.jpg', filter:'opacity(80%)', size:0 },
'select-RoL H10': { url:'https://i.imgur.com/3TSnXRN.jpg', filter:'opacity(80%)', size:0 },
'select-RoL H19': { url:'https://i.imgur.com/NuzcM79.jpg', filter:'opacity(80%)', size:0 },
'select-RoL H20': { url:'https://i.imgur.com/eurMute.jpg', filter:'opacity(80%)', size:0 },
'select-RoL S5': { url:'https://i.imgur.com/f9TPXkm.jpg', filter:'opacity(80%)', size:0 },
'select-Warm Machine #1': { url:'https://i.imgur.com/4Q3EvnQ.jpg', filter:'opacity(80%)', size:0 },
'select-Warm Machine #5': { url:'https://i.imgur.com/02ByzRf.jpg', filter:'opacity(80%)', size:0 },
'select-Benji3o3 Clouds #16': { url:'https://i.imgur.com/GiRLH4r.jpg', filter:'opacity(80%)', size:0 },
'select-jadereality #13': { url:'https://i.imgur.com/c9KFnOF.jpg', filter:'opacity(80%)', size:0 },
'select-sirius sdz #836': { url:'https://i.imgur.com/SyyLQU3.jpg', filter:'opacity(80%)', size:0 },
'select-DvA Dark Webs': { url:'https://i.imgur.com/EUv5bD6.jpg', filter:'opacity(65%)', size:1 },
'select-JoJo Blur #10': { url:'https://i.imgur.com/op31hwK.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Blur #17': { url:'https://i.imgur.com/KtZLHUI.jpg', filter:'opacity(80%)', size:1 },
'select-JoJo Blur #37': { url:'https://i.imgur.com/he1ldtK.jpg', filter:'opacity(80%)', size:1 },
'select-Spectrum Blur': { url:'https://i.imgur.com/0XbsaBx.jpg', filter:'opacity(80%)', size:0 },
'select-Icy Blur': { url:'https://i.imgur.com/cEg7W4l.jpg', filter:'opacity(80%)', size:0 },
'select-Rainy Afternoon Blur': { url:'https://i.imgur.com/uzUUFOq.jpg', filter:'opacity(80%)', size:0 },
'select-Vardo Blur': { url:'https://i.imgur.com/IIhIxFv.jpg', filter:'opacity(80%)', size:0 },
'select-Dark Neon Blur': { url:'https://i.imgur.com/4KaaNa1.jpg', filter:'opacity(80%)', size:0 },
'select-M4tchb0x Blur': { url:'https://i.imgur.com/LUbdc7W.jpg', filter:'opacity(80%)', size:0 },
'select-Galaxies Blur': { url:'https://i.imgur.com/S5G95Us.jpg', filter:'opacity(80%)', size:0 },
'select-Cloud Blur': { url:'https://i.imgur.com/inji5ca.png', filter:'opacity(80%)', size:0 },
'select-Red Seamless Blur #1': { url:'https://i.imgur.com/XFndyGl.jpg', filter:'opacity(80%)', size:0 },
'select-Blue Seamless Blur #1': { url:'https://i.imgur.com/yG9rF80.jpg', filter:'opacity(80%)', size:0 },
}, texture_floor1: {
}, texture_floor2: {
}, texture_floor3: {
}, texture_team: {
}, texture_endzone1: {
}, texture_endzone2: {
}, texture_walls1: { //
}, texture_walls2: {
}, texture_base: { //base circle images should be red (will be changed to blue/yellow) or greyscale
'select-Spiral': { url:'https://i.imgur.com/RKnIxci.png', filter:'opacity(25%)', xOffset:0, yOffset:0, size:1 },
'select-Base': { url:'https://i.imgur.com/6SyICNF.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.75 },
'select-Base #2': { url:'https://i.imgur.com/CcjHcfe.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.65 },
'select-Glow Circle': { url:'https://i.imgur.com/jzE7u1M.png', filter:'opacity(70%)', xOffset:0, yOffset:0, size:0.8 },
'select-Dragon': { url:'https://i.imgur.com/QZeByH6.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Bat': { url:'https://i.imgur.com/B1JIaUd.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Skull': { url:'https://i.imgur.com/bmvqc8c.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Glow #1': { url:'https://i.imgur.com/2B9dMH1.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Glow #2': { url:'https://i.imgur.com/Plz1adO.png', filter:'opacity(30%)', xOffset:0, yOffset:0, size:1 },
'select-Spiral Swirl': { url:'https://i.imgur.com/zHzOPME.png', filter:'opacity(30%)', xOffset:0, yOffset:0, size:1 },
'select-Portal': { url:'https://i.imgur.com/HTLzvVX.png', filter:'opacity(10%)', xOffset:0, yOffset:0, size:1.51 },
'select-Glow Ring': { url:'https://i.imgur.com/ETfjhCF.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Circles #3': { url:'https://i.imgur.com/qX6vboT.png', filter:'opacity(50%)', xOffset:0, yOffset:0, size:1 },
'select-Circles #4': { url:'https://i.imgur.com/2mGOoF8.png', filter:'opacity(30%) blur(2px)', xOffset:0, yOffset:0, size:0.75 },
'select-Tarantula': { url:'https://i.imgur.com/V6yJ0IC.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Tri-Circle': { url:'https://i.imgur.com/oxVX7pd.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Crossbones': { url:'https://i.imgur.com/FbBXXwZ.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:0.75 },
'select-Anarchy': { url:'https://i.imgur.com/rfcsZoA.png', filter:'opacity(20%)', xOffset:0, yOffset:5, size:1.2 },
'select-Jedi Order': { url:'https://i.imgur.com/oEGE2nj.png', filter:'opacity(40%)', xOffset:5, yOffset:-89, size:0.75 },
'select-Galactic Empire': { url:'https://i.imgur.com/0kHosuO.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Sith Empire': { url:'https://i.imgur.com/55Fn7hl.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Vader': { url:'https://i.imgur.com/Gc8CVUC.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:0.75 },
'select-Military Star': { url:'https://i.imgur.com/XqW4Phi.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Glow Cross': { url:'https://i.imgur.com/GXSXRMR.png', filter:'opacity(60%)', xOffset:6, yOffset:0, size:1 },
'select-Circle Ridge': { url:'https://i.imgur.com/nRqxXs6.png', filter:'opacity(25%) saturate(0)', xOffset:0, yOffset:0, size:1 },
'select-Pentagram': { url:'https://i.imgur.com/tpLizjA.png', filter:'opacity(30%) saturate(0)', xOffset:10, yOffset:10, size:1 },
'select-Nautical': { url:'https://i.imgur.com/oOWCSvb.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Pentagram #2': { url:'https://i.imgur.com/t3GQiQa.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Narrow Star #1': { url:'https://i.imgur.com/2DBk3cX.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Narrow Star #2': { url:'https://i.imgur.com/feGc4ye.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Concentric': { url:'https://i.imgur.com/kA3AGGT.png', filter:'opacity(40%)', xOffset:9, yOffset:-7, size:1 },
'select-Dr Who': { url:'https://i.imgur.com/vt3YHR0.png', filter:'opacity(40%)', xOffset:-10, yOffset:-26, size:1 },
'select-Warble': { url:'https://i.imgur.com/OZUqqXj.png', filter:'opacity(30%)', xOffset:-10, yOffset:20, size:1 },
'select-Atom': { url:'https://i.imgur.com/RxxLf3Q.png', filter:'opacity(30%)', xOffset:-18, yOffset:-23, size:1 },
'select-Claw': { url:'https://i.imgur.com/EZoFhNq.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Claw #2': { url:'https://i.imgur.com/CgNNFN1.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Claw #3': { url:'https://i.imgur.com/LQ3tZLV.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Claw #4': { url:'https://i.imgur.com/8i98NWX.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Ironman': { url:'https://i.imgur.com/KCLgQ3E.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Biohazard #1': { url:'https://i.imgur.com/kdcwYBx.png', filter:'opacity(20%)', xOffset:0, yOffset:-26, size:0.6 },
'select-Biohazard #2': { url:'https://i.imgur.com/Y5mjIlK.png', filter:'opacity(20%)', xOffset:-1, yOffset:-14, size:1 },
'select-Elden Ring': { url:'https://i.imgur.com/z7n07JO.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Solar Eclipse': { url:'https://i.imgur.com/Elt69uf.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Fine Circles': { url:'https://i.imgur.com/lIesRpr.png', filter:'opacity(80%)', xOffset:0, yOffset:0, size:1 },
'select-Worn Circles': { url:'https://i.imgur.com/NFBAN2G.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Hud #1': { url:'https://i.imgur.com/nlm6MrA.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:1 },
'select-Snowflake': { url:'https://i.imgur.com/NUsNy3Y.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.65 },
'select-Painted Hex': { url:'https://i.imgur.com/4bjTKwE.png', filter:'opacity(50%)', xOffset:0, yOffset:0, size:1 },
'select-Octagon Pad': { url:'https://i.imgur.com/L8xZCxo.png', filter:'opacity(50%)', xOffset:0, yOffset:0, size:1 },
'select-Death Circle': { url:'https://i.imgur.com/4jn75MV.png', filter:'opacity(50%)', xOffset:0, yOffset:0, size:1 },
'select-SpaceX Pad': { url:'https://i.imgur.com/shc25X8.png', filter:'opacity(50%)', xOffset:0, yOffset:0, size:1 },
'select-Patchy Square': { url:'https://i.imgur.com/euqo6i2.png', filter:'drop-shadow(0 0 5px red) drop-shadow(0 0 10px red)', xOffset:0, yOffset:0, size:1 },
'select-Patchy Circle': { url:'https://i.imgur.com/jE78710.png', filter:'opacity(60%) sepia(50%) drop-shadow(0 0 5px red) drop-shadow(0 0 10px red)', xOffset:0, yOffset:0, size:1 },
'select-Hud #3': { url:'https://i.imgur.com/PosGb6e.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Tech Lines #1': { url:'https://i.imgur.com/fyBdOFT.png', filter:'opacity(40%)', xOffset:0, yOffset:0, size:1 },
'select-Joker': { url:'https://i.imgur.com/LkEX4xB.png', filter:'opacity(50%)', xOffset:-30, yOffset:50, size:1 },
'select-Compass': { url:'https://i.imgur.com/l46vo3v.png', filter:'opacity(75%)', xOffset:0, yOffset:-1, size:0.7 },
'select-Clock #1': { url:'https://i.imgur.com/JLWg08P.png', filter:'opacity(35%)', xOffset:0, yOffset:0, size:0.75 },
'select-Swirl Lines': { url:'https://i.imgur.com/XF3dcWf.png', filter:'opacity(75%)', xOffset:-16, yOffset:0, size:1 },
}, texture_center: {
'select-TagPro Logo': { url:'https://i.imgur.com/G2h3WP5.png', filter:'opacity(20%) saturate(50%) blur(1px)', size:0.6 },
'select-TagPro Logo #2': { url:'https://i.imgur.com/cIpth8S.png', filter:'opacity(20%) saturate(50%) blur(1px)', size:0.8 },
'select-TagPro Logo #3': { url:'https://i.imgur.com/2y8767N.png', filter:'opacity(20%)', size:1 },
'select-TagPro Logo #4': { url:'https://i.imgur.com/8HIeuv4.png', filter:'opacity(20%)', size:1 },
'select-TagPro Logo #5': { url:'https://i.imgur.com/hqJlXba.png', filter:'opacity(20%) drop-shadow(2px 2px 3px black)', size:1 },
'select-TagPro Logo #6': { url:'https://i.imgur.com/7rHb8f8.png', filter:'opacity(20%)', size:1 },
'select-KoalaBeast Logo': { url:'https://i.imgur.com/R6axQtK.png', filter:'opacity(20%) saturate(80%) blur(5px)', size:0.8 },
'select-ELTP Logo': { url:'https://i.imgur.com/syVup7g.png', filter:'opacity(20%) saturate(50%) blur(1px)', size:0.6 },
'select-MLTP Logo': { url:'https://i.imgur.com/nRM5kmC.png', filter:'opacity(20%) saturate(50%) blur(1px)', size:0.8 },
'select-NLTP Logo': { url:'https://i.imgur.com/RPd5NpZ.png', filter:'opacity(20%) saturate(50%) blur(1px)', size:0.75 },
'select-OLTP Logo': { url:'https://i.imgur.com/UhOJ1zr.png', filter:'opacity(20%) saturate(50%) blur(1px)', size:1 },
'select-Jacko': { url:'https://i.imgur.com/dqDtvDY.png', filter:'', size:0.6 },
'select-Witch': { url:'https://i.imgur.com/GX2jRJz.png', filter:'', size:0.6 },
}, texture_ballskins: {
'select-Skins': { url:'https://i.imgur.com/A6NQOU2.png', filter:'', xOffset:0, yOffset:0, size:1 },
}, background: { //add links here to use your own background images (change name to 'value-NameOfYourImage')...
'value-Blur #1': { url:'https://i.imgur.com/NydUdaz.jpg' },
'value-Blur #2': { url:'https://i.imgur.com/SJ4nAao.jpg' },
'value-Blur #3': { url:'https://i.imgur.com/2KyAV3L.jpg' },
'value-Blur #4': { url:'https://i.imgur.com/XFndyGl.jpg' },
'value-Blur #5': { url:'https://i.imgur.com/yG9rF80.jpg' },
'value-Blur #6': { url:'https://i.imgur.com/tYiLKhP.jpg' },
'value-Blur #7': { url:'https://i.imgur.com/6WbMP5i.jpg' },
'value-Blur #8': { url:'https://i.imgur.com/fF9fzGF.jpg' },
'value-Blur #9': { url:'https://i.imgur.com/PP3cd9V.jpg' },
'value-Blur #10': { url:'https://i.imgur.com/MJgqOgB.jpg' },
'value-Blur #11': { url:'https://i.imgur.com/O4WrrVv.jpg' },
'value-Blur #12': { url:'https://i.imgur.com/Pp33Z4n.jpg' },
'value-Blur #13': { url:'https://i.imgur.com/D1BGcKt.jpg' },
'value-Blur #14': { url:'https://i.imgur.com/T8qTI8r.jpg' },
}, preset: {
'select-Plain Floor': {"plainfloor":true,"plainteam":true,"teamtile_filter":"opacity(60%)","plainendzone":true,"endzone_checker1_size":"10","endzone_checker1_opacity":"0.5","endzone_checker1_normal":true,"plainfloor_color":"auto","plainteam_color_red":"auto","plainteam_color_blue":"auto","plainteam_color_yellow":"auto","plainendzone_color_red":"auto","plainendzone_color_blue":"auto"},
'select-Checkered #1': {"background":"value-radial","floortile_opacity":"0.75","grid1_size":"40","grid1_opacity":"0.08","grid1_square":true,"grid1_gco":"lighter","checker1_size":"40","checker1_opacity":"0.4","checker1_normal":true,"texture_floor2":"select-Abstract #1","texture_floor2_filter":"opacity(35%) saturate(40%)","plainteam":true,"texture_team":"select-Shiny Pattern","texture_team_filter":"opacity(40%) saturate(0%)","texture_team_size":"2.5","plainwalls_color_use":true,"texture_walls2":"select-Fractal #1","texture_walls2_filter":"opacity(20%) invert(100%) saturate(0) contrast(300%)","walls_filter":"drop-shadow(3px 3px 4px rgba(0,0,0,0.8)) brightness(75%)","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"2","wall_light1_constant":"2.2","wall_light1_exponent":"10","wall_light1_offset":"-500","basecircle1_linewidth":"6","basecircle1_opacity":"0.4","basecircle1_blur":"1","basecircle1_dashpattern":"40,10","centerline_linewidth":"1","flagline_linewidth":"2","spikes_border_linewidth":"4","spikes_border_opacity":"0.65","spikes_border_radius":"3","gates_neutral_tile_opacity":"0.65","gates_neutral_margin":"1","boosts_outline":true,"clear_under_team_tiles":true,"clear_under_endzone_tiles":true,"background_color1":"#00ffff","background_color2":"#1e003c","grid1_color":"#9e9e9e","checker1_color":"#90a4ae","plainteam_color_yellow":"#fff59d","plainwalls_color":"#e3f2fd","wall_light1_color":"#eeeeee","spikes_border_color":"#33691e","boosts_outline_color_red":"#000000","boosts_outline_color_blue":"#000000","boosts_outline_color_yellow":"#000000","texture_tiles":"https://i.imgur.com/vtgmsDB.png","texture_speedpad":"https://i.imgur.com/OLwHYUu.png","texture_speedpadRed":"https://i.imgur.com/zoJaXCx.png","texture_speedpadBlue":"https://i.imgur.com/wn5q6v6.png","texture_portal":"https://i.imgur.com/mQie8Sb.png","texture_portalRed":"https://i.imgur.com/OuIi3gG.png","texture_portalBlue":"https://i.imgur.com/YkMocQ4.png","texture_splats":"https://i.imgur.com/bEPAfag.png","texture_gravityWell":""},
'select-Checkered #2': {"background":"value-Blur #13","plainfloor":true,"plainfloor_color_use":true,"floor_gradient1":true,"floor_gradient1_type":"value-diagonal","floor_gradient1_opacity1":"0.2","floor_gradient1_repeats":"2","checker1_size":"40","checker1_opacity_min":"0.01","checker1_density":"0.4","checker1_random":true,"plainteam":true,"plainteam_color_use":true,"texture_team":"select-Benji3o3 Clouds #16","texture_team_filter":"opacity(40%) saturate(20%)","texture_team_size":"0.35","texture_team_gco":"exclusion","teamtile_filter":"drop-shadow(0 0 1px rgba(0,0,0,0.35)) opacity(50%) brightness(80%)","clear_under_team_tiles":true,"plainendzone":true,"texture_endzone1":"select-Rotated Checker","texture_endzone1_filter":"opacity(40%)","texture_endzone1_size":"0.4","texture_endzone1_gco":"luminosity","endzone_filter":"drop-shadow(0 0 1px black)","plainwalls_color_use":true,"plainwalls_hardlight":true,"walloutline3_size":"2","walloutline3_opacity":"0.5","walloutline3_exclusion":true,"texture_walls1":"select-Green Lightning","texture_walls1_filter":"opacity(35%) saturate(0%)","texture_walls1_gco":"hard-light","texture_walls2":"select-Metal","texture_walls2_filter":"opacity(45%) saturate(0%)","texture_walls2_gco":"hard-light","walls_filter":"drop-shadow(4px 4px 2px rgba(0,0,0,0.65))","wall_light1":true,"wall_light1_position":"left","wall_light1_blur":"1","wall_light1_surfaceScale":"10","wall_light1_constant":"2","wall_light1_exponent":"10","wall_light2":true,"wall_light2_position":"right","wall_light2_blur":"1","wall_light2_surfaceScale":"10","wall_light2_constant":"2.65","wall_light2_exponent":"10","basecircle1_opacity":"0.15","basecircle1_dashpattern":"5,205","basecircle2_linewidth":"4","basecircle2_opacity":"0.2","balls_plain":true,"ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_scale_red":"0.5","ballskins_filter_red":"invert(90%)","ballskins_scale_blue":"0.5","ballskins_filter_blue":"invert(90%)","ball_outline3":true,"ball_outline3_radius":"12","ball_outline3_opacity":"0.6","ball_outline3_gco":"source-atop","ball_outline4":true,"ball_outline4_linewidth":"2","ball_outline4_radius":"19","ball_outline4_opacity":"0.6","ball_outline4_gco":"source-atop","spikes_border_linewidth":"1","spikes_border_opacity":"0.5","spikes_border_radius":"7","spikes_filter":"brightness(200%) contrast(150%) drop-shadow(2px 2px 2px rgba(0,0,0,0.75))","bombs_shine":true,"gates_neutral_tile_opacity":"0.65","gates_neutral_margin":"1","gate_shadows":true,"pups_add_shine":true,"pups_bottom_shadow":true,"pups_bottom_shadow_opacity_coefficient":"0.8","boosts_generic":true,"boosts_generic_texture_opacity":"1","boosts_generic_border_linewidth":"1","boosts_generic_border_opacity":"0.25","boosts_outline":true,"boosts_outline_opacity":"0.7","plainfloor_color":"#c9c9c9","floor_gradient1_color1":"#616161","checker1_color":"#17202a","plainteam_color_yellow":"#fdd835","plainwalls_color":"#566573","walloutline3_color":"#abb2b9","wall_light1_color":"#d5d8dc","wall_light2_color":"#d5d8dc","basecircle2_color_yellow":"#212121","basecircle2_color_red":"#212121","basecircle2_color_blue":"#212121","spikes_tint_color":"#9c27b0","spikes_border_color":"#bdbdbd","bombs_tint_color":"#ff5722","boosts_generic_yellow_color":"#000000","boosts_generic_inner_arrows_color":"#000000","boosts_outline_color_yellow":"#616161","ballskins_red_x":"192","ballskins_red_y":"144","ballskins_blue_x":"192","ballskins_blue_y":"144","texture_tiles":"/textures/flat/tiles.png","texture_speedpad":"/textures/flat/speedpad.png","texture_speedpadRed":"/textures/flat/speedpadred.png","texture_speedpadBlue":"/textures/flat/speedpadblue.png","texture_portal":"/textures/flat/portal.png","texture_portalRed":"https://i.imgur.com/AKwJbW3.png","texture_portalBlue":"https://i.imgur.com/ycYwyyg.png","texture_splats":"/textures/flat/splats.png","texture_gravityWell":""},
'select-Aurora': {"background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Abstract Aurora","texture_floor1_filter":"opacity(12%) blur(2px) brightness(125%) contrast(150%) saturate(45%)","texture_floor2":"select-Dark Neon Blur","texture_floor2_filter":"opacity(40%)","plainteam":true,"texture_team":"select-Rain #3","texture_team_filter":"opacity(20%)","teamtile_checker_size":"2","teamtile_checker_margin":"1","teamtile_checker_opacity":"0.1","teamtile_checker_normal":true,"teamtile_filter":"opacity(60%) saturate(70%)","plainendzone":true,"texture_endzone1":"select-Diagonal Pattern #3","texture_endzone1_filter":"opacity(80%) invert(100%) blur(1px)","texture_endzone1_gco":"luminosity","endzone_filter":"brightness(110%) contrast(100%) drop-shadow(2px 0px 3px rgba(0,0,0,0.5)) drop-shadow(-2px 0px 3px rgba(0,0,0,0.5)) drop-shadow(0px 2px 3px rgba(0,0,0,0.5)) drop-shadow(0px -2px 3px rgba(0,0,0,0.5))","plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"2","walloutline3_opacity":"0.25","walloutline3_exclusion":true,"texture_walls2":"select-Motion Blur #1","texture_walls2_filter":"opacity(40%) hue-rotate(70deg) saturate(40%)","walls_filter":"drop-shadow(3px 3px 2px black)","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"5","wall_light1_constant":"3","wall_light1_exponent":"10","wall_light1_offset":"-500","wall_light1_z":"500","wall_light2":true,"wall_light2_blur":"2","wall_light2_surfaceScale":"5","wall_light2_constant":"3.65","wall_text_fontsize":"16","wall_text_opacity":"0.85","wall_text_stroke_opacity":"0","wall_text_flip":true,"basecircle1_linewidth":"6","basecircle1_radius":"265","basecircle1_opacity":"0.25","basecircle1_dashpattern":"40,10","basecircle1_segments":"4","ball_gradient_position":"0.55","ball_gradient_opacity1_red":"0.5","ball_gradient_opacity1_blue":"0.5","ball_outline1":true,"ballskins":true,"ballskins_gco":"luminosity","ballskins_scale_red":"0.75","ballskins_filter_red":"opacity(40%)","ballskins_scale_blue":"0.75","ballskins_filter_blue":"opacity(40%)","spikes_generic":true,"buttons_generic":true,"buttons_shine":true,"bombs_generic":true,"bombs_fuse":true,"bombs_shine":true,"bombs_outline1":true,"bombs_outline1_segments":"0","bombs_outline1_radius":"14","bombs_draw_exploded_opacity":"0.2","bombs_filter":"drop-shadow(0 0 6px rgba(255,140,255,0.5))","gates_neutral_tile_opacity":"0.4","gates_plain_grb_gradient":true,"gates_plain_grb_gradient_opacity":"0.25","gates_plain_grb_gradient_size":"7","gates_plain_grb_gradient_gco":"overlay","gates_plain_grb_detail":true,"gates_plain_grb_detail_linewidth":"3","gates_plain_grb_detail_size":"1","gates_plain_grb_detail_margin":"4","gates_plain_grb_detail_opacity":"0.65","gates_plain_grb_detail_drawCircles":true,"gates_plain_grb_detail_dropShadow":true,"gates_plain_grb_detail_dropShadowBlack":true,"gates_glow_outline":true,"gate_shadows":true,"flags_outline":true,"flags_outline_linewidth":"2","pups_tint_jj":true,"pups_tint_rb":true,"pups_tint_tp":true,"pups_glow":true,"boosts_generic":true,"boosts_generic_border_linewidth":"2","boosts_generic_border_opacity":"0.25","boosts_generic_segments":true,"boosts_generic_segments_linewidth":"3","boosts_generic_segments_blur":"1","boosts_outline":true,"boosts_outline_linewidth":"3.5","boosts_outline_opacity":"0.35","background_color1":"#101010","background_color2":"#2c3e50","plainfloor_color":"#04070b","walloutline3_color":"#abb2b9","wall_light1_color":"#689f38","wall_light2_color":"#4585a2","wall_text_color":"#fafafa","ball_gradient_color1_red":"#800000","ball_gradient_color1_blue":"#002140","buttons_generic_color_inner":"#8e24aa","buttons_generic_color_outer":"#000000","buttons_generic_color_border":"#d5d8dc","bombs_generic_color":"#212121","bombs_fuse_color":"#e91e63","gates_plain_grb_gradient_green":"#000000","gates_plain_grb_gradient_red":"#000000","gates_plain_grb_gradient_blue":"#000000","gates_plain_grb_detail_green":"#d1ffd2","gates_plain_grb_detail_red":"#ffcdd2","gates_plain_grb_detail_blue":"#e1f5fe","pups_tint_jj_color":"#4dd0e1","pups_tint_rb_color":"#ff7043","pups_tint_tp_color":"#00ff80","boosts_outline_color_red":"#c62828","boosts_outline_color_blue":"#01579b","boosts_outline_color_yellow":"#ffeb3b","ballskins_red_x":"0","ballskins_red_y":"192","ballskins_blue_x":"0","ballskins_blue_y":"192","texture_tiles":"/textures/nom/tiles.png","texture_speedpad":"/textures/nom/speedpad.png","texture_speedpadRed":"/textures/nom/speedpadred.png","texture_speedpadBlue":"/textures/nom/speedpadblue.png","texture_portal":"/textures/nom/portal.png","texture_portalRed":"/textures/nom/portalred.png","texture_portalBlue":"/textures/nom/portalblue.png","texture_splats":"/textures/nom/splats.png","texture_gravityWell":""},
'select-Neon Glow': {"background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"hexagon_size":"36","hexagon_margin":"3","hexagon_fill_opacity":"0.4","hexagon_destination_out":true,"plainteam":true,"plainteam_color_use":true,"teamtile_gradient_type":"value-crisscross","teamtile_gradient_size":"20","teamtile_gradient_opacity":"0.5","teamtile_gradient_destination_out":true,"teamtile_filter":"opacity(60%)","plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Jigsaw","texture_endzone1_filter":"opacity(65%) contrast(200%)","texture_endzone1_gco":"hard-light","plainwalls":true,"plainwalls_color_use":true,"wallshadow_size":"0","wallshadow_blur":"4","wallshadow_opacity":"1","wallshadow_multiplier":"2","wallshadow_inner":true,"wallshadow_outer":true,"walloutline2_size":"3","wall_text_fontsize":"28","wall_text_opacity":"1","map_outer_filter":"drop-shadow(0px 0px 45px #4527a0) drop-shadow(0px 0px 45px #4527a0)","map_outer_shrink":true,"basecircle1_opacity":"1","basecircle1_glow":"5","basecircle1_glow_multiplier":"3","basecircle1_dashpattern":"40,10","basecircle2_radius":"160","basecircle2_opacity":"1","basecircle2_glow":"5","basecircle2_glow_multiplier":"2","basecircle2_dashpattern":"20,8","balls_plain":true,"ballskins":true,"ballskins_gco":"destination-atop","ballskins_tint_red":true,"ballskins_tint_red_hardlight":true,"ballskins_tint_blue":true,"ballskins_tint_blue_hardlight":true,"ballskins_scale_red":"1.6","ballskins_scale_blue":"1.6","ball_outline3":true,"ball_outline3_radius":"18","ballglow":true,"ballglow_size":"40","ballglow_opacity":"0.8","ballglow_blur":"15","ballglow_holesize":"18","ballglow_tintpups":true,"ballglow_behind":true,"ballglow_19pxhole":false,"spikes_generic":true,"spikes_filter":"drop-shadow(0px 0px 6px #ff5722)","bombs_outline1":true,"bombs_outline1_radius":"14","bombs_filter":"drop-shadow(0 0 12px rgba(255, 153, 255, 0.5)) drop-shadow(0 0 5px #ff99ff)","gates_plain_grb_border":true,"gates_plain_grb_border_40px":true,"gates_glow_outline":true,"gates_glow_outline_opacity":"1","flags_outline":true,"flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"boosts_outline":true,"background_color1":"#000000","plainfloor_color":"#000000","hexagon_stroke_color":"#ff0000","plainteam_color_blue":"#1976d2","teamtile_gradient_color":"#000000","plainwalls_color":"#040406","wallshadow_color":"#4527a0","walloutline2_color":"#ffffff","wall_text_color":"#673ab7","wall_text_stroke_color":"#673ab7","balls_plain_color_red":"#f44336","balls_plain_color_blue":"#1e88e5","ballskins_tint_blue_color":"#0288d1","ball_outline3_color_red":"auto","ball_outline3_color_blue":"auto","gates_glow_outline_color_blue":"auto","ballskins_red_x":"288","ballskins_red_y":"192","ballskins_blue_x":"288","ballskins_blue_y":"192","texture_tiles":"https://i.imgur.com/ciiB8Pw.png","texture_speedpad":"https://i.imgur.com/IB95nd5.png","texture_speedpadRed":"https://i.imgur.com/8RgHd1Y.png","texture_speedpadBlue":"https://i.imgur.com/E3gqIdZ.png","texture_portal":"https://i.imgur.com/H1e5f5X.png","texture_portalRed":"https://i.imgur.com/QKzxfS7.png","texture_portalBlue":"https://i.imgur.com/cm14IOy.png","texture_splats":"https://i.imgur.com/yMbLHLT.png","texture_gravityWell":""},
'select-BioHazard': {"background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Dark Concrete Slate Tile (40px)","texture_floor1_gco":"lighten","floor_contour":true,"checker1_size":"40","checker1_opacity":"0.1","checker1_random":true,"texture_floor2":"select-Grunge #5","texture_floor2_filter":"opacity(50%)","texture_floor2_gco":"difference","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Rain #1","texture_team_filter":"opacity(30%)","texture_team_gco":"luminosity","teamtile_filter":"brightness(80%) opacity(50%)","plainendzone":true,"texture_endzone1":"select-Carbon Fibre","texture_endzone1_filter":"opacity(90%) saturate(0%)","endzone_filter":"brightness(150%) contrast(120%)","plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"1","walloutline3_opacity":"0.6","texture_walls1":"select-Metal","texture_walls1_filter":"opacity(45%) saturate(0%) brightness(80%) contrast(150%)","texture_walls2":"select-Water Drops","texture_walls2_filter":"opacity(50%) blur(8px)","texture_walls2_size":"1.25","walls_filter":"drop-shadow(4px 4px 6px rgba(0,0,0,0.8)) drop-shadow(2px 2px 4px rgba(0,0,0,0.5)) brightness(200%) saturate(0)","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"2","wall_light1_constant":"2.25","wall_light1_exponent":"30","wall_light1_offset":"-200","wall_light1_z":"500","wall_light2":true,"wall_light2_blur":"2","wall_light2_surfaceScale":"2","wall_light2_constant":"2.25","wall_light2_exponent":"30","wall_light2_offset":"-200","wall_light2_z":"500","wall_text_fontsize":"26","wall_text_smallcaps":true,"wall_text_opacity":"0.75","wall_text_stroke_opacity":"0","wall_text_filter":"drop-shadow(2px 2px 0px black)","basecircle1_linewidth":"3","basecircle1_radius":"260","basecircle1_opacity":"0.6","basecircle1_glow":"8","basecircle1_glow_multiplier":"3","texture_base":"select-Biohazard #2","texture_base_filter":"opacity(40%) drop-shadow(1px 1px 1px white)","texture_base_size":"0.65","texture_base_gradient_opacity1_red":"0.25","texture_base_gradient_opacity1_blue":"0.25","ball_outline3":true,"ball_outline3_linewidth":"5","ball_outline3_radius":"10","ball_outline3_gco":"destination-out","bombs_filter":"drop-shadow(0 1px 3px #000000)","gates_neutral_tile_opacity":"0.65","gates_neutral_margin":"1","gates_grb_tile_opacity":"0.35","gates_plain_grb_base":true,"gates_plain_grb_base_opacity":"0.65","gates_plain_grb_pyramid":true,"gates_plain_grb_pyramid_margin":"2","gates_plain_grb_pyramid_useAltStyle":true,"gates_plain_grb_cross":true,"gates_plain_grb_cross_opacity":"0.65","gates_plain_grb_cross_shadow":"1","gates_plain_grb_detail":true,"gates_plain_grb_detail_linewidth":"5","gates_plain_grb_detail_size":"5","gates_plain_grb_detail_margin":"6","gates_plain_grb_detail_drawLines":true,"gates_plain_grb_detail_drawInCenter":true,"gates_plain_grb_detail_destinationOut":true,"gates_plain_grb_border":true,"gates_plain_grb_border_linewidth":"2","gates_plain_grb_border_strokeOpacity":"0.35","gates_plain_grb_border_40px":true,"gate_shadows":true,"flags_outline":true,"flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"clear_under_team_tiles":true,"clear_under_endzone_tiles":true,"background_color1":"#101623","background_color2":"#3c0b0b","plainfloor_color":"#566573","plainteam_color_red":"#a30d0d","plainteam_color_blue":"#0d47a1","plainteam_color_yellow":"#666600","plainwalls_color":"#0f101c","walloutline3_color":"#cfd8dc","wall_light1_color":"#ef5350","wall_light2_color":"#00ffff","wall_text_color":"#b0bec5","wall_text_stroke_color":"#ffffff","gates_plain_grb_base_green":"#2bee2b","gates_plain_grb_base_red":"#e42121","gates_plain_grb_base_blue":"#206fee","gates_plain_grb_border_green":"#ffffff","gates_plain_grb_border_red":"#ffffff","gates_plain_grb_border_blue":"#ffffff","clear_under_team_tiles_color":"#17202a","clear_under_endzone_tiles_color":"#17202a","texture_tiles":"https://i.imgur.com/xw3lN2o.png","texture_speedpad":"https://i.imgur.com/22t8hoV.png","texture_speedpadRed":"https://i.imgur.com/EfQFr4G.png","texture_speedpadBlue":"https://i.imgur.com/hPMDhD5.png","texture_portal":"https://i.imgur.com/lfczV8G.png","texture_portalRed":"https://i.imgur.com/fb4HOtl.png","texture_portalBlue":"https://i.imgur.com/verk4xJ.png","texture_splats":"https://i.imgur.com/F799BFp.png","texture_gravityWell":""},
'select-Half-Life 2 #1': {"background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-HL2 Tile #2","texture_floor1_filter":"opacity(50%)","texture_floor1_size":"0.75","texture_floor1_gco":"luminosity","floor_contour":true,"floor_contour_opacity":"0.8","floor_contour_size":"100","floor_contour_multiplier":"2","plainteam":true,"teamtile_filter":"opacity(50%)","plainendzone":true,"texture_endzone1":"select-HL2 Tile #3","texture_endzone1_filter":"opacity(50%) saturate(0) brightness(150%) contrast(500%)","texture_endzone1_size":"0.15625","texture_endzone1_gco":"hard-light","walloutline3_size":"2","walloutline3_opacity":"0.5","walls_filter":"brightness(85%) contrast(150%) drop-shadow(4px 4px 5px black) drop-shadow(2px 2px 3px rgba(0,0,0,0.5))","basecircle1_linewidth":"2","basecircle1_radius":"220","basecircle1_opacity":"1","basecircle1_glow":"4","basecircle1_glow_multiplier":"3","basecircle1_dashpattern":"40,10, 10,5, 5,5, 10,10","basecircle1_segments":"8","ball_gradient":true,"ball_gradient_position":"0.35","ball_gradient_opacity1_red":"0.4","ball_gradient_opacity2_red":"0.5","ball_gradient_opacity1_blue":"0.4","ball_gradient_opacity2_blue":"0.5","ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ball_outline2":true,"ball_outline2_radius":"12","ball_outline2_opacity":"0.7","ball_outline2_gco":"source-atop","ball_star_red":true,"ball_star_red_linewidth":"0","ball_star_red_innerradius":"2","ball_star_blue":true,"ball_star_blue_linewidth":"0","ball_star_blue_innerradius":"2","ball_outline3":true,"ball_outline3_dashpattern":"16,8","ball_outline3_opacity":"0.65","ball_outline3_gco":"source-atop","spikes_generic":true,"spikes_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","bombs_clip_30px":true,"bombs_draw_exploded_opacity":"0.2","bombs_filter":"drop-shadow(0 0 10px rgba(255, 153, 255, 0.6))","gates_neutral_tile_opacity":"0","gates_plain_neutral_detail":true,"gates_plain_neutral_detail_size":"5","gates_plain_neutral_detail_margin":"0","gates_plain_neutral_detail_drawCorners":true,"gates_plain_neutral_border":true,"gates_plain_neutral_border_strokeOpacity":"0.2","gate_shadows":true,"flags_outline":true,"flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"pups_glow_outline_linewidth":"1","pups_add_shine":true,"pups_filter":"drop-shadow(2px 2px 1px rgba(0,0,0,0.8)) drop-shadow(2px 2px 3px rgba(0,0,0,0.6))","boosts_glow":true,"boosts_glow_radius":"16","boosts_glow_radius_inner":"0","boosts_glow_radius_outer":"8","boosts_glow_opacity_outer":"0.65","boosts_glow_hole_radius":"15","boosts_glow_hole_blur":"1","background_color1":"#212121","background_color2":"#002018","plainfloor_color":"#060b13","plainteam_color_red":"#a30d0d","plainteam_color_blue":"#0d47a1","plainteam_color_yellow":"#666600","walloutline3_color":"#abb2b9","ball_gradient_color1_red":"#220202","ball_gradient_color2_red":"#ffcdd2","ball_gradient_color1_blue":"#021a31","ball_gradient_color2_blue":"#b3e5fc","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#ffffff","ball_outline2_color_blue":"#ffffff","ball_star_red_fill_color":"#ef9a9a","ball_star_blue_fill_color":"#81d4fa","ball_outline3_color_red":"#ffffff","ball_outline3_color_blue":"#ffffff","gates_plain_neutral_detail_neutral":"#ffffff","gates_plain_neutral_border_neutral":"#e0e0e0","pups_glow_color_jj":"#ffffff","pups_glow_color_rb":"#ffffff","pups_glow_color_tp":"#ffffff","boosts_glow_color_red":"#c62828","boosts_glow_color_blue":"#039be5","boosts_glow_color_yellow":"#e7e723","texture_tiles":"https://i.imgur.com/GxWFGOw.png","texture_speedpad":"https://i.imgur.com/yOg3mRf.png","texture_speedpadRed":"https://i.imgur.com/h91pElw.png","texture_speedpadBlue":"https://i.imgur.com/wJsqTgD.png","texture_portal":"https://i.imgur.com/gdJfGV9.png","texture_portalRed":"https://i.imgur.com/CwAswnO.png","texture_portalBlue":"https://i.imgur.com/Nc3z5R0.png","texture_splats":"https://i.imgur.com/GObCQoT.png","texture_gravityWell":""},
'select-Half-Life 2 #2': {"background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-HL2 Tile #1","texture_floor1_filter":"brightness(125%) contrast(50%) sepia(10%)","floor_contour":true,"floor_contour_size":"100","floor_contour_multiplier":"2","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Bumps","texture_team_filter":"opacity(30%) saturate(0%)","texture_team_size":"0.18","texture_team_gco":"hard-light","teamtile_filter":"opacity(25%) brightness(400%) saturate(80%) drop-shadow(0 0 1px black)","plainendzone":true,"plainendzone_color_use":true,"endzone_checker2_size":"20","endzone_checker2_opacity":".75","endzone_checker2_normal":true,"endzone_checker2_afterimage":true,"texture_endzone1":"select-40px Chunky","texture_endzone1_filter":"saturate(0%)","texture_endzone1_size":"0.5","texture_endzone1_gco":"hard-light","endzone_filter":"saturate(60%) brightness(110%) opacity(80%)","clear_under_endzone_tiles":true,"plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"2","walloutline3_opacity":"0.65","walloutline3_exclusion":true,"texture_walls1":"select-HL2 Metal #11","texture_walls1_filter":"opacity(60%) brightness(80%) contrast(150%) saturate(0)","texture_walls1_size":"0.8","walls_filter":"drop-shadow(0 0 7px black)","wall_light1":true,"wall_light1_surfaceScale":"7","wall_light1_constant":"2.7","wall_light1_exponent":"10","wall_light1_z":"300","wall_light2":true,"wall_light2_surfaceScale":"7","wall_light2_constant":"2.7","wall_light2_exponent":"10","wall_light2_z":"300","basecircle1_linewidth":"4","basecircle1_opacity":"0.4","basecircle1_glow":"4","basecircle1_glow_multiplier":"3","basecircle1_dashpattern":"40,10, 10,5, 5,5, 10,10","basecircle1_segments":"12","basecircle2_radius":"294","basecircle2_opacity":"1","basecircle2_glow":"4","basecircle2_glow_multiplier":"3","basecircle2_dashpattern":"45,12, 8,5, 10,10","basecircle2_segments":"12","ball_gradient_position":"0.45","ball_gradient_opacity1_red":"0.5","ball_gradient_opacity2_red":"0.5","ball_gradient_opacity1_blue":"0.5","ball_gradient_opacity2_blue":"0.5","ball_outline3":true,"ball_outline3_linewidth":"8","ball_outline3_radius":"4","ball_outline3_gco":"destination-out","ball_outline4":true,"ball_outline4_linewidth":"4","ball_outline4_radius":"8","ball_outline4_opacity":"0.85","ball_outline4_gco":"source-atop","buttons_shine":true,"gates_neutral_tile_opacity":"0","gates_plain_neutral_base":true,"gates_plain_neutral_base_opacity":"0.25","gates_plain_neutral_cross":true,"gates_plain_neutral_cross_margin":"13","gates_plain_neutral_cross_opacity":"0.65","gates_plain_neutral_border":true,"gates_plain_neutral_border_40px":true,"gates_grb_tile_opacity":"0","gates_plain_grb_base":true,"gates_plain_grb_cross":true,"gates_plain_grb_cross_margin":"13","gates_plain_grb_cross_opacity":"0.75","gates_plain_grb_cross_shadow":"2","gates_plain_grb_square":true,"gates_plain_grb_square_margin":"7","gates_plain_grb_square_fillOpacity":"0.25","gates_plain_grb_square_blur":"3","gates_plain_grb_square_raisedOutline":true,"gates_plain_grb_detail":true,"gates_plain_grb_detail_size":"5","gates_plain_grb_detail_margin":"3","gates_plain_grb_detail_drawLines":true,"gates_plain_grb_detail_dropShadow":true,"gates_plain_grb_border":true,"gates_plain_grb_border_linewidth":"4","gates_plain_grb_border_strokeOpacity":"0.8","gates_plain_grb_border_40px":true,"gate_shadows":true,"flags_generic_fill":true,"flags_generic_stroke":true,"flags_generic_gradient_opacity":"0.6","flags_outline":true,"pups_generic_jj_stroke":true,"pups_generic_jj_fill":true,"pups_generic_jj_shadow":true,"pups_generic_rb_stroke":true,"pups_generic_rb_fill":true,"pups_generic_rb_shadow":true,"pups_generic_tp_stroke":true,"pups_generic_tp_fill":true,"pups_generic_tp_shadow":true,"pups_generic_empty_stroke":true,"pups_generic_empty_fill":true,"pups_generic_empty_shadow":true,"pups_glow":true,"pups_filter":"drop-shadow(2px 2px 1px rgba(0,0,0,0.8)) drop-shadow(2px 2px 3px rgba(0,0,0,0.6))","boosts_generic":true,"boosts_generic_border_opacity":"0.85","boosts_generic_frames":"6","boosts_generic_segments":true,"boosts_generic_segments_linewidth":"3","boosts_generic_segments_blur":"2","boosts_generic_filter":"drop-shadow(1px 1px 0px rgba(0,0,0,0.5)) drop-shadow(2px 2px 1px rgba(0,0,0,0.5))","boosts_outline":true,"portals_generic":true,"portals_generic_blur":"1","portals_generic_frames":"8","portals_generic_border_linewidth":"1","fill_empty_with_walls":true,"background_color1":"#757575","background_color2":"#493536","plainfloor_color":"#fafafa","plainteam_color_red":"#cc0000","plainteam_color_blue":"#0613c6","plainteam_color_yellow":"#d1ce00","plainendzone_color_red":"#cc0000","plainendzone_color_blue":"#051fa3","endzone_checker2_color":"#ffffff","clear_under_endzone_tiles_color":"#000000","plainwalls_color":"#101010","walloutline3_color":"#78909c","wall_light1_color":"#d5d8dc","wall_light2_color":"#64b5f6","basecircle1_color_yellow":"#757575","basecircle1_color_red":"#757575","basecircle1_color_blue":"#757575","ball_gradient_color1_red":"#e57373","ball_gradient_color2_red":"#9e9e9e","ball_gradient_color1_blue":"#64b5f6","ball_gradient_color2_blue":"#9e9e9e","ball_outline4_color_red":"#ffffff","ball_outline4_color_blue":"#ffffff","spikes_tint_color":"#ffc107","gates_plain_neutral_base_neutral":"#212121","gates_plain_neutral_border_neutral":"#9e9e9e","gates_plain_grb_base_green":"#11a211","gates_plain_grb_base_red":"#9f1919","gates_plain_grb_base_blue":"#1536bc","gates_plain_grb_cross_green":"#fafafa","gates_plain_grb_cross_red":"#fafafa","gates_plain_grb_cross_blue":"#fafafa","gates_plain_grb_square_green":"#ffffff","gates_plain_grb_square_red":"#ffffff","gates_plain_grb_square_blue":"#ffffff","gates_plain_grb_detail_green":"#fafafa","gates_plain_grb_detail_red":"#fafafa","gates_plain_grb_detail_blue":"#fafafa","gates_plain_grb_border_green":"#fafafa","gates_plain_grb_border_red":"#fafafa","gates_plain_grb_border_blue":"#fafafa","flags_generic_fill_red":"#d32f2f","flags_generic_fill_blue":"#0c58bb","flags_generic_fill_yellow":"#eeee11","flags_generic_stroke_red":"#ffebee","flags_generic_stroke_blue":"#e3f2fd","flags_generic_stroke_yellow":"#fffde7","flags_generic_gradient_red":"#fafafa","flags_generic_gradient_blue":"#fafafa","flags_generic_gradient_yellow":"#fafafa","flags_generic_pole_color":"#fafafa","pups_generic_jj_color_border":"#e3f2fd","pups_generic_jj_color_fill":"#26c6da","pups_generic_rb_color_border":"#fff8e1","pups_generic_rb_color_fill":"#ff9800","pups_generic_tp_color_border":"#f0f4c3","pups_generic_tp_color_fill":"#43a047","pups_glow_color_jj":"#b3e5fc","pups_glow_color_rb":"#ffcc80","pups_glow_color_tp":"#6aec8a","boosts_generic_yellow_color":"#ffec42","boosts_generic_red_color":"#e92e2b","boosts_generic_blue_color":"#2364e7","boosts_generic_segments_yellow":"#fff9c4","boosts_generic_segments_red":"#ffcdd2","boosts_generic_segments_blue":"#b3e5fc","portals_generic_color":"#ec407a","portals_generic_color_alt":"#ffc107","portals_generic_color_background":"#212121","portals_generic_color_blue":"#0277bd","portals_generic_color_blue_alt":"#90caf9","texture_tiles":"/textures/coral/tiles.png","texture_speedpad":"/textures/coral/speedpad.png","texture_speedpadRed":"/textures/coral/speedpadred.png","texture_speedpadBlue":"/textures/coral/speedpadblue.png","texture_portal":"/textures/coral/portal.png","texture_portalRed":"/textures/coral/portalred.png","texture_portalBlue":"/textures/coral/portalblue.png","texture_splats":"/textures/coral/splats.png","texture_gravityWell":""},
'select-Half-Life 2 #3': {"background_size1":"40","background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-HL2 Metal #14","texture_floor1_filter":"opacity(60%)","texture_floor1_size":"0.9375","texture_floor1_gco":"","floor_contour":true,"floor_contour_opacity":"0.8","floor_contour_multiplier":"3","plainteam":true,"teamtile_gradient_type":"value-crisscross","teamtile_gradient_size":"40","teamtile_gradient_opacity":"0.25","teamtile_gradient_destination_out":true,"texture_team":"select-DestOut Dots #4","texture_team_size":"0.25","texture_team_gco":"destination-out","teamtile_filter":"opacity(65%)","plainendzone":true,"texture_endzone1":"select-HL2 Tile #3","texture_endzone1_filter":"opacity(50%)","texture_endzone1_size":".3125","endzone_filter":"brightness(150%) drop-shadow(0 0 1px white)","walloutline2_size":"3","walloutline3_size":"2","walloutline3_opacity":"0.5","texture_walls1":"select-HL2 Concrete #7","texture_walls1_filter":"opacity(60%)","walls_filter":"drop-shadow(4px 4px 5px black)","basecircle1_linewidth":"2","basecircle1_radius":"340","basecircle1_opacity":"1","basecircle1_blur":"1","basecircle1_glow":"4","basecircle1_glow_multiplier":"3","basecircle1_dashpattern":"40,13.4071","basecircle2_linewidth":"2","basecircle2_radius":"240","basecircle2_opacity":"1","basecircle2_blur":"1","basecircle2_glow":"4","basecircle2_glow_multiplier":"3","basecircle2_dashpattern":"25,12.6991","ball_gradient":true,"ball_gradient_opacity1_red":"0.3","ball_gradient_opacity2_red":"0.5","ball_gradient_opacity1_blue":"0.3","ball_gradient_opacity2_blue":"0.5","ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_opacity":"0.85","ball_outline2":true,"ball_outline2_dashpattern":"14,8","ball_outline2_opacity":"0.65","ball_outline3":true,"ball_outline3_radius":"13","ball_outline3_opacity":"0.65","spikes_generic":true,"spikes_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","bombs_tint":true,"bombs_outline1":true,"bombs_outline1_opacity":"0.85","bombs_outline1_gco":"source-atop","bombs_outline2":true,"bombs_outline2_linewidth":"1","bombs_outline2_radius":"5","bombs_outline2_opacity":"0.9","bombs_filter":"drop-shadow(0 0 8px rgba(255, 153, 255, 0.7))","gates_neutral_tile_opacity":"0","gates_plain_neutral_base":true,"gates_plain_neutral_base_opacity":"0.65","gates_plain_neutral_gradient":true,"gates_plain_neutral_gradient_type":"value-crosshatch","gates_plain_neutral_gradient_size":"10","gates_plain_neutral_detail":true,"gates_plain_neutral_detail_size":"1.5","gates_plain_neutral_border":true,"gates_plain_neutral_border_40px":true,"gates_grb_tile_opacity":"0","gates_plain_grb_base":true,"gates_plain_grb_gradient":true,"gates_plain_grb_gradient_type":"value-crisscross","gates_plain_grb_gradient_size":"20","gates_plain_grb_detail":true,"gates_plain_grb_detail_size":"1.5","gates_plain_grb_detail_drawCircles":true,"gates_plain_grb_detail_dropShadow":true,"gates_plain_grb_detail_dropShadowBlack":true,"gates_plain_grb_border":true,"gates_glow_outline_opacity":"0.6","gate_shadows":true,"flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"boosts_generic":true,"boosts_generic_border_opacity":"0.75","boosts_generic_cutsize":"1","boosts_generic_frames":"9","boosts_generic_segments":true,"boosts_generic_segments_opacity":"0.75","boosts_generic_segments_blur":"2","boosts_generic_inner_arrows_start":"4","boosts_generic_inner_arrows_length":"8","boosts_generic_inner_arrows_shift":"6.5","portals_generic":true,"portals_generic_frames":"8","portals_generic_border_linewidth":"1","background_color1":"#080808","background_color2":"#17202a","plainfloor_color":"#101010","plainteam_color_red":"#ec407a","plainteam_color_blue":"#26c6da","plainteam_color_yellow":"#ada234","teamtile_gradient_color":"#000000","plainendzone_color_red":"#e91e63","plainendzone_color_blue":"#00bcd4","walloutline2_color":"#0a0f13","walloutline3_color":"#cfd8dc","ball_gradient_color1_red":"#560222","ball_gradient_color1_blue":"#002f33","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","bombs_tint_color":"#8e24aa","bombs_fuse_color":"#e0e0e0","bombs_outline1_color":"#e0e0e0","bombs_outline2_color":"#fafafa","gates_plain_neutral_base_neutral":"#bdbdbd","gates_plain_neutral_gradient_color":"#000000","gates_plain_neutral_border_neutral":"#616161","gates_plain_grb_gradient_green":"auto","gates_plain_grb_gradient_red":"auto","gates_plain_grb_gradient_blue":"auto","gates_plain_grb_detail_green":"auto","gates_plain_grb_detail_red":"auto","gates_plain_grb_detail_blue":"auto","gates_glow_outline_color_green":"auto","gates_glow_outline_color_red":"auto","gates_glow_outline_color_blue":"auto","boosts_generic_yellow_color":"#c0be40","boosts_generic_red_color":"#be40c0","boosts_generic_blue_color":"#008066","boosts_generic_segments_yellow":"#ffffff","boosts_generic_segments_red":"#ffffff","boosts_generic_segments_blue":"#ffffff","portals_generic_color":"#689f38","portals_generic_color_alt":"#5e35b1","portals_generic_color_red":"#ec407a","portals_generic_color_red_alt":"#f8bbd0","portals_generic_color_red_background":"#560222","portals_generic_color_blue":"#00bd97","portals_generic_color_blue_alt":"#b1f2ed","portals_generic_color_blue_background":"#002f33","ballskins_red_x":"240","ballskins_red_y":"96","ballskins_blue_x":"288","ballskins_blue_y":"144","texture_tiles":"https://i.imgur.com/yzwGwCN.png","texture_speedpad":"https://i.imgur.com/hPpsrSI.png","texture_speedpadRed":"https://i.imgur.com/EXqQbpF.png","texture_speedpadBlue":"https://i.imgur.com/if3qEp0.png","texture_portal":"https://i.imgur.com/HVYEdPu.png","texture_portalRed":"https://i.imgur.com/S2is5pn.png","texture_portalBlue":"https://i.imgur.com/svRcwXi.png","texture_splats":"https://i.imgur.com/GObCQoT.png","texture_gravityWell":""},
'select-Half-Life 2 #4': {"background_size2":"50","background_size3":"100","background":"value-conic","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-HL2 Tile #16","texture_floor1_filter":"opacity(60%) saturate(0)","floor_contour":true,"floor_contour_opacity":"0.8","floor_contour_size":"90","floor_contour_multiplier":"2","plainteam":true,"teamtile_filter":"opacity(30%)","plainendzone":true,"texture_endzone1":"select-HL2 Tile #3","texture_endzone1_filter":"opacity(50%) saturate(0)","texture_endzone1_size":"0.25","texture_endzone1_gco":"luminosity","plainwalls_color_use":true,"walloutline3_size":"2","walloutline3_opacity":"0.4","walloutline3_exclusion":true,"texture_walls1":"select-HL2 Tile #15","texture_walls1_filter":"opacity(60%) brightness(40%)","texture_walls1_size":"0.5","walls_filter":"drop-shadow(3px 3px 5px rgba(0,0,0,0.6))","wall_light1":true,"wall_light1_constant":"1.75","wall_text_fontsize":"24","wall_text_opacity":"0.25","wall_text_stroke_opacity":"0.5","wall_text_filter":"drop-shadow(0 0 3px chatreuse)","basecircle1_linewidth":"2","basecircle1_radius":"140","basecircle1_opacity":"0.75","basecircle1_glow":"4","basecircle1_glow_multiplier":"3","basecircle1_dashpattern":"50,140","basecircle2_radius":"290","basecircle2_opacity":"1","basecircle2_glow":"4","basecircle2_glow_multiplier":"3","basecircle2_dashpattern":"40,30","ball_outline1":true,"ball_outline1_linewidth":"10","ball_outline1_radius":"5","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ball_outline2":true,"ball_outline2_linewidth":"2","ball_outline2_dashpattern":"16,10","ball_outline2_opacity":"0.8","ball_outline3":true,"ball_outline3_radius":"10","ball_outline3_gco":"source-atop","spikes_generic":true,"spikes_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","gates_neutral_tile_opacity":"0.4","gate_shadows":true,"clear_under_gate_tiles":true,"flags_outline":true,"flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"background_color1":"#000000","background_color2":"#408080","background_color3":"#000000","plainfloor_color":"#cfd8dc","plainteam_color_red":"#a30d0d","plainteam_color_blue":"#0d47a1","plainteam_color_yellow":"#666600","plainwalls_color":"#0a0f13","walloutline3_color":"#fafafa","wall_light1_color":"#b2ebf2","wall_text_color":"#ffffff","basecircle1_color_yellow":"#ffff00","basecircle1_color_red":"#a30d0d","basecircle1_color_blue":"#0d47a1","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#ffffff","ball_outline2_color_blue":"#ffffff","ball_outline3_color_red":"#f5f5f5","ball_outline3_color_blue":"#f5f5f5","texture_tiles":"/textures/mural/tiles.png","texture_speedpad":"/textures/mural/speedpad.png","texture_speedpadRed":"/textures/mural/speedpadred.png","texture_speedpadBlue":"/textures/mural/speedpadblue.png","texture_portal":"/textures/nom/portal.png","texture_portalRed":"/textures/nom/portalred.png","texture_portalBlue":"/textures/nom/portalblue.png","texture_splats":"/textures/mural/splats.png","texture_gravityWell":""},
'select-Half-Life 2 #5': {"background_size1":"20","background_size2":"50","background_size3":"80","background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"texture_floor2":"select-HL2 Tile #9","texture_floor2_filter":"opacity(50%) brightness(150%)","texture_floor2_size":"0.625","floor_filter":"brightness(45%) contrast(120%)","plainteam":true,"plainteam_color_use":true,"texture_team":"select-DestOut Dither","texture_team_size":"0.5","texture_team_gco":"luminosity","teamtile_filter":"opacity(40%) saturate(80%)","clear_under_team_tiles":true,"plainendzone":true,"plainendzone_color_use":true,"endzone_checker1_size":"8","endzone_checker1_margin":"2","endzone_checker1_opacity":"0.6","endzone_checker1_normal":true,"texture_endzone1":"select-Cracked Ice","texture_endzone1_filter":"opacity(25%) saturate(0)","texture_endzone1_size":"0.4","texture_endzone1_gco":"luminosity","clear_under_endzone_tiles":true,"plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"1","walloutline3_opacity":"0.25","texture_walls2":"select-JoJo Relief Lines 7","texture_walls2_filter":"opacity(30%) brightness(85%) contrast(140%)","texture_walls2_gco":"luminosity","walls_filter":"drop-shadow(2px 2px 2px rgba(0,0,0,0.6)) drop-shadow(4px 4px 2px rgba(0,0,0,0.6))","wall_light1":true,"wall_light1_position":"left","wall_light1_blur":"1","wall_light1_surfaceScale":"1","wall_light1_constant":"2","wall_light1_exponent":"10","wall_light1_offset":"0","wall_light1_z":"0","wall_light2":true,"wall_light2_position":"right","wall_light2_blur":"1","wall_light2_surfaceScale":"1","wall_light2_constant":"2","wall_light2_exponent":"10","wall_light2_offset":"0","wall_light2_z":"0","wall_text_fontsize":"69","wall_text_italic":false,"wall_text_opacity":"1","wall_text_stroke_opacity":"0","wall_text_filter":"drop-shadow(-1px -1px 0px #000) drop-shadow(1px 1px 0px #ccf)","wall_text_destinationOut":true,"map_outer_filter":"drop-shadow(5px 5px 10px rgba(0,0,0,0.95))","basecircle1_linewidth":"30","basecircle1_radius":"248","basecircle1_opacity":"0.25","basecircle1_gradient":true,"basecircle2_linewidth":"60","basecircle2_radius":"260","basecircle2_opacity":"0.2","basecircle2_dashpattern":"","basecircle2_gradient":true,"flagline_linewidth":"1","flagline_opacity":"0.5","balls_plain":true,"ball_outline1":true,"ball_outline1_dashpattern":"14,12","ball_outline1_opacity":"1","ballskins":true,"ballskins_tint_red":true,"ballskins_tint_red_hardlight":true,"ballskins_tint_blue":true,"ballskins_tint_blue_hardlight":true,"ballskins_scale_red":"0.85","ballskins_filter_red":"drop-shadow(0px 0px 1px yellow)","ballskins_scale_blue":"0.85","ballskins_filter_blue":"drop-shadow(0px 0px 1px cyan)","ball_outline2":true,"ball_outline2_linewidth":"3","ball_outline2_radius":"10","ball_outline2_blur":true,"ball_outline2_gco":"color-burn","ball_outline3":true,"ball_outline3_radius":"15","ball_outline3_blur":true,"ball_outline3_gco":"color-burn","spikes_generic":true,"spikes_border_linewidth":"2","spikes_border_radius":"6","spikes_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","buttons_generic":true,"buttons_shine":true,"buttons_filter":"drop-shadow(0px 0px 2px rgba(200,200,200,0.7))","bombs_generic":true,"bombs_fuse":true,"bombs_shine":true,"bombs_outline1":true,"bombs_outline1_linewidth":"1","bombs_outline1_segments":"0","bombs_outline1_radius":"15","bombs_outline2":true,"bombs_outline2_linewidth":"12","bombs_outline2_radius":"5","bombs_outline2_opacity":"0.75","bombs_draw_exploded_opacity":"0.2","gates_neutral_tile_opacity":"0","gates_neutral_margin":"1","gates_plain_neutral_cross":true,"gates_plain_neutral_cross_linewidth":"3","gates_plain_neutral_cross_margin":"5","gates_plain_neutral_cross_opacity":"0.5","gates_plain_neutral_cross_shadow":"1","gates_plain_neutral_border":true,"gates_plain_neutral_border_strokeOpacity":"0.5","gates_grb_tile_opacity":"0","gates_plain_grb_base":true,"gates_plain_grb_pyramid":true,"gates_plain_grb_pyramid_margin":"2","gates_plain_grb_cross":true,"gates_plain_grb_cross_linewidth":"2","gates_plain_grb_cross_margin":"6","gates_plain_grb_cross_opacity":"0.25","gates_plain_grb_roundedRect":true,"gates_plain_grb_roundedRect_radius":"6","gates_plain_grb_roundedRect_margin":"4","gates_plain_grb_roundedRect_opacity":"1","gates_plain_grb_roundedRect_dropShadow":"2","gates_plain_grb_roundedRect_dropShadowBlack":true,"gates_plain_grb_roundedRect_drawCorners":false,"gates_plain_grb_detail":true,"gates_plain_grb_detail_size":"1","gates_plain_grb_detail_margin":"10","gates_plain_grb_detail_drawCircles":true,"gates_plain_grb_detail_dropShadow":true,"gates_plain_grb_detail_dropShadowBlack":true,"gates_plain_grb_detail_drawInCenter":true,"gates_plain_grb_border":true,"gates_plain_grb_border_linewidth":"2","gates_plain_grb_border_strokeOpacity":"0.5","gate_shadows":true,"flags_generic_fill":true,"flags_generic_stroke":true,"flags_generic_gradient":true,"flags_generic_gradient_opacity":"0.75","flags_generic_pole_linewidth":"3","flags_outline":true,"flags_outline_taken_opacity":"0.5","flags_draw_taken_opacity":"0.2","pups_generic_jj_stroke":true,"pups_generic_jj_fill":true,"pups_generic_jj_shadow":true,"pups_generic_rb_stroke":true,"pups_generic_rb_fill":true,"pups_generic_rb_shadow":true,"pups_generic_tp_stroke":true,"pups_generic_tp_fill":true,"pups_generic_tp_shadow":true,"pups_generic_empty_stroke":true,"pups_generic_empty_fill":true,"pups_generic_empty_shadow":true,"pups_glow_outline":true,"pups_glow_outline_opacity":"0.75","pups_add_shine":true,"boosts_generic":true,"boosts_generic_border_linewidth":"2","boosts_generic_border_opacity":"1","boosts_generic_frames":"8","boosts_generic_segments":true,"boosts_generic_segments_linewidth":"2","boosts_generic_segments_blur":"2","boosts_generic_inner_arrows_linewidth":"2.5","boosts_generic_inner_arrows_opacity":"1","boosts_generic_inner_arrows_start":"5","boosts_generic_inner_arrows_length":"0","boosts_generic_corner_diagonals":true,"boosts_generic_corner_diagonals_linewidth":"1","boosts_generic_corner_diagonals_opacity":"0.6","boosts_generic_corner_diagonals_start":"14","boosts_generic_corner_diagonals_length":"0","boosts_generic_corner_diagonals_shift":"0.5","boosts_generic_corner_diagonals_heads":true,"boosts_generic_filter":"drop-shadow(1px 1px 2px rgba(0,0,0,0.5)) drop-shadow(2px 2px 1px rgba(0,0,0,0.5))","portals_generic":true,"portals_generic_linewidth":"2.5","portals_generic_frames":"8","background_color1":"#080808","background_color2":"#a08343","background_color3":"#080808","plainfloor_color":"#f5f5f5","plainteam_color_red":"#f44336","plainteam_color_blue":"#1a7bd5","plainteam_color_yellow":"#fff176","plainendzone_color_red":"#b71c1c","plainendzone_color_blue":"#1565c0","plainwalls_color":"#707b7c","walloutline3_color":"#abb2b9","wall_light1_color":"#1696d1","wall_light2_color":"#bdbdbd","wall_text_color":"#566573","basecircle1_color_yellow":"#757575","basecircle1_color_red":"#757575","basecircle1_color_blue":"#757575","basecircle2_color_yellow":"#212121","basecircle2_color_red":"#212121","basecircle2_color_blue":"#212121","flagline_color":"#dcedc8","balls_plain_color_red":"#a30d0d","balls_plain_color_blue":"#1a237e","ballskins_tint_red_color":"#ef9a9a","ballskins_tint_blue_color":"#bbdefb","ball_outline2_color_red":"#f06292","ball_outline2_color_blue":"#80deea","ball_outline3_color_red":"#e53935","ball_outline3_color_blue":"#2196f3","spikes_border_color":"#080808","buttons_generic_color_inner":"#e64a19","buttons_generic_color_outer":"#e0e0e0","buttons_generic_color_border":"#101010","buttons_shine_color":"#eceff1","bombs_tint_color":"#494735","bombs_generic_color":"#7e57c2","bombs_outline2_color":"#080808","gates_plain_neutral_cross_neutral":"#9e9e9e","gates_plain_neutral_border_neutral":"#9e9e9e","gates_plain_grb_base_green":"#00ff80","gates_plain_grb_base_red":"#c62828","gates_plain_grb_base_blue":"#0277bd","gates_plain_grb_border_green":"#000000","gates_plain_grb_border_red":"#000000","gates_plain_grb_border_blue":"#000000","flags_generic_fill_red":"#c62828","flags_generic_fill_blue":"#01579b","flags_generic_fill_yellow":"#fbc02d","flags_generic_stroke_red":"#e0e0e0","flags_generic_stroke_blue":"#e0e0e0","flags_generic_stroke_yellow":"#e0e0e0","flags_generic_gradient_red":"#e57373","flags_generic_gradient_blue":"#70a0ff","flags_generic_gradient_yellow":"#ffe082","flags_generic_pole_color":"#f5f5f5","pups_generic_jj_color_border":"#4dd0e1","pups_generic_jj_color_fill":"#283593","pups_generic_rb_color_border":"#ffee58","pups_generic_rb_color_fill":"#ffca28","pups_generic_tp_color_border":"#40c07f","pups_generic_tp_color_fill":"#004020","pups_glow_color_jj":"#4dd0e1","pups_glow_color_rb":"#ff8a65","pups_glow_color_tp":"#00ff80","boosts_generic_yellow_color":"#d4d140","boosts_generic_red_color":"#dd5566","boosts_generic_blue_color":"#408cdd","boosts_generic_segments_yellow":"#fffde7","boosts_generic_segments_red":"#ffebee","boosts_generic_segments_blue":"#e1f5fe","ballskins_red_x":"192","ballskins_red_y":"0","ballskins_blue_x":"192","ballskins_blue_y":"0","texture_tiles":"/textures/bold/tiles.png","texture_speedpad":"/textures/bold/speedpad.png","texture_speedpadRed":"/textures/bold/speedpadred.png","texture_speedpadBlue":"/textures/bold/speedpadblue.png","texture_portal":"/textures/bold/portal.png","texture_portalRed":"/textures/bold/portalred.png","texture_portalBlue":"/textures/bold/portalblue.png","texture_splats":"/textures/bold/splats.png","texture_gravityWell":""},
'select-Half-Life 2 #6': {"background_angle":"155","background_size2":"50","background_size3":"100","background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-HL2 Plaster #3","texture_floor1_filter":"opacity(60%) saturate(0) blur(1px)","texture_floor1_gco":"hard-light","grid1_size":"40","grid1_opacity":"0.1","grid1_square":true,"grid1_shadow":"drop-shadow(1px 1px 0px white)","plainteam":true,"texture_team":"select-JoJo Glass #22","texture_team_filter":"opacity(40%)","texture_team_size":"0.5","texture_team_gco":"hard-light","teamtile_filter":"opacity(50%)","plainendzone":true,"texture_endzone1":"select-Small Checks","texture_endzone1_filter":"opacity(40%) saturate(0%)","texture_endzone1_gco":"luminosity","endzone_filter":"opacity(75%)","plainwalls":true,"plainwalls_color_use":true,"walloutline1_size":"2","walloutline2_size":"2","walloutline3_size":"2","walloutline3_opacity":"0.85","texture_walls1":"select-HL2 Metal #6","texture_walls1_filter":"saturate(0) contrast(140%)","walls_filter":"drop-shadow(2px 2px 4px black)","basecircle1_linewidth":"5","basecircle1_opacity":"0.35","basecircle1_glow_multiplier":"2","basecircle1_dashpattern":"40,10, 10,5, 10,10","flagline_linewidth":"2","flagline_opacity":"0.6","flagline_dashpattern":"20,20","texture_base":"select-Base #2","texture_base_filter":"opacity(30%) saturate(30%)","texture_base_size":"0.65","ball_outline1":true,"ball_outline1_linewidth":"10","ball_outline1_radius":"5","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_scale_red":"0.75","ballskins_filter_red":"drop-shadow(0px 0px 1px black) drop-shadow(0px 0px 0px black)","ballskins_scale_blue":"0.7","ballskins_filter_blue":"drop-shadow(0px 0px 1px black) drop-shadow(0px 0px 0px black)","spikes_generic":true,"spikes_filter":"drop-shadow(2px 2px 2px black)","buttons_generic":true,"gates_neutral_tile_opacity":"0","gates_neutral_margin":"1","gates_plain_neutral_cross":true,"gates_plain_neutral_cross_linewidth":"2","gates_plain_neutral_cross_margin":"2","gates_plain_neutral_cross_opacity":"0.25","gates_plain_neutral_border":true,"gates_plain_neutral_border_strokeOpacity":"0.4","gates_grb_tile_opacity":"0","gates_plain_grb_base":true,"gates_plain_grb_pyramid":true,"gates_plain_grb_cross":true,"gates_plain_grb_cross_linewidth":"2","gates_plain_grb_cross_margin":"2","gates_plain_grb_cross_opacity":"1","gates_plain_grb_cross_destinationOut":true,"gate_shadows":true,"flags_outline":true,"flags_outline_opacity":"0.8","flags_glow":true,"pups_add_shine":true,"background_color1":"#376a7b","background_color2":"#1a2456","background_color3":"#376a7b","plainfloor_color":"#757575","grid1_color":"#101010","plainendzone_color_red":"#b71c1c","plainendzone_color_blue":"#0d47a1","plainwalls_color":"#080808","walloutline1_color":"#bdbdbd","walloutline2_color":"#101010","walloutline3_color":"#ff3d00","flagline_color":"#fafafa","spikes_generic_color":"#eaecee","buttons_generic_color_inner":"#00803f","buttons_generic_color_outer":"#fafafa","buttons_generic_color_border":"#101010","gates_plain_neutral_border_neutral":"#cfd8dc","gates_plain_grb_base_green":"#388e3c","gates_plain_grb_base_red":"#c62828","gates_plain_grb_base_blue":"#1565c0","flags_outline_color":"auto","ballskins_red_x":"240","ballskins_red_y":"0","ballskins_blue_x":"240","ballskins_blue_y":"0","texture_tiles":"/textures/corallight/tiles.png","texture_speedpad":"/textures/corallight/speedpad.png","texture_speedpadRed":"/textures/corallight/speedpadred.png","texture_speedpadBlue":"/textures/corallight/speedpadblue.png","texture_portal":"https://i.imgur.com/3trtLmL.png","texture_portalRed":"https://i.imgur.com/tekivzl.png","texture_portalBlue":"https://i.imgur.com/eX8ZiXn.png","texture_splats":"/textures/corallight/splats.png","texture_gravityWell":""},
'select-Starlight': {"background_size1":"50","background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Rainy Afternoon Blur","texture_floor1_filter":"opacity(30%) saturate(0%)","floor_contour":true,"floor_contour_opacity":"0.65","floor_contour_size":"100","floor_contour_multiplier":"3","texture_floor2":"select-Sparkle Lines","texture_floor2_filter":"opacity(15%) saturate(40%)","texture_floor2_size":"0","texture_floor2_gco":"soft-light","floor_filter":"brightness(80%) contrast(110%)","plainteam":true,"texture_team":"select-Warble","texture_team_filter":"opacity(30%) saturate(0)","texture_team_size":"0.5","teamtile_checker_size":"2","teamtile_checker_margin":"2","teamtile_checker_opacity":"0.1","teamtile_checker_straight":true,"teamtile_checker_squares":false,"teamtile_checker_circles":true,"plainendzone":true,"endzone_checker1_size":"10","endzone_checker1_opacity":"0.4","endzone_checker1_random":true,"endzone_filter":"saturate(200%)","plainwalls":true,"plainwalls_color_use":true,"wallshadow_size":"3","wallshadow_multiplier":"2","wallshadow_outer":true,"walloutline2_size":"3","walloutline3_size":"1","texture_walls1":"select-Sepia Blue","texture_walls1_filter":"opacity(70%) saturate(30%) sepia(100%) hue-rotate(150deg)","texture_walls2":"select-Moon","texture_walls2_filter":"opacity(25%) saturate(0%)","texture_walls2_gco":"luminosity","basecircle1_radius":"276","basecircle1_opacity":"0.25","basecircle1_glow":"8","basecircle1_glow_multiplier":"2","basecircle2_linewidth":"4","basecircle2_opacity":"0.65","basecircle2_glow":"1","basecircle2_dashpattern":"10,6, 6,6","centerline_linewidth":"2","centerline_dashpattern":"5,10","ball_outline1":true,"ball_outline1_radius":"15","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ball_outline2":true,"ball_outline2_dashpattern":"15","spikes_border_linewidth":"1","gates_neutral_tile_opacity":"0.6","gates_neutral_margin":"1","gates_plain_grb_gradient":true,"gates_plain_grb_gradient_size":"20","gates_plain_grb_gradient_gco":"source-atop","gates_plain_grb_detail":true,"gates_plain_grb_detail_size":"1","gates_plain_grb_detail_margin":"9","gates_plain_grb_detail_opacity":"0.6","gates_plain_grb_detail_drawCircles":true,"gates_plain_grb_detail_dropShadow":true,"gates_plain_grb_detail_dropShadowBlack":true,"gate_shadows":true,"pups_glow":true,"pups_glow_outline":true,"background_color1":"#17202a","plainfloor_color":"#061828","teamtile_checker_color":"#eeeeee","plainwalls_color":"#cfd8dc","walloutline2_color":"#080808","walloutline3_color":"#bdbdbd","centerline_color":"#eaecee","ball_outline2_color_red":"#ffffff","ball_outline2_color_blue":"#ffffff","spikes_border_color":"#bfff00","gates_plain_grb_detail_green":"#bdbdbd","gates_plain_grb_detail_red":"#bdbdbd","gates_plain_grb_detail_blue":"#bdbdbd","texture_tiles":"https://i.imgur.com/j0el5Tn.png","texture_speedpad":"https://i.imgur.com/22t8hoV.png","texture_speedpadRed":"https://i.imgur.com/EfQFr4G.png","texture_speedpadBlue":"https://i.imgur.com/hPMDhD5.png","texture_portal":"https://i.imgur.com/rGEEQ2s.png","texture_portalRed":"https://i.imgur.com/ArRiWHP.png","texture_portalBlue":"https://i.imgur.com/o4KzG9S.png","texture_splats":"https://i.imgur.com/IIFG2nS.png","texture_gravityWell":""},
'select-Castle': {"background_angle":"0","background_size2":"75","background":"value-radial","plainfloor":true,"floor_contour":true,"floor_contour_multiplier":"2","checker1_size":"40","checker1_opacity":"0.12","checker1_normal":true,"texture_floor2":"select-HL2 Tile #14","texture_floor2_filter":"opacity(60%) saturate(0) contrast(60%)","texture_floor2_size":"0.625","plainteam":true,"texture_team":"select-Diagonal Pattern #2","texture_team_filter":"opacity(25%) saturate(0%)","texture_team_size":"0.5","texture_team_gco":"hard-light","teamtile_filter":"drop-shadow(0px 0px 1px black)","plainendzone":true,"endzone_checker1_size":"20","endzone_checker1_opacity":"0.3","endzone_checker1_normal":true,"plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"2","walloutline3_opacity":"0.65","walloutline3_exclusion":true,"texture_walls1":"select-Metal","texture_walls1_filter":"opacity(45%) saturate(0%)","texture_walls2":"select-Cracks 1","texture_walls2_filter":"opacity(30%) invert(100%)","texture_walls2_size":"0.8","texture_walls2_gco":"luminosity","walls_filter":"drop-shadow(2px 2px 3px black)","wall_light1":true,"wall_light1_surfaceScale":"8","wall_light1_constant":"3.5","wall_light1_exponent":"11","wall_light1_z":"300","wall_light2":true,"wall_light2_position":"topleft","wall_light2_surfaceScale":"8","wall_light2_constant":"3.65","wall_light2_exponent":"11","wall_light2_z":"300","gates_neutral_margin":"1","gate_shadows":true,"pups_add_shine":true,"pups_bottom_shadow":true,"pups_bottom_shadow_opacity_coefficient":"0.85","kblogo":true,"background_color1":"#3a3a45","background_color2":"#0f0f11","plainfloor_color":"#000000","plainwalls_color":"#1C2A39","walloutline3_color":"#b2babb","wall_light1_color":"#abb2b9","wall_light2_color":"#808b96","texture_tiles":"https://i.imgur.com/GCVOxf0.png","texture_speedpad":"https://i.imgur.com/HCTWYrI.png","texture_speedpadRed":"https://i.imgur.com/PnFxbGc.png","texture_speedpadBlue":"https://i.imgur.com/BxhPCj6.png","texture_portal":"https://i.imgur.com/8hUe7G0.png","texture_portalRed":"https://i.imgur.com/Ctl7dY9.png","texture_portalBlue":"https://i.imgur.com/x1msjSu.png","texture_splats":"https://i.imgur.com/kbkOC6x.png","texture_gravityWell":""},
'select-Space': {"background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Stars #1","texture_floor1_filter":"saturate(0%) brightness(200%) contrast(150%)","texture_floor1_size":"0.5","texture_floor1_gco":"luminosity","texture_floor2":"select-CrissxCross","texture_floor2_filter":"saturate(0%) brightness(200%)","texture_floor2_gco":"luminosity","floor_filter":"opacity(30%)","plainteam":true,"texture_team":"select-Holes","texture_team_filter":"saturate(0%)","texture_team_size":"0.25","texture_team_gco":"destination-in","teamtile_filter":"saturate(300%) opacity(30%) brightness(200%)","plainendzone":true,"texture_endzone1":"select-Spaced Diagonal Lines","texture_endzone1_filter":"saturate(0%) invert(100%)","texture_endzone1_size":"0.75","texture_endzone1_gco":"luminosity","plainwalls":true,"wallshadow_size":"0","wallshadow_multiplier":"2","wallshadow_inner":true,"wallshadow_outer":true,"walloutline1_size":"2","map_outer_filter":"drop-shadow(0 0 5px cyan)","centerline_linewidth":"1","centerline_opacity":"0.4","flagline_linewidth":"1","flagline_opacity":"0.6","ball_outline1":true,"ball_outline1_linewidth":"11","ball_outline1_radius":"5","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_opacity":"0.5","ballskins_gco":"source-atop","spikes_generic":true,"spikes_generic_points":"12","spikes_generic_innerradius":"6","spikes_generic_outerradius":"12","spikes_generic_holeradius":"3","spikes_filter":"drop-shadow(0 0 5px rgba(0, 255, 0, 0.8))","bombs_outline1":true,"bombs_outline1_radius":"14","bombs_filter":"drop-shadow(0 0 5px rgba(255, 255, 255, 0.8))","gates_glow":true,"gates_glow_outline":true,"flags_outline":true,"flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"gravitywell1_linewidth":"130","gravitywell2_linewidth":"1","gravitywell2_dashpattern":"5,3","gravitywell2_filter":"drop-shadow(0 0 2px cyan) drop-shadow(0 0 3px cyan)","background_color1":"#0a0a0a","background_color2":"#0a0a0a","plainfloor_color":"#000000","plainteam_color_red":"#ff3333","plainteam_color_blue":"#00ffff","plainteam_color_yellow":"#ecff00","wallshadow_color":"#00ffff","walloutline1_color":"#eeeeee","centerline_color":"#4dd0e1","flagline_color":"#ab47bc","gravitywell1_color":"#512da8","gravitywell2_color":"#fafafa","ballskins_red_x":"96","ballskins_red_y":"288","ballskins_blue_x":"0","ballskins_blue_y":"288","texture_tiles":"https://i.imgur.com/L0V5dx8.png","texture_speedpad":"/textures/sparkle/speedpad.png","texture_speedpadRed":"/textures/sparkle/speedpadred.png","texture_speedpadBlue":"/textures/sparkle/speedpadblue.png","texture_portal":"https://i.imgur.com/eWpllqk.png","texture_portalRed":"https://i.imgur.com/R113Lz1.png","texture_portalBlue":"https://i.imgur.com/FzEVEGR.png","texture_splats":"https://i.imgur.com/kbkOC6x.png","texture_gravityWell":""},
'select-Hex': {"background_size1":"5","background_size2":"50","background_size3":"95","background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Bubbles & Swirls","texture_floor1_filter":"opacity(10%) saturate(0)","hexagon_size":"48","hexagon_margin":"3","hexagon_stroke_linewidth":"1","hexagon_stroke_opacity":"0.4","hexagon_fill":true,"hexagon_fill_opacity":"0.16","texture_floor2":"select-RoL S5E","texture_floor2_filter":"opacity(40%) saturate(0%)","texture_floor2_size":"0","texture_floor2_gco":"soft-light","floor_filter":"brightness(60%)","plainteam":true,"plainteam_color_use":true,"teamtile_checker_size":"4","teamtile_checker_margin":"1","teamtile_checker_opacity":"0.6","teamtile_checker_straight":true,"teamtile_checker_gco":"value-destination-out","teamtile_filter":"saturate(70%) brightness(60%)","clear_under_team_tiles":true,"plainendzone":true,"texture_endzone1":"select-Small Checks","texture_endzone1_filter":"opacity(40%)","endzone_filter":"drop-shadow(0 0 2px black)","clear_under_endzone_tiles":true,"plainwalls":true,"plainwalls_color_use":true,"texture_walls1":"select-Tech #2","texture_walls1_size":"0.35","walls_filter":"drop-shadow(3px 3px 4px black) drop-shadow(3px 3px 4px black) brightness(150%) contrast(120%)","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"2","wall_light1_constant":"2.65","wall_light1_exponent":"10","wall_light2":true,"wall_light2_blur":"2","wall_light2_surfaceScale":"2","wall_light2_constant":"0.55","wall_light2_exponent":"10","map_outer_filter":"drop-shadow(10px 10px 10px black)","centerline_linewidth":"1","centerline_dashpattern":"5,15","flagline_linewidth":"2","texture_base":"select-Fine Circles","texture_base_filter":"saturate(0)","texture_base_size":"0.6","texture_base_greyscale_nf":true,"texture_base_gradient_opacity2_red":"0","texture_base_gradient_opacity2_blue":"0","texture_base_gradient_opacity_global":"1","ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_opacity":"0.8","ballskins_gco":"overlay","spikes_generic":true,"spikes_filter":"drop-shadow(1px 1px 2px black)","bombs_outline1":true,"bombs_outline1_opacity":"0.5","bombs_filter":"drop-shadow(0 0 6px rgba(120, 100, 100, 0.5))","gates_neutral_tile_opacity":"0","gates_neutral_margin":"1","gates_plain_neutral_base":true,"gates_plain_neutral_base_opacity":"0.5","gates_plain_neutral_gradient":true,"gates_plain_neutral_gradient_type":"value-crisscross","gates_plain_neutral_gradient_size":"20","gates_plain_neutral_border":true,"gates_plain_neutral_border_strokeOpacity":"0.25","gates_plain_neutral_border_40px":true,"gates_grb_tile_opacity":"0","gates_plain_grb_base":true,"gates_plain_grb_base_opacity":"0.35","gates_plain_grb_cross":true,"gates_plain_grb_cross_linewidth":"2","gates_plain_grb_cross_margin":"8","gates_plain_grb_cross_opacity":"1","gates_plain_grb_cross_shadow":"2","gates_plain_grb_roundedRect":true,"gates_plain_grb_roundedRect_radius":"6","gates_plain_grb_roundedRect_margin":"6","gates_plain_grb_roundedRect_dropShadow":"1","gates_plain_grb_roundedRect_dropShadowBlack":true,"gates_plain_grb_roundedRect_drawEdges":false,"gates_plain_grb_cutout":true,"gates_plain_grb_cutout_margin":"6","gates_plain_grb_cutout_strokeOpacity":"0.75","gates_plain_grb_cutout_blur":"3","gates_plain_grb_border":true,"gates_glow_size":"6","gate_shadows":true,"flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"boosts_generic":true,"boosts_generic_border_linewidth":"2","boosts_generic_border_opacity":"0.75","boosts_generic_frames":"8","boosts_generic_segments":true,"boosts_generic_segments_blur":"2","portals_outline":true,"gravitywell1_linewidth":"5","gravitywell1_opacity":"0.2","gravitywell1_gradient":false,"gravitywell1_filter":"drop-shadow(0px 0px 3px lime) drop-shadow(0px 0px 6px lime)","gravitywell2_linewidth":"1","gravitywell2_radius":"258","gravitywell2_opacity":"0.85","gravitywell2_filter":"","background_color1":"#273746","background_color2":"#424242","background_color3":"#273746","plainfloor_color":"#131c21","hexagon_stroke_color":"#757575","hexagon_fill_color":"#2c3e50","plainteam_color_red":"#d32f2f","plainteam_color_blue":"#3949ab","plainteam_color_yellow":"#ffeb3b","plainwalls_color":"#212121","wall_light1_color":"#0b6ab7","wall_light2_color":"#ffeb3b","centerline_color":"#cfd8dc","flagline_color":"#808b96","texture_base_gradient_color2_red":"#ffffff","texture_base_gradient_color2_blue":"#ffffff","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","spikes_generic_color":"#cfd8dc","gates_plain_neutral_base_neutral":"#757575","gates_plain_neutral_gradient_color":"#212121","gates_plain_neutral_border_neutral":"#ffffff","gates_plain_grb_base_green":"#00ff00","gates_plain_grb_base_red":"#ff0000","gates_plain_grb_base_blue":"#0080ff","gates_plain_grb_cross_green":"#00ff00","gates_plain_grb_cross_red":"#e53935","gates_plain_grb_cross_blue":"#29b6f6","gates_plain_grb_roundedRect_blue":"#29b6f6","gates_glow_color_green":"#00ff00","gates_glow_color_red":"#de3600","gates_glow_color_blue":"#00ffff","boosts_generic_segments_yellow":"#c0be40","boosts_generic_segments_red":"#c04040","boosts_generic_segments_blue":"#4082c0","gravitywell1_color":"#80ff00","gravitywell2_color":"#ffffff","ballskins_red_x":"288","ballskins_red_y":"192","ballskins_blue_x":"240","ballskins_blue_y":"192","texture_tiles":"https://i.imgur.com/xw3lN2o.png","texture_speedpad":"https://i.imgur.com/22t8hoV.png","texture_speedpadRed":"https://i.imgur.com/EfQFr4G.png","texture_speedpadBlue":"https://i.imgur.com/hPMDhD5.png","texture_portal":"https://i.imgur.com/lfczV8G.png","texture_portalRed":"https://i.imgur.com/fb4HOtl.png","texture_portalBlue":"https://i.imgur.com/verk4xJ.png","texture_splats":"https://i.imgur.com/F799BFp.png","texture_gravityWell":""},
'select-Anarchy': {"background":"value-Blur #10","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-HL2 Metal #5","texture_floor1_filter":"opacity(80%) brightness(80%) contrast(120%)","grid1_size":"160","grid1_length":"160","grid1_width":"2","grid1_opacity":"0.3","grid1_square":true,"grid1_shadow":"drop-shadow(1px 1px 0px rgba(255,255,255,0.5))","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Crackles","texture_team_filter":"opacity(35%) saturate(0%) invert(100%)","texture_team_size":"0.75","teamtile_checker_size":"6","teamtile_checker_margin":"2","teamtile_checker_opacity":"0.75","teamtile_checker_straight":true,"teamtile_checker_gco":"value-destination-in","teamtile_filter":"opacity(75%) saturate(80%) drop-shadow(0 0 1px black)","plainendzone":true,"texture_endzone1":"select-Joined Circles","texture_endzone1_filter":"invert(100%)","texture_endzone1_size":"0.7","texture_endzone1_gco":"luminosity","endzone_filter":"drop-shadow(0 0 1px black)","plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"1","texture_walls1":"select-JoJo Metal 40","texture_walls1_filter":"opacity(80%) brightness(60%) contrast(110%)","texture_walls1_size":"0.75","walls_filter":"brightness(65%) drop-shadow(5px 5px 8px rgba(0,0,0,1))","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"5","wall_light1_constant":"3.65","wall_light1_exponent":"11","wall_light2":true,"wall_light2_blur":"2","wall_light2_surfaceScale":"5","wall_light2_exponent":"11","wall_text_fontsize":"22","wall_text_text":"🔴 TagPro 🔵","wall_text_italic":false,"wall_text_opacity":"0.8","wall_text_stroke_opacity":"0","texture_base":"select-Anarchy","texture_base_filter":"opacity(10%) blur(1px)","texture_base_size":"1.2","balls_plain":true,"ball_outline1":true,"ball_outline1_linewidth":"8","ball_outline1_radius":"4","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ball_outline2":true,"ball_outline2_linewidth":"2","ball_outline2_radius":"12","ball_outline2_gco":"destination-out","ball_outline3":true,"ball_outline3_dashpattern":"14,9","ball_outline3_opacity":"0.6","spikes_filter":"invert(100%)","bombs_outline1":true,"bombs_outline1_linewidth":"1","bombs_outline1_radius":"15","bombs_outline1_opacity":"0.65","bombs_draw_exploded_opacity":"0.2","gates_neutral_tile_opacity":"0.2","gate_shadows":true,"flags_generic_gradient":true,"flags_outline":true,"flags_outline_opacity":"0.6","flags_draw_taken_opacity":"0.15","pups_glow":true,"pups_glow_outline":true,"pups_glow_outline_linewidth":"1","pups_add_shine":true,"pups_filter":"drop-shadow(2px 2px 1px rgba(0,0,0,0.8)) drop-shadow(2px 2px 3px rgba(0,0,0,0.6))","plainfloor_color":"#d5d8dc","grid1_color":"#101010","plainteam_color_red":"#b71c1c","plainteam_color_blue":"#1565c0","plainteam_color_yellow":"#807e00","plainwalls_color":"#080808","walloutline3_color":"#757575","wall_light1_color":"#614747","wall_text_color":"#b2babb","wall_text_stroke_color":"#ffffff","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#080808","ball_outline2_color_blue":"#080808","ball_outline3_color_red":"#ffffff","ball_outline3_color_blue":"#ffffff","texture_tiles":"https://i.imgur.com/qkaeirQ.png","texture_speedpad":"https://i.imgur.com/sTqwM4n.png","texture_speedpadRed":"https://i.imgur.com/7tZjFli.png","texture_speedpadBlue":"https://i.imgur.com/pF3xUlZ.png","texture_portal":"https://i.imgur.com/DZried3.png","texture_portalRed":"https://i.imgur.com/7OcViMr.png","texture_portalBlue":"https://i.imgur.com/4jo81wm.png","texture_splats":"https://i.imgur.com/TqJKyQR.png","texture_gravityWell":""},
'select-Ripples': {"background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Blue Abstract","texture_floor1_filter":"opacity(40%) blur(10px) saturate(70%)","texture_floor1_size":"2","floor_contour":true,"floor_contour_opacity":"0.75","floor_contour_multiplier":"3","texture_floor2":"select-Ripples","texture_floor2_filter":"opacity(50%) saturate(0%) blur(4px)","texture_floor2_size":"2","texture_floor2_gco":"hard-light","plainteam":true,"texture_team":"select-JoJo Relief Lines 7","texture_team_filter":"opacity(40%) invert(100%) brightness(60%)","texture_team_size":"0.8","teamtile_filter":"drop-shadow(0 0 1px black) opacity(80%)","plainendzone":true,"texture_endzone1":"select-Large Diagonal Checks","texture_endzone1_filter":"opacity(65%) saturate(0%)","texture_endzone1_gco":"xor","plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"1","walloutline3_opacity":"0.6","texture_walls1":"select-Patchy","texture_walls1_filter":"opacity(30%) saturate(0%)","texture_walls1_size":"0.5","texture_walls2":"select-Square Stone","texture_walls2_filter":"brightness(20%) opacity(50%) saturate(0%)","texture_walls2_size":"0.8","walls_filter":"brightness(80%) contrast(110%) drop-shadow(3px 3px 5px rgba(0,0,0,0.8))","wall_light1":true,"wall_light1_position":"left","wall_light1_blur":"2","wall_light1_constant":"4.65","wall_light1_exponent":"24","wall_light1_z":"100","wall_light2":true,"wall_light2_position":"topleft","wall_light2_blur":"2","wall_light2_constant":"4.65","wall_light2_exponent":"24","wall_light2_z":"100","centerline_linewidth":"1","flagline_linewidth":"2","balls_shine":true,"balls_shadow":true,"ballskins":true,"spikes_generic":true,"spikes_filter":"drop-shadow(0px 0px 1px black) drop-shadow(2px 2px 2px rgba(0,0,0,0.7))","bombs_fuse":true,"bombs_outline1":true,"bombs_outline1_linewidth":"1","bombs_outline1_opacity":"0.5","gates_neutral_tile_opacity":"0.65","gates_neutral_margin":"1","gates_plain_neutral_detail":true,"gates_plain_neutral_detail_size":"1","gates_plain_neutral_detail_opacity":"0.65","gates_plain_neutral_detail_drawCircles":true,"gates_plain_neutral_border":true,"gates_plain_grb_detail":true,"gates_plain_grb_detail_size":"1","gates_plain_grb_detail_margin":"6","gates_plain_grb_detail_opacity":"0.85","gates_plain_grb_detail_drawCircles":true,"gates_plain_grb_detail_dropShadow":true,"gates_plain_grb_detail_dropShadowBlack":true,"pups_add_shine":true,"background_color1":"#a2abcd","background_color2":"#181b20","plainfloor_color":"#f2f4f4","plainwalls_color":"#101010","walloutline3_color":"#757575","wall_light1_color":"#9fb4c6","bombs_fuse_color":"#757575","gates_plain_neutral_detail_neutral":"#101010","gates_plain_neutral_border_neutral":"#616161","gates_plain_grb_detail_green":"#bdbdbd","gates_plain_grb_detail_red":"#bdbdbd","gates_plain_grb_detail_blue":"#bdbdbd","ballskins_red_x":"96","ballskins_red_y":"288","ballskins_blue_x":"0","ballskins_blue_y":"288","texture_tiles":"https://i.imgur.com/kuPdAXV.png","texture_speedpad":"https://i.imgur.com/39zXNPL.png","texture_speedpadRed":"https://i.imgur.com/bo4m727.png","texture_speedpadBlue":"https://i.imgur.com/EFk5IgL.png","texture_portal":"https://i.imgur.com/w92XPWL.png","texture_portalRed":"https://i.imgur.com/oGVju5k.png","texture_portalBlue":"https://i.imgur.com/GYkkAbP.png","texture_splats":"https://i.imgur.com/kHUlTwP.png","texture_gravityWell":""},
'select-Skill': {"background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"floor_contour":true,"floor_contour_opacity":"0.8","floor_contour_multiplier":"1","grid1_size":"40","grid1_square":true,"grid1_shadow":"drop-shadow(1px 1px 0px rgb(255,255,255))","checker1_size":"40","checker1_opacity":"0.02","checker1_straight":true,"checker1_rotate":"45","plainteam":true,"texture_team":"select-Benji3o3 Clouds #16","texture_team_filter":"opacity(20%) saturate(0)","texture_team_size":"0.35","texture_team_gco":"luminosity","teamtile_filter":"saturate(165%)","plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Rotated Checker","texture_endzone1_filter":"opacity(50%)","texture_endzone1_size":"0.4","endzone_filter":"saturate(150%) brightness(125%) drop-shadow(0 0 1px black)","walloutline2_size":"2","walloutline3_size":"2","texture_walls1":"select-Green Lightning","texture_walls1_filter":"opacity(35%) saturate(0)","texture_walls1_gco":"hard-light","texture_walls2":"select-Metal","texture_walls2_filter":"opacity(45%) saturate(0%)","texture_walls2_gco":"hard-light","walls_filter":"drop-shadow(2px 2px 3px rgba(0,0,0,0.85))","basecircle1_linewidth":"2","basecircle1_radius":"120","basecircle1_opacity":"0.85","basecircle1_dashpattern":"5,7","balls_plain":true,"balls_shine":true,"balls_shadow":true,"ballskins":true,"ballskins_opacity":"0.4","ballskins_scale_red":"0.8","ballskins_scale_blue":"0.8","ball_outline3":true,"ball_outline3_radius":"19","spikes_border_linewidth":"1","spikes_border_opacity":"0.65","spikes_border_radius":"8","bombs_shine":true,"bombs_draw_exploded_opacity":"0.2","bombs_filter":"brightness(100%) contrast(115%) drop-shadow(3px 3px 3px rgba(0,0,0,0.75)) hue-rotate(10deg)","gates_neutral_tile_opacity":"0.6","gates_neutral_margin":"5","gates_plain_neutral_border":true,"gates_plain_neutral_border_40px":true,"gates_grb_tile_opacity":"0","gates_plain_grb_base":true,"gates_plain_grb_base_opacity":"0.25","gates_plain_grb_cross":true,"gates_plain_grb_cross_linewidth":"3","gates_plain_grb_cross_margin":"2","gates_plain_grb_cross_opacity":"1","gates_plain_grb_roundedRect":true,"gates_plain_grb_roundedRect_radius":"5","gates_plain_grb_roundedRect_margin":"5","gates_plain_grb_roundedRect_opacity":"0.85","gates_plain_grb_roundedRect_dropShadow":"1","gates_plain_grb_roundedRect_dropShadowBlack":true,"gates_plain_grb_roundedRect_drawCorners":false,"gates_plain_grb_detail":true,"gates_plain_grb_detail_size":"10","gates_plain_grb_detail_margin":"10","gates_plain_grb_detail_drawCorners":true,"gates_plain_grb_detail_dropShadow":true,"gates_plain_grb_detail_dropShadowBlack":true,"gates_plain_grb_detail_drawInCenter":true,"gates_plain_grb_border":true,"gates_plain_grb_border_linewidth":"2","gate_shadows":true,"flags_generic_pole_linewidth":"0","background_color1":"#b0bec5","background_color2":"#212121","plainfloor_color":"#eeeeee","grid1_color":"#464646","checker1_color":"#0a0f13","plainteam_color_yellow":"#fff59d","walloutline2_color":"#212121","walloutline3_color":"#eaecee","ball_outline3_color_red":"#212121","ball_outline3_color_blue":"#212121","gates_plain_neutral_border_neutral":"#616161","gates_plain_grb_cross_green":"auto","gates_plain_grb_cross_red":"auto","gates_plain_grb_cross_blue":"auto","gates_plain_grb_detail_green":"#00ff80","gates_plain_grb_detail_red":"#ff5e1a","gates_plain_grb_detail_blue":"#00bfff","ballskins_red_x":"48","ballskins_red_y":"288","ballskins_blue_x":"0","ballskins_blue_y":"288","texture_tiles":"/textures/plumb/tiles.png","texture_speedpad":"/textures/plumb/speedpad.png","texture_speedpadRed":"/textures/plumb/speedpadred.png","texture_speedpadBlue":"/textures/plumb/speedpadblue.png","texture_portal":"https://i.imgur.com/hffUZ2J.png","texture_portalRed":"https://i.imgur.com/4Joo3sG.png","texture_portalBlue":"https://i.imgur.com/8VvNidX.png","texture_splats":"/textures/plumb/splats.png","texture_gravityWell":""},
'select-Purple Pirate': {"background_size2":"50","background_size3":"100","background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"floor_contour":true,"floor_contour_size":"90","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Gun Metal","texture_team_filter":"saturate(0%) blur(2px)","texture_team_size":"1.25","texture_team_gco":"luminosity","teamtile_filter":"opacity(65%)","plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Large Diagonal Checks","texture_endzone1_filter":"opacity(25%) saturate(0%)","texture_endzone1_size":"0.8","plainwalls":true,"plainwalls_color_use":true,"wallshadow_size":"0","wallshadow_blur":"5","wallshadow_multiplier":"4","wallshadow_inner":true,"walloutline1_size":"1","walloutline2_size":"3","walloutline3_size":"1","centerline_linewidth":"2","centerline_dashpattern":"45,8","flagline_linewidth":"2","texture_base":"select-Crossbones","texture_base_filter":"opacity(40%) blur(1px)","texture_base_size":"0.75","gates_neutral_tile_opacity":"0.5","gates_neutral_margin":"2","gates_plain_neutral_border":true,"gates_plain_neutral_border_strokeOpacity":"0.75","gates_plain_neutral_border_40px":true,"background_color1":"#080808","background_color2":"#131c21","background_color3":"#080808","plainfloor_color":"#00FFFF","floor_contour_color":"#3c0080","plainteam_color_red":"#ff80ff","plainteam_color_blue":"#80ffff","plainteam_color_yellow":"#ffff80","plainendzone_color_red":"#ff00ff","plainendzone_color_blue":"#00ffff","plainwalls_color":"#0f021e","wallshadow_color":"#6666FF","walloutline1_color":"#b39ddb","walloutline2_color":"#080808","walloutline3_color":"#ede7f6","gates_plain_neutral_border_neutral":"#ffffff","texture_tiles":"/textures/electric/tiles.png","texture_speedpad":"/textures/electric/speedpad.png","texture_speedpadRed":"/textures/electric/speedpadred.png","texture_speedpadBlue":"/textures/electric/speedpadblue.png","texture_portal":"/textures/electric/portal.png","texture_portalRed":"https://i.imgur.com/kEiyDse.png","texture_portalBlue":"https://i.imgur.com/2B4uWwm.png","texture_splats":"https://i.imgur.com/wxJ2ImS.png","texture_gravityWell":""},
'select-Graydiant': {"background":"value-radial","vpcss_border_size":"1","vpcss_radius_border":"8","vpcss_shadow1_size":"4","vpcss_shadow1_blur":"8","plainfloor":true,"plainfloor_color_use":true,"floor_contour":true,"floor_contour_opacity":"0.75","floor_contour_multiplier":"2","texture_floor2":"select-Warm Machine #1","texture_floor2_filter":"opacity(00%) saturate(40%) sepia(80%)","texture_floor2_size":"0","texture_floor3":"select-Abstract #2","texture_floor3_filter":"opacity(20%)","texture_floor3_gco":"luminosity","floor_filter":"brightness(75%)","plainteam":true,"texture_team":"select-JoJo Relief Lines 14","texture_team_filter":"opacity(20%)","texture_team_size":"0.35","texture_team_gco":"luminosity","teamtile_filter":"saturate(75%) opacity(50%)","clear_under_team_tiles":true,"plainendzone":true,"plainendzone_color_use":true,"endzone_checker1_size":"18","endzone_checker1_margin":"2","endzone_checker1_opacity":"0.65","endzone_checker1_straight":true,"endzone_checker1_rotate":"45","texture_endzone1":"select-Stranger Things","texture_endzone1_filter":"opacity(60%) brightness(50%)","texture_endzone1_gco":"luminosity","endzone_filter":"saturate(40%) brightness(150%)","clear_under_endzone_tiles":true,"walloutline2_size":"3","walloutline3_size":"1","texture_walls1":"select-HL2 Plaster #4","texture_walls1_filter":"opacity(60%) brightness(80%)","walls_filter":"saturate(60%) brightness(85%) drop-shadow(2px 2px 3px rgba(0,0,0,0.8))","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"2","wall_light2":true,"wall_light2_blur":"2","wall_light2_surfaceScale":"2","wall_text_fontsize":"22","wall_text_opacity":"1","wall_text_destinationOut":true,"map_outer_filter":"drop-shadow(0px 0px 70px rgba(132,39,16,0.7))","basecircle1_radius":"250","basecircle1_opacity":"0.1","basecircle1_fill":true,"flagline_linewidth":"1","texture_base":"select-Spiral Swirl","texture_base_filter":"opacity(30%)","ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_opacity":"0.65","ballskins_scale_red":"0.4","ballskins_filter_red":"drop-shadow(0 0 1px #000000) drop-shadow(0 0 1px #000000)","ballskins_scale_blue":"0.4","ballskins_filter_blue":"drop-shadow(0 0 1px #000000) drop-shadow(0 0 1px #000000)","spikes_filter":"drop-shadow(0 0 1px white)","bombs_outline1":true,"bombs_outline1_linewidth":"3","bombs_outline1_segments":"0","bombs_outline1_radius":"1.5","bombs_outline1_opacity":"1","bombs_draw_exploded_opacity":"0.2","bombs_filter":"drop-shadow(0 0 1px white)","gates_neutral_tile_opacity":"0.3","gates_neutral_margin":"1","gates_plain_grb_pyramid":true,"gates_plain_grb_pyramid_margin":"2","gate_shadows":true,"pups_add_shine":true,"pups_filter":"drop-shadow(2px 2px 1px rgba(0,0,0,0.8)) drop-shadow(2px 2px 3px rgba(0,0,0,0.6))","gravitywell1_linewidth":"80","gravitywell2_linewidth":"4","gravitywell2_opacity":"0.6","background_color1":"#b8a998","background_color2":"#322c21","plainfloor_color":"#787568","plainendzone_color_red":"#b71c1c","plainendzone_color_blue":"#0d47a1","endzone_checker1_color":"#ffffff","walloutline2_color":"#212121","walloutline3_color":"#757575","wall_light1_color":"#ffee58","wall_light2_color":"#ffab91","wall_text_color":"#212121","wall_text_stroke_color":"#080808","bombs_outline1_color":"#ff9800","gravitywell2_color":"#fafafa","ballskins_red_x":"192","ballskins_red_y":"192","ballskins_blue_x":"192","ballskins_blue_y":"192","texture_tiles":"https://i.imgur.com/w0BoQSc.png","texture_speedpad":"/textures/crystal/speedpad.png","texture_speedpadRed":"/textures/crystal/speedpadred.png","texture_speedpadBlue":"/textures/crystal/speedpadblue.png","texture_portal":"https://i.imgur.com/pBZJ01i.png","texture_portalRed":"https://i.imgur.com/gi36lja.png","texture_portalBlue":"https://i.imgur.com/Wxda6Pz.png","texture_splats":"/textures/classic/splats.png","texture_gravityWell":""},
'select-JoJo Metal': {"background_size2":"50","background_size3":"100","background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-JoJo Metal 54","texture_floor1_filter":"opacity(80%) brightness(50%)","texture_floor2":"select-Fractal #1","texture_floor2_filter":"opacity(30%)","texture_floor2_gco":"hard-light","floor_filter":"brightness(30%)","plainteam":true,"plainteam_color_use":true,"texture_team":"select-JoJo Glass #9","texture_team_filter":"opacity(50%)","texture_team_size":"0.15","texture_team_gco":"hard-light","teamtile_filter":"opacity(25%)","plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Diagonal Stripes 1","texture_endzone1_filter":"opacity(40%) saturate(0%)","texture_endzone1_size":"0.4","texture_endzone1_gco":"luminosity","endzone_filter":"brightness(60%)","wallshadow_size":"0","wallshadow_blur":"4","wallshadow_opacity":"0.75","wallshadow_multiplier":"5","wallshadow_inner":true,"walloutline3_size":"1","texture_walls1":"select-JoJo Metal 7-2","texture_walls1_filter":"brightness(150%)","texture_walls1_size":"0.4","walls_filter":"drop-shadow(3px 3px 4px black)","basecircle1_linewidth":"5","basecircle1_opacity":"1","basecircle1_glow":"3","basecircle1_glow_multiplier":"2","basecircle1_dashpattern":"40,10, 10,5, 10,10","flagline_linewidth":"1","flagline_opacity":"0.5","ballskins":true,"ballskins_gco":"source-atop","ball_star_red":true,"ball_star_red_stroke_opacity":"0","ball_star_red_fill_opacity":"0.8","ball_star_red_points":"3","ball_star_red_outerradius":"12","ball_star_red_holeradius":"5","ball_star_blue":true,"ball_star_blue_stroke_opacity":"0","ball_star_blue_fill_opacity":"0.8","ball_star_blue_points":"3","ball_star_blue_outerradius":"12","ball_star_blue_holeradius":"5","ball_outline4":true,"spikes_generic":true,"spikes_generic_innerradius":"6","spikes_generic_outerradius":"16","spikes_generic_holeradius":"2","spikes_generic_color2_position":"0.75","spikes_border_linewidth":"3","spikes_border_opacity":"0.85","spikes_border_radius":"5","bombs_outline1":true,"bombs_outline1_linewidth":"3","bombs_outline1_segments":"0","bombs_outline1_radius":"1.5","bombs_outline1_opacity":"1","bombs_filter":"drop-shadow(0 0 6px rgba(171, 178, 185, 0.5)) brightness(130%) sepia(40%) contrast(130%)","gates_neutral_tile_opacity":"0.25","gates_neutral_margin":"1","gates_plain_grb_detail":true,"gates_plain_grb_detail_size":"10","gates_plain_grb_detail_margin":"2","gates_plain_grb_detail_opacity":"0.75","gates_plain_grb_detail_drawCorners":true,"gates_plain_grb_detail_dropShadow":true,"gates_plain_grb_detail_dropShadowBlack":true,"gates_plain_grb_detail_drawInCenter":true,"gate_shadows":true,"flags_generic_fill":true,"flags_generic_stroke":true,"flags_outline":true,"flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"pups_glow_outline_linewidth":"1","pups_add_shine":true,"pups_filter":"drop-shadow(4px 4px 5px rgba(0,0,0,0.85)) drop-shadow(3px 3px 3px rgba(0,0,0,0.85))","background_color1":"#230505","background_color2":"#110e3f","background_color3":"#230505","plainfloor_color":"#abb2b9","plainendzone_color_red":"#b71c1c","plainendzone_color_blue":"#0d47a1","wallshadow_color":"#101010","walloutline3_color":"#707b7c","ball_star_red_fill_color":"#ffffff","ball_star_blue_fill_color":"#ffffff","spikes_generic_color":"#000000","spikes_generic_color2":"#ffffff","spikes_border_color":"#000000","bombs_outline1_color":"#6d0534","ballskins_red_x":"192","ballskins_red_y":"288","ballskins_blue_x":"48","ballskins_blue_y":"288","texture_tiles":"https://i.imgur.com/w0BoQSc.png","texture_speedpad":"/textures/crystal/speedpad.png","texture_speedpadRed":"/textures/crystal/speedpadred.png","texture_speedpadBlue":"/textures/crystal/speedpadblue.png","texture_portal":"https://i.imgur.com/pBZJ01i.png","texture_portalRed":"https://i.imgur.com/gi36lja.png","texture_portalBlue":"https://i.imgur.com/Wxda6Pz.png","texture_splats":"https://i.imgur.com/wiV1Yui.png","texture_gravityWell":""},
'select-Jojo Stained Glass': {"background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-JoJo Stained Glass 3-4","texture_floor1_filter":"opacity(30%) hue-rotate(60deg)","texture_floor1_size":"0.65","plainteam":true,"texture_team":"select-Eek","texture_team_filter":"saturate(0)","texture_team_gco":"destination-in","teamtile_filter":"saturate(150%) brightness(65%)","clear_under_team_tiles":true,"plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Medium Random Checks","clear_under_endzone_tiles":true,"wallshadow_size":"0","wallshadow_blur":"6","wallshadow_opacity":"1","wallshadow_inner":true,"walloutline2_size":"1","walloutline3_size":"1","texture_walls1":"select-JoJo Metal 7-4","texture_walls1_filter":"opacity(70%)","texture_walls1_size":"0.3","walls_filter":"drop-shadow(3px 3px 4px black) brightness(135%)","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"2","wall_light2":true,"wall_light2_blur":"2","wall_light2_surfaceScale":"2","basecircle1_opacity":"1","basecircle1_glow":"4","basecircle1_glow_multiplier":"3","basecircle1_dashpattern":"40,10, 10,5, 5,5, 10,10","flagline_linewidth":"1","flagline_opacity":"0.5","balls_plain":true,"ball_outline1":true,"ball_outline1_linewidth":"5","ball_outline1_radius":"2.5","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_gco":"source-atop","ball_outline2":true,"ball_outline3":true,"ball_outline3_linewidth":"1","ball_outline3_radius":"6","ball_outline3_opacity":"0.85","spikes_border_linewidth":"1","bombs_outline1":true,"bombs_outline1_linewidth":"3","bombs_outline1_segments":"0","bombs_outline1_radius":"1.5","gate_shadows":true,"background_color1":"#c0c0c0","plainfloor_color":"#abb2b9","plainendzone_color_red":"#b71c1c","plainendzone_color_blue":"#0d47a1","wallshadow_color":"#101010","walloutline2_color":"#080808","walloutline3_color":"#7f8c8d","wall_light1_color":"#e57373","wall_light2_color":"#81d4fa","ball_gradient_color1_red":"#400000","ball_gradient_color1_blue":"#011951","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline3_color_red":"#ffffff","ball_outline3_color_blue":"#ffffff","spikes_border_color":"#616161","bombs_outline1_color":"#a30d0d","ballskins_red_x":"192","ballskins_red_y":"48","ballskins_blue_x":"144","ballskins_blue_y":"192","texture_tiles":"https://i.imgur.com/w0BoQSc.png","texture_speedpad":"/textures/crystal/speedpad.png","texture_speedpadRed":"/textures/crystal/speedpadred.png","texture_speedpadBlue":"/textures/crystal/speedpadblue.png","texture_portal":"https://i.imgur.com/pBZJ01i.png","texture_portalRed":"https://i.imgur.com/gi36lja.png","texture_portalBlue":"https://i.imgur.com/Wxda6Pz.png","texture_splats":"https://i.imgur.com/wiV1Yui.png","texture_gravityWell":""},
'select-John Wick': {"background":"value-Blur #2","plainfloor":true,"plainfloor_color_use":true,"floor_contour":true,"floor_contour_opacity":"0.75","floor_contour_size":"75","floor_contour_multiplier":"1","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Diagonal Stripes 2","texture_team_filter":"opacity(50%) saturate(0%)","texture_team_gco":"hard-light","plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Large Diagonal Checks","texture_endzone1_filter":"opacity(25%) saturate(0%)","texture_endzone1_size":"0.4","texture_endzone1_gco":"hard-light","plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"3","walls_filter":"drop-shadow(4px 4px 7px black)","centerline_linewidth":"1","balls_plain":true,"ball_outline1":true,"ball_outline1_linewidth":"10","ball_outline1_radius":"5","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_gco":"source-atop","ballskins_scale_red":"0.95","ballskins_filter_red":"drop-shadow(0 0 1px black) drop-shadow(0 0 1px black)","ballskins_scale_blue":"0.85","ballskins_filter_blue":"drop-shadow(0 0 1px black) drop-shadow(0 0 1px black)","ball_outline2":true,"ball_outline2_radius":"10","ball_outline2_opacity":"0.65","ball_outline3":true,"ball_outline3_linewidth":"1","ball_outline3_radius":"19","ball_outline3_opacity":"0.65","spikes_generic":true,"spikes_generic_points":"6","spikes_generic_outerradius":"15","spikes_border_linewidth":"3","spikes_border_opacity":"0.85","spikes_border_radius":"7","bombs_shine":true,"gates_neutral_tile_opacity":"0.4","gates_neutral_margin":"6","gates_plain_neutral_border":true,"gates_plain_neutral_border_40px":true,"gates_grb_margin":"3","gates_plain_grb_border":true,"gates_plain_grb_border_40px":true,"gate_shadows":true,"pups_add_shine":true,"plainfloor_color":"#000032","floor_contour_color":"#1a237e","plainteam_color_red":"#903030","plainteam_color_blue":"#303290","plainteam_color_yellow":"#5d5c19","plainendzone_color_red":"#a30d0d","plainendzone_color_blue":"#1a237e","plainwalls_color":"#000032","walloutline3_color":"#de3600","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#ffffff","ball_outline2_color_blue":"#ffffff","ball_outline3_color_red":"#ffffff","ball_outline3_color_blue":"#ffffff","spikes_generic_color2":"#131c21","spikes_border_color":"#000000","gates_plain_neutral_border_neutral":"#424242","gates_plain_grb_border_green":"#52c21e","gates_plain_grb_border_red":"#e04040","gates_plain_grb_border_blue":"#1994c3","ballskins_red_x":"240","ballskins_red_y":"96","ballskins_blue_x":"288","ballskins_blue_y":"192","texture_tiles":"/textures/flat/tiles.png","texture_speedpad":"/textures/flat/speedpad.png","texture_speedpadRed":"/textures/flat/speedpadred.png","texture_speedpadBlue":"/textures/flat/speedpadblue.png","texture_portal":"/textures/flat/portal.png","texture_portalRed":"https://i.imgur.com/AKwJbW3.png","texture_portalBlue":"https://i.imgur.com/ycYwyyg.png","texture_splats":"/textures/flat/splats.png","texture_gravityWell":""},
'select-Fli': {"background_size2":"50","background_size3":"100","background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Cloudy","texture_floor1_filter":"opacity(10%) saturate(0%)","texture_floor1_size":"0.8","texture_floor1_gco":"luminosity","grid2_size":"80","grid2_length":"80","grid2_opacity":"0.06","grid2_rectangles":true,"grid2_shadow":true,"grid2_applytexture3togrid2":true,"texture_floor3":"select-Spaced Diagonal Lines","texture_floor3_filter":"saturate(0) opacity(85%)","texture_floor3_size":"1.65","plainteam":true,"plainteam_color_use":true,"teamtile_checker_size":"3","teamtile_checker_margin":"2","teamtile_checker_opacity":"1","teamtile_checker_normal":true,"teamtile_checker_gco":"value-destination-out","teamtile_filter":"opacity(40%)","plainendzone":true,"plainendzone_color_use":true,"endzone_checker1_size":"7","endzone_checker1_margin":"13","endzone_checker1_opacity":"0.8","endzone_checker1_straight":true,"plainwalls_color_use":true,"walloutline3_size":"1","walloutline3_opacity":"0.4","walloutline3_exclusion":true,"texture_walls2":"select-Eek","texture_walls2_filter":"opacity(40%) saturate(0)","texture_walls2_size":"0.5","texture_walls2_gco":"lighter","walls_filter":"drop-shadow(4px 4px 6px black)","wall_light1":true,"wall_light1_constant":"3.65","wall_light1_exponent":"24","wall_light1_offset":"-200","wall_light1_z":"400","wall_light2":true,"wall_light2_constant":"3.65","wall_light2_exponent":"24","wall_light2_offset":"-200","wall_light2_z":"400","centerline_linewidth":"1","centerline_dashpattern":"8,5","flagline_linewidth":"1","flagline_opacity":"0.6","flagline_dashpattern":"1,4","texture_base":"select-Nautical","texture_base_filter":"opacity(20%) drop-shadow(0 0 1px white)","texture_base_size":"0.5","texture_base_gradient":true,"texture_base_gradient_opacity1_red":"0.25","texture_base_gradient_opacity1_blue":"0.25","texture_base_gradient_position":"0.35","texture_base_gradient_radial":true,"balls_plain":true,"ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_scale_red":"0.6","ballskins_scale_blue":"0.6","ball_outline2":true,"ball_outline2_linewidth":"3","ball_outline2_radius":"15.5","ball_outline2_dashpattern":"8","ball_outline2_opacity":"0.8","ball_outline4":true,"ball_outline4_linewidth":"1","ball_outline4_radius":"12","ball_outline4_opacity":"0.85","ball_outline4_gco":"source-over","spikes_generic":true,"bombs_draw_exploded_opacity":"0.2","gates_neutral_tile_opacity":"0.5","gates_neutral_margin":"1","gates_plain_neutral_border":true,"gates_plain_grb_pyramid":true,"gates_plain_grb_pyramid_margin":"2","gates_plain_grb_cross":true,"gates_plain_grb_cross_margin":"12","gates_plain_grb_cross_opacity":"0.85","gates_plain_grb_cross_shadow":"2","gates_plain_grb_cross_destinationOut":true,"gates_plain_grb_roundedRect":true,"gates_plain_grb_roundedRect_linewidth":"2","gates_plain_grb_roundedRect_margin":"3","gates_plain_grb_roundedRect_opacity":"1","gates_plain_grb_roundedRect_dropShadow":"1","gates_plain_grb_roundedRect_dropShadowBlack":true,"gate_shadows":true,"pups_add_shine":true,"pups_filter":"drop-shadow(2px 2px 1px rgba(0,0,0,0.8)) drop-shadow(2px 2px 3px rgba(0,0,0,0.6))","boosts_generic":true,"boosts_generic_texture_opacity":"1","boosts_generic_border_linewidth":"2","boosts_generic_border_opacity":"0.75","boosts_generic_inner_arrows_opacity":"1","boosts_generic_inner_arrows_start":"8","boosts_generic_inner_arrows_shift":"0","boosts_glow":true,"background_color1":"#14151a","background_color2":"#182230","background_color3":"#14151a","plainfloor_color":"#101010","grid2_color":"#fafafa","plainteam_color_red":"#800000","plainteam_color_blue":"#1f4db7","plainteam_color_yellow":"#9e7900","plainendzone_color_red":"#800000","plainendzone_color_blue":"#004280","endzone_checker1_color":"#ffffff","plainwalls_color":"#37474f","walloutline3_color":"#455a64","wall_light1_color":"#c5e1a5","wall_light2_color":"#ffa726","centerline_color":"#757575","flagline_color":"#bdbdbd","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#ffffff","ball_outline2_color_blue":"#ffffff","gates_plain_grb_cross_green":"#00ff80","gates_plain_grb_cross_red":"#f44336","gates_plain_grb_cross_blue":"#29b6f6","boosts_glow_color_red":"#7a1f1f","boosts_glow_color_blue":"#1a508e","boosts_glow_color_yellow":"#686627","ballskins_red_x":"48","ballskins_red_y":"96","ballskins_blue_x":"48","ballskins_blue_y":"96","texture_tiles":"/textures/sparkle/tiles.png","texture_speedpad":"/textures/sparkle/speedpad.png","texture_speedpadRed":"/textures/sparkle/speedpadred.png","texture_speedpadBlue":"/textures/sparkle/speedpadblue.png","texture_portal":"/textures/sparkle/portal.png","texture_portalRed":"https://i.imgur.com/PEQIqPH.png","texture_portalBlue":"https://i.imgur.com/lK2srvX.png","texture_splats":"/textures/sparkle/splats.png","texture_gravityWell":""},
'select-8 Bit': {"background_size1":"30","background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Eek","texture_floor1_filter":"opacity(40%) saturate(0)","texture_floor1_size":"1.25","texture_floor1_gco":"hard-light","texture_floor2":"select-Cartoony Grass Tiles","texture_floor2_filter":"opacity(50%) saturate(0%) brightness(150%) contrast(160%)","texture_floor2_size":"0.65","texture_floor2_gco":"exclusion","plainteam":true,"texture_team":"select-Diamond Plate","texture_team_filter":"opacity(80%) saturate(0%)","texture_team_size":"0.5","texture_team_gco":"hard-light","teamtile_filter":"opacity(50%)","texture_endzone1":"select-Eek","texture_endzone1_filter":"opacity(60%) saturate(0)","texture_endzone1_size":"0.6","texture_endzone1_gco":"hard-light","walls_filter":"drop-shadow(5px 8px 8px black)","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"8","wall_light1_constant":"4.65","wall_light1_exponent":"12","wall_light1_z":"100","wall_light_edgeonly":false,"wall_light2":true,"wall_light2_blur":"2","wall_light2_surfaceScale":"2","wall_light2_constant":"2.65","wall_light2_exponent":"15","wall_light2_z":"100","basecircle1_linewidth":"2","basecircle1_opacity":"1","basecircle1_glow":"4","basecircle1_glow_multiplier":"3","basecircle1_dashpattern":"40,10, 10,5, 5,5, 10,10","flagline_linewidth":"1","flagline_opacity":"0.5","spikes_tint":true,"spikes_filter":"brightness(125%) contrast(125%) drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","bombs_filter":"drop-shadow(0 0 4px rgba(255, 153, 255, 0.5))","gates_neutral_tile_opacity":"0.4","gates_neutral_margin":"1","gate_shadows":true,"flags_draw_taken_opacity":"0.16","flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"background_color1":"#000000","background_color2":"#408080","plainfloor_color":"#212121","plainteam_color_red":"#a30d0d","plainteam_color_blue":"#0d47a1","plainteam_color_yellow":"#666600","wall_light1_color":"#572b5f","wall_light2_color":"#43a047","flagline_color":"#dcedc8","spikes_tint_color":"#c5e1a5","texture_tiles":"https://i.imgur.com/Piophnq.png","texture_speedpad":"https://i.imgur.com/nTPOt5C.png","texture_speedpadRed":"https://i.imgur.com/ded8r1T.png","texture_speedpadBlue":"https://i.imgur.com/OFEYTgy.png","texture_portal":"https://i.imgur.com/3SYCwY5.png","texture_portalRed":"https://i.imgur.com/qAJ8wPL.png","texture_portalBlue":"https://i.imgur.com/vggOmNp.png","texture_splats":"https://i.imgur.com/IIFG2nS.png","texture_gravityWell":""},
'select-Dude': {"background":"value-radial","floortile_opacity":"0.65","checker1_size":"40","teamtile_filter":"opacity(70%)","clear_under_team_tiles":true,"clear_under_endzone_tiles":true,"walloutline2_size":"3","walloutline3_size":"1","texture_walls2":"select-Spectrum Blur","texture_walls2_filter":"opacity(40%)","texture_walls2_size":"0","texture_walls2_gco":"luminosity","walls_filter":"drop-shadow(4px 4px 5px black)","basecircle1_radius":"250","basecircle1_opacity":"0.4","basecircle1_dashpattern":"20,5","basecircle2_radius":"290","basecircle2_opacity":"1","basecircle2_glow":"4","basecircle2_glow_multiplier":"3","basecircle2_dashpattern":"40,30","ball_outline1":true,"ball_outline1_linewidth":"3","ball_outline1_radius":"14","ball_outline1_gco":"source-atop","ballskins":true,"ballskins_scale_red":"0.45","ballskins_filter_red":"invert(100%)","ballskins_scale_blue":"0.4","ballskins_filter_blue":"invert(100%)","ball_outline3":true,"ball_outline3_linewidth":"1","ball_outline3_radius":"19","ball_outline3_opacity":"0.5","gates_neutral_tile_opacity":"0.75","gates_neutral_margin":"4","gates_plain_neutral_border":true,"gates_plain_neutral_border_40px":true,"gate_shadows":true,"flags_generic_fill":true,"flags_generic_stroke":true,"flags_generic_gradient":true,"flags_outline":true,"flags_outline_opacity":"0.8","flags_draw_taken_opacity":"0.2","pups_glow_outline":true,"pups_glow_outline_linewidth":"1","pups_glow_outline_opacity":"0.5","pups_filter":"drop-shadow(2px 2px 2px black)","gravitywell1_linewidth":"20","gravitywell1_opacity":"0.6","gravitywell1_gradientAlt":true,"gravitywell2_linewidth":"0","background_color1":"#010d23","background_color2":"#814141","walloutline2_color":"#000000","walloutline3_color":"#eceff1","ball_outline1_color_red":"#d32f2f","ball_outline1_color_blue":"#1976d2","flags_generic_fill_red":"#c62828","flags_generic_fill_blue":"#1565c0","flags_generic_fill_yellow":"#f9a825","flags_generic_stroke_red":"#400000","flags_generic_stroke_blue":"#021c73","flags_generic_stroke_yellow":"#403f00","flags_outline_color":"#000000","gravitywell1_color":"#300871","ballskins_red_x":"192","ballskins_red_y":"48","ballskins_blue_x":"192","ballskins_blue_y":"0","texture_tiles":"https://i.imgur.com/sOCnOwR.png","texture_speedpad":"https://i.imgur.com/IJDyrQu.png","texture_speedpadRed":"https://i.imgur.com/p3FYyPR.png","texture_speedpadBlue":"https://i.imgur.com/YHR5gjx.png","texture_portal":"https://i.imgur.com/6hhILt4.png","texture_portalRed":"https://i.imgur.com/yapL8cx.png","texture_portalBlue":"https://i.imgur.com/CAkWcsh.png","texture_splats":"https://i.imgur.com/wiV1Yui.png","texture_gravityWell":""},
'select-Atlas': {"background":"value-Blur #1","plainfloor":true,"plainfloor_color_use":true,"floor_contour":true,"floor_contour_opacity":"0.8","floor_contour_size":"120","floor_contour_multiplier":"1","checker1_size":"10","checker1_opacity":"0.2","texture_floor2":"select-Atlas Academy","texture_floor2_filter":"opacity(80%)","texture_floor2_gco":"screen","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Hexes #6","texture_team_filter":"opacity(50%)","texture_team_size":"0.2","texture_team_gco":"luminosity","teamtile_filter":"saturate(50%) brightness(85%) contrast(120%)","plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Flag","texture_endzone1_filter":"opacity(50%) saturate(0%)","texture_endzone1_size":"0.45","walloutline2_size":"2","walloutline3_size":"1","walloutline3_opacity":"0.5","texture_walls2":"select-HL2 Metal #5","texture_walls2_filter":"saturate(150%) contrast(120%)","texture_walls2_size":"0.5","texture_walls2_gco":"source-over","walls_filter":"drop-shadow(3px 3px 5px rgba(0,0,0,0.75))","wall_light1":true,"wall_light1_blur":"6","wall_light1_surfaceScale":"5","wall_light1_constant":"1.95","wall_light1_exponent":"8","wall_light1_offset":"-800","wall_light1_z":"250","basecircle1_radius":"250","basecircle1_opacity":"0.35","basecircle1_gradient":true,"basecircle2_radius":"290","basecircle2_opacity":"1","basecircle2_glow":"4","basecircle2_glow_multiplier":"3","basecircle2_dashpattern":"40,30","texture_base":"select-Spiral","texture_base_filter":"opacity(20%) saturate(0) brightness(0)","texture_base_size":"0.5","balls_plain":true,"ball_gradient":true,"ball_gradient_position":"0.25","ball_gradient_opacity1_red":"0.5","ball_gradient_opacity2_red":"0.75","ball_gradient_opacity1_blue":"0.5","ball_gradient_opacity2_blue":"0.75","ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_scale_red":"0.65","ballskins_scale_blue":"0.65","ball_outline2":true,"ball_outline2_radius":"15","ball_outline2_gco":"destination-out","ball_outline3":true,"ball_outline3_linewidth":"3","ball_outline3_radius":"17.5","ball_outline3_dashpattern":"10,15","spikes_border_linewidth":"1","buttons_generic":true,"bombs_outline1":true,"bombs_outline1_opacity":"0.7","bombs_draw_exploded_opacity":"0.2","gates_neutral_tile_opacity":"0.8","gates_plain_grb_detail":true,"gates_plain_grb_detail_size":"1","gates_plain_grb_detail_opacity":"0.75","gates_plain_grb_detail_dropShadowBlack":true,"gate_shadows":true,"flags_outline":true,"flags_outline_segments":"14","flags_outline_opacity":"0.85","flags_draw_taken_opacity":"0.15","pups_glow_outline":true,"pups_glow_outline_linewidth":"1","pups_glow_outline_opacity":"0.65","pups_add_shine":true,"pups_filter":"drop-shadow(4px 4px 3px rgba(0,0,0,0.5)) drop-shadow(3px 3px 2px rgba(0,0,0,0.65))","plainfloor_color":"#17202a","plainteam_color_red":"#903030","plainteam_color_blue":"#314581","plainteam_color_yellow":"#908f30","plainendzone_color_red":"#400000","plainendzone_color_blue":"#002140","walloutline2_color":"#101010","walloutline3_color":"#e0e0e0","wall_light1_color":"#212f3d","balls_plain_color_red":"#e36363","balls_plain_color_blue":"#2883d2","ball_gradient_color1_red":"#400000","ball_gradient_color1_blue":"#01165b","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#101010","ball_outline2_color_blue":"#101010","ball_outline3_color_red":"#eeeeee","ball_outline3_color_blue":"#eeeeee","bombs_outline1_color":"#abb2b9","gates_plain_grb_detail_green":"#c8e6c9","gates_plain_grb_detail_red":"#ef9a9a","gates_plain_grb_detail_blue":"#bbdefb","ballskins_red_x":"288","ballskins_red_y":"144","ballskins_blue_x":"240","ballskins_blue_y":"0","texture_tiles":"/textures/plique/tiles.png","texture_speedpad":"/textures/plique/speedpad.png","texture_speedpadRed":"/textures/plique/speedpadred.png","texture_speedpadBlue":"/textures/plique/speedpadblue.png","texture_portal":"/textures/plique/portal.png","texture_portalRed":"https://i.imgur.com/afVFUtH.png","texture_portalBlue":"https://i.imgur.com/nVrXCtp.png","texture_splats":"/textures/plique/splats.png","texture_gravityWell":""},
'select-Grinch': {"background_size2":"50","background_size3":"100","background":"value-linear","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-JoJo Blur #37","texture_floor1_filter":"opacity(30%) hue-rotate(300deg)","texture_floor1_size":"0","grid1_size":"20","grid1_length":"20","grid1_opacity":"0.07","grid1_square":true,"grid1_shadow":"drop-shadow(1px 1px 0px black) drop-shadow(1px 1px 0px black)","checker1_size":"20","checker1_opacity":"0.1","checker1_density":"0.5","checker1_random":true,"texture_floor2":"select-M4tchb0x Blur","texture_floor2_filter":"opacity(80%) hue-rotate(300deg) brightness(60%)","texture_floor2_size":"0","texture_floor2_gco":"screen","floor_filter":"hue-rotate(50deg)","plainteam":true,"plainteam_color_use":true,"teamtile_filter":"opacity(50%)","plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Bright Dots","texture_endzone1_filter":"opacity(80%) saturate(0)","texture_endzone1_size":"0.2","texture_endzone1_gco":"hard-light","plainwalls":true,"plainwalls_color_use":true,"walloutline2_size":"2","walloutline3_size":"3","texture_walls2":"select-HL2 Sand #14","texture_walls2_filter":"opacity(60%) saturate(0)","texture_walls2_size":"0.6","walls_filter":"drop-shadow(4px 4px 6px black)","centerline_linewidth":"1","texture_base":"select-Claw","texture_base_filter":"opacity(15%)","texture_base_size":"1.1","balls_plain":true,"balls_clip_38px":false,"ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_opacity":"0.75","ballskins_scale_red":"0.45","ballskins_scale_blue":"0.45","ball_outline2":true,"ball_outline2_linewidth":"1","ball_outline2_radius":"12","ball_outline2_opacity":"0.85","ball_outline3":true,"ball_outline3_linewidth":"1","ball_outline3_opacity":"0.85","spikes_generic":true,"bombs_draw_exploded_opacity":"0.2","gates_neutral_tile_opacity":"0.5","gates_neutral_margin":"1","gate_shadows":true,"pups_glow_outline":true,"background_color1":"#14151a","background_color2":"#182230","background_color3":"#14151a","plainfloor_color":"#000000","grid1_color":"#808b96","plainteam_color_red":"#800000","plainteam_color_blue":"#0737a6","plainteam_color_yellow":"#9e7900","plainendzone_color_red":"#570000","plainendzone_color_blue":"#043071","plainwalls_color":"#006064","walloutline2_color":"#101010","walloutline3_color":"#c6c8ca","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#101010","ball_outline2_color_blue":"#101010","ball_outline3_color_red":"#101010","ball_outline3_color_blue":"#101010","ballskins_red_x":"96","ballskins_red_y":"336","ballskins_blue_x":"96","ballskins_blue_y":"336","texture_tiles":"/textures/sparkle/tiles.png","texture_speedpad":"/textures/sparkle/speedpad.png","texture_speedpadRed":"/textures/sparkle/speedpadred.png","texture_speedpadBlue":"/textures/sparkle/speedpadblue.png","texture_portal":"/textures/sparkle/portal.png","texture_portalRed":"https://i.imgur.com/PEQIqPH.png","texture_portalBlue":"https://i.imgur.com/lK2srvX.png","texture_splats":"/textures/sparkle/splats.png","texture_gravityWell":""},
'select-Plaque': {"background_angle":"0","background_size2":"80","background_size3":"100","background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"grid1_size":"40","grid1_opacity":"0.15","grid1_square":true,"texture_floor2":"select-Dark Concrete Tile (40px)","texture_floor2_filter":"saturate(0) opacity(30%)","texture_floor3":"select-Cloud Blur","texture_floor3_filter":"opacity(50%) invert(100%)","texture_floor3_size":"0","texture_floor3_gco":"multiply","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Cloud Blur","texture_team_filter":"opacity(60%) invert(100%)","texture_team_size":"0.25","texture_team_gco":"xor","teamtile_checker_size":"5","teamtile_checker_margin":"3","teamtile_checker_opacity":"0.75","teamtile_checker_straight":true,"teamtile_checker_gco":"value-destination-in","teamtile_filter":"opacity(65%)","plainendzone":true,"endzone_checker1_size":"15","endzone_checker1_margin":"5","endzone_checker1_opacity":"0.75","endzone_checker1_straight":true,"endzone_checker1_rotate":"45","texture_endzone1":"select-Sparkle Lines","texture_endzone1_filter":"opacity(40%) saturate(0)","texture_endzone1_size":"0.65","texture_endzone1_gco":"luminosity","endzone_filter":"saturate(150%)","plainwalls":true,"plainwalls_color_use":true,"walloutline2_size":"2","texture_walls1":"select-Abstract Curves","texture_walls1_filter":"opacity(40%) saturate(60%)","texture_walls1_gco":"hard-light","walls_filter":"drop-shadow(2px 2px 4px black) drop-shadow(3px 3px 5px black)","wall_light1":true,"wall_light1_blur":"2","wall_light1_surfaceScale":"12","wall_light1_constant":"3.5","wall_light1_exponent":"40","wall_light1_offset":"-900","wall_light_edgeonly":false,"map_outer_filter":"drop-shadow(0px 0px 100px rgba(0,140,240,0.5)) drop-shadow(0px 0px 70px rgba(0,140,240,0.5))","map_outer_shrink":true,"basecircle1_linewidth":"10","basecircle1_radius":"215","basecircle1_blur":"1","basecircle1_glow":"5","basecircle1_glow_multiplier":"2","basecircle1_octagon":true,"texture_base":"select-SpaceX Pad","texture_base_filter":"opacity(25%)","texture_base_size":"0.7","ball_outline1":true,"ball_outline1_linewidth":"8","ball_outline1_radius":"4","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_scale_red":"0.65","ballskins_scale_blue":"0.65","ball_outline2":true,"ball_outline2_linewidth":"2","ball_outline2_radius":"19","ball_outline2_dashpattern":"18,8","ball_outline2_opacity":"0.6","ball_outline2_blur":true,"ball_outline2_gco":"source-atop","spikes_generic":true,"spikes_filter":"drop-shadow(0px 0px 1px #ffffff)","buttons_generic":true,"bombs_outline1":true,"bombs_outline1_opacity":"0.65","bombs_draw_exploded_opacity":"0.15","bombs_filter":"drop-shadow(0 0 3px rgba(255, 153, 0, 0.4))","gates_neutral_tile_opacity":"0.4","gates_plain_neutral_gradient":true,"gates_plain_neutral_gradient_size":"10","gates_plain_grb_gradient":true,"gates_plain_grb_gradient_opacity":"0.2","gates_plain_grb_gradient_size":"10","gates_plain_grb_gradient_gco":"source-atop","gate_shadows":true,"flags_generic_fill":true,"flags_generic_stroke":true,"flags_generic_gradient":true,"flags_outline":true,"flags_draw_taken_opacity":"0.20","flags_glow":true,"pups_glow":true,"pups_glow_outline":true,"pups_add_shine":true,"pups_filter":"drop-shadow(2px 2px 1px rgba(0,0,0,0.8)) drop-shadow(2px 2px 3px rgba(0,0,0,0.6))","boosts_outline":true,"portals_outline":true,"gravitywell1_linewidth":"50","gravitywell1_opacity":"0.75","background_color1":"#142a3e","background_color2":"#0d0d0d","background_color3":"#212f3d","plainfloor_color":"#212f3d","grid1_color":"#757575","plainteam_color_red":"#ef5350","plainteam_color_blue":"#4fc3f7","plainteam_color_yellow":"#c0be40","teamtile_checker_color":"#ffffff","endzone_checker1_color":"#ffffff","plainwalls_color":"#171821","walloutline2_color":"#c0ca33","wall_light1_color":"#ffe082","basecircle1_color_yellow":"#747320","basecircle1_color_red":"#741a1a","basecircle1_color_blue":"#223677","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#ffffff","ball_outline2_color_blue":"#ffffff","buttons_generic_color_inner":"#3a3f6e","buttons_generic_color_border":"#757575","gates_plain_grb_gradient_green":"#000000","gates_plain_grb_gradient_red":"#000000","gates_plain_grb_gradient_blue":"#000000","flags_generic_gradient_red":"#ffffff","flags_generic_gradient_blue":"#ffffff","flags_generic_gradient_yellow":"#ffffff","flags_glow_color_red":"#e53935","flags_glow_color_blue":"#2196f3","flags_glow_color_yellow":"#f9a825","portals_outline_color":"#757575","ballskins_red_x":"0","ballskins_red_y":"96","ballskins_blue_x":"0","ballskins_blue_y":"96","texture_tiles":"/textures/plique/tiles.png","texture_speedpad":"/textures/plique/speedpad.png","texture_speedpadRed":"/textures/plique/speedpadred.png","texture_speedpadBlue":"/textures/plique/speedpadblue.png","texture_portal":"/textures/plique/portal.png","texture_portalRed":"https://i.imgur.com/afVFUtH.png","texture_portalBlue":"https://i.imgur.com/nVrXCtp.png","texture_splats":"/textures/plique/splats.png","texture_gravityWell":"https://i.imgur.com/zPdBr5d.png"},
'select-Shiny': {"background":"value-radial","plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-Big Angled Squares 2","texture_floor1_filter":"opacity(20%) saturate(0%)","texture_floor1_gco":"luminosity","floor_gradient1":true,"floor_gradient1_opacity1":"0","floor_gradient1_opacity2":"0.4","floor_gradient1_repeats":"2","floor_gradient1_size":"80","floor_gradient2":true,"floor_gradient2_type":"value-centercircle","floor_gradient2_opacity1":"0.25","floor_gradient2_opacity2":"0.8","floor_gradient2_size":"50","floor_contour":true,"floor_contour_size":"100","floor_contour_multiplier":"1","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Graphy","texture_team_filter":"contrast(500%)","teamtile_filter":"opacity(65%) saturate(60%) drop-shadow(0 0 1px black)","clear_under_team_tiles":true,"plainendzone":true,"texture_endzone1":"select-Diagonal Stripes 5","texture_endzone1_filter":"opacity(50%) saturate(0%)","texture_endzone1_gco":"luminosity","endzone_filter":"saturate(120%) brightness(120%)","clear_under_endzone_tiles":true,"plainwalls":true,"plainwalls_color_use":true,"walloutline3_size":"1","walloutline3_opacity":"0.4","walloutline3_exclusion":true,"walls_filter":"drop-shadow(4px 4px 4px rgba(0,0,0,0.4)) drop-shadow(2px 2px 2px rgba(0,0,0,0.4))","wall_light1":true,"wall_light1_surfaceScale":"2","wall_light1_constant":"0.8","wall_light1_exponent":"10","wall_light_edgeonly":false,"wall_light2":true,"wall_light2_blur":"2","wall_light2_surfaceScale":"6","wall_light2_constant":"0.8","wall_light2_exponent":"10","wall_text_fontsize":"18","wall_text_stroke_opacity":"0","map_outer_filter":"drop-shadow(10px 10px 20px black)","basecircle1_opacity":"1","basecircle1_glow":"4","basecircle1_glow_multiplier":"3","basecircle1_segments":"12","basecircle2_linewidth":"2","basecircle2_radius":"150","basecircle2_opacity":"1","basecircle2_glow":"3","basecircle2_glow_multiplier":"3","basecircle2_dashpattern":"","basecircle2_segments":"4","balls_plain":true,"ball_gradient":true,"ball_gradient_position":"0.75","ball_gradient_opacity1_red":"0.5","ball_gradient_opacity1_blue":"0.5","ball_gradient_opacity2_blue":"0.45","ball_outline1":true,"ball_outline1_linewidth":"8","ball_outline1_radius":"10","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ball_outline2":true,"ball_outline2_dashpattern":"10,12","spikes_generic":true,"spikes_generic_points":"10","spikes_generic_innerradius":"7","spikes_filter":"drop-shadow(3px 3px 1px black)","buttons_generic":true,"buttons_shine":true,"bombs_shine":true,"bombs_outline1":true,"bombs_outline1_linewidth":"1","bombs_outline1_segments":"2","bombs_outline1_radius":"13","bombs_outline1_opacity":"0.7","bombs_filter":"brightness(40%) drop-shadow(0 0 1px white)","gates_neutral_tile_opacity":"0","gates_neutral_margin":"1","gates_plain_neutral_base":true,"gates_plain_neutral_base_opacity":"0.2","gates_plain_neutral_cross":true,"gates_plain_neutral_cross_opacity":"1","gates_plain_neutral_cross_destinationOut":true,"gates_grb_tile_opacity":"0","gates_plain_grb_base":true,"gates_plain_grb_pyramid":true,"gates_plain_grb_pyramid_useAltStyle":true,"gates_plain_grb_cutout":true,"gates_plain_grb_cutout_margin":"14","gates_plain_grb_square":true,"gates_plain_grb_square_margin":"8","gates_plain_grb_square_fillOpacity":"0.4","gates_plain_grb_square_blur":"3","gate_shadows":true,"flags_outline":true,"flags_draw_taken_opacity":"0.2","pups_generic_jj_stroke":true,"pups_generic_jj_fill":true,"pups_generic_jj_shadow":true,"pups_generic_rb_stroke":true,"pups_generic_rb_fill":true,"pups_generic_rb_shadow":true,"pups_generic_tp_stroke":true,"pups_generic_tp_fill":true,"pups_generic_tp_shadow":true,"pups_generic_empty_stroke":true,"pups_generic_empty_fill":true,"pups_generic_empty_shadow":true,"boosts_generic":true,"boosts_generic_border_opacity":"0.85","boosts_generic_frames":"6","boosts_generic_segments":true,"boosts_generic_segments_linewidth":"3","boosts_generic_segments_blur":"2","boosts_generic_filter":"drop-shadow(2px 2px 1px black)","boosts_outline":true,"portals_generic":true,"portals_generic_blur":"1","portals_generic_frames":"8","background_color1":"#808b96","background_color2":"#2c3e50","plainfloor_color":"#1c2833","floor_gradient1_color2":"#e0e0e0","floor_gradient2_color2":"#e0e0e0","plainteam_color_red":"#d32f2f","plainteam_color_blue":"#2196f3","plainteam_color_yellow":"#c0be40","clear_under_team_tiles_color":"#616161","clear_under_endzone_tiles_color":"#616161","plainwalls_color":"#080808","walloutline3_color":"#c5cae9","wall_light1_color":"#cfd8dc","wall_light2_color":"#5c6bc0","wall_text_color":"#eaecee","ball_gradient_color1_red":"#ef5350","ball_gradient_color2_red":"#ffebee","ball_gradient_color1_blue":"#29b6f6","ball_gradient_color2_blue":"#00403f","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#ffffff","ball_outline2_color_blue":"#ffffff","buttons_shine_color":"#eeeeee","bombs_tint_color":"#9c27b0","gates_plain_neutral_base_neutral":"#e0e0e0","gates_plain_grb_base_green":"#00ff00","gates_plain_grb_base_red":"#c62828","gates_plain_grb_base_blue":"#1565c0","gates_plain_grb_square_green":"#ffffff","gates_plain_grb_square_red":"#ffffff","gates_plain_grb_square_blue":"#ffffff","pups_generic_jj_color_border":"#e3f2fd","pups_generic_jj_color_fill":"#26c6da","pups_generic_rb_color_border":"#fff8e1","pups_generic_rb_color_fill":"#ff9800","pups_generic_tp_color_border":"#f0f4c3","pups_generic_tp_color_fill":"#43a047","pups_glow_color_jj":"#b3e5fc","pups_glow_color_rb":"#ffcc80","pups_glow_color_tp":"#6aec8a","boosts_generic_yellow_color":"#ffeb3b","boosts_generic_red_color":"#ef5350","boosts_generic_blue_color":"#42a5f5","boosts_generic_segments_yellow":"#fff9c4","boosts_generic_segments_red":"#ffcdd2","boosts_generic_segments_blue":"#b3e5fc","portals_generic_color":"#40c07f","portals_generic_color_alt":"#ab47bc","portals_generic_color_background":"#22232d","portals_generic_color_blue":"#0277bd","portals_generic_color_blue_alt":"#90caf9","texture_tiles":"/textures/plumb/tiles.png","texture_speedpad":"/textures/plumb/speedpad.png","texture_speedpadRed":"/textures/plumb/speedpadred.png","texture_speedpadBlue":"/textures/plumb/speedpadblue.png","texture_portal":"/textures/plumb/portal.png","texture_portalRed":"/textures/plumb/portalred.png","texture_portalBlue":"/textures/plumb/portalblue.png","texture_splats":"/textures/plumb/splats.png","texture_gravityWell":""},
'select-Swizzle': {"background":"value-linear","vpcss_border_size":"1","vpcss_radius_border":"12","vpcss_only_apply_in_game":false,"vpcss_shadow1_size":"3","vpcss_shadow1_blur":"8","vpcss_shadow2_size":"3","vpcss_shadow2_blur":"8","vpcss_shadow2_inset":true,"plainfloor":true,"plainfloor_color_use":true,"texture_floor1":"select-RoL H19","texture_floor1_filter":"opacity(60%) saturate(0) brightness(60%)","texture_floor1_size":"0","floor_contour":true,"floor_contour_opacity":"0.8","floor_contour_size":"120","floor_contour_multiplier":"1","texture_floor2":"select-Modern-001","texture_floor2_filter":"opacity(25%) saturate(60%)","texture_floor2_size":"0.625","texture_floor2_gco":"hard-light","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Criss Cross Pattern","texture_team_filter":"invert(100%) opacity(30%)","texture_team_size":"0.8889","texture_team_gco":"luminosity","teamtile_filter":"brightness(115%) contrast(120%) opacity(30%)","plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-Gold Squares","texture_endzone1_filter":"opacity(60%) saturate(0) contrast(150%)","texture_endzone1_size":"0.45714285714285714285714285714286","texture_endzone1_gco":"luminosity","walloutline1_size":"1","walloutline2_size":"2","walloutline3_size":"1","walloutline3_opacity":"0.6","texture_walls1":"select-JoJo Relief Lines 5","texture_walls1_filter":"opacity(35%)","texture_walls1_gco":"luminosity","walls_filter":"drop-shadow(3px 3px 5px rgba(0,0,0,0.75)) brightness(70%)","wall_light1":true,"wall_light1_position":"left","wall_light1_constant":"8.95","wall_light1_exponent":"40","wall_light1_offset":"-800","wall_light1_z":"250","wall_light2":true,"wall_light2_position":"right","wall_light2_constant":"8.95","wall_light2_exponent":"40","wall_light2_offset":"-800","wall_light2_z":"250","basecircle1_radius":"250","basecircle1_opacity":"0.35","basecircle2_radius":"290","basecircle2_opacity":"1","basecircle2_glow":"4","basecircle2_glow_multiplier":"3","basecircle2_dashpattern":"40,30","texture_base":"select-Swirl Lines","texture_base_filter":"opacity(20%)","texture_base_size":"0.7","texture_base_gradient_opacity_global":"1","texture_base_gradient_radial":true,"balls_plain":true,"ball_gradient":true,"ball_gradient_position":"0.25","ball_gradient_opacity1_red":"0.5","ball_gradient_opacity2_red":"0.75","ball_gradient_opacity1_blue":"0.5","ball_gradient_opacity2_blue":"0.75","ball_outline1":true,"ball_outline1_linewidth":"12","ball_outline1_radius":"6","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_scale_red":"0.65","ballskins_scale_blue":"0.65","ball_outline2":true,"ball_outline2_radius":"15","ball_outline2_gco":"destination-out","ball_outline3":true,"ball_outline3_linewidth":"3","ball_outline3_radius":"17.5","ball_outline3_dashpattern":"10,15","spikes_border_linewidth":"1","spikes_filter":"brightness(120%)","buttons_generic":true,"buttons_shine":true,"buttons_border_segments_size":"3","buttons_border_segments_opacity":"0.5","buttons_filter":"drop-shadow(2px 2px 1px black)","bombs_shine":true,"bombs_outline1":true,"bombs_outline1_opacity":"0.7","bombs_outline1_gco":"source-atop","bombs_draw_exploded_opacity":"0.2","gates_neutral_tile_opacity":"0.5","gates_plain_neutral_detail":true,"gates_plain_neutral_detail_drawLines":true,"gates_grb_margin":"1","gates_plain_grb_detail":true,"gates_plain_grb_detail_drawLines":true,"gate_shadows":true,"flags_outline":true,"flags_outline_segments":"14","flags_outline_opacity":"0.85","flags_draw_taken_opacity":"0.15","pups_glow_outline":true,"pups_glow_outline_linewidth":"1","pups_glow_outline_opacity":"0.65","pups_add_shine":true,"pups_filter":"drop-shadow(2px 2px 2px rgba(0,0,0,0.5))","background_color1":"#000000","vpcss_border_color":"#bdbdbd","vpcss_shadow1_color":"#4585a2","vpcss_shadow2_color":"#4585a2","plainfloor_color":"#4f5c69","plainteam_color_red":"#903030","plainteam_color_blue":"#314581","plainteam_color_yellow":"#908f30","plainendzone_color_red":"#5a1e1e","plainendzone_color_blue":"#004280","walloutline1_color":"#bdbdbd","walloutline2_color":"#101010","walloutline3_color":"#e0e0e0","wall_light1_color":"#fdd835","wall_light2_color":"#fdd835","balls_plain_color_red":"#e36363","balls_plain_color_blue":"#2883d2","ball_gradient_color1_red":"#400000","ball_gradient_color1_blue":"#01165b","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#101010","ball_outline2_color_blue":"#101010","ball_outline3_color_red":"#eeeeee","ball_outline3_color_blue":"#eeeeee","spikes_tint_color":"#00ff80","buttons_generic_color_outer":"#080808","buttons_generic_color_border":"#cfd8dc","bombs_outline1_color":"#abb2b9","gates_plain_neutral_detail_neutral":"#000000","gates_plain_grb_detail_green":"#000000","gates_plain_grb_detail_red":"#000000","gates_plain_grb_detail_blue":"#000000","ballskins_red_x":"288","ballskins_red_y":"144","ballskins_blue_x":"240","ballskins_blue_y":"0","texture_tiles":"/textures/plique/tiles.png","texture_speedpad":"https://i.imgur.com/MtzdIp1.png","texture_speedpadRed":"https://i.imgur.com/g2eMoAw.png","texture_speedpadBlue":"https://i.imgur.com/yE9a5QR.png","texture_portal":"https://i.imgur.com/r0sOFsJ.png","texture_portalRed":"https://i.imgur.com/afVFUtH.png","texture_portalBlue":"https://i.imgur.com/nVrXCtp.png","texture_splats":"https://i.imgur.com/ABTYq4t.png","texture_gravityWell":""},
'select-Compass': {"background":"value-Blur #11","vpcss_border_size":"6","vpcss_radius_border":"12","vpcss_only_apply_in_game":false,"plainfloor":true,"plainfloor_color_use":true,"floor_contour":true,"floor_contour_opacity":"0.8","floor_contour_size":"120","floor_contour_multiplier":"1","texture_floor3":"select-Grid + Circles","texture_floor3_filter":"opacity(5%) drop-shadow(1px 1px 0px white)","texture_floor3_size":"0.5","plainteam":true,"plainteam_color_use":true,"texture_team":"select-Criss Cross Pattern","texture_team_filter":"invert(100%) opacity(30%)","texture_team_size":"0.8889","texture_team_gco":"luminosity","teamtile_filter":"brightness(115%) contrast(120%) opacity(30%)","clear_under_team_tiles":true,"plainendzone":true,"plainendzone_color_use":true,"texture_endzone1":"select-JoJo Blur #17","texture_endzone1_filter":"opacity(60%) contrast(150%) brightness(80%) saturate(0)","texture_endzone1_size":"0.5","texture_endzone1_gco":"luminosity","texture_endzone2":"select-Checker #1","texture_endzone2_size":"0.25","texture_endzone2_gco":"destination-out","clear_under_endzone_tiles":true,"clear_under_endzone_tiles_destout":true,"plainwalls":true,"walloutline1_size":"1","walloutline2_size":"2","walloutline3_size":"1","walloutline3_opacity":"0.6","texture_walls1":"select-ParaHex","texture_walls1_filter":"opacity(50%) contrast(350%)","texture_walls1_gco":"hard-light","walls_filter":"drop-shadow(4px 4px 6px rgba(0,0,0,1)) brightness(95%)","wall_light1":true,"wall_light1_position":"left","wall_light1_constant":"8.95","wall_light1_exponent":"40","wall_light1_offset":"-800","wall_light1_z":"250","wall_light2":true,"wall_light2_position":"right","wall_light2_constant":"8.95","wall_light2_exponent":"40","wall_light2_offset":"-800","wall_light2_z":"250","basecircle1_radius":"250","basecircle1_opacity":"0.35","basecircle2_radius":"290","basecircle2_opacity":"1","basecircle2_glow":"4","basecircle2_glow_multiplier":"3","basecircle2_dashpattern":"40,30","texture_base":"select-Compass","texture_base_filter":"opacity(6%) invert(100%)","texture_base_size":"0.35","texture_base_gradient_opacity_global":"1","texture_base_gradient_radial":true,"balls_plain":true,"balls_shine":true,"ball_gradient_position":"0.25","ball_gradient_opacity1_red":"0.5","ball_gradient_opacity2_red":"0.75","ball_gradient_opacity1_blue":"0.5","ball_gradient_opacity2_blue":"0.75","ball_outline1":true,"ball_outline1_linewidth":"5","ball_outline1_radius":"2.5","ball_outline1_opacity":"1","ball_outline1_gco":"destination-out","ballskins":true,"ballskins_gco":"luminosity","ballskins_scale_red":"0.65","ballskins_scale_blue":"0.65","ball_outline2":true,"ball_outline2_linewidth":"2","ball_outline2_radius":"15","ball_outline2_gco":"destination-out","ball_outline3":true,"ball_outline3_dashpattern":"14,14","ball_outline3_opacity":"0.9","spikes_generic":true,"spikes_generic_points":"6","spikes_generic_outerradius":"15","spikes_generic_holeradius":"6","spikes_border_linewidth":"1","spikes_border_opacity":"0.75","spikes_border_radius":"4","spikes_filter":"drop-shadow(2px 2px 1px black)","buttons_generic":true,"buttons_shine":true,"buttons_border_segments_size":"3","buttons_border_segments_opacity":"0.5","buttons_filter":"drop-shadow(2px 2px 1px black)","bombs_fuse":true,"bombs_outline2":true,"bombs_outline2_segments":"0","bombs_draw_exploded_opacity":"0.2","bombs_filter":"hue-rotate(210deg) brightness(80%) blur(3px) saturate(250%)","gates_neutral_tile_opacity":"0","gates_neutral_margin":"1","gates_plain_neutral_base":true,"gates_plain_neutral_base_opacity":"0.35","gates_plain_neutral_cutout":true,"gates_plain_neutral_cutout_linewidth":"8","gates_plain_neutral_cutout_margin":"6","gates_plain_neutral_detail":true,"gates_plain_neutral_detail_linewidth":"2","gates_plain_neutral_detail_size":"1","gates_plain_neutral_detail_margin":"4","gates_plain_neutral_detail_opacity":"0.4","gates_plain_neutral_detail_drawCircles":true,"gates_plain_neutral_detail_dropShadow":true,"gates_plain_neutral_detail_dropShadowBlack":true,"gates_grb_tile_opacity":"0","gates_plain_grb_base":true,"gates_plain_grb_base_opacity":"0.5","gates_plain_grb_roundedRect":true,"gates_plain_grb_roundedRect_radius":"5","gates_plain_grb_roundedRect_margin":"3","gates_plain_grb_roundedRect_dropShadow":"1","gates_plain_grb_roundedRect_dropShadowBlack":true,"gates_plain_grb_cutout":true,"gates_plain_grb_cutout_linewidth":"5","gates_plain_grb_cutout_margin":"7","gates_plain_grb_square":true,"gates_plain_grb_square_margin":"6","gates_plain_grb_square_fillOpacity":"0","gates_plain_grb_square_raisedOutline":true,"gates_glow_size":"2","gate_shadows":true,"clear_under_gate_tiles":true,"flags_outline":true,"flags_outline_segments":"14","flags_outline_opacity":"0.85","flags_draw_taken_opacity":"0.15","pups_glow_outline":true,"pups_glow_outline_linewidth":"1","pups_glow_outline_opacity":"0.65","pups_add_shine":true,"pups_filter":"drop-shadow(2px 2px 2px rgba(0,0,0,0.5))","plainfloor_color":"#292f38","plainteam_color_red":"#903030","plainteam_color_blue":"#314581","plainteam_color_yellow":"#908f30","plainendzone_color_red":"#5a1e1e","plainendzone_color_blue":"#004280","walloutline1_color":"#bdbdbd","walloutline2_color":"#101010","walloutline3_color":"#e0e0e0","wall_light1_color":"#039be5","wall_light2_color":"#3949ab","balls_plain_color_red":"#c9443b","balls_plain_color_blue":"#3c84c8","ball_gradient_color1_red":"#400000","ball_gradient_color1_blue":"#01165b","ball_outline1_color_red":"#000000","ball_outline1_color_blue":"#000000","ball_outline2_color_red":"#101010","ball_outline2_color_blue":"#101010","ball_outline3_color_red":"#eeeeee","ball_outline3_color_blue":"#eeeeee","spikes_generic_color":"#fafafa","spikes_tint_color":"#e6ee9c","buttons_generic_color_inner":"#7fc040","buttons_generic_color_outer":"#080808","buttons_generic_color_border":"#cfd8dc","gates_plain_neutral_base_neutral":"#9e9e9e","gates_plain_neutral_detail_neutral":"#000000","gates_plain_grb_base_green":"#2de12d","gates_plain_grb_base_red":"#db1f1f","gates_plain_grb_base_blue":"#1976d2","gates_glow_color_green":"#00ff00","gates_glow_color_red":"#ff0000","gates_glow_color_blue":"#0080ff","ballskins_red_x":"288","ballskins_red_y":"288","ballskins_blue_x":"288","ballskins_blue_y":"288","texture_tiles":"/textures/plique/tiles.png","texture_speedpad":"https://i.imgur.com/MtzdIp1.png","texture_speedpadRed":"https://i.imgur.com/g2eMoAw.png","texture_speedpadBlue":"https://i.imgur.com/yE9a5QR.png","texture_portal":"https://i.imgur.com/r0sOFsJ.png","texture_portalRed":"https://i.imgur.com/afVFUtH.png","texture_portalBlue":"https://i.imgur.com/nVrXCtp.png","texture_splats":"https://i.imgur.com/ABTYq4t.png","texture_gravityWell":""},
'select-Cormacy': {"background":"value-Blur #9","floortile_opacity":"0","checker1_size":"36","checker1_margin":"2","checker1_opacity_min":"0.04","checker1_opacity":"0.16","checker1_density":"0.8","checker1_random":true,"plainteam":true,"plainteam_color_use":true,"texture_team":"select-Diamond Plate","texture_team_filter":"opacity(80%) saturate(0%)","texture_team_size":"0.5","texture_team_gco":"hard-light","teamtile_filter":"opacity(60%) saturate(75%) brightness(60%)","clear_under_team_tiles":true,"texture_endzone1":"select-Eek","texture_endzone1_filter":"opacity(60%) saturate(0)","texture_endzone1_size":"0.55","texture_endzone1_gco":"hard-light","clear_under_endzone_tiles":true,"plainwalls":true,"walloutline3_size":"1","walloutline3_exclusion":true,"walls_filter":"drop-shadow(3px 3px 3px #000)","wall_light1":true,"wall_light1_surfaceScale":"10","wall_light1_constant":"14.65","wall_light1_exponent":"12","wall_light1_z":"300","wall_light2":true,"wall_light2_surfaceScale":"10","wall_light2_constant":"14.65","wall_light2_exponent":"12","wall_light2_z":"300","wall_text_fontsize":"28","wall_text_opacity":"0.75","wall_text_filter":"drop-shadow(1px 1px 1px cyan) drop-shadow(-1px -1px 1px deeppink)","map_outer_filter":"drop-shadow(15px 30px 14px #000)","basecircle1_linewidth":"4","basecircle1_radius":"60","basecircle1_opacity":"0.1","basecircle1_glow_multiplier":"0","basecircle1_segments":"2","texture_base":"select-Ironman","texture_base_filter":"opacity(80%)","texture_base_size":"0.4","texture_base_dont_draw_nf":true,"texture_base_gradient":true,"texture_base_gradient_opacity2_red":"0","texture_base_gradient_opacity2_blue":"0","texture_base_gradient_position":"0.2","ballskins":true,"ballskins_gco":"destination-out","ballskins_scale_red":"0.9","ballskins_scale_blue":"0.9","ball_outline3":true,"ball_outline3_linewidth":"1","ball_outline3_radius":"19","spikes_border_linewidth":"2","spikes_border_radius":"8","spikes_filter":"brightness(125%) contrast(125%) drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","buttons_generic":true,"buttons_generic_color_border_split":true,"buttons_shine":true,"buttons_border_segments_size":"2","buttons_border_segments_opacity":"1","bombs_shine":true,"bombs_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","gates_neutral_tile_opacity":"0.4","gates_neutral_margin":"1","gate_shadows":true,"flags_draw_taken_opacity":"0.2","pups_glow":true,"pups_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","checker1_color":"#9e9e9e","plainteam_color_red":"#7e0080","plainteam_color_blue":"#00807e","plainteam_color_yellow":"#807e00","walloutline3_color":"#757575","wall_light1_color":"#ec407a","wall_light2_color":"#26c6da","wall_text_color":"#e0e0e0","texture_base_gradient_color1_red":"#560222","texture_base_gradient_color2_red":"#f48fb1","texture_base_gradient_color1_blue":"#00286c","texture_base_gradient_color2_blue":"#80deea","ball_outline3_color_red":"#e1bee7","ball_outline3_color_blue":"#b3e5fc","spikes_tint_color":"#c5e1a5","spikes_border_color":"#9ccc65","buttons_generic_color_inner":"auto","buttons_generic_color_outer":"#ff5722","buttons_generic_color_border":"#ffffff","ballskins_red_x":"336","ballskins_red_y":"96","ballskins_blue_x":"336","ballskins_blue_y":"96","texture_tiles":"https://i.imgur.com/6wXnmG3.png","texture_speedpad":"https://i.imgur.com/Z1RYO0d.png","texture_speedpadRed":"https://i.imgur.com/kTam7fJ.png","texture_speedpadBlue":"https://i.imgur.com/mm2UwXr.png","texture_portal":"https://i.imgur.com/NIyYaL4.png","texture_portalRed":"https://i.imgur.com/kEiyDse.png","texture_portalBlue":"https://i.imgur.com/2B4uWwm.png","texture_splats":"https://i.imgur.com/wxJ2ImS.png","texture_gravityWell":""},
'select-Sketchy': {"background":"value-Blur #12","floortile_opacity":"0.08","texture_floor1":"select-Eek","texture_floor1_filter":"opacity(20%) saturate(0) blur(4px)","texture_floor1_size":"1.65","texture_floor1_gco":"hard-light","plainteam":true,"texture_team":"select-Diamond Plate","texture_team_filter":"opacity(80%) saturate(0%)","texture_team_size":"0.5","texture_team_gco":"hard-light","teamtile_filter":"opacity(50%)","texture_endzone1":"select-Eek","texture_endzone1_filter":"opacity(60%) saturate(0)","texture_endzone1_size":"0.6","texture_endzone1_gco":"hard-light","walloutline3_size":"1","walloutline3_exclusion":true,"walls_filter":"drop-shadow(3px 3px 2px #555)","wall_light1":true,"wall_light1_surfaceScale":"10","wall_light1_constant":"4.65","wall_light1_exponent":"12","wall_light1_z":"300","wall_light2":true,"wall_light2_surfaceScale":"10","wall_light2_constant":"4.65","wall_light2_exponent":"12","wall_light2_z":"300","wall_text_fontsize":"24","basecircle1_opacity":"1","basecircle1_glow":"4","basecircle1_glow_multiplier":"3","basecircle1_dashpattern":"40,10, 10,5, 5,5, 10,10","flagline_linewidth":"1","flagline_opacity":"0.5","balls_plain":true,"ballskins":true,"ballskins_opacity":"0.65","ballskins_scale_red":"0.7","ballskins_filter_red":"invert(100%)","ballskins_scale_blue":"0.7","ball_outline3":true,"ball_outline3_linewidth":"4","ball_outline3_radius":"17","ball_outline3_gco":"destination-out","ball_outline4":true,"ball_outline4_linewidth":"3","ball_outline4_radius":"19","ball_outline4_gco":"source-over","spikes_tint":true,"spikes_filter":"brightness(125%) contrast(125%) drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","buttons_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","bombs_shine":true,"bombs_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","gates_neutral_tile_opacity":"0.4","gates_neutral_margin":"1","gate_shadows":true,"flags_draw_taken_opacity":"0.16","flags_glow":true,"pups_glow_outline":true,"pups_bottom_shadow":true,"pups_bottom_shadow_opacity_coefficient":"0.85","pups_filter":"drop-shadow(3px 3px 2px rgba(0,0,0,0.7))","plainteam_color_red":"#a30d0d","plainteam_color_blue":"#0d47a1","plainteam_color_yellow":"#666600","walloutline3_color":"#757575","wall_light1_color":"#572b5f","wall_light2_color":"#311b92","wall_text_color":"#1565c0","flagline_color":"#dcedc8","spikes_tint_color":"#c5e1a5","ballskins_red_x":"96","ballskins_red_y":"192","ballskins_blue_x":"96","ballskins_blue_y":"192","texture_tiles":"/textures/sketch/tiles.png","texture_speedpad":"/textures/corallight/speedpad.png","texture_speedpadRed":"/textures/corallight/speedpadred.png","texture_speedpadBlue":"/textures/corallight/speedpadblue.png","texture_portal":"/textures/sketch/portal.png","texture_portalRed":"/textures/sketch/portalred.png","texture_portalBlue":"/textures/sketch/portalblue.png","texture_splats":"/textures/sketch/splats.png","texture_gravityWell":""},
}, preset_previews: {
'select-Checkered #1': 'https://i.imgur.com/1C9YGRQ.jpg',
'select-Checkered #2': 'https://i.imgur.com/Azv7loU.jpg',
'select-Aurora': 'https://i.imgur.com/9CsQyML.jpg',
'select-Neon Glow': 'https://i.imgur.com/eFBveC8.jpg',
'select-BioHazard': 'https://i.imgur.com/Ww0liVR.jpg',
'select-Half-Life 2 #1': 'https://i.imgur.com/Fzp0a87.jpg',
'select-Half-Life 2 #2': 'https://i.imgur.com/3yivqGR.jpg',
'select-Half-Life 2 #3': 'https://i.imgur.com/e18KPZG.jpg',
'select-Half-Life 2 #4': 'https://i.imgur.com/VIYDwC1.jpg',
'select-Half-Life 2 #5': 'https://i.imgur.com/ToStlVI.jpg',
'select-Half-Life 2 #6': 'https://i.imgur.com/wPotcZb.jpg',
'select-Starlight': 'https://i.imgur.com/WySzU8s.jpg',
'select-Castle': 'https://i.imgur.com/wwzjDnb.jpg',
'select-Space': 'https://i.imgur.com/N1ZbE8j.jpg',
'select-Hex': 'https://i.imgur.com/3KmAiNg.jpg',
'select-Anarchy': 'https://i.imgur.com/uhEzmxC.jpg',
'select-Ripples': 'https://i.imgur.com/2Br8k3F.jpg',
'select-Skill': 'https://i.imgur.com/Mx7m6GN.jpg',
'select-Purple Pirate': 'https://i.imgur.com/sx5Nj9k.jpg',
'select-Graydiant': 'https://i.imgur.com/qxZOqJX.jpg',
'select-JoJo Metal': 'https://i.imgur.com/PDMiU5n.jpg',
'select-Jojo Stained Glass': 'https://i.imgur.com/UaEHGEr.jpg',
'select-John Wick': 'https://i.imgur.com/RG8ySdT.jpg',
'select-Fli': 'https://i.imgur.com/KCZS9Gs.jpg',
'select-8 Bit': 'https://i.imgur.com/RXRGDXf.jpg',
'select-Dude': 'https://i.imgur.com/Ku3niYd.jpg',
'select-Atlas': 'https://i.imgur.com/EW6j6VM.jpg',
'select-Grinch': 'https://i.imgur.com/q8GZN9q.jpg',
'select-Plaque': 'https://i.imgur.com/rE7oopC.jpg',
'select-Shiny': 'https://i.imgur.com/zzcM1Gs.jpg',
'select-Swizzle': 'https://i.imgur.com/gn26fBL.jpg',
'select-Compass': 'https://i.imgur.com/ucJ7lFU.jpg',
'select-Cormacy': 'https://i.imgur.com/k9L3p3r.jpg',
'select-Sketchy': 'https://i.imgur.com/eEdayBl.jpg',
}, mysaves: {
}, globalOptions: {
load_texture_pack: true,
expand_viewport: false,
transparent_viewport: true,
max_number_splats: '1000',
ball_spin: true,
walls_as_new_layer: false,
disable_for_events: false,
disable_for_bigmaps: false, //disables walls lights & shadow effects
},
showCompetitiveLogos: false, //for competitive logos (you will need likely to edit the logo values below)
enableExport: true, //used to create presets
showPNGsInGame: false, //creates the pngs on the game page so they can be saved
};
if (defaultValues.showCompetitiveLogos) {
defaultValues.texture_logo_red = {
'select-ELTP-BMC': { url:'https://i.imgur.com/UPbhsQu.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-ELTP-SKR': { url:'https://i.imgur.com/6ItyMtc.png', filter:'opacity(20%)', xOffset:0, yOffset:-31, size:0.4 },
'select-ELTP-QMJ': { url:'https://i.imgur.com/4isAJQg.png', filter:'opacity(20%)', xOffset:-4, yOffset:-20, size:0.2 },
'select-ELTP-MSY': { url:'https://i.imgur.com/Q7jrYFC.png', filter:'opacity(20%)', xOffset:0, yOffset:-50, size:0.3 },
'select-ELTP-TGC': { url:'https://i.imgur.com/yf3QLYc.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.6 },
'select-ELTP-GBO': { url:'https://i.imgur.com/n4O23M2.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.15 },
//'select-ELTP-DD': { url:'', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
//'select-ELTP-TFA': { url:'', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-ELTP-BDN': { url:'https://i.imgur.com/ivf1x1S.png', filter:'opacity(20%)', xOffset:0, yOffset:75, size:0.85 },
'select-ELTP-GTG': { url:'https://i.imgur.com/y9s4tGq.png', filter:'opacity(20%)', xOffset:0, yOffset:40, size:0.3 },
'select-ELTP-CPD': { url:'https://i.imgur.com/yX8UCJH.png', filter:'opacity(20%)', xOffset:37, yOffset:-26, size:0.2 },
'select-ELTP-LVB': { url:'https://i.imgur.com/cPGfte8.png', filter:'opacity(20%)', xOffset:-1, yOffset:-98, size:0.8 },
'select-OLTP-AYY': { url:'https://i.imgur.com/QjOhV3G.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.2 },
'select-OLTP-C22': { url:'https://i.imgur.com/4TlfXGK.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.65 },
'select-OLTP-TBF': { url:'https://i.imgur.com/DUeObpx.png', filter:'opacity(20%) invert(100%)', xOffset:0, yOffset:0, size:1 },
'select-OLTP-CAP': { url:'https://i.imgur.com/XEXPWUb.png', filter:'opacity(20%)', xOffset:75, yOffset:-40, size:0.65 },
'select-OLTP-NIP': { url:'https://i.imgur.com/L0FVB9a.png', filter:'opacity(20%)', xOffset:8, yOffset:-40, size:0.65 },
'select-OLTP-PNK': { url:'https://i.imgur.com/NMPxI3v.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.8 },
'select-OLTP-BGS': { url:'https://i.imgur.com/Qfluefk.png', filter:'opacity(20%)', xOffset:30, yOffset:0, size:0.70 },
'select-OLTP-SLS': { url:'https://i.imgur.com/DtB0qpA.png', filter:'opacity(20%) saturate(50%) blur(2px)', xOffset:4, yOffset:-8, size:0.75 },
'select-OLTP-THC': { url:'https://i.imgur.com/LUc5Wb8.png', filter:'opacity(20%)', xOffset:-20, yOffset:-10, size:0.42 },
'select-OLTP-TGFP': { url:'https://i.imgur.com/erM9FgK.png', filter:'opacity(20%) saturate(50%) blur(1px)', xOffset:28, yOffset:0, size:0.4 },
'select-OLTP-ROO': { url:'https://i.imgur.com/Ns7VhYt.png', filter:'opacity(20%)', xOffset:-2, yOffset:-32, size:1 },
'select-OLTP-FLU': { url:'https://i.imgur.com/S8iTLhF.png', filter:'opacity(20%) saturate(50%) blur(1px)', xOffset:-4, yOffset:15, size:0.35 },
'select-OLTP-TSW': { url:'https://i.imgur.com/fjgkNk8.png', filter:'opacity(20%)', xOffset:0, yOffset:25, size:0.3 },
'select-OLTP-BBC': { url:'https://i.imgur.com/WCbpg4t.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.5 },
'select-OLTP-TBB': { url:'https://i.imgur.com/SpkqLn6.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.08 },
'select-OLTP-BWB': { url:'https://i.imgur.com/C83S1Z0.png', filter:'opacity(20%) saturate(50%) blur(1px)', xOffset:0, yOffset:0, size:0.50 },
'select-OLTP-SAV': { url:'https://i.imgur.com/jJY06ET.png', filter:'opacity(20%) saturate(10%) blur(1px)', xOffset:0, yOffset:0, size:0.8 },
'select-OLTP-RG': { url:'https://i.imgur.com/Y4sPpJK.png', filter:'opacity(20%) ', xOffset:0, yOffset:0, size:0.30 },
'select-OLTP-4TH': { url:'https://i.imgur.com/9DLSu35.png', filter:'opacity(20%) saturate(50%) blur(2px)', xOffset:0, yOffset:0, size:0.06 },
'select-MLTP-M877': { url:'https://i.imgur.com/cq6De6o.png', filter:'opacity(20%)', xOffset:14, yOffset:-17, size:0.15 },
'select-MLTP-MABO': { url:'https://i.imgur.com/2FoXKca.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.3 },
'select-MLTP-MHGW': { url:'https://i.imgur.com/Y9ZXk4g.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.8 },
'select-MLTP-MOD': { url:'https://i.imgur.com/ZVxT8NU.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.8 },
'select-MLTP-MRKT': { url:'https://i.imgur.com/TkDH615.png', filter:'opacity(20%)', xOffset:23, yOffset:32, size:0.65 },
'select-MLTP-MSPI': { url:'https://i.imgur.com/8MFbGQe.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-MLTP-MSPB': { url:'https://i.imgur.com/v9iYrSg.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.6 },
//'select-MLTP-MS7J': { url:'', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
//'select-mLTP-NGUY': { url:'', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-mLTP-NBOT': { url:'https://i.imgur.com/QF6Gv92.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.85 },
//'select-mLTP-NBUB': { url:'', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-mLTP-NIBS': { url:'https://i.imgur.com/jkTnxie.png', filter:'opacity(20%)', xOffset:0, yOffset:32, size:0.6 },
'select-mLTP-NCMP': { url:'https://i.imgur.com/z0dOH2U.png', filter:'opacity(20%)', xOffset:-45, yOffset:-5, size:0.7 },
'select-mLTP-NMBC': { url:'https://i.imgur.com/Q9tu0rQ.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.25 },
'select-mLTP-NOTP': { url:'https://i.imgur.com/6tQ2FSw.png', filter:'opacity(20%)', xOffset:0, yOffset:-40, size:0.8 },
'select-mLTP-NPIC': { url:'https://i.imgur.com/IFd2Jan.png', filter:'opacity(20%)', xOffset:0, yOffset:-20, size:1 },
//'select-mLTP-NRMS': { url:'', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
//'select-mLTP-NSNA': { url:'', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-mLTP-NDNO': { url:'https://i.imgur.com/BXnkQKc.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.45 },
'select-mLTP-NYHT': { url:'https://i.imgur.com/AkBpJlJ.png', filter:'opacity(20%)', xOffset:6, yOffset:-65, size:0.85 },
'select-NLTP-ADSB': { url:'https://i.imgur.com/8kJE1Ds.png', filter:'opacity(20%)', xOffset:4, yOffset:-25, size:0.8 },
'select-NLTP-ALBT': { url:'https://i.imgur.com/OkmkBFg.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.5 },
'select-NLTP-ABOH': { url:'https://i.imgur.com/XBjXiTZ.jpg', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.65 },
'select-NLTP-ASOI': { url:'https://i.imgur.com/4swWGSa.png', filter:'opacity(20%)', xOffset:0, yOffset:-6, size:0.2 },
'select-NLTP-ATAN': { url:'https://i.imgur.com/29gPkNy.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.75 },
'select-NLTP-AMB8': { url:'https://i.imgur.com/eneo62n.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.7 },
'select-NLTP-AABO': { url:'https://i.imgur.com/2FoXKca.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-NLTP-AOLD': { url:'https://i.imgur.com/DceHQqx.png', filter:'opacity(20%)', xOffset:0, yOffset:12, size:0.4 },
'select-NLTP-ACCC': { url:'https://i.imgur.com/oWjcJCt.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.5 },
'select-NLTP-AGUY': { url:'https://i.imgur.com/ZUWkhSw.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-NLTP-APOO': { url:'https://i.imgur.com/kjqLe1u.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
'select-NLTP-ANIP': { url:'https://i.imgur.com/kcw3WYa.png', filter:'opacity(20%)', xOffset:0, yOffset:0, size:0.4 },
}
defaultValues.texture_logo_blue = defaultValues.texture_logo_red;
}
Object.assign(defaultValues.texture_floor1, defaultValues.tiles, defaultValues.textures, defaultValues.patterns, defaultValues.blurs);
defaultValues.texture_floor2 = defaultValues.texture_floor1;
defaultValues.texture_floor3 = defaultValues.texture_floor1;
defaultValues.texture_team = defaultValues.texture_floor1;
defaultValues.texture_endzone1 = defaultValues.texture_floor1;
defaultValues.texture_endzone2 = defaultValues.texture_floor1;
defaultValues.texture_walls1 = defaultValues.texture_floor1;
defaultValues.texture_walls2 = defaultValues.texture_floor1;
Object.assign(defaultValues.texture_walls1, defaultValues.texture_center, defaultValues.texture_base);
Object.assign(defaultValues.texture_walls2, defaultValues.texture_center, defaultValues.texture_base);
Object.assign(defaultValues.texture_center, defaultValues.texture_base);
defaultValues.mysaves = GM_getValue('mysaves', {});
if (GM_getValue('globalOptions')) {
Object.assign(defaultValues.globalOptions, GM_getValue('globalOptions'));
}
let savedOptions = Object.assign({}, defaultOptions, GM_getValue('savedOptions'));
/* eslint-disable */
// TinyColor v1.4.2
// https://github.com/bgrins/TinyColor
// 2020-09-25, Brian Grinstead, MIT License
!function(a){function b(a,d){if(a=a?a:"",d=d||{},a instanceof b)return a;if(!(this instanceof b))return new b(a,d);var e=c(a);this._originalInput=a,this._r=e.r,this._g=e.g,this._b=e.b,this._a=e.a,this._roundA=P(100*this._a)/100,this._format=d.format||e.format,this._gradientType=d.gradientType,this._r<1&&(this._r=P(this._r)),this._g<1&&(this._g=P(this._g)),this._b<1&&(this._b=P(this._b)),this._ok=e.ok,this._tc_id=O++}function c(a){var b={r:0,g:0,b:0},c=1,e=null,g=null,i=null,j=!1,k=!1;return"string"==typeof a&&(a=K(a)),"object"==typeof a&&(J(a.r)&&J(a.g)&&J(a.b)?(b=d(a.r,a.g,a.b),j=!0,k="%"===String(a.r).substr(-1)?"prgb":"rgb"):J(a.h)&&J(a.s)&&J(a.v)?(e=G(a.s),g=G(a.v),b=h(a.h,e,g),j=!0,k="hsv"):J(a.h)&&J(a.s)&&J(a.l)&&(e=G(a.s),i=G(a.l),b=f(a.h,e,i),j=!0,k="hsl"),a.hasOwnProperty("a")&&(c=a.a)),c=z(c),{ok:j,format:a.format||k,r:Q(255,R(b.r,0)),g:Q(255,R(b.g,0)),b:Q(255,R(b.b,0)),a:c}}function d(a,b,c){return{r:255*A(a,255),g:255*A(b,255),b:255*A(c,255)}}function e(a,b,c){a=A(a,255),b=A(b,255),c=A(c,255);var d,e,f=R(a,b,c),g=Q(a,b,c),h=(f+g)/2;if(f==g)d=e=0;else{var i=f-g;switch(e=h>.5?i/(2-f-g):i/(f+g),f){case a:d=(b-c)/i+(c>b?6:0);break;case b:d=(c-a)/i+2;break;case c:d=(a-b)/i+4}d/=6}return{h:d,s:e,l:h}}function f(a,b,c){function d(a,b,c){return 0>c&&(c+=1),c>1&&(c-=1),1/6>c?a+6*(b-a)*c:.5>c?b:2/3>c?a+(b-a)*(2/3-c)*6:a}var e,f,g;if(a=A(a,360),b=A(b,100),c=A(c,100),0===b)e=f=g=c;else{var h=.5>c?c*(1+b):c+b-c*b,i=2*c-h;e=d(i,h,a+1/3),f=d(i,h,a),g=d(i,h,a-1/3)}return{r:255*e,g:255*f,b:255*g}}function g(a,b,c){a=A(a,255),b=A(b,255),c=A(c,255);var d,e,f=R(a,b,c),g=Q(a,b,c),h=f,i=f-g;if(e=0===f?0:i/f,f==g)d=0;else{switch(f){case a:d=(b-c)/i+(c>b?6:0);break;case b:d=(c-a)/i+2;break;case c:d=(a-b)/i+4}d/=6}return{h:d,s:e,v:h}}function h(b,c,d){b=6*A(b,360),c=A(c,100),d=A(d,100);var e=a.floor(b),f=b-e,g=d*(1-c),h=d*(1-f*c),i=d*(1-(1-f)*c),j=e%6,k=[d,h,g,g,i,d][j],l=[i,d,d,h,g,g][j],m=[g,g,i,d,d,h][j];return{r:255*k,g:255*l,b:255*m}}function i(a,b,c,d){var e=[F(P(a).toString(16)),F(P(b).toString(16)),F(P(c).toString(16))];return d&&e[0].charAt(0)==e[0].charAt(1)&&e[1].charAt(0)==e[1].charAt(1)&&e[2].charAt(0)==e[2].charAt(1)?e[0].charAt(0)+e[1].charAt(0)+e[2].charAt(0):e.join("")}function j(a,b,c,d,e){var f=[F(P(a).toString(16)),F(P(b).toString(16)),F(P(c).toString(16)),F(H(d))];return e&&f[0].charAt(0)==f[0].charAt(1)&&f[1].charAt(0)==f[1].charAt(1)&&f[2].charAt(0)==f[2].charAt(1)&&f[3].charAt(0)==f[3].charAt(1)?f[0].charAt(0)+f[1].charAt(0)+f[2].charAt(0)+f[3].charAt(0):f.join("")}function k(a,b,c,d){var e=[F(H(d)),F(P(a).toString(16)),F(P(b).toString(16)),F(P(c).toString(16))];return e.join("")}function l(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.s-=c/100,d.s=B(d.s),b(d)}function m(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.s+=c/100,d.s=B(d.s),b(d)}function n(a){return b(a).desaturate(100)}function o(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.l+=c/100,d.l=B(d.l),b(d)}function p(a,c){c=0===c?0:c||10;var d=b(a).toRgb();return d.r=R(0,Q(255,d.r-P(255*-(c/100)))),d.g=R(0,Q(255,d.g-P(255*-(c/100)))),d.b=R(0,Q(255,d.b-P(255*-(c/100)))),b(d)}function q(a,c){c=0===c?0:c||10;var d=b(a).toHsl();return d.l-=c/100,d.l=B(d.l),b(d)}function r(a,c){var d=b(a).toHsl(),e=(d.h+c)%360;return d.h=0>e?360+e:e,b(d)}function s(a){var c=b(a).toHsl();return c.h=(c.h+180)%360,b(c)}function t(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+120)%360,s:c.s,l:c.l}),b({h:(d+240)%360,s:c.s,l:c.l})]}function u(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+90)%360,s:c.s,l:c.l}),b({h:(d+180)%360,s:c.s,l:c.l}),b({h:(d+270)%360,s:c.s,l:c.l})]}function v(a){var c=b(a).toHsl(),d=c.h;return[b(a),b({h:(d+72)%360,s:c.s,l:c.l}),b({h:(d+216)%360,s:c.s,l:c.l})]}function w(a,c,d){c=c||6,d=d||30;var e=b(a).toHsl(),f=360/d,g=[b(a)];for(e.h=(e.h-(f*c>>1)+720)%360;--c;)e.h=(e.h+f)%360,g.push(b(e));return g}function x(a,c){c=c||6;for(var d=b(a).toHsv(),e=d.h,f=d.s,g=d.v,h=[],i=1/c;c--;)h.push(b({h:e,s:f,v:g})),g=(g+i)%1;return h}function y(a){var b={};for(var c in a)a.hasOwnProperty(c)&&(b[a[c]]=c);return b}function z(a){return a=parseFloat(a),(isNaN(a)||0>a||a>1)&&(a=1),a}function A(b,c){D(b)&&(b="100%");var d=E(b);return b=Q(c,R(0,parseFloat(b))),d&&(b=parseInt(b*c,10)/100),a.abs(b-c)<1e-6?1:b%c/parseFloat(c)}function B(a){return Q(1,R(0,a))}function C(a){return parseInt(a,16)}function D(a){return"string"==typeof a&&-1!=a.indexOf(".")&&1===parseFloat(a)}function E(a){return"string"==typeof a&&-1!=a.indexOf("%")}function F(a){return 1==a.length?"0"+a:""+a}function G(a){return 1>=a&&(a=100*a+"%"),a}function H(b){return a.round(255*parseFloat(b)).toString(16)}function I(a){return C(a)/255}function J(a){return!!V.CSS_UNIT.exec(a)}function K(a){a=a.replace(M,"").replace(N,"").toLowerCase();var b=!1;if(T[a])a=T[a],b=!0;else if("transparent"==a)return{r:0,g:0,b:0,a:0,format:"name"};var c;return(c=V.rgb.exec(a))?{r:c[1],g:c[2],b:c[3]}:(c=V.rgba.exec(a))?{r:c[1],g:c[2],b:c[3],a:c[4]}:(c=V.hsl.exec(a))?{h:c[1],s:c[2],l:c[3]}:(c=V.hsla.exec(a))?{h:c[1],s:c[2],l:c[3],a:c[4]}:(c=V.hsv.exec(a))?{h:c[1],s:c[2],v:c[3]}:(c=V.hsva.exec(a))?{h:c[1],s:c[2],v:c[3],a:c[4]}:(c=V.hex8.exec(a))?{r:C(c[1]),g:C(c[2]),b:C(c[3]),a:I(c[4]),format:b?"name":"hex8"}:(c=V.hex6.exec(a))?{r:C(c[1]),g:C(c[2]),b:C(c[3]),format:b?"name":"hex"}:(c=V.hex4.exec(a))?{r:C(c[1]+""+c[1]),g:C(c[2]+""+c[2]),b:C(c[3]+""+c[3]),a:I(c[4]+""+c[4]),format:b?"name":"hex8"}:(c=V.hex3.exec(a))?{r:C(c[1]+""+c[1]),g:C(c[2]+""+c[2]),b:C(c[3]+""+c[3]),format:b?"name":"hex"}:!1}function L(a){var b,c;return a=a||{level:"AA",size:"small"},b=(a.level||"AA").toUpperCase(),c=(a.size||"small").toLowerCase(),"AA"!==b&&"AAA"!==b&&(b="AA"),"small"!==c&&"large"!==c&&(c="small"),{level:b,size:c}}var M=/^\s+/,N=/\s+$/,O=0,P=a.round,Q=a.min,R=a.max,S=a.random;b.prototype={isDark:function(){return this.getBrightness()<128},isLight:function(){return!this.isDark()},isValid:function(){return this._ok},getOriginalInput:function(){return this._originalInput},getFormat:function(){return this._format},getAlpha:function(){return this._a},getBrightness:function(){var a=this.toRgb();return(299*a.r+587*a.g+114*a.b)/1e3},getLuminance:function(){var b,c,d,e,f,g,h=this.toRgb();return b=h.r/255,c=h.g/255,d=h.b/255,e=.03928>=b?b/12.92:a.pow((b+.055)/1.055,2.4),f=.03928>=c?c/12.92:a.pow((c+.055)/1.055,2.4),g=.03928>=d?d/12.92:a.pow((d+.055)/1.055,2.4),.2126*e+.7152*f+.0722*g},setAlpha:function(a){return this._a=z(a),this._roundA=P(100*this._a)/100,this},toHsv:function(){var a=g(this._r,this._g,this._b);return{h:360*a.h,s:a.s,v:a.v,a:this._a}},toHsvString:function(){var a=g(this._r,this._g,this._b),b=P(360*a.h),c=P(100*a.s),d=P(100*a.v);return 1==this._a?"hsv("+b+", "+c+"%, "+d+"%)":"hsva("+b+", "+c+"%, "+d+"%, "+this._roundA+")"},toHsl:function(){var a=e(this._r,this._g,this._b);return{h:360*a.h,s:a.s,l:a.l,a:this._a}},toHslString:function(){var a=e(this._r,this._g,this._b),b=P(360*a.h),c=P(100*a.s),d=P(100*a.l);return 1==this._a?"hsl("+b+", "+c+"%, "+d+"%)":"hsla("+b+", "+c+"%, "+d+"%, "+this._roundA+")"},toHex:function(a){return i(this._r,this._g,this._b,a)},toHexString:function(a){return"#"+this.toHex(a)},toHex8:function(a){return j(this._r,this._g,this._b,this._a,a)},toHex8String:function(a){return"#"+this.toHex8(a)},toRgb:function(){return{r:P(this._r),g:P(this._g),b:P(this._b),a:this._a}},toRgbString:function(){return 1==this._a?"rgb("+P(this._r)+", "+P(this._g)+", "+P(this._b)+")":"rgba("+P(this._r)+", "+P(this._g)+", "+P(this._b)+", "+this._roundA+")"},toPercentageRgb:function(){return{r:P(100*A(this._r,255))+"%",g:P(100*A(this._g,255))+"%",b:P(100*A(this._b,255))+"%",a:this._a}},toPercentageRgbString:function(){return 1==this._a?"rgb("+P(100*A(this._r,255))+"%, "+P(100*A(this._g,255))+"%, "+P(100*A(this._b,255))+"%)":"rgba("+P(100*A(this._r,255))+"%, "+P(100*A(this._g,255))+"%, "+P(100*A(this._b,255))+"%, "+this._roundA+")"},toName:function(){return 0===this._a?"transparent":this._a<1?!1:U[i(this._r,this._g,this._b,!0)]||!1},toFilter:function(a){var c="#"+k(this._r,this._g,this._b,this._a),d=c,e=this._gradientType?"GradientType = 1, ":"";if(a){var f=b(a);d="#"+k(f._r,f._g,f._b,f._a)}return"progid:DXImageTransform.Microsoft.gradient("+e+"startColorstr="+c+",endColorstr="+d+")"},toString:function(a){var b=!!a;a=a||this._format;var c=!1,d=this._a<1&&this._a>=0,e=!b&&d&&("hex"===a||"hex6"===a||"hex3"===a||"hex4"===a||"hex8"===a||"name"===a);return e?"name"===a&&0===this._a?this.toName():this.toRgbString():("rgb"===a&&(c=this.toRgbString()),"prgb"===a&&(c=this.toPercentageRgbString()),("hex"===a||"hex6"===a)&&(c=this.toHexString()),"hex3"===a&&(c=this.toHexString(!0)),"hex4"===a&&(c=this.toHex8String(!0)),"hex8"===a&&(c=this.toHex8String()),"name"===a&&(c=this.toName()),"hsl"===a&&(c=this.toHslString()),"hsv"===a&&(c=this.toHsvString()),c||this.toHexString())},clone:function(){return b(this.toString())},_applyModification:function(a,b){var c=a.apply(null,[this].concat([].slice.call(b)));return this._r=c._r,this._g=c._g,this._b=c._b,this.setAlpha(c._a),this},lighten:function(){return this._applyModification(o,arguments)},brighten:function(){return this._applyModification(p,arguments)},darken:function(){return this._applyModification(q,arguments)},desaturate:function(){return this._applyModification(l,arguments)},saturate:function(){return this._applyModification(m,arguments)},greyscale:function(){return this._applyModification(n,arguments)},spin:function(){return this._applyModification(r,arguments)},_applyCombination:function(a,b){return a.apply(null,[this].concat([].slice.call(b)))},analogous:function(){return this._applyCombination(w,arguments)},complement:function(){return this._applyCombination(s,arguments)},monochromatic:function(){return this._applyCombination(x,arguments)},splitcomplement:function(){return this._applyCombination(v,arguments)},triad:function(){return this._applyCombination(t,arguments)},tetrad:function(){return this._applyCombination(u,arguments)}},b.fromRatio=function(a,c){if("object"==typeof a){var d={};for(var e in a)a.hasOwnProperty(e)&&("a"===e?d[e]=a[e]:d[e]=G(a[e]));a=d}return b(a,c)},b.equals=function(a,c){return a&&c?b(a).toRgbString()==b(c).toRgbString():!1},b.random=function(){return b.fromRatio({r:S(),g:S(),b:S()})},b.mix=function(a,c,d){d=0===d?0:d||50;var e=b(a).toRgb(),f=b(c).toRgb(),g=d/100,h={r:(f.r-e.r)*g+e.r,g:(f.g-e.g)*g+e.g,b:(f.b-e.b)*g+e.b,a:(f.a-e.a)*g+e.a};return b(h)},b.readability=function(c,d){var e=b(c),f=b(d);return(a.max(e.getLuminance(),f.getLuminance())+.05)/(a.min(e.getLuminance(),f.getLuminance())+.05)},b.isReadable=function(a,c,d){var e,f,g=b.readability(a,c);switch(f=!1,e=L(d),e.level+e.size){case"AAsmall":case"AAAlarge":f=g>=4.5;break;case"AAlarge":f=g>=3;break;case"AAAsmall":f=g>=7}return f},b.mostReadable=function(a,c,d){var e,f,g,h,i=null,j=0;d=d||{},f=d.includeFallbackColors,g=d.level,h=d.size;for(var k=0;k<c.length;k++)e=b.readability(a,c[k]),e>j&&(j=e,i=b(c[k]));return b.isReadable(a,i,{level:g,size:h})||!f?i:(d.includeFallbackColors=!1,b.mostReadable(a,["#fff","#000"],d))};var T=b.names={aliceblue:"f0f8ff",antiquewhite:"faebd7",aqua:"0ff",aquamarine:"7fffd4",azure:"f0ffff",beige:"f5f5dc",bisque:"ffe4c4",black:"000",blanchedalmond:"ffebcd",blue:"00f",blueviolet:"8a2be2",brown:"a52a2a",burlywood:"deb887",burntsienna:"ea7e5d",cadetblue:"5f9ea0",chartreuse:"7fff00",chocolate:"d2691e",coral:"ff7f50",cornflowerblue:"6495ed",cornsilk:"fff8dc",crimson:"dc143c",cyan:"0ff",darkblue:"00008b",darkcyan:"008b8b",darkgoldenrod:"b8860b",darkgray:"a9a9a9",darkgreen:"006400",darkgrey:"a9a9a9",darkkhaki:"bdb76b",darkmagenta:"8b008b",darkolivegreen:"556b2f",darkorange:"ff8c00",darkorchid:"9932cc",darkred:"8b0000",darksalmon:"e9967a",darkseagreen:"8fbc8f",darkslateblue:"483d8b",darkslategray:"2f4f4f",darkslategrey:"2f4f4f",darkturquoise:"00ced1",darkviolet:"9400d3",deeppink:"ff1493",deepskyblue:"00bfff",dimgray:"696969",dimgrey:"696969",dodgerblue:"1e90ff",firebrick:"b22222",floralwhite:"fffaf0",forestgreen:"228b22",fuchsia:"f0f",gainsboro:"dcdcdc",ghostwhite:"f8f8ff",gold:"ffd700",goldenrod:"daa520",gray:"808080",green:"008000",greenyellow:"adff2f",grey:"808080",honeydew:"f0fff0",hotpink:"ff69b4",indianred:"cd5c5c",indigo:"4b0082",ivory:"fffff0",khaki:"f0e68c",lavender:"e6e6fa",lavenderblush:"fff0f5",lawngreen:"7cfc00",lemonchiffon:"fffacd",lightblue:"add8e6",lightcoral:"f08080",lightcyan:"e0ffff",lightgoldenrodyellow:"fafad2",lightgray:"d3d3d3",lightgreen:"90ee90",lightgrey:"d3d3d3",lightpink:"ffb6c1",lightsalmon:"ffa07a",lightseagreen:"20b2aa",lightskyblue:"87cefa",lightslategray:"789",lightslategrey:"789",lightsteelblue:"b0c4de",lightyellow:"ffffe0",lime:"0f0",limegreen:"32cd32",linen:"faf0e6",magenta:"f0f",maroon:"800000",mediumaquamarine:"66cdaa",mediumblue:"0000cd",mediumorchid:"ba55d3",mediumpurple:"9370db",mediumseagreen:"3cb371",mediumslateblue:"7b68ee",mediumspringgreen:"00fa9a",mediumturquoise:"48d1cc",mediumvioletred:"c71585",midnightblue:"191970",mintcream:"f5fffa",mistyrose:"ffe4e1",moccasin:"ffe4b5",navajowhite:"ffdead",navy:"000080",oldlace:"fdf5e6",olive:"808000",olivedrab:"6b8e23",orange:"ffa500",orangered:"ff4500",orchid:"da70d6",palegoldenrod:"eee8aa",palegreen:"98fb98",paleturquoise:"afeeee",palevioletred:"db7093",papayawhip:"ffefd5",peachpuff:"ffdab9",peru:"cd853f",pink:"ffc0cb",plum:"dda0dd",powderblue:"b0e0e6",purple:"800080",rebeccapurple:"663399",red:"f00",rosybrown:"bc8f8f",royalblue:"4169e1",saddlebrown:"8b4513",salmon:"fa8072",sandybrown:"f4a460",seagreen:"2e8b57",seashell:"fff5ee",sienna:"a0522d",silver:"c0c0c0",skyblue:"87ceeb",slateblue:"6a5acd",slategray:"708090",slategrey:"708090",snow:"fffafa",springgreen:"00ff7f",steelblue:"4682b4",tan:"d2b48c",teal:"008080",thistle:"d8bfd8",tomato:"ff6347",turquoise:"40e0d0",violet:"ee82ee",wheat:"f5deb3",white:"fff",whitesmoke:"f5f5f5",yellow:"ff0",yellowgreen:"9acd32"},U=b.hexNames=y(T),V=function(){var a="[-\\+]?\\d+%?",b="[-\\+]?\\d*\\.\\d+%?",c="(?:"+b+")|(?:"+a+")",d="[\\s|\\(]+("+c+")[,|\\s]+("+c+")[,|\\s]+("+c+")\\s*\\)?",e="[\\s|\\(]+("+c+")[,|\\s]+("+c+")[,|\\s]+("+c+")[,|\\s]+("+c+")\\s*\\)?";return{CSS_UNIT:new RegExp(c),rgb:new RegExp("rgb"+d),rgba:new RegExp("rgba"+e),hsl:new RegExp("hsl"+d),hsla:new RegExp("hsla"+e),hsv:new RegExp("hsv"+d),hsva:new RegExp("hsva"+e),hex3:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex6:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,hex4:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex8:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/}}();"undefined"!=typeof module&&module.exports?module.exports=b:"function"==typeof define&&define.amd?define(function(){return b}):window.tinycolor=b}(Math);
/* eslint-enable */
/* eslint-disable no-multi-spaces */
/* eslint-disable dot-notation */
if (location.pathname === '/textures/') {
//Create new tab...
$('ul.tab-list').append('<li data-target="#TMOD_Options"><a>Preset Mods</a></li>');
$('div.tab-content').append('<div id="TMOD_Options" class="tab-pane" style="flex-flow:row; /*margin:20px; padding:5px;*/ font-size:13px;"></div>');
$('.tab-list').on('click', 'li', function() {
$(this).parents('.tab-list').find('li').removeClass('active');
$(this).parents('.tab-list').parent().find('.tab-pane').removeClass('active').css('display', 'none');
$(this).addClass('active');
$( $(this).data('target') ).addClass('active').css('display', 'flex');
});
function loadSelectIntoMenu(label, title, name, saveto, update) {
let string = '';
if (defaultValues.hasOwnProperty(saveto)) {
if (update !== 'css') {
string += '<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel' + (update === 'texture' || update === 'preset' ? ' TMOD_ImageSelect" data-target="' + saveto + '"' : '"') + ' title="' + title + '">' + label + ':</span>' +
'<select id="TMOD_Select_' + saveto + '" data-saveto="' + saveto + '" data-update="' + update + '" class="TMOD_Input" style="max-width:140px;">' +
(update !== 'mysaves' ? '<option value="select-none" data-saveto="' + saveto + '" data-update="' + update + '" title="None">None</option>' : '');
}
Object.keys(defaultValues[saveto]).forEach(key => {
if (update === 'css') string += '<input type="radio" name="' + name + '" class="TMOD_Input" data-target="' + saveto + '" data-saveto="' + saveto + '" data-savevalue="' + key + '" data-update="' + update + '" title="' + key.slice(6) + '">';
else string += '<option value="' + key + '" data-saveto="' + saveto + '" data-savevalue="' + key + '" data-update="' + update + '" title="' + key.slice(7) + '">' + key.slice(7) + '</option>';
});
if (update !== 'css') string += '</select></div>';
}
return string;
}
const FilterStringOptionsTitle = 'Filter String. Options:\n - opacity(#%)\n - brightness(#%)\n - contrast(#%)\n - saturate(#%)\n - blur(#px)\n - drop-shadow(#px #px #px #RRGGBB)\n - sepia(#%)\n - hue-rotate(#deg)';
function loadGcoOptionsIntoMenu(saveto, limited = false) {
if (limited) {
//return '<select class="TMOD_Input" data-saveto="' + saveto + '_gco" style="max-width:20px;"><option value="source-over">Source-Over</option><option value="source-atop">Source-Atop</option><option value="source-in">Source-In</option><option value="source-out">Source-Out</option><option value="destination-over">Destination-Over</option><option value="destination-in">Destination-In</option><option value="destination-out">Destination-Out</option><option value="destination-atop">Destination-Atop</option><option value="hard-light">Hard Light</option><option value="color-dodge">Color Burn</option><option value="color-burn">Color Dodge</option><option value="overlay">Overlay</option><option value="difference">Difference</option><option value="luminosity">Luminosity</option></select>';
return '<select class="TMOD_Input" data-saveto="' + saveto + '_gco" style="max-width:120px;"><option value="source-over">Source-Over</option><option value="source-atop">Source-Atop</option><option value="source-in">Source-In</option><option value="source-out">Source-Out</option><option value="destination-over">Destination-Over</option><option value="destination-in">Destination-In</option><option value="destination-out">Destination-Out</option><option value="destination-atop">Destination-Atop</option><option value="multiply">Multiply</option><option value="screen">Screen</option><option value="hard-light">Hard Light</option><option value="soft-light">Soft Light</option><option value="lighter">Lighter</option><option value="lighten">Lighten</option><option value="darken">Darken</option><option value="color-dodge">Color Burn</option><option value="color-burn">Color Dodge</option><option value="overlay">Overlay</option><option value="difference">Difference</option><option value="exclusion">Exclusion</option><option value="hue">Hue</option><option value="saturation">Saturation</option><option value="color">Color</option><option value="luminosity">Luminosity</option><option value="xor">Xor</option></select>';
} else {
return '<select class="TMOD_Input" data-saveto="' + saveto + '_gco" style="max-width:120px;"><option value="source-over">Source-Over</option><option value="source-atop">Source-Atop</option><option value="source-in">Source-In</option><option value="source-out">Source-Out</option><option value="destination-over">Destination-Over</option><option value="destination-in">Destination-In</option><option value="destination-out">Destination-Out</option><option value="destination-atop">Destination-Atop</option><option value="multiply">Multiply</option><option value="screen">Screen</option><option value="hard-light">Hard Light</option><option value="soft-light">Soft Light</option><option value="lighter">Lighter</option><option value="lighten">Lighten</option><option value="darken">Darken</option><option value="color-dodge">Color Burn</option><option value="color-burn">Color Dodge</option><option value="overlay">Overlay</option><option value="difference">Difference</option><option value="exclusion">Exclusion</option><option value="hue">Hue</option><option value="saturation">Saturation</option><option value="color">Color</option><option value="luminosity">Luminosity</option><option value="xor">Xor</option></select>';
}
}
function loadWallLightOptionsIntoMenu(saveto) {
return '<select class="TMOD_Input" data-saveto="' + saveto + '_position" style="max-width:120px;"><option value="topleft">Top-Left</option><option value="topright">Top-Right</option><option value="bottomright">Bottom-Right</option><option value="bottomleft">Bottom-Left</option><option value="top">Top</option><option value="right">Right</option><option value="bottom">Bottom</option><option value="left">Left</option><option value="center">Center</option></select>';
}
const span_6 = '<span style="display:inline-block; width:6px;">&nbsp;</span>';
const span_10 = '<span style="display:inline-block; width:10px;">&nbsp;</span>';
const span_20 = '<span style="display:inline-block; width:20px;">&nbsp;</span>';
//Build the menu...
$('#TMOD_Options').append('<div id="TMOD_Options_Inner" style="width:550px; margin:3px; text-align:center;"></div>');
$('#TMOD_Options').append('<div id="TMOD_ImageSelect_Outer" style="position:relative; width:600px; margin:10px; text-align:center;"><img id="TMOD_ImageSelect" alt="Loading Preview..." src="" style="position:sticky; top:20px; max-width:580px; box-shadow:4px 4px 15px black; opacity:0;" /></div></div>');
//Presets & My Saves...
$('#TMOD_Options_Inner').append('<div id="TMOD_Header" class="TMOD_Title">Presets</div>');
$('#TMOD_Header').append('<span id="TMOD_ShowAll" style="position:absolute; right:5px; background:rgba(0,0,0,0.5); width:17px; border-radius:50%; cursor:pointer;" title="Show All Options">&#8286;</span>');
$('#TMOD_Options_Inner').append('<div id="TMOD_Global_Options" style="border:1px solid #181818; padding:0 0 5px; margin:-2px 0 0;"></div>');
$('#TMOD_Global_Options').append('<div class="TMOD_InputContainer">' + loadSelectIntoMenu('Presets', 'Choose a preset', 'preset', 'preset', 'preset') + '</div>' +
'<div class="TMOD_InputContainer">' + loadSelectIntoMenu('My Saves', 'Choose a custom saved preset', 'mysaves', 'mysaves', 'mysaves') + '<span id="TMOD_MySaves_Remove" style="margin:0 5px; padding:0 5px; color:red; border:1px solid #555; border-radius:3px; cursor:pointer;" title="Delete this saved preset">-</span><span id="TMOD_MySaves_Add" style="margin:0; padding:0 5px; color:#4f4; border:1px solid #555; border-radius:3px; cursor:pointer;" title="Save this preset">+</span>' + span_6 + '<span id="TMOD_MySaves_RemoveAll" style="margin:0; padding:0 5px; color:#f70; font-size:12px; border:1px solid #555; border-radius:3px; cursor:pointer;" title="Delete ALL presets from &quot;My Saves&quot;">&#9888;</span></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Load Texture Pack:</span><input type="checkbox" id="TMOD_LoadTexturePack" title="Load the texture pack associated with this preset (recommended - may take a minute or so for the server to update)"></div>' +
'<div class="TMOD_Title" style="background:none;">Global Options</div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Transparent Viewport:</span><input type="checkbox" id="TMOD_Transparent_Viewport" title="Use a Transparent Viewport (no black background)">' + span_6 + '<span class="TMOD_InputContainerLabel">Expand Viewport:</span><input type="checkbox" id="TMOD_Expand_Viewport" title="Expand the Viewport When Spectating">' + span_6 + '<span class="TMOD_InputContainerLabel">Ball Spin:</span><input type="checkbox" id="TMOD_Ball_Spin" title="Enable Ball Spin">' + span_6 + '<span class="TMOD_InputContainerLabel"># Splats:</span><input type="number" id="TMOD_Max_Splats" min="-1" max="1000" step="1" style="max-width:60px; width:48px; color:black; font-size:10px;" title="Max Number of Splats to Show on Screen (0 to Disable Splats; -1 to show All Splats)">' + span_6 + '<span class="TMOD_InputContainerLabel">Walls on New Layer:</span><input type="checkbox" id="TMOD_Walls_New_Layer" title="Draw Walls on a New Layer (Splats appear underneath the Walls)"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Viewport Effect:</span><input type="radio" name="TMOD_VP_Effect" data-savevalue="none" title="Normal">' + span_6 + '<input type="radio" name="TMOD_VP_Effect" data-savevalue="zoomfadein" title="Zoom & Fade In"><input type="radio" name="TMOD_VP_Effect" data-savevalue="blur" title="Blur"><input type="radio" name="TMOD_VP_Effect" data-savevalue="invert" title="Invert"><input type="radio" name="TMOD_VP_Effect" data-savevalue="sepia" title="Sepia"><input type="radio" name="TMOD_VP_Effect" data-savevalue="expando" title="Expando"><input type="radio" name="TMOD_VP_Effect" data-savevalue="spin" title="Spin"><input type="radio" name="TMOD_VP_Effect" data-savevalue="huerotate" title="Hue Rotate"></div>' +
'<div class="TMOD_Title" style="background:none;">Event Options</div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Disable for Events:</span><input type="checkbox" id="TMOD_Disable_For_Events" title="Disable if a Birthday, Halloween or Easter Event is detected">' + span_6 + '<span class="TMOD_InputContainerLabel">Disable for Big Maps:</span><input type="checkbox" id="TMOD_Disable_For_BigMaps" title="Always Disable &quot;Wall Shadows&quot; and &quot;Wall Lights&quot; on Big Maps (> 100x75 Tiles)"></div>');
//Advanced...
$('#TMOD_Options_Inner').append('<div id="TMOD_Advanced" style=""></div>');
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Background">Background</div>');
$('.TMOD_Section_Background').append('<div class="TMOD_InputContainer"><input type="number" class="TMOD_Input" min="0" max="360" data-saveto="background_angle" title="Angle for Linear Gradient (eg: 90=Vertical, 135=Diagonal)">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="background_color1" title="Background Color #1 (&quot;auto&quot; to not use)"/><input type="number" class="TMOD_Input" min="0" max="100" data-saveto="background_size1" title="Position %">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="background_color2" title="Background Color #2 (&quot;auto&quot; to not use)"/><input type="number" class="TMOD_Input" min="0" max="100" data-saveto="background_size2" title="Position %">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="background_color3" title="Background Color #3 (&quot;auto&quot; to not use)"/><input type="number" class="TMOD_Input" min="0" max="100" data-saveto="background_size3" title="Position %">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="background_color4" title="Background Color #4 (&quot;auto&quot; to not use)"/><input type="number" class="TMOD_Input" min="0" max="100" data-saveto="background_size4" title="Position %">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="background_color5" title="Background Color #5 (&quot;auto&quot; to not use)"/><input type="number" class="TMOD_Input" min="0" max="100" data-saveto="background_size5" title="Position %"></div>' +
'<div class="TMOD_InputContainer"><input type="radio" name="TMOD_BG_Type" class="TMOD_Input" data-saveto="background" data-savevalue="value-none" title="None (Default TagPro Image)">' + span_6 + '<input type="radio" name="TMOD_BG_Type" class="TMOD_Input" data-saveto="background" data-savevalue="value-linear" title="Linear Gradient"><input type="radio" name="TMOD_BG_Type" class="TMOD_Input" data-saveto="background" data-savevalue="value-radial" title="Radial Gradient"><input type="radio" name="TMOD_BG_Type" class="TMOD_Input" data-saveto="background" data-savevalue="value-conic" title="Conic Gradient">' + span_6 + loadSelectIntoMenu('BG', 'Background Images', 'TMOD_BG_Type', 'background', 'css') + '</div>' +
'<div class="TMOD_InputContainer"><input type="radio" name="TMOD_BG_Type" class="TMOD_Input" data-saveto="background" data-target="background" data-savevalue="value-url" title="Imgur URL"><input type="text" class="TMOD_Input" data-saveto="background_url" style="max-width:220px; width:220px;" title="Imgur Direct Link (eg: https://i.imgur.com/frr4yGb.jpg)" \></div>' +
'<div class="TMOD_Title">Viewport Outline</div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Border:</span><input type="number" min="0" class="TMOD_Input" data-saveto="vpcss_border_size" title="Border Line Width (0 = No Border)"><button class="TMOD_ChooseColor" data-saveto="vpcss_border_color" title="Border Color" /><input type="checkbox" class="TMOD_Input" data-saveto="vpcss_border_dashed" title="Dashed?">' + span_10 + '<span class="TMOD_InputContainerLabel">Radius:</span><input type="number" min="0" class="TMOD_Input" data-saveto="vpcss_radius_border" title="Border Radius (0 = Square)">' + span_10 + '<span class="TMOD_InputContainerLabel">Padding:</span><input type="number" min="0" class="TMOD_Input" data-saveto="vpcss_padding_y" title="Viewport Top/Bottom Padding (0 for none)"><input type="number" min="0" class="TMOD_Input" data-saveto="vpcss_padding_x" title="Viewport Left/Right Padding (0 for none)">' + span_10 + '<span class="TMOD_InputContainerLabel">Game Only:</span><input type="checkbox" class="TMOD_Input" data-saveto="vpcss_only_apply_in_game" title="Don\'t Show Outline if Spectating"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Shadow #1:</span><input type="number" min="0" class="TMOD_Input" data-saveto="vpcss_shadow1_size" title="Shadow Spread (0 = No Shadow)"><button class="TMOD_ChooseColor" data-saveto="vpcss_shadow1_color" title="Shadow Color #1" /><input type="number" min="0" class="TMOD_Input" data-saveto="vpcss_shadow1_blur" title="Blur Size"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="vpcss_shadow1_xoffset" title="X Offset"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="vpcss_shadow1_yoffset" title="Y Offset"><input type="checkbox" class="TMOD_Input" data-saveto="vpcss_shadow1_inset" title="Inset?">' + span_10 + '<span class="TMOD_InputContainerLabel">Shadow #2:</span><input type="number" min="0" class="TMOD_Input" data-saveto="vpcss_shadow2_size" title="Shadow Spread (0 = No Shadow)"><button class="TMOD_ChooseColor" data-saveto="vpcss_shadow2_color" title="Shadow Color #2" /><input type="number" min="0" class="TMOD_Input" data-saveto="vpcss_shadow2_blur" title="Blur Size"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="vpcss_shadow2_xoffset" title="X Offset"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="vpcss_shadow2_yoffset" title="Y Offset"><input type="checkbox" class="TMOD_Input" data-saveto="vpcss_shadow2_inset" title="Inset?"></div>');
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Floor">Floor</div>');
$('.TMOD_Section_Floor').append('<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Plain:</span><input type="checkbox" class="TMOD_Input" data-saveto="plainfloor" title="Plain Floor"><input type="checkbox" class="TMOD_Input" data-saveto="plainfloor_color_use" title="Use Plain Floor Color (or Tint Texture Pack Tile)"><button class="TMOD_ChooseColor" data-saveto="plainfloor_color" title="Plain Floor Tint Color" />' + span_10 + '<input type="number" class="TMOD_Input" data-saveto="floortile_opacity" min="0" max="1" step="0.01" title="Texture Pack Floor Tile Opacity (if not using Plain Floor)"></div>' +
loadSelectIntoMenu('Image #1', 'Floor Image #1', 'TMOD_texture_Floor1', 'texture_floor1', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_floor1_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_floor1_size" min="0" max="2" step="0.05" title="Scale">' + loadGcoOptionsIntoMenu('texture_floor1') + '</div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Gradient #1:</span><input type="checkbox" class="TMOD_Input" data-saveto="floor_gradient1" title="Floor Gradient #1">' + span_6 + '<input type="radio" name="TMOD_Floor_Gradient1" class="TMOD_Input" data-saveto="floor_gradient1_type" data-savevalue="value-centerline" title="Linear Floor Gradient"><input type="radio" name="TMOD_Floor_Gradient1" class="TMOD_Input" data-saveto="floor_gradient1_type" data-savevalue="value-centercircle" title="Radial Floor Gradient"><input type="radio" name="TMOD_Floor_Gradient1" class="TMOD_Input" data-saveto="floor_gradient1_type" data-savevalue="value-diagonal" title="Diagonal Floor Gradient"><input type="radio" name="TMOD_Floor_Gradient1" class="TMOD_Input" data-saveto="floor_gradient1_type" data-savevalue="value-rdiagonal" title="Opposite Diagonal Floor Gradient"><input type="radio" name="TMOD_Floor_Gradient1" class="TMOD_Input" data-saveto="floor_gradient1_type" data-savevalue="value-flags" title="Flags">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="floor_gradient1_color1" title="Floor Gradient Color 1" /><input type="number" class="TMOD_Input" data-saveto="floor_gradient1_opacity1" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="floor_gradient1_color2" title="Floor Gradient Color 2" /><input type="number" class="TMOD_Input" data-saveto="floor_gradient1_opacity2" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="floor_gradient1_repeats" min="0" max="40" step="2" title="Repeats"><input type="number" class="TMOD_Input" data-saveto="floor_gradient1_size" min="0" max="100" title="Size"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Gradient #2:</span><input type="checkbox" class="TMOD_Input" data-saveto="floor_gradient2" title="Floor Gradient #2">' + span_6 + '<input type="radio" name="TMOD_Floor_Gradient2" class="TMOD_Input" data-saveto="floor_gradient2_type" data-savevalue="value-centerline" title="Linear Floor Gradient"><input type="radio" name="TMOD_Floor_Gradient2" class="TMOD_Input" data-saveto="floor_gradient2_type" data-savevalue="value-centercircle" title="Radial Floor Gradient"><input type="radio" name="TMOD_Floor_Gradient2" class="TMOD_Input" data-saveto="floor_gradient2_type" data-savevalue="value-diagonal" title="Diagonal Floor Gradient"><input type="radio" name="TMOD_Floor_Gradient2" class="TMOD_Input" data-saveto="floor_gradient2_type" data-savevalue="value-rdiagonal" title="Opposite Diagonal Floor Gradient"><input type="radio" name="TMOD_Floor_Gradient2" class="TMOD_Input" data-saveto="floor_gradient2_type" data-savevalue="value-flags" title="Flags">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="floor_gradient2_color1" title="Floor Gradient Color 1" /><input type="number" class="TMOD_Input" data-saveto="floor_gradient2_opacity1" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="floor_gradient2_color2" title="Floor Gradient Color 2" /><input type="number" class="TMOD_Input" data-saveto="floor_gradient2_opacity2" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="floor_gradient2_repeats" min="0" max="40" step="2" title="Repeats"><input type="number" class="TMOD_Input" data-saveto="floor_gradient2_size" min="0" max="100" title="Size"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Contour:</span><input type="checkbox" class="TMOD_Input" data-saveto="floor_contour" title="Contour Floor Gradient"><button class="TMOD_ChooseColor" data-saveto="floor_contour_color" title="Contour Color" /><input type="number" class="TMOD_Input" data-saveto="floor_contour_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="floor_contour_size" min="1" title="Size"><input type="number" class="TMOD_Input" data-saveto="floor_contour_multiplier" min="1" title="Multiplier"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Grid 1:</span><input type="number" class="TMOD_Input" data-saveto="grid1_size" min="0" title="Grid Size (0 for none)"><input type="number" class="TMOD_Input" data-saveto="grid1_length" title="Line Length"><input type="number" class="TMOD_Input" data-saveto="grid1_width" title="Line Width"><button class="TMOD_ChooseColor" data-saveto="grid1_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="grid1_opacity" min="0" max="1" step="0.01" title="Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="grid1_square" title="Square"><input type="checkbox" class="TMOD_Input" data-saveto="grid1_diagonal" title="Diagonal"><input type="checkbox" class="TMOD_Input" data-saveto="grid1_rectangles" title="Rectangles"><input type="checkbox" class="TMOD_Input" data-saveto="grid1_lines" title="Lines"><input type="checkbox" class="TMOD_Input" data-saveto="grid1_crosses" title="Crosses"><input type="text" class="TMOD_Input" data-saveto="grid1_shadow" style="max-width:100px; width:100px;" title="' + FilterStringOptionsTitle + '">' + loadGcoOptionsIntoMenu('grid1') + //<input type="checkbox" class="TMOD_Input" data-saveto="grid1_shadow" title="Also Draw Shadow">
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Grid 2:</span><input type="number" class="TMOD_Input" data-saveto="grid2_size" min="0" title="Grid Size (0 for none)"><input type="number" class="TMOD_Input" data-saveto="grid2_length" title="Line Length"><input type="number" class="TMOD_Input" data-saveto="grid2_width" title="Line Width"><button class="TMOD_ChooseColor" data-saveto="grid2_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="grid2_opacity" min="0" max="1" step="0.01" title="Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="grid2_square" title="Square"><input type="checkbox" class="TMOD_Input" data-saveto="grid2_diagonal" title="Diagonal"><input type="checkbox" class="TMOD_Input" data-saveto="grid2_rectangles" title="Rectangles"><input type="checkbox" class="TMOD_Input" data-saveto="grid2_lines" title="Lines"><input type="checkbox" class="TMOD_Input" data-saveto="grid2_crosses" title="Crosses"><input type="checkbox" class="TMOD_Input" data-saveto="grid2_shadow" title="Also Draw Shadow">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="grid2_applytexture3togrid2" title="Apply Image #3 to Grid 2"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Checker:</span><input type="number" class="TMOD_Input" data-saveto="checker1_size" min="0" title="Checker Size (0 for none)"><input type="number" class="TMOD_Input" data-saveto="checker1_margin" title="Checker Margin"><button class="TMOD_ChooseColor" data-saveto="checker1_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="checker1_opacity_min" min="0" max="1" step="0.01" title="Min Opacity (only used for Random)"><input type="number" class="TMOD_Input" data-saveto="checker1_opacity" min="0" max="1" step="0.01" title="Normal/Max Opacity"><input type="number" class="TMOD_Input" data-saveto="checker1_density" min="0" max="1" step="0.01" title="Density (only used for Random)"><input type="checkbox" class="TMOD_Input" data-saveto="checker1_normal" title="Normal"><input type="checkbox" class="TMOD_Input" data-saveto="checker1_random" title="Random"><input type="checkbox" class="TMOD_Input" data-saveto="checker1_straight" title="Straight"><input type="checkbox" class="TMOD_Input" data-saveto="checker1_stripes" title="Stripes (Size is the number of stripes. Margin is Blur.)">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="checker1_rotate" min="0" max="89" title="Rotation (for Random & Straight)"><input type="number" class="TMOD_Input" data-saveto="checker1_blur" min="0" title="Blur"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Hexagons:</span><input type="number" class="TMOD_Input" data-saveto="hexagon_size" min="0" title="Hexagon Size (0 for none)"><input type="number" class="TMOD_Input" data-saveto="hexagon_margin" title="Margin">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="hexagon_stroke" title="Stroke"><input type="number" class="TMOD_Input" data-saveto="hexagon_stroke_linewidth" title="Line Width"><button class="TMOD_ChooseColor" data-saveto="hexagon_stroke_color" title="Stroke Color" /><input type="number" class="TMOD_Input" data-saveto="hexagon_stroke_opacity" min="0" max="1" step="0.01" title="Stroke Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="hexagon_fill" title="Fill"><button class="TMOD_ChooseColor" data-saveto="hexagon_fill_color" title="Fill Color" /><input type="number" class="TMOD_Input" data-saveto="hexagon_fill_opacity" min="0" max="1" step="0.01" title="Fill Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="hexagon_destination_out" title="Destination Out"></div>' +
loadSelectIntoMenu('Image #2', 'Floor Image #2', 'TMOD_texture_Floor2', 'texture_floor2', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_floor2_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_floor2_size" min="0" max="2" step="0.05" title="Scale">' + loadGcoOptionsIntoMenu('texture_floor2') + '</div>' +
loadSelectIntoMenu('Image #3', 'Floor Image #3', 'TMOD_texture_Floor3', 'texture_floor3', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_floor3_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_floor3_size" min="0" max="2" step="0.05" title="Scale">' + loadGcoOptionsIntoMenu('texture_floor3') + '</div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Floor Filter:</span><input type="text" class="TMOD_Input" data-saveto="floor_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"></div>');
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Team">Team Tiles</div>');
$('.TMOD_Section_Team').append('<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Plain:</span><input type="checkbox" class="TMOD_Input" data-saveto="plainteam" title="Plain Team Tiles"><input type="checkbox" class="TMOD_Input" data-saveto="plainteam_color_use" title="Use Plain Team Tiles Color"><button class="TMOD_ChooseColor" data-saveto="plainteam_color_red" title="Red Team Tiles Color" /><button class="TMOD_ChooseColor" data-saveto="plainteam_color_blue" title="Blue Team Tiles Color" /><button class="TMOD_ChooseColor" data-saveto="plainteam_color_yellow" title="Yellow Team Tiles Color" /></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Pattern:</span><input type="radio" name="TMOD_TeamTile_Gradient" class="TMOD_Input" data-saveto="teamtile_gradient_type" data-savevalue="value-none" title="None"><input type="radio" name="TMOD_TeamTile_Gradient" class="TMOD_Input" data-saveto="teamtile_gradient_type" data-savevalue="value-crisscross" title="Criss Cross"><input type="radio" name="TMOD_TeamTile_Gradient" class="TMOD_Input" data-saveto="teamtile_gradient_type" data-savevalue="value-crosshatch" title="Cross Hatch"><input type="radio" name="TMOD_TeamTile_Gradient" class="TMOD_Input" data-saveto="teamtile_gradient_type" data-savevalue="value-widecircles" title="Wide Circles"><input type="radio" name="TMOD_TeamTile_Gradient" class="TMOD_Input" data-saveto="teamtile_gradient_type" data-savevalue="value-stripes" title="Stripes"><input type="radio" name="TMOD_TeamTile_Gradient" class="TMOD_Input" data-saveto="teamtile_gradient_type" data-savevalue="value-diagonal" title="Diagonal">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="teamtile_gradient_size" min="0" title="Size"><button class="TMOD_ChooseColor" data-saveto="teamtile_gradient_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="teamtile_gradient_opacity" min="0" max="1" step="0.01" title="Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="teamtile_gradient_destination_out" title="Destination Out"></div>' +
loadSelectIntoMenu('Image', 'Team Tile Image', 'TMOD_texture_Team', 'texture_team', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_team_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_team_size" min="0" max="2" step="0.05" title="Scale">' + loadGcoOptionsIntoMenu('texture_team') + '</div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Checker:</span><input type="number" class="TMOD_Input" data-saveto="teamtile_checker_size" min="0" title="Checker Size (0 for none)"><input type="number" class="TMOD_Input" data-saveto="teamtile_checker_margin" title="Checker Margin"><button class="TMOD_ChooseColor" data-saveto="teamtile_checker_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="teamtile_checker_opacity" min="0" max="1" step="0.01" title="Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="teamtile_checker_normal" title="Normal"><input type="checkbox" class="TMOD_Input" data-saveto="teamtile_checker_random" title="Random"><input type="checkbox" class="TMOD_Input" data-saveto="teamtile_checker_straight" title="Straight">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="teamtile_checker_rotate" min="0" max="89" title="Rotation (for Random & Straight)"><input type="number" class="TMOD_Input" data-saveto="teamtile_checker_blur" min="0" title="Blur">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="teamtile_checker_squares" title="Squares"><input type="checkbox" class="TMOD_Input" data-saveto="teamtile_checker_circles" title="Circles">' + span_6 + '<input type="radio" name="TMOD_TeamTile_Checker_GCO" class="TMOD_Input" data-saveto="teamtile_checker_gco" data-savevalue="value-source-atop" title="Normal"><input type="radio" name="TMOD_TeamTile_Checker_GCO" class="TMOD_Input" data-saveto="teamtile_checker_gco" data-savevalue="value-destination-in" title="Destination In"><input type="radio" name="TMOD_TeamTile_Checker_GCO" class="TMOD_Input" data-saveto="teamtile_checker_gco" data-savevalue="value-destination-out" title="Destination Out"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Team Filter:</span><input type="text" class="TMOD_Input" data-saveto="teamtile_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Clear Floor Under Team Tiles:</span><input type="checkbox" class="TMOD_Input" data-saveto="clear_under_team_tiles" title="Clear Under Team Tiles?"><button class="TMOD_ChooseColor" data-saveto="clear_under_team_tiles_color" title="Team Tiles Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="clear_under_team_tiles_destout" title="Destination Out?"></div>');
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Endzone">Endzone</div>');
$('.TMOD_Section_Endzone').append('<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Plain:</span><input type="checkbox" class="TMOD_Input" data-saveto="plainendzone" title="Plain Endzones"><input type="checkbox" class="TMOD_Input" data-saveto="plainendzone_color_use" title="Use Plain Endzone Color"><button class="TMOD_ChooseColor" data-saveto="plainendzone_color_red" title="Red Endzone Color" /><button class="TMOD_ChooseColor" data-saveto="plainendzone_color_blue" title="Blue Endzone Color" /></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Checker 1:</span><input type="number" class="TMOD_Input" data-saveto="endzone_checker1_size" min="0" title="Checker Size (0 for none)"><input type="number" class="TMOD_Input" data-saveto="endzone_checker1_margin" title="Checker Margin"><button class="TMOD_ChooseColor" data-saveto="endzone_checker1_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="endzone_checker1_opacity" min="0" max="1" step="0.01" title="Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="endzone_checker1_normal" title="Normal"><input type="checkbox" class="TMOD_Input" data-saveto="endzone_checker1_random" title="Random"><input type="checkbox" class="TMOD_Input" data-saveto="endzone_checker1_straight" title="Straight (needs margin)">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="endzone_checker1_rotate" min="0" max="89" title="Rotation"><input type="number" class="TMOD_Input" data-saveto="endzone_checker1_blur" min="0" title="Blur"></div>' + //<input type="checkbox" class="TMOD_Input" data-saveto="endzone_checker_stripes" title="Stripes"><input type="text" class="TMOD_Input" data-saveto="endzone_checker_stripes_pattern" style="max-width:80px; width:80px;" title="Custom Stripes Pattern [Position, Line Width, ...]. If empty uses Size & Margin.">
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Checker 2:</span><input type="number" class="TMOD_Input" data-saveto="endzone_checker2_size" min="0" title="Checker Size (0 for none)"><input type="number" class="TMOD_Input" data-saveto="endzone_checker2_margin" title="Checker Margin"><button class="TMOD_ChooseColor" data-saveto="endzone_checker2_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="endzone_checker2_opacity" min="0" max="1" step="0.01" title="Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="endzone_checker2_normal" title="Normal"><input type="checkbox" class="TMOD_Input" data-saveto="endzone_checker2_random" title="Random"><input type="checkbox" class="TMOD_Input" data-saveto="endzone_checker2_straight" title="Straight (needs margin)">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="endzone_checker2_rotate" min="0" max="89" title="Rotation"><input type="number" class="TMOD_Input" data-saveto="endzone_checker2_blur" min="0" title="Blur"><input type="checkbox" class="TMOD_Input" data-saveto="endzone_checker2_afterimage" title="Draw Checker 2 After Image?"></div>' +
loadSelectIntoMenu('Image', 'Endzone Image', 'TMOD_texture_endzone1', 'texture_endzone1', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_endzone1_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_endzone1_size" min="0" max="2" step="0.05" title="Scale">' + loadGcoOptionsIntoMenu('texture_endzone1') + '</div>' +
loadSelectIntoMenu('Image', 'Endzone Image #2', 'TMOD_texture_endzone2', 'texture_endzone2', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_endzone2_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_endzone2_size" min="0" max="2" step="0.05" title="Scale">' + loadGcoOptionsIntoMenu('texture_endzone2') + '</div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Endzone Filter:</span><input type="text" class="TMOD_Input" data-saveto="endzone_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Clear Floor Under Endzone Tiles:</span><input type="checkbox" class="TMOD_Input" data-saveto="clear_under_endzone_tiles" title="Clear Under Endzone Tiles?"><button class="TMOD_ChooseColor" data-saveto="clear_under_endzone_tiles_color" title="Endzone Tiles Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="clear_under_endzone_tiles_destout" title="Destination Out?"></div>');
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Walls">Walls</div>');
$('.TMOD_Section_Walls').append('<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Plain:</span><input type="checkbox" class="TMOD_Input" data-saveto="plainwalls" title="Use Plain Walls"><input type="checkbox" class="TMOD_Input" data-saveto="plainwalls_color_use" title="Use Plain Walls Color (or Tint Texture Pack Tile)"><button class="TMOD_ChooseColor" data-saveto="plainwalls_color" title="Plain Walls Color" /><input type="checkbox" class="TMOD_Input" data-saveto="plainwalls_hardlight" title="Use &quot;Hard-Light&quot; when tinting"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Shadows:</span><input type="number" class="TMOD_Input" data-saveto="wallshadow_size" min="-10" max="10" title="Wall Shadow Size (Note: Using drop-shadow() in &quot;Wall Filter&quot; usually works better)"><input type="number" class="TMOD_Input" data-saveto="wallshadow_blur" min="-10" max="10" title="Wall Shadow Blur (0 for None)"><button class="TMOD_ChooseColor" data-saveto="wallshadow_color" title="Wall Shadow Color" /><input type="number" class="TMOD_Input" data-saveto="wallshadow_opacity" min="0" max="1" step="0.05" title="Wall Shadow Opacity"><input type="number" class="TMOD_Input" data-saveto="wallshadow_multiplier" min="1" max="10" title="Wall Shadow Multiplier">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="wallshadow_inner" title="Inner Shadow"><input type="checkbox" class="TMOD_Input" data-saveto="wallshadow_outer" title="Outer Shadow"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Outline:</span><input type="number" class="TMOD_Input" data-saveto="walloutline1_size" min="0" max="40" title="Inner Size"><button class="TMOD_ChooseColor" data-saveto="walloutline1_color" title="Inner Color" />' + span_10 + '<input type="number" class="TMOD_Input" data-saveto="walloutline2_size" min="0" max="40" title="Middle Size"><button class="TMOD_ChooseColor" data-saveto="walloutline2_color" title="Middle Color" /><input type="checkbox" class="TMOD_Input" data-saveto="walloutline2_dashed" title="Middle Dashed">' + span_10 + '<input type="number" class="TMOD_Input" data-saveto="walloutline3_size" min="0" max="40" title="Outer Size"><button class="TMOD_ChooseColor" data-saveto="walloutline3_color" title="Outer Color" /> <input type="number" class="TMOD_Input" data-saveto="walloutline3_opacity" min="0" max="1" step="0.05" title="Outer Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="walloutline3_exclusion" title="Draw using the &quot;Exclusion&quot; composite operation."></div>' +
loadSelectIntoMenu('Image #1', 'Wall Image #1', 'TMOD_texture_Walls1', 'texture_walls1', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_walls1_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_walls1_size" min="0" max="2" step="0.05" title="Scale">' + loadGcoOptionsIntoMenu('texture_walls1') + '</div>' +
loadSelectIntoMenu('Image #2', 'Wall Image #2', 'TMOD_texture_Walls2', 'texture_walls2', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_walls2_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_walls2_size" min="0" max="2" step="0.05" title="Scale">' + loadGcoOptionsIntoMenu('texture_walls2') + '</div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Wall Filter:</span><input type="text" class="TMOD_Input" data-saveto="walls_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Light #1:</span><input type="checkbox" class="TMOD_Input" data-saveto="wall_light1" title="Use Wall Lighting">' + loadWallLightOptionsIntoMenu('wall_light1') + '<input type="number" class="TMOD_Input" data-saveto="wall_light1_blur" min="0" title="Size"><input type="number" class="TMOD_Input" data-saveto="wall_light1_surfaceScale" min="0" title="Surface Scale (the height of the surface)."><input type="number" class="TMOD_Input" data-saveto="wall_light1_constant" min="0" step="0.05" title="Constant. The ratio of reflection (higher values mean the stronger the reflection)."><input type="number" class="TMOD_Input" data-saveto="wall_light1_exponent" min="0" title="Exponent. The exponent value controlling the focus for the light source (higher is a narrower lightbeam)."><input type="number" class="TMOD_Input" data-saveto="wall_light1_offset" step="5" title="Offset (negative values are outside the map)" style="max-width:56px;"><input type="number" class="TMOD_Input" data-saveto="wall_light1_z" step="5" title="Light Height" style="max-width:56px;"><button class="TMOD_ChooseColor" data-saveto="wall_light1_color" title="Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="wall_light_edgeonly" title="Wall Edges Only"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Light #2:</span><input type="checkbox" class="TMOD_Input" data-saveto="wall_light2" title="Use Wall Lighting">' + loadWallLightOptionsIntoMenu('wall_light2') + '<input type="number" class="TMOD_Input" data-saveto="wall_light2_blur" min="0" title="Size"><input type="number" class="TMOD_Input" data-saveto="wall_light2_surfaceScale" min="0" title="Surface Scale (the height of the surface)."><input type="number" class="TMOD_Input" data-saveto="wall_light2_constant" min="0" step="0.05" title="Constant. The ratio of reflection (higher values mean the stronger the reflection)."><input type="number" class="TMOD_Input" data-saveto="wall_light2_exponent" min="0" title="Exponent. The exponent value controlling the focus for the light source (higher is a narrower lightbeam)."><input type="number" class="TMOD_Input" data-saveto="wall_light2_offset" step="5" title="Offset (negative values are outside the map)" style="max-width:56px;"><input type="number" class="TMOD_Input" data-saveto="wall_light2_z" step="5" title="Light Height" style="max-width:56px;"><button class="TMOD_ChooseColor" data-saveto="wall_light2_color" title="Color" /></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Wall Text:</span><input type="number" class="TMOD_Input" data-saveto="wall_text_fontsize" min="0" title="Font Size (0 to not use)"><input type="text" class="TMOD_Input" data-saveto="wall_text_text" style="max-width:70px; width:70px; text-align:center;" title="Text (Leave Empty for Map Name)"><input type="checkbox" class="TMOD_Input" data-saveto="wall_text_bold" title="Bold"><input type="checkbox" class="TMOD_Input" data-saveto="wall_text_italic" title="Italic"><input type="checkbox" class="TMOD_Input" data-saveto="wall_text_smallcaps" title="Small-Caps">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="wall_text_color" title="Fill Color" /><input type="number" class="TMOD_Input" data-saveto="wall_text_opacity" step="0.05" min="0" max="1" title="Fill Opacity (0 for no fill)">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="wall_text_stroke_color" title="Stroke Color" /><input type="number" class="TMOD_Input" data-saveto="wall_text_stroke_opacity" step="0.05" min="0" max="1" title="Stroke Opacity (0 for no stroke)">' + span_6 + '<input type="text" class="TMOD_Input" data-saveto="wall_text_filter" style="max-width:100px; width:100px;" title="' + FilterStringOptionsTitle + '"><input type="checkbox" class="TMOD_Input" data-saveto="wall_text_flip" title="Flip Wall Text on Lower Half of Map"><input type="checkbox" class="TMOD_Input" data-saveto="wall_text_destinationOut" title="Destination Out (Fill)"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Map Walls Outer:</span><input type="text" class="TMOD_Input" data-saveto="map_outer_filter" style="max-width:200px; width:200px;" title="Use for shadows/glow outside the map walls"><input type="checkbox" class="TMOD_Input" data-saveto="map_outer_shrink" title="Shrink Shadow Source by 40px"></div>');
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Bases">Bases</div>');
$('.TMOD_Section_Bases').append('<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Circle 1:</span><input type="number" class="TMOD_Input" data-saveto="basecircle1_linewidth" min="0" title="Line Width (0 for none)"><input type="number" class="TMOD_Input" data-saveto="basecircle1_radius" min="0" title="Radius"><button class="TMOD_ChooseColor" data-saveto="basecircle1_color_yellow" title="Yellow" /><button class="TMOD_ChooseColor" data-saveto="basecircle1_color_red" title="Red" /><button class="TMOD_ChooseColor" data-saveto="basecircle1_color_blue" title="Blue" /><input type="number" class="TMOD_Input" data-saveto="basecircle1_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="basecircle1_blur" min="0" title="Blur (0 for none)"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="basecircle1_glow" min="0" title="Glow Size (0 for none)"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="basecircle1_glow_multiplier" min="1" title="Glow Multiplier"><input type="text" class="TMOD_Input" data-saveto="basecircle1_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:60px;"><input type="number" class="TMOD_Input" data-saveto="basecircle1_segments" min="0" title="# Segments (0 to use Dash Pattern)"><input type="checkbox" class="TMOD_Input" data-saveto="basecircle1_gradient" title="Use Gradient"><input type="checkbox" class="TMOD_Input" data-saveto="basecircle1_fill" title="Fill"><input type="checkbox" class="TMOD_Input" data-saveto="basecircle1_octagon" title="Octagon"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Circle 2:</span><input type="number" class="TMOD_Input" data-saveto="basecircle2_linewidth" min="0" title="Line Width (0 for none)"><input type="number" class="TMOD_Input" data-saveto="basecircle2_radius" min="0" title="Radius"><button class="TMOD_ChooseColor" data-saveto="basecircle2_color_yellow" title="Yellow" /><button class="TMOD_ChooseColor" data-saveto="basecircle2_color_red" title="Red" /><button class="TMOD_ChooseColor" data-saveto="basecircle2_color_blue" title="Blue" /><input type="number" class="TMOD_Input" data-saveto="basecircle2_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="basecircle2_blur" min="0" title="Blur (0 for none)"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="basecircle2_glow" min="0" title="Glow Size (0 for none)"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="basecircle2_glow_multiplier" min="1" title="Glow Multiplier"><input type="text" class="TMOD_Input" data-saveto="basecircle2_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:60px;"><input type="number" class="TMOD_Input" data-saveto="basecircle2_segments" min="0" title="# Segments (0 to use Dash Pattern)"><input type="checkbox" class="TMOD_Input" data-saveto="basecircle2_gradient" title="Use Gradient"><input type="checkbox" class="TMOD_Input" data-saveto="basecircle2_fill" title="Fill"><input type="checkbox" class="TMOD_Input" data-saveto="basecircle2_octagon" title="Octagon"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Center Line:</span><input type="number" class="TMOD_Input" data-saveto="centerline_linewidth" min="0" title="Line Width (0 for none)""><button class="TMOD_ChooseColor" data-saveto="centerline_color" /><input type="number" class="TMOD_Input" data-saveto="centerline_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="text" class="TMOD_Input" data-saveto="centerline_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:80px;"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="centerline_glow" min="0" title="Glow Size (0 for none)"><input type="checkbox" class="TMOD_Input" data-saveto="centerline_nfonly" title="Only Draw Center Line in NF Maps"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Flag Line:</span><input type="number" class="TMOD_Input" data-saveto="flagline_linewidth" min="0" title="Line Width (0 for none)"><button class="TMOD_ChooseColor" data-saveto="flagline_color" /><input type="number" class="TMOD_Input" data-saveto="flagline_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="text" class="TMOD_Input" data-saveto="flagline_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:80px;"><input type="number" class="TMOD_Input TMOD_Input_Number_Small" data-saveto="flagline_glow" min="0" title="Glow Size (0 for none)"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Extras Destination-Out:</span><input type="checkbox" class="TMOD_Input" data-saveto="extras_destination_out" title="Draw Extras (Grid2, Checker, Base Circles, CentreLine, FlagLine) with Destination Out (use with Ball Glow)"></div>' +
loadSelectIntoMenu('Base Image', 'Base Image', 'TMOD_Base_Circle_Image', 'texture_base', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_base_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_base_size" min="0" max="2" step="0.05" title="Scale"><input type="checkbox" class="TMOD_Input" data-saveto="texture_base_destination_out" title="Destination Out (use with Ball Glow)"><input type="checkbox" class="TMOD_Input" data-saveto="texture_base_dont_draw_nf" title="Don\'t Draw Base Image on NF Maps"><input type="checkbox" class="TMOD_Input" data-saveto="texture_base_greyscale_nf" title="Always Greyscale Base Image on NF Maps"><input type="checkbox" class="TMOD_Input" data-saveto="texture_base_dont_adjust_color" title="Don\'t Adjust Colors">' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Gradient:</span><input type="checkbox" class="TMOD_Input" data-saveto="texture_base_gradient" title="Apply Gradient to Base Images">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="texture_base_gradient_color1_red" title="Red Color 1" /><input type="number" class="TMOD_Input" data-saveto="texture_base_gradient_opacity1_red" min="0" max="1" step="0.1" title="Red Opacity 1"><button class="TMOD_ChooseColor" data-saveto="texture_base_gradient_color2_red" title="Red Color 2" /><input type="number" class="TMOD_Input" data-saveto="texture_base_gradient_opacity2_red" min="0" max="1" step="0.1" title="Red Opacity 2">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="texture_base_gradient_color1_blue" title="Blue Color 1" /><input type="number" class="TMOD_Input" data-saveto="texture_base_gradient_opacity1_blue" min="0" max="1" step="0.1" title="Blue Gradient Opacity 1"><button class="TMOD_ChooseColor" data-saveto="texture_base_gradient_color2_blue" title="Blue Color 2" /><input type="number" class="TMOD_Input" data-saveto="texture_base_gradient_opacity2_blue" min="0" max="1" step="0.1" title="Blue Gradient Opacity 2">' + span_10 + '<input type="number" class="TMOD_Input" data-saveto="texture_base_gradient_position" min="0" max="1" step="0.05" title="Gradient Position"><input type="number" class="TMOD_Input" data-saveto="texture_base_gradient_opacity_global" min="0" max="1" step="0.05" title="Gradient Global Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="texture_base_gradient_radial" title="Use Radial Gradient"></div>' +
loadSelectIntoMenu('Center Image', 'Center Image', 'TMOD_Center_Image', 'texture_center', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_center_filter" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_center_size" min="0" max="2" step="0.05" title="Scale"><input type="checkbox" class="TMOD_Input" data-saveto="texture_center_destination_out" title="Destination Out (use with Ball Glow)"><input type="checkbox" class="TMOD_Input" data-saveto="texture_center_drawafterteamtiles" title="Will draw on top of team tiles if checked (otherwise underneath)"></div>' +
'<div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Gradient:</span><input type="checkbox" class="TMOD_Input" data-saveto="texture_center_gradient" title="Apply Gradient to Center Image">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="texture_center_gradient_color1" title="Color 1" /><input type="number" class="TMOD_Input" data-saveto="texture_center_gradient_opacity1" min="0" max="1" step="0.05" title="Gradient Opacity 1">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="texture_center_gradient_color2" title="Color 2" /><input type="number" class="TMOD_Input" data-saveto="texture_center_gradient_opacity2" min="0" max="1" step="0.05" title="Gradient Opacity 2">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="texture_center_gradient_position" min="0" max="1" step="0.05" title="Gradient Position"><input type="number" class="TMOD_Input" data-saveto="texture_center_gradient_opacity_global" min="0" max="1" step="0.05" title="Gradient Global Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="texture_center_gradient_radial" title="Use Radial Gradient"></div>');
if (defaultValues.showCompetitiveLogos) {
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Logos">Competitive Logos</div>');
$('.TMOD_Section_Logos').append('<div class="TMOD_InputContainer" title="Logos get matched by the Red/Blue Team Names from the Group and will be rendered at the correct base. The values below will be ignored if this option is checked. The Team Name has to be exact for this to work (e.g. &quot;ABO&quot;, &quot;MABO&quot; and &quot;MLTP-MABO&quot; will all work, but &quot;MBAO&quot; will fail.)\n\nUncheck to use the options below (logos will also be drawn in pubs if unchecked)."><span class="TMOD_InputContainerLabel">Use Group Names:</span><input type="checkbox" class="TMOD_Input" data-saveto="texture_logo_automatic"></div>' +
loadSelectIntoMenu('Red Team Logo', 'Red Team Logo', 'TMOD_Base_Logo_Red_Image', 'texture_logo_red', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_logo_red_filter" style="max-width:180px; width:180px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_logo_red_size" min="0" max="2" step="0.05" title="Scale"><input type="number" class="TMOD_Input" data-saveto="texture_logo_red_xOffset" title="X Offset"><input type="number" class="TMOD_Input" data-saveto="texture_logo_red_yOffset" title="Y Offset"></div>' +
loadSelectIntoMenu('Blue Team Logo', 'Blue Team Logo', 'TMOD_Base_Logo_Blue_Image', 'texture_logo_blue', 'texture') +
'<div class="TMOD_InputContainer"><input type="text" class="TMOD_Input" data-saveto="texture_logo_blue_filter" style="max-width:180px; width:180px;" title="' + FilterStringOptionsTitle + '"><input type="number" class="TMOD_Input" data-saveto="texture_logo_blue_size" min="0" max="2" step="0.05" title="Scale"><input type="number" class="TMOD_Input" data-saveto="texture_logo_blue_xOffset" title="X Offset"><input type="number" class="TMOD_Input" data-saveto="texture_logo_blue_yOffset" title="Y Offset"></div>' +
'<div class="TMOD_InputContainer" title="Chooses 2 team logos randomly from all leagues. All the values above will be ignored if this option is checked."><span class="TMOD_InputContainerLabel">Choose Random Logos:</span><input type="checkbox" class="TMOD_Input" data-saveto="texture_logo_random"></div>');
}
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Balls">Balls</div>');
$('.TMOD_Section_Balls').append('<div style="position:relative;">' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Apply to Red:</span><input type="checkbox" class="TMOD_Input" data-saveto="balls_apply_red" title="Apply all options to the Red Ball only">' + span_10 + '<span class="TMOD_InputContainerLabel">Apply to Blue:</span><input type="checkbox" class="TMOD_Input" data-saveto="balls_apply_blue" title="Apply all options to the Blue Ball only"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Ball Opacity:</span><input type="number" class="TMOD_Input" data-saveto="balls_opacity" min="0" max="1" step="0.05" title="Ball Opacity">' + span_10 + '<span class="TMOD_InputContainerLabel">Plain Balls:</span><input type="checkbox" class="TMOD_Input" data-saveto="balls_plain" title="Use Plain Balls"><button class="TMOD_ChooseColor" data-saveto="balls_plain_color_red" title="Plain Red Ball Color" /><button class="TMOD_ChooseColor" data-saveto="balls_plain_color_blue" title="Plain Blue Ball Color" />' + span_10 + '<span class="TMOD_InputContainerLabel">Ball Shine:</span><input type="checkbox" class="TMOD_Input" data-saveto="balls_shine" title="Add Ball Shine">' + span_6 + '<span class="TMOD_InputContainerLabel">Ball Shadow:</span><input type="checkbox" class="TMOD_Input" data-saveto="balls_shadow" title="Add Ball Shadow">' + span_10 + '<span class="TMOD_InputContainerLabel">Clip:</span><input type="checkbox" class="TMOD_Input" data-saveto="balls_clip_38px" title="Clip Balls to 38px"></div>' + // + span_10 +'<span class="TMOD_InputContainerLabel">Center Hole:</span><input type="number" class="TMOD_Input" data-saveto="balls_hole_radius_start" min="0" max="20" title="Start"><input type="number" class="TMOD_Input" data-saveto="balls_hole_radius" min="0" max="20" title="Size (should be double the Start for a Center Hole)"><input type="number" class="TMOD_Input" data-saveto="balls_hole_opacity" min="0" max="1" step="0.05" title="Opacity (1 is Solid Color)">' + span_10 + '<span class="TMOD_InputContainerLabel">Ball Shine:</span><input type="checkbox" class="TMOD_Input" data-saveto="balls_shine" title="Add Ball Shine"><input type="number" class="TMOD_Input" data-saveto="balls_shine_size" min="0" title="Shine Size"><input type="number" class="TMOD_Input" data-saveto="balls_shine_offset" min="0" title="Shine Offset">'
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Ball Gradient:</span><input type="checkbox" class="TMOD_Input" data-saveto="ball_gradient" title="Use Ball Gradient"><input type="number" class="TMOD_Input" data-saveto="ball_gradient_position" min="0" max="1" step="0.05" title="Position">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="ball_gradient_color1_red" title="Color 1" /><input type="number" class="TMOD_Input" data-saveto="ball_gradient_opacity1_red" min="0" max="1" step="0.05" title="Opacity 1"><button class="TMOD_ChooseColor" data-saveto="ball_gradient_color2_red" title="Color 2" /><input type="number" class="TMOD_Input" data-saveto="ball_gradient_opacity2_red" min="0" max="1" step="0.05" title="Opacity 2">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="ball_gradient_color1_blue" title="Color 1" /><input type="number" class="TMOD_Input" data-saveto="ball_gradient_opacity1_blue" min="0" max="1" step="0.05" title="Opacity 1"><button class="TMOD_ChooseColor" data-saveto="ball_gradient_color2_blue" title="Color 2" /><input type="number" class="TMOD_Input" data-saveto="ball_gradient_opacity2_blue" min="0" max="1" step="0.05" title="Opacity 2"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Ball Outline 1:</span><input type="checkbox" class="TMOD_Input" data-saveto="ball_outline1" title="Add Ball Outline"><input type="number" class="TMOD_Input" data-saveto="ball_outline1_linewidth" min="1" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="ball_outline1_radius" min="1" title="Radius"><input type="text" class="TMOD_Input" data-saveto="ball_outline1_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:50px;"><button class="TMOD_ChooseColor" data-saveto="ball_outline1_color_red" title="Red Color" /><button class="TMOD_ChooseColor" data-saveto="ball_outline1_color_blue" title="Blue Color" /><input type="number" class="TMOD_Input" data-saveto="ball_outline1_opacity" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ball_outline1_blur" title="Blur (1px)">' + span_6 + loadGcoOptionsIntoMenu('ball_outline1', true) + '</div>' +
' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Ball Skins:</span><input type="checkbox" class="TMOD_Input" data-saveto="ballskins" title="Use Ball Skins"><input type="number" min="0" max="1" step="0.05" class="TMOD_Input" data-saveto="ballskins_opacity" title="Ball Skin Opacity">' + loadGcoOptionsIntoMenu('ballskins') + '</div>' +
' <div class="TMOD_InputContainer"><div id="TMOD_Options_Skins" style="display:flex; flex-flow:column wrap; width:380px; height:114px; transform:scale(1.0); margin:0; overflow-x:scroll; overflow-y:hidden;"></div></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Red Tint:</span><input type="checkbox" class="TMOD_Input" data-saveto="ballskins_tint_red" title="Tint the Red Ball Skin"><button class="TMOD_ChooseColor" data-saveto="ballskins_tint_red_color" title="Red Tint Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ballskins_tint_red_hardlight" title="Use &quot;Hard-Light&quot;">' + span_10 + span_10 + '<span class="TMOD_InputContainerLabel">Blue Tint:</span><input type="checkbox" class="TMOD_Input" data-saveto="ballskins_tint_blue" title="Tint the Blue Ball Skin"><button class="TMOD_ChooseColor" data-saveto="ballskins_tint_blue_color" title="Blue Tint Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ballskins_tint_blue_hardlight" title="Use &quot;Hard-Light&quot;"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Red:</span><input type="number" min="0" step="0.05" class="TMOD_Input" data-saveto="ballskins_scale_red" title="Scale (40px = 0.83; 48px = 1)"><input type="text" class="TMOD_Input" data-saveto="ballskins_filter_red" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Blue:</span><input type="number" min="0" step="0.05" class="TMOD_Input" data-saveto="ballskins_scale_blue" title="Scale (40px = 0.83; 48px = 1)"><input type="text" class="TMOD_Input" data-saveto="ballskins_filter_blue" style="max-width:220px; width:220px;" title="' + FilterStringOptionsTitle + '"></div>' +
' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Ball Outline 2:</span><input type="checkbox" class="TMOD_Input" data-saveto="ball_outline2" title="Add Ball Outline"><input type="number" class="TMOD_Input" data-saveto="ball_outline2_linewidth" min="1" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="ball_outline2_radius" min="1" title="Radius"><input type="text" class="TMOD_Input" data-saveto="ball_outline2_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:50px;"><button class="TMOD_ChooseColor" data-saveto="ball_outline2_color_red" title="Red Color" /><button class="TMOD_ChooseColor" data-saveto="ball_outline2_color_blue" title="Blue Color" /><input type="number" class="TMOD_Input" data-saveto="ball_outline2_opacity" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ball_outline2_blur" title="Blur (1px)">' + loadGcoOptionsIntoMenu('ball_outline2', true) + '</div>' + //<input type="checkbox" class="TMOD_Input" data-saveto="ball_outline2_destination_out" title="Destination Out">
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Add Red Shape:</span><input type="checkbox" class="TMOD_Input" data-saveto="ball_star_red" title="Draw Star/Shape on Red Ball">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="ball_star_red_stroke_color" title="Stroke Color" /><input type="number" class="TMOD_Input" data-saveto="ball_star_red_stroke_opacity" min="0" max="1" step="0.05" title="Stroke Opacity"><input type="number" class="TMOD_Input" data-saveto="ball_star_red_linewidth" min="0" title="Stroke Line Width">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="ball_star_red_fill_color" title="Fill Color" /><input type="number" class="TMOD_Input" data-saveto="ball_star_red_fill_opacity" min="0" max="1" step="0.05" title="Fill Opacity">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="ball_star_red_points" min="0" title="# Points"><input type="number" class="TMOD_Input" data-saveto="ball_star_red_outerradius" min="0" title="Outer Radius"><input type="number" class="TMOD_Input" data-saveto="ball_star_red_holeradius" min="0" title="Hole Radius">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ball_star_red_isStar" title="Draw as Star"><input type="number" class="TMOD_Input" data-saveto="ball_star_red_innerradius" min="0" title="Star Inner Radius">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ball_star_red_destination_out" title="Destination Out"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Add Blue Shape:</span><input type="checkbox" class="TMOD_Input" data-saveto="ball_star_blue" title="Draw Star/Shape on Blue Ball">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="ball_star_blue_stroke_color" title="Stroke Color" /><input type="number" class="TMOD_Input" data-saveto="ball_star_blue_stroke_opacity" min="0" max="1" step="0.05" title="Stroke Opacity"><input type="number" class="TMOD_Input" data-saveto="ball_star_blue_linewidth" min="0" title="Stroke Line Width">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="ball_star_blue_fill_color" title="Fill Color" /><input type="number" class="TMOD_Input" data-saveto="ball_star_blue_fill_opacity" min="0" max="1" step="0.05" title="Fill Opacity">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="ball_star_blue_points" min="0" title="# Points"><input type="number" class="TMOD_Input" data-saveto="ball_star_blue_outerradius" min="0" title="Outer Radius"><input type="number" class="TMOD_Input" data-saveto="ball_star_blue_holeradius" min="0" title="Hole Radius">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ball_star_blue_isStar" title="Draw as Star"><input type="number" class="TMOD_Input" data-saveto="ball_star_blue_innerradius" min="0" title="Star Inner Radius">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ball_star_blue_destination_out" title="Destination Out"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Ball Outline 3:</span><input type="checkbox" class="TMOD_Input" data-saveto="ball_outline3" title="Add Ball Outline"><input type="number" class="TMOD_Input" data-saveto="ball_outline3_linewidth" min="1" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="ball_outline3_radius" min="1" title="Radius"><input type="text" class="TMOD_Input" data-saveto="ball_outline3_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:50px;"><button class="TMOD_ChooseColor" data-saveto="ball_outline3_color_red" title="Red Color" /><button class="TMOD_ChooseColor" data-saveto="ball_outline3_color_blue" title="Blue Color" /><input type="number" class="TMOD_Input" data-saveto="ball_outline3_opacity" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ball_outline3_blur" title="Blur (2px)">' + loadGcoOptionsIntoMenu('ball_outline3', true) + '</div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Ball Outline 4:</span><input type="checkbox" class="TMOD_Input" data-saveto="ball_outline4" title="Add Ball Outline"><input type="number" class="TMOD_Input" data-saveto="ball_outline4_linewidth" min="1" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="ball_outline4_radius" min="1" title="Radius"><input type="text" class="TMOD_Input" data-saveto="ball_outline4_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:50px;"><button class="TMOD_ChooseColor" data-saveto="ball_outline4_color_red" title="Red Color" /><button class="TMOD_ChooseColor" data-saveto="ball_outline4_color_blue" title="Blue Color" /><input type="number" class="TMOD_Input" data-saveto="ball_outline4_opacity" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="ball_outline4_blur" title="Blur (2px)">' + loadGcoOptionsIntoMenu('ball_outline4', true) + '</div>' +
' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Ball Glow:</span><input type="checkbox" class="TMOD_Input" data-saveto="ballglow" title="Use Ball Glow"><input type="number" class="TMOD_Input" data-saveto="ballglow_size" min="0" title="Radius"><button class="TMOD_ChooseColor" data-saveto="ballglow_color_red" title="Red Color" /><button class="TMOD_ChooseColor" data-saveto="ballglow_color_blue" title="Blue Color" /><input type="number" class="TMOD_Input" data-saveto="ballglow_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="ballglow_blur" min="0" title="Blur"><input type="number" class="TMOD_Input" data-saveto="ballglow_holesize" min="0" title="Hole Radius">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="ballglow_offsetx" min="-20" max="20" title="X Offset"><input type="number" class="TMOD_Input" data-saveto="ballglow_offsety" min="-20" max="20" title="Y Offset"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel"></span><input type="checkbox" class="TMOD_Input" data-saveto="ballglow_tintpups" title="Use PUP Colors"><button class="TMOD_ChooseColor" data-saveto="ballglow_color_tp" title="TagPro Color" /><button class="TMOD_ChooseColor" data-saveto="ballglow_color_rb" title="Rolling Bomb Color" /><button class="TMOD_ChooseColor" data-saveto="ballglow_color_jj" title="Juke Juice Color" />' + span_10 + '<input type="checkbox" class="TMOD_Input" data-saveto="ballglow_behind" title="Draw the glow *underneath* the floor tiles (needs some floor transparency to be visible)"> <input type="checkbox" class="TMOD_Input" data-saveto="ballglow_ellipse" title="Draw an ellipse instead of a circle (height is half the radius)"> <input type="checkbox" class="TMOD_Input" data-saveto="ballglow_flagcarrier" title="Only the FCs glow"> <input type="checkbox" class="TMOD_Input" data-saveto="ballglow_onlyme" title="Make only my ball glow"> <input type="checkbox" class="TMOD_Input" data-saveto="ballglow_19pxhole" title="Make 19px Hole"></div>' +
'</div>');
$('#TMOD_Advanced').append('<div class="TMOD_Title TMOD_Section_Extras">Other</div>');
$('.TMOD_Section_Extras').append('<div style="position:relative;">' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Custom Spikes:</span><input type="checkbox" class="TMOD_Input" data-saveto="spikes_generic" title="Draw Custom Spike"><button class="TMOD_ChooseColor" data-saveto="spikes_generic_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="spikes_generic_points" min="0" title="# Points"><input type="number" class="TMOD_Input" data-saveto="spikes_generic_innerradius" min="0" title="Inner Radius"><input type="number" class="TMOD_Input" data-saveto="spikes_generic_outerradius" min="0" title="Outer Radius (Default is 14px)"><input type="number" class="TMOD_Input" data-saveto="spikes_generic_holeradius" min="0" title="Hole Radius">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="spikes_generic_color2" title="Outer Color" /><input type="number" class="TMOD_Input" data-saveto="spikes_generic_color2_position" min="0" max="1" step="0.05" title="Color Overlay Position (0 for none)"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Spikes Tint:</span><input type="checkbox" class="TMOD_Input" data-saveto="spikes_tint" title="Tint Texture Pack Spike"><button class="TMOD_ChooseColor" data-saveto="spikes_tint_color" title="Tint Color" /></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Spikes Border:</span><input type="number" class="TMOD_Input" data-saveto="spikes_border_linewidth" title="Line Width (0 for none)"><button class="TMOD_ChooseColor" data-saveto="spikes_border_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="spikes_border_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="spikes_border_radius" title="Radius (Default is 14px)"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Spikes Filter:</span><input type="text" class="TMOD_Input" data-saveto="spikes_filter" style="max-width:200px; width:200px;" title="' + FilterStringOptionsTitle + '"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Custom Button:</span><input type="checkbox" class="TMOD_Input" data-saveto="buttons_generic" title="Draw Custom Button"><button class="TMOD_ChooseColor" data-saveto="buttons_generic_color_inner" title="Center Color (Auto for None)" /><button class="TMOD_ChooseColor" data-saveto="buttons_generic_color_outer" title="Mid Color (Auto for None)" /><button class="TMOD_ChooseColor" data-saveto="buttons_generic_color_border" title="Border Color (Auto for None)" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="buttons_generic_color_border_split" title="Draw Border with Split">' + span_10 + '<input type="checkbox" class="TMOD_Input" data-saveto="buttons_shine" title="Add Shine"><button class="TMOD_ChooseColor" data-saveto="buttons_shine_color" title="Shine Color" />' + span_10 + '<input type="number" class="TMOD_Input" data-saveto="buttons_border_segments_size" min="0" title="Outer Border Segments Size (0 for none)"><button class="TMOD_ChooseColor" data-saveto="buttons_border_segments_color" title="Segments Color" /><input type="number" class="TMOD_Input" data-saveto="buttons_border_segments_opacity" min="0" max="1" step="0.05" title="Segments Opacity"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Buttons Filter:</span><input type="text" class="TMOD_Input" data-saveto="buttons_filter" style="max-width:200px; width:200px;" title="' + FilterStringOptionsTitle + '"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Bombs Tint:</span><input type="checkbox" class="TMOD_Input" data-saveto="bombs_tint" title="Tint *Texture Pack* Bomb"><button class="TMOD_ChooseColor" data-saveto="bombs_tint_color" title="Tint Color" />' + span_10 + '<input type="checkbox" class="TMOD_Input" data-saveto="bombs_clip_30px" title="Clip to 30px"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Bombs Custom:</span><input type="checkbox" class="TMOD_Input" data-saveto="bombs_generic" title="Draw Custom Bomb"><button class="TMOD_ChooseColor" data-saveto="bombs_generic_color" title="Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="bombs_fuse" title="Add Fuse"><button class="TMOD_ChooseColor" data-saveto="bombs_fuse_color" title="Fuse Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="bombs_shine" title="Add Shine"><button class="TMOD_ChooseColor" data-saveto="bombs_shine_color" title="Shine Color" /></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Bombs Outline #1:</span><input type="checkbox" class="TMOD_Input" data-saveto="bombs_outline1" title="Add Bomb Outline #1"><input type="number" class="TMOD_Input" data-saveto="bombs_outline1_linewidth" min="1" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="bombs_outline1_segments" min="0" title="# Segments"><input type="number" class="TMOD_Input" data-saveto="bombs_outline1_radius" min="1" max="16" title="Radius"><button class="TMOD_ChooseColor" data-saveto="bombs_outline1_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="bombs_outline1_opacity" min="0" max="1" step="0.05" title="Opacity">' + loadGcoOptionsIntoMenu('bombs_outline1', true) + '</div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Bombs Outline #2:</span><input type="checkbox" class="TMOD_Input" data-saveto="bombs_outline2" title="Add Bomb Outline #2"><input type="number" class="TMOD_Input" data-saveto="bombs_outline2_linewidth" min="1" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="bombs_outline2_segments" min="0" title="# Segments"><input type="number" class="TMOD_Input" data-saveto="bombs_outline2_radius" min="1" max="16" title="Radius"><button class="TMOD_ChooseColor" data-saveto="bombs_outline2_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="bombs_outline2_opacity" min="0" max="1" step="0.05" title="Opacity">' + loadGcoOptionsIntoMenu('bombs_outline2', true) + '</div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Exploded Opacity:</span><input type="number" class="TMOD_Input" data-saveto="bombs_draw_exploded_opacity" min="0" max="1" step="0.01" title="Draw Exploded Bomb at this Opacity of Normal Bomb Tile (0 to not use)"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Bombs Filter:</span><input type="text" class="TMOD_Input" data-saveto="bombs_filter" style="max-width:200px; width:200px;" title="' + FilterStringOptionsTitle + '"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Neutral Gates:</span><input type="number" class="TMOD_Input" data-saveto="gates_neutral_tile_opacity" min="0" max="1" step="0.05" title="Texture Pack Gate Opacity (0 = don\'t draw)">' + span_10 + '<input type="number" class="TMOD_Input" data-saveto="gates_neutral_margin" min="0" max="10" title="Gate Margin"></div>' +
' <div class="TMOD_InputContainer">' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Base:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_base" title="Plain Base Fill">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="gates_plain_neutral_base_neutral" title="Base Neutral Gate Color" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_base_opacity" min="0" max="1" step="0.05" title="Opacity"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Gradient:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient" title="Gradient"><input type="radio" name="TMOD_Gates_Neutral_Gradient" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient_type" data-savevalue="value-diagonal" title="Diagonal"><input type="radio" name="TMOD_Gates_Neutral_Gradient" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient_type" data-savevalue="value-crisscross" title="Criss Cross"><input type="radio" name="TMOD_Gates_Neutral_Gradient" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient_type" data-savevalue="value-crosshatch" title="Cross Hatch"><input type="radio" name="TMOD_Gates_Neutral_Gradient" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient_type" data-savevalue="value-widecircles" title="Circles"><input type="radio" name="TMOD_Gates_Neutral_Gradient" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient_type" data-savevalue="value-vstripes" title="Vertical Stripes"><input type="radio" name="TMOD_Gates_Neutral_Gradient" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient_type" data-savevalue="value-hstripes" title="Horizontal Stripes"><button class="TMOD_ChooseColor" data-saveto="gates_plain_neutral_gradient_color" title="Neutral Gradient Color" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_gradient_size" min="1" max="40" title="Size">' + loadGcoOptionsIntoMenu('gates_plain_neutral_gradient') + '</span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Pyramid:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_pyramid" title="Add Pyramid">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_pyramid_margin" min="0" max="20" title="Margin"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_pyramid_useAltStyle" title="Use Alt Style"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Cross:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_cross" title="Add Cross">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_cross_linewidth" min="0" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_cross_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_neutral_cross_neutral" title="Color" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_cross_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_cross_shadow" min="0" title="Shadow/Glow"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_cross_destinationOut" title="Destination Out"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Cutout:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_cutout" title="Add Cut-Out">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_cutout_linewidth" min="0" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_cutout_margin" min="0" max="20" title="Margin"><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_cutout_strokeOpacity" min="0" max="1" step="0.05" title="Opacity"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Square:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_square" title="Add Square">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_square_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_neutral_square_neutral" title="Color" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_square_fillOpacity" min="0" max="1" step="0.05" title="Opacity"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Detail:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_detail" title="Add Details">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_linewidth" min="1" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_size" min="1" max="20" title="Size"><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_neutral_detail_neutral" title="Color" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_opacity" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_drawCircles" title="Circles"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_drawLines" title="Lines"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_drawCorners" title="Corners">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_dropShadow" title="Add Shadow/Glow"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_dropShadowBlack" title="Shadow Color is Black"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_drawInCenter" title="Draw in Center"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_detail_destinationOut" title="Destination Out"></span></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Border:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_border" title="Add Border">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_border_linewidth" min="0" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_border_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_neutral_border_neutral" title="Color" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_neutral_border_strokeOpacity" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<span class="TMOD_InputContainerLabel">40px:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_neutral_border_40px" title="Also Draw 40px Border (ignores Margin and will draw even if Border is not checked)"></span>' +
' </div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">GRB Gates:</span><input type="number" class="TMOD_Input" data-saveto="gates_grb_tile_opacity" min="0" max="1" step="0.05" title="Texture Pack Gate Opacity (0 = don\'t draw)">' + span_10 + '<input type="number" class="TMOD_Input" data-saveto="gates_grb_margin" min="0" max="10" title="Gate Margin"></div>' +
' <div class="TMOD_InputContainer">' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Base:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_base" title="Plain Base Fill">' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_base_green" title="Base Green Gate Color" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_base_red" title="Base Red Gate Color" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_base_blue" title="Base Blue Gate Color" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_base_opacity" min="0" max="1" step="0.05" title="Opacity"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Gradient:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_gradient" title="Gradient"><input type="radio" name="TMOD_Gates_GRB_Gradient" class="TMOD_Input" data-saveto="gates_plain_grb_gradient_type" data-savevalue="value-diagonal" title="Diagonal"><input type="radio" name="TMOD_Gates_GRB_Gradient" class="TMOD_Input" data-saveto="gates_plain_grb_gradient_type" data-savevalue="value-crisscross" title="Criss Cross"><input type="radio" name="TMOD_Gates_GRB_Gradient" class="TMOD_Input" data-saveto="gates_plain_grb_gradient_type" data-savevalue="value-crosshatch" title="Cross Hatch"><input type="radio" name="TMOD_Gates_GRB_Gradient" class="TMOD_Input" data-saveto="gates_plain_grb_gradient_type" data-savevalue="value-widecircles" title="Circles"><input type="radio" name="TMOD_Gates_GRB_Gradient" class="TMOD_Input" data-saveto="gates_plain_grb_gradient_type" data-savevalue="value-vstripes" title="Vertical Stripes"><input type="radio" name="TMOD_Gates_GRB_Gradient" class="TMOD_Input" data-saveto="gates_plain_grb_gradient_type" data-savevalue="value-hstripes" title="Horizontal Stripes"><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_gradient_green" title="Green Gradient Color" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_gradient_red" title="Red Gradient Color" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_gradient_blue" title="Blue Gradient Color" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_gradient_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_gradient_size" min="1" max="40" title="Size">' + loadGcoOptionsIntoMenu('gates_plain_grb_gradient') + '</span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Pyramid:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_pyramid" title="Add Pyramid">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_pyramid_margin" min="0" max="20" title="Margin"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_pyramid_useAltStyle" title="Use Alt Style"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Cross:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_cross" title="Add Cross">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_cross_linewidth" min="0" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_cross_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_cross_green" title="Green" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_cross_red" title="Red" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_cross_blue" title="Blue" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_cross_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_cross_shadow" min="0" title="Shadow/Glow"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_cross_destinationOut" title="Destination Out"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Rounded:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect" title="Rounded Square">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect_linewidth" min="0" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect_radius" min="0" max="20" title="Radius"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_roundedRect_green" title="Green" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_roundedRect_red" title="Red" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_roundedRect_blue" title="Blue" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect_dropShadow" min="0" title="Shadow/Glow"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect_dropShadowBlack" title="Shadow Color is Black">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect_drawEdges" title="Draw Edges"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_roundedRect_drawCorners" title="Draw Corners"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Cutout:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_cutout" title="Add Cut-Out">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_cutout_linewidth" min="0" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_cutout_margin" min="0" max="20" title="Margin"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_cutout_strokeOpacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_cutout_blur" min="0" title="Blur"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Square:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_square" title="Add Square">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_square_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_square_green" title="Green" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_square_red" title="Red" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_square_blue" title="Blue" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_square_fillOpacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_square_blur" min="0" title="Blur">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_square_raisedOutline" title="Add Raised Outline (uses only the Margin value)"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Detail:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_detail" title="Add Details">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_detail_linewidth" min="1" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_detail_size" min="1" max="20" title="Size"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_detail_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_detail_green" title="Green" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_detail_red" title="Red" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_detail_blue" title="Blue" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_detail_opacity" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_detail_drawCircles" title="Circles"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_detail_drawLines" title="Lines"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_detail_drawCorners" title="Corners">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_detail_dropShadow" title="Add Shadow/Glow"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_detail_dropShadowBlack" title="Shadow Color is Black"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_detail_drawInCenter" title="Draw in Center"><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_detail_destinationOut" title="Destination Out"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Border:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_border" title="Add Border">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_border_linewidth" min="0" max="20" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_border_margin" min="0" max="20" title="Margin"><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_border_green" title="Green" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_border_red" title="Red" /><button class="TMOD_ChooseColor" data-saveto="gates_plain_grb_border_blue" title="Blue" /><input type="number" class="TMOD_Input" data-saveto="gates_plain_grb_border_strokeOpacity" min="0" max="1" step="0.05" title="Opacity">' + span_6 + '<span class="TMOD_InputContainerLabel">40px:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_plain_grb_border_40px" title="Also Draw 40px Border (ignores Margin and will draw even if Border is not checked)"></span>' +
' </div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Glow Gates:</span><input type="checkbox" class="TMOD_Input" data-saveto="gates_glow" title="Use Glow Gates"><button class="TMOD_ChooseColor" data-saveto="gates_glow_color_green" title="Green Glow Gates Color" /><button class="TMOD_ChooseColor" data-saveto="gates_glow_color_red" title="Red Glow Gates Color" /><button class="TMOD_ChooseColor" data-saveto="gates_glow_color_blue" title="Blue Glow Gates Color" /><input type="number" class="TMOD_Input" data-saveto="gates_glow_size" min="1" title="Size">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="gates_glow_outline" title="Add Outline"><button class="TMOD_ChooseColor" data-saveto="gates_glow_outline_color_green" title="Green Outline Color" /><button class="TMOD_ChooseColor" data-saveto="gates_glow_outline_color_red" title="Red Outline Color" /><button class="TMOD_ChooseColor" data-saveto="gates_glow_outline_color_blue" title="Blue Outline Color" /><input type="number" class="TMOD_Input" data-saveto="gates_glow_outline_opacity" min="0" max="1" step="0.05" title="Outline Opacity"><input type="number" class="TMOD_Input" data-saveto="gates_glow_outline_linewidth" min="1" title="Line Width"></div>' +
' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Gate Shadows:</span><input type="checkbox" class="TMOD_Input" data-saveto="gate_shadows" title="Add Gate Shadows">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="gate_shadows_size" min="0" title="Shadow Size"><input type="number" class="TMOD_Input" data-saveto="gate_shadows_blur" min="0" title="Blur"><input type="number" class="TMOD_Input" data-saveto="gate_shadows_opacity" min="0" max="1" step="0.05" title="Opacity"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Clear Floor Under Gate Tiles:</span><input type="checkbox" class="TMOD_Input" data-saveto="clear_under_gate_tiles" title="Clear Under Gate Tiles?"><button class="TMOD_ChooseColor" data-saveto="clear_under_gate_tiles_color" title="Gate Tiles Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="clear_under_gate_tiles_destout" title="Destination Out?"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Custom Flags:</span><input type="checkbox" class="TMOD_Input" data-saveto="flags_generic_fill" title="Fill Custom Flags"><button class="TMOD_ChooseColor" data-saveto="flags_generic_fill_red" title="Red Flag Color" /><button class="TMOD_ChooseColor" data-saveto="flags_generic_fill_blue" title="Blue Flag Color" /><button class="TMOD_ChooseColor" data-saveto="flags_generic_fill_yellow" title="Yellow Flag Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="flags_generic_stroke" title="Stroke Custom Flags"><button class="TMOD_ChooseColor" data-saveto="flags_generic_stroke_red" title="Red Flag Stroke Color" /><button class="TMOD_ChooseColor" data-saveto="flags_generic_stroke_blue" title="Blue Flag Stroke Color" /><button class="TMOD_ChooseColor" data-saveto="flags_generic_stroke_yellow" title="Yellow Flag Stroke Color" />' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="flags_generic_gradient" title="Add Gradient"><button class="TMOD_ChooseColor" data-saveto="flags_generic_gradient_red" title="Red Flag Gradient Color" /><button class="TMOD_ChooseColor" data-saveto="flags_generic_gradient_blue" title="Blue Flag Gradient Color" /><button class="TMOD_ChooseColor" data-saveto="flags_generic_gradient_yellow" title="Yellow Flag Gradient Color" /><input type="number" class="TMOD_Input" data-saveto="flags_generic_gradient_opacity" min="0" max="1" step="0.05" title="Gradient Opacity">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="flags_generic_pole_linewidth" min="0" title="Pole Line Width (0 for no pole)"><button class="TMOD_ChooseColor" data-saveto="flags_generic_pole_color" title="Pole Color" /></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Flags Outline:</span><input type="checkbox" class="TMOD_Input" data-saveto="flags_outline" title="Add Flag Circle Outline"><input type="number" class="TMOD_Input" data-saveto="flags_outline_linewidth" min="1" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="flags_outline_segments" min="0" title="# Segments"><button class="TMOD_ChooseColor" data-saveto="flags_outline_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="flags_outline_opacity" min="0" max="1" step="0.05" title="Normal Opacity"><input type="number" class="TMOD_Input" data-saveto="flags_outline_taken_opacity" min="0" max="1" step="0.05" title="Taken Opacity">' + span_6 + '<span class="TMOD_InputContainerLabel">Taken Opacity:</span><input type="number" class="TMOD_Input" data-saveto="flags_draw_taken_opacity" min="0" max="1" step="0.01" title="Draw Taken Flag at this Opacity of Normal Flag Tile (0 to not use)"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Flags Glow:</span><input type="checkbox" class="TMOD_Input" data-saveto="flags_glow" title="Use Glow Flags"><button class="TMOD_ChooseColor" data-saveto="flags_glow_color_red" title="Red Flags Glow Color" /><button class="TMOD_ChooseColor" data-saveto="flags_glow_color_blue" title="Blue Flags Glow Color" /><button class="TMOD_ChooseColor" data-saveto="flags_glow_color_yellow" title="Yellow Flags Glow Color" /></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Custom Pups:</span><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_jj_stroke" title="JJ Stroke"><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_jj_fill" title="JJ Fill"><button class="TMOD_ChooseColor" data-saveto="pups_generic_jj_color_border" title="JJ Stroke Color" /><button class="TMOD_ChooseColor" data-saveto="pups_generic_jj_color_fill" title="JJ Fill Color" /><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_jj_shadow" title="JJ Shadow">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_rb_stroke" title="RB Stroke"><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_rb_fill" title="RB Fill"><button class="TMOD_ChooseColor" data-saveto="pups_generic_rb_color_border" title="RB Stroke Color" /><button class="TMOD_ChooseColor" data-saveto="pups_generic_rb_color_fill" title="RB Fill Color" /><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_rb_shadow" title="RB Shadow">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_tp_stroke" title="TP Stroke"><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_tp_fill" title="TP Fill"><button class="TMOD_ChooseColor" data-saveto="pups_generic_tp_color_border" title="TP Stroke Color" /><button class="TMOD_ChooseColor" data-saveto="pups_generic_tp_color_fill" title="TP Fill Color" /><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_tp_shadow" title="TP Shadow">' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_empty_stroke" title="Empty Stroke"><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_empty_fill" title="Empty Fill"><button class="TMOD_ChooseColor" data-saveto="pups_generic_empty_color_border" title="Empty Stroke Color" /><button class="TMOD_ChooseColor" data-saveto="pups_generic_empty_color_text" title="Empty Fill Color" /><input type="checkbox" class="TMOD_Input" data-saveto="pups_generic_empty_shadow" title="Empty Shadow"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">JJ Tint:</span><input type="checkbox" class="TMOD_Input" data-saveto="pups_tint_jj" title="Tint Texture Pack Juke Juice"><button class="TMOD_ChooseColor" data-saveto="pups_tint_jj_color" title="Color" />' + span_6 + '<span class="TMOD_InputContainerLabel">RB Tint:</span><input type="checkbox" class="TMOD_Input" data-saveto="pups_tint_rb" title="Tint Texture Pack Rolling Bomb"><button class="TMOD_ChooseColor" data-saveto="pups_tint_rb_color" title="Color" />' + span_6 + '<span class="TMOD_InputContainerLabel">TP Tint:</span><input type="checkbox" class="TMOD_Input" data-saveto="pups_tint_tp" title="Tint Texture Pack TagPro"><button class="TMOD_ChooseColor" data-saveto="pups_tint_tp_color" title="Color" /></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Pups Glow:</span><input type="checkbox" class="TMOD_Input" data-saveto="pups_glow" title="Use Glow Pups"><button class="TMOD_ChooseColor" data-saveto="pups_glow_color_jj" title="Juke Juice Glow Color" /><button class="TMOD_ChooseColor" data-saveto="pups_glow_color_rb" title="Rolling Bomb Glow Color" /><button class="TMOD_ChooseColor" data-saveto="pups_glow_color_tp" title="TagPro Glow Color" />' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="pups_glow_opacity_coefficient" min="0" max="2" step="0.05" title="Glow Opacity Multiplier (1 is 35%, 2 is 70%)"><input type="number" class="TMOD_Input" data-saveto="pups_glow_size_coefficient" min="0" max="2" step="0.05" title="Glow Size Multiplier (1 is 25px, 2 is 50px)">' + span_10 + '<span class="TMOD_InputContainerLabel">Outline:</span><input type="checkbox" class="TMOD_Input" data-saveto="pups_glow_outline" title="Add White Outline"><button class="TMOD_ChooseColor" data-saveto="pups_glow_outline_color_jj" title="Juke Juice Outline Color" /><button class="TMOD_ChooseColor" data-saveto="pups_glow_outline_color_rb" title="Rolling Bomb Outline Color" /><button class="TMOD_ChooseColor" data-saveto="pups_glow_outline_color_tp" title="TagPro Outline Color" /><input type="number" class="TMOD_Input" data-saveto="pups_glow_outline_linewidth" min="1" title="Outline Line Width"><input type="number" class="TMOD_Input" data-saveto="pups_glow_outline_opacity" min="0" max="1" step="0.05" title="Outline Opacity"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Add Shine:</span><input type="checkbox" class="TMOD_Input" data-saveto="pups_add_shine" title="Pup Shine">' + span_6 + '<span class="TMOD_InputContainerLabel">Add Shadow:</span><input type="checkbox" class="TMOD_Input" data-saveto="pups_bottom_shadow" title="Add Shadow Under PUPs"><input type="number" class="TMOD_Input" data-saveto="pups_bottom_shadow_opacity_coefficient" min="0" max="1" step="0.05" title="Opacity"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Pups Filter:</span><input type="text" class="TMOD_Input" data-saveto="pups_filter" style="max-width:200px; width:200px;" title="' + FilterStringOptionsTitle + '"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Custom Boosts:</span><input type="checkbox" class="TMOD_Input" data-saveto="boosts_generic" title="Draw Custom Boosts">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="boosts_generic_texture_opacity" min="0" max="1" step="0.05" title="Texture Pack Boosts Opacity (0 = don\'t draw)"></div>' +
' <div class="TMOD_InputContainer">' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Circle:</span><input type="checkbox" class="TMOD_Input" data-saveto="boosts_generic_basic_circle" title="Draw Basic Circle"><button class="TMOD_ChooseColor" data-saveto="boosts_generic_yellow_color" title="Yellow Boost Color" /><button class="TMOD_ChooseColor" data-saveto="boosts_generic_red_color" title="Red Boost Color" /><button class="TMOD_ChooseColor" data-saveto="boosts_generic_blue_color" title="Blue Boost Color" />' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="boosts_generic_border_linewidth" min="1" step="0.5" title="Circle Line Width"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_border_opacity" min="0" max="1" step="0.05" title="Circle Opacity"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_cutsize" min="0" max="12" title="Cut Size"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_frames" min="2" max="30" title="Animation Frames (TagPro Default is 5)"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Segments:</span><input type="checkbox" class="TMOD_Input" data-saveto="boosts_generic_segments" title="Draw Segments"><button class="TMOD_ChooseColor" data-saveto="boosts_generic_segments_yellow" title="Yellow Segments Color" /><button class="TMOD_ChooseColor" data-saveto="boosts_generic_segments_red" title="Red Segments Color" /><button class="TMOD_ChooseColor" data-saveto="boosts_generic_segments_blue" title="Blue Segments Color" /><input type="number" class="TMOD_Input" data-saveto="boosts_generic_segments_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_segments_linewidth" min="1" step="0.5" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_segments_blur" min="0" title="Blur"><input type="checkbox" class="TMOD_Input" data-saveto="boosts_generic_segments_destinationout" title="Destination-Out"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Lines:</span><input type="checkbox" class="TMOD_Input" data-saveto="boosts_generic_inner_arrows" title="Draw &quot;+&quot; Lines"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_inner_arrows_linewidth" min="1" step="0.5" title="Line Width"><button class="TMOD_ChooseColor" data-saveto="boosts_generic_inner_arrows_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="boosts_generic_inner_arrows_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_inner_arrows_start" min="1" title="Start"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_inner_arrows_length" min="0" title="Line Length"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_inner_arrows_shift" min="0" step="0.25" title="Amount of Movement (0 for none)"><input type="checkbox" class="TMOD_Input" data-saveto="boosts_generic_inner_arrows_heads" title="Draw Arrow Heads"></span>' +
' <span class="TMOD_InputSection"><span class="TMOD_InputContainerLabel">Diagonals:</span><input type="checkbox" class="TMOD_Input" data-saveto="boosts_generic_corner_diagonals" title="Draw &quot;&#10799;&quot; Diagonals"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_corner_diagonals_linewidth" min="1" step="0.5" title="Line Width"><button class="TMOD_ChooseColor" data-saveto="boosts_generic_corner_diagonals_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="boosts_generic_corner_diagonals_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_corner_diagonals_start" min="1" title="Start"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_corner_diagonals_length" min="0" title="Line Length"><input type="number" class="TMOD_Input" data-saveto="boosts_generic_corner_diagonals_shift" min="0" step="0.25" title="Amount of Movement (0 for none)"><input type="checkbox" class="TMOD_Input" data-saveto="boosts_generic_corner_diagonals_heads" title="Draw Arrow Heads"></span>' +
' </div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Boosts Filter:</span><input type="text" class="TMOD_Input" data-saveto="boosts_generic_filter" style="max-width:200px; width:200px;" title="' + FilterStringOptionsTitle + '"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Boosts Outline:</span><input type="checkbox" class="TMOD_Input" data-saveto="boosts_outline" title="Add Outline"><input type="number" class="TMOD_Input" data-saveto="boosts_outline_linewidth" min="1" max="10" step="0.5" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="boosts_outline_segments" min="0" title="# Segments"><button class="TMOD_ChooseColor" data-saveto="boosts_outline_color_red" title="Red" /><button class="TMOD_ChooseColor" data-saveto="boosts_outline_color_blue" title="Blue" /><button class="TMOD_ChooseColor" data-saveto="boosts_outline_color_yellow" title="Yellow" /><input type="number" class="TMOD_Input" data-saveto="boosts_outline_opacity" min="0" max="1" step="0.05" title="Opacity"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Boosts Glow:</span><input type="checkbox" class="TMOD_Input" data-saveto="boosts_glow" title="Add a Glow Under Boosts"><input type="number" class="TMOD_Input" data-saveto="boosts_glow_radius" min="1" title="Boost Glow Radius"><button class="TMOD_ChooseColor" data-saveto="boosts_glow_color_red" title="Red Boost Glow Color" /><button class="TMOD_ChooseColor" data-saveto="boosts_glow_color_blue" title="Blue Boost Glow Color" /><button class="TMOD_ChooseColor" data-saveto="boosts_glow_color_yellow" title="Yellow Boost Glow Color" />' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="boosts_glow_radius_inner" min="0" title="Boost Glow Inner Radius (0 to not use)"><input type="number" class="TMOD_Input" data-saveto="boosts_glow_opacity_inner" min="0" max="1" step="0.01" title="Boost Glow Inner Opacity">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="boosts_glow_radius_outer" min="0" title="Boost Glow Outer Radius (0 to not use)"><input type="number" class="TMOD_Input" data-saveto="boosts_glow_opacity_outer" min="0" max="1" step="0.01" title="Boost Glow Outer Opacity">' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="boosts_glow_hole_radius" min="0" title="Boost Glow Hole Radius (0 to not use)"><input type="number" class="TMOD_Input" data-saveto="boosts_glow_hole_blur" min="0" title="Boost Glow Hole Blur"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">Custom Portals:</span><input type="checkbox" class="TMOD_Input" data-saveto="portals_generic" title="Draw Custom Portals"><button class="TMOD_ChooseColor" data-saveto="portals_generic_color" title="Portal Color" /><button class="TMOD_ChooseColor" data-saveto="portals_generic_color_alt" title="Portal Alt Color" /><button class="TMOD_ChooseColor" data-saveto="portals_generic_color_background" title="Portal Background Color (Auto = No Background)" />' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="portals_generic_color_red" title="Red Portal Color" /><button class="TMOD_ChooseColor" data-saveto="portals_generic_color_red_alt" title="Red Portal Alt Color" /><button class="TMOD_ChooseColor" data-saveto="portals_generic_color_red_background" title="Red Portal Background Color (Auto = No Background)" />' + span_6 + '<button class="TMOD_ChooseColor" data-saveto="portals_generic_color_blue" title="Blue Portal Color" /><button class="TMOD_ChooseColor" data-saveto="portals_generic_color_blue_alt" title="Blue Portal Alt Color" /><button class="TMOD_ChooseColor" data-saveto="portals_generic_color_blue_background" title="Blue Portal Background Color (Auto = No Background)" />' + span_6 + '<input type="number" class="TMOD_Input" data-saveto="portals_generic_linewidth" min="0" max="10" step="0.5" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="portals_generic_blur" min="0" title="Blur"><input type="number" class="TMOD_Input" data-saveto="portals_generic_frames" min="2" max="30" title="Animation Frames (Default is 5)"><input type="number" class="TMOD_Input" data-saveto="portals_generic_border_linewidth" min="0" max="6" step="0.5" title="Border Line Width (0 for none). Uses first color."></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">Portals Outline:</span><input type="checkbox" class="TMOD_Input" data-saveto="portals_outline" title="Add Outline"><input type="number" class="TMOD_Input" data-saveto="portals_outline_linewidth" min="1" max="10" step="0.5" title="Line Width"><input type="number" class="TMOD_Input" data-saveto="portals_outline_segments" min="0" title="# Segments"><button class="TMOD_ChooseColor" data-saveto="portals_outline_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="portals_outline_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="checkbox" class="TMOD_Input" data-saveto="portals_outline_fill" title="Fill"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><span class="TMOD_InputContainerLabel">GravityWell 1:</span><input type="number" class="TMOD_Input" data-saveto="gravitywell1_linewidth" min="0" max="260" title="Line Width (0 for none)"><input type="number" class="TMOD_Input" data-saveto="gravitywell1_radius" min="0" title="Radius (260 default)"><button class="TMOD_ChooseColor" data-saveto="gravitywell1_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="gravitywell1_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="text" class="TMOD_Input" data-saveto="gravitywell1_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:50px;"><input type="checkbox" class="TMOD_Input" data-saveto="gravitywell1_gradient" title="Use Fading Gradient"><input type="checkbox" class="TMOD_Input" data-saveto="gravitywell1_gradientAlt" title="Use Alt Fading Gradient"><input type="text" class="TMOD_Input" data-saveto="gravitywell1_filter" style="max-width:200px; width:200px;" title="' + FilterStringOptionsTitle + '"></div>' +
' <div class="TMOD_InputContainer"><span class="TMOD_InputContainerLabel">GravityWell 2:</span><input type="number" class="TMOD_Input" data-saveto="gravitywell2_linewidth" min="0" max="260" title="Line Width (0 for none)"><input type="number" class="TMOD_Input" data-saveto="gravitywell2_radius" min="0" title="Radius (260 default)"><button class="TMOD_ChooseColor" data-saveto="gravitywell2_color" title="Color" /><input type="number" class="TMOD_Input" data-saveto="gravitywell2_opacity" min="0" max="1" step="0.05" title="Opacity"><input type="text" class="TMOD_Input" data-saveto="gravitywell2_dashpattern" title="Dash Pattern [Length, Space, ...] (empty for solid)" style="max-width:50px;"><input type="checkbox" class="TMOD_Input" data-saveto="gravitywell2_gradient" title="Use Fading Gradient"><input type="checkbox" class="TMOD_Input" data-saveto="gravitywell2_gradientAlt" title="Use Alt Fading Gradient"><input type="text" class="TMOD_Input" data-saveto="gravitywell2_filter" style="max-width:200px; width:200px;" title="' + FilterStringOptionsTitle + '"></div>');
$('.TMOD_Section_Extras').append(' <div class="TMOD_InputContainer TMOD_Separator"><input type="checkbox" class="TMOD_Input" data-saveto="kblogo" title="Add a Koalabeast to the center of the map"><span class="TMOD_InputContainerLabel">Add Koalabeast</span>' + span_6 + '<input type="checkbox" class="TMOD_Input" data-saveto="fill_empty_with_walls" title="Fill empty space around the outside of the map with wall tiles"><span class="TMOD_InputContainerLabel">Fill Empty Space</span></div>' +
'</div>');
let removeRedundantExportValues = function(options) {
let keys = {
//test key //pass value //sibling keys to remove if test key === pass value
'grid1_size': { test:'0', prefix:'grid1' }, //means: if grid1_size === 0 then remove all other options that start with 'grid1'
'grid2_size': { test:'0', prefix:'grid2' },
'checker1_size': { test:'0', prefix:'checker1' },
'floor_gradient1': { test:'value-none', prefix:'floor_gradient1' },
'floor_gradient2': { test:'value-none', prefix:'floor_gradient2' },
'plainfloor': { test:false, prefix:'plainfloor' },
'floor_contour': { test:false, prefix:'floor_contour' },
'plainteam': { test:false, prefix:'plainteam' },
'teamtile_gradient_type': { test:'value-none', prefix:'teamtile_gradient' },
'teamtile_checker_size': { test:'0', prefix:'teamtile_checker' },
'plainendzone': { test:false, prefix:'plainendzone' },
'endzone_checker1_size': { test:'0', prefix:'endzone_checker1' },
'endzone_checker2_size': { test:'0', prefix:'endzone_checker2' },
'flagline_linewidth': { test:'0', prefix:'flagline' },
'centerline_linewidth': { test:'0', prefix:'centerline' },
'texture_floor1': { test:'select-none', prefix:'texture_floor1' },
'texture_floor2': { test:'select-none', prefix:'texture_floor2' },
'texture_floor3': { test:'select-none', prefix:'texture_floor3' },
'texture_team': { test:'select-none', prefix:'texture_team' },
'texture_endzone1': { test:'select-none', prefix:'texture_endzone1' },
'texture_endzone2': { test:'select-none', prefix:'texture_endzone2' },
'texture_walls1': { test:'select-none', prefix:'texture_walls1' },
'texture_walls2': { test:'select-none', prefix:'texture_walls2' },
'texture_base': { test:'select-none', prefix:'texture_base' },
'plainwalls_color_use': { test:false, prefix:'plainwalls_color' },
'walloutline1_size': { test:'0', prefix:'walloutline1' },
'walloutline2_size': { test:'0', prefix:'walloutline2' },
'walloutline3_size': { test:'0', prefix:'walloutline3' },
'wallshadow_inner': { test:false, prefix:'wallshadow', second:'wallshadow_outer' }, //2nd key to test
'balls_plain': { test:false, prefix:'balls_plain' },
'ball_outline1': { test:false, prefix:'ball_outline1' },
'ball_outline2': { test:false, prefix:'ball_outline2' },
'ball_outline3': { test:false, prefix:'ball_outline3' },
'ball_outline4': { test:false, prefix:'ball_outline4' },
'bombs_outline1': { test:false, prefix:'bombs_outline1' },
'bombs_outline2': { test:false, prefix:'bombs_outline2' },
'flags_outline': { test:false, prefix:'flags_outline' },
'boosts_outline': { test:false, prefix:'boosts_outline' },
'portals_outline': { test:false, prefix:'portals_outline' },
'ballskins': { test:false, prefix:'ballskins' },
'spikes_generic': { test:false, prefix:'spikes_generic' },
'spikes_border_linewidth': { test:'0', prefix:'spikes_border' },
'buttons_generic': { test:false, prefix:'buttons_generic' },
'buttons_shine': { test:false, prefix:'buttons_shine' },
'boosts_generic': { test:false, prefix:'boosts_generic' },
'pups_generic_jj_stroke': { test:false, prefix:'pups_generic_jj', second:'pups_generic_jj_fill' },
'pups_generic_rb_stroke': { test:false, prefix:'pups_generic_rb', second:'pups_generic_rb_fill' },
'pups_generic_yp_stroke': { test:false, prefix:'pups_generic_tp', second:'pups_generic_tp_fill' },
'pups_generic_empty_stroke': { test:false, prefix:'pups_generic_empty', second:'pups_generic_empty_fill' },
'portals_generic': { test:false, prefix:'portals_generic' },
'gates_plain_neutral_base': { test:false, prefix:'gates_plain_neutral_base' },
'gates_plain_neutral_gradient': { test:false, prefix:'gates_plain_neutral_gradient' },
'gates_plain_neutral_pyramid': { test:false, prefix:'gates_plain_neutral_pyramid' },
'gates_plain_neutral_cross': { test:false, prefix:'gates_plain_neutral_cross' },
'gates_plain_neutral_cutout': { test:false, prefix:'gates_plain_neutral_cutout' },
'gates_plain_neutral_square': { test:false, prefix:'gates_plain_neutral_square' },
'gates_plain_neutral_detail': { test:false, prefix:'gates_plain_neutral_detail' },
'gates_plain_neutral_border': { test:false, prefix:'gates_plain_neutral_border' },
'gates_plain_grb_base': { test:false, prefix:'gates_plain_grb_base' },
'gates_plain_grb_gradient': { test:false, prefix:'gates_plain_grb_gradient' },
'gates_plain_grb_roundedRect': { test:false, prefix:'gates_plain_grb_roundedRect' },
'gates_plain_grb_pyramid': { test:false, prefix:'gates_plain_grb_pyramid' },
'gates_plain_grb_cross': { test:false, prefix:'gates_plain_grb_cross' },
'gates_plain_grb_cutout': { test:false, prefix:'gates_plain_grb_cutout' },
'gates_plain_grb_square': { test:false, prefix:'gates_plain_grb_square' },
'gates_plain_grb_detail': { test:false, prefix:'gates_plain_grb_detail' },
'gates_plain_grb_border': { test:false, prefix:'gates_plain_grb_border' },
'gate_shadows': { test:false, prefix:'gate_shadows' },
'gravitywell1_linewidth': { test:'0', prefix:'gravitywell1' },
'gravitywell2_linewidth': { test:'0', prefix:'gravitywell2' },
'texture_center': { test:'select-none', prefix:'texture_center' },
'texture_logo_automatic': { test:true, prefix:'texture_logo' },
'ballglow': { test:false, prefix:'ballglow' },
'hexagon_size': { test:'0', prefix:'hexagon' },
'boosts_glow': { test:false, prefix:'boosts_glow' },
'wall_light1': { test:false, prefix:'wall_light1' },
'wall_light2': { test:false, prefix:'wall_light2' },
'wall_text_fontsize': { test:'0', prefix:'wall_text' },
'ball_star_red': { test:false, prefix:'ball_star_red' },
'ball_star_blue': { test:false, prefix:'ball_star_blue' },
'vpcss_border_size': { test:'0', prefix:'vpcss_border' },
'vpcss_radius_border': { test:'0', prefix:'vpcss_radius' },
'vpcss_shadow1_size': { test:'0', prefix:'vpcss_shadow1' },
'vpcss_shadow2_size': { test:'0', prefix:'vpcss_shadow2' },
'clear_under_team_tiles': { test:false, prefix:'clear_under_team_tiles' },
'clear_under_endzone_tiles': { test:false, prefix:'clear_under_endzone_tiles' },
'clear_under_gate_tiles': { test:false, prefix:'clear_under_gate_tiles' },
};
Object.keys(keys).forEach(key => {
//console.log(key, options[key]);
if (!options.hasOwnProperty(key) && (keys[key].hasOwnProperty('second') ? !options.hasOwnProperty(keys[key].second) : true) ||
(options.hasOwnProperty(key) && options[key] === keys[key].test) && (keys[key].hasOwnProperty('second') ? options.hasOwnProperty(keys[key].second) && options[keys[key].second] === keys[key].test : true) ) {
Object.keys(options).forEach(optionsKey => {
if (optionsKey.startsWith(keys[key].prefix) && optionsKey !== key) {
delete options[optionsKey];
}
});
}
});
if (options.hasOwnProperty('background') && (options.background === 'value-linear' || options.background === 'value-radial' || options.background === 'value-conic')) {
delete options.background_url;
} else {
delete options.background_color1;
delete options.background_color2;
delete options.background_color3;
delete options.background_color4;
delete options.background_color5;
delete options.background_size1;
delete options.background_size2;
delete options.background_size3;
delete options.background_size4;
delete options.background_size5;
if (options.background !== 'value-url') {
delete options.background_url;
}
}
Object.keys(options).forEach(optionsKey => {
if (optionsKey.includes('_filter') && optionsKey.startsWith('texture_')) {
if (options[optionsKey].includes('opacity(0%)')) {
const prefix = optionsKey.replace('_filter', '');
Object.keys(options).forEach(optionsKey2 => {
if (optionsKey2.startsWith(prefix)) {
delete options[optionsKey2];
}
});
} else {
options[optionsKey] = options[optionsKey].replace('opacity(100%)', '').replace('saturate(100%)', '').replace('brightness(100%)', '').replace('contrast(100%)', '').replace(' ', ' ').replace(' ', ' ').trim();
}
} else if (optionsKey.startsWith('color_scheme')) {
delete options[optionsKey];
}
});
};
let convertInputsToJSON = function() {
let xOptions = {};
$('.TMOD_Input').each(function(index, element) {
if (element.dataset.saveto === undefined) {
if (element.id !== 'TMOD_Color_Input') {
console.warn('Preset Mods - WARNING! undefined saveto for Export:', element);
}
return;
}
if (!defaultOptions.hasOwnProperty(element.dataset.saveto)) {
console.warn('Preset Mods - WARNING! No default value for Export:', element.dataset.saveto);
return;
}
if (element.type === 'checkbox') {
if (defaultOptions[element.dataset.saveto] !== element.checked) {
xOptions[element.dataset.saveto] = element.checked;
}
} else if (element.type === 'radio') {
if (element.checked === true && defaultOptions[element.dataset.saveto] !== element.dataset.savevalue) {
if (element.checked === true) xOptions[element.dataset.saveto] = element.dataset.savevalue;
}
} else {
if (defaultOptions[element.dataset.saveto] !== element.value) {
xOptions[element.dataset.saveto] = element.value;
}
}
});
$('.TMOD_ChooseColor').each(function(index, element) {
if (defaultOptions[element.dataset.saveto] !== savedOptions[element.dataset.saveto]) {
xOptions[element.dataset.saveto] = savedOptions[element.dataset.saveto];
}
});
if (xOptions.ballskins) {
xOptions.ballskins_red_x = savedOptions.ballskins_red_x;
xOptions.ballskins_red_y = savedOptions.ballskins_red_y;
xOptions.ballskins_blue_x = savedOptions.ballskins_blue_x;
xOptions.ballskins_blue_y = savedOptions.ballskins_blue_y;
}
xOptions.texture_tiles = $('#tiles').val();
xOptions.texture_speedpad = $('#speedpad').val();
xOptions.texture_speedpadRed = $('#speedpadRed').val();
xOptions.texture_speedpadBlue = $('#speedpadBlue').val();
xOptions.texture_portal = $('#portal').val();
xOptions.texture_portalRed = $('#portalRed').val();
xOptions.texture_portalBlue = $('#portalBlue').val();
xOptions.texture_splats = $('#splats').val();
xOptions.texture_gravityWell = $('#gravityWell').val();
return xOptions;
};
//My Saves...
$('#TMOD_MySaves_Add').on('click', function() {
let name = prompt('Options save name:', $('#TMOD_Select_mysaves :selected').text());
if (name !== null) {
name = name.trim();
}
if (name) {
let mysaves = GM_getValue('mysaves', {});
let isNewSave = true;
if (mysaves.hasOwnProperty('select-' + name)) {
if (!confirm('"' + name + '" already exists - OK to overwrite?\n\n')) return;
isNewSave = false;
delete mysaves['select-' + name];
}
let xOptions = convertInputsToJSON();
removeRedundantExportValues(xOptions);
delete xOptions.preset;
delete xOptions.mysaves;
mysaves['select-' + name] = xOptions;
GM_setValue('mysaves', mysaves);
if (isNewSave) {
$('#TMOD_Select_mysaves').append('<option value="select-' + name + '" data-saveto="mysaves" data-savevalue="select-' + name + '" data-update="mysaves" title="' + name + '">' + name + '</option>');
}
$('#TMOD_Select_preset').val('');
$('#TMOD_Select_mysaves').val('select-' + name);
savedOptions.preset = '';
savedOptions.mysaves = 'select-' + name;
GM_setValue('savedOptions', savedOptions);
} else if (name === '') {
alert('Not Saved (No Name?)');
} else {
//alert('Not Saved');
}
});
$('#TMOD_MySaves_Remove').on('click', function() {
let mysaves = GM_getValue('mysaves', {});
let name = $('#TMOD_Select_mysaves').val();
if (name && mysaves.hasOwnProperty(name)) {
if (!confirm('Delete saved options "' + name.slice(7) + '?\n\n')) return;
delete mysaves[name];
GM_setValue('mysaves', mysaves);
$('#TMOD_Select_mysaves :selected').remove();
if ($('#TMOD_Select_mysaves :selected').data('savevalue')) {
savedOptions.mysaves = $('#TMOD_Select_mysaves :selected').data('savevalue');
changePreset(savedOptions.mysaves, 'mysaves');
} else { //no more saved presets so set preset to none
savedOptions.mysaves = '';
savedOptions.preset = 'select-none';
$('#TMOD_Select_preset').val('select-none');
changePreset(savedOptions.preset, 'preset');
}
GM_setValue('savedOptions', savedOptions);
}
});
$('#TMOD_MySaves_RemoveAll').on('click', function() {
if (!confirm('Delete ALL Custom Saved Presets???!?"\n\n')) {
return;
}
GM_deleteValue('mysaves');
savedOptions.mysaves = '';
savedOptions.preset = 'select-none';
GM_setValue('savedOptions', savedOptions);
$('#TMOD_Select_mysaves').empty();
$('#TMOD_Select_preset').val('select-none');
changePreset(savedOptions.preset, 'preset');
});
//Import/Export...
if (defaultValues.enableExport) {
$('#TMOD_Advanced').append('<div><button id="TMOD_Import_JSON" style="margin:10px; color:black;" title="Import from JSON">Import</button> <button id="TMOD_Export_JSON" style="margin:10px; color:black;" title="Export to JSON (console & clipboard)">Export</button></div>');
//Import...
$('#TMOD_Import_JSON').after('<div id="TMOD_JSON_Input" style="display:none; position:absolute; margin:-100px 0 0; padding:5px; width:400px; color:black; background:#8bc34a; border:2px outset #ace87e; border-radius:8px; box-shadow:5px 5px 15px black; z-index:999">' +
' <textarea id="TMOD_JSON_Input_Textarea" placeholder="Paste JSON here..." spellcheck=false style="width:100%; height:200px; color:black; resize:none;"></textarea>' +
' <div style="display:flex; justify-content:space-evenly;"><button id="TMOD_JSON_Input_OK" style="color:black; border-radius:5px; margin:5px; width: 100px;">Import</button> <button id="TMOD_JSON_Input_Close" style="color:black; border-radius:5px; margin:5px; width: 100px;">Cancel</button></div>' +
'</div>');
$('#TMOD_JSON_Input_OK').on('click', function() {
let response = $('#TMOD_JSON_Input_Textarea').val();
let optionsJSON = {};
if (!response) return;
try {
optionsJSON = JSON.parse(response);
} catch(e) {
alert('An error has occurred. Data string not in JSON format?\n\n',e);
return;
}
let showall = savedOptions.showall;
savedOptions = Object.assign({}, defaultOptions);
Object.assign(savedOptions, optionsJSON);
savedOptions.preset = '';
savedOptions.showall = showall;
GM_setValue('savedOptions', savedOptions);
updatePreviewImage();
loadOptions();
setBallskin();
$('#TMOD_Select_preset').val('');
$('#TMOD_JSON_Input').fadeOut(200);
});
$('#TMOD_JSON_Input_Close').on('click', function() {
$('#TMOD_JSON_Input').fadeOut(100);
});
$('#TMOD_Import_JSON').on('click', function() {
$('#TMOD_JSON_Input').fadeIn(100);
});
//Export...
$('#TMOD_Export_JSON').on('click', function() {
let xOptions = convertInputsToJSON();
removeRedundantExportValues(xOptions);
let name = (xOptions.preset || xOptions.mysaves);
delete xOptions.preset;
delete xOptions.mysaves;
if (!$('#TMOD_LoadTexturePack').is(':checked')) {
delete xOptions.texture_tiles;
delete xOptions.texture_speedpad;
delete xOptions.texture_speedpadRed;
delete xOptions.texture_speedpadBlue;
delete xOptions.texture_portal;
delete xOptions.texture_portalRed;
delete xOptions.texture_portalBlue;
delete xOptions.texture_splats;
delete xOptions.texture_gravityWell;
}
let sOptions = JSON.stringify(xOptions);
console.log('\'' + name + '\': ' + sOptions);
GM_setClipboard(sOptions, 'text')
});
}
$('#TMOD_Advanced').append('<div>Note: You can use <a href="https://bash-tp.github.io/tagpro-vcr/" target="_blank">TagPro VCR</a> to preview how these presets will look in game.</div>');
//Color Picker stuff...
let colorPickerColors = [
'#ffebee','#fce4ec','#f3e5f5','#ede7f6','#e8eaf6','#e3f2fd','#e1f5fe','#e0f7fa','#e0f2f1','#e8f5e9','#f1f8e9','#f9fbe7','#fffde7','#fff8e1','#fff3e0','#fbe9e7','#efebe9','#fafafa','#eceff1','#f2f4f4','#eaecee',
'#ffcdd2','#f8bbd0','#e1bee7','#d1c4e9','#c5cae9','#bbdefb','#b3e5fc','#b2ebf2','#b2dfdb','#c8e6c9','#dcedc8','#f0f4c3','#fff9c4','#ffecb3','#ffe0b2','#ffccbc','#d7ccc8','#eeeeee','#cfd8dc','#e5e8e8','#d5d8dc',
'#ef9a9a','#f48fb1','#ce93d8','#b39ddb','#9fa8da','#90caf9','#81d4fa','#80deea','#80cbc4','#a5d6a7','#c5e1a5','#e6ee9c','#fff59d','#ffe082','#ffcc80','#ffab91','#bcaaa4','#e0e0e0','#b0bec5','#ccd1d1','#abb2b9',
'#e57373','#f06292','#ba68c8','#9575cd','#7986cb','#64b5f6','#4fc3f7','#4dd0e1','#4db6ac','#81c784','#aed581','#dce775','#fff176','#ffd54f','#ffb74d','#ff8a65','#a1887f','#c9c9c9','#90a4ae','#b2babb','#808b96',
'#ef5350','#ec407a','#ab47bc','#7e57c2','#5c6bc0','#42a5f5','#29b6f6','#26c6da','#26a69a','#66bb6a','#9ccc65','#d4e157','#ffee58','#ffca28','#ffa726','#ff7043','#8d6e63','#bdbdbd','#78909c','#99a3a4','#566573',
'#f44336','#e91e63','#9c27b0','#673ab7','#3f51b5','#2196f3','#03a9f4','#00bcd4','#009688','#4caf50','#8bc34a','#cddc39','#ffeb3b','#ffc107','#ff9800','#ff5722','#795548','#9e9e9e','#607d8b','#7f8c8d','#2c3e50',
'#e53935','#d81b60','#8e24aa','#5e35b1','#3949ab','#1e88e5','#039be5','#00acc1','#00897b','#43a047','#7cb342','#c0ca33','#fdd835','#ffb300','#fb8c00','#f4511e','#6d4c41','#757575','#546e7a','#707b7c','#273746',
'#d32f2f','#c2185b','#7b1fa2','#512da8','#303f9f','#1976d2','#0288d1','#0097a7','#00796b','#388e3c','#689f38','#afb42b','#fbc02d','#ffa000','#f57c00','#e64a19','#5d4037','#616161','#455a64','#616a6b','#212f3d',
'#c62828','#ad1457','#6a1b9a','#4527a0','#283593','#1565c0','#0277bd','#00838f','#00695c','#2e7d32','#558b2f','#9e9d24','#f9a825','#ff8f00','#ef6c00','#d84315','#4e342e','#424242','#37474f','#515a5a','#1c2833',
'#b71c1c','#880e4f','#4a148c','#311b92','#1a237e','#0d47a1','#01579b','#006064','#004d40','#1b5e20','#33691e','#827717','#f57f17','#ff6f00','#e65100','#bf360c','#3e2723','#212121','#263238','#424949','#17202a',
'#a30d0d','#6d0534','#300871','#1b0c78','#0c1162','#052d89','#003c82','#004448','#003327','#0c420f','#1d4d0e','#675b0a','#f2630a','#ff5300','#de3600','#ad1f04','#261411','#101010','#131c21','#292f2f','#0a0f16',
'#900606','#560222','#1e035b','#0f0561','#05084c','#021c73','#00286c','#002f33','#002018','#052e07','#103706','#504504','#ee4d04','#ff3d00','#d52300','#9b1201','#160a08','#080808','#0a0f13','#191e1e','#04070b',
'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,
'#c04040','#c07c40','#c0be40','#7fc040','#40c040','#40c07f','#40c0be','#4082c0','#4043c0','#7c40c0','#be40c0','#c0407f','#4585a2','#614761','#614754','#614747','#615247','#615f47','#615f47','#476147','#474961',
'#903030','#905d30','#908f30','#609030','#309030','#30905f','#30908f','#306290','#303290','#5d3090','#8f3090','#903060','#34637a','#493549','#493540','#493536','#493e35','#494735','#404935','#354935','#353749',
'#5a1e1e','#5a3a1e','#5a591e','#3c5a1e','#1e5a1e','#1e5a3c','#1e5a59','#1e3d5a','#1e1f5a','#3a1e5a','#591e5a','#5a1e3c','#213f4c','#2d222d','#2d2227','#2d2222','#2d2722','#2d2d22','#282d22','#222d22','#22232d',
'#ff0000','#ff8000','#ffff00','#80ff00','#00ff00','#00ff80','#00ffff','#0080ff','#0000ff','#7f00ff','#ff00ff','#ff007f','#1696d1','#6d3a6e','#6e3a54','#6e3a3a','#6e523a','#6e6c3a','#546e3a','#3a6e3b','#3a3f6e',
'#800000','#803c00','#807e00','#3f8000','#008000','#00803f','#00807e','#004280','#000380','#3c0080','#7e0080','#80003f','#0c4b68','#371d37','#371d2b','#371d1e','#37291d','#37361d','#2b371d','#1d371d','#1d2037',
'#400000','#401e00','#403f00','#204000','#004000','#004020','#00403f','#002140','#000240','#1e0040','#3f0040','#400020','#072534','#1c0f1c','#1c0f15','#1c0f0f','#1c150f','#1c1b0f','#161c0f','#0f1c0f','#0f101c',
'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,'' ,
'#ffffff','#000000'
];
$('#TMOD_Advanced').append('<div id="TMOD_ColorPicker" style="position:absolute; display:flex; flex-flow:row wrap; margin:0px 0px 0px 260px; width:380px; top:-50px; background:#111; border:1px dotted white; z-index:1;"></div>'); //bottom:5px; left:5px;
colorPickerColors.forEach(function(value) {
if (value) $('#TMOD_ColorPicker').append('<div class="TMOD_Color" data-color="' + value + '" title="' + value + '" style="background:' + value + ';"></div>');
else $('#TMOD_ColorPicker').append('<div class="TMOD_Color_Empty"></div>');
});
$('#TMOD_ColorPicker').append('' + span_6 + '<div id="TMOD_Color_Auto" class="TMOD_Color" data-color="auto" style="background:linear-gradient(#a00, #0a0, #00a);" title="Auto"></div>');
$('#TMOD_ColorPicker').append(span_10 + '<input type="color" id="TMOD_Color_Input" class="TMOD_Input">');
$('#TMOD_ColorPicker').append('<button id="TMOD_Color_Cancel" style="position:absolute; color:black; font-size:9px; height:16px; bottom:2px; right:2px;">Cancel</button>');
let addColorToTitle = function(saveto, color) {
let title = 'Color';
if ($('.TMOD_ChooseColor[data-saveto="' + saveto + '"]').attr('title')) {
title = $('.TMOD_ChooseColor[data-saveto="' + saveto + '"]').attr('title').replace(' [auto]', '');
}
if (title.indexOf('[#') >= 0) {
title = title.slice(0, title.indexOf('[#') - 1);
}
$('.TMOD_ChooseColor[data-saveto="' + saveto + '"]').attr('title', title + ' [' + color + ']');
};
let saveColorInput = function(saveto, color, saveOptions=true) {
if (!savedOptions.hasOwnProperty(saveto)) {
return false;
}
if (!color || !color.startsWith('#') || color.length !== 7) {
color = 'auto';
}
savedOptions[saveto] = color;
if (saveOptions) GM_setValue('savedOptions', savedOptions);
if (color === 'auto') $('.TMOD_ChooseColor[data-saveto="' + saveto + '"]').css('background', 'linear-gradient(#a00, #0a0, #00a)');
else $('.TMOD_ChooseColor[data-saveto="' + saveto + '"]').css('background', color);
addColorToTitle(saveto, color);
$('#TMOD_ColorPicker').data('saveto', '');
$('#TMOD_ColorPicker').hide();
};
$('#TMOD_ColorPicker').hide();
$('.TMOD_ChooseColor').each(function(key, value) {
if (this.dataset.saveto && savedOptions[this.dataset.saveto]) {
this.style.background = savedOptions[this.dataset.saveto];
}
this.style.boxShadow = '0px 0px 1px white';
});
$('.TMOD_ChooseColor').on('click', function() {
if ($('#TMOD_ColorPicker').is(':visible')) {
$('#TMOD_ColorPicker').hide();
return;
}
let saveto = this.dataset.saveto;
$(this).after( $('#TMOD_ColorPicker') );
$('#TMOD_ColorPicker').data('saveto', this.dataset.saveto);
$('#TMOD_Color_Input').data('saveto', $('#TMOD_ColorPicker').data('saveto'));
$('#TMOD_Color_Input').val(savedOptions[saveto]);
$('#TMOD_ColorPicker').fadeIn(100);
$('.TMOD_Color').each(function(key, value) {
if (this.dataset.color === savedOptions[saveto]) {
this.style.border = '1px dashed #444';
this.style.boxShadow = '0px 0px 1px #fff';
} else {
this.style.border = 'none';
this.style.boxShadow = 'none';
}
});
});
$('#TMOD_ColorPicker').on('click', '.TMOD_Color', function() { //a color in the pickup popup
if (!this.dataset.color) return;
saveColorInput($('#TMOD_ColorPicker').data('saveto'), this.dataset.color);
});
$('#TMOD_ShowAll').on('click', function() {
if (savedOptions.showall) {
savedOptions.showall = false;
$('#TMOD_Advanced').slideUp();
} else {
savedOptions.showall = true;
$('#TMOD_Advanced').slideDown();
}
GM_setValue('savedOptions', savedOptions);
});
let cacheImage = function(saveto) {
let url = defaultValues[saveto][savedOptions[saveto]].url;
let image = new Image();
image.crossOrigin = 'Anonymous';
image.src = url;
};
$('#TMOD_ImageSelect').on('load', function() {
let filter = $('#TMOD_ImageSelect').data('filter') || 'none';
$('#TMOD_ImageSelect').css('filter', filter);
$('#TMOD_ImageSelect').data('filter', 'none')
});
$('body').append('<div id="TMOD_Mask" style="position:absolute; display:none; left:0px; top:0px; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:999;"></div>');
$('body').append('<div id="TMOD_PreviewBox" style="position:absolute; display:none; left:120px; top:80px; width:auto; height:auto; border:2px solid #aaa; border-radius:12px; z-index:1000;"><img id="TMOD_PreviewBoxImage" style="border-radius:12px;"/></div>');
$('#TMOD_ImageSelect').on('click', function() {
(async() => {
while (!document.querySelector('#TMOD_ImageSelect').naturalWidth || !document.querySelector('#TMOD_ImageSelect').naturalHeight) {
await new Promise(resolve => setTimeout(resolve, 20));
}
let screen_width = $(window).width();
let screen_height = $(window).height();
let screen_top = $(window).scrollTop();
let image_width = document.querySelector('#TMOD_ImageSelect').naturalWidth;
let image_height = document.querySelector('#TMOD_ImageSelect').naturalHeight;
$('#TMOD_PreviewBox').css('left', (screen_width - image_width) / 2);
$('#TMOD_PreviewBox').css('top', (screen_height - image_height) / 2 + screen_top);
$('#TMOD_PreviewBoxImage').attr('src', $('#TMOD_ImageSelect').attr('src'));
$('#TMOD_Mask, #TMOD_PreviewBox').fadeIn(200);
})();
});
$('#TMOD_Mask, #TMOD_PreviewBox').on('click', function() {
$('#TMOD_Mask, #TMOD_PreviewBox').fadeOut(100);
});
function updatePreviewImage(saveTo, saveValue) {
const blank_image = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';
if (saveTo === 'background' && saveValue === 'value-url' && savedOptions.background_url.startsWith('http')) {
$('#TMOD_ImageSelect').attr('src', savedOptions.background_url).css('opacity', 1);
$('#TMOD_ImageSelect').css({ 'max-width':'580px' });
} else if (saveTo && defaultValues[saveTo].hasOwnProperty(savedOptions[saveTo])) {
if (saveTo === 'preset') {
if (defaultValues.preset_previews.hasOwnProperty(savedOptions[saveTo]) && defaultValues.preset_previews[savedOptions[saveTo]]) {
$('#TMOD_ImageSelect').attr('src', defaultValues.preset_previews[savedOptions[saveTo]]).css('opacity', 1);
} else {
$('#TMOD_ImageSelect').css('opacity', 0); //.attr('src', blank_image);
}
} else {
let filter = $('.TMOD_Input[data-saveto="' + saveTo + '_filter"]').val() || '';
filter = filter.replace(/opacity[(\d)%]*/, '');
$('#TMOD_ImageSelect').data('filter', filter.trim());
$('#TMOD_ImageSelect').attr('src', defaultValues[saveTo][savedOptions[saveTo]].url).css('opacity', 1);
}
$('#TMOD_ImageSelect').css('max-width', '580px');
} else {
$('#TMOD_ImageSelect').css('max-width', '0px'); //.attr('src', blank_image);
}
}
function changePreset(preset, update) {
let showall = savedOptions.showall;
let csc_floor = savedOptions.color_scheme_color_floor;
let csc_walls = savedOptions.color_scheme_color_walls;
let csc_red = savedOptions.color_scheme_color_red;
let csc_blue = savedOptions.color_scheme_color_blue;
let csc_yellow = savedOptions.color_scheme_color_yellow;
let csc_green = savedOptions.color_scheme_color_green;
savedOptions = Object.assign({}, defaultOptions);
if (update === 'mysaves') {
let mysaves = GM_getValue('mysaves', {});
if (mysaves.hasOwnProperty(preset)) Object.assign(savedOptions, mysaves[preset]);
savedOptions.preset = '';
savedOptions.mysaves = preset;
updatePreviewImage();
} else {
if (preset !== 'select-none' && defaultValues[update].hasOwnProperty(preset)) Object.assign(savedOptions, defaultValues[update][preset]);
savedOptions.preset = preset;
savedOptions.mysaves = '';
updatePreviewImage(update);
}
savedOptions.showall = showall;
savedOptions.color_scheme_color_floor = csc_floor;
savedOptions.color_scheme_color_walls = csc_walls;
savedOptions.color_scheme_color_red = csc_red;
savedOptions.color_scheme_color_blue = csc_blue;
savedOptions.color_scheme_color_yellow = csc_yellow;
savedOptions.color_scheme_color_green = csc_green;
GM_setValue('savedOptions', savedOptions);
loadOptions();
setBallskin();
}
function loadOptions(loadTextures=true) {
Object.keys(savedOptions).forEach(key => {
if (savedOptions[key] === true || savedOptions[key] === false) { //checkbox
$('input.TMOD_Input[data-saveto="' + key + '"]').prop('checked', savedOptions[key]);
} else if (savedOptions[key].toString().startsWith('value-')) { //radio
$('input.TMOD_Input[data-saveto="' + key + '"][data-savevalue="' + savedOptions[key] + '"]').prop('checked', true);
} else if (savedOptions[key].toString().startsWith('select-')) { //select
$('#TMOD_Select_' + key).val(savedOptions[key]);
} else if (savedOptions[key].toString().startsWith('#') || savedOptions[key] === 'auto') { //color button
$('.TMOD_ChooseColor[data-saveto="' + key + '"]').css('background', savedOptions[key] === 'auto' ? 'linear-gradient(#a00, #0a0, #00a)' : savedOptions[key]);
addColorToTitle(key, savedOptions[key]);
} else { //other
$('.TMOD_Input[data-saveto="' + key + '"]').val(savedOptions[key]);
}
});
if (defaultValues.globalOptions.load_texture_pack) {
$('#TMOD_LoadTexturePack').prop('checked', true);
if (loadTextures) {
if (savedOptions.texture_tiles) $('#tiles').val(savedOptions.texture_tiles);
if (savedOptions.texture_speedpad) $('#speedpad').val(savedOptions.texture_speedpad);
if (savedOptions.texture_speedpadRed) $('#speedpadRed').val(savedOptions.texture_speedpadRed);
if (savedOptions.texture_speedpadBlue) $('#speedpadBlue').val(savedOptions.texture_speedpadBlue);
if (savedOptions.texture_portal) $('#portal').val(savedOptions.texture_portal);
if (savedOptions.texture_portalRed) $('#portalRed').val(savedOptions.texture_portalRed);
if (savedOptions.texture_portalBlue) $('#portalBlue').val(savedOptions.texture_portalBlue);
if (savedOptions.texture_splats) $('#splats').val(savedOptions.texture_splats);
$('#gravityWell').val(savedOptions.texture_gravityWell); //if (savedOptions.texture_gravityWell)
if (savedOptions.preset !== 'select-none') {
$('#custom-textures-btn').trigger('click'); //save the textures
}
}
}
if (defaultValues.globalOptions.expand_viewport) {
$('#TMOD_Expand_Viewport').prop('checked', true);
}
if (defaultValues.globalOptions.transparent_viewport) {
$('#TMOD_Transparent_Viewport').prop('checked', true);
}
$('#TMOD_Max_Splats').val(defaultValues.globalOptions.max_number_splats);
if (defaultValues.globalOptions.ball_spin) {
$('#TMOD_Ball_Spin').prop('checked', true);
}
if (defaultValues.globalOptions.walls_as_new_layer) {
$('#TMOD_Walls_New_Layer').prop('checked', true);
}
if (defaultValues.globalOptions.disable_for_events) {
$('#TMOD_Disable_For_Events').prop('checked', true);
}
if (defaultValues.globalOptions.disable_for_bigmaps) {
$('#TMOD_Disable_For_BigMaps').prop('checked', true);
}
let vpEffect = GM_getValue('ViewportEffect', 'none');
$('input[data-savevalue="' + vpEffect + '"]').prop('checked', true);
$('select.TMOD_Input[data-update="texture"]').each(function(index, element) {
if (element.value !== 'select-none') {
if (defaultValues[element.dataset.saveto].hasOwnProperty(savedOptions[element.dataset.saveto]) && defaultValues[element.dataset.saveto][savedOptions[element.dataset.saveto]].url) {
cacheImage(element.dataset.saveto); //browser cache
} else {
element.value = 'select-none';
$('input.TMOD_Input[data-saveto="' + element.dataset.saveto + '_filter"]').val('');
$('input.TMOD_Input[data-saveto="' + element.dataset.saveto + '_size"]').val('1');
//$('input.TMOD_Input[data-saveto="' + element.dataset.saveto + '_gco' + '"]').val('source-atop');
}
}
});
if (savedOptions.showall) $('#TMOD_Advanced').show();
else $('#TMOD_Advanced').hide();
}
loadOptions(false);
if (savedOptions.preset) updatePreviewImage('preset');
else updatePreviewImage();
let skins_image = new Image;
skins_image.onload = loadBallskinImages;
skins_image.crossOrigin = 'Anonymous';
skins_image.src = defaultValues.texture_ballskins['select-Skins'].url;
let isTransparent = function(data) {
let length = data.length;
let i = -4;
while ((i += 4) < length) {
if (data[i+3]) return false; //found an opaque pixel in the alpha channel
}
return true; //all pixels were transparent
};
function loadBallskinImages() {
let width = Math.floor(skins_image.width);
let height = Math.floor(skins_image.height);
let skinsCanvas = document.createElement('canvas');
skinsCanvas.width = width;
skinsCanvas.height = height;
let skinsCtx = skinsCanvas.getContext("2d", { willReadFrequently: true }); //skinsCanvas.getContext("2d");
skinsCtx.drawImage(skins_image, 0,0);
for (let y=0; y<height; y+=48) {
for (let x=0; x<width; x+=48) {
let pixelData = skinsCtx.getImageData(x+4, y+4, 25, 25).data;
let isPixelDataTransparent = isTransparent(pixelData);
if (!isPixelDataTransparent) {
$('#TMOD_Options_Skins').append(' <span class="TMOD_Skin" data-color="red" data-x="' + x + '" data-y="' + y + '" style="background-color:#f77; background-image:url(' + defaultValues.texture_ballskins['select-Skins'].url + '); background-position:-' + x + 'px -' + y + 'px; " title="Red Ball"></span>' +
' <span class="TMOD_Skin" data-color="blue" data-x="' + x + '" data-y="' + y + '" style="background-color:#77f; background-image:url(' + defaultValues.texture_ballskins['select-Skins'].url + '); background-position:-' + x + 'px -' + y + 'px;" title="Blue Ball"></span>');
}
}
}
$('.TMOD_Skin').on('click', function() {
if (savedOptions['ballskins_' + this.dataset.color + '_x'] === this.dataset.x && savedOptions['ballskins_' + this.dataset.color + '_y'] === this.dataset.y) {
savedOptions['ballskins_' + this.dataset.color + '_x'] = '-1';
savedOptions['ballskins_' + this.dataset.color + '_y'] = '-1';
} else {
savedOptions['ballskins_' + this.dataset.color + '_x'] = this.dataset.x;
savedOptions['ballskins_' + this.dataset.color + '_y'] = this.dataset.y;
}
GM_setValue('savedOptions', savedOptions);
$('#TMOD_Options_Skins .TMOD_Selected').removeClass('TMOD_Selected');
$('#TMOD_Options_Skins').find('span[data-color="red"][data-x="' + savedOptions.ballskins_red_x + '"][data-y="' + savedOptions.ballskins_red_y + '"]').addClass('TMOD_Selected');
$('#TMOD_Options_Skins').find('span[data-color="blue"][data-x="' + savedOptions.ballskins_blue_x + '"][data-y="' + savedOptions.ballskins_blue_y + '"]').addClass('TMOD_Selected');
});
skinsCanvas = null;
setBallskin();
}
function setBallskin() {
$('#TMOD_Options_Skins .TMOD_Selected').removeClass('TMOD_Selected');
$('#TMOD_Options_Skins').find('span[data-color="red"][data-x="' + savedOptions.ballskins_red_x + '"][data-y="' + savedOptions.ballskins_red_y + '"]').addClass('TMOD_Selected');
$('#TMOD_Options_Skins').find('span[data-color="blue"][data-x="' + savedOptions.ballskins_blue_x + '"][data-y="' + savedOptions.ballskins_blue_y + '"]').addClass('TMOD_Selected');
}
$('.TMOD_ImageSelect').on('click', function() {
updatePreviewImage(this.dataset.target);
});
document.getElementById('TMOD_Color_Cancel').addEventListener('click', function(input) {
$('#TMOD_ColorPicker').hide();
});
document.getElementById('TMOD_Options_Inner').addEventListener('change', function(input) {
let target = input.target;
if (target.type === 'color') {
if (target.id === 'TMOD_Color_Input') {
saveColorInput($('#TMOD_Color_Input').data('saveto'), target.value);
} else {
saveColorInput(target.dataset.saveto, target.value);
}
}
});
document.getElementById('TMOD_Options_Inner').addEventListener('input', function(input) {
let target = input.target;
if (target.type === 'color') {
return false;
}
$('#TMOD_ColorPicker').hide();
if (target.id === 'TMOD_LoadTexturePack') {
defaultValues.globalOptions.load_texture_pack = target.checked;
GM_setValue('globalOptions', defaultValues.globalOptions);
//change the custom texture links and save them...
if (target.checked) {
let response = confirm('Do you want to load the Texture Pack for this Preset now?\n\n');
if (response) {
if (savedOptions.texture_tiles) $('#tiles').val(savedOptions.texture_tiles);
if (savedOptions.texture_speedpad) $('#speedpad').val(savedOptions.texture_speedpad);
if (savedOptions.texture_speedpadRed) $('#speedpadRed').val(savedOptions.texture_speedpadRed);
if (savedOptions.texture_speedpadBlue) $('#speedpadBlue').val(savedOptions.texture_speedpadBlue);
if (savedOptions.texture_portal) $('#portal').val(savedOptions.texture_portal);
if (savedOptions.texture_portalRed) $('#portalRed').val(savedOptions.texture_portalRed);
if (savedOptions.texture_portalBlue) $('#portalBlue').val(savedOptions.texture_portalBlue);
if (savedOptions.texture_splats) $('#splats').val(savedOptions.texture_splats);
$('#gravityWell').val(savedOptions.texture_gravityWell); //if (savedOptions.texture_gravityWell)
$('#custom-textures-btn').trigger('click'); //save the textures
}
}
return;
} else if (target.id === 'TMOD_Expand_Viewport') {
defaultValues.globalOptions.expand_viewport = target.checked;
GM_setValue('globalOptions', defaultValues.globalOptions);
return;
} else if (target.id === 'TMOD_Transparent_Viewport') {
defaultValues.globalOptions.transparent_viewport = target.checked;
GM_setValue('globalOptions', defaultValues.globalOptions);
return;
} else if (target.id === 'TMOD_Max_Splats') {
defaultValues.globalOptions.max_number_splats = target.value;
GM_setValue('globalOptions', defaultValues.globalOptions);
return;
} else if (target.id === 'TMOD_Ball_Spin') {
defaultValues.globalOptions.ball_spin = target.checked;
GM_setValue('globalOptions', defaultValues.globalOptions);
return;
} else if (target.id === 'TMOD_Walls_New_Layer') {
defaultValues.globalOptions.walls_as_new_layer = target.checked;
GM_setValue('globalOptions', defaultValues.globalOptions);
return;
} else if (target.id === 'TMOD_Disable_For_Events') {
defaultValues.globalOptions.disable_for_events = target.checked;
GM_setValue('globalOptions', defaultValues.globalOptions);
return;
} else if (target.id === 'TMOD_Disable_For_BigMaps') {
defaultValues.globalOptions.disable_for_bigmaps = target.checked;
GM_setValue('globalOptions', defaultValues.globalOptions);
return;
}
if (target.name === 'TMOD_VP_Effect') {
GM_setValue('ViewportEffect', target.dataset.savevalue);
return;
}
if (!target.className.includes('TMOD_Input')) {
return;
}
if (target.type === 'checkbox') {
savedOptions[target.dataset.saveto] = target.checked;
} else if (target.type === 'radio') {
if (target.dataset.savevalue) {
savedOptions[target.dataset.saveto] = target.dataset.savevalue;
} else {
const radioButtons = document.getElementsByName(target.name);
radioButtons.forEach(function(button) {
if (button.checked) savedOptions[button.dataset.saveto] = true;
else savedOptions[button.dataset.saveto] = false;
});
}
updatePreviewImage(target.dataset.target, target.dataset.savevalue);
} else {
savedOptions[target.dataset.saveto] = target.value;
if (target.type === 'select-one') {
target = target.options[target.selectedIndex];
if (target.dataset.update === 'texture') {
if (target.value === 'select-none') {
savedOptions[target.dataset.saveto + '_filter'] = '';
$('input.TMOD_Input[data-saveto="' + target.dataset.saveto + '_filter"]').val('');
savedOptions[target.dataset.saveto + '_size'] = '1';
$('input.TMOD_Input[data-saveto="' + target.dataset.saveto + '_size"]').val('1');
savedOptions[target.dataset.saveto + '_gco'] = '';
$('select.TMOD_Input[data-saveto="' + target.dataset.saveto + '_gco"]').val('source-atop');
savedOptions[target.dataset.saveto + '_xOffset'] = '0';
$('select.TMOD_Input[data-saveto="' + target.dataset.saveto + '_xOffset"]').val('0');
savedOptions[target.dataset.saveto + '_yOffset'] = '0';
$('select.TMOD_Input[data-saveto="' + target.dataset.saveto + '_yOffset"]').val('0');
} else {
savedOptions[target.dataset.saveto + '_filter'] = defaultValues[target.dataset.saveto][target.value].filter;
$('input.TMOD_Input[data-saveto="' + target.dataset.saveto + '_filter"]').val(defaultValues[target.dataset.saveto][target.value].filter);
savedOptions[target.dataset.saveto + '_size'] = defaultValues[target.dataset.saveto][target.value].size;
$('input.TMOD_Input[data-saveto="' + target.dataset.saveto + '_size"]').val(defaultValues[target.dataset.saveto][target.value].size);
//savedOptions[target.dataset.saveto + '_gco'] = defaultValues[target.dataset.saveto][target.value].gco;
//$('input.TMOD_Input[data-saveto="' + target.dataset.saveto + '_gco' + '"]').val(defaultValues[target.dataset.saveto][target.value].gco);
savedOptions[target.dataset.saveto + '_xOffset'] = defaultValues[target.dataset.saveto][target.value].xOffset;
$('input.TMOD_Input[data-saveto="' + target.dataset.saveto + '_xOffset"]').val(defaultValues[target.dataset.saveto][target.value].xOffset);
savedOptions[target.dataset.saveto + '_yOffset'] = defaultValues[target.dataset.saveto][target.value].yOffset;
$('input.TMOD_Input[data-saveto="' + target.dataset.saveto + '_yOffset"]').val(defaultValues[target.dataset.saveto][target.value].yOffset);
}
updatePreviewImage(target.dataset.saveto);
}
}
}
GM_setValue('savedOptions', savedOptions);
if (target.dataset.update === 'preset' || target.dataset.update === 'mysaves') {
changePreset(target.value, target.dataset.update);
}
});
GM_addStyle('.TMOD_Input { color:black; font-size:11px; max-width:40px; margin:0 2px 0 0 !important; }');
GM_addStyle('.TMOD_Input[type=number] { height:15px; max-width:44px; font-size:10px; }');
GM_addStyle('.TMOD_Input[type=text] { height:15px; font-size:10px; }')
GM_addStyle('.TMOD_Input[type=color] { height:15px; border:0px; padding:0px; }');
GM_addStyle('.TMOD_Title { position:relative; font-size:14px; background:#181818; margin:9px 0 1px 0; padding:4px; }');
GM_addStyle('.TMOD_SubTitle { position:relative; font-size:12px; margin:6px 0 1px 0; padding:3px; }');
GM_addStyle('.TMOD_InputContainer { position:relative; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; padding:2px 0 0 0; }');
GM_addStyle('.TMOD_Separator { border-top:1px dotted #555; }');
GM_addStyle('.TMOD_InputSection { font-size:10px; display:flex; align-items:center; margin:2px 5px; padding:1px 3px; border:1px outset #999; }');
GM_addStyle('.TMOD_InputContainerLabel { font-size:10px; margin:0 2px 2px 0px; }');
GM_addStyle('.TMOD_Color { width:17px; height:17px; margin:1px 0 0 1px; }');
GM_addStyle('.TMOD_Color:hover { border:1px outset #555; cursor:pointer; }');
GM_addStyle('.TMOD_Color_Empty { width:17px; height:17px; margin:1px 0 0 1px; }');
GM_addStyle('.TMOD_ChooseColor { width:16px; height:12px; background:linear-gradient(#a00, #0a0, #00a); border:none; margin:0 1px; padding:0px; }');
GM_addStyle('.TMOD_Skin { margin:1px; width:48px; height:48px; }');
GM_addStyle('.TMOD_Selected { outline:1px solid chartreuse; border-radius:50%; }');
GM_addStyle('#TMOD_Options_Skins::-webkit-scrollbar { height:6px; }');
GM_addStyle('#TMOD_Options_Skins::-webkit-scrollbar-thumb { background:#292; border-radius:4px; }');
GM_addStyle('#TMOD_Options_Skins::-webkit-scrollbar-track { background:#ddd; border-radius:4px; }');
GM_addStyle('.TMOD_Input_Number_Small { max-width:32px !important; }');
//------------- IN A GAME -------------
} else if (location.pathname === '/game' || location.port || location.pathname.includes('/tagpro-vcr/')) {
let disableForEvents = defaultValues.globalOptions.disable_for_events;
let disableForBigMaps = defaultValues.globalOptions.disable_for_bigmaps;
let isEvent = false;
let isHalloween = false;
let isBirthday = false;
let isEaster = false;
let scriptSrcs = $('script[src]').toArray();
let scriptNames = ['halloween', 'birthday', 'easter', 'pirates'];
// for (let scriptSrc of scriptSrcs) {
// console.log('PM:: scriptSrc:',scriptSrc);
// }
for (let scriptName of scriptNames) {
if (scriptSrcs.some(e => e.src.includes(scriptName))) { //eg: /events/halloween-2019/scripts/halloween-2019.js
isEvent = true;
if (scriptName === 'halloween') isHalloween = true;
if (scriptName === 'birthday' || scriptName === 'pirates') isBirthday = true;
if (scriptName === 'easter') isEaster = true;
break;
}
}
// console.log('PM:: isEvent:',isEvent + ' |isHalloween:',isHalloween + ' |isBirthday:',isBirthday + ' |isEaster:',isEaster);
if (isEvent && disableForEvents) {
return false;
}
let createCanvas = function(width, height, forceDOM=false) {
if (!forceDOM && typeof OffscreenCanvas !== 'undefined' && !window.navigator.userAgent.includes('Gecko')) {
return new OffscreenCanvas(width, height); //An 'OffscreenCanvas' is smaller and faster than a normal canvas. Firefox Support is bad as at 2023-03-01.
} else {
let canvas = document.createElement('canvas');
canvas.width = width;
canvas.height = height;
return canvas;
}
};
let tr = tagpro.renderer;
let tilesImage = tagpro.tiles.image;
let mapWidth, mapHeight;
let extraMapSpace = savedOptions.map_outer_filter === '' ? 0 : 200;
let wallEdgePath;
let tilesCanvas = createCanvas(640, 440);
let tilesCtx = tilesCanvas.getContext("2d", { willReadFrequently: true }); //tilesCanvas.getContext('2d');
let images = ['texture_ballskins', 'texture_floor1', 'texture_floor2', 'texture_floor3', 'texture_team', 'texture_walls1', 'texture_walls2', 'texture_endzone1', 'texture_endzone2', 'texture_base', 'texture_center'];
let images_urls = [];
let imageCache = {};
let groupSettingsReady = false;
let redTeamName; //for competitive logos
let blueTeamName;
tilesCtx.drawImage(tagpro.tiles.image, 0, 0);
tagpro.tiles.image = null; //so readyToDrawBackground() will return false. We'll put it back shortly.
tagpro.tiles.redball.draw = true; //so tagpro.tiles.draw will still return, but without erroring
tagpro.tiles.blueball.draw = true;
let vpEffect = GM_getValue('ViewportEffect', false);
let vpEffectTimeout = 0;
if (vpEffect === 'zoomfadein') { //Zoom & Fade In...
vpEffectTimeout = 600;
GM_addStyle('@keyframes PM_VP_Effect { ' +
' 0% { transform:scale(0.5); opacity:0; } ' +
' 100% { transform:scale(1); opacity:1; } ' +
'}');
GM_addStyle('.PM_Effect { animation:PM_VP_Effect ' + vpEffectTimeout + 'ms ease-in; }');
} else if (vpEffect === 'blur') { //Blur...
GM_addStyle('@keyframes PM_VP_Effect { ' +
' 0% { filter:blur(10px); } ' +
' 60% { filter:blur(10px); } ' +
'}');
GM_addStyle('.PM_Effect { animation:PM_VP_Effect 700ms ease-in; }');
} else if (vpEffect === 'expando') { //Expando...
vpEffectTimeout = 500;
GM_addStyle('@keyframes PM_VP_Effect { ' +
' 0% { transform:scaleX(0); margin 1s; } ' +
' 100% { transform:scaleX(1); margin 1s; } ' +
'}');
GM_addStyle('.PM_Effect { animation:PM_VP_Effect ' + vpEffectTimeout + 'ms ease-in; }');
} else if (vpEffect === 'spin') { //Spin...
vpEffectTimeout = 700;
GM_addStyle('@keyframes PM_VP_Effect { ' +
' 0% { transform:rotateY(180deg); } ' +
' 100% { transform:rotateY(360deg); } ' +
'}');
GM_addStyle('.PM_Effect { animation:PM_VP_Effect ' + vpEffectTimeout + 'ms cubic-bezier(0.4, 0, 0.2, 1); }');
} else if (vpEffect === 'invert') { //Invert...
GM_addStyle('@keyframes PM_VP_Effect { ' +
' 0% { filter:invert(100%); } ' +
' 100% { filter:none; } ' +
'}');
GM_addStyle('.PM_Effect { animation:PM_VP_Effect 600ms cubic-bezier(0.4, 0, 0.2, 1); }');
} else if (vpEffect === 'sepia') { //Bright Sepia...
GM_addStyle('@keyframes PM_VP_Effect { ' +
' 0% { filter:brightness(200%) sepia(100%); } ' +
' 100% { filter:none; } ' +
'}');
GM_addStyle('.PM_Effect { animation:PM_VP_Effect 800ms cubic-bezier(0.4, 0, 0.2, 1); }');
} else if (vpEffect === 'huerotate') { //Hue Rotate...
GM_addStyle('@keyframes PM_VP_Effect { ' +
' 0% { filter:hue-rotate(360deg); } ' +
' 100% { filter:none; } ' +
'}');
GM_addStyle('.PM_Effect { animation:PM_VP_Effect 1500ms cubic-bezier(0.4, 0, 0.2, 1); }');
}
let updateCSSBackground = function() {
if (savedOptions.background === 'value-linear' || savedOptions.background === 'value-radial' || savedOptions.background === 'value-conic') {
let colors = [];
if (savedOptions.background_color1 !== 'auto') colors.push({ color:savedOptions.background_color1, position:savedOptions.background_size1 || 0 });
if (savedOptions.background_color2 !== 'auto') colors.push({ color:savedOptions.background_color2, position:savedOptions.background_size2 || 0 });
if (savedOptions.background_color3 !== 'auto') colors.push({ color:savedOptions.background_color3, position:savedOptions.background_size3 || 0 });
if (savedOptions.background_color4 !== 'auto') colors.push({ color:savedOptions.background_color4, position:savedOptions.background_size4 || 0 });
if (savedOptions.background_color5 !== 'auto') colors.push({ color:savedOptions.background_color5, position:savedOptions.background_size5 || 0 });
let gradientString;
if (savedOptions.background === 'value-linear') gradientString = 'linear-gradient(' + savedOptions.background_angle + 'deg, ';
else if (savedOptions.background === 'value-radial') gradientString = 'radial-gradient(' + (savedOptions.background_angle === '0' ? 'circle' : 'ellipse') + ', ';
else if (savedOptions.background === 'value-conic') gradientString = 'conic-gradient(';
for (let i=0; i<colors.length; i++) {
gradientString += colors[i].color + ' ' + colors[i].position + (i !== colors.length - 1 ? '%, ' : '%)');
}
$('body').css('background', gradientString);
} else if (savedOptions.background === 'value-url') { //custom url
$('html').css({ 'height':'100%', 'overflow':'hidden' });
$('body.game-page').css({ 'background':'url("' + savedOptions.background_url + '") 100% 100% / cover no-repeat' });
} else if (defaultValues.background.hasOwnProperty(savedOptions.background) && defaultValues.background[savedOptions.background].url) { //preset image
$('html').css({ 'height':'100%', 'overflow':'hidden' });
$('body.game-page').css({ 'background':'url("' + defaultValues.background[savedOptions.background].url + '")', 'background-size':'cover' });
} else {
$('body').css('background', '');
}
};
let updateCSSViewport = function() {
if (!$('#viewport').length) {
setTimeout(updateCSSViewport, 89);
}
let vpCSS = {};
if (savedOptions.vpcss_border_size > 0) {
vpCSS['outline'] = savedOptions.vpcss_border_size + 'px ' + (savedOptions.vpcss_border_dashed ? ' dashed ' : ' solid ') + (savedOptions.vpcss_border_color === 'auto' ? defaultOptions.vpcss_border_color : savedOptions.vpcss_border_color);
}
if (savedOptions.vpcss_radius_border > 0) {
vpCSS['border-radius'] = savedOptions.vpcss_radius_border + 'px';
}
if (savedOptions.vpcss_shadow1_size > 0) {
vpCSS['box-shadow'] = (savedOptions.vpcss_shadow1_inset ? 'inset ' : '') + savedOptions.vpcss_shadow1_xoffset + 'px ' + savedOptions.vpcss_shadow1_yoffset + 'px ' + savedOptions.vpcss_shadow1_blur + 'px ' + savedOptions.vpcss_shadow1_size + 'px ' + (savedOptions.vpcss_shadow1_color === 'auto' ? defaultOptions.vpcss_shadow1_color : savedOptions.vpcss_shadow1_color);
}
if (savedOptions.vpcss_shadow2_size > 0) {
if (savedOptions.vpcss_shadow1_size > 0) {
vpCSS['box-shadow'] += ', ';
}
vpCSS['box-shadow'] += (savedOptions.vpcss_shadow2_inset ? 'inset ' : '') + savedOptions.vpcss_shadow2_xoffset + 'px ' + savedOptions.vpcss_shadow2_yoffset + 'px ' + savedOptions.vpcss_shadow2_blur + 'px ' + savedOptions.vpcss_shadow2_size + 'px ' + (savedOptions.vpcss_shadow2_color === 'auto' ? defaultOptions.vpcss_shadow2_color : savedOptions.vpcss_shadow2_color);
}
if (savedOptions.vpcss_padding_x > 0 || savedOptions.vpcss_padding_y > 0) {
vpCSS['padding'] = savedOptions.vpcss_padding_y + 'px ' + savedOptions.vpcss_padding_x + 'px';
}
if (Object.keys(vpCSS).length) {
$('#viewport').css(vpCSS);
}
tagpro.chat.resize();
};
let adjustDashForPerfectFit = function(radius, dashpattern, target='radius') {
if (target === 'radius') { //change radius so the dashes fit the circle perfectly (dashpattern unchanged)
let segments = dashpattern.split(',');
let sum = segments.reduce((a,b) => a + Number(b), 0);
let a = radius * Math.PI * 2;
let b = Math.floor(a / sum);
return sum * b / Math.PI / 2;
} else if (target === 'single') { //takes # segments and returns value for equal dash pattern (radius unchanged)
return radius * Math.PI / dashpattern; //dashpattern is # segments
} else if (target === 'first') { //change first segment size (e.g. 4,5 -> 4.424,5) to fit (radius unchanged)
let segments = dashpattern.split(',');
if (segments.length % 2 !== 0) segments = segments.concat(segments);
let sum = segments.reduce((a, b) => a + Number(b), 0);
let a = radius * Math.PI * 2;
let b = Math.round(a / sum);
segments[0] = a / b - segments[1];
return segments;
}
};
let floorCanvas, floorCtx;
let teamTileCanvas, teamTileCtx;
let endzoneCanvas, endzoneCtx;
let spikeCanvas, spikeCtx;
let wallCanvas, wallCtx;
let wallRawCanvas, wallRawCtx;
let extrasCanvas, extrasCtx;
let fwCanvas, fwCtx;
let gateCanvas, gateCtx;
let basicWallTilesCanvas, basicWallTilesCtx;
let initCanvases = function() {
floorCanvas = createCanvas(mapWidth, mapHeight);
floorCtx = floorCanvas.getContext('2d');
teamTileCanvas = createCanvas(mapWidth, mapHeight);
teamTileCtx = teamTileCanvas.getContext('2d');
endzoneCanvas = createCanvas(mapWidth, mapHeight);
endzoneCtx = endzoneCanvas.getContext('2d');
spikeCanvas = createCanvas(mapWidth, mapHeight);
spikeCtx = spikeCanvas.getContext('2d');
wallRawCanvas = createCanvas(mapWidth, mapHeight);
wallRawCtx = wallRawCanvas.getContext('2d');
wallCanvas = createCanvas(mapWidth, mapHeight, true); //needs to be DOM for SVG filter to work
wallCtx = wallCanvas.getContext('2d');
extrasCanvas = createCanvas(mapWidth, mapHeight);
extrasCtx = extrasCanvas.getContext('2d');
fwCanvas = createCanvas(mapWidth, mapHeight);
fwCtx = fwCanvas.getContext('2d');
gateCanvas = createCanvas(mapWidth, mapHeight);
gateCtx = gateCanvas.getContext('2d');
basicWallTilesCanvas = createCanvas(200, 40);
basicWallTilesCtx = basicWallTilesCanvas.getContext('2d');
};
let nullCanvases = function() {
floorCanvas.width = 0;
floorCanvas.height = 0;
floorCanvas = null;
floorCtx = null;
teamTileCanvas.width = 0;
teamTileCanvas.height = 0;
teamTileCanvas = null;
teamTileCtx = null;
endzoneCanvas.width = 0;
endzoneCanvas.height = 0;
endzoneCanvas = null;
endzoneCtx = null;
spikeCanvas.width = 0;
spikeCanvas.height = 0;
spikeCanvas = null;
spikeCtx = null;
wallRawCanvas.width = 0;
wallRawCanvas.height = 0;
wallRawCanvas = null;
wallRawCtx = null;
wallCanvas.width = 0;
wallCanvas.height = 0;
wallCanvas = null;
wallCtx = null;
extrasCanvas.width = 0;
extrasCanvas.height = 0;
extrasCanvas = null;
extrasCtx = null;
fwCanvas.width = 0;
fwCanvas.height = 0;
fwCanvas = null;
fwCtx = null;
gateCanvas.width = 0;
gateCanvas.height = 0;
gateCanvas = null;
gateCtx = null;
basicWallTilesCanvas.width = 0;
basicWallTilesCanvas.height = 0;
basicWallTilesCanvas = null;
basicWallTilesCtx = null;
for (let image in imageCache) {
imageCache[image] = null;
delete imageCache[image];
}
};
let tintCanvas = function(sourceCtx=tilesCanvas, sx=0, sy=0, sw=40, sh=40, color='#000000', useHardLight=false) {
let tempCanvas = createCanvas(sw, sh);
let tempCtx = tempCanvas.getContext('2d');
//create greyscale copy...
tempCtx.filter = 'saturate(0)';
tempCtx.drawImage(sourceCtx.canvas, sx, sy, sw, sh, 0, 0, sw, sh);
tempCtx.filter = 'none';
sourceCtx.clearRect(sx, sy, sw, sh);
sourceCtx.drawImage(tempCanvas, 0, 0, sw, sh, sx, sy, sw, sh);
//create solid color copy...
tempCtx.globalCompositeOperation = 'source-atop';
tempCtx.fillStyle = color;
tempCtx.fillRect(0, 0, sw, sh);
//draw colored on top of greyscale using either the 'hard-light' or 'color' gCO...
sourceCtx.globalCompositeOperation = useHardLight ? 'hard-light' : 'color';
sourceCtx.drawImage(tempCanvas, 0, 0, sw, sh, sx, sy, sw, sh);
sourceCtx.globalCompositeOperation = 'source-over';
tempCanvas = null;
tempCtx = null;
};
let averageTileColors = { floor:'#dddddd', floorAlt:'#444444', floorAlt2:'#888888', actualFloor:'#dddddd', actualFloorAlt:'#444444', redball:'#ff2020', blueball:'#0080ff', yellowflag:'#ffff00', redflag:'#ff0000', blueflag:'#0000ff', neutralgate:'#cccccc', greengate:'#40ff40', redgate:'#bb0000', bluegate:'#3164c7', yellowteam:'#ffff00', redteam:'#ff0000', blueteam:'#0000ff', redendzone:'#ff0000', blueendzone:'#0000ff', wall:'#444444', wallEdge:'#000000' };
let elementPositions = { redflag:[], blueflag:[], yellowflag:[], ezred:{locs:[], x:null, y:null}, ezblue:{locs:[], x:null, y:null}, teamred:[], teamblue:[], teamyellow:[], halfway:{x:null, y:null}, bombs:[], spikes:[], pups:[], boosts:{ yellow:[], red:[], blue:[] }, buttons:[], portals:[], portalsred:[], portalsblue:[], gates:[], gravityWells:[] };
let getAverageColors = function() {
//gets the "average" colors from the tiles texture...
let pixelData;
pixelData = tilesCtx.getImageData(525, 165, 10, 10).data; //floor
averageTileColors.floor = getAverageColor(pixelData, true, true, 1, true);
let floorColor = tinycolor(averageTileColors.floor);
let floorColor2 = floorColor.clone();
let floorColorBrightness = floorColor.getBrightness();
averageTileColors.floorColorBrightness = floorColorBrightness;
averageTileColors.floorAlt = floorColorBrightness > 30 ? floorColor.darken(60).toString() : floorColor.lighten(70).toString();
averageTileColors.floorAlt2 = floorColorBrightness < 60 ? floorColor2.lighten(50).toString() : floorColor2.darken(50).toString();
averageTileColors.floorAlt3 = floorColorBrightness < 128 ? '#ffffff' : '#000000';
averageTileColors.actualFloorAlt = averageTileColors.floorAlt;
averageTileColors.actualFloorAlt2 = floorColorBrightness < 80 ? '#000000' : '#ffffff';
pixelData = tilesCtx.getImageData(565, 5, 30, 30).data; //redball
averageTileColors.redball = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(605, 5, 30, 30).data; //blueball
averageTileColors.blueball = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(530, 50, 20, 10).data; //yellow flag
averageTileColors.yellowflag = getAverageColor(pixelData, true, false) || averageTileColors.yellowflag;
pixelData = tilesCtx.getImageData(570, 50, 20, 10).data; //red flag
averageTileColors.redflag = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(610, 50, 20, 10).data; //blue flag
averageTileColors.blueflag = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(530, 210, 20, 20).data; //yellow team
averageTileColors.yellowteam = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(570, 170, 20, 20).data; //red team
averageTileColors.redteam = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(610, 170, 20, 20).data; //blue team
averageTileColors.blueteam = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(570, 210, 20, 20).data; //red endzone
averageTileColors.redendzone = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(610, 210, 20, 20).data; //blue endzone
averageTileColors.blueendzone = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(510, 120, 10, 10).data; //neutral gate
averageTileColors.neutralgate = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(550, 120, 10, 10).data; //green gate
averageTileColors.greengate = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(590, 120, 10, 10).data; //red gate
averageTileColors.redgate = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(630, 120, 10, 10).data; //blue gate
averageTileColors.bluegate = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(495, 5, 10, 5).data; //spike
averageTileColors.spike = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(485, 165, 10, 10).data; //jj
averageTileColors.jj = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(485, 205, 10, 10).data; //rb
averageTileColors.rb = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(485, 245, 10, 10).data; //tp
averageTileColors.tp = getAverageColor(pixelData, true, true, 1, true);
pixelData = tilesCtx.getImageData(165, 125, 20, 20).data; //wall
averageTileColors.wall = getAverageColor(pixelData, true, true, 1, true);
//console.log('PM:: averageTileColors:', averageTileColors);
};
function modifyTilesImage() {
//directly modifies certain tiles on the tiles image before they're rendered.
let tempCanvas = createCanvas(40, 40, true);
let tempCtx = tempCanvas.getContext('2d');
let tempCanvas2 = createCanvas(40, 40);
let tempCtx2 = tempCanvas2.getContext('2d');
let clearTempCtx = function(ctx) {
ctx.globalAlpha = 1;
ctx.globalCompositeOperation = 'source-over';
ctx.strokeStyle = '#000000';
ctx.fillStyle = '#000000';
ctx.lineWidth = 1;
ctx.setLineDash([]);
ctx.filter = 'none';
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
};
let drawOutline = function(x, y, lineWidth, radius, color, opacity, dashpattern, blur, rotateAngle = 0, compositeOperation = 'source-over') {
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, x - 20, y - 20, 40, 40, 0, 0, 40, 40);
tempCtx.lineWidth = lineWidth;
tempCtx.strokeStyle = hexToRgbA(color, opacity);
Array.isArray(dashpattern) ? tempCtx.setLineDash(dashpattern) : tempCtx.setLineDash([dashpattern]);
tempCtx.globalCompositeOperation = compositeOperation;
if (blur) {
tempCtx.filter = 'blur(' + blur + 'px)';
}
if (blur === 2) {
color = '#000000';
tempCtx.filter += 'drop-shadow(0 0 1px ' + color + ') drop-shadow(0 0 2px ' + color + ')';
}
//radius = radius - lineWidth / 2;
tempCtx.save();
tempCtx.translate(tempCtx.canvas.width / 2, tempCtx.canvas.height / 2);
tempCtx.rotate(rotateAngle);
tempCtx.translate(-tempCtx.canvas.width / 2, -tempCtx.canvas.height / 2);
tempCtx.beginPath();
tempCtx.arc(20, 20, radius, 0, Math.PI * 2);
tempCtx.stroke();
tilesCtx.clearRect(x - 20, y - 20, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, x - 20, y - 20, 40, 40);
tempCtx.restore();
};
if (savedOptions.floortile_opacity < 1) {
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, 520, 160, 40, 40, 0, 0, 40, 40);
tilesCtx.clearRect(520, 160, 40, 40);
tilesCtx.globalAlpha = savedOptions.floortile_opacity;
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 520, 160, 40, 40);
tilesCtx.globalAlpha = 1;
}
if (savedOptions.balls_apply_red || savedOptions.balls_apply_blue) {
if (savedOptions.balls_plain) {
if (savedOptions.balls_apply_red) {
tilesCtx.clearRect(560, 0, 40, 40);
tilesCtx.fillStyle = hexToRgbA(savedOptions.balls_plain_color_red === 'auto' ? averageTileColors.redball : savedOptions.balls_plain_color_red, 1); //savedOptions.balls_opacity);
tilesCtx.beginPath();
tilesCtx.arc(580, 20, 19, 0, Math.PI * 2);
tilesCtx.fill();
}
if (savedOptions.balls_apply_blue) {
tilesCtx.clearRect(600, 0, 40, 40);
tilesCtx.fillStyle = hexToRgbA(savedOptions.balls_plain_color_blue === 'auto' ? averageTileColors.blueball : savedOptions.balls_plain_color_blue, 1);
tilesCtx.beginPath();
tilesCtx.arc(620, 20, 19, 0, Math.PI * 2);
tilesCtx.fill();
}
}
if (savedOptions.ball_gradient) {
let gradient;
if (savedOptions.balls_apply_red) {
let color1 = savedOptions.ball_gradient_color1_red === 'auto' ? averageTileColors.redball : savedOptions.ball_gradient_color1_red;
let color2 = savedOptions.ball_gradient_color2_red === 'auto' ? averageTileColors.redball : savedOptions.ball_gradient_color2_red;
clearTempCtx(tempCtx);
clearTempCtx(tempCtx2);
gradient = tempCtx.createLinearGradient(0, 0, 0, 80 * savedOptions.ball_gradient_position);
gradient.addColorStop(0, hexToRgbA(color1, savedOptions.ball_gradient_opacity1_red));
gradient.addColorStop(1, hexToRgbA(color1, 0));
tempCtx.fillStyle = gradient;
tempCtx.fillRect(0, 0, 40, 40);
tempCtx.globalCompositeOperation = 'multiply';
gradient = tempCtx.createLinearGradient(0, 0, 80 * savedOptions.ball_gradient_position, 0);
gradient.addColorStop(0, hexToRgbA(color2, 0));
gradient.addColorStop(1, hexToRgbA(color2, savedOptions.ball_gradient_opacity2_red));
tempCtx.fillStyle = gradient;
tempCtx.fillRect(0, 0, 40, 40);
gradient = tempCtx2.createLinearGradient(0, 0, 40, 40);
gradient.addColorStop(0, hexToRgbA(color1, 1));
gradient.addColorStop(1, hexToRgbA(color2, 1));
tempCtx2.fillStyle = gradient;
tempCtx2.fillRect(0, 0, 40, 40);
tempCtx2.globalCompositeOperation = 'hard-light';
tempCtx2.drawImage(tempCanvas, 0, 0);
tempCtx2.globalCompositeOperation = 'destination-in';
tempCtx2.drawImage(tilesCanvas, 560, 0, 40, 40, 0, 0, 40, 40);
//tilesCtx.clearRect(560, 0, 40, 40);
tilesCtx.globalCompositeOperation = 'hard-light';
tilesCtx.drawImage(tempCanvas2, 0, 0, 40, 40, 560, 0, 40, 40);
tilesCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.balls_apply_blue) {
let color1 = savedOptions.ball_gradient_color1_blue === 'auto' ? averageTileColors.blueball : savedOptions.ball_gradient_color1_blue;
let color2 = savedOptions.ball_gradient_color2_blue === 'auto' ? averageTileColors.blueball : savedOptions.ball_gradient_color2_blue;
clearTempCtx(tempCtx);
clearTempCtx(tempCtx2);
gradient = tempCtx.createLinearGradient(0, 0, 0, 80 * savedOptions.ball_gradient_position);
gradient.addColorStop(0, hexToRgbA(color1, savedOptions.ball_gradient_opacity1_blue));
gradient.addColorStop(1, hexToRgbA(color1, 0));
tempCtx.fillStyle = gradient;
tempCtx.fillRect(0, 0, 40, 40);
tempCtx.globalCompositeOperation = 'multiply';
gradient = tempCtx.createLinearGradient(0, 0, 80 * savedOptions.ball_gradient_position, 0);
gradient.addColorStop(0, hexToRgbA(color2, 0));
gradient.addColorStop(1, hexToRgbA(color2, savedOptions.ball_gradient_opacity2_blue));
tempCtx.fillStyle = gradient;
tempCtx.fillRect(0, 0, 40, 40);
gradient = tempCtx2.createLinearGradient(0, 0, 40, 40);
gradient.addColorStop(0, hexToRgbA(color1, 1));
gradient.addColorStop(1, hexToRgbA(color2, 1));
tempCtx2.fillStyle = gradient;
tempCtx2.fillRect(0, 0, 40, 40);
tempCtx2.globalCompositeOperation = 'hard-light';
tempCtx2.drawImage(tempCanvas, 0, 0);
tempCtx2.globalCompositeOperation = 'destination-in';
tempCtx2.drawImage(tilesCanvas, 600, 0, 40, 40, 0, 0, 40, 40);
tilesCtx.globalCompositeOperation = 'hard-light';
tilesCtx.drawImage(tempCanvas2, 0, 0, 40, 40, 600, 0, 40, 40);
tilesCtx.globalCompositeOperation = 'source-over';
}
}
if (savedOptions.balls_opacity < 1) {
if (savedOptions.balls_apply_red) {
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, 560, 0, 40, 40, 0, 0, 40, 40);
tilesCtx.clearRect(560, 0, 40, 40);
tilesCtx.globalAlpha = savedOptions.balls_opacity;
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 560, 0, 40, 40);
tilesCtx.globalAlpha = 1;
}
if (savedOptions.balls_apply_blue) {
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, 600, 0, 40, 40, 0, 0, 40, 40);
tilesCtx.clearRect(600, 0, 40, 40);
tilesCtx.globalAlpha = savedOptions.balls_opacity;
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 600, 0, 40, 40);
tilesCtx.globalAlpha = 1;
}
}
if (savedOptions.ball_outline1) {
let dashpattern = [];
if (savedOptions.ball_outline1_dashpattern) {
dashpattern = adjustDashForPerfectFit(savedOptions.ball_outline1_radius, savedOptions.ball_outline1_dashpattern, 'first');
}
if (savedOptions.balls_apply_red) {
drawOutline(580, 20, savedOptions.ball_outline1_linewidth, savedOptions.ball_outline1_radius, (savedOptions.ball_outline1_color_red === 'auto' ? averageTileColors.redball : savedOptions.ball_outline1_color_red), savedOptions.ball_outline1_opacity, dashpattern, false, savedOptions.ball_outline1_blur ? 1 : 0, savedOptions.ball_outline1_gco); //savedOptions.ball_outline1_destination_out ? 'destination-out' : 'source-over');
}
if (savedOptions.balls_apply_blue) {
drawOutline(620, 20, savedOptions.ball_outline1_linewidth, savedOptions.ball_outline1_radius, (savedOptions.ball_outline1_color_blue === 'auto' ? averageTileColors.blueball : savedOptions.ball_outline1_color_blue), savedOptions.ball_outline1_opacity, dashpattern, false, savedOptions.ball_outline1_blur ? 1 : 0, savedOptions.ball_outline1_gco); //savedOptions.ball_outline1_destination_out ? 'destination-out' : 'source-over');
}
}
if (savedOptions.ballskins) {
//redball...
if (savedOptions.balls_apply_red && savedOptions.ballskins_red_x >= 0 && savedOptions.ballskins_red_y >= 0) {
const newsize = Math.floor(48 * savedOptions.ballskins_scale_red);
const offset = (40 - newsize) / 2;
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, 560, 0, 40, 40, 0, 0, 40, 40);
tempCtx.globalCompositeOperation = savedOptions.ballskins_gco;
if (savedOptions.ballskins_filter_red) tempCtx.filter = savedOptions.ballskins_filter_red;
if (savedOptions.ballskins_opacity < 1) tempCtx.globalAlpha = savedOptions.ballskins_opacity;
if (savedOptions.ballskins_tint_red) {
clearTempCtx(tempCtx2);
tempCtx2.drawImage(imageCache[defaultValues.texture_ballskins['select-Skins'].url], savedOptions.ballskins_red_x, savedOptions.ballskins_red_y, 48, 48, offset, offset, newsize, newsize);
tintCanvas(tempCtx2, 0, 0, 40, 40, savedOptions.ballskins_tint_red_color === 'auto' ? averageTileColors.redball : savedOptions.ballskins_tint_red_color, savedOptions.ballskins_tint_red_hardlight);
tempCtx.drawImage(tempCanvas2, 0, 0, 40, 40);
} else {
tempCtx.drawImage(imageCache[defaultValues.texture_ballskins['select-Skins'].url], savedOptions.ballskins_red_x, savedOptions.ballskins_red_y, 48, 48, offset, offset, newsize, newsize);
}
tilesCtx.clearRect(560, 0, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 560, 0, 40, 40);
}
//blueball...
if (savedOptions.balls_apply_blue && savedOptions.ballskins_blue_x >= 0 && savedOptions.ballskins_blue_y >= 0) {
const newsize = Math.floor(48 * savedOptions.ballskins_scale_blue);
const offset = (40 - newsize) / 2;
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, 600, 0, 40, 40, 0, 0, 40, 40);
tempCtx.globalCompositeOperation = savedOptions.ballskins_gco;
if (savedOptions.ballskins_filter_blue) tempCtx.filter = savedOptions.ballskins_filter_blue;
if (savedOptions.ballskins_opacity < 1) tempCtx.globalAlpha = savedOptions.ballskins_opacity;
if (savedOptions.ballskins_tint_blue) {
clearTempCtx(tempCtx2);
tempCtx2.drawImage(imageCache[defaultValues.texture_ballskins['select-Skins'].url], savedOptions.ballskins_blue_x, savedOptions.ballskins_blue_y, 48, 48, offset, offset, newsize, newsize);
tintCanvas(tempCtx2, 0, 0, 40, 40, savedOptions.ballskins_tint_blue_color === 'auto' ? averageTileColors.blueball : savedOptions.ballskins_tint_blue_color, savedOptions.ballskins_tint_blue_hardlight);
tempCtx.drawImage(tempCanvas2, 0, 0, 40, 40);
} else {
tempCtx.drawImage(imageCache[defaultValues.texture_ballskins['select-Skins'].url], savedOptions.ballskins_blue_x, savedOptions.ballskins_blue_y, 48, 48, offset, offset, newsize, newsize);
}
tilesCtx.clearRect(600, 0, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 600, 0, 40, 40);
}
}
if (savedOptions.ball_outline2) {
let dashpattern = [];
if (savedOptions.ball_outline2_dashpattern) {
dashpattern = adjustDashForPerfectFit(savedOptions.ball_outline2_radius, savedOptions.ball_outline2_dashpattern, 'first');
}
if (savedOptions.balls_apply_red) {
drawOutline(580, 20, savedOptions.ball_outline2_linewidth, savedOptions.ball_outline2_radius, (savedOptions.ball_outline2_color_red === 'auto' ? averageTileColors.redball : savedOptions.ball_outline2_color_red), savedOptions.ball_outline2_opacity, dashpattern, savedOptions.ball_outline2_blur ? 1 : 0, 0, savedOptions.ball_outline2_gco); // savedOptions.ball_outline2_destination_out ? 'destination-out' : 'destination-over');
}
if (savedOptions.balls_apply_blue) {
drawOutline(620, 20, savedOptions.ball_outline2_linewidth, savedOptions.ball_outline2_radius, (savedOptions.ball_outline2_color_blue === 'auto' ? averageTileColors.blueball : savedOptions.ball_outline2_color_blue), savedOptions.ball_outline2_opacity, dashpattern, savedOptions.ball_outline2_blur ? 1 : 0, 0, savedOptions.ball_outline2_gco); // savedOptions.ball_outline2_destination_out ? 'destination-out' : 'source-over');
}
}
if (savedOptions.ball_star_red) {
let strokeColor = savedOptions.ball_star_red_stroke_opacity > 0 ? hexToRgbA(savedOptions.ball_star_red_stroke_color === 'auto' ? averageTileColors.redball : savedOptions.ball_star_red_stroke_color, savedOptions.ball_star_red_stroke_opacity) : false;
let fillColor = savedOptions.ball_star_red_fill_opacity > 0 ? hexToRgbA(savedOptions.ball_star_red_fill_color === 'auto' ? averageTileColors.blueball : savedOptions.ball_star_red_fill_color, savedOptions.ball_star_red_fill_opacity) : false;
clearTempCtx(tempCtx);
drawStar(tempCtx, 20, 20, savedOptions.ball_star_red_linewidth, strokeColor, fillColor, savedOptions.ball_star_red_isStar, savedOptions.ball_star_red_holeradius, savedOptions.ball_star_red_points, savedOptions.ball_star_red_outerradius, savedOptions.ball_star_red_innerradius);
if (savedOptions.ball_star_red_destination_out) tilesCtx.globalCompositeOperation = 'destination-out';
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 560, 0, 40, 40);
tilesCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.ball_star_blue) {
let strokeColor = savedOptions.ball_star_blue_stroke_opacity > 0 ? hexToRgbA(savedOptions.ball_star_blue_stroke_color === 'auto' ? averageTileColors.redball : savedOptions.ball_star_blue_stroke_color, savedOptions.ball_star_blue_stroke_opacity) : false;
let fillColor = savedOptions.ball_star_blue_fill_opacity > 0 ? hexToRgbA(savedOptions.ball_star_blue_fill_color === 'auto' ? averageTileColors.blueball : savedOptions.ball_star_blue_fill_color, savedOptions.ball_star_blue_fill_opacity) : false;
clearTempCtx(tempCtx);
drawStar(tempCtx, 20, 20, savedOptions.ball_star_blue_linewidth, strokeColor, fillColor, savedOptions.ball_star_blue_isStar, savedOptions.ball_star_blue_holeradius, savedOptions.ball_star_blue_points, savedOptions.ball_star_blue_outerradius, savedOptions.ball_star_blue_innerradius);
if (savedOptions.ball_star_blue_destination_out) tilesCtx.globalCompositeOperation = 'destination-out';
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 600, 0, 40, 40);
tilesCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.ball_outline3) {
let dashpattern = [];
if (savedOptions.ball_outline3_dashpattern) {
dashpattern = adjustDashForPerfectFit(savedOptions.ball_outline3_radius, savedOptions.ball_outline3_dashpattern, 'first');
}
if (savedOptions.balls_apply_red) {
drawOutline(580, 20, savedOptions.ball_outline3_linewidth, savedOptions.ball_outline3_radius, (savedOptions.ball_outline3_color_red === 'auto' ? averageTileColors.redball : savedOptions.ball_outline3_color_red), savedOptions.ball_outline3_opacity, dashpattern, savedOptions.ball_outline3_blur ? 2 : 0, 0, savedOptions.ball_outline3_gco); //savedOptions.ball_outline3_destination_out ? 'destination-out' : 'source-over');
}
if (savedOptions.balls_apply_blue) {
drawOutline(620, 20, savedOptions.ball_outline3_linewidth, savedOptions.ball_outline3_radius, (savedOptions.ball_outline3_color_blue === 'auto' ? averageTileColors.blueball : savedOptions.ball_outline3_color_blue), savedOptions.ball_outline3_opacity, dashpattern, savedOptions.ball_outline3_blur ? 2 : 0, 0, savedOptions.ball_outline3_gco); //savedOptions.ball_outline3_destination_out ? 'destination-out' : 'source-over');
}
}
if (savedOptions.ball_outline4) {
let dashpattern = [];
if (savedOptions.ball_outline4_dashpattern) {
dashpattern = adjustDashForPerfectFit(savedOptions.ball_outline4_radius, savedOptions.ball_outline4_dashpattern, 'first');
}
if (savedOptions.balls_apply_red) {
drawOutline(580, 20, savedOptions.ball_outline4_linewidth, savedOptions.ball_outline4_radius, (savedOptions.ball_outline4_color_red === 'auto' ? averageTileColors.redball : savedOptions.ball_outline4_color_red), savedOptions.ball_outline4_opacity, dashpattern, false, savedOptions.ball_outline4_blur ? 2 : 0, savedOptions.ball_outline4_gco); //savedOptions.ball_outline1_destination_out ? 'destination-out' : 'source-over');
}
if (savedOptions.balls_apply_blue) {
drawOutline(620, 20, savedOptions.ball_outline4_linewidth, savedOptions.ball_outline4_radius, (savedOptions.ball_outline4_color_blue === 'auto' ? averageTileColors.blueball : savedOptions.ball_outline4_color_blue), savedOptions.ball_outline4_opacity, dashpattern, false, savedOptions.ball_outline3_blur ? 2 : 0, savedOptions.ball_outline4_gco); //savedOptions.ball_outline1_destination_out ? 'destination-out' : 'source-over');
}
}
if (savedOptions.balls_clip_38px) {
if (savedOptions.balls_apply_red) {
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, 560, 0, 40, 40, 0, 0, 40, 40);
tempCtx.fillStyle = '#000000';
tempCtx.globalAlpha = 1;
tempCtx.globalCompositeOperation = 'destination-in';
tempCtx.beginPath();
tempCtx.arc(20, 20, 19, 0, Math.PI * 2);
tempCtx.fill();
tilesCtx.clearRect(560, 0, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 560, 0, 40, 40);
}
if (savedOptions.balls_apply_blue) {
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, 600, 0, 40, 40, 0, 0, 40, 40);
tempCtx.fillStyle = '#000000';
tempCtx.globalAlpha = 1;
tempCtx.globalCompositeOperation = 'destination-in';
tempCtx.beginPath();
tempCtx.arc(20, 20, 19, 0, Math.PI * 2);
tempCtx.fill();
tilesCtx.clearRect(600, 0, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 600, 0, 40, 40);
}
}
}
if (savedOptions.bombs_generic) {
tilesCtx.clearRect(480, 40, 40, 40);
tilesCtx.fillStyle = savedOptions.bombs_generic_color === 'auto' ? defaultOptions.bombs_generic_color : savedOptions.bombs_generic_color;
tilesCtx.beginPath();
tilesCtx.arc(500, 60, 15, 0, Math.PI * 2);
tilesCtx.fill();
} else if (savedOptions.bombs_tint && savedOptions.bombs_tint_color !== 'auto') {
tintCanvas(tilesCtx, 480, 40, 40, 40, savedOptions.bombs_tint_color);
}
if (savedOptions.bombs_clip_30px) {
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesCanvas, 480, 40, 40, 40, 0, 0, 40, 40);
tempCtx.fillStyle = '#000000';
tempCtx.globalAlpha = 1;
tempCtx.globalCompositeOperation = 'destination-in';
tempCtx.beginPath();
tempCtx.arc(20, 20, 15, 0, Math.PI * 2);
tempCtx.fill();
tilesCtx.clearRect(480, 40, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 480, 40, 40, 40);
}
if (savedOptions.bombs_filter) { // remove any "drop-shadow" filter here and apply it in drawCustomTiles() later...
let bombsFilter = savedOptions.bombs_filter;
let hasShadow;
if (bombsFilter !== '') {
let regexp = /drop-shadow\(.+?\)($|\s)/ig;
hasShadow = bombsFilter.match(regexp);
if (hasShadow) {
for (let i = 0; i < hasShadow.length; i++) {
bombsFilter = bombsFilter.replace(hasShadow[i], '').trim();
}
bombsFilter.trim();
}
}
if (bombsFilter) {
clearTempCtx(tempCtx);
tempCtx.drawImage(tilesImage, 480, 40, 40, 40, 0, 0, 40, 40);
tilesCtx.clearRect(480, 40, 40, 40);
tilesCtx.filter = bombsFilter;
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 480, 40, 40, 40);
tilesCtx.filter = 'none';
}
}
if (savedOptions.bombs_shine) {
let centerX = 500;
let centerY = 60;
let size = 10;
tilesCtx.globalCompositeOperation = 'source-atop';
tilesCtx.globalAlpha = 0.2;
tilesCtx.fillStyle = savedOptions.bombs_shine_color === 'auto' ? defaultOptions.bombs_shine_color : savedOptions.bombs_shine_color;
tilesCtx.filter = 'blur(1px)';
tilesCtx.beginPath();
tilesCtx.ellipse(centerX - 3, centerY - 6, size * 0.6, size * 1.0, Math.PI / 3, 0, Math.PI * 2);
tilesCtx.fill();
tilesCtx.globalAlpha = 0.75;
tilesCtx.filter = 'blur(2px)';
tilesCtx.beginPath();
tilesCtx.ellipse(centerX - 4, centerY - 8, size * 0.3, size * 0.5, Math.PI / 3, 0, Math.PI * 2);
tilesCtx.fill();
tilesCtx.filter = 'none';
tilesCtx.globalAlpha = 1;
tilesCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.bombs_fuse) {
tilesCtx.strokeStyle = savedOptions.bombs_fuse_color === 'auto' ? defaultOptions.bombs_fuse_color : savedOptions.bombs_fuse_color;
tilesCtx.lineWidth = 1.5;
tilesCtx.beginPath();
tilesCtx.moveTo(505, 47);
tilesCtx.quadraticCurveTo(505, 38, 511, 44);
tilesCtx.stroke();
}
if (savedOptions.bombs_outline1) {
let dashpattern = [];
if (savedOptions.bombs_outline1_segments > 0) {
dashpattern = adjustDashForPerfectFit(savedOptions.bombs_outline1_radius, savedOptions.bombs_outline1_segments, 'single');
}
let rotateAngle = savedOptions.bombs_outline1_segments % 2 === 0 ? Math.PI / savedOptions.bombs_outline1_segments / 2 : 0;
drawOutline(500, 60, savedOptions.bombs_outline1_linewidth, savedOptions.bombs_outline1_radius, (savedOptions.bombs_outline1_color === 'auto' ? defaultOptions.bombs_outline1_color : savedOptions.bombs_outline1_color), savedOptions.bombs_outline1_opacity, dashpattern, false, rotateAngle, savedOptions.bombs_outline1_gco); //savedOptions.bombs_outline1_destinationout ? 'destination-out' : 'source-over');
if (+savedOptions.bombs_draw_exploded_opacity === 0) {
tilesCtx.strokeStyle = hexToRgbA(savedOptions.bombs_outline1_color === 'auto' ? defaultOptions.bombs_outline1_color : savedOptions.bombs_outline1_color, 0.2); //exploded bomb
tilesCtx.beginPath();
tilesCtx.arc(500, 100, savedOptions.bombs_outline1_radius, 0, Math.PI * 2);
tilesCtx.stroke();
}
}
if (savedOptions.bombs_outline2) {
let dashpattern = [];
if (savedOptions.bombs_outline2_segments > 0) {
dashpattern = adjustDashForPerfectFit(savedOptions.bombs_outline2_radius, savedOptions.bombs_outline2_segments, 'single');
}
let rotateAngle = savedOptions.bombs_outline2_segments % 2 === 0 ? Math.PI / savedOptions.bombs_outline2_segments / 2 : 0;
drawOutline(500, 60, savedOptions.bombs_outline2_linewidth, savedOptions.bombs_outline2_radius, (savedOptions.bombs_outline2_color === 'auto' ? defaultOptions.bombs_outline2_color : savedOptions.bombs_outline2_color), savedOptions.bombs_outline2_opacity, dashpattern, false, rotateAngle, savedOptions.bombs_outline2_gco); //savedOptions.bombs_outline2_destinationout ? 'destination-out' : 'source-over');
if (+savedOptions.bombs_draw_exploded_opacity === 0) {
tilesCtx.strokeStyle = hexToRgbA(savedOptions.bombs_outline2_color === 'auto' ? defaultOptions.bombs_outline2_color : savedOptions.bombs_outline2_color, 0.2); //exploded bomb
tilesCtx.beginPath();
tilesCtx.arc(500, 100, savedOptions.bombs_outline2_radius, 0, Math.PI * 2);
tilesCtx.stroke();
}
}
if (savedOptions.bombs_draw_exploded_opacity > 0) {
tilesCtx.clearRect(480,80,40,40);
tilesCtx.globalAlpha = savedOptions.bombs_draw_exploded_opacity;
tilesCtx.drawImage(tilesCanvas, 480,40,40,40, 480,80,40,40);
tilesCtx.globalAlpha = 1;
}
if (savedOptions.gates_neutral_tile_opacity < 1 || savedOptions.gates_neutral_margin > 0 || savedOptions.gates_plain_neutral_base || savedOptions.gates_plain_neutral_pyramid || savedOptions.gates_plain_neutral_cross || savedOptions.gates_plain_neutral_cutout || savedOptions.gates_plain_neutral_square || savedOptions.gates_plain_neutral_detail || savedOptions.gates_plain_neutral_border) {
clearTempCtx(tempCtx);
if (savedOptions.gates_neutral_tile_opacity > 0) {
tempCtx.globalAlpha = savedOptions.gates_neutral_tile_opacity;
tempCtx.drawImage(tilesImage, 480, 120, 40, 40, 0, 0, 40, 40);
tempCtx.globalAlpha = 1;
}
if (savedOptions.gates_plain_neutral_base) {
let colour = savedOptions.gates_plain_neutral_base_neutral === 'auto' ? averageTileColors.neutralgate : savedOptions.gates_plain_neutral_base_neutral;
tempCtx.fillStyle = hexToRgbA(colour, savedOptions.gates_plain_neutral_base_opacity);
tempCtx.fillRect(0, 0, 40, 40);
}
if (savedOptions.gates_plain_neutral_gradient) {
const colour = savedOptions.gates_plain_neutral_gradient_color === 'auto' ? defaultOptions.gates_plain_neutral_gradient_color : savedOptions.gates_plain_neutral_gradient_color;
addGradientPattern(tempCtx, 40, 40, savedOptions.gates_plain_neutral_gradient_type, colour, savedOptions.gates_plain_neutral_gradient_opacity, savedOptions.gates_plain_neutral_gradient_size, savedOptions.gates_plain_neutral_gradient_gco);
}
if (savedOptions.gates_plain_neutral_pyramid || savedOptions.gates_plain_neutral_cross || savedOptions.gates_plain_neutral_cutout || savedOptions.gates_plain_neutral_square || savedOptions.gates_plain_neutral_detail || savedOptions.gates_plain_neutral_border) {
drawCustomGate(tempCtx, 'neutral', '_neutral');
}
if (savedOptions.gates_neutral_margin > 0) {
clearTempCtx(tempCtx2);
tempCtx2.drawImage(tempCanvas, 0, 0, 40, 40, +savedOptions.gates_neutral_margin, +savedOptions.gates_neutral_margin, 40 - savedOptions.gates_neutral_margin * 2, 40 - savedOptions.gates_neutral_margin * 2);
clearTempCtx(tempCtx);
tempCtx.drawImage(tempCanvas2, 0, 0);
}
if (savedOptions.gates_plain_neutral_border_40px) {
tempCtx.globalAlpha = 1;
tempCtx.beginPath();
tempCtx.lineWidth = savedOptions.gates_plain_neutral_border_linewidth;
tempCtx.strokeStyle = hexToRgbA(savedOptions.gates_plain_neutral_border_neutral === 'auto' ? averageTileColors.neutralgate : savedOptions.gates_plain_neutral_border_neutral, savedOptions.gates_plain_neutral_border_strokeOpacity);
tempCtx.rect(0, 0, 40, 40);
tempCtx.stroke();
}
tilesCtx.clearRect(480, 120, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 480, 120, 40, 40);
}
if (savedOptions.gates_grb_tile_opacity < 1 || savedOptions.gates_grb_margin > 0 || savedOptions.gates_plain_grb_base || savedOptions.gates_plain_grb_gradient || savedOptions.gates_plain_grb_pyramid || savedOptions.gates_plain_grb_cross || savedOptions.gates_plain_grb_roundedRect || savedOptions.gates_plain_grb_cutout || savedOptions.gates_plain_grb_square || savedOptions.gates_plain_grb_detail || savedOptions.gates_plain_grb_border) {
let colors = { green:520, red:560, blue:600 };
for (let color in colors) {
clearTempCtx(tempCtx);
if (savedOptions.gates_grb_tile_opacity > 0) {
tempCtx.globalAlpha = savedOptions.gates_grb_tile_opacity;
tempCtx.drawImage(tilesImage, colors[color], 120, 40, 40, 0, 0, 40, 40);
tempCtx.globalAlpha = 1;
}
if (savedOptions.gates_plain_grb_base) {
const colour = savedOptions['gates_plain_grb_base_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions['gates_plain_grb_base_' + color];
tempCtx.fillStyle = hexToRgbA(colour, savedOptions.gates_plain_grb_base_opacity);
tempCtx.fillRect(0, 0, 40, 40);
}
if (savedOptions.gates_plain_grb_gradient) {
const colour = savedOptions['gates_plain_grb_gradient_' + color] === 'auto' ? defaultOptions['gates_plain_grb_gradient_' + color] : savedOptions['gates_plain_grb_gradient_' + color];
addGradientPattern(tempCtx, 40, 40, savedOptions.gates_plain_grb_gradient_type, colour, savedOptions.gates_plain_grb_gradient_opacity, savedOptions.gates_plain_grb_gradient_size, savedOptions.gates_plain_grb_gradient_gco);
//addHighlight(tempCtx, colour, savedOptions.gates_plain_grb_gradient_opacity, 5, 2, 2, 2, savedOptions.gates_plain_grb_gradient_gco); //color, opacity, type, lineWidth, margin, blur, gco
//addHighlight(tempCtx, colour, savedOptions.gates_plain_grb_gradient_opacity, [7], 6, 3, 6, savedOptions.gates_plain_grb_gradient_gco); //color, opacity, type, lineWidth, margin, blur, gco
}
if (savedOptions.gates_plain_grb_pyramid || savedOptions.gates_plain_grb_cross || savedOptions.gates_plain_grb_roundedRect || savedOptions.gates_plain_grb_cutout || savedOptions.gates_plain_grb_square || savedOptions.gates_plain_grb_detail || savedOptions.gates_plain_grb_border) {
drawCustomGate(tempCtx, color, '_grb');
}
if (savedOptions.gates_grb_margin > 0) {
clearTempCtx(tempCtx2);
tempCtx2.drawImage(tempCanvas, 0, 0, 40, 40, +savedOptions.gates_grb_margin, +savedOptions.gates_grb_margin, 40 - savedOptions.gates_grb_margin * 2, 40 - savedOptions.gates_grb_margin * 2);
clearTempCtx(tempCtx);
tempCtx.drawImage(tempCanvas2, 0, 0);
}
if (savedOptions.gates_plain_grb_border_40px) {
tempCtx.globalAlpha = 1;
tempCtx.beginPath();
tempCtx.lineWidth = savedOptions.gates_plain_grb_border_linewidth;
tempCtx.strokeStyle = hexToRgbA(savedOptions['gates_plain_grb_border_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions['gates_plain_grb_border_' + color], savedOptions.gates_plain_grb_border_strokeOpacity);
tempCtx.rect(0, 0, 40, 40);
tempCtx.stroke();
}
tilesCtx.clearRect(colors[color], 120, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, colors[color], 120, 40, 40);
}
}
//buttons...
if (savedOptions.buttons_generic) {
tilesCtx.clearRect(520, 240, 40, 40);
if (savedOptions.buttons_generic_color_border !== 'auto') {
tilesCtx.fillStyle = savedOptions.buttons_generic_color_border === 'auto' ? defaultOptions.buttons_generic_color_border : savedOptions.buttons_generic_color_border;
if (savedOptions.buttons_generic_color_border_split) {
tilesCtx.globalAlpha = 0.35;
tilesCtx.beginPath();
tilesCtx.arc(540, 260, 7.5, 0, Math.PI);
tilesCtx.fill();
tilesCtx.globalAlpha = 1;
tilesCtx.beginPath();
tilesCtx.arc(540, 260, 7.5, Math.PI, 0);
tilesCtx.fill();
} else {
tilesCtx.globalAlpha = 1;
tilesCtx.beginPath();
tilesCtx.arc(540, 260, 7.5, 0, Math.PI * 2);
tilesCtx.fill();
}
if (savedOptions.buttons_border_segments_size > 0) {
tilesCtx.lineWidth = savedOptions.buttons_border_segments_size;
tilesCtx.strokeStyle = savedOptions.buttons_border_segments_color === 'auto' ? defaultOptions.buttons_border_segments_color : savedOptions.buttons_border_segments_color;
tilesCtx.globalAlpha = savedOptions.buttons_border_segments_opacity;
tilesCtx.beginPath();
tilesCtx.moveTo(533, 260);
tilesCtx.lineTo(547, 260);
tilesCtx.moveTo(540, 253);
tilesCtx.lineTo(540, 267);
tilesCtx.stroke();
tilesCtx.globalAlpha = 1;
}
}
if (savedOptions.buttons_generic_color_outer !== 'auto') { //middle
tilesCtx.fillStyle = savedOptions.buttons_generic_color_outer === 'auto' ? defaultOptions.buttons_generic_color_outer : savedOptions.buttons_generic_color_outer;
tilesCtx.beginPath();
tilesCtx.arc(540, 260, 5.5, 0, Math.PI * 2);
tilesCtx.fill();
}
if (savedOptions.buttons_generic_color_inner !== 'auto') {
tilesCtx.fillStyle = savedOptions.buttons_generic_color_inner === 'auto' ? defaultOptions.buttons_generic_color_inner : savedOptions.buttons_generic_color_inner;
tilesCtx.globalAlpha = 1;
tilesCtx.beginPath();
tilesCtx.arc(540, 260, 4, 0, Math.PI * 2);
tilesCtx.fill();
}
}
if (savedOptions.buttons_shine) {
tilesCtx.lineWidth = 1;
tilesCtx.strokeStyle = savedOptions.buttons_shine_color === 'auto' ? defaultOptions.buttons_shine_color : savedOptions.buttons_shine_color;
tilesCtx.filter = 'blur(1px)';
tilesCtx.globalAlpha = 0.65;
tilesCtx.beginPath();
tilesCtx.arc(538, 258, 2, 0, Math.PI * 2);
tilesCtx.stroke();
tilesCtx.globalAlpha = 0.85;
tilesCtx.beginPath();
tilesCtx.arc(538, 258, 1, 0, Math.PI * 2);
tilesCtx.stroke();
tilesCtx.globalAlpha = 1;
tilesCtx.filter = 'none';
}
//jj...
if (savedOptions.pups_generic_jj_fill || savedOptions.pups_generic_jj_stroke) {
clearTempCtx(tempCtx);
let strokeColor = savedOptions.pups_generic_jj_color_border === 'auto' ? averageTileColors.jj : savedOptions.pups_generic_jj_color_border; //'#a9e7e9'
let fillColor = savedOptions.pups_generic_jj_color_fill === 'auto' ? averageTileColors.jj : savedOptions.pups_generic_jj_color_fill; //'#3798b5'
if (savedOptions.pups_generic_jj_color_border === 'auto' && savedOptions.pups_generic_jj_color_fill === 'auto') {
let fillColor2 = tinycolor(averageTileColors.jj);
fillColor = fillColor2.getBrightness() > 40 ? fillColor2.darken(20).toString() : fillColor2.lighten(20).toString();
}
if (savedOptions.pups_generic_jj_fill) {
tempCtx.fillStyle = fillColor;
tempCtx.beginPath();
tempCtx.arc(20, 20, 15, 0, 2*Math.PI);
tempCtx.fill();
}
if (savedOptions.pups_generic_jj_stroke) {
tempCtx.strokeStyle = strokeColor;
tempCtx.lineWidth = 3;
tempCtx.beginPath();
tempCtx.arc(20, 20, 14, 0, 2*Math.PI);
tempCtx.closePath();
tempCtx.stroke();
}
//triangles...
tempCtx.fillStyle = strokeColor;
tempCtx.strokeStyle = strokeColor;
tempCtx.lineWidth = 1;
for (let i=0; i<3; i++) {
tempCtx.beginPath();
tempCtx.moveTo(i * 8 + 9, 18);
tempCtx.lineTo(i * 8 + 15, 18);
tempCtx.lineTo(i * 8 + 12, 23);
tempCtx.closePath();
if (savedOptions.pups_generic_jj_shadow) tempCtx.filter = 'drop-shadow(1px 1px 1px rgba(0,0,0,0.85))';
if (savedOptions.pups_generic_jj_fill) tempCtx.fill();
tempCtx.filter = 'none';
if (savedOptions.pups_generic_jj_stroke) tempCtx.stroke();
}
tilesCtx.clearRect(480, 160, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 480, 160, 40, 40);
}
//rb...
if (savedOptions.pups_generic_rb_fill || savedOptions.pups_generic_rb_stroke) {
clearTempCtx(tempCtx);
let strokeColor = savedOptions.pups_generic_rb_color_border === 'auto' ? averageTileColors.rb : savedOptions.pups_generic_rb_color_border; //'#e98e2b'
let fillColor = savedOptions.pups_generic_rb_color_fill === 'auto' ? averageTileColors.rb : savedOptions.pups_generic_rb_color_fill; //'#e9d65e'
if (savedOptions.pups_generic_rb_color_border === 'auto' && savedOptions.pups_generic_rb_color_fill === 'auto') {
let fillColor2 = tinycolor(averageTileColors.rb);
fillColor = fillColor2.getBrightness() > 40 ? fillColor2.darken(20).toString() : fillColor2.lighten(20).toString();
}
if (savedOptions.pups_generic_rb_fill) {
tempCtx.fillStyle = fillColor;
tempCtx.beginPath();
tempCtx.arc(20, 20, 15, 0, 2*Math.PI);
tempCtx.fill();
}
if (savedOptions.pups_generic_rb_stroke) {
tempCtx.strokeStyle = strokeColor;
tempCtx.lineWidth = 3;
tempCtx.beginPath();
tempCtx.arc(20, 20, 14, 0, 2*Math.PI);
tempCtx.stroke();
}
tempCtx.fillStyle = fillColor;
tempCtx.strokeStyle = strokeColor;
tempCtx.lineWidth = 1;
//bang shape...
tempCtx.beginPath();
tempCtx.moveTo(17, 12);
tempCtx.lineTo(21, 16);
tempCtx.lineTo(25, 12);
tempCtx.lineTo(23, 17);
tempCtx.lineTo(27, 18);
tempCtx.lineTo(24, 20);
tempCtx.lineTo(28, 27);
tempCtx.lineTo(22, 22);
tempCtx.lineTo(19, 27);
tempCtx.lineTo(17, 23);
tempCtx.lineTo(13, 26);
tempCtx.lineTo(16, 21);
tempCtx.lineTo(10, 15);
tempCtx.lineTo(17, 17);
tempCtx.lineTo(17, 12);
tempCtx.closePath();
tempCtx.fill();
if (savedOptions.pups_generic_rb_shadow) tempCtx.filter = 'drop-shadow(1px 1px 1px rgba(0,0,0,0.85))';
tempCtx.stroke();
tempCtx.filter = 'none';
tilesCtx.clearRect(480, 200, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 480, 200, 40, 40);
}
//tp...
if (savedOptions.pups_generic_tp_fill || savedOptions.pups_generic_tp_stroke) {
clearTempCtx(tempCtx);
let strokeColor = savedOptions.pups_generic_tp_color_border === 'auto' ? averageTileColors.tp : savedOptions.pups_generic_tp_color_border; //'#19831b'
let fillColor = savedOptions.pups_generic_tp_color_fill === 'auto' ? averageTileColors.tp : savedOptions.pups_generic_tp_color_fill; //'#07ee00'
if (savedOptions.pups_generic_tp_color_border === 'auto' && savedOptions.pups_generic_tp_color_fill === 'auto') {
let fillColor2 = tinycolor(averageTileColors.tp);
fillColor = fillColor2.getBrightness() > 40 ? fillColor2.darken(10).toString() : fillColor2.lighten(10).toString();
}
if (savedOptions.pups_generic_tp_fill) {
tempCtx.fillStyle = fillColor;
tempCtx.beginPath();
tempCtx.arc(20, 20, 15, 0, 2*Math.PI);
tempCtx.fill();
}
if (savedOptions.pups_generic_tp_stroke) {
tempCtx.strokeStyle = strokeColor;
tempCtx.lineWidth = 3;
tempCtx.beginPath();
tempCtx.arc(20, 20, 14, 0, 2*Math.PI);
tempCtx.closePath();
tempCtx.stroke();
}
tempCtx.fillStyle = fillColor;
tempCtx.strokeStyle = strokeColor;
tempCtx.lineWidth = 2;
//circle...
tempCtx.beginPath();
tempCtx.arc(20, 20, 8, 0, 2*Math.PI);
tempCtx.closePath();
if (savedOptions.pups_generic_tp_shadow) tempCtx.filter = 'drop-shadow(1px 1px 2px rgba(0,0,0,0.75))';
tempCtx.stroke();
tempCtx.filter = 'none';
tilesCtx.clearRect(480, 240, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 480, 240, 40, 40);
}
//pup shine...
if (savedOptions.pups_add_shine) {
let pups = { jj:160, rb:200, tp:240 };
for (let pup in pups) {
tilesCtx.globalCompositeOperation = 'source-atop';
tilesCtx.globalAlpha = 0.2;
tilesCtx.fillStyle = '#ffffff';
tilesCtx.filter = 'blur(1px)';
tilesCtx.beginPath();
tilesCtx.ellipse(480 + 13, pups[pup] + 11, 3, 6, Math.PI / 3, 0, Math.PI * 2);
tilesCtx.fill();
tilesCtx.globalAlpha = 0.65;
tilesCtx.filter = 'blur(2px)';
tilesCtx.beginPath();
tilesCtx.ellipse(480 + 14, pups[pup] + 12, 2, 3, Math.PI / 3, 0, Math.PI * 2);
tilesCtx.fill();
tilesCtx.filter = 'none';
tilesCtx.globalAlpha = 1;
tilesCtx.globalCompositeOperation = 'source-over';
}
}
//top speed?
//empty pup...
if (savedOptions.pups_generic_empty_fill || savedOptions.pups_generic_empty_stroke) {
clearTempCtx(tempCtx);
let strokeColor = savedOptions.pups_generic_empty_color_border === 'auto' ? '#777777' : savedOptions.pups_generic_empty_color_border;
let fillColor = savedOptions.pups_generic_empty_color_text === 'auto' ? '#555555' : savedOptions.pups_generic_empty_color_text;
if (savedOptions.pups_generic_empty_fill) {
tempCtx.fillStyle = fillColor;
tempCtx.beginPath();
tempCtx.arc(20, 20, 15, 0, 2*Math.PI);
tempCtx.fill();
}
if (savedOptions.pups_generic_empty_stroke) {
tempCtx.strokeStyle = strokeColor;
tempCtx.lineWidth = 3;
tempCtx.beginPath();
tempCtx.arc(20, 20, 14, 0, 2*Math.PI);
tempCtx.closePath();
tempCtx.stroke();
}
//'?'
if (savedOptions.pups_generic_empty_shadow) tempCtx.filter = 'drop-shadow(1px 1px 1px rgba(0,0,0,0.75))';
tempCtx.font = 'Normal 18px Arial';
tempCtx.fillStyle = strokeColor;
tempCtx.textAlign = 'center';
tempCtx.fillText('?', 20, 26);
tempCtx.filter = 'none';
tilesCtx.clearRect(480, 320, 40, 40);
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, 480, 320, 40, 40);
}
if (savedOptions.flags_generic_fill || savedOptions.flags_generic_stroke) {
let colors = { yellow:520, red:560, blue:600 };
tilesCtx.clearRect(520, 40, 120, 40);
for (let color in colors) {
const fill_color = savedOptions['flags_generic_fill_' + color] === 'auto' ? averageTileColors[color + 'flag'] : savedOptions['flags_generic_fill_' + color];
const stroke_color = savedOptions['flags_generic_stroke_' + color] === 'auto' ? fill_color : savedOptions['flags_generic_stroke_' + color]; //averageTileColors.actualFloorAlt2
clearTempCtx(tempCtx);
tempCtx.fillStyle = fill_color;
tempCtx.strokeStyle = stroke_color;
tempCtx.lineWidth = 1;
//flag...
tempCtx.beginPath();
tempCtx.moveTo(10, 5);
tempCtx.lineTo(37, 17);
tempCtx.lineTo(7, 28);
tempCtx.lineTo(13, 17);
tempCtx.closePath();
if (savedOptions.flags_generic_fill) tempCtx.fill();
if (savedOptions.flags_generic_gradient) {
let gradient_color = savedOptions['flags_generic_gradient_' + color];
if (gradient_color === 'auto') {
let gradient_color_alt = tinycolor(averageTileColors[color + 'flag']);
gradient_color = gradient_color_alt.getBrightness() > 40 ? gradient_color_alt.darken(20).toString() : gradient_color_alt.lighten(20).toString();
}
addGradientPattern(tempCtx, 40, 40, 'value-hstripes', gradient_color, savedOptions.flags_generic_gradient_opacity, 8);
}
if (savedOptions.flags_generic_stroke) tempCtx.stroke();
//pole...
if (savedOptions.flags_generic_pole_linewidth > 0) {
tempCtx.strokeStyle = savedOptions.flags_generic_pole_color === 'auto' ? averageTileColors.actualFloorAlt2 : savedOptions.flags_generic_pole_color;
tempCtx.lineWidth = savedOptions.flags_generic_pole_linewidth;
tempCtx.globalCompositeOperation = 'destination-over';
tempCtx.beginPath();
tempCtx.moveTo(13, 5);
tempCtx.lineTo(9, 36);
tempCtx.closePath();
tempCtx.stroke();
tempCtx.globalCompositeOperation = 'source-over';
}
tilesCtx.drawImage(tempCanvas, 0, 0, 40, 40, colors[color], 40, 40, 40);
}
if (savedOptions.flags_draw_taken_opacity === 0) savedOptions.flags_draw_taken_opacity = 0.2;
}
if (savedOptions.flags_draw_taken_opacity > 0) {
tilesCtx.clearRect(520,80,120,40);
tilesCtx.globalAlpha = savedOptions.flags_draw_taken_opacity;
tilesCtx.drawImage(tilesCanvas, 520,40,120,40, 520,80,120,40);
tilesCtx.globalAlpha = 1;
}
if (savedOptions.flags_outline) {
let lineWidth = savedOptions.flags_outline_linewidth;
let radius = 15 - lineWidth / 2;
let dashsize = adjustDashForPerfectFit(radius, savedOptions.flags_outline_segments, 'single');
tilesCtx.lineWidth = lineWidth;
if (savedOptions.flags_outline_segments > 0) tilesCtx.setLineDash([dashsize]);
else tilesCtx.setLineDash([]);
for (let i = 0; i <= 2; i++) {
tilesCtx.strokeStyle = savedOptions.flags_outline_color === 'auto' ? '#ffffff' : savedOptions.flags_outline_color;
tilesCtx.globalAlpha = savedOptions.flags_outline_opacity;
tilesCtx.beginPath();
tilesCtx.arc(540 + i * 40, 60, radius, 0, Math.PI * 2);
tilesCtx.stroke();
tilesCtx.globalAlpha = savedOptions.flags_outline_taken_opacity;
tilesCtx.beginPath();
tilesCtx.arc(540 + i * 40, 100, radius, 0, Math.PI * 2);
tilesCtx.stroke();
}
tilesCtx.globalAlpha = 1;
tilesCtx.setLineDash([]);
}
//tints...
if (!savedOptions.plainwalls && savedOptions.plainwalls_color_use && savedOptions.plainwalls_color !== 'auto') {
tintCanvas(tilesCtx, 0, 0, 480, 440, savedOptions.plainwalls_color, savedOptions.plainwalls_hardlight);
}
if (savedOptions.pups_tint_jj && savedOptions.pups_tint_jj_color !== 'auto') {
tintCanvas(tilesCtx, 480, 160, 40, 40, savedOptions.pups_tint_jj_color);
}
if (savedOptions.pups_tint_rb && savedOptions.pups_tint_rb_color !== 'auto') {
tintCanvas(tilesCtx, 480, 200, 40, 40, savedOptions.pups_tint_rb_color);
}
if (savedOptions.pups_tint_tp && savedOptions.pups_tint_tp_color !== 'auto') {
tintCanvas(tilesCtx, 480, 240, 40, 40, savedOptions.pups_tint_tp_color);
}
if (savedOptions.spikes_tint && savedOptions.spikes_tint_color !== 'auto') {
tintCanvas(tilesCtx, 480, 0, 40, 40, savedOptions.spikes_tint_color);
}
tempCanvas.width = 0;
tempCanvas.height = 0;
tempCanvas = null;
tempCtx = null;
tempCanvas2.width = 0;
tempCanvas2.height = 0;
tempCanvas2 = null;
tempCtx2 = null;
tilesCtx.globalCompositeOperation = 'source-over';
return tilesCanvas;
}
let PM_Loading = $('<div id="PM_Loading" style="position:absolute; width:100%; text-align:center; margin:0 auto; top:460px; font-size:20px; font-style:italic; color:#fff;">Modding Textures...</div>');
$('#sound').after(PM_Loading);
async function loadImages(imageUrlArray) {
//from: https://stackoverflow.com/questions/37854355/wait-for-image-loading-to-complete-in-javascript
const promiseArray = [];
for (let url of imageUrlArray) {
promiseArray.push(new Promise((resolve, reject) => {
imageCache[url] = new Image();
imageCache[url].onload = function() {
resolve();
};
imageCache[url].onerror = function() {
reject();
};
imageCache[url].crossOrigin = 'Anonymous';
imageCache[url].src = url;
}));
}
await Promise.allSettled(promiseArray).then((results) => {
results.forEach((result) => {
//console.log(result);
})
}).catch(error => {
console.error(`An unknown error has occurred in loadImages(): ${error}`);
});
return promiseArray;
}
let getLogoFromGroupNames = function(teamName) {
for (let value in defaultValues.texture_logo_red) {
if (value.endsWith(teamName)) return value;
}
};
let reverseFloorFilterHueValue = function() {
//reverse any hue-rotate filter value on the floor so the logo colors are drawn correctly...
let pos = savedOptions.floor_filter.indexOf('hue-rotate(') + 11;
if (pos >= 0) {
let pos2 = savedOptions.floor_filter.indexOf('deg)');
let value = savedOptions.floor_filter.substr(pos, pos2 - pos);
let newValue = ' hue-rotate(' + (value * -1) + 'deg)';
savedOptions.texture_logo_red_filter += newValue;
savedOptions.texture_logo_blue_filter += newValue;
//savedOptions.texture_base_filter += newValue;
}
}
let startCounter1 = 0;
let cacheTextures = function() {
if (savedOptions.texture_logo_automatic) { //wait for team names from group, then lookup the name and set the corresponding image url before we call loadImages()
if (tagpro.group && tagpro.group.socket !== null && !groupSettingsReady) {
startCounter1++;
if (startCounter1 < 50) {
setTimeout(cacheTextures, 20);
return false;
}
}
if (tagpro.group && tagpro.group.socket !== null && tagpro.group.socket.connected) {
if (redTeamName && redTeamName !== 'Red') {
let value = getLogoFromGroupNames(redTeamName);
if (value) {
savedOptions.texture_logo_red = value;
savedOptions.texture_logo_red_filter = defaultValues.texture_logo_red[value].filter;
savedOptions.texture_logo_red_size = defaultValues.texture_logo_red[value].size;
savedOptions.texture_logo_red_xOffset = defaultValues.texture_logo_red[value].xOffset;
savedOptions.texture_logo_red_yOffset = defaultValues.texture_logo_red[value].yOffset;
}
images.push('texture_logo_red');
}
if (blueTeamName && blueTeamName !== 'Blue') {
let value = getLogoFromGroupNames(blueTeamName);
if (value) {
savedOptions.texture_logo_blue = value;
savedOptions.texture_logo_blue_filter = defaultValues.texture_logo_blue[value].filter;
savedOptions.texture_logo_blue_size = defaultValues.texture_logo_blue[value].size;
savedOptions.texture_logo_blue_xOffset = defaultValues.texture_logo_blue[value].xOffset;
savedOptions.texture_logo_blue_yOffset = defaultValues.texture_logo_blue[value].yOffset;
}
images.push('texture_logo_blue');
}
reverseFloorFilterHueValue();
}
} else {
if (savedOptions.texture_logo_random) {
let keys = Object.keys(defaultValues.texture_logo_red);
let randomKeyRed = getRandomInt(0, keys.length - 1);
savedOptions.texture_logo_red = keys[randomKeyRed];
savedOptions.texture_logo_red_filter = defaultValues.texture_logo_red[keys[randomKeyRed]].filter;
savedOptions.texture_logo_red_size = defaultValues.texture_logo_red[keys[randomKeyRed]].size;
savedOptions.texture_logo_red_xOffset = defaultValues.texture_logo_red[keys[randomKeyRed]].xOffset;
savedOptions.texture_logo_red_yOffset = defaultValues.texture_logo_red[keys[randomKeyRed]].yOffset;
let randomKeyBlue;
do { //no duplicates
randomKeyBlue = getRandomInt(0, keys.length - 1);
} while (randomKeyRed === randomKeyBlue);
savedOptions.texture_logo_blue = keys[randomKeyBlue];
savedOptions.texture_logo_blue_filter = defaultValues.texture_logo_blue[keys[randomKeyBlue]].filter;
savedOptions.texture_logo_blue_size = defaultValues.texture_logo_blue[keys[randomKeyBlue]].size;
savedOptions.texture_logo_blue_xOffset = defaultValues.texture_logo_blue[keys[randomKeyBlue]].xOffset;
savedOptions.texture_logo_blue_yOffset = defaultValues.texture_logo_blue[keys[randomKeyBlue]].yOffset;
}
reverseFloorFilterHueValue();
images.push('texture_logo_red', 'texture_logo_blue');
}
for (const value of images) {
if (savedOptions[value] !== 'select-none' && defaultValues[value].hasOwnProperty(savedOptions[value])) {
images_urls.push(defaultValues[value][savedOptions[value]].url);
}
}
getAverageColors(); //we need to do this before modifyTilesImage() is called
if (!savedOptions.ballskins) { //If we're not using ballskins we can modify the tiles a bit earlier.
tilesImage = modifyTilesImage();
getAverageColors(); //and also after
}
loadImages(images_urls).then((promiseArray) => {
if (savedOptions.ballskins) {
tilesImage = modifyTilesImage();
getAverageColors();
}
//this draws the tiles.png to screen so it can be viewed/saved...
if (defaultValues.showPNGsInGame) {
let testCanvas = document.createElement('canvas');
testCanvas.width = 640;
testCanvas.height = 440;
let testCtx = testCanvas.getContext("2d");
testCtx.drawImage(tilesImage, 0, 0);
testCanvas.style.display = 'block';
$('body').append(testCanvas);
}
}).catch(error => {
console.error(`PM:: loadImages() An unknown error has occurred: ${error}`);
}).finally(() => {
tagpro.tiles.image = tilesImage; //put things back to normal
delete tagpro.tiles.redball.draw;
delete tagpro.tiles.blueball.draw;
});
};
cacheTextures();
let createBasicWallTiles = function() {
basicWallTilesCtx.fillRect(0, 0, 40, 40); //■
basicWallTilesCtx.beginPath(); //◣
basicWallTilesCtx.moveTo(40, 0);
basicWallTilesCtx.lineTo(80, 40);
basicWallTilesCtx.lineTo(40, 40);
basicWallTilesCtx.lineTo(40, 0);
basicWallTilesCtx.fill();
basicWallTilesCtx.beginPath(); //◤
basicWallTilesCtx.moveTo(80, 0);
basicWallTilesCtx.lineTo(120, 0);
basicWallTilesCtx.lineTo(80, 40);
basicWallTilesCtx.lineTo(80, 0);
basicWallTilesCtx.fill();
basicWallTilesCtx.beginPath(); //◥
basicWallTilesCtx.moveTo(120, 0);
basicWallTilesCtx.lineTo(160, 0);
basicWallTilesCtx.lineTo(160, 40);
basicWallTilesCtx.lineTo(120, 0);
basicWallTilesCtx.fill();
basicWallTilesCtx.beginPath(); //◢
basicWallTilesCtx.moveTo(200, 0);
basicWallTilesCtx.lineTo(200, 40);
basicWallTilesCtx.lineTo(160, 40);
basicWallTilesCtx.lineTo(200, 0);
basicWallTilesCtx.fill();
};
let makeWallEdgePath = function() {
wallEdgePath = new Path2D();
for (let x=0; x<tagpro.map.length; x++) {
for (let y=0; y<tagpro.map[0].length; y++) {
let mapTileId = Math.floor(tagpro.map[x][y]);
if (mapTileId === 1) {
let x40 = x * 40;
let y40 = y * 40;
let x40p40 = x * 40 + 40;
let y40p40 = y * 40 + 40;
if (tagpro.map[x][y] === 1) { //square ■
if (x === 0 || Math.floor(tagpro.map[x-1][y]) !== 1 || tagpro.map[x-1][y] === 1.1 || tagpro.map[x-1][y] === 1.2) { //left edge
wallEdgePath.moveTo(x40, y40);
wallEdgePath.lineTo(x40, y40p40);
}
if (y === 0 || Math.floor(tagpro.map[x][y-1]) !== 1 || tagpro.map[x][y-1] === 1.2 || tagpro.map[x][y-1] === 1.3) { //top edge
wallEdgePath.moveTo(x40, y40);
wallEdgePath.lineTo(x40p40, y40);
}
if (x === tagpro.map.length-1 || Math.floor(tagpro.map[x+1][y]) !== 1 || tagpro.map[x+1][y] === 1.3 || tagpro.map[x+1][y] === 1.4) { //right edge
wallEdgePath.moveTo(x40p40, y40);
wallEdgePath.lineTo(x40p40, y40p40);
}
if (y === tagpro.map[0].length-1 || Math.floor(tagpro.map[x][y+1]) !== 1 || tagpro.map[x][y+1] === 1.1 || tagpro.map[x][y+1] === 1.4) { //bottom edge
wallEdgePath.moveTo(x40p40, y40p40);
wallEdgePath.lineTo(x40, y40p40);
}
} else if (tagpro.map[x][y] === 1.1) { //90° corner = SW ◣
if (x === 0 || Math.floor(tagpro.map[x-1][y]) !== 1 || tagpro.map[x-1][y] === 1.1 || tagpro.map[x-1][y] === 1.2) { //left edge
wallEdgePath.moveTo(x40, y40);
wallEdgePath.lineTo(x40, y40p40);
}
if (y === tagpro.map[0].length-1 || Math.floor(tagpro.map[x][y+1]) !== 1 || tagpro.map[x][y+1] === 1.1 || tagpro.map[x][y+1] === 1.4) { //bottom edge
wallEdgePath.moveTo(x40, y40p40);
wallEdgePath.lineTo(x40p40, y40p40);
}
wallEdgePath.moveTo(x40p40, y40p40); //diagonal
wallEdgePath.lineTo(x40, y40);
} else if (tagpro.map[x][y] === 1.2) { //90° corner = NW ◤
if (x === 0 || Math.floor(tagpro.map[x-1][y]) !== 1 || tagpro.map[x-1][y] === 1.1 || tagpro.map[x-1][y] === 1.2) { //left edge
wallEdgePath.moveTo(x40, y40);
wallEdgePath.lineTo(x40, y40p40);
}
if (y === 0 || Math.floor(tagpro.map[x][y-1]) !== 1 || tagpro.map[x][y-1] === 1.2 || tagpro.map[x][y-1] === 1.3) { //top edge
wallEdgePath.moveTo(x40, y40);
wallEdgePath.lineTo(x40p40, y40);
}
wallEdgePath.moveTo(x40p40, y40); //diagonal
wallEdgePath.lineTo(x40, y40p40);
} else if (tagpro.map[x][y] === 1.3) { //90° corner = NE ◥
if (x === tagpro.map.length-1 || Math.floor(tagpro.map[x+1][y]) !== 1 || tagpro.map[x+1][y] === 1.3 || tagpro.map[x+1][y] === 1.4) { //right edge
wallEdgePath.moveTo(x40p40, y40);
wallEdgePath.lineTo(x40p40, y40p40);
}
if (y === 0 || Math.floor(tagpro.map[x][y-1]) !== 1 || tagpro.map[x][y-1] === 1.2 || tagpro.map[x][y-1] === 1.3) { //top edge
wallEdgePath.moveTo(x40, y40);
wallEdgePath.lineTo(x40p40, y40);
}
wallEdgePath.moveTo(x40p40, y40p40); //diagonal
wallEdgePath.lineTo(x40, y40);
} else if (tagpro.map[x][y] === 1.4) { //90° corner = SE ◢
if (x === tagpro.map.length-1 || Math.floor(tagpro.map[x+1][y]) !== 1 || tagpro.map[x+1][y] === 1.3 || tagpro.map[x+1][y] === 1.4) { //right edge
wallEdgePath.moveTo(x40p40, y40);
wallEdgePath.lineTo(x40p40, y40p40);
}
if (y === tagpro.map[0].length-1 || Math.floor(tagpro.map[x][y+1]) !== 1 || tagpro.map[x][y+1] === 1.1 || tagpro.map[x][y+1] === 1.4) { //bottom edge
wallEdgePath.moveTo(x40p40, y40p40);
wallEdgePath.lineTo(x40, y40p40);
}
wallEdgePath.moveTo(x40p40, y40); //diagonal
wallEdgePath.lineTo(x40, y40p40);
}
}
}
}
};
let applyTextureToCanvas = function(ctx, target, globalCompositeOperation='source-atop', clipOutside=false) {
let url = defaultValues[target][savedOptions[target]].url; //e.g. target = 'texture_floor1'
let image = imageCache[url];
if (!image || !image.naturalWidth || !image.naturalHeight) {
return;
}
let scale = savedOptions[target + '_size'];
let width = scale > 0 ? Math.floor(image.naturalWidth * scale) : ctx.canvas.width;
let height = scale > 0 ? Math.floor(image.naturalHeight * scale) : ctx.canvas.height;
let filter = savedOptions[target + '_filter'];
let blurFilter;
let hasBlur;
let textureCanvas = createCanvas(width, height);
let textureCtx = textureCanvas.getContext('2d');
if (filter) {
let blur_regexp = /blur\([1-9]+px\)/i;
hasBlur = savedOptions[target + '_filter'].match(blur_regexp);
if (hasBlur) {
filter = filter.replace(hasBlur[0], '').trim();
blurFilter = hasBlur[0];
}
}
if (filter) textureCtx.filter = filter;
textureCtx.drawImage(image, 0, 0, width, height);
if (hasBlur) { //if the filter includes 'blur' we apply it separately, otherwise the edges won't pattern properly
let clipCanvas = createCanvas(ctx.canvas.width, ctx.canvas.height);
let clipCtx = clipCanvas.getContext('2d');
let tempCanvas = createCanvas(ctx.canvas.width, ctx.canvas.height);
let tempCtx = tempCanvas.getContext('2d');
let tempCanvas2 = createCanvas(ctx.canvas.width, ctx.canvas.height);
let tempCtx2 = tempCanvas2.getContext('2d');
clipCtx.drawImage(ctx.canvas, 0, 0); //so we can remove the 'outside' blur
let pattern = tempCtx2.createPattern(textureCanvas, 'repeat');
tempCtx2.fillStyle = pattern;
tempCtx2.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
tempCtx.filter = blurFilter;
tempCtx.drawImage(tempCanvas2, 0, 0);
tempCtx.filter = 'none';
tempCtx.globalCompositeOperation = 'destination-in';
tempCtx.drawImage(clipCanvas, 0, 0);
ctx.globalCompositeOperation = globalCompositeOperation;
ctx.drawImage(tempCanvas, 0, 0);
clipCanvas = null;
clipCtx = null;
tempCanvas = null;
tempCtx = null;
tempCanvas2 = null;
tempCtx2 = null;
} else {
let clipCanvas, clipCtx;
if (clipOutside) {
clipCanvas = createCanvas(ctx.canvas.width, ctx.canvas.height);
clipCtx = clipCanvas.getContext('2d');
clipCtx.drawImage(ctx.canvas, 0, 0);
}
ctx.globalCompositeOperation = globalCompositeOperation;
let pattern = ctx.createPattern(textureCanvas, 'repeat');
ctx.fillStyle = pattern;
ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
if (clipOutside) {
ctx.globalCompositeOperation = 'destination-in';
ctx.drawImage(clipCanvas, 0, 0);
clipCanvas = null;
clipCtx = null;
}
}
ctx.globalCompositeOperation = 'source-over';
textureCanvas = null;
textureCtx = null;
};
let drawBaseImageWithGradient = function(image, iW, iH, color1, color2, filter, position, isRadial, globalAlpha) {
let tempCanvas = createCanvas(iW, iH, true);
let tempCtx = tempCanvas.getContext('2d');
let gradient;
if (filter) tempCtx.filter = filter;
tempCtx.drawImage(image, 0, 0, iW, iH);
tempCtx.globalCompositeOperation = 'source-atop';
if (isRadial) {
gradient = tempCtx.createRadialGradient(iW/2, iH/2, 0, iW/2, iH/2, Math.max(iW, iH));
gradient.addColorStop(0, color1);
gradient.addColorStop(position, color2);
gradient.addColorStop(1, color1);
} else {
const offset = position / 2;
gradient = tempCtx.createLinearGradient(0, 0, iW, 0);
gradient.addColorStop(0, color1);
gradient.addColorStop(0.5 - offset, color2);
gradient.addColorStop(0.5 + offset, color2);
gradient.addColorStop(1, color1);
}
tempCtx.fillStyle = gradient;
tempCtx.globalAlpha = globalAlpha;
tempCtx.fillRect(0, 0, iW, iH);
tempCtx = null;
return tempCanvas;
};
let drawCenterImage = function(ctx) {
let url = defaultValues.texture_center.hasOwnProperty(savedOptions.texture_center) ? defaultValues.texture_center[savedOptions.texture_center].url : '';
let iW, iH, iX, iY;
if (imageCache[url]) {
let image = imageCache[url];
iW = imageCache[url].naturalWidth * savedOptions.texture_center_size;
iH = imageCache[url].naturalHeight * savedOptions.texture_center_size;
iX = iW / 2 - (savedOptions.texture_center_xOffset || 0);
iY = iH / 2 - (savedOptions.texture_center_yOffset || 0);
if (iW && iH) {
ctx.globalCompositeOperation = savedOptions.texture_center_destination_out ? 'destination-out' : 'source-over';
if (savedOptions.texture_center_gradient) {
let tempCanvas = createCanvas(iW, iH);
let tempCtx = tempCanvas.getContext('2d');
let gradient;
tempCtx.drawImage(imageCache[url], 0, 0, iW, iH);
tempCtx.globalCompositeOperation = 'source-atop';
if (savedOptions.texture_center_gradient_radial) {
gradient = tempCtx.createRadialGradient(iX, iY, 0, iX, iY, iX);
} else {
gradient = tempCtx.createLinearGradient(iX, 0, iX, iH);
}
if (savedOptions.texture_center_gradient_color1 !== 'auto') gradient.addColorStop(0, hexToRgbA(savedOptions.texture_center_gradient_color1, savedOptions.texture_center_gradient_opacity1));
if (savedOptions.texture_center_gradient_color2 !== 'auto') gradient.addColorStop(1, hexToRgbA(savedOptions.texture_center_gradient_color2, savedOptions.texture_center_gradient_opacity2));
tempCtx.fillStyle = gradient;
tempCtx.globalAlpha = savedOptions.texture_center_gradient_opacity_global;
tempCtx.fillRect(0, 0, iW, iH);
ctx.filter = savedOptions.texture_center_filter;
ctx.drawImage(tempCanvas, mapWidth / 2 - iW / 2, mapHeight / 2 - iH / 2, iW, iH);
tempCanvas = null;
tempCtx = null;
} else {
ctx.filter = savedOptions.texture_center_filter;
ctx.drawImage(imageCache[url], mapWidth / 2 - iW / 2, mapHeight / 2 - iH / 2, iW, iH);
}
ctx.filter = 'none';
ctx.globalCompositeOperation = 'source-over';
}
}
};
function addSVGFilterToDOM() {
if (!savedOptions.wall_light1 && !savedOptions.wall_light2) {
return;
}
let svg_filters = '';
let light2Blur = '';
let getPosition = function(position, offset) {
if (position === 'topleft') {
return { x: offset, y: offset };
} else if (position === 'topright') {
return { x: mapWidth - offset, y: offset };
} else if (position === 'bottomright') {
return { x: mapWidth - offset, y: mapHeight - offset };
} else if (position === 'bottomleft') {
return { x: offset, y: mapHeight - offset };
} else if (position === 'top') {
return { x: mapWidth / 2, y: offset };
} else if (position === 'right') {
return { x: mapWidth - offset, y: mapHeight / 2 };
} else if (position === 'bottom') {
return { x: mapWidth / 2, y: mapHeight - offset };
} else if (position === 'left') {
return { x: offset, y: mapHeight / 2 };
} else { //default is center
return { x: mapWidth / 2, y: mapHeight / 2 };
}
};
if (savedOptions.wall_light1) {
const position = getPosition(savedOptions.wall_light1_position, savedOptions.wall_light1_offset);
const x = position.x;
const y = position.y;
const z = savedOptions.wall_light1_z;
svg_filters += '<feGaussianBlur in="SourceAlpha" stdDeviation="' + savedOptions.wall_light1_blur + '" result="blur1" />';
svg_filters += '<feSpecularLighting in="blur1" surfaceScale="' + savedOptions.wall_light1_surfaceScale + '" specularConstant="' + savedOptions.wall_light1_constant + '" specularExponent="' + savedOptions.wall_light1_exponent + '" lighting-color="' + savedOptions.wall_light1_color + '" result="specOut">' +
' <fePointLight x="' + x + '" y="' + y + '" z="' + z + '" />' + // pointsAtX="' + mapWidth / 2 + '" pointsAtY="' + mapHeight / 2 + '" pointsAtZ="' + z + '"
'</feSpecularLighting>' +
'<feComposite in="specOut" in2="SourceAlpha" operator="in" result="specComp1" />';
}
if (savedOptions.wall_light2) {
const position = getPosition(savedOptions.wall_light2_position, savedOptions.wall_light2_offset);
const x = position.x;
const y = position.y;
const z = savedOptions.wall_light2_z;
//Using feGaussianBlur is expensive, especially on big maps. If they have the same stdDeviation value then we don't need to do it twice.
if (savedOptions.wall_light1 && savedOptions.wall_light1_blur === savedOptions.wall_light2_blur) {
light2Blur = 'blur1';
} else {
light2Blur = 'blur2';
svg_filters += '<feGaussianBlur in="SourceAlpha" stdDeviation="' + savedOptions.wall_light2_blur + '" result="blur2" />';
}
svg_filters += '<feSpecularLighting in="' + light2Blur + '" surfaceScale="' + savedOptions.wall_light2_surfaceScale + '" specularConstant="' + savedOptions.wall_light2_constant + '" specularExponent="' + savedOptions.wall_light2_exponent + '" lighting-color="' + savedOptions.wall_light2_color + '" result="specOut">' +
' <fePointLight x="' + x + '" y="' + y + '" z="' + z + '" />' +
'</feSpecularLighting>' +
'<feComposite in="specOut" in2="SourceAlpha" operator="in" result="specComp2" />';
}
if (savedOptions.wall_light_edgeonly) {
svg_filters += '<feMorphology radius="' + Math.max(savedOptions.wall_light1 ? savedOptions.wall_light1_blur : -500, savedOptions.wall_light2 ? savedOptions.wall_light2_blur : -500) + '" operator="erode" in="SourceAlpha" result="morphOut" />';
svg_filters += '<feGaussianBlur in="morphOut" stdDeviation="1" result="morphOut2" />';
}
svg_filters += '<feMerge result="specMerged">';
svg_filters += (savedOptions.wall_light1 ? ' <feMergeNode in="specComp1" />' : '');
svg_filters += (savedOptions.wall_light2 ? ' <feMergeNode in="specComp2" />' : '');
svg_filters += (savedOptions.wall_light_edgeonly ? ' <feMergeNode in="morphOut2" />' : '');
svg_filters += '</feMerge>';
svg_filters += '<feBlend mode="normal" in="specMerged" in2="specComp2" />';
svg_filters += '<feComposite in="SourceGraphic" in2="specMerged" operator="arithmetic" k1="0" k2="1" k3="2" k4="0" />'; // result="finalGraphic" 0 1 2 0
$('body').append('<svg style="position:absolute; width:0; height:0;">' + // version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
' <defs><filter id="TMOD_WallLightsFilter" x="0" y="0" width="100%" height="100%">' + // filterUnits="userSpaceOnUse" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="sRGB"
svg_filters +
' </filter></defs>' +
'</svg>');
};
let createSpikeCanvas = function(tempCanvasSize = 64) {
const tempCanvasSize_2 = tempCanvasSize / 2;
const tempCanvasOffset = (tempCanvasSize - 40) / 2;
let tempCanvas = createCanvas(tempCanvasSize, tempCanvasSize);
let tempCtx = tempCanvas.getContext('2d');
if (savedOptions.spikes_generic) {
drawStar(tempCtx, tempCanvasSize_2, tempCanvasSize_2, 0, false, (savedOptions.spikes_generic_color === 'auto' ? defaultOptions.spikes_generic_color : savedOptions.spikes_generic_color), true, savedOptions.spikes_generic_holeradius, savedOptions.spikes_generic_points, savedOptions.spikes_generic_outerradius, savedOptions.spikes_generic_innerradius);
if (savedOptions.spikes_generic_color2_position > 0) {
tempCtx.globalCompositeOperation = 'source-atop';
tempCtx.fillStyle = savedOptions.spikes_generic_color2 === 'auto' ? '#000000' : savedOptions.spikes_generic_color2;
tempCtx.filter = 'blur(3px)';
tempCtx.beginPath();
tempCtx.arc(tempCanvasSize_2, tempCanvasSize_2, savedOptions.spikes_generic_outerradius * savedOptions.spikes_generic_color2_position, 0, Math.PI * 2);
tempCtx.fill();
tempCtx.filter = 'none';
tempCtx.globalCompositeOperation = 'source-over';
}
} else {
tempCtx.translate(tempCanvasOffset, tempCanvasOffset);
tempCtx.drawImage(tilesImage, tagpro.tiles[7].x*40, tagpro.tiles[7].y*40, 40, 40, 0, 0, 40, 40);
tempCtx.translate(-tempCanvasOffset, -tempCanvasOffset);
}
if (savedOptions.spikes_border_linewidth > 0) {
tempCtx.translate(tempCanvasOffset, tempCanvasOffset);
tempCtx.lineWidth = savedOptions.spikes_border_linewidth;
tempCtx.strokeStyle = hexToRgbA(savedOptions.spikes_border_color, savedOptions.spikes_border_opacity);
tempCtx.beginPath();
tempCtx.arc(20, 20, savedOptions.spikes_border_radius, 0, Math.PI * 2);
tempCtx.stroke();
tempCtx.translate(-tempCanvasOffset, -tempCanvasOffset);
}
if (savedOptions.spikes_filter) {
tempCtx.filter = savedOptions.spikes_filter;
tempCtx.drawImage(tempCanvas, 0, 0);
tempCtx.filter = 'none';
}
return tempCanvas;
};
let modifyBackgroundTexture = function(bgCtx) {
const isBigMap = disableForBigMaps && mapWidth * mapHeight > 4000 * 3000;
initCanvases();
createBasicWallTiles();
if (!isBigMap) addSVGFilterToDOM();
let wallEdgeCanvas2 = createCanvas(mapWidth, mapHeight);
let wallEdgeCtx2 = wallEdgeCanvas2.getContext('2d');
floorCtx.fillStyle = savedOptions.plainfloor_color_use ? savedOptions.plainfloor_color : averageTileColors.floor;
if (savedOptions.plainfloor_color_use && savedOptions.plainfloor_color !== 'auto') {
tintCanvas(tilesCtx, 520, 160, 40, 40, savedOptions.plainfloor_color);
} else {
tilesCtx.drawImage(tilesImage, 520, 160, 40, 40, 520, 160, 40, 40);
}
//Draw all the tiles...
for (let x = 0; x < tagpro.map.length; x++) {
for (let y = 0; y < tagpro.map[0].length; y++) {
let mapTileId = Math.floor(tagpro.map[x][y]);
let floorMapTileId = tagpro.floorMap[x][y];
//Draw a floor tile...
if (mapTileId >= 2 || floorMapTileId >= 2) {
floorCtx.fillRect(x*40, y*40, 40, 40);
if (!savedOptions.plainfloor) {
floorCtx.drawImage(tilesCanvas, 520,160,40,40, x*40,y*40,40,40);
}
}
//Draw any floorMap team or endzone tiles (under dynamic sprites & diagonal walls)...
if (floorMapTileId > 2) {
if (floorMapTileId === 11 || floorMapTileId === 12 || floorMapTileId === 23) {
if (savedOptions.plainteam) {
//teamTileCtx.fillStyle = floorMapTileId === 11 ? savedOptions.plainteam_color_use && savedOptions.plainteam_color_red || averageTileColors.redteam : floorMapTileId === 12 ? savedOptions.plainteam_color_use && savedOptions.plainteam_color_blue || averageTileColors.blueteam : savedOptions.plainteam_color_use && savedOptions.plainteam_color_yellow || averageTileColors.yellowteam;
let color = '#000000';
if (floorMapTileId === 11) {
if (savedOptions.plainteam_color_use && savedOptions.plainteam_color_red !== 'auto') color = savedOptions.plainteam_color_red;
else color = averageTileColors.redteam;
} else if (floorMapTileId === 12) {
if (savedOptions.plainteam_color_use && savedOptions.plainteam_color_blue !== 'auto') color = savedOptions.plainteam_color_blue;
else color = averageTileColors.blueteam;
} else if (floorMapTileId === 23) {
if (savedOptions.plainteam_color_use && savedOptions.plainteam_color_yellow !== 'auto') color = savedOptions.plainteam_color_yellow;
else color = averageTileColors.yellowteam;
}
teamTileCtx.fillStyle = color;
teamTileCtx.fillRect(x*40, y*40, 40, 40);
} else {
teamTileCtx.drawImage(tilesImage, tagpro.tiles[floorMapTileId].x*40, tagpro.tiles[floorMapTileId].y*40, 40, 40, x*40, y*40, 40, 40);
}
} else if (floorMapTileId === 17 || floorMapTileId === 18) {
if (savedOptions.plainendzone) {
endzoneCtx.fillStyle = floorMapTileId === 17 ? (savedOptions.plainendzone_color_use && savedOptions.plainendzone_color_red) || averageTileColors.redendzone : (savedOptions.plainendzone_color_use && savedOptions.plainendzone_color_blue) || averageTileColors.blueendzone;
endzoneCtx.fillRect(x*40, y*40, 40, 40);
} else {
endzoneCtx.drawImage(tilesImage, tagpro.tiles[floorMapTileId].x*40, tagpro.tiles[floorMapTileId].y*40, 40, 40, x*40, y*40, 40, 40);
}
}
}
//Draw other map tiles...
if (mapTileId > 2) {
if (mapTileId === 7 && (!isEvent || isEvent && !isHalloween)) { //spike
const tempCanvasSize = 64;
const tempCanvasOffset = (tempCanvasSize - 40) / 2;
if (!imageCache[mapTileId]) {
imageCache[mapTileId] = createSpikeCanvas(tempCanvasSize);
}
spikeCtx.drawImage(imageCache[mapTileId], 0, 0, tempCanvasSize, tempCanvasSize, x * 40 - tempCanvasOffset, y * 40 - tempCanvasOffset, tempCanvasSize, tempCanvasSize);
} else if (mapTileId === 11 || mapTileId === 12 || mapTileId === 23) { //team
if (savedOptions.plainteam) {
let color = '#000000';
if (mapTileId === 11) {
if (savedOptions.plainteam_color_use && savedOptions.plainteam_color_red !== 'auto') color = savedOptions.plainteam_color_red;
else color = averageTileColors.redteam;
} else if (mapTileId === 12) {
if (savedOptions.plainteam_color_use && savedOptions.plainteam_color_blue !== 'auto') color = savedOptions.plainteam_color_blue;
else color = averageTileColors.blueteam;
} else if (mapTileId === 23) {
if (savedOptions.plainteam_color_use && savedOptions.plainteam_color_yellow !== 'auto') color = savedOptions.plainteam_color_yellow;
else color = averageTileColors.yellowteam;
}
teamTileCtx.fillStyle = color;
teamTileCtx.fillRect(x*40, y*40, 40, 40);
} else {
teamTileCtx.drawImage(tilesImage, tagpro.tiles[mapTileId].x*40, tagpro.tiles[mapTileId].y*40, 40, 40, x*40, y*40, 40, 40);
}
} else if (mapTileId === 17 || mapTileId === 18) { //endzone
if (savedOptions.plainendzone) {
let color;
if (mapTileId === 17) {
if (savedOptions.plainendzone_color_use && savedOptions.plainendzone_color_red !== 'auto') color = savedOptions.plainendzone_color_red;
else color = averageTileColors.redendzone;;
} else if (mapTileId === 18) {
if (savedOptions.plainendzone_color_use && savedOptions.plainendzone_color_blue !== 'auto') color = savedOptions.plainendzone_color_blue;
else color = averageTileColors.blueendzone;
}
endzoneCtx.fillStyle = color;
endzoneCtx.fillRect(x*40, y*40, 40, 40);
} else {
endzoneCtx.drawImage(tilesImage, tagpro.tiles[mapTileId].x*40, tagpro.tiles[mapTileId].y*40, 40, 40, x*40, y*40, 40, 40);
}
} else if (mapTileId === 8) { //button
if (savedOptions.buttons_filter !== '') {
spikeCtx.filter = savedOptions.buttons_filter;
}
spikeCtx.drawImage(tilesCanvas, tagpro.tiles[mapTileId].x*40, tagpro.tiles[mapTileId].y*40, 40, 40, x*40, y*40, 40, 40);
spikeCtx.filter = 'none';
} else if (mapTileId === 22) { //gravityWell
if (!tilesCtx.hasGravityWell) {
let pixelData = tilesCtx.getImageData(530, 10, 10, 10).data;
if (getAverageColor(pixelData) === null) { //this fixes the "no gravityWell in the texture pack" bug (all pixels were transparent)
tilesCtx.clearRect(520, 0, 40, 40);
tilesCtx.drawImage($('#gravityWell')[0], 0, 0, 40, 40, 520, 0, 40, 40);
tilesCtx.hasGravityWell = true;
}
}
spikeCtx.drawImage(tilesCanvas, 520, 0, 40, 40, x*40, y*40, 40, 40);
} else if (mapTileId === 9) { //used for gate shadows, drawn later
gateCtx.fillStyle = '#000000';
gateCtx.fillRect(x*40, y*40, 40, 40);
}
} else { //walls...
//Fill in empty tiles with a wall tile...
if (savedOptions.fill_empty_with_walls && (mapTileId === 0 || (tagpro.map[x][y] > 1 && floorMapTileId === 0))) { //empty space or diagonal wall on empty space
tagpro.map[x][y] = 1;
mapTileId = 1;
if (!savedOptions.plainwalls) savedOptions.plainwalls_color = averageTileColors.wall;
savedOptions.plainwalls = true;
}
if (mapTileId === 1) { //walls...
if (savedOptions.plainwalls) { //just draw the correct wall shape (and modify it later). This way it draws ~1 in 4 of the wall tiles.
let wallTileId = tagpro.map[x][y];
if (wallTileId === 1) { //■
wallRawCtx.drawImage(basicWallTilesCanvas, 0, 0, 40, 40, x*40, y*40, 40, 40);
} else if (wallTileId === 1.1) { //◣
wallRawCtx.drawImage(basicWallTilesCanvas, 40, 0, 40, 40, x*40, y*40, 40, 40);
} else if (wallTileId === 1.2) { //◤
wallRawCtx.drawImage(basicWallTilesCanvas, 80, 0, 40, 40, x*40, y*40, 40, 40);
} else if (wallTileId === 1.3) { //◥
wallRawCtx.drawImage(basicWallTilesCanvas, 120, 0, 40, 40, x*40, y*40, 40, 40);
} else if (wallTileId === 1.4) { //◢
wallRawCtx.drawImage(basicWallTilesCanvas, 160, 0, 40, 40, x*40, y*40, 40, 40);
}
} else {
for (let q = 0; q < 4; q++) {
let wallTileId = tagpro.wallMap[x][y][q];
if (tagpro.tiles[wallTileId]) {
let xo = 0;
let yo = 0;
if ((q === 1) || (q === 2)) xo = 20;
if ((q === 2) || (q === 3)) yo = 20;
wallRawCtx.drawImage(tilesImage, tagpro.tiles[wallTileId].x*40, tagpro.tiles[wallTileId].y*40, 20, 20, x*40+xo, y*40+yo, 20, 20);
}
}
}
}
}
}
}
fwCtx.drawImage(floorCanvas, 0, 0);
fwCtx.drawImage(wallRawCanvas, 0, 0);
//Add Floor Image #1...
if (savedOptions.texture_floor1 !== 'select-none') {
if (defaultValues.texture_floor1.hasOwnProperty(savedOptions.texture_floor1) && defaultValues.texture_floor1[savedOptions.texture_floor1].url) {
applyTextureToCanvas(floorCtx, 'texture_floor1', savedOptions.texture_floor1_gco ? savedOptions.texture_floor1_gco : 'source-atop');
}
}
//Work out the average floor color (used when certain colors are set to 'auto')...
let pixelData;
let x = elementPositions.yellowflag.length ? elementPositions.yellowflag[0].x : elementPositions.redflag.length ? elementPositions.redflag[0].x : mapWidth/2;
let y = elementPositions.yellowflag.length ? elementPositions.yellowflag[0].y : elementPositions.redflag.length ? elementPositions.redflag[0].y : mapHeight/2;
pixelData = floorCtx.getImageData(x-50, y-50, x+50, y+50).data; //get an area of the floor around the flag
averageTileColors.actualFloor = getAverageColor(pixelData, true, false, 5); //and get the average color of it
let actualFloorColor = tinycolor(averageTileColors.actualFloor);
let actualFloorColorBrightness = actualFloorColor.getBrightness();
averageTileColors.actualFloorColorBrightness = actualFloorColorBrightness;
averageTileColors.actualFloorAlt = actualFloorColorBrightness < 80 ? actualFloorColor.lighten(50).greyscale().toString() : actualFloorColor.darken(50).greyscale().toString();
averageTileColors.actualFloorAlt2 = actualFloorColorBrightness < 80 ? '#000000' : '#ffffff';
//Add Floor Gradient...
if (savedOptions.floor_gradient1 || savedOptions.floor_gradient2) {
let tempCanvas = createCanvas(mapWidth, mapHeight);
let tempCtx = tempCanvas.getContext('2d');
if (savedOptions.floor_gradient1) {
const type = savedOptions.floor_gradient1_type.slice(6) || 'linear';
const color1 = savedOptions.floor_gradient1_color1 === 'auto' ? averageTileColors.actualFloor : savedOptions.floor_gradient1_color1;
const color2 = savedOptions.floor_gradient1_color2 === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.floor_gradient1_color2;
addGradient(tempCtx, 0, 0, mapWidth, mapHeight, type, color1, color2, savedOptions.floor_gradient1_opacity1, savedOptions.floor_gradient1_opacity2, '' + savedOptions.floor_gradient1_repeats, savedOptions.floor_gradient1_size);
}
if (savedOptions.floor_gradient2) {
const type = savedOptions.floor_gradient2_type.slice(6) || 'linear';
const color1 = savedOptions.floor_gradient2_color1 === 'auto' ? averageTileColors.actualFloor : savedOptions.floor_gradient2_color1;
const color2 = savedOptions.floor_gradient2_color2 === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.floor_gradient2_color2;
if (savedOptions.floor_gradient1) tempCtx.globalCompositeOperation = 'screen'; //just seems to work better when using two gradients
addGradient(tempCtx, 0, 0, mapWidth, mapHeight, type, color1, color2, savedOptions.floor_gradient2_opacity1, savedOptions.floor_gradient2_opacity2, '' + savedOptions.floor_gradient2_repeats, savedOptions.floor_gradient2_size);
}
floorCtx.globalCompositeOperation = 'source-atop';
floorCtx.drawImage(tempCanvas, 0, 0);
floorCtx.globalCompositeOperation = 'source-over';
tempCanvas = null;
tempCtx = null;
}
//Add Floor Contour Gradient...
if (savedOptions.floor_contour && !isBigMap) {
floorCtx.globalCompositeOperation = 'source-atop';
let color = hexToRgbA(savedOptions.floor_contour_color, savedOptions.floor_contour_opacity);
let filter = '';
let filterr = 'drop-shadow(0 0 ' + savedOptions.floor_contour_size + 'px ' + color +') ';
for (let i=1; i<=savedOptions.floor_contour_multiplier; i++) {
filter += filterr;
}
floorCtx.filter = filter;
floorCtx.drawImage(wallRawCanvas, 0, 0);
floorCtx.filter = 'none';
floorCtx.globalCompositeOperation = 'source-over';
}
//Add Grid #1 (Floor)...
if (savedOptions.grid1_size > 0) {
addGrid(floorCtx, mapWidth, mapHeight, +savedOptions.grid1_size, +savedOptions.grid1_length, +savedOptions.grid1_width, (savedOptions.grid1_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.grid1_color), +savedOptions.grid1_opacity, savedOptions.grid1_square, savedOptions.grid1_rectangles, savedOptions.grid1_lines, savedOptions.grid1_diagonal, savedOptions.grid1_crosses, savedOptions.grid1_shadow, savedOptions.grid1_gco ? savedOptions.grid1_gco : 'source-over');
}
//Add Grid #2 (Extras)...
if (savedOptions.grid2_size > 0) {
addGrid(extrasCtx, mapWidth, mapHeight, +savedOptions.grid2_size, +savedOptions.grid2_length, +savedOptions.grid2_width, (savedOptions.grid2_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.grid2_color), +savedOptions.grid2_opacity, savedOptions.grid2_square, savedOptions.grid2_rectangles, savedOptions.grid2_lines, savedOptions.grid2_diagonal, savedOptions.grid2_crosses, savedOptions.grid2_shadow);
}
if (savedOptions.texture_floor3 !== 'select-none' && savedOptions.grid2_applytexture3togrid2) {
applyTextureToCanvas(extrasCtx, 'texture_floor3', savedOptions.texture_floor3_gco ? savedOptions.texture_floor3_gco : 'source-atop');
}
//Add Checker...
if (savedOptions.checker1_size > 0) {
addCheckered(floorCtx, mapWidth, mapHeight, +savedOptions.checker1_size, +savedOptions.checker1_margin, (savedOptions.checker1_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.checker1_color), +savedOptions.checker1_opacity_min, +savedOptions.checker1_opacity, +savedOptions.checker1_density, savedOptions.checker1_normal, savedOptions.checker1_random, savedOptions.checker1_straight, savedOptions.checker1_stripes, false, 'hard-light', false, savedOptions.checker1_rotate, savedOptions.checker1_blur);
}
//Add Hexagons...
if (savedOptions.hexagon_size > 0) {
addHexagons(floorCtx, mapWidth, mapHeight, +savedOptions.hexagon_size, +savedOptions.hexagon_margin, savedOptions.hexagon_stroke, +savedOptions.hexagon_stroke_linewidth, (savedOptions.hexagon_stroke_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.hexagon_stroke_color), savedOptions.hexagon_stroke_opacity, savedOptions.hexagon_fill, (savedOptions.hexagon_fill_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.hexagon_fill_color), savedOptions.hexagon_fill_opacity, savedOptions.hexagon_destination_out ? 'destination-out' : 'source-over');
}
//Add Floor Image #2...
if (savedOptions.texture_floor2 !== 'select-none') {
if (defaultValues.texture_floor2.hasOwnProperty(savedOptions.texture_floor2) && defaultValues.texture_floor2[savedOptions.texture_floor2].url) {
applyTextureToCanvas(floorCtx, 'texture_floor2', savedOptions.texture_floor2_gco ? savedOptions.texture_floor2_gco : 'source-atop');
}
}
//Add Base Logos (for competitive)...
if (defaultValues.showCompetitiveLogos && groupSettingsReady && savedOptions.texture_logo_automatic || savedOptions.texture_logo_red !== 'select-none' || savedOptions.texture_logo_blue !== 'select-none') {
if (elementPositions.redflag.length && savedOptions.texture_logo_red !== 'select-none') {
let url = defaultValues.texture_logo_red.hasOwnProperty(savedOptions.texture_logo_red) ? defaultValues.texture_logo_red[savedOptions.texture_logo_red].url : '';
let iW, iH, iX, iY;
if (imageCache[url]) {
iW = imageCache[url].naturalWidth * savedOptions.texture_logo_red_size;
iH = imageCache[url].naturalHeight * savedOptions.texture_logo_red_size;
iX = iW / 2 - (savedOptions.texture_logo_red_xOffset || 0);
iY = iH / 2 - (savedOptions.texture_logo_red_yOffset || 0);
}
if (iW && iH) {
for (let i=0; i<elementPositions.redflag.length; i++) {
floorCtx.globalCompositeOperation = 'source-over';
floorCtx.filter = savedOptions.texture_logo_red_filter;
floorCtx.drawImage(imageCache[url], elementPositions.redflag[i].x + 20 - iX, elementPositions.redflag[i].y + 20 - iY, iW, iH);
floorCtx.filter = 'none';
floorCtx.globalCompositeOperation = 'source-over';
}
}
}
if (elementPositions.blueflag.length && savedOptions.texture_logo_blue !== 'select-none') {
let url = defaultValues.texture_logo_blue.hasOwnProperty(savedOptions.texture_logo_blue) ? defaultValues.texture_logo_blue[savedOptions.texture_logo_blue].url : '';
let iW, iH, iX, iY;
if (imageCache[url]) {
iW = imageCache[url].naturalWidth * savedOptions.texture_logo_blue_size;
iH = imageCache[url].naturalHeight * savedOptions.texture_logo_blue_size;
iX = iW / 2 - (savedOptions.texture_logo_blue_xOffset || 0);
iY = iH / 2 - (savedOptions.texture_logo_blue_yOffset || 0);
}
if (iW && iH) {
for (let i=0; i<elementPositions.blueflag.length; i++) {
floorCtx.globalCompositeOperation = 'source-over';
floorCtx.filter = savedOptions.texture_logo_blue_filter;
floorCtx.drawImage(imageCache[url], elementPositions.blueflag[i].x + 20 - iX, elementPositions.blueflag[i].y + 20 - iY, iW, iH);
floorCtx.filter = 'none';
floorCtx.globalCompositeOperation = 'source-over';
}
}
}
}
//Add Base Circles/Images...
let doBaseCircle1 = (savedOptions.basecircle1_linewidth > 0 || savedOptions.basecircle1_fill) && savedOptions.basecircle1_radius > 0;
let doBaseCircle2 = (savedOptions.basecircle2_linewidth > 0 || savedOptions.basecircle2_fill) && savedOptions.basecircle2_radius > 0;
let yellowFlagBaseCirclesDrawn = false;
if (doBaseCircle1 || doBaseCircle2 || savedOptions.texture_base !== 'select-none') {
let url = defaultValues.texture_base.hasOwnProperty(savedOptions.texture_base) ? defaultValues.texture_base[savedOptions.texture_base].url : '';
let iW, iH, iX, iY;
if (savedOptions.texture_base !== 'select-none' && imageCache[url]) {
iW = imageCache[url].naturalWidth * savedOptions.texture_base_size;
iH = imageCache[url].naturalHeight * savedOptions.texture_base_size;
iX = iW / 2 - (defaultValues.texture_base[savedOptions.texture_base].xOffset || 0);
iY = iH / 2 - (defaultValues.texture_base[savedOptions.texture_base].yOffset || 0);
}
let newradius1 = +savedOptions.basecircle1_radius;
let newradius2 = +savedOptions.basecircle2_radius;
if (doBaseCircle1 && savedOptions.basecircle1_dashpattern) {
newradius1 = adjustDashForPerfectFit(savedOptions.basecircle1_radius, savedOptions.basecircle1_dashpattern, 'radius');
}
if (doBaseCircle2 && savedOptions.basecircle2_dashpattern) {
newradius2 = adjustDashForPerfectFit(savedOptions.basecircle2_radius, savedOptions.basecircle2_dashpattern, 'radius');
}
let drawBaseCircle = function(ctx, i, baseCircle, color) {
let radius = +savedOptions[baseCircle + '_radius'];
let dashpattern = 0;
let dashsize, rotateAngle;
if (savedOptions[baseCircle + '_octagon']) {
rotateAngle = Math.PI / 8;
} else if (savedOptions[baseCircle + '_segments'] > 0) {
const segments = savedOptions[baseCircle + '_segments'];
radius = +savedOptions[baseCircle + '_radius'];
dashsize = adjustDashForPerfectFit(radius, segments, 'single');
dashpattern = [dashsize];
rotateAngle = Math.PI / segments / 2;
} else if (savedOptions[baseCircle + '_dashpattern']) {
radius = (baseCircle === 'basecircle1' ? newradius1 : newradius2);
dashpattern = savedOptions[baseCircle + '_dashpattern'].split(',');
if (dashpattern.length <= 2) {
dashsize = radius * Math.PI / dashpattern[0];
rotateAngle = Math.PI / dashsize / 2;
} else {
const sum = dashpattern.reduce((a, b) => a + Number(b), 0);
dashsize = radius * Math.PI / sum;
rotateAngle = 0;
}
}
ctx.save();
if (rotateAngle) {
ctx.translate(elementPositions[color + 'flag'][i].x + 20, elementPositions[color + 'flag'][i].y + 20);
ctx.rotate(-rotateAngle);
ctx.translate(-elementPositions[color + 'flag'][i].x - 20, -elementPositions[color + 'flag'][i].y - 20);
}
if (savedOptions[baseCircle + '_octagon']) {
let size = (radius + savedOptions[baseCircle + '_linewidth'] * 2) * 2;
let tempCanvas = createCanvas(size, size);
let tempCtx = tempCanvas.getContext('2d');
let colour = hexToRgbA(savedOptions[baseCircle + '_color_' + color] === 'auto' ? averageTileColors[color + 'flag'] || '#ffff00' : savedOptions[baseCircle + '_color_' + color], savedOptions[baseCircle + '_opacity']);
drawStar(tempCtx, size / 2, size / 2, savedOptions[baseCircle + '_linewidth'], colour, false, false, 0, 8, radius, 0);
if (savedOptions[baseCircle + '_blur']) {
ctx.filter = 'blur(' + savedOptions[baseCircle + '_blur'] + 'px)';
}
ctx.drawImage(tempCanvas, elementPositions[color + 'flag'][i].x + 20 - size / 2, elementPositions[color + 'flag'][i].y + 20 - size / 2);
ctx.filter = 'none';
tempCanvas = null;
tempCtx = null;
} else {
drawCircle(ctx, savedOptions[baseCircle + '_linewidth'], radius, savedOptions[baseCircle + '_color_' + color] === 'auto' ? averageTileColors[color + 'flag'] || '#ffff00' : savedOptions[baseCircle + '_color_' + color], savedOptions[baseCircle + '_opacity'], savedOptions[baseCircle + '_gradient'], dashpattern, savedOptions[baseCircle + '_blur'], elementPositions[color + 'flag'][i].x + 20, elementPositions[color + 'flag'][i].y + 20, savedOptions[baseCircle + '_fill'], savedOptions[baseCircle + '_glow'], savedOptions[baseCircle + '_glow_multiplier'], baseCircle === 'basecircle1' ? 1 : 2);
}
ctx.restore();
};
//yellow flags...
if (elementPositions.yellowflag.length === 1) {
//From: https://stackoverflow.com/questions/8367512/how-do-i-detect-intersections-between-a-circle-and-any-other-circle-in-the-same
for (let i = 0; i < elementPositions.yellowflag.length; i++) {
let intersects = false;
for (let j = 1; j < elementPositions.yellowflag.length; j++) {
intersects = Math.hypot(elementPositions.yellowflag[i].x - elementPositions.yellowflag[j].x, elementPositions.yellowflag[i].y - elementPositions.yellowflag[j].y) <= (newradius1 + newradius1);
if (intersects) break;
}
if (!intersects) {
if (doBaseCircle1) {
drawBaseCircle(extrasCtx, i, 'basecircle1', 'yellow');
}
if (doBaseCircle2) {
drawBaseCircle(extrasCtx, i, 'basecircle2', 'yellow');
}
if (!savedOptions.texture_base_dont_draw_nf && iW && iH) {
floorCtx.globalCompositeOperation = savedOptions.texture_base_destination_out ? 'destination-out' : 'source-over';
floorCtx.filter = savedOptions.texture_base_filter + (savedOptions.texture_base_greyscale_nf ? ' saturate(0)' : (!savedOptions.texture_base_dont_adjust_color ? ' hue-rotate(60deg) saturate(150%)' : '')); //red -> yellow
floorCtx.drawImage(imageCache[url], elementPositions.yellowflag[i].x + 20 - iX, elementPositions.yellowflag[i].y + 20 - iY, iW, iH);
floorCtx.filter = 'none';
floorCtx.globalCompositeOperation = 'source-over';
}
yellowFlagBaseCirclesDrawn = true;
}
}
}
//red flags...
if (elementPositions.redflag.length) {
for (let i = 0; i < elementPositions.redflag.length; i++) {
let intersects = false;
for (let j = 1; j < elementPositions.redflag.length; j++) {
intersects = Math.hypot(elementPositions.redflag[i].x - elementPositions.redflag[j].x, elementPositions.redflag[i].y - elementPositions.redflag[j].y) <= (newradius1 + newradius1);
if (intersects) break;
}
if (!intersects) {
for (let j = 0; j < elementPositions.blueflag.length; j++) {
intersects = Math.hypot(elementPositions.redflag[i].x - elementPositions.blueflag[j].x, elementPositions.redflag[i].y - elementPositions.blueflag[j].y) <= (newradius1 + newradius1);
if (intersects) break;
}
}
if (!intersects) {
if (doBaseCircle1) {
drawBaseCircle(extrasCtx, i, 'basecircle1', 'red');
}
if (doBaseCircle2) {
drawBaseCircle(extrasCtx, i, 'basecircle2', 'red');
}
if (iW && iH) {
let tempCanvas;
if (savedOptions.texture_base_gradient) {
let color1 = hexToRgbA(savedOptions.texture_base_gradient_color1_red === 'auto' ? '#000000' : savedOptions.texture_base_gradient_color1_red, savedOptions.texture_base_gradient_opacity1_red);
let color2 = hexToRgbA(savedOptions.texture_base_gradient_color2_red === 'auto' ? '#000000' : savedOptions.texture_base_gradient_color2_red, savedOptions.texture_base_gradient_opacity2_red);
tempCanvas = drawBaseImageWithGradient(imageCache[url], iW, iH, color1, color2, savedOptions.texture_base_filter, savedOptions.texture_base_gradient_position, savedOptions.texture_base_gradient_radial, savedOptions.texture_base_gradient_opacity_global)
} else {
tempCanvas = imageCache[url];
floorCtx.filter = savedOptions.texture_base_filter;
}
floorCtx.globalCompositeOperation = savedOptions.texture_base_destination_out ? 'destination-out' : 'source-over';
floorCtx.drawImage(tempCanvas, elementPositions.redflag[i].x + 20 - iX, elementPositions.redflag[i].y + 20 - iY, iW, iH);
floorCtx.filter = 'none';
floorCtx.globalCompositeOperation = 'source-over';
tempCanvas = null;
}
}
}
}
//blue flags...
if (elementPositions.blueflag.length) {
for (let i = 0; i < elementPositions.blueflag.length; i++) {
let intersects = false;
for (let j = 1; j < elementPositions.blueflag.length; j++) {
intersects = Math.hypot(elementPositions.blueflag[i].x - elementPositions.blueflag[j].x, elementPositions.blueflag[i].y - elementPositions.blueflag[j].y) <= (newradius1 + newradius1);
if (intersects) break;
}
if (!intersects) {
for (let j = 0; j < elementPositions.redflag.length; j++) {
intersects = Math.hypot(elementPositions.blueflag[i].x - elementPositions.redflag[j].x, elementPositions.blueflag[i].y - elementPositions.redflag[j].y) <= (newradius1 + newradius1);
if (intersects) break;
}
}
if (!intersects) {
if (doBaseCircle1) {
drawBaseCircle(extrasCtx, i, 'basecircle1', 'blue');
}
if (doBaseCircle2) {
drawBaseCircle(extrasCtx, i, 'basecircle2', 'blue');
}
if (iW && iH) {
let tempCanvas;
if (savedOptions.texture_base_gradient) {
let color1 = hexToRgbA(savedOptions.texture_base_gradient_color1_blue === 'auto' ? '#000000' : savedOptions.texture_base_gradient_color1_blue, savedOptions.texture_base_gradient_opacity1_blue);
let color2 = hexToRgbA(savedOptions.texture_base_gradient_color2_blue === 'auto' ? '#000000' : savedOptions.texture_base_gradient_color2_blue, savedOptions.texture_base_gradient_opacity2_blue);
tempCanvas = drawBaseImageWithGradient(imageCache[url], iW, iH, color1, color2, savedOptions.texture_base_filter, savedOptions.texture_base_gradient_position, savedOptions.texture_base_gradient_radial, savedOptions.texture_base_gradient_opacity_global)
} else {
tempCanvas = imageCache[url];
floorCtx.filter = savedOptions.texture_base_filter + (!savedOptions.texture_base_dont_adjust_color ? ' hue-rotate(220deg)' : '');
}
floorCtx.globalCompositeOperation = savedOptions.texture_base_destination_out ? 'destination-out' : 'source-over';
floorCtx.translate(elementPositions.blueflag[i].x * 2 + 40, 0);
floorCtx.scale(-1, 1); //mirror
floorCtx.drawImage(tempCanvas, elementPositions.blueflag[i].x + 20 - iX, elementPositions.blueflag[i].y + 20 - iY, iW, iH);
floorCtx.setTransform(1,0,0,1,0,0); //reset
floorCtx.filter = 'none';
floorCtx.globalCompositeOperation = 'source-over';
tempCanvas = null;
}
}
}
}
}
//Add Center Image...
if (savedOptions.texture_center !== 'select-none' && !savedOptions.texture_center_drawafterteamtiles && (!elementPositions.yellowflag.length || elementPositions.yellowflag.length && !yellowFlagBaseCirclesDrawn || elementPositions.yellowflag.length && savedOptions.texture_base === 'select-none')) {
drawCenterImage(floorCtx);
}
//Add Checker... (moved higher)
//Add Grids... (moved higher)
//Add Floor Image #3...
if (savedOptions.texture_floor3 !== 'select-none' && !savedOptions.grid2_applytexture3togrid2) {
if (defaultValues.texture_floor3.hasOwnProperty(savedOptions.texture_floor3) && defaultValues.texture_floor3[savedOptions.texture_floor3].url) {
applyTextureToCanvas(floorCtx, 'texture_floor3', savedOptions.texture_floor3_gco ? savedOptions.texture_floor3_gco : 'source-atop');
}
}
//Add Koalabeast...
if (savedOptions.kblogo) {
let xPos = (elementPositions.halfway.x ? elementPositions.halfway.x : tagpro.map.length * 40 / 2);
let yPos = (elementPositions.halfway.y ? elementPositions.halfway.y : tagpro.map[0].length * 40 / 2);
addKoalaBeast(extrasCtx, xPos, yPos, 5, 0.1, 2);
}
//Remove anything drawn on extrasCtx (up to this point) under the Team, Endzone & Gate tiles...
if (savedOptions.clear_under_team_tiles || savedOptions.clear_under_endzone_tiles || savedOptions.clear_under_gate_tiles) {
let tempCanvas = createCanvas(mapWidth, mapHeight);
let tempCtx = tempCanvas.getContext('2d');
extrasCtx.globalCompositeOperation = 'destination-out';
if (savedOptions.clear_under_team_tiles) {
extrasCtx.drawImage(teamTileCanvas, 0, 0);
tempCtx.fillStyle = savedOptions.clear_under_team_tiles_color === 'auto' ? averageTileColors.actualFloor : savedOptions.clear_under_team_tiles_color;
tempCtx.globalCompositeOperation = 'source-over';
tempCtx.fillRect(0, 0, mapWidth, mapHeight);
tempCtx.globalCompositeOperation = 'destination-in';
tempCtx.drawImage(teamTileCanvas, 0, 0);
if (savedOptions.clear_under_team_tiles_destout) {
floorCtx.globalCompositeOperation = 'destination-out';
}
floorCtx.drawImage(tempCanvas, 0, 0);
floorCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.clear_under_endzone_tiles) {
extrasCtx.drawImage(endzoneCanvas, 0, 0);
tempCtx.fillStyle = savedOptions.clear_under_endzone_tiles_color === 'auto' ? averageTileColors.actualFloor : savedOptions.clear_under_endzone_tiles_color;
tempCtx.globalCompositeOperation = 'source-over';
tempCtx.fillRect(0, 0, mapWidth, mapHeight);
tempCtx.globalCompositeOperation = 'destination-in';
tempCtx.drawImage(endzoneCanvas, 0, 0);
if (savedOptions.clear_under_endzone_tiles_destout) {
floorCtx.globalCompositeOperation = 'destination-out';
}
floorCtx.drawImage(tempCanvas, 0, 0);
floorCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.clear_under_gate_tiles) {
extrasCtx.drawImage(gateCanvas, 0, 0);
tempCtx.fillStyle = savedOptions.clear_under_gate_tiles_color === 'auto' ? averageTileColors.actualFloor : savedOptions.clear_under_gate_tiles_color;
tempCtx.globalCompositeOperation = 'source-over';
tempCtx.fillRect(0, 0, mapWidth, mapHeight);
tempCtx.globalCompositeOperation = 'destination-in';
tempCtx.drawImage(gateCanvas, 0, 0);
if (savedOptions.clear_under_gate_tiles_destout) {
floorCtx.globalCompositeOperation = 'destination-out';
}
floorCtx.drawImage(tempCanvas, 0, 0);
floorCtx.globalCompositeOperation = 'source-over';
}
extrasCtx.globalCompositeOperation = 'source-over';
tempCanvas.width = 0;
tempCanvas.height = 0;
tempCanvas = null;
tempCtx = null;
}
//********************************** FINISHED WITH FLOORCTX - COULD DRAW TO BGCTX & RE-USE?? **********************************
//Add Center Line...
if (savedOptions.centerline_linewidth > 0 && (!savedOptions.centerline_nfonly || savedOptions.centerline_nfonly && elementPositions.yellowflag.length)) {
let x1=0, y1=0, x2=0, y2=0;
if (elementPositions.halfway.x) {
x1 = elementPositions.halfway.x + 0;
x2 = elementPositions.halfway.x + 0;
y2 = mapHeight;
} else if (elementPositions.halfway.y) {
x2 = mapWidth;
y1 = elementPositions.halfway.y + 0;
y2 = elementPositions.halfway.y + 0;
}
drawLine(extrasCtx, x1, y1, x2, y2, hexToRgbA(savedOptions.centerline_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.centerline_color, savedOptions.centerline_opacity), savedOptions.centerline_linewidth, savedOptions.centerline_dashpattern.split(','), savedOptions.centerline_glow);
}
//Add Base Circles/Images... (moved higher)
//Add Flag Line...
if (savedOptions.flagline_linewidth > 0) {
if (elementPositions.yellowflag.length) {
//do nothing???
} else {
for (let i=0; i<elementPositions.redflag.length; i++) {
for (let j=0; j<elementPositions.blueflag.length; j++) {
drawLine(extrasCtx, elementPositions.redflag[i].x + 20, elementPositions.redflag[i].y + 20, elementPositions.blueflag[j].x + 20, elementPositions.blueflag[j].y + 20, hexToRgbA(savedOptions.flagline_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.flagline_color, savedOptions.flagline_opacity), savedOptions.flagline_linewidth, savedOptions.flagline_dashpattern.split(','), savedOptions.flagline_glow);
}
}
}
}
//Boosts Outline...
if (savedOptions.boosts_outline) {
let c1Canvas = createCanvas(40, 40);
let c1Ctx = c1Canvas.getContext('2d');
let dashpattern = adjustDashForPerfectFit(13, savedOptions.boosts_outline_segments, 'single');
drawCircle(c1Ctx, savedOptions.boosts_outline_linewidth, 13, savedOptions.boosts_outline_color_red === 'auto' ? averageTileColors.redball : savedOptions.boosts_outline_color_red, savedOptions.boosts_outline_opacity, false, dashpattern, 0, 20, 20);
for (let i=0; i<elementPositions.boosts.red.length; i++) {
extrasCtx.drawImage(c1Canvas, elementPositions.boosts.red[i].x, elementPositions.boosts.red[i].y);
}
c1Ctx.clearRect(0,0,40,40);
drawCircle(c1Ctx, savedOptions.boosts_outline_linewidth, 13, savedOptions.boosts_outline_color_blue === 'auto' ? averageTileColors.blueball : savedOptions.boosts_outline_color_blue, savedOptions.boosts_outline_opacity, false, dashpattern, 0, 20, 20);
for (let i=0; i<elementPositions.boosts.blue.length; i++) {
extrasCtx.drawImage(c1Canvas, elementPositions.boosts.blue[i].x, elementPositions.boosts.blue[i].y);
}
c1Ctx.clearRect(0,0,40,40);
drawCircle(c1Ctx, savedOptions.boosts_outline_linewidth, 13, savedOptions.boosts_outline_color_yellow === 'auto' ? averageTileColors.yellowteam : savedOptions.boosts_outline_color_yellow, savedOptions.boosts_outline_opacity, false, dashpattern, 0, 20, 20);
for (let i=0; i<elementPositions.boosts.yellow.length; i++) {
extrasCtx.drawImage(c1Canvas, elementPositions.boosts.yellow[i].x, elementPositions.boosts.yellow[i].y);
}
c1Canvas = null;
c1Ctx = null;
}
//Portals Outline...
if (savedOptions.portals_outline) {
let c1Canvas = createCanvas(40, 40);
let c1Ctx = c1Canvas.getContext('2d');
let radius = 15 - savedOptions.portals_outline_linewidth / 2;
let dashpattern = adjustDashForPerfectFit(radius, savedOptions.portals_outline_segments, 'single');
drawCircle(c1Ctx, savedOptions.portals_outline_linewidth, radius, savedOptions.portals_outline_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.portals_outline_color, savedOptions.portals_outline_opacity, false, dashpattern, 0, 20, 20, savedOptions.portals_outline_fill);
for (let i=0; i<elementPositions.portals.length; i++) {
extrasCtx.drawImage(c1Canvas, elementPositions.portals[i].x, elementPositions.portals[i].y);
}
c1Canvas = null;
c1Ctx = null;
}
//Modify the Team Tile canvas...
if (savedOptions.teamtile_gradient_type !== 'value-none') {
addGradientPattern(teamTileCtx, mapWidth, mapHeight, savedOptions.teamtile_gradient_type, savedOptions.teamtile_gradient_color, savedOptions.teamtile_gradient_opacity, savedOptions.teamtile_gradient_size, savedOptions.teamtile_gradient_destination_out ? 'destination-out' : 'source-atop');
}
if (savedOptions.texture_team !== 'select-none') {
if (defaultValues.texture_team.hasOwnProperty(savedOptions.texture_team) && defaultValues.texture_team[savedOptions.texture_team].url) {
applyTextureToCanvas(teamTileCtx, 'texture_team', savedOptions.texture_team_gco ? savedOptions.texture_team_gco : 'source-atop', true);
}
}
if (savedOptions.teamtile_checker_size > 0) {
let size = +savedOptions.teamtile_checker_size;
let margin = +savedOptions.teamtile_checker_margin;
let gco = savedOptions.teamtile_checker_gco.endsWith('in') ? 'destination-in' : savedOptions.teamtile_checker_gco.endsWith('out') ? 'destination-out' : 'source-atop';
if (savedOptions.teamtile_checker_squares) addCheckered(teamTileCtx, mapWidth, mapHeight, +savedOptions.teamtile_checker_size, +savedOptions.teamtile_checker_margin, (savedOptions.teamtile_checker_color === 'auto' ? averageTileColors.actualFloor : savedOptions.teamtile_checker_color), 0, +savedOptions.teamtile_checker_opacity, 0.75, savedOptions.teamtile_checker_normal, savedOptions.teamtile_checker_random, savedOptions.teamtile_checker_straight, false, '', gco, false, savedOptions.teamtile_checker_rotate, savedOptions.teamtile_checker_blur);
if (savedOptions.teamtile_checker_circles) addCheckered(teamTileCtx, mapWidth, mapHeight, +savedOptions.teamtile_checker_size, +savedOptions.teamtile_checker_margin, (savedOptions.teamtile_checker_color === 'auto' ? averageTileColors.actualFloor : savedOptions.teamtile_checker_color), 0, +savedOptions.teamtile_checker_opacity, 0.75, savedOptions.teamtile_checker_normal, savedOptions.teamtile_checker_random, savedOptions.teamtile_checker_straight, false, '', gco, true, savedOptions.teamtile_checker_rotate, savedOptions.teamtile_checker_blur);
}
//Modify the Endzone canvas...
if (savedOptions.endzone_checker1_size > 0) {
let size = +savedOptions.endzone_checker1_size;
let margin = +savedOptions.endzone_checker1_margin;
addCheckered(endzoneCtx, mapWidth, mapHeight, +savedOptions.endzone_checker1_size, +savedOptions.endzone_checker1_margin, (savedOptions.endzone_checker1_color === 'auto' ? averageTileColors.actualFloor : savedOptions.endzone_checker1_color), 0, +savedOptions.endzone_checker1_opacity, 1, savedOptions.endzone_checker1_normal, savedOptions.endzone_checker1_random, savedOptions.endzone_checker1_straight, false, '', 'source-atop', false, savedOptions.endzone_checker1_rotate, savedOptions.endzone_checker1_blur);
}
if (savedOptions.endzone_checker2_size > 0 && !savedOptions.endzone_checker2_afterimage) {
addCheckered(endzoneCtx, mapWidth, mapHeight, +savedOptions.endzone_checker2_size, +savedOptions.endzone_checker2_margin, (savedOptions.endzone_checker2_color === 'auto' ? averageTileColors.actualFloor : savedOptions.endzone_checker2_color), 0, +savedOptions.endzone_checker2_opacity, 1, savedOptions.endzone_checker2_normal, savedOptions.endzone_checker2_random, savedOptions.endzone_checker2_straight, false, '', 'source-atop', false, savedOptions.endzone_checker2_rotate, savedOptions.endzone_checker2_blur);
}
if (savedOptions.texture_endzone1 !== 'select-none') {
if (defaultValues.texture_endzone1.hasOwnProperty(savedOptions.texture_endzone1) && defaultValues.texture_endzone1[savedOptions.texture_endzone1].url) {
applyTextureToCanvas(endzoneCtx, 'texture_endzone1', savedOptions.texture_endzone1_gco ? savedOptions.texture_endzone1_gco : 'source-atop', true);
}
}
if (savedOptions.texture_endzone2 !== 'select-none') {
if (defaultValues.texture_endzone2.hasOwnProperty(savedOptions.texture_endzone2) && defaultValues.texture_endzone2[savedOptions.texture_endzone2].url) {
applyTextureToCanvas(endzoneCtx, 'texture_endzone2', savedOptions.texture_endzone2_gco ? savedOptions.texture_endzone2_gco : 'source-atop', true);
}
}
if (savedOptions.endzone_checker2_size > 0 && savedOptions.endzone_checker2_afterimage) {
addCheckered(endzoneCtx, mapWidth, mapHeight, +savedOptions.endzone_checker2_size, +savedOptions.endzone_checker2_margin, (savedOptions.endzone_checker2_color === 'auto' ? averageTileColors.actualFloor : savedOptions.endzone_checker2_color), 0, +savedOptions.endzone_checker2_opacity, 1, savedOptions.endzone_checker2_normal, savedOptions.endzone_checker2_random, savedOptions.endzone_checker2_straight, false, '', 'source-atop', false, savedOptions.endzone_checker2_rotate, savedOptions.endzone_checker2_blur);
}
//Modify the Wall canvas...
wallCtx.drawImage(wallRawCanvas, 0, 0);
if (savedOptions.plainwalls) {
wallCtx.globalCompositeOperation = 'source-atop';
wallCtx.fillStyle = savedOptions.plainwalls_color === 'auto' ? averageTileColors.wall : savedOptions.plainwalls_color;
wallCtx.fillRect(0, 0, mapWidth, mapHeight);
wallCtx.globalCompositeOperation = 'source-over';
}
//Add Wall Image #1...
if (savedOptions.texture_walls1 !== 'select-none') {
if (defaultValues.texture_walls1.hasOwnProperty(savedOptions.texture_walls1) && defaultValues.texture_walls1[savedOptions.texture_walls1].url) {
let gco = savedOptions.texture_walls1_gco ? savedOptions.texture_walls1_gco : 'source-atop';
let clip = gco === 'source-atop' ? false : true;
applyTextureToCanvas(wallCtx, 'texture_walls1', gco, clip);
}
}
//Add Wall Image #2...
if (savedOptions.texture_walls2 !== 'select-none') {
if (defaultValues.texture_walls2.hasOwnProperty(savedOptions.texture_walls2) && defaultValues.texture_walls2[savedOptions.texture_walls2].url) {
let gco = savedOptions.texture_walls2_gco ? savedOptions.texture_walls2_gco : 'source-atop';
let clip = gco === 'source-atop' ? false : true;
applyTextureToCanvas(wallCtx, 'texture_walls2', gco, clip);
}
}
//Add the Wall Shadows and/or Wall Outline...
let walloutline_multi_size = (+savedOptions.walloutline1_size + +savedOptions.walloutline2_size + +savedOptions.walloutline3_size) * 2;
if (savedOptions.wallshadow_inner || savedOptions.wallshadow_outer || walloutline_multi_size > 0) {
if (!wallEdgePath) makeWallEdgePath();
//Wall Shadow...
if ((savedOptions.wallshadow_inner || savedOptions.wallshadow_outer) && !isBigMap) {
let wallshadow_type = savedOptions.wallshadow_size + 'px ' + savedOptions.wallshadow_size + 'px';
let wallshadow_blur = savedOptions.wallshadow_blur + 'px ';
let wallshadow_color = savedOptions.wallshadow_color === 'auto' ? averageTileColors.actualFloorAlt : savedOptions.wallshadow_color;
let wallshadow_opacity = savedOptions.wallshadow_opacity;
wallEdgeCtx2.lineWidth = walloutline_multi_size === 0 ? 1 : walloutline_multi_size;
wallEdgeCtx2.strokeStyle = '#000000';
wallEdgeCtx2.lineCap = 'round';
wallEdgeCtx2.drawImage(wallRawCanvas, 0, 0);
wallEdgeCtx2.globalCompositeOperation = 'source-in';
wallEdgeCtx2.stroke(wallEdgePath);
let wallshadow_color_opacity = hexToRgbA(wallshadow_color, wallshadow_opacity);
let wallshadow = 'drop-shadow(' + wallshadow_type + ' ' + wallshadow_blur + ' ' + wallshadow_color_opacity + ') ';
wallCtx.filter = wallshadow;
for (let i = 1; i < savedOptions.wallshadow_multiplier; i++) {
wallCtx.filter += wallshadow;
}
if (savedOptions.wallshadow_inner) {
wallCtx.globalCompositeOperation = 'source-atop';
wallCtx.drawImage(wallEdgeCanvas2, 0, 0);
}
if (savedOptions.wallshadow_outer) {
wallCtx.globalCompositeOperation = 'destination-over';
wallCtx.drawImage(wallEdgeCanvas2, 0, 0);
}
}
wallCtx.globalCompositeOperation = 'source-over';
wallCtx.filter = 'none';
//Wall Outline...
if (walloutline_multi_size > 0) {
let resetWallEdgeCanvas = function(lineWidth) {
wallEdgeCtx2.clearRect(0, 0, wallEdgeCanvas2.width, wallEdgeCanvas2.height);
wallEdgeCtx2.lineWidth = lineWidth;
wallEdgeCtx2.setLineDash([]);
wallEdgeCtx2.filter = 'none';
wallEdgeCtx2.lineCap = 'round';
wallEdgeCtx2.globalCompositeOperation = 'source-over';
wallEdgeCtx2.drawImage(wallRawCanvas, 0, 0);
wallEdgeCtx2.globalCompositeOperation = 'source-in';
wallEdgeCtx2.stroke(wallEdgePath);
}
if (savedOptions.walloutline1_size > 0) { //inner
resetWallEdgeCanvas(walloutline_multi_size);
wallEdgeCtx2.strokeStyle = savedOptions.walloutline1_color === 'auto' ? averageTileColors.floorAlt3 : savedOptions.walloutline1_color;
wallEdgeCtx2.lineWidth = walloutline_multi_size;
wallEdgeCtx2.stroke(wallEdgePath);
wallCtx.drawImage(wallEdgeCanvas2, 0, 0);
}
if (savedOptions.walloutline2_size > 0) { //middle
let walloutline23_size = (+savedOptions.walloutline2_size + +savedOptions.walloutline3_size) * 2;
resetWallEdgeCanvas(walloutline23_size);
if (savedOptions.walloutline2_dashed) {
wallEdgeCtx2.setLineDash([3, 4]);
wallEdgeCtx2.lineCap = 'butt';
}
wallEdgeCtx2.strokeStyle = savedOptions.walloutline2_color === 'auto' ? averageTileColors.floor : savedOptions.walloutline2_color;
wallEdgeCtx2.lineWidth = walloutline23_size;
wallEdgeCtx2.stroke(wallEdgePath);
wallCtx.drawImage(wallEdgeCanvas2, 0, 0);
}
if (savedOptions.walloutline3_size > 0) { //outer
resetWallEdgeCanvas(+savedOptions.walloutline3_size * 2);
wallEdgeCtx2.strokeStyle = hexToRgbA(savedOptions.walloutline3_color === 'auto' ? averageTileColors.floorAlt3 : savedOptions.walloutline3_color, savedOptions.walloutline3_opacity);
wallEdgeCtx2.lineWidth = +savedOptions.walloutline3_size * 2;
wallEdgeCtx2.stroke(wallEdgePath);
//wallCtx.drawImage(wallEdgeCanvas2, 0, 0); //now done last (below)..
}
}
} //wall outlines
//Finally, draw all the canvases to make a single background texture...
if (savedOptions.map_outer_filter !== '') {
bgCtx.translate(extraMapSpace, extraMapSpace);
}
//floor...
if (savedOptions.floor_filter !== '') bgCtx.filter = savedOptions.floor_filter;
bgCtx.globalCompositeOperation = 'source-over';
bgCtx.drawImage(floorCanvas, 0, 0);
bgCtx.filter = 'none';
//extras...
bgCtx.globalCompositeOperation = savedOptions.extras_destination_out ? 'destination-out' : 'source-over';
bgCtx.drawImage(extrasCanvas, 0, 0);
//team tiles...
bgCtx.globalCompositeOperation = 'source-over';
if (savedOptions.teamtile_filter !== '') bgCtx.filter = savedOptions.teamtile_filter;
bgCtx.drawImage(teamTileCanvas, 0, 0);
bgCtx.filter = 'none';
//Add Center Image...
if (savedOptions.texture_center !== 'select-none' && savedOptions.texture_center_drawafterteamtiles && (!elementPositions.yellowflag.length || elementPositions.yellowflag.length && !yellowFlagBaseCirclesDrawn || elementPositions.yellowflag.length && savedOptions.texture_base === 'select-none')) {
drawCenterImage(bgCtx);
}
//endzones...
bgCtx.globalCompositeOperation = 'source-over';
if (savedOptions.endzone_filter !== '') bgCtx.filter = savedOptions.endzone_filter;
bgCtx.drawImage(endzoneCanvas, 0, 0);
bgCtx.filter = 'none';
//gate shadows...
if (savedOptions.gate_shadows && !isBigMap) {
endzoneCtx.clearRect(0, 0, mapWidth, mapHeight); //we're re-using `endzoneCanvas` as a temp canvas here
endzoneCtx.filter = 'drop-shadow(' + savedOptions.gate_shadows_size + 'px ' + savedOptions.gate_shadows_size + 'px ' + savedOptions.gate_shadows_blur + 'px rgba(0,0,0, ' + savedOptions.gate_shadows_opacity + '))';
endzoneCtx.drawImage(gateCanvas, 0, 0);
endzoneCtx.filter = 'none';
endzoneCtx.globalCompositeOperation = 'destination-out';
endzoneCtx.drawImage(gateCanvas, 0, 0);
bgCtx.globalCompositeOperation = 'source-over';
bgCtx.drawImage(endzoneCanvas, 0, 0);
}
//Add Gravity Well Outer Circle...
if (elementPositions.gravityWells.length && !isEvent) {
for (let i = 0; i < elementPositions.gravityWells.length; i++) {
let radius = 260;
let dashpattern = [];
//Gravity Well Circle #1...
if (savedOptions.gravitywell1_linewidth > 0) {
radius = savedOptions.gravitywell1_radius;
dashpattern = savedOptions.gravitywell1_dashpattern.split(',');
if (!savedOptions.gravitywell1_gradientAlt) {
radius = savedOptions.gravitywell1_radius - (savedOptions.gravitywell1_linewidth / 2);
}
if (savedOptions.gravitywell1_dashpattern && dashpattern.length <= 2) {
dashpattern = adjustDashForPerfectFit(radius, savedOptions.gravitywell1_dashpattern, 'first');
}
if (savedOptions.gravitywell1_filter) {
bgCtx.filter = savedOptions.gravitywell1_filter;
}
drawCircle(bgCtx, savedOptions.gravitywell1_linewidth, radius, savedOptions.gravitywell1_color === 'auto' ? '#00bb55' : savedOptions.gravitywell1_color, savedOptions.gravitywell1_opacity, savedOptions.gravitywell1_gradient, dashpattern, 0, elementPositions.gravityWells[i].x + 20, elementPositions.gravityWells[i].y + 20, false, false, false, savedOptions.gravitywell1_gradientAlt ? 3 : 4);
bgCtx.filter = 'none';
}
//Gravity Well Circle #2...
if (savedOptions.gravitywell2_linewidth > 0) {
radius = savedOptions.gravitywell2_radius;
dashpattern = savedOptions.gravitywell2_dashpattern.split(',');
if (!savedOptions.gravitywell2_gradientAlt) {
radius = savedOptions.gravitywell2_radius - (savedOptions.gravitywell2_linewidth / 2);
}
if (savedOptions.gravitywell2_dashpattern && dashpattern.length <= 2) {
dashpattern = adjustDashForPerfectFit(radius, savedOptions.gravitywell2_dashpattern, 'first');
}
if (savedOptions.gravitywell2_filter) {
bgCtx.filter = savedOptions.gravitywell2_filter;
}
drawCircle(bgCtx, savedOptions.gravitywell2_linewidth, radius, savedOptions.gravitywell2_color === 'auto' ? '#cccccc' : savedOptions.gravitywell2_color, savedOptions.gravitywell2_opacity, savedOptions.gravitywell2_gradient, dashpattern, 0, elementPositions.gravityWells[i].x + 20, elementPositions.gravityWells[i].y + 20, false, false, false, savedOptions.gravitywell2_gradientAlt ? 3 : 4);
bgCtx.filter = 'none';
}
}
}
//walls...
let wallFilter = savedOptions.walls_filter;
let hasShadow;
let shadowFilter = '';
if (savedOptions.walls_filter !== '') {
let regexp = /drop-shadow\(.+?\)($|\s)/ig;
hasShadow = wallFilter.match(regexp);
if (hasShadow) {
for (let i = 0; i < hasShadow.length; i++) {
shadowFilter = shadowFilter + hasShadow[i];
wallFilter = wallFilter.replace(hasShadow[i], '').trim();
}
shadowFilter.trim();
}
}
if (hasShadow && shadowFilter && !isBigMap) {
bgCtx.filter = shadowFilter;
bgCtx.drawImage(wallCanvas, 0, 0);
bgCtx.filter = 'none';
bgCtx.globalCompositeOperation = 'destination-out';
bgCtx.drawImage(wallCanvas, 0, 0);
bgCtx.globalCompositeOperation = 'source-over';
}
if ((savedOptions.wall_light1 || savedOptions.wall_light2) && !isBigMap) {
wallFilter += 'url("#TMOD_WallLightsFilter")';
}
if (wallFilter) {
wallCtx.filter = wallFilter;
}
wallCtx.drawImage(wallCanvas, 0, 0);
wallCtx.filter = 'none';
if (savedOptions.walloutline3_size > 0) {
if (savedOptions.walloutline3_exclusion) {
wallCtx.globalCompositeOperation = 'exclusion'; //color-dodge, hard-light, difference
}
wallCtx.drawImage(wallEdgeCanvas2, 0, 0);
wallCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.wall_text_fontsize > 0) {
addTextToWalls(wallCtx);
}
if (defaultValues.globalOptions.walls_as_new_layer) {
let walls_texture = new PIXI.Texture.from(wallCanvas);
let walls_sprite = new PIXI.Sprite(walls_texture);
let fgIndex = 0;
for (let i=0; i<tr.gameContainer.children.length; i++) {
if (tr.gameContainer.children[i] === tr.layers.foreground) {
fgIndex = i;
}
}
tr.layers.walls = new PIXI.Container;
tr.layers.walls.addChild(walls_sprite); //TODO:: chunkify?
tr.gameContainer.addChildAt(tr.layers.walls, fgIndex);
walls_texture = null;
} else {
bgCtx.drawImage(wallCanvas, 0, 0);
}
//spikes & buttons...
bgCtx.globalCompositeOperation = 'source-over';
bgCtx.drawImage(spikeCanvas, 0, 0);
//remove anything left *outside* the map...
bgCtx.globalCompositeOperation = 'destination-in';
bgCtx.drawImage(fwCanvas, 0, 0);
bgCtx.globalCompositeOperation = 'source-over';
//big outside glow/shadow...
if (savedOptions.map_outer_filter !== '') {
bgCtx.translate(-extraMapSpace, -extraMapSpace);
endzoneCanvas.width = bgCtx.canvas.width; //we're re-using `endzoneCanvas` as a temp canvas here
endzoneCanvas.height = bgCtx.canvas.height;
endzoneCtx.filter = savedOptions.map_outer_filter;
if (savedOptions.map_outer_shrink) {
teamTileCtx.clearRect(0, 0, mapWidth, mapHeight); //we're re-using `teamTileCanvas` as a temp canvas here
teamTileCtx.globalCompositeOperation = 'source-over';
teamTileCtx.drawImage(fwCanvas, 0, 0);
teamTileCtx.globalCompositeOperation = 'destination-out';
teamTileCtx.drawImage(wallRawCanvas, 0, 0);
endzoneCtx.drawImage(teamTileCanvas, 0, 0, mapWidth, mapHeight, extraMapSpace, extraMapSpace, mapWidth, mapHeight);
} else {
endzoneCtx.drawImage(fwCanvas, 0, 0, mapWidth, mapHeight, extraMapSpace, extraMapSpace, mapWidth, mapHeight);
}
endzoneCtx.filter = 'none';
endzoneCtx.globalCompositeOperation = 'destination-out';
endzoneCtx.drawImage(fwCanvas, 0, 0, mapWidth, mapHeight, extraMapSpace, extraMapSpace, mapWidth, mapHeight);
bgCtx.filter = 'none';
bgCtx.globalCompositeOperation = 'source-over';
bgCtx.drawImage(endzoneCanvas, 0, 0);
}
wallEdgeCanvas2.width = 0;
wallEdgeCanvas2.height = 0;
wallEdgeCanvas2 = null;
wallEdgeCtx2 = null;
nullCanvases();
/*
let mask = new PIXI.Graphics();
tr.stage.addChild(mask);
mask.position.x = tr.renderer.width / 2 - tr.vpWidth / 2;
mask.position.y = tr.renderer.height / 2 - tr.vpHeight / 2;
mask.drawRect(0, 0, tr.vpWidth, tr.vpHeight);
tr.gameContainer.mask = mask;
*/
}; //modifyBackgroundTexture
let addText = function(ctx, text, x, y, length, fillColor='#ffffff', fillOpacity=1, strokeColor='#000000', strokeOpacity=0, fontSize=24, bold=true, italic=true, smallcaps=false, filter='', destinationOut=false) {
ctx.save();
ctx.globalCompositeOperation = 'source-atop';
ctx.font = (bold ? 'bold ' : '') + (italic ? 'italic ' : '') + (smallcaps ? 'small-caps ' : '') + fontSize + 'px verdana, sans-serif'; //"Lucida Handwriting",
let textMetrics = ctx.measureText(text);
let textWidth = Math.abs(textMetrics.actualBoundingBoxLeft) + Math.abs(textMetrics.actualBoundingBoxRight) + 12;
if (textWidth < length || defaultValues.globalOptions.walls_as_new_layer) { //only draw if it fits
let newX = x + length / 2;
let newY = y + 22;
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
if (savedOptions.wall_text_flip) {
if (y > mapHeight / 2) { //flip vertically for lower half
ctx.translate(newX, newY - 1);
ctx.rotate(180 * Math.PI / 180);
ctx.translate(-newX, -(newY - 1));
}
} else {
if (y > mapHeight / 2) {
newY = newY - 1;
}
}
if (fillOpacity > 0) {
let color = hexToRgbA(fillColor, fillOpacity);
if (filter) {
ctx.filter = filter;
}
ctx.fillStyle = color;
ctx.fillText(text, newX, newY);
ctx.filter = 'none';
if (destinationOut) {
ctx.globalCompositeOperation = 'destination-out';
ctx.fillText(text, newX, newY);
ctx.globalCompositeOperation = 'source-atop';
}
}
if (strokeOpacity > 0) {
let color = hexToRgbA(strokeColor, strokeOpacity);
if (filter && fillOpacity === 0) { //only apply filter for stroke if not also using fill
ctx.filter = filter;
}
ctx.lineWidth = 1;
ctx.strokeStyle = color;
ctx.strokeText(text, newX, newY);
}
}
ctx.filter = 'none';
ctx.globalCompositeOperation = 'source-over';
ctx.restore();
};
let addTextToWalls = function(ctx) {
let coords = [];
let maxLength = 0;
for (let x = 0; x < tagpro.map.length; x++) {
for (let y = 0; y < tagpro.map[0].length; y++) {
if (tagpro.map[x][y] === 1) {
let i = 0;
if (x === 0 || tagpro.map[x - 1][y] !== 1) {
i = x;
while (i < tagpro.map.length && tagpro.map[i][y] === 1) {
i++;
}
}
if (i > 0 && i - x >= 6) { //only try and draw text if space is at least 6 tiles wide
coords.push({ x:x, y:y, tilesCount:i - x, mapWidth:mapWidth });
if (coords[coords.length - 1].tilesCount > maxLength) {
maxLength = coords[coords.length - 1].tilesCount;
}
}
}
}
}
ctx.globalCompositeOperation = 'source-atop';
for (let i = 0; i < coords.length; i++) {
if (coords[i].tilesCount === maxLength) {
addText(ctx, savedOptions.wall_text_text ? savedOptions.wall_text_text : elementPositions.mapInfo.name, coords[i].x * 40, coords[i].y * 40, coords[i].tilesCount * 40, savedOptions.wall_text_color, +savedOptions.wall_text_opacity, savedOptions.wall_text_stroke_color, +savedOptions.wall_text_stroke_opacity, +savedOptions.wall_text_fontsize, savedOptions.wall_text_bold, savedOptions.wall_text_italic, savedOptions.wall_text_smallcaps, savedOptions.wall_text_filter, savedOptions.wall_text_destinationOut);
}
}
ctx.globalCompositeOperation = 'source-over';
};
let createFramesFromCanvas = function(ctx, tileId, numberFrames, canvasSize) {
const tileRespawnWarnings = document.cookie.split('; ').find(cookie => cookie.startsWith('tileRespawnWarnings=')).split('=')[1] || 'blink';
let canvas = ctx.canvas;
let baseTexture = new PIXI.Texture.from(canvas);
let frames = [];
for (let i = 0; i < numberFrames - 1; i++) {
let textureFrame = new PIXI.Rectangle(i * canvasSize, 0, canvasSize, canvasSize);
frames.push(new PIXI.Texture(baseTexture, textureFrame));
}
tagpro.tiles[tileId].textures = frames;
//create pixi texture for off/inactive (last frame)...
let textureFrame = new PIXI.Rectangle(canvasSize * (numberFrames - 1), 0, canvasSize, canvasSize);
tagpro.tiles[tileId + '.1'].textures[0] = new PIXI.Texture(baseTexture, textureFrame);
//create pixi textures for blink & transparent respawning...
if (tileRespawnWarnings === 'blink') {
tagpro.tiles[tileId + '.11'].textures[0] = frames[0];
tagpro.tiles[tileId + '.11'].textures[1] = tagpro.tiles[tileId + '.1'].textures[0];
} else if (tileRespawnWarnings === 'alpha') {
tagpro.tiles[tileId + '.11'].textures = frames;
}
if (defaultValues.showPNGsInGame) { //this adds each canvas to the game page so they can be saved
canvas.style.display = 'block';
$('body').append(canvas);
}
};
let drawArrowhead = function(context, from, to, radius) {
let x_center = to.x;
let y_center = to.y;
let angle;
let x;
let y;
context.beginPath();
angle = Math.atan2(to.y - from.y, to.x - from.x)
x = radius * Math.cos(angle) + x_center;
y = radius * Math.sin(angle) + y_center;
context.moveTo(x, y);
angle += (1.0/3.0) * (2 * Math.PI)
x = radius * Math.cos(angle) + x_center;
y = radius * Math.sin(angle) + y_center;
context.lineTo(x, y);
angle += (1.0/3.0) * (2 * Math.PI)
x = radius *Math.cos(angle) + x_center;
y = radius *Math.sin(angle) + y_center;
context.lineTo(x, y);
context.closePath();
context.fill();
};
let drawCustomSpeedpads = function() {
const tiles = {};
const numberFrames = savedOptions.boosts_generic_texture_opacity > 0 ? 5 : savedOptions.boosts_generic_frames;
const canvasSize = 128;
const canvasSizeDiv2 = canvasSize / 2;
const canvasWidth = canvasSize * numberFrames;
const radius = 15 - savedOptions.boosts_generic_border_linewidth / 2;
if (!tagpro.tiles['5'].textures.length) {
setTimeout(drawCustomSpeedpads, 20);
return false;
}
tiles['5'] = { color:savedOptions.boosts_generic_yellow_color === 'auto' ? defaultOptions.boosts_generic_yellow_color : savedOptions.boosts_generic_yellow_color, segments_color:savedOptions.boosts_generic_segments_yellow === 'auto' ? defaultOptions.boosts_generic_segments_yellow : savedOptions.boosts_generic_segments_yellow };
tiles['14'] = { color:savedOptions.boosts_generic_red_color === 'auto' ? defaultOptions.boosts_generic_red_color : savedOptions.boosts_generic_red_color, segments_color:savedOptions.boosts_generic_segments_red === 'auto' ? defaultOptions.boosts_generic_segments_red : savedOptions.boosts_generic_segments_red };
tiles['15'] = { color:savedOptions.boosts_generic_blue_color === 'auto' ? defaultOptions.boosts_generic_blue_color : savedOptions.boosts_generic_blue_color, segments_color:savedOptions.boosts_generic_segments_blue === 'auto' ? defaultOptions.boosts_generic_segments_blue : savedOptions.boosts_generic_segments_blue };
for (const tileId in tiles) {
let testCanvas = createCanvas(canvasWidth, canvasSize, true);
let testCtx = testCanvas.getContext("2d");
if (savedOptions.boosts_generic) {
let circleCanvas = createCanvas(canvasSize, canvasWidth);
let circleCtx = circleCanvas.getContext("2d");
if (savedOptions.boosts_generic_basic_circle) {
//basic boost circle...
circleCtx.globalAlpha = savedOptions.boosts_generic_border_opacity;
circleCtx.strokeStyle = tiles[tileId].color;
circleCtx.lineWidth = savedOptions.boosts_generic_border_linewidth;
circleCtx.beginPath();
circleCtx.arc(canvasSizeDiv2, canvasSizeDiv2, radius, 0, Math.PI * 2);
circleCtx.stroke();
circleCtx.globalAlpha = 1;
if (savedOptions.boosts_generic_cutsize > 0) {
//const iSize = 0;
circleCtx.globalCompositeOperation = 'destination-out';
circleCtx.lineWidth = savedOptions.boosts_generic_cutsize; //Math.PI * 30 / numberFrames;
circleCtx.beginPath();
circleCtx.moveTo(canvasSizeDiv2, canvasSizeDiv2 - 15); //iSize +
circleCtx.lineTo(canvasSizeDiv2, canvasSizeDiv2 + 15); //iSize +
circleCtx.moveTo(canvasSizeDiv2 - 15, canvasSizeDiv2); //iSize +
circleCtx.lineTo(canvasSizeDiv2 + 15, canvasSizeDiv2); //iSize +
circleCtx.stroke();
circleCtx.globalCompositeOperation = 'source-over';
}
//draw the off/inactive tile (last frame)...
testCtx.globalAlpha = 0.25;
testCtx.drawImage(circleCanvas, canvasWidth - canvasSize, 0);
testCtx.globalAlpha = 1;
}
for (let i = 0; i < numberFrames - 1; i++) {
//glow...
if (savedOptions.boosts_glow) {
let color;
if (tileId === '5') {
color = savedOptions.boosts_glow_color_yellow === 'auto' ? averageTileColors.yellowflag : savedOptions.boosts_glow_color_yellow;
} else if (tileId === '14') {
color = savedOptions.boosts_glow_color_red === 'auto' ? averageTileColors.redflag : savedOptions.boosts_glow_color_red;
} else if (tileId === '15') {
color = savedOptions.boosts_glow_color_blue === 'auto' ? averageTileColors.blueflag : savedOptions.boosts_glow_color_blue;
}
drawGlowCircle(testCtx, i * canvasSize + canvasSizeDiv2, canvasSizeDiv2, savedOptions.boosts_glow_radius, color, savedOptions.boosts_glow_radius_inner, savedOptions.boosts_glow_opacity_inner, savedOptions.boosts_glow_radius_outer, savedOptions.boosts_glow_opacity_outer, savedOptions.boosts_glow_hole_radius, savedOptions.boosts_glow_hole_blur);
}
if (savedOptions.boosts_generic_filter !== '') {
testCtx.filter = savedOptions.boosts_generic_filter;
}
//inner "+" lines...
if (savedOptions.boosts_generic_inner_arrows) {
const iSize = i * canvasSize;
const i2 = savedOptions.boosts_generic_inner_arrows_shift * i / (numberFrames - 1); //i * savedOptions.boosts_generic_inner_arrows_shift; //(radius * i / numberFrames)
const start = +savedOptions.boosts_generic_inner_arrows_start;
const length = +savedOptions.boosts_generic_inner_arrows_length;
testCtx.globalAlpha = +savedOptions.boosts_generic_inner_arrows_opacity;
testCtx.strokeStyle = savedOptions.boosts_generic_inner_arrows_color === 'auto' ? tiles[tileId].color : savedOptions.boosts_generic_inner_arrows_color;
testCtx.lineWidth = +savedOptions.boosts_generic_inner_arrows_linewidth;
testCtx.beginPath();
testCtx.moveTo(iSize + canvasSizeDiv2, canvasSizeDiv2 - start - i2);
testCtx.lineTo(iSize + canvasSizeDiv2, canvasSizeDiv2 - start - i2 - length);
testCtx.moveTo(iSize + canvasSizeDiv2 + start + i2, canvasSizeDiv2);
testCtx.lineTo(iSize + canvasSizeDiv2 + start + i2 + length, canvasSizeDiv2);
testCtx.moveTo(iSize + canvasSizeDiv2, canvasSizeDiv2 + start + i2);
testCtx.lineTo(iSize + canvasSizeDiv2, canvasSizeDiv2 + start + i2 + length);
testCtx.moveTo(iSize + canvasSizeDiv2 - start - i2, canvasSizeDiv2);
testCtx.lineTo(iSize + canvasSizeDiv2 - start - i2 - length, canvasSizeDiv2);
testCtx.stroke();
if (savedOptions.boosts_generic_inner_arrows_heads) {
testCtx.fillStyle = savedOptions.boosts_generic_inner_arrows_color === 'auto' ? tiles[tileId].color : savedOptions.boosts_generic_inner_arrows_color;
drawArrowhead(testCtx, { x:iSize + canvasSizeDiv2, y:canvasSizeDiv2 - start - i2 - length }, { x:iSize + canvasSizeDiv2, y:canvasSizeDiv2 - start - i2 - length - 1 }, 3);
drawArrowhead(testCtx, { x:iSize + canvasSizeDiv2 + start + i2 + length, y:canvasSizeDiv2 }, { x:iSize + canvasSizeDiv2 + start + i2 + length + 1, y:canvasSizeDiv2 }, 3);
drawArrowhead(testCtx, { x:iSize + canvasSizeDiv2, y:canvasSizeDiv2 + start + i2 + length }, { x:iSize + canvasSizeDiv2, y:canvasSizeDiv2 + start + i2 + length + 1 }, 3);
drawArrowhead(testCtx, { x:iSize + canvasSizeDiv2 - start - i2 - length, y:canvasSizeDiv2 }, { x:iSize + canvasSizeDiv2 - start - i2 - length - 1, y:canvasSizeDiv2 }, 3);
}
testCtx.globalAlpha = 1;
}
//diagonal "X" lines...
if (savedOptions.boosts_generic_corner_diagonals) {
const iSize = i * canvasSize;
const i2 = savedOptions.boosts_generic_corner_diagonals_shift * i / (numberFrames - 1); //i * savedOptions.boosts_generic_corner_diagonals_shift;
const start = +savedOptions.boosts_generic_corner_diagonals_start;
const length = +savedOptions.boosts_generic_corner_diagonals_length;
testCtx.globalAlpha = +savedOptions.boosts_generic_corner_diagonals_opacity;
testCtx.strokeStyle = savedOptions.boosts_generic_corner_diagonals_color === 'auto' ? tiles[tileId].color : savedOptions.boosts_generic_corner_diagonals_color;
testCtx.lineWidth = +savedOptions.boosts_generic_corner_diagonals_linewidth;
testCtx.beginPath();
testCtx.moveTo(iSize + canvasSizeDiv2 - i2 - start, canvasSizeDiv2 - i2 - start);
testCtx.lineTo(iSize + canvasSizeDiv2 - i2 - start - length, canvasSizeDiv2 - i2 - start - length);
testCtx.moveTo(iSize + canvasSizeDiv2 + i2 + start, canvasSizeDiv2 - i2 - start);
testCtx.lineTo(iSize + canvasSizeDiv2 + i2 + start + length, canvasSizeDiv2 - i2 - start - length);
testCtx.moveTo(iSize + canvasSizeDiv2 + i2 + start, canvasSizeDiv2 + i2 + start);
testCtx.lineTo(iSize + canvasSizeDiv2 + i2 + start + length, canvasSizeDiv2 + i2 + start + length);
testCtx.moveTo(iSize + canvasSizeDiv2 - i2 - start, canvasSizeDiv2 + i2 + start);
testCtx.lineTo(iSize + canvasSizeDiv2 - i2 - start - length, canvasSizeDiv2 + i2 + start + length);
testCtx.stroke();
if (savedOptions.boosts_generic_corner_diagonals_heads) {
testCtx.fillStyle = savedOptions.boosts_generic_corner_diagonals_color === 'auto' ? tiles[tileId].color : savedOptions.boosts_generic_corner_diagonals_color;
drawArrowhead(testCtx, { x:iSize + canvasSizeDiv2 - i2 - start - length, y:canvasSizeDiv2 - i2 - start - length }, { x:iSize + canvasSizeDiv2 - i2 - start - length - 1, y:canvasSizeDiv2 - i2 - start - length - 1 }, 3);
drawArrowhead(testCtx, { x:iSize + canvasSizeDiv2 + i2 + start + length, y:canvasSizeDiv2 - i2 - start - length }, { x:iSize + canvasSizeDiv2 + i2 + start + length + 1, y:canvasSizeDiv2 - i2 - start - length - 1 }, 3);
drawArrowhead(testCtx, { x:iSize + canvasSizeDiv2 + i2 + start + length, y:canvasSizeDiv2 + i2 + start + length }, { x:iSize + canvasSizeDiv2 + i2 + start + length + 1, y:canvasSizeDiv2 + i2 + start + length + 1 }, 3);
drawArrowhead(testCtx, { x:iSize + canvasSizeDiv2 - i2 - start - length, y:canvasSizeDiv2 + i2 + start + length }, { x:iSize + canvasSizeDiv2 - start - i2 - length - 1, y:canvasSizeDiv2 + i2 + start + length + 1 }, 3);
}
testCtx.globalAlpha = 1;
}
if (savedOptions.boosts_generic_texture_opacity > 0) {
testCtx.globalAlpha = savedOptions.boosts_generic_texture_opacity;
testCtx.drawImage(tagpro.tiles[tileId].textures[0].baseTexture.source, i * 40, 0, 40, 40, i * canvasSize + canvasSizeDiv2 - 20, canvasSizeDiv2 - 20, 40, 40);
testCtx.globalAlpha = 1;
//last texture pack frame...
if (i === numberFrames - 2) {
testCtx.drawImage(tagpro.tiles[tileId].textures[0].baseTexture.source, (numberFrames - 1) * 40, 0, 40, 40, (numberFrames - 1) * canvasSize + canvasSizeDiv2 - 20, canvasSizeDiv2 - 20, 40, 40);
}
}
//outer circle...
if (savedOptions.boosts_generic_basic_circle) {
testCtx.drawImage(circleCanvas, 0, 0, canvasSize, canvasSize, i * canvasSize, 0, canvasSize, canvasSize);
}
//segments...
if (savedOptions.boosts_generic_segments) {
const PI2_F = (Math.PI * 2) / (numberFrames - 1);
const start = i * PI2_F;
const end = start + PI2_F;
testCtx.globalCompositeOperation = savedOptions.boosts_generic_segments_destinationout ? 'destination-out' : 'source-over';
testCtx.globalAlpha = +savedOptions.boosts_generic_segments_opacity;
testCtx.strokeStyle = tiles[tileId].segments_color;
testCtx.lineWidth = +savedOptions.boosts_generic_segments_linewidth;
if (savedOptions.boosts_generic_segments_blur > 0) testCtx.filter = 'blur(' + savedOptions.boosts_generic_segments_blur + 'px)';
testCtx.beginPath();
testCtx.arc(i * canvasSize + canvasSizeDiv2, canvasSizeDiv2, radius, start, end);
testCtx.stroke();
testCtx.filter = 'none';
testCtx.globalAlpha = 1;
testCtx.globalCompositeOperation = 'source-over';
}
}
createFramesFromCanvas(testCtx, tileId, numberFrames, canvasSize);
circleCanvas = null;
circleCtx = null;
} else {
for (let i = 0; i < 5; i++) {
if (savedOptions.boosts_glow && i !== 4) { //last frame has no glow
let color;
if (tileId === '5') {
color = savedOptions.boosts_glow_color_yellow === 'auto' ? averageTileColors.yellowflag : savedOptions.boosts_glow_color_yellow;
} else if (tileId === '14') {
color = savedOptions.boosts_glow_color_red === 'auto' ? averageTileColors.redflag : savedOptions.boosts_glow_color_red;
} else if (tileId === '15') {
color = savedOptions.boosts_glow_color_blue === 'auto' ? averageTileColors.blueflag : savedOptions.boosts_glow_color_blue;
}
drawGlowCircle(testCtx, i * canvasSize + canvasSizeDiv2, canvasSizeDiv2, savedOptions.boosts_glow_radius, color, savedOptions.boosts_glow_radius_inner, savedOptions.boosts_glow_opacity_inner, savedOptions.boosts_glow_radius_outer, savedOptions.boosts_glow_opacity_outer, savedOptions.boosts_glow_hole_radius, savedOptions.boosts_glow_hole_blur);
} else if (savedOptions.boosts_generic_filter !== '' && i !== 4) { //don't apply filter to last frame
testCtx.filter = savedOptions.boosts_generic_filter;
}
testCtx.drawImage(tagpro.tiles[tileId].textures[0].baseTexture.source, i * 40, 0, 40, 40, i * canvasSize + canvasSizeDiv2 - 20, canvasSizeDiv2 - 20, 40, 40);
testCtx.filter = 'none';
}
createFramesFromCanvas(testCtx, tileId, 5, canvasSize);
}
}
};
let drawCustomPortals = function() {
const tiles = {};
const numberFrames = savedOptions.portals_generic_frames;
const canvasSize = 64;
const canvasSizeDiv2 = canvasSize / 2;
const canvasWidth = canvasSize * numberFrames;
const radius = 15 - savedOptions.portals_generic_border_linewidth / 2;
if (savedOptions.portals_generic) {
if (!tagpro.tiles['13'].textures.length) {
setTimeout(drawCustomPortals, 20);
return false;
}
tiles['13'] = { color:savedOptions.portals_generic_color === 'auto' ? defaultOptions.portals_generic_color : savedOptions.portals_generic_color, colorAlt:savedOptions.portals_generic_color_alt === 'auto' ? defaultOptions.portals_generic_color_alt : savedOptions.portals_generic_color_alt, colorBackground:savedOptions.portals_generic_color_background === 'auto' ? false : savedOptions.portals_generic_color_background };
tiles['24'] = { color:savedOptions.portals_generic_color_red === 'auto' ? defaultOptions.portals_generic_color_red : savedOptions.portals_generic_color_red, colorAlt:savedOptions.portals_generic_color_red_alt === 'auto' ? defaultOptions.portals_generic_color_red_alt : savedOptions.portals_generic_color_red_alt, colorBackground:savedOptions.portals_generic_color_red_background === 'auto' ? false : savedOptions.portals_generic_color_red_background };
tiles['25'] = { color:savedOptions.portals_generic_color_blue === 'auto' ? defaultOptions.portals_generic_color_blue : savedOptions.portals_generic_color_blue, colorAlt:savedOptions.portals_generic_color_blue_alt === 'auto' ? defaultOptions.portals_generic_color_blue_alt : savedOptions.portals_generic_color_blue_alt, colorBackground:savedOptions.portals_generic_color_blue_background === 'auto' ? false : savedOptions.portals_generic_color_blue_background };
}
for (const tileId in tiles) {
let testCanvas = createCanvas(canvasWidth, canvasSize, true);
let testCtx = testCanvas.getContext("2d");
//draw active tiles (first 4 frames)...
for (let i = 0; i < numberFrames - 1; i++) {
testCtx.lineWidth = savedOptions.portals_generic_linewidth;
//background...
if (tiles[tileId].colorBackground) {
testCtx.fillStyle = tiles[tileId].colorBackground
testCtx.beginPath();
testCtx.arc(i * canvasSize + canvasSizeDiv2, canvasSizeDiv2, 15, 0, Math.PI * 2);
testCtx.fill();
}
//inner circles...
if (i >= (savedOptions.portals_generic_border_linewidth > 0 ? 1 : 0)) { //skip the outer circle if there's a border
if (i % 2 === 0) testCtx.strokeStyle = tiles[tileId].color;
else testCtx.strokeStyle = tiles[tileId].colorAlt;
const thisRadius = radius - (radius * i / (numberFrames - 1));
if (thisRadius > 0) {
if (savedOptions.portals_generic_blur > 0) testCtx.filter = 'blur(' + savedOptions.portals_generic_blur + 'px)';
testCtx.beginPath();
testCtx.arc(i * canvasSize + canvasSizeDiv2, canvasSizeDiv2, thisRadius, 0, Math.PI * 2);
testCtx.stroke();
testCtx.filter = 'none';
}
}
//border...
if (savedOptions.portals_generic_border_linewidth > 0) {
testCtx.globalAlpha = 0.65;
testCtx.strokeStyle = tiles[tileId].color;
testCtx.lineWidth = savedOptions.portals_generic_border_linewidth;
testCtx.beginPath();
testCtx.arc(i * canvasSize + canvasSizeDiv2, canvasSizeDiv2, radius, 0, Math.PI * 2);
testCtx.stroke();
testCtx.globalAlpha = 1;
}
}
//draw the off/inactive tile (last frame)...
testCtx.globalAlpha = 0.2;
testCtx.strokeStyle = tiles[tileId].color;
testCtx.lineWidth = 3;
testCtx.beginPath();
testCtx.arc(canvasWidth - canvasSizeDiv2, canvasSizeDiv2, 13.5, 0, Math.PI * 2);
testCtx.stroke();
testCtx.strokeStyle = tiles[tileId].colorAlt;
if (savedOptions.portals_generic_blur > 0) testCtx.filter = 'blur(' + savedOptions.portals_generic_blur + 'px)';
testCtx.beginPath();
testCtx.arc(canvasWidth - canvasSizeDiv2, canvasSizeDiv2, 10, 0, Math.PI * 2);
testCtx.stroke();
testCtx.filter = 'none';
testCtx.globalAlpha = 1;
createFramesFromCanvas(testCtx, tileId, numberFrames, canvasSize);
}
};
//--------------- tagpro.renderer ---------------
//tr.start() -> tr.createBackground() -> tr.drawBackground() -> tr.createBackgroundTexture() -> modifyBackgroundTexture() -> tr.chunkifyBackground()
let startTime;
if (document.visibilityState === 'hidden') {
setTimeout(function() { //make sure the gameContainer doesn't stay hidden if we were on a different tab when the page loaded visible...
$('#PM_Loading').remove();
document.querySelector("#viewport").style.display = 'inline-block';
tr.gameContainer.visible = true;
}, 2000);
}
tr.drawBackground = function() { //called from tr.createBackground()
const viewport = document.querySelector("#viewport");
startTime = Date.now();
if (document.visibilityState === 'visible') {
tr.gameContainer.visible = false;
viewport.style.display = 'none';
}
if (savedOptions.texture_logo_automatic && tagpro.group && tagpro.group.socket !== null && !tagpro.group.socket.connected) {
if (startTime > Date.now() - 2000) { //wait for group socket (if using team logos)
setTimeout(tr.drawBackground, 20);
return false;
}
}
if ((!tr.readyToDrawBackground() || !mapWidth || !mapHeight) && startTime > Date.now() - 10000) {
setTimeout(function() {
tr.drawBackground();
}, 100);
return false;
}
if (!tr.readyToDrawBackground() || !mapWidth || !mapHeight) {
PM_Loading.html('<div style="font-size:40px; color:orangered;">REFRESHING...</div>');
setTimeout(function() {
window.location.reload();
}, 600);
return false;
}
tr.createBackgroundTexture(tr.layers.background); //this calls modifyBackgroundTexture()
tr.gameContainer.addChildAt(tr.layers.background, 0);
if (defaultValues.globalOptions.max_number_splats === 0) {
tr.addSplat = function() {};
} else {
tr.drawStartingSplats();
if (defaultValues.globalOptions.max_number_splats > 0) {
//tr.layers.splats.alpha = 0.5; //make this an option?
while (tr.layers.splats.children.length >= defaultValues.globalOptions.max_number_splats) {
tr.layers.splats.children[0].destroy();
}
setTimeout(function() {
let dS = tr.drawSplat;
tr.drawSplat = function(x, y, team, showDeath, fadeAway, scale) {
while (tr.layers.splats.children.length >= defaultValues.globalOptions.max_number_splats) {
tr.layers.splats.children[0].destroy();
}
return dS.apply(this, arguments);
};
}, 6000);
}
}
tr.drawDynamicTiles();
requestAnimationFrame(tr.render);
tr.layers.backgroundDrawn = true;
setTimeout(function() {
viewport.style.display = 'inline-block';
tr.gameContainer.visible = true;
if (vpEffect && document.visibilityState !== 'hidden') {
$('#viewport').addClass('PM_Effect');
}
setTimeout(function() {
//tagpro.renderer.centerView();
$('#PM_Loading').remove();
}, vpEffectTimeout + 100);
}, 100);
};
tr.chunkifyBackground = function(bgCanvas) {
let width = bgCanvas.width;
let height = bgCanvas.height;
let chunkSize = 1024; //256 or 512 or 1024 or 2048 or 4096 (TagPro default is 1024)
if (tr.renderer.gl) {
let maxSize = tr.renderer.gl.getParameter(tr.renderer.gl.MAX_TEXTURE_SIZE);
if (chunkSize > maxSize) {
chunkSize = Math.pow(2, Math.round(Math.log(maxSize / 2) / Math.log(2)));
console.log("Chunk size was too large. Reducing to closest power of two below gl.MAX_TEXTURE_SIZE, which is " + chunkSize);
}
}
tr.layers.background.removeChildren();
for (let x = 0; x < width; x += chunkSize) {
for (let y = 0; y < height; y += chunkSize) {
let w = x + chunkSize > width ? width - x : chunkSize;
let h = y + chunkSize > height ? height - y : chunkSize;
let canvas = createCanvas(chunkSize, chunkSize);
let ctx = canvas.getContext('2d');
ctx.drawImage(bgCanvas, x, y, w, h, 0, 0, w, h);
let texture = PIXI.Texture.from(canvas);
let sprite = new PIXI.Sprite(texture);
sprite.x = x - extraMapSpace;
sprite.y = y - extraMapSpace;
tr.backgroundChunks.push(sprite);
tr.layers.background.addChild(sprite);
texture = null;
canvas = null;
ctx = null;
}
}
};
//Re-draw the background before it gets chunkified...
tr.createBackgroundTexture = function(container) {
tr.backgroundChunks = [];
if (mapWidth && mapHeight) {
let bgCanvas = createCanvas(mapWidth + extraMapSpace * 2, mapHeight + extraMapSpace * 2);
let bgCtx = bgCanvas.getContext('2d');
//add any modified dynamic tiles to the cache now so the draw doesn't pause the animation later...
let tilesToPreDraw = [];
if (savedOptions.gates_glow) tilesToPreDraw.push(9.1, 9.2, 9.3); // || savedOptions.gates_glow_outline
if (savedOptions.flags_glow || savedOptions.flags_outline) tilesToPreDraw.push(3, 4, 16);
if (savedOptions.bombs_filter || savedOptions.bombs_outline) tilesToPreDraw.push(10, 10.1);
if (savedOptions.pups_glow || savedOptions.pups_bottom_shadow || savedOptions.pups_glow_outline || savedOptions.pups_filter) tilesToPreDraw.push(6, 6.1, 6.2, 6.3);
if (tilesToPreDraw.length) drawCustomTiles(tilesToPreDraw);
if (elementPositions.gravityWells.length && !isEvent) {
tr.drawGravityWells();
}
if (savedOptions.boosts_generic || savedOptions.boosts_glow || savedOptions.boosts_generic_filter !== '') {
drawCustomSpeedpads();
}
if (savedOptions.portals_generic) {
drawCustomPortals();
}
modifyBackgroundTexture(bgCtx);
tr.afterDrawBackground(); //this does nothing right now, but it might one day
tr.chunkifyBackground(bgCanvas);
bgCanvas = null;
bgCtx = null;
} else {
setTimeout(function() {
tr.createBackgroundTexture(container);
}, 100);
}
};
tr.drawSpawn = function(x, y, team, timeout) {
const tile = team === 1 ? "redball" : "blueball";
if (!tr.layers.foreground) {
setTimeout(function() {
tr.drawSpawn(0, x, y, team, timeout - 50);
}, 50);
return false;
}
let sprite;
if (tagpro.tiles[tile].draw === true) { //fixes an introduced bug (when "tile" isn't ready yet). We set this to true earlier.
let tempCanvas = createCanvas(64, 64);
let tempCtx = tempCanvas.getContext('2d');
tempCtx.translate(20, 20);
tempCtx.drawImage(tilesImage, team === 1 ? 560 : 600, 0, 40, 40, 0, 0, 40, 40);
tempCtx.translate(-20, -20);
let texture = PIXI.Texture.from(tempCanvas);
sprite = new PIXI.Sprite(texture);
sprite.alpha = 0.25;
sprite.x = x;
sprite.y = y;
tr.layers.foreground.addChild(sprite);
tempCanvas = null;
tempCtx = null;
} else {
sprite = tagpro.tiles.draw(tr.layers.foreground, tile, {x: x, y: y}, null, null, 0.25, true);
}
setTimeout(function() {
sprite.parent.removeChild(sprite);
}, timeout);
};
if (savedOptions.balls_shine) {
let shineTexture;
let canvas_size = 64;
let canvas_center = canvas_size / 2;
let shineCanvas = createCanvas(canvas_size, canvas_size);
let shineCtx = shineCanvas.getContext('2d');
shineCtx.fillStyle = '#ffffff';
shineCtx.globalAlpha = 0.8;
shineCtx.filter = 'blur(3px)';
shineCtx.beginPath();
shineCtx.ellipse(canvas_center + 8, canvas_center - 10, 9, 4, Math.PI / 4, 0, Math.PI * 2);
shineCtx.fill();
shineCtx.globalAlpha = 0.6;
shineCtx.filter = 'blur(2px)';
shineCtx.beginPath();
shineCtx.arc(canvas_center + 8, canvas_center - 10, 5, 0, Math.PI * 2);
shineCtx.fill();
shineCtx.globalAlpha = 0.85;
shineCtx.filter = 'blur(1px)';
shineCtx.beginPath();
shineCtx.arc(canvas_center + 9, canvas_center - 11, 3, 0, Math.PI * 2);
shineCtx.fill();
shineTexture = PIXI.Texture.from(shineCanvas);
let dP = tr.drawPlayer;
tr.drawPlayer = function(player) {
if (player.draw && player.sprites && !player.sprites.shine) {
player.sprites.shine = new PIXI.Sprite(shineTexture);
player.sprites.shine.pivot = new PIXI.Point(shineTexture.width / 2 - 20, shineTexture.height / 2 - 20);
player.sprites.ball.addChild(player.sprites.shine);
}
return dP.apply(this, arguments);
};
shineCanvas = null;
shineCtx = null;
}
if (savedOptions.balls_shadow) {
let shadowTexture;
let canvas_size = 64;
let canvas_center = canvas_size / 2;
let shadowCanvas = createCanvas(canvas_size, canvas_size);
let shadowCtx = shadowCanvas.getContext('2d');
shadowCtx.fillStyle = '#000000';
shadowCtx.globalAlpha = 0.8;
shadowCtx.filter = 'blur(4px)';
shadowCtx.beginPath();
shadowCtx.ellipse(canvas_center - 2, canvas_center + 16, 15, 8, 0, 0, Math.PI * 2);
shadowCtx.fill();
shadowCtx.globalAlpha = 0.65;
shadowCtx.filter = 'blur(2px)';
shadowCtx.beginPath();
shadowCtx.ellipse(canvas_center - 2, canvas_center + 16, 10, 5, 0, 0, Math.PI * 2);
shadowCtx.fill();
shadowTexture = PIXI.Texture.from(shadowCanvas);
let dP = tr.drawPlayer;
tr.drawPlayer = function(player) {
if (player.draw && player.sprites && !player.sprites.shadow) {
player.sprites.shadow = new PIXI.Sprite(shadowTexture);
player.sprites.shadow.pivot = new PIXI.Point(shadowTexture.width / 2 - 20, shadowTexture.height / 2 - 20);
player.sprites.ball.addChildAt(player.sprites.shadow, 0);
}
return dP.apply(this, arguments);
};
shadowCanvas = null;
shadowCtx = null;
}
if (savedOptions.ballglow) {
let glowTexture;
let glow_color_red = parseInt(savedOptions.ballglow_color_red === 'auto' ? averageTileColors.redball.slice(1) : savedOptions.ballglow_color_red.slice(1), 16);
let glow_color_blue = parseInt(savedOptions.ballglow_color_blue === 'auto' ? averageTileColors.blueball.slice(1) : savedOptions.ballglow_color_blue.slice(1), 16);
let color_tp = parseInt(savedOptions.ballglow_color_tp === 'auto' ? defaultOptions.ballglow_color_tp.slice(1) : savedOptions.ballglow_color_tp.slice(1), 16);
let color_rb = parseInt(savedOptions.ballglow_color_rb === 'auto' ? defaultOptions.ballglow_color_rb.slice(1) : savedOptions.ballglow_color_rb.slice(1), 16);
let color_jj = parseInt(savedOptions.ballglow_color_jj === 'auto' ? defaultOptions.ballglow_color_jj.slice(1) : savedOptions.ballglow_color_jj.slice(1), 16);
let canvas_size = 4 << 32 - Math.clz32(+savedOptions.ballglow_size + +savedOptions.ballglow_blur); //next power of 2
let canvas_center = canvas_size / 2;
let glowCanvas = createCanvas(canvas_size, canvas_size, true);
let glowCtx = glowCanvas.getContext('2d');
//glow circle...
glowCtx.fillStyle = '#ffffff';
glowCtx.globalAlpha = +savedOptions.ballglow_opacity;
glowCtx.filter = 'blur(' + savedOptions.ballglow_blur + 'px)';
glowCtx.beginPath();
if (savedOptions.ballglow_ellipse) glowCtx.ellipse(canvas_center + +savedOptions.ballglow_offsetx, canvas_center + +savedOptions.ballglow_offsety, +savedOptions.ballglow_size, +savedOptions.ballglow_size / 2, 0, 0, Math.PI * 2);
else glowCtx.arc(canvas_center + +savedOptions.ballglow_offsetx, canvas_center + +savedOptions.ballglow_offsety, +savedOptions.ballglow_size, 0, Math.PI * 2);
glowCtx.fill();
glowCtx.filter = 'none';
//make hole...
if (savedOptions.ballglow_holesize > 0) {
glowCtx.filter = 'blur(3px)';
glowCtx.beginPath();
glowCtx.globalCompositeOperation = 'destination-out';
if (savedOptions.ballglow_ellipse) glowCtx.ellipse(canvas_center + +savedOptions.ballglow_offsetx, canvas_center + +savedOptions.ballglow_offsety, savedOptions.ballglow_holesize, savedOptions.ballglow_holesize / 2, 0, 0, Math.PI * 2);
else glowCtx.arc(canvas_center + +savedOptions.ballglow_offsetx, canvas_center + +savedOptions.ballglow_offsety, savedOptions.ballglow_holesize, 0, Math.PI * 2);
glowCtx.fill();
glowCtx.filter = 'none';
glowCtx.globalCompositeOperation = 'source-over';
}
glowCtx.globalAlpha = 1;
if (savedOptions.ballglow_19pxhole) { //19px ball hole...
glowCtx.beginPath();
glowCtx.globalCompositeOperation = 'destination-out';
glowCtx.arc(canvas_center, canvas_center, 19, 0, Math.PI * 2);
glowCtx.fill();
glowCtx.globalCompositeOperation = 'source-over';
}
glowTexture = PIXI.Texture.from(glowCanvas);
glowCanvas = null;
glowCtx = null;
let addGlows = function(player) {
let tintColor = player.team === 1 ? glow_color_red : glow_color_blue;
player.sprites.glow = new PIXI.Sprite(glowTexture);
player.sprites.glow.tint = tintColor;
player.sprites.glow.pivot = new PIXI.Point(glowTexture.width / 2 - 20, glowTexture.height / 2 - 20);
if (savedOptions.ballglow_behind) {
player.sprites.glow.position = new PIXI.Point(player.x + +savedOptions.ballglow_offsetx, player.y + +savedOptions.ballglow_offsety);
}
player.sprites.glow.renderable = player.team === 1 && savedOptions.balls_apply_red || player.team === 2 && savedOptions.balls_apply_blue;
player.glowColor = tintColor;
if (savedOptions.ballglow_behind) {
tr.layers.background.addChildAt(player.sprites.glow, 0);
} else {
player.sprites.ball.addChildAt(player.sprites.glow, 0);
}
};
let dP = tr.drawPlayer;
tr.drawPlayer = function(player) {
if (player.draw && player.sprites && !player.sprites.glow) {
addGlows(player);
}
return dP.apply(this, arguments);
};
let uPC = tr.updatePlayerColor;
tr.updatePlayerColor = function(player) {
const tileId = player.team === 1 ? "redball" : "blueball";
if (player.sprites.actualBall.tileId !== tileId) {
if (player.sprites.glow) {
tr.layers.background.removeChild(player.sprites.glow);
}
addGlows(player);
}
return uPC.apply(this, arguments);
};
if (savedOptions.ballglow_tintpups || savedOptions.ballglow_behind || savedOptions.ballglow_flagcarrier || savedOptions.ballglow_onlyme) {
let uPSP = tr.updatePlayerSpritePosition;
tr.updatePlayerSpritePosition = function(player) {
if (player.sprites.glow) {
if (savedOptions.ballglow_onlyme) {
if (player.id === tagpro.playerId) {
player.sprites.glow.visible = true;
} else {
player.sprites.glow.visible = false;
return uPSP.apply(this, arguments);
}
} else if (savedOptions.ballglow_flagcarrier) {
if (player.flag) {
player.sprites.glow.visible = true;
} else {
player.sprites.glow.visible = false;
return uPSP.apply(this, arguments);
}
}
if (savedOptions.ballglow_behind) {
//player.sprites.glow.position = new PIXI.Point(Math.round(player.x + +savedOptions.ballglow_offsetx), Math.round(player.y + +savedOptions.ballglow_offsety));
//player.sprites.glow.position = new PIXI.Point(player.x + +savedOptions.ballglow_offsetx, player.y + +savedOptions.ballglow_offsety);
player.sprites.glow.position.x = player.x + +savedOptions.ballglow_offsetx;
player.sprites.glow.position.y = player.y + +savedOptions.ballglow_offsety;
}
if (savedOptions.ballglow_tintpups) {
player.sprites.glow.tint = player.tagpro ? color_tp : player.bomb ? color_rb : player.grip ? color_jj : player.glowColor;
}
}
return uPSP.apply(this, arguments);
};
}
} //if savedOptions.ballGlow
tr.drawGravityWells = function() {
for (let x = 0; x < tagpro.map.length; x++) {
for (let y = 0; y < tagpro.map[0].length; y++) {
if (tagpro.map[x][y] === 22) {
tr.createGravityWellEmitter(x * 40 + 20, y * 40 + 20);
tagpro.world.createGravityWell(x * 0.4, y * 0.4);
}
}
}
};
let skipTileIds = [7, 8, 17, 18, 22];
function drawCustomTiles(tiles) {
let tilesArray = Array.isArray(tiles) ? tiles : [tiles];
let canvas_size = 128; //pixi textures/sprites should be power of 2 when possible
let canvas_center = canvas_size / 2;
for (let i = 0; i < tilesArray.length; i++) {
let tileId = tilesArray[i];
let baseTileId = Math.floor(tileId);
if (baseTileId === 9) { //gates
let target = tileId === 9.2 ? 'red' : tileId === 9.3 ? 'blue' : 'green';
let glowColor;
let spriteCanvas = createCanvas(canvas_size, canvas_size);
let spriteCtx = spriteCanvas.getContext('2d');
spriteCtx.translate(canvas_center - 20, canvas_center - 20);
if (savedOptions.gates_glow) {
if (savedOptions['gates_glow_color_' + target] === 'auto') {
let color = tinycolor(averageTileColors[target + 'gate']);
let brightness = color.getBrightness();
glowColor = color.saturate(100).brighten((255 - brightness) / 255 * 40).toHexString();
} else {
glowColor = savedOptions['gates_glow_color_' + target];
}
spriteCtx.filter = 'drop-shadow(0px 0px ' + savedOptions.gates_glow_size + 'px ' + glowColor + ')';
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
spriteCtx.filter = 'none';
}
if (savedOptions.gates_glow_outline) {
let outlineColor;
if (savedOptions['gates_glow_outline_color_' + target] === 'auto') {
let color = tinycolor(averageTileColors[target + 'gate']);
let brightness = color.getBrightness();
outlineColor = color.saturate(250).brighten((255 - brightness) / 255 * 40).toHexString();
} else {
outlineColor = savedOptions['gates_glow_outline_color_' + target];
}
spriteCtx.strokeStyle = hexToRgbA(outlineColor, savedOptions.gates_glow_outline_opacity); //'#ffffff';
spriteCtx.lineWidth = savedOptions.gates_glow_outline_linewidth;
spriteCtx.beginPath();
spriteCtx.rect(savedOptions.gates_glow_outline_linewidth / 2, savedOptions.gates_glow_outline_linewidth / 2, 40 - savedOptions.gates_glow_outline_linewidth, 40 - savedOptions.gates_glow_outline_linewidth);
spriteCtx.stroke();
spriteCtx.filter = 'none';
}
imageCache[tileId] = PIXI.Texture.from(spriteCanvas);
PIXI.utils.TextureCache[tileId] = imageCache[tileId];
spriteCanvas = null;
spriteCtx = null;
} else if (baseTileId === 6) { //pups
let spriteCanvas = createCanvas(canvas_size, canvas_size);
let spriteCtx = spriteCanvas.getContext('2d');
spriteCtx.translate(canvas_center - 20, canvas_center - 20);
if (tileId != 6) { // don't draw for empty pups
const doOutline = savedOptions.pups_glow_outline;
if (savedOptions.pups_glow) {
const alphaCoefficient = +savedOptions.pups_glow_opacity_coefficient;
const sizeCoefficient = +savedOptions.pups_glow_size_coefficient;
let glowColor;
if (tileId === 6.1) glowColor = savedOptions.pups_glow_color_jj === 'auto' ? averageTileColors.jj : savedOptions.pups_glow_color_jj; // '#49dfff'
else if (tileId === 6.2) glowColor = savedOptions.pups_glow_color_rb === 'auto' ? averageTileColors.rb : savedOptions.pups_glow_color_rb; // '#ff9a63'
else if (tileId === 6.3) glowColor = savedOptions.pups_glow_color_tp === 'auto' ? averageTileColors.tp : savedOptions.pups_glow_color_tp; // '#40ff40'
else glowColor = '#ffffff';
// spriteCtx.filter = 'drop-shadow(0px 0px 12px ' + hexToRgbA(glowColor, 0.5) + ') drop-shadow(0px 0px 5px ' + glowColor + ')';
spriteCtx.fillStyle = glowColor;
spriteCtx.filter = 'blur(7px)';
spriteCtx.beginPath();
spriteCtx.globalAlpha = 0.35 * alphaCoefficient;
spriteCtx.arc(20, 20, 25 * sizeCoefficient, 0, Math.PI * 2);
spriteCtx.fill();
spriteCtx.filter = 'blur(5px)';
spriteCtx.beginPath();
spriteCtx.globalAlpha = 0.25 * alphaCoefficient;
spriteCtx.arc(20, 20, 20 * sizeCoefficient, 0, Math.PI * 2);
spriteCtx.fill();
spriteCtx.globalAlpha = 1;
spriteCtx.filter = 'none';
spriteCtx.globalCompositeOperation = 'destination-out';
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, doOutline ? savedOptions.pups_glow_outline_linewidth : 0, doOutline ? savedOptions.pups_glow_outline_linewidth : 0, doOutline ? 40 - savedOptions.pups_glow_outline_linewidth * 2 : 40, doOutline ? 40 - savedOptions.pups_glow_outline_linewidth * 2: 40);
spriteCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.pups_bottom_shadow) {
const alphaCoefficient = +savedOptions.pups_bottom_shadow_opacity_coefficient;
spriteCtx.fillStyle = '#000000';
spriteCtx.globalAlpha = 1 * alphaCoefficient;
spriteCtx.filter = 'blur(3px)';
spriteCtx.beginPath();
spriteCtx.ellipse(20, 20 + 12, 16, 6, 0, 0, Math.PI * 2);
spriteCtx.fill();
spriteCtx.globalAlpha = 0.75 * alphaCoefficient;
spriteCtx.filter = 'blur(2px)';
spriteCtx.beginPath();
spriteCtx.ellipse(20, 20 + 11, 7, 3, 0, 0, Math.PI * 2);
spriteCtx.fill();
spriteCtx.globalAlpha = 1;
spriteCtx.filter = 'none';
spriteCtx.globalCompositeOperation = 'destination-out';
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, doOutline ? savedOptions.pups_glow_outline_linewidth : 0, doOutline ? savedOptions.pups_glow_outline_linewidth : 0, doOutline ? 40 - savedOptions.pups_glow_outline_linewidth * 2 : 40, doOutline ? 40 - savedOptions.pups_glow_outline_linewidth * 2: 40);
spriteCtx.globalCompositeOperation = 'source-over';
}
if (savedOptions.pups_filter) {
spriteCtx.filter = savedOptions.pups_filter;
//spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
// spriteCtx.globalCompositeOperation = 'destination-out';
// spriteCtx.filter = 'none';
// spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
// spriteCtx.globalCompositeOperation = 'source-over';
}
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, doOutline ? savedOptions.pups_glow_outline_linewidth : 0, doOutline ? savedOptions.pups_glow_outline_linewidth : 0, doOutline ? 40 - savedOptions.pups_glow_outline_linewidth * 2 : 40, doOutline ? 40 - savedOptions.pups_glow_outline_linewidth * 2: 40);
if (doOutline) {
let outlineColor;
if (tileId === 6.1) outlineColor = savedOptions.pups_glow_outline_color_jj === 'auto' ? averageTileColors.jj : savedOptions.pups_glow_outline_color_jj; // '#49dfff'
else if (tileId === 6.2) outlineColor = savedOptions.pups_glow_outline_color_rb === 'auto' ? averageTileColors.rb : savedOptions.pups_glow_outline_color_rb; // '#ff9a63'
else if (tileId === 6.3) outlineColor = savedOptions.pups_glow_outline_color_tp === 'auto' ? averageTileColors.tp : savedOptions.pups_glow_outline_color_tp; // '#40ff40'
else outlineColor = '#ffffff';
spriteCtx.filter = 'none';
spriteCtx.strokeStyle = hexToRgbA(outlineColor, savedOptions.pups_glow_outline_opacity);
spriteCtx.lineWidth = savedOptions.pups_glow_outline_linewidth;
spriteCtx.beginPath();
spriteCtx.arc(20, 20, 15 - savedOptions.pups_glow_outline_linewidth / 2, 0, Math.PI * 2);
spriteCtx.stroke();
}
} else {
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
}
imageCache[tileId] = PIXI.Texture.from(spriteCanvas);
PIXI.utils.TextureCache[tileId] = imageCache[tileId];
spriteCanvas = null;
spriteCtx = null;
} else if (baseTileId === 10) { //bombs
let spriteCanvas = createCanvas(canvas_size, canvas_size);
let spriteCtx = spriteCanvas.getContext('2d');
spriteCtx.translate(canvas_center - 20, canvas_center - 20);
if (tileId != 10.1) { // don't draw for inactive bombs
if (savedOptions.bombs_filter) {
// separate out the "drop-shadow" component if it is present
let filter = savedOptions.bombs_filter;
let shadowFilter = '';
let hasShadow;
spriteCtx.filter = filter;
if (savedOptions.bombs_filter !== '') {
let regexp = /drop-shadow\(.+?\)($|\s)/ig;
hasShadow = savedOptions.bombs_filter.match(regexp);
if (hasShadow) {
for (let i = 0; i < hasShadow.length; i++) {
shadowFilter = shadowFilter + hasShadow[i];
}
shadowFilter.trim();
}
}
if (hasShadow && shadowFilter) {
spriteCtx.filter = shadowFilter;
// draw with shadow...
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
// remove "centre"...
spriteCtx.filter = 'none';
spriteCtx.globalCompositeOperation = 'destination-out';
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
spriteCtx.globalCompositeOperation = 'source-over';
// set new filter without the shadow...
filter = filter.replace(shadowFilter, '');
spriteCtx.filter = filter;
}
}
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
} else {
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
}
imageCache[tileId] = PIXI.Texture.from(spriteCanvas);
PIXI.utils.TextureCache[tileId] = imageCache[tileId];
spriteCanvas = null;
spriteCtx = null;
} else if (tileId === 3 || tileId === 4 || tileId === 16) { //flags
let spriteCanvas = createCanvas(40, 40);
let spriteCtx = spriteCanvas.getContext('2d');
if (savedOptions.flags_glow) {
let target = tileId === 3 ? 'red' : tileId === 4 ? 'blue' : 'yellow';
let glowColor;
if (savedOptions['flags_glow_color_' + target] === 'auto') {
let color = tinycolor(averageTileColors[target + 'flag']);
let brightness = color.getBrightness();
glowColor = color.saturate(100).brighten((255 - brightness) / 255 * 40).toHexString();
} else {
glowColor = savedOptions['flags_glow_color_' + target];
}
spriteCtx.filter = 'drop-shadow(0px 0px 2px ' + glowColor + ')';
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
} else {
spriteCtx.drawImage(tilesImage, tagpro.tiles[tileId].x*40, tagpro.tiles[tileId].y*40, 40, 40, 0, 0, 40, 40);
}
imageCache[tileId] = PIXI.Texture.from(spriteCanvas);
PIXI.utils.TextureCache[tileId] = imageCache[tileId];
if (tileId === 3) {
PIXI.utils.TextureCache['redflag'] = imageCache[tileId]; //for the flag carrier sprite
} else if (tileId === 4) {
PIXI.utils.TextureCache['blueflag'] = imageCache[tileId];
} else if (tileId === 16) {
PIXI.utils.TextureCache['yellowflag'] = imageCache[tileId];
}
spriteCanvas = null;
spriteCtx = null;
}
}
}
function drawGlowDynamicTile(tileId, xPos, yPos) {
if (!imageCache[tileId]) {
drawCustomTiles(tileId);
}
let sprite = new PIXI.Sprite(imageCache[tileId]);
sprite.position.x = xPos;
sprite.position.y = yPos;
tr.layers.midground.addChild(sprite);
return sprite;
}
tr.drawDynamicTile = function(x, y, tileId) {
tileId = tileId || tagpro.map[x][y];
let tile = tagpro.tiles[tileId];
if (!tile || tileId <= 2 || (skipTileIds.indexOf(tileId) >= 0 && (!isEvent || isEvent && !isHalloween))) { // && !isBirthday
return;
}
let drawPos = { x:x * 40, y:y * 40 };
let sprite;
if (tile instanceof PIXI.extras.AnimatedSprite || tile.frameTiles) { //boosts/portals or respawn blinking
const tileIdBase = Math.floor(tileId);
if ((savedOptions.boosts_generic || savedOptions.boosts_glow || savedOptions.boosts_generic_filter !== '') && (tileIdBase === 5 || tileIdBase === 14 || tileIdBase === 15)) {
drawPos.x = drawPos.x - 44; //128px canvas size
drawPos.y = drawPos.y - 44;
} else if (savedOptions.portals_generic && (tileIdBase === 13 || tileIdBase === 24 || tileIdBase === 25)) {
drawPos.x = drawPos.x - 12; //64px canvas size
drawPos.y = drawPos.y - 12;
} else if ((savedOptions.pups_glow || savedOptions.pups_bottom_shadow || savedOptions.pups_glow_outline || savedOptions.pups_filter) && (tileId == 6.11 || tileId == 6.21 || tileId == 6.31 || tileId == 6.41) || (savedOptions.bombs_filter || savedOptions.bombs_outline) && tileId == 10.11) {
drawPos.x = drawPos.x - 44; //20; //40px canvas size
drawPos.y = drawPos.y - 44;
}
sprite = tr.drawAnimation(tile, drawPos);
} else if (tile.dynamic) { //bombs/gates/flags/pups
if ((savedOptions.gates_glow) && (tileId === 9.1 || tileId === 9.2 || tileId === 9.3)) { // || savedOptions.gates_glow_outline
sprite = drawGlowDynamicTile(tileId, drawPos.x - 44, drawPos.y - 44);
} else if ((savedOptions.flags_glow || savedOptions.flags_outline) && (tileId === 3 || tileId === 4 || tileId === 16)) {
sprite = drawGlowDynamicTile(tileId, drawPos.x, drawPos.y);
} else if ((savedOptions.bombs_filter || savedOptions.bombs_outline) && (tileId == 10 || tileId == 10.1)) {
sprite = drawGlowDynamicTile(tileId, drawPos.x - 44, drawPos.y - 44);
} else if ((savedOptions.pups_glow || savedOptions.pups_bottom_shadow || savedOptions.pups_glow_outline || savedOptions.pups_filter) && (tileId == 6 || tileId == 6.1 || tileId == 6.2 || tileId == 6.3 || tileId == 6.4 || tileId == 'grip' || tileId == 'bomb' || tileId == 'tagpro')) {
sprite = drawGlowDynamicTile(tileId, drawPos.x - 44, drawPos.y - 44);
} else {
sprite = tagpro.tiles.draw(tr.layers.midground, tileId, drawPos, 40, 40);
}
if (tileId === 22) { // introduced in Halloween Event 2021
tr.createGravityWellEmitter(drawPos.x + 20, drawPos.y + 20);
}
} else {
return;
}
if (!tr.dynamicSprites[x]) tr.dynamicSprites[x] = {};
tr.dynamicSprites[x][y] = sprite;
};
let original_updateDynamicTile = tr.updateDynamicTile;
tr.updateDynamicTile = function(update) {
//this fixes the bug where a dynamic tile gets drawn twice...
if (!tr.dynamicSprites[update.x] && !tr.layers.backgroundDrawn) {
setTimeout(tr.updateDynamicTile, 25, update);
return;
}
return original_updateDynamicTile.apply(this, arguments);
};
let chat_resize = function() {
let viewportOffset = $("#viewport").offset();
let viewportHeight = $("#viewport").height();
$("#chat").css({
left: viewportOffset.left + 5,
top: viewportOffset.top + viewportHeight - 35
});
$("#chatHistory").css({
left: viewportOffset.left + 5,
top: viewportOffset.top + viewportHeight - $("#chatHistory").outerHeight() - 45
});
}
tagpro.chat.resize = chat_resize;
//Expand the Viewport when Spectating...
let gotSettings = false;
tagpro.socket.on('settings', function() { //`settings` comes through just after `spectator` (so tagpro.spectator should be already set)
if (!gotSettings && tagpro.spectator) { // && defaultValues.globalOptions.expand_viewport
let zoomedOut = 1;
let zoomState;
let resizeVP = function(maximiseVP = false) {
if (maximiseVP) {
tr.canvas_width = $(window).width() - (80 + savedOptions.vpcss_padding_x * 2);
tr.canvas_height = $(window).height() - (40 + savedOptions.vpcss_padding_y * 2);
$('#viewport').css({ 'left': ($(window).width() - tr.canvas_width) / 2, 'top': ($(window).height() - tr.canvas_height) / 2 });
tr.resizeAndCenterView();
const xRatio = mapWidth / $('#viewport').width();
const yRatio = mapHeight / $('#viewport').height();
tagpro.zoom = Math.max(xRatio, yRatio, 1) * 1.08; // + 3% extra zoomed out (slightly smaller)
zoomedOut = tagpro.zoom;
zoomState = false;
} else {
tr.canvas_width = 1280;
tr.canvas_height = 800;
$('#viewport').css({ 'left': ($(window).width() - tr.canvas_width) / 2, 'top': ($(window).height() - tr.canvas_height) / 2 });
tr.resizeAndCenterView();
zoomState = true;
}
};
let keys = [81, 87, 65, 83, 90, 67, 107, 109]; //q, w, a, s, z, c, -, +
let handleKeydown = (e) => {
if (tagpro.spectator && keys.includes(e.which)) {
if (e.which === 67) { //c
resizeVP(zoomState ? false : true);
} else if (e.which === 90) { //z
if (zoomState) {
tagpro.zoom = zoomedOut;
} else {
tagpro.zoom = 1;
}
zoomState = !zoomState;
} else {
tagpro.zoom = 1;
}
}
};
if (defaultValues.globalOptions.expand_viewport) {
resizeVP(true);
document.addEventListener('keydown', handleKeydown);
}
tagpro.socket.on('spectator', function(data) {
if (data.type === false) {
if (defaultValues.globalOptions.expand_viewport) {
resizeVP(false);
}
document.removeEventListener('keydown', handleKeydown);
if (savedOptions.vpcss_only_apply_in_game) {
updateCSSViewport();
setTimeout(tagpro.chat.resize, 400);
}
}
});
if (!savedOptions.vpcss_only_apply_in_game) {
updateCSSViewport();
setTimeout(tagpro.chat.resize, 1000);
}
gotSettings = true;
} else if (!tagpro.spectator) { // && (savedOptions.vpcss_padding_x > 0 || savedOptions.vpcss_padding_y > 0)) {
updateCSSViewport();
setTimeout(tagpro.chat.resize, 1000);
}
});
//Make the viewport transparent...
if (defaultValues.globalOptions.transparent_viewport) {
//https://pixijs.download/v5.3.4/docs/PIXI.Renderer.html
tr.createRenderer = function() {
let options = {
width: 1280, //PIXI:800
height: 800, //PIXI:600
//view: tr.canvas, //no view set because: https://github.com/pixijs/pixi.js/issues/2233#issuecomment-449105397
transparent: true, //PIXI:false (TagPro:false)
antialias: true, //PIXI:false (TagPro:true)
//forceCanvas: tr.options.forceCanvasRenderer, //PIXI:false
powerPreference: 'high-performance', //for devices with dual graphics cards the faster card will be preferred
backgroundColor: 0x000000, //PIXI:0x000000
clearBeforeRender: true, //PIXI:true
preserveDrawingBuffer: false, //PIXI:false
//roundPixels: false, //PIXI:false
//legacy: false //PIXI:false
};
return tr.options.forceCanvasRenderer ? new PIXI.CanvasRenderer(options) : PIXI.autoDetectRenderer(options);
};
tr.renderer.destroy(true); //destroy the old renderer and remove the canvas from the DOM
tr.renderer = tr.createRenderer(); //create a new renderer using the options above
document.querySelector('.game').prepend(tr.renderer.view); //add the PIXI canvas to the DOM
document.querySelector('canvas').setAttribute('id', 'viewport'); //give it an id
tr.canvas = tr.renderer.view;
tr.resizeAndCenterView();
updateCSSBackground();
} else {
setTimeout(function() {
updateCSSBackground();
tagpro.chat.resize();
}, 1500);
}
tr.options.disableBallSpin = !defaultValues.globalOptions.ball_spin;
//Get some useful map data...
tagpro.rawSocket.on('map', getMapData);
function getMapData(data) {
//console.log('PM:: map data:', data);
PM_Loading.html('<div>Loading Map...</div>');
mapWidth = tagpro.map.length * 40;
mapHeight = tagpro.map[0].length * 40;
for (let x=0; x<tagpro.map.length; x++) {
for (let y=0; y<tagpro.map[x].length; y++) {
const tileId = tagpro.map[x][y];
if (tileId > 2) { //ignore: empty, floor & wall tiles
if (tileId < 10) {
if (tileId == 3 || tileId == 3.1) { //red flag
elementPositions.redflag.push({ x:x*40, y:y*40 });
} else if (tileId == 4 || tileId == 4.1) { //blue flag
elementPositions.blueflag.push({ x:x*40, y:y*40 });
} else if (tileId == 5 || tileId == 5.1 || tileId == 5.11) { //neutral boost
elementPositions.boosts.yellow.push({ x:x*40, y:y*40 });
} else if (tileId == 6 || tileId == 6.1 || tileId == 6.11 || tileId == 6.12 || tileId == 6.2 || tileId == 6.21 || tileId == 6.22 || tileId == 6.3 || tileId == 6.31 || tileId == 6.32 || tileId == 6.4 || tileId == 6.41 || tileId == 6.42) { //powerup
elementPositions.pups.push({ x:x*40, y:y*40 });
} else if (tileId == 7) { //spike
elementPositions.spikes.push({ x:x*40, y:y*40 });
} else if (tileId == 8) { //button
elementPositions.buttons.push({ x:x*40, y:y*40 });
} else if (tileId == 9 || tileId == 9.1 || tileId == 9.2 || tileId == 9.3) { //gate
elementPositions.gates.push({ x:x*40, y:y*40 });
}
} else {
if (tileId == 10 || tileId == 10.1 || tileId == 10.11) { //bomb
elementPositions.bombs.push({ x:x*40, y:y*40 });
} else if (tileId == 11) { //red teamtile
elementPositions.teamred.push({ x:x*40, y:y*40 });
} else if (tileId == 12) { //blue teamtile
elementPositions.teamblue.push({ x:x*40, y:y*40 });
} else if (tileId == 13 || tileId == 13.1 || tileId == 13.11) { //portal
elementPositions.portals.push({ x:x*40, y:y*40 });
} else if (tileId == 14 || tileId == 14.1 || tileId == 14.11) { //red boost
elementPositions.boosts.red.push({ x:x*40, y:y*40 });
} else if (tileId == 15 || tileId == 15.1 || tileId == 15.11) { //blue boost
elementPositions.boosts.blue.push({ x:x*40, y:y*40 });
} else if (tileId == 16 || tileId == 16.1) { //yellow flag
elementPositions.yellowflag.push({ x:x*40, y:y*40 });
} else if (tileId == 17) { //red endzone
elementPositions.ezred.locs.push({ x:x*40, y:y*40 });
if (!elementPositions.ezred.x) { //use the first found redzone tile for x & y
elementPositions.ezred.x = x * 40 + 20;
elementPositions.ezred.y = y * 40 + 20;
}
} else if (tileId == 18) { //blue endzone
elementPositions.ezblue.locs.push({ x:x*40, y:y*40 });
} else if (tileId == 24 || tileId == 24.1 || tileId == 24.11) { //red portal
elementPositions.portalsred.push({ x:x*40, y:y*40 });
} else if (tileId == 25 || tileId == 25.1 || tileId == 25.11) { //blue portal
elementPositions.portalsblue.push({ x:x*40, y:y*40 });
} else if (tileId == 22) { //gravityWell
elementPositions.gravityWells.push({ x:x*40, y:y*40 });
} else if (tileId == 23) { //yellow teamtile
elementPositions.teamyellow.push({ x:x*40, y:y*40 });
}
}
}
}
}
//detect the type of map rotation...
let testTile = elementPositions.redflag;
let checkTileId = 4; //blueflag id
let isVertical = true; //will rule them out as necessary
let isHorizontal = true;
let isRotational = true;
let is4Way = true;
if (elementPositions.yellowflag.length) {
testTile = elementPositions.ezred.locs;
checkTileId = 18; //blue endzone id
}
if (testTile.length) {
for (let i=0; i<testTile.length; i++) {
const redtileid = tagpro.map[testTile[i].x / 40][testTile[i].y / 40];
let bluex = testTile[i].x / 40;
let bluey = (mapHeight - testTile[i].y) / 40 - 1;
let bluetileid = tagpro.map[bluex][bluey];
if (Math.floor(bluetileid) !== checkTileId) {
isVertical = false;
bluex = (mapWidth - testTile[i].x) / 40 - 1;
bluey = testTile[i].y / 40;
bluetileid = tagpro.map[bluex][bluey];
if (Math.floor(bluetileid) !== checkTileId) {
isHorizontal = false;
bluex = (mapWidth - testTile[i].x) / 40 - 1;
bluey = (mapHeight - testTile[i].y) / 40 - 1;
bluetileid = tagpro.map[bluex][bluey];
if (Math.floor(bluetileid) !== checkTileId) {
isRotational = false;
}
} else {
isRotational = false;
}
} else {
isHorizontal = false;
isRotational = false;
}
}
if (isVertical && isHorizontal) {
is4Way = true;
isVertical = false;
isHorizontal = false;
} else {
is4Way = false;
}
if (isVertical) {
elementPositions.halfway.y = (tagpro.map[0].length / 2) * 40;
} else if (isHorizontal) {
elementPositions.halfway.x = (tagpro.map.length / 2) * 40;
} else {
if (tagpro.map[0].length > tagpro.map.length) { //map height > width
elementPositions.halfway.y = (tagpro.map[0].length / 2) * 40;
} else { //map width >= height
elementPositions.halfway.x = (tagpro.map.length / 2) * 40;
}
}
} else {
if (tagpro.map[0].length > tagpro.map.length) { //map height > width
elementPositions.halfway.y = (tagpro.map[0].length / 2) * 40;
} else { //map width >= height
elementPositions.halfway.x = (tagpro.map.length / 2) * 40;
}
}
if (elementPositions.yellowflag.length) {
if (isRotational) {
elementPositions.ezblue.x = Math.abs(tagpro.map.length * 40 - elementPositions.ezred.x) - 20;
elementPositions.ezblue.y = Math.abs(tagpro.map[0].length * 40 - elementPositions.ezred.y) - 20;
} else {
if (elementPositions.halfway.x) {
elementPositions.ezblue.x = Math.abs(tagpro.map.length * 40 - elementPositions.ezred.x) - 20;
elementPositions.ezblue.y = elementPositions.ezred.y;
} else {
elementPositions.ezblue.x = elementPositions.ezred.x;
elementPositions.ezblue.y = Math.abs(tagpro.map[0].length * 40 - elementPositions.ezred.y) - 20;
}
}
}
elementPositions.mapInfo = data.info;
tagpro.rawSocket.removeListener('map', getMapData);
}
//draw to canvas functions...
function addGradientPattern(ctx, width, height, type, color, opacity, count=30, globalCompositeOperation='source-atop') {
let tempCanvas = createCanvas(ctx.canvas.width, ctx.canvas.height);
let tempCtx = tempCanvas.getContext('2d');
let gradient;
let co1 = hexToRgbA(color, opacity);
let co2 = hexToRgbA(color, 0);
let half_width = width / 2;
let half_height = height / 2;
let max_width_height = Math.max(width, height);
ctx.save();
ctx.globalCompositeOperation = globalCompositeOperation;
if (type === 'value-crosshatch') {
gradient = tempCtx.createLinearGradient(0, max_width_height / 2, max_width_height, max_width_height / 2);
} else if (type === 'value-crisscross') {
gradient = tempCtx.createLinearGradient(0, 0, max_width_height, max_width_height);
} else if (type === 'value-widecircles') {
gradient = tempCtx.createRadialGradient(half_width, half_height, 0, half_width, half_height, Math.sqrt(max_width_height * max_width_height * 2) / 2);
} else if (type === 'value-vstripes') {
gradient = tempCtx.createLinearGradient(0, half_height, width, half_height);
} else if (type === 'value-hstripes') {
gradient = tempCtx.createLinearGradient(half_width, 0, half_width, height);
} else if (type === 'value-stripes') {
if (elementPositions.halfway.x) gradient = tempCtx.createLinearGradient(0, half_height, width, half_height);
else gradient = tempCtx.createLinearGradient(half_width, 0, half_width, height);
} else if (type === 'value-diagonal') {
gradient = tempCtx.createLinearGradient(0, 0, max_width_height, max_width_height);
} else if (type === 'value-rdiagonal') {
gradient = tempCtx.createLinearGradient(max_width_height, 0, 0, max_width_height);
}
if (gradient) {
let gradientInterval = 1 / (max_width_height / count); // / 2
let i = gradientInterval;
let alt = true;
gradient.addColorStop(0, co1);
while (i < 1) {
if (alt) gradient.addColorStop(i, co2);
else gradient.addColorStop(i, co1);
i += gradientInterval;
alt = !alt;
}
gradient.addColorStop(1, co1);
tempCtx.fillStyle = gradient;
tempCtx.fillRect(0, 0, width, height);
gradient = null;
}
if (type === 'value-crosshatch') {
gradient = tempCtx.createLinearGradient(max_width_height / 2, 0, max_width_height / 2, max_width_height);
} else if (type === 'value-crisscross') {
gradient = tempCtx.createLinearGradient(max_width_height, 0, 0, max_width_height);
}
if (gradient) {
let gradientInterval = 1 / (max_width_height / count); // / 2
let i = gradientInterval;
let alt = true;
gradient.addColorStop(0, co1);
while (i < 1) {
if (alt) gradient.addColorStop(i, co2);
else gradient.addColorStop(i, co1);
i += gradientInterval;
alt = !alt;
}
gradient.addColorStop(1, co1);
tempCtx.fillStyle = gradient;
tempCtx.fillRect(0, 0, width, height);
gradient = null;
}
ctx.drawImage(tempCanvas, 0, 0);
ctx.globalCompositeOperation = 'source-over';
ctx.restore();
tempCanvas = null;
tempCtx = null;
}
//--------------------------------------------------------------------
//FROM: https://thesoftwaresimpleton.com/blog/2015/10/31/perpendicular
//Below are two helper functions that take javascript point objects as arguments with x and y properties that map to coordinates and return either a gradient/slope or the perpendicular gradient/slope that occurrs between the 2 coordinates:
const gradient = function(a, b) {
return (b.y - a.y) / (b.x - a.x)
}
const perpendicularGradient = function(a, b) {
return -1 / gradient(a, b)
}
//Below is a helper function to find the midpoint between two vertices or points:
const midpoint = function(a, b) {
return { x: (a.x + b.x) / 2, y: (a.y + b.y) / 2 }
}
//Below is a function that will find the y-intercept given a vertex and a gradient/slope:
//You can think of the below function as rearranging y = mx + c to solve for c or c = y - mx.
function getYIntercept(vertex, slope) {
return vertex.y - slope * vertex.x
}
//Below is the code that brings this all together:
//The finshed function looks like this and there are a number of if statements I had to add for the conditions when the slope or gradient function might end up undefined or equalling infinity when it encounters horizontal or vertical values that have catches with the formula. I would love to know if there is an algorithm that will avoid such checks:
function perpendicularBisector(a, b) {
const slope = perpendicularGradient(a, b),
midPoint = midpoint(a, b),
yIntercept = getYIntercept(midPoint, slope),
xIntercept = -yIntercept / slope
return { vertex: midPoint, slope: slope, yIntercept: yIntercept, xIntercept: xIntercept }
}
//Flip the y-axis origin from bottom-left (as in the above functions) to top-left (canvas)
function adjustY(y, height) {
return -y + height;
}
//--------------------------------------------------------------------
function addGradient(ctx, x1, y1, width, height, type, color1, color2, opacity1, opacity2, repeats='0', size=100) {
let gradient;
ctx.save();
if (type === 'centerline') {
if (elementPositions.halfway.x) {
gradient = ctx.createLinearGradient(x1, 0, x1 + width, 0);
} else {
gradient = ctx.createLinearGradient(0, y1, 0, y1 + height);
}
} else if (type === 'flags') { //TODO: there may still be bugs here??? (when multiple flags or no flags)
if (elementPositions.yellowflag.length === 1) {
gradient = ctx.createLinearGradient(elementPositions.ezred.x + 20, elementPositions.ezred.y, elementPositions.ezblue.x, elementPositions.ezblue.y);
}
if (elementPositions.redflag.length === 1 && elementPositions.blueflag.length === 1) {
gradient = ctx.createLinearGradient(elementPositions.redflag[0].x + 20, elementPositions.redflag[0].y + 20, elementPositions.blueflag[0].x + 20, elementPositions.blueflag[0].y + 20);
}
} else if (type === 'diagonal') {
let pB = perpendicularBisector({ x:x1, y:adjustY(y1,height) }, { x:width, y:adjustY(height,height) });
gradient = ctx.createLinearGradient(x1, pB.yIntercept, width, -pB.yIntercept+height);
} else if (type === 'rdiagonal') {
let pB = perpendicularBisector({ x:x1, y:adjustY(height,height) }, { x:width, y:adjustY(y1,height) });
gradient = ctx.createLinearGradient(x1, pB.yIntercept, width, -pB.yIntercept+height);
} else if (type === 'centercircle') {
let half_width = width / 2;
let half_height = height / 2;
gradient = ctx.createRadialGradient(half_width, half_height, 0, half_width, half_height, Math.sqrt(Math.max(width, height) * Math.max(width, height) * 2) / 2);
}
if (!gradient) {
if (elementPositions.halfway.x) {
gradient = ctx.createLinearGradient(x1, 0, x1 + width, 0);
} else {
gradient = ctx.createLinearGradient(0, y1, 0, y1 + height);
}
}
let co1 = hexToRgbA(color1, opacity1);
let co2 = hexToRgbA(color2, opacity2);
if (repeats === '0') {
gradient.addColorStop(0, co1);
gradient.addColorStop(1, co2);
} else if (size !== 100) {
let stop0 = 0.5 - size / 2 / 100;
let stop1 = 0.5 + size / 2 / 100;
gradient.addColorStop(stop0, co1);
gradient.addColorStop(0.5, co2);
gradient.addColorStop(stop1, co1);
} else {
let gradientInterval = 1 / repeats;
let i = gradientInterval;
let alt = true;
gradient.addColorStop(0, co1);
while (i < 1) {
if (alt) {
gradient.addColorStop(i, co2);
alt = false;
} else {
gradient.addColorStop(i, co1);
alt = true;
}
i += gradientInterval;
}
gradient.addColorStop(1, co1);
}
ctx.fillStyle = gradient;
ctx.fillRect(x1, y1, width, height);
ctx.restore();
}
let getNewSize = function(w, h, a){
const rads = a * Math.PI / 180;
let c = Math.cos(rads);
let s = Math.sin(rads);
let size = {};
if (s < 0) s = -s;
if (c < 0) c = -c;
size.width = h * s + w * c;
size.height = h * c + w * s ;
return size;
};
function addCheckered(ctx, mapWidth, mapHeight, size=40, margin=0, color='#000000', minOpacity=0.05, maxOpacity=0.2, density=1, normal=true, random=false, straight=false, stripes=false, stripespattern='', globalCompositeOperation='source-over', circles=false, rotate=0, blur=0) {
if (stripes && size === 1) return;
ctx.save();
ctx.globalCompositeOperation = globalCompositeOperation;
const size_plus_margin = size + margin;
const size_plus_margin2 = size + margin * 2;
const margin_div_2 = margin / 2;
if (random) {
let pattern_size = (size_plus_margin2) * Math.floor(400 / size_plus_margin2);
let mid_pattern = (pattern_size / 2);
//using these smaller temp canvases then rotating & repeating speeds up the draw by a ton...
let tempCanvas;
let tempCtx;
let tempCanvas1 = createCanvas(pattern_size, pattern_size);
let tempCtx1 = tempCanvas1.getContext('2d');
let tempCanvas2 = createCanvas(pattern_size, pattern_size);
let tempCtx2 = tempCanvas2.getContext('2d');
let minOpacitee = Math.floor(Math.max(minOpacity, maxOpacity) / 2) * 100;
let maxOpacitee = Math.max(minOpacity, maxOpacity) * 100;
let adjSize;
if (!circles && rotate > 0) {
adjSize = getNewSize(size_plus_margin, size_plus_margin, rotate);
tempCanvas = createCanvas(adjSize.width, adjSize.height);
tempCtx = tempCanvas.getContext('2d');
tempCtx.translate(adjSize.width / 2, adjSize.height / 2);
tempCtx.rotate(rotate * Math.PI / 180);
tempCtx.translate(-adjSize.width / 2, -adjSize.height / 2);
tempCtx.fillStyle = color;
tempCtx.fillRect((adjSize.width - size) / 2, (adjSize.height - size) / 2, size, size);
}
tempCtx1.beginPath();
for (let i=0; i<pattern_size; i+=size_plus_margin2) {
for (let j=0; j<pattern_size; j+=size_plus_margin2) {
if (Math.random() < density) {
let opacitee = getRandomInt(minOpacitee, maxOpacitee) / 100;
tempCtx1.fillStyle = hexToRgbA(color, opacitee);
tempCtx1.beginPath();
if (circles) {
tempCtx1.arc(i + size_plus_margin2 / 2, j + size_plus_margin2 / 2, size / 2, 0, Math.PI * 2);
tempCtx1.fill();
} else {
if (rotate > 0) {
tempCtx1.globalAlpha = opacitee;
tempCtx1.drawImage(tempCanvas, 0, 0, adjSize.width, adjSize.height, i, j, size_plus_margin, size_plus_margin); //draw to scale
} else {
tempCtx1.fillRect(i+margin, j+margin, size, size);
}
}
}
}
}
let rotate_angle = 90 * Math.PI / 180;
for (let i=0; i<mapWidth; i+=pattern_size) {
for (let j=0; j<mapHeight; j+=pattern_size) {
tempCtx2.clearRect(0, 0, pattern_size, pattern_size);
tempCtx2.translate(mid_pattern, mid_pattern);
tempCtx2.rotate(rotate_angle);
tempCtx2.translate(-mid_pattern, -mid_pattern);
tempCtx2.drawImage(tempCanvas1, 0, 0);
if (blur > 0) ctx.filter = 'blur(' + blur + 'px)';
ctx.drawImage(tempCanvas2, i, j);
}
}
ctx.filter = 'none';
tempCanvas = null;
tempCtx = null;
tempCanvas1 = null;
tempCtx1 = null;
tempCanvas2 = null;
tempCtx2 = null;
}
if (stripes) {
let divisions = size;
let division_size = Math.max(mapWidth, mapHeight) / divisions;
let x2 = mapWidth > mapHeight ? division_size : mapWidth;
let y2 = mapWidth > mapHeight ? mapHeight : division_size;
ctx.fillStyle = hexToRgbA(color, maxOpacity);
if (margin > 0) ctx.filter = 'blur(' + margin + 'px)';
for (let i=0; i<divisions; i+=2) {
let x1 = mapWidth > mapHeight ? i * division_size : 0;
let y1 = mapWidth > mapHeight ? 0 : i * division_size;
ctx.fillRect(x1, y1, x2, y2);
}
ctx.filter = 'none';
}
if (straight) {
let pattern_size = size_plus_margin;
let pattern = createCanvas(pattern_size, pattern_size);
let pctx = pattern.getContext('2d');
pctx.beginPath();
pctx.fillStyle = hexToRgbA(color, maxOpacity);
if (circles) {
pctx.arc(size_plus_margin / 2, size_plus_margin / 2, size / 2, 0, Math.PI * 2);
pctx.fill();
} else {
if (rotate > 0) {
let adjSize = getNewSize(pattern_size, pattern_size, rotate);
let tempCanvas = createCanvas(adjSize.width, adjSize.height);
let tempCtx = tempCanvas.getContext('2d');
tempCtx.translate(adjSize.width / 2, adjSize.height / 2);
tempCtx.rotate(rotate * Math.PI / 180);
tempCtx.translate(-adjSize.width / 2, -adjSize.height / 2);
tempCtx.fillStyle = hexToRgbA(color, maxOpacity);
tempCtx.fillRect((adjSize.width - size) / 2, (adjSize.height - size) / 2, size, size);
pctx.drawImage(tempCanvas, 0, 0, adjSize.width, adjSize.height, 0, 0, pattern_size, pattern_size); //draw to scale
tempCanvas = null;
tempCtx = null;
} else {
pctx.fillRect(margin_div_2, margin_div_2, size, size);
}
}
let patt = ctx.createPattern(pattern, 'repeat');
ctx.fillStyle = patt;
if (blur > 0) ctx.filter = 'blur(' + blur + 'px)';
ctx.fillRect(0, 0, mapWidth, mapHeight);
ctx.filter = 'none';
pattern = null;
pctx = null;
}
if (normal) {
let pattern_size = size_plus_margin * 2;
let pattern = createCanvas(size_plus_margin * 2, size_plus_margin * 2);
let pctx = pattern.getContext('2d');
pctx.beginPath();
pctx.fillStyle = hexToRgbA(color, maxOpacity);
if (circles) {
pctx.arc(size_plus_margin / 2, size_plus_margin / 2, size / 2, 0, Math.PI * 2); //top left
pctx.arc(size_plus_margin + size_plus_margin / 2, size_plus_margin + size_plus_margin / 2, size / 2, 0, Math.PI * 2); //bottom right
pctx.fill();
} else {
if (rotate > 0) {
let adjSize = getNewSize(pattern_size, pattern_size, rotate);
let adjMargin = { width:(adjSize.width / 2 - size) / 2, height:(adjSize.height / 2 - size) / 2 };
let tempCanvas = createCanvas(adjSize.width, adjSize.height);
let tempCtx = tempCanvas.getContext('2d');
pctx.closePath();
tempCtx.fillStyle = hexToRgbA(color, maxOpacity);
tempCtx.translate(adjSize.width - adjSize.width / 4, adjSize.height / 4);
tempCtx.rotate(rotate * Math.PI / 180);
tempCtx.translate(-(adjSize.width - adjSize.width / 4), -adjSize.height / 4);
tempCtx.fillRect(adjSize.width / 2 + adjMargin.width, adjMargin.height, size, size); //top right
tempCtx.setTransform(1, 0, 0, 1, 0, 0);
tempCtx.translate(adjSize.width / 4, adjSize.height - adjSize.height / 4);
tempCtx.rotate(rotate * Math.PI / 180);
tempCtx.translate(-adjSize.width / 4, -(adjSize.height - adjSize.height / 4));
tempCtx.fillRect(adjMargin.width, adjSize.height / 2 + adjMargin.height, size, size); //bottom left
pctx.drawImage(tempCanvas, 0, 0, adjSize.width, adjSize.height, 0, 0, pattern_size, pattern_size); //draw to scale
tempCanvas = null;
tempCtx = null;
} else {
pctx.fillRect(size_plus_margin + margin_div_2, margin_div_2, size, size); //top right
pctx.fillRect(margin_div_2, size_plus_margin + margin_div_2, size, size); //bottom left
}
}
let patt = ctx.createPattern(pattern, 'repeat');
ctx.fillStyle = patt;
if (blur > 0) ctx.filter = 'blur(' + blur + 'px)';
ctx.fillRect(0, 0, mapWidth, mapHeight);
ctx.filter = 'none';
patt = null;
pattern = null;
pctx = null;
}
ctx.globalCompositeOperation = 'source-over';
ctx.restore();
}
function addGrid(ctx, mapWidth, mapHeight, size=40, length=40, lineWidth=1, color=averageTileColors.actualFloorAlt, opacity=0.05, square=false, rectangles=false, lines=false, diagonal=false, crosses=false, shadow=false, globalCompositeOperation='source-over') {
let pattern = createCanvas(size, size);
let pctx = pattern.getContext('2d');
ctx.save();
ctx.globalCompositeOperation = globalCompositeOperation;
pctx.strokeStyle = hexToRgbA(color, opacity);
pctx.lineWidth = lineWidth;
if (diagonal) {
pctx.beginPath();
pctx.moveTo(size / 2 - length / 2, size / 2 - length / 2);
pctx.lineTo(size / 2 + length / 2, size / 2 + length / 2);
pctx.moveTo(size / 2 + length / 2, size / 2 - length / 2);
pctx.lineTo(size / 2 - length / 2, size / 2 + length / 2);
pctx.stroke();
}
if (square || lines || rectangles) {
pctx.translate(0.5, 0.5);
pctx.beginPath();
if (lines) {
pctx.moveTo(0 - lineWidth, size / 2);
pctx.lineTo(size - (size - length) + lineWidth, size / 2);
pctx.stroke();
}
if (square || rectangles) {
pctx.moveTo(0, size - (size - length));
pctx.lineTo(0, 0);
pctx.lineTo(size - (size - length), 0);
if (rectangles) {
pctx.moveTo(0, size / 2);
pctx.lineTo(size - (size - length), size / 2);
}
pctx.stroke();
}
pctx.translate(-0.5, -0.5);
}
if (crosses) {
pctx.translate(0.5, 0.5);
pctx.beginPath();
pctx.moveTo(0, length);
pctx.lineTo(0, 0);
pctx.lineTo(length, 0);
pctx.moveTo(size - length, 0);
pctx.lineTo(size, 0);
pctx.lineTo(size, length);
pctx.moveTo(size, size - length);
pctx.lineTo(size, size);
pctx.lineTo(size - length, size);
pctx.moveTo(length, size);
pctx.lineTo(0, size);
pctx.lineTo(0, size - length);
pctx.stroke();
pctx.translate(-0.5, -0.5);
}
let patt = ctx.createPattern(pattern, 'repeat');
ctx.fillStyle = patt;
if (shadow) {
ctx.filter = shadow;
ctx.fillRect(0, 0, mapWidth, mapHeight);
ctx.filter = 'none';
}
ctx.fillRect(0, 0, mapWidth, mapHeight);
ctx.restore();
ctx.globalCompositeOperation = 'source-over';
pattern = null;
pctx = null;
}
function drawCircle(ctx, linewidth, radius, color, opacity, useGradient, dashsize, blur, x, y, fill=false, glow=0, glowMultiplier=1, gradientType=1, startAngle=0) {
ctx.save();
ctx.beginPath();
ctx.arc(x, y, radius, startAngle, 2 * Math.PI + startAngle);
if (fill) {
if (blur > 0) {
ctx.filter = 'blur(' + blur + 'px)';
}
if (useGradient) {
let radialGradient = ctx.createRadialGradient(x, y, 0, x, y, radius);
radialGradient.addColorStop(0, hexToRgbA(color, opacity));
radialGradient.addColorStop(1, hexToRgbA(color, 0));
ctx.fillStyle = radialGradient;
} else {
ctx.fillStyle = hexToRgbA(color, opacity);
}
ctx.fill();
}
if (linewidth > 0) {
let filter = '';
ctx.lineWidth = linewidth;
if (Array.isArray(dashsize)) ctx.setLineDash(dashsize);
else if (dashsize > 0) ctx.setLineDash([dashsize]);
if (useGradient) {
let radialGradient = ctx.createRadialGradient(x, y, radius - linewidth / 2, x, y, +radius + linewidth / 2);
if (gradientType === 1) {
radialGradient.addColorStop(0, hexToRgbA(color, opacity));
radialGradient.addColorStop(1, hexToRgbA(color, 0));
} else if (gradientType === 2) {
radialGradient.addColorStop(0, hexToRgbA(color, opacity));
radialGradient.addColorStop(0.5, hexToRgbA(color, 0));
radialGradient.addColorStop(1, hexToRgbA(color, opacity));
} else if (gradientType === 3) {
radialGradient.addColorStop(0, hexToRgbA(color, 0));
radialGradient.addColorStop(0.5, hexToRgbA(color, opacity));
radialGradient.addColorStop(1, hexToRgbA(color, 0));
} else if (gradientType === 4) {
radialGradient.addColorStop(0, hexToRgbA(color, 0));
radialGradient.addColorStop(1, hexToRgbA(color, opacity));
}
ctx.strokeStyle = radialGradient;
} else {
if (glow > 0) {
let filterr = ' drop-shadow(0 0 ' + glow + 'px ' + color +')';
for (let i = 1; i < glowMultiplier; i++) {
filter += filterr;
}
color = '#ffffff'
}
ctx.strokeStyle = hexToRgbA(color, opacity);
}
if (blur > 0) {
filter += ' blur(' + blur + 'px)';
}
if (filter !== '') {
ctx.filter = filter;
}
ctx.stroke();
ctx.setLineDash([]);
}
ctx.filter = 'none';
ctx.globalCompositeOperation = 'source-over';
ctx.restore();
}
function drawLine(ctx, x1, y1, x2, y2, color='#000000', lineWidth=1, dashsize=0, glow=0) {
ctx.save();
if (glow > 0) {
ctx.filter = ' drop-shadow(0 0 ' + glow + 'px ' + color +') drop-shadow(0 0 ' + glow + 'px ' + color +')';
color = '#ffffff'
}
ctx.strokeStyle = color;
ctx.lineWidth = lineWidth;
Array.isArray(dashsize) ? ctx.setLineDash(dashsize) : ctx.setLineDash([dashsize]);
if (lineWidth % 2 !== 0) ctx.translate(0.5, 0.5)
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y2);
ctx.stroke();
if (lineWidth % 2 !== 0) ctx.translate(-0.5, -0.5);
ctx.setLineDash([]);
ctx.filter = 'none';
ctx.restore();
}
function drawGlowCircle(ctx, x, y, radius, color, innerBlurRadius=5, innerOpacity=1, outerBlurRadius=12, outerOpacity=0.5, holeRadius=15, holeBlur=0) {
if (innerBlurRadius > 0 && innerOpacity > 0) {
ctx.filter = 'drop-shadow(0px 0px ' + innerBlurRadius + 'px ' + hexToRgbA(color, innerOpacity) + ')';
ctx.fillStyle = color;
ctx.beginPath();
ctx.arc(x, y, radius, 0, Math.PI * 2);
ctx.fill();
ctx.filter = 'none';
}
if (outerBlurRadius > 0 && outerOpacity > 0) {
ctx.filter = 'drop-shadow(0px 0px ' + outerBlurRadius + 'px ' + hexToRgbA(color, outerOpacity) + ') ';
ctx.fillStyle = color;
ctx.beginPath();
ctx.arc(x, y, radius, 0, Math.PI * 2);
ctx.fill();
ctx.filter = 'none';
}
if (holeRadius > 0) {
ctx.filter = 'blur(' + holeBlur + 'px)';
ctx.globalCompositeOperation = 'destination-out';
ctx.beginPath();
ctx.arc(x, y, holeRadius, 0, Math.PI * 2);
ctx.fill();
ctx.globalCompositeOperation = 'source-over';
}
ctx.filter = 'none';
}
function drawStar(ctx, start_x=20, start_y=20, lineWidth=1, strokeStyle=false, fillStyle='#ffffff', isStar=true, holeRadius=4, points=8, outer_radius=14, inner_radius=8) {
let tempCanvas = createCanvas(ctx.canvas.width, ctx.canvas.height);
let tempCtx = tempCanvas.getContext('2d');
let tempCanvasOffset = (ctx.canvas.width - start_x * 2) / 2;
tempCtx.translate(tempCanvasOffset, tempCanvasOffset);
let two_PI = Math.PI * 2;
let half_PI = Math.PI / 2;
let distance = (two_PI / points);
tempCtx.beginPath();
for (let i = 0; i <= points; i++) {
let new_outer = (i + 1) * distance;
let half_new_outer = new_outer - (distance / 2);
if (isStar && i > 0) {
tempCtx.lineTo(start_x + Math.round(Math.cos(half_new_outer - half_PI) * inner_radius), start_y + Math.round(Math.sin(half_new_outer - half_PI) * inner_radius));
}
tempCtx.lineTo(start_x + Math.round(Math.cos(new_outer - half_PI) * outer_radius), start_y + Math.round(Math.sin(new_outer - half_PI) * outer_radius));
}
tempCtx.closePath();
if (fillStyle) {
tempCtx.fillStyle = fillStyle;
tempCtx.fill();
}
if (lineWidth > 0 && strokeStyle) {
tempCtx.lineWidth = lineWidth;
tempCtx.strokeStyle = strokeStyle;
tempCtx.stroke();
}
if (holeRadius > 0) {
tempCtx.globalCompositeOperation = 'destination-out';
tempCtx.beginPath();
tempCtx.arc(start_x, start_y, holeRadius, 0, two_PI);
tempCtx.fill();
tempCtx.globalCompositeOperation = 'source-over';
}
ctx.drawImage(tempCanvas, 0, 0);
tempCanvas = null;
tempCtx = null;
}
function drawPolygon(ctx, x, y, radius, sides, lineWidth=1, strokeColor='#555555', fillColor='', rotateAngle=22.5) {
ctx.save();
if (rotateAngle === null) {
if (sides < 3) return;
else if (sides === 3) rotateAngle = 30;
else if (sides === 4) rotateAngle = 45;
else if (sides === 5) rotateAngle = 54;
else if (sides === 6) rotateAngle = 60;
else if (sides === 8) rotateAngle = 22.5;
else rotateAngle = 0;
}
rotateAngle = rotateAngle * Math.PI / 180;
let a = (Math.PI * 2) / sides;
ctx.lineCap = 'square';
ctx.lineWidth = lineWidth;
ctx.translate(x, y);
ctx.rotate(rotateAngle);
ctx.moveTo(radius, 0);
if (strokeColor || fillColor) {
ctx.beginPath();
for (let i=1; i<=sides; i++) {
ctx.lineTo(radius * Math.cos(a * i), radius * Math.sin(a * i));
}
ctx.closePath();
if (fillColor) {
ctx.fillStyle = fillColor;
ctx.fill();
}
if (strokeColor) {
ctx.strokeStyle = strokeColor;
ctx.stroke();
}
}
ctx.restore();
}
function addHexagons(ctx, width, height, size, margin, stroke, lineWidth, strokeColor, strokeOpacity, fill, fillColor, fillOpacity, globalCompositeOperation='source-over') {
ctx.save();
ctx.globalCompositeOperation = globalCompositeOperation;
if (stroke) strokeColor = hexToRgbA(strokeColor, strokeOpacity);
if (fill) fillColor = hexToRgbA(fillColor, fillOpacity);
let pattern = createCanvas(size + margin + (size + margin) * 2, Math.sqrt(3) * (size + margin));
let pctx = pattern.getContext('2d');
drawPolygon(pctx, 0, 0, size, 6, lineWidth, stroke && strokeColor, fill && fillColor, 0); //top-left
drawPolygon(pctx, pattern.width, 0, size, 6, lineWidth, stroke && strokeColor, fill && fillColor, 0); //top-right
drawPolygon(pctx, pattern.width / 2, pattern.height / 2, size, 6, lineWidth, stroke && strokeColor, fill && fillColor, 0); //center
drawPolygon(pctx, pattern.width, pattern.height, size, 6, lineWidth, stroke && strokeColor, fill && fillColor, 0); //bottom-right
drawPolygon(pctx, 0, pattern.height, size, 6, lineWidth, stroke && strokeColor, fill && fillColor, 0); //bottom-left
let patt = ctx.createPattern(pattern, 'repeat');
ctx.fillStyle = patt;
//ctx.filter = 'drop-shadow(2px 2px 0px black)';
ctx.fillRect(0, 0, mapWidth, mapHeight);
//ctx.filter = 'none';
ctx.restore();
pattern = null;
pctx = null;
}
function drawPyramid(ctx, margin, useAltStyle) {
const width = ctx.canvas.width;
const height = ctx.canvas.height;
const centerX = width / 2;
const centerY = height / 2;
const p1 = width - margin;
const p2 = height - margin;
ctx.fillStyle = useAltStyle ? 'rgba(255,255,255, 0.75)' : 'rgba(0,0,0, 0.15)'; //top
ctx.beginPath();
ctx.moveTo(margin, margin);
ctx.lineTo(p1, margin);
ctx.lineTo(centerX, centerY);
ctx.lineTo(margin, margin);
ctx.fill();
ctx.fillStyle = useAltStyle ? 'rgba(0,0,0, 0.60)' : 'rgba(0,0,0, 0.25)'; //right
ctx.beginPath();
ctx.moveTo(p1, margin);
ctx.lineTo(p1, p2);
ctx.lineTo(centerX, centerY);
ctx.lineTo(p1, margin);
ctx.fill();
ctx.fillStyle = useAltStyle ? 'rgba(0,0,0, 0.85)' : 'rgba(0,0,0, 0.35)'; //bottom
ctx.beginPath();
ctx.moveTo(p1, p2);
ctx.lineTo(margin, p2);
ctx.lineTo(centerX, centerY);
ctx.lineTo(p1, p2);
ctx.fill();
}
function drawSquare(ctx, lineWidth, margin, strokeColor, strokeOpacity, strokeOut, fillColor, fillOpacity, blur, raisedOutline) {
//const alpha = ctx.globalAlpha;
const width = ctx.canvas.width;
if (blur > 0) {
ctx.filter = 'blur(' + blur + 'px)';
}
if (fillOpacity > 0) {
ctx.fillStyle = hexToRgbA(fillColor, fillOpacity);
ctx.fillRect(+margin + lineWidth / 2, +margin + lineWidth / 2, width - margin * 2 - lineWidth, width - margin * 2 - lineWidth);
}
if (strokeOpacity > 0 || raisedOutline) {
const p1 = +margin + lineWidth / 2;
const p2 = width - margin - lineWidth / 2;
if (lineWidth > 0) {
if (strokeOut) {
ctx.globalCompositeOperation = 'destination-out';
}
ctx.globalAlpha = 1;
ctx.lineWidth = lineWidth;
ctx.lineCap = 'square';
ctx.strokeStyle = hexToRgbA(strokeColor, strokeOpacity);
ctx.beginPath();
ctx.moveTo(p1, p2);
ctx.lineTo(p1, p1);
ctx.lineTo(p2, p1);
ctx.lineTo(p2, p2);
ctx.lineTo(p1, p2);
ctx.stroke();
ctx.closePath();
}
ctx.globalCompositeOperation = 'source-over';
if (raisedOutline) {
ctx.lineWidth = 1;
ctx.strokeStyle = hexToRgbA('#ffffff', 0.5);
ctx.filter = 'none';
ctx.beginPath();
ctx.moveTo(p1, p2);
ctx.lineTo(p1, p1);
ctx.lineTo(p2, p1);
ctx.stroke();
ctx.closePath();
ctx.beginPath();
ctx.strokeStyle = hexToRgbA('#000000', 0.5);
ctx.moveTo(p2, p1);
ctx.lineTo(p2, p2);
ctx.lineTo(p1, p2);
ctx.stroke();
ctx.closePath();
}
//ctx.globalAlpha = alpha;
}
ctx.filter = 'none';
}
function drawCorners(ctx, lineWidth, size, margin, color, opacity, dropShadow, type, destinationOut, drawInCenter=false, dropShadowBlack=false) {
if (destinationOut) {
ctx.globalCompositeOperation = 'destination-out';
}
ctx.fillStyle = hexToRgbA(color, opacity);
ctx.strokeStyle = hexToRgbA(color, opacity);
if (type === 'cross') {
let width = ctx.canvas.width;
if (dropShadow) {
if (dropShadowBlack) {
color = '#000000';
}
ctx.filter = 'drop-shadow(0px 0px ' + dropShadow + 'px ' + color + ') drop-shadow(0px 0px ' + dropShadow + 'px ' + color + ')';
}
ctx.lineCap = 'round';
ctx.lineWidth = lineWidth;
ctx.beginPath();
ctx.moveTo(margin, margin);
ctx.lineTo(width - margin, width - margin);
ctx.moveTo(margin, width - margin);
ctx.lineTo(width - margin, margin);
ctx.stroke();
ctx.lineCap = 'butt';
} else if (type === 'lines') {
let width = ctx.canvas.width;
let center = width / 2;
if (dropShadow) {
if (dropShadowBlack) {
color = '#000000';
}
ctx.filter = 'drop-shadow(0px 0px 1px ' + color + ') drop-shadow(0px 0px 2px ' + color + ')';
}
ctx.lineWidth = lineWidth;
ctx.beginPath();
if (drawInCenter) {
ctx.moveTo(center, margin);
ctx.lineTo(center, size + margin);
ctx.moveTo(width - margin, center);
ctx.lineTo(width - margin - size, center);
ctx.moveTo(center, width - margin);
ctx.lineTo(center, width - margin - size);
ctx.moveTo(margin, center);
ctx.lineTo(size + margin, center);
} else {
ctx.moveTo(margin, margin);
ctx.lineTo(size + margin, size + margin);
ctx.moveTo(width - margin, margin);
ctx.lineTo(width - margin - size, size + margin);
ctx.moveTo(width - margin, width - margin);
ctx.lineTo(width - margin - size, width - margin - size);
ctx.moveTo(margin, width - margin);
ctx.lineTo(size + margin, width - margin - size);
}
ctx.stroke();
} else if (type === 'circles') {
let width = ctx.canvas.width;
let p1 = margin;
let p2 = drawInCenter ? width / 2 : margin;
if (dropShadow) {
if (dropShadowBlack) {
color = '#000000';
}
ctx.filter = 'drop-shadow(1px 1px 1px ' + color + ')';
}
ctx.beginPath();
ctx.arc(p1, p2, size, 0, Math.PI * 2);
ctx.fill();
ctx.beginPath();
ctx.arc(width - p2, p1, size, 0, Math.PI * 2);
ctx.fill();
ctx.beginPath();
ctx.arc(width - p1, width - p2, size, 0, Math.PI * 2);
ctx.fill();
ctx.beginPath();
ctx.arc(p2, width - p1, size, 0, Math.PI * 2);
ctx.fill();
} else if (type === 'corners') {
let width = ctx.canvas.width;
let width_2 = width / 2;
if (dropShadow) {
if (dropShadowBlack) {
color = '#000000';
}
ctx.filter = 'drop-shadow(0px 0px 1px ' + color + ') drop-shadow(0px 0px 2px ' + color + ')';
}
ctx.lineWidth = lineWidth;
ctx.beginPath();
if (drawInCenter) {
ctx.moveTo(width_2 - size, margin);
ctx.lineTo(width_2, margin + size);
ctx.lineTo(width_2 + size, margin);
ctx.moveTo(width - margin, width_2 - size);
ctx.lineTo(width - margin - size, width_2);
ctx.lineTo(width - margin, width_2 + size);
ctx.moveTo(width_2 + size, width - margin);
ctx.lineTo(width_2, width - margin - size);
ctx.lineTo(width_2 - size, width - margin);
ctx.moveTo(margin, width_2 + size);
ctx.lineTo(margin + size, width_2);
ctx.lineTo(margin, width_2 - size);
} else {
ctx.moveTo(margin, margin + size);
ctx.lineTo(margin, margin);
ctx.lineTo(margin + size, margin);
ctx.moveTo(width - margin - size, margin);
ctx.lineTo(width - margin, margin);
ctx.lineTo(width - margin, margin + size);
ctx.moveTo(width - margin, width - margin - size);
ctx.lineTo(width - margin, width - margin);
ctx.lineTo(width - margin - size, width - margin);
ctx.moveTo(margin, width - margin - size);
ctx.lineTo(margin, width - margin);
ctx.lineTo(margin + size, width - margin);
}
ctx.stroke();
}
ctx.globalCompositeOperation = 'source-over';
ctx.filter = 'none';
}
function drawRoundedRect(ctx, lineWidth, radius, margin, color, opacity, drawLines, drawCorners, dropShadow, dropShadowBlack) {
let x = margin;
let y = margin;
let width = ctx.canvas.width - x * 2;
let height = ctx.canvas.height - y * 2;
ctx.lineWidth = lineWidth;
ctx.strokeStyle = hexToRgbA(color, opacity);
if (dropShadow > 0) {
if (dropShadowBlack) {
color = '#000000';
}
ctx.filter = 'drop-shadow(0px 0px 1px ' + color + ') drop-shadow(0px 0px 2px ' + color + ')';
}
ctx.beginPath();
ctx.moveTo(x + radius, y);
if (drawLines) ctx.lineTo(x + width - radius, y);
else ctx.moveTo(x + width - radius, y);
if (drawCorners) ctx.quadraticCurveTo(x + width, y, x + width, y + radius);
else ctx.moveTo(x + width, y + radius);
if (drawLines) ctx.lineTo(x + width, y + height - radius);
else ctx.moveTo(x + width, y + height - radius);
if (drawCorners) ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
else ctx.moveTo(x + width - radius, y + height);
if (drawLines) ctx.lineTo(x + radius, y + height);
else ctx.moveTo(x + radius, y + height);
if (drawCorners) ctx.quadraticCurveTo(x, y + height, x, y + height - radius);
else ctx.moveTo(x, y + height - radius);
if (drawLines) ctx.lineTo(x, y + radius);
else ctx.moveTo(x, y + radius);
if (drawCorners) ctx.quadraticCurveTo(x, y, x + radius, y);
else ctx.moveTo(x, y);
ctx.stroke();
ctx.filter = 'none';
}
function drawCustomGate(tempCtx, color, type) {
const gateType = 'gates_plain' + type;
if (savedOptions[gateType + '_pyramid']) {
const thisGateType = gateType + '_pyramid';
drawPyramid(tempCtx, savedOptions[thisGateType + '_margin'], savedOptions[thisGateType + '_useAltStyle']);
}
if (savedOptions[gateType + '_cross']) {
const thisGateType = gateType + '_cross';
drawCorners(tempCtx, savedOptions[thisGateType + '_linewidth'], null, savedOptions[thisGateType + '_margin'], savedOptions[thisGateType + '_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions[thisGateType + '_' + color], +savedOptions[thisGateType + '_opacity'], savedOptions[thisGateType + '_shadow'], 'cross', savedOptions[thisGateType + '_destinationOut'], false, true);
}
if (savedOptions[gateType + '_roundedRect']) {
const thisGateType = gateType + '_roundedRect';
drawRoundedRect(tempCtx, +savedOptions[thisGateType + '_linewidth'], +savedOptions[thisGateType + '_radius'], +savedOptions[thisGateType + '_margin'], savedOptions[thisGateType + '_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions[thisGateType + '_' + color], savedOptions[thisGateType + '_opacity'], savedOptions[thisGateType + '_drawEdges'], savedOptions[thisGateType + '_drawCorners'], savedOptions[thisGateType + '_dropShadow'], savedOptions[thisGateType + '_dropShadowBlack']);
}
if (savedOptions[gateType + '_cutout']) {
const thisGateType = gateType + '_cutout';
drawSquare(tempCtx, savedOptions[thisGateType + '_linewidth'], savedOptions[thisGateType + '_margin'], '#000000', savedOptions[thisGateType + '_strokeOpacity'], true, '#000000', 0, savedOptions[thisGateType + '_blur']);
}
if (savedOptions[gateType + '_square']) {
const thisGateType = gateType + '_square';
drawSquare(tempCtx, 0, savedOptions[thisGateType + '_margin'], '#000000', 0, false, savedOptions[thisGateType + '_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions[thisGateType + '_' + color], savedOptions[thisGateType + '_fillOpacity'], savedOptions[thisGateType + '_blur'], savedOptions[thisGateType + '_raisedOutline']);
}
if (savedOptions[gateType + '_detail']) {
const thisGateType = gateType + '_detail';
if (savedOptions[thisGateType + '_drawCircles']) {
drawCorners(tempCtx, +savedOptions[thisGateType + '_linewidth'], +savedOptions[thisGateType + '_size'], +savedOptions[thisGateType + '_margin'], savedOptions[thisGateType + '_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions[thisGateType + '_' + color], savedOptions[thisGateType + '_opacity'], savedOptions[thisGateType + '_dropShadow'], 'circles', savedOptions[thisGateType + '_destinationOut'], savedOptions[thisGateType + '_drawInCenter'], savedOptions[thisGateType + '_dropShadowBlack']);
}
if (savedOptions[thisGateType + '_drawLines']) {
drawCorners(tempCtx, +savedOptions[thisGateType + '_linewidth'], +savedOptions[thisGateType + '_size'], +savedOptions[thisGateType + '_margin'], savedOptions[thisGateType + '_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions[thisGateType + '_' + color], savedOptions[thisGateType + '_opacity'], savedOptions[thisGateType + '_dropShadow'], 'lines', savedOptions[thisGateType + '_destinationOut'], savedOptions[thisGateType + '_drawInCenter'], savedOptions[thisGateType + '_dropShadowBlack']);
}
if (savedOptions[thisGateType + '_drawCorners']) {
drawCorners(tempCtx, +savedOptions[thisGateType + '_linewidth'], +savedOptions[thisGateType + '_size'], +savedOptions[thisGateType + '_margin'], savedOptions[thisGateType + '_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions[thisGateType + '_' + color], savedOptions[thisGateType + '_opacity'], savedOptions[thisGateType + '_dropShadow'], 'corners', savedOptions[thisGateType + '_destinationOut'], savedOptions[thisGateType + '_drawInCenter'], savedOptions[thisGateType + '_dropShadowBlack']);
}
}
if (savedOptions[gateType + '_border'] && !savedOptions[gateType + '_border_40px']) {
const thisGateType = gateType + '_border';
drawSquare(tempCtx, savedOptions[thisGateType + '_linewidth'], savedOptions[thisGateType + '_margin'], savedOptions[thisGateType + '_' + color] === 'auto' ? averageTileColors[color + 'gate'] : savedOptions[thisGateType + '_' + color], savedOptions[thisGateType + '_strokeOpacity'], false, '#000000', 0);
}
}
let kbLogoImage = new Image();
let kbLogoData = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAAtCAYAAAA+7zKnAAAAB3RJTUUH4ggBFw0aTjEOTwAAAAlwSFlzAAAewQAAHsEBw2lUUwAAAARnQU1BAACxjwv8YQUAABI9SURBVHjarVl5cF3Vef/uve/e+/ZFb9Vqa7FkCcubvCiywcTGQMLWsAzQBtKUJQ1NhvyRlHamM23TGcpkazPtFDKdoUChTMvEEIgLBRtjgxcZC2+yvEiW9KS36O37ct/d+p0jy8hCtsWQM/MsPd9zz/mdb/l9v++IgcUH+82NG1cHGhv77U7nBqNRWCkIopvRdU6qyYVypTKaTacH44nE3vcGB0/jfP0BAA62bTNVikXt90NDFfJ/c4vdsnlzd8DtvsNV57zZZrOvMpvNbs5g4DRFLpXL1XCxVBzOpDMfRRKJ/XsGB8fmv3utwcz/cntHh+jt6Oh3+3x/0d7RNlDndPlEUeQZnMXzPAiiCBzHgqKokMvl1XMjZ6Mnz5x5S+R5lReE1QaOc4Oua4qqJmqKckaW5Q/xwB19fX1PL1/W0uSqc3E4cIoO+AxUXMdgMADDMZDP5eVwKBwanwy+F49Gf/3Gvn0XrneI+eDZh2677dl1q3v/vKGx0VGrVKFUKiNQZXYinsCAB3B76sAf8EMoHIHDRwbBYjKBt84NgiDQOWQQcFJNgnQ2q87E48yaNavZtWtWg6ZrkIglIJvKgFyr4Txcl2UAvQA2uxWcdS7QNR0OHT4yef7s6NNvHzrw9nXBb9u2xtlia35+dU/PQwIvgCIrwKKF58Bcnozfi/kqTIVDeFQFuju7YM6SnIEDlmXp7wSAqqp0PvkEp6chV8iD0+oDd50VRCN/xbr0Hfxo+A5ZQzQaIRKNlsbGJ37y33vef/5q4DkSq57ejX/ds2LFEyajidM07Qrgnx9Ah2pFgdGLk2CxCdDZ1k5dbrKYQDSJl8PKbDGDaDbSZwQIWc9msYAZPTQxNQEG1gQWi0jBkueX3Y6/s2gI3BBUfMduswkYTmvrHI7BC5OT04uCb9+ypWdZc8sv/V6vS7lkrbmFCex4IgmpdApKlTKEI3EQTAx0ta/AEDLgISzAMmhtVQc7utzf3Eh/2lxOsDod6AFt9kM2YjlwuRxwfvwCWB1WSKVSUMHQRJBf8C5zyRtWi9WWL+SNjkDg7WAwqH0B/OY1a77f3rLsLoZlmfnAC4UipPIZ2HDjBtj5R9+AppZ6OHXyJKzqWgkcz1EL4xs0Xl0+D7gDvis8RdZw1NVBTZJoOGBgoNU5kPD7jrtvhfu+fT8oqgynTw2D1WS5wguXweEGGH4dair18pmpqfzC5yy6czu6+/KbZBGpKkFVk+Dh7z4EAzu2gUng4aMPDkDA48cEY8FkNlHg6VwOTgwPQ1Gq0jCplMuQy2ToM/KZmZkBHudy+I7RKAIxXXNDI/zfm+9CqViC/q/fCDvv2AHRRGxR8MRjLofTrBgMX1ssbAxGUexamDwziTjc+8f3gKehHiq4ycWzFyA8FYGeri4QjAJN0kKxCB8e+Bi2bN0C4+MTMHbuPOw5PAQcxn3AaoSbbtoCnx0/QRlrY28vJmodPQAJxmqpAmdPnIa1A5uhc1U3TI4HIRaMgRNDbSEWQRQAabhzMfAsbzBc8QbZbFl7MzS2LkNq06Gcy8Oxo8ch4PNR6xJKJEmI78HtO7bD1psGwG61wFuHPoOeW+6Emx/6DrTfei8c+OQwfO97j8Njj38XYhjfBAiPHiR06UZqPTl0EpCSgEdm2TywEcq1KiwoO7MAMacwNK2LgsfMrn4eYywUyyVwYGLphCmQ44nlQ9MRcNjt1OJzeUEOYTGZIZ/Jwp79h6C+vROTD2kQE3ld33rQHD4YOX0GTCYjbNrQd5kGCa9bMJQS8RSU0XuEYSLROGCVBeaL2KmhdEUpLgpekmqhz8kQQEDKO7j/CP2iIvh0OoOH0KjVSaIS4HMHIJNCQeRwSaYFjORDLpuFIuYCb7FCMpmkB5aql+1DWYccvCbVIIfFiuTPFDKhw2wDWrUWMI+MGCRZnlwcvFw7L2G1I4MUljqXC3w+LyZbDFTcIIlUaULXziXz/IVJPQhivOoGgVIieS5jgRs+PYwbKujFMtQw+Yn35sxKLE/pVZstSkc/OQIx3MtmtX5BCxAJkc5myMbnFgWfL5VeOjUyspuccI7m5JoM//5PLyBzZNFqNRqLuv5FmUHAZtHKrGiEUj6H89OUOlVFhkw6DelkGqLoGeKR+dKBhDbxSCKRgMEDhyE+HQUUa9Twc9XWQMJpZiYxEZz4IVssnlkMPDdy8eLoqo72jNVifpDBXWYrohXDhIfBwWPUrYmZJC0mlC24z61PNilhPZhESsxjaESxgpbymOCHDgCjKdDhcVGWIWvOeUuqSDQ8sjhv6NhJ0GoqZTFSBwhBZDDs7FYboHJFCo1/+p+/3/2DkVBIXhQ8+ac3EEhNJ5Mauu5GPABDwojwNCkqk5NTmJgWEAUiAQyUuuaHjohWR9KGPCYfZzRDDd8V0dIrHSbUTDehVDBRK88KMR1rQYV6IhSNQsDrA6/Hg8lagkq1AtPhMCazGeWDCT49fvzDVCLxzIVQKAxXGRT86ampamt390GEcavNamtkL1VbAljFqJHkKphEolc4KgvmW58Ac9gd4EepYAMVnIwGPU31yDDrwSAKl4UbAV9FOUBEHxkzqC49bi/UZIl6IY7JbUdGs6AOQusXYpnkT363/8BHcI3Bzf0yNjamNno8x1RVWW8UjY2iSNSlBnKFhXw5DQ6bHd2vk5KN8WigoGbjnqHecGCBaaivh+UtLSiZfVRKE8CEsWSUBAQ4+dAKjnI5mcyAw+KCUjVPWgCo9wco8EQykZgMhX6ckPb8NhgEbUngyTgfDM7YfL5Xy+nUSE2SzdWSalQ11SjLNZbjWQKYaFykThV1iUIPwF5KRqoK8SAkGUkhmp/8pUKJSg4yhyRiNBaTsYNCaKwsGPky0nMUK/bRSDT2L9H4zOO7PvzwMAG+qQ6amt0gh/KgLAaeudqpbt+0yW5zOn0CK7gUXbYYBeHnzQ0tGwgoK5HBwmzskxCiWh5/UgokhKfP0i7plMjP+TlCxonh00O5YvFJu9lcxsqClFyQJF1Pv7FnT44837ZtY8DEWZ60hSfvKVaT//BusPjWlwK/cHxr27Z+j9vzclN9YyeRziSsyCGIgNX0WcAwv9pdWn1+Q0MkxXgwqI9PBR97c9++/1hsn/7+/tuXNy376V3339t38OVXWDV89OO9pxI7sbGVFs41LBE7i32qL18oZcekCWjE2CYhkM7kwYiHEC/1tnM455eEOYlN2As7MH10YvzlWiTyXwuNuHPbwBqnu/Hv6r0Nd7qdbs6O0mPDg/dD/M2JG/tqxSfGzlX+DeddkQMcXGfc2ddnXt/b+7cd7R3Pkt7F7fRgUqUx6SooJQzU6pgftIxrqjbrBZhloTlpXEK9ND45ie9lIeD3NzBmU6oR4MxYOq32N4Fplcv9uMPme2FNd9cGd/NyNtDipe+sX98Hp8NpyFw8kRYT8ntRTKEvZXne4Xjkhu7uZwSDyJHN3R47ii8RO6EcSogU6h3AnlOgOWDAL3N9rCjyUEWdn83moFiUwOvyQVODk0EP+Z126y+qkmRAinvBztmearP3/j1fdllSsSC01TeChuus670B3abBjnsehoOnx2eGjHEZhoauwHZNy5M437xp4/NdnSvsw2fOY+U1Y6ESwON3QGOzD0w8KlVVQCrUsE7V8FNGnV+CYqGKUqEMWB7AZnJCZ0cHeANOxKJCKByDvvVrjB6/f7seHTfd4Fz5zNdWcNZlzhIMhwxgM2LBisWBsTpgfGKCaqa1q3t7w8eOTYVCoeF5GXVt8ANr1z6zbv3a7ZlUhglHYlTyCqjJ7Q4bbbhtTjN4fA5w1dmxwFiphHA5XOB1e8Dv90J9gxcamj3gCbiwb7Wj2ixAPl/EZtwInd0rDMlYZsutTXljfUBhOlaaoZLRtf3TyQuZQjLiMDt8otPFFAsFaGhoELu7u29qaWnZjr+zWMxS4XA4f1Xwt/T1OZobm541CUZvCct3BpsSJzbORN9YbWZasIhMJovPxKIgYVvAmzjQGIx9DE2Px0kPRRjH7q5DOmUxSi5Snifc73LambKis822BNPV5oKjowk4eP7sS5HR8e8r7uZYvd3yTas/QC+pMtha+v1+844dO9pXrVr1LWzee1Bu775qzBstlk673eYBeoEk0005blbb6JcScnR0DLwtAbjvsYfAX++nOp0AS6fS8PHeA3ABn6/AkJm4eBEbmhBwjIEeGHsIiKMnRcEEp2Z09fDp44ffOhL+m+EiHCBhsa6MuZKKVZz5Em92WjE8UGFGIoBhA1u3boVHH310O4L/0VXBI0tgO8XQ2yGFymWixYFeXxCVSBqNznU9cMsdO6leIaDJhwwiFe558F4YRK1+6tAQFXSNgXpkI51epZDqTDsqIw9H4/yui4fDPxwuQWxub+TDiq4qGlGgFpftcsXuQEMQowUCAUNdXd0AezXwBlUdn5nJlGYiBWSMMhVkpDEoonokd5XFShm2br+Rlv35VZQM8l1ClbgRe1NG5Ag9ojR2zV4Z4uY1iTzHLi2JvYDBdGBwHnC6N8e1WkSBFzFE527fWltbCWhs0p3w2muvXTh48OCPrgp+1yefjGeKiR9Ek+HzhXyZVkcBO6bhkbPYGqaxmSbN+NWZdrZV1KCjcxnE48lZirhUcatVGaaDSW18auL9Qrn46vz3enp6hJU2/k8cLr9JsJrBiGA3DgxAK2p+Itx+9rOfHXz99dfvHsFxTZ5/44MPfnfvjh0nGdXwY7fX9oTFbDE0NASoAMuV89je5YEXLRhdzIL+c/bWq1rI0RqgYDtHp2iz7q8p1ViqUHglJ1V++c7+/VnyxpNYUvJutzfT4L27q7Pr23xNZ7W33wKxrQ0ZKg/Bzz6rfsRxu3e/887To6OjVONfr0hpu/buHb+9f/u7CO5RjHUDuQ0gMU/ivFIsQBmZyGSxY7HiqTAjFVbDNrCCwInlSYixLLl1YEHB7oo0KzVFeeN/Ptj9l/M3cghCW5PR+KLzG3et3nTzdmt67x4wvPoKtAwOwskXXywMl0rPvuZ2/yu2jpdvEpakbWRJSSIIWb+kFomWkco1WpBIc55PxWmDXS4VwGyZvQUg3RKpBdMTYXBikhO6m5gMgtPuIpI6snCPeK0W7Mnlqs2FkpVL4Hq/+Q14WDZ2tFrdPVIo/ONz2HJg03slqSwFPOZ9FOlSopaUVRoCLozFzwZPUt4n1x7Vahne370Ln9foXQwpZulUBmKRBC1ekegM1DndVP8omja5cI+XMcqmqtWfwq//OXrukUcmJ8Phv9pXKOz8NJ9/igJfZCxNVZ40hqRWKYbg/TWkQ1KgPB43nDt/AQYPD8HG/vXgxX70vof/FA9jolxOrvD2/O9+aGtZhqJNhtZlmLixJCQKJYnTlUWvMoqKEjHxfMYgSS89Va3+/HqwlgR+P+xXGiv3YIuora4iNc5dT7Qtb4Xp82E4d2oUXF4nlQ21ag2S8RQ2GBo01TfTECODFDp621CpjiUrSnSxfRDtRS6VelpX1bGl4Fqqnif96BG0+nd4XuaI9UkzQjr+KIoop8OuSznsS/OzABmVpdd3qXSKsVibZm8NsH/FYqOXypXTGIS5q2yjPaeqe5aKacng85XiULlSiVnMpoZyuULBW5CH6/31GCKhYq6YfF4wGp1IhxlVZu9b0dHW7nK5aH5IqPfJ9R5aX8sXCh8fCR2pLHXfa40lJSwZ1XzqQi5XPEFKNZG+pLKSWwSTScTK54YZhR85w9p/Ma6Lu+xOh1zntjPkgITXs9hxEYmRzxXKlay0+w8B/EuBL7a1acmydLSUr1Ig2WwBcvip4CHS6Sz2IkI3z/GrOJbvRkrx5FD+Eg9l0ljMKhWQKyokc8Wz+camLDzwwHU7uKWMJS0ycPef2XRO+HqNYRSHpNxcLFeNqioj24yDhtQ4ORVJV6z23+ocW0aalORsprWQzizPprIMucqOx9Og1hQ5JtferJptbEONYyOjp+JfFfySYr5cKxhNvGADwZgZK+V/ZcpWbmPSBk5nIDMdz31a8zYe1zlQOYbhkcP1hMv3XLJSeUUsS20m0FqQW+uiNTlYsDn3oeK3qrxK/opG/272VcAv9eqDWXPHAw1Gg7BCZ1iUygqDXYdORQ7D6IxKLtK0K0MQvaQuWERnNIVVDVPhRGU0dOSNr5y0S763uTTY/lsfcGqi6EAN40HNb0NdbkTFZSC31kiJdD2dZTUOWyqFVWRGYcsYnClVKmf4nCF75A8Aem78Py+CGUhVT6cQAAAAAElFTkSuQmCC';
kbLogoImage.src = kbLogoData;
function addKoalaBeast(ctx, x, y, scale, opacity, blur) {
x = (x + 3.5 * scale) - kbLogoImage.naturalWidth * scale / 2;
y = y - kbLogoImage.naturalHeight * scale / 2;
ctx.save();
ctx.globalAlpha = opacity;
ctx.filter = 'blur(' + blur + 'px)';
ctx.drawImage(kbLogoImage, 0, 0, kbLogoImage.naturalWidth, kbLogoImage.naturalHeight, x, y, kbLogoImage.naturalWidth * scale, kbLogoImage.naturalHeight * scale);
ctx.filter = 'none';
ctx.globalAlpha = 1;
ctx.restore();
}
//detect some group settings...
if (defaultValues.showCompetitiveLogos) {
let startCounter3 = 0;
let waitForGroupSocket = function() {
if (!tagpro || !tagpro.group || tagpro.group.socket !== null && !tagpro.group.socket.connected) {
startCounter3++;
if (startCounter3 < 50) {
setTimeout(waitForGroupSocket, 20);
return false;
}
}
if (tagpro && tagpro.group && tagpro.group.socket !== null && tagpro.group.socket.connected) {
let settingCount = 0;
function handleSetting(data) {
if (data.name === 'redTeamName') {
redTeamName = data.value;
settingCount++;
} else if (data.name === 'blueTeamName') {
blueTeamName = data.value;
settingCount++;
}
if (settingCount === 2) {
groupSettingsReady = true;
tagpro.group.socket.removeListener('setting', handleSetting);
}
}
tagpro.group.socket.on('setting', handleSetting);
}
};
if (savedOptions.texture_logo_automatic) {
waitForGroupSocket();
}
}
//helper functions...
function rgbToHex(r, g, b) {
return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}
function hexToRgbA(hex, alpha=1) {
if (/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)) {
var c = hex.substring(1).split('');
if (c.length === 3) c = [c[0], c[0], c[1], c[1], c[2], c[2]];
c = '0x' + c.join('');
if (!$.isNumeric(alpha) || (alpha < 0) || (alpha > 1)) alpha = 1;
return 'rgba(' + [(c>>16)&255, (c>>8)&255, c&255].join(', ') + ', ' + alpha + ')';
}
}
function getAverageColor(data, asHex=false, ignoreGrey=false, pixelInterval=1, repeatIgnoringGreys=false) {
let rgb = { r:null, g:null, b:null };
let length = data.length;
let count = 0;
let i = -4;
while ((i += pixelInterval * 4) < length) {
//let b = data[i] * 0.299 + data[i+1] * 0.587 + data[i+2] * 0.114;
let isGrey = ignoreGrey && (Math.abs(data[i] - data[i+1]) + Math.abs(data[i+1] - data[i+2]) < 10);
if (!isGrey && data[i+3]) {
rgb.r += data[i];
rgb.g += data[i+1];
rgb.b += data[i+2];
count++;
}
}
if (count === 0) { //all pixels were transparent (or mono if ignoreGrey is true)
if (ignoreGrey && repeatIgnoringGreys) {
return getAverageColor(data, asHex, false, pixelInterval, false);
} else {
return null;
}
}
rgb.r = Math.floor(rgb.r / count);
rgb.g = Math.floor(rgb.g / count);
rgb.b = Math.floor(rgb.b / count);
if (asHex) {
return rgbToHex(rgb.r, rgb.g, rgb.b).slice(0, 7);
} else {
return rgb;
}
}
function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; }
} //in a game
}); //tagpro.ready()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment