Dagball.html

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>DagBall</title>
<script src="lib/V.js"></script>
<script src="lib/LeastSquaresLstmQlearn.js"></script>
<script src="lib/Dagverse.js"></script>
<!--script src="lib/Gob.js"></script-->
<!--script src="lib/Dagfield.js"></script-->
<script src="lib/nacl-fast.js" title="dchest_tweetnacl-js-1.0.3_2024-2-8.zip"></script>
<script src="lib/TinyGLSL.js"></script>
<script src="lib/Ap.js"></script>
<!--todo use NsatDesignToolGpu with up to 40 vars to help me design Wikibinator305 instead of Axgob. script src="lib/Axgob.js"></script-->
<script>
//Dagball, Ape, TinyGlsl, and CallGPTFromBrowser are opensource MIT licensed. Wikibinator203 is opensource GNU AGPL 3 licensed with 3 extra permissions including classpath exception.
//2023-12-13 its only using Dagball, Ape, and TinyGlsl, not CallGPTFromBrowser (doesnt work yet) or Wikibinator203 (works on browser console) unless you click a button.
//2024-5-10 lib/Axgob.js will be the next version of Wikibinator, with optimizations for gaming.

//Players in my game can edit GPU code (of my Ap.Ape language) to reshape game while playing it. Multiple GPU codes are merged into 1,
//then split into 2 for display vs gradient. That gets compiled to WebGL2_GLSL that runs 60 times/sec
//(multiple physics cycles (doPhysics) per 60 FPS display cycle if fast enough).


/* UPDATE: the V array upgrade (theres a checkbox) avoids compiling again when you just change float literals in lib/Ap.js (ape) code since it puts those in as data instead of code, consuming some
of the up to 1000 (1024?) floats that can go in a GLSL uniform array (inside a GPU core),
so when you edit ape code of a neuralnet (saves/nnet*.dagball files),
and if that something-V-something checkbox is checked, and then push ; key to finish your edit
so it turns from light blue textarea back to white (TODO dark mode checkbox),
then for every physics cycle (60+ per second) you have changed specific floats
in the GPU memory of every GPU core at once. Every core gets its own copy of those floats,
and you see the neuralnet change as a 2d heightmap on screen.
If you change any other parts,
it is near instant for simple code but 20 seconds for a neuralnet.
For circles (each containing custom GPU code) whose preferCpu checkbox is checked,
it compiles them to javascript (CPU) instead, which happens near instantly
but can handle much fewer calculations so use less dimensions per circle
and use alot more circles. GPU is for number crunching. CPU is for sparse.
Balls roll on all circles of moving heightmap-like terrain. The circles are summed
at each pixel to determine the height of the heightmap, which is really a 2d cross-section
of a many dimensional scalar-field that has all the dimensions of all the circles/customCodes
together. Circles can share dimensions by making 2 lines touch at a 2d point.
Each line is a float variable/dimension in a custom ape code, which come in named arrays
(of the variable name of the array in the code in the circle).
Different circles have different numbers of lines.
Any 2 lines can be joined, whether they're from the same circle andOr multiple circles.
When they're joined, their position and velocity are held equal,
and gradient is sum of their individual gradients.
This is a SAT solver as in NP-Complete, though often doesnt find the exact solution,
it solves toward lower total potential-energy of all constraints.
This is also a fourier solver and many other kinds of math,
whatever you can fit in the textarea while a circle is selected to edit its GPU/CPU code.
If you define a neuralnet prediction algorithm, but you do not define a training algorithm,
it gets autodiffed 1 level deep between input and output,
and if there happens to be 15 unrolled RNN time steps between that,
then the neuralnet still gets automatically trained.
Theres video of that happening in saves/*349.349.dagball which contains the neuralnet.
That neuralnet is live trained at last 1 training batch per video frame
cuz training batches happen in a physics cycle.
Balls are 2d training data. The lines you can join between circles are the AI model
which can contain neuralnets and other shapes.
In this system the set of all neuralnets of a certain kind and size etc,
is a constant high dimensional shape, and by running dagball's physics engine on it,
the neuralnet is automatically trained by accelerating by negative gradient of position.
You'll find gradient* field names in Ball and Ed (circ.edsOut is a list of Ed,
and ed is a dimension/floatVar), for example.
The dagball game's level editor is the text editor
and checkboxes etc on the left of screen,
and the canvas on the right (2/3 of screen).
You use keyboard shortcuts (click var= checkbox to see what key does what),
by holding 1 or more keys while moving the mouse.
Mouse left button selects a circle or ball.
Mouse right button unselects. While sected, a circle can be edited.
A circle is selected if mouse is just over it. You only left click it to keep the
circle selected even when mouse moves off it, then right click to end that,
but those clicks must be on the game area not the edit controls on the left.
On the left, it uses normal webpage controls.
Type in a text box. Edit numbers in a box with clickable up/down arrows. etc.
There are 10 quickload and 10 quicksave buttons.
Its like the old game emulators. Whatever you built, whatever it became after playing,
and whatever options you've changed, is frozen into a json file.
The quicksave/quickload buttons use browser cookies (LocalStorage object).
Theres also 2 buttons to save/load from json/dagball file. (nnet*.dagball for neuralnets).
If you have trained a neuralnet by moving the balls to reshape it,
those neuralnet weights will be in the quicksaves andOr *.dagball files.
It gives you the files for download, generated inside the html,
or keeps them in cookies.
...
2024-5-27
First, write the high level steps here. Then organize them. Then copy it to items in mmMain so can check them off when finish each. Write the steps all the way up to a 50 player game happening at dagball.com where any 1 player acts as host of their game and can stream the dimension pos'es and vel's and game levels (*.dagball file) thru it. Dont do any axgob cuz that upgrade is for later and will get into various rabbitholes of software design and sync. Thats a second goviral. Dagball by itself is first goviral.

Existing dagball uses 1 physics shader and 1 graphics shader and is limited to 1000 dims (dimensions). neuralGoo is an upgrade to dagball (dagballNeuralGooUpgrade) which will practically extend that to maybe 5000 dimensions at once and unlimited dimensions off screen not being used at the time that it can swap in and out. Or maybe just 2500 dimensions depending how fast it runs. The important thing is it becomes sparse, cuz I need more content than 1000 dims. But im unsure if I can have more than 500 dims of manually created circs (such as sine waves that move in phase and angle, fractals, etc) that run in GPU. That will be 1 gooGroup. I could have a second gooGroup with another 500, and a third gooGroup with another 500. I could load alot of those, not sure how many, but ive had up to 80 off screen canvases at once. The problem is they take a few seconds to compile that much dimensions. 20 dimensions is often .1 second to compile, which is an ok loading time to happen every 30 seconds as players move across the huge game world. But 20 seconds is not. The neuralnets take 10-20 seconds to compile the first time, then near instant cuz GLSL remembers them even across browser tabs. I'll want to compile new ones of those infrequently but use LOTS of intstances of the 1 or few neuralnets i compile. Also theres an experiment waiting to do in TinyGLSL, when its the same sizes, to reuse canvas, GL object, and a few other things instead of making a new canvas every time, but that might only make it slightly faster, or possibly make it alot faster in some cases, so dont count on that. Plan to work within the compile time limits by reusing fewer compiles of GPU, and by simpler circs run on CPU. The simpler circs on CPU will have to do the same kinds of calculations as the GPU circs. They'll both be writte in Ap.js/ape code (dont call it just ape cuz theres another programming language with that name, call it Ap.Ape or Ap (todo use google trends with compare to estimate popularity of new names, later maybe, not part of this neuralGooTodos2024-5-27+ task). So basically I'm about to upgrade to dagball levels (each is a *.dagball file) that have 700-2100 dims of manually created circs, in blocks of at most 700 at once so theres space for 300 balls per near area, or maybe limit everything to 450 so overhead of 100 doesnt mess with 2 of them 100+2*450, but i think 700 is a better limit cuz i get better neuralnet. So 700*n manually created gooGroups, and unlimited balls but at most 100 balls computed at once (and maybe 2 kinds of balls, one as curveGrab and one normal, ignoring axgob balls (Field manaRefillRate ball55) for example. No axgob in neuralGooTodos2024-5-27+, thats for later And I will sample in 2d to find where its likely to have steep gradients, statistically spread curvegrabball/goosyncball there (2 names for possibly the same thing), then do gradient as usual but in gooGroups number of GPU calls, 1 per gooGroup combined with 100 curveGrabBalls andOr normal balls (might mix curveGrabBalls and normalBalls or do them in separate GPU calls, will have to see how much lag that adds and tune params). gooGroups will interact with eachother only thru normalBalls and curveGrabBalls and EdJoints, NOT thru [pairs of gooGroups with pseudorandom 2d points] like I had planned cuz that needs about someOtherSmallConstant*(kindsOfGooGroups^2)/2 number of compiles, vs just smallConstant*kindsOfGooGroups number of compiles. There will be 3 kinds of apes (compiled shaders) instead of 2. The original 2 are physics and graphics, all game objects at once. The new 3 kinds are: gradfind (estimated gradient finder by absVal of dotProduct of gradient with random epsilon length vector), gradeep (gradient in deep detail), and hillfind (the display code but its a weightedAve of gooGroups. Each gooGroup has a window (var) at each 2 point, normally 0 outside its circ and 1 inside its circ, but it could be defined as a 2d bellcurve in that circ cut off at edges of circ or an easeInOut shape by radius so its 0 at perimeter and 1 at center, or theres various other possible shapes, but I think for now 2d bellcuve, hard circle, and maybe squashing and tilts of those (so pole-like smooth oval) should be enough, and practically im gonna leave it as hard circ for now cuz thats what i have and individual circs can make themselves smooth within that circ if they want. So those 3 ape kinds are: gradfind, gradeep, and hillfind. [UPDATE: 2024-9-27, these became the "5+ kinds of eval", including evalGpuMain evalCpuDiffeq evanCpuMain, look up the others, and as of that date, some are working and some are not, and some of the *.dagball files work and some do not, so theres bug fixes to do so the old game content still works which will be a sign that the redesign is done] I might merge gradfind and hillfind by running each pixel (450x600 resolution) on a slightly different world state, computed inside shader, based on a seed for pseudorandomness given to GPU from CPU once per video frame, and use the difference in adjacentp pixels for estimating where steep gradients are. BUT NO, gradfind and hillfind CANT BE MERGED cuz they compute different things. Gradfind computes squared error of difference of potens/hills that partially overlap, which might be computed as stdDev^2 of weightedSums (weight is .influence var at 2d point of each gooGroup partially overlapping there). When they agree what poten should be at that 2d point, stdDev is 0, and ave is that poten. So to compute gradfind, I need the separate hills (monochrome pic with float32 brightness, 1 such pic per gooGroup) then to make a 450x600 float array to compute stdDev of them at each pixel, in 2 steps, first compute weightedAve at all the pixels, then compute weightedStdDev at each pixel, then square those stdDevs, then spread the curveGrabBalls/gooSyncBalls statistically where those squared errors (stdDev^2) are, then call gradeep once per gooGroup_and_100_balls. If theres 600 balls then would call that gooGroup on 6 groups of such balls and sum the 6 gradients to get the combined gradient. Similarly sum the gradients for all the gooGroups, merge in Edjoints as usual (when 2 circs have lines that touch eachothers ends, each touch point of 1 or more eds is an EdJoint, which holds those position and velocity equal, merging multiple dimensions into a single dimension called an EdJoint). Where does the epsilon length random vector fit in? Gradfind is to make a ballpark estimate of where steep gradients are likely to be, before doing the detailed very precise gradient calculations at 100 2d points (with 700 other dimensions they share) sampled from that ballpark estimate. I have written a mistake. It should not be stdDev^2 cuz that assumes the gooGroups can always sync with eachother. If they cant sync, then gradfind would keep trying by putting alot of balls there but keep failing. Instead, I want to put the balls where theres steep gradient of the loss function. Not gradient of the hills/poten but of the loss. The loss is that all gooGroups should agree at all 2d points on what is the hill/poten, weighted by gooGroup.influence (like circ.influence in existing dagball code 2024-5-27, which is like a volume knob for a circ to turn its hills steeper or flatter, and when it reaches 0 influence its the same as that circ does not exist). So theres some details to work out on how to fit the epsilon/sqrt(numDims) (or is it multiplied by that sqrt?) length vector (where +epsilon is normally added in locparMem as a slight variant of parMem for gradients as usual, but instead of +epsilon at 1 dim its a random epsilon length vector that part of is added to each dim in that gradient loop in GPU, a vector made by pseudorandom seed so it doesnt cost floats to store it. The details to work out are how to combine such random vectors from multiple gooGroups to estimate where the gooGroups disagree with eachother in the 450x600 pixels.
..
try this: for the same pixel at the same 1/60 second (video cycle), its the same epsilon length random vector for all overlapping pixels there, 1 from each gooGroup that partially overlaps there, which practically will usually be between 0 and 10. That way, can compute exact poten there at 2 points, and each point has all the gooGroups (that overlap there), then just divide the poten difference by vector length (and maybe scale by mul or divide by sqrt(numDims)?), take absVal of that, and use that as the output of gradfind at that 1 of 450x600 pixels. Make it be a different pseudorandom vector at each pixel_and_videoCycle so it trades spatial resolution for precision of steepness of nearby gradients since it can look at more dimensions (random direction in 1000d) at once that way.
...
Since each of 450x600 pixels will compute potential-energy at 2 world states that differ by a random epsilon length 1000 dimensional vector (sparse gradient max 1000 dimensions at once) and that will happen at 60 FPS, thats 450*600*2*60=32,400,000 world states computed per second
*/


/*alert(`Its ok. I just raised physicsCyclesPerVideoFrame from 1 to 4 2024-1-22 and wrote code in a circ to make certain
hills steeper using tanh andOr exp of potenCirc$ though tanh is better cuz doesnt go far out of range making screen go black.
Im back to making game content. Continue.

TODO fix readSmoothYX_onDisplayPotens so balls dont bounce so chaoticly. also it has hardcoded numbers in it.
Make it visible where the "wall blobs" (see checkbox) are forming and when.
Make it not wall vs nonwall in readSmoothYX_onDisplayPotens but use the gradual potens, and just search it within given distance
and combine them somehow.

makeSecondBitpicOfWherePotenGreaterthan0.7Etc_displayDagballWallsSlightlyColored
so balls will hard bounce on the fractal hills etc instead of smoothly sliding over them when ball is moving mid to fast speed.
This will solve the problem thats blocking me from making game content. It will let me make content that squeezes balls tight in 2d curvy spaces.
There will likely be problems where the poten moves too fast, forms at and all around a ball thats already there, but I'll just have to work thru it by tuning this physics model. Remember the ball that went so fast in the video it went thru a thick wall and was bounced around inside the wall and quickly ejected by the wall (either that or by its existing speed) but its direction fast changed in the wall. This is probably cuz jit bounces against the 1 closest wall mini block so is chaotic. So likely as long as the circs are designed to be smooth enough this wont be a problem.
Also I might want a float[4kX4k) etc to cache the last outputs of display from GPU since zoom can vary, and need to interpolate or sample to match them.
`);*/


//Err('TODO asap just put b c and d of b*(param*c-d)**2 (or a 2 param form of it?) as draggable icons on each ed line on screen. make it work asap. and continue making fractal game content. thats what stopped me, why i went down another rabbithole.');

/*Err(`TODO (gpucpu
(do ...gpu stuff...)
(do ...cpu diffeq stuff...)
(do ...cpu apueFuncJs stuff on single eds, some subset of the eds in this circ...
	TODO
	Id like to do it with a few loops, like 3 loops if you wanted to set 3 different apeFuncJs'es.
	A simple way would be  to make a new apeType that sets apeFuncJs of all the eds in a certain array, like...
	(edFunc arrayAB {func? {aveX float} {scaleX float} {scaleY float} {x float} (* (- x aveX) scaleX)})
	(edFunc otherArray {func? {aveX float} {scaleX float} {scaleY float} {x float} (* 4 (- x aveX) scaleX)})
	Maybe id want arFunc and edFunc, one that sets it for whole array and one that sets it for individual eds.
	Maybe also edEdFunc {...func with last 2 params copied from the 2 eds...}.
	and arrPairsFunc does all pairs of edEdFunc (triangle without diagonal).
	More generally an edsFunc could be vararg and take whichever indexs of ed to be used together.
	<(edsPtr arrayAB 0 2 7) {func? {aveX float} {scaleX float} {scaleY float} {x float} (* (- x aveX) scaleX)}>
		that uses the last 3 params of the func (and the first n params before it are floats stored somewhere in the circ, for cpu to use, similar to 3sat numbers, that user can adjust but dont have velocity.
	<(edsPtr arrayAB 0 2 7) {func? {aveX float} {scaleX float} {scaleY float} {x float} (* (- x aveX) scaleX)}>
		is the 1 ed version. its displayed on that ed in that case.
	<(arrEdsPtr arrayAB 1) {func? {aveX float} {scaleX float} {scaleY float} {x float} (* (- x aveX) scaleX)}>
		would use that func as every ed in the arr. The 1 means 1 ed at a time.
	<(arrEdsPtr arrayAB 2) {func? {aveX float} {scaleX float} {scaleY float} {x float} (* (- x aveX) scaleX)}>
		would use it as all pairs of eds in arrayAB, using the last 2 params in the func for their edPos.

)
)

OR what if i indexed the arrEdFuncs/edFuncs by 2d ed grid coordinates. y and x per edGroupPrimaryKey.
so u could have [yx$22_553 yx$24_553 yx$10_5] be the keys, and an ape func as val,
and that ape funcs last 3 float params would be the ed.pos at those 3 points.
Complicates what happens when move eds and multiple circs overlap the eds.
It could be viewed like a separate circ, with so high of friction on all params except the last,
that those params dont change except when user chooses to. But I want the controls to
appear on the ed lines.
Maybe I should just do simple parabola built into ed.

`);*/


/*
UPDATE: "Math model of DagBall is map<map<vector1000,scalar>,scalar>" is still true but theres a simpler form of it
where each map<vector1000,scalar> has 1 extra dimension called influence.
map<vector1000,scalar>.influence is 0 to not exist, 1 to exist, or gradually between or could be any finite value.
This allows adding and removing game objects, that each are a map<vector1000,scalar>,
is done by setting 1 dimension per object. Any other dimensions that object contains are ignored by influence==0.
Therefore instead of map<map<vector1000,scalar>,scalar>, its map<dimensionId,scalar>.
Also you need 2 map<dimensionId,scalar>, one for position and one for velocity,
or call it a map<dimensionId,complexNum> as position+i*velocity.
Only 1 level deep, a dimensionId can require other dimensionIds be loaded in memory,
those within the same game object.
A dimensionId is either the hash of a json, or is one of the float variables in it,
and maybe should use dimensions for gamepad inputs and other streaming vectors in general.
By streaming vectors I mean live time-series of any sparse parts of map<dimensionId,scalar>,
which would be viewed in the game as whoever is near a 2d area of the game computes that area,
and the many computers fit that together by leastSquares and maybe some kind of gametheory
for those who try to compute the wrong next state of that area of the game
instead of it being just the normal difficulties of merging things at different milliseconds
of calculating it, different float32 roundoff, etc. I can use GPU exactly deterministicly
but its alot slower calculation, except in some cases its equally fast.
A truly decentralized game world, held together by math. Someday.
For now 2024-9-27 dagball is single player on 1 computer. Its about to expand.


https://twitter.com/DagBallGame
https://www.facebook.com/groups/dagball
https://github.com/benrayfield/DagBall

Math model of DagBall is map<map<vector1000,scalar>,scalar>, a weighted-set of map<vector1000,scalar>s
which acts like a map<vec1000,scalar> itself, so when at some "multiverse position" and call it on
a vec1000 it returns scalar. Accelerates by negative calculus gradient of that --https://twitter.com/DagBallGame/status/1708210381770969358 2023-9-30.

1000 dimensions is alot for a game but tiny for a neuralnet. Trillion parameter models take months to learn on supercomputer.
We gonna bring the supercomputing by swarming GPUs across many browsers, but gamers like low lag. Less dimensions so #DagBall
learns at speed of FPS games --https://twitter.com/benrayfield/status/1706133250345693483

DagBall - 1000 dimensional hackerspace
@DagBallGame
Theres 1 extreme condition where greedy opensource users and programmers of AI should want to locally shutdown.. IF disproof-by-contradiction.
00 unknown. 10 true. 01 false. 11 both aka disproof by contradiction. Only IF any 11 is implied. Prisoners Dilemma. Newcombs paradox. etc
--https://twitter.com/DagBallGame/status/1705343557689569338 2023-9-22

[[ https://twitter.com/DagBallGame/status/1705689168188198937
"DagBall supports GPU optimized 1000 dimensional calculus gradients" apply to nearly ANY GLSL GPU code u write if use
parr array & tiny memory limits. Simply calls it up to 1001*numBalls*60fps times per second and uses
https://en.wikipedia.org/wiki/Fundamental_theorem_of_calculus… Doesnt backprop to train neuralnet
Quote
DagBall - 1000 dimensional hackerspace
@DagBallGame
·
23h
For example, there are 2^6=64 in the powerset of 6 bit vars, and 3^6=729 if you include every possible conditiona-probability
statement. DagBall supports GPU optimized 1000 dimensional calculus gradients. 729 fits.
https://github.com/benrayfield/wikibinator203/blob/main/doc/pic/Bayes%20Rule%20meets%20N-SAT.png
]]


[[[[[
	2023-9-22 https://twitter.com/DagBallGame/status/1705326149818049021
	Post
	See new posts
	Conversation
	DagBall - 1000 dimensional hackerspace
	@DagBallGame
	·
	6h
	How should the mouse control the many circles?
	DagBall - 1000 dimensional hackerspace
	@DagBallGame
	·
	4h
	My 2 6-analog-axis gamepads, mouse, and keyboard are all hooked in. I can use their buttons, joysticks, analog triggers, etc all in the same {name: val} map. The question remains, what to do with these inputs.
	DagBall - 1000 dimensional hackerspace
	@DagBallGame
	·
	9m
	FPS = 60 cuz my HDMI screens dont try to go faster than that. Its in sync with the 60 hz elecric outlets in USA, a reasonable place for many gamers to sync on.
	You reposted
	DagBall - 1000 dimensional hackerspace
	@DagBallGame
	I didnt tell it to sync on 60 FPS. Thats just what happens. Those who tend to sync on 50 hz (certain other countries) or some alot higher, should naturally do so. High dimensional scalar-fields are available for automatic negotiation between various shapes/dimensions, in theory.
	5:00 PM · Sep 22, 2023
]]]]]


Its very important to have separate dimensions for LIKE/DISLIKE vs TRUE/FALSE (per object in the system or thought in your head),
so you can dislike a painful truth, like a lie cuz it feels good,
be neutral on the truth/falseness of a claim, etc. https://wiki.opencog.org/w/TruthValue
-- https://twitter.com/DagBallGame/status/1705298123835441507 2023-9-22


Lambda Rick /acc
@benrayfield
Now
I dont know why its spraying brightness all around screen at angles and triangles, but I know exactly why it fits
the phase and amplitude of a few constant frequencies to the 2d ball positions, cuz thats the example code I wrote
into GLSL which took only 2 dimensions per freq
-- https://twitter.com/benrayfield/status/1704023553404711282


[[2023-9-18 https://twitter.com/benrayfield/status/1703946359185854770
The digital form of the toffoli-gate is a unitary/reversible transform of 3 bits to 3 bits and can simulate every possible
NP math problem (such as 3SAT, travelling salesman, etc) if you know the starting state of the "temp bit vars"
https://en.wikipedia.org/wiki/Toffoli_gate
]]


[[[2023-9-18 https://twitter.com/DagBallGame/status/1703887152520585495
By players voting on priorities to be solved live in browser by constraint solver (often not best possible solution), instead of directly on actions, they cant vote for logical paradox, so that should extremely reduce lag to sync the game across the world.
https://www.youtube.com/watch?v=8797KEI24VQ&t=12s "Futurama - My head was built with paradox absorbing crumple zones" (santa claus robot hearing what may be a paradox)
-- https://twitter.com/DagBallGame/status/1703887152520585495
]]]

[2023-9-17 https://twitter.com/DagBallGame
DagBall - 1000 dimensional hackerspace
@DagBallGame
Opensource browser balls rolling game up to 1000 dimensions on screen. r/place is to pixels as DagBall is to 1000-dimensional shapes. TODO massively multiplayer
Click the URL to play nowtinyurl.com/dagball009Joined September 2023
23 Following
6 Followers
]


[[[[
2023-9-17-914pET https://twitter.com/DagBallGame/status/1703577910286618679
DagBall - 1000 dimensional hackerspace
@DagBallGame
The most efficient SAT-solver (such as 3SAT, bayes rule, travelling-salesman, max-clique, etc) I know of is a 2d grid of each square cell has 17 possible state, 16 possible 4SAT constraints to exclude 0000 0001 0010 0011 0100 ... 1111, and 1 for if none of those solves it.
9:05 PM · Sep 17, 2023
View post engagements

DagBall - 1000 dimensional hackerspace
@DagBallGame
·
Now
I could probably bayesian inference an ed25519 digital signature on such a 2d surface of 17 color dimensions which each pixel sums to 1, or any turing machine, rule110, etc.
]]]]

Opensource browser balls rolling game up to 1000 dimensions on screen. r/place is to pixels as DagBall is to 1000-dimensional shapes. TODO massively multiplayer

Opensource browser balls rolling game up to 1000 dimensional graphics & physics in view TODO unlimited total dimensions painted onto massively multiplayer space

Opensource browser balls rolling game with up to 1000 dimensions on screen at once and TODO unlimited total dimensions painted onto massively multiplayer space

Opensource browser ball rolling game with up to 1000 dimensions on screen at once and unlimited total dimensions. TODO massively multiplayer. #GLSL #GPU #web3


[[
https://twitter.com/DagBallGame/status/1703482257292284353
DagBall - sparse-dimensional manifold game
@DagBallGame
·
11s
r/place is to pixels as #DagBall is to 1000-dimensional shapes. Scaling up... Many players could each add a new 0-1000 dimensional shape within any chosen 2d circle, as often as they want. Each shape is small GLSL code that uses float[up to 1000] array and returns potentialEnergy
Quote
Lambda Rick /acc
@benrayfield
·
Sep 14
https://facebook.com/groups/681432730566305/posts/681491653893746 Massively Multiplayer DagBall be like r/place except instead of each person painting 1 pixel every few minutes forming 1 pic, fast paint dimensions, curves, patterns of bending & movement. Dimensions are like colors we paint in 2d brings game world to life
]]


DagBall - sparse-dimensional manifold game @DagBallGame DagBall is similar to a neuralnet
in how the ground learns to predict where balls are and
makes those areas dark. Bright is where it predicts balls wont be. The up to 1000 dimensions
that can be on screen at once are parameters of an "AI model".
The GPU circles are sparse models. -- https://twitter.com/DagBallGame/status/1702477556149035501

[[[ https://www.facebook.com/groups/dagball/posts/681523443890567/
Play now at https://tinyurl.com/dagball009 DagBall is a browser game made by a math ninja where
the ground reshapes itself powered by the weight of balls rolling on it, which makes the balls roll
differently, which makes the ground reshape itself differently. Its a sparse-dimensional manifold
designed to be expandable up to trillions of dimensions as long as at most 1000 dimensions are on
screen at once. The patterns of curves are flexible enough to build a small neuralnet to think
about how to curve it next. It will be massively multiplayer but for now is 1 player. Curvy hills
and valleys and snake-like ditches and bridges and skateparks and racing can be painted onto a
2d surface and come to life. There will be an in-game editor where a DAG forest of pieces of GPU
code are added shared and played by many people, but its 1 player for now.
Code: https://github.com/benrayfield/DagBall
]]]


Use the multiverse to solve conflicts. DagBall will soon be a multiverse of
all possible game worlds (of a certain type). If theres a conflict about game content, like someone thinks
you drew a dirty picture with the moving hills, both game worlds exist as "parallel universes" except
there are smooth paths between all parallel universes and balls can roll smoothly between them. To go
to a parallel universe where the dirty picture does, or does not exist, you move in the dimensions of
the GPU circles that the dirty picture is made of. This will appear as hills going flat, or a flat part
of the game world getting curvier, smoothly between. Many parts can overlap, and their height is added
at each 2d point. -- https://www.facebook.com/groups/681432730566305/posts/681507037225541/

[[
https://www.facebook.com/groups/681432730566305/posts/681462507229994/
Ben Rayfield
Admin

  · 
sdpenoSotra01
t
9cf4i7442
s
130
 
2
u
89
J
uf0u15h40
n
6
w
25hga96f52mgc
o
8
  · 
The game will be made by the players while playing it. Each mod of the game acts in a certain circle (centerY centerX radius) and has no effect outside that circle. It can be any GPU code that uses up to 1000 variables, so up to 1000 dimensions on screen at once, but you should normally limit it to 100 variables so multiple circles that partially overlap eachother can happen at once. When you leave that area, those variables are ignored, and the variables in the circles nearby are used instead. Each circle has 2 variables: nameOfCircle_exists for is it part of the game or not, 0 if its not part of the game, 1 if it is, or 0.3 if it hasnt made up its mind and has only 30% effect on the heightmap that the balls roll on. The other variable in a circle is nameOfCircle_isInView, which is 0 to 1 for should physics and graphics be computed. Only 1000 variables can be in each view at once. If there are a million players, thats a billion variables total, and there might be trillions of variables "frozen in time" until players move to those areas of the game. This varying amount of "velocity decay" is similar to friction, not exactly bending time (cuz I dont know how to do that without causing black-hole-spaghettification ripping the game world apart), but will be similar to this video, which is 3d, but the graphics in this game are a 2d cross-section of a trillion dimensional constant sparse-dimensional manifold, similar to how the Miegakure game is a 3d cross-section of a 4d game world. 
Alice Through The Looking Glass (2016) - The Time Rust Takes Over
YOUTUBE.COM
Alice Through The Looking Glass (2016) - The Time Rust Takes Over
]]

[[
https://www.facebook.com/groups/681432730566305/posts/681448963898015
Theres not much in the game yet, just a vibrating rubberband that tends to shape itself into a few certain frequencies, that balls roll along and sometimes are thrown out of. Most of the game will be made by the players while playing it, at first by writing new GPU code (my TinyGLSL javascript file makes browsers do a teraflop, a trillion adds multiplies etc per second) that changes how the ground curves (reacting to the ball positions) within a chosen circle (centerY centerX radius). Outside that circle, that GPU code will have no effect. There can only be up to 1000 GPU vars on screen at once. The other GPU vars are farther away and are swapped in when you move around the endless 2d space. Later this will be done by drag and drop similar to my wikibinator203 universal pattern-calculus combinator, but for now we will write GPU code directly to reshape the sparse-dimensional manifold that the balls roll on. If theres a million players on a million computers that each do 1 teraflop (10^12 calculations per second) thats an exaflop (10^18 calculations per second) which is enough to simulate a Human brain in realtime and would basically be its own supercomputing cloud, as a peer to peer network. Id like to add wikibinator203 lambdas, attach them to certain balls and roll them around between the players, call them on eachother to find or create more lambdas, but that can be done later. Lets have fun.
]]


I'm making a massively multiplayer game as a sparse-dimensional manifold, where all players can edit the GPU code
of the game while playing it. Single player so far.
Facebook group: https://www.facebook.com/groups/681432730566305
Code: https://github.com/benrayfield/DagBall
Play now: https://memecombinator.io/experiments/Dagball009_physicsWorksTodoCreativeGameDesignOfTheEquationsAndTuning_2023-9-12-2pET.html


Facebook group: https://www.facebook.com/groups/681432730566305/
Tag cloud: game math gpu physics-engine curve-fitting swarm ball glsl-shaders neuralnet massively-multiplayer
scalar-field player-created-content tinyglsl sparse-dimensional-manifold


TODO "you might want to compare each float to the float down and to the float right and display that 2d vector
in 2 or 3 colors (see complexnum graphics, for example). You'll get more precision by displaying the 2d angle
than the float directly."

DONE using dagball.byteRectTrail: display history of ball positions, a trail behind them, so i can check it for curves
vs are they always moving in straight lines?


TODO...[[[
	Dagball have "ports" their own numbers they overlap try to make my port and your port equal scalar. Display these as small balls of varying brightness and when mouseover one it shows which others its connected to. Connection strength falls gradually to 0 (max 1?) When farther away, so can sim it sparsely. Might get jumpy when get near it again, but try for smoother by gradually varying connectionstrength so it has a few seconds to pull together.
Put each ground object in a circle and window it smoothly down to exactly 0 near edges.
Display its ports on its edges around circle. Maybe display connections as line between 2 portballs on 2 circles edges. Maybe allow the portballs to move around circle edge depending what its close to on screen.
Name each ground object ala circle with ports.
Maybe have 2 layers of ground, one of scalarvars and one of ports, so many ports can be connected with linear not squared edges. Maybe require varatyx be inside any groundcircle that connects to it?
Connected ports are a simple relation, just tries to be the same scalar. Put leastsquares on their diff.
Also hook in music tools webaudioapi (fix lag andor jsoundcard option thru ajax) as some of the circles.
Other circles mught have wikib fns.
In tinyglsl the total ports computed on one screen (and nearby) must be at most 1024 or 999 etc. They dont overlap.
Or half or 1/3 of that cuz need weights of their connections to leadtsquares to include in unified energyfunc.
Or, keep the 1000 vars and add the port leastsquares in cpu. Yes do it that way.
Include a chanceorweight var per groundcircle. When 0, that circle has no effect.
Make the varatyx be the weightedaverage of the ports its a connection between, so converges faster.
Name varatyx by its y x?
That way, the ptr to it can be defined in the groundcircle instead of externally.
Or maybe just put the port inside the circ to start with. Like plugging circuits together.
The chanceorweight var of the circle itself is at its center.
This can be edited together in mmg live by adding groundcircs from chance 0 smoothly up to 1. Remove is opposite.
Have 2 chanceorweight-like vars per groundcirc, one for dors the groundcirc exist, and another for is it inornear view.
Name each groundcirc by hash. Suffix of _exists and _inview and _var17 etc.
This is space of exponentially many sparse dimensional scalarfields.
Balls arent in that design yet. Define them here... scalarfield height aka poten at given y x is well defined and smoothly changes with view and editing the grounds in mmg sparsely. Theres 2 heights, one with, and one without, the leastsquares between ports. Try the one with ports first. Diff players can have diff views that update game state differently.
Sync later if far away.
A kind of groundcirc can be a sensor only, such as to display text like logging. Varatyx344_8744+" is the var value". Etc.
A groundcirc could  also be just constant data such as a pic, text, fn, etc.
A sensor might have code that writes byterect to display custom graphics.
A  varatyx kind could be an input, such as gamepad axis button microphone etc, but careful to not instantly pull other ports to that.
Make varatyx each be named like y5695x322 and be nxn pixel squares so can keep them in array. Such as 4096x4096? At such grid cells theres an input var and a normal var. But might want the input vars named by publickey or arbitrary string? Also maybe a third one at grid cell for the weightedave of ports there. And velocity vars.
Or maybe make the vars sparse 2d?
256x256 per screen should be more than enuf.
Or could binheapindex them in 2d so each 2 bits chooses a square in a square, but that creates problems with overlap in display.
Should the ground be rectangles or circles?
4 kinds of grid squares: normaldimension inputdimension groundexists groundisinview.
Problem, there can be multiple portsvarsetc at same 2d location.
Solve that by each is a small ball with a target 2d location and is attracted to there but wont overlap other such balls
The _exists var per groundcirc, maybe it should be useable also as a normaldimension by higher level groundcircs, so the dag. _exists of parent must be at most the _exists of each child. Hyperspherenet does that with sound, kind of.
The dag defines forest of dimensions but not positions and velocities in them.
Or if it does then thats a higher dag layer or separate layer. Maybe an avetime stddevtime and partial map of var to scalar, would be a useful node. Yes, do that. It will be how the network syncs softly not lockstep.

2023-9-14 https://twitter.com/benrayfield/status/1702316774505525621
Math question (need for game): Each var is at a 2d circle, and above that circles inside circles, and in that higher layer theres a scalar field of those dimensions its in, then can sparsely define variable-dimension scalar field of POSITION. How to optimize velocity sparsely?
Planned solution: The scalar vars of each ground-circle are not shared with other circles but have a weight between pairs of them across ground-circles to pull them toward the same scalar. Each ground-circle has an _exists var and a _isInView var. Multiverse of state space.
]]]
*/


//TODO
//Ben F Rayfield offers Dagball under opensource MIT license.
//Dagball aka Directed Acyclic Graph Ball, is a game of n dimensional heightmap,
//which balls roll on 2d crossSection of, and which crossSection varies by player (Humans andOr AIs) controls.
//The DAG part is equations of n dimensions to scalar, as heightmap.
//Those can be viewed as a javascript function of Float32Array to number, or in parallel using TinyGLSL, TODO.
//Its a sparse game world where each part in 2d is bell curve windowed,
//so what it adds to heightmap is multiplied by height of that bellcurve.
//Its also 2d affine transformed (aftrans), which I might do as centerX centerY and 2 2d vectors from there
//OR I might do it as centerX centerY normalVec2d OR centerX centerY angle, or something like that.
//The aftrans makes the DAGs more reusable.
//The DAGs (dag nodes) will be javascript objects but be optimizable as javascript eval andOr TinyGLSL in some cases.
//Each DAG can have 0 or more childs and is immutable.
//Roundoff is allowed.


//2024-9-27 these are written but not read. They have no effect.
// Dagball is single player on 1 computer so far and is about to expand.
// Theres mutliple kinds of ids and its not ready to use this yet.
// But this is not far off from what I'm going for.
const syncTypes = {
	const: {description: 'const or hash, so no updates. The syncType of a node does not mean the syncType of its childs, so even if childs are not constant/const, any of their parent(s) can be const'},
	pubkey: {description: 'pubkey, so can update its 1 var val with a timestamp and new val as many times as it wants. The pubkey might also have a const type like to limit size of future vals?'},
	swarm: {description: 'swarm, so its just a named object whose val (including weighted child ptrs maybe) is gradually agreed on or forked by the many computers and players. Namespaces are useful here in case of forking. The voting on priorities of hopfield constraint solver and median voting on num val etc, acts on swarm vars.'},
	unknown: {description: 'FIXME nothing should have an unknown syncType but since Im still designing this software I havent figured all that out yet.'},
};


//TODO build Gpucirc as a dags.Swarmvar but use its vartype (or what is it called?) to require its vals have certain fields (and types of those?)
//such as y x radius (or just include a dags.Circle?) and that all its childs be leaf vars (what are those? swarm vars of pos vel velDecay and have a dags.Point each? color?)


//byte offsets for ByteRect, canvas, etc, in js.
const RED = 0, GREEN = 1, BLUE = 2, ALPHA = 3;

var C = null; //selected dagball.Circ, set in dagball.setSelectedCirc, for convenience on browser console. In dagball code, use dagball.selectedCircs()[0].

const dagball = {
	license: 'Dagball, Ape, TinyGLSL, and CallGPTFromBrowser are opensource MIT licensed. Wikibinator203 is opensource GNU AGPL 3 licensed with 3 extra permissions including classpath exception.',
	namespace: 'testNamespace567',
	/*
	https://twitter.com/benrayfield/status/1721596783975891369
	https://twitter.com/DagBallGame/status/1721589066934730865
	Lambda Rick /acc
	@benrayfield
	IANAL but I do work with opensource software licenses and came up with this to protect the turing-completeness and swarming of the DAG while allowing connection to nearly anything, such as GPT4 or proprietary AIs and cloud services. Opensource is preferred
	Quote
	DagBall - 1000 dimensional hackerspace
	@DagBallGame
	·
	30m
	Replying to @DagBallGame
	Dagball is opensource MIT licensed. Wikibinator203 is GNU AGPL3 with 3 extra permissions including classpath/linking exception. The viral-license of it does not expand to the MIT code, only to wikibinator parts. Its so if u get a lambda (DAG node) u can get its childs recursively
	*/
	todos: [
		//2024-9-27 i have not been much using these todos and dones lists for long time, a few things here and there maybe.
		'2024-5-9 remove the false && from if(false && existingEdGroup && existingEdGroup.eds.length == targetNumEdsInThisGroup) but see comments about detailed code need to write',
		'2024-2-24-4pET the fadeTiles checkbox exists but is not hooked to any code. Code it to make dagball.influenceAtYXR be 1 everywhere if NOT fadeTiles, so can track down bugs in the tile system, since its hard to see whats in GPU if it might just be invisible (influence 0 or near 0) but still computed in GPU.',
		'2024-2-24+ makeButtonToMoveViewAroundFastToPreloadGPUCompilingForWhatsNearby this is about the sparseWorld checkbox',
		'2024-2-[22..24]+ //and physics affected by it (FIXME or even farther if its ed lines are outside the circ)',
		'2024-2-[22..24]+ doesnt work with 0 circs: "--- It appears the problem is at some time having 0 circs in Ap.js, as in this code i found in browser debugger [[[{doLast (balls locparMem (numBalls 11) (floatsPerBall 2)) (circHeaders locparMem (numCircs 0) (headerFloatsPerCirc 4)) (aftrans locparMem {4})...]]], which is a bug ive found before in a different form that deleting the last circ that runs in GPU causes it to crash. 2024-2-22-540pET. I confirmed this by making sure a circ was displaying before turning on sparseWorld, and it worked until I scrolled away from it."',
		'2024-2-22+ makeSparseWorldCheckboxMultiplyByInfluenceAFTERSigmoidortanhetcLimitingEachCircNOTBEFORESoItFadesOverLongerDistance',
		'2024-2-22+ Fix alwaysUpdateViewInNextState to work when the set of things to display changes related to sparseWorld for all object types, cuz otherwise i have to check it to make it update which circs are displayed.',
		'2024-2-22+ The sparseWorld checkbox works only when sparseWorldOnlyInfluence checkbox is checked (so sparse in influence but all objects exist in GPU so not actually sparse in a useful way). Error[dagverse/:2594 Uncaught unkown apeType: 0]. hasGpuCodeAndShouldUseIt is giving the correct answer of should circ be computed in GPU or not EXCEPT i want to delay that change until the next physics/graphics/nextState cycle so different parts of the calculation all see the same set of circs. The dagball.doAsap(func) scheduling function can do that, but ill need to store the data in the circ itself (maybe use its circ.exists var? or make a new var? cuz .exists is meant to mean remove it completely from the memory, leaving it only on peer to peer network andOr saved *.dagball files. Maybe call it softExists or something like that?). Also see the alwaysUpdateViewInNextState bug about this. --- It appears the problem is at some time having 0 circs in Ap.js, as in this code i found in browser debugger [[[{doLast (balls locparMem (numBalls 11) (floatsPerBall 2)) (circHeaders locparMem (numCircs 0) (headerFloatsPerCirc 4)) (aftrans locparMem {4})...]]], which is a bug ive found before in a different form that deleting the last circ that runs in GPU causes it to crash.',
		'2024-2-22+ use circHeadersContents.push(circ.computeInfluence()); in case of not compileCircHeadersUsingLocMem',
		'2024-2-22+ use circHeadersContents.push(circ.computeInfluence()); in case of compileCircHeadersUsingLocMem',
		'2024-2-22+ use circ.computeInfluence()',
		'2024-2-22+ use ball.computeInfluence() similar to circ.computeInfluence()',
		'2024-2-22+ //gradually between. TODO make this smoother? Its a straight angle between flat 0 and flat 1, //and I dont like it having corners. Should it use the math called "ease in out"? It would slightly weaken it //therefore needing sparseDistFar to be a little bigger to have same size of view near the edges, //but extend the parts where its near 1 out a little past sparseDistNear. //This is a research path to be explored. return 1-(dist-sparseDistNear)/(sparseDistFar-sparseDistNear);',
		'2024-2-21+ DV.Fastree has nothing to do with "approximately-maximum-likelihood phylogenetic trees from alignments of nucleotide or protein sequences" which I see is also called fastree. I just meant "fast tree".',
		'2024-2 (has always been this way, TODO fix anyways) Theres still some webGL security stuff (dont want one guys content overwriting anothers in GPU memory, etc). The DAG is coming. Its not a sparse game world yet, will be soon.',
		'include whole nacl software, licenses, etc from dchest_tweetnacl-js-1.0.3_2024-2-8.zip the license is the Unlicense "This is free and unencumbered software released into the public domain." and few more paragraphs, from https://github.com/dchest/tweetnacl-js',
		'//doesnt unselect circ if any was selected. FIXME its getting replaced by the usual circ.text right after this so this isnt displaying. displayTxtQuiet: function(txt){',
		'if(map.nn){ //cuz of cycle circ.nn.circ. FIXME should nn (a RbmCircBridge) lack the circ ptr and take it as a param in its relevant funcs?',
		'When dagball scales up it will naturally tend to create alot of WebGL2_GLSL context objects being invalidated by pointer out of range in GPU. WebGL already sandboxes this, but it does create a delay to create another context object. For lower lag I need to [en.wikipedia.org Formal verification - Wikipedia] .. and by it naturally creating out of range pointers, I mean that it is not running proof checker on the simple algebra expressions like y*width+x. ... That should in theory result in it safely running unlimited variants of custom GPU code forking and merging with eachother freely across many computers and people using those computers (peer to peer) where the network survives and sorts out useful from non-useful info.',
		'physicsCyclesPerVideoFrame_targetMinFPS: 59, //FIXME if the screen has a max FPS below this, it will go to physicsCyclesPerVideoFrame trying to raise it.',
		'//same string returns same js lambda, whatever apeFuncJs returned. FIXME clear that cache if theres too many? dagball.cachedApeFuncJs = function(text){',
		'//FIXME should use .mutid and get rid of .id (see Dagverse.js)',
		'//TODO optimize by when line is partially on screen, start and end i at different integers.',
		'//let yy = this.aftrans.reverseY(gameY); //FIXME why is it 2 reverses? This looks wrong. Might have done it wrong multiple places to get it right together?',
		'max call stack exceeded on the base64 func string.fromcharcode something 2024-1-30, but only when try to save new random bitpic, already its bytes, about 300kB. its part of javascript, dont know whats going on, but its working when the bitpic is not random, is the racetrack i painted.',
		'dagball.BitPic.prototype.paintOntoPotens(addHere, addHereHeight, addHereWidth, aftrans){ //FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.',
		'//FIXME 2024-1-30 this is likely to break code that assumes par and loc are same size. Its an upgrade that was planned during design of par and loc.',
		'//FIXME these might vary across gamepads. Use dagball.actionControls to make controls //customizable by user, but will need a UI for it and somewhere to save the controls mapping.',
		'//2024-1-21 havent used dagball.game.pos for a long time. TODO remove oThisBall?',
		'//FIXME since didnt call dagball.afterEveryCanvasDomEvent(event); (cuz this happens every video frame, not on events), //the controlsChanged code might not work for it? dagball.update_prev_directControls(); is farther below in this same nextState func.',
		'let canvasScale = Math.sqrt(dagball.canvasScaleY*dagball.canvasScaleX); //ugly hack. FIXME',
		'add <input type=checkbox id=doKnobGradients checked><label for=doKnobGradients>doKnobGradients</label> to wholeGameState etc',
		'detailedEds are displaying on the last selected circ even if none is selected, or is it selected when it shouldnt be? the circle icon on circs perimeter goes away when mouse is not near any circ, but the detailedEds still display 2024-1-16.',
		"//FIXME hardcoding knob dragging to dagball.controlsChange('selectLockAOn') cuz thats been left/main mouse button for a while as of 2024-1-16.",
		"unless controls mapping changed (FIXME): draggingEdSliderKnob: null, //null or the dagball.EdSliderKnob being dragged by mouse. dagball.controls('selectLockAOn') is 1 when left/main mouse button is down, unless controls mapping changed (FIXME)",
		'let add = mouseChangeAlongEdLine*5.5; //FIXME why this constant?',
		'Merge coordinate systems. some things are in game coords (about 100 pixels per 1.0 distance in game at normal zoom, but zoom varies extremely) and other things are in canvas pixels coords, it appears 2024-1-16: edSliderKnobOrNull.val += 0.11756163013873532 mouseY=3.4458233121285233 knobY=178.0632613180356',
		'connect <input type=checkbox id=mouseDragsKnobs checked> and other checkboxes (those this isnt done for yet) into wholeGameState, and the new way of saving where everything is its own {} object.',
		'remove ed.velDecay and ball.vd or ball.velDecay cuz its computed somewhere else instead',
		"if(dagball.controlsChange('selectLockAOn') == 1 && !edSliderKnobOrNull){ //FIXME what if selectLockAOn is not connected to mouseButton0/leftButton?",
		'knob.isSelected = knob===edSliderKnob; //FIXME since knob.toString() returns knob.val (a number), would == return the wrong thing here?',
		'finish gameStateToDagverse and start using it instead of the save/load buttons, but stay compatible with the old data format at least until i get those i want to keep upgraded to the new data format.',
		'this.writeBit(index*2+1, highBit); //FIXME should this endian be swapped?',
		'//TODO optimize this by writing 8 (instead of 1) bits at a time when size is at least 8.',
		'//FIXME this poten might be scaled very differently cuz of summing alot more pixels?',
		'//FIXME updateSelfAndEds must do the same thing with dpos dvel and dfriction as it does with gradient. 2023-12-17 its not doing that yet, so connected eds wont transfer that as well between circs.',
		'explain the apeV2 syntax: "[" means "(ptr". "<" means "(=". "{name stuff..." is same as "(stuff..." but doesnt name it. ... Ap.js GPU language changed. Swapped some strings. f+= is now +=. Removed f meaning float. Swapped () vs {}. * changed to oo meaning loop. + changed to do meaning a list of statements to do. The "ape: (V2)" vs "apeV1:" buttons convert code in the textarea',
		'locparMems without names get merged. likely cuz of name being generated by hash if you dont give it one. But if you put something between them it doesnt merge those separated, only those adjacent. (abc locparMem {2}) {locparMem {3}} {locparMem {3}} {locparMem {3}} {locparMem {3}} {locparMem {3}} {locparMem {4}} (xxyy locparMem {3}).',
		'Make dagball.aftrans save and load with the rest of game state, or at least the magnifyY magnifyX parts, or maybe ratio of those to canvas size. dagball.aftrans = new dagball.SimpleAftrans(dagball.screen.byteRect.height/2, dagball.screen.byteRect.width/2, 100, 100);',
		'FIXME moveView is unstable when set at the same speed as mouse. It vibrates back and forth until goes off screen. Likely some sync problem between mouseY mouseX and controlsChange being relative to that aftrans... let mul = dagball.aftrans.magnifyY*2/3; //FIXME const scheduleAddY = mouseDy*mul; //FIXME use dagball.aftrans to convert the coordinates somehow ... but 2023-11-29 it is working at the 2/3 of mouse speed. if raise that to 1 it gets out of control.',
		'FIXME get [edsAvePos, edsStdDevPos] from all circs in dagball.view.circs, instead of just this circ, so ed line brightness is normed by that bellcurve',
		'Fix TinyGLSL so dagball works in linux: doc/gpu/ubuntuTestFailed2023-11-24 has txt and 2 pics, 1 pic of WebGL error and 1 of WebGL working in some webgl example online',
		'Make Dagball and Ap.js and TinyGLSL.js work on mobile browsers too. Dagball works on most desktop browsers but not (yet?) mobile browsers. Maybe its cuz of using multiple off-screen canvases or EXT_color_buffer_float? Android Studio with a usb wire is 1 way to get browser console errors from mobile. https://caniuse.com/?search=EXT_color_buffer_float',
		'Bug: when move an edgroup (lines pointing in a circle shape) of of one circle onto the lines from another circle, the dont match close enough. some lines match by snapping to the grid, and some snap to 1 gridcell length away. its likely caused by adding dy and dx to them, accumulating roundoff, or something like that, in eds... figure it out, make it easy to hook circs together: ... toY = dagball.roundToEdSnapGrid(toY); ... newEdGroup.pointAtYXR(circ.y+(Math.random()*2-1)*.8, circ.x+(Math.random()*2-1)*.8, pointAtRadius); ......... FIXME this is making the movement of ed lines get out of sync with mouse cuz it snaps to 2d grid without summing over multiple mouse events: ed.y = dagball.roundToEdSnapGrid(ed.y); This could be solved by having 2 y vars and 2 x vars, for example.',
		'let setAllGradientsTo = this.weightedSumGradient/this.sumWeights * this.eds.size; //let setAllGradientTo = this.weightedSumGradient/this.sumWeights; //FIXME gradient has to be sum of all gradients. If all weights/circInfluence are 1, then this.eds.size/this.sumWeights is 1 so its a simple unweighted sum.',
		'Bug: {i+1 linkExceptLast} in [...] is not generating code and is just displaying its ape.LoopName(). see big text in comment starting with that near bottom of dagball html script.',
		'For efficiency, (look up this comment:) FIXME dont copy par to loc in display, and use different Mem types (auto convert some of them), for efficiency. <(isDisplayElsePotensForGradient float) 1> {* (gradientCopyIndexUglyHackForDisplay copy {par}) <[{loc} gradientCopyIndexUglyHackForDisplay] [{par} gradientCopyIndexUglyHackForDisplay]> }',
		'Bug where 2023-11-19-1140aET codemaker for poten was returning 0 but when i changed (the only ape:) 2 circs ape code to ape:<potenCirc$ {f+ .1 {fsin {f* x$ y$ 33}}}> (was ape:<potenCirc$ {fsin {f* x$ y$ 33}}>) it started returning  varying numbers around -5 to -15 from potensAve: as displayed on the top left (along with FPS: etc). Im guessing this had something to do with {fsin {f* x$ y$ 33}} always returning 0 at x$ and y$ being 0. Im saving Dagball090.html here and moving on to 091. See Dagball_2023-11-19-1146aET_seeBugInTodos.html and Ap_2023-11-19-1146aET_seeBugInTodos.js and TinyGLSL_2023-11-19-1146aET_seeBugInTodos.js.',
		'Write and pass more ape tests about copying between parMem, locMem, locparMem, and parlocMem, and returning stuff. 2023-11-16-520pET the Ap.doApeTests() all tests pass. But the potentialEnergy thing I tested there isnt working in codeMaker in dagball, so TODO write more ape tests.',
		'Likely should leave call.eval() returning Float32Array cuz "gradientMem.floats = gradient;" for example, but make call.evalTest() which returns a new object type wrapping the float array for testing it. Ap.Call.eval() 2023-11-14 is returning Float32Array, not Mem, but the codeMaker might be returning Mem some other way. "Ap.Call.prototype.eval = function()". I want it to return either Mem or Call or Ape or something, a wrapper of the floats. Ap.Call.eval() should only return an Ap.Mem of the same ape array names (inside par) if its gradient. If its for display, it should return a Mem of dimensions call.numGpuThreads X call.floatsPerGpuThread.',
		'In "let codeMaker = function(circApes, isDoubleHeightmap, isDisplayElsePotensForGradient)" convert locparMem arrays (or only some of them? probably only some, which complicates this, cuz code written by users might do other stuff with it) convert them to parMem, in display code but keep as locparMem in gradient/potens code cuz it needs the loc copy of par with +epsilon in 1 of the indexs for gradient. It would work to use locparMem for both display and gradient but it needlessly slows down display, in theory.',
		'Fix the gradientCopyIndex code so gradient works and the balls roll and the curvy hills vibrate',
		'2023-11-13 This is likely caused by not deriving parrMem inside of {loc} and doing the +epsilon calculations in gradient.length+1 gpu threads. I had planned to do that but havent done it yet, and theres no reason to expect it would work without that. The balls are moving with randomizePos and randomizeVel. I verified the numbers going into apCall balls array are nonzero. I verified the numbers coming out of GPU are 0s (probably the balls array) in most parts and a few nonzeros (probably the arrays or whatever it may be other than balls). .... gradientMem is all 0s 2023-11-13 but ball.gradientY and ball.gradientX do exist (and are 0) so the balls arent accelerating on ape:<potenCirc$ {fsin {f* 23 x$}}>',
		'ball.x += dt*ball.xv; if(ball.bal || ball.ballBal){ throw \'TODO... //FIXME ball.ballBal or will it be called ball.bal? ball.gradientBal. If dagball.isDoubleHeightmap then not using ballBal or pixBal but make gradientBal be 0.\';}',
		'//FIXME get gradient of the \'balls\' ape array. apCall.par.ptr(\'balls\') -> int index in gradient array. //have the .gradient() code put that in ball.gradientY ball.gradientX ball.gradientBal, and in ed.gradient let gradient = this.gradient();',
		'todo rename Ape.js to Ap.js cuz theres already an ape programming language? Rename it to something.',
		'dagball.view = new dagball.View(dagball.circles.slice(), dagball.balls.slice()); //FIXME make this sparse since the view shouldnt be ALL the circles and ALL the balls, only those on screen and nearby, however many will fit in the upo to 1000 floats/dimensions in GPU at once.',
		'ed lines arent appearing. ape: {+ (abc parMem {4}) <potenCirc$ {fsin {f* x$ {fsin {f* y$ abc}} 7.043}}>}  TODO apeType=parMem toTinyGlslCodeRecurse here, ape=(abc parMem {4})) * 7.043); Partly fixed 2023-11-13 by copying the matAB matBC matAC example code from version 088 into 090 and removing a throw todo and adding parMem into some func that only had other mem types (is declaring mem, func named something like that).',
		'make potens func work again after upgrade to Ape.js. its just returning all 0s 2023-11-12.',
		'Dagball will have wormholes as smooth manifold. Each pixel will have 4 numbers: green blue pixbalance distance, for 2 voxels above each (x,y). Ball is on linear interpolation between 2 heightmaps. Some places ball can be at both, some only blue, some only green, gradually between ..... The balls wont be able to jump between green and blue at that bridgelike/wormhole crossing cuz potentialEnergy will repel ball.ballbalance from being between green/blue. Will be lowest potentialEnergy at all green or all blue. pixel.distance tells where can jump/roll between .... pixel.distance is the vertical/z distance between the 2 voxels above that (x,y). The ball can only jump between the green heightmap and the blue heightmap when distance is near 0. Even if distance is near 0, ball can still be forced onto green or onto blue using pixel.pixbalance. .... green and blue are just 2 heightmaps, like the white/gray/black heightmap dagball already has. Will just be 2 of them overlapping. Green balls roll on the green heightmap. Blue balls roll on the blue heightmap. Ball can change ball.ballbalance to be some on green some on blue. .... Since it will be a smooth manifold, the wormholes will be computed the same as everything else, as potential energy gradients. .... Dagball will support wormholes with moving ends, of varying size, that suck or blow or neither, that have only 1 end that leads to a bubble of isolated space (a blob shaped are in 2d), that spray balls from a chaoticly moving hose, or that dont move. In turing complete patterns. ... https://twitter.com/DagBallGame/status/1718318167598993443  see doc/pic/wormholesDesign.png',
		'See the parMem and locMem arrays. One of the reasons for this redesign is to derive the up to 1000 dimensional calculus gradients in Ap.Ape language instead of hardcoding in Dagball. So if someone discovers new calculus algorithms, they can share it with the peer to peer swarm. ... Use {par} and {loc} for that which all parMem parlocMem locMem locparMem etc overlap 1 or both of.',
		'CallGPTFromBrowser.js is a tiny incomplete javascript file that will repeat this experiment I did but in an iframe to protect your OpenAI API key from the rest of the javascript and limit it to a chosen number of calls before asking to refill. https://github.com/benrayfield/jsutils/blob/master/src/OpenAICallsItselfRecursively_2023-6-24-8p.html .... i said at https://twitter.com/benrayfield/status/1723446877574648036 2023-11-11. Dagball itself has no acct there. users provide their own OpenAI API key and pay for their own use of GPT, or dont click the button and it wont ask u for that. .... Similar to you can make software that calls AWS without giving your users your own AWS account. ... If there are CORS problems with iframe I could experiment with putting the high security code as the webpage (outermost frame) and the other code in an iframe (reversing parent/child).',
		'//FIXME what if it ONLY contains {par} but no parMem parlocMem locparMem inside it? should it throw then?',
		'This is being copied to Ap.js todos: Its not doing its own memory fencing yet and is passing out of range requests to the browsers webgl2. These seem already protected but since I dont want the multiple GPU codes made by the players of this game to read/write eachother, ive got to formal-verify my pointer arithmetic .... As long as you dont go more than maybe around 15 indent levels deep, I should be able to simply brute-force it in CPU, to verify that 2 untrusted GPU softwares merged together to display and play with on your screen, cant read or write parts of eachother except the parts they say .... Memory range and number of flops per ape (tree of apes) of code (...) {...} [...] <...> is constant. A simple list of possible memory ranges [fromA toA fromB toB fromC...] can derive more such lists recursively, but expands exponentially with tree height. .... https://twitter.com/DagBallGame/status/1722724456903172183 ........... Its not doing its own memory fencing yet and is passing out of range requests to the browsers webgl2. These seem already protected but since I dont want the multiple GPU codes made by the players of this game to read/write eachother, ive got to formal-verify my pointer arithmetic ( https://twitter.com/benrayfield/status/1722717597802659976 is this)',
		'gpucirc: THIS NEEDS A SLIGHTLY 3D UPGRADE. IN ANY CASE, PLAN FOR DAGBALL TO HAVE AT LEAST 2 (LIKELY 3) OVERLAPPING 2D HEIGHTMAPS AND FOR GPUCIRCS TO VARY ALL OF THEM LIVE, AND FOR HEIGHT TO BE MAXHEIGHT WHERE A HEIGHTMAP IS NOT DISPLAYED (SO BALLS CANT FALL OFF A BRIDGE, CUZ THEY WOULD BE ROLLING UP A STEEP HILL), AND SINCE BALL CANT FALL OFF THE BRIDGE, IT CANT CHANGE FROM THAT BRIDGES HEIGHTMAP TO THE HEIGHTMAP ITS CROSSING. PAINT THESE ARE PARTLY TRANSPARENT AND WITH 3D VIEW, IN CASE THEYRE ABOVE EACHOTHER. I WANT IT TO APPEAR USUALLY AS CURVY RED PATHS, OF VARYING THICKNESS, AND RED BALLS CAN ROLL ALONG THOSE, AND CURVY GREEN PATHS OF VARYING THICKNESS, AND GREEN BALLS CAN ROLL ALONG THOSE, AND SIMILAR FOR BLUE, BUT NOT EXACTLY CUZ THE PATHS MEET SOME PLACES AND ARE THE SAME COLOR ANDOR HEIGHT THERE. MAKE RACETRACKS PINBALL BALL PATHS ETC, STUFF ABOVE STUFF, IN THESE ~3 OVERLAPPING HEIGHTMAPS. BALL CHANGES COLOR DEPENDING ON THE COLOR OF PIXELS ITS NEAR, BUT MOSTLY TOWARD COLOR ITS ALREADY NEAR TO. MAYBE LIKE IN MY AUGMENTEDBALLS SOFTWARE THE BALLFINDER CIRCLE IS ATTRACTED TO WHATEVER COLOR IT ALREADY IS LOCKEDONTO MORE THAN OTHER COLORS SO WHEN A BALLFINDER THE COLOR OF MY SHIRT (AS WEBCAM SEES) GETS ON MY SHIRT, IT TENDS TO STAY IN MY SHIRT UNLESS PUSHED HARD OUT OF IT. DO SOMETHING LIKE THAT BUT FOR DAGBALL ~3 HEIGHTMAPS. THIS MIGHT TAKE MORE FLOATS PER PIXEL THAN ID LIKE, MAYBE 6 IF THERE ARE 3 HEIGHTMAPS (2 PER HEIGHTMAP, ONE FOR HEIGHT AND ONE FOR BRIGHTNESS). JUST PLAY WITH IT AND FIGURE OUT HOW TO MAKE THE BALLS CROSS EACHOTHER ON BRIDGES OF CONSTANT SHAPE, WITHOUT BEING ABLE TO JUMP FROM ONE ROAD TO THE ROAD ITS CROSSING A BRIDGE PERPENDICULARLY. THAT WILL BE THE TESTCASE. Make pinball game as a testcase for how flexible of physics and overlapping heightmaps it can do. BALL STATE IS Y X J K, WHERE J AND K ARE COLOR DIMENSIONS IN THE PLANE OF RED+GREEN+BLUE=SOMECONSTANT. ALSO THERES VELOCITY FOR EACH OF THOSE. PIXEL STATE IS EITHER [JA KA BRIGHTA JB KB BRIGHTB JC KC BRIGHTC] OR HOPEFULLY CAN GET THIS SIMPLER WAY TO WORK PIXEL STATE IS [RED GREEN BLUE]. Poten(tial energy) due to a ball is ball.red*pixel.red+ball.green*pixel.green+ball.blue*pixel.blue, and ball.red .green .blue are defined by ball.J and ball.K. BUT maybe its not exactly that, cuz i meant for ball J K to be attracted to nearby [pixel.JA pixel.KA] and attracted to nearby [pixel.JB pixel.KB] etc and theres also pixel.BRIGHTA pixel.BRIGHTB pixel.BRIGHTC etc. The reason for having multiple changing JK color positions per pixel is for multiple heightmaps to meet at some JK val at some (y,x) then as (y,x) farther away make the JK farther away. Or maybe it can be done with just J no K, and J is height/z. .... Think of this as a few 2d->1d heightmaps overlayed in 2d. Each ball has y x amountIsOnHeightmapA amountIsOnHeightmapB etc. Make an 8 shaped pinball ball track that balls zoom around fast, with level above level, thats all at the same poten (so only color matters there). Start with {c} apeType for whichColorDim but later have an option for each glsl thread to return vec4 so does 4 things at once, however many floats i need per (y,x) find a way. Lets use ........... Dagball is for example 500 shared dimensions (same for all balls) and 2 dims (y,x) diff per ball. Paints alot of dims onto  2d for bendy interactive curves. Heightmap cant make bridge for 2 roads to cross, but 2 heightmaps can. I want this for racing balls .. Dagball could easily handle 20 dimensional ball physics (20 individual dimensions per ball) with 400 shared dimensions and 20 balls so 800 total dimensions. The problem is its an expensive calculation to raymarch. Dagballs normal graphics are a 2d cross-section of the 1000 dims  https://twitter.com/DagBallGame/status/1717621139843715353',
		'gpucirc: chain of n bellcurve hills (each a link in the chain) but that has flat places between those links/hills that stuff can pass thru.',
		'gpucirc: nearly invisible chains and hard poles that are in 2d or 3d but always display in 2d. They have ends that can be constrainted to the ends of other things etc.',
		'gpucirc: pinball flippers',
		'gpucirc: those holes in the pinball 2d board that hold a ball until some condition then release it for many balls at once',
		'gpucirc: bridges that put up 2 horizontal vs 2 vertical walls and allow crossing 1 way or the other but not both. bridgees similar to a 4 way traffic intersection of horizontal and vertical but ball cant take right turn, and which of horizontal vs vertical it can go on depends on 1 or more other dimensions.',
		'gpucirc: draw some curvy wall lines with mouse but that are not all connected, but make them move like theyre connected anyways. give it dims of xcenter ycenter angle.',
		'gpucirc: make game object: mandelbrot or julia fractal, whichever has more params, that balls can roll around on',
		'gpucirc: whitneyMusicBox bellcurve shaped moving holes',
		'gpucirc: a circle with a bridge inside it, that turns at any angle and can connect 2 places',
		'hook ball.oThisBall and fns in such balls into dagball.game.pos and get lambda called on lambda finds/creates lambda working, as lambdas will be in some of the balls. Hook in GPT4 as a wikibinator plugin (Plug gpt4 textIn) -> textOut using pushEvaler and that gpt4 calls itself recursively html demo file, securely by users openai api key going into an iframe so this software cant get it but can request thru postMessage to the iframe to use it at most n times, for n chosen by user at the time.',
		'so a CC ball and a GPT4 ball (give your own API key to an iframe that dagball cant see) https://twitter.com/benrayfield/status/1711421940945051739 so you could call/cc combos of GPT4, wikibinator, and dagball, in massively multiplayer live.',
		'saveFn and, load whole game state from wikibinator lambda loadFn: function(fn)',
		'The game state would get snapshotted (faster than 1 video frame) to a lambda, so there would be a cc ball, and calling another ball on cc would do something like call/cc, to return another game state ball, that if you use it, loads that modified game world https://en.wikipedia.org/wiki/Call-with-current-continuation . In theory, wikibinator will sync in massively multiplayer even if there are a million call/cc on sparse parts of the "game tree" of all possible games (dagball being 1 of them) at once. I have a 1 to 1 mapping between pattern-calculus lambdas and the positive integers. https://twitter.com/wikibinator/status/1717260520871346495',
		'I could put a wikibinator203 lambda in a ball by writing its hash id, and you could drag ball/lambda onto ball/lambda which finds or creates a ball/lambda. A ball called on the whole game world or part of it could give back a modified game world, or just play forward normally. https://twitter.com/DagBallGame/status/1717234286611648751',
		'useWikibFnsToNavigateTheMultiverseOfDagball: Find a way for wikibinator203 lambdas to be useful for making dagball game content. The web of such lambdas is constant and deterministic (with options to allow nondeterministic roundoff lower on stack but prevent it higher on stack than any chosen place(s)) as 3 outgoing edges from each node. In the simplest case, dagball.Circs could be a tree of wikib [... [...] ...] where [n apeType params...] is the ape code, and use Treemap or [key val key val...] kind of Ns, for the circ obs etc. Simply make a way to represent game state. Use (TypevalC dagball_circ (Treemap ...)). So can transform 1 or more gameStates into a gameState. If want reversible transforms, then could wrap any fn in (Reversible fnX param) -> (fnX param) if (fnX (fnX param)) equals param, else -> param. So forall fnY (Reversible fnY (Reversible fnY param)) equals param OR does not halt. fns that tend to halt fast will be used and shared more often. Display this game world as dots with colored lines between them. Each reversible fn is a different color. All the lines that are such reversible fn are that color. Can only display 20 or so reversible fns at once. From each gameState there is a reversible fn of each color (if it halts and has been observed) to/from another gameState, u can go back and forth. Example reversible fn, a certain number, add 3 if its even, else subtract 3 if its odd, else if its not an integer leave it as it is. Example reversible fn, if a certain gpu_circle exists (exactly, its whole contents), remove it, else add it. But id also want nonreversible fns, which would be arrows instead of symmetric edges. Generalize this to 3 edge types (like in wikib treeUI but add the evalsTo/red edge): L R EvalsTo, outgoing from each gameState or fn. Display these, not with text, but just as small circles. When mouseover them, display in the rectangle drag and drop editor andOr load the game state into dagball to roll balls on hills. Wikibinator203 license is GNU AGPL3 with a few extra permissions including classpath exception, and all the lambdas are derivative work of that universal lambda. https://twitter.com/DagBallGame/status/1717230564162654379',
		'see comment in dagball html: TODO make this GPT4 API that lets users put in their own OpenAI API key into an iframe so Dagball and other websites can request to use it N times but cant get the key. When the new language is working, GPT4 should be able to build game content live.',
		'tinyGlslCodeFromCirc = dagball.parseApeCode(apeCode).toApe().toTinyGlslCode().replace TODO edGroup.pointAtYXR',
		'Add controls (hold a keyboard button while move mouse) to join 2+ circ.edsOut (dagball.Ed instances, the lines from circle perimeter) and hook them together after GPU poten() call to add the gradients of all that are connected together and hold their position and velocity together, as those should be stored in the circs.',
		'Too many off-screen canvases (79). Every time you edit GPU code it makes a new one. Trying to clear the TinyGlsl.caches = {...} but have to delete them in some order or it breaks WebGL. see TinyGlsl.clearAllCache()',
		'energy norming of potentialEnergy+kineticEnergy remaining constant, but thats kind of incompatible with velocityDecay and just moving stuff around with mouse. Will find something close to it. Maybe an alternative to scaledTanh on dagball.game.pos and dagball.game.vel.',
		'make example dagball.CellmataState for rule110 convolutional scalar field, and bilinear interpolate it for balls to roll on and bend it, and for it to make the balls roll differently. Put this in a dagball.Circ',
		`Fix this cycle where upOrLeftOfDiag is inside itself: (upOrLeftOfDiag trib fcfTriangleLoop {+
				<(otherNodeVal float) [fcfDiag upOrLeftOfDiag]>
				{f+= weightedSumCol {f* otherNodeVal [fcfDoubleTriangleWeights diag upOrLeftOfDiag]}}
				{f+= weightedSumRow {f* otherNodeVal [fcfDoubleTriangleWeights upOrLeftOfDiag diag]}}
			})`,
		'Some of these todos are done. TODO move some to dagball.dones andOr update some',
		'DagBall will support an exponential variety of scalable turing-complete manifolds. These are kind of random but simple basics of logic. DagBall will come with sparse 6SAT level swarms of bayes rule where each bayes6node fits in a WebGL2 GLSL kernel and can emulate any nand forest --https://twitter.com/DagBallGame/status/1708612525070131618 2023-10-1',
		'hook in the code checker that outputs things like this for each var vars.freq_1:{"type":"int","read":true,"write":true,"isReadBeforeFirstWrite":false,"declared":true,"line":10}',
		'circular wall rises around a ball and moves it around, as if grabbed by a circular hand and moved then released.',
		'screw, sine wave, or sum of sine waves, etc.',
		'constant curvy paths to roll down.',
		'mostly flat platform with walls and obstacles in middle, that you tilt in 2d with 2 other dims.',
		'elevator controlled by 1 dim.',
		'needs 3d or at least 2 flat worlds overlapping (blue vs green per pixel etc). something like those scissorlike lines in screwballscramble game that ball rolls along.',

	],
	dones: [
		//2024-9-27 i have not been much using these todos and dones lists for long time, a few things here and there maybe.
		//TODO list what ive done already. alot of stuff in the "todos:" list probably should be here as of 2024-2-23?
		'FIXED 2023-11-12 by by copying the afMagnifyY afAddY etc code into ape code generator. Fix the coordinate system in <x$ ...> being pixel indexed instead of the coordinates circs and balls use. This switched coordinate system to pixels in the Ape.js upgrade ~2023-11-12.',
		'FIXED 2023-11-12 by checking dagball.view.hasGpuCodeAndShouldUseIt(circ), ape code goes in the wrong 2 circs in Dagball089.html 2023-11-12-1220pET. Its windowed to a different circ than the code is in. why? circHeaders array?',
		'DONE 2023-11-12. Use mergedApCalls to generate graphics from the circs that have ape: text. the display func has some arbitrary code just to test the graphics during the upgrade of moving dagball.Ape/Ap.Ape to its own file Ape.js (todo rename that to Ap.js cuz theres already an ape programming language?)',
	],

	mouseColorRGB: [.1*255.999, 1*255.999, .3*255.999], //[redByte, greenByte, blueByte] but maybe fractions not integer byte?

	/*
	//stop browser debugger here
	breakpoint: function(){
		breakpoint;
	},*/
	debug: {}, //put vars here that are checked for in conditional-breakpoints

	experimentalGradientMul2: 1, //if this is 1 it has no effect. vary it for wavefunction collisions to stop it from being so jumpy??

	//This makes a kind of line appear on the screen that points from one circle to another.
	//Most of its length is the same color as the FROM circle, and the part near the TO end is the same color
	//as the TO circle, and then theres a little empty space cuz it does not touch the TO circle.
	//Theres keyboard controls to create, delete, and other kinds of editing of those Edge's.
	//Thats Edge, not Ed. Ed is a floatVar/dimension.
	//
	//as of 2024-5-24 edges (dagball.Edge) exist in the demo that starts with dagball.html but were not used anywhere else and have not been saved in any *.dagball files.
	//They were for future expansion, and now is [UPDATE: 2024-9-27 i havent been doing anything more with neuralnets fitting together and am focusing on the "5+ kinds of eval" redesign which should scale dagball up by having most circs be preferCpu=true (checkbox is checked when that circle is selected). neural goo is delayed cuz theres more scaleable prototypes to build first, and scaling to the most number of players at once is a big part of what will make dagball fun, its a swarm game.] the time to do that expansion for gooGroup: and gooSync circ types.
	//[[
	//Dagball is getting a new layer soon that will have tiny neuralnets training eachother so they continuously cover a 2d game world,
	//each near some 2d area partially overlapping other tiny neuralnets. Will have some stuff other than neuralnets, but neuralnets are
	//easier to scale. The new dagball layer will probably use these DAG edges up 2 more layers. First is to group them into a gooGroup,
	//so the curvy hills add together within the group. Then on pairs (or more?) of groups to use least-squares so they agree on the
	//curves where they overlap.
	//]]
	edgeEdit: {
		viewEdgeFromId: null, //set by viewEdgeFrom. id of a circ.
		viewEdgeToId: null, //set by viewEdgeTo. id of a circ.
		//set by viewNextEdgeType viewPrevEdgeType or viewEdgeTypeText. Example edgeTypes: any, like, true, gpucircExistVote, gpucircInfluenceMedianVote.
		//Will likely add some for the circ.text starting with 'gooGroup:' and 'gooSync:' but those are circ texts not edgeTypes. They will use edges.
		viewEdgeType: 'any',
	},

	//get checkbox value true/false. dont call this in a big loop cuz thats slow. call it once outside that loop.
	//false if checkbox doesnt exist (happens near boot or if its a *.dagball/json file from an old version).
	//If param optionalValueIfNotFound is given, it would normally be true or false (defaults to false)
	//but you might give another object type such as null or NaN or 'notFound' etc if you're gonna check for that.
	chk: (domId,optionalValueIfNotFound)=>{
		let dom = document.getElementById(domId);
		if(dom){
			return dom.checked;
		}else{
			return optionalValueIfNotFound!==undefined ? optionalValueIfNotFound : false; 
		}
	},
	//like chk but for number boxes. Returns optionalValueIfNotFound (if param exists) else NaN if not found.
	//Reason it may not be found is different versions of dagball have different number boxes, checkboxes, etc.
	num: (domId,optionalValueIfNotFound)=>{
		let dom = document.getElementById(domId);
		return dom ? dom.valueAsNumber : (optionalValueIfNotFound!==undefined ? optionalValueIfNotFound : NaN);
	},

	//like chk but for text boxes. Returns optionalValueIfNotFound (if param exists) else NaN if not found.
	//Reason it may not be found is different versions of dagball have different number boxes, checkboxes, text boxes, etc.
	txt: (domId,optionalValueIfNotFound)=>{
		let dom = document.getElementById(domId);
		return dom ? dom.value : (optionalValueIfNotFound!==undefined ? optionalValueIfNotFound : '');
	},

	loadJsFile: path=>{
		console.log('dagball.loadJsFile '+path);
		document.body.appendChild(Object.assign(document.createElement('script'),{src:path}));
	},

	//displays it in the left textarea prefixed by "txt:" so it doesnt interfere with code or circs or balls etc. Unselects circ.
	displayTxt: function(txt){
		dagball.setSelectedCirc(null);
		dagball.displayTxtQuiet(txt);
	},

	//doesnt unselect circ if any was selected. FIXME its getting replaced by the usual circ.text right after this so this isnt displaying.
	displayTxtQuiet: function(txt){
		document.getElementById('mainEditTextarea').value = 'txt:\n'+txt;
	},

	//normally the string starts with "ape:" or "apeV1:" or "txt:" etc. This doesnt unselect circ so will overwrite its circ.text if selected.
	//TODO merge this with dagball.setTextareaText(nextText,true), or have this call that with true.
	setMainTextareaContent: function(string){
		console.log('setMainTextareaContent: '+string);
		let d = document.getElementById('mainEditTextarea');
		d.value = string;
		d.dispatchEvent(new Event('input'));
	},

	getMainTextareaContent: function(){
		return document.getElementById('mainEditTextarea').value;
	},

	//returns 1 of the list items, where goal(item)->score is higher (or equal, preferring lower indexs in list to break ties) than any other list item.
	//Returns null if list is empty or if the best score is nonpositive.
	bestPositiveInList: function(list, goal){
		let best = null;
		let bestScore = 0;
		for(let i=0; i<list.length; i++){
			let score = goal(list[i]);
			if(score > bestScore){
				best = list[i];
				bestScore = score;
			}
		}
		return best;
	},
	
	//default_textareaEventUpgrades: true, //normal, TODO
	default_textareaEventUpgrades: false, //for testing compiler lag problems 2024-5-10+

	default_semicolonCompiles: true,

	//default_transformFloatValsToVArray: false, //was normal 2024-5-14
	//default_transformFloatValsToVArray: true, //should become normal asap. is normal 2024-5-20 cuz fixed nan bug (need to absval the base of pow even if exponent is 2 cuz might be 2 plus/minus epsilon with GLSL optimizations)
	default_transformFloatValsToVArray: false, //2024-9-3 changed this to false cuz of redesign but TODO make it true by default later

	//you can type the name of an edGroup aka ape array name here and it will show only those
	default_edIncludeRegex: '^(.*)$',
	//after edIncludeRegex, excludes from that, ape array names you want to exclude such as the 'hdr' array containing (z,y,x)
	//inputs that gets auto added to every cpuCirc if it doesnt already have a hdr, or the V array (not displayed anyways cuz
	//does not go in circs, just the generated code around them, for GPU). The V array eds wont be displayed either way.
	default_edExcludeRegex: '^(hdr|V)$',

	cachedRegex_: {},
	cachedRegex: regex=>(dagball.cachedRegex_[regex] || (dagball.cachedRegex_[regex] = new RegExp(regex))),

	//true if matches edIncludeRegex and not matches edExcludeRegex
	isDisplayEdsForName: name=>{
		return dagball.cachedRegex(dagball.txt('edIncludeRegex')).test(name) && !dagball.cachedRegex(dagball.txt('edExcludeRegex')).test(name);
	},

	//other teams are RED GREEN or BLUE. //const RED = 0, GREEN = 1, BLUE = 2, ALPHA = 3; ive been using for canvas colors.
	//If red green and blue balls exist they normally play some variant of rock paper scissors by touching eachother to change eachothers team.
	defaultTeam: ALPHA,

	defaultBaseVelDecay: .6,
	defaultGradientMul: 2, //FIXME should be 1?
	defaultGpuCompileNumTilesOutward: 1,
	defaultTileSize: 4,

	defaultShowGroundHeightOnMouse: false,

	//speedMouseChangeCurveGrabMid: 1,
	//speedMouseChangeCurveGrabMid: 100,
	speedMouseChangeCurveGrabMid: 400,
	
	//speedMouseChangeCurveGrabLowAndHigh: 1,
	//speedMouseChangeCurveGrabLowAndHigh: 100,
	speedMouseChangeCurveGrabLowAndHigh: 400,


	//changed this to a checkbox
	//isDisplayGradientsAsBrightnessOfRectanglesOnBackground: false, //normal
	//isDisplayGradientsAsBrightnessOfRectanglesOnBackground: true, //for testing

	//gradientRectanglesHeightPixels: 20,
	gradientRectanglesHeightPixels: 40,
	//gradientRectanglesHeightPixels: 100,

	/* UPDATE 2024-9-27, theres a checkbox to do more GPU threads like this, and it worked last I tested it,
	but I havent tested it since the "5+ kinds of eval" redesign started and am not sure if it would work or not. TODO.
	...
	If there are 400 dimensions, id normally do 401 GPU threads. Split that into 400/16=25 balls per GPU thread,
	and get (400+1)*16 floats back instead of 400+1 floats back, and sum them to those exact (except for roundoff) 401 floats.
	This way it will use all the GPU cores. Also maybe later automatically take stats on how fast it is with what levels of splitting.
	make it a tuneable param for now, and leave tuning it for later.
	
	In codeMaker and game.prototype.gradient, theres an outer loop that runs in GPU
	(generates and gives code to Ap.js which calls TinyGlsl.js) for gradient/potens but not display.
	{* ...} which im likely to rename apeType '*' to 'loop' etc {loop ...}, loops over numBalls.
	If this splitOuterBallsLoopIntoMultipleGPUThreads is true then numBalls_i ranges
	for example 0 to 15 in one thread, 16 to 31 in another thread, 32 to 47 in a thread, etc.
	If its false, then it ranges 0 to numBalls_s-1 and puts that all into 1 float.
	In the true example, ceil(numBalls_s/16) numbers returned from GPU to CPU get summed in CPU
	and other than roundoff sum to the same 1 number as if this is false.
	TODO what if its not divisible by 16? Branching logic in GPU is expensive.
	Ill need either another apeType or i+ i/ imod pointer arithmetic to split numBalls in that loop.

	Each ball takes 2 (if !isDoubleHeightmap) or 3 (if isDoubleHeightmap) of the floats/dimensions.

	/*
	{*
						${isDisplayElsePotensForGradient?(
		'				(loopSize1TodoRemoveLoopInThisCase 1)'
						):(
		'				numBalls'
						)}
						{+
							<(heightASum float) 0>
							<(heightBSum float) 0>

	Theres also an inner loop over balls that only runs if balls are supposed to bounce on eachother,
	which this is NOT about. The inner balls loop is this. It will be the same either way,
	and it is used in display and physics/gradient/potens:
		${doAllPairsOfBalls?(
`				{* (otherBall copy numBalls) {+
					${isDisplayElsePotensForGradient?(
'					<(otherBallWeight float) 1>'
					):(
'					<(otherBallWeight float) {?: {i== otherBall numBalls} 0 1}>'
					)}
					<(otherBallY float) [balls otherBall 0%${floatsPerBall}]>
					<(otherBallX float) [balls otherBall 1%${floatsPerBall}]>
					<(ballOrDisplayYX_vs_otherBall_distance float) {fhypot {f- y otherBallY} {f- x otherBallX}}>
					{f+= potenOne {f* otherBallWeight
						{@addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap ballOrDisplayYX_vs_otherBall_distance}
					}}
				}}

	See more comments in isSplitOuterBallsLoopIntoMultipleGPUThreads_ballBlockSize.

	Also TODO this optimization: isSplitOuterBallsLoopIntoMultipleGPUThreads_ballBlockSize:  1, //this is simpler code to write, 1 index in outer balls loop and 1 gradient index per GPU thread.
	*/
	//was moved to checkbox: isSplitOuterBallsLoopIntoMultipleGPUThreads: false, //before ~2023-12-6 this opimization didnt exist. or you might go back to it during testing since its simpler.
	//isSplitOuterBallsLoopIntoMultipleGPUThreads: true, //normal but this is an optimization trying to add 2023-12-6+

	//This is how much of the outer balls loop happens per GPU thread if dagball.isSplitOuterBallsLoopIntoMultipleGPUThreads.
	//If thats false, then its like this is a really big number and is not used (leaving whole outer balls loop as 1 block).
	//For example, if this is 16 and theres 320 balls in !isDoubleHeightmap, thats 640 ball floats/dimensions plus the floats/dims for the curvy ground.
	//16*2=32 so GPU returns 10 times more floats than if dagball.isSplitOuterBallsLoopIntoMultipleGPUThreads was false.
	//
	//Why would you want to use 10 times more GPU threads? A good gaming GPU has 1000-10000 cores, can do that many float multiply float in parallel.
	//Each core has a little memory (such as 32kB) that may be its own or shared among a small group of cores, that par and loc Ap.js memories go in.
	//Each core returns 1-4 floats in GLSL. In single heightmap dagball has them return 1 float. In doubleHeightmap 4.
	//If you have 3072 cores and 640 dimensions, you can use at most 641 cores, and the others are wasted,
	//unless theres so much memory used that they cant fit parSize+numCoresInGroup*locSize floats in the core group,
	//in which case not all cores in that group could be used. In a nvidia chip this is called a warp nad is 32 cores
	//and they must do the same opcode (such as multiply 2 floats) at the same time but this can in theory differ across multiple warps.
	//In OpenCL1.2 I used this info to double the speed of matrix multiply, caching 2*32x32 floats in local memory per warp, see experiments in LazyCL.
	//This software as of 2023-12-6 only uses WebGL2_GLSL, not OpenCL or WebGPU,
	//but Ap.js might be upgraded later to do all 3 as different implementations of the same spec.
	//The reason youd want to use 10 times more GPU threads is 641*10=6410 can use all the cores at once,
	//or even better 641*64=41024 GPU threads (so they take turns on the 3072 cores in my GPU, for example). A bigger number of threads
	//divides better into the number of GPU cores, doing less work per thread. The last cycle will use between 1 and all the cores,
	//so average around half of them, so its better for such cycles to take less time and have more cycles.
	//I use 800*600=480000 GPU threads for the display calculation, which returns 480000 floats 60 times per second.
	//The 41024 threads in that example each do 10 times more work than a pixel display thread
	//since it computes it for 640/64=10 balls/positions instead of just 1 (the pixel).
	//So in theory, after this is working, can load that saved game dagball1701804687.142.json with the 479 balls that ran at 20 FPS
	//seen in this video https://www.youtube.com/watch?v=J5Li524G6Us
	//"DagBall 097 with 479 balls and 983 dimensions (mostly balls) slowed to 20 FPS - fixed stuck ball bug"
	//and it should run at 60 FPS when dagball.isSplitOuterBallsLoopIntoMultipleGPUThreads and 20 FPS when thats false.
	//The reason it stops at 60 FPS and doesnt go higher is im using that speed of HDMI screen and the browsers requestAnimationFrame does it.
	//But I could go even faster in physics than graphics if so. I might turn it up to multiple physics cycles per video cycle,
	//depending on speed available (TODO), so the balls would be able to move faster without destabilizing and moving through eachother and walls.
	//
	//Those 10 floats get summed by CPU into 1 float for all 320 balls, 1 per gradient dimension, so at (640+numCurveDimensions+1) floats either way.
	//If !dagball.isSplitOuterBallsLoopIntoMultipleGPUThreads then it returns the (640+numCurveDimensions+1) floats directly. The +1 is neutralPoten,
	//since the potential energy calculation computes 1 more float than gradient calculation which calls it,
	//then does the calculus subtract and divide by epsilon: "gradient[i] = (potens[i]-neutralPoten)/this.floatEpsilon;".
	//isSplitOuterBallsLoopIntoMultipleGPUThreads_ballBlockSize:  8, //this is likely the fastest, im guessing 2023-12-6, if the code was written for it
	//isSplitOuterBallsLoopIntoMultipleGPUThreads_ballBlockSize:  1, //this is simpler code to write, 1 index in outer balls loop and 1 gradient index per GPU thread.

	//list of funcs to call with no params, in order they're added here, at the start of nextState then empty the list. Avoids modifying datastructs while graphics and physics is using them. Those codes call dagball.doAsap(()=>{...}).
	doAsap_: [],

	doOnNextEvent_: [],

	scheduleCpuPaint_: [],

	//acceleration toward game coordinate (0,0) (see dagball.aftrans to convert between game coordinates and canvas pixel coordinates).
	//Every direction outward from that is up. You should probably draw (on dagball.bitpic) a mostly circular planet there to fall toward.
	//gravityToward00: 4,
	gravityToward00: 0, //now that im doing rockPaperScissors id rather have no gravity. but its supposed to be stored in wholeGameState json.

	//these are called in afterAfterPaint. u can paint directly onto canvas then as ByteRect or using canvas funcs like to paint text.
	scheduleCpuPaint: function(func){
		dagball.scheduleCpuPaint_.push(func);
	},

	/*
	//null, else If you want all balls to attract or repel eachother, put that code here as Ap.Ape coded for a func/? of 4 floats ballAY ballAX ballBY ballBX.
	//FIXME this is only for balls of constant size in singleHeightmap, not doubleHeightmap. In doubleHeightmap it has ballABal and ballBBal too, so 3 vars per ball,
	//(and maybe also radius?). Not sure if will be more vars per ball.
	//apCodePerPairOfBallsForSingleHeightmap: null,
	apCodePerPairOfBallsForSingleHeightmap:
	`(apCodePerPairOfBallsForSingleHeightmap? (ballAY float) (ballAX float) (ballBY float) (ballBX float)
		<(float ballABDist) {fhypot {f- ballAY ballBY} {f- ballAX ballBX}}>
		<(float ballABDist) {fhypot {f- ballAY ballBY} {f- ballAX ballBX}}>
		<?: {fless ballABDist}>
	)`,*/

	//This is an "ugly hack", a workaround for the bug that there must be at least 1 circ in GPU. TODO fix it then remove this.
	//see never0CircsInGPU checkbox (which is checked and locked that way by being dom node disabled
	//(2024-2-22-740pET im experimenting with that checkbox not disabled, TODO),
	//since i didnt make the option to remove the circNever0CircsInGPUJson from dagball.circles as of 2024-2-22, TODO).
	//Hopefully this will stay as dagball.circles[0]. TODO fix the bug so it can still run GPU with 0 circs,
	//such as balls can still bounce on eachother which is done in GPU.
	//This is a HUGE dagball.Circ that covers the whole game area and adds nothing to poten. It has no effect on physics,
	//except possibly if there was a bug in EdJoints as it has 1 edjoint to (0,0).
	//Its invisible except if you zoomed out far enough to see its circle outline, ed lines (one of them to (0,0), etc.
	circNever0CircsInGPUJson: '{"id":"circNever0CircsInGPU","mutid":"circNever0CircsInGPU","type":"dagball_circ","syncType":"swarm","lockCirc":false,"lockText":false,"lockEdgesOut":false,"isPubkey":false,"priority":1,"circExists":true,"influence":1,"y":0,"x":0,"r":10000,"red":200,"green":200,"blue":200,"isSelected":false,"text":"ape:(do {abc locparMem (1)} <potenCirc$ 0>)","edgesOut":[],"edsOut":[{"type":"dagball_ed","y":0,"x":0,"pos":0,"vel":0,"sliders":[],"slidersFunc":null,"velDecay":0,"edGroup":null}],"dimsOut":{},"nn":null}',
	set_circNever0CircsInGPU_enabled: function(enabled){
		dagball.circles = dagball.circles.filter(c=>(c.mutid!='circNever0CircsInGPU')); //remove all circs whose id is circNever0CircsInGPU, if any. (should never be more than 1)
		if(enabled){
			let circNever0CircsInGPU = dagball.mapToCirc(JSON.parse(dagball.circNever0CircsInGPUJson)); //make a new one
			dagball.circles.unshift(circNever0CircsInGPU); //add at index 0 and slide other circs up
		}
	},
	
	//null, else If you want all balls to attract or repel eachother, bounce etc, put that code here as Ap.Ape coded for a func/? of 1 float (pairBallDist float).
	//addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap: null,
	//FIXME it might be less than this since this came from addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap 2024-2-22
	//and was .07 then, but that might have very low poten near the edges.
	ballRadius: .07,
	/*Problem started when added ${dagball.ballRadius} to this computed string.
	dagverse/:768 Uncaught ReferenceError: Cannot access 'dagball' before initialization
	so moving this to outside the dagball {}.
	addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap:
	`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
		{f* 8.05 {f** {f/ {fmax 0 {f- ${dagball.ballRadius} pairBallDist}} ${dagball.ballRadius}} 2}}
	)`,*/
	/*`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
		{f* 1 -.1}
	)`,*/
	/*`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
		{f* .0000000005 {f** {f/ {fmax 0 {f- pairBallDist .02}} .02} 2}}
	)`,*/
	/*`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
		{+
			<(minPairBallDist float) .04>
			{funcReturn {f* 5.5 {f** {f/ {fmax 0 {f- pairBallDist minPairBallDist}} minPairBallDist} 2}}}
		}
	)`,*/
	/*`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
		{+
			<(minPairBallDist float) .04>
			{f* 5.5 {f** {f/ {fmax 0 {f- pairBallDist minPairBallDist}} minPairBallDist} 2}}
		}
	)`,*/
	/*`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
		{+
			<(minPairBallDist float) .04>
			{?: {fless pairBallDist minPairBallDist}
				{f* 5.5 {f** {f/ {f- pairBallDist minPairBallDist} minPairBallDist} 2}}
				0
			}
		}
	)`,*/

	//call func() at the start of nextState, so it doesnt break the data structures while theyre being used.
	//FIXME if any of these throws, then those added after it (before next call of nextState) are lost.
	doAsap: function(func){
		dagball.doAsap_.push(func);
	},

	//do and empty what was added by doAsap(()=>{...}).
	doAsaps: function(){
		let doAsap = dagball.doAsap_;
		dagball.doAsap_ = [];
		for(let func of doAsap){
			func();
		}
	},

	//like doAsap, but: clipboard, start playing sound, etc needs to happen from a UI event else browser will throw, so schedule it.
	doOnNextEvent: function(func){
		dagball.doOnNextEvent_.push(func);
	},

	//like doAsaps. Only call this during a UI event, maybe only during keyboard event,
	//will have to see how permissions work out with this.
	doOnNextEvents: function(){
		let doOnNextEvent = dagball.doOnNextEvent_;
		dagball.doOnNextEvent__ = [];
		for(let func of doOnNextEvent){
			console.log('doOnNextEvents running func='+func);
			func();
		}
	},

	//This is for testing compiler lag 2024-5-10+. It can be used on json/wholeGameState and circ.text/textareaContent.
	//<testTime anyNumber> becomes <testTime theCurrentTime> where theCurrentTime is from dagball.time(),
	//or similar for <{testTime float} anyNumber>. Replaces all of them with the same time.
	//Example: dagball.modTextToTestCompilerLag('hello <(testTime float) -2> <{testTime float} 5.55> <testTime 2.34> world')
	//-> 'hello <(testTime float) 1715360142.993> <{testTime float} 1715360142.993> <testTime 1715360142.993> world', though thats not fully Ap.js/ape code.
	modTextToTestCompilerLag: (text,optionalTimeString)=>{
		let timeString = optionalTimeString || TinyGlsl.jsNumToGlslFloat(dagball.time());
		let searchText = text.includes('<(testTime float) ') ? '<(testTime float) ' : //apeV1
			(text.includes('<{testTime float} ') ? '<{testTime float} ' : '<testTime '); //ape: aka apeV2.
		let i = text.indexOf(searchText);
		if(i == -1) return text;
		let j = text.indexOf('>',i);
		if(j == -1) return text;
		let stringReplacing = text.substring(i,j+1);
		let replaceWith = searchText+timeString+'>';
		if(stringReplacing == replaceWith) return text;
		console.log('modTextToTestCompilerLag replacing '+stringReplacing+' with '+replaceWith);
		//let nextText = text.substring(0,i)+replaceWith+text.substring(j+1);
		//return dagball.modTextToTestCompilerLag(nextText,timeString);
		return text.substring(0,i)+replaceWith+dagball.modTextToTestCompilerLag(text.substring(j+1),timeString);
	},

	do_modTextToTestCompilerLag_forTextarea: ()=>{
		let text = dagball.getTextareaText();
		let nextText = dagball.modTextToTestCompilerLag(text);
		if(nextText != text){
			console.log('do_modTextToTestCompilerLag_forTextarea changing textarea text');
			dagball.setTextareaText(nextText,true);
		}
	},

	//Normally you dont use this, but if theres a hard to track down bug this can make test cases,
	//though it only knows the GPU inputs and outputs, not if they're correct or not.
	//Can set this to getTestCase and it will call getTestCase(theTestCase)
	//after dagball does its next potential energy physics calculation in GPU.
	//The test case should be compatible with ApGpuTester.js and maybe come in its own html file,
	//depending on the listener since wrapping it in a html file would be done there.
	makeTestCaseOfNextGpuPotensCall: null,

	//If false, circs are independent of eachother even if they overlap, except that the same ball can roll on multiple circs at once which affects gradient.
	//If true (normal), then the dagball.Ed's (the lines from circs) from multiple circs can be pointed at the same (y,x) to create a dagball.EdJoint there
	//which holds those float vars / dimensions together, as if its 1 shared var between the circs.
	//isUpdateEdsByEdJoints: false,
	isUpdateEdsByEdJoints: true, //normal

	//used in roundToEdSnapGrid. FIXME adjust this. FIXME this might not work far away from (0,0) cuz float has 24 digit bits of precision. Theres some max radius of game. adjust it.
	//snapGridSize: 2**-6,
	snapGridSize: 2**-4,

	minAftransMagnify: 1, //minAftransMagnify: 5,
	maxAftransMagnify: 10000,
	speedMouseChangesMagnify: .8,
	speedMouseWheelYChangesMagnify: .001, //FIXME what ratio between speedMouseChangesMagnify and this?

	//how many times farther apart the lines from the circs (dagball.Ed's) does EdGroup.pointAtYXR spread them,
	//times the (a little more than, FIXME) minimum they can be spread so that dagball.snapGridSize doesnt put 2 eds/lines from same EdGroup at same (y,x)
	//which would cause their float values (ed.pos and ed.vel) to be held together as if they were 1 ed/floatVar which is how circs share float vars/dimensions.
	//pointAtYXRScale: 1,
	pointAtYXRScale: 2.5,

	codeHelpText:'Each array exists in par, loc, or both. [...] uses its default, or (parPtr ...) or (locPtr ...) chooses.'+
		' Use parMem for game state. Use locMem for temp vars that are different in each GPU thread.'+
		' TODO All parMem\'s get automatically converted to locparMem\'s for computing (size (par)) dimensional gradient but stay as parMem in display code.'+
		' Each circle has its own code (in textarea below). To see how they\'re combined, search for "codeMaker" in view source of this html file.'+
		' See Ap.js for details, a custom GPU language that runs in browser and calls TinyGLSL.js which calls WebGL2_GLSL which calls GPU.',

	//depending on isDoubleHeightmap, a different 2 of dagball.view.mergedApCalls (which has 4 keys, 4 apcalls, of which 2 get created) are used.
	isDoubleHeightmap: false, //simpler, can display more pixels, but cant make bridges or circuit crossings. 1 heightmap if false, 2 if true.
	//isDoubleHeightmap: true, //TODO this should be normal but is not built yet 2023-11-13.

	loadWikibinatorAsyncRightAfterBoot: false,

	potentialEnergiesForDisplay_usesApesInCircs_elseSimpleTestCode: true,

	displaySelectedEdLinesJitteryOnFromSide: false, //hold lines still even if selected
	//displaySelectedEdLinesJitteryOnFromSide: true, //normal. so you can see which EdGroup is selected if theres multiple EdGroups in same circ. All those selected eds eds do this.

	//optional instance of dagball.BitPic that can for example be a 5000x5000 1-bit-per-pixel pic
	//you paint to each 2d grid point be wall or open area. Their physics is based on distance to
	//nearest wall point so is part of the high dimensional scalarField.
	//If null, doesnt do this physics. If nonnull, its physics is added to poten (as in gradient calculation) after GPU computes potens, per ball.
	//In wholeGameState this is stored compressed using dagball.BloomTree. Its size is proportional to the
	//total paths length of the borders between wall vs open area. Its so well compressed you could video stream this as is,
	//or even better would be to give just the diffs as another bitpic/bloomtree which would be even smaller.
	//Merge them as XOR. Each pixel can be white, black, or transparent. fork2x2 is the other option in each 2 bit block.
	bitpic: null,
	bloomtree: null, //when click 1 of 2 buttons it copies between between dagball.bitpic and dagball.bloomtree

	//optionally this is a cache of poten>=dagball.bitpicBPotenLine, so if a hill is high enough a wall forms there so balls dont get stuck
	//on plateaus (tall but nearly flat hills). TODO 2024-1-22+ hook this into the same physics calculations as dagball.bitpic.
	//dagball.bitpic and dagball.bitpicB should be the same size. They must both be a powOf2 on each square side.
	bitpicB: null,
	bitpicBPotenLine: .7,

	//maxRadiusOutToReadOrWriteInBitpicRR: 50, //sanity check. it should be alot smaller than this. gets very slow if bigger.
	maxRadiusOutToReadOrWriteInBitpicRR: 2000, //2023-12-31 made this really big cuz i dont want to limit it anymore, cuz im using usually small but sometimes very big zoomed out paintbrush

	//paintbrushRadiusForBitpic: .05, //FIXME, is this in game coordinates (where 1.0 is about 80 pixels) or bitpic pixel coordinates, or what?
	paintbrushRadiusForBitpic: .15, //FIXME, is this in game coordinates (where 1.0 is about 80 pixels) or bitpic pixel coordinates, or what?
	//paintbrushRadiusForBitpic: 1, //FIXME, is this in game coordinates (where 1.0 is about 80 pixels) or bitpic pixel coordinates, or what?
	//paintbrushRadiusForBitpic: 10, //FIXME, is this in game coordinates (where 1.0 is about 80 pixels) or bitpic pixel coordinates, or what?
	min_paintbrushRadiusForBitpic: .001,
	max_paintbrushRadiusForBitpic: 30,

	//readSmoothYXR_r: 5,
	//readSmoothYXR_r: .15,
	//readSmoothYXR_r: 50,
	//readSmoothYXR_r: 10,
	//readSmoothYXR_r: 4,
	//readSmoothYXR_r: .5,

	addExampleBitPic: function(optionalHeight, optionalWidth){
		//let wallPoten = 1.5;
		//let wallPoten = .5;
		let wallPoten = 50;
		let wallThick = 5;
		//let wallPoten = 1;
		//let wallPoten = 4;
		let h = optionalHeight || 100;
		let w = optionalWidth || 100;
		//let h = 300;
		//let w = 300;
		//let h = 3
		//let w = 3;
		//let numInts = Math.ceil(h*w/32);
		//let ints = new Int32Array(numInts);
		let numBytes = Math.ceil(h*w/8);
		let bytes = new Uint8Array(numBytes);
		//let af = new dagball.SimpleAftrans(0, 0, 1, 1); //FIXME different magnifyY and magnifyX
		//let magnify = 2**-9;
		//let magnify = 2**-7;
		let magnify = 2**-5;
		//let magnify = 2**-3;
		//let magnify = 1;
		//let af = new dagball.SimpleAftrans(0, 0, magnify, magnify); //FIXME different magnifyY and magnifyX
		let af = new dagball.SimpleAftrans(-magnify/2, -magnify/2, magnify, magnify); //FIXME different magnifyY and magnifyX
		//let b = dagball.bitpic = new dagball.BitPic(wallPoten,wallThick,h,w,ints,af);
		let b = dagball.bitpic = new dagball.BitPic(wallPoten,wallThick,h,w,bytes,af);
		/*for(let y=0; y<h; y++){
			for(let x=0; x<w; x++){
				//let isWall = y!=x ? 1 : 0;
				let isWall = 1;
				b.writeYX(y,x,isWall);
			}
		}*/
		b.fillRandom();
	},

	saveFile: (fileName, contentType, text)=>{
		var blob = new Blob([text], {type: contentType});
		if(window.navigator.msSaveOrOpenBlob){
			window.navigator.msSaveBlob(blob, fileName);
		}else{
			var elem = window.document.createElement('a');
			elem.href = window.URL.createObjectURL(blob);
			elem.download = fileName;
			document.body.appendChild(elem);
			elem.click();
			document.body.removeChild(elem);
		}
	},

	physicsCyclesPerVideoFrame_min: 1,
	//physicsCyclesPerVideoFrame_max: 16,
	physicsCyclesPerVideoFrame_max: 8,
	//HDMI screens do at least 60 FPS. FIXME in some countries they use 50 hz electric outlets so maybe their screens
	//tend to do 50 FPS? USA uses 60 hz. Some devices go faster anyways, but usually not slower.
	//physicsCyclesPerVideoFrame_targetMinFPS: 57,
	//physicsCyclesPerVideoFrame_targetMinFPS: 60,
	physicsCyclesPerVideoFrame_targetMinFPS: 59, //FIXME if the screen has a max FPS below this, it will go to physicsCyclesPerVideoFrame trying to raise it.
	physicsCyclesPerVideoFrame: 4, //vary this based on estimatedFPS if chk varyPhysicsCycs
	physicsCyclesPerVideoFrame_timeLastChanged: 0, //varyPhysicsCycs will change physicsCyclesPerVideoFrame not too often, so fps has time to adjust
	//physicsCyclesPerVideoFrame_waitAtLeast: .5, //seconds
	//physicsCyclesPerVideoFrame_waitAtLeast: 2, //seconds
	physicsCyclesPerVideoFrame_waitAtLeast: 5, //seconds

	log_tinyGlslCurveCode: true,
	
	shuffle: arr=>{ //modifies the array/list then returns it
		for(let i=arr.length-1; i>0; i--) {
			const j = Math.floor(Math.random() * (i+1));
			[arr[i], arr[j]] = [arr[j], arr[i]]; // ES6 destructuring swap
		}
		return arr;
	},

	defaultRbmNumForwards: 5,
	
	//mulPotenCircInsideTanhBeforeMulInfluence: 1, //it didnt exist so by default was 1 until 2024-2-23.
	mulPotenCircInsideTanhBeforeMulInfluence: 2, //higher than 1 (in theory, todo verify) gives it a solid core to bounce on that shrinks as it fades away from lowering circ.influence instead of just fading the whole thing away at the same rate 

	//used with dagball.RbmCircBridge which wraps a dagball.RbmLayer.
	//Multiply -mouseDy (so up on screen learns positive) by this to learn/unlearn current eds state of selected circ if has circ.nn.
	//circNnLearnMultiplierByMouse: .001,
	//circNnLearnMultiplierByMouse: .01,
	circNnLearnMultiplierByMouse: .2,
	//circNnLearnMultiplierByMouse: 2.1,

	//Replacing this with doKnobGradients checkbox.
	//addEdSliderKnobGradientsToFloatsFromGpu: false, //for testing
	//addEdSliderKnobGradientsToFloatsFromGpu: true, //normal
	
	randomizeColorOfEdSliderKnobWhenMouseOver: false, //normal
	//randomizeColorOfEdSliderKnobWhenMouseOver: true, //for testing

	textareaBgColor_inSync_worked: 'white',
	textareaBgColor_inSync_error: '#ffcccc',
	//this one is generated by Math.sin: textareaBgColor_waitingOnButtonToCompile: '#eeeeff',

	//hideMouseCursorOnCanvas: false,
	hideMouseCursorOnCanvas: true,

	//moved to checkbox
	//showGlslCodeOfApesInRightTextarea: false,
	//showGlslCodeOfApesInRightTextarea: true,
	
	logApeDebug: false,

	addFakeNumbersToGradientForTestingSoYouCanSeeItAccelerate: false, //normal
	//addFakeNumbersToGradientForTestingSoYouCanSeeItAccelerate: true,

	//Use gamepad analog joysticks etc to control some of the ball(s). This is experimental 2024-1-21,
	//trying to make game characters out of a few balls each that jump and bounce around the dagball world.
	doGamepadBallsEtc: function(dt){
		//FIXME these might vary across gamepads. Use dagball.actionControls to make controls
		//customizable by user, but will need a UI for it and somewhere to save the controls mapping.
		//These are for a bluetooth xbox gamepad.
		let leftJoystickRightLeft = dagball.controls('gamepad0_dim0');
		let leftJoystickDownUp = dagball.controls('gamepad0_dim1');
		let rightJoystickRightLeft = dagball.controls('gamepad0_dim2');
		let rightJoystickDownUp = dagball.controls('gamepad0_dim3');
		let leftTrigger = dagball.controls('gamepad0_btn6');
		let rightTrigger = dagball.controls('gamepad0_btn7');
		let buttonAboveLeftTrigger = dagball.controls('gamepad0_btn4');
		let buttonAboveRightTrigger = dagball.controls('gamepad0_btn5');

		let accelMul = 15;

		//leave dagball.balls[0] to follow mouse cursor.
		let b = dagball.balls[1];
		if(b){
			b.yv += leftJoystickDownUp*accelMul*dt;
			b.xv += leftJoystickRightLeft*accelMul*dt;
			let fric = 30*leftTrigger;
			let fricMul = Math.exp(-dt*fric);
			b.yv *= fricMul;
			b.xv *= fricMul;
			b.displayText = 'doGamepadBallsEtc';

			//Todo();
		}
		let c = dagball.balls[2];
		if(c){
			//Todo();
		}
	},

	getCheckboxIds: function(){
		//FIXME search for them using document.querySelector? how about only those that have a certain css class dagballOptionCheckbox?
		
		/*2024-4-24-930aET: return 'experimentalGradientMul2 isDisplayBallText isDisplayBallCircles displayWavefunctionCollisionsAsBackground varEqLogs pauseDagball doDiffeq isShowWhichCircleIsSelected doAllPairsOfBalls doStatisticalCollisionsBetweenWavefunctions isDisplayGradientsAsBrightnessOfRectanglesOnBackground isDisplayCircOutlines isDisplayEdges isDisplayEds isDisplayDetailedEdsAlways showGlslCodeOfApesInRightTextarea doCurveGrab rockPaperScissors'.split(' ');
		About to add these with T/checked F/unchecked defaults, TODO...
		drag knobs T mouseDragsKnobs
		colorbackg F doColorBackground
		displayGobs T displayGobs
		isDetailedVerySlowDisplayOfBitpic F isDetailedVerySlowDisplayOfBitpic
		knobGrads T doKnobGradients
		moreGpuThreadsByForkBalls F moreGpuThreadsByForkBalls
		detailedEdsIfSelected T detailedEdsIfSelected
		gamepadBallsEtc T gamepadBallsEtc
		alwaysUpdateViewInNextState F alwaysUpdateViewInNextState
		compileCircHeadersUsingLocMem F compileCircHeadersUsingLocMem
		paintBitpicAllAtOnce T paintBitpicAllAtOnce
		circ.nn T doNN
		sparseWorld F sparseWorld
		denseInGPU  F sparseWorldOnlyInfluence
		fadeTiles F fadeTiles
		tiles T sparseWorldTiles
		<-display T displayTiles
		never0CircsInGPU T never0CircsInGPU
		follow gamepad ball F centerViewOnGamepadBall
		blob walls F do_readSmoothYX_onDisplayPotens
		borders F displayGameBorders
		varPhy= T varyPhysicsCycs
		FPS= T fpsCheckbox
		doCurveGrab T doCurveGrab
		wallsIfExist T wallsIfExist
		*/

		//TODO? modTextToTestCompilerLagWhenLoadFile
		return 'transformFloatValsToVArray gpuAddEpsilonForGradient testRetPar textareaEventUpgrades showGroundHeightOnMouse mouseBall mouseDragsKnobs doColorBackground displayGobs isDetailedVerySlowDisplayOfBitpic doKnobGradients moreGpuThreadsByForkBalls detailedEdsIfSelected gamepadBallsEtc alwaysUpdateViewInNextState compileCircHeadersUsingLocMem paintBitpicAllAtOnce doNN sparseWorld sparseWorldOnlyInfluence fadeTiles sparseWorldTiles displayTiles never0CircsInGPU centerViewOnGamepadBall do_readSmoothYX_onDisplayPotens displayGameBorders varyPhysicsCycs fpsCheckbox doCurveGrab wallsIfExist experimentalGradientMul2 isDisplayBallText isDisplayBallCircles displayWavefunctionCollisionsAsBackground varEqLogs pauseDagball doDiffeq isShowWhichCircleIsSelected doAllPairsOfBalls doStatisticalCollisionsBetweenWavefunctions isDisplayGradientsAsBrightnessOfRectanglesOnBackground isDisplayCircOutlines isDisplayEdges isDisplayEds isDisplayDetailedEdsAlways showGlslCodeOfApesInRightTextarea doCurveGrab rockPaperScissors'.split(' ');
	},

	/*getNumberBoxIds: function(){
		return 'baseVelDecay gradientMul'.split(' ');
	},*/

	//FIXME do this in dagball.View instead of the dagball object?
	//the local game state, which (TODO) may include copies of some parts remote game state. Its meant to be massively multiplayer and very sparse,
	//such as 1 game world might include a gigabyte of unique GPU code in a million circs of 1kB of code each.
	gameStateToMap: function(){
		let ret = {type:'dagball_wholeGameState', openThisJsonFileWith:'https://github.com/benrayfield/DagBall', circles:[], balls:[]};
		ret.bitpic = dagball.bitpic ? dagball.bitpic.toMap() : null;
		for(let circ of dagball.circles){
			ret.circles.push(circ.toMap());
		}
		for(let ball of dagball.balls){
			ret.balls.push(ball.toMap());
		}
		ret.uiOptions = {chk:{}, num:{}, txt:{}};
		for(let chkId of dagball.getCheckboxIds()){
			ret.uiOptions.chk[chkId] = document.getElementById(chkId).checked;
		}
		/*already included these in some of the .dagball/json files with the lines below this comment: for(let numId of dagball.getNumberBoxIds()){
			ret.uiOptions.num[numId] = document.getElementById(numId).valueAsNumber;
		}*/
		ret.baseVelDecay = dagball.num('baseVelDecay',dagball.defaultBaseVelDecay);
		ret.gradientMul = dagball.num('gradientMul',dagball.defaultGradientMul);
		ret.uiOptions.num.sparseDist = dagball.num('sparseDist',dagball.default_sparseDist);
		ret.uiOptions.num.sparseDistFrac = dagball.num('sparseDistFrac',dagball.default_sparseDistFrac);
		ret.uiOptions.num.tileSize = dagball.num('tileSize',dagball.defaultTileSize);
		ret.uiOptions.num.gpuCompileNumTilesOutward = dagball.num('gpuCompileNumTilesOutward',dagball.defaultGpuCompileNumTilesOutward);
		ret.uiOptions.txt.edIncludeRegex = dagball.txt('edIncludeRegex',dagball.default_edIncludeRegex);
		ret.uiOptions.txt.edExcludeRegex = dagball.txt('edExcludeRegex',dagball.default_edExcludeRegex);
		ret.edgeEdit = JSON.parse(JSON.stringify(dagball.edgeEdit)); //copy
		ret.aftrans = dagball.aftrans.toMap();
		//ret.readSmoothYXR_r = dagball.readSmoothYXR_r;
		return ret;
	},

	checkboxIdToMap: function(id){
		//TODO opt_ or num_? opt as in option.
		//return {type:'dagball_keyval', mutid:'num_'+id, val:document.getElementById(id).checked?1:0};
		//return ['f$'+id, document.getElementById(id).checked?1:0];
		return ['z$'+id, document.getElementById(id).checked?1:0];
	},

	numberBoxIdToMap: function(id){
		//return {type:'dagball_keyval', mutid:'num_'+id, val:document.getElementById(id).numberValue};
		return ['f$'+id, document.getElementById(id).valueAsNumber];
	},

	//each json in the Set can be turned on/off independently, though not all combos will work. Its sparse.
	//This is the new way to save/load 2024-1-6+ but its not working yet. Experimental. See Dagverse.js.
	//The dvid (dagverseId, a hash id, in base64 (dagverses specific base64 digits) is immutable. Some objects also have a mutid (id of mutable object).
	//There can be at most 1 object on screen and local physics sim at once of each mutid. There can be many dvids of the same mutid.
	//The ball.id and circ.id fields are mutids as of 2024-1-6 but todo change the id field to mutid and maybe add dvid field in the map?
	//
	/* Example of part of returned Set of Maps (to get the keys do DV.mapToId(map)):
	j$wfqkGanrcFR1XBPsRRH9dBwqg9csqhPkx8S9VAHeawk:{"id":"sBall10","mutid":"sBall10","influence":1,"y":1.9880467887749667,"yv":0.6308392621722826,"x":-0.35867122771158544,"xv":0.5910713271788934,"red":166,"green":74,"blue":15,"displayText":"K"}, //TODO norm it in DV
	Dagball122.html:9694 j$PWaozcRNqOPyGU_lfnmxRJ5vSF5pv7PRKyjSnleCdV3:{"id":"sBall11","mutid":"sBall11","influence":1,"y":0.06731662543840464,"yv":-0.7718966201954237,"x":0.18840549773995424,"xv":-0.307551462464403,"red":151,"green":75,"blue":254,"displayText":"L"}, //TODO norm it in DV
	Dagball122.html:9694 a$f$experimentalGradientMul2_0:["f$experimentalGradientMul2",0], //TODO norm it in DV
	Dagball122.html:9694 a$f$isDisplayBallText_1:["f$isDisplayBallText",1], //TODO norm it in DV
	Dagball122.html:9694 a$f$isDisplayBallCircles_1:["f$isDisplayBallCircles",1], //TODO norm it in DV
	Dagball122.html:9694 a$f$displayWavefunctionCollisionsAsBackground_0:["f$displayWavefunctionCollisionsAsBackground",0], //TODO norm it in DV
	*/
	gameStateToMaps: function(){
		//list of maps that each can be a Dagverse object, be turned on/off separately. Each has (or can be derived deterministicly) 1 dvid and at most 1 mutid.
		//Order of this list doesnt matter. TODO choose one deterministic. Its meant to be a set. Maybe I should just use a set.
		//let ret = [];
		//Set of maps or lists, whatever kind of object it is. ['ball5',fourNumbers...] is a small partial update of mutid 'ball5'.
		let ret = new Set();

		//to keep different games of dagball separate from eachothers physics and constraint solving etc, though you can still copy/paste between them.
		//This is like a game room or a chatroom that between 1 and a million players (or practically will likely be around 1-50 for a while) use together
		//so dont have to do sparse fading in/out circs and balls yet so work within the 1000 floats/dimensions on GPU at once limit, non-sparsely, for now (2024-1-6).
		ret.add(['g$namespace',dagball.namespace]);
		
		//let ret = {type:'dagball_wholeGameState', openThisJsonFileWith:'https://github.com/benrayfield/DagBall', circles:[], balls:[]};
		//ret.add({type:'opt', mutid:'str_openThisJsonFileWith', val:'https://github.com/benrayfield/DagBall'});
		ret.add(['g$openThisJsonFileWith','https://github.com/benrayfield/DagBall']); //g prefix means strinG. a means array of floats. j means json/{}/[].
		
		//TODO allow multiple bitpics if they dont disagree on any pixel, counting transparent as not making a claim
		//about that pixel (of any powOf2 size powOf2 aligned square).
		//ret.bitpic = dagball.bitpic ? dagball.bitpic.toMap() : null;

		for(let circ of dagball.circles){
			ret.add(circ.toMap());
		}

		for(let ball of dagball.balls){
			ret.add(ball.toMap());
		}

		//ret.uiOptions = {chk:{}, num:{}};

		for(let chkId of dagball.getCheckboxIds()){ //FIXME should i just search for all the checkboxes? Maybe i should
			//have a list to exclude (checkboxes i might make later that i dont want to be part of Dagverse game state,
			//not sure why id want that, but its possible), instead of to include?
			ret.add(dagball.checkboxIdToMap(chkId));
			//ret.uiOptions.chk[chkId] = document.getElementById(chkId).checked;
		}

		/*already included these in some of the .dagball/json files with the lines below this comment: for(let numId of dagball.getNumberBoxIds()){
			ret.uiOptions.num[numId] = document.getElementById(numId).valueAsNumber;
		}*/

		//ret.baseVelDecay = document.getElementById('baseVelDecay').valueAsNumber;
		//ret.gradientMul = document.getElementById('gradientMul').valueAsNumber;
		ret.add(dagball.numberBoxIdToMap('baseVelDecay'));
		ret.add(dagball.numberBoxIdToMap('gradientMul'));
		console.warn('TODO these input type=number, should be in map.uiOptions.num.sparseDist .sparseDistFrac .tileSize .gpuCompileNumTilesOutward')
		//for(let domId of 'baseVelDecay gradientMul'.split(' ')){
		//	ret.add(dagball.numberBoxboxIdToMap(domId));
		//}

		//ret.aftrans = dagball.aftrans.toMap();
		let afMap = dagball.aftrans.toMap();
		//Theres only 1 of these per player/user but there will be lots of these in multiplayer, so not sure if this is a good name,
		//as it implies theres only 1, but maybe different computers will just fork the dagverse/multiverse to have it always be their local aftrans?
		afMap.mutid = 'aftrans$main';
		ret.add(afMap); //FIXME make sure it has a mutid, instead of id (old name of mutid). 2024-1-6 aftrans has no id or mutid. TODO create a mutid?

		//ret.readSmoothYXR_r = dagball.readSmoothYXR_r;

		return ret;
	},

	//FIXME do this in dagball.View instead of the dagball object?
	gameStatetoJSON: function(){
		return JSON.stringify(dagball.gameStateToMap());
	},

	//doent touch clipboard. jsonToCopy and pasteJson are normally used together, one side copying and other side pasting, may be in different computers/websites/gameRooms/servers.
	jsonToCopy: function(){
		let list = [];
		for(let ob of dagball.selecteObs()){
			if(!ob.toPv) Err('No ob.toPv in ob='+ob);
			list.push(ob.toPv());
		}
		let ret = JSON.stringify(list); //TODO use Dagverse/DV which has json norming? PV is replacing DV.
		console.log('jsonToCopy ret='+ret);
		return ret;
	},

	//doent touch clipboard. like loadGameStateFromMap but can be the PV json format. json is text. See jsonToCopy.
	pasteJson: function(json){
		console.log('TODO paste json='+json);
	},

	//FIXME do this in dagball.View instead of the dagball object? No. View is there cuz
	//thats how it was built (changed my plans on how to do sparseness),
	//but i dont expect to ever have more than 1 instance locally. dagball.view and dagball.game
	//are both just 1 instance like that. Sparseness will be something new, TODO. now is 2024-9-27.
	loadGameStateFromMap: function(map){
		if(map.type != 'dagball_wholeGameState'){
			throw new Error('map.type='+map.type+' but expected dagball_wholeGameState');
		}
		if(!map.circles || !map.circles.length){
			throw new Error('No map.circles or its empty, map='+JSON.stringify(map));
		}
		dagball.prevCircles = dagball.circles; //TODO restore this with dagball.undoLoad()
		dagball.circles = map.circles.map(dagball.mapToCirc);
		let isForceUpdateEdgeChilds = false; //if already has one, dont look it up again (linear search in dagball.childs, todo make that search faster using a {} or Map?)
		dagball.updateCircEdgeChilds(isForceUpdateEdgeChilds); //in case circles was loaded in an order where circ.edgesOut[anInt].child===null but .childMutid is a string, so this looks up circ by that string and sets .child
		if(!map.balls || !map.balls.length){
			throw new Error('No map.balls or its empty, map='+JSON.stringify(map));
		}
		dagball.prevBalls = dagball.balls; //TODO restore this with dagball.undoLoad()
		dagball.balls = map.balls.map(dagball.mapToBall);
		if(map.uiOptions) for(let chkId in map.uiOptions.chk){
			let domChk = document.getElementById(chkId);
			if(!domChk){
				console.log('WARNING: no checkbox for id='+chkId+' in .dagball/json file, likely was from an earlier version that had such a checkbox.')
			}
			domChk.checked = map.uiOptions.chk[chkId];
		}
		document.getElementById('transformFloatValsToVArray').checked = (map.uiOptions && map.uiOptions.chk.transformFloatValsToVArray!==undefined) ?
			map.uiOptions.chk.transformFloatValsToVArray : dagball.defaultTransformFloatValsToVArray;
		if(map.baseVelDecay !== undefined){
			document.getElementById('baseVelDecay').valueAsNumber = map.baseVelDecay!==undefined ? map.baseVelDecay : dagball.defaultBaseVelDecay;
		}
		if(map.gradientMul !== undefined){
			document.getElementById('gradientMul').valueAsNumber = map.gradientMul!==undefined ? map.gradientMul : dagball.defaultGradientMul;
		}
		if(map.uiOptions && map.uiOptions.num.gpuCompileNumTilesOutward !== undefined){
			document.getElementById('gpuCompileNumTilesOutward').valueAsNumber = map.uiOptions.num.gpuCompileNumTilesOutward!==undefined ? map.uiOptions.num.gpuCompileNumTilesOutward : dagball.defaultGpuCompileNumTilesOutward;
		}else{
			document.getElementById('gpuCompileNumTilesOutward').valueAsNumber = dagball.defaultGpuCompileNumTilesOutward;
		}
		if(map.uiOptions && map.uiOptions.num.tileSize !== undefined){
			document.getElementById('tileSize').valueAsNumber = map.uiOptions.num.tileSize!==undefined ? map.uiOptions.num.tileSize : dagball.defaultTileSize;
		}else{
			document.getElementById('tileSize').valueAsNumber = dagball.defaultTileSize;
		}
		if(map.uiOptions && map.uiOptions.num.sparseDistFrac !== undefined){
			document.getElementById('sparseDistFrac').valueAsNumber = map.uiOptions.num.sparseDistFrac!==undefined ? map.uiOptions.num.sparseDistFrac : dagball.default_sparseDistFrac;
		}else{
			document.getElementById('sparseDistFrac').valueAsNumber = dagball.default_sparseDistFrac;
		}
		if(map.uiOptions && map.uiOptions.num.sparseDist !== undefined){
			document.getElementById('sparseDist').valueAsNumber = map.uiOptions.num.sparseDist!==undefined ? map.uiOptions.num.sparseDist : dagball.default_sparseDist;
		}else{
			document.getElementById('sparseDist').valueAsNumber = dagball.default_sparseDist;
		}

		//map.uiOptions.txt was added 2024-6-11. Before that it only had .chk and .num. So the extra check for map.uiOptions.txt.
		if(map.uiOptions && map.uiOptions.txt && map.uiOptions.txt.edIncludeRegex !== undefined){
			document.getElementById('edIncludeRegex').value = map.uiOptions.txt.edIncludeRegex!==undefined ? map.uiOptions.txt.edIncludeRegex : dagball.default_edIncludeRegex;
		}else{
			document.getElementById('edIncludeRegex').value = dagball.default_edIncludeRegex;
		}
		if(map.uiOptions && map.uiOptions.txt && map.uiOptions.txt.edExcludeRegex !== undefined){
			document.getElementById('edExcludeRegex').value = map.uiOptions.txt.edExcludeRegex!==undefined ? map.uiOptions.txt.edExcludeRegex : dagball.default_edExcludeRegex;
		}else{
			document.getElementById('edExcludeRegex').value = dagball.default_edExcludeRegex;
		}

		if(map.aftrans && map.aftrans.type=='dagball_simpleAftrans'){
			dagball.aftrans = dagball.mapToSimpleAftrans(map.aftrans);
		}
		if(map.edgeEdit) for(let k in map.edgeEdit){
			dagball.edgeEdit[k] = map.edgeEdit[k];
		}
		//if(map.readSmoothYXR_r !== undefined){
		//	dagball.readSmoothYXR_r = map.readSmoothYXR_r;
		//}
		dagball.bitpic = map.bitpic ? dagball.mapToBitPic(map.bitpic) : null;
		dagball.set_circNever0CircsInGPU_enabled(dagball.chk('never0CircsInGPU',true)); //WARNING: if this is false/unchecked it will throw in the first graphics andOr physics cycle
		dagball.updateView();
	},

	//2024-7-29 i dont remember using this for a long time. remove it?
	//swaps dagball.circles and dagball.prevCircles, so undoes the last call of quickload/loadGameStateFromJson/etc. Swaps back and forth between those.
	undoLoad: function(){
		let temp = dagball.circles;
		dagball.circles = dagball.prevCircles;
		dagball.prevCircles = temp;
		dagball.updateView();
	},

	loadGameStateFromJson: function(json){
		if(dagball.chk('modTextToTestCompilerLagWhenLoadFile',false)){
			console.log('loadGameStateFromJson doing modTextToTestCompilerLagWhenLoadFile');
			//if it has a testTime float var, sets its value to current time, hardcoded into the json,
			//so it has to recompile, to help with testing compiler lag since its no so isnt cached.
			json = dagball.modTextToTestCompilerLag(json);
		}
		console.log('loadGameStateFromJson json=[[['+json+']]]');
		dagball.loadGameStateFromMap(JSON.parse(json));
	},

	quicksave: function(name){
		localStorage.setItem('dagball.wholeGameState.'+name, dagball.gameStatetoJSON());
	},

	deleteAllCookiesInBrowser: function(){
		localStorage.clear();
		sessionStorage.clear(); //just in case, even though im only using localStorage cookies as of 2024-1-14.
		console.log('cookies deleted in browser but if there happens to be copies anywhere else (anything ever shared in an opensource peer to peer network might be on the internet forever?) thats not deleted');
	},

	getCookies: function(){
		let map = {};
		for(let cookieType of ['localStorage', 'sessionStorage']){
			let submap = map[cookieType] = {};
			for(let i=0; i<localStorage.length; i++){
				let k = window[cookieType].key(i);
				submap[k] = localStorage.getItem(k);
			}
		}
		return map;
	},

	quickload: function(name){
		document.getElementById('lastFilenameLoaded').innerHTML = 'QUICKLOAD: '+name;
		dagball.loadGameStateFromJson(localStorage.getItem('dagball.wholeGameState.'+name));
	},

	//2024-9-27 dagball does not use wikibinator but has a button to load its js library and u can use it on console.
	//The plan is to make an online dagball game, 1 server at a time at first but expanding to peer to peer later,
	//and use the data format of JSON.stringify(circOrBall.toPv()) which is a sparse vector form of game state.
	//Multiplayer game states and single player game states are the same thing. They're all high dimensional vectors.
	//Ive got so many dimensions, superexponentially many (per linear DAG higher) in my address space
	//that any possible part or whole of a game state could be a dimension. Lambda upgrade is for later.
	//The next asap redesign is to use hash of a json as a dimensionId, and any float vars (parts of float arrays)
	//that the user created (im a user when i do it, not a dagball core programmer) are dimesionIds
	//which come with that one "influence" (circ.influence or ball.influence etc) is the id of the whole
	//game object and those are the ids of the float array contents inside it, of position and velocity per float var.
	//When you make a float array (locparMem etc) in dagball, you automatically get position and velocity forms of it.
	//So use locMem (todo theres probably some bugs during redesigns, check 2024-9-27+) to only have that float array
	//inside the local GPU core (of which there may be thousands on same computer running in parallel by TinyGLSL)
	//but not keep it as longterm game state of position and velocity per dimension.
	//
	//The plan is after dagball game is multiplayer online and ppl are playing it together,
	//then build an optional upgrade (they can keep the html/js only fork if they like that one better)
	//to Wikibinator305 which does not exist yet but I will choose its set of features from a SAT-solver
	//that considers that certain features are incompatible with others, and give my preferences
	//in the form of a loss function (varStates)=>loss, and I have a 40-SAT solver that after every key press
	//solves it again and colors the bit vars darker or brighter depending on which SAT solution
	//had the lowest loss. Among all the solutions, i sort them by loss. If loss>=1 there is no solution.
	//If its at least 0 and less than 1, its my preference for which combo of vars, and thats how theyre colored.
	//Try it at https://tinyurl.com/NsatDesignToolGpu or if that one doesnt work (has bugs in linux etc TODO)
	//then use https://tinyurl.com/NsatDesignTool which can only do up to about 20 vars cuz is CPU only.
	//So after constraint solving to choose the design for the future Wikibinator203
	//which will, like wikibinator203, be a universal-pattern-calculus-combinator,
	//then the plan is to port dagball to combinators/lambdas, and with that increased flexibility,
	//which still needs to be GPU optimized (see wikibinatorLambda.n.pushEvaler(...)),
	//but after it is, this becomes a general internet and web3 protocol,
	//an open standard of turing-complete data and computing, and hopefully my lambdas
	//will outcompete the pure html+javascript form of dagball as they will demonstrate
	//their usefulness in building more kinds of gameplay and tools.
	//All this will be copy/pasteable, a set of circles/balls/wallPaintings/options/lambdas
	//between otherwise isolated dagball servers. You'll be able to copy/paste custom game objects
	//created and modified by experience, from one dagball server to another. Player created content.
	//Player created worlds. Multiverse of all those possibilities as a math spec of high dimensional vectors.
	//The wikibinator address space is literally superexponential
	//and will come in 256 bit ids and todo high security 512 bit ids.
	//
	//OLD...
	//game state to a wikibinator lambda.
	saveFn: function(){
		let wvm = dagball.getWikibinator203VM();
		let list = wvm.ops.Infcur;
		for(let circ of dagball.circles){
			list = list(circ.toFn());
		}
		return wvm.ops.Put('circles')(list)(wvm.ops.EmptyTreemap(wvm.ops.GodelLessThan));
	},

	//load whole game state from wikibinator lambda
	loadFn: function(fn){
		throw new Error('TODO');
	},

	update_selectedCircIsPreferCpu_fromCheckbox: ()=>{ //circ.preferCpu vs checkbox
		dagball.selectedCircs().forEach(x=>{ x.preferCpu = dagball.chk('selectedCircIsPreferCpu'); });
	},

	update_selectedCircIsPreferCpu_toCheckbox: ()=>{ //circ.preferCpu vs checkbox
		let circs = dagball.selectedCircs();
		if(circs && circs.length){
			document.getElementById('selectedCircIsPreferCpu').value = circs[0].preferCpu || false;
		}
	},

	//useEdGroups: false, //if it breaks things and you need to figure out why
	useEdGroups: true, //normal

	logEdGroupStuff: false,

	log_updateLocalFields_apCode: false, //normal
	//log_updateLocalFields_apCode: true, //for testing

	clearTinyGlslCacheAtRandomTimes: true,
	clearTinyGlslCacheAtRandomTimes_aveSeconds: 60, //about every 0-2 minutes (if 60) it will call TinyGlsl.clearAllCache()
	//clearTinyGlslCacheAtRandomTimes_aveSeconds: 1.3, //for testing to see if the button updates the counter and the number of canvases and shaders goes down automatically
	clearTinyGlslCacheAndUpdateButton: ()=>{
		TinyGlsl.clearAllCache();
		dagball.updateButtonButDontClearnTinyGlslCache();
	},
	updateButtonButDontClearnTinyGlslCache: ()=>{
		document.getElementById('clearTinyGlslCacheBtn').value = 'Clears ('+TinyGlsl.count_clearAllCache+') TinyGLSL cache';
	},

	haveNextRandBell: false,
	nextRandBell: 0,

	//ave 0 stdDev 1
	randBell: ()=>{
		dagball.haveNextRandBell = !dagball.haveNextRandBell;
		if(!dagball.haveNextRandBell){
			return dagball.nextRandBell;
		}else{ //make 2 more
			let x = 0, y = 0, radiusSquared = 0;
			do{
				x = 2*Math.random()-1;
				y = 2*Math.random()-1; //randomly sample from a 2x2 square
				radiusSquared = x*x + y*y;
			}while(radiusSquared >= 1 || radiusSquared == 0); //randomly sample from a radius 1 circle except its exact center or perimeter
			//FIXME "except its exact center" seems wrong. why shouldnt (0,0) be included? Rare difference.
			let mul = Math.sqrt(-2*Math.log(radiusSquared)/radiusSquared);
			dagball.nextRandBell = x*mul; //for next randBell()
			return y*mul;
		}
	},

	//using the whole window.location.search, after '?', as string of js code to run at end of window.onload, if any is given, so i dont have to keep clicking one of the quickload buttons
	//getUrlParams: (()=>{ let ret = {}; new URLSearchParams(window.location.search).forEach((v,k)=>(ret[k]=v)); return ret; }),
	
	//returns a multiple of tileSize, whichever its closest to, a center of a tile.
	snapToGrid: function(tileSize, observation){
		return tileSize*Math.round(observation/tileSize);
	},

	//low end of same tile of snapToGridEdgeRoundUp
	snapToGridEdgeRoundDown: function(tileSize, observation){
		return dagball.snapToGrid(tileSize, observation-tileSize/2);
	},
	
	//Returns the smallest grid edge position thats at least observation.
	snapToGridEdgeRoundUp: function(tileSize, observation){
		return dagball.snapToGrid(tileSize, observation+tileSize/2);
	},
	
	//only relevant if dagball.chk('sparseWorldTiles').
	//Used for making GPU compile less often so theres less half loading delays,
	//though GPU compiling can be cached and reused when you move back near there,
	//until TinyGlsl cache is cleared which happens automatically around once per minute on average.
	//TODO maybe should clear that TinyGlsl cache less often so dont have to recompile GPU as often?
	tileSize: function(){
		return dagball.num('tileSize',dagball.defaultTileSize);
		//let viewRadius = dagball.sparseDistFar();
		//return viewRadius*1.7; //arbitrary multiplier
	},

	//predictMouseThisMuchAheadForCursorBall: 0, //To see lag as it is, this would be 0.
	//predictMouseThisMuchAheadForCursorBall: 50, //To see lag as it is, this would be 0.

	domNodeContainsRawYX: function(dob, rawY, rawX){ //not affine transformed
		let rect = dob.getBoundingClientRect();
		return rawX >= rect.left && rawX <= rect.right && rawY >= rect.top && rawY <= rect.bottom;
	},
	mouseIsInTextEditorEtc: function(){
		return dagball.domNodeContainsRawYX(document.getElementById('overCanvas'), dagball.directControls.rawMouseY, dagball.directControls.rawMouseX);
	},

	//intsToHex: array=>Array.from(array).map(num => num.toString(16).padStart(8, '0')).join(''),
	intsToHex: array=>Array.from(array).map(num=>((num>>>0).toString(16).padStart(8, '0'))).join(''),

	hexToInts: hex=>(new Int32Array(hex.match(/.{1,8}/g).map(hexNum => parseInt(hexNum, 16)))),

	intsToBase4: array=>Array.from(array).map(num=>((num>>>0).toString(4).padStart(16,'0'))).join(''),

	bytesToBase4: array=>Array.from(array).map(
		num=>((num>>>0).toString(4).padStart(4,'0'))
	).join(''),

	bytesToHex: array=>Array.from(array).map(num=>((num>>>0).toString(16).padStart(2,'0'))).join(''),

	hexToBytes: hex=>(new Uint8Array(hex.match(/.{1,2}/g).map(hexNum=>parseInt(hexNum,16)))),

	//TODO merge base64 stuff into Dagverse/DV
	bytesToBase64: bytes=>btoa(String.fromCharCode.apply(null, bytes)), //returns string

	base64ToBytes: base64=>{ //returns Uint8Array
		const binaryString = atob(base64);
		const len = binaryString.length;
		const bytes = new Uint8Array(len);
		for (let i = 0; i < len; i++) {
			bytes[i] = binaryString.charCodeAt(i);
		}
		return bytes;
	},

	//bloomTreeDataUrlPrefix: 'data:image/x-dagball-bloomtree;base64,',
	//bloomTreePrefix: 'dagball_bloomtree:',
	bloomTreePrefix: 'bloomtree:',


	swapBytes: function(bytes, i, j){
		let temp = bytes[i];
		bytes[i] = bytes[j];
		bytes[j] = temp;
	},

	forEndianSwapEvery4Bytes: function(bytes){
		for(let i=0; i<bytes.length-3; i+=4){
			dagball.swapBytes(bytes, i, i+3);
			dagball.swapBytes(bytes, i+1, i+2);
		}
	},


	//see plus/minus positionLimit in the id=displayGameBorders "borders" checkbox
	//positionLimit: 1000, //position in each dimension must be in plus/minus this, and be very near center of it cuz its adjusted by scaled tanh...
	//positionLimit: 10, //position in each dimension must be in plus/minus this, and be very near center of it cuz its adjusted by scaled tanh...
	//positionLimit: 4.5, //position in each dimension must be in plus/minus this, and be very near center of it cuz its adjusted by scaled tanh...
	//positionLimit: 10, //TODO bigger, but 2024-1-1 dont want the balls getting lost too far off screen. also this is for limiting dagball.Ed.pos
	positionLimit: 20, //2024-1-25 enlarging this so the 2kx2k bitpic (just 2x2'ed its size from 1kX1k in racetrack_2kX2k_1705953679.9078999_forked.dagball)
	scaleTanh: (x,scale)=>(scale*Math.tanh(x/scale)),
	//TODO energy norming of potentialEnergy+kineticEnergy remaining constant, but thats kind of incompatible with velocityDecay and just moving stuff around with mouse. Will find something close to it.

	//normPositionOrVelocityFloat: float=>dagball.scaleTanh(float, dagball.positionLimit); //FIXME use some func f(x) that equals x in most of its range so positions dont slide slowly toward 0. idempotent in that range.
	//normPositionOrVelocityFloat: float=>Math.max(-dagball.positionLimit, Math.min(float, dagball.positionLimit)),
	normPositionOrVelocityFloat: float=>{
		if(isNaN(float)){
			return 2*Math.random()-1; //FIXME make this deterministic?
		}
		return Math.max(-dagball.positionLimit, Math.min(float, dagball.positionLimit));
	},

	normPositionsOrVelocities: floats=>{ //This is old. not using dagball.game.pos and dagball.game.vel anymore. its in circ.edsOut and ball.x .y .xv .yv .vd
		for(let i=0; i<floats.length; i++){
			/*//FIXME this will decay at a rate not defined by time, so wont sync in network across different FPS. Just truncate for now would be better?
			if(isNaN(floats[i])){
				//floats[i] = 0; //FIXME should this be random instead? Or how about i/floats.length or something?
				floats[i] = 2*Math.random()-1; //FIXME make this deterministic?
			}*/
			floats[i] = dagball.normPositionOrVelocityFloat(floats[i]);
		}
	},

	//returns func if it was one returned by this.
	//Else returns a func that does the same param->return mapping but returns from cache if same param as any earlier call.
	//Does not cache throwing or nonhalting. Does cache any return value even if null or undefined.
	cacheFuncOf1Param: func=>{
		if(func.is_cacheFuncOf1Param){
			return func;
		}
		const cache = new Map();
		let cachedFunc = param=>{
			if(cache.has(param)){
				return cache.get(param);
			}else{
				let ret = func(param);
				cache.set(param, ret);
				return ret;
			}
		};
		cachedFunc.is_cacheFuncOf1Param = true;
		return cachedFunc;
	},

	//TODO: sometimes does harmonySearch of 2 or more vectors, sometimes adds a random vector, etc. Returns 1 Float32Array(population[0].length).
	//This is used by dagball.findLocalmins.
	evolveOneVec: population=>{
		throw new Error('TODO');
	},

	comparatorLowestLossFirst: loss=>((a,b)=>(loss(a)-loss(b))),

	//Returns new list, doesnt modify population.
	sortPopulationLowestLossFirst: (population, loss)=>{ //FIXME is this highest loss first? check if its reversed.
		population.sort(dagball.comparatorLowestLossFirst(loss));
	},

	//The main useCase for this is to get the Ap.js/ape code of a dagball.Circ containing a neuralnet
	//such as in some of the the dagball/saves/nnet_*.dagball files, and wrap that in a function
	//that calls it on multiple world states (Float32Array(circ.edsOut.length)) if you just want position,
	//or 2 times that if you want position and velocity, and make a loss function for certain 2d positions (see ball.curveGrab)
	//are supposed to be dark and certain positions supposed to be bright (or some number between), or whatever curveGrab is doing in recent code
	//(which is incomplete as of 2024-5-5, as is the Ap.Call.toCode('js') incomplete i might need to make a .toCode('js_par') for a different
	//way of generating js code that only takes the par array param instead of also loc big vel dfriction etc multiple arrays.
	//So from that you get a loss function, any loss function you want of Float32Array->number, save some game states (just that circs part)
	//and use those as population, and when you click a button (TODO add such a button beside randomizePosition button),
	//evolve another game state that should make the neuralnet in that circ fit the ball.curveGrab's better, a better trained neuralnet
	//as measured by lower loss.
	//
	//TODO Uses harmonySearch and adding random vectors and possibly other ways,
	//to find any vectors (Float32Array(population[0].length)) where loss(vector) is the lowest it could find.
	//Returns list of vectors sorted by lowest loss first.
	//Not necessarily an exact localMin and very unlikely to find globalMin.
	//Auto wraps loss func by dagball.cacheFuncOf1Param(loss) which will only wrap it 1 deep even if it already is that way.
	//population is a list and will not be modified. Returns
	findLocalmins: (population, loss)=>{
		loss = dagball.cacheFuncOf1Param(loss); //dagball.cacheFuncOf1Param(dagball.cacheFuncOf1Param(func)) only wraps it 1 deep.
		throw new Error('TODO');
		population = dagball.sortPopulationLowestLossFirst(population); //so doesnt modify population
		let shrinkPopulationToThisAtEndOfEachCycle = 200;
		for(let i=0; i<20; i++){ //generations
			for(let j=0; j<50; j++){
				population.push(dagball.evolveOneVec(population));
			}
			population = dagball.sortPopulationLowestLossFirst(population);
			while(population.length > shrinkPopulationToThisAtEndOfEachCycle){
				population.pop();
			}
		}
		return population;
	},

	//Params are weight vec vec vec weight vec weight vec. Whatever was the last weight (such as 2.3) sets the weight for all vecs that follow
	//until the next weight. A weight is any number. A vec is a Float32Array. They all have to be the same length of Float32Array. Default weight is 1.
	//Example: dagball.weightedSum(.7, Float32Array.of(100,200,0), .3, Float32Array.of(1,2,3)) -> Float32Array.of(.7*100+.3*1, .7*200+.3*2, .7*0+.3*3);
	weightedSum: (...weightsAndVecs)=>{
		let vecSum = null;
		for(let i=0; i<weightsAndVecs.length; i++){
			let wov = weightsAndVecs[i];
			if(typeof(wov) != 'number'){
				vecSum = new Float32Array(wov.length);
				break;
			}
		}
		if(sum == null){
			throw new Error('No vec in params so dont know what size Float32Array to return.');
		}
		let weight = 1;
		for(let i=0; i<weightsAndVecs.length; i++){
			let wov = weightsAndVecs[i];
			if(typeof wov == 'number'){
				weight = wov;
			}else{
				for(let j=0; j<wov.length; j++){
					vecSum[j] += weight*wov[j];
				}
			}
		}
		return ret;
	},

	//vararg average of n Float32Arrays.
	ave: (...vecs)=>dagball.weightedSum(1/arguments.length, ...vecs),

	//norm to length 1
	vecNorm: vec=>{
		let ret = new Float32Array(vec.length);
		let sumOfSquares = 0;
		for(let i=0; i<vec.length; i++){
			sumOfSquares += vec[i]*vec[i];
		}
		let len = Math.sqrt(sumOfSquares);
		if(len){
			for(let i=0; i<vec.length; i++){
				ret[i] = vec[i]/len;
			}
		}else{
			let val = 1/Math.sqrt(vec.length);
			for(let i=0; i<vec.length; i++){ //TODO theres some fill func.
				ret[i] = val;
			}
		}
		return ret;
	},

	tinyglslCacheStats: ()=>{
		TinyGlsl.cacheStats = TinyGlsl.cacheStats || {};
		for(let k in TinyGlsl.cacheStats){
			let kk = k.length>50 ? k.substring(0,50) : k;
			console.log('kk='+kk+' val='+JSON.stringify(TinyGlsl.cacheStats[k]));
		}
		console.log('tinyglslCacheStats you should look in TinyGlsl.cacheStats, size '+Object.keys(TinyGlsl.cacheStats).length);
	},

	//evalGlslCodeGeneratedFromApeCode: false, //If it wont boot try this and find whats wrong with the generated code. 2023-10-15 that glsl code appears in right textarea when left textarea starts with "ape:" and is clicked.
	evalGlslCodeGeneratedFromApeCode: true, //normal
	
	//2023-11+ this is being removed cuz dagball.Game.prototype.tinyGlslCode is being replaced by Ape.js Ap.Ape and Ap.Call instances. Dagball calls Ape calls TinyGlsl.
	//this being false doesnt seem to work anymore 2023-10-15, so use gpu_circles only.
	//doPhysicsAndGraphicsFromGpuCodeInCircsElseTheExampleGpuCode: false, //should be true, but 2023-9-25 this isnt built yet.
	doPhysicsAndGraphicsFromGpuCodeInCircsElseTheExampleGpuCode: true, //set this to false if theres problems you need to figure out in the GPU code of multiple circs being combined, and you want to go back to 1 GPU code at a time.

	toTinyGlslCode_putsLoopNameInClosingBraceComment: false,
	maxDistanceToSelect: .4, //if closer, it breaks ties by which is closest, but wont select any farther away.
	messageToUser: 'TODO', //this will appear near mouse cursor or maybe at top in big text. Its for fast messages to user like when holding a button or dragging to explain options of what you can do next, or to say errors etc, todo.
	isAllowRightClickPopupMenuNow: function(){
		return dagball.isTextEditing(); //not while doing canvas stuff
	},
	afterEveryCanvasDomEvent: function(event){
		dagball.doOnNextEvents(); //in case any have been scheduled by dagball.onNextEvent(func). at start and end of afterEveryCanvasDomEvent in case what it does in the middle adds more.

		if(!dagball.selectLock() && !dagball.isTextEditing()){ //FIXME merge selectLock with isTextEditing? They're tangled 2023-9-24.
			let circ = dagball.uiCircNearYXElseNull(dagball.directControls.mouseY, dagball.directControls.mouseX);
			dagball.setSelectedCirc(circ);
			let defaultIconRadius_in_gameDistance = dagball.defaultIconRadius/dagball.aftrans.magnify(); //in game coords, not screen coords
			defaultIconRadius_in_gameDistance *= 1.5; //bigger select area

			let balls = dagball.uiBallsNearYXElseNull(dagball.directControls.mouseY, dagball.directControls.mouseX, defaultIconRadius_in_gameDistance);
			dagball.setSelectedBalls(...balls);
			if(circ){
				let angle = dagball.uiAngleNearCircYX(circ, dagball.directControls.mouseY, dagball.directControls.mouseX);
				//let edGroup = circ.edGroupAtAngle(angle); //null if there are no eds (circ.edsOut.length===0).
				let edOrEdge = circ.edOrEdgeAtAngle(angle);
				let edGroup = edOrEdge ? edOrEdge.edGroup : null; //null if there are no eds (circ.edsOut.length===0).
				dagball.selectedEd = edGroup ? edOrEdge : null;
				//not displaying edOrEdge.red = 255;//dagball.randByte();
				dagball.setSelectedEdGroup(edGroup); //may be null, will unselect all edGroups if so
			}
			/*
			//TODO flip to negative score is good in dagball.bestPositiveInList (would rename that func)?
			//cuz in gradient descent (dagball computes scalar field in GPU that way) lower is better. Things fall toward lower potentialEnergy.
			let mouseIsTouchingWhichKnobElseNull = dagball.bestPositiveInList(dagball.allEdSliderKnobs(), knob=>{
				//return 0 or less to exclude knob. Return highest number from this knob to return it.
				let score = 0;
				let mouseY = dagball.directControls.mouseY;
				let mouseX = dagball.directControls.mouseX;
				if(knob.touchesYX(mouseY,mouseX)){
					//score+=10000; //FIXME what if knob.val exceeds this? using sigmoid to limit its effect.
					score+=100; //FIXME what if knob.val exceeds this? using sigmoid to limit its effect.
				}
				//FIXME more tie breakers, of those mouse is touching. knobs from different eds can still (2024-1-15) overlap, and maybe a little within same ed.
				score += dagball.sigmoid(knob.val); //sigmoid so possible very big or small numbers dont overflow other parts of sorting.
				
				//TODO also remember time mouse last touched each of them and prefer those mouse has touched recently for tie breaking?
				//Lots of things that could be tried.

				return score;
			});
			*/
			//let edSliderKnobOrNull = dagball.getEdSliderKnob();
			//if(edS)
			//Todo('setSelectedEdSliderKnob');
		}

		if(dagball.updateDebugTextAreaOnEveryEventNotJustLeftTextareaEventsCuzThatMightBeSlowingItDown){
			dagball.updateDebugTextArea(); //FIXME this might slow it down
		}

		//console.log('afterEveryCanvasDomEvent event='+event);
		//console.log('afterEveryCanvasDomEvent event='+event+' isTextEditing='+dagball.isTextEditing()+' selectLockA='+dagball.selectLockA+' selectLockB='+dagball.selectLockB);

		dagball.doOnNextEvents(); //in case any have been scheduled by dagball.onNextEvent(func). at start and end of afterEveryCanvasDomEvent in case what it does in the middle adds more.
	},
	updateDebugTextAreaOnEveryEventNotJustLeftTextareaEventsCuzThatMightBeSlowingItDown : false,
	//updateDebugTextAreaOnEveryEventNotJustLeftTextareaEventsCuzThatMightBeSlowingItDown : true,
	escapeTextForDisplayInHtml: function(text){
		return text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;').replace(/\n/g, '<br>\n');
	},
	//FIXME id starts with syncType (or it seems i want d for dim which is always a swarm syncType so s or d for swarm) [s for swarm. c for const. p for pubkey, ADD d for dim. u for unknown?]
	//Ids start with these chars depending on syncType of the object.
	syncTypeToChar: {
		const: 'c', //dag recursion only self and knowing the ids of childs, not recursive. use w/wikibinator lambda (in dagball.Ball objects for recursion and DAG stuff).
		lambda: 'λ', //wikibinator: 'λ', //TODO merge axgob into this since will later use axgob for pure-lambdas instead of wikibinator, in dagball. 'w' ('λ' ?), //id of the ball that wraps a wikibinator lambda of the id following the w, or maybe wSomenameThewikibinatoridhere234234234. like const but with deep recursion. const is normally isolated to self and listing the child ids but doesnt have to find those childs.
		pubkey: 'p',
		swarm: 's',
		unknown: 'u', //FIXME this should only be used while changing the dagball VM code in case new syncTypes are added later or cant figure it out at the time. This is not a permanent solution.
	},
	//whenBoot_doSimpleApeTests: false,
	whenBoot_doSimpleApeTests: true,
	debugTextFor: function(txtIn){
		let txtInLower = txtIn.toLowerCase();
		if(txtInLower.startsWith('ape:') || txtInLower.startsWith('apeV1:')){ //ape: now means apeV2: or whatever is the latest language version.
			if(dagball.chk('showGlslCodeOfApesInRightTextarea')){
				try{
					let lz;
					if(txtInLower.startsWith('ape:')){
						let apeCode = txtIn.substring('ape:'.length);
						//return Ap.parse(apeCode).toApe().toTinyGlslCode();
						lz = Ap.lazyEval(apeCode);
					}else{
						let apeCode = txtIn.substring('apeV1:'.length);
						//return Ap.parse(apeCode).toApe().toTinyGlslCode();
						lz = Ap.lazyEvalOld(apeCode);
					}
					return (lz.beforeCode+'\n/////apCall.beforeCode/above////apCall.code/below/////////////////\n'+lz.code).trim();
				}catch(e){
					if(typeof(e) == 'string'){
						console.error("string Error from debugTextFor:", e);
						return 'ERROR: '+e;
					}else{
						console.error("Error from debugTextFor:", e.stack);
						return 'ERROR: '+e+'\n'+e.stack;
					}
				}
			}else{
				return '';
			}
		}else if(txtInLower.startsWith('quote:')){ //copy to the right textarea
			return txtIn;
		}else{
			return 'Start the text with "ape:" to use this';
		}
	},
	pixelsTextareaIsBelowBottomOfScreen: -15,
	between: (min, val, max)=>Math.max(min, Math.min(val, max)),
	betweenInt: (min, val, max)=>Math.floor(Math.max(min, Math.min(val, max))),
	asByte: x=>Math.floor(dagball.between(0, x, 255)),
	colorStr: function(redFraction, greenFraction, blueFraction){
		let r = dagball.asByte(redFraction*256);
		let g = dagball.asByte(greenFraction*256);
		let b = dagball.asByte(blueFraction*256);
		let s = '000000'+(r*65536+g*256+b).toString(16);
		return '#'+s.substring(s.length-6);
	},
	//there are 2 modes: text editing, and canvas.
	isTextEditing: function(){
		return document.getElementById('mainEditTextarea') === document.activeElement;
	},
	setIsTextEditing: function(bit){
		let mainEditTextarea = document.getElementById('mainEditTextarea');
		if(bit) mainEditTextarea.focus();
		else mainEditTextarea.blur();
	},
	//gets whatever dagball.EdSliderKnob mouse is over, and picks one if multiple overlap, else null if none or mouseDragsKnobs is not checked
	getEdSliderKnob: function(){
		if(!dagball.chk('mouseDragsKnobs',true)){
			return null;
		}
		return dagball.bestPositiveInList(dagball.allEdSliderKnobs(), knob=>{
			//return 0 or less to exclude knob. Return highest number from this knob to return it.
			let score = 0;
			let mouseY = dagball.directControls.mouseY;
			let mouseX = dagball.directControls.mouseX;
			
			
			if(knob.touchesYX(mouseY,mouseX)){
				//score+=10000; //FIXME what if knob.val exceeds this? using sigmoid to limit its effect.
				score+=100; //FIXME what if knob.val exceeds this? using sigmoid to limit its effect.
				
				//FIXME more tie breakers, of those mouse is touching. knobs from different eds can still (2024-1-15) overlap, and maybe a little within same ed.
				score += dagball.sigmoid(knob.val); //sigmoid so possible very big or small numbers dont overflow other parts of sorting.
			}
			

			//score = 1/Math.hypot(knob.y-mouseY, knob.x-mouseX); //FIXME this just sorts by distance, choosing the closest, ignoring if its touching.
			
			//TODO also remember time mouse last touched each of them and prefer those mouse has touched recently for tie breaking?
			//Lots of things that could be tried.

			return score;
		});
	},
	jsType: TinyGlsl.jsType,
	selectLockA: false, //TODO. I think only selectLockA (not selectLockB) is used, as of 2024-9-27. TODO verify. Or is the edge select system doing what this was supposed to do (and if so dont modify the edge system. but id like to get rid of selectLockB for not being used, if thats true).
	selectLockB: false, //TODO
	time: TinyGlsl.time,
	estimateFPS: 60, //changed by update_estimateFPS many times per second. target FPS is 60 at least cuz thats how fast most HDMI screens update and is fast enuf for games.
	estimateFPS_lastTime: undefined,
	update_estimateFPS: function(){
		if(dagball.estimateFPS_lastTime === undefined) dagball.estimateFPS_lastTime = dagball.time();
		let now = dagball.time();
		let dt = Math.max(0,Math.min(now-dagball.estimateFPS_lastTime,1));
		dagball.estimateFPS_lastTime = now;
		dagball.estimateFPS = dagball.estimateFPS*(1-dt) + 1; //TODO adjustable decay rate
	},

	//This is from arvox (one of the forks of AugmetedBalls) (opensource MIT)...
	//Returns a map of button/joystick/etc name to number in range -1 to 1. TODO Everything not in the map means 0? Or include zeros?
	//gamepad api, todo also add mouse, keyboard, etc. Any data flow from person to computer that doesnt need high bandwidth.
	//sound and video need high bandwidth.
	//This is called many times per second since navigator.getGamepads() only reads gamepad state once and does not start a stream of it (like browsers used to).
	//
	/*TODO use controller rumble. I got it to work with bluetooth xbox controller in win10 in chrome (first browser I tried) 2021-8-28 with this
	gamepad.vibrationActuator.playEffect("dual-rumble", {
		duration: 1000,
		strongMagnitude: 1.0,
		weakMagnitude: 1.0
	})
	but it kept rumbling, maybe cuz i was in browser debugger at a breakpoint.
	*/
	getButtonsJoysticksEtc: function(){
		let gamepads = navigator.getGamepads(); //may contain nulls, such as [null, null, null, null] or [aGamepad, null, null, null].
		let ret = {};
		//ret.mouse0_dim0 = mouseYFraction*2-1; //TODO swap y and x order of dims?
		//ret.mouse0_dim1 = mouseXFraction*2-1;
		for(let i=0; i<gamepads.length; i++){
			let gamepad = gamepads[i];
			if(gamepad){
				let s = gamepad.id;
				if(!s) s = 'gamepad';
				//s = s.trim().replaceAll(/\s|\(|\)/g,'_');
				s = s.trim().replaceAll(/\(|\)/g,'').replaceAll(/\s/g,'_');
				//let gamepadName = s+'_index'+i;
				let gamepadName = 'gamepad'+i;
				
				//let buttonOrAxisNum = 0;
				for(let a in gamepad.axes){
					//ret[gamepadName+'_'+(buttonOrAxisNum++)] = gamepad.axes[a];
					ret[gamepadName+'_dim'+a] = gamepad.axes[a];
				}
				for(let b in gamepad.buttons){
					ret[gamepadName+'_btn'+b] = gamepad.buttons[b].value; //GamepadButton {pressed: false, touched: false, value: 0}
				}
				//if(gamepad.vibrationActuator){
				//	ret[gamepadName+'_vib0_TODO'] = 0; //TODO see how I used this in comment of getButtonsJoysticksEtc
				//}
				
			}
		}
		//ret.eventExists = 1; //becomes 0 after event is consumed
		return ret;
	},

	updateGamepadsEtc: function(){
		let gamepads = navigator.getGamepads(); //may contain nulls, such as [null, null, null, null] or [aGamepad, null, null, null].
		for(let i=0; i<gamepads.length; i++){
			let gamepad = gamepads[i];
			if(gamepad){
				let s = gamepad.id;
				if(!s) s = 'gamepad';
				//s = s.trim().replaceAll(/\s|\(|\)/g,'_');
				s = s.trim().replaceAll(/\(|\)/g,'').replaceAll(/\s/g,'_');
				//let gamepadName = s+'_index'+i;
				let gamepadName = 'gamepad'+i;
				
				//let buttonOrAxisNum = 0;
				for(let a in gamepad.axes){
					//ret[gamepadName+'_'+(buttonOrAxisNum++)] = gamepad.axes[a];
					dagball.directControls[gamepadName+'_dim'+a] = gamepad.axes[a];
				}
				for(let b in gamepad.buttons){
					dagball.directControls[gamepadName+'_btn'+b] = gamepad.buttons[b].value; //GamepadButton {pressed: false, touched: false, value: 0}
				}
				let v = gamepad.vibrationActuator;
				if(v){
					if(v.type == 'dual-rumble'){
						//the only type chatgpt4 knows about as of 2023-9-23 is 'dual-rumble',
						//and 'A "dual-rumble" typically refers to two distinct motors inside the gamepad: one for "strong" vibrations and another for "weak" vibrations.'.'

						/*
						if i want to control the motors continuously, what duration should I use?
						ChatGPT
						If you want to control the motors continuously, you would typically use the playEffect method in a loop, starting a new vibration as soon as the previous one ends.

						However, to "emulate" continuous vibration, you can set a long duration and then interrupt it when you want the vibration to stop. For instance, you might set a very long duration (like several minutes), but this isn't exactly "infinite" and might not be the most elegant solution.

						Here's a conceptual approach:

						Emulate Continuous Vibration:
						Set a long duration when calling playEffect.

						javascript
						Copy code
						gamepad.vibrationActuator.playEffect("dual-rumble", {
							startDelay: 0,
							duration: 3600000,  // 1 hour, for instance
							strongMagnitude: 1.0,
							weakMagnitude: 0.5
						});
						Stop the Vibration:
						To interrupt the vibration before the duration ends, you can "play" another effect with a duration of 0.

						javascript
						Copy code
						gamepad.vibrationActuator.playEffect("dual-rumble", {
							startDelay: 0,
							duration: 0,
							strongMagnitude: 0,
							weakMagnitude: 0
						});
						*/
						let dimNameWeak = gamepadName+'_weakRumble';
						let dimNameStrong = gamepadName+'_strongRumble';
						if(dagball.directControlsOut[dimNameWeak] === undefined){
							dagball.directControlsOut[dimNameWeak] = 0; //tell other code it exists and can be set to other values (to physically shake the gamepad)
						}
						if(dagball.directControlsOut[dimNameStrong] === undefined){
							dagball.directControlsOut[dimNameStrong] = 0; //tell other code it exists and can be set to other values (to physically shake the gamepad)
						}
						//TODO simplify this code. shouldnt need both directControlsOut_rememberToStop and isGamepadRumbling
						let stopped = false;
						if(dagball.directControlsOut_rememberToStop[dimNameWeak] || dagball.directControlsOut_rememberToStop[dimNameStrong]){
							delete dagball.directControlsOut_rememberToStop[dimNameStrong];
							delete dagball.directControlsOut_rememberToStop[dimNameWeak];
							//TODO set isGamepadRumbling's to true?
							//TODO merge duplicate code
							gamepad.vibrationActuator.playEffect("dual-rumble", {startDelay: 0, duration: 0, strongMagnitude: 0, weakMagnitude: 0}); //stop it with duration 0, ChatGPT4 said.
							stopped = true;
						}
						if(((dagball.isGamepadRumbling[dimNameWeak]==true) || (dagball.isGamepadRumbling[dimNameStrong]==true)) && ((dagball.directControlsOut[dimNameWeak] == 0) && (dagball.directControlsOut[dimNameStrong] == 0))){
							dagball.isGamepadRumbling[dimNameWeak] = dagball.isGamepadRumbling[dimNameStrong] = false; //dont stop rumbling again until start
							//TODO merge duplicate code
							if(!stopped){
								gamepad.vibrationActuator.playEffect("dual-rumble", {startDelay: 0, duration: 0, strongMagnitude: 0, weakMagnitude: 0}); //stop it with duration 0, ChatGPT4 said.
							}
						}else if((dagball.directControlsOut[dimNameWeak] != 0) || (dagball.directControlsOut[dimNameStrong] != 0)){
							dagball.isGamepadRumbling[dimNameWeak] = dagball.isGamepadRumbling[dimNameStrong] = true; //remember to stop rumbling at most once if dagball.directControlsOut[dimNameWeak] etc becomes 0 later.
							let millis = Math.max(1,Math.round(dagball.maxGamepadRumbleSecondsInASingleCall*1000));
							dagball.directControlsOut_rememberToStop[dimNameWeak] = true;
							dagball.directControlsOut_rememberToStop[dimNameStrong] = true;
							gamepad.vibrationActuator.playEffect("dual-rumble",
								{startDelay: 0, duration: millis, strongMagnitude: Math.max(0,Math.min(dagball.directControlsOut[dimNameStrong],1)), weakMagnitude: Math.max(0,Math.min(dagball.directControlsOut[dimNameWeak],1))});
						}
					}
				}
				
			}
		}
	},

	//aftrans: new dagball.SimpleAftrans(300,300,1,1), //FIXME will be replaced wen FullScreenCanvas is created in a fraction of a second
	resetAftrans: function(){
		//dagball.aftrans transforms between canvas coordinates and game coordinates. Canvas is stretched and doesnt match screen coordinates.
		dagball.aftrans = new dagball.SimpleAftrans(dagball.screen.byteRect.height/2, dagball.screen.byteRect.width/2, 60, 60);
	},
	
	//this moves dagball.aftrans (view position and scale in x and y) in a spiral outward then inward, to get a quick look around.
	//Depending on other checkboxes about tiles and loading (which 2024-9-27 im not using cuz GPU compiler is so
	//slow i dont want to do sparsity thru GPU and i made a "5+ kinds of eval" to do that with a mix of GPU and CPU),
	//...depending on that, this will cause such sparse loading or not, and if it does, you wont get loading times
	//while playing around this area since its already been loaded. But this was a failed experiment.
	//GPU compiling in WebGL2 GLSL ES 300 is not fast enuf to put alot of code into GPU really fast.
	//CPU can handle alot of code, but GPU needs to focus on fewer things reused. Cuz we gotta keep lag low.
	moveViewAroundToPreload: function(){
		let startTime = dagball.time();
		let secs = 3;
		let endTime = startTime+secs;
		let maxRadius = dagball.tileSize()*1.2; //arbitrary multiplier, todo
		//let numTurns = 7; //num times around a circle during radius increasing then decreasing
		let numTurns = 15;
		let startAddY = dagball.aftrans.addY;
		let startAddX = dagball.aftrans.addX;
		let func = function(){
			let me = func;
			let now = dagball.time();
			let timeFraction = (now-startTime)/(endTime-startTime);
			let oneAtMidTimeZeroAtStartAndEnd = 2*(.5-Math.abs(.5-timeFraction));
			let radius = maxRadius*oneAtMidTimeZeroAtStartAndEnd**2;
			let angle = timeFraction*2*Math.PI*numTurns;
			let radiusInCanvasPixels = radius*dagball.aftrans.magnify(); //FIXME do separately for magnifyY and magnifyX
			dagball.aftrans.addY = startAddY + radiusInCanvasPixels*Math.sin(angle);
			dagball.aftrans.addX = startAddX + radiusInCanvasPixels*Math.cos(angle);
			if(timeFraction < 1){
				dagball.doAsap(me); //schedule for next dagball cycle (usually is next video frame)
			}else{
				dagball.aftrans.addY = startAddY;
				dagball.aftrans.addX = startAddX;
			}
		};
		dagball.doAsap(func);
	},
	
	//top edge of screen in game coords
	viewMinY: function(){
		return dagball.aftrans.reverseY(0); //TODO optimize by inlining the internals of aftrans here?
	},
	
	//bottom edge of screen in game coords
	viewMaxY: function(){
		return dagball.aftrans.reverseY(dagball.screen.byteRect.height);
	},
	
	//left edge of screen in game coords
	viewMinX: function(){
		return dagball.aftrans.reverseX(0); //TODO optimize by inlining the internals of aftrans here?
	},
	
	//right edge of screen in game coords
	viewMaxX: function(){
		return dagball.aftrans.reverseX(dagball.screen.byteRect.width);
	},
	
	//whats at center of screen in game coords
	viewCenterY: function(){
		return dagball.aftrans.reverseY(dagball.screen.byteRect.height/2);
	},
	viewCenterX: function(){
		return dagball.aftrans.reverseX(dagball.screen.byteRect.width/2);
	},
	
	//UPDATE 2024-9-27 I'm undecided on how the sparsity will be done, but im sure it will
	//fill dagball.circles and dagball.balls (and duplicated in dagball.view.balls)
	//with only the game objects nearby. This influenceAtYXR func might still be useful
	//to use with that to fade those objects in/out of game physics,
	//so when they're farther away time does not pass, but when they're medium distance away
	//time passes slower, and gradually between. This will be complicated by later dagball becoming
	//multiplayer online (first just 50 players per server but later massively multiplayer)
	//so you can fork and merge with what other computers claim the game state is.
	//You can view all computers trying to sync together as positions in high dimensional space
	//where dimensions are defined by circOrBall.toPv().pv.vx for example means the x velocit y of circOrBall,
	//and options and walls will also go in circOrBall as gameObject.toPv()...
	//
	//In game coords. This is how to scale up dagball to potentially millions of simultaneous players
	//each doing some of the GPU calculations, or 1 player with only the part of the game world
	//near on screen at the time being displayed and physics computed about, leaving the other parts frozen
	//and gradually slowed down until they stop moving as view gets farther away or gradually gets closer.
	//in game coords, if sparseWorld/"only sim/display whats near view" is checked,
	//then TODO fades circ.influence and ball.influence etc to 0 at a chosen distance,
	//and fades it before that distance gradually from 1 to 0, based on 2 number boxes beside the checkbox.
	//If the checkbos is unchecked, this is always 1.
	//This should be multiplied by the influence chosen in peer to peer network since influence
	//is how to add and remove possible objects to the game world.
	//influenceAtYX is needed cuz dagball can only do up to 1000 (or slightly below that)
	//number of dimensions (2 floats each), and only a small game world can fit in that,
	//so load and unload objects from physics and display and GPU memory
	//(but bitpic/dagball_bloomtree is CPU only so can display alot farther) so you can have big game worlds.
	//TODO In peer to peer network, there will be many players each with a different view center y x
	//so each can compute a different area (many partially overlapping) of the game world and fit them together
	//using (Dagverse.js) DV.Fastree and DV jsondags.
	influenceAtYXR: function(y,x,r){
		if(!dagball.chk('sparseWorld')){ //everywhere has .influence 1
			return 1;
		}
		let dist = dagball.distFromViewCenter(y,x);
		dist = Math.max(0,dist-r); //distance to nearest part of the circ/ballRadius/etc. If you dont want to use that, use param of r=0.
		let sparseDistFar = dagball.sparseDistFar();
		let sparseDistNear = dagball.sparseDistNear(sparseDistFar);
		if(dist >= sparseDistFar){
			return 0;
		}else if(dist < sparseDistNear){
			return 1;
		}else if(dagball.chk('fadeTiles',false)){ //between sparseDistNear and sparseDistFar, vary .influence smoothly.
			//gradually between. TODO make this smoother? Its a straight angle between flat 0 and flat 1,
			//and I dont like it having corners. Should it use the math called "ease in out"? It would slightly weaken it
			//therefore needing sparseDistFar to be a little bigger to have same size of view near the edges,
			//but extend the parts where its near 1 out a little past sparseDistNear.
			//This is a research path to be explored.
			return 1-(dist-sparseDistNear)/(sparseDistFar-sparseDistNear);
		}else{ //between sparseDistNear and sparseDistFar, but everwhere up to sparseDistFar is 1 cuz not fadeTiles
			return 1;
		}
	},
	//in game coords
	distFromViewCenter: function(y,x){
		let cy = dagball.viewCenterY();
		let cx = dagball.viewCenterX();
		return Math.hypot(y-cy, x-cx);
	},
	default_sparseDist: 8, //(this text was about value 2, not 8 which it is now 2024-4-24) so if its not given, its noticable on screen since this is normally a little smaller than screen size
	default_sparseDistFrac: .7,
	sparseDistFar: function(){
		return dagball.num('sparseDist',dagball.default_sparseDist);
	},
	sparseDistFrac: function(){
		return dagball.num('sparseDistFrac',dagball.default_sparseDistFrac);
	},
	//If you give the optional param, its normally dagball.sparseDistFar() so you dont have to compute it again here.
	sparseDistNear: function(optionalSparseDistFar){
		let sparseDistFar = optionalSparseDistFar!==undefined ? optionalSparseDistFar : dagball.sparseDistFar();
		return sparseDistFar*dagball.sparseDistFrac();
	},
	
	
	canvasHeight: function(){
		return dagball.screen.byteRect.height;
	},
	canvasWidth: function(){
		return dagball.screen.byteRect.width;
	},

	/*The GPU code in a circle only affects the (up to 1000 dimensional) curves in that circle, but u can make the circle as big as u want
	and ignore any areas (return 0 to add to total potentialEnergy) you dont want to change. But it reduces number of dimensions left where it overlaps
	--https://twitter.com/DagBallGame/status/1703465244264165669
	*/
	//bootCanvasHeight: 150,
	//bootCanvasWidth: 200,
	//bootCanvasHeight: 450,
	//bootCanvasWidth: 600,
	//bootCanvasHeight: 600,
	//bootCanvasWidth: 800,
	bootCanvasHeight: 450,
	bootCanvasWidth: 600,
	//bootCanvasHeight: 768,
	//bootCanvasWidth: 1024,
	//defaultIconRadius: 5,
	defaultIconRadius: 7, //ballSize ballRadius is basically this 2023-11-30, even though before that date there was no ball bounce physics
	canvasScaleY: 1, //modified at boot and when resize window. dont set it here. Used to find mouse position.
	canvasScaleX: 1, //modified at boot and when resize window. dont set it here. Used to find mouse position.
	//dual-rumble gamepads (with a strong and a weak rumble motor) have to be told a time to rumble.
	//This time will normally be cancelled as soon as you turn it off in directControlsOut. But maybe it matters to how fast the motor spins up or some electric efficiency. I dont know.
	//Its here to adjust what parameter goes into a {} param in gamepad.vibrationActuator.playEffect if you want to experiment with it. Its converted to integer number of milliseconds.
	maxGamepadRumbleSecondsInASingleCall: .1,
	//maxGamepadRumbleSecondsInASingleCall: .5,
	makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest: false,
	//If you turn this off at runtime, do it with turnOff_makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest or they will keep rumbling.
	//makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest: true, //TODO turn off
	//These are for if you want to test 1 motor or the other or if you dont want to wear out your gamepads rumble so turn down the strength during the test.
	turnOff_makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest: function(){
		dagball.makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest = false;
		for(let dimOut in dagball.directControlsOut){
			if(dagball.isGamepadRumbleDimName(dimOut)){
				dagball.directControlsOut[dimOut] = 0;
			}
		}
	},
	makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest_maxStrongRumbleStrength: 1, //there are in theory 2 motors, a strongRumble motor and a weakRumble motor in each dual-rumble gamepad
	makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest_maxWeakRumbleStrength: 1,
	isGamepadRumbleDimName: dimName=>dimName.toLowerCase().includes('rumble'), //TODO optimize by using includes 'umble' or by a regex? (dont want to allocate objects unnecessarily)
	isGamepadRumbling:{}, //This is only used to remember not to stop it from rumbling if its already stopped
	directControls:{ //Inputs, not the outputs even if some dimensions have both: buttons, joysticks, analog triggers, mouse dimensions, EEG hats and brain chip dimensions, etc.
		mouseY: 0,
		mouseX: 0,
		rawMouseY: 0,
		rawMouseX: 0,
	},
	//see comment of dagball.isSpaceDim. Cuz of float roundoff, you shouldnt put objects past this radius, and TODO make potentialEnergy get very high when nearing this.
	//Positions are float32s, not integers. Float32s have 24 digit bits and 1 sign bit and can exactly do all integers in range plus/minus 2**24, so 2**12 is half of those digit bits.
	//Radius 2**12 is big enough for millions of players at once if theres a few players on each screen, or could be hundreds of players on same screen in some areas.
	gameRadius: 2**12,
	directControlsOut:{ //Outputs, not the inputs, even if some dimensions have both: gamepad rumble dimensions, brain chip dimensions writing to brain, or whatever outputs (to computer) you hook in, etc.
		//put gamepad rumble dimensions, etc here. Only those verified to exist. If its mapped to 0 (or any number in range -1 to 1) that means it exists. Often starts as 0 when found. TODO.
	},
	directControlsOut_rememberToStop:{}, //for stopping gamepad rumble dimensions, but dont want to stop them if didnt start. value is true, or removed from this map (no false).
	//space dims range plus/minus infinity (or more practically maybe plus/minus 2**12 (see gameRadius) cuz of float32 roundoff?). non-space dims range -1 to 1.
	isSpaceControlsDim: dimName=>dimName.toLowerCase().includes('mouse'),
	draggingEdSliderKnob: null, //null or the dagball.EdSliderKnob being dragged by mouse. dagball.controls('selectLockAOn') is 1 when left/main mouse button is down, unless controls mapping changed (FIXME)
	selectLock: function(){ //while dagball.controls('moveCircle') etc, this should return true. Otherwise when moving a circle it selects the nearest circle and starts moving that one when you move a circle across it.
		//TODO will likely be more later
		//"(!dagball.controls('selectLockAOff') && !dagball.controls('selectLockAOn')) &&" allows selected circ to change while clicking to turn selectLock on,
		//viewing that as user wants to turn it off then instantly back on again on a different circ. But only need selectLockOn for that.
		//As of 2023-10-17 selectLockB has never been used but it was put in for if wanted to select 2 circs at once to
		//edit edges between them (theres 3 kinds of edges in dagball.Circ). Maybe will use it?
		//Problem is there can be multiple edges between each pair of circs of the same edgeType and am instead for one of those types
		//uniquely identifying it by (y,x) of where those colored lines from circ perimeter points. If 2 circs such lines point at same (y,x) they should be connected.
		return !dagball.controls('selectLockAOn') && (
			dagball.controls('curveGrabLow') || dagball.controls('curveGrabMid') || dagball.controls('curveGrabHigh') || dagball.controls('moveView') || dagball.controls('moveView2') ||
			dagball.controls('moveEds') || dagball.controls('learn') ||
			dagball.controls('moveCircle') || dagball.controls('resizeCircle') || dagball.controls('red') || dagball.controls('green') || dagball.controls('blue') || dagball.controls('bright') ||
			dagball.controls('editCircleText') || //editCircleText button being held prevents selecting while mouse is moving from canvas to textarea across other circs, then when release the button focuses on textarea.
			dagball.selectLockA //2023-9-27 this allows the left mouse button to hold the selected circle as selected, and unhold it, usually for editing its text in the textarea on left.
		);
	},
	actionControls:{
		//If you want to hold mouse in left hand and keyboard on right, you should change these controls. Or if you just dont like the controls.
		//FIXME all controls are supposed to range -1 to 1, but mouseX seems to range -4 to 4, probably somethinga bout the affine transform magnify being set to 100 and canvas being 800 pixels wide and magnified.
		//But since mouse needs to be in dagball.aftrans coordinates, like the balls and dag circles, and TODO other players mouses etc are in that space too far away,
		//ill create a function dagball.isSpaceControlsDim('mouseX')->true so know what range is allowed.
		mouseY: 'mouseY', //TODO allow making this a joystick axis.
		mouseX: 'mouseX',
		editCircleText: '\'', //while circ is selected and you're in the canvas, push this to focus the textarea on the left so you can type in it
		selectLockAOn: 'mouseButton0',
		selectLockAOff: 'mouseButton2',
		//TODO? selectLockB: 'mouseButton2',
		//TODO? search: 's',
				
		moveViewAroundToPreload: 'mouseButton1', //reduces future lag by lagging over the next few seconds

		movePaintWall: 'q', //dagball.bitpic
		zoomPaintWall: 'w', //dagball.bitpic
		paintOpenPixel: 'e', //dagball.bitpic
		paintWallPixel: 'r', //dagball.bitpic
		resizePaintWallBrush: 't', //dagball.bitpic

		moveView: 'a',
		moveView2: 'mouseButton2',
		zoomView: 's',
		moveCircle: 'd',
		resizeCircle: 'f',
		moveBallHere: 'g', //pick a ball at random and move it here, or maybe whichever ball is farthest from mouse? todo...
		
		createCircle: 'z',
		deleteCircle: 'x',
		moveEds: 'c',
		rebuildEdGroup: 'v',
		//Theres a cursor circle that moves around perimenter of a circle. Ed lines hang off that perimeter.
		//When you push this button, whichever ed line is nearest, its ed.slidersFunc is edited in a simple popup.
		editEdSliderKnob: 'b',

		//TODO 2023-12-28 these 4 have never been coded. plan for when theres more players who need ways to build and choose content together.
		gpucircExistVote: 'j',
		gpucircInfluenceMedianVote: 'k',
		true: 'l',
		like: ';',

		bright: '`',
		red: '1',
		green: '2',
		blue: '3',
		moveOneEd: '4', //TODO find better button.
		//some of these are keys in dagball.edgeTypes, such as: gpucircExistVote, gpucircInfluenceMedianVote, true, like, and dim.

		//If the selected circ has circ.nn (a dagball.RbmCircBridge wrapping a dagball.RbmLayer), trains it on current ed states,
		//where moving mouse up learns and moving mouse down unlearns, smoothly/gradualAmounts.
		//This has nothing to do with the saves/nnet*.dagball files which derive neuralnets at user level.
		learn: ' ',

		//TODO createCurbGrab: 'ArrowUp', //TODO delete with the same button that deletes a dagball.Circ? or should it have its own button?
		//changes the strength of the low parabola half of the selected ball, to reshape curvy ground. for neuralnet learning or just general curves.
		//curveMid and curveHigh are similar, 3 vars in the same ball used as a way to grab the curve on screen at a (y,x).
		toggleBallLockPos: 'ArrowUp', //If ball.lockPos is true, does not allow ball.y or ball.x to change and keeps ball.yv and ball.xv (velocities) to 0. or even if balls become 3d in some later version, lock that too, but that will probably be just Axgob game objects.
		curveGrabLow: 'ArrowLeft',
		curveGrabMid: 'ArrowDown',
		curveGrabHigh: 'ArrowRight',

		changeBallType: 'Shift', //change between normalBall vs curveGrabBall of selected ball, by deleting or creating ball.curveGrab.

		randomizePos: 'Backspace',
		randomizeVel: '\\', //randomizeVel: 'Delete',

		doApDotJsTests: '/', //doApDotJsTests: '\\',

		//START: dagball.Edge stuff. Its state is in dagball.edgeEdit. TODO this stuff doesnt work as of 2024-5-24-1224pET.
		viewEdgeFrom: 'Home', //selected circ becomes the FROM for edges, but does not change, create, or delete any edges just from doing this
		viewEdgeTo: 'End', //selected circ becomes the TO for edges, but does not change, create, or delete any edges just from doing this
		viewNextEdgeType: 'PageUp', //of existing andOr suggested edgeTypes (dagball.Edge.edgeType), go to the next highest sorted string or wrap around
		viewPrevEdgeType: 'PageDown', //opposite of viewNextEdgeType
		viewEdgeTypeText: 'Enter', //go directly to an edgeType you type as text into a popup, that starts as the current edgeType
		createEdge: 'Insert', //create an edge if not already exist of the current edge type from the viewEdgeFrom to the viewEdgeTo circ, if it would not create a cycle.
		deleteEdge: 'Delete', //opposite of createEdge
		//END: dagball.Edge stuff

		/*addEdge: '=', //TODO. = is on the + button. add a dagball.Edge to selected circ, in circ.edgesOut (not circ.edsOut which is instead dagball.Ed).
		removeEdge: '-', //TODO.
		editEdgeType: '9', //TODO.
		editEdgeVal: '0', //TODO.
		*/

		//for copy/pasting in the PV system, like circ.toPv() and ball.toPv() and todo make it work for options and wall objects too.
		copy: 'Control_c',
		paste: 'Control_v',

		togglePause: 'Pause', //toggle the pause checkbox. This should stop dagball from using your GPU mostly but it might still do basic 2d graphics. TODO check CPU and GPU use of the OS process of the browser.

		toggleMenu: 'Escape',
		//toggleMenu: 'CapsLock',
	},
	//Param is directControls key (values in actionControls). Can be button, mouse dimension, joystick dimension, etc.
	shortButtonEtcName: function(longName){
		if(longName == 'Escape') return 'Esc';
		return longName;
	},
	prev_directControls:{}, //for holding keyboard button while moving mouse, to know if the button is held and (dy,dx) of mouse movement.
	update_prev_directControls: function(){
		for(let a in dagball.directControls){
			dagball.prev_directControls[a] = dagball.directControls[a];
		}
	},
	//Example params: 'mouseY' (may change by -.03 for example) 'mouseX' 'moveView' changes by +1 or -1 (cuz is always 0 or 1).
	//Change since dagball.update_prev_actionControls();
	controlsChange: function(name){
		return dagball.controls(name)-dagball.prevControls(name);
	},
	//controlsMap:{
	//	//will happen automatically if you dont rename them mouseY: 'mouseY',
	//	//mouseY: 'mouseX',
	//
	//},
	controls: function(name){ //TODO rename controls to control and prevControls to prevControl?
		if(dagball.actionControls[name] !== undefined){ //customizable controls
			name = dagball.actionControls[name];
		}
		return dagball.directControls[name] || 0;
		//OLD: replace this func to change your controls. Most code should only read from dagball.controls('mouseX'), not dagball.directControls.mouseX directly.
		//return dagball.directControls[name] || 0;
	},
	prevControls: function(name){ //TODO rename controls to control and prevControls to prevControl?
		if(dagball.actionControls[name] !== undefined){ //customizable controls
			name = dagball.actionControls[name];
		}
		return dagball.prev_directControls[name] || 0;
		//OLD: replace this func to change your controls. Most code should only read from dagball.controls('mouseX'), not dagball.directControls.mouseX directly.
		//return dagball.directControls[name] || 0;
	},
	//null or the circ with that circ.mutid. mutid allows circ to change its contents (mutable). id does not. so if contents changes, so should id (TODO id isnt used much as of 2024-5-24)
	mutidToCirc: mutid=>{
		if(!mutid) return null;
		for(let circ of dagball.circles) if(circ.mutid==mutid) return circ;
		return null;
	},
	selecteObs: function(){
		let ret = [];
		ret.push(...(dagball.selectedCircs()));
		ret.push(...(dagball.selectedBalls()));
		//TODO also wall and option objects, and whatever else there will be in the PV json format.
		//TODO sort by id or something?
		return ret;
	},
	selectedCircs: ()=>dagball.circles.filter(c=>c.isSelected),
	selectedBalls: ()=>dagball.balls.filter(b=>b.isSelected),
	prefixMessageToUser: ()=>{
		let prefix = '';
		let my = dagball.controls('mouseY');
		let mx = dagball.controls('mouseX');
		if(dagball.chk('isDisplayGradientsAsBrightnessOfRectanglesOnBackground') && dagball.debug_last_isDisplayGradientsAsBrightnessOfRectanglesOnBackground_arrays){
			//2d float array of rows of things displayed near top of screen depending on the checkbox. use [0].length as width cuz potens might be 1 bigger than that cuz of neutral dimension.
			let arr = dagball.debug_last_isDisplayGradientsAsBrightnessOfRectanglesOnBackground_arrays;
			let canvasY = dagball.gameYToCanvasY(dagball.controls('mouseY'));
			let canvasX = dagball.gameXToCanvasX(dagball.controls('mouseX'));
			let verticalMultiRowSize = dagball.gradientRectanglesHeightPixels;
			if(canvasY < verticalMultiRowSize){
				prefix += '.\n\n'; //cuz otherwise it displays too high slightly above near mouse cursor, but mouse is near top of screen so it would hang off.
				//display contents of dagball.debug_last_isDisplayGradientsAsBrightnessOfRectanglesOnBackground_arrays, whichever mouse is horizontally over
				//TODO do this in game coords so it will be a little more precise about pixel rounding? Would need to know view rect in game coords.
				//let verticalFraction = canvasY/verticalMultiRowSize;
				let horizontalFraction = canvasX/dagball.canvasWidth();
				//let verticalIndex = (verticalFraction/arr.length)|0;
				let horizontalIndex = (horizontalFraction*arr[0].length)|0;
				for(let row=0; row<arr.length; row++){
					let val = dagball.debug_last_isDisplayGradientsAsBrightnessOfRectanglesOnBackground_arrays[row][horizontalIndex];
					prefix += '['+row+']['+horizontalIndex+']='+dagball.formatNumberForFastReading(val)+'\n';
				}
				if(arr.length){ //all rows have same arrayNames. It varies by column. Each arrayName has at least 1 column.
					let arrayName = dagball.debug_last_isDisplayGradientsAsBrightnessOfRectanglesOnBackground_arrays[0].arrayNames[horizontalIndex];
					prefix += 'arrayName='+arrayName+'\n';
				}
			}
		}
		if(dagball.chk('showGroundHeightOnMouse',dagball.defaultShowGroundHeightOnMouse)){
			let poten = dagball.gameYXToPotenFromLastDisplay(my, mx);
			let brightFraction = dagball.sigmoid(poten);
			let brightMul = brightFraction*255.999;
			dagball.mouseColorRGB = [.1*brightMul, brightMul, .3*brightMul];
			prefix += dagball.formatNumberForFastReading(poten)+'\n';
			/*prefix += 'mouseY='+my+'\n';
			prefix += 'mouseX='+my+'\n';
			prefix += 'canvasY='+dagball.gameYToCanvasY(my)+'\n';
			prefix += 'canvasX='+dagball.gameXToCanvasX(mx)+'\n';
			*/
		}
		return prefix;
	},
	suffixMessageToUser: ()=>'',
	changeGameStateByInputControls: function(){ //uses dagball.controlChange('mouseY') and dagball.controlChange('moveView') etc.
		let newMessageToUser = dagball.prefixMessageToUser();

		let edgeEditStr = '';
		let showEdgeEditStr = false;
		edgeEditStr += ' weight=TODO';
		if(dagball.edgeEdit.viewEdgeType){
			edgeEditStr += ' edgeType='+dagball.edgeEdit.viewEdgeType;
			showEdgeEditStr = true;
		} 
		if(dagball.edgeEdit.viewEdgeFromId){
			edgeEditStr += '\nfrom='+dagball.edgeEdit.viewEdgeFromId;
			showEdgeEditStr = true;
		}
		if(dagball.edgeEdit.viewEdgeToId){
			edgeEditStr += '\nto='+dagball.edgeEdit.viewEdgeToId;
			showEdgeEditStr = true;
		}
		edgeEditStr = 'edgeEdit['+edgeEditStr.trim()+']';
		if(showEdgeEditStr){
			newMessageToUser += edgeEditStr+'\n';
		}

		/*if(dagball.controlsChange('selectLockA') == 1){
			dagball.selectLockA = !dagball.selectLockA;
		}*/
		let mustClickPaintWallsMsg = ' must click "bitpic" button first, to create a dagball.bitpic';
		let edSliderKnobOrNull = dagball.getEdSliderKnob();
		//dagball.draggingEdSliderKnob

		let selectedBalls = dagball.selectedBalls();

		if(!dagball.isTextEditing()){

			let selectedCircs = dagball.selectedCircs();
			let selectedCirc = selectedCircs[0]; //undefined if none are selected

			if(dagball.controlsChange('selectLockAOn') == -1){ //FIXME what if selectLockAOn is not connected to mouseButton0/leftButton?
				dagball.draggingEdSliderKnob = null; //not dragging cuz left/main mouse button is up (FIXME it doesnt have to be the selectLockAOn button)
			}
			//FIXME hardcoding knob dragging to dagball.controlsChange('selectLockAOn') cuz thats been left/main mouse button for a while as of 2024-1-16.
			if(edSliderKnobOrNull && dagball.controlsChange('selectLockAOn') == 1){ //FIXME what if selectLockAOn is not connected to mouseButton0/leftButton?
				//left/mouse button went down, and mouse is touching a knob, so start dragging it.
				dagball.draggingEdSliderKnob = edSliderKnobOrNull;
			}
			if(edSliderKnobOrNull && dagball.randomizeColorOfEdSliderKnobWhenMouseOver){
				edSliderKnobOrNull.red = dagball.randByte();
				edSliderKnobOrNull.green = dagball.randByte();
				edSliderKnobOrNull.blue = dagball.randByte();
			}

			edSliderKnobOrNull = dagball.draggingEdSliderKnob; //the one dragging, or null if not dragging.

			if(dagball.controlsChange('selectLockAOn') == 1 && !edSliderKnobOrNull){ //FIXME what if selectLockAOn is not connected to mouseButton0/leftButton?
				dagball.selectLockA = true;
			}
			if(dagball.controlsChange('selectLockAOff') == 1){
				dagball.selectLockA = false;
			}
			if(dagball.controlsChange('selectLockB') == 1){ //A and B are like FROM and TO groups of selected circs but i might code it some other way??
				dagball.selectLockB = !dagball.selectLockB;
			}
			
			let mouseDy = dagball.controlsChange('mouseY');
			let mouseDx = dagball.controlsChange('mouseX');

			if(edSliderKnobOrNull){
				//newMessageToUser += ' '+edSliderKnobOrNull+' knob';
				let k = edSliderKnobOrNull;
				newMessageToUser += ' func='+k.ed.slidersFunc+'\ndagball.circles['+dagball.circles.indexOf(k.ed.fromCirc)+'].edsOut['+k.ed.indexInCirc()+'].sliderKnobs['+k.sliderIndex+'].val=\n'+k.val;
				if(mouseDy || mouseDx){
					let [directionY, directionX] = edSliderKnobOrNull.directionYX(); //len 1. In the rare case ed line length is 0, its [0,1].
					let mouseChangeAlongEdLine = mouseDy*directionY + mouseDx*directionX; //dotProd
					//let mul = Math.max(.5, Math.min(Math.exp(mouseChangeAlongEdLine*dagball.speedMouseChangesMagnify), 2));
					//let add = mouseChangeAlongEdLine*dagball.speedMouseChangesMagnify; //FIXME make a new speed scaling var instead of speedMouseChangesMagnify
					//let add = mouseChangeAlongEdLine/dagball.aftrans.magnify();
					//let add = mouseChangeAlongEdLine;
					//let add = mouseChangeAlongEdLine*dagball.canvasScaleY; //FIXME
					//let add = mouseChangeAlongEdLine/dagball.canvasScaleY; //FIXME
					//let add = mouseChangeAlongEdLine*5.1; //FIXME why this constant?
					let add = mouseChangeAlongEdLine*4.8; //FIXME why this constant?
					//console.log('edSliderKnobOrNull.val += '+add+' mouseY='+dagball.controls('mouseY')+' knobY='+edSliderKnobOrNull.y+' edY='+edSliderKnobOrNull.ed.y);
					edSliderKnobOrNull.val += add;
				}
			}

			let dt = dagball.controlsChange('time');
			dagball.directControls.mouseDy = mouseDy;
			dagball.directControls.mouseDx = mouseDx;
			dagball.directControls.dt = dt;
			let mouseY = dagball.controls('mouseY');
			let mouseX = dagball.controls('mouseX');
			let isWall;
			if((isWall=dagball.controls('paintWallPixel')) || dagball.controls('paintOpenPixel')){
				if(dagball.bitpic){
					newMessageToUser += isWall ? ' paint wall' : ' erase wall';
					//dagball.bitpic.writeYX(mouseY, mouseX, isWall);
					dagball.bitpic.writeYXR(mouseY, mouseX, dagball.paintbrushRadiusForBitpic, isWall);
				}else{
					newMessageToUser += mustClickPaintWallsMsg;
				}
			}
			if(dagball.controls('moveOneEd')){
				newMessageToUser += ' moveOneEd\ned='+dagball.selectedEd;
				if(dagball.selectedEd){
					dagball.selectedEd.y += mouseDy;
					dagball.selectedEd.x += mouseDx;
				}
			}
			if(dagball.controls('moveEds')){
				//move 1 of the dagball.EdGroup's in a dagball.Circ. They are found in circ.edsOut[index].edGroup
				//which are each shared by 1 or more dagball.Ed and are how circs connect to eachother.
				let selectedEds = dagball.selectedEds();
				newMessageToUser += ' moving '+selectedEds.length+' lines (array/parrMem/EdGroup, or maybe later multiple EdGroups can be selected at once if theyre already connected?)';
				for(let ed of selectedEds){
					ed.y += mouseDy;
					ed.x += mouseDx;
					//ed.y = dagball.roundToEdSnapGrid(ed.y); //display and EdJoint_merge them by roundToEdSnapGrid but let it be loose (any float32) in ed.y and ed.x
					//ed.x = dagball.roundToEdSnapGrid(ed.x);
				}
			}
			if(dagball.controls('learn')){ //This is only for the 2 node layer 1 edge layer RBM layer which works 2024-5 (and earlier) but has nothing to do with the more advanced neuralnets using gooGroup and gooSync (saves/nnet*.dagball files) that im making soon. This 'learn' should be renamed to something more specific since its not the only neuralnet type and is only for circ.nn.
				newMessageToUser += ' learn, mouse up to learn, mouse down to unlearn,\nusing selectedCirc.nn if exists.';
				for(let circ of dagball.selectedCircs()){
					let learnRate = -dagball.circNnLearnMultiplierByMouse*mouseDy; //FIXME truncate this if too big or too negative.
					if(circ.nn && learnRate){
						circ.nn.learn(learnRate, dagball.defaultRbmNumForwards);
						//let weights = circ.nn.rbmLayer.weights;
						let s = 'learnRate='+learnRate+' time='+dagball.time()+' circ.nn=\n'+JSON.stringify(circ.nn.toMap());
						//dagball.displayTxtQuiet(s);
						console.log(s);
					}
				}
			}
			if(dagball.controls('rebuildEdGroup')){
				newMessageToUser += ' rebuildEdGroup';
			}
			if(dagball.controlsChange('rebuildEdGroup') == 1){ //the button was just pushed
				let selectedEds = dagball.selectedEds();
				if(selectedEds.length){
					let firstSelectedEdGroup = selectedEds[0].edGroup;
					if(firstSelectedEdGroup){
						firstSelectedEdGroup.randomlyPointYXR();
					}
				}
			}

			//START: dagball.Edge (circ.edgesOut) stuff (not dagball.Ed / circ.edsOut)
			let circFrom = dagball.mutidToCirc(dagball.edgeEdit.viewEdgeFromId);
			let circTo = dagball.mutidToCirc(dagball.edgeEdit.viewEdgeToId);
			let edgeType = dagball.edgeEdit.viewEdgeType;
			if(dagball.controls('viewEdgeFrom')){
				newMessageToUser += ' viewEdgeFrom';
				if(selectedCirc){
					dagball.edgeEdit.viewEdgeFromId = selectedCirc.mutid;
				}
			}
			
			if(dagball.controls('viewEdgeTo')){
				newMessageToUser += ' viewEdgeTo';
				if(selectedCirc){
					dagball.edgeEdit.viewEdgeToId = selectedCirc.mutid;
				}
			}

			if(dagball.controls('viewNextEdgeType')){
				newMessageToUser += ' viewNextEdgeType';
			}
			if(dagball.controlsChange('viewNextEdgeType') == 1){ //onkeydown
				alert('TODO viewPrevEdgeType. Find list of all edgeTypes in circs and dagball.edgeEdit.viewEdgeType, and go to next/prev sorted by string and wrapping around');
			}

			if(dagball.controls('viewPrevEdgeType')){
				newMessageToUser += ' viewPrevEdgeType';
			}
			if(dagball.controlsChange('viewPrevEdgeType') == 1){ //onkeydown
				alert('TODO viewPrevEdgeType. Find list of all edgeTypes in circs and dagball.edgeEdit.viewEdgeType, and go to next/prev sorted by string and wrapping around');
			}

			if(dagball.controls('viewEdgeTypeText')){
				newMessageToUser += ' viewEdgeTypeText';
			}
			if(dagball.controlsChange('viewEdgeTypeText') == 1){ //onkeydown
				dagball.edgeEdit.viewEdgeType = prompt('dagball.edgeEdit.viewEdgeType = ', dagball.edgeEdit.viewEdgeType) || null;
			}
			
			if(dagball.controls('createEdge')){
				newMessageToUser += ' createEdge';
			}
			if(dagball.controlsChange('createEdge') == 1){ //onkeydown
				if(circFrom && circTo && edgeType){
					circFrom.edgeTo(edgeType,circTo,1); //set edge weight to 1
				}
			}
			
			if(dagball.controls('deleteEdge')){
				newMessageToUser += ' deleteEdge';
			}
			if(dagball.controlsChange('deleteEdge') == 1){ //onkeydown
				if(circFrom && circTo && edgeType){
					circFrom.deleteEdgeTo(edgeType,circTo);
				}
			}
			//END: dagball.Edge (circ.edgesOut) stuff (not dagball.Ed / circ.edsOut)

			if(dagball.controls('randomizePos') == 1){
				newMessageToUser += ' randomizePos';
			}
			if(dagball.controlsChange('randomizePos') == 1){
				dagball.game.randomizePos();
			}
			if(dagball.controls('randomizeVel') == 1){
				newMessageToUser += ' randomizeVel';
			}
			if(dagball.controlsChange('randomizeVel') == 1){
				dagball.game.randomizeVel();
			}

			//console.log('changeGameStateByInputControls mouseDy='+mouseDy+' mouseDx='+mouseDx);
			//TODO move all for(let circ of dagball.selectedCircs()) to outer loop? Also theres going to be 2 selected groups, the FROMs and the TOs.
			if(dagball.controls('moveCircle')){
				newMessageToUser += ' move circle';
				for(let circ of dagball.selectedCircs()){
					circ.y += mouseDy;
					circ.x += mouseDx;
				}
			}
			if(dagball.controls('editEdSliderKnob')){
				newMessageToUser += ' edit slider knob code of 1 ed line (a dagball.EdSliderKnob)';
			}
			if(dagball.controlsChange('editEdSliderKnob') == 1){
				//alert('TODO editEdSliderKnob');
				if(dagball.selectedEd){
					dagball.selectedEd.simpleEditKnobCode();
				}else{
					alert('Theres no dagball.selectedEd so cant editEdSliderKnob. Move mouse near perimeter of circle near the ed line you want to edit knob code of.');
				}
			}
			if(dagball.controls('moveBallHere')){
				newMessageToUser += ' move a random ball to just under mouse';
			}
			if(dagball.controlsChange('moveBallHere') == 1){
				let toY = dagball.controls('mouseY')+.1; //a little under mouse cursor/ball.
				let toX = dagball.controls('mouseX');
				let ball = dagball.balls[Math.floor(Math.random()*dagball.balls.length)]; //FIXME this could move mouse ball
				ball.y = toY; //move to just under mouse
				ball.x = toX;
				ball.yv = ball.xv = 0; //0 velocity
			}
			if(dagball.chk('centerViewOnGamepadBall',false) && dagball.balls[1]){ //FIXME dont hardcode ball indexs
				let ball = dagball.balls[1];
				//dagball.aftrans.addY = -dagball.aftrans.forwardY(ball.y);
				//dagball.aftrans.addX = -dagball.aftrans.forwardX(ball.x);
				dagball.aftrans.addY = -dagball.aftrans.magnifyY*ball.y+dagball.canvasHeight()/2;
				dagball.aftrans.addX = -dagball.aftrans.magnifyX*ball.x+dagball.canvasWidth()*.6;
			}
			if(dagball.controls('moveView') || dagball.controls('moveView2')){ //moveView2 is so can have 2 buttons for it. the extra button is right mouse button as of 2024-4-24 (TODO).
				//newMessageToUser += ' move view';
				//let selectedBalls = dagball.selectedBalls();
				newMessageToUser += ' move view and '+selectedBalls.length+' selected balls';
				if(selectedBalls.length){
					//newMessageToUser += ' move view or ['+selectedBalls.length+' selected balls]';
					//mul = 1;
					//if ball being dragged has velocity or is hit by other balls while being dragged, it will move relative to mouse cursor, which is correct.
					//Similar for if zoom out/in while dragging, its distance relative to mouse cursor is in game coords, not screen coords.
					let ballAddY = mouseDy;
					let ballAddX = mouseDx;
					selectedBalls.forEach(b=>{
						//b.y -= ballAddY;
						//b.x -= ballAddX;
						if(ballAddX || ballAddY){
							b.y += ballAddY;
							b.x += ballAddX;
							b.xv = b.yv = 0; //if mouse dragged ball, set balls velocity to 0, to stop it when start dragging and to prevent it from moving if stuff bounces on it etc
						}
					});
					dagball.updateDirectControlsMouse();
				}else{
				//}
				//{
					//newMessageToUser += ' [move view] or selected balls';
					
					//dagball.aftrans.addY += mouseDy*128; //FIXME use dagball.aftrans to convert the coordinates somehow
					//dagball.aftrans.addX += mouseDx*128;
					//let mul = 128;
					//let mul = 3;
					//let mul = dagball.aftrans.magnifyY*2/3; //FIXME
					//let mul = dagball.aftrans.magnifyY;
					//let mul = dagball.aftrans.magnifyY*3;
					let viewMul = dagball.aftrans.magnifyY;
					let viewAddY = mouseDy*viewMul;
					let viewAddX = mouseDx*viewMul;
					//dagball.doAsap(()=>{
						dagball.aftrans.addY += viewAddY;
						dagball.aftrans.addX += viewAddX;
						dagball.updateDirectControlsMouse();
					//});
				}
			}
			//if(dagball.controls('zoomView')){
			if(dagball.controls('zoomView') || dagball.controlsChange('mouseWheelY')){
				//FIXME dont hardcode mouseWheelY to this. allow anything to do it such as a joystick dimension

				//TODO merge duplicate code between zoomView and zoomPaintWall

				newMessageToUser += ' zoom view';
				//let mul = Math.max(.5, Math.min(Math.exp(-mouseDy*dagball.speedMouseChangesMagnify), 2));
				let rawInput = -mouseDy*dagball.speedMouseChangesMagnify;
				rawInput += -dagball.controlsChange('mouseWheelY')*dagball.speedMouseWheelYChangesMagnify;
				let mul = Math.max(.5, Math.min(Math.exp(rawInput), 2));
				
				//they're probably the same anyways, cuz "TODO replace paintDonut with paintOval" would be thrown otherwise.
				let oldMagnify = Math.sqrt(dagball.aftrans.magnifyY*dagball.aftrans.magnifyX);
				let newMagnify = oldMagnify*mul;
				newMagnify = Math.max(dagball.minAftransMagnify, Math.min(newMagnify, dagball.maxAftransMagnify));
				let magnifyDiff = newMagnify-oldMagnify;

				let canvasYOfMouseBefore = dagball.aftrans.forwardY(dagball.directControls.mouseY);
				let canvasXOfMouseBefore = dagball.aftrans.forwardX(dagball.directControls.mouseX);

				dagball.aftrans.magnifyY = newMagnify;
				dagball.aftrans.magnifyX = newMagnify;

				let canvasYOfMouseAfter = dagball.aftrans.forwardY(dagball.directControls.mouseY);
				let canvasXOfMouseAfter = dagball.aftrans.forwardX(dagball.directControls.mouseX);
				dagball.aftrans.addY -= canvasYOfMouseAfter-canvasYOfMouseBefore;
				dagball.aftrans.addX -= canvasXOfMouseAfter-canvasXOfMouseBefore;

				//FIXME roundoff could accumulate
				dagball.updateDirectControlsMouse();
			}
			if(dagball.controls('moveViewAroundToPreload')){
				newMessageToUser += ' moveViewAroundToPreload';
			}
			if(dagball.controls('movePaintWall')){
				if(dagball.bitpic){
					newMessageToUser += ' movePaintWall';
					//let mul = dagball.bitpic.aftrans.magnifyY;
					//FIXME scale this, but its using both dagball.aftrans and dagball.bitpic.aftrans
					let mul = 1; //strange, 1 works. maybe i did the combo of the 2 aftrans right?
					dagball.bitpic.aftrans.addY += mouseDy*mul;
					dagball.bitpic.aftrans.addX += mouseDx*mul;
				}else{
					newMessageToUser += mustClickPaintWallsMsg;
				}
			}
			if(dagball.controls('zoomPaintWall')){
				//TODO merge duplicate code between zoomView and zoomPaintWall
				if(dagball.bitpic){
					let mul = Math.max(.5, Math.min(Math.exp(-mouseDy*dagball.speedMouseChangesMagnify), 2));
					
					//they're probably the same anyways, cuz "TODO replace paintDonut with paintOval" would be thrown otherwise.
					let oldMagnify = Math.sqrt(dagball.bitpic.aftrans.magnifyY*dagball.bitpic.aftrans.magnifyX);
					let newMagnify = oldMagnify*mul;
					newMessageToUser += ' zoomPaintWall '+newMagnify;
					dagball.bitpic.aftrans.magnifyY = newMagnify;
					dagball.bitpic.aftrans.magnifyX = newMagnify;
					/*newMagnify = Math.max(dagball.minAftransMagnify, Math.min(newMagnify, dagball.maxAftransMagnify));
					let magnifyDiff = newMagnify-oldMagnify;

					let canvasYOfMouseBefore = dagball.aftrans.forwardY(dagball.directControls.mouseY);
					let canvasXOfMouseBefore = dagball.aftrans.forwardX(dagball.directControls.mouseX);

					dagball.aftrans.magnifyY = newMagnify;
					dagball.aftrans.magnifyX = newMagnify;

					let canvasYOfMouseAfter = dagball.aftrans.forwardY(dagball.directControls.mouseY);
					let canvasXOfMouseAfter = dagball.aftrans.forwardX(dagball.directControls.mouseX);
					dagball.aftrans.addY -= canvasYOfMouseAfter-canvasYOfMouseBefore;
					dagball.aftrans.addX -= canvasXOfMouseAfter-canvasXOfMouseBefore;
					*/
				}else{
					newMessageToUser += mustClickPaintWallsMsg;
				}
			}
			if(dagball.controls('resizePaintWallBrush')){
				//2023-12-30
				//paintbrushRadiusForBitpic: .15, //FIXME, is this in game coordinates (where 1.0 is about 80 pixels) or bitpic pixel coordinates, or what?
				//min_paintbrushRadiusForBitpic: .01,
				//max_paintbrushRadiusForBitpic: 30,
				let mul = Math.max(.5, Math.min(Math.exp(-mouseDy*dagball.speedMouseChangesMagnify), 2));
				dagball.paintbrushRadiusForBitpic =
					Math.max(dagball.min_paintbrushRadiusForBitpic, Math.min(dagball.paintbrushRadiusForBitpic*mul, dagball.max_paintbrushRadiusForBitpic));
				newMessageToUser += ' resizePaintWallBrush '+dagball.paintbrushRadiusForBitpic;
			}
			if(dagball.controls('deleteCircle')){
				newMessageToUser += ' delete circle';
			}
			if(dagball.controls('createCircle')){
				newMessageToUser += ' create circle\nIf select-lock on a circ, copies it, else a blank circ.';
			}

			if(dagball.controlsChange('deleteCircle') == 1){
				let setOfCircsToDelete = new Set(dagball.circles.filter(c=>c.isSelected));
				dagball.doAsap(()=>{
					//dagball.circles = dagball.circles.filter(c=>!c.isSelected);
					console.log('starting scheduled deleteCircles: '+setOfCircsToDelete);
					dagball.circles = dagball.circles.filter(c=>!setOfCircsToDelete.has(c));
					console.log('deleting dagball.view cuz deleted circ. It will be auto created in nextState.');
					dagball.view = null;
				});
			}
			if(dagball.controlsChange('createCircle') == 1){ //the button was just pushed
				//let prototypeCircOrNull = dagball.selectedCircs()[0] || dagball.circles[dagball.circles.length-1] || null; //selected circ, else last circ created, else null.
				let prototypeCircOrNull = dagball.selectLockA ? dagball.selectedCircs()[0] : null; //selected circ (only if selectLock, so not just mouse over) else null.
				let newCirc;
				if(prototypeCircOrNull){
					newCirc = prototypeCircOrNull.copy(); //WARNING: same .mutid is not allowed so must change it. also old .id is still there, to be replaced with .mutid?
					//let newId = dagball.nextId
					newCirc.id = newCirc.mutid = null; //FIXME?
					newCirc.isSelected = false;
					newCirc.y = mouseY;
					newCirc.x = mouseX;
					let dy = mouseY-prototypeCircOrNull.y;
					let dx = mouseX-prototypeCircOrNull.x;
					for(let ed of newCirc.edsOut){
						ed.y += dy;
						ed.x += dx;
					}
				}else{
					newCirc = new dagball.Circ('swarm', 0, 0, 0,   mouseY, mouseX,   .14,  120, 120, 80, false, 'javascript:\n//TODO\n', [], [])
				}
				dagball.circles.push(newCirc);
			}
			if(dagball.controls('resizeCircle')){
				newMessageToUser += ' resize circle by moving mouse to/from its center';
				for(let circ of dagball.selectedCircs()){
					let circleToMouseY = mouseY-circ.y;
					let circleToMouseX = mouseX-circ.x;
					let len = Math.hypot(circleToMouseY, circleToMouseX);
					if(len){
						let normedCircleToMouseY = circleToMouseY/len;
						let normedCircleToMouseX = circleToMouseX/len;
						//let mouseDLen = Math.hypot(mouseDy,mouseDx);
						//let normedMouseDy = mouseDy/mouseDLen;
						//let normedMouseDx = mouseDx/mouseDLen;
						//if(mouseDLen){
							//let cosineDistance = normedCircleToMouseY*normedMouseDy + normedCircleToMouseX*normedMouseDx;
							let dotProd = normedCircleToMouseY*mouseDy + normedCircleToMouseX*mouseDx;
							circ.r += dotProd;
						//}
					}
				}
			}
			let isEditingColor = false;
			if(dagball.controls('bright')){
				newMessageToUser += ' bright';
				for(let circ of dagball.selectedCircs()){
					//let mul = Math.exp(mouseDy*.1);
					let mul = Math.exp(mouseDy*-.4);
					circ.red = Math.max(0, Math.min(circ.red*mul, 255));
					circ.green = Math.max(0, Math.min(circ.green*mul, 255));
					circ.blue = Math.max(0, Math.min(circ.blue*mul, 255));
				}
				isEditingColor = true;
			}else{
				let isRed = false;
				let isGreen = false;
				let isBlue = false;
				if(dagball.controls('red')){
					isRed = true;
					for(let circ of dagball.selectedCircs()){
						let prevRed = circ.red;
						circ.red = Math.max(0, Math.min(prevRed+mouseDy*-100, 255));
						console.log('Changed circ.red from '+prevRed+' to '+circ.red+' cuz mouseDy='+mouseDy+' circ='+circ);
					}
					isEditingColor = true;
				}
				if(dagball.controls('green')){
					isGreen = true;
					for(let circ of dagball.selectedCircs()){
						let prevGreen = circ.green;
						circ.green = Math.max(0, Math.min(prevGreen+mouseDy*-100, 255));
						console.log('Changed circ.green from '+prevGreen+' to '+circ.green+' cuz mouseDy='+mouseDy+' circ='+circ);
					}
					isEditingColor = true;
				}
				if(dagball.controls('blue')){
					isBlue = true;
					for(let circ of dagball.selectedCircs()){
						let prevBlue = circ.blue;
						circ.blue = Math.max(0, Math.min(prevBlue+mouseDy*-100, 255));
						console.log('Changed circ.blue from '+prevBlue+' to '+circ.blue+' cuz mouseDy='+mouseDy+' circ='+circ);
					}
					isEditingColor = true;
				}
				if(isRed){
					if(isGreen){
						if(isBlue) newMessageToUser += ' white';
						else newMessageToUser += ' yellow';
					}else{ //not green
						if(isBlue) newMessageToUser += ' purple';
						else newMessageToUser += ' red';
					}
				}else{ //not red
					if(isGreen){
						if(isBlue) newMessageToUser += ' cyan/greenblue';
						else newMessageToUser += ' green';
					}else{ //not green
						if(isBlue) newMessageToUser += ' blue';
						//else do nothing / black.
					}
				}
			}
			if(dagball.controls('copy')){
				newMessageToUser += ' copy';
			}
			if(dagball.controlsChange('copy') == 1){
				/*dagball.doOnNextEvent(()=>{ //wait for clipboard permission which comes with UI events
					let jsonOfSelectedStuff = dagball.jsonToCopy();
					navigator.clipboard.writeText(jsonOfSelectedStuff); //async
				});
				jsonToCopy ret=[{"id":"sCirc989051182553607687","pv":{"pi":1,"vi":0,"px":1.0525836294715127,"vx":0,"py":0.3736371258490971,"vy":0,"pr":1.2,"vr":0}}] 2 singleHeightmapCpuDiffeq.js';:1395:11
				NOT doUpdateView singleHeightmapCpuDiffeq.js';:14415:12
				Uncaught (in promise) DOMException: Clipboard write is not allowed. 
				*/
				let jsonOfSelectedStuff = dagball.jsonToCopy();
				dagball.doOnNextEvent(()=>{ //async
					navigator.clipboard.writeText(jsonOfSelectedStuff); //async
				});

			}
			if(dagball.controls('paste')){
				newMessageToUser += ' paste';
			}
			if(dagball.controlsChange('paste') == 1){
				dagball.doOnNextEvent(()=>{ //wait for clipboard permission which comes with UI events
					navigator.clipboard.readText().then(text=>{ //async
						dagball.pasteJson(text);
					});
				});
			}
			if(dagball.controls('doApDotJsTests')){
				newMessageToUser += ' doApDotJsTests, see browser console';
			}
			if(dagball.controlsChange('doApDotJsTests') == -1){
				console.log('START: doApDotJsTests');
				Ap.doApeTests();
				TinyGlsl.clearAllCache();
				console.log('END: doApDotJsTests');
			}
			if(dagball.controls('toggleBallLockPos')){
				newMessageToUser += ' toggleBallLockPos of '+selectedBalls.length+' balls';
			}
			if(dagball.controls('createCurbGrab')){
				newMessageToUser += ' createCurbGrab';
			}
			if(dagball.controls('curveGrabLow')){
				newMessageToUser += ' curveGrabLow';
				selectedBalls.forEach(b=>{
					if(!b.curveGrab) b.createCurveGrab();
					b.curveGrab[0] += -mouseDy*dagball.speedMouseChangeCurveGrabLowAndHigh;
					b.curveGrab[0] = Math.max(0, b.curveGrab[0]);
					newMessageToUser += ' '+b.curveGrab[0];
				});
			}
			if(dagball.controls('curveGrabMid')){
				newMessageToUser += ' curveGrabMid';
				selectedBalls.forEach(b=>{
					if(!b.curveGrab) b.createCurveGrab();
					b.curveGrab[1] += -mouseDy*dagball.speedMouseChangeCurveGrabMid;
					newMessageToUser += ' '+b.curveGrab[1];
				});
			}
			if(dagball.controls('curveGrabHigh')){
				newMessageToUser += ' curveGrabHigh';
				selectedBalls.forEach(b=>{
					if(!b.curveGrab) b.createCurveGrab();
					b.curveGrab[2] += -mouseDy*dagball.speedMouseChangeCurveGrabLowAndHigh;
					b.curveGrab[2] = Math.max(0, b.curveGrab[2]);
					newMessageToUser += ' '+b.curveGrab[2];
				});
			}
			if(dagball.controlsChange('toggleBallLockPos')==-1){
				selectedBalls.forEach(b=>{
					b.lockPos = !b.lockPos;
				});
			}
			if(dagball.controls('changeBallType')){
				newMessageToUser += ' changeBallType';
			}
			if(dagball.controlsChange('changeBallType')==-1) dagball.doAsap(()=>{
				selectedBalls.forEach(b=>b.changeBallType());
			});
			if(isEditingColor) newMessageToUser += ' move mouse up/down to change color';
			let sels = dagball.selectedCircs();
			let mainEditTextarea = document.getElementById('mainEditTextarea');
			if(sels.length == 1){
				let circ = sels[0];
				mainEditTextarea.value = circ.text;
			}
			if(dagball.controls('selectLockAOn')){
				newMessageToUser += ' selectLockA circle';
			}
			if(dagball.controls('selectLockAOff')){
				newMessageToUser += ' and free select circles';
			}
			/*if(dagball.controls('selectLockA')){
				newMessageToUser += ' toggle selectLockA';
			}*/
			if(dagball.controls('selectLockB')){
				newMessageToUser += ' toggle selectLockB';
			}
			if(dagball.controlsChange('moveViewAroundToPreload')==1){
				dagball.moveViewAroundToPreload();
			}
			if(dagball.controls('editCircleText')){
				//newMessageToUser = 'Keep holding button and move mouse\n<-- to text area if you want to use it there.\nOtherwise use keyboard only in textarea\ncuz moving mouse selects circle.';
				newMessageToUser = 'Edit text of this circle.\nClick again to stop editing.';
			}
			if(dagball.controlsChange('editCircleText') == 1){ //when button goes down, swap between text vs circles mode.
				dagball.setIsTextEditing(true);
				//if(dagball.setIsTextEditing(!dagball.isTextEditing()));
			}
			if(dagball.controls('togglePause')){
				newMessageToUser += ' togglePause (FIXME cant unpause from keyboard button cuz its paused so isnt checking events anymore, until you uncheck the box with mouse)';
			}
			if(dagball.controlsChange('togglePause') == 1){
				document.getElementById('pauseDagball').click();
			}
			if(dagball.controlsChange(dagball.actionControls.toggleMenu) == 1){
				
				//when button goes down, toggle the menu/showLeftControls checkbox at top left of screen, which shows/hides bunch of checkboxes, buttons,
				//and a big editable textarea on left side of screen.
				//document.getElementById('showLeftControls').click();

				//2024-6-2 changing this to 3 states instead of 2: nothing on left, textarea only on left, textarea and top stuff on left. also var= displays when it shouldnt when menu is off.

				let showLeftControls = dagball.chk('showLeftControls');
				let showLeftTopControls = dagball.chk('showLeftTopControls');
				if(showLeftControls){
					if(showLeftTopControls){ //is "textarea and top stuff on left". change to "textarea only on left".
						document.getElementById('showLeftTopControls').click(); //become false
					}else{ //is "textarea only on left". Change to "nothing on left".
						document.getElementById('showLeftControls').click(); //become false
					}
				}else{ //is "nothing on left". change to "textarea and top stuff on left".
					if(!showLeftTopControls){
						document.getElementById('showLeftTopControls').click(); //become true
					}
					document.getElementById('showLeftControls').click(); //become true
					dagball.chk('showLeftControls', true);
				}
			}
			/*if(dagball.controlsChange('editCircleText') == -1){ //when release key. while holding it, will prevent selecting, so can move mouse over there if u want.
				//Already editing it, but focus the textarea if push a so dont have to move the mouse over to it which could select a different circ along the way.
				//FIXME if want to select text with mouse, thats hard to get mouse there if moving mouse selects any circ it touches
				mainEditTextarea.focus();
			}*/
			/*//do ALWAYS if exactly 1 is selected: if(dagball.controlsChange('editCircleText') == 1){
				let sels = dagball.selectedCircs();
				/*if(sels.length > 1){
					alert('Cant editCircleText of more than 1 selected circle.');
				}else* if(sels.length == 1){
					let circ = sels[0];
					let mainEditTextarea = document.getElementById('mainEditTextarea');
					mainEditTextarea.value = circ.text;
					mainEditTextarea.focus();
				}
			//}*/
			//console.log('mouseDy='+mouseDy);
		}
		newMessageToUser += dagball.suffixMessageToUser();
		newMessageToUser = newMessageToUser.trim();
		dagball.messageToUser = newMessageToUser;
	},
	minOf2: (a,b)=>Math.min(a,b), //cuz array.reduce doesnt work with vararg reducer.
	maxOf2: (a,b)=>Math.max(a,b),

	//truncates into canvas range, even if off screen
	gameYToCanvasY: gameY=>{
		let canvasY = dagball.aftrans.forwardY(gameY);
		return Math.max(0, Math.min(Math.floor(canvasY), dagball.canvasHeight()-1));
	},
	gameXToCanvasX: gameX=>{
		let canvasX = dagball.aftrans.forwardX(gameX);
		return Math.max(0, Math.min(Math.floor(canvasX), dagball.canvasWidth()-1));
	},

	gameYXToCanvasIndex: (gameY,gameX)=>(dagball.gameYToCanvasY(gameY)*dagball.canvasWidth()+dagball.gameXToCanvasX(gameX)),

	gameYXToPotenFromLastDisplay: (gameY,gameX)=>
		(dagball.last_potentialEnergiesForDisplay ? dagball.last_potentialEnergiesForDisplay[dagball.gameYXToCanvasIndex(gameY,gameX)] : 0),

	formatNumberForFastReading: x=>{
		let s = ''+x;
		if(!s.startsWith('-')) s = '+'+s;
		return s;
	},

	//display these at top left of screen, evaled again each video frame.
	//If lines are long, they go to right side of screen and wrap.
	//The keys in this {} appear in the text.
	displayLogs: {
		//countNextState: ()=>(''+dagball.game.countNextState),
		//FPS: ()=>((57 < dagball.estimateFPS && dagball.estimateFPS < 63) ? 'around 60 where it should be' : Math.round(dagball.estimateFPS)),
		a_selectedBallsCurvegrabs: ()=>dagball.selectedBalls().map(x=>x.curveGrab).filter(x=>!!x).join(', '),
		a_groundHeightAtMouse: ()=>dagball.formatNumberForFastReading(dagball.gameYXToPotenFromLastDisplay(dagball.controls('mouseY'), dagball.controls('mouseX'))),
		//FPS: ()=>Math.round(dagball.estimateFPS),
		/*circ0And1Edgroup0Relys: ()=>{
			/*
			This is used 2023-11-24 with 2 circs of the same Ap.Ape code to mouse drag (hold a keyboard button) their 10 ed lines each
			onto eachother to reduce the 20 EdJoints of 1 ed each to 10 EdJoints of 2 eds each,
			but not all the eds are ending at the same positions, cuz it drags 10 at a time and its complicated by roundToEdSnapGrid
			and pointAtYXR and mouseDx and mouseDy in if(dagball.controls('moveEds')).
			ape: {+
				(abc locparMem (numChainLinks 5) (yxSize 2))
				<(sum float) 0>
				<(chainLinkDist float) .2>
				<(chainLinkHoleSize float) .1>
				<(chainLinkHoleSizePowNeg2 float) {f** chainLinkHoleSize -2}>
				{* numChainLinks
					{+
						<(linkY float) [abc numChainLinks 0%2]>
						<(linkX float) [abc numChainLinks 1%2]>
						<(dy float) {f- linkY y$}>
						<(dx float) {f- linkX x$}>
						<(distSq float) {f+ {f* dy dy} {f* dx dx}}>
						<(scaledDistSq float) {f* distSq chainLinkHoleSizePowNeg2}>
						<(holeHeightAtYX float) {f* -1.3 {fexp {f- scaledDistSq}}}>
						{f+= sum holeHeightAtYX}
					}
				}
				<potenCirc$ sum>
			}*
			try{
				let eg0 = dagball.circles[0].edsOut[0].edGroup;
				let eg1 = dagball.circles[1].edsOut[0].edGroup;
				if(eg0.eds.length != eg1.eds.length) return 'the 2 edgroups are diff sizes: '+eg0.eds.length+' and '+eg1.eds.length;
				let ret = '';
				for(let i=0; i<eg0.eds.length; i++){
					let dx0 = eg0.eds[i].x-eg0.eds[0].x;
					let dx1 = eg1.eds[i].x-eg1.eds[0].x;
					ret += ' '+dx0+'['+i+']'+dx1;
				}
				return ret.trim();
			}catch(e){
				return 'err: '+e;
			}
		},*/
		//numEdJoints: ()=>dagball.debug.lastEdJoints.length,
		//gradientAve: ()=>(dagball.game.lastGradientFloats ? Ap.ave(dagball.game.lastGradientFloats) : 'no gradient yet'),
		//gradientStdDev: ()=>(dagball.game.lastGradientFloats ? Ap.stdDev(dagball.game.lastGradientFloats) : 'no gradient yet'),
		//gradient_len: ()=>(dagball.game.lastGradientFloats ? dagball.game.lastGradientFloats.length : 'no gradient yet'),
		//potensAve: ()=>(dagball.debug_lastPotens ? Ap.ave(dagball.debug_lastPotens) : 'no potens yet'),
		//potensStdDev: ()=>(dagball.debug_lastPotens ? Ap.stdDev(dagball.debug_lastPotens) : 'no potens yet'),
		//potens_len: ()=>(dagball.debug_lastPotens ? dagball.debug_lastPotens.length : 'no potens yet'),
		edLinesBell: ()=>{
			let [ave, dev] = Ap.aveDev(dagball.getEds().map(ed=>ed.pos));
			return 'ave_'+ave+' dev_'+dev;
		},
		physicsMemSizes: ()=>{
			//let apCall = dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient;
			let apCall = dagball.get_singleHeightmapPotentialEnergiesForGradient();
			return apCall ? 'par_'+apCall.par.memSize+' loc_'+apCall.loc.memSize+' loc' : 'no Ap.Call yet';
		},
		/*apCallDisplay_parLen: ()=>{
			let apCall = dagball.view.mergedApCalls.singleHeightmapDisplay;
			return apCall ? apCall.par.memSize : 'no Ap.Call yet';
		},
		apCallDisplay_locLen: ()=>{
			let apCall = dagball.view.mergedApCalls.singleHeightmapDisplay;
			return apCall ? apCall.loc.memSize : 'no Ap.Call yet';
		},
		apCallPotens_parLen: ()=>{
			let apCall = dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient;
			return apCall ? apCall.par.memSize : 'no Ap.Call yet';
		},
		apCallPotens_locLen: ()=>{
			let apCall = dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient;
			return apCall ? apCall.loc.memSize : 'no Ap.Call yet';
		},*/
		//lastTimeMouseMove: ()=>dagball.lastTimeMouseMove,
		//simpleMouseYVelocity: ()=>dagball.directControls.simpleMouseYVelocity,
		//time: ()=>dagball.time(),
		GPU_stats: ()=>{
			let c = Object.values(TinyGlsl.caches);
			let numOffScreenCanvases = c.filter(x=>(x instanceof HTMLCanvasElement)).length;
			let numShaders = c.filter(x=>(x instanceof WebGLShader)).length;
			let numThingsInTinyglslCache = c.length;
			return 'offScreenCanvases_'+numOffScreenCanvases+' shaders_'+numShaders+' all_'+numThingsInTinyglslCache;
		},
		GPU_physics_par: ()=>{
			//let potenCall = dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient;
			let potenCall = dagball.get_singleHeightmapPotentialEnergiesForGradient();
			return potenCall.par.summarizeMems()+' par'+potenCall.par.floats.length+' par'+potenCall.par.memSize;
		},
		GPU_physics_loc: ()=>{
			//let potenCall = dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient;
			let potenCall = dagball.get_singleHeightmapPotentialEnergiesForGradient();
			return potenCall.loc.summarizeMems()+' loc'+potenCall.loc.floats.length+' loc'+potenCall.loc.memSize;
		},
		GPU_graphics_par: ()=>{
			let potenCall = dagball.get_singleHeightmapDisplay();
			return potenCall.par.summarizeMems()+' par'+potenCall.par.floats.length+' par'+potenCall.par.memSize;
		},
		GPU_graphics_loc: ()=>{
			let potenCall = dagball.get_singleHeightmapDisplay();
			return potenCall.loc.summarizeMems()+' loc'+potenCall.loc.floats.length+' loc'+potenCall.loc.memSize;
		},
		/*numOffScreenCanvases: ()=>Object.values(TinyGlsl.caches).filter(x=>(x instanceof HTMLCanvasElement)).length,
		numShaders: ()=>Object.values(TinyGlsl.caches).filter(x=>(x instanceof WebGLShader)).length,
		numThingsInTinyglslCache: ()=>Object.values(TinyGlsl.caches).length,
		*/
		//positionLimit: ()=>dagball.positionLimit,
		//positionMin: ()=>dagball.game.pos.reduce(dagball.minOf2),
		//positionMax: ()=>dagball.game.pos.reduce(dagball.maxOf2),
		//document_activeElement: ()=>document.activeElement,
		//isTextEditing: ()=>dagball.isTextEditing(),
		//selectLockA: ()=>dagball.selectLockA,
		//mouse_controls_mouseX: ()=>+dagball.controls('mouseX'),
		//mouse_prevControls_mouseX: ()=>+dagball.prevControls('mouseX'),
		//mouse_controlsChange_mouseX: ()=>+dagball.controlsChange('mouseX'),
		//mouse_controls_mouseY: ()=>+dagball.controls('mouseY'),
		//mouse_prevControls_mouseY: ()=>+dagball.prevControls('mouseY'),
		//mouse_controlsChange_mouseY: ()=>+dagball.controlsChange('mouseY'),
		$controls: ()=>{ //the $ is so its sorted earlier, is closer to top of screen, so it doesnt cover up as much.
			let html = '';
			for(let c of dagball.sortedKeys(dagball.actionControls)){
				let bright = dagball.controls(c)*.8+.2; //controls ranges -1 to 1, but i want it brighter
				let alsoSayWhichButton = !c.toLowerCase().includes('mouse');
				html += '<font color='+dagball.colorStr(bright,bright,bright)+'>'+c+(alsoSayWhichButton ? ('/'+dagball.actionControls[c]) : '')+'</font> ';
			}
			return html;
		},
		aftrans: ()=>(''+dagball.aftrans+' mouseX='+dagball.controls('mouseX')),
		$directControls: ()=>{ //the $ is so its sorted earlier, is closer to top of screen, so it doesnt cover up as much.
			let html = '';
			for(let c of dagball.sortedKeys(dagball.directControls)){
				let bright = dagball.controls(c)*.8+.2; //controls ranges -1 to 1, but i want it brighter
				html += '<font color='+dagball.colorStr(bright*.5,bright*.8,bright)+'>'+c+'</font> ';
			}
			return html;
		},
		$directControlsOut: ()=>{ //the $ is so its sorted earlier, is closer to top of screen, so it doesnt cover up as much.
			let html = '';
			for(let c of dagball.sortedKeys(dagball.directControlsOut)){
				let bright = dagball.directControlsOut[c]; //range 0 to 1 for gamepad rumble, but more generally can be -1 to 1 for other kinds of outputs.
				html += '<font color='+dagball.colorStr(bright*.8,bright*.5,bright)+'>'+c+'</font> ';
			}
			return html;
		},
		//numCircles: ()=>dagball.circles.length,
		dagballObjects: ()=>{
			let numCircles = dagball.circles.length;
			let numEds = dagball.getEds().length;
			let numEdJoints = dagball.debug.lastEdJoints.length;
			let numBalls = dagball.balls.length;
			return 'circs_'+numCircles+' balls_'+numBalls+' eds_'+numEds+' edjoints_'+numEdJoints;
		},
		/*
		aftrans: ()=>(''+dagball.aftrans),
		test2435: ()=>('blah'+Math.random()),
		//todoUseAftransToMergeTheMultipleCoordinateSystemsWhyMouseIsntSelectingCircs: ()=>'TODO',
		circ0y: ()=>(''+dagball.circles[0].y),
		circ0x: ()=>(''+dagball.circles[0].x),
		circ1y: ()=>(''+dagball.circles[1].y),
		circ1x: ()=>(''+dagball.circles[1].x),
		//circ2y: ()=>(''+dagball.circles[2].y),
		//circ2x: ()=>(''+dagball.circles[2].x),
		mouseY: ()=>(''+dagball.directControls('mouseY')),
		mouseX: ()=>(''+dagball.directControls('mouseX')),
		ball0Y: ()=>(''+dagball.game.pos[dagball.game.oBall()]),
		ball0X: ()=>(''+dagball.game.pos[dagball.game.oBall()+1]),
		*/
		mouse: ()=>('y'+dagball.controls('mouseY')+' x'+dagball.controls('mouseX')),
		mouseCanvasCoords: ()=>('y'+dagball.gameYToCanvasY(dagball.controls('mouseY'))+' x'+dagball.gameXToCanvasX(dagball.controls('mouseX'))),
		viewCenter: ()=>('y'+dagball.viewCenterY()+' x'+dagball.viewCenterX()),
	},
	sortedKeys: function(ob){
		let keys = Object.keys(ob);
		keys.sort();
		return keys;
	},
	doDisplayLogs: function(){
		let html = '';
		let onOffSwitch = document.getElementById('varEqLogs');
		if(onOffSwitch.checked){
			let keys = dagball.sortedKeys(dagball.displayLogs);
			for(let key of keys){
				html += '<div>'+key+' = '+dagball.displayLogs[key]()+'</div>';
			}
		}else{
			html = '';
		}
		document.getElementById('displayLogs').innerHTML = html;
		//document.getElementById('displayLogs').innerHTML = 'hello';
	},

	//Use Dags ids.
	//circIdPrefix: 'dagball_circ', //dagball_circ_x_2p34_y_m5_r_20_
	//playerPrefixEd25519PublicKey: 'dagball_player_ed25519_',
	//playerPrefixIfItsJustANameNoPublicKey: 'dagball_player_name_', //dagball.playerPrefix+smallStringWithNoWhitespace is an id. TODO ed25519 name player by publicKey and have them sign their votes and other messages with a time in utc seconds (with fraction) as float64.

	isDisplayCircs: true,

	lastTextareaText: '', //for mainEditTextarea events where textarea replaces its own content if you push ; to compile, but not if you edit a float number like 2.34, etc. TODO

	/*use dagball.handleIf_wasErrorNeedMainLoopRestart() instead.
	simInputEventOnMainTextarea: ()=>{ //for if you break something by typing in the other controls then fix it, need to use dagball.wasErrorNeedMainLoopRestart
		dagball.doAsap(()=>{
			document.getElementById('mainEditTextarea').dispatchEvent(new Event('input'));
		});
	},*/

	onMainTextareaEvent: (textarea,event)=>{
		let eventType = event.type; //'click' etc
		console.log('onMainTextareaEvent type='+eventType+' event='+event);
		if(eventType == 'keydown'){
			dagball.mainEditTextareaOnKeyDown(textarea,event);
		}else if(eventType == 'click'){
			if(dagball.chk('showGlslCodeOfApesInRightTextarea')){
				dagball.updateDebugTextArea();
			}
		}else if(eventType == 'input'){
			if(dagball.chk('showGlslCodeOfApesInRightTextarea')){
				dagball.updateDebugTextArea();
			}
			let text = textarea.value;
			if(text.startsWith('ape:') || text.startsWith('apeV1:')){
				let charThatStartsCompile = ';';
				let waitOnCharToCompile = true;
				let hasChar = text.includes(charThatStartsCompile);
				if(!waitOnCharToCompile || hasChar){
					let newText = waitOnCharToCompile ? text.replaceAll(charThatStartsCompile,'') : text; //remove charThatStartsCompile
					if(text != newText){
						let start = textarea.selectionStart;
						let end = textarea.selectionEnd;
						dagball.setTextareaText(newText, false); //no event. FIXME this will (todo make it not) unselect any text that was selected. does that happen in input event?
						//let newStart = Math.max(0, Math.min(start-1, newText.length)); //FIXME adjust for the removed charThatStartsCompile
						//let move = -1-(text.length-newText.length);
						//dagball.doAsap(()=>{
							let move = -1;
							let newStart = Math.max(0, Math.min(start+move, newText.length)); //FIXME adjust for the removed charThatStartsCompile
							let newEnd = Math.max(newStart, Math.min(end+move, newText.length)); //FIXME adjust for the removed charThatStartsCompile
							textarea.selectionStart = newStart;
							textarea.selectionEnd = newEnd;
						//});
					}
					let doNext = ()=>{
						dagball.selectedCircs().forEach(circ=>{
							//copy textarea text to selected circ's text so in nextState func it will get compiled and the game world start using it
							//circ.text = textarea.value;
							circ.text = newText;
						});
						dagball.handleIf_wasErrorNeedMainLoopRestart();
					}
					let delay = !dagball.wasErrorNeedMainLoopRestart;
					delay ? dagball.doAsap(doNext) : doNext();
				}
			}//else it might start with txt: to write whatever you want without it being viewed as a command, or other prefixes.
		}
		dagball.lastTextareaText = textarea.value; //not used as of 2024-5-11-106pET but planning to use it for workaroundSomeOfTheCompilerLagByPuttingSomeOfTheNumbersInTheCodeIntoParMem TODO.
		//no this didnt do it. dagball.updateTextareaColorsEtc(); //in case of error, this is supposed to change the color of the textarea etc, despite that nextState func doesnt happen until restarted by dagball.mainLoop().
		console.log('event='+event);
	},

	//make tab key type a tab instead of tabbing over to next dom node.
	//TODO tab over all selected lines, and shift+tab less (remove a tab) from all selected lines.
	mainEditTextareaOnKeyDown: (textarea,event)=>{
		if(dagball.chk('textareaEventUpgrades',dagball.default_textareaEventUpgrades)){
			if(event.key == 'Tab'){
				console.log('mainEditTextareaOnKeyDown Tab event='+event);
				event.preventDefault();
				let start = textarea.selectionStart;
				let end = textarea.selectionEnd;
				textarea.value = textarea.value.substring(0, start)+'\t'+textarea.value.substring(end);
				textarea.selectionStart = textarea.selectionEnd = start + 1;
			}
		}
	},

	getTextareaText: ()=>document.getElementById('mainEditTextarea').value,

	setTextareaText: (text, doEvent)=>{
		let dom = document.getElementById('mainEditTextarea');
		dom.value = text;
		if(doEvent){
			//let event = new Event('input', { bubbles: true });
			//dom.dispatchEvent(event);
			dom.dispatchEvent(new Event('input'));
		}
	},
	
	updateDebugTextArea: function(){
		//document.getElementById('debugTextArea').value = dagball.debugTextFor(document.getElementById('mainEditTextarea').value);
		let mainEditTextarea = document.getElementById('mainEditTextarea');
		let debugTextAreaDiv = document.getElementById('debugTextAreaDiv');
		let newText = dagball.debugTextFor(mainEditTextarea.value);
		debugTextAreaDiv.textContent = newText; //use with white-space:pre;tab-size:4 instead of innerHTML
		//debugTextAreaDiv.innerHTML = dagball.escapeTextForDisplayInHtml(newText);
		debugTextAreaDiv.style['background-color'] = mainEditTextarea.style['background-color'];
	},
	game: null, //2023-9-22 dagball.game has become mixed with dagball, so you cant easily run 2 games at once. Do I need running 2 games at once?
	//screen: null, //a ByteRect
	screen: null, //a FullScreenCanvas, containing a ByteRect
	//TODO move to dagball.game, not global here.
	byteRectTrail: null, //same size as dagball.screen.byteRect. Used to turn balls into paintbrushes so can see their path.
	dt: .001,
	defaultBallColorRed_OLD: 111, //old kind of balls, stored in dagball.game.pos
	defaultBallColorGreen_OLD: 179,
	defaultBallColorBlue_OLD: 109,
	defaultBallColorRed: 0, //for new balls as dagball.Ball, not stored in dagball.game.pos
	defaultBallColorGreen: 0,
	defaultBallColorBlue: 255,
	localPlayerBallColorRed: 20,
	localPlayerBallColorGreen: 255,
	localPlayerBallColorBlue: 20,
	nextIdNum: 1,
	nextId: ()=>('u'+(dagball.nextIdNum++)), //start with u for unknown? FIXME [s for swarm. c for const. p for pubkey, ADD d for dim. u for unknown?]
	nextDimId: ()=>{ throw new Error('TODO dagball.Dim ids. Make a fourth letter prefix for dims. [[//FIXME. id should start with the syncType letter [s for swarm. c for const. p for pubkey, ADD d for dim. u for unknown?] BUT since i (what was i gonna write?...).]]'); },
	
	maxGobDistToRunRule: 2, //FIXME
	//maxGobDistToRunRule: 4, //FIXME
	
	//tree is js list of lists of lists... of strings, made by the "game rule"/gameRule code involved with dagball.gobs dagball.fobs etc 2024-2-29+.
	//dagball.parsedRuleToString(["if",["<","manaBp","maxManaBp@1"],["+=","manaBdp",["*","remanaSpeedBp@.1",["-","maxManaBp","manaBp"]]]])
	//returns '(if (< manaBp maxManaBp@1) (+= manaBdp (* remanaSpeedBp@.1 (- maxManaBp manaBp))))';
	parsedRuleToString: tree=>{
		return JSON.stringify(DV.normOb(tree)).replaceAll('"','').replaceAll(',',' ').replaceAll('[','(').replaceAll(']',')');
	},
	
	nextGobIdNum: 1,
	nextGobId: ()=>{ //is a mutid. FIXME
		//s$ means swarmSyncType/mutable.
		//See type$ prefix in DV/Dagverse.js such as g$hello is the string 'hello' and ED$... is an ed25519 pubkey and DV$ is a hash node.
		//return 's$gob$'+(++dagball.nextGobIdNum);
		return 's$'+(++dagball.nextGobIdNum);
	},
	
	nameToDim: {},
	idToDim: {},
	randByte: ()=>dagball.randInt(256),
	randInt: size=>dagball.randIntRange(0,size),
	randIntRange: (fromIncl,toExcl)=>(fromIncl+Math.floor(Math.random()*(toExcl-fromIncl))),
	randInList: list=>list[dagball.randInt(list.length)],
	randRange: (fromIncl,toExcl)=>(fromIncl+Math.random()*(toExcl-fromIncl)),
	sigmoid: x=>(1/(1+Math.exp(-x))),
	mainLoop: function(){
		if(dagball.mainLoopIsRunning){
			Err('mainLoop already running');
		}else{
			try{
				dagball.mainLoopIsRunning = true;
				dagball.dt = .01; //FIXME get from timer, and truncate into range 0 to .2 and hopefully will be at least HDMI speed of 60 FPS (TODO)
				//dagball.game.nextState(dagball.dt, dagball.screen);
				if(!document.getElementById('pauseDagball').checked){
					try{
						dagball.game.nextState(dagball.dt);
					}catch(e){
					//}finally{
						dagball.wasErrorNeedMainLoopRestart = true;
						console.log(dagball.messageToUser = 'dagball.mainLoop stopped cuz error. Edit textarea to start mainLoop again. This will happen thru dagball.wasErrorNeedMainLoopRestart. See line number in generated tinyGlsl GPU code on browser console to know what to fix.');
						dagball.updateTextareaColorsEtc(); //set textarea color to dagball.textareaBgColor_inSync_error
						throw e;
					}
				}
			}finally{
				dagball.mainLoopIsRunning = false;
			}
			requestAnimationFrame(dagball.mainLoop);
		}
	},
	inherit: (subclass,superclass)=>Object.setPrototypeOf(subclass.prototype, superclass.prototype), //(new subclass(...) instanceof superclass) is true
	//replaced by document.getElementById('isDisplayBallText').checked: displayTextOnBalls: true,
	afterAfterPaint: function(){
		//if(dagball.displayTextOnBalls){
		if(document.getElementById('isDisplayBallText').checked){
			let startBall = dagball.game.oBall();
			let endBall = startBall+dagball.game.nBall*dagball.game.mBall; //nBall is how many balls. mBall is floats per ball.
			/*for(let i=startBall; i<endBall; i+=dagball.game.mBall){ //old kind of balls
				let y = dagball.game.pos[i];
				let x = dagball.game.pos[i+1];
				let canvasY = dagball.aftrans.forwardY(y);
				let canvasX = dagball.aftrans.forwardX(x);
				canvasX += 7;
				canvasY += 3;
				dagball.screen.context.fillStyle = '#33ff55';
				let isLastBall = i==endBall-dagball.game.mBall;
				let text = isLastBall ? 'cc_OLD' : 'fn_OLD'; //TODO wikibinator203 lambda id on some balls, and u can call ball on ball to find or create ball.
				dagball.screen.context.fillText(text, canvasX, canvasY);
			}*/
			for(let ball of dagball.balls){ //new kind of balls 2023-11-13+
				let canvasY = dagball.aftrans.forwardY(ball.y);
				let canvasX = dagball.aftrans.forwardX(ball.x);
				canvasX += 7;
				canvasY += 3;
				dagball.screen.context.fillStyle = '#33ff55';
				let isLastBall = ball===dagball.balls[dagball.balls.length-1]; //FIXME sparse use dagball.view.balls instead of dagball.balls?
				//let text = isLastBall ? 'cc' : 'fn'; //TODO wikibinator203 lambda id on some balls, and u can call ball on ball to find or create ball.
				//TODO? let text = isLastBall ? 'cc' : 'fn'; //TODO wikibinator203 lambda id on some balls, and u can call ball on ball to find or create ball.
				text = ball.displayText;
				dagball.screen.context.fillText(text, canvasX, canvasY);
			}
		}
		//Things that use canvas context (dagball.screen.context) to paint screen need to do so after the ByteRect (.bytes is a Uint8Array) paints the canvas.
		//Since i dont have pics of all the fonts and their widths etc, it would be extra work to build that compared to painting text onto canvas with context.fillText.
		if(dagball.messageToUser){
			//this isnt the normal way of painting pixels. supposed to use dagball.screen.byteRect and dagball.screen.width and .height, instead of canvas context,
			//so FIXME is this working? and TODO convert it to byteRect instead so have full control over the pixels again and a simpler single layer.
			//dagball.screen.context.fillStyle = "blue";
			//dagball.screen.context.fillStyle = dagball.colorStr(.7+.1*Math.random(),.7+.1*Math.random(),.7+.1*Math.random());
			let freq = 3;
			let bright = .85+.15*Math.sin(dagball.time()*2*Math.PI*freq);
			dagball.screen.context.fillStyle = dagball.colorStr(bright, bright, bright);
			let canvasY = dagball.aftrans.forwardY(dagball.controls('mouseY'));
			let canvasX = dagball.aftrans.forwardX(dagball.controls('mouseX'));
			//canvasY += 4;
			//canvasX += 8; //a little to the right of mouse, cuz theres 2023-9-24 a small blue ball at mouse
			canvasY -= 17;
			canvasX -= 10;
			for(let line of dagball.messageToUser.split('\n')){
				dagball.screen.context.fillText(line, canvasX, canvasY);
				canvasY += 20;
				canvasX += 20;
			}
			//dagball.screen.context.fillText(dagball.messageToUser, canvasX, canvasY);
		}
		let scheduledFuncs = dagball.scheduleCpuPaint_;
		dagball.scheduleCpuPaint_ = [];
		for(let scheduledFunc of scheduledFuncs){
			scheduledFunc();
		}
	},

	//can be multiline
	paintTextPixYXRGB: function(y, x, red, green, blue, text){
		dagball.screen.context.fillStyle = dagball.colorStr(red, green, blue);
		let yy = y;
		for(let line of text.split('\n')){
			dagball.screen.context.fillText(line, x, yy);
			yy += 20;
		}
	},

	//sets ball names to something simple. if youve loaded balls with long names you might want to do this.
	renameAllBalls: function(){
		let ballNames = 'A B C D E F G H I J K L M N O P Q R S T U V W X Y Z'.split(' ');
		let ballName = i=>{
			return (i<ballNames.length) ? ballNames[i] : ('ball'+i);
		}
		for(let b=0; b<dagball.balls.length; b++){
			let ball = dagball.balls[b];
			//ball.displayText = ballName(b)+(ball.curveGrab ? (' cgm'+ball.curveGrab[1]) : '');
			ball.displayText = ball.curveGrab ? ''+ball.curveGrab[1] : ballName(b);
		}
	},
	removeBall: function(){
		if(dagball.balls.length > 1){
			dagball.balls.pop();
		}else{
			Err('Must be at least 1 ball, cant remove last ball');
		}
	},
	addBall: function(){
		dagball.balls.push(dagball.ball(dagball.nextBallId()));
	},
	nextBallId: function name(params){
		return dagball.syncTypeToChar.swarm+'Ball'+dagball.randInt(1000000000)+dagball.randInt(1000000000);
	},
	boot: function(){
		dagball.timeStarted = dagball.time();
		dagball.age = function(){ //in seconds since this page loaded
			return dagball.time()-dagball.timeStarted;
		};
		/*moving to Ape.js
		console.log('Filling in some data structures.');
		//256 pairs of hex digits
		dagball.doubleHexDigits = [];
		for(let i=0; i<16; i++){
			dagball.mapOfHexDigitToInt[dagball.hexDigits[i]] = i;
			for(let j=0; j<16; j++){
				let hh = dagball.hexDigits[i]+dagball.hexDigits[j];
				dagball.doubleHexDigits.push(hh);
				dagball.mapOfDoubleHexDigitsToInt[hh] = ((i<<4)|j);
			}
		}*/

		console.log('TinyGLSL tests starting before dagball');
		//TinyGlsl.testAfterBoot();
		TinyGlsl.boot();
		console.log('Dagball starting');
		if(!TinyGlsl) throw new Error('No tinyGlsl');

		let nGlo = 0;
		//let nCurve = 40; //FIXME
		let nCurve = 140; //FIXME
		let nBall = 12;
		for(let b=0; b<nBall; b++){
			let ballId = dagball.syncTypeToChar.swarm+'Ball'+b;
			let ball = dagball.ball(ballId);
			dagball.balls.push(ball);
			//ball.displayText = ''+b;
			//ball.displayText = ballName(b);
		}
		dagball.renameAllBalls();
		//let nBall = 100;
		//let nBall = 30;
		//let nBall = 400;
		//let nBall = 3;
		//let mBall = 2;
		let mBall = dagball.isDoubleHeightmap ? 3 : 2; //the third var is ballBal which linear interpolates between 2 heightmaps at a (y,x).
		//FIXME remove balls from dagball.Game state and keep them in dagball.balls and dagball.view.balls.
		dagball.game = new dagball.Game( //dagball.Game = function(nGlo, nCurve, nBall, mBall, tinyGlslCurveCode){
			nGlo, nCurve, nBall, mBall,
				//2024-9-27, this has not been used for years.
				//The first dagball used GLSL directly. Now it generates GLSL or javascript code
				//per game object separately, merges some set of them into a display GPU code and a physics GPU code,
				//not including those run on CPU. Neither of which gets to touch the screen pixels.
				//They hand dagball back Float32Array(up to megabytes)
				//and dagball paints the screen pixels however it wants 1 at a time.
				`//moving o var into built-in code: int o = oCurve;
				float firstY = parr[o++];
				float firstX = parr[o++];
				float firstObservedRadius = length(vec2(firstY,firstX));
				potenOne += .6*firstObservedRadius;
				y += .3*firstY;
				x += .3*firstX;
				float angle = atan(y,x); //of (y,x) from (0,0)
				float observedRadius = length(vec2(x,y)); //of (y,x) from (0,0)
				potenOne -= .6*observedRadius;
				float ditchRadius = 1.;
				//for(int freq=5; freq<6; freq++){
				//for(int freq=1; freq<4; freq++){
				//for(int freq=7; freq<10; freq++){
				//for(int freq=5; freq<9; freq++){
				//for(int freq=5; freq<12; freq+=3){
				//for(int freq=2; freq<8; freq+=3){
				for(int freq=1; freq<10; freq++){
				//for(int freq=1; freq<20; freq++){
					//potenOne += parr[o++]*sin(parr[o++]+freq*angle*parr[o++]);
					//ditchRadius += .07*parr[o++]*sin(parr[o++]+float(freq)*angle*parr[o++]);
					//ditchRadius += .05*parr[o++]*sin(parr[o++]+float(freq)*angle);
					//ditchRadius += .05*parr[o++]*sin(5.*parr[o++]+float(freq)*angle);
					//ditchRadius += 1./(1.+exp(parr[o++]))*sin(5.*parr[o++]+float(freq)*angle);
					ditchRadius += .24*parr[o++]*sin(12.*parr[o++]+float(freq)*angle);
				}
				ditchRadius = 1./(1.+exp(-ditchRadius)); //sigmoid
				ditchRadius *= 1.+.1*sin(5.*parr[o++]);
				ditchRadius *= .6;
				float ditchRadiusStdDev = .04;
				//float ditchRadiusStdDev = .09;
				//float ditchRadiusStdDev = .18;
				//float ditchRadiusStdDev = .3;
				//ditchRadiusStdDev *= 13./(3.5+exp(1.5*parr[o++]));
				float blur = parr[o++];
				blur /= ditchRadius;
				blur *= blur;
				ditchRadiusStdDev *= 1.+blur;
				float blurTarget = .8;
				float blurDiff = blur-blurTarget;
				potenOne += .1*blurDiff*blurDiff;
				float observedStdDev = (observedRadius-ditchRadius)/ditchRadiusStdDev;
				float bellHeight = exp(-observedStdDev*observedStdDev/2.); //range 0 to 1.
				float flippedBellHeight = 1.-bellHeight; //range 0 to 1.
				potenOne += flippedBellHeight;
				potenOne = 0.; //FIXME
				//potenOne *= .2;
				

				//hypercubewave code, experimenting todo...
				int oHypercubeWave = o;
				const int hypercubeDims = 5; //2 dagball dims per hypercubeDim cuz affine transform them into (y,x).
				//const int hypercubeDims = 9; //2 dagball dims per hypercubeDim cuz affine transform them into (y,x).
				for(int hypercubeDim2=0; hypercubeDim2<(hypercubeDims*2); hypercubeDim2++){
					float position = parr[oHypercubeWave+hypercubeDim2];
					//dont let hypercube dims get too far from hypercenter
					potenOne += .01*position*position; //FIXME?
				}
				//const int hypercubeDims = 12; //2 dagball dims per hypercubeDim cuz affine transform them into (y,x).
				const int loopSize = 1<<hypercubeDims;
				const float hypercubewaveStdDevOfCorners = .09;
				//const float hypercubewaveWeight = .25;
				//const float hypercubewaveWeight = .55;
				//const float hypercubewaveWeight = .15;
				//const float hypercubewaveWeight = .265;
				const float hypercubewaveWeight = .2865;
				const float scaleHypercubewaveSize = .1;
				float sumAllCornerBellCurves = 0.;
				for(int corner=0; corner<loopSize; corner++){
					float hyperCornerY = 0.;
					float hyperCornerX = 0.;
					float cornerParity = 1.;
					for(int hypercubeDim=0; hypercubeDim<hypercubeDims; hypercubeDim++){
						float dimParity = float((corner>>hypercubeDim)&1)*2.-1.; //-1 or 1
						cornerParity *= dimParity;
						//float isDimEvenOrOdd = float((corner>>hypercubeDim)&1); //0 or 1
						//float isDimEvenOrOdd = float((corner>>(hypercubeDims-1-hypercubeDim))&1); //0 or 1
						//cornerParity = mod(cornerParity+isDimEvenOrOdd,2.); //TODO optimize
						//float isDimEvenOrOdd = 1.; //FIXME
						//hyperCornerY += isDimEvenOrOdd*parr[oHypercubeWave+hypercubeDim*2];
						//hyperCornerX += isDimEvenOrOdd*parr[oHypercubeWave+hypercubeDim*2+1];
						hyperCornerY += dimParity*parr[oHypercubeWave+hypercubeDim*2];
						hyperCornerX += dimParity*parr[oHypercubeWave+hypercubeDim*2+1];
					}
					hyperCornerY *= scaleHypercubewaveSize;
					hyperCornerX *= scaleHypercubewaveSize;
					float dy = hyperCornerY-y;
					float dx = hyperCornerX-x;
					float distance = length(vec2(dy,dx));
					float distanceAsStdDev = distance/hypercubewaveStdDevOfCorners;
					float bellHeight = exp(-distanceAsStdDev*distanceAsStdDev/2.); //range 0 to 1.
					float parityFlippedBellHeight = bellHeight*cornerParity;
					//potenOne += hypercubewaveWeight*parityFlippedBellHeight;
					//potenOne += -hypercubewaveWeight*bellHeight;
					sumAllCornerBellCurves += hypercubewaveWeight*parityFlippedBellHeight;
				}
				//sumAllCornerBellCurves = abs(sumAllCornerBellCurves); //FIXME how does hypercubewave do it? squared? sqrt? abs?
				//sumAllCornerBellCurves *= sumAllCornerBellCurves; //FIXME how does hypercubewave do it? squared? sqrt? abs?
				potenOne += sumAllCornerBellCurves;

				`
			
			/*
			`
			potenOne += parr[oCurve]*sin(parr[oCurve+1]+angle*parr[oCurve+2]);
			potenOne += parr[oCurve]*sin(parr[oCurve+1]+2*angle*parr[oCurve+2]);
			potenOne += parr[oCurve]*sin(parr[oCurve+1]+3*angle*parr[oCurve+2]);
			potenOne += parr[oCurve]*sin(parr[oCurve+1]+4*angle*parr[oCurve+2]);
			potenOne += parr[oCurve]*sin(parr[oCurve+1]+5*angle*parr[oCurve+2]);
			potenOne += parr[oCurve]*sin(parr[oCurve+1]+6*angle*parr[oCurve+2]);
			potenOne += parr[oCurve]*sin(parr[oCurve+1]+7*angle*parr[oCurve+2]);
			`
			*/
		);

		//FIXME add extra param for flat area between the 2 parabola halfs, like i did in the rule110 convolutional scalar field with such a flat area between 0 and 1
		//simple parabola. TODO flat space between with simpler param
		//dagball.defaultSlidersFunc = dagball.apeFuncJs('{func? {ave float} {strength float} {pos float} (funcReturn (* strength (** (- pos ave) 2)))}');
		//dagball.defaultSlidersFunc = dagball.apeFuncJs('{func? {ave float} {strength float} {pos float} (funcReturn (* 1000 strength (** (- pos ave) 2)))}');
		dagball.defaultSlidersFunc = dagball.cachedApeFuncJs('{func? {ave float} {strength float} {pos float} (funcReturn (* (exp (* 7 strength)) strength (** (- pos ave) 2)))}');

		//dagball.game.displayBallTrails = true;
		dagball.game.displayBallTrails = false;
		dagball.game.randomizePos();
		//dagball.game.randomizeVel();
		dagball.mainLoop();
	},
};

/*Problem started when added ${dagball.ballRadius} to this computed string.
dagverse/:768 Uncaught ReferenceError: Cannot access 'dagball' before initialization
so moving this to outside the dagball {}.
*/
dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap =
`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
	{f* 8.05 {f** {f/ {fmax 0 {f- ${dagball.ballRadius} pairBallDist}} ${dagball.ballRadius}} 2}}
)`;


/* This is what the 'learn' keyboard button (see "controls" vars, dagball.controls or directControls or something)
trains it on, by contrastive-divergence smoothly (no dropout).
This is a tuneable vector param tha can be attached to any dagball.Circ (circle) instance,
but I normally go with just the EdKnobs or EdSliderKnobs or what were t hey called (todo fix this text).

//a view of a RbmLayer (or possibly other kinds of neuralnet later) thats scaled etc to match ranges of ed.pos
//and doesnt require you know the details of the RbmLayer it wraps. This is for learning
dagball.RbmLayerBridge = function(){};
this.add+this.mul*visibleNode == ed.pos, approximately as it learns and predicts, aligning them that way.
visibleNode ranges 0 to 1. ed.pos ranges plusMinus dagball.positionLimit but normally stays within about plus/minus 2.
*/
dagball.RbmCircBridge = function(rbmLayer, circ, optionalStrength, optionalAdd, optionalMul){
	if(rbmLayer.nVisible-1 != circ.edsOut.length){
		Err('rbmLayer.nVisible-1='+rbmLayer.nVisible-1+' (excluding [0]==1 used as bias) != circ.edsOut.length='+circ.edsOut.length);
	}
	this.rbmLayer = rbmLayer;
	this.circ = circ;
	this.add = optionalAdd===undefined ? -2 : optionalAdd; //default range is plus/minus 2
	this.mul = optionalMul===undefined ? 4 : optionalMul; //default range is plus/minus 2
	this.strength = optionalStrength===undefined ? 1 : optionalStrength; //default strength is 1. FIXME should that be right?
};
dagball.RbmCircBridge.prototype.type = 'dagball_rbmCircBridge';

//gets visibleNodes from circ.edsOut, slid over by 1 since [0]==1 is bias.
dagball.RbmCircBridge.prototype.getVisible = function(){
	let visible = new Float32Array(this.rbmLayer.nVisible);
	if(visible.length-1 != this.circ.edsOut.length){
		Err('visible.length-1='+visible.length-1+' (excluding [0]==1 used as bias) != circ.edsOut.length='+this.circ.edsOut.length);
	}
	visible[0] = 1; //bias
	for(let i=0; i<this.circ.edsOut.length; i++){
		let edNum = this.circ.edsOut[i].pos;
		visible[i+1] = (edNum-this.add)/this.mul;
	}
	//return this.rbmLayer.forward(visible);
	return visible;
};

//whatever the ed.pos's are right now, learn (or unlearn if negative learnRate) that,
//so its lower energy and the curvy game world tends to do that more (or less if negative) often.
dagball.RbmCircBridge.prototype.learn = function(learnRate, optionalNumForwards){
	this.rbmLayer.learn(this.getVisible(), learnRate, optionalNumForwards);
};

//potentialEnergy that the dagball high dimensional manifold rolls balls on. This is computed in CPU similar to doDiffEq.
dagball.RbmCircBridge.prototype.energy = function(optionalVisible){
	let visible = optionalVisible || this.getVisible();
	return this.rbmLayer.predictionDistance(visible,dagball.defaultRbmNumForwards)*this.strength;
	//return this.rbmLayer.boltzEnergy(visible)*this.strength;
};

//returns a Float32Array(this.circ.edsOut.length), the gradient of this.energy(this.circ.edsOut.length+1) times.
//this.gradient()[i] is gradient of this.circ.edsOut[i-1].pos. [0] should be ignored.
dagball.RbmCircBridge.prototype.gradient = function(optionalVisible){
	let visible = optionalVisible || this.getVisible();
	let gradient = new Float32Array(visible.length);
	if(visible.length-1 != this.circ.edsOut.length){
		Err('visible.length-1='+visible.length-1+' (excluding [0]==1 used as bias) != circ.edsOut.length='+this.circ.edsOut.length);
	}
	let epsilon = dagball.game.floatEpsilon;
	let neutralEnergy = this.energy(visible);
	//for(let i=0; i<visible.length; i++){ //calculus
	//Ignore [0] since its value is always 1 so gradient should be 0, even though its not technically.
	//TODO maybe make this.rbmLayer.weight[0] be very big so the 2 [0]s keep eachother as 1 by using eachother as bias with such a big weight.
	for(let i=1; i<visible.length; i++){ //calculus.
		let prev = visible[i];
		visible[i] += epsilon;
		let energyAtPlusEpsilon = this.energy(visible);
		gradient[i] = (energyAtPlusEpsilon-neutralEnergy)/epsilon;
		visible[i] = prev;
	}
	return gradient;
};

//This should be called early in the other doPhysics function, before it reads ed.gradient.
//Adds to ed.gradient, which the other doPhysics func reads to choose how to update ed.pos ed.vel etc.
//Update gradient fields in eds in this.circ based on RbmLayer predicting the ed.pos's,
//trying to make them become things its been trained on and not become things its been trained against.
dagball.RbmCircBridge.prototype.doPhysics = function(){
	let gradient = this.gradient();
	for(let e=0; e<this.circ.edsOut.length; e++){
		let ed = this.circ.edsOut[e];
		ed.gradient += gradient[1+e];
	}
};

dagball.RbmCircBridge.prototype.toMap = function(){
	return {
		type: this.type,
		rbmLayer: this.rbmLayer.toMap(),
		circMutid: this.circ.Mutid(),
		add: this.add,
		mul: this.mul,
		strength: this.strength,
	};
};

//Uses optionalCirc if exists and optionalCirc.mutid==map.circMutid.
dagball.mapToRbmCircBridge = function(map, optionalCirc){
	if(!map || !map.rbmLayer || !map.circMutid || !map.add || !map.mul || !map.strength){
		Err('Some stuff missing: '+JSON.stringify(map));
	}
	if(map.type != 'dagball_rbmCircBridge'){
		Err('Not a dagball_rbmCircBridge: '+JSON.stringify(map));
	}
	let circ = (optionalCirc && optionalCirc.mutid==map.circMutid) ? optionalCirc :
		(dagball.searchCircs(circ=>(circ.mutid==map.circMutid))[0]||null);
	return new dagball.RbmCircBridge(dagball.mapToRbmLayer(map.rbmLayer), circ, map.strength, map.add, map.mul);
};

//1 edge layer and 2 node layers of a RBM neuralnet, that connects to ed.pos (after scaling etc) when used in a circ.
//The RBM weights dont go in ed.pos, dont go in GPU, as this is for very small neuralnets.
//weights.length==(nVisible+1)*nHidden. The +1 is for bias, as if its a node whose value is always 1.
//FIXME just put the 1 in there literally always so its nVisible*nHidden. Index 0 is always value 1.
//This is smooth numbers, not weightedCoinFlip/bernoulli.
//TODO merge this with dagball.DenseTensor (which hasnt been used as of 2024-2-6).
dagball.RbmLayer = function(nVisible, nHidden, optionalWeights){
	//let correctWeightsSize = (nVisible+1)*nHidden;
	let correctWeightsSize = nVisible*nHidden;
	let weights = optionalWeights || new Float32Array(correctWeightsSize);
	if(weights.length != correctWeightsSize){
		Err('weights.length='+weights.length+' but should be '+(nVisible+1)+'*'+nHidden+'='+correctWeightsSize);
	}
	this.nVisible = nVisible; //includes this.weights[0]==1 for bias.
	//this.nnVisible = nVisible+1; //the +1 is for bias.
	this.nHidden = nHidden;
	this.weights = weights;
};
dagball.RbmLayer.prototype.type = 'dagball_rbmLayer';
dagball.RbmLayer.prototype.toMap = function(){
	return {
		type: this.type,
		nVisible: this.nVisible,
		nHidden: this.nHidden,
		//weights: dagball.floatsToBase64(this.weights),
		weights: [...(this.weights)],
	};
};
dagball.mapToRbmLayer = function(map){
	if(!map || !map.nVisible || !map.nHidden || !map.weights){
		Err('Some stuff missing: '+JSON.stringify(map));
	}
	if(map.type != 'dagball_rbmLayer'){
		Err('Not a dagball_rbmLayer: '+JSON.stringify(map));
	}
	return new dagball.RbmLayer(
		map.nVisible,
		map.nHidden,
		Float32Array.from(map.weights), //dagball.base64ToFloats(map.weights)
	);
};
dagball.RbmLayer.prototype.forward = function(visible){
	if(visible[0] != 1) Err('visible[0]='+visible[0]+' must be 1 cuz its used as bias of hiddenNodes.');
	let hidden = new Float32Array(this.nHidden);
	for(let h=0; h<this.nHidden; h++){
		let sum = 0;
		for(let v=0; v<this.nVisible; v++){
			sum += this.weights[v*this.nHidden+h]*visible[v];
		}
		hidden[h] = dagball.sigmoid(sum);
	}
	hidden[0] = 1; //multiply bias by 1
	/*for(let h=0; h<this.nHidden; h++){
		let sum = 0;
		for(let v=0; v<this.nVisible; v++){
			sum += this.weights[h*(this.nVisible+1)+v]*visible[v];
		}
		sum += this.weights[h*(this.nVisible+1)+this.nVisible]; //bias
		hidden[h] = dagball.sigmoid(sum);
	}*/
	return hidden;
};
dagball.RbmLayer.prototype.backward = function(hidden){
	if(hidden[0] != 1) Err('hidden[0]='+visible[0]+' must be 1 cuz its used as bias of visibleNodes.');
	let visible = new Float32Array(this.nVisible);
	for(let v=0; v<this.nVisible; v++){
		let sum = 0;
		for(let h=0; h<this.nHidden; h++){
			sum += this.weights[v*this.nHidden+h]*hidden[h];
		}
		visible[v] = dagball.sigmoid(sum);
	}
	visible[0] = 1; //multiply bias by 1
	/*for(let v=0; v<this.nVisible; v++){
		let sum = 0;
		for(let h=0; h<this.nHidden; h++){
			sum += this.weights[h*(this.nVisible+1)+v]*hidden[h];
		}
		visible[v] = dagball.sigmoid(sum);
	}*/
	return visible;
};

dagball.RbmLayer.prototype.array2dToString = function(){
	let s = '';
	let i = 0;
	for(let h=0; h<this.nHidden; h++){ //v then h would be same order as in this.weights, but for display i want short lines and more of them
		if(h) s += '\n';
		for(let v=0; v<this.nVisible; v++){
			//s += this.weights[v*this.nHidden+h].toFixed(2)+' ';
			if(v) s += '\t'; //FIXME might cross multiple tabs if alot of digits, making columns hard to read
			s += this.weights[v*this.nHidden+h];
		}
	}
	return s;
};

dagball.padSpaces = function(anythingToString, charsLong){
	let s = ''+anythingToString;
	if(s.length > charsLong-1) s = s.substring(0,charsLong-3)+'..';
	while(s.length < charsLong) s += ' ';
	return s;
};

dagball.RbmLayer.prototype.array2dToStringWithVisibleAndHidden = function(visible, hidden){
	let s = '';
	let columnSize = 22; //TODO display less digits and shrink this? What about if they get bigger by scientific notation 2e-3 etc?
	for(let v=0; v<this.nVisible; v++){
		s += dagball.padSpaces(visible[v],columnSize);
	}
	s += dagball.padSpaces('V/H'); //s += '\tV/H\n';
	for(let h=0; h<this.nHidden; h++){ //v then h would be same order as in this.weights, but for display i want short lines and more of them
		s += '\n';
		//if(h) s += '\n';
		for(let v=0; v<this.nVisible; v++){
			//s += this.weights[v*this.nHidden+h].toFixed(2)+' ';
			//if(v) s += '\t'; //FIXME might cross multiple tabs if alot of digits, making columns hard to read
			//s += this.weights[v*this.nHidden+h];
			s += dagball.padSpaces(this.weights[v*this.nHidden+h],columnSize);
		}
		//s += '\t['+hidden[h]+']';
		s += dagball.padSpaces(hidden[h],columnSize);
	}
	return s;
};


dagball.vecDist = function(vecA, vecB){
	if(vecA.length != vecB.length){
		Err('vecA.length='+vecA.length+' != vecB.length='+vecB.length);
	}
	let sum = 0;
	for(let i=0; i<vecA.length; i++){
		let diff = vecA[i]-vecB[i];
		sum += diff*diff;
	}
	return Math.sqrt(sum);
};
//distance between visible (param here) and the prediction of visible (RBM is autoassociative).
dagball.RbmLayer.prototype.predictionDistance = function(visible, optionalNumForwards){
	let prediction = this.predict(visible, optionalNumForwards);
	return dagball.vecDist(visible, prediction);
};
dagball.RbmLayer.prototype.boltzEnergy = function(visible, optionalHidden){
	let en = 0;
	let hidden = optionalHidden || this.forward(visible);
	for(let v=0; v<this.nVisible; v++){
		for(let h=0; h<this.nHidden; h++){
			en += this.weights[v*this.nHidden+h]*visible[v]*hidden[h];
		}
	}
	return en;
};
//dagball.RbmLayer.prototype.boltzProb = function(visible, optionalHidden){
//	return Math.exp(-this.boltzEnergy(visible, optionalHidden));
//};

//LearnRate can be positive to learn or negative to unlearn, but unlearning tends to explode/vanish gradient.
//optionalDepth is 2 by default (forward, backward, forward)
//but can be higher to make it tend to converge more (forward, backward, forward, backward, forward...).
//It learns from the first forward (the training data itself and the immediate hidden nodes from it),
//and unlearns from the last forward backward (what it imagines about that visible training data).
//Thats contrastiveDivergence.
dagball.RbmLayer.prototype.learn = function(visible, learnRate, optionalNumForwards){
	if(visible.length == this.nVisible-1){ //[0] is 1 for bias
		visible = new Float32Array([1].concat(visible));
	}
	let numForwards =  Math.max(2, optionalNumForwards || 2);
	let firstHidden = this.forward(visible);
	let lastVisible = visible;
	let lastHidden = firstHidden;
	for(let f=1; f<numForwards; f++){
		lastVisible = this.backward(lastHidden);
		lastHidden = this.forward(lastVisible);
	}
	this.learnVH(visible, firstHidden, learnRate/2);
	this.learnVH(lastVisible, lastHidden, -learnRate/2);
};

//adjust weights by contrastiveDivergence given any visible and hidden node states.
dagball.RbmLayer.prototype.learnVH = function(visible, hidden, learnRate){
	if(visible[0] != 1) Err('visible[0]='+visible[0]+' must be 1 cuz its used as bias of hiddenNodes.');
	if(hidden[0] != 1) Err('hidden[0]='+visible[0]+' must be 1 cuz its used as bias of visibleNodes.');
	for(let v=0; v<this.nVisible; v++){
		for(let h=0; h<this.nHidden; h++){
			this.weights[v*this.nHidden+h] += visible[v]*hidden[h]*learnRate;
		}
	}
};

dagball.RbmLayer.prototype.predict = function(visible, optionalNumForwards){
	if(visible.length == this.nVisible-1){ //[0] is 1 for bias
		visible = new Float32Array([1].concat(visible));
	}
	let numForwards =  Math.max(1, optionalNumForwards || 1);
	let lastVisible = visible;
	for(let f=0; f<numForwards; f++){
		lastVisible = this.backward(this.forward(lastVisible));
	}
	return lastVisible;
};


/*
dagball.ScalarField = function(){
	Todo();
};
dagball.ScalarField.prototype.type = 'dagball_scalarField';
dagball.ScalarField.prototype.
dagball.ScalarField = function(){
*/

/*
//scalarfield stuff, a kind of math that combines multiple scalarfields into 1, with permutations, database-like-joins, etc.
//Each takes a list of numbers (such as [2,3,4] or a Float32Array) as param
//and returns a number (float64 but can be cast to float32 for use in GPU, TODO).
//Each is a javascript lambda that can be called on such a Float32Array etc, and returns a number (the scalar at that high dimensional position).
//dagball.sf is a place to put functions that generate such scalarfieldLambdas.
//TODO make each such lambdas toString be similar to EdSliderFunc (or what was it called)'s toString that returns the ape code that generated it,
//or something like that, TODO.
dagball.sf = {
	const: function(constant){
		const ret = function(i){
			return constant;
		};
		const C = constant;
		ret.toMap = function(){
			return {type: 'dagball_sfConst', val: C, code: 'TODO_dagball.sf.const something, see comments on dagball.sf'};
		};
		return ret;
	},
	plus: function(sfA, sfB){
		const ret = function(i){
			return sfA(i)+sfB(i);
		};
		ret.toMap = function(){
			return {type: 'dagball_sfPlus', childs: [sfA.toMap(), sfB.toMap()]};
		};
		return ret;
	},
};*/


//UPDATE: 2024-1-1+ changing this.ints to this.bytes to avoid having to deal with endian.
//This is for painting walls that balls bounce and lay on. Circs are an expensive game object.
//You can have alot of 1 bit wall pixels compared to that, such as 4k x 4k of them is 2mB.
//Circs have infinite (actually up to float32 precision) resolution similar to SVG. These walls dont.
//a pic of 1 bit color per pixel. stored in Int32Array. Wall is 1. Open area is 0.
//For physics, this should be used in gradient/potens func and add to potentialEnergy
//right after GPU comnputes potentialEnergy, but this is done by CPU.
//For each ball, sum over near pixels the bellcurve height of the distance between ball center and that pixel,
//or something like that.
dagball.BitPic = function(wallPoten, wallThick, height, width, bytes, aftrans){
	this.wallPoten = wallPoten;
	this.wallThick = wallThick;
	this.height = height;
	this.width = width;
	this.bytes = bytes;
	this.aftrans = aftrans;
};
dagball.BitPic.prototype.type = 'dagball_bitpic';
dagball.BitPic.prototype.toMap = function(){
	return {
		type: this.type,
		wallPoten: this.wallPoten,
		wallThick: this.wallThick,
		height: this.height,
		width: this.width,
		//bytes: dagball.bytesToHex(this.bytes),
		bloomtree: dagball.bytesToBase64(this.toBloomTree().bytes), //deterministic lossless-compressed same bytes as in this.bytes
		aftrans: this.aftrans.toMap(),
	};
};
dagball.mapToBitPic = function(map){
	if(!map || !map.wallPoten || !map.height || !map.width || (!map.bloomtree && !map.bytes && !map.ints) || !map.aftrans){ //2024-1-1 changed from ints to bytes
		Err('Some stuff missing: '+JSON.stringify(map));
	}
	if(map.type != 'dagball_bitpic'){
		Err('Not a dagball_bitpic: '+JSON.stringify(map));
	}
	let bytes;
	let bloomTreePaintsBitPic = false; //in case bloomtree isnt the default (use map.bytes from older code) later
	if(map.bloomtree){
		if(!dagball.isPowOf2(map.height) || map.height != map.width){
			Err('Invalid height and width combo (must be a powOf2 and both equal if bloomtree), h'+map.height+' w'+map.width);
		}
		bytes = new Uint8Array(Math.ceil(map.height*map.width/8)); //start as all 0s, fill in after create BitPic
		bloomTreePaintsBitPic = true;
	}else if(map.bytes || map.ints){
		bytes = dagball.hexToBytes(map.bytes || map.ints);
	}else Err('Does not have bloomtree or bytes (OLD) or ints (OLDEST): '+JSON.stringify(map));
	let bitpic = new dagball.BitPic(
		map.wallPoten,
		map.wallThick || 5,
		map.height,
		map.width,
		bytes, //dagball.hexToBytes(map.bytes || map.ints), //2023-12-31 map.ints existed but then changed it to map.bytes so dont have to deal with endian.
		dagball.mapToSimpleAftrans(map.aftrans)
	);
	if(bloomTreePaintsBitPic){
		let bloomtree = new dagball.BloomTree(dagball.base64ToBytes(map.bloomtree));
		bloomtree.paintOntoBitPic(bitpic);
	}
	return bitpic;
};
dagball.BitPic.prototype.fillRandom = function(){
	for(let i=0; i<this.bytes.length; i++){
		this.bytes[i] = Math.floor(Math.random()*256)&255;
	}
};
/*dagball.BitPic.prototype.readBit = function(index){ //returns 1 or 0. doesnt check bounds.
	return (this.ints[index>>5]>>(index&31))&1; //littleEndian
};
dagball.BitPic.prototype.writeBit = function(index, bit){ //write 1 or 0
	if(bit){
		this.ints[index>>5] |= (1<<(index&31)); //littleEndian
	}else{
		this.ints[index>>5] &= ~(1<<(index&31)); //littleEndian
	}
};*/
dagball.BitPic.prototype.readBit = function(index){ //returns 1 or 0. doesnt check bounds.
	return (this.bytes[index>>3]>>(index&7))&1;
};
dagball.BitPic.prototype.writeBit = function(index, bit){ //write 1 or 0
	if(bit){
		this.bytes[index>>3] |= (1<<(index&7));
	}else{
		this.bytes[index>>3] &= ~(1<<(index&7));
	}
};

/*
//like readYX many times in parallel in a 2d grid. uses 2 aftrans, one as param and one in this bitpic.
dagball.BitPic.prototype.paintOntoPotens = function(addHere, addHereHeight, addHereWidth, secondAftrans){
	//Todo('FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.');
	//FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.
	let i = 0;
	for(let canvasY=0; canvasY<addHereHeight; canvasY++){
		let gameY = secondAftrans.reverseY(canvasY); //in game coordinates, which are about 80 pixels per 1.0 distance in game.
		for(let canvasX=0; canvasX<addHereWidth; canvasX++){
			let gameX = secondAftrans.reverseX(canvasX);
			//let poten = this.readYX(gameY,gameX); //reads either bitpic.wallPoten or 0, or maybe later bilinear interpolation?
			let yy = this.aftrans.reverseY(gameY);
			let xx = this.aftrans.reverseX(gameX);
			yy = Math.floor(yy);
			xx = Math.floor(xx);
			if(yy < 0 || yy >= this.height || xx < 0 || xx >= this.width){
				return 0; //out of range, its 0s there
			}
			let index = yy*this.width+xx;
			let poten = this.readBit(index)*this.wallPoten;
			addHere[i++] += poten;
		}
	}
};
*/
/*
//like readYX many times in parallel in a 2d grid. uses 2 aftrans, one as param and one in this bitpic.
dagball.BitPic.prototype.paintOntoPotens = function(addHere, addHereHeight, addHereWidth, secondAftrans){
	//Todo('FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.');
	//FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.
	let i = 0;
	let poten;
	for(let canvasY=0; canvasY<addHereHeight; canvasY++){
		let gameY = secondAftrans.reverseY(canvasY); //in game coordinates, which are about 80 pixels per 1.0 distance in game.
		for(let canvasX=0; canvasX<addHereWidth; canvasX++){
			let gameX = secondAftrans.reverseX(canvasX);
			//let poten = this.readYX(gameY,gameX); //reads either bitpic.wallPoten or 0, or maybe later bilinear interpolation?
			let yy = this.aftrans.reverseY(gameY);
			let xx = this.aftrans.reverseX(gameX);
			yy = Math.floor(yy);
			xx = Math.floor(xx);
			if(yy < 0 || yy >= this.height || xx < 0 || xx >= this.width){
				//poten = 0; //return 0; //out of range, its 0s there
				i++;
				continue;
			}else{
				let index = yy*this.width+xx;
				let readThisBit = (this.bytes[index>>3]>>(index&7))&1;
				poten = readThisBit*this.wallPoten;
				//poten = this.readBit(index)*this.wallPoten;
				addHere[i++] += poten;
			}
			//addHere[i++] += poten;
		}
	}
};
*/
/*
//like readYX many times in parallel in a 2d grid. uses 2 aftrans, one as param and one in this bitpic.
dagball.BitPic.prototype.paintOntoPotens = function(addHere, addHereHeight, addHereWidth, secondAftrans){
	//Todo('FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.');
	//FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.

	//dagball.SimpleAftrans.prototype.reverseY = function(forwardY){
	//	return (forwardY-this.addY)/this.magnifyY;
	//};

	let i = 0;
	let poten;
	for(let canvasY=0; canvasY<addHereHeight; canvasY++){
		//let gameY = secondAftrans.reverseY(canvasY); //in game coordinates, which are about 80 pixels per 1.0 distance in game.
		let gameY = (canvasY-secondAftrans.addY)/secondAftrans.magnifyY;
		for(let canvasX=0; canvasX<addHereWidth; canvasX++){
			//let gameX = secondAftrans.reverseX(canvasX);
			let gameX = (canvasX-secondAftrans.addX)/secondAftrans.magnifyX;
			//let poten = this.readYX(gameY,gameX); //reads either bitpic.wallPoten or 0, or maybe later bilinear interpolation?
			//let yy = this.aftrans.reverseY(gameY); //FIXME why is it 2 reverses? This looks wrong. Might have done it wrong multiple places to get it right together?
			//let xx = this.aftrans.reverseX(gameX);
			let yy = (gameY-this.aftrans.addY)/this.aftrans.magnifyY;
			let xx = (gameX-this.aftrans.addX)/this.aftrans.magnifyX+30;
			yy = Math.floor(yy);
			xx = Math.floor(xx);
			if(yy < 0 || yy >= this.height || xx < 0 || xx >= this.width){
				//poten = 0; //return 0; //out of range, its 0s there
				i++;
				continue;
			}else{
				let index = yy*this.width+xx;
				let readThisBit = (this.bytes[index>>3]>>(index&7))&1;
				poten = readThisBit*this.wallPoten;
				//poten = this.readBit(index)*this.wallPoten;
				addHere[i++] += poten;
			}
			//addHere[i++] += poten;
		}
	}
};
*/
/*
//like readYX many times in parallel in a 2d grid. uses 2 aftrans, one as param and one in this bitpic.
dagball.BitPic.prototype.paintOntoPotens = function(addHere, addHereHeight, addHereWidth, secondAftrans){
	//Todo('FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.');
	//FIXME starting with the slow way so i have code to refactor and know it works, but FIXME update it to the fast way.

	//dagball.SimpleAftrans.prototype.reverseY = function(forwardY){
	//	return (forwardY-this.addY)/this.magnifyY;
	//};

	let i = 0;
	let poten;
	/*let yy = Math.floor(
		canvasY/(secondAftrans.magnifyY*this.aftrans.magnifyY) -
			secondAftrans.addY/(secondAftrans.magnifyY*this.aftrans.magnifyY) -
			this.aftrans.addY/this.aftrans.magnifyY
	);*
	let addY = -secondAftrans.addY/(secondAftrans.magnifyY*this.aftrans.magnifyY)-this.aftrans.addY/this.aftrans.magnifyY;
	let mulY = 1/(secondAftrans.magnifyY*this.aftrans.magnifyY);
	let addX = -secondAftrans.addX/(secondAftrans.magnifyX*this.aftrans.magnifyX)-this.aftrans.addX/this.aftrans.magnifyX;
	let mulX = 1/(secondAftrans.magnifyX*this.aftrans.magnifyX);
	for(let canvasY=0; canvasY<addHereHeight; canvasY++){
		//let gameY = secondAftrans.reverseY(canvasY); //in game coordinates, which are about 80 pixels per 1.0 distance in game.
		
		//let gameY = (canvasY-secondAftrans.addY)/secondAftrans.magnifyY;
		//let yy = (gameY-this.aftrans.addY)/this.aftrans.magnifyY;
		//yy = Math.floor(yy);
		
		//let yy = Math.floor((((canvasY-secondAftrans.addY)/secondAftrans.magnifyY)-this.aftrans.addY)/this.aftrans.magnifyY);
		//let yy = Math.floor(
		//	((canvasY-secondAftrans.addY)/(secondAftrans.magnifyY*this.aftrans.magnifyY)) -
		//		this.aftrans.addY/this.aftrans.magnifyY
		//);
		//let yy = Math.floor(
		//	canvasY/(secondAftrans.magnifyY*this.aftrans.magnifyY) -
		//		secondAftrans.addY/(secondAftrans.magnifyY*this.aftrans.magnifyY) -
		//		this.aftrans.addY/this.aftrans.magnifyY
		//);
		//let yy = Math.floor(canvasY*mulY+addY);
		let yy = (canvasY*mulY+addY)|0;
		for(let canvasX=0; canvasX<addHereWidth; canvasX++){
			/*
			//let gameX = secondAftrans.reverseX(canvasX);
			let gameX = (canvasX-secondAftrans.addX)/secondAftrans.magnifyX;
			let xx = (gameX-this.aftrans.addX)/this.aftrans.magnifyX;
			//let poten = this.readYX(gameY,gameX); //reads either bitpic.wallPoten or 0, or maybe later bilinear interpolation?
			//let yy = this.aftrans.reverseY(gameY); //FIXME why is it 2 reverses? This looks wrong. Might have done it wrong multiple places to get it right together?
			//let xx = this.aftrans.reverseX(gameX);
			xx = Math.floor(xx);
			*
			//let xx = Math.floor((((canvasX-secondAftrans.addX)/secondAftrans.magnifyX)-this.aftrans.addX)/this.aftrans.magnifyX);
			//let xx = Math.floor(canvasX*mulX+addX);
			let xx = (canvasX*mulX+addX)|0;
			/*if(yy < 0 || yy >= this.height || xx < 0 || xx >= this.width){
				//poten = 0; //return 0; //out of range, its 0s there
				i++;
				continue;
			}else{
			*
				let index = yy*this.width+xx;
				let readThisBit = (this.bytes[index>>3]>>(index&7))&1;
				poten = readThisBit*this.wallPoten;
				//poten = this.readBit(index)*this.wallPoten;
				addHere[i++] += poten;
			//}
			//addHere[i++] += poten;
		}
	}
};*/
//like readYX many times in parallel in a 2d grid. uses 2 aftrans, one as param and one in this bitpic.
dagball.BitPic.prototype.paintOntoPotens = function(addHere, addHereHeight, addHereWidth, secondAftrans){
	let i = 0;
	const addY = -secondAftrans.addY/(secondAftrans.magnifyY*this.aftrans.magnifyY)-this.aftrans.addY/this.aftrans.magnifyY;
	const mulY = 1/(secondAftrans.magnifyY*this.aftrans.magnifyY);
	const addX = -secondAftrans.addX/(secondAftrans.magnifyX*this.aftrans.magnifyX)-this.aftrans.addX/this.aftrans.magnifyX;
	const mulX = 1/(secondAftrans.magnifyX*this.aftrans.magnifyX);
	let yy = addY;
	let thisWallPoten = this.wallPoten;
	//xx = (canvasX*mulX+addX)|0;
	//const startCanvasX = Math.max(0, Math.min(Math.ceil(-addX), addHereWidth)); //when canvasX is 0
	/////////////////const startCanvasX = Math.max(0, Math.min(Math.ceil(addX), addHereWidth)); //when canvasX is 0
	//////const startCanvasX = Math.max(0, Math.min(Math.ceil(-addX), this.width)); //when canvasX is 0
	//end, when canvasX*mulX+addX is just past addHereWidth
	//canvasX*mulX+addX==addHereWidth
	//canvasX==(addHereWidth-addX)/mulX
	//const endCanvasXExcl = Math.max(0, Math.min(Math.ceil((addHereWidth-addX)/mulX), addHereWidth));
	//////const endCanvasXExcl = Math.max(0, Math.min(Math.ceil((addHereWidth-addX)/mulX), this.width));
	//for(let canvasY=0; canvasY<addHereHeight; canvasY++){
	for(let canvasY=0; canvasY<addHereHeight; canvasY++){
		//let yy = (canvasY*mulY+addY)|0;
		let xx = addX;
		//let xx = startCanvasX*mulX+addX;
		let yyInt = (yy|0);
		if(0 <= yyInt && yyInt < this.height){
			let yyIntTimesWidth = yyInt*this.width;
			//let yyIntTimesWidth = (yy|0)*addHereWidth; //FIXME?
			//This wraps the game world horizontally when past its edges: for(let canvasX=0; canvasX<addHereWidth; canvasX++){
			//////i += startCanvasX; //skip these xx on left of screen
			//i += startCanvasX; //skip these canvasX on left of screen
			//let i = yyIntTimesWidth+startCanvasX;
			//////for(let canvasX=startCanvasX; canvasX<endCanvasXExcl; canvasX++){
			//for(let canvasX=0; canvasX<addHereWidth; canvasX++){
			//for(let canvasX=startCanvasX; canvasX<addHereWidth; canvasX++){
			for(let canvasX=0; canvasX<addHereWidth; canvasX++){
				//let xx = (canvasX*mulX+addX)|0;
				let xxInt = (xx|0);
				if(0 <= xxInt && xxInt < this.width){
					let index = yyIntTimesWidth+xxInt;
					let readThisBit = (this.bytes[index>>3]>>(index&7))&1;
					let poten = readThisBit*thisWallPoten;
					addHere[i] += poten;
				}
				i++;
				xx += mulX;
			}
		}else{
			i += addHereWidth;
		}
		//////i += addHereWidth-endCanvasXExcl; //skip these xx on right of screen
		yy += mulY;
	}
};

//in game coordinates returns potentialEnergy added by this bitpic there. jagged. if you want the
//smooth bellcurvelike potentialEnergy used for balls, TODO use another func (TODO make one) for that.
dagball.BitPic.prototype.readYX = function(y,x){
	//return .3; //FIXME
	//return x; //FIXME
	let yy = this.aftrans.reverseY(y);
	let xx = this.aftrans.reverseX(x);
	//return y; //FIXME
	//return x; //FIXME
	//return ((Math.hypot(y,x)-2.5)<.02) ? this.wallPoten : 0; //FIXME
	//return Math.hypot(y,x); //FIXME
	//return Math.hypot(yy,xx); //FIXME
	yy = Math.floor(yy);
	xx = Math.floor(xx);
	if(yy < 0 || yy >= this.height || xx < 0 || xx >= this.width){
		return 0; //out of range, its 0s there
	}
	let index = yy*this.width+xx;
	return this.readBit(index)*this.wallPoten;
};
dagball.BitPic.prototype.bilinearReadYX = function(y,x){ //TODO test this (now is 2023-12-30)
	//return x; //FIXME
	let rawYY = this.aftrans.reverseY(y);
	let rawXX = this.aftrans.reverseX(x);
	//return y; //FIXME
	//return x; //FIXME
	//return ((Math.hypot(y,x)-2.5)<.02) ? this.wallPoten : 0; //FIXME
	//return Math.hypot(y,x); //FIXME
	//return Math.hypot(yy,xx); //FIXME
	yy = Math.floor(rawYY);
	xx = Math.floor(rawXX);
	if(yy < 0 || yy >= (this.height-1) || xx < 0 || xx >= (this.width-1)){
		return 0; //out of range, its 0s there
	}
	let y0x0 = this.readBit(yy*this.width+xx);
	let y0x1 = this.readBit(yy*this.width+(xx+1));
	let y1x0 = this.readBit((yy+1)*this.width+xx);
	let y1x1 = this.readBit((yy+1)*this.width+(xx+1));
	let yFraction = rawYY-yy;
	let xFraction = rawXX-xx;
	let bilinear =
		(y0x0*(1-yFraction)*(1-xFraction))+
		(y0x1*(1-yFraction)*(xFraction))+
		(y1x0*(yFraction)*(1-xFraction))+
		(y1x1*(yFraction)*(xFraction));
	return bilinear*this.wallPoten;
};
dagball.BitPic.prototype.writeYX = function(y,x,bit){
	let yy = this.aftrans.reverseY(y);
	let xx = this.aftrans.reverseX(x);
	yy = Math.floor(yy);
	xx = Math.floor(xx);
	if(yy < 0 || yy >= this.height || xx < 0 || xx >= this.width){
		return; //out of range
	}
	let index = yy*this.width+xx;
	this.writeBit(index, bit);
};
dagball.BitPic.prototype.writeYXR = function(y,x,r,bit){
	let yy = this.aftrans.reverseY(y);
	let xx = this.aftrans.reverseX(x);
	let rr = r/this.aftrans.magnifyY; //FIXME magnifyX and magnifyY? theyre probably equal.
	if(rr > dagball.maxRadiusOutToReadOrWriteInBitpicRR){
		Err('Its gonna be very slow. Something likely went wrong. rr='+rr+' and about to double loop 2*rr each')
	}
	yy = Math.floor(yy);
	xx = Math.floor(xx);
	rr = Math.ceil(rr);
	let rr2 = rr*rr;
	for(let yyy=yy-rr; yyy<=yy+rr; yyy++){
		for(let xxx=xx-rr; xxx<=xx+rr; xxx++){
			if(yyy < 0 || yyy >= this.height || xxx < 0 || xxx >= this.width){
				continue; //out of range
			}
			let dy = yyy-yy;
			let dx = xxx-xx;
			if(dy*dy+dx*dx > rr2){
				continue; //not in circle shape of paintbrush
			}
			let index = yyy*this.width+xxx;
			this.writeBit(index, bit);
		}
	}
};
//This is potentialEnergy that balls roll up to make them bounce on the wall or lay on it
//This is _OLD cuz its not using bilinear interpolation (bilinearReadYX) which is making the balls bounce jumpy.
dagball.BitPic.prototype.readSmoothYXR_OLD = function(y,x,r,optionalNumStdDevs){
	let stdDevs = optionalNumStdDevs || 2;
	let stdDevs2 = stdDevs*stdDevs;
	let rawYY = this.aftrans.reverseY(y);
	let rawXX = this.aftrans.reverseX(x);
	//FIXME? let rawRR = (r*stdDevs)/this.aftrans.magnifyY; //FIXME magnifyX and magnifyY? theyre probably equal.
	let rawRR = (r*stdDevs); //FIXME? why doesnt this multiply or divide by magnifyY or magnifyX?
	yy = Math.floor(rawYY);
	xx = Math.floor(rawXX);
	rr = Math.ceil(rawRR);
	if(rr > dagball.maxRadiusOutToReadOrWriteInBitpicRR){
		Err('Its gonna be very slow. Something likely went wrong. rr='+rr+' and about to double loop 2*rr each')
	}
	let rr2 = rr*rr;
	let sumBellHeights = 0;
	for(let yyy=yy-rr; yyy<=yy+rr; yyy++){
		for(let xxx=xx-rr; xxx<=xx+rr; xxx++){
			if(yyy < 0 || yyy >= this.height || xxx < 0 || xxx >= this.width){
				continue; //out of range
			}
			let index = yyy*this.width+xxx;
			let observedBitThere = this.readBit(index);
			if(observedBitThere){
				//let dy = yyy-yy;
				//let dx = xxx-xx;
				let dy = yyy-rawYY;
				let dx = xxx-rawXX;
				let distSq = dy*dy+dx*dx;
				let observedStdDevSquared = distSq/rr2;
				let bellHeight = Math.exp(-.5*observedStdDevSquared); //is height 1 at observedStdDevSquared==0, unlike a normed height bellcurve
				//sumBellHeights += bellHeight*observedBitThere;
				sumBellHeights += bellHeight;
			}
		}
	}
	let weightedAveBellHeights = sumBellHeights;
	weightedAveBellHeights /= rr2; //FIXME is this right? somewhere around there i think.
	return weightedAveBellHeights*this.wallPoten;
	//return weightedAveBellHeights; //already includes this.wallPoten thru 
};
//This is potentialEnergy that balls roll up to make them bounce on the wall or lay on it
//Uses using bilinear interpolation (bilinearReadYX) to (TODO verify this works???) make balls not bounce so jumpy (bounce smooth).
//dagball.BitPic.prototype.readSmoothYXR = function(y,x,r,optionalNumStdDevs)


dagball.BitPic.prototype.readSmoothYXR = function(y,x){
	let r = this.wallThick;
	/*if(!dagball.cacheJsFunc_addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap){
		let apeCode = dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap;
		let ape = Ap.lazyEvalOld(apeCode).ape;
		let jsLambdaCode = ape.jsLambdaCode();
		let jsLambda = TinyGlsl.cachedJsEval(jsLambdaCode);
		dagball.cacheJsFunc_addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap = jsLambda;
		console.log('bitpic.readSmoothYXR caching dagball.cacheJsFunc_addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap (wont be updated if you change that string) =\n'+
			dagball.cacheJsFunc_addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap);
	}*/
	let dist = this.distanceToClosestWall(y,x,r);
	//TODO return dagball.cacheJsFunc_addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap(dist);
	if(dist == Infinity) return 0;
	let distFraction = dist/r;
	let closenessFraction = 1-distFraction;
	return this.wallPoten*closenessFraction*closenessFraction;
	//return .3;

	//return 10/(1+dist);
};


//uses the last Float32Array(dagball.canvasHeight()*dagball.canvasWidth()) from GPU to add a wall-like gradient where curves are high enough
//so balls dont get stuck on plateaus. Returns 0 if certain things dont exist.
dagball.readSmoothYX_onDisplayPotens = function(y,x){
	let potensRect = dagball.last_potentialEnergiesForDisplay;
	if(!potensRect || !dagball.bitpic){
		return 0;
	}
	let aftrans = dagball.aftrans;
	let wallPoten = dagball.bitpic.wallPoten;
	
	//FIXME dont know what coordinates thats in (likely bitpic squares coordinates which isnt game coords or canvas coords): let r = dagball.bitpic.wallThick;
	//let r = .01; //FIXME dont hardcode this
	let r = .45; //FIXME dont hardcode this
	dagball.bitpicBPotenLine = 9; //FIXME
	//dagball.bitpicBPotenLine = 2; //FIXME
	//wallPoten = 2.4;
	wallPoten = 42.4;


	let minPotenToCountAsWall = dagball.bitpicBPotenLine;
	let pixelsHeight = dagball.canvasHeight();
	let pixelsWidth = dagball.canvasWidth();
	if(potensRect.length != pixelsHeight*pixelsWidth){
		Err('potensRect.length='+potensRect.length+' but pixelsHeight*pixelsWidth='+(pixelsHeight*pixelsWidth));
	}
	let dist = dagball.distanceToClosestWall(y,x,r,minPotenToCountAsWall,aftrans,pixelsHeight,pixelsWidth,potensRect);
	if(dist == Infinity) return 0;
	let distFraction = dist/r;
	let closenessFraction = 1-distFraction;
	return wallPoten*closenessFraction*closenessFraction;
};

//FIXME what units is this distance in? squares of bitpic pixels? thats not canvas pixels or game coords.
//
//NEW: returns distance, or Infinity if none are that close.
//OLD: Returns potentialEnergy similar to how balls bounce on eachother, with radiusSum (between both) as r.
//The closest 1-bit-pixel chooses potentialEnergy (so is max of potentialEnergies of all pixels, to the chosen (y,x).
//Its springlike, so the closer they are the squared times more potentialEnergy, a parabola.
//As of 2023-12-30 this is the ball bounce math:
//dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap is:
//	`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
//		{f* 8.05 {f** {f/ {fmax 0 {f- .07 pairBallDist}} .07} 2}}
//	)`,
//This readSmoothYXR func will likely change independently of ball bounce code later,
//but its a good starting point.
//UPDATE: keep those in sync this way:
//TinyGlsl.cachedJsEval(Ap.lazyEvalOld(dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap).ape.jsLambdaCode())
dagball.BitPic.prototype.distanceToClosestWall = function(y,x,r){
	let rawYY = this.aftrans.reverseY(y);
	let rawXX = this.aftrans.reverseX(x);
	yy = Math.floor(rawYY);
	xx = Math.floor(rawXX);
	rr = Math.ceil(r);
	if(rr > dagball.maxRadiusOutToReadOrWriteInBitpicRR){
		Err('Its gonna be very slow. Something likely went wrong. rr='+rr+' and about to double loop 2*rr each')
	}
	let rr2 = rr*rr;
	//let sumBellHeights = 0;
	let minDistanceSq = Infinity;
	for(let yyy=yy-rr; yyy<=yy+rr; yyy++){
		for(let xxx=xx-rr; xxx<=xx+rr; xxx++){
			if(yyy < 0 || yyy >= this.height || xxx < 0 || xxx >= this.width){
				continue; //out of range
			}
			let index = yyy*this.width+xxx;
			let observedBitThere = this.readBit(index);
			if(observedBitThere){
				let dy = yyy-rawYY;
				let dx = xxx-rawXX;
				let distSq = dy*dy+dx*dx;
				minDistanceSq = Math.min(distSq, minDistanceSq);
			}
		}
	}
	let minDistance = Math.sqrt(minDistanceSq);
	return minDistance<=r ? minDistance : Infinity;
	//{f* 8.05 {f** {f/ {fmax 0 {f- .07 pairBallDist}} .07} 2}}
	//Todo();
	//return this.readSmoothYXR_OLD(y,x,dagball.readSmoothYXR_r,2); //FIXME
	//return .432342; //FIXME
};

//Similar to distanceToClosestWall
//y x and r are in game coordinates. aftrans.forwardY(y) and .forwardX(x) convert to floatRect 2d coordinates,
//even though its a 1d float array.
dagball.distanceToClosestWall = function(y,x,r,minPotenToCountAsWall,aftrans,pixelsHeight,pixelsWidth,floatRect){
	let minYPix = Math.floor(aftrans.forwardY(y-r));
	let maxYPix = Math.ceil(aftrans.forwardY(y+r));
	let minXPix = Math.floor(aftrans.forwardX(x-r));
	let maxXPix = Math.ceil(aftrans.forwardX(x+r));
	minYPix = Math.max(0, Math.min(minYPix, pixelsHeight-1));
	maxYPix = Math.max(0, Math.min(maxYPix, pixelsHeight-1));
	minXPix = Math.max(0, Math.min(minXPix, pixelsWidth-1));
	maxXPix = Math.max(0, Math.min(maxXPix, pixelsWidth-1));
	let r2 = r*r;
	let minDistanceSq = Infinity;
	for(let pixY=minYPix; pixY<=maxYPix; pixY++){
		for(let pixX=minXPix; pixX<=maxXPix; pixX++){
			let poten = floatRect[pixY*pixelsWidth+pixX];
			let isWallB = poten >= minPotenToCountAsWall; //this code replaces dagball.bitpicB. minPotenToCountAsWall is likely dagball.bitpicBPotenLine?
			if(isWallB){
				let dy = aftrans.reverseY(pixY)-y;
				let dx = aftrans.reverseX(pixX)-x;
				let distSq = dy*dy+dx*dx;
				let isWithinRadius = distSq <= r2;
				if(isWithinRadius){
					minDistanceSq = Math.min(minDistanceSq, distSq);
				}
			}
		}
	}
	return Math.sqrt(minDistanceSq); //Infinity if none
};

/* Dagball quicksaves are way too big (250kB) cuz dense pic of 1 bit pixels of wall vs open area. Sparse quadtree bloom filter
of 2 bits per node so sync easy across net. 00 means transparent / leave it as it is.
01 means 0. 10 means 1. 11 means 4 way branch https://en.wikipedia.org/wiki/Quadtree
A feature of this kind of image compression is its deterministic and has no room to sneak in metadata.

a sparse matrix of bits optimized for 2d powOf2 aligned powOf2 sized squares
//that are all 0s, all 1s, or all transparent (to leave it as it is).
//The max size is 8/3 bits per pixel. It will usually be closer to .01 bits per pixel
//if the shapes are simple, lots of thick areas of all 0s and other areas of all 1s.
//This is meant to be used with dagball.BitPic of size 1024x1024 or 4096x4096 or 32x32 etc.
//This will normally be stored in wholeGameState instead of a BitPic cuz this will
//make the .dagball/json files many times smaller (they are around 253kB now, and most of that is bitpic).
//
//Data format: Its a list of blocks. Each block is 2 bits and is 1 of these symbols:
//00 - transparent/unspecified, leave it as it is.
//01 - all 0s in this square and recursively smaller down to infinitely small.
//10 - all 1s in this square and recursively smaller down to infinitely small.
//11 - branch with 4 blocks.
//This often wont align on byte or int sizes so pad with 00s.
//
//This is called BloomPic cuz its a kind of bloomFilter but with disproofByContradiction built in
//per bit (which is 2 bits) so across network if there is disagreement
//on where the walls (10) vs open areas (01) are, so both cant be true.
//
//FIXME use 2 bits per wall/open pixel in BitPic?
//
dagball.BloomPic = function(ints){
	this.height = height;
	this.width = width;
	this.ints = ints;
};

It uses 2-bit blocks. 11 is followed by 4 nodes as 2x2. 10 is white. 01 is black. 00 is transparent. At any depth,
it can color the whole thing white, black, or transparent, any power of 2 aligned and sized square. And thats it.
Just recurse that and it cuts away huge solid areas.
*/
dagball.BloomTree = function(bytes){
	this.bytes = bytes;
};

dagball.BloomTree.prototype.type = 'dagball_bloomtree';

dagball.BloomTree.prototype.read = function(index){ //returns 0 1 2 or 3. Index is in units of uint2s.
	//index = index*2;
	//return (this.bytes[index>>3]>>(index&7))&3;
	let b = this.bytes[index>>2];
	let lowestBitIndexInByte = 6-((index&3)<<1);
	return (b>>lowestBitIndexInByte)&3;
};

//index is in units of int2s.
dagball.writeInt2IntoBytes = function(bytes, index, int2){
	let byteIndex = index>>2;
	let prevByte = bytes[byteIndex];
	//If (index&3)==0 then lowestBitIndexInByte is 6. if ==1 then 4. If ==2 then 2. If ==3 then 0.
	let lowestBitIndexInByte = 6-((index&3)<<1);
	//let prevByteWithoutThose2Bits = (prevByte & ~((lowestBitIndexInByte<<1)|lowestBitIndexInByte));
	let prevByteWithoutThose2Bits = (prevByte & ~((1<<lowestBitIndexInByte)*3));
	bytes[byteIndex] = prevByteWithoutThose2Bits | (int2<<lowestBitIndexInByte);
};

dagball.BloomTree.prototype.write = function(index, num){ //write 0 1 2 or 3
	return dagball.writeInt2IntoBytes(this.bytes, index, num);
	/*
	//let highBit = (num>>1)&1;
	//let lowBit = num&1;
	//TODO optimize by writing 2 bits at a time
	//this.writeBit(index*2, lowBit); //FIXME should this endian be swapped?
	//this.writeBit(index*2+1, highBit); //FIXME should this endian be swapped?
	let byteIndex = index>>2;
	let prevByte = this.bytes[byteIndex];
	//If (index&3)==0 then lowestBitIndexInByte is 6. if ==1 then 4. If ==2 then 2. If ==3 then 0.
	let lowestBitIndexInByte = 6-((index&3)<<1);
	//let prevByteWithoutThose2Bits = (prevByte & ~((lowestBitIndexInByte<<1)|lowestBitIndexInByte));
	let prevByteWithoutThose2Bits = (prevByte & ~((1<<lowestBitIndexInByte)*3));
	this.bytes[byteIndex] = prevByteWithoutThose2Bits | (num<<lowestBitIndexInByte);
	*/
};

dagball.BloomTree.prototype.toMap = function(){
	return {
		type: this.type,
		base64: dagball.bytesToBase64(this.bytes),
	};
};

dagball.mapToBloomTree = function(map){
	if(!map || !map.base64){
		Err('Some stuff missing: '+JSON.stringify(map));
	}
	if(map.type != 'dagball_bloomtree'){
		Err('Not a dagball_bloomtree: '+JSON.stringify(map));
	}
	return new dagball.BloomTree(dagball.base64ToBytes(map.base64));
};

dagball.bloomTransparent = 0b00; //leaf transparent / leave the bitpic pixel as it is
dagball.bloomOpen = 0b01; //leaf open
dagball.bloomWall = 0b10; //leaf wall
dagball.bloomBranch = 0b11; //4 way branch

/*FIXME endian problems of int2 inside byte:
dagball.BloomTree.prototype.writeBit = function(bitIndex, bit){ //write 0 or 1 at a bit index
	if(bit){
		this.bytes[bitIndex>>3] |= (1<<(bitIndex&7));
	}else{
		this.bytes[bitIndex>>3] &= ~(1<<(bitIndex&7));
	}
};*/

dagball.isPowOf2 = function(x){
	return (x&(x-1))==0;
};

/*dagball.BitPic.prototype.toBloomTree = function(){
	if(!dagball.isPowOf2(this.height)){
		Err('bitpic height='+this.height+' is not powOf2');
	}
	if(this.height != this.width){
		Err('bitpic height='+this.height+' is not width='+this.width);
	}
	let maxPossibleBitSize = Math.ceil(this.height*this.width*8/3);
	let maxPossibleIntSize = Math.ceil(maxPossibleBitSize/32);
	let mem = new dagball.BitPic(this.wallPoten, this.wallThick, this.height, this.width, new Int32Array(maxPossibleIntSize), this.aftrans);
	//use mem for pushing 2 bits at a time. Start from the bottom right corner which is the last pixel in this.ints and recurse up and left.
	let memSize = 0;

	Todo();
};*/
dagball.BitPic.prototype.toBloomTree = function(){
    if(!dagball.isPowOf2(this.height)){
        throw new Error('BitPic height is not a power of 2');
    }
    if(this.height !== this.width){
        throw new Error('BitPic height and width must be equal');
    }

    // Recursive function for both computing size and filling the array
    let bitCount = 0;
    let bloomByteArray;

    const process = (x, y, size, fillArray)=>{
        let isUniform = true;
        let firstBit = this.readBit(y*this.width+x);

        for(let row=y; row<y+size; row++){ //TODO optimize this. it runs log times more than needs to.
            for(let col=x; col<x+size; col++) {
                if(this.readBit(row*this.width+col) !== firstBit){
                    isUniform = false;
                    break;
                }
            }
            if(!isUniform) break;
        }

        if(fillArray){
			/*this is littleEndian, index 0 being at low 2 bits in byte. 2024-1-1 switching to bigEndian inside byte, so at index 6 and 7.
            //let position = bitCount>>5; //divide by int32 size
			let position = bitCount>>3; //divide by byte size
            //let shift = bitCount%32;
			//let shift = bitCount&31;
			let shift = bitCount&7;
            let value = isUniform ? (firstBit ? dagball.bloomWall : dagball.bloomOpen) : dagball.bloomBranch;
            bloomByteArray[position] |= value << shift;
			*/
			/*//code copied from dagball.BloomTree.prototype.write
			let byteIndex = index>>2;
			let prevByte = this.bytes[byteIndex];
			//If (index&3)==0 then lowestBitIndexInByte is 6. if ==1 then 4. If ==2 then 2. If ==3 then 0.
			let lowestBitIndexInByte = 6-((index&3)<<1);
			//let prevByteWithoutThose2Bits = (prevByte & ~((lowestBitIndexInByte<<1)|lowestBitIndexInByte));
			let prevByteWithoutThose2Bits = (prevByte & ~((1<<lowestBitIndexInByte)*3));
			this.bytes[byteIndex] = prevByteWithoutThose2Bits | (num<<lowestBitIndexInByte);
			*/
			let value = isUniform ? (firstBit ? dagball.bloomWall : dagball.bloomOpen) : dagball.bloomBranch;
			dagball.writeInt2IntoBytes(bloomByteArray, bitCount>>1, value); //bitCount>>1 cuz index is in units of int2s
        }
        
        bitCount += 2; //2 bits for every node

        if(!isUniform){
            const halfSize = size/2;
            process(x, y, halfSize, fillArray); //top left
            process(x+halfSize, y, halfSize, fillArray); //top right
            process(x, y+halfSize, halfSize, fillArray); //bottom left
            process(x+halfSize, y+halfSize, halfSize, fillArray); //bottom right
        }
    };

    // First Pass: Compute the size in bits
    process(0, 0, this.width, false);

    // Allocate the array based on computed size
    //let maxPossibleIntSize = Math.ceil(bitCount/32);
	let maxPossibleByteSize = Math.ceil(bitCount/8);
    bloomByteArray = new Uint8Array(maxPossibleByteSize);

    // Second Pass: Fill the array
    bitCount = 0; // Reset bit counter for the second pass
    process(0, 0, this.width, true);

    return new dagball.BloomTree(bloomByteArray);
};

//in case circles was loaded in an order where circ.edgesOut[anInt].child===null but .childMutid is a string, so this looks up circ by that string and sets .child
dagball.updateCircEdgeChilds = isForce=>{
	for(let circ of dagball.circles){
		for(let edge of circ.edgesOut){
			edge.updateChild(isForce);
		}
	}
};


/*
//BloomTree is efficiently sparse so should be the same size as bitpic.
dagball.BloomTree.paintOntoBitPic = function(bitpic){
	if(!dagball.isPowOf2(bitpic.height)){
		Err('bitpic height='+this.height+' is not powOf2');
	}
	if(bitpic.height != bitpic.width){
		Err('bitpic height='+bitpic.height+' is not width='+bitpic.width);
	}

	Todo();
};
*/

dagball.BloomTree.prototype.paintOntoBitPic = function(bitpic){
    if(!dagball.isPowOf2(bitpic.height)){
        throw new Error('BitPic dimensions must be a power of 2');
    }
    let nodeIndex = 0; //index in this.ints in units of uint2s (so 16 int2s per int)
	//TODO swap order of x and y. i like (y,x).
    const paint = (x,y,size)=>{
        const nodeValue = this.read(nodeIndex++); //uint2
        if(nodeValue === dagball.bloomTransparent){
            //Transparent: do nothing
            return;
        } else if (nodeValue === dagball.bloomBranch) {
            // Branch: divide into quadrants and recurse
            const halfSize = size/2;
            paint(x, y, halfSize); //top left
            paint(x+halfSize, y, halfSize); //top right
            paint(x, y+halfSize, halfSize); //bottom left
            paint(x+halfSize, y+halfSize, halfSize); //bottom right
        } else {
            //Wall or Open: set entire area
            for(let row=y; row<y+size; row++){
                for(let col=x; col<x+size; col++){
					//TODO optimize this by writing 8 (instead of 1) bits at a time when size is at least 8.
                    let index = row * bitpic.width + col;
                    bitpic.writeBit(index, nodeValue === dagball.bloomWall ? 1 : 0);
                }
            }
        }
    };
    paint(0, 0, bitpic.width);
};


/*
//same as making a new BitPic of same size then writing this then writing param bloomTree onto it then toBloomTree,
//but TODO more efficient by skipping that process and doing this recursively. Does not modify this or param bloomTree.
dagball.BloomTree.prototype.merge = function(bloomTree){
	Todo();
};*
dagball.BloomTree.prototype.merge = function(bloomTree){
    // Validate that the trees are of the same size
    if(this.ints.length !== bloomTree.ints.length){
        throw new Error('BloomTrees to merge must be of the same size');
    }

    const mergeNodes = (thisIndex, otherIndex)=>{
        const thisValue = this.read(thisIndex);
        const otherValue = bloomTree.read(otherIndex);

        // If both are leaves, decide which value to take
        if(thisValue !== dagball.bloomBranch && otherValue !== dagball.bloomBranch){
            // Example rule: prioritize 'wall' over 'open'
            return thisValue === dagball.bloomWall || otherValue === dagball.bloomWall 
                   ? dagball.bloomWall : dagball.bloomOpen;
        }

        // If one is a branch and the other is a leaf, the branch is subdivided and merged with the leaf
        if (thisValue === dagball.bloomBranch || otherValue === dagball.bloomBranch) {
            return dagball.bloomBranch; // Mark as branch, handle subdivision later
        }

        // If both are branches, merge their children
        // The actual merging of children is handled in a separate function
        return dagball.bloomBranch;
    };

    // Create a new array to store the merged tree
    let mergedIntArray = new Int32Array(this.ints.length);

	wrong cuz one could branch and the other not
    for (let i = 0; i < this.ints.length; i++) {
        mergedIntArray[i] = mergeNodes(i, i);
    }

	also, the merge might result in a branch being all 0s or all 1s, in which case it should be 01 or 10 instead of 11

    // Handle merging of branches separately
    // TODO: Implement a function to merge branches and their children

    return new dagball.BloomTree(mergedIntArray);
};*/


//2024-6-3 TODO get rid of this and use axgob instead, but get dagball working better and people playing it online together first.
//2023-11-13 have not been using this.
//
//dag object types. also pubkeys arent exactly dag the way they're displayed as creating cycles within the dag but since the dag only points
//at the pubkey and doesnt cross past there to the thing it signs (that creates the cycles) its dag enough to be a forest of hash ids.
//All ids are strings that are valid javascript var names (and are simultaneously valid glsl var names?).
//Every id starts with 1 char of syncType, see dagball.syncTypeToChar.
const Dag = {
	//double is part of the dag but is used directly without being wrapped.
	//FIXME do you ever need the id of a double? could use a func for that instead. Adding dag.idOfDouble func for that.

	/*FIXME should childs be ids or the dag objects whose ids are those?

	TODO should every id start with abbrev of its syncType so .syncType can be set differently depending on it: s for swarm. c for const. p for pubkey.
	Id like to, but "TODO doublearrusedasuint53forrplacelikevec1voting" is 2 hops deep in that?

	TODO something should be using the swarm syncType, and that will be used in gpucircs and leafvars, but those might be
	specific to dagball so shouldnt go in this dag/dags {}/map???

	TODO every one of these objects must have a global id. If syncType.const, its either a hash id or if the constant data is small then that data literally.
	If its a pubkey, the id might be like pubkey_ed25519_2345345345345hex23432452...234234.
	If its a swarm, the id is just made up after a prefix, maybe swarm_x.
	But im not sure the syncType (const pubkey or swarm etc) should be in the id. The type such as dags.Pubkey should be there like pubkey_...
	and pubkey implies syncType of pubkey.

	This dags object/{} is supposed to be not dagball specific. Things that are dagball specific can go in the dagball object/{} or other places.
		In dagball, a leaf var should be a swarm dags.Swarmnum with a const dags.Point,
		and a Gpucirc should be a const dags.Circ with various other fields. BUT I might want to move them around
		using a potential energy func of where to put things on screen and edit the gpu code in selected gpucirc
		using the textarea on left. so it seems I want to vary their syncType between swarm vs const,
		but a problem with that is the id has to choose in advance. I could copy the swarm form of gpucirc to const form,
		having a new id. incoming pointers (such as by player voting) would not automatically transfer, and that is by design
		since a vote is on a specific id, and an id starts with the syncType (s for swarm. c for const. p for pubkey).
		TODO id starts with the syncType (s for swarm. c for const. p for pubkey).
		Make this happen, and find a way to do it without making Gpucirc and Leafvar types. They should be somehow derived
		from whats in dags, and just instances of them used in dagball. I want dags to be general enough new kinds of games
		can be made from it, which is why Im including a node type for wrapping wikibinator203 for future research.
	*/

	Null: function(){
		this.syncType = 'const';
		this.id = dagball.syncTypeToChar[this.syncType]+'null_';
	},
	//NullSig: function(){
	//	this.val = dagStuff.null;
	//},
	True: function(){
		this.syncType = 'const';
		this.id = dagball.syncTypeToChar[this.syncType]+'true_';
	},
	False: function(){
		this.syncType = 'const';
		this.id = dagball.syncTypeToChar[this.syncType]+'false_';
	},
	Str: function(s){ //useAsImmutable
		this.s = s; //the wrapped string
	},
	Pubkey: function(id){ //A variable whose value can be replaced by any object with a timestamp, and a sig must come with that. The timestamp must also be signed with it.
		this.id = id; //The ed25519 publicKey should be in the id, probably after some prefix that says its an ed25519. If you wanted an ed448 or other publickeytype
		this.syncType = 'pubkey';
		//TODO? this.pubkeyType = 'ed25519';
		//this.valSig = dagStuff.null; //a Dag.Sig. FIXME but dags.Null doesnt have a timestamp and probably wasnt signed by this pubkey.
		this.valSig = null; //a Dag.Sig. FIXME but dags.Null doesnt have a timestamp and probably wasnt signed by this pubkey.
		throw new Error('TODO');
	},
	Sig: function(){
		this.id = id;
		this.syncType = 'const';
		this.val = dagStuff.null;
	},
	Swarmvar: function(id){ //A variable whose value is jaggedly agreed on or not, hopefully converging, by many computers andOr pubkeys andOr Human players. Its val is an id, FIXME object whose id is that? or the id?
		this.id = id;
		this.syncType = 'swarm';
		this.val = dagStuff.null;
	},
	Swarmnum: function(id){ //like Swarmvar but there are number vars instead: pos, vel, and maybe velDecay. Agreed on or forked/notagreed by many computers andOr pubkeys andor human players. especially by the player voting system (see dagball.Player Maps for example).
		this.id = id;
		this.syncType = 'swarm';
		this.pos = 0;
		this.vel = 0;
		this.velDecay = 0;
		//FIXME should this also be at a dags.Point? or is that too dagball-specific to be in this dags object instead?
	},
	Rect: function(){  //useAsImmutable 2d rectangle in game world
		this.syncType = 'const';
		throw new Error('TODO');
	},
	Circ: function(){ //useAsImmutable 2d circle in game world
		this.syncType = 'const';
		throw new Error('TODO');
	},
	Point: function(){ //useAsImmutable 2d point in game world. TODO maybe 3d including ball.ballBal (or is it ball.bal) which linear interpolates between 2 heightmaps if dagball.isDoubleHeightmap (else just 1 heightmap), at a (y,x).
		this.syncType = 'const';
		throw new Error('TODO');
	},
	Arr: function(){ //useAsImmutable array of primitives, such as Float32Array, Float64Array, Int32Array, etc. TODO where does the mutable one go?
		this.syncType = 'unknown'; //FIXME could this allow both const and swarm? Does that apply to the Arr itself or to the primitives in it which are like its childs?
		throw new Error('TODO');
	},
	List: function(){ //useAsImmutable list of ids.
		this.syncType = 'const';
		throw new Error('TODO');
	},
	Mapvec: function(){ //useAsImmutable map of id to double. FIXME there should be an option, or maybe 2 types of this, one where it has to sum to
		this.syncType = 'const';
		throw new Error('TODO');
	},
	Map: function(){ //useAsImmutable map of id to id. "map of id to id. Like a class instance whose fields are the map keys."
		this.syncType = 'const';
		throw new Error('TODO');
	},
	Fn: function(fn, optionalFnType){ //useAsImmutable. Wraps a wikibinator203 lambda, which is a different kind of dag where each node can be called on a node to find or create a node.
		this.syncType = 'const';
		//TODO theres a .isWikibinator203Lambda field, or named something like that,
		//either in fn.isWikibinator203Lambda or fn.n.isWikibinator203Lambda, find it from that?
		this.fnType = optionalFnType || 'wikibinator203';
		this.fn = fn;
	},
	//TODO doublearrusedasuint53forrplacelikevec1voting
	
	
};

//returns a Dag.Sig, or throws if thats the wrong password.
Dag.Pubkey.prototype.sign = function(password, val){
	throw new Error('TODO');
};

//signs it and it becomes the new val.
Dag.Pubkey.prototype.setVal = function(password, val){
	this.val = this.sign(password,val);
};

Dag.Pubkey.prototype.val = function(){
	return this.valSig.val || dagStuff.null;
};

const DagStuff = {
	//passwordToEd25519Pubkey: function(password){
	passwordToPubkey: function(password){
		throw 'TODO hash the password and make an ed25519 pubkey, return a Dag.Pubkey';
	},
	idOfDouble: function(d){
		throw new Error('TODO');
	},
	null: new Dag.Null(),
	true: new Dag.True(),
	false: new Dag.False(),
};

const ExampleDags = {
	//TODO
};


/* TODO code this with many Player objects in same browser, since the votes/vectors of other players will get copied to many computers and summed there.
Possible way for players to vote on curve patterns of game world. 2 kinds of voting used together. Each vote for if
a circle/node exists or not is a length 1 vector. Vote between -1 to 1 on each circle, or 0.1 on 100 circles, etc. Median vote
on weight/influence per circle/node IF exists. Votes sum to node priority for constraint solver. Neg priority is always off.
Hopfield net between circles. Edge between near circles. Bias per node so hopfield keeps density of vars under 1000 near
every area. All nodes off. Loop by descending priority. Hopfield may turn node on. 
-- https://www.facebook.com/groups/dagball/posts/683555173687394/ (text above slightly modified since posted at these urls 2023-9-18)
-- https://twitter.com/DagBallGame/status/1703790786360271292

2023-9-18 Wrote this to LLM after quoting the player class and comments, todo copy other parts of that conversation here if relevant...
[[A circ is a circle at constant centerY centerX radius, with circInfluence scalar, and with a string of GLSL code that will be windowed
to only directly affect things in that circle. Many such circs together form a scalar field of up to trillions of dimensions, but at most
1000 dimensions (float vars in GLSL) can be on screen at once per player viewing it. The game works by moving a 2d cross-section through
the trillion dimensional constant scalarField, so it looks like the game terrain is moving. Balls roll in the valleys and ditches and
other low parts (low scalar in general). Up to 1000 dimensional gradient is computed (this and the balls rolling on those shapes is
already working) and updates velocity by that gradient computed by position. Im trying to scale up DagBall (this game) by generalizing
it to circles. Its just 1 gpu code at a time now but i want to make it sparse. Im not asking for help writing that code. I want your
help on the gametheory of the voting, in the context of that.
]]
..ChatGPT4 response 2023-9-18..
[[[
Understood. Given the context you've provided, let's delve into the game theory of the voting mechanism for DagBall.

Game Theory of Voting in DagBall
Incentive Structure:

Players should have a clear incentive to vote. This could be to shape the game world in a way that benefits their gameplay or strategy.
If players can gain an advantage by voting in a certain way, they will be more likely to participate in the voting process.
Fairness and Balance:

The influence system should be balanced. If a player or group of players has too much influence, it might lead to an unfair advantage or a less diverse game world.
Consider implementing mechanisms to prevent or limit collusion among players. For instance, if a group of players always votes together to shape the game world to their advantage, it could be detrimental to the overall game experience.
Transparency:

Players should be able to see how votes are being counted and how they affect the game world. This transparency will build trust in the voting system and encourage participation.
Consider providing visual feedback in the game world based on the votes. For example, if a circle/node is highly voted upon, maybe it glows or has some other visual indicator.
Dynamic Voting:

Consider allowing dynamic voting where players can change their votes based on the evolving game world and strategies of other players. This can introduce an additional layer of strategy and unpredictability.
Weighted Voting:

As you've mentioned, players can have different influence levels. This can be a double-edged sword. On one hand, it can reward players who have been more active or have contributed more to the game. On the other hand, it can lead to power imbalances.
Consider implementing mechanisms to periodically recalibrate or reset influence levels to ensure fairness.
Feedback Loops:

Be wary of feedback loops where certain voting patterns lead to game states that further reinforce those voting patterns. For instance, if a certain configuration of circles/nodes gives a player an advantage, and that player has high influence, they might keep voting to maintain that configuration.
Experimentation:

As you've mentioned, the open-source nature of DagBall allows for experimentation. Encourage players and developers to experiment with different voting mechanisms and influence structures. This can lead to a richer and more diverse game experience.
Decentralization:

Given the multiverse nature of DagBall, consider decentralizing the voting process. This can be done by allowing different "rooms" or "realms" with their own voting rules and influence structures. Players can then choose which realm they want to play in based on their preferences.
Fallback Mechanisms:

Consider having fallback mechanisms in case the voting leads to undesirable game states. For instance, if all players vote to remove all circles/nodes, the game might become unplayable. In such cases, have mechanisms to reset or introduce default configurations.
Player Education:

Ensure that players understand the implications of their votes. Provide tutorials or guides explaining how voting affects the game world and the strategies they can employ.
In summary, the game theory of voting in DagBall revolves around balancing player incentives, ensuring fairness, and providing mechanisms for experimentation and feedback. By carefully considering these aspects, you can create a rich and engaging game experience.


User
Instead of explaining what could go right, play devils advocate and explain what could go wrong.
ChatGPT
Certainly! Playing devil's advocate, here are potential pitfalls and challenges that could arise with the voting mechanism in DagBall:

Power Imbalances:

If a few players or a group gains too much influence, they could dominate the voting process, leading to a game world that caters only to their preferences. This could alienate other players and reduce the diversity of the game experience.
Collusion:

Groups of players might collude to vote in a way that benefits them disproportionately. This could lead to unfair advantages and a less enjoyable experience for others.
Gaming the System:

Players might find ways to exploit the voting mechanism for personal gain. For instance, they might create multiple accounts to amplify their votes or use bots to manipulate the outcome.
Analysis Paralysis:

With too many options or complexities in the voting process, players might become overwhelmed and choose not to participate. This could lead to decisions being made by a very small subset of players.
Feedback Loops:

As mentioned earlier, certain voting patterns could lead to game states that further reinforce those voting patterns, creating a stagnant or repetitive game environment.
Unintended Consequences:

The outcome of certain votes might lead to unexpected game dynamics or unplayable states. For example, if players vote to remove essential game elements, it could break the game.
Lack of Engagement:

If players don't see a direct impact of their votes or if the game world changes too frequently due to votes, they might become disengaged and lose interest.
Transparency Issues:

If the voting process isn't transparent or if players feel their votes aren't being counted fairly, it could lead to distrust and dissatisfaction.
Overhead and Complexity:

Implementing a robust and fair voting mechanism could introduce significant overhead and complexity to the game's development and maintenance.
Fragmentation:

If different "rooms" or "realms" have their own voting rules and outcomes, it could lead to fragmentation of the player base. Players might cluster in certain popular realms, leaving others deserted.
Economic Inequities:

If influence can be purchased or is based on any economic factors, it could introduce real-world economic inequities into the game, where those with more resources have a disproportionate say.
Short-term Thinking:

Players might vote based on short-term gains or immediate gratification, leading to game states that aren't enjoyable or sustainable in the long run.
Lack of Diversity:

If the majority of players have similar preferences, the game world might lack diversity, leading to a monotonous experience.
In summary, while the idea of a democratic voting mechanism in DagBall is intriguing, it comes with potential challenges and pitfalls. It's essential to anticipate these issues and have mechanisms in place to address them to ensure a fair and enjoyable game experience for all players.
]]]
*
dagball.Player = function(id){
	this.id = id || dagball.nextId();

	use dagball.Circ with circ.isPubkey of true, instead of this class.
	Use edge types of 'gpucircExistVote' and 'circInfluenceMedianVote'.
	Use circ.influence instead of player.influence. A player will be a circ that can move around and change what they point at. Dont forget to timestamp sigs and sign the timestamp with it.

	//TODO use dagball.Circ as player. use dagball.Circ with circ.isPubkey of true, instead of this class.
	//amount of influence of this player. How much does your vote count. If a player is not known to exist or is in some other namespace, this would be 0. Normally 1,
	//but might want to adjust this for various reasons. Its opensource so different kinds of voting can be tried without forcing anyone to use it.
	//If you want to play by yourself on local computer, set this to 1 and all other players to 0, or could choose a group of friends and set all their
	//influences to 1 and all other players influences to 0, in your local copies of the game, not preventing those other players from playing with eachother.
	//The multiverse of DagBall will include smooth paths between all these possibilities, though there might be some parts jagged, you dont have to cross
	//the jagged parts to get from anywhere to anywhere. Its a research path how smooth it can be vs jagged in some parts.
	this.influence = 1;

	//TODO use dagball.Edge of type 'gpucircExistVote' instead of this, and use it in a dagball.Circ. OLD...
	//of dagball.Circ instance to number, and vec length (sqrt of sum of squares) of those numbers is 1. TODO vote 1 for some default circle so map isnt empty.
	//TODO circ.priority is often set to sum of player.influence*player.circExistVotes[circ] forall players in that room/game/namespace.
	this.circExistVotes = new Map();

	//TODO use dagball.Edge of type 'circInfluenceMedianVote' instead of this, and use it in a dagball.Circ. OLD...
	//of dagball.Circ instance to number, and vec length doesnt matter, can be any numbers you want.
	//TODO circ.weight or maybe it will be called circ.influence, is often set
	//to the weightedMedian of [player.influence, player.circInfluenceVotes[circ]] forall players in that room/game/namespace.
	//weightedMedian means each vote is a rectangle. Its width is player.influence, and its height is player.circInfluenceMedianVotes[circ],
	//and they are layed side by side touching eachother, sorted by height, then find the vote thats horizontally in the middle, and the winning number is that height.
	//Normal median voting has weight of 1 for all votes.
	this.circInfluenceMedianVotes = new Map();
};

//chatgpt4 "make up 20 player names for this game" 2023-0-18 after talking about the voting and gpu circles.
dagball.examplePlayerIds = 'QuantumRoller CircleMaster23 DagDynamo BallisticBlitz VectorVoyager SphericalSage DimensionDrifter GravityGuru OrbitalOdyssey RadialRogue SpinSorcerer AxisAce CurveCrusader TangentTitan MomentumMystic ScalarSeeker VortexVanguard PlanePioneer GeometricGuardian EllipseEnigma'.split(' ').map(s=>(dagball.playerPrefix+s));
/*TODO
dagball.game.players = [];
dagball.game.examplePlayerNames.forEach(id=>{
	dagball.players.push(new dagball.Player(id));
});
//TODO move this into dagball.boot?
*/


//childOrMutid can be a string mutid or the circ whose circ.Mutid() is that string.
//If string, it looks up circ by dagball.mutidToCirc and leaves it null if not found.
//from the circ whose circ.edgesOut[someInt] is this Edge, to this.child, with string edgeType and number weight.
dagball.Edge = function(edgeType, childOrMutid, weight){
	this.edgeType = edgeType;
	let isChildMutid = typeof(childOrMutid) === 'string';
	this.childMutid = isChildMutid ? childOrMutid : childOrMutid.Mutid();
	this.child = isChildMutid ? dagball.mutidToCirc(this.childMutid) : childOrMutid;
	this.weight = weight;
};

dagball.Edge.prototype.type = 'dagball_edge';

//This is a dag datastruct cuz it points at circ.mutid, though technically it could store cycles, it should not.
//TODO store height in id to prevent that, or something like that? but height might vary of a mutid but not of an id/immutable.
dagball.Edge.prototype.toMap = function(){
	return {
		type: this.type,
		edgeType: this.edgeType,
		//TODO childId (the immutable form)? circ.id
		//childMutid: this.child.mutid, //circ.mutid
		childMutid: this.childMutid, //circ.mutid
		weight: this.weight,
	};
};

//This is tricky cuz if loaded before the circ then edge.child will be null, but it will have edge.childMutid either way.
//Edges should be DAG (no cycles) but thats not enforced here 2024-5-24. It will become necessary to enforce it when using circ.id (the immutable form) as it scales up later.
//TODO dedup these if theres already a fromCirc (dont know which one it is cuz thats in caller) and it has such an edge?
dagball.mapToEdge = function(map){
	if(map.type !== 'dagball_edge') Err('Not a dagball_edge: '+JSON.stringify(map));
	if(!map.edgeType) Err('No edgeType in map');
	if(!map.childMutid) Err('No childMutid in map');
	if(map.weight === undefined) Err('No weight in map');
	return new dagball.Edge(map.edgeType, map.childMutid, map.weight);
};

//called in a second pass after dagball.mapToEdge loads all the edges for all the circs. If !isForce then only replaces this.child if doesnt have one yet.
//in case circles was loaded in an order where circ.edgesOut[anInt].child===null but .childMutid is a string, so this looks up circ by that string and sets .child
dagball.Edge.prototype.updateChild = function(isForce){
	if(isForce || !this.child){
		this.child = dagball.mutidToCirc(this.childMutid);
	}
};

//simpler edge type between the vars of 1 or more gpucircs. Whichever Eds have the same y and x
//must hold those float/double vars equal (pos mostly, and also to some extent vel and velDecay).
//and their gradient is summed together not averaged.
//TODO should it be addY and addX instead of y and x, so dont have to change the edges when move the gpucirc?
//What about resizing the gpucirc. Lets just keep it as y and x and update them when move the gpucirc.
/*
redesignGpucircToHaveItsVarsOnItsPerimeterSoIsEasierToMoveAndResize

Problem is to compute hopfield max1000dimsinviewatonce we have to use a bounding circle that includes the circle
where it affects the curves AND all the vars.

They will already be separate vars, even when shared, in gpu, cuz of parr[o++] and o being (TODO) set just before
each next gpucircle in the generated code. If there are n duplicate vars, then they should all be set together and
their gradient is the sum of all their gradients (not the average).

I could display the gpufloat vars of each gpucirc as small circles on its perimeter, or 1/n of the length of its
perimeter each a different color. And hook them together with lines between them, which could get to be alot of lines,
or lines of 2 hops to a groupOfThatVar which has lines to/from all gpucircvaronperimeter that are held together in that
group. Another name for groupOfThatVar is leafvar if its below gpucirc in the dag. If groupOfThatVar is above gpucirc
in dag, then gpucirc is a leaf. None of that seems to fit exactly cuz the gpucircvaronperimeter and groupOfThatVar
seem to be on different levels in one way and the same level in another way.

What should happen if a gpucirc moves past its vars (which are each at a 2d position?) should it expand to still
contain them? Move them with it?

How can a gpucirc or small group of them that share some vars, be copy/pasted to another area of the 2d world?
I'll of course literally copy their data as json or something like that, then back to gpucirc objects.

Should a gpucirc have its vars on its perimeter and they be defined by (addY,addX) so gpucirc.y+gpucirc.childs[44].addY
would be where a line from its perimeter points to, and if any other lines from other gpucircs point there, they are
hooked together without a separate daglevel. so for each gpufloatvar in a gpucirc theres 3 floats: val, y, x.
(or val, addY, addX). Should these lines be different colors? Does edge weight matter for edgeType dim? Is it even
stored as an edge? If they should be different colors, which? Are they stored as
red green blue (or just a floatRGB?) per edge?
*/
dagball.Ed = function(fromCirc, y, x, pos, vel, velDecay){
	this.fromCirc = fromCirc; //the dagball.Circ this Ed is from. Its to a (y,x) position. Any other eds that are to the same (y,x) are connected.
	this.y = y;
	this.x = x;
	this.pos = pos; //TODO rename to p like in dagball.Dim
	this.vel = vel; //TODO rename to v like in dagball.Dim
	this.velDecay = velDecay; //FIXME is this used, or is it dfriction andOr global velocity decay, now is 2024-6-14.
	//TODO rename to vd like in dagball.Dim. FIXME remove this. velDecay is computed using dvelPtr and dfrictionPtr etc.
	//If its part of an ape array, then that range of ed indexs on circ perimeter should be selected by mouse and moved all at once,
	//so the same size of ape array in other circs can be put at the same 2d positions to connect them.
	//TODO fill in edGroups of a circ each time that circ's ape code changes, or the circ.text may be something other than ape code.

	//TODO mouse-draggable sliders, each displayed as a small ball sliding along the ed line.
	//These should each be 1 of the params of a dagball.apeFuncJs(apeCode)(...(this.sliders),this.pos) -> cpuAddsToPotentialEnergyInGradientFunc.
	//Each ed can have a different number of sliders. Default number is 0.
	//This might just be a parabola with 3 numbers: this.sliders[0]*(this.sliders[1]*(this.pos-this.sliders[2]))**2
	//or that could be reduced to 2 sliders but would want to display it as 3 of them anyways if so.
	//let sliders = []; //TODO should start empty, unless loaded from map/{} where its not empty.
	//let sliders = [Math.random()*2-1, Math.random()*2-1, Math.random()*2-1]; //FIXME this is a simple experiment
	this.sliderKnobs = [];

	//If nonnull then use this with this.sliders. (dagball.apeFuncJs(apeCode)+'')==apeCode,
	//so thats how you get the apeCode back to save ed.toMap() or maybe the apeCode
	//will be defined in gpucpu in circ.text by arrEdFunc and edFunc apeTypes?
	this.slidersFunc = null;

	this.edGroup = null;

	//temp vars that are written in a physics cycle (doPhysics) then affect this.pos and this.vel.
	//only if doDiffeq. Do not store these in json/toMap or send them across network, cuz they can be derived (except roundoff).
	this.dpos = this.dvel = this.dfriction = 0;
};
dagball.Ed.prototype.type = 'dagball_ed';

/*
//ed is displayed as a line. This is used for finding mouse clicks near the line, trying to click the line, and is close enough,
//but caller will probably exclude clicks that are on knob circles or when other lines are closer.
dagball.Ed.distanceToYX = function(y,x){
	let fromY = this.fromY();
	let fromX = this.fromX();
	//to this.y and this.x
	
	//write the rest of the function, point line distance...
};

const distanceToLineSegment = (pointY, pointX, fromY, fromX, toY, toX) => {
    const A = pointX - fromX;
    const B = pointY - fromY;
    const C = toX - fromX;
    const D = toY - fromY;

    const dot = A * C + B * D;
    const len_sq = C * C + D * D;
    let param = -1;
    if (len_sq != 0) { // in case of 0 length line
        param = dot / len_sq;
    }

    let xx, yy;

    if (param < 0) {
        xx = fromX;
        yy = fromY;
    } else if (param > 1) {
        xx = toX;
        yy = toY;
    } else {
        xx = fromX + param * C;
        yy = fromY + param * D;
    }

    const dx = pointX - xx;
    const dy = pointY - yy;
    return Math.sqrt(dx * dx + dy * dy);
};
*/

//pops up to have user edit this.slidersFunc
dagball.Ed.prototype.simpleEditKnobCode = function(){
	while(true){
		//FIXME this is likely going to annoy users at losing the text they typed in if it doesnt compile right away, so fix this UI.
		//Would be best to merge it into the ape code editor on the left instead of a popup.
		try{
			let textFromUser = prompt('Editing ed.slidersFunc. Delete all the text to not have sliders. Else edit Ap.js/ape code for a funcName? params... funcBody...',
				this.slidersFunc||(dagball.defaultSlidersFunc+''));
			if(textFromUser.length==0){
				this.slidersFunc = null;
				this.setNumKnobs(0);
			}else{
				this.slidersFunc = dagball.cachedApeFuncJs(textFromUser);
				this.setNumKnobs(this.slidersFunc.length-1); //-1 cuz last param is this.pos
			}
			return;
		}catch(e){
			alert('ERROR: '+e);
		}
	}
};

dagball.Ed.prototype.setNumKnobs = function(numKnobs){
	let nums = [];
	for(let i=0; i<numKnobs; i++){
		if(i<this.sliderKnobs.length){
			nums.push(this.sliderKnobs[i].val);
		}else{
			nums.push(Math.random()*2-1); //FIXME what range?
		}
	}
	this.bootSliderKnobs(nums, this.slidersFunc); //FIXME this changes colors, replaces the knobs. theres smaller change that could work for setNumKnobs.
};

//index in this.fromCirc.edsOut
//slow cuz linear search for this ed in its parent circ
dagball.Ed.prototype.indexInCirc = function(){
	return this.fromCirc.edsOut.indexOf(this);
};

dagball.Ed.prototype.fromY = function(){ //slow cuz linear search for this ed in its parent circ
	return this.fromCirc.eFromY(this.indexInCirc());
};

dagball.Ed.prototype.fromX = function(){ //slow cuz linear search for this ed in its parent circ
	return this.fromCirc.eFromX(this.indexInCirc());
};


/*
//a colored circle draggable with mouse. ed.sliders should be displayed as knobs
//that arent directly on the slider pole but are near it in a perpendicular direction
//so theres more screen space for mouse to grab them to start dragging along the pole (2024-6-3 thats been working for months).
//There might be other uses for them later too so Im generalizing into this class,
//and it simplifies detecting mouse touching it and might help with keeping multiple knobs
//from overlapping, considering other things on screen.
//TODO func for copying from gameState to knob, and from knob to gameState.
dagball.Knob = function(radius, y, x, red, green, blue){
	this.radius = radius;
	this.y = y;
	this.x = x;
	this.red = red;
	this.green = green;
	this.blue = blue;
};
//dagball.Knob.prototype.type = 'dagball_knob';
*/
dagball.EdSliderKnob = function(ed, sliderIndex, val, pixelRadius, y, x, red, green, blue){
	this.ed = ed;
	this.sliderIndex = sliderIndex;
	this.val = val; //this is replacement for ed.sliders[this.sliderIndex]
	this.pixelRadius = pixelRadius;
	//???TODO figure this out and update comments: I think (not sure anymore) (todo verify, as of 2024-6-3 and has been for months) that knob.y and knob.x are in units of pixels, not game coords. But eFromY etc code seems to imply its not. TODO figure out which. Just look at it in browser debugger and the size of the numbers will tell u.
	this.y = y; //set by code "edSliderKnob.y=(yOnPole + pixelsPerpendicular*perpendicularY)" in circ.display.
	this.x = x;
	this.red = red;
	this.green = green;
	this.blue = blue;
};
//toString returns this.val so you can use sliders the same as numbers in some cases, especially as params of ed.slidersFunc.
dagball.EdSliderKnob.prototype.toString = function(){
	return this.val;
};
/*This happens in circ.display instead: dagball.EdSliderKnob.prototype.paintOntoByteRect = function(byteRect){
	FIXMEFIXME
};*/

dagball.EdSliderKnob.prototype.dy = function(){
	return this.ed.y-this.ed.fromY();
};

dagball.EdSliderKnob.prototype.dx = function(){
	return this.ed.x-this.ed.fromX();
};

//returns [y,x] where y*y+x*x==1 except roundoff, a normed vector to dotProduct mouseDy mouseDx with for mouse dragging knob.
//Returns [0,1] if ed line length is 0.
dagball.EdSliderKnob.prototype.directionYX = function(){
	let dy = this.dy();
	let dx = this.dx();
	let len = Math.hypot(dy,dx);
	return len ? [dy/len, dx/len] : [0,1];
};

/*
//in game coordinates, where 1.0 distance is about 100 pixels at normal zoom, though zoom can extremely vary during play.
dagball.EdSliderKnob.prototype.touchesYX = function(y,x){
	Err('FIXME this radius appears 2024-1-16 to be in canvasPixel coordinates but dy and dx are in game coordinates');
	let dy = this.y-y;
	let dx = this.x-x;
	return dy*dy+dx*dx <= this.radius;
};*/
dagball.EdSliderKnob.prototype.radius = function(){
	return this.pixelRadius/dagball.aftrans.magnify();
};
dagball.EdSliderKnob.prototype.touchesYX = function(y,x){
	let dy = this.y-y;
	let dx = this.x-x;
	return dy*dy+dx*dx <= this.radius();
};

/*
//distance perpendicular to the ed line that this knobs center should move to.
//Start at the FROM end of the ed line (on circ perimeter) and look at ed positions there.
dagball.EdSliderKnob.prototype.choosePerpendicularDistance 
*/

//add this to potentialEnergy in gradient function, right after GPU returns (in some cases 2*numBalls*...) numDimensions+1 floats to CPU.
dagball.Ed.prototype.addToPoten = function(){
	//return this.slidersFunc ? this.slidersFunc(...this.sliders,this.pos) : 0;

	//EdSliderKnob.toString returns thisKnob.val so you can use sliders the same as numbers in some cases, especially as params of ed.slidersFunc.
	return this.slidersFunc ? this.slidersFunc(...(this.sliderKnobs),this.pos) : 0; //FIXME does that toString returning number thing work here?
};

dagball.Ed.prototype.influence = function(){
	return this.fromCirc.influence;
};

/* used in toJSON
edgesOut: this.edgesOut.map(e=>e.toMap()),
edsOut: this.edsOut.map(e=>e.toMap()),
dimsOut: this.dimsOut.map(d=>d.toMap()),
*/
dagball.Ed.prototype.toMap = function(){
	return {
		//dont include fromCirc cuz circ and its eds edges etc are jsoned together, and it creates a cycle.
		type: this.type,
		y: this.y,
		x: this.x,
		pos: this.pos,
		vel: this.vel,
		//sliders: this.sliders,
		sliders: this.sliderKnobs.map(k=>k.val),
		slidersFunc: this.slidersFunc ? (this.slidersFunc+'') : null,
		velDecay: this.velDecay,
		edGroup: null //FIXME?
	};
};

//listOfNums is val if "sliders" key in ed.toMap() and in a dagball game state containing many such eds,
//that each may have 0 or more numbers on its ed/slider pole. The knob states are not saved except knob.val.
dagball.Ed.prototype.bootSliderKnobs = function(listOfNums, slidersFunc){
	let radius  = 6;
	//let y = this.y+Math.random()*30; //FIXME
	//let x = this.x+Math.random()*30; //FIXME
	/*let red = dagball.randByte();
	let green = dagball.randByte();
	let blue = dagball.randByte();
	this.sliderKnobs = listOfNums.map((val,index)=>(new dagball.EdSliderKnob(this,index,val, radius, y, x, red, green, blue)));
	*/
	let indexToRed = i=>([1,1,170][i] || dagball.randByte());
	let indexToGreen = i=>([200,1,1][i] || dagball.randByte());
	let indexToBlue = i=>([1,255,1][i] || dagball.randByte());
	this.sliderKnobs = listOfNums.map((val,index)=>(new dagball.EdSliderKnob(this,index,val, radius,
		this.y+Math.random()*30, this.x+Math.random()*30,
		indexToRed(index), indexToGreen(index), indexToBlue(index))));
		//dagball.randByte(), dagball.randByte(), dagball.randByte())));

	//this.slidersFunc = dagball.apeFuncJs('{func? {ave float} {range float} {strength float} (funcReturn )}');
	//dagball.circles[1].edsOut[0].slidersFunc = dagball.apeFuncJs('{func? {ave float} {strength float} {pos float} (funcReturn (* strength (** (- pos ave) 2)))}');
	this.slidersFunc = slidersFunc || null;
	//this.slidersFunc = dagball.apeFuncJs('{func? {ave float} {strength float} {pos float} (funcReturn (* strength (** (- pos ave) 2)))}'); //simple parabola. TODO flat space between with simpler param
};

/*dagball.allEdSliderKnobs = function*(){
	for(let circ of dagball.circles){
		for(let ed of circ.edsOut){
			for(let knob of ed.sliderKnobs){
				yield knob;
			}
		}
	}
};*/
dagball.allEdSliderKnobs = function(){
	let ret = [];
	for(let circ of dagball.circles){
		for(let ed of circ.edsOut){
			for(let knob of ed.sliderKnobs){
				ret.push(knob);
			}
		}
	}
	return ret;
};

dagball.searchCircs = function(query){
	let ret = [];
	for(let circ of dagball.circles){
		if(query(circ)){
			ret.push(circ);
		}
	}
	return ret;
};

dagball.searchEds = function(query){
	let ret = [];
	for(let circ of dagball.circles){ //FIXME should this be the circs in dagball.view or all of them in dagball.circles?
		for(let ed of circ.edsOut){
			if(query(ed)){
				ret.push(ed);
			}
		}
	}
	return ret;
};

dagball.selectedEds = ()=>dagball.searchEds(ed=>ed.isSelected());


//An EdJoint holds multiple dagball.Ed's .pos and .vel together by weightedAveraging (by ed.influence()) those together,
//and similarly weightedSums (not weightedAverages, TODO how does that work) their ed.gradient together. Gradient is summed. Pos and vel are averaged.
//Then the doPhysics calculation does its usual thing of adding -dt*gradient to velocities and adding dt*velocity to position.
//Its a way to use multiple eds (lines from multiple dagball.Circs that point at the same (y,x)) as a single ed, with pos and vel float vars,
//so circs can share vars to flow high dimensional simulated physical force through them.
//
//primaryKey is (y,x) and it has a set of dagball.Ed's whose ed.y and ed.x are exactly the same (snap to grid so its easier to drag the ed lines together).
//It is weighted by ed.influence() (TODO) which should be that ed's circ.influence.
dagball.EdJoint = function(y, x){
	this.y = y; //display and EdJoint_merge them by roundToEdSnapGrid but let it be loose (any float32) in ed.y and ed.x
	this.x = x;
	this.eds = new Set(); //set of eds whose ed.y and ed.x are this.y and this.x.
	this.sumWeights = 0; //sum of ed.influence() which probably just returns that ed's circ's influence.
	this.weightedSumPos = 0; //set all ed.pos in this EdJoint to this.weightedSumPos/this.sumOfWeights
	this.weightedSumVel = 0; //set all ed.vel in this EdJoint to this.weightedSumVel/this.sumOfWeights
	this.weightedSumGradient = 0; //FIXME how to sum gradients (instdead of average them) if influence varies?
	//throw new Error('FIXME how to do weightedSumPos and weightedSumGradient as sum')
	this.red = 0; //TODO?
	this.green = 0; //TODO?
	this.blue = 0; //TODO?
	this.text = ''; //TODO?
};

dagball.EdJoint.prototype.type = 'dagball_edjoint';

dagball.EdJoint.prototype.toMap = function(){
	return {
		type: this.type,
		y: this.y, //(y,x) is primaryKey of EdJoint.
		x: this.x
		//dont include the eds since those get included in circ.
	};
};

//a group of dagball.Ed's at the same ed.y and ed.x. This is displayed as lines from the perimenter of multiple dagball.Circ's
//pointing at the same (y,x) on screen. Those vars (ed.pos and ed.vel) are held to equal eachother. Its like connecting circs with wires.
dagball.EdJoint.prototype.updateSelfAndEds = function(){


	//FIXME updateSelfAndEds must do the same thing with dpos dvel and dfriction as it does with gradient. 2023-12-17 its not doing that yet, so connected eds wont transfer that as well between circs.


	this.sumWeights = 0;
	this.weightedSumPos = 0;
	this.weightedSumVel = 0;
	this.weightedSumGradient = 0;
	for(let ed of this.eds){ //eds -> EdJoint
		let weight = ed.influence(); //2023-11-23 this is always same as circ.influence the ed is in
		this.sumWeights += weight;
		this.weightedSumPos += weight*ed.pos;
		this.weightedSumVel += weight*ed.vel;
		this.weightedSumGradient += weight*ed.gradient;
	}
	if(this.sumWeights == 0){
		throw new Error('TODO what to do if sumWeights == 0?');
	}
	let setAllPosTo = this.weightedSumPos/this.sumWeights;
	let setAllVelTo = this.weightedSumVel/this.sumWeights;
	let setAllGradientsTo = this.weightedSumGradient/this.sumWeights * this.eds.size; //let setAllGradientTo = this.weightedSumGradient/this.sumWeights; //FIXME gradient has to be sum of all gradients. If all weights/circInfluence are 1, then this.eds.size/this.sumWeights is 1 so its a simple unweighted sum.
	for(let ed of this.eds){ //EdJoint -> eds
		ed.pos = setAllPosTo;
		ed.vel = setAllVelTo;
		ed.gradient = setAllGradientsTo;
	}
};

//the lines from circs point anywhhere smoothly (any float32) but snap to a grid so they're easier
//to connect together (to use the mouse to move lines from multiple circs to point at same (y,x)).
dagball.Ed.prototype.yxSnapId = function(){
	return dagball.roundToEdSnapGrid(this.y)+'_'+dagball.roundToEdSnapGrid(this.x);
};

//returns EdJoints in same order the first ed occurs in param listOfEds. Makes new EdJoints.
dagball.listOfEdsToListOfEdJoints = function(listOfEds){
	//display and EdJoint_merge them by roundToEdSnapGrid but let it be loose (any float32) in ed.y and ed.x
	//let yxSnapId = ed=>(ed.y+'_'+ed.x); //primaryKey of EdJoint, but multiple Eds can share it.
	let yxSnapIdToEdJoint = {};
	let ejs = [];
	for(let ed of listOfEds){
		let yx = ed.yxSnapId();
		let ej = yxSnapIdToEdJoint[yx];
		if(!ej){
			ej = new dagball.EdJoint(ed.y, ed.x);
			yxSnapIdToEdJoint[yx] = ej;
			ejs.push(ej);
		}
		ej.eds.add(ed);
	}
	return ejs;
};

//called right after updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient in doPhysics to update ed.pos and ed.vel based on 1 EdJoint per (y,x), with 0 or more eds at that (y,x)
dagball.updateEdsByEdJoints = function(edsInThoseEdGroups){
	let edJoints = dagball.listOfEdsToListOfEdJoints(edsInThoseEdGroups);
	dagball.debug.lastEdJoints = edJoints;
	for(let ej of edJoints){
		ej.updateSelfAndEds();
	}
	//Err('create dagball.EdJoints for those eds (match by (y,x)) then use those EdJoints to update ed.pos and ed.vel, edsInThoseEdGroups.length='+edsInThoseEdGroups.length);
};

//2024-6-3 this has been working for lots of months and I often move EdGroups by holding a keyboard button and moving mouse after
//selecting the edgroup on circ perimeter by angle and theres another button to move just 1 ed at a time similarly.
//2023-11-11 coding this (incomplete): edGroup.apeArrayName is an ape.Name()/ape.name created by View.updateLocalFields when merging
//the Ap.Ape code in circ.text of multiple circs into a single Ap.Ape and single Ap.Call (whose call.ape is that).
//Each circ has 0 or more ape arrays. For each ape array there is at most 1 EdGroup (0 if its not displayed).
//An EdGroup is a range of dagball.Ed objects in a circ's circ.edsOut, that when mouse is near it visually selects those lines
//around part of the circ's perimeter. If multiple circles have their lines go to the same 2d point (Ed.y and Ed.x)
//then TODO dagball uses those as the same float variable despite they are stil multiple float vars in GLSL/GPU code
//and merged by CPU after GPU returns a Float32Array. Mouse can move a whole EdGroup around at once and it snaps to a grid for
//easier connecting it to EdGroups of the same size of other circs. TODO also a way to connect individual eds/lines
//even if they're in an edgroup, and other combos.
//A circ's circ.text can change (to 'ape:' or 'txt:' or other prefixes then text), so this might get out of sync. FIXME.
//
//eds from the same dagball.Circ that are normally in the same dagball.Ape array. I say normally instead of always
//cuz it can get out of sync while editing circ.txt (code that may start with "ape:") to have a different number of ape arrays of sizes of each,
//so different eds would be in those arrays, but to avoid losing the data of which eds point at which (y,x), it might be left as it is. TODO.
//The comment param might be the name or tostring of the ape array, or just a random string. It will appear when moving an edgroup with mouse near
//the parts of that circ's perimeter that is proportional to the number of eds in that edgroup.
dagball.EdGroup = function(comment, apeArrayName, eds){
	this.apeArrayName = apeArrayName;
	if(!eds.length){
		throw new Error('Empty edgroup');
	}
	this.comment = comment;
	this.eds = eds;
	for(let ed of eds){
		ed.edGroup = this;
	}
	this.fromCirc = eds[0].fromCirc;
	this.isSelected = false;
};

dagball.EdGroup.prototype.size = function(){
	return this.eds.length;
};

dagball.EdGroup.prototype.toString = function(){
	return '[EdGroup size='+this.eds.length+' comment['+this.comment+']]'
};

//2024-6-3 this is so far only used in dagball.RbmLayer.
//shape is a [] or Int32Array, whose contents multiplies to floats.length and each int is at least 1.
dagball.DenseTensor = function(shape, floats){
	this.shape = shape;
	this.floats = floats;
};

//x ranges 0 (inclusive) to this.shape[2] (exclusive).
//Returns a linear interpolation between 2 floats near eachother in 1d. Could do sound interpolation, for example.
dagball.DenseTensor.prototype.linearInterpolate = function(x){
	throw new Error('TODO');
};

//y ranges 0 (inclusive) to this.shape[0] (exclusive).
//x ranges 0 (inclusive) to this.shape[1] (exclusive).
//Returns a bilinear interpolation between 4 floats near eachother in 2d. Could do rule110 as a convolutional scalar field, for example.
dagball.DenseTensor.prototype.bilinearInterpolate = function(y, x){
	throw new Error('TODO');
};

//z ranges 0 (inclusive) to this.shape[0] (exclusive).
//y ranges 0 (inclusive) to this.shape[1] (exclusive).
//x ranges 0 (inclusive) to this.shape[2] (exclusive).
//Returns a trilinear interpolation between 4 floats near eachother in 3d. Could do conways game of life as a convolutional scalar field, for example.
dagball.DenseTensor.prototype.trilinearInterpolate = function(z, y, x){
	throw new Error('TODO');
};

/*Dagball can have cellular automata 
like smoothlife, rule110 convfield, etc
after separate ape lang from dagball.
...
Can physicsmata multi radius 
cellular automata
be gpu optimized,
a variant of it that does poten gradients?
Cumulative sum of brightness atmost r
radius from each point normed divide by r.
so maybe 10 nums in 1 num out the poten.
In cpu could keep 10 nums per pixel
and add epsilon to those around self.
Do about 500 poten calculations per pixel
similar to how gradient is
calculated in rule110 convfield.
Upgrade Tinyglsl to bigMem apetype
and put pixel states there.
also rgb per radius.
..
Define poten on 15x15 floats.
Define gradient dim on 29x29 floats,
the cell in its center, with a 15x15
computed 15x15x2 times aka 450 times
per cell.
Use bigmem to copy 29x29 floats
into localPar mem then use normal
ape code to compute gradient per pixel.
Then update velocity per pucel
and do velocity decay and display.
Neural poten cellular automata.
Rule is any 225 dimensional
const scalarfield.
...
I can have a 9x9 (in 17x17) in color
or 15x15 (in 29x29) monochrome.
4 vs 7 pixels outward.
I choose 15x15 to start with.
..
Define manifold
as bilinear between big pixels.
Roll balls on it.
..
Make a gpucirc with nxn eds
such as 200x200 or 120x120
or 80x80.
Connect it to the comboned poten
of the whole game.
Make another gpucirc that partially
overlaps it with a diff cellmata algorithm.
Infer between them.
Only poten based convfields, not timeful.
...
Start with rule110 convfield bilinear.

convolutional scalar field based cellular automata state. code is a string that normally starts with 'ape:'.


[[
2023-10-19 https://twitter.com/DagBallGame/status/1715026910982357412
DagBall - 1000 dimensional hackerspace
@DagBallGame
I guess GLSL can efficiently sim a category of cellular automata, up to 15x15=225 dimensional scalarField convolved (convolutional) over big 2d area. Gradient of each cell can be computed by the 29x29=841 cells around it, doing that 225 dimensional calculation 2x15x15=450 times.
11:27 AM · Oct 19, 2023
·
16
 Views
View post engagements

DagBall - 1000 dimensional hackerspace
@DagBallGame
·
56s
Ive verified convolutional scalar field cellular automata math in general. Im sure can compute the EXACT 1 million dimensional gradient in a 1000x1000 cellular automata game board (except 15 cell thick border around the edges) sparsely. How fast, Im unsure https://memecombinator.io/experiments/ConvFieldDemo3.html
Lambda Rick /acc
@benrayfield
·
12m
In terms of NP math, this could directly do 225-SAT constraints (like rule110 is a convolutional 4-SAT), simple neuralnets with 225 input nodes, circles, sine waves, and generally any curve dagball can make.
en.wikipedia.org
SAT solver - Wikipedia
]]
*/
dagball.CellmataState = function(posTensor, velTensor, influenceTensor, aftrans, convShape, code){
	this.aftrans = aftrans; //game coordinates. TODO am i the sizes in my tensor or normed to size 1?
	this.pos = posTensor;
	this.vel = velTensor;
	this.influence = influenceTensor; //For example, if you mark a circular area as having influence but outside the circle (near corners) no influence.
	this.velDecay = 0; //per second
	//A [] or Int32Array, such as 2x3 if its rule110 or 23x3 if its conways game of life.
	//Code takes this many input floats and returns 1 output float, the gradient of the center pixel.
	//Automatically that is computed many places in parallel.
	//In each GPU thread its for example computed 2x15x15=450 times on 29x29 floats
	//to compute the gradient of the center cell of that 29x29.
	this.convShape = convShape;
	this.code = code;
};

//as of 2024-2-6 this has not been used or only once or twice in some example circs, dont remember much about it,
//but it is here for math completeness in case I want to use it later. Maybe its better to stick with dagball.Ed?
//
//A scalarField dimensions with position, velocity, and velocityDecay.
//Might also want to use it with harmonySearch to get out of localMinimums, in some more advanced uses.
//
//This is the sparse form of dagball.Circ.edsOut since these go in dagball.Circ.dims which is a {} of varName to dagball.Dim
//used when that dagball.Circ.text starts with 'javascript:' and takes a {} of otherVarName to dagball.Dim,
//such as the text 'p=>((p.width.v-2*p.height.v)**2)' defines a 2d scalarfield thats lowest where width=2*height
//for some arbitrary vars width and height, like if you wanted to use it as an alternative to css flexlayout
//or to position circs on screen etc.
//
//Other scalarField math is in benrayfield's Rule110 Convolutional Scalar Field math (4sat solver that converges to rule110)
//and the wikibinator203 directedGraph tree UI with the spring-like (but more flexible cuz it also puts
//potentialEnergy on which things are left/right up/down of eachother etc).
//and then there was the "Automatic scheduling of many referees with constraints by a single equation." video on youtube of a system benrayfield made.
//
dagball.Dim = function(p, v, vd, optionalId){

	//FIXME. id should start with the syncType letter [s for swarm. c for const. p for pubkey] BUT since i (what was i gonna write?...).
	//dagball.Dim and dagball.Ed are similar in that both have position, velocity, and velocityDecay,
	//but since dagball.Dim is extra sparse it needs an id, and dagball.Ed only exists as child of a specific dagball.Circ and has only that 1 parent.
	//FIXME some code 
	this.id = optionalId || dagball.nextDimId();

	this.p = p || 0; //position
	this.v = v || 0; //velocity
	this.vd = vd || 0; //velocity decay.
	//TODO use same var name between dagball.Ed and dagball.Dim, which both have position, velocity, and velocityDecay but name them differently.
	//The 0 or more dagball.Circs whose Object.values(circ.dimsOut) contains this dagball.Dim, normally only those with circ.text starting with 'javascriptDimFunc:' or something like that (TODO).
	this.ircs = new Set(); //this.circs = new Set(); //TODO rename this to something that means it can contain both dagball.Circs and dagball.Dircs, maybe .ircs
};
dagball.Dim.prototype.type = 'dagball_dim';
dagball.Dim.prototype.syncType = 'swarm';
//potentialEnergy aka scalar field height. this.v is velocity so kineticEnergy is derived from velocity that goes with height/potentialEnergy.

dagball.Dim.prototype.toMap = function(){
	return {
		id: this.id, //FIXME if its from dagball.nextDimId() thats not a global id, but optionalId might be.
		p: this.p, //pos
		v: this.v, //vel
		vd: this.vd, //velDecay
		//ircs: TODO hook that together later. derived from which circs have this
	};
};

dagball.Dim.prototype.poten = function(){
	let poten = 0;
	for(let circ of this.circs){
		poten += circ.dimsPoten(); //FIXME multiply by circ.influence or do that in dimsPoten func?
	}
	return poten;
};
dagball.Dim.prototype.gradient = function(){
	let epsilon = dagball.game.floatEpsilon; //FIXME should this be a double epsilon (smaller cuz it can handle more digits? cuz js in CPU uses double. GLSL normally uses float32.).
	let prevP = this.p;
	let potenAsIs = this.poten();
	this.p += epsilon;
	let potenIfAddEpsilon = this.poten();
	this.p = prevP;
	return (potenIfAddEpsilon-potenAsIs)/epsilon; //this fact of math is explained in https://en.wikipedia.org/wiki/Fundamental_theorem_of_calculus
};

//as of 2024-2-6 this has not been used or only once or twice in some example circs, dont remember much about it,
//but it is here for math completeness in case I want to use it later. Maybe its better to stick with dagball.Ed?
//
//Dim(ension) specialized cIRCle. For efficiency, like a Circ but without the extra fields in circ. Has dimsPoten func, like circ does, but not much else.
//The dimsPoten func is defined farther below in the Circ code where it sets both to the same function.
//"dagball.Dirc.prototype.dimsPoten = dagball.Circ.prototype.dimsPoten = function(){".
//
//TODO 2024-1-14+ maybe dagball.Dirc and dagball.apeFuncJs(apeCode) should be merged or stuff built about the combo
//of them or something? dirc hasnt been used yet in this software but is just general gradient-descent/negative-hillclimbing.
//
dagball.Dirc = function(text, influence, dimsOut){
	//normally starts with 'javascriptDimFunc:' or something like that (TODO use it with cachedEval so only eval the same code string once)
	//Example: 'javascriptDimFunc:p=>((p.width.v-2*p.height.v)**2)'.
	this.text = text;
	this.influence = influence; //TODO multiply poten by this.influence? circ.influence dirc.influence
	//this.cachedEval_ = null; //TODO use cachedEval so only eval the same code string once
	//Example: {width: new dagball.Dim(34), height: new dagball.Dim(56.7), otherVar: new dagball.Dim(0)}
	this.dimsOut = dimsOut;
	this.addToDimsOut();
};
dagball.Dirc.prototype.type = 'dagball_dirc';

//2024-2-25 is this being used? new dagball.Ball(id, dagball.ballIdToFindOrMakeOb(id)) is missing alot of constructor params.
//2024-1-21 these ids are just made up strings like 'sBall5', not wikibinator lambdas, but maybe someday they will be.
//find or create the 1 instance of dagball.Ball with that id.
//Depending on the id, this may create or lookup a wikibinator lambda (if dagball.getWikibinator203VM() is not null)
//Remember, all ids start with 1 char to say the syncType. See dagball.syncTypeToChar.
dagball.ball = function(id){
	let b = dagball.balls[id];
	if(!b){
		b = new dagball.Ball(id, dagball.ballIdToFindOrMakeOb(id));
		b.y = (Math.random()*2-1)*1.2; //FIXME what range?
		b.x = (Math.random()*2-1)*1.2; //FIXME what range?
	}
	return b;
};

//TODO use axgob instead of wikibinator.
//string form of the id
//
//Example 2023-10-25 on browser commandline run this: Pair(S)(T).n.id()
//to get this: 'λ000189f5fdffffffea7fee5519df4afdfd1f4338078a68a3f06943e16af62544'
//(small changes in id algorithm will change that whole 24 bytes of hash so wait for the id algorithm to be decided completely?
//That id is likely missing some of the header bits for wvm.mask_* but the ids are almost done. They can be used now but might change.
//
/* From https://github.com/benrayfield/wikibinator203/blob/main/Wikibinator203VM.js 2023-10-25:
//Similar to the solve op, (import idMaker id)-> any x where (idMaker x)->id. Use (import idMaker) as the import func for that kind of id.
//Any lambda can be an idMaker if when called on any lambda it always halts and returns the same size of bits such as always 256 bits or always 512 bits,
//and the first byte should mean the same thing among all possible kinds of ids to make it easy to parse evilBit and literals.
vm.import = function(idMaker, globalIdStringOrBits){
	throw 'TODO instantly return a Node that it tries to load async, especially if Node.L() or Node.R() etc are called on it? So can run this in a loop for efficient batch loading of nodes/lambdas?';
};
*/
dagball.loadWikibinatorLambdaById = function(id){
	//FIXME either derive the id maker as a wikibinator lambda
	//or add it as (Plug marklar203bId) this way: vm.eval('(Plug marklar203bId)').n.pushEvaler((vm,func,param)=>{ if(vm.mask_allowOther) return vm.marklar203bId(param); else vm.infloop(); })
	let wvm = dagball.getWikibinator203VM(); //TODO wikibinator2033 meaning 203.3 release (todo 2023-10-25 the last release is 203.2)
	if(!wvm){
		throw new Error('No wikibinator VM found');
	}
	if(!dagball.wikibIdMaker){
		dagball.wikibIdMaker = vm.eval('(Plug marklar203bId)');
		if(dagball.wikibIdMaker.getEvaler() === wvm.evalers.rootEvaler){
			dagball.wikibIdMaker.n.pushEvaler((vm,func,param)=>{
				if(vm.mask_allowOther) return vm.marklar203bId(param); //hook in the existing id maker thats part of the VM so wikibinator lambdas can see it as a plugin
				else vm.infloop();
			});
		}
	}
	//return wvm.import(null, id);
	return wvm.import(dagball.wikibIdMaker, id);
};

dagball.ballIdToFindOrMakeOb = function(id){
	/*syncTypeToChar: {
		const: 'c', //dag recursion only self and knowing the ids of childs, not recursive. use w/wikibinator lambda (in dagball.Ball objects for recursion and DAG stuff).
		wikibinator: 'λ', //'w', //id of the ball that wraps a wikibinator lambda of the id following the w, or maybe wSomenameThewikibinatoridhere234234234. like const but with deep recursion. const is normally isolated to self and listing the child ids but doesnt have to find those childs.
		pubkey: 'p',
		swarm: 's',
		unknown: 'u', //FIXME this should only be used while changing the dagball VM code in case new syncTypes are added later or cant figure it out at the time. This is not a permanent solution.
	},
	*/
	if(id.startsWith('λ')){ //Example: is the id of (Pair S T) as of 2023-10-25 but might be missing a few bits of wvm.mask_* etc so ids might change later. Keep the prefix of λ which is the 'wikibinator' synctype.
		return dagball.loadWikibinatorLambdaById(id);
	}else{
		return null;
	}
};

//TODO use axgob instead of this. Each axgob has p v kv etc vars.
dagball.newLazyVecVal = ()=>Ap.noProto({p:0, v:0, dp:0, dv:0, kv:0});

//starts empty. lazyEvals any field read to start as dagball.newLazyVecVal().
//Example: let vec = dagball.newLazyVec(); vec.supermana.p = 5.1; vec.mana.p += vec.supermana.p*5.1;
//While its pointless to add 0 to 0, 
dagball.newLazyVec = ()=>(new Proxy(Ap.noProto({}),dagball.lazyVecProxyHandler));

//[lazyVec,mapThatItWraps]
dagball.newLazyVecAndMap = ()=>{
	let map = Ap.noProto({});
	return [new Proxy(map,dagball.lazyVecProxyHandler),map];
};

dagball.lazyVecKeys = lazyVec=>Reflect.ownKeys(lazyVec);

/*
//avoids creating the key toJSON
dagball.lazyVectoJSON = lazyVec=>{
	let json = '{';
	for(let key of dagball.lazyVecKeys(lazyVec)){
		if(json.length > 1) json += ',';
		json += key+':'+lazyVec[key];
	}
	json += '}';
	return json;
};*/

//get a copy, maybe for converting to json.
//This avoids JSON.stringify behavior of reading lazyVec.toJSON which creates a value for that.
dagball.lazyVecToMap = lazyVec=>{
	let map = {};
	for(let key of dagball.lazyVecKeys(lazyVec)){
		map[key] = lazyVec[key];
	}
	return map;
};

dagball.lazyVecProxyHandler = {
	get: function(target, prop, receiver){
		let ret = target[prop];
		if(ret === undefined){
			ret = target[prop] = dagball.newLazyVecVal();
		}
		return ret;
	}
};

/*dagball.lazyVecProxy = {
	get: function(target, prop, receiver){
		let ret = target[prop];
		if(ret === undefined){
			ret = target[prop] = dagball.newLazyVecVal();
		}
		return ret;
		//if(!(prop in target)){
		//	target[prop] = dagball.newLazyVecVal();
		//}
		//return target[prop];
		//if(prop === "message2") {
		//	return "world";
		//}
		//return Reflect.get(target, propertyKey, receiver) //receiver is normally the Proxy
	}
};*/

//does it start with a capital A to Z?
dagball.AZ = function(str){
	return /^[A-Z]/.test(str);
};

//Its too slow, use gob.E('key') instead. 
//This is a calculus system for all pairs of near gobs, where reading gob.crazyMonkeyDv auto creates:
//crazyMonkeyP (position) crazyMonkeyV (velocity) crazyMonkeyDp (derivative of position)
//crazyMonkeyDv (derivative of velocity) crazyMonkeyKv (velocity decay), auto created by typ
//https://twitter.com/DagBallGame/status/1762546153600507918/photo/1
//
//Example: gob.life returns gob.e.life.p, unless gob.life was set to something else
dagball.gobProxyHandler = {
	get: function(target, prop, receiver){
		if(prop === Symbol.toPrimitive){
			return target[prop]; //dont interfere with toString
		}
		let ret = target[prop];
		if(ret === undefined){
			//FIXME these checks for ending with Dp Dv Kv P or V might make it too slow,
			//in which case should remove this code and use b.e.mana.dp instead of b.manaDp
			/*prop = prop.toString();
			if(prop.endsWith('Dp')){
				ret = target.e[prop.substring(0,prop.length-2)].dp;
			}else if(prop.endsWith('Dv')){
				ret = target.e[prop.substring(0,prop.length-2)].dv;
			}else if(prop.endsWith('Kv')){
				ret = target.e[prop.substring(0,prop.length-2)].kv;
			}else if(prop.endsWith('P')){
				ret = target.e[prop.substring(0,prop.length-1)].p;
			}else if(prop.endsWith('V')){
				ret = target.e[prop.substring(0,prop.length-1)].v;
			}else{
				ret = target.e[prop].p;
			}*/
			ret = target.e[prop].p;
		}
		return ret;
	},
	set: function(target, prop, value){
		if(prop in target){
			target[prop] = value;
			return true; //success
		}
		if(typeof(value) == 'number'){
			//FIXME these checks for ending with Dp Dv Kv P or V might make it too slow,
			//in which case should remove this code and use b.e.mana.dp instead of b.manaDp
			/*prop = prop.toString();
			if(prop.endsWith('Dp')){
				target.e[prop.substring(0,prop.length-2)].dp = value;
			}else if(prop.endsWith('Dv')){
				target.e[prop.substring(0,prop.length-2)].dv = value;
			}else if(prop.endsWith('Kv')){
				target.e[prop.substring(0,prop.length-2)].kv = value;
			}else if(prop.endsWith('P')){
				target.e[prop.substring(0,prop.length-1)].p = value;
			}else if(prop.endsWith('V')){
				target.e[prop.substring(0,prop.length-1)].v = value;
			}else{
				target.e[prop].p = value; //creates a {p:0,v:0,...} then sets p in it.
			}*/
			target.e[prop].p = value; //creates a {p:0,v:0,...} then sets p in it.
		}else{
			target[prop] = value; //create new prop/field in target
		}
		return true; //success
		/*if(prop in target.E){
			target.E[prop].p = value;
		}
		target[prop] = value; //create new prop/field in target
		return true; //success
		*/
	}
};

//modifies lazyVecVal and returns it.
dagball.removeDpDvEtc = vecMap=>{
	for(let key in vecMap){
		let val = vecMap[key];
		if(!val.dp) delete val.dp;
		if(!val.dv) delete val.dv;
		if(!val.kv) delete val.kv;
	}
	return vecMap;
};

//new dagball.Gob(...) wraps itself in new Proxy(new dagball.Gob(...),dagball.gobProxyHandler)
//so gob.varName returns gob.e[varName].p such as gob.life gob.y gob.x gob.mana.
dagball.Gob = function(optionalWrapMe, optionalMutid, optionalTeam, optionalPic){
	this.mutid = optionalMutid || dagball.nextGobId();
	this.w = optionalWrapMe!==undefined ? optionalWrapMe : null; //If this gob wraps another object, put it here
	
	//FIXME move gob.team into gob.e.team.p aka teamBp teamBap teamBzp
	this.team = optionalTeam!==undefined ? optionalTeam :
		dagball.randInt(dagball.numTournamentColors()); //FIXME
	
	this.pic = optionalPic || dagball.randomGobPic();
	
	//e is vEctor. TODO make it auto get a new {p:0, v:0, dp:0, dv:0, kv:0} if you read this.e.somethingThatIsntThere.
	//e.varName55 = {p:0, v:0, dp:0, dv:0, kv:0} for any var name such as varName55.
	//Use this.E('varName55').p for position of varName55 for example.
	//p is position. v is velocity. Those are game state.
	//dp is derivative/change of p. dv is derivative/change of v except the kv part.
	//kv is decay (remember it by deKay) of v.
	//dp, dv, and kv are generated once per physics cycle and are temp calculations, not game state.
	//dp, dv, and kv start at 0 then many pairs of gobs are updated, then p and v are updated based on dp, dv, and kv.
	//
	//Repeat per physics cycle:
	//let newP = p+(dp+v)*dt;
	//let newV = v*Math.exp(-dt*kv)+dv;
	//p = newP;
	//v = newV;
	//dp = dv = kv = 0;
	//
	//this.e = Ap.noProto({});
	//this.E('y');	
	//this.E('x');
	//this.E('life');
	//this.E('mana');
	//let lazyVecAndMap = dagball.newLazyVecAndMap();
	//this.e = lazyVecAndMap[0]; //lazyVec
	//this.E = lazyVecAndMap[1]; //map it wraps
	this.displayText = '';
	this.e = {}; //filled by this.E('varName') which starts as {p:0, v:0, dp:0, dv:0, kv:0}
	this.E('x',dagball.randRange(-5,5)); //FIXME
	this.E('y',dagball.randRange(-5,5)); //FIXME
	this.E('z',dagball.randRange(-5,5)); //FIXME
	this.E('life',1); //FIXME
	this.E('mana',1); //FIXME
	
	//no more auto create varnames in this.e by Proxy cuz its too slow, use .E('varName',optionalDefaultPosition) instead.
	//this.e.y; //starts as p 0 v 0
	//this.e.x;
	//this.e.y.p = dagball.randRange(-5,5); //FIXME
	//this.e.x.p = dagball.randRange(-5,5); //FIXME
	//this.e.life.p = 1;
	//this.e.mana.p = 1;
	//this.toString = function(){ return this.toJSON(); };
	//return new Proxy(this, dagball.gobProxyHandler);
};

dagball.gobNewVal = (optionalFirstP,optionalFirstV)=>(
	{p:optionalFirstP||0, v:0, dp:0, dv:0, kv:0, ap:-Infinity, zp:Infinity ,av:-Infinity, zv:Infinity});

//creates it if not found
dagball.Gob.prototype.E = function(varName,optionalFirstP,optionalFirstV){
	return this.e[varName] || (this.e[varName] = dagball.gobNewVal(optionalFirstP,optionalFirstV));
};

//read or write p (position) of that varName
dagball.Gob.prototype.p = function(varName,write){
	let val = this.E(varName,write,0); //varName defaultPosition defaultVelocity
	if(write!==undefined){
		return val.p = write;
	}else{
		return val.p;
	}		
};

//read or write v (velocity) of that varName
dagball.Gob.prototype.v = function(varName,write){
	let val = this.E(varName,0,write); //varName defaultPosition defaultVelocity
	if(write!==undefined){
		return val.v = write;
	}else{
		return val.v;
	}
		
};

//add to dv of that varName aka change of velocity per time aka acceleration (other than kv)
dagball.Gob.prototype.dv = function(varName,add){
	this.E(varName).dv += add;
};

//add to dp of that varName aka change of position per time (used for things like chuas circuit which has 3 vars of state and no velocity state)
dagball.Gob.prototype.dp = function(varName,add){
	this.E(varName).dp += add;
};

//add to kv of that varName aka velocityDecay (other than dv)
dagball.Gob.prototype.kv = function(varName,add){
	this.E(varName).dp += add;
};

dagball.Gob.prototype.ap = function(varName,raiseApToAtLeast){
	let val = this.E(varName);
	val.ap = Math.max(val.ap, raiseApToAtLeast);
};

dagball.Gob.prototype.av = function(varName,raiseAvToAtLeast){
	let val = this.E(varName);
	val.av = Math.max(val.av, raiseAvToAtLeast);
};

dagball.Gob.prototype.zp = function(varName,lowerZpToAtMost){
	let val = this.E(varName);
	val.zp = Math.min(lowerZpToAtMost, val.zp);
};

dagball.Gob.prototype.zv = function(varName,lowerZvToAtMost){
	let val = this.E(varName);
	val.av = Math.min(lowerZvToAtMost, val.zv);
};

//set p to the given val unless this has been called with a different val in which case it will fail at end of physics cycle
//cuz ap can only rise and zp can only fall, and if ap becomes more than zp, thats inconsistent. They get set to ap=-Infinity and zp=Infinity
//at start of each physics cycle. By only increasing ap and only decreasing zp, the order of calling a ruleBCDt has no effect.
dagball.Gob.prototype.azp = function(varName,setPTo){
	let val = this.E(varName);
	val.ap = Math.max(val.ap, setPTo);
	val.zp = Math.min(setPTo, val.zp);
};
dagball.Gob.prototype.azv = function(varName,setVTo){
	let val = this.E(varName);
	val.av = Math.max(val.av, setVTo);
	val.zv = Math.min(setVTo, val.zv);
};

//ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity

//2024-2-27 trying to fix that gob+'' interferes with Proxy and doesnt get the toString func from it
//cuz prop in that is Symbol.toPrimitive.
dagball.Gob.prototype.valueOf = function() {
	// Return an object to ensure toString is called.
	return this;
};

//dagball.Gob.prototype.prox = function(){
//	return this.prox || (this.prox = new Proxy(this,dagball.gobProxyHandler));
//};
dagball.Gob.prototype.type = 'dagball_gob';

dagball.Gob.prototype.toMap = function(){
	//TODO do the norm all at once in {type='dagball_wholeGameState',...} instead for efficiency?
	let smallE = {};
	for(let key in this.e){
		let val = this.e[key];
		if(val.dp || val.dv || val.kv){ //do as map, keeping only the nonzero of val.Dp .Dv and Kv, but always keep y and x.
			smallE[key] = {p: val.p, v: val.v};
			if(val.dp) smallE[key].dp = val.dp;
			if(val.dv) smallE[key].dv = val.dv;
			if(val.kv) smallE[key].kv = val.kv;
		}else{
			smallE[key] = [val.p,val.v]; //to save space
		}
	}
	let ob = {
		type: this.type,
		mutid: this.mutid,
		//team: this.team,
		//pic: null, //TODO byterect to json, use DV base64 converting bytes
		//e: dagball.removeDpDvEtc(DV.copyMap(this.E)),
		e: smallE,
	};
	if(this.w!==undefined && this.w!==null) ob.w = this.w;
	if(this.team!==undefined) ob.team = this.team;
	return DV.normOb(ob);
};

/*//set all dp dv and kv to 0 before caller uses the game rules (normally in dagball.fobs) on all (near only?) pairs of gobs, then caller calls nextStateB
dagball.Gob.prototype.nextStateA = function(dt){
	for(let key in this.E){
		let val = this.E[key];
		val.dp = val.dv = val.kv = 0;
	}
};*/

//updates this.e.life .mana .y .x etc, including any fields created while playing the game that are not built in.
dagball.Gob.prototype.nextState = function(dt){
	for(let key in this.e){
		//Each dimension in CPU, such as the y position or team or blueness, will update p/position and v/velocity using 7 temp vars each:
		//dp and dv (change of those per time), kv (velocity decay),
		//ap and zp (the min and max to set p to directly),  av and zv min and max set velocity.
		let val = this.e[key];
		let newP = val.p+(val.dp+val.v)*dt;
		let newV = val.v*Math.exp(-dt*val.kv)+dt*val.dv;
		if(val.ap <= val.zp){
			newP = Math.max(val.ap, Math.min(newP, val.zp));
		} //else 2 or more calls of ruleBCDt or ruleBDt tried to set p to 2 different values, making an inconsistent set of rules where min is bigger than max
		if(val.av <= val.zv){
			newV = Math.max(val.av, Math.min(newV, val.zv));
		} //else 2 or more calls of ruleBCDt or ruleBDt tried to set v to 2 different values, making an inconsistent set of rules where min is bigger than max
		val.p = newP;
		val.v = newV;
		val.dp = val.dv = val.kv = 0;
		val.ap = val.av = -Infinity; //increases or stays same
		val.zp = val.zv = Infinity; //decreases or stays same
		
		//{p:optionalFirstP||0, v:0, dp:0, dv:0, kv:0, ap:-Infinity, zp:Infinity ,av:-Infinity, zv:Infinity});
	}
};

//if you dont give optionalGobs list, uses dagball.gobs. If you dont give optionalRules, it uses dagball.fobs.
dagball.gobsNextState = function(dt, optionalGobs, optionalRules){
	let gobs = optionalGobs || dagball.gobs;
	gobs = [...gobs];
	dagball.shuffle(gobs);
	let rules = optionalRules || dagball.fobs;
	//for(let gob of gobs){
	//	gob.nextStateA(dt);
	//}
	//let maxDistSq = dagball.maxGobDistToRunRule**2;
	let allRules = (b,c,dt)=>{
		for(let rule of rules){
			rule(b,c,dt); //modifies gobFrom andOr gobTo
		}
	};
	/*for(let gobFrom of gobs){
		for(let gobTo of gobs){ //FIXME in random order of pairs, or sorted by nearest first?
			let dy = gobTo.e.y.p-gobFrom.e.y.p;
			let dx = gobTo.e.x.p-gobFrom.e.x.p;
			let distSq = dy*dy+dx*dx;
			if(gobFrom !== gobTo && distSq<=maxDistSq){
				allRules(gobFrom,gobTo,dt)
			}
		}
	}*/
	dagball.processGobsWithRule(gobs, dagball.maxGobDistToRunRule, allRules, dt);
	for(let gob of gobs){
		gob.nextState(dt);
	}
};

dagball.processGobsWithRule = function(gobs, maxDistance, rule, dt){
	function createGrid(maxDist){
		return {
			maxDist: maxDist,
			cells: {},
			insert: function(gob){
				const xKey = Math.floor(gob.e.x.p / maxDist);
				const yKey = Math.floor(gob.e.y.p / maxDist);
				const key = `${xKey},${yKey}`;

				if (!this.cells[key]){
					this.cells[key] = [];
				}

				this.cells[key].push(gob);
			},
			getNearby: function(gob){
				const xKey = Math.floor(gob.e.x.p / maxDist);
				const yKey = Math.floor(gob.e.y.p / maxDist);
				const nearby = [];

				for (let x = xKey - 1; x <= xKey + 1; x++){
					for (let y = yKey - 1; y <= yKey + 1; y++){
						const key = `${x},${y}`;
						if (this.cells[key]){
							nearby.push(...this.cells[key]);
						}
					}
				}

				//return nearby.filter(otherGob => gob !== otherGob);
				return nearby; //allow self edges
			}
		};
	}

	const grid = createGrid(maxDistance);

	gobs.forEach(gob => grid.insert(gob));

	gobs.forEach(gob => {
		const nearbyGobs = grid.getNearby(gob);
		nearbyGobs.forEach(otherGob => {
			const dx = gob.e.x.p - otherGob.e.x.p;
			const dy = gob.e.y.p - otherGob.e.y.p;
			const dist = Math.sqrt(dx * dx + dy * dy);
			if (dist <= maxDistance){
				rule(gob, otherGob, dt);
			}
		});
	});
};

dagball.Gob.prototype.toJSON = function(){
	//return JSON.stringify(this.toMap());
	return DV.contentToHash(this.toMap())
};

dagball.Gob.prototype.toString = function(){
	return this.toJSON();
};

dagball.Gob.prototype.paintOntoByteRect = function(byteRect){
	if(this.pic){
		let yi = Math.round(dagball.aftrans.forwardY(this.e.y.p)-this.pic.height/2);
		let xi = Math.round(dagball.aftrans.forwardX(this.e.x.p)-this.pic.width/2);
		this.pic.paintOntoByteRectAtYX(byteRect,yi,xi);
	}
};

dagball.ballComparatorByHasCurveGrabFirst = function(b,c){
	return (c.curveGrab?1:0)-(b.curveGrab?1:0);
};

dagball.sortBallsByCurveGrabFirst = function(){ //FIXME is this reversed?
	dagball.balls.sort(dagball.ballComparatorByHasCurveGrabFirst);
	if(dagball.view && dagball.view.balls){
		dagball.view.balls.sort(dagball.ballComparatorByHasCurveGrabFirst);
	}
};

//similar to dagball.balls and dagball.circles but for dagball.Gob instances.
dagball.gobs = [];

//'jsFunc:(b,c,dt)=>{ let removeLifeFromC = Math.max(0,c.life/2*dt); b.life += removeLifeFromC; c.life -= removeLifeFromC; }');
//func+'' returns 'jsFunc:(b,c,dt)=>{ let removeLifeFromC = Math.max(0,c.life/2*dt); b.life += removeLifeFromC; c.life -= removeLifeFromC; }'
//dagball.jsFunc('jsFunc:(b,c,dt)=>...')
dagball.fobs = []; //jsFuncs of (b,c,dt) that are called on all near pairs of dagball.Gob's in dagball.gobs

dagball.fobComparator = function(b,c){
	let bStr = b.toString();
	let cStr = c.toString();
	if(b==c) return 0;
	return b<c ? -1 : 1;
};

//you control the order of jsFuncs that run on dagball.gobs by writing them with 0000 aaaa vs zzzz near the start of the code,
//if you care about the order.
dagball.sortFobs = function(){
	dagball.fobs.sort(dagball.fobComparator);
};

dagball.fobExists = function(codeOrJsFunc){
	let jsFunc = dagball.jsFunc(codeOrJsFunc);
	dagball.fobs.indexOf(jsFunc)!=-1;
};

dagball.addFobs = function(...codeOrJsFuncs){
	for(let codeOrJsFunc of codeOrJsFuncs){
		let jsFunc = dagball.jsFunc(codeOrJsFunc);
		dagball.fobs.push(jsFunc);
	}
	dagball.sortFobs();
};

dagball.removeFobs = function(...codeOrJsFuncs){
	let set = new Set();
	for(let codeOrJsFunc of codeOrJsFuncs){
		set.add(dagball.jsFunc(codeOrJsFunc));
	}
	dagball.fobs = dagball.fobs.filter(f=>!set.has(f));
};

//Returns a js lambda whose tostring is the ape code (with 'ape:' prefix) that works as Ap.lazyEval(thatCode).ape.
//a simple scalarField with n floats in and 1 (or up to 4?) float out.
//Its a string of ape: code thats compiled using eval(ape.jsLambdaCode()) or TinyGlsl.cachedJsEval(ape.jsLambdaCode()).
//It then takes a few float array params (you only need the par array aka position, but might have to at least give empty arrays of the others?).
//text starts with "ape:" (norma) or "apeV1:" (old), same as circ.text.
//This runs in CPU.
//
//TODO something like: dagball.apeFuncJs('ape:{func? {a float} {b float} (* a b)}')
//
//FIXME should it be the tostring of a "{type:'dagball_apeFunc', text: '...'}" or something like that, or the text directly as toString?
//
//FIXME i want it to take n float params, not the constant number of arrays that Ap.Call uses.
//funcName? likely already does that when called as @funcName.
//
dagball.apeFuncJs = function(text){
	let ape;
	if(text.startsWith('{')){
		text = 'ape:'+text;
	}
	if(text.startsWith('ape:')){
		ape = ape = Ap.lazyEval(text.substring('ape:'.length)).ape;
	}else if(text.startsWith('apeV1:')){
		ape = Ap.lazyEvalOld(text.substring('apeV1:'.length)).ape;
	}else Err('text must start with "ape:" or "apeV1:" but text='+text);
	if(ape.apeType != '?') Err('ape.apeType != "?" aka defining a func. ape='+ape);
	//TODO merge with dagball.jsFunc but consider the 2 prefixes jsFunc: and ape:
	let jsCode = ape.jsLambdaCode();
	let jsLambda = TinyGlsl.cachedJsEval(jsCode);
	const TEXT = text;
	jsLambda.toString = ()=>TEXT;
	jsLambda.type = 'dagball_apeFunc';
	return jsLambda;
	//this.text = text;
};
/*dagball.ApeFunc.prototype.numParams = function(){
	return this.text.split(' ').length;
};*/
//dagball.ApeFunc = function(text)

//Example: let func = dagball.jsFunc(
//	'jsFunc:(b,c,dt)=>{ let removeLifeFromC = Math.max(0,c.life/2*dt); b.life += removeLifeFromC; c.life -= removeLifeFromC; }');
//func+'' returns 'jsFunc:(b,c,dt)=>{ let removeLifeFromC = Math.max(0,c.life/2*dt); b.life += removeLifeFromC; c.life -= removeLifeFromC; }'
//Param can be the output of this or string that starts with 'jsFunc:' or string without that, of js code.
dagball.jsFunc = function(jsCode){ //js or ape code, todo rename var name
	if(jsCode.type == 'dagball_jsFunc' || jsCode.type == 'dagball_apeFunc'){
		return jsCode;
	}
	if(jsCode.startsWith('jsFunc:')){
		jsCode = jsCode.substring('jsFunc:'.length);
	}
	let jsLambda = TinyGlsl.cachedJsEval(jsCode);
	const TEXT = jsCode;
	jsLambda.toString = ()=>TEXT;
	jsLambda.type = 'dagball_jsFunc';
	return jsLambda;
};

//normed json, deterministic order of map keys. TODO fix bugs in that.
dagball.toJson = function(ob){
	return JSON.stringify(DV.normOb(ob));
};

//given 2 gob funcs (game rules) first second, return a gob function(b,c,dt)
//that TODO calls first(b,c,dt) then second(b,c,dt) and TODO whose toString contains all that info.
//first is L. second is R. todo rename those vars/comments.
//TODO dedup.
dagball.chain2GobGobDtFuncs = function(l,r){
	const ty = 'dagball_chainGobGobDtFuncs';
	const CODEOB = {type:ty, funcs:[l.toMap(),r.toMap()]};
	const L = l;
	const R = r;
	const CODE = dagball.toJson(CODEOB);
	let ret = function(b,c,dt){
		L(b,c,dt);
		R(b,c,dt);
	};
	ret.L = L;
	ret.R = R;
	ret.toMap = function(){ //TODO make a shared js prototype so dont have to set toMap here. might be more efficient?
		return {type:ty,funcs:[this.L,this.R]}; //in case L or R changed, but probably its best to use as immutable tree?
	};
	ret.toJSON = ret.toString = ()=>CODE;
	return ret;
};

/*
dagball.addExampleGameRules = function(){ dagball.addFobs(
		
`jsFunc:(b,c,dt)=>{
	let removeLifeFromC = Math.max(0,c.p('life')/2*dt);
	b.E('life').p += removeLifeFromC;
	c.E('life').p -= removeLifeFromC;
}`,
`jsFunc:(b,c,dt)=>{
	//auto refill mana but slower the closer to maxMana it gets
	if(b.p('mana') < b.p('maxMana',1)){
		b.dp('mana', b.p('remanaSpeed',.1)*(b.p('maxMana')-b.p('mana')));
	}
}`,
`jsFunc:(b,c,dt)=>{
	//auto refill life but slower the closer to maxMana it gets
	if(b.p('life') < b.p('maxLife',1)){
		b.dp('life', b.p('relifeSpeed',.1)*(b.p('maxLife') - b.p('life')));
	}
}`,
`jsFunc:(b,c,dt)=>{
	//newtonian gravity, slightly adjusted to never divide by 0
	//let dy = c.e.y.p-b.e.y.p, dx = c.e.x.p-b.e.x.p, distSq = dy*dy+dx*dx;
	let dy = c.p('y')-b.p('y'), dx = c.p('x')-b.p('x'), distSq = dy*dy+dx*dx;
	if(distSq){
		let dist = Math.sqrt(distSq);
		let normDy = dy/dist;
		let normDx = dx/dist;
		let force = .001/(.01+distSq);
		let addY = force*normDy/2;
		let addX = force*normDx/2;
		c.dv('y', -addY);
		b.dv('y', addY);
		c.dv('x', -addX);
		b.dv('x', addX);
	}
}`,
`jsFunc:(b,c,dt)=>{
	//adjust life and mana randomly so can see it change on screen
	if(b === c){
		if(b.E('repaint',1).p){
			b.p('life', Math.random());
			b.p('mana', Math.random());
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//do part of painting pic (life as brightness of red diagonal line from top left to bottom right) if repaint is nonzero
	if(b === c){
		if(b.E('repaint',1).p){
			let life = b.e.life;
			let lifeByte = Math.floor(life.p*255); //FIXME divide by maxLife?
			b.pic.paintLineYXYXRGB(0,0,b.pic.height-1,b.pic.width-1,lifeByte,0,0);
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//do part of painting pic (mana as brightness of blue diagonal line from top right to bottom left) if repaint is nonzero
	if(b===c){
		if(b.p('repaint',1)){
			let manaByte = Math.floor(b.p('mana')*255); //FIXME divide by maxMana?
			b.pic.paintLineYXYXRGB(0,b.pic.width-1,b.pic.height-1,0,0,0,manaByte);
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//aaaaaaaaaaaaaaaadofirst
	if(b===c){
		b.p('repaint', dagball.weightedCoinFlip(.1)); //repaint sometimes
	}
}`,
`jsFunc:(b,c,dt)=>{
	//zzzzzzzdolast set repaint to 0, so only repaint if something sets it to 1
	b.p('repaint', 0);
}`,

);};*/

/*dagball.addExampleGameRules = function(){ dagball.addFobs(

`jsFunc:(b,c,dt)=>{
	let bLife = b.e.life;
	let cLife = c.e.life; 
	let removeLifeFromC = Math.max(0,cLife.p/2*dt);
	bLife.p += removeLifeFromC;
	cLife.p -= removeLifeFromC;
}`,
`jsFunc:(b,c,dt)=>{
	//auto refill mana but slower the closer to maxMana it gets
	let mana = b.e.mana;
	let maxMana = b.E('maxMana',1);
	let remanaSpeed = b.E('remanaSpeed',.1);
	if(mana.p < maxMana.p){
		mana.dp += remanaSpeed.p*(maxMana.p - mana.p);
	}
}`,
`jsFunc:(b,c,dt)=>{
	//auto refill life but slower the closer to maxMana it gets
	let life = b.e.life;
	let maxLife = b.E('maxLife',1);
	let relifeSpeed = b.E('relifeSpeed',.1);
	if(life.p < maxLife.p){
		life.dp += relifeSpeed.p*(maxLife.p - life.p);
	}
}`,
`jsFunc:(b,c,dt)=>{
	//newtonian gravity, slightly adjusted to never divide by 0
	let dy = c.e.y.p-b.e.y.p, dx = c.e.x.p-b.e.x.p, distSq = dy*dy+dx*dx;
	if(distSq){
		let dist = Math.sqrt(distSq);
		let normDy = dy/dist;
		let normDx = dx/dist;
		let force = .001/(.01+distSq);
		let addY = force*normDy/2;
		let addX = force*normDx/2;
		c.e.y.dv -= addY;
		b.e.y.dv += addY;
		c.e.x.dv -= addX;
		b.e.x.dv += addX;
	}
}`,
`jsFunc:(b,c,dt)=>{
	//adjust life and mana randomly so can see it change on screen
	if(b === c){
		if(b.E('repaint',1).p){
			b.e.life.p = Math.random();
			b.e.mana.p = Math.random();
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//do part of painting pic (life as brightness of red diagonal line from top left to bottom right) if repaint is nonzero
	if(b === c){
		if(b.E('repaint',1).p){
			let life = b.e.life;
			let lifeByte = Math.floor(life.p*255); //FIXME divide by maxLife?
			b.pic.paintLineYXYXRGB(0,0,b.pic.height-1,b.pic.width-1,lifeByte,0,0);
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//do part of painting pic (mana as brightness of blue diagonal line from top right to bottom left) if repaint is nonzero
	if(b===c){
		if(b.E('repaint',1).p){
			let life = b.e.mana;
			let manaByte = Math.floor(life.p*255); //FIXME divide by maxMana?
			b.pic.paintLineYXYXRGB(0,b.pic.width-1,b.pic.height-1,0,0,0,manaByte);
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//aaaaaaaaaaaaaaaadofirst
	if(b===c){
		let repaint = b.E('repaint',1);
		repaint.p = dagball.weightedCoinFlip(.1); //repaint sometimes
	}
}`,
`jsFunc:(b,c,dt)=>{
	//zzzzzzzdolast set repaint to 0, so only repaint if something sets it to 1
	let repaint = b.E('repaint',1);
	repaint.p = 0;
}`,

);};*/

/*dagball.addExampleGameRules = function(){ dagball.addFobs(

`rule://test moving life
let removeLifeFromC = max(0,lifeCp/2*dt);
lifeBp += removeLifeFromC;
lifeCp -= removeLifeFromC;
`,

`rule://auto refill mana but slower the closer to maxMana it gets
if(manaBp < maxManaBp(1)){
	manaBdp += remanaSpeedBp(.1)*(maxManaBp - manaBp);
}`,

`rule://auto refill life but slower the closer to maxMana it gets
if(life.p < maxLifeBp(1)){
	life.dp += relifeSpeedBp(.1)*(maxLife.p - life.p);
}`,

`jsFunc:(b,c,dt)=>{
	//newtonian gravity, slightly adjusted to never divide by 0
	let dy = c.e.y.p-b.e.y.p, dx = c.e.x.p-b.e.x.p, distSq = dy*dy+dx*dx;
	if(distSq){
		let dist = Math.sqrt(distSq);
		let normDy = dy/dist;
		let normDx = dx/dist;
		let force = .001/(.01+distSq);
		let addY = force*normDy/2;
		let addX = force*normDx/2;
		c.e.y.dv -= addY;
		b.e.y.dv += addY;
		c.e.x.dv -= addX;
		b.e.x.dv += addX;
	}
}`,
`jsFunc:(b,c,dt)=>{
	//adjust life and mana randomly so can see it change on screen
	if(b === c){
		if(b.E('repaint',1).p){
			b.e.life.p = Math.random();
			b.e.mana.p = Math.random();
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//do part of painting pic (life as brightness of red diagonal line from top left to bottom right) if repaint is nonzero
	if(b === c){
		if(b.E('repaint',1).p){
			let life = b.e.life;
			let lifeByte = Math.floor(life.p*255); //FIXME divide by maxLife?
			b.pic.paintLineYXYXRGB(0,0,b.pic.height-1,b.pic.width-1,lifeByte,0,0);
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//do part of painting pic (mana as brightness of blue diagonal line from top right to bottom left) if repaint is nonzero
	if(b===c){
		if(b.E('repaint',1).p){
			let life = b.e.mana;
			let manaByte = Math.floor(life.p*255); //FIXME divide by maxMana?
			b.pic.paintLineYXYXRGB(0,b.pic.width-1,b.pic.height-1,0,0,0,manaByte);
		}
	}
}`,
`jsFunc:(b,c,dt)=>{
	//aaaaaaaaaaaaaaaadofirst
	if(b===c){
		let repaint = b.E('repaint',1);
		repaint.p = dagball.weightedCoinFlip(.1); //repaint sometimes
	}
}`,
`jsFunc:(b,c,dt)=>{
	//zzzzzzzdolast set repaint to 0, so only repaint if something sets it to 1
	let repaint = b.E('repaint',1);
	repaint.p = 0;
}`,

);};*/

dagball.exampleGameRulesCode = [

`(b,c,dt)=>{
	//newtonian gravity, slightly adjusted to never divide by 0
	//let dy = c.e.y.p-b.e.y.p, dx = c.e.x.p-b.e.x.p, distSq = dy*dy+dx*dx;
	let dy = c.p('y')-b.p('y'), dx = c.p('x')-b.p('x'), distSq = dy*dy+dx*dx;
	if(distSq){
		let dist = Math.sqrt(distSq);
		let normDy = dy/dist;
		let normDx = dx/dist;
		let force = .03/(.01+distSq);
		let addY = force*normDy/2;
		let addX = force*normDx/2;
		c.dv('y', -addY);
		b.dv('y', addY);
		c.dv('x', -addX);
		b.dv('x', addX);
	}
}`,


/*`ruleBCDt://test moving life
(do
	(= removeLifeFromC (max 0 (* lifeCp .5 dt)))
	(+= lifeBp removeLifeFromC)
	(-= lifeCp removeLifeFromC)
)`,

`ruleBCDt://auto refill mana but slower the closer to maxMana it gets
(if (< manaBp maxManaBp@1)
	(+= manaBdp (* remanaSpeedBp@.1 (- maxManaBp manaBp)))
)`,

`ruleBDt://auto refill life but slower the closer to maxMana it gets
(if (< lifeBp maxLifeBp@1)
	(+= lifeBdp (* relifeSpeedBp@.1 (- maxLifeBp lifeBp));
)`,
*/

/*`ruleBCDt://newtonian gravity, slightly adjusted to never divide by 0
(do
	(= dy (- yCp yBp))
	(= dx (- xCp xBp))
	(= distSq (+ (sq dy) (sq dx)))
	(if distSq (do
		(= dist (sqrt distSq))
		(= normDy (/ dy dist))
		(= normDx (/ dx dist))
		(= force (/ .001 (+ .01 distSq)))
		(= addY (* force normDy .5))
		(= addX (* force normDx .5))
		(-= yCdv addY)
		(+= yBdv addY)
		(-= xCdv addX)
		(+= xBdv addX)
	))
)`,

/*
`ruleBDt://adjust life and mana randomly so can see it change on screen. FIXME why is it checking repaintBp?
(if repaintBp@1 (do
	(= lifeBp (rnd))
	(= manaBp (rnd))
))`,

`ruleBDt://do part of painting pic (life as brightness of red diagonal line from top left to bottom right) if repaint is nonzero
(if repaintBp@1	(paintLineYXYXRGB 0 0 1 1 (/ lifeBp maxLife@1) 0 0))`,

`ruleBDt://do part of painting pic (mana as brightness of blue diagonal line from top right to bottom left) if repaint is nonzero
(if repaintBp@1 (paintLineYXYXRGB 0 0 1 1 0 0 (/ manaBp maxMana@1))`,

`ruleBDt://aaaaaaaaaaaaaaaadofirst
(= repaintBp@1 (rndBit .1)) //repaint sometimes
`,

`ruleBDt://zzzzzzzdolast set repaint to 0, so only repaint if something sets it to 1
(= repaintBp 0)
`,*/


/*
`(each B (each C
	(if (< (dist2d xBp yBp xCp yCp) 3.5) (do
		TODO			
	))
))
`,

`(eachNear2 B C 3.5 (do
	TODO
))
`,

`(the B (each C (do
	TODO
))
`,

`(the B (the C (do
	TODO
))
`,

`(eachNear2xy B C 3.1 (do //FIXME make this able to choose which fields to hypot such as x y vs x y z?
	TODO
))
`,

`(eachNear2xyz B C 3.1 (do //FIXME make this able to choose which fields to hypot such as x y vs x y z?
	TODO
))
`,

`(nearPairsXyz B C 3.1 (do
	TODO
))
`,

`(nearPairsXy B C 3.1 (do
	TODO
))
`,

`(nearPairsXyzr B C 3.1 (do //also couns the r/radius field in distance
	TODO
))
`,

`(nearOneXyzr B C 3.1 (do //each B the C, where xyz distance + the 2 radiuses <= 3.1
	TODO
))
`,*/

/*`(eachTheNearxyzr B C 3.1 (do //each B the C, where xyz distance + the 2 radiuses <= 3.1
	TODO
))
`,

`(theTheThe B C D (do //the B the C the D
	TODO
))
`,

`(eachEachNearxy B C 5.67 (do //each pair of B C within 5.67 of eachother in x y not counting radiuses
	TODO
))
`,

/*`(do
	(eachTheNearxyzr B C 3.1 (do //each B the C, where xyz distance + the 2 radiuses <= 3.1
		TODO
	))
	(theTheThe B C D (do //the B the C the D
		TODO
	))
	(eachEachNearxy B C 5.67 (do //each pair of B C within 5.67 of eachother in x y not counting radiuses
		TODO
	))
	(eachEachNearxy B C 4 (do //newtonian gravity, slightly adjusted to never divide by 0
		(= dy (- yCp yBp))
		(= dx (- xCp xBp))
		(= distSq (+ (sq dy) (sq dx)))
		(if distSq (do
			(= dist (sqrt distSq))
			(= normDy (/ dy dist))
			(= normDx (/ dx dist))
			(= force (/ .001 (+ .01 distSq)))
			(= addY (* force normDy .5))
			(= addX (* force normDx .5))
			(-= yCdv addY)
			(+= yBdv addY)
			(-= xCdv addX)
			(+= xBdv addX)
		))
	))
)
`,*/


/*
(do
	(thebEachcNearxyzr s$3456 3.1 //the B each C, where xyz distance + the 2 radiuses <= 3.1
		TODO
	)
	(thebThecThed s$3 s$156 s$9893 //the B the C the D
		TODO
	)
	//TODO generate code that calls dagball.processGobsWithRule = function(gobs, maxDistance, rule, dt)
	(eachbEachcNearxy 5.67 //each pair of B C within 5.67 of eachother in x y not counting radiuses
		TODO
	)
	(eachbEachcNearxy 4 //newtonian gravity, slightly adjusted to never divide by 0
		(= dy (- yCp yBp))
		(= dx (- xCp xBp))
		(= distSq (+ (sq dy) (sq dx)))
		(if distSq (do
			(= dist (sqrt distSq))
			(= normDy (/ dy dist))
			(= normDx (/ dx dist))
			(= force (/ .001 (+ .01 distSq)))
			(= addY (* force normDy .5))
			(= addX (* force normDx .5))
			(-= yCdv addY)
			(+= yBdv addY)
			(-= xCdv addX)
			(+= xBdv addX)
		))
	)
)
`,

//TODO anything that names specific nodes (gob, DF.N, etc, but lets just make them all be gobs and merge those...)
//should be in parents list of it, instead of the main list, or at least if its a sparseScalarField kind for gradient
//but maybe not if its a a diffeq/minmaximpulse kind? The DF/dagfield.js system is for sparse high dimensional gradients
//and TODO should be merged with the variable number and varnames of fields in gobs as in C.e.manaRefillRate.p aka manaRefillRateCp.
To generalize this, add a global poten var.
(eachbEachcNearxy 4
	(= dy (- yCp yBp))
	(= dx (- xCp xBp))
	(= distSq (+ (sq dy) (sq dx)))
	(if distSq (do
		(= dist (sqrt distSq))
		//(+= poten (/ -1 (+ .01 dist)))
		(poten (/ -1 (+ .01 dist))) //adds to potentialEnergy
	))
)
Yes, that makes sense, merges the lisplike game language, diffeqs/minmaximpuls, and scalarField math.
BUT if theres loops adding to poten, its likely to lose the benefit of being a sparse high dimensional scalarField.
Still, could use it with thebThecThed and thebEachcNearxyzr etc.
How would thebEachcNearxyzr work for the eachcNearxyzr part?
		
Remember, each of these gameRules exists or it doesnt, and for poten rules (no diffeq/etc) their existence can be gradual (.influence).
The diffeq part could be gradual. But how would minmaximpulse be gradual?


Make each (...) list, or just some of them right inside a thebEachcNearxy etc, be compiled to a js lambda,
like (poten (/ -1 (+ .01 dist))) could be a js lambda,
and (do (= lifeBp (rnd)) (= manaBp (rnd))) could be a js lambda so it could be reused like
(theb s$4564 theLifeManaRandomizer#(do (= lifeBp (rnd)) (= manaBp (rnd))))
(theb s$9871 theLifeManaRandomizer)
Set influence of both of those to 1 to make them exist, set to 0 to make them not exist.
In the tree replace s$4564 with the gob whose mutid is that, and in thebEachc have a slot in the tree for replacing c?
Or simply, have global vars called B C D E F G H I which are gobs, and all such funcs.
(influence SelectorFunc ..numbersAndGobs.. RuleFunc)
(influence SelectorFunc ..numbersAndGobs.. RuleFunc)
(1 theb s$6453 (do (= lifeBp (rnd)) (= manaBp (rnd))))
(0 theb s$6453 (do (= lifeBp (rnd)) (= manaBp (rnd))))
"influence" is the "missing var in algebra" thats similar to opencogTruthvalue but in a potentialEnergy way so not exactly.
That first var such as 1 in (1 theb s$6453 RuleFunc) is influence.
In DF/Dagfield.js i was about to change node.potenMul to be a node (with a base case of a literal {pos:1} maybe)
when I started merging this loop stuff in so it could also do rockPaperScissors gobs like in those videos i made 2024-3.
Getting back to potenMul_aka_influence becoming a node,
how should that be written, and what data structure, in this?
(1 theb s$6453 (do (= lifeBp (rnd)) (= manaBp (rnd))))
(HOWDOESTHISBECOMEANODE? theb s$6453 (do (= lifeBp (rnd)) (= manaBp (rnd))))
(s$73443 theb s$6453 (do (= lifeBp (rnd)) (= manaBp (rnd)))) but where does the influence var go, s$73443.e.influence.p?
Consider that gob.e has varying number and different varnames of its fields, that each have p v dp dv kv minp maxp minv maxv.
If each (SelectorFunc ..numbersAndGobs.. RuleFunc) is a dim, is it a gob or a field in a gob?
This can be figured out by putting a thebThec where B is another rules influence var and C is a gob
and add to the influence something from the gobs fields, a rule that turns another rule on/off (or gradually between)
depending on a specific gob.
Make influence (or just call it Infl) be a global var: B C D E F G H I Maxdist Infl, that SelectorFuncs and RuleFuncs read and write.
B..I are gobs, or possibly dims. Maxdist and Infl are numbers. Infl is the number of the current influence
of the current (SelectorFunc ..numbersAndGobs.. RuleFunc). Infl must have gradient computed on it the same as any other dim,
though im unsure if the Infl child of a (InflNode SelectorFunc ..numbersAndGobs.. RuleFunc)
should be 1 dim vs a gob as a sparse set of dims.
Maybe gob should be both, have the vars for a single dim AND .e as a js {} of string to gob.
Fixme dont name clash with wikibinator203 as some html files set global vars for some of the opcodes
but Wikibinator203.js only sets 1 global var: Wikibinator203.
var SelectorFunc=null, RuleFunc=null, B=null, C=null, D=null, E=null, F=null, G=null, H=null, I=null, MaxDist=4, Infl=1;
dagball.Gob = function(){
	//TODO this.autoincId like in DF.N.id? Or is that unnecessary cuz of using just 2 levels
	//of (SelectorFunc ..numbersAndGobs.. RuleFunc) SelectorFunc and RuleFunc instead of a variable depth forest?
	
	//this.mutid = optionalMutid || dagball.nextGobId();
	//this.rule = null; //If this gob is a (SelectorFunc ..numbersAndGobs.. RuleFunc) then this.p is its potenMul_aka_influence
	//this.pic = optionalPic || dagball.randomGobPic();
	//this.e.x.p is x position. this.e.y.p is y position. .z.p .radius.p .red.p .green.p .blue.p etc, though theyre all optional and this.e may be empty.
	//FIXME should mutid go in gob.mutid instead of gob.w.mutid?
	//Should mutids start with $ like $aFRG3456755, and if the first $ is after something like DV$dfgdrf544566d then its a DV/Dagverse id,
	//but that prefix being empty string is this. (thebEachcNearxy $dfg4345df 3.45 (...))
	this.w = {}; //Anything thats not a Gob goes in here, such as these keys: mutid, rule, pic, circ, ball, etc.
	this.m = {}; //this.e = {}; //js {} map of varName to Gob, TODO prefill by (SelectorFunc ..numbersAndGobs.. RuleFunc) filled by this.E('varName') which starts as {p:0, v:0, dp:0, dv:0, kv:0}
	
	//this.w.rule (or caller of it?) should set global vars B C D MaxDist Infl etc, and set Infl to this.p (position of this dimension).
	//If this.p is 0 (0 potenMul_aka_influence) then dont run this.w.rule, especially cuz some rules are a hard 0 vs nonzero and affect ap zp av andOr zv
	//which are impulse/min/max instead of gradient or diffeq.
	
	this.p = 0;
	this.v = 0;
	this.dp = 0;
	this.dv = 0;
	this.kv = 0;
	this.ap = -Infinity;
	this.zp = Infinity;
	this.av = -Infinity;
	this.zv = Infinity;
	this.gradient = 0;
	this.lock = false; //TODO gob.lock = true or false, to prevent changing of p and v, like to lock a circ in a certain x y and radius?
	//list of gobs. childs for this.w.rule which is a (SelectorFunc ..numbersAndGobs.. RuleFunc) if exists, and this is the numbersAndGobs part
	this.ch = [];
	
	TODO since theres this.ch for SelectorFunc params, should it be this.w.selectorFunc and this.w.ruleFunc? call them this.w.selFn and this.w.rulFn?
			
	TODO split this.w.rule into this.w.potenRule (that only calls (poten addToPotenExpr))
		and this.w.diffeqRule(that contains diffeq andOr min/max/impulse?)? Or just have it say what kind of rule it is in this.w.rule value?
				
	TODO asap define the  (SelectorFunc ..numbersAndGobs.. RuleFunc) datastruct in gob.w.rule, or is it gob.ch for list of childs andOr rule numbers?
		or should all rule numbers be someGob.p so gob.ch (or gob.w.rule.ch?)
		would always be a list of gobs that the rule copies to B C D Maxdist Infl etc global vars?
		Then rebuild rockPaperScissors in it, what happened in those videos, make it work with gobs.
	Should a (SelectorFunc ..numbersAndGobs.. RuleFunc) be a js lambda that takes a gob as a param, the gob whose
	gob.w.rule is that (SelectorFunc ..numbersAndGobs.. RuleFunc) and whose gob.p is its potenMul_aka_influence?
	
	Use cases:
	-- A big circ with a gob containing a rule that in that circ gobs play rockPaperScissors using teamBp teamCp,
		but only if they have rpsBp and rpsCp, or something like that. TODO make an influence 
	-- A small circ that defines that in a certain area, 2d velocity (or 3d in some volumes later?) is added into
		to accel in a certain direction.
		
	Merge all dagball object types (ball, circ, sparsePieceOfBitpicBloomtree, uiOptions_chk_or_num_etc) merge with Gob,
		and ballGob.p is influence of ballGob, and circGob.p is influence of circGob, etc.
		Still compute circs and balls using dagball.circles and dagball.balls etc since those are already well optimized
		but have either a copy or a pointer of them in gobs, using gob.w.text for example being the same as circ.text
		which starts with "ape:" or "txt:" etc.
	
	//defaults[varName] = defaults[varName] || {p:0,v:defaultValue,dp:0,dv:0,kv:0,ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity};
	
	//this.mutid = optionalMutid || dagball.nextGobId();
	//this.w = optionalWrapMe!==undefined ? optionalWrapMe : null; //If this gob wraps another object, put it here
	//FIXME move gob.team into gob.e.team.p aka teamBp teamBap teamBzp
	//this.team = optionalTeam!==undefined ? optionalTeam :
	//	dagball.randInt(dagball.numTournamentColors()); //FIXME
	//this.pic = optionalPic || dagball.randomGobPic();
	//this.displayText = '';
	//this.e = {}; //filled by this.E('varName') which starts as {p:0, v:0, dp:0, dv:0, kv:0}
	
	//this.id = optionalId || DF.nextId++;
	//this.pos = 0; //position of this dimension in the high dimensional scalar field
	//this.prevPos = 0; //prev this.pos for use during sparse gradient calculation
	//this.vel = 0; //velocity of this dimension in the high dimensional scalar field
	//this.velDecay = 0;
	//this.gradient = 0;
	//The scalarField has as many dimensions as nodes/DF.N's, and position in that dimension is node.potenMul.
	//There are around a googolplex number of possible nodes up to a few hundred deep
	//(see x=>x*x+1 for computing number of binary forest nodes up to height x in wikibinator203,
	//though this can have more childs per node such as 0 1 2 6 7),
	//and in those googolplex number of dimensions, you can navigate a surface area of a googolplexian
	//which contains all the possible scalarFields that this system can represent,
	//though practically you can only explore as many of them as fits in memory.
	//You can dotProduct scalarFields with eachother by dotProducting their potenMuls,
	//though for that not to have exploding/vanishing/NaN/etc should probably
	//norm 1000*tanh(node.pos/1000) andOr weightedSum of many potenMul*pos etc (TODO).
	
	//this.potenMul = 0;
	//TODO make potenMul_aka_influence be another Gob or baseCase of default to 1 or something like that, the missing var in algebra.
	
	
	//TODO mmDagball:"gamers are gonna love this shit .. Algebras missing a var similar to OpenCOG TruthValue, the true-er an equation is the more it adds to leastSquares loss"
	//this.potenMul = optionalPotenMulNode || {pos:1}; //FIXME
	//FIXME should this.potenMul be 1 of this.ch/childs?
	//FIXME use node.potenMul.pos instead of node.potenMul as if its a number
	//this.potenMul = 0;
	//throw new Error('//FIXME use node.potenMul.pos instead of node.potenMul as if its a number. This is a big redesign for recursive truthvalue of constraints about the existence vs nonexistence vs strength (node.potenMul.pos) of constraints about constriants etc... //FIXME use node.potenMul.pos instead of node.potenMul as if its a number'); 
	
	//should be null if this is an input node, nonnull if childs exist. Js lambda that takes childs array as param and returns number.
	//this.op = optionalOp || null;
	//this.ch = optionalChilds || [];
	//this.parents = [];
	//this.deepParents = null;
	//FIXME dont allow op to exist while theres 0 childs (ops that return a constant or random or number from gamepad or somethign?)???
	//or should that be allowed?
	//If no childs, is height 0 (even if this.op exists which makes it not an input node). Else is 1 + max child height.
	//FIXME should it be 0 for input node, 1 for has op but no childs, and 1 + max child height if has childs?
	//this.chHeight = 0;
	//for(let child of this.ch){
	//	this.chHeight = Math.max(this.chHeight, 1+child.chHeight);
	//	child.addParent(this);
	//}
};


	//TODO use ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity to set teamAp and teamZp to the new team else leave them as -Infinity to Infinity to not change,
	//and similarly use a zooming pad, like the >>> in mariokart or a simulated game gun, to set xBav and xBzv and yBav and yBzv to specific xBv and yBv values.
	
	
	//TODO for impulse/setPOrVInstantly, extend p v dp dv kv with 4 more minp maxp minv maxv so if u wanna set p you set minp and maxp to that
	//start min* at -infinity and max* at infinity once per physics cycle.
	//Do rebuildRockPaperScissorsInDagballRuleObjects this way which needs to change team instantly (and make team be 1 of the b.e.team c.e.team.
*/
	

];

//alert(`TODO for impulse/setPOrVInstantly, extend p v dp dv kv with 4 more minp maxp minv maxv so if u wanna set p you set minp and maxp to that
//start min* at -infinity and max* at infinity once per physics cycle.
//Do rebuildRockPaperScissorsInDagballRuleObjects this way which needs to change team instantly (and make team be 1 of the b.e.team c.e.team.
//`);

console.log('dagball.exampleGameRulesCode = '+JSON.stringify(dagball.exampleGameRulesCode,null,'\t'));

/*
//generated 2024-2-29-205pET. then modified.
dagball.parseLispSyntaxToStructuredArray = function(input){
    // Remove the rule identifier before parsing to focus on the Lisp-like syntax
    const cleanedInput = input.substring(input.indexOf('\n') + 1);

    const tokens = cleanedInput.match(/\(|\)|"[^"]+"|'[^']+'|[^\s()]+/g);

    /*function parseTokens(tokens) {
        if (!tokens.length) return [];

        const token = tokens.shift();
        if (token === '(') {
            const expr = [];
            while (tokens[0] !== ')') {
        		let recurTokens = parseTokens(tokens);
        		console.log('recurTokens: '+JSON.stringify(recurTokens));
                expr.push(tokens);
            }
            tokens.shift(); // Remove ')'
            return expr;
        } else if (token === ')') {
            throw new Error("Unexpected ')'");
        }
        return token;
    }*
    function parseTokens(tokens) {
        if (!tokens.length) return [];

        const token = tokens.shift();
        if (token === '(') {
            const expr = [];
            while (tokens[0] !== ')') {
                let recurTokens = parseTokens(tokens);
                console.log('recurTokens: ' + JSON.stringify(recurTokens));
                expr.push(recurTokens); // Push the recurTokens instead of tokens
            }
            tokens.shift(); // Remove ')'
            return expr;
        } else if (token === ')') {
            throw new Error("Unexpected ')'");
        }
        return token;
    }

    return parseTokens(tokens);
};


console.log('parseLispSyntaxToStructuredArray...');

// Example usage
const structuredArray = dagball.parseLispSyntaxToStructuredArray(`ruleBCDt://double loop test
(do 
    (for i 100 
        (if (% i 2) 
            (for j 200 
                (+= var55 (* i j))
            )
        )
    )
)`);

console.log("Structured Array:", JSON.stringify(structuredArray, null, 2));
*/


dagball.parseLispSyntaxToStructuredArray = function(input){
    // Remove the rule identifier before parsing to focus on the Lisp-like syntax
    const cleanedInput = input.substring(input.indexOf('\n') + 1);

    const tokens = cleanedInput.match(/\(|\)|"[^"]+"|'[^']+'|[^\s()]+/g);

    function parseTokens(tokens){
    	console.log('parseTokens: '+JSON.stringify(tokens));
        if (!tokens.length) return [];

        const token = tokens.shift();
        if (token === '(') {
            const expr = [];
            while(tokens.length && tokens[0] !== ')') {
                let recurTokens = parseTokens(tokens);
                console.log('recurTokens:', JSON.stringify(recurTokens));
                expr.push(recurTokens);
            }
            tokens.shift(); // Remove ')'
            return expr;
        } else if (token === ')') {
            throw new Error("Unexpected ')'");
        }
        return token;
    }

    return parseTokens(tokens);
};

console.log('parseLispSyntaxToStructuredArray...');

// Example usage
const structuredArray = dagball.parseLispSyntaxToStructuredArray(`ruleBCDt://double loop test
(do 
    (for i 100 
        (if (% i 2) 
            (for j 200 
                (+= var55 (* i j))
            )
        )
    )
)`);

console.log("Structured Array:", JSON.stringify(structuredArray, null, 2));

//TODO replace this with Axgob.js theres a Rule and Field opcode.
//
//incomplete generated code 2024-2-29-156pET
dagball.ruleToJSFuncDefaults = ruleString=>{
    /*// Parse the Lisp-like syntax into a structured array
    const parseLispSyntaxToStructuredArray = (input) => {
        const tokens = input.match(/\(|\)|"[^"]*"|'[^']*'|@[^\s()]+|[^\s()]+/g);
        const parseTokens = (tokens) => {
            if (!tokens.length) return [];
            const token = tokens.shift();
            if (token === '(') {
                const expr = [];
                while (tokens[0] !== ')') expr.push(parseTokens(tokens));
                tokens.shift(); // Remove ')'
                return expr;
            } else if (token === ')') {
                throw new Error("Unexpected ')'");
            }
            return token;
        };
        return parseTokens(tokens);
    };*/
    const parseLispSyntaxToStructuredArray = dagball.parseLispSyntaxToStructuredArray;

    // Estimate flops from the structured expression
    const estimateFlops = (expr) => {
        if (typeof expr === 'string') return 0;
        const [op, ...args] = expr;
        let flops = 1; // Assuming 1 flop for the operation itself
        if (op === '+' || op === '-' || op === '*' || op === '/' || op === '%') {
            flops += args.length - 1; // n-1 additional flops for n args
        }
        args.forEach((arg) => { flops += estimateFlops(arg); });
        return flops;
    };

    // Translate the structured array into JavaScript code
    const translateToJS = (expr) => {
    	console.log('translateToJS: '+JSON.stringify(expr));
    	if(expr === undefined){
    		throw new Error('translateToJS expr is undefined');
    	}
    	let ret = null;
        if (typeof expr === 'string') {
            ret = expr; // Direct translation for strings
        }
  
        if(ret === null){
	        const [op, ...args] = expr;
	        switch (op) {
	            case '+':
	            case '-':
	            case '*':
	            case '/':
	            case '%':
	            case '<':
	            case '>':
	            case '<=':
	            case '>=':
	            case '==':
	            case '===':
	            	ret = `(${args.map(arg => translateToJS(arg)).join(` ${op} `)})`;
	            break;case 'if':
	            	ret = `if(${translateToJS(args[0])}){ ${translateToJS(args[1])} }` +
	                       (args.length > 2 ? `else{ ${translateToJS(args[2])} }` : '');
	            break;case 'do':
	            	ret = `{ ${args.map(arg => translateToJS(arg)).join('; ')} }`;
	            break;case 'for':
	                // Assuming the loop variable and limit are directly provided
	                ret = `for (let ${args[0]} = 0; ${args[0]} < ${args[1]}; ${args[0]}++) { ${translateToJS(args.slice(2))} }`;
	            break;case '=':
	            	ret = `let ${translateToJS(args[0])} = ${translateToJS(args[1])};`;
	            	if(args.length != 2){
	            		throw new Error('= must have 2 params, args='+JSON.stringify(args));
	            	}
	            break;case '+=':
	            case '-=':
	            	ret = `${translateToJS(args[0])} ${op} ${translateToJS(args[1])};`;
	            break;case 'min': case 'max':case 'pow':case 'imul':
	            	ret = `Math.${op}(${args.map(arg => translateToJS(arg)).join(', ')})`;
	            break;case 'paintLineYXYXRGB':
	                ret = `dagball.ruleFuncs.paintLineYXYXRGB(${args.map(arg => translateToJS(arg)).join(', ')});`;
	            break;case 'sq':
	            	ret = ('('+translateToJS(args[0])+'**2)');
	            break;case 'rnd':
	            	ret = 'Math.random()';
	            break;case 'rndBit':
	            	ret = '(Math.random()<'+translateToJS(args[0])+'?1:0)';
	            break;case 'sqrt':case 'exp':case 'sin':case 'cos':case 'exp':case 'tanh':case 'min':case 'max':case 'floor':case 'ceil':case 'round':
	            	ret = 'Math.'+op+'('+translateToJS(args[0])+')';
	            // Add more operations as needed
	            break;default:
	            	ret = 'TODO['+op+']';
	                //throw new Error(`Unsupported operation: ${op}`);
	        }
        }
        console.log('translateToJS ret='+JSON.stringify(ret));
        return ret;
    };

    // Extract default values for variables
    const extractDefaults = (expr) => {
        const defaults = {};
        const parseExpr = (expr) => {
            if (typeof expr === 'string') { //example: 'maxManaBp@1' which means b.e.maxMana.p and to create that var (if not already exist) with default value of 1
                /*const match = expr.match(/([a-zA-Z]+)(B|C)(p|v|dp|dv|kv)@(.*)/);
                if (match) {
                    const [, varName, scope, type, defaultValue] = match;
                    const key = varName + (scope === 'B' ? '.b' : '.c');
                    defaults[key] = { ...defaults[key], [type]: parseFloat(defaultValue) || defaultValue };
                }*/
                //throw new Error('check for @defaultValue in varName55@2.34 for example');
                let foundTheAt = expr.indexOf('@');
                let defaultValue = foundTheAt!==-1 ? parseFloat(expr.substring(foundTheAt+1)) : undefined;
                let varName;
                let indexOfAtSymbolOrStrLen = foundTheAt!==-1 ? foundTheAt : expr.length;
                let varNameWithTypeSuffix = expr.substring(0,indexOfAtSymbolOrStrLen);
                
                //a is min, z is max, as they constrict toward eachother optionally to impulse/instantSetVal: ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity
                
                //if(foundTheAt !== -1){ //remove @defaultValue, keep var name
                //	expr = expr.substring(0,foundTheAt);
                //}
                let doEmptyCreate = false;
                if(varNameWithTypeSuffix.endsWith('Bp') || varNameWithTypeSuffix.endsWith('Cp')){
                	//defaults[key] = defaults[key] || {p:0,v:0,dp:0,dv:0,kv:0,ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity}; //FIXME what if it had @defaultValue so that || {...} should include default p value?
                	//FIXME remove the Bp/CP/Bdp/Cdp/etc
                	varName = expr.substring(0,indexOfAtSymbolOrStrLen-2);
                	defaults[varName] = defaults[varName] || {p:defaultValue,v:0,dp:0,dv:0,kv:0,ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity};
                }else if(varNameWithTypeSuffix.endsWith('Bv') || varNameWithTypeSuffix.endsWith('Cv')){
                	varName = expr.substring(0,indexOfAtSymbolOrStrLen-2);
                	if(defaultValue !== undefined){
                		throw new Error('TODO default v/velocity value, instead of just default p/position value. only p and v are game state. dp dv and kv are temp vars per physics cycle.');
                	}
                	defaults[varName] = defaults[varName] || {p:0,v:defaultValue,dp:0,dv:0,kv:0,ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity};
                	//defaults[varName] = defaults[varName] || {p:foundTheAt,v:0,dp:0,dv:0,kv:0,ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity};
                	//return (expr.endsWith('Bv')?'b':'c')+'.e.'+varName+'v';
                }else if(varNameWithTypeSuffix.endsWith('Bdp') || varNameWithTypeSuffix.endsWith('Cdp')){
                	varName = expr.substring(0,indexOfAtSymbolOrStrLen-3);
                	doEmptyCreate = true;
                	//return (expr.endsWith('Bdp')?'b':'c')+'.e.'+varName+'dp';
                }else if(varNameWithTypeSuffix.endsWith('Bdv') || varNameWithTypeSuffix.endsWith('Cdv')){
                	varName = expr.substring(0,indexOfAtSymbolOrStrLen-3);
                	doEmptyCreate = true;
                	//return (expr.endsWith('Bdv')?'b':'c')+'.e.'+varName+'v';
                }else if(varNameWithTypeSuffix.endsWith('Bkv') || varNameWithTypeSuffix.endsWith('Ckv')){
                	varName = expr.substring(0,indexOfAtSymbolOrStrLen-3);
                	doEmptyCreate = true;
                	//return (varNameWithTypeSuffix.endsWith('Bkv')?'b':'c')+'.e.'+varName+'v';
                }else{
                	doEmptyCreate = true;
                	return varNameWithTypeSuffix; //FIXME what kind of thing to return here? string? {}? number?
                	//throw new Error('TODO');
                }
                if(doEmptyCreate){
              		defaults[varName] = defaults[varName] || {p:0,v:0,dp:0,dv:0,kv:0,ap:-Infinity,zp:Infinity,av:-Infinity,zv:Infinity};
            	}
                return;
            }
            expr.forEach(subExpr => parseExpr(subExpr));
        };
        parseExpr(expr);
        return defaults;
    };

    // Main logic
    const cleanedInput = ruleString.substring(ruleString.indexOf('://')+3).trim(); //ruleBCDt://this is a comment, but FIXME the comment isnt necessary, this could break.
    const structuredExpr = parseLispSyntaxToStructuredArray(cleanedInput);
    const flops = estimateFlops(structuredExpr);
    const jsFunc = `(b,c,dt)=>{${translateToJS(structuredExpr).replaceAll(';;',';')}}`;
    const defaults = extractDefaults(structuredExpr);

    return {flops, jsFunc, defaults, parsed: structuredExpr, input: ruleString};
};
/*
// Example usage
console.log(ruleToJSFuncDefaults(`ruleBCDt://test moving life
(do 
    (= removeLifeFromC@0 (max 0 (* lifeCp@.5 dt)))
    (+= lifeBp removeLifeFromC)
    (-= lifeCp removeLifeFromC)
)`));
*/
//dagball.addExampleGameRules();
//for(let code of dagball.fobs.map(x=>(''+x))){
for(let code of dagball.exampleGameRulesCode){
	console.log('\n\nCODE: '+code+'\n');
	console.log('\nruleToJSFuncDefaults(code):\n'+JSON.stringify(dagball.ruleToJSFuncDefaults(code),null,'\t')+'\n');
}

dagball.addExampleGameRules = function(){ dagball.addFobs(...(dagball.exampleGameRulesCode)); };


dagball.Gob.prototype.paintOntoByterect = function(byterect){
	//FIXME paint this.pic instead if exists, and paint this.displayText if nonempty
	bytrect.paintYXRGBSafe(this.e.y.p, this.e.x.p, dagball.randByte(), dagball.randByte(), dagball.randByte());
};


//throw new Error('x and dx for all vars x, and should it also have velocity? I want to write it as varNameBp varNameBv varNameBdp varNameBdv varNameBkv varNameCp varNameCv varNameCdp varNameCdv varNameCkv etc, but i want it compiled to the efficient way.');


/*
//Start testRules...
// Mock conversion for the "newtonian gravity" rule
const newtonianGravityJS =
/*`(function(b, c, dt) {
	let dy = c.yP - b.yP;
	let dx = c.xP - b.xP;
	let distSq = (dy * dy) + (dx * dx);
	if (distSq) {
		let dist = Math.sqrt(distSq);
		let normDy = dy / dist;
		let normDx = dx / dist;
		let force = 0.001 / (0.01 + distSq);
		let addY = force * normDy * 0.5;
		let addX = force * normDx * 0.5;
		c.yDv -= addY;
		b.yDv += addY;
		c.xDv -= addX;
		b.xDv += addX;
	}
})
`*
`ruleBCDt://newtonian gravity, slightly adjusted to never divide by 0
(do
	(= dy (- yCp yBp))
	(= dx (- xCp xBp))
	(= distSq (+ (sq dy) (sq dx)))
	(if distSq (do
		(= dist (sqrt distSq))
		(= normDy (/ dy dist))
		(= normDx (/ dx dist))
		(= force (/ .001 (+ .01 distSq)))
		(= addY (* force normDy .5))
		(= addX (* force normDx .5))
		(-= yCdv addY)
		(+= yBdv addY)
		(-= xCdv addX)
		(+= xBdv addX)
	))
)`;
// Add the newtonian gravity test case
const testCases = [
	// Existing test cases...
	{
		description: "Newtonian gravity interaction between entities B and C",
		ruleJS: newtonianGravityJS,
		initialState: {
			b: { yP: 0, xP: 0, yDv: 0, xDv: 0 }, // Entity B position and velocity
			c: { yP: 3, xP: 4, yDv: 0, xDv: 0 }  // Entity C position and velocity, forming a 3-4-5 right triangle
		},
		expected: {
			// Expected changes in velocity for entities B and C due to gravity interaction
			// These values will need to be calculated based on the physics equation used in the rule
			b: { yDv: 0.000075, xDv: 0.0001 },
			c: { yDv: -0.000075, xDv: -0.0001 }
		}
	}
];
// Modified execution of test cases to include the newtonian gravity case
testCases.forEach(({ description, ruleJS, initialState, expected }) => {
	const ruleFunc = eval(ruleJS);
	ruleFunc(initialState.b, initialState.c, 1); // Execute the rule function with dt=1

	// Check results for both entities
	['b', 'c'].forEach(entity => {
		Object.entries(expected[entity]).forEach(([key, val]) => {
			if (Math.abs(initialState[entity][key] - val) > 1e-6) { // Allowing some margin for floating-point comparisons
				throw new Error(`Test failed for "${description}" on ${entity}.${key}: expected ~${val}, got ${initialState[entity][key]}`);
			}
		});
	});
});
console.log('testRules all tests pass');
*/


//has transparency. Use RED GREEN BLUE ALPHA constants. 4 bytes per pixel. Returns a ByteRect
dagball.randomGobPic = function(){
	let height = 7+dagball.randInt(5); //FIXME
	let width = 7+dagball.randInt(5); //FIXME
	let pic = new ByteRect(null, height, width);
	let i = 0;
	for(let y=0; y<height; y++){
		for(let x=0; x<width; x++){
			pic.bytes[i+RED] = dagball.randByte();
			pic.bytes[i+GREEN] = dagball.randByte();
			pic.bytes[i+BLUE] = dagball.randByte();
			pic.bytes[i+ALPHA] = dagball.weightedCoinFlip(.7) ? 255 : 0; //transparency
			i += 4;
		}
	}
	return pic;
};

//key is ball.id. val is ball.
//At most a few hundred balls (cuz tinyGlsl limit of 1000 floats/dimensions on screen at once)
//can have nonzero ball.influence at once, but there can be millions of balls with 0 influence,
//and influence can change, normally when you get near balls their influence is raised to 1 (smoothly, not all at once, but fast).
dagball.balls = {};

//team is RED GREEN or BLUE like rock paper scissors. ball can switch team when they're near eachother.
dagball.Ball = function(id, ob, influence, y, x, yv, xv, vd, red, green, blue, optionalTeam){
	this.id = id;

	//2024-1-21 havent used dagball.game.pos for a long time. TODO remove oThisBall?
	//offset in dagball.game.pos and dagball.game.vel which are 2 Float32Arrays of size at most 1000 (max floats/dimensions on screen at once).
	//This must be in range dagball.game.oBall() to dagball.game.oBall()+dagball.game.nBall*dagball.game.mBall and be a multiple of mBall relative to oBall.
	//mBall is floats per ball in GPU mem. nBall is number of balls on screen and in physics calculations. Set this to -1 when its not on screen.
	this.oThisBall = -1;
	//


	/*//2024-1-21 each ball.id is a made up string like 'sBall5', not wikibinator lambdas, but maybe someday they will be. ball.ob maybe will be later?
	Wikibinator lambda, Float32Array, string, number, etc. TODO CC (as in call/cc) balls, and GPT4 balls.
	A wikibinator lambda is a javascript lambda of 1 param.
	It curries more params like wikibinatorVM.ops.Pair(2)(3)+'' -> '(Pair 2 3)'.
	Wikibinator lambdas can take Float32Array string number etc as params, but dont modify them after that
	or you might break wikibinators function_param_return caching by making it mutable.
	Wikibinator lambdas are immutable as long as you dont break them by messing with their internals
	or modifying the arrays they wrap.
	..
	Do this comment (copied from somewhere else in this dagball html file 2023-10-25).
	..
	If I included this code, u could in a local html file call GPT4 to make interactive GPU circles (with different GPU code in each)
	without server. It pops up asking for openai API key. Should probably put that in iframe to prove my code isnt stealing ur
	key https://github.com/benrayfield/jsutils/blob/master/src/OpenAICallsItselfRecursively_2023-6-24-8p.html

	DagBall - 1000 dimensional hackerspace
	@DagBallGame
	·
	10m
	TODO make this GPT4 API that lets users put in their own OpenAI API key into an iframe so Dagball and other websites can
	request to use it N times but cant get the key. When the new language is working, GPT4 should be able to build game content live.
	*/
	this.ob = ob;
	this.influence = influence!==undefined ? influence : 1; //if 0 then dont compute the ball in physics nor display it
	this.y = y||0;
	this.x = x||0;
	this.yv = yv||0; //y velocity
	this.xv = xv||0; //x velocity
	this.vd = vd||0; //velocity decay per second
	this.red = red!==undefined ? red : dagball.randByte();
	this.green = green!==undefined ? green : dagball.randByte();
	this.blue = blue!==undefined ? blue : dagball.randByte();
	this.displayText = id; //FIXME
	this.lockPos = false; //if true, hold y and x constant, yv and xv as 0.

	//curveGrabLow, curveGrabMid, curveGrabHigh, which is 2 half parabolas centered at curveGrabMid,
	//can be 2 different heights. 2 0s has no effect regardless of other number.
	//TODO not all balls have this. only do it for the last n or the first n balls, to save on dimensions since max around 1000 in TinyGLSL,
	//and to save on space, if this should not be included in json if null.
	//this.curveGrab = [0,0,0]; //[curveGrabLow,curveGrabMid,curveGrabHigh]. If all 3 are 0, dont include this in json. If the first and last are 0, it has no effect.
	//this.curveGrab = null; //If curveGrab exists then ball is held still, as a tool used by mouse to reshape the curves.
	//this.curveGrab = [1,Math.random()*2-1,1]; //[curveGrabLow,curveGrabMid,curveGrabHigh]
	//this.curveGrab = [1,((Math.random()<.5)?-2:2),1]; //[curveGrabLow,curveGrabMid,curveGrabHigh]
	this.curveGrab = null; //default to normalBall. Add curveGrab by keyboard button or by loading it.
	
	
	//this.team = optionalTeam!==undefined ? optionalTeam : dagball.defaultTeam;
	this.team = optionalTeam!==undefined ? optionalTeam : (dagball.chk('rockPaperScissors') ? dagball.randInt(3) : dagball.defaultTeam);
	
	
	if(this.team < 3){
		this.updateColorByTeam();
	}
};

dagball.Ball.prototype.type = 'dagball_ball';
dagball.Ball.prototype.syncType = 'swarm';

//2024-9-15 building this, though controls may change later.
//changeBallType: 'Shift', //change between normalBall vs curveGrabBall of selected ball, by deleting or creating ball.curveGrab.
dagball.Ball.prototype.changeBallType = function(){
	this.curveGrab ? this.deleteCurveGrab() : this.createCurveGrab();
};

//be normalBall, not curveGrabBall. Do this with dagball.doAsap
//so the sorted order of curvegrabs first or was it last, doesnt break during physics.
dagball.Ball.prototype.deleteCurveGrab = function(){
	delete this.curveGrab;
	//FIXME only do this once per physics cycle, not after every ball, but it was throwing:
	//"Uncaught Error: balls are not sorted by those with curveGrabs first, i=0 numCurveGrabs=11. Caller should have used sortBallByCurveGrabs func."
	//dagball.sortBallsByCurveGrabFirst();
};

//be curveGrabBall, not normalBall
dagball.Ball.prototype.createCurveGrab = function(){
	//[curveGrabLow,curveGrabMid,curveGrabHigh]. TODO should it always be 0 in middle? -1 or 1? random in some range? or what?
	//Also, if changeBallType deletes curveGrab, should it be stored somewhere so to bring it back in case user didnt mean to delete it?
	this.curveGrab = [1,((Math.random()<.5)?-2:2),1];
	//FIXME only do this once per physics cycle, not after every ball, but it was throwing:
	//"Uncaught Error: balls are not sorted by those with curveGrabs first, i=0 numCurveGrabs=11. Caller should have used sortBallByCurveGrabs func."
	//dagball.sortBallsByCurveGrabFirst();
};

dagball.Ball.prototype.updateColorByTeam = function(){
	if(this.team >= dagball.teamColors.length){
		throw new Error(this.team='this.team >= dagball.teamColors.length='+dagball.teamColors.length);
	}
	let colorRGB = dagball.teamColors[this.team];
	this.red = (colorRGB>>>16)&0xff;
	this.green = (colorRGB>>>8)&0xff;
	this.blue = colorRGB&0xff;
	/*if(this.team == RED){
		this.red = 255;
		this.green = 0;
		this.blue = 0;
	}else if(this.team == GREEN){
		this.red = 0;
		this.green = 255;
		this.blue = 0;
	}else if(this.team == BLUE){
		this.red = 0;
		this.green = 0;
		this.blue = 255;
	}//else leave color as it is
	*/
};

//team can be RED (0) GREEN (1) BLUE (2) or ALPHA/dagball.defaultTeam (3).
dagball.Ball.prototype.setTeam = function(team){
	this.team = team;
	this.updateColorByTeam();
};

//rps means rockPaperScissors. change my team (and therefore color) depending on the team of what touched me.
//optionalChance is normally computed as some function of distance between 2 balls,
//so at any distance they could touch but alot higher chance the closer they are, so distance feels smoother that way.
//The reason its chance discrete observations like that is cuz team is discremete.
//
//TODO do this smoothly like the 3body sim in dagball/earlyExperiments/DiffeqBall001.html (instead of discrete changes,
//have it fall into local minmimum of poten on which team)
//
//dagball.Ball.prototype.rpsTouchedBy = function(otherBall, optionalChance){
dagball.Ball.prototype.rpsTouchedBy = function(otherBall){
	/*if(optionalChance!==undefined && optionalChance < 1){
		if(optionalChance <= 0){
			return;
		}
		if(optionalChance < Math.random()){
			return;
		}
	}*/
	/*if(this.team == RED){
		if(otherBall.team == GREEN){
			this.setTeam(GREEN);
		}
	}else if(this.team == GREEN){
		if(otherBall.team == BLUE){
			this.setTeam(BLUE);
		}
	}else if(this.team == BLUE){
		if(otherBall.team == RED){
			this.setTeam(RED);
		}
	}*/
	let teamSign = dagball.rpsTeamSign(this.team, otherBall.team);
	if(teamSign == 1){
		//FIXME is this backward?
		//this.setTeam(otherBall.team);
		otherBall.setTeam(this.team);
	}else if(teamSign == -1){
		//FIXME is this backward?
		//otherBall.setTeam(this.team);
		this.setTeam(otherBall.team);
	}
};

//TODO use this?
dagball.chancePerSecondOfTouchingAtDistance = function(distance){
	return 2/(.1+9*distance**2); //FIXME
};

//other can be ball or circ (its center). whatever type, just uses its .y and .x fields.
dagball.Ball.prototype.dist = function(other){
	return Math.hypot(this.y-other.y, this.x-other.x);
};

dagball.weightedCoinFlip = function(chance){
	return Math.random() < Math.max(0, Math.min(chance, 1));
};

//negate this to run from the team chasing you
dagball.rpsDistanceToAttractForce = function(dist){
	//return 1/(.2+dist**2);
	return 5/(.2+dist**2);
};

dagball.Ball.prototype.accelAtBall = function(ball, force){
	this.accelAt(ball.y, ball.x, force);
};

dagball.Ball.prototype.accelAt = function(y, x, force){
	if(this.dvelY === undefined) throw 'No ball.dvelY so cant accelerate';
	let dy = y-this.y;
	let dx = x-this.x;
	let dist = Math.hypot(dy, dx);
	if(dist){
		let normDy = dy/dist;
		let normDx = dx/dist;
		this.dvelY += normDy*force;
		this.dvelX += normDx*force;
	} 
};

//rps means rockPaperScissors. accelerates this ball toward/away from otherBall depending on its team, changes colors if needed, etc.
//Thi
//TODO do this smoothly like the 3body sim in dagball/earlyExperiments/DiffeqBall001.html
dagball.Ball.prototype.rpsReactTo = function(otherBall, dt){
	if(this===otherBall){
		return;
	}
	let dist = this.dist(otherBall);
	//let chance = dagball.chancePerSecondOfTouchingAtDistance(dist);
	//if(dagball.weightedCoinFlip(chance)){
	if(dist < dagball.ballRadius){
		this.rpsTouchedBy(otherBall);
		otherBall.rpsTouchedBy(this);
	}
	let force = dagball.rpsDistanceToAttractForce(dist);
	//FIXME what if theres more than 3 teams for other ball types? cursor ball is team 3?
	//Reversed and doesnt handle team 3/mouseCursor/etc: let teamSign = (otherBall.team-this.team)%3; //-1, 0, or 1
	let teamSign = dagball.rpsTeamSign(this.team, otherBall.team);
	this.accelAtBall(otherBall, force*teamSign); //chase 1 of the other colors, run from the other, neutral about your team
	//FIXME is it backward?
};

dagball.newRPSTournamentGraph = function(){ //neutral rock paper scissors (or should it be scissors paper rock, did i get the code backward?)
	let squareSide = 4;
	let arr = new Int8Array(squareSide*squareSide);
	arr.height =  arr.width = squareSide;
	arr.type = 'dagball_tournamentGraph';
	//let allowNeutralBetweenDifferentTeams = false; //-1 or 1 between a team and some other team, 0 between a team and itself
	//let allowNeutralBetweenDifferentTeams = true; //-1, 0, or 1 between a team and some other team, 0 between a team and itself
	for(let d=0; d<squareSide; d++){
		//for(let e=0; e<d; e++){ //leave diagonal as 0s.
		for(let e=0; e<squareSide; e++){ //leave diagonal as 0s.
			//let teamSign = allowNeutralBetweenDifferentTeams ? (dagball.randInt(3)-1) : (dagball.randInt(2)*2-1);;
			let teamSign = 0;
			//if(e > 0 && d > 0 && e!=d){
			if(e > 0 && d > 0){
				let em1 = e-1; //0 1 or 2
				let dm1 = d-1; //0 1 or 2
				teamSign = (em1-dm1+4)%3-1;
				/*if(em==0){

				}else if(em==1){

				}else{ //em==2

				}*/
			}
			//arr[e*squareSide+d] = -(arr[d*squareSide+e] = teamSign); 
			arr[e*squareSide+d] = teamSign;
		}
	}
	return arr;
};

dagball.newRandomTournamentGraph = function(squareSide){
	let arr = new Int8Array(squareSide*squareSide);
	arr.height =  arr.width = squareSide;
	arr.type = 'dagball_tournamentGraph';
	let allowNeutralBetweenDifferentTeams = false; //-1 or 1 between a team and some other team, 0 between a team and itself
	//let allowNeutralBetweenDifferentTeams = true; //-1, 0, or 1 between a team and some other team, 0 between a team and itself
	for(let d=0; d<squareSide; d++){
		for(let e=0; e<d; e++){ //leave diagonal as 0s.
			let teamSign = allowNeutralBetweenDifferentTeams ? (dagball.randInt(3)-1) : (dagball.randInt(2)*2-1);;
			arr[e*squareSide+d] = -(arr[d*squareSide+e] = teamSign); 
		}
	}
	return arr;
	/*for(let i=0; i<arr.length; i++){
		let x = i%squareSide; //inner
		let y = (i-x)/squareSide; //outer
		arr[i] = x==y ? 0 : dagball.weightedCoinFlip(.5);
	}*/
};

/*
var QVColors = Int32Array.of( //GPT4 suggested these 14 colors 2024-2-9 which I copied the html gpt made to display it to https://jsfiddle.net/jLdcxvag/
	0x808080, // Gray
	0x000000, // Black
	0xFFFFFF, // White
	0xFF0000, // Red
	0x00FF00, // Green
	0x0000FF, // Blue
	0x00FFFF, // Cyan
	0xFF00FF, // Magenta
	0xFFFF00, // Yellow
	0xFFA500, // Orange
	0x32bb32, //0x32CD32, // Lime Green
	0x800080, // Purple
	0xFFDAB9, // Light Peach
	0x000080, // Navy Blue
	0xaaaaaa // Transparent //FIXME should this be in this QVColors array?
);
*/
dagball.teamColors = Int32Array.of(
	0x808080, // Gray
	//0x000000, // Black
	//0xFFFFFF, // White
	0xFF0000, // Red
	0x00FF00, // Green
	0x0000FF, // Blue
	/*0x00FFFF, // Cyan
	0xFF00FF, // Magenta
	0xFFFF00, // Yellow
	0xFFA500, // Orange
	0x32bb32, //0x32CD32, // Lime Green
	0x800080, // Purple
	0xFFDAB9, // Light Peach
	0x000080, // Navy Blue
	*/
);

/*The rock paper scissors gameplay could generalize to any Tournament data structure. For example, rock->paper->scissors->rock
has 3 nodes and 3 edges. It works with any number of nodes that has at least 1 path from everywhere to everywhere.
--I said in https://twitter.com/benrayfield/status/1762167953024225673 2024-2-26.
https://en.wikipedia.org/wiki/Tournament_(graph_theory)
*/
//dagball.tournamentGraph = dagball.newRandomTournamentGraph(14);
dagball.tournamentGraph = dagball.newRPSTournamentGraph(); //neutral rock paper scissors (or did i get some parts backward?)
//dagball.tournamentGraph = dagball.newRandomTournamentGraph(dagball.teamColors.length);
//dagball.tournamentGraph = dagball.newRandomTournamentGraph(3); //rock paper scissors, 3 teams
dagball.numTournamentColors = ()=>dagball.tournamentGraph.height;

//1 to chase theirTeam. -1 to run from theirTeam. Anything else is 0 to do nothing.
dagball.rpsTeamSign = function(myTeam, theirTeam){
	return dagball.tournamentGraph[myTeam*dagball.tournamentGraph.height+theirTeam];
	/*if(myTeam == RED){
		if(theirTeam == GREEN){
			return -1;
		}else if(theirTeam == BLUE){
			return 1;
		}
	}else if(myTeam == GREEN){
		if(theirTeam == BLUE){
			return -1;
		}else if(theirTeam == RED){
			return 1;
		}
	}else if(myTeam == BLUE){
		if(theirTeam == RED){
			return -1;
		}else if(theirTeam == GREEN){
			return 1;
		}
	}
	return 0; //neutral
	*/
};

dagball.rpsAllBallPairs = function(dt){
	for(let b of dagball.balls){
		for(let c of dagball.balls){
			//TODO in order of pairs of ascending distance?
			b.rpsReactTo(c, dt);
		}
	}
};

dagball.Ball.prototype.rpsRandomizeTeam = function(){
	//this.setTeam(dagball.randInt(3));
	//this.setTeam(dagball.randInt(dagball.numTournamentColors()));
	this.setTeam(1+dagball.randInt(dagball.numTournamentColors()-1));
};

dagball.rpsRandomizeBallTeams = function(){
	for(let b of dagball.balls){
		b.rpsRandomizeTeam();
	}
};

dagball.Ball.prototype.computeInfluence = function(){
	if(this.influence == 0){
		return 0;
	}
	return this.influence*dagball.influenceAtYXR(this.y,this.x,dagball.ballRadius);
};

dagball.Ball.prototype.toMap = function(){
	let map = {
		id: this.id, //FIXME remove this
		mutid: this.id,
		influence: this.influence,
		y: this.y,
		yv: this.yv,
		x: this.x,
		xv: this.xv,
		//TODO ballBal and ballBal velocity (if dagball.isDoubleHeightmap)
		red: this.red,
		green: this.green,
		blue: this.blue,
		displayText: this.displayText,
		team: this.team,
		isSelected: this.isSelected || false,
	};
	if(this.curveGrab){
		map.curveGrab = this.curveGrab.slice();
	}
	if(this.lockPos){
		map.lockPos = true;
	}
	return map;
};

//to PV map, like in PV.js, a high dimensional vector data format.
dagball.Ball.prototype.toPv = function(){
	let ret = {id: this.mutid, pv: {
		pi: this.influence, vi: 0, //FIXME velocity of influence shouldnt always be 0?
		px: this.x, vx: this.xv,
		py: this.y, vy: this.yv,
	}};
	if(this.curveGrab){
		ret.pv.pcg = this.curveGrab[1];
		ret.pv.vcg = 0; //FIXME?
	}
	return ret;
};

dagball.fnToBall = function(fn){
	//TODO avoid triggering lazyeval of id since it can make fns alot faster than that, but if using id as primaryKey of the ball here...
	//Could use fn.n.locid() (local id which is 128 bits) which is not a global id but is unique within this run of the program.
	if(!dagball.getWikibinator203VM().isWikibinator203Lambda(fn)){
		throw new Error('Not a wikibinator203 lambda: '+fn);
	}
	let id = fn.n.id(); //marklar203bId
	if(!dagball.balls[id]){
		dagball.balls[id] = new dagball.Ball(id, fn); //TODO x y and other fields
	}
	return dagball.balls[id];
};


//a mutable circle with 0 or more child circles that are normally completely inside it,
//BUT since its mutable, that may not always be true. It should expand to make it true.
//TODO make an immutable form of this, similar to in wikibinator203's TreeUI html
//the Splat class is a mutable tree of UI and it has a mutable pointer to a Split
//which is an immutable DAG/forest, and each Split has 2 Split childs and 1 Splate
//which is the Split's immutable local state. Thats how Splat's state is updated recursively.
//Similarly, dagball.Circ will be a mutable DAG/forest of Circs,
//and can be snapshotted as TODO create an immutable object type.
//TinyGLSL does caching of the GPU stuff so whatever code string the Circs merge their codes to,
//TinyGLSL will handle it efficiently even if the same code string is generated multiple times.
//
//The code param can be javascript or TinyGLSL code. It should start with some variables:
//then 'javascript:' or 'tinyglsl:' on a line by itself.
//Before that there might be
//x:3.53
//y:2.1
//r:15
//tinyglsl:
//then the remaining lines
//are the tinyglsl code.
//
//TODO copy x y r between code and these vars if either is edited.
//
dagball.Circ = function(syncType, pos, vel, velDecay, y, x, r, red, green, blue, isSelected, text, edgesOut, edsOut, dimsOut, cellmataOrNull, neuralnetOrNull){
	//TODO remove in this constructor: pos, vel, and maybe velDecay, since those happen in this.edsOut which are (incompletely so far 2023-10-24) copied to/from dagball.game.pos and .vel.

	//FIXME todo use the stuff in Dag and DagStuff js maps {} but Circ should maybe still be the only object on screen
	//cuz its how things get displayed.

	//FIXME. id should start with the syncType letter [s for swarm. c for const. p for pubkey] BUT since i (what was i gonna write?...)
	this.id = null;


	//FIXME some vars should be 
	this.syncType = syncType;
	this.lockCirc = false; //lock this.y this.x this.r (its circle on screen)? Else let it move around based on what its near and other UI based energyfuncs etc.
	this.lockText = false; //lock this.text, hold it to the value it currently is?
	this.lockEdgesOut = false;  //lock this.edgesOut contents?

	//if true, this.edgesOut can change to have cycles, and the DAG does not look past that for computing ids (pubkey signs next set of edgesOut and local fields etc),
	//such as the 2 kinds of voting
	//(dagball.Player should be replaced by dagball.Circ using edgesOut but keep the comments, very important comments on the kind
	//of voting there and how it works with hopfield constraint solving (not storing hopfield edges cuz theyre derived from distance
	//but using the hopfield math)). A player may have multiple pubkeys, 1 for each kind of voting, 1 for likes, 1 for dislikes, 1 for things the player thinks are true,
	//1 for things the player thinks are false (other player says something in a circ.text, that an edgesOut is to, etc).
	//OR maybe there will be multiple edge types, as dagball.Edge could have a type
	this.isPubkey = false;

	//this.priority and this.influence are only used in the second dag level of circs,
	//not the leafs right under them. Only the circs that have GPU/GLSL code,
	//so not as much of a dag as I was planning (just those 2 layers, with players above them as a third layer),
	//but other dag stuff will likely get added later. this.circExists is maybe used for both those lowest layers.
	
	//sum of player.influence*player.circExistVotes[this]. higher is better. 0 or negative means circExists is false.
	this.priority = 1;

	//computed by sorting circs by descending priority, turn all circs off, loop over them,
	//and let hopfield net (dont store the weights since they're derived from distance between pairs of circs) turn some circs on.
	this.circExists = true;

	//computed as weightedMedian of [player.influence,player.circInfluenceVotes[this]] forall players in that room/game/namespace.
	//scalar field output is multiplied by this before adding to the combined scalar field. Its the amount of influence of this circ's GLSL code.
	this.influence = 1; //FIXME this might just be relevant

	//this.daglev = null; //FIXME not sure if will do even/odd daglevs (child is 2 hops down) vs child is 1 hop down as usual in dags.

	//TODO should there be this.name?
	/*
	this.pos = pos; //position. Position goes into GPU but vel and velDecay and the other number vars dont.
	this.vel = vel; //velocity
	this.velDecay = velDecay; //velocityDecay. TODO should mveldecay be global instead of varying per var/dimension?
	*/

	//null or: wikibinator203 fn, a universal pattern-calculus combinator that can be used for scaling up math and computing systems, in theory.
	//Call fn on fn to find or create fn.
	this.fn = null;

	//null or: instance of dagball.CellmataState. Its code should be updated to equal this.text, and its aftrans updated when this circ moves or is resized etc.
	//Its normally a 2d or 3d cellular automata, such as rule110 (2d) or conways game of life (3d) or stuff like https://github.com/benrayfield/timelessCellularAutomataPuzzleGame
	//use this.cellmata.pos.bilinearInterpolate(ballY,ballX) to get height of heightmap at a y and x. TODO gpu optimize that for faster painting screen.
	//Physics works by position (in potential energy as scalar field) and velocity and velocityDecay as usual in dagball.Circs.
	//If this is nonnull then this dagball.Circ displays and does physics by convolutional scalar field based cellular automata.
	//Multiple cellular automata can partially or completely overlap to hold their 2d or 3d grid states together.
	this.cellmata = cellmataOrNull; //as of 2024-6-2 this has never been used. maybe should remove it? or maybe us e it later.

	this.preferCpu = false; //if true, do physics and graphics on CPU, which means it can (TODO) have alot more stuff at once cuz it has more memory available, and more sparse. Else GPU (default).

	//this.nn will always start null and be filled in by caller after creating circ if nn exists.
	//FIXME "if(map.nn){ //cuz of cycle circ.nn.circ. FIXME should nn (a RbmCircBridge) lack the circ ptr and take it as a param in its relevant funcs?"
	//neuralnet/nn. an optional dagball.RbmCircBridge that wraps a dagball.RbmLayer (possibly other kinds of neuralnet later)
	//whose visibleNodes are 1 bigger than edsOut.length (first index is always 1 for biases). Its weights dont go in eds.
	this.nn = neuralnetOrNull;
	if(this.nn && (!this.nn.doPhysics || this.nn.type!='dagball_rbmCircBridge')){
		Err('circ.nn is not a dagball.RbmCircBridge: '+this.nn);
	}

	this.y = y; //circle center x
	this.x = x; //circle center y
	//radius that the circle has an influence on. scalarField out (potentialEnergy) is windowed,
	//multiplied by something similar to a bellcurve (TODO choose a function, one thats exactly 0,
	//not just near 0, past the circle)
	this.r = r;
	this.red = red;
	this.green = green;
	this.blue = blue;
	this.isSelected = isSelected;
	//code should use parr[o+0] to parr[o+c-1] where c is this.childs.length, cuz "int o" will be set before the code runs.
	//TODO use p[c] instead, and replace 'p[' with 'parr[o+'. BUT dont replace 'othervarnamep[' despite it contains 'p['.
	//Code can therefore loop over chosen ranges of childs, within its range of parr, if it wants to,
	//like the first example code loops over a few frequencies each with a phase.
	//Code only computes what to add to potentialEnergy (the combined scalar field). Return it by setting potenOne = ... in code.
	//TODO also have a mutable local float[] that can be read and written local[l+number] or call that q[number].
	//All the circs can share the same local[]/q[] but should only read an index in it after writing that index,
	//so they dont read things written by other circs compiled together. TODO check code for that kind of thing at runtime.
	//For example, ForestCurveFit has a mutable float[20] per GPU thread and has about 800 floats in glsl "uniform" memory
	//(optimization of it being constant until GPU returns to CPU). So the in-game editor will be flexible enough
	//to create ForestCurveFit in a circle.
	//this.code = code;
	//
	//is TinyGLSL code if this is a GpuCirc. If its above GpuCirc, it might be text a person typed, javascript code, a wikibinator203 id, etc.
	//Anywhere in this text that an id occurs, that becomes one of the childs.
	//This might be a json map of some data structure the players make up. Not sure what this will become,
	//but (TODO) the general idea is when this Circ is selected, the text appears in the text editor on the left/top of screen.
	this.text = text;
	//this.childs = childs;
	this.edgesOut = edgesOut; //instances of dagball.Edge. TODO display edgesOut and edsOut from different parts of the circle perimeter.
	this.edsOut = edsOut; //instances of dagball.Ed
	//dagball.Dim is the extra sparse form of dagball.Ed, so sparse that it doesnt normally have a (y,x) and is used by var name instead.
	//This extra sparsity normally means its not easy to GPU optimize so runs on CPU, but thats a research path.
	//js {} of varName to dagball.Dim, used with this.text being something like 'javascriptDimsFunc:p=>((p.width.v-2*p.height.v)**2)'
	//(TODO use cachedEval from other code for js)
	//so in that case the {} might be {width: new dagball.Dim(34), height: new dagball.Dim(56.7), otherVar: new dagball.Dim(0)}
	this.dimsOut = dimsOut;
	this.addToDimsOut();
};

dagball.Circ.prototype.copy = function(){
	return dagball.mapToCirc(this.toMap()); //FIXME caller should change circ.mutid and circ.id?
};

//add force for poten at the given (z,y,x) to be higher or lower, as if a ball was there
//(normalBall pushes lower, curveGrabBall pushes toward its targetPoten by squaredDiff) but you could put force at any 2d (or 3d?) point.
//You could, for example, do this at all points on a multi-touch-screen to bend the cpucircs around users fingers.
//Computes circ.edsOut.length dimensional gradient at the given (z,y,x) before adding the force.
//Normally in a poten scalarField for physics the gradient is sum of many balls at many (y,x),
//but since this is a single ball, only creates part of the gradient. Adds it into ed.gradient of all eds in this circ.
dagball.Circ.prototype.zyxAccel = function(z, y, x, force){
	let epsilon = dagball.game.floatEpsilon; //TODO use doubleEpsilon instead cuz is in cpu? its still stored in float32s in Ap.Call.
	let dims = this.edsOut.length;
	let fl = this.cpuCall.par.floats;
	if(dims != fl.length){
		Err('this.edsOut.length ('+dims+') != this.cpuCall.par.floats.length ('+fl.length+')');
	}
	let neutralPoten = this.cpuPotenAtZYX(z, y, x); //set z y x in hdr array and call evan() once. throws if theres no this.cpuCall.
	//for(let ed of this.edsOut){
	for(let e=0; e<dims; e++){
		let prevPosAtDim = fl[e];
		fl[e] += epsilon; //WARNING: this will be z, y, or x at the first 3 eds ('hdr' array).
		//let potenAtModifiedVec = this.cpuCall.evan(); //dont need to set z y x again: let potenAtModifiedVec = this.cpuPotenAtZYX(z, y, x);
		let potenAtModifiedVec = this.cpuCall.evanCpuMainParloc(); //dont need to set z y x again: let potenAtModifiedVec = this.cpuPotenAtZYX(z, y, x);
		fl[e] = prevPosAtDim;
		let observedGradient = (potenAtModifiedVec-neutralPoten)/epsilon;
		this.edsOut[e].gradient += force*observedGradient;
		/*
		let prevPosAtDim = ed.pos;
		ed.pos += epsilon; //WARNING: this will be z, y, or x at the first 3 eds ('hdr' array).
		let potenAtModifiedVec = this.cpuCall.evan(); //dont need to set z y x again: let potenAtModifiedVec = this.cpuPotenAtZYX(z, y, x);
		ed.pos = prevPosAtDim;
		let observedGradient = (potenAtModifiedVec-neutralPoten)/epsilon;
		ed.gradient += force*observedGradient;
		*/
	}
};

//This is for doing ball_cpucirc physics, modifying circ.edsOut[int].gradient for most or all eds in this circ.
dagball.Circ.prototype.cpuPhysics = function(){
	//TODO octree to narrow it down by z y x radius of the circ, instead of brute force looping here
	for(let ball of dagball.balls){
		if(this.containsBall(ball)){
			//FIXME do curveGrabBall if ball.curveGrab exists but for now 2024-6-9-1250aET just do them all as normal balls.
			let z = 0; //FIXME
			let force = 1; //FIXME
			//let force = 15; //FIXME
			//let prevGradientZ = this.edsOut[0].gradient;
			let prevGradientY = this.edsOut[1].gradient;
			let prevGradientX = this.edsOut[2].gradient;
			this.zyxAccel(z, ball.y, ball.x, force);
			let nextGradientY = this.edsOut[1].gradient;
			let nextGradientX = this.edsOut[2].gradient;
			let changedGradientY = nextGradientY-prevGradientY;
			let changedGradientX = nextGradientX-prevGradientX;
			//move the (z,y,x) part of the gradient from circ to ball
			ball.gradientY += changedGradientY;
			ball.gradientX += changedGradientX;
			this.edsOut[1].gradient = prevGradientY; //could leave this as it is since it will be overwritten by next (z,y,x) query.
			this.edsOut[2].gradient = prevGradientX;
		}
	}
};

//add potens into those floats.
//display, not physics (though caller might use display to sample 2d points to do physics at in "wavefunction collisions" or gooSync/gooGroup/neuralGoo/etc)
dagball.Circ.prototype.cpuPaintPotensIntoFloatArray = function(floats, height, width, aftrans){
	//console.error('TODO put floats into circ.cpuCall.par.floats from circ.edsOut[int].p')
	//game coords
	let gameFromY = this.y-this.r;
	let gameToY = this.y+this.r;
	let gameFromX = this.x-this.r;
	let gameToX = this.x+this.r;
	//canvas coords
	let fromY = Math.max(0, Math.floor(aftrans.forwardY(gameFromY))); //incl
	let toY = Math.min(Math.ceil(aftrans.forwardY(gameToY)), height); //excl
	let fromX = Math.max(0, Math.floor(aftrans.forwardX(gameFromX))); //incl
	let toX = Math.min(Math.ceil(aftrans.forwardX(gameToX)), width); //excl
	let r2 = this.r*this.r;
	//FIXME if this circ doesnt display despite this.influence being positive (normally 1)
	//its cuz circ is too far away from center of view so computeInfluence returns 0 (or near 0?)
	let weight = this.computeInfluence();
	let cpuCall = this.cpuCall;
	//Err('FIXME dont create circ.cpuCall. Instead use the same apCall for GPU and CPU and call apCall.evanCpuMain(), instead of [let poten = cpuCall.evan()] below. Still set [cpuCall.par.floats[1] = gameY] etc below but its apCall.par.floats[1] and [2] or whatever the indexs are.');
	//starts with z y x. May just be those 3 things. z is normally always 0 but is for future expansion. Axgob will have z y x (and be superexponentially sparse matrix).
	//let cpuHeadersArrayPtr = cpuCall.par.ptr('cpuHeaders'); //cpuHeaders is added in the first call.evan() which compiles to javascript and caches it in call.cachedEvanJsFunc.
	//will always be 0: let hdrPtr = cpuCall.par.ptr('hdr'); //hdr is at least z y x, and if bigger then includes cInfluence cz cy cx cr.
	let gameZ = 0;
	//cpuCall.par.floats[hdrPtr] = gameZ; //z y x
	cpuCall.par.floats[0] = gameZ; //z y x
	for(let y=fromY; y<toY; y++){ //canvas y
		let gameY = aftrans.reverseY(y);
		let gameX = aftrans.reverseX(fromX);
		let gameDx = aftrans.reverseX(fromX+1)-gameX;
		let offset = y*width+fromX;
		for(let x=fromX; x<toX; x++){ //canvas x
			let gameYFromCircCenter = gameY-this.y;
			let gameXFromCircCenter = gameX-this.x;
			let gameDistSqFromCircCenter = gameYFromCircCenter*gameYFromCircCenter + gameXFromCircCenter*gameXFromCircCenter;
			//let distSq = Math.hypot(gameY-this.y, gameX-this.x);
			if(gameDistSqFromCircCenter <= r2){ //is inside circ. TODO optimize, start fromX and toX at a horizontal line completely inside circle so dont have to check if(distSq <= r2) here.
				//let poten = Err('TODO compute poten from the ape made of code of this.text');
				//uses this.cpuCall which is an Ap.Call made of (TODO 2024-6-2+) a prefix, this.beforeText, this.text, and suffix.
				//If it doesnt exist then check the alwaysUpdateViewInNextState box cuz the code is disorganized as of 2024-6-2+ where circ.cpuCall is created.
				//Also, to deal with the overhead of stuff early in the function, including defining a bunch of constants etc, maybe should move
				//the "for(let y=fromY; y<toY; y++){ //canvas y" and "for(let x=fromX; x<toX; x++){ //canvas x" loops into that generated js code?
				//If this is very slow, then do that. If you get at least a few hundred million multiplies per second in CPU, then its doing ok.
				//GPU does many gigaflops up to a few teraflops depending how its used, but CPU is alot slower to run but much faster (within 1 video frame) to compile.
				//You probably want to move some of the circs into GPU after you're more settled on what they should be, after you havent edited them for some time,
				//which you can do by setting circ.preferCpu to false and fixing any bugs in viewDedupString since those might prevent recompiling when it changes
				//cuz viewDedupString was designed before circ.preferCpu.
				//let poten = this.cpuPotenAtZYX(0, gameY, gameX);
				cpuCall.par.floats[1] = gameY; //cpuCall.par.floats[hdrPtr+1] = gameY;
				cpuCall.par.floats[2] = gameX; //cpuCall.par.floats[hdrPtr+2] = gameX;
				//let poten = cpuCall.evan(); //fast javascript EVAl (of ape) to Number (EVAN). TODO optimize, make sure this does not allocate any heap memory.
				let poten = cpuCall.evanCpuMainParloc();
				floats[offset] += weight*poten;
			}
			offset++;
			gameX += gameDx;
		}
	}

};

//see sparseWorld checkbox
dagball.Circ.prototype.computeInfluence = function(){
	if(this.influence == 0){
		return 0;
	}
	return this.influence*dagball.influenceAtYXR(this.y,this.x,this.r);
};

//fills this.nn
dagball.Circ.prototype.createNN = function(hiddenSize, weightAve, weightStdDev){
	let visibleSize = 1+this.edsOut.length; //+1 cuz [0] is always 1 to multiply biases by.
	let weights = new Float32Array(visibleSize*hiddenSize);
	for(let i=0; i<weights.length; i++){
		weights[i] = weightAve+weightStdDev*dagball.randBell();
	}
	let strength = 1;
	let add = -2;
	let mul = 4;
	return this.nn = new dagball.RbmCircBridge(new dagball.RbmLayer(visibleSize, hiddenSize, weights), this, strength, add, mul);
};

dagball.Circ.prototype.mapToEd = function(map){
	if(map.type != 'dagball_ed'){
		throw new Error('Not an ed: '+map);
	}
	let ed = new dagball.Ed(
		this,
		map.y,
		map.x,
		map.pos,
		map.vel,
		map.velDecay
	);
	if(map.slidersFunc && map.sliders && map.sliders.length){
		let sliderVals = [...(map.sliders)];
		let slidersFunc = map.slidersFunc ? dagball.cachedApeFuncJs(map.slidersFunc) : dagball.defaultSlidersFunc;
		//-1 cuz last param of ed.slidersFunc is ed.pos. params before that are ed.sliderKnobs (toString of each is knob.val a number, or could use .val directly).
		let correctListSize = slidersFunc.length-1;
		if(sliderVals.length != correctListSize){
			console.log('WARNING: sliderVals.length('+sliderVals.length+') != correctListSize('+correctListSize+') so creating the right number of slider vals but theyre random, ed='+ed);
			sliderVals = [];
			for(let i=0; i<correctListSize; i++){
				sliderVals.push(Math.random()*2-1);
			}
		}
		ed.bootSliderKnobs(sliderVals, slidersFunc);
		/*
		//ed.sliders = [...(map.sliders)];
		let radius  = 6;
		let y = ed.y+Math.random()*30; //FIXME
		let x = ed.x+Math.random()*30; //FIXME
		let red = dagball.randByte();
		let green = dagball.randByte();
		let blue = dagball.randByte();
		ed.sliderKnobs = map.sliders.map((val,index)=>(new dagball.EdSliderKnob(ed,index,val, radius, y, x, red, green, blue)));
		*/
		//(dagball.apeFuncJs(apeCode)+'')==apeCode and apeCode starts with 'ape:' or 'apeV1:' or if neither then prefixes it with 'ape:'.
		//ed.slidersFunc = map.slidersFunc ? dagball.apeFuncJs(map.slidersFunc) : null;
	}//else{
	//	ed.sliders = [Math.random()*2-1, Math.random()*2-1, Math.random()*2-1]; //FIXME this is a simple experiment
	//	ed.slidersFunc = dagball.apeFuncJs('{exampleSlidersFunc? {a float} {b float} {c float} {d float} (funcReturn 0)}'); //FIXME
	//}
	return ed;
};

dagball.Circ.prototype.Id = function(){
	if(!this.id){
		//FIXME should use .mutid and get rid of .id (see Dagverse.js)
		//FIXME. if its synctype of swarm, can just make up a name that starts with dagball.syncTypeToId(this.syncType) but if its a synctype of const or pubkey, theres other rules.
		this.id = dagball.syncTypeToChar[this.syncType]+'Circ'+dagball.randInt(1000000000)+dagball.randInt(1000000000);
		//TODO? dagball.idToOb[this.id] = this;
	}

	return this.id;
};

dagball.Circ.prototype.removeAllEds = function(){
	this.edsOut = [];
};

//returns a new dagball.Ball even if that ball is already loaded. Doesnt put it in dagball.balls or dagball.view.balls so caller might want to do that
//andOr merge it with the ball returned by dagball.ball(id). Or maybe should create the ball that way? Will do that.
dagball.mapToBall = function(map){
	//TODO verify map.type=='dagball_ball'?
	//dagball.Ball = function(id, ob, influence, y, x, yv, xv, vd, red, green, blue){
	let ob = null; //TODO get it from map.id, such as if its the id of a wikibinator203 lambda/fn, or a Float32Array or what other object types might be here? TODO. 2023-11-13 ob isnt used yet.
	//return new dagball.Ball(map.id, ob, map.influence, map.y, map.x, map.yv, map.xv, map.vd, map.red, map.green, map.blue);
	let ball = dagball.ball(map.id);
	ball.ob = ob; //FIXME what if it already had an ob and this just gets rid of it?
	ball.influence = map.influence;
	ball.y = map.y;
	ball.x = map.x;
	ball.yv = map.yv;
	ball.xv = map.xv;
	ball.vd = map.vd;
	ball.red = map.red;
	ball.green = map.green;
	ball.blue = map.blue;
	ball.team = map.team!==undefined ? map.team : (dagball.chk('rockPaperScissors') ? dagball.randInt(3) : dagball.defaultTeam);
	if(map.curveGrab){
		if(map.curveGrab.length != 3) Err('map.curveGrab='+JSON.stringify(map.curveGrab));
		ball.curveGrab = map.curveGrab.slice();
	}
	if(map.displayText !== undefined){
		ball.displayText = map.displayText; //else it defaults to id in Ball constructor
	}
	if(map.lockPos !== undefined){
		ball.lockPos = map.lockPos;
	}
	ball.isSelected = map.isSelected || false;
	return ball;
};

dagball.mapToCirc = function(map){
	//TODO verify map.type=='dagball_circ'?
	let edgesOut = map.edgesOut ? map.edgesOut.map(dagball.mapToEdge) : [];
	let edsOut = [];
	let dimsOut = []; //FIXME
	let cellmataOrNull = null; //FIXME
	let neuralnetOrNull = null; //let neuralnetOrNull = map.nn ? dagball.mapToRbmCircBridge(map.nn) : null;
	let circ = new dagball.Circ(map.syncType, map.pos, map.vel, map.velDecay,
		map.y, map.x, map.r, map.red, map.green, map.blue, map.isSelected, map.text, edgesOut, edsOut, dimsOut, cellmataOrNull, neuralnetOrNull);
	if(map.id){
		circ.id = map.id;
	}
	if(map.mutid){
		circ.mutid = map.mutid; //mapToRbmCircBridge looks for map.nn.circMutid
	}
	for(let edMap of map.edsOut){
		circ.edsOut.push(circ.mapToEd(edMap));
	}
	if(map.nn){ //cuz of cycle circ.nn.circ. FIXME should nn (a RbmCircBridge) lack the circ ptr and take it as a param in its relevant funcs?
		circ.nn = dagball.mapToRbmCircBridge(map.nn,circ);
	}
	circ.preferCpu = map.preferCpu || false;
	return circ;
};

dagball.Circ.prototype.Mutid = function(){
	if(!this.mutid){
		let id = this.Id();
		if(!id.startsWith('s')){
			Err('Not a swarm/mutableKindOfSyncSomehow id: '+id);
		}
		this.mutid = id;
	}
	return this.mutid;
};

dagball.Circ.prototype.toMap = function(){
	//TODO just loop over the string boolean and number fields copying them as they are, and only write code for the arrays and maps?
	let dimsOut = {};
	/*TODO deal with syncType char of 'd' vs should it be s for swarm which dagball.Dims normally are?
	For now just dont include .dimsOut, which 2023-10-24 im not using yet.
	Dagball080.html:3212 Uncaught width == id != dim.id == dwidth
	dagball.Circ.toMap @ Dagball080.html:3212
	gameStateToMap @ Dagball080.html:1675
	gameStatetoJSON @ Dagball080.html:1682
	quicksave @ Dagball080.html:1694
	onclick @ Dagball080.html:7704
	for(let id in this.dimsOut){
		let dim = this.dimsOut[id];
		if(id != dim.id){
			throw id+' == id != dim.id == '+dim.id;
		}
		dimsOut[id] = dim.toMap();
	}*/
	let mutid = this.Mutid();
	let ret = {
		id: mutid, //FIXME remove this
		//see Dagverse.js for mutid/mutableObject vs dvid/immutableObject. TODO rename .Id func to .Mutid? No, its only that if starts with s/swarm synctype.
		mutid: mutid,
		type: this.type,
		syncType: this.syncType,
		lockCirc: this.lockCirc,
		lockText: this.lockText,
		lockEdgesOut: this.lockEdgesOut,
		isPubkey: this.isPubkey,
		priority: this.priority,
		circExists: this.circExists,
		influence: this.influence,
		pos: this.pos, //FIXME remove pos and vel since those are in dagball.Ed now
		vel: this.vel, //FIXME remove pos and vel since those are in dagball.Ed now
		velDecay: this.velDecay, //FIXME?? remove pos and vel since those are in dagball.Ed now. velDecay too?
		//TODO? cellmata: this.cellmata,
		y: this.y,
		x: this.x,
		r: this.r,
		red: this.red,
		green: this.green,
		blue: this.blue,
		isSelected: this.isSelected,
		text: this.text,
		edgesOut: this.edgesOut.map(e=>e.toMap()),
		edsOut: this.edsOut.map(e=>e.toMap()),
		dimsOut: dimsOut,
	};
	if(this.preferCpu){
		ret.preferCpu = true; //else dont include preferCpu (default false)
	}
	//if(this.nn){
		ret.nn = this.nn ? this.nn.toMap() : null; //normally this is null or a dagball.RbmLayer.
	//}
	return ret;
};

dagball.Circ.prototype.toPv = function(){
	if(!this.mutid) Err('No mutid. TODO make it always the hash id. and use some prefix h_ a_ b_ c_ etc');
	let ret = {id: this.mutid, pv: {
		pi: this.influence, vi: 0, //FIXME velocity of influence shouldnt always be 0?
		px: this.x, vx: 0, //FIXME
		py: this.y, vy: 0, //FIXME
		pr: this.r, vr: 0, //radius. FIXME velocity of radius is not always 0?
	}};
	for(let e=0; e<this.edsOut.length; e++){
		let ed = this.edsOut[e];
		ret.pv['p'+e] = ed.pos;
		ret.pv['v'+e] = ed.vel;
	}
	return ret;
};

//likely there will be wikibinator204 that includes most or all of the Ap.js GPU opcodes
//(each wikibinator version going forward can have at most 128 opcodes but they can be split to include whole
//turing complete systems each, as long as they are each a constant number of params), but thats for much later (now is 2024-1-6).
//Wikibinator203 is the universal combinator, if you click the "load Wikibinator" button,
//like u can call Wikibinator203(Wikibinator203)(Wikibinator203(Wikibinator203))+'' on browser console which returns 'Op101'.
dagball.getWikibinator203VM = function(){
	return Wikibinator203.n.vm; //created by Wikibinator203VM.js which is loaded in window.onload so dagball starts displaying graphics and doing game physics before loading wikibinator for speed.
	/*if(dagball.wikibinator203VM === undefined){
		try{
			return dagball.wikibinator203VM = eval('Wikibinator203');
		}catch(e){
			try{
				document.getElementById('loadWikibinatorButton').click();
				return dagball.wikibinator203VM = eval('Wikibinator203');
			}catch(e2){
				return dagball.wikibinator203VM = null; //means dont look for it again
			}
		}
	}else{
		return dagball.wikibinator203VM; //the VM or null
	}*/
};

//TODO use dagball/lib/Axgob.js instead of Wikibinator203, but 2024-5-9 its still only passing basic testcases and is loaded into this dagball.html automatically.
//wikibinator version 203.3 (todo make a release with whatever wikibinator is now around 2023-10-25+) and call it 2033.
//Theres an earlier release 203.2.
dagball.Circ.prototype.toWikibinator203Lambda = function(){
	let wvm = dagball.getWikibinator203VM();
	//FIXME escape text
	//This is just for basic testing. Theres other fields to include. Also quoted string literals dont work in wikib yet 2023-10-25 but small strings without whitespace do.
	return wvm.eval("(TypevalC dagball_circ (TreemapNorm (Put text \""+this.text+"\" (Put numEds "+this.edsOut.length+" (EmptyTreemap GodelLessThan)))))");
};

//fn aka function aka wikibinator203 lambda.
dagball.Circ.prototype.toFn = function(){
	return this.toWikibinator203Lambda();
};

//save state of circ to json (returned) so you can dagball.loadJson(json) to get Circ back later or to sync across network.
//TODO also allow this in circs that exist?
dagball.Circ.prototype.toJSON = function(){
	return JSON.stringify(this.toMap()); //TODO make it deterministic order of keys and whitespace
};

dagball.Circ.prototype.type = 'dagball_circ';

//outputs range 0 (inclusive) to 2*Math.PI (exclusive)
dagball.normAngle = angle=>{
	angle = angle % (2*Math.PI);
	if(angle < 0) angle += 2*Math.PI;
	return angle;
};

//returns null if its a dagball.Edge or if its a dagball.Ed whose .edGroup is null or if there are no eds (this.edsOut.length===0).
dagball.Circ.prototype.edGroupAtAngle = function(angle){
	return this.edOrEdgeAtAngle(angle).edGroup;
};

dagball.Circ.prototype.edOrEdgeAtAngle = function(angle){
	if(this.edsOut.length === 0){
		return null;
	}
	angle = dagball.normAngle(angle); //becomes range 0 (inclusive) to 2*Math.PI (exclusive)
	let eSize = this.eSize();
	let i = Math.round(eSize*angle/(2*Math.PI))%this.eSize();
	let e = this.getE(i); //may be a dagball.Edge or dagball.Ed.
	if(!e){
		throw new Error('No dagball.Ed or dagball.Edge at i='+i+' eSize='+eSize+' angle='+angle+' in circ='+this);
	}
	return e;
};

//See comment of dagball.Dim.prototype.poten which calls this on every Circ whose circ.dimsOut points at it.
//This is normally run on CPU when this.dimsOut is nonempty, and when it is empty (and this.edgesOut andOr this.edsOut are nonempty) its run on GPU, but could do both possible research path.
dagball.Dirc.prototype.dimsPoten = dagball.Circ.prototype.dimsPoten = function(){
	throw new Error('TODO if this.text starts with "javascriptDimsFunc:" (or something like that, TODO) then compile it (use cachedEval from my other code, TODO) and call that on this.dimsOut and return the scalar it returns');
};

dagball.Dirc.prototype.addToDimsOut = dagball.Circ.prototype.addToDimsOut = function(){
	for(let key in this.dimsOut){
		this.dimsOut[key].ircs.add(this);
	}
};

dagball.Dirc.prototype.removeFromDimsOut = dagball.Circ.prototype.removeFromDimsOut = function(){
	for(let key in this.dimsOut){
		this.dimsOut[key].ircs.delete(this);
	}
};

dagball.Circ.prototype.eSize = function(){
	return this.edgesOut.length+this.edsOut.length;
};

dagball.Circ.prototype.edgeIndex = function(i){
	return i;
};

dagball.Circ.prototype.edIndex = function(i){
	return this.edgesOut.length+i;
};

//i from 0 to this.eSize()-1. Returns angle (FIXME put it in that range after handle flipped y etc) 0 (inclusive) to 2*Math.PI (exclusive) of point on perimeter of this circle.
dagball.Circ.prototype.ePerimeterAngle = function(i){
	//return Math.PI/2 - i/this.eSize()*2*Math.PI; //start at top and go clockwise. FIXME this might be flipped cuz +y is normally down on screen
	return i/this.eSize()*2*Math.PI;
};

//i from 0 to this.eSize()-1. Returns y of point on perimeter of this circle.
dagball.Circ.prototype.perimeterY = function(i, optionalRadius){
	let radius = optionalRadius!==undefined ? optionalRadius : this.r;
	return this.y+radius*Math.sin(this.ePerimeterAngle(i));
};

//i from 0 to this.eSize()-1. Returns x of point on the perimeter of this circle.
dagball.Circ.prototype.perimeterX = function(i, optionalRadius){
	let radius = optionalRadius!==undefined ? optionalRadius : this.r;
	return this.x+radius*Math.cos(this.ePerimeterAngle(i));
};

dagball.Circ.prototype.eFromY = function(i){
	return this.perimeterY(i);
};

dagball.Circ.prototype.eFromX = function(i){
	return this.perimeterX(i);
};

dagball.Circ.prototype.eToY = function(i){
	if(i < this.edgesOut.length){
		return this.edgesOut[i].child.y;
	}else{
		return this.edsOut[i-this.edgesOut.length].y;
	}
};

dagball.Circ.prototype.eToX = function(i){
	if(i < this.edgesOut.length){
		return this.edgesOut[i].child.x;
	}else{
		return this.edsOut[i-this.edgesOut.length].x;
	}
};

//get existing child that may be a dagball.Edge or a dagball.Ed. i ranges 0 to this.eSize()-1.
dagball.Circ.prototype.getE = function(i){
	if(i < this.edgesOut.length){
		return this.edgesOut[i];
	}else{
		return this.edsOut[i-this.edgesOut.length];
	}
};

//when there are n gpu vars (parr[o++] etc) in this.text and this.text stats with 'tinyglsl:' or something like that (TODO),
//call this to make some short Ed lines from circle perimeter, 1 per var.
dagball.Circ.prototype.replaceEdsWithDefaultsForNVars = function(n){
	while(this.edsOut.length > n) this.edsOut.pop();
	while(this.edsOut.length < n) this.edsOut.push(new dagball.Ed(this, 0, 0, 0, 0, 0));
	let radius = this.r*.85;
	for(let i=0; i<n; i++){
		let j = this.edIndex(i); //needs this.edgesOut.length and this.edsOut.length to be the right size, so cant add to the arrays while calling this.
		this.edsOut[i].y = this.perimeterY(j,radius);
		this.edsOut[i].x = this.perimeterX(j,radius);
	}
	/*this.edsOut = [];
	let radius = this.r*.85;
	for(let i=0; i<n; i++){
		let j = this.edIndex(i);
		this.edsOut.push(new dagball.Ed(this.perimeterY(j,radius), this.perimeterX(j,radius), 0, 0, 0));
	}*/
};


dagball.Circ.prototype.toString = function(){
	return 'Circ(id='+this.id+' y='+this.y+' x='+this.x+' r='+this.r+' red='+this.red+' green='+this.green+' blue='+this.blue+' isSelected='+this.isSelected+' text='+this.text+' edgesOut='+this.edgesOut+' edsOut='+this.edsOut+')';
};

dagball.Ball.prototype.centerDistanceYX = dagball.Circ.prototype.centerDistanceYX = function(y,x){
	return Math.hypot(this.y-y, this.x-x);
};

//distance from the parts of the circ on screen (just the perimeter for now, not the center or edge lines) to the (y,x). For example, to the mouse cursor (in some coordinate system, TODO).
dagball.Circ.prototype.uiDistanceToYX = function(y,x){
	let centerDist = this.centerDistanceYX(y,x);
	let edgeDist = Math.abs(centerDist-this.r);
	return Math.min(centerDist, edgeDist);
};

//null if none are near enough. Else picks one by uiDistanceToYX.
dagball.uiCircNearYXElseNull = function(y,x){
	var best = null;
	var bestDist = Infinity;
	for(let circ of dagball.circles){
		var dist = circ.uiDistanceToYX(y,x);
		if(dist < bestDist){
			best = circ;
			bestDist = dist;
		}
	}
	return (bestDist <= dagball.maxDistanceToSelect) ? best : null;
};

//list of dagball.Ball. maxDistance is to ball center
dagball.uiBallsNearYXElseNull = (y,x,maxDistance)=>dagball.balls.filter(b=>(b.centerDistanceYX(y,x)<=maxDistance));

//After uiCircNearYXElseNull to find circ, if you want to know the angle on the circ that y,x is nearest use this. Its for selecting dagball.EdGroups and TODO dagball.Edges.
dagball.uiAngleNearCircYX = function(circ,y,x){
	let angle = Math.atan2(y-circ.y, x-circ.x); //range plus/minus pi
	if(angle < 0) angle += 2*Math.PI; //range 0 to 2*pi
	return angle;
};

dagball.Circ.containsYX = function(y,x){
	return this.centerDistanceYX(y,x) <= this.r;
};

//includes if its on the line, the exact radius.
dagball.Circ.prototype.containsBall = function(ball){
	//FIXME dz, but most objects are 2d so far. planning upgrade to 3d in some cases, mostly sparse objects.
	let dy = ball.y-this.y;
	let dx = ball.x-this.x;
	return -this.r<=dy && dy<=this.r && -this.r<=dx && dx<=this.r && (dy*dy + dx*dx <= this.r*this.r); //fast square test before exact test
};

//FIXME does this overwrite an earlier "dagball.edgeTypes = {" in this file?
//UPDATE 2024-9-27, the likes and median voting has never been tested. Maybe later. Ive got alot of dimensions and shapes to deal with first.
dagball.edgeTypes = {
	//general: {description: 'the default edge. type. TODO use unknown for this edge type instead?'},
	dim: {description: 'is a dimension i read andOr write. This is normally used by GpuCircs to point at LeafVars'},
	like: {description: 'a player likes (vs dislikes) anything. Negative weight on this is dislike.'},
	//dislike: {description: 'a player dislikes (vs likes) anything'},
	true: {description: 'a player claims a thing is true. or false if negative weight.'},
	//false: {description: 'a player claims a thing is false'},	
	gpucircExistVote: {description: 'of dagball.Circ instance to number, and vec length (sqrt of sum of squares) of those numbers is 1. TODO vote 1 for some default circle so map isnt empty. TODO circ.priority is often set to sum of player.influence*player.circExistVotes[circ] forall players in that room/game/namespace. then hopfield network acts as constraint solver to make there be at most 1000 vars/dimensions within each local area, by including any pair of circs (hopfield edge between them) depending on radiusA+viewDist+radiusB-centerToCenterDistance. ... TODO code this with many Player objects in same browser, since the votes/vectors of other players will get copied to many computers and summed there. Possible way for players to vote on curve patterns of game world. 2 kinds of voting used together. Each vote for if a circle/node exists or not is a length 1 vector. Vote between -1 to 1 on each circle, or 0.1 on 100 circles, etc. Median vote on weight/influence per circle/node IF exists. Votes sum to node priority for constraint solver. Neg priority is always off. Hopfield net between circles. Edge between near circles. Bias per node so hopfield keeps density of vars under 1000 near every area. All nodes off. Loop by descending priority. Hopfield may turn node on.'},
	gpucircInfluenceMedianVote: {description: 'of dagball.Circ instance to number, and vec length doesnt matter, can be any numbers you want. TODO circ.weight or maybe it will be called circ.influence, is often set to the weightedMedian of [player.influence, player.circInfluenceVotes[circ]] forall players in that room/game/namespace. weightedMedian means each vote is a rectangle. Its width is player.influence, and its height is player.circInfluenceMedianVotes[circ], and they are layed side by side touching eachother, sorted by height, then find the vote thats horizontally in the middle, and the winning number is that height. Normal median voting has weight of 1 for all votes. this.circInfluenceMedianVotes = new Map();'},
	//TODO other common like/emoji/voting types
};

//returns existing dagball.Edge if there is one. default weight is 0 if you dont give it, if creating new edge, else leaves weight as it is.
dagball.Circ.prototype.edgeTo = function(edgeType, circTo, optionalWeight){
	for(let edge of this.edgesOut){
		if(edge.edgeType == edgeType && edge.child == circTo){
			if(optionalWeight !== undefined){
				edge.weight = optionalWeight;
			}
			return edge;
		}
	}
	let edge = new dagball.Edge(edgeType, circTo, optionalWeight||0);
	this.edgesOut.push(edge);
	return edge;
};

//opposite of circ.edgeTo
dagball.Circ.prototype.deleteEdgeTo = function(edgeType, circTo){
	this.edgesOut = this.edgesOut.filter(e=>!(e.edgeType == edgeType && e.child == circTo));
};


//simple edge to here. TODO reuses it in some cases?
dagball.Circ.prototype.e = function(edgeType, optionalWeight){
	//if(this.e_ === undefined) this.e_ = new dagball.Edge(this, 1);
	//return this.e_;
	let weight = optionalWeight!==undefined ? optionalWeight : 1;
	return new dagball.Edge(edgeType, this, weight);
};

//TODO limit to 1 of each edge type per dagball.Circ parent and its child. Have func to add to weight from the parent.

//as of 2024-5-24 these were only used in the example circs

dagball.Circ.prototype.eDim = function(optionalWeight){
	return this.e('dim', optionalWeight);
};

dagball.Circ.prototype.eLike = function(optionalWeight){
	return this.e('like', optionalWeight);
};

//negative weight of eLike
dagball.Circ.prototype.eDislike = function(optionalWeight){
	return this.e('like', optionalWeight!==undefined ? -optionalWeight : -1);
};

dagball.Circ.prototype.eTrue = function(optionalWeight){
	return this.e('true', optionalWeight);
};

//negative weight of eTrue
dagball.Circ.prototype.eFalse = function(optionalWeight){
	return this.e('true', optionalWeight!==undefined ? -optionalWeight : -1);
};

dagball.Circ.prototype.eGpucircExistVote = function(optionalWeight){
	return this.e('gpucircExistVote', optionalWeight);
};

dagball.Circ.prototype.eGpucircInfluenceMedianVote = function(optionalWeight){
	return this.e('gpucircInfluenceMedianVote', optionalWeight);
};


dagball.Circ.codeLanguage = function(){
	if(this.code.includes('tinyglsl:')) return 'tinyglsl';
	if(this.code.includes('javascript:')) return 'javascript';
	if(this.code.includes('ape:')) return 'ape'; //as of 2023-12-7 ape means apeV2
	if(this.code.includes('apeV1:')) return 'apeV1';
	throw new Error('TODO generalize this to looking for the first line that ends with : then return whats before that. If it has whitespace, throw.');
};

//the part of a 2d affine transform that offsets and magnifies in y and x but doesnt tilt or rotate.
dagball.SimpleAftrans = function(addY, addX, magnifyY, magnifyX){
	this.addY = addY;
	this.addX = addX;
	this.magnifyY = magnifyY;
	this.magnifyX = magnifyX;
};
dagball.SimpleAftrans.prototype.toMap = function(){
	return {
		type: 'dagball_simpleAftrans',
		addY: this.addY,
		addX: this.addX,
		magnifyY: this.magnifyY,
		magnifyX: this.magnifyX,
	};
};
dagball.mapToSimpleAftrans = function(map){
	if(map.type != 'dagball_simpleAftrans') Err('Wrong type: '+JSON.stringify(map));
	return new dagball.SimpleAftrans(map.addY, map.addX, map.magnifyY, map.magnifyX);
};
dagball.SimpleAftrans.prototype.forwardY = function(y){
	//FIXME should this be addY+magnifyX*(this.y-addY) vs this.addY+this.magnifyY*y?
	return this.addY+this.magnifyY*y;
};
dagball.SimpleAftrans.prototype.forwardX = function(x){
	//FIXME should this be addX+magnifyX*(this.x-addX) vs this.addX+this.magnifyX*x?
	return this.addX+this.magnifyX*x;
};
dagball.SimpleAftrans.prototype.reverseY = function(forwardY){
	//FIXME?
	//forwardY return this.addY+this.magnifyY*y;
	return (forwardY-this.addY)/this.magnifyY;
};
dagball.SimpleAftrans.prototype.reverseX = function(forwardX){
	//FIXME?
	//forwardX return this.addX+this.magnifyX*x;
	return (forwardX-this.addX)/this.magnifyX;
};
dagball.SimpleAftrans.prototype.toString = function(){
	return 'SimpleAftrans[addY='+this.addY+' addX='+this.addX+' magnifyY='+this.magnifyY+' magnifyX='+this.magnifyX+']'
};
//the median of the 2 magnifys. Number of canvas pixels per unit of game distance, as close as it can be if they are different.
dagball.SimpleAftrans.prototype.magnify = function(){
	return Math.sqrt(this.magnifyY*this.magnifyX);
};

dagball.Circ.prototype.display = function(optionalByteRect){
	let byteRect = optionalByteRect || dagball.screen.byteRect;
	//TODO reuse this aftrans if theres alot of circs. more efficient to give it as param.
	//TODO move this default aftrans to dagball.viewAftrans?
	//let aftrans = optionalAftrans || (new dagball.SimpleAftrans(byteRect.height/2, byteRect.width/2, 1, 1));
	let aftrans = dagball.aftrans;
	if(!aftrans) throw new Error('TODO aftrans');
	//if(addY === undefined) addY = 0;
	//if(addX === undefined) addX = 0;
	//if(magnifyY === undefined) magnifyY = 1;
	//if(magnifyX === undefined) magnifyX = 1;
	let isChangingColor = dagball.controls('red') || dagball.controls('green') || dagball.controls('blue') || dagball.controls('bright');
	let displayAsSelectedByRandomColor = document.getElementById('isShowWhichCircleIsSelected').checked & this.isSelected & !isChangingColor;
	let red = displayAsSelectedByRandomColor ? dagball.randByte() : this.red;
	let green = displayAsSelectedByRandomColor ? dagball.randByte() : this.green;
	let blue = displayAsSelectedByRandomColor ? dagball.randByte() : this.blue;
	let transformedY = aftrans.forwardY(this.y);
	let transformedX = aftrans.forwardX(this.x);
	//byteRect.paintDonut(transformedY, transformedX, this.r*aftrans.magnifyY, this.r*aftrans.magnifyX, red, green, blue);
	if(aftrans.magnifyY != aftrans.magnifyX) throw new Error('TODO replace paintDonut with paintOval');
	let transformedRadius = this.r*aftrans.magnifyY; //FIXME paintOval
	let maxRadius = transformedRadius;
	let minRadius = transformedRadius-2;
	if(document.getElementById('isDisplayCircOutlines').checked){
		byteRect.paintDonut(transformedY, transformedX, minRadius, maxRadius, red, green, blue);
	}
	if(this.isSelected){
		//paint a small circle on nearest part of circ surface to mouse
		let angle = dagball.uiAngleNearCircYX(this, dagball.directControls.mouseY, dagball.directControls.mouseX);
		let transformedY = aftrans.forwardY(this.y+this.r*Math.sin(angle));
		let transformedX = aftrans.forwardX(this.x+this.r*Math.cos(angle));
		let smallR = 8; //pixels, not game coords
		byteRect.paintDonut(transformedY, transformedX, 0, smallR, red, green, blue);
	}
	//for(let c=0; c<this.childs.length; c++){
	if(document.getElementById('isDisplayEdges').checked) for(let e=0; e<this.edgesOut.length; e++){ //perimeter starts with edgesOut then edsOut
		let edge = this.edgesOut[e];
		let ch = edge.child;
		//let ch = this.childs[c];
		let angle = Math.PI/2 - 2*Math.PI*e/this.edgesOut.length; //spread childs evenly around circle. TODO first child at top, or last child at top like a clock has 12 there?
		//let onThisCirclesEdgeY = this.y+this.r*Math.sin(angle);
		//let onThisCirclesEdgeX = this.x+this.r*Math.cos(angle);
		let onThisCirclesEdgeY = this.perimeterY(e);
		let onThisCirclesEdgeX = this.perimeterX(e);
		//let onChildCirclesEdgeY = aftrans.forwardY(ch.y+ch.r*Math.sin(angle)); //FIXME make the line be toward center of child
		//let onChildCirclesEdgeX = aftrans.forwardX(ch.x+ch.r*Math.cos(angle));
		let vectorToChildCenter_Y = ch.y-onThisCirclesEdgeY;
		let vectorToChildCenter_X = ch.x-onThisCirclesEdgeX;
		let vectorToChildCenter_len = Math.hypot(vectorToChildCenter_Y, vectorToChildCenter_X);
		//let dontTouchItOnToSide = Math.min(vectorToChildCenter_len/2, 7);
		//let dontTouchItOnToSide = 0; //do touch it on side, in theory, at 0
		let dontTouchItOnToSide = Math.min(vectorToChildCenter_len/2, .3);
		//let vectorToChildCenter_newLen = vectorToChildCenter_len-ch.r-dontTouchItOnToSide;
		let vectorToChildCenter_newLen = vectorToChildCenter_len-ch.r-dontTouchItOnToSide;
		let vecMul = vectorToChildCenter_newLen/vectorToChildCenter_len;
		let nearestPointOnChildCircleToThat_Y = onThisCirclesEdgeY + vecMul*vectorToChildCenter_Y;
		let nearestPointOnChildCircleToThat_X = onThisCirclesEdgeX + vecMul*vectorToChildCenter_X;
		//let fractionFromInsteadOfTo = .9; //1 means its color of the circle its from. 0 means color of circle its to. .5 means each gets half the line.
		let fractionFromInsteadOfTo = .8;
		fractionFromInsteadOfTo = 1-fractionFromInsteadOfTo; //FIXME i got something backward. shouldnt have to do this.
		let pointBetweenY = onThisCirclesEdgeY*fractionFromInsteadOfTo + (1-fractionFromInsteadOfTo)*nearestPointOnChildCircleToThat_Y;
		let pointBetweenX = onThisCirclesEdgeX*fractionFromInsteadOfTo + (1-fractionFromInsteadOfTo)*nearestPointOnChildCircleToThat_X;
		
		
		//TODO optimize by not calling forward* so many times.
		//These are buggy. they dont go all the way to the other circ and sometimes go backward, as of 2024-5-24.
		byteRect.paintLineYXYXRGB(aftrans.forwardY(onThisCirclesEdgeY), aftrans.forwardX(onThisCirclesEdgeX),
			aftrans.forwardY(pointBetweenY), aftrans.forwardX(pointBetweenX), red, green, blue);
		byteRect.paintLineYXYXRGB(aftrans.forwardY(pointBetweenY), aftrans.forwardX(pointBetweenX),
			aftrans.forwardY(nearestPointOnChildCircleToThat_Y), aftrans.forwardX(nearestPointOnChildCircleToThat_X), ch.red, ch.green, ch.blue);

		//let edgeText = 'TESTEDGE'+edge.edgeType+'='+edge.weight;
		let edgeText = edge.edgeType+'='+edge.weight;
		dagball.scheduleCpuPaint(()=>{
			//dagball.paintTextPixYXRGB(aftrans.forwardY(pointBetweenY), aftrans.forwardX(pointBetweenX)+10, red/256, green/256, blue/256, edgeText);
			//dagball.paintTextPixYXRGB(Math.floor(onThisCirclesEdgeY), Math.floor(onThisCirclesEdgeX)+10, red/256, green/256, blue/256, edgeText);
			//dagball.paintTextPixYXRGB(Math.floor(aftrans.forwardY(onThisCirclesEdgeY)), Math.floor(aftrans.forwardX(onThisCirclesEdgeX))+10, 255, 255, 255, edgeText);
			//dagball.paintTextPixYXRGB(Math.floor(aftrans.forwardY(onThisCirclesEdgeY)), Math.floor(aftrans.forwardX(onThisCirclesEdgeX)), red/256, green/256, blue/256, edgeText);
			dagball.paintTextPixYXRGB(Math.floor(aftrans.forwardY(pointBetweenY)), Math.floor(aftrans.forwardX(pointBetweenX)), red/256, green/256, blue/256, edgeText);
		});
	}
	if(document.getElementById('isDisplayEds').checked) if(this.edsOut.length){
		//FIXME get [edsAvePos, edsStdDevPos] from all circs in dagball.view.circs, instead of just this circ, so ed line brightness is normed by that bellcurve
		let [edsAvePos, edsStdDevPos] = Ap.aveDev(this.edsOut.map(ed=>ed.pos)); //for adjusting line brightness (same color direction)
		if(edsStdDevPos == 0) edsStdDevPos = .000001;
		for(let e=0; e<this.edsOut.length; e++){ //perimeter starts with edgesOut then edsOut
			let i = this.edIndex(e);
			let fromY = this.perimeterY(i);
			let fromX = this.perimeterX(i);
			let ed = this.edsOut[e];
			if(!dagball.isDisplayEdsForName(ed.edGroup.apeArrayName)){ //TODO cache this or do it per ed group, cuz there could be alot of eds
				continue; //dont display this ed
			}
			let detailedEds = (dagball.chk('detailedEdsIfSelected',true) && ed.isSelected()) || document.getElementById('isDisplayDetailedEdsAlways',false);
			let toY = ed.y;
			let toX = ed.x;
			//fromY = dagball.roundToEdSnapGrid(fromY);
			//fromX = dagball.roundToEdSnapGrid(fromX);
			toY = dagball.roundToEdSnapGrid(toY);
			toX = dagball.roundToEdSnapGrid(toX);
			let fromYPix = aftrans.forwardY(fromY);
			let fromXPix = aftrans.forwardX(fromX);
			let toYPix = aftrans.forwardY(toY);
			let toXPix = aftrans.forwardX(toX);

			let edPosOnNormedBellCurve = (ed.pos-edsAvePos)/edsStdDevPos;
			let multipleEdLineBrightness = 1 + .4*Math.tanh(edPosOnNormedBellCurve);
			//let multipleEdLineBrightness = .7 + .8*Math.tanh(ed.pos);
			red = Math.max(0,Math.min(red*multipleEdLineBrightness,255));
			green = Math.max(0,Math.min(green*multipleEdLineBrightness,255));
			blue = Math.max(0,Math.min(blue*multipleEdLineBrightness,255));

			byteRect.paintLineYXYXRGB(fromYPix, fromXPix, toYPix, toXPix, red, green, blue);
			if(detailedEds){
				//let edLenOnScreen = Math.hypot(fromY-toY, fromX-toX);
				
				//from knob.val of 0 to knob.val of 1 is this distance, in some coordinate system (FIXME which?). the 3 balls at -1 0 1 display coordinate system.
				let scale = .2;

				let edLineLengthInPixels = Math.hypot(fromYPix-toYPix, fromXPix-toXPix);
				//radius is in pixels. knob vals are in a different coordinate system.
				let pixelsPerKnobVal = edLineLengthInPixels*scale; //if knob.val changes by 1, it moves along the ed line this many pixels.

				let aFraction = .5-scale;
				let bFraction = .5;
				let cFraction = .5+scale;
				let dFraction = Math.max(0, Math.min(.5+scale*ed.pos, 1)); //scale and truncate
				let dYPix = toYPix*dFraction+(1-dFraction)*fromYPix;
				let dXPix = toXPix*dFraction+(1-dFraction)*fromXPix;
				//let sliders = ed.sliders || [];
				let sliderKnobs = ed.sliderKnobs || [];
				let perpendicularY = -(toX-fromX);
				let perpendicularX = toY-fromY;
				let normPerpendicular = Math.hypot(perpendicularY, perpendicularX);
				perpendicularY /= normPerpendicular;
				perpendicularX /= normPerpendicular;
				//for(let num of sliders){
				//for(let edSliderKnob of sliderKnobs){
				let sortedKnobs = sliderKnobs.slice();
				//FIXME reverse this? i want them to be, when other knobs are in the way, more pixelsPerpendicular toward circ perimeter since theres more room.
				sortedKnobs.sort((a,b)=>b.val-a.val);
				//for(let i=sliderKnobs.length-1; i>=0; i--){ //FIXME loop in order of ascending edSliderKnob.val.
				let stackPixelsPerpendicular = 0;
				//let radiusMulForStacking = 2; //FIXME make this smaller?
				let radiusMulForStacking = 1.4;
				for(let i=0; i<sortedKnobs.length; i++){
					let edSliderKnob = sortedKnobs[i];
					let num = edSliderKnob.val;
					let numFraction = Math.max(0, Math.min(.5+scale*num, 1)); //scale and truncate
					//byteRect.paintDonut(toYPix*numFraction+(1-numFraction)*fromYPix, toXPix*numFraction+(1-numFraction)*fromXPix, 0, 3, red/2, green/2, blue/2);
					let yOnPole = toYPix*numFraction+(1-numFraction)*fromYPix;
					let xOnPole = toXPix*numFraction+(1-numFraction)*fromXPix;
					//let sliderRed = dagball.randByte();
					//let sliderGreen = dagball.randByte();
					//let sliderBlue = dagball.randByte();
					//let sliderRadiusOnPole = 3;
					//let sliderHandleRadiusOutsidePole = sliderRadiusOnPole+3;
					//let sliderHandleRadiusOutsidePole = edSliderKnob.radius;
					let sliderHandleRadiusOutsidePole = edSliderKnob.pixelRadius; //knob.y and .x are in game coords, but so u can see it while zooming, radius is in canvas coords.
					let sliderRadiusOnPole = sliderHandleRadiusOutsidePole/2; //FIXME should this be a separate field in edSliderKnob?


					/*
					//if(i>0 && Math.abs(sortedKnobs[i-1].val-num) >= (edSliderKnob.radius+sortedKnobs[i-1].radius)){
					//radius is in pixels. knob vals are in a different coordinate system.
					//let pixelsPerKnobVal = scale
					//let pixelsAlongKnobDiffFromPrevKnob = pixelsPerKnobVal*Math.abs(sortedKnobs[i-1].val-num);
					if(i>0 && pixelsPerKnobVal*Math.abs(sortedKnobs[i-1].val-num) >= (edSliderKnob.radius+sortedKnobs[i-1].radius)){
						stackPixelsPerpendicular = 0;
					}
					stackPixelsPerpendicular += edSliderKnob.radius*radiusMulForStacking;
					
					//let pixelsPerpendicular = (Math.random()*2-1)*10; //FIXME
					let pixelsPerpendicular = stackPixelsPerpendicular;
					*/
					/*This is canvas pixel coordinates but edSliderKnob.y and .x should be in game coordinates, same as ed.y and ed.x
					for(let possiblePixPerp=.1; possiblePixPerp<200; possiblePixPerp=possiblePixPerp*-1.03){
						//set its y and x to a possible position being considered
						edSliderKnob.y = yOnPole + possiblePixPerp*perpendicularY;
						edSliderKnob.x = xOnPole + possiblePixPerp*perpendicularX;
						let canPutHere = true;
						for(let j=0; j<i; j++){ //other knobs whose y x positions are already decided
							let otherEdSliderKnob = sortedKnobs[j];
							let dist = Math.hypot(edSliderKnob.y-otherEdSliderKnob.y, edSliderKnob.x-otherEdSliderKnob.x);
							if(dist < edSliderKnob.radius+otherEdSliderKnob.radius){
								canPutHere = false; //overlaps another knob
								continue;
							}
						}
						if(canPutHere){
							break;
						}
					}*/
					let af = dagball.aftrans;

					//for(let possiblePixPerp=.1; possiblePixPerp<200; possiblePixPerp=possiblePixPerp*-1.03){
					let maxGameDistPerp = .5; //FIXME aftrans.magnifyY and magnifyX, maxGameDistPerp should depend on that.
					//let gameDistTooCloseOf2Knobs = .01; //FIXME
					//let gameDistTooCloseOf2Knobs = .1; //FIXME
					let magnify = af.magnify();
					for(let possibleGameDistPerp=.0001; possibleGameDistPerp<maxGameDistPerp; possibleGameDistPerp=possibleGameDistPerp*-1.03){
						//set its y and x to a possible position being considered
						edSliderKnob.y = af.reverseY(yOnPole) + possibleGameDistPerp*perpendicularY;
						edSliderKnob.x = af.reverseX(xOnPole) + possibleGameDistPerp*perpendicularX;
						let canPutHere = true;
						for(let j=0; j<i; j++){ //other knobs whose y x positions are already decided
							let otherEdSliderKnob = sortedKnobs[j];
							let dist = Math.hypot(edSliderKnob.y-otherEdSliderKnob.y, edSliderKnob.x-otherEdSliderKnob.x);
							let radiusPixelsSum = edSliderKnob.pixelRadius+otherEdSliderKnob.pixelRadius;
							let radiusGameCoordsSum = radiusPixelsSum/magnify;
							//if(dist < edSliderKnob.radius+otherEdSliderKnob.radius){
							//if(dist < gameDistTooCloseOf2Knobs){
							if(dist < radiusGameCoordsSum){
								canPutHere = false; //overlaps another knob
								continue;
							}
						}
						if(canPutHere){
							break;
						}
					}

					let knobCanvasY = af.forwardY(edSliderKnob.y);
					let knobCanvasX = af.forwardX(edSliderKnob.x);
					byteRect.paintDonut(yOnPole, xOnPole, 0, sliderRadiusOnPole, edSliderKnob.red, edSliderKnob.green, edSliderKnob.blue);
					byteRect.paintLineYXYXRGB(knobCanvasY, knobCanvasX, yOnPole, xOnPole, edSliderKnob.red, edSliderKnob.green, edSliderKnob.blue);
					byteRect.paintDonut(
						knobCanvasY, //edSliderKnob.y,
						knobCanvasX, //edSliderKnob.x,
						0, sliderHandleRadiusOutsidePole, edSliderKnob.red, edSliderKnob.green, edSliderKnob.blue
					);
					//use on browser console for testing: dagball.selectedCircs()[0].edsOut[0].sliders = [-2, -1.9, -1.8, .2, .3, .55, .6, .7, .8]
				}
				byteRect.paintDonut(dYPix, dXPix, 0, 6, red, green, blue); //ed.pos observed
				byteRect.paintDonut(toYPix*aFraction+(1-aFraction)*fromYPix, toXPix*aFraction+(1-aFraction)*fromXPix, 0, 3, red, green, blue); //pos -1 like on a ruler
				byteRect.paintDonut(toYPix*bFraction+(1-bFraction)*fromYPix, toXPix*bFraction+(1-bFraction)*fromXPix, 0, 4, red, green, blue); //pos 0 like on a ruler
				byteRect.paintDonut(toYPix*cFraction+(1-cFraction)*fromYPix, toXPix*cFraction+(1-cFraction)*fromXPix, 0, 3, red, green, blue); //pos 1 like on a ruler
				dagball.scheduleCpuPaint(()=>{
					//let textForEdSlider = ed.edGroup ? '<['+ed.edGroup.apeArrayName+' '+ed.edGroup.eds.indexOf(ed)+'] '+ed.pos+'>' : 'FIXME_noEdGroup_ed='+ed+'_pos='+ed.pos;
					let textForEdSlider = ed.edGroup ? '['+ed.edGroup.apeArrayName+' '+ed.edGroup.eds.indexOf(ed)+']' : 'FIXME_noEdGroup_ed='+ed+'_pos='+ed.pos;
					dagball.paintTextPixYXRGB(dYPix, dXPix+10, red/256, green/256, blue/256, textForEdSlider);
				});
			}
			if(dagball.displaySelectedEdLinesJitteryOnFromSide && ed.isSelected()){ //normally a whole EdGroup is selected
				//let dy = toYPix-fromYPix;
				//let dx = toXPix-fromXPix;
				//let dLen = Math.hypot(dy,dx);
				//let dyNorm = dy/dLen;
				//let dxNorm = dx/dLen;
				byteRect.paintLineYXYXRGB(fromYPix+(Math.random()*2-1)*3.5, fromXPix+(Math.random()*2-1)*3.5, //display jittery line on the circle perimeter side so you can see its selected
					toYPix, toXPix, red, green, blue); //display stable line on the side it points to (see its selected by the other side jittering)
					//toYPix+(Math.random()*2-1)*3.5, toXPix+(Math.random()*2-1)*3.5, red, green, blue); //display jittery line on the side it points to so you can see its selected
			}
		}
	}
	if(dagball.chk('displayGameBorders',false)){
		dagball.paintGameBorders(byteRect, 20, 20, 255);
	}
};

//paint 4 lines at plus/minus dagball.positionLimit in game coords.
dagball.paintGameBorders = function(byteRect, red, green, blue){
	let af = dagball.aftrans;
	let minY = af.forwardY(-dagball.positionLimit);
	let maxY = af.forwardY(dagball.positionLimit);
	let minX = af.forwardX(-dagball.positionLimit);
	let maxX = af.forwardX(dagball.positionLimit);
	byteRect.paintLineYXYXRGB(minY, minX, minY, maxX, red, green, blue); //top horizontal line
	byteRect.paintLineYXYXRGB(maxY, minX, maxY, maxX, red, green, blue); //bottom horizontal line
	byteRect.paintLineYXYXRGB(minY, minX, maxY, minX, red, green, blue); //left vertical line
	byteRect.paintLineYXYXRGB(minY, maxX, maxY, maxX, red, green, blue); //right vertical line
};

dagball.circles = []; //dagball.Circ
dagball.balls = []; //dagball.Ball

/*dagball.matmulCodeForTestingApeParsing =
`{+
	(matAB * (matDimA 3) (matDimB 5))
	(matBC * matDimB (matDimC 7))
	(matAC * matDimA matDimC)
	(matmulABCLoop *
		matDimA
		matDimC
		(sumInDimBSteps +
			<(sumB float) 0.>
			(sumInDimB_loop *
				matDimB
				{f+= sumB {f* [matAB matDimA matDimB] [matBC matDimB matDimC]}}
			)
			<[matAC matDimA matDimC] sumB>
		)
	)
}`;*/
/*dagball.matmulCodeForTestingApeParsing =
//FIXME? its still pointing at each word as an object. {txt this is a comment. TODO use union or unionMax in some (someArray parrMem {union ...})}
`{doLast
	(matAB parrMem {* (matDimA 3) (matDimB 5)})
	(matBC parrMem  {* matDimB (matDimC 7)})
	(matAC parrMem {* matDimA matDimC})
	(matmulABCLoop *
		matDimA
		matDimC
		{+
			<(sumB float) 0.>
			{*
				matDimB
				{f+= sumB {f* [matAB matDimA matDimB] [matBC matDimB matDimC]}}
			}
			<[matAC matDimA matDimC] sumB>
		}
	)
}`;*/
/*dagball.matmulCodeForTestingApeParsing =
//FIXME? its still pointing at each word as an object. {txt this is a comment. TODO use union or unionMax in some (someArray parrMem {union ...})}
`{doLast
	(matAB parrMem {union
		{* {+ {1} {4}} {3} {2}}
		{* (matDimA 3) (matDimB 10)}
	})
	(matBC parrMem  {* matDimB (matDimC 7)})
	(matAC parrMem {* matDimA matDimC})
	(matmulABCLoop *
		matDimA
		matDimC
		{+
			<(sumB float) 0.>
			{*
				matDimB
				{f+= sumB {f*
					[matAB matDimA matDimB]
					[matBC matDimB matDimC]
				}}
			}
			<[matAC matDimA matDimC] sumB>
		}
	)
}`;*/
//potenCirc$ is like extern in the C language. It refers to a float var not defined here, normally shared among multiple GPU_circles.
dagball.matmulCodeForTestingApeParsing =
//multiple params in a parrMem or localparMem mean the same as joined by * in 1 param.
//(matAB parrMem (matDimA 3) (matDimB 10)) means the same as (matAB parrMem {* (matDimA 3) (matDimB 10)})
//Similar to [matAC matDimA matDimC] means the same as [matAC {* matDimA matDimC}].
//q is like p but uses _i/itervar instead of _s/size.
//[matAC {* matDimA matDimC}] means the same as [matAC {q+ {q* matDimA {size matDimC}} matDimC}].
//Theres also triang op as in (c triang b loopBody) which loops c_i up to b_i instead of up to b_s as usual.
//It makes a triangle loop.
//TODO make a comment object similar to doLast but the parser doesnt look for names in it.
//What did I call comment opcode in wikibinator203? Was it CC or something like that? I want vararg.
//TODO make a version of this that reads matAB and matBC from bigMem and reads built in var 'id' from tinyGlsl to know which dotProd to do.
`{doLast
	(matAB parMem (matDimA 3) (matDimB 10))
	(matBC parMem matDimB (matDimC 7))
	(matAC locMem matDimA matDimC)
	{+
		(matmulABCLoop *
			matDimA
			matDimC
			{+
				<(sumB float) 0>
				{*
					matDimB
					{f+= sumB {f*
						[matAB matDimA matDimB]
						[matBC matDimB matDimC]
					}}
				}
				<[matAC matDimA matDimC] sumB>
			}
		)
		<potenCirc$ [matAC 0%]>
	}
}`;
/*`{doLast
	(matAB parMem (matDimA ${matDimA}) (matDimB ${matDimB}))
	(matBC parMem matDimB (matDimC ${matDimC}))
	(c int {imod {id} {size matDimC}})
	(a int {i/ {id} {size matDimC}})
	{+
		<(sumB float) 0>
		{*
			matDimB
			{f+= sumB {f*
				[matAB a matDimB]
				[matBC matDimB c]
			}}
		}
		{freturn sumB}
	}
}`;*/

/*dagball.forestCurveFitCodeForTestingApeParsing =
`(forestCurveFitTest doLast
	(numForestCurveFitNodes 12)
	(numForestCurveFitMathOps 5)
	(fcfRow copy numForestCurveFitNodes)
	(fcfCol copy numForestCurveFitNodes)
	(fcfDoubleTriangleWeights parrMem fcfCol fcfRow)
	(fcfNodeOps parrMem numForestCurveFitNodes numForestCurveFitMathOps)
	(fcfDiag localparMem numForestCurveFitNodes)
	{+
		{for (diag copy numForestCurveFitNodes)
			(j triang diag

			)
			numForestCurveFitNodes
			TODO...
		}
		(TOOD...)
		(TOOD...)
	}
)`;*/
/*dagball.forestCurveFitCodeForTestingApeParsing =
//FIXME did i get weightedSumCol and weightedSumRow backward?
//tri creates a triangle size loop or mem (in this case loop/time).
//The 2 (in this case) loop vars are read by tria (the bigger one) and trib (up to tria_i).
`(forestCurveFitTest doLast
	(fcfDoubleTriangleWeights parrMem numForestCurveFitNodes (numForestCurveFitNodes 12))
	(fcfNodeMathOpWeights parrMem numForestCurveFitNodes (numForestCurveFitMathOps 5))
	(fcfDiag localparMem numForestCurveFitNodes)
	{+
		(diag tria (fcfTriangleLoop tri numForestCurveFitNodes) {+
			<(weightedSumCol float) 0>
			<(weightedSumRow float) 0>
			(upOrLeftOfDiag trib fcfTriangleLoop {+
				<(otherNodeVal float) [fcfDiag upOrLeftOfDiag]>
				{f+= weightedSumCol {f* otherNodeVal [fcfDoubleTriangleWeights diag upOrLeftOfDiag]}}
				{f+= weightedSumRow {f* otherNodeVal [fcfDoubleTriangleWeights upOrLeftOfDiag diag]}}
			})
			<(weightedSumOfNeuralActivations float) {f+
				{f* [fcfNodeMathOpWeights diag 0] {ftanh {fsin weightedSumCol}}}
				{f* [fcfNodeMathOpWeights diag 1] {ftanh {f* weightedSumCol weightedSumRow}}}
				{f* [fcfNodeMathOpWeights diag 2] {ftanh {atan weightedSumCol}}}
				{f* [fcfNodeMathOpWeights diag 3] {ftanh {fmax weightedSumCol weighedSumRow}}}
				{f* [fcfNodeMathOpWeights diag 4] {ftanh {fpow weightedSumCol weightedSumRow}}}
			}>
			{if {pqlesseq {2} diag}
				<[fcfDiag diag] {ftanh weightedSumOfNeuralActivations}>
			}
		}}
		<freturn {flast fcfDiag}>
	}
)`;*/
//dagball.forestCurveFitCodeForTestingApeParsing =
//FIXME where in parrMem do y and x come from?
/*
Lambda Rick /acc
@benrayfield
·
5s
In my new (nearly working) GPU language for browsers (compiles to GLSL), this is how you write a 20 layer neuralnet with 1
node per layer, and weights from each node to all lower nodes, and a weighted sum of 5 different neural activation functions
per node, in a shader.
Quote
DagBall - 1000 dimensional hackerspace
@DagBallGame
·
9m
Replying to @DagBallGame
ForestCurveFit in the dagball ape language should look something like this, and compile to a GLSL shader.
The triangle loop (fcfTriangleLoop) has to be defined all at once and its outer loop var (diag) and inner loop
var (upOrLeftOfDiag) refers to those 2 coordinate numbers in it

Anything using parrMem will automatically create as many dimensions as that array size and do up to 1000 dimensional
calculus gradients which in this case would train that neuralnet using each ball's (y,x) position as training data.

This language is lisp-like and knows at compile time exact num time steps, amount and ranges of float[] mem, number of threads.
No buffer overflows or infinite loops (TODO). LLMs should able to write and test new AI algorithms this way,
and Humans paint them as interactive art.

If I included this code, u could in a local html file call GPT4 to make interactive GPU circles (with different GPU code in each)
without server. It pops up asking for openai API key. Should probably put that in iframe to prove my code isnt stealing ur
key https://github.com/benrayfield/jsutils/blob/master/src/OpenAICallsItselfRecursively_2023-6-24-8p.html

DagBall - 1000 dimensional hackerspace
@DagBallGame
·
10m
TODO make this GPT4 API that lets users put in their own OpenAI API key into an iframe so Dagball and other websites can
request to use it N times but cant get the key. When the new language is working, GPT4 should be able to build game content live.
Quote
Lambda Rick /acc
@benrayfield
·
4h
If there was a small javascript file that lets users of your website give their own OpenAI API key, and you can prove to them
using normal web standards that you cant get their API key and can only call it as many times as the user chooses in a popup,
what would you use it for?
Everything you write in that GPU language comes with automatic calculus gradients up to 1000 dimensions. If you write the
prediction/forward algorithm for a new kind of neuralnet, it generates the learning algorithm automatically. And its not backprop.


Dagball ape,
List the ways to do the array reads and writes while proving not out of range.
...
{p- a b} where p means ptr. i- would be int if have nonptr ints. f- etc for floats.
Maybe array reads as {ii outerdim innerdim}. {idigit baseN mtgDigit}. {bitdigit mth}. Etc.
Maybe swap [] vs {} cuz [] easier to type? <> doesnt match in most texteditors so leave it as f=.
Maybe use () as normal, {} as f=, [] as skipname, and <stuff x y z returnlast> as comment. Or keep [] as array readwrite and if its more than 2 params it acts as [arrname {ii outer midder inner etc}] aka [arrname outer midder inner].
Keep the ()[]{}<> as they are?
Each name has a size and iterint andor floatval, so in {ii x y} its x_i*y_s+y.
If want just raw ints todo create {size x}.
(j triang i do) loops j_i up to i_i instead of up to i_s like * would do. Forestcurvefit.
Todo bayes3x3x3...
Todo hypercubewave. Etc.
Maybe should use Float64Array or make a range class, and expand potentially exponentially to make lust of ranges each nodes _i can happen, prove memoryfencing that way. Careful of ppow and pmod.p
*/
/*
`(forestCurveFitTest doLast
	(fcfDoubleTriangleWeights parrMem (numForestCurveFitNodes 12) numForestCurveFitNodes)
	(fcfNodeMathOpWeights parrMem numForestCurveFitNodes (numForestCurveFitMathOps 5))
	(fcfDiag localparMem numForestCurveFitNodes)
	{+
		<[fcfDiag 0] 1>
		<[fcfDiag 1] {x}>
		<[fcfDiag 2] {y}>
		(diag tria (fcfTriangleLoop tri numForestCurveFitNodes) {+
			<(weightedSumCol float) 0>
			<(weightedSumRow float) 0>
			(upOrLeftOfDiag trib fcfTriangleLoop {+
				<(otherNodeVal float) [fcfDiag upOrLeftOfDiag]>
				{f+= weightedSumCol {f* otherNodeVal [fcfDoubleTriangleWeights diag upOrLeftOfDiag]}}
				{f+= weightedSumRow {f* otherNodeVal [fcfDoubleTriangleWeights upOrLeftOfDiag diag]}}
			})
			<(weightedSumOfNeuralActivations float) {f+
				{f* [fcfNodeMathOpWeights diag 0] {ftanh {fsin weightedSumCol}}}
				{f* [fcfNodeMathOpWeights diag 1] {ftanh {f* weightedSumCol weightedSumRow}}}
				{f* [fcfNodeMathOpWeights diag 2] {ftanh {atan weightedSumCol}}}
				{f* [fcfNodeMathOpWeights diag 3] {ftanh {fmax weightedSumCol weighedSumRow}}}
				{f* [fcfNodeMathOpWeights diag 4] {ftanh {fpow weightedSumCol weightedSumRow}}}
			}>
			{if {pqlesseq {3} diag}
				<[fcfDiag diag] {ftanh weightedSumOfNeuralActivations}>
			}
		})
		<freturn {flast fcfDiag}>
	}
)`;*/
dagball.forestCurveFitCodeForTestingApeParsing =
`(forestCurveFitTest doLast
	(fcfDoubleTriangleWeights parrMem (numForestCurveFitNodes 12) numForestCurveFitNodes)
	(fcfNodeMathOpWeights parrMem numForestCurveFitNodes (numForestCurveFitMathOps 5))
	(fcfDiag localparMem numForestCurveFitNodes)
	{+
		<[fcfDiag 0%] 1>
		<[fcfDiag 1%] {x}>
		<[fcfDiag 2%] {y}>
		{* (diag copy numForestCurveFitNodes) {+
			<(weightedSumCol float) 0>
			<(weightedSumRow float) 0>
			{* (upOrLeftOfDiag copy numForestCurveFitNodes)
				{iftri upOrLeftOfDiag diag {+
					<(otherNodeVal float) [fcfDiag upOrLeftOfDiag]>
					{f+= weightedSumCol {f* otherNodeVal [fcfDoubleTriangleWeights diag upOrLeftOfDiag]}}
					{f+= weightedSumRow {f* otherNodeVal [fcfDoubleTriangleWeights upOrLeftOfDiag diag]}}
				}
			}}
			<(weightedSumOfNeuralActivations float) {f+
				{f* [fcfNodeMathOpWeights diag 0%5] {ftanh {fsin weightedSumCol}}}
				{f* [fcfNodeMathOpWeights diag 1%5] {ftanh {f* weightedSumCol weightedSumRow}}}
				{f* [fcfNodeMathOpWeights diag 2%5] {ftanh {fatan weightedSumCol}}}
				{f* [fcfNodeMathOpWeights diag 3%5] {ftanh {fmax weightedSumCol weightedSumRow}}}
				{f* [fcfNodeMathOpWeights diag 4%5] {ftanh {f** weightedSumCol weightedSumRow}}}
			}>
			{iftri 2%100 diag
				<[fcfDiag diag] {ftanh weightedSumOfNeuralActivations}>
			}
		}}
		{freturn {flast fcfDiag}}
	}
)`;

/*dagball.radiusCirclesCodeForTestingApeParsing =
`//radiusCirclesCodeForTestingApeParsing
//FIXME this should be ape code, not tinyGlsl code. cuz will generate tinyGlsl code from it.
//int o = oCurve;
//float firstY = parr[o++];
//(firstY parrMem {1})
//float firstX = parr[o++];
//(firstX parrMem {1})
//float firstObservedRadius = length(vec2(firstY,firstX));
<(firstObservedRadius float) {fhypot {y} {x}}>
(radiusesAndPhases parrMem {* (freqs 10) (floatsPerFreq 2)})
//potenOne += .6*firstObservedRadius;
(memXy parrMem {3})
<(theX float) [memXy 0%]>
<(theY float) [memXy 1%]>
<(theVar2 float) [memXy 2%]>
<(theVar3 float) [memXy 3%]>
{f+= (potenOne float) {f* .6 firstObservedRadius}}
//x += .3*firstX;
(f+= theX {f* .3 {x}}}
(f+= theY {f* .3 {y}}}
//float angle = atan(y,x); //of (y,x) from (0,0)
<(angle float) {fatan theY theX}>
//float observedRadius = length(vec2(x,y)); //of (y,x) from (0,0)
<(observedRadius float) {hypot theX theY}>
//potenOne -= .6*observedRadius;
{f+= potenOne {f* -.6 observedRadius}}
<(float ditchRadius) 1>
//for(int freq=1; freq<10; freq++){
//	ditchRadius += .24*parr[o++]*sin(12.*parr[o++]+float(freq)*angle);
//}
//FIXME freqs+1 cuz its 1-10 not 0-9
{*
	freqs
	//ditchRadius += .24*parr[o++]*sin(12.*parr[o++]+float(freq)*angle);
	{f+= ditchRadius {f*
		.24
		[radiusesAndPhases freqs 0%2]
		{fsin {f+ {f* 12 [radiusesAndPhases freqs 1%2]} {f* freqs angle}}
	}}
}
//ditchRadius = 1./(1.+exp(-ditchRadius)); //sigmoid
<ditchRadius {sigmoid ditchRadius}>
//ditchRadius *= 1.+.1*sin(5.*parr[o++]);
{f*= ditchRadius {f+ 1 {f* .1 {fsin {f* 5 theVar2}}}}
{f*= ditchRadius .6}
<(ditchRadiusStdDev float) .04>
<(blur float) theVar3>
{f/= blur ditchRadius}
{f*= blur blur}
{f*= ditchRadiusStdDev {f+ 1 blur}}
<(blurTarget float) .8>
<(blurDiff float) {f- blur blurTarget}>
{f+= potenOne {f* .1 blurDiff blurDiff}}
<(observedStdDev float) {f/ {f- observedRadius ditchRadius} ditchRadiusStdDev}>
//float bellHeight = exp(-observedStdDev*observedStdDev/2.); //range 0 to 1.
<(bellHeight float) {fexp {f* -.5 observedStdDev observedStdDev}}>
<(flippedBellHeight float) {f- 1 bellHeight}>
{f+= potenOne flippedBellHeight}
{freturn potenOne}
`;*/
dagball.radiusCirclesCodeForTestingApeParsing =
`{+
	<(firstObservedRadius float) {fhypot {y} {x}}>
	(radiusesAndPhases parrMem (freqs 10) (floatsPerFreq 2))
	(memXy parrMem {4})
	<(theX float) [memXy 0%]>
	<(theY float) [memXy 1%]>
	<(theVar2 float) [memXy 2%]>
	<(theVar3 float) [memXy 3%]>
	{f+= (potenOne float) {f* .6 firstObservedRadius}}
	{f+= theX {f* .3 {x}}}
	{f+= theY {f* .3 {y}}}
	<(angle float) {fatan theY theX}>
	<(observedRadius float) {fhypot theX theY}>
	{f+= potenOne {f* -.6 observedRadius}}
	<(ditchRadius float) 1>
	{*
		freqs
		{f+= ditchRadius {f*
			.24
			[radiusesAndPhases freqs 0%2]
			{fsin {f+
				{f* 12 [radiusesAndPhases freqs 1%2]}
				{f* freqs angle}
			}}
		}}
	}
	<ditchRadius {sigmoid ditchRadius}>
	{f*= ditchRadius {f+ 1 {f* .1 {fsin {f* 5 theVar2}}}}}
	{f*= ditchRadius .6}
	<(ditchRadiusStdDev float) .04>
	<(blur float) theVar3>
	{f/= blur ditchRadius}
	{f*= blur blur}
	{f*= ditchRadiusStdDev {f+ 1 blur}}
	<(blurTarget float) .8>
	<(blurDiff float) {f- blur blurTarget}>
	{f+= potenOne {f* .1 blurDiff blurDiff}}
	<(observedStdDev float)
		{f/ {f- observedRadius ditchRadius} ditchRadiusStdDev}>
	<(bellHeight float)
		{fexp {f* -.5 observedStdDev observedStdDev}}>
	<(flippedBellHeight float) {f- 1 bellHeight}>
	{f+= potenOne flippedBellHeight}
	{freturn potenOne}
}
`;


dagball.addExampleCircs = function(){
	//pos, vel, velDecay, y, x, r, red, green, blue, isSelected, code, childs
	let dc = dagball.circles;
	/*dc.push(new dagball.Circ('swarm', 0, 0, 0, 0, 0, 20, 255, 0, 0, false, 'javascript:\n//TODO\n', []));
	dc.push(new dagball.Circ('swarm', 0, 0, 0, 70+Math.random()*30, Math.random()*30, 30, 0, 255, 0, false, 'javascript:\n//TODO\n', [dc[0].eDim()]));
	dc.push(new dagball.Circ('swarm', 0, 0, 0, 2+Math.random()*30, 90+Math.random()*30, 40, 0, 0, 255, false, 'javascript:\n//TODO\n', [dc[0].eLike(), dc[1].eLike()]));
	dc.push(new dagball.Circ('swarm', 0, 0, 0, -20+Math.random()*30, 30+Math.random()*30, 140, 120, 120, 80, false, 'javascript:\n//TODO\n', [dc[0].eLike(), dc[2].eLike(),dc[1].eLike()]));
	*/
	dc.push(new dagball.Circ('swarm', 0, 0, 0,   0, 0,                                       1.2,   255, 0, 0, false, 'ignore:tinyglsl:\npotenCirc = pow(length(vec2(x+parr[o++],y)),5.);', [], [], {}));
	dc[dc.length-1].replaceEdsWithDefaultsForNVars(5);

	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   .7+Math.random()*.0, Math.random()*.3,      .3,   0, 255, 0, false, 'tinyglsl:\npotenCirc += .1*sin(parr[4]*20.);', [dc[0].eDim()], []));
	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   .7+Math.random()*.0, Math.random()*.3,      .3,   0, 255, 0, false, 'tinyglsl:\npotenCirc += .52*sin(x*3.1);', [dc[0].eDim()], []));
	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   .7+Math.random()*.0, Math.random()*.3,      .3,   0, 255, 0, false, 'tinyglsl:\npotenCirc += .52*sin(x*13.1)+sin(y*y*14.);', [dc[0].eDim()], []));
	dc.push(new dagball.Circ('swarm', 0, 0, 0,   .7+Math.random()*.0, Math.random()*.3,      1.5,   0, 255, 0, false, 'ignore:tinyglsl:\npotenCirc += .52*sin(x*13.1*parr[o++])+sin(y*y*14.*parr[o++]);', [dc[0].eDim()], [], {}));
	dc[dc.length-1].replaceEdsWithDefaultsForNVars(3);

	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   .2+Math.random()*.3, .9+Math.random()*.3,   1.2,   0, 0, 255, false, 'tinyglsl:\npotenCirc += .1*pow(length(vec2(parr[1],parr[2])),2.2);', [dc[0].eLike(), dc[1].eLike()], []));
	dc.push(new dagball.Circ('swarm', 0, 0, 0,   .2+Math.random()*.3, .9+Math.random()*.3,   1.2,   0, 0, 255, false, 'txt:\nany words here', [dc[0].eLike(), dc[1].eLike()], [], {}));
	dc[dc.length-1].replaceEdsWithDefaultsForNVars(20);

	dc.push(new dagball.Circ('swarm', 0, 0, 0,   .2+Math.random()*.3, .9+Math.random()*.3,   2.1,   27, 128, 255, false, 'ignore:apeV1:\n(matAB * (sizeA 3) (sizeB 5))', [], [], {}));
	dc[dc.length-1].replaceEdsWithDefaultsForNVars(8);

	//This uses parMem and locMem wrong, or i need to auto convert parMem into locparMem in gradientCall but not in display call. See codeMaker.
	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   .2+Math.random()*.3, .9+Math.random()*.3,   3.1,   255, 0, 255, false, 'apeV1:\n'+dagball.matmulCodeForTestingApeParsing, [], [], {}));
	//dc[dc.length-1].replaceEdsWithDefaultsForNVars(8);

	/* //This uses parMem and locMem wrong, or i need to auto convert parMem into locparMem in gradientCall but not in display call. See codeMaker.
	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   .2+Math.random()*.3, .9+Math.random()*.3,   3.1,   255, 0, 255, false, 'apeV1:\n<potenCirc$ {fsin {f* x$ {fsin {f* y$ 23}} 7.043}}>', [], [], {}));
	dc.push(new dagball.Circ('swarm', 0, 0, 0,   .2+Math.random()*.3, .9+Math.random()*.3,   3.1,   255, 0, 255, false, 'apeV1:<potenCirc$ {fsin {f* [{parMem {4}} 0%4] x$ y$ 33}}>', [], [], {}));
	dc[dc.length-1].replaceEdsWithDefaultsForNVars(8);
	*/
	
	dc.push(new dagball.Circ('swarm', 0, 0, 0,   .2+Math.random()*.3, .9+Math.random()*.3,   2.6,   128, 233, 190, false, 'ignore:apeV1:\n'+dagball.forestCurveFitCodeForTestingApeParsing, [], [], {}));
	dc[dc.length-1].replaceEdsWithDefaultsForNVars(9);

	dc.push(new dagball.Circ('swarm', 0, 0, 0,   -.2+Math.random()*.3, .9+Math.random()*.3,   2.1,   44, 233, 44, false, 'ignore:apeV1:\n'+dagball.radiusCirclesCodeForTestingApeParsing, [], [], {}));
	dc[dc.length-1].replaceEdsWithDefaultsForNVars(15);

	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   -.4+Math.random()*.3, -.3+Math.random()*3,   1.64,  220, 220, 80, false, 'apeV1:<potenCirc$ {f+ .1 {fsin {f* x$ y$ 33}}}>', [dc[0].eLike(), dc[2].eLike(),dc[1].eLike()], [], {}));
	//dc[dc.length-1].replaceEdsWithDefaultsForNVars(7);
	
	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   -.5+Math.random()*.3, -.3+Math.random()*3,   1.84,  120, 120, 80, false, 'apeV1:<potenCirc$ {f+ .2 {fsin {f* x$ y$ 33}}}>', [dc[0].eLike(), dc[2].eLike(),dc[1].eLike()], [], {}));
	//dc[dc.length-1].replaceEdsWithDefaultsForNVars(7);

	let simpleMemTestCode = 'ape:'+Ap.stringToNextLanguage(`
{+
	(abc locparMem {5})
	<(a float) {locPtr abc 4%99}>
	<potenCirc$ {f+ .2 {fsin {f* {f+ x$ a} y$ 33}}}>
}`);
	dc.push(new dagball.Circ('swarm', 0, 0, 0,   -.7+Math.random()*.3, -.3+Math.random()*3,   1.84,  120, 120, 80, false, simpleMemTestCode, [dc[0].eLike(), dc[2].eLike(),dc[1].eLike()], [], {}));
	dc[dc.length-1].replaceEdsWithDefaultsForNVars(7);

	let dircDimsOut = {width: new dagball.Dim(34,0,0,'dwidth'), height: new dagball.Dim(56.7,0,0,'dheight'), otherVar: new dagball.Dim(0,0,0,'dotherVar')};
	dc.push(new dagball.Circ('swarm', 0, 0, 0,   .7+Math.random()*.3, .6+Math.random()*3,   .5,  120, 120, 80, false, 'javascriptDimsFunc:\np=>((p.width.v-2*p.height.v)**2)',
		[], [], dircDimsOut));
		//FIXME id starts with syncType (or it seems i want d for dim which is always a swarm syncType so s or d for swarm) [s for swarm. c for const. p for pubkey, ADD d for dim. u for unknown?]

	//a dirc is a lightweight alternative to circ that is specialized in dagball.Dim, while circ does that and dagball.Edge and dagball.Ed.
	let exampleDirc = new dagball.Dirc('javascriptDimsFunc:\np=>((p.width.v-2*p.height.v)**2)', 1, dircDimsOut);
	console.log('exampleDirc (TODO test with a few dircs and a few circs partially overlapping on various dagball.Dims and make sure it works as well as the scalar field based constraint solving in wikibinator203 directedGraph tree UI and the 4sat constraint solving in rule110 convolutional scalar field which you paint with 2 mouse buttons and converges toward approx rule110, and then then was the "Automatic scheduling of many referees with constraints by a single equation." video on youtube of a system benrayfield made) = '+
		exampleDirc);
	
	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   0, 0,                                       .2,   255, 0, 0, false, 'javascript:\n//TODO\n', []));
	//dc.push(new dagball.Circ('swarm', 0, 0, 0,   1, 0,                                       .2,   255, 0, 0, false, 'javascript:\n//TODO\n', []));

	dagball.circles.forEach(c=>c.Mutid()); //create circ.mutid field if doesnt have one already. so dagball.edgeEdit can work on these too.
};

dagball.addExampleCircs();

dagball.displayCircs = function(optionalByteRect){
	for(let circ of dagball.circles){
		//This IF is an "ugly hack", a workaround for the bug that there must be at least 1 circ in GPU.
		//TODO fix it then remove the IF and always do whats in the IF.
		//Problem is its such a big circ (covering whole game area and alot more just in case) that it
		//interacts with a display bug that something is wrapping around horizontally (maybe the ed line to (0,0)?)
		//and covers about half of the pixels.
		if(circ.mutid != 'circNever0CircsInGPU'){
			circ.display(optionalByteRect);
		}
	}
};

//for every pair of algorithm and memory range (every array is in 1 of: par loc big) return all possible combos (merged by ORing mem ranges),
//which is (TODO what datastruct?) gonna be something like a js {} map of arrayName to {read:[fromA toA fromB toB fromC...], write:[...], readsBeforeFirstWrites[...]}
//or something like that. TODO write whatever code it takes to prevent dagball.Circ instances from reading or writing eachothers float array memory or int pointer vars, unexpectedly.
Ap.Ape.prototype.formalVerifyPointerArithmetic = function(){
	throw new Error('TODO use this.searchApes(funcOfApeToBit) to find the mems (parlocMem locparMem par loc big locMem parMem bigMem, maybe a few others?) then in a straightforward way generate (or prove then just give the answer) an expoentially large proof (of keep tree depth small, closely related to indent level) of what ranges of memory each piece of code can do at each piece of memory.');
	//arrayName to... {read:[fromA toA fromB toB fromC...], write:[...], readsBeforeFirstWrites[...]} or what datastruct?
};

//TODO make this not an instance func in Ap.Ape and instead take an Ap.Ape and a dagball.Circ as params.
Ap.Ape.prototype.updateEdGroups = function(circ){
	//console.log('Updating Eds and EdGroups in circ='+circ);
	if(Ap.logEdGroupStuff) console.log('Updating Eds and EdGroups in a circ');
	let ret = []; //list of edGroups, existing or new.
	//only par kinds. not loc or big kinds. FIXME is this ever a different order than the arrays in dagball.view's
	//merged Ap.Ape/Ap.Call (it has 2, 1 for display and one for gradients).
	let mems = this.searchApes(ape=>(ape.apeType=='parMem' || ape.apeType=='parlocMem' || ape.apeType=='locparMem'));
	//mems = Ap.dedupList(mems); //FIXME there should be duplicates in the first place but see Ap.ParseApe etc and fix it.
	mems = Ap.dedupListOrByNames(mems); //FIXME there should be duplicates in the first place but see Ap.ParseApe etc and fix it.
	//TODO also single floats if create a floatParrMem apeType (which 2023-10-23 doesnt exist and the float apeType means on glsl stack, not in parrMem).
	let targetNumEds = 0;
	for(let ape of mems){
		targetNumEds += ape.size();
	}
	while(targetNumEds < circ.edsOut.length){
		circ.edsOut.pop();
	}
	let numEdsAddedWithoutEdGroup = 0;
	while(circ.edsOut.length < targetNumEds){
		circ.edsOut.push(new dagball.Ed(circ, 0, 0, 0, 0, 0)); //FIXME update those numbers
		numEdsAddedWithoutEdGroup++;
	}
	let edIndex = 0;
	for(let ape of mems){
		let targetNumEdsInThisGroup = ape.size();
		let existingEdGroup = circ.edsOut[edIndex].edGroup;
		if(false && existingEdGroup && existingEdGroup.eds.length == targetNumEdsInThisGroup){
			/* The "false &&" in the IF above was added 2024-5-9 to fix this, but TODO add this feature back by writing more detailed code to match prev and next ranges in circ.edsOut,
			so it can keep the customizations of those eds (multisliders, or what did i call them?, and x y position they point to, etc).
			"when editing nodes size in nnet_1715186220.2250001.dagball Uncaught No ed.edGroup in ed=[object Object] in circ"
			Found the problem 2024-5-9-1003aET{{{
				This code "if(existingEdGroup && existingEdGroup.eds.length == targetNumEdsInThisGroup){" in "Ap.Ape.prototype.updateEdGroups = function(circ){" is matching an array that did not change but an array earlier in the ape changed ({nodes 22} changed to {nodes 23}) which made it start at a higher index in circ.edsOut[index]. The index increased by 49. Total edsOut changed from 772 to 821 (+49: +46 in weights (22*23 became 23*24), and +1 in each of outsStart, outsNext, and outs). Despite it only increasing the number of eds by 49, the last 200 eds become null, because "if(existingEdGroup && existingEdGroup.eds.length == targetNumEdsInThisGroup){" leaves the eds as they are, af
			}}}*/


			//TODO check if this is true for all eds in that group, and that they are the next eds in circ.edsOut. 
			if(Ap.logEdGroupStuff) console.log('Not changing existingEdGroup='+existingEdGroup);

			/** in theory, setting apeArrayName here fixes this bug that occurred 2023-11-20,
			edGroup.apeArrayName has old edGroup.apeArrayName from before circ was deleted,
			but keeps the (y,x) positions instead of newEdGroup.pointAtYXR(circ.y+(Math.random()*2-1)*.8, circ.x+(Math.random()*2-1)*.8, circ.r/5);
			:
			setSelectedEdGroup null
			Dagball091.html:1058 starting scheduled deleteCircles: [object Set]
			Dagball091.html:1060 deleting dagball.view cuz deleted circ. It will be auto created in nextState.
			Dagball091.html:1336 [Violation] 'requestAnimationFrame' handler took 3100ms
			Dagball091.html:1345 dagball.mainLoop stopped cuz error. Edit textarea to start mainLoop again. This will happen thru dagball.wasErrorNeedMainLoopRestart. See line number in generated tinyGlsl GPU code on browser console to know what to fix.
			Dagball091.html:4898 Uncaught Error: edGroup.apeArrayName=c6_abc is not in apCall.hasArrayName. The edGroup probably was not created by thatApCall.ape in dagball.view.updateLocalFields(). circ=Circ(id=null y=-0.6905935034276861 x=0.7960876531004584 r=1.84 red=120 green=120 blue=80 isSelected=false text=ape:
			{+
				(abc locparMem {5})
				<(a float) {locPtr abc 4%99}>
				<potenCirc$ {f+ .2 {fsin {f* {f+ x$ a} y$ 33}}}>
			} edgesOut=[object Object],[object Object],[object Object] edsOut=[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]) edGroup=[EdGroup size=5 comment[edGroup for c6_abc]]
				at dagball.updateApCallBeforeEval (Dagball091.html:4898:13)
				at dagball.Game.gradient (Dagball091.html:4979:11)
				at dagball.Game.doPhysics (Dagball091.html:5118:25)
				at dagball.Game.nextState (Dagball091.html:6183:8)
				at mainLoop (Dagball091.html:1341:18)
			dagball.updateApCallBeforeEval @ Dagball091.html:4898
			dagball.Game.gradient @ Dagball091.html:4979
			dagball.Game.doPhysics @ Dagball091.html:5118
			dagball.Game.nextState @ Dagball091.html:6183
			mainLoop @ Dagball091.html:1341
			requestAnimationFrame (async)
			*/
			existingEdGroup.apeArrayName = ape.Name();

			ret.push(existingEdGroup);
		}else{
			let eds = [];
			let edsAreAllAtY0X0 = true;
			for(let i=0; i<targetNumEdsInThisGroup; i++){
				let ed = circ.edsOut[edIndex+i];
				eds.push(ed);
				if(ed.y != 0 || ed.x != 0) edsAreAllAtY0X0 = false;
			}
			//let newEdGroup = new dagball.EdGroup('edGroup for '+ape, eds); //sets each ed.edGroup, so that hooks it into the circ at circ.edsOut[index].edGroup.
			let newEdGroup = new dagball.EdGroup('edGroup for '+ape.Name(), ape.Name(), eds); //sets each ed.edGroup, so that hooks it into the circ at circ.edsOut[index].edGroup.
			ret.push(newEdGroup);
			
			if(edsAreAllAtY0X0){
				console.log('Moving eds cuz they are all at (0,0) so were probably not loaded from a file, newEdGroup='+newEdGroup);
				newEdGroup.randomlyPointYXR();
			}
			if(Ap.logEdGroupStuff) console.log('Making edGroup for ape='+ape+' in circ.eds['+edIndex+'..'+(edIndex+targetNumEdsInThisGroup-1)+'], newEdGroup='+newEdGroup);
		}
		edIndex += targetNumEdsInThisGroup;
	}
	if(numEdsAddedWithoutEdGroup){
		for(let i=0; i<circ.edsOut.length; i++){
			let ed = circ.edsOut[i];
			if(!ed.edGroup){
				Err('Ape.updateEdGroups(Circ), numEdsAddedWithoutEdGroup='+numEdsAddedWithoutEdGroup+
					' (likely caused by increasing an array size or adding an array while editing code in the textarea),'+
					' but after updated EdGroups, some Ed(s) did not have an EdGroup.\ncirc.edsOut['+i+']='+JSON.stringify(ed.toMap()));
			}
		}
	}
	return ret;
};

dagball.EdGroup.prototype.randomlyPointYXR = function(){
	//newEdGroup.pointAtYXR(circ.x+(Math.random()*2-1)*.3, circ.y+(Math.random()*2-1)*.3, circ.r/3);
	//let pointAtRadius = circ.r/5;
	//let pointAtRadius = eds.length*.03;
	let minSepBetweenEds = dagball.snapGridSize*Math.sqrt(2)+dagball.game.floatEpsilon;
	let minCircumference = this.eds.length*minSepBetweenEds*1.05; //FIXME 1.05 instead of 1 cuz circumference is a little longer around than an n-polygon approximating it. could be a little smaller, closer to 1.
	let pointAtRadius = minCircumference/(2*Math.PI); //FIXME what if combos of snapGridSize still make 2 eds from same edgroup point at same (y,x)? Make it a little bigger?
	pointAtRadius *= dagball.pointAtYXRScale;
	this.pointAtYXR(this.fromCirc.y+(Math.random()*2-1)*.8, this.fromCirc.x+(Math.random()*2-1)*.8, pointAtRadius);
};

/*
//This is in Dagball instead of Ape.js cuz its specific to dagball.Circ.
Ap.Ape.prototype.updateEdGroups_OLD = function(circ){
	throw new Error('Ap.Ape.prototype.updateEdGroups is being replaced by the code in dagball.View that does ape.prefixNames cuz only it knows the whole name of the ape array that each EdGroup is for. Or maybe ill put the prefix (usually something like c5_ meaning circle at index 5 in a list) in the circ so it can derive the names of the arrays. Yes, do that. But still [Ap.Ape.prototype.updateEdGroups = function(circ)] is the wrong way to do it cuz dagball.View makes the combined Ap.Ape from multiple ape codes 1 per Circ, and chooses which arrays go where in par loc and big mems.');
	//console.log('Updating Eds and EdGroups in circ='+circ);
	if(Ap.logEdGroupStuff) console.log('Updating Eds and EdGroups in a circ');
	let ret = []; //list of edGroups, existing or new.
	let parrMems = this.searchApes(ape=>(ape.apeType=='parrMem'));
	//TODO also single floats if create a floatParrMem apeType (which 2023-10-23 doesnt exist and the float apeType means on glsl stack, not in parrMem).
	let targetNumEds = 0;
	for(let ape of parrMems){
		targetNumEds += ape.size();
	}
	while(targetNumEds < circ.edsOut.length){
		circ.edsOut.pop();
	}
	while(circ.edsOut.length < targetNumEds){
		circ.edsOut.push(new dagball.Ed(circ, 0, 0, 0, 0, 0)); //FIXME update those numbers
	}
	let edIndex = 0;
	for(let ape of parrMems){
		let targetNumEdsInThisGroup = ape.size();
		let existingEdGroup = circ.edsOut[edIndex].edGroup;
		if(existingEdGroup && existingEdGroup.eds.length == targetNumEdsInThisGroup){
			//TODO check if this is true for all eds in that group, and that they are the next eds in circ.edsOut. 
			if(Ap.logEdGroupStuff) console.log('Not changing existingEdGroup='+existingEdGroup);
			ret.push(existingEdGroup);
		}else{
			let eds = [];
			for(let i=0; i<targetNumEdsInThisGroup; i++){
				eds.push(circ.edsOut[edIndex+i]);
			}
			let newEdGroup = new Ap.EdGroup('edGroup for '+ape, eds); //sets each ed.edGroup, so that hooks it into the circ at circ.edsOut[index].edGroup.
			ret.push(newEdGroup);
			//newEdGroup.pointAtYXR(circ.x+(Math.random()*2-1)*.3, circ.y+(Math.random()*2-1)*.3, circ.r/3);
			newEdGroup.pointAtYXR(circ.y+(Math.random()*2-1)*.8, circ.x+(Math.random()*2-1)*.8, circ.r/5);
			if(Ap.logEdGroupStuff) console.log('Making edGroup for ape='+ape+' in circ.eds['+edIndex+'..'+(edIndex+targetNumEdsInThisGroup-1)+'], newEdGroup='+newEdGroup);
		}
		edIndex += targetNumEdsInThisGroup;
	}
	return ret;
};*/


//dagball.Ape was moved to Ape.js and is now Ap.Ape

//dagball.Ape.prototype.codeToReadFloat = function()


/*
Write example Apes as (name apeType childs...)...

//TODO capital name like MatDimC means the size. lowercase first letter of the same like matDimC means the loop var from 0 to MatDimC-1.
//Or maybe merge those and use lowercase for both and let which param it is decide.
//
//TODO should [...] be a separate object type than (name type params...)? [...] would be an address like in
//(AddToSumB f= SumB (MultiplyStuff3445 f* [MatAB matDimA matDimB] [MatBC matDimB matDimC]))
//(TODO... copy sumB into in matAC at matDimA_loopIndex*matDimB+matDimC_loopIndex)
//(CopySumBIntoMatAC f= [MatAC MatDimA MatDimC] SumB)
//Might want recursive addresses [Thing LoopVarA [InnerThing LoopVarB LoopVarC] LoopVarD] or something like that.
//Maybe use apeType of 'ptr' (pointer) with those so [MatAC MatDimA MatDimC] means (SomeNameNotDisplayed ptr MatAC MatDimA MatDimC).
//It can be used for reading float or writing float.
//Use the {...} syntax to skip giving a name and have it generated from content (TODO by sha256?),
//and prevent other names from being a hash unless its also the hash of their content.
//
//[Thing LoopVarA [InnerThing LoopVarB LoopVarC] LoopVarD]
//{ptr Thing LoopVarA {ptr InnerThing LoopVarB LoopVarC} LoopVarD}
//(TheHash34234 ptr Thing LoopVarA (OtherHash444 ptr InnerThing LoopVarB LoopVarC) LoopVarD)
//
//And Ill take <...stuff> syntax for {f= ...stuff} aka (GeneratedName435 f= ...stuff)
//{f= [MatAC MatDimA MatDimC] SumB} aka <[MatAC MatDimA MatDimC] SumB>
//aka (GeneratedName3344 f= (OtherGenName446 ptr MatAC MatDimA MatDimC) SumB).
//
(root threadTimeMemMemMem
	//(NumGpuThreads const 1001)
	//thread id must be the multiply of 2 ints each within 16k or 8k or 4k or something like that, which is a webgl2 GLSL limit, varies by computer.
	(numGpuThreadsY const 1001)
	(numGpuThreadsX const 1)
	(time +
		(doRadiusWaves +
			(TOOD...)
			(TOOD...)
		)
		//FIXME forEach_hypercubewaveDim should loop toExcl hypercubewaveDims, not a *???
		(forEach_hypercubewaveDim *
			(hypercubewaveExponentialLoop pow (hyperTwo const 2) (hypercubewaveDims const 7))
			hypercubewaveDims
		)
		(raymarchMandelbulbTODO const 1)
		(forestCurveFitDoubleTriangleNeuralnet +
			(TOOD...)
			(TOOD...)
		)
		(matmulABCLoop *
			matDimA
			matDimC
			(sumInDimBSteps +
				<sumB 0.>
				(sumInDimB_loop *
					matDimB
					{f+= sumB {f* [matAB matDimA matDimB] [matBC matDimB matDimC]}}
				)
				<[matAC matDimA matDimC] sumB>
			)
		)
	)
	(parrMem +
		(one const 1) //TODO code shoudl fill this with float 1. The 1 here means size in memory, 1 float.
		(radiusWaves * (waveSize const 2) (numWaves const 5))
		(hypercubewaveAftransToYX * hyperTwo hypercubewaveDims)
		(matmulABCMem +
			(matAB * (matDimA const 7) (matDimB const 3))
			(matBC * matDimB (matDimC const 5))
			(matAC * matDimA matDimC)
		)
	)
	(localparMem unionMax
		(doubleTriangleStuff +
			(doubleTriangleWeights * (numForestCurveFitNodes const 12) numForestCurveFitNodes)
			(outerJoinForestCurveFitNodeWithMathOp *
				numForestCurveFitNodes
				(forestCurveFitNumMathOpsTodoAllApprox20OfThem const 5)
			)
		)
		(todoOtherUsesOfLocalparMem const 10)
		(bayes6Node + (pow (numBayesColors const 3) (bayesVarsPerNode const 6)) )
	)
	(stackMem +
		(returnFloat float)
		(takeTurnsUsingStackMem unionMax
			(doRadiusWaves_stackVars +
				(d float)
				(e float)
				(f float)
				(g float)
				(h float)
			)
			(hypercubewave_stackVars +
				(TODO...)
			)
			(raymarchMandelbulb_stackVars +
				(TODO...)
			)
			(matmulABC_stackVars +
				(sumB float)
			)
		)
	)
)


(forestCurveFitTest doLast
	(fcfDoubleTriangleWeights parrMem {union
		{* (numForestCurveFitNodes 12) (numForestCurveFitMathOps 5)})
		{}
	})
	(fcfNodeOps parrMem {* numForestCurveFitNodes numForestCurveFitMathOps})
	(fcfDiag localparMem numForestCurveFitNodes)
	{+
		{*
			numForestCurveFitNodes
			TODO...
		}
		(TOOD...)
		(TOOD...)
	}
)


(forestCurveFitTest doLast
	(numForestCurveFitNodes 12)
	(numForestCurveFitMathOps 5)
	(fcfRow copy numForestCurveFitNodes)
	(fcfCol copy numForestCurveFitNodes)
	(fcfDoubleTriangleWeights parrMem {union
		{* fcfCol fcfRow}
		{* fcfRow fcfCol}
	})
	(fcfNodeOps parrMem {* numForestCurveFitNodes numForestCurveFitMathOps})
	(fcfDiag localparMem numForestCurveFitNodes)
	{+
		{*
			numForestCurveFitNodes
			TODO...
		}
		(TOOD...)
		(TOOD...)
	}
)


OLD parrMem before converted (matDimA const 7) to just (matDimA 7) so 7 is a type cuz it means float[7] and I dont want the 7 in the childs area.
	FIXME but then how to do (matAB * (matDimA const 7) (matDimB const 3)). Would that be (matAB * (matDimA 7) (matDimB 3))?
	(parrMem +
		(one const 1) //TODO code shoudl fill this with float 1. The 1 here means size in memory, 1 float.
		(radiusWaves * (waveSize const 2) (numWaves const 5))
		(hypercubewaveAftransToYX * hyperTwo hypercubewaveDims)
		(matmulABCMem +
			(matAB * (matDimA const 7) (matDimB const 3))
			(matBC * matDimB (matDimC const 5))
			(matAC * matDimA matDimC)
		)
	)
//Each dagball.Circ should give 1 parrMem, 1 localparMem, and 1 stackMem.
//Some parts will be generated but do need to be in the math model. All the varNames for a dagball.Circ
//will be prefixed by something unique to that circ so they dont overlap vars from other circs.

[[
2023-10-1 https://twitter.com/benrayfield/status/1708518478464811326
This hypothetical exaflop compute cloud should be able to run 2^40 threads in a total of 2^20 browsers (chrome, brave, firefox, etc),
burst rate the entire exaflop from all computers to any 1 computer in around 0.2 seconds if its "embarrassingly parallel" small memory etc.
Hopefully this will become the memory model for my opensource peer to peer exaflop compute cloud (TinyGLSL),
if I can get a million "good gaming computers" and the gamers who play on them to network together thru apps such as Dagball and Wikibinator.
Quote
DagBall - 1000 dimensional hackerspace
@DagBallGame
·
29m
Replying to @DagBallGame
if theres 2^12 floats (read/write 1 per cycle) and 2^20 GPU threads (1024x1024 pic of floatRGB color), and 2^14 cycles per GPU thread,
then every float at a thread, time, and memory address has an id 0 to 2^46-1 in that 16 gigaflop calculation using 4k floats of mem per GPU core
..
Whats not hypothetical is TinyGLSL already does a million threads and 1 teraflop on one browser at a time.
Here's a raymarched 3d mandelbulb fractal. I've also been using it to compute up to 1000 dimensional calculus gradients.
https://twitter.com/benrayfield/status/1708524146286641403/photo/1
..
This hypothetical compute cloud might also have 2^56 Human neurons, as each person computing gaming researching etc together has about
86 billion neurons, very low bandwidth thru mouse keyboard VR/AR gloves, EEG hats, gamepads, andOr other devices. 2^56 neurons + 2^60 flop/sec
...
At a cost of speed, this hypothetical compute cloud can guarantee formal-verified exact determinism and no "gpu fingerprinting" in the roundoff
of float32s, since there would be no roundoff, if you use only the ops of integers in range plus/minus 2^24 which float32s do exactly.
..
This hypothetical opensource p2p compute cloud of 1-million browsers (with optional small local server as net hop between browsers) should able
to compute bigdata-size sparse bayes net of 6SAT sum(float[3^6+1])=1 (fits in GLSL shader),
+1 chanceUnsolvable https://github.com/benrayfield/wikibinator203/blob/main/doc/pic/Bayes%20Rule%20meets%20N-SAT.png
--https://twitter.com/benrayfield/status/1708546300621267082 2023-10-1
Bayes Rule is wrong in an infinitely small edge case where 0 divide 0 happens, when its the bayesian chances of any given set of 3SAT constraints
when theres no solutions. In that case, all bayes weights should be 0, and chanceUnsolvable 1.
Still sums to 1 https://en.wikipedia.org/wiki/Bayes%27_theorem
...
In this 15376-dimensional 4SAT solver I made, where 2 mouse buttons paint on a 124x124=15376 dimensional vector
(and velocity vector which accelerates by negative 15376-dimensional gradient), chanceUnsolvable is 0 so I didnt bother to code it.
Runs on CPU https://memecombinator.io/experiments/ConvfieldDemo3.html
--https://twitter.com/benrayfield/status/1708548892525044213
https://github.com/benrayfield/jsutils/blob/master/src/ConvfieldDemo3.html
...
https://twitter.com/jessald/status/1708548391188226409
jessald
@jessald
Maybe you should try offering an ML service instead of a gaming service. People seem to want the former more.
Then people can sell their GPU time or something.
2:24 PM · Oct 1, 2023
·
1
 View

Lambda Rick /acc
@benrayfield
·
Now
Its not specificly ML or gaming. Just model of computing of outerJoin(threadId,timeCycle,memoryAddress) which given at most as
much mem fits in single GPU core returns float[threadIds]. You might think of it as a single GPU with billion cores
and less global memory than an Atari.
....
https://twitter.com/jessald/status/1708548391188226409
jessald
@jessald
·
28m
Maybe you should try offering an ML service instead of a gaming service. People seem to want the former more.
Then people can sell their GPU time or something.
Lambda Rick /acc
@benrayfield
How about service of run a trillion atari emulators at once. Maybe technically possible. Unknown if legal problems
(OpenAI Gym has atari games so likely ok). GPT4 thinks some atariEmulatorState+sizeOfGame would fit in a single GPU core.
Maybe not a shader. https://youtu.be/dJ4rWhpAGFI?si=Ac1a-R81LhiMyTDh&t=187
The branching within float[totalSize] or maybe slower int[totalSize] in a GPU core, would likely slow it down alot since
it would have to read the whole local memory each atari time step and multiply everything except what it wants to read
by 0. Likely too big a bottleneck.
.......
2023-10-1 https://twitter.com/jessald/status/1708556726239121833
jessald
@jessald
Yes but the question remains: what is an initial application that will cause people to start using the thing thereby bootstrapping the network? Maybe just sell the raw computation and let others figure out what to do with it?
2:57 PM · Oct 1, 2023
·
4
 Views
Replying to @jessald

No file chosen
Lambda Rick /acc
@benrayfield
·
40s
Each game level might be a million dimensional sparse dimensional (at most 1000 dimensions on screen at once) manifold where NP-hard curve patterns reshape the game world that many balls roll on.
Quote
DagBall - 1000 dimensional hackerspace
@DagBallGame
·
Sep 27
Video of DagBall 048. Automatic calculus gradients on hand written GPU code. Watch the GPU code I write come to life in the circles. https://youtu.be/hasxpU4ZSIM
..
Here's an early game demo running 103 dimensions (each ball y x position is 2, each frequency is phase amplitude so 2, center offset of that all is dx dy, amount of radial blur is
a dimension, etc) you can play right now (a tiny html file, static content) https://memecombinator.io/experiments/Dagball009_physicsWorksTodoCreativeGameDesignOfTheEquationsAndTuning_2023-9-12-2pET.html
...........
https://twitter.com/jessald/status/1708561338211893651
@jessald
Getting a blank white screen on mobile. But I've seen your games before. They seem very strange and confusing and not fun? I wonder if there's any world where such games can be modified to become fun?
3:15 PM · Oct 1, 2023

Lambda Rick /acc
@benrayfield
·
Now
Doesnt work on mobile yet. Maybe they dont have the webgl2 plugin for 1-color-channel float32-per-pixel textures. Going for desktop first. Seems to work on chrome, brave, firefox, etc.
chatgpt4[[[[
	Which systems have the webgl2 plugin for 1-color-channel float32-per-pixel textures
ChatGPT
WebGL 2.0, which is an upgrade to the original WebGL specification, introduces a variety of new features and capabilities, including improved support for floating-point textures. Specifically, WebGL 2.0 supports the OES_texture_float extension from WebGL 1.0 and adds native support for floating-point textures without needing any extensions.

For 1-color-channel float32-per-pixel textures, you'd typically use the R32F internal format in WebGL 2.0.

The systems that support WebGL 2.0 (and thus the capability you mentioned) include:

Browsers:

Google Chrome (since version 56)
Mozilla Firefox (since version 51)
Microsoft Edge (since its Chromium-based version)
Opera (since version 43)
Safari (limited support and might require enabling WebGL 2.0 manually)
Operating Systems:

WebGL is a web standard, so its support is more about the browser than the OS. However, the OS and its graphics drivers need to support the necessary OpenGL or Direct3D versions that the browser's WebGL implementation is built upon. Most modern operating systems like Windows, macOS, Linux, and some mobile OS versions support WebGL 2.0 as long as the hardware and drivers do.
Hardware:

Most modern GPUs from NVIDIA, AMD, and Intel support WebGL 2.0. The specific support can vary based on the GPU model and the driver version.
Mobile:

Android devices with appropriate GPU support and running a compatible browser.
iOS devices running Safari 15 or later (with potential limitations).
It's worth noting that while a system might technically support WebGL 2.0, the actual availability and performance can vary based on factors like GPU drivers, browser configurations, and OS updates.

If you want to check support programmatically, you can create a WebGL2 context from a canvas element and then check for the specific texture format's support. Would you like a code snippet to demonstrate this?
]]]]
................(todo might be duplicate talk)
https://twitter.com/jessald/status/1708561338211893651
jessald
@jessald
·
19m
Getting a blank white screen on mobile. But I've seen your games before. They seem very strange and confusing and not fun?
I wonder if there's any world where such games can be modified to become fun?
Lambda Rick /acc
@benrayfield
·
17m
Doesnt work on mobile yet. Maybe they dont have the webgl2 plugin for 1-color-channel float32-per-pixel textures. Going for
desktop first. Seems to work on chrome, brave, firefox, etc.
Lambda Rick /acc
@benrayfield
·
14m
jessald
@jessald
Hmm yeah this one is very low end. It cost around $120 I think.
3:29 PM · Oct 1, 2023
·
3
 Views
Replying to @jessald

No file chosen
Lambda Rick /acc
@benrayfield
·
1m
Other GPU APIs could be added by (after better defined) coding a VM of this model-of-computing. Its common practice in AI
and gaming softwares, multiple backends/implementations in browser. Maybe expand it to OpenCL, WebGL1_GLSL, WebGL2_GLSL,
native_webgl2_GLSL, and WebGPU later?
........................
2023-10-1-349pET https://twitter.com/benrayfield/status/1708566876022813163
jessald
@jessald
·
22m
Getting a blank white screen on mobile. But I've seen your games before. They seem very strange and confusing and not fun? I wonder if there's any world where such games can be modified to become fun?
Lambda Rick /acc
@benrayfield
Here's a game I made long ago thats fun (when I demoed it in the college class where I made it, the most other students kept wanting to play it, got the most screen time on demo day in the class) https://sourceforge.net/projects/asteroidrecurse/ My recent "games" are more proof-of-concept tech demos
sourceforge.net
Recursive Asteroids 3D
Download Recursive Asteroids 3D for free. Asteroids game with 3D fire, explosions, asteroids, and ships, made with OPENGL and C++. Creates recursive spinning asteroids as fire and debris.
3:37 PM · Oct 1, 2023
..
https://twitter.com/benrayfield/status/1708568058342654421
This "game" (more of a tech demo) should be started after waiting on it to become mostly still (stop bouncing/rolling) then move mouse slowly.
It should provide 1 minute of fun experience then get old/boring. Plan is get players to make these faster than anyone can play them.
...........
https://twitter.com/jessald/status/1708568344272482614
jessald
@jessald
Yeah makes sense. But will future games have to incorporate the massively multidimensional feature in order to use your tech? I'm wondering if such a game can be comprehensible to a human.
3:43 PM · Oct 1, 2023
·
1
 View

Lambda Rick /acc
@benrayfield
·
Now
You dont have to use alot of dimensions. Could simulate 3-body in 2d as 6d manifold (each dim has position and velocity). This could be viewed as 3 rubberbands vibrating, each of a balls path. So 12d. Could fit 80 points of that in 80*12 dimensions.
youtube.com
3 Body Problem - Periodic Solutions
MATLAB source code here: https://github.com/mws262/MAE5730_examples/tree/master/3BodySolutions. The three body problem involves three point-masses attracted ...
..

Lambda Rick /acc
@benrayfield
·
Now
I could make metaverse objects you wear like a bracelet or necklace that compute scientifically accurate 3body solutions and are stretchy.
You could grab and twist them around people and invent new games of knot tieing etc.
...............
https://twitter.com/benrayfield/status/1708572928298610998
Lambda Rick /acc
@benrayfield
There may be some similarity between my opensource game physics engine and Schrodinger Equation, it appears, since both accelerate
by the negative calculus gradient of high dimensional potential-energy, it appears. Or maybe I'm reading this combo of strange greek symbols wrong
4:01 PM · Oct 1, 2023
View post engagements
..............
https://twitter.com/benrayfield/status/1708574919989117040
Lambda Rick /acc
@benrayfield
·
Now
I dont know. But I do know that simulations of 1000 dimensional manifolds shape themselves and vibrate the ways I want them to in browsers
and that the manifold can do all turing-complete shapes.
..
https://twitter.com/benrayfield/status/1708575969848578311
Lambda Rick /acc
@benrayfield
·
Now
and that eventually in these cluster of opensource peer to peer systems, anyone should be able to learn to do the same
.................
https://twitter.com/jessald/status/1708576145254371540
jessald
@jessald
·
6m
I didn't realize shapes could be turing complete.
Lambda Rick /acc
@benrayfield
This is an infinite dimensional 1 layer convnet-like convolutional-scalar-field thats turing-complete. U paint with 2 mouse
buttons white/black in a 124x124 pixel grid (1 dimension per pixel, with convolutional 4sat-based 15376-dimensional
scalar field) https://github.com/benrayfield/jsutils/blob/master/src/ConvfieldDemo3.html
4:19 PM · Oct 1, 2023
View post engagements

Lambda Rick /acc
@benrayfield
·
Now
Proof of turing-completeness of this manifold:
en.wikipedia.org
Rule 110 - Wikipedia
........
https://twitter.com/benrayfield/status/1708578752228143146
Lambda Rick /acc
@benrayfield
·
Now
I'd speculate that this manifold may be simulated well enuf to do a little computing on a variety of non-newtonian-fluid-like materials
such as a 3d block of nitinol with a 3d-standing-wave acting like a motherboard-clock-wave mechanically
...........
https://twitter.com/benrayfield/status/1708596644374044795
Lambda Rick /acc
@benrayfield
Getting ever deeper into rabbit-holes, but remember I dont need to make custom chips for this to work. It already works in 1 browser at a time with a million GPU threads.
youtube.com
Very strong Nitinol Engine running on warm water and ice
Dr. Johnson's Heat EngineThis is a demonstration of Dr. Johnson's Heat Engine, a Nitinol based engine that works at very low temperatures. I bought it from t...
5:35 PM · Oct 1, 2023
https://www.youtube.com/watch?v=sscoMtJV0uY
....
Github Copilot suggests, based on comments of my possibly crazy hypothesis in the same file, the exact change to Bayes Rule
I was about to write in my new GPU language. Bayes rule divides by 0 unless you include 1 extra weight for Nsat being unsolvable.
This new syntax is outerJoin(gpuThreadId,timeCycle,memoryAddress) and is kind of like a packet or a single/atomic calculation of
average size a few gigaflop, which I'm planning to soon swarm in a p2p opensource network
..
I am currently able to, at nearly the drop of a hat, create a million parallel calculations that each do 1 megaflop and read at most the same 4kB together.
per second
actually 60 million per second. I'm HDMI compatibile speed
times how much calculations each pixel does before choosing its color
.............
2023-10-1-750pET https://twitter.com/benrayfield/status/1708630407502012755
Lambda Rick /acc
@benrayfield
My constraint solver is so fast it writes the screen pixels and, if you have a good gaming computer, is up to HDMI speed.
Lambda Rick /acc
@benrayfield
You could make a mini sim of a key trying to stick into a lock, if it was under 1000 float vars in a WebGL2 GLSL shader,
and other random or similar or fake keys, and it should, in theory, only unlock and turn on screen with the correctly
shaped key, all made of 1000d manifold --https://twitter.com/benrayfield/status/1708631783674167723 2023-10-1-8pET
]]

*/


/*
TODO there should be 2 forms of a primaryKey/pk. One is the prefix of the other cuz doesnt include child ids.
What about odd daglevs? A node whose daglev is odd has exactly 1 parent and 1 child. It exists in GPU code (TODO)
but does not need its own object. It might be just an index in a few arrays of its parent object.
If it has no childs, then its pk can be something like 'y234x5p7r2p5' which means cy is 234, cx is 5.7, and cr is 2.5.
Do I want a name on that like strangeCurveB_y234x5p7r2p5? I could include strings like strangeCurveB in the pk.
Should I use cbor?

//given a primaryKey string, return the dagball.Pk wrapper of it. Multiple calls return the same object, unless its locally deleted,
//and then another call would return a new dagball.Pk and remember that one instead.
dagball.pk = function(pkString){
	let ret = dagball.pks[pkString];
	if(!ret){
		let s = pkString.replace(/p/,'.').replace(/m/,'-'); //get back dots and negatives in numbers in the string
		FIXMEFIXME
		TODO use dagball.sha256HexOfString
		let cy = ;
		ret = dagball.pks[pkString] = new dagball.Pk();
	}
	return ret;
};

//primaryKey
//cr is the radius it can influence/touch things, centered around cy cx.
//toString is pkString so you can use this as js {} key (faster) without needing js Map (slower),
//and look up the object form by dagball.pk(pkString).
//Does not prevent garbcol (garbage collection) of child Pks since stores their string form instead.
dagball.Pk = function(cy, cx, cr, childPks){
	//FIXME include Pk childs, but how to fit the even/odd daglev into that?
	this.cy = cy;
	this.cx = cx;
	this.cr = cr;
	this.childPks = childPks || [];
	this.pkString = ('y'+cy+'x'+cx+'r'+cr).replace(/\./,'p').replace(/-/,'m');
};
dagball.Pk.prototype.toString = function(){
	return this.pkString;
};

//superclass of dagball.Gob and of dagball.Cob and maybe others. Has constant y x red green blue, a variable displayed there on screen,
//with 2 values of position and velocity, and maybe velocityDecay and maybe something about friction but im not super
//if I can do friction (instead of just velocityDecay) at this level. Any algebra equation of curve can be done in Gob shapes.
//dagball.Ob = function(cid, cy, cx, mred, mgreen, mblue){
dagball.Ob = function(circY, circX, mpos, mvel, mveldecay, mred, mgreen, mblue){
	//FIXME should cid wait to be created until subclass. for example, in Gob, theres other fields
	//this.cid = cid || dagball.nextId();
	this.ky = constY; //k means constant. m means mutable.
	this.kx = constX;
	this.mpos = mpos; //mutable position
	this.mvel = mvel; //mutable velocity
	this.mveldecay = mveldecay; //mutable velocityDecay. TODO should mveldecay be global instead of varying per var/dimension?
	this.mred = mred;
	this.mgreen = mgreen;
	this.mblue = mblue;
};

//Lob aka "Leaf OBject". Just a dimension displayed as an icon on screen, varying its brightness to show position value.
//Has no childs. FIXME might just use Ob directly, or a Gob or Cob with no childs?
dagball.Lob = function(){
	//TODO call superclass constructor: dagball.Ob.call();
	//TODO
	
	//this.cid ky kx mred mgreen mblue etc exist from superclass.


};
dagball.inherit(dagball.Lob, dagball.Ob);

//Gob aka "Gpu OBject" aka "gpu circle",
//a constant 2d circle that the GPU code is run in, to affect graphics and ball movement there.
//
//TODO see "verify the code, which may be from untrusted sources, will not crash the game" in dagball.Cob comment, same here.
//
dagball.Gob = function(cy, cx, mpos, mvel, mveldecay, mred, mgreen, mblue){
	//TODO call superclass constructor: dagball.Ob.call();
	//TODO
	dagball.Ob.call(this, cy, cx, mpos, mvel, mveldecay, mred, mgreen, mblue); //superclass constructor
	//dagball.Ob.call(this, cy, cx, dagball.randIntRange(100,220), dagball.randIntRange(100,220), dagball.randIntRange(100,220)); //superclass constructor


	//this.cid ky kx mred mgreen mblue etc exist from superclass.

	this.childIds = []; //in case you dont have them, you can still create a leaf
	this.childs = []; //
};
dagball.inherit(dagball.Gob, dagball.Ob);

//Cob aka "Cpu OBject" aka "cpu circle",
//a constant 2d circle that the CPU code is run in, to affect graphics, such as to write pixels in ByteRect.bytes
//or log to browser console, or other things the GPU doesnt do or is slow at. This normally contains javascript code
//to be evaled (TODO use my cachedEval code from other projects).
//
//TODO verify the code, which may be from untrusted sources, will not crash the game. Limiting it to simple patterns,
//or formalVerifying it using wikibinator203's
//incomplete VarargAx opcode (which is similar to the Coq language and will run in browser) could work,
//but hopefully will find simpler ways to verify simpler patterns of code that still are a flexible in-game editor.
//
dagball.Cob = function(){
	//TODO call superclass constructor: dagball.Ob.call();
	//TODO

	//this.cid ky kx mred mgreen mblue etc exist from superclass.

};
dagball.inherit(dagball.Cob, dagball.Ob);


/*
//name to constant, especially instances of dagball.Circle.
dagball.constants = {
	//TODO
};

//dimension. Each dimension has a target (y,x) coordinate its displayed at,
//is displayed as a circle of varying color,
//its radius is displayed as the same radius as all the other dims which is different than this.affectRadius,
//and it moves as near to the target (y,x) as it can without overlapping other dims,
//so it can be selected with mouseover etc.
//
//A dim has a type (dimtype) of _exists _isInView _normalDimensionVar _input _midport (todo rename those).
//maybe also _gpuCircle. maybe also _literalDataByContentType. maybe also _circJsOutputToByterectAndMaybeAlsoInputFromSomeChilds.
//
//a type _midport.pos is held to the weightedAve of ports connected to eachother thru it.
//The use of _midport is if theres many (m) ports connected to eachother, that all should converge to
//the same scalar, then instead of m*(m-1)/2 connections, there can be m connections to a _midport.
//They all instead leastSquares toward that weightedAve, so its still an energy function.
//
//A dim has a set of child dims (actually a list).
//A dim is a primaryKey and has a mutable scalar value for position and velocity,
//but those scalars can be set by other forest data structures.
//A dim has a position and a velocity. Those "other forest data structures"
//can include setting (or gradually changing toward) both position and velocity
//of other dims reachable lower in forest from it.
dagball.Dim = function(constTargetY, constTargetX, constAffectRadius, constDimtype, constContent, constChilds,
		mutablePosition, mutableVelocity, mutableNearTargetY, mutableNearTargetX, mutableRed, mutableGreen, mutableBlue){
	//TODO make this a bigint like 253453434653n? No, it has to be a valid var name in javascript and in glsl.
	this.id = 'dimIdFixmedontmakethisrandom'+Math.floor(Math.random()*1000000000)+Math.floor(Math.random()*1000000000);
	this.preferredName = null; //null means same as id. preferred value of this.name (which is mutable), but cuz there might be name collisions, this is just preferred. Might add a random suffix if duplicate/collision.

	this.targetY = constTargetY;
	this.targetX = constTargetX;
	this.affectRadius = constAffectRadius;

	//_exists _isInView _normalDimensionVar _input _midport (todo rename those).
	//maybe also _gpuCircle. maybe also _literalDataByContentType. maybe also _circJsOutputToByterectAndMaybeAlsoInputFromSomeChilds.
	this.dimtype = constDimtype;
	
	//TODO this might be a js {}, and for dag hashing purposes is some
	//norming of json (remove all unnecessary whitespace, sort keys, etc?).
	//A groundCircle (scalarfield) has an _exists dim and an _isInView dim and other dims.
	//If it _exists*_isInView is nonzero, then it affects the summed scalarField that much.
	//The json would contain tinyGlslCode for the scalarField,
	//using ids (this.childs[6].childs[2].id for example) as var/dim names.
	this.content = constContent;

	throw 'FIXME should x y dimtype childs tinyGlslCode jsCode inputSource etc all be in the json? everything that goes into the hash is in the json?';

	throw 'FIXME should id be concat(hash,proofOfWorkRecurse)?';

	throw 'FIXME should var names be renamed automatically local to a run of the program and computer, so the glsl code isnt too big and so theyre more human readable? or maybe just write them as: float smallname = dim23453q4534q5234524353452435645645longname345345;?';

	throw 'FIXME make it be all json-compatible. Dim will be [id {immutable parts} {mutable parts}] or maybe {id: id, mut: {...}, immut: {...}}?. id is derived entirely from {immutable parts}. {mutable parts} are mostly this.pos and this.vel and display color and parents Set. The mutable parts can be set (or gradually pushed to chosen values) by an immutable object whose this.content (or is it contentjson contentstring or what field name) that specifies values for those, a kind of dag node thats not a scalar field. Similar to you can put an image/jpeg, text/plain, application/x-wikibinator203 (or what contenttype is it? look in wikibinator203VM.js for that) lambda id, etc. Could write a message to the other players like a chatroom, by adding to the dag. Could hook in local gamepad 3 axis 5, keyboard button j, etc at a dimtype _input dim. etc.';

	this.childs = childs;

	/*As explained here, daglev is even for gpucircles or leafs, odd for the childs of gpucircles,
	and each odd dim has exactly 1 parent and exactly 1 child. So maybe dont need to store them this way. TODO.
	SOLVED: keep the even/odd daglevels. Explained here...
	https://www.facebook.com/groups/dagball/posts/682041283838783
	and here https://twitter.com/DagBallGame/status/1702797377420046593 is a copy of that and link to it.
	*
	this.daglev = 0; //height in DAG. 0 if leaf, else max child daglev + 1.
	for(let child of childs){
		this.daglev = Math.max(this.daglev, child.daglev+1);
	}

	//You can ignore proofOfWork* vars if you want,
	//but they might be useful once the peer to peer massively multiplayer DagBall network scales up.

	//TODO lazyeval proofOfWork* vars? or should id be derived from it?

 	//TODO proofOfWorkRecurse is proofOfWork of this Dim + proofOfWork of each reachable Dim but only counting each once.
	//This is a sum of all dim.proofOfWorkLocal reachable, so this is a number that in the worst case always fits in 320 bits
	//cuz that can hold up to about (2 power 64) dag nodes reachable from the same Dim. TODO make these bigints like 253453434653n?
	this.proofOfWorkRecurse = null;
	
	//TODO proofOfWorkLocal is ceil((2 power 256) divided by (1+sha256AsUint256(utf8(this.id)))), or something like that, TODO.
	//TODO make these bigints like 253453434653n?
	this.proofOfWorkLocal = null; //TODO

	//any small string (or should it be bytes?). TODO what length limit? Should it have to be a number?
	//TODO make these bigints like 253453434653n?
	this.proofOfWorkSalt = null; //TODO


	//IMMUTABLE DAG STUFF ABOVE, MUTABLE BELOW.


	this.pos = mutablePosition;
	this.vel = mutableVelocity;

	this.nearTargetY = mutableNearTargetY;
	this.nearTargetX = mutableNearTargetX;

	this.red = mutableRed; //dagball.randIntRange(100,220);
	this.green = mutableGreen; //dagball.randIntRange(100,220);
	this.blue = mutableBlue; //dagball.randIntRange(100,220);

	//local to this computer and run of the program, not a global id. This is an abbrev of this.id
	//and can be replaced by a human readable name but starts like d1 d32454 etc.
	this.name = dagball.nextId();

	//Set of dagball.Dim instances whose child list includes this.
	this.parents = new Set();

	//This is like "does this exist?", but I dont want to confuse it with the _exists dimtype.
	//This is for the moment it becomes garbage collectible, not the soft removing by gradual scalars.
	//true when each of my childs has child.parents containing this. If this is a leaf (no childs) it can be isInDag or not.
	//Do that when deleting it. Let it be javascript garbage collected.
	//this.isInDag = true;
	this.setIsInDag(true);
};

dagball.Dim.prototype.numDimsReachable = function(){
	if(this.cache_numDimsReachable === undefined){
		throw '1 if leaf. cache in this.cache_numDimsReachable. TODO compute this recursively, counting each reachable only once. This is used for limiting the number of Dims computed in gpu at once which can, in tests so far (not on enuf computers yet) be up to about 1024 or maybe 1010 etc.';
	}
	return this.cache_numDimsReachable;
};

//Starts as true.
//setIsInDag(false) to delete, to make js garbage collectible if you also have no pointers at it.
//You can later call setIsInDag(true) to add it back, if it hasnt been garbage collected yet.
dagball.Dim.prototype.setIsInDag = function(isInDag){
	for(let child of childs){
		if(isInDag){
			child.parents.add(this);
			dagball.nameToDim[this.name] = this;
			dagball.idToDim[this.id] = this;

		}else{
			child.parents.remove(this);
			delete dagball.nameToDim[this.name];
			delete dagball.idToDim[this.id];
		}
		//child.parents[isInDag ? 'add' : 'remove'](this);
	}
	this.isInDag = isInDag;
};

dagball.Dim.prototype.setName = function(newName){
	if(newName != this.name){
		if(dagball.nameToDim[newName] !== undefined){
			throw 'Dim of newName already exists, newName='+newName+' currentName='+this.name;
		}
		delete dagball.nameToDim[this.name];
		dagball.nameToDim[newName] = this;
		this.name = newName;
	}
};


/* Designing things 2023-9-15+...

dimtype: maybe also _gpuCircle. maybe also _literalDataByContentType. maybe also _circJsOutputToByterectAndMaybeAlsoInputFromSomeChilds.


Some types that would go in the dag, but im not sure if dagball.Dim's fields are a good way to represent them...

MidPort:
	the lowest layer. Its pos is held to weightedAve of whatever ports are connected to eachother (trying to be the same scalar pos as eachother).
NumPort:
	bit isInput;
	InPort is an NumPort that can only be read inside dagball, and can be written from outside dagball.
//OutPort:
//	OutPort is an NumPort that can be read and written by dagball, and can only be read from outside dagball. This might just be a normal NumPort?
Player:
	anything outside the DagBall system that can write at least 1 NumPort (especially if that NumPort.isInput is true).
	Which NumPorts are written by which players may be hard to predict since it gets mixed with syncing the game state
	to deal with roundoff-error and chaoticly changing futures depending on small changes in the past. Its a research path.
View:
	Since TinyGLSL has limit of max about 1000 dims/NumPorts in gpu at once, subsets of the game world are updated
	independent of eachother, then gradually synced. View must include
	Cuz of that getting out of sync (in gradual amounts), View should also have the pos and vel of those NumPorts,
	instead of storing it in the NumPorts themselves. Use NumPorts only as 
	GpuCircle[] gpucircs;
	NumPort[up to 1000]  ports;
		//the ports in those gpucircs and maybe also other ports such as aGpuCircle.exists.
	Id like to merge exists and isInView into a single number and do garbcol and caching a different way.
GpuCircle:
	NumPort weight;
		//held equal to isInView*exists. Or maybe this should be the GpuCircle itself as a NumPort/dim
		//since everything has a pos and a vel and maybe also a velocityDecay?
	Map<View,NumPort> isInView;
		//Map<Player,NumPort> isInView;
		This is set by distance to being on screen vs off screen,
		and a little past the screen cuz could get on screen within few seconds.
		This is not set by gradient. Its written by player scrolling around the game world.
		GpuCircle.exists*GpuCircle.isInView*outputNumberFromGpuCircleAtAYX is added to poten.
		There may be 1 isInView object for EACH player viewing the game world,
		and there can be unlimited players, but lets at least simulate it locally
		for 3 players so problems as complex as 3-body can come up in the sync.
		The Map<Player,NumPort> isInView;" size should be at least 3 when testing the sync.
		The multiple isInView for the same GpuCircle should technically be merged into a single isInView
		and all have the same value, but that would break the rule of max 1000 dims/NumPorts in gpu at once.
		Maybe Player is not the right class for this, and should be called View instead.
	NumPort exists;
		From 0 to 1, how much influence this GpuCircle has on the game world when in view.
		GpuCircle.exists*GpuCircle.isInView*outputNumberFromGpuCircleAtAYX is added to poten.
		Since this
	NumPort[] ports;
	defines what to add to poten (potentialEnergy) within its circle, d

Should dag edges have weights? Or is that weight that I want betweeen NumPorts (thru MidPort) just the _exists*_isInView of a GpuCircle?

MidPort <- NumPort <- GpuCircle <- View.
GpuCircle is a NumPort that is thatGpuCircle.weight.
MidPort is weightedAve weighted by what? Value is from NumPort.
	Weight is from the GpuCircle that has that NumPort child, and dividing by total such weights at that NumPort.
	If total weight is 0, that could be a problem for MidPort. Id like to just not calculate that MidPort in that case
	but weights can change with each next TinyGLSL call.
	What I really wanted instead of MidPort is all pairs of
	connected NumPort (like in a group of 5 NumPorts that try to be the same pos value),
	but that still should be affected by weight.
	I dont want to decay those 5 NumPorts toward eachother. I want to do it by poten.
	So define the poten with 2*portsInGroup numbers: weight and pos for each.
	If portsInGroup is 3, thats: weightA posA weightB posB weightC posC.
	What should be added to poten for those 6 vars?
	Or, I could make MidPort not be held to the weightedAve and let it move freely based on the poten added for
	each NumPort whose child that MidPort is (its multiple parents are the NumPorts in that group).
	That way, i dont have to jump 2 hops between MidPort<-NumPort<-GpuCircle
	and can just use MidPort<-NumPort vs NumPort<-GpuCircle separately.
	The problem with that is it adds an extra hop between NumPortJ->MidPort<-NumPortK.
	Also, since 2+ GpuCircles arent supposed to share their NumPorts, should that also be true for A GpuCircle
	that is the parent of another GpuCircle (its weight, which would be itself as a port)?
	GpuCircleM<-NumPort<-GpuCircleN, instead of GpuCircleM<-GpuCircleN.
	That makes sense. Regardless of its daglev,
	every scalar field object (including GpuCircle and maybe other types too) should have ports at 2 daglevs,
	self and self-1. So divide daglev into evens and odds. Leafs go at daglev0.
	The first layer of GpuCircs have their exists/selfGpuCircItsOneVarOfPosAndVel ports at daglev2,
	and has its direct childs at daglev1.
	Above that, childs can skip levels as long as they point at an odd daglev thats a lower daglev than self.
	Each node at odd daglev is part of a node at its daglev+1 and is not part of any other node
	and cant have incoming pointers from any other node.
	GpuCircleM<-GpuCirclePChild8<-GpuCircleP.
	GpuCircleM<-GpuCircleNChild5<-GpuCircleN.
	Pos and vel has to be stored separately GpuCirclePChild8 vs GpuCircleNChild5
	even if they're supposed to be the same value or converge toward the same value (that value being GpuCircleM).
	Between a node at odd daglev and its parent, their values dont directly affect eachother.
	Between a node at even daglev and its parent, if that even number is 0 (is lowest daglev) then they should
	be pushed (by defining scalarfield to be lower when they are near in value) to be nearer in value.
	BUT if that even number is not 0 (is 2 4 28 etc, and its parent at 3 5 29 etc),
	then Im undecided if they should be pushed together or not.
	The other option (than pushing together) is to copy the even node to its parent odd node
	and let the even node above that (so 2 higher) add to poten so the only writing to
	the lower even node is thru gradient. Nodes should only be written by gradient.
	GpuCircleR is its weight and ranges 0 to 1. GpuCircleR(gameStateS) is what it wants to add to poten,
	maybe scaled by const*tanh(val/const) which approx equals val when val is small.
	GpuCircleR*GpuCircleR(gameStateS) is whats actually added to poten.
	Im uncertain if I need the even/odd daglevel system.

	The leafs (MidPorts) dont add to poten. Poten changes them by gradient.

	If all GpuCircle weights are 1, then the pulling vars together is easy.
	When those weights differ, among multiple GpuCircles above the same vars,
	that makes it harder to define the scalarfield.

	A GpuCircle can child point at multiple daglevs below it at once,
	so could include a leaf/daglev0 and a daglev2 in its childs for example.


	SOLVED: keep the even/odd daglevels. Explained here...
	https://www.facebook.com/groups/dagball/posts/682041283838783
	and here https://twitter.com/DagBallGame/status/1702797377420046593 is a copy of that and link to it.


*/


/*
dagball.circ = function(cy, cx, cr){
	throw new Error('TODO');
};

dagball.Circle = function(cy, cx, cr, optionalChilds){
	this.name = nameOfCircle(cy,cx,cr);
	this.cy = cy;
	this.cx = cx;
	this.cr = cr;
	this.childs = optionalChilds || [];
	for(let child of this.childs){
		if(!this.fitsIn(child)){
			throw 'This circle '+this+' does not fit in child circle '+child;
		}
	}
};
//this.name so it can be used as key in js {} maps which are faster than js Map.
dagball.Circle.prototype.toString = function(){
	return this.name;
};
dagball.Circle.prototype.centerDist = function(circ){
	return Math.hypot(this.cy-circ.cy, this.cx-circ.cx);
};
dagball.Circle.prototype.fitsIn = function(outerCirc){
	return (outerCirc.cr >= (this.centerDist(outerCirc)+this.cr));
};

//primaryKey of a 
dagball.nameOfCircle = (cy,cx,cr)=>(('Y'+cy+'X'+cx+'R'+cr).replace(/-/g,'m').replace(/\./g,'p'));

//DAG data nodes (hash forest) are layer0. layer1 is Dim (primaryKey is constant circle). layer2 is Ground. layer3 is moving stuff such as balls.

//layer1. //DAG data nodes (hash forest) are layer0. layer1 is Dim (primaryKey is constant circle). layer2 is Ground. layer3 is moving stuff such as balls.
//a dimension that has position (p), velocity (v), velocityDecay (d), chance (q),
//constantYCenter (cy), constantXCenter (cx), constantRadius (cr).
//Chance that it exists, 0 to 1, or weightedsum gradually.
//PrimaryKey is [cy,cx,cr]. The others are mutable.
//dagball.Dim = function(cy, cx, cr){
dagball.Dim = function(circ){
	//this.name = dagball.nameOfCircle(cy,cx,cr); //primaryKey
	this.circ = circ;
	this.cy = cy; //constant y center
	this.cx = cx; //constant x center
	this.cr = cr; //constant radius that it can directly be read and written within
	this.p = 0; //position
	this.v = 0; //velocity
	this.vd = 0; //velocity decay
	this.chance = 1; //chance/weight, range 0 (dont include this Dim in the game) to 1 (include this dim) gradually.
};

//layer2. //DAG data nodes (hash forest) are layer0. layer1 is Dim (primaryKey is constant circle). layer2 is Ground. layer3 is moving stuff such as balls.
dagball.Ground = function(circ){
	this.circ = circ;
	this.beforeCode = ''; //tinyGlslBeforeCode
	this.code = ''; //tinyGlslCode
	this.chance = 1; //chance/weight, range 0 (dont include this Dim in the game) to 1 (include this dim) gradually.
};

//layer3. //DAG data nodes (hash forest) are layer0. layer1 is Dim (primaryKey is constant circle). layer2 is Ground. layer3 is moving stuff such as balls.
dagball.Ball = function(){
	throw new Error('TODO');
	this.chance = 1; //chance/weight, range 0 (dont include this Dim in the game) to 1 (include this dim) gradually.
};
*/


dagball.Game = function(nGlo, nCurve, nBall, mBall, tinyGlslCurveCode){
	this.nGlo = nGlo; //number of global vars
	this.nCurve = nCurve; //number of heightmap curve vars. Must be at least 2. Should be higher so theres room to move around.
	//this.Glo = 0; //number of global vars
	this.nBall = nBall; //number of balls
	//Number of vars per ball. The first 2 vars are y and x position, usually within a circle of radius 1 but could go farther, TODO.
	//TODO have vars for red green blue radius andOr other things you in my "bobaga ball overheats" small experimental game?
	this.mBall = mBall;
	this.tinyGlslCurveCode = tinyGlslCurveCode;// || 'ret = 0.; //flat energy function. TODO replace this.';
	if(this.oEnd() > 1010){
		throw new Error(this.oEnd()+'==this.oEnd() dimensions wont fit in uniform/constant memory (the fastest) in tinyGlsl if its bigger than around 1024 (not sure where exact limit is, and that may vary across computers, TODO test that)');
	}
	this.pos = new Float32Array(this.oEnd());
	this.vel = new Float32Array(this.pos.length);
	//this.floatEpsilon = 2**-8;
	//this.floatEpsilon = 2**-6;
	this.floatEpsilon = 2**-10; //(2**-10)==.0009765625 . Important that it be a powOf2 so causes less roundoff. FIXME 2**-10 might be too big considering dagball.positionLimit is 2024-5-19 plus/minus 20. was using this 2023-12-5
	this.displayBallTrails = false;

	//TODO when counting time using .now in the performance object (see my other code). this.estimateFPS = 60; //estimate frames per second. Goal is 60 FPS to match HDMI screens, but this will update live.
	//this.estimateFPS_decay;
	this.countNextState = 0;
};

dagball.Game.prototype.randomizePos = function(){
	//TODO merge duplicate code between randomizePos and randomizeVel
	let oBall = this.oBall();
	let endOBall = oBall+this.nBall*this.mBall;
	for(let i=0; i<this.pos.length; i++){ //FIXME this should do it to the eds and the balls
		let isBallRange = oBall <= i && i < endOBall;
		//let mul = isBallRange ? .03 : .4;
		let mul = isBallRange ? .2 : .7;
		this.pos[i] = (Math.random()*2-1)*mul;
	}
	for(let ed of dagball.getEds()){
		ed.pos = (Math.random()*2-1)*.7;
	}
	for(let ball of dagball.balls){ //new kind of balls
		ball.y = (Math.random()*2-1)*.6;
		ball.x = (Math.random()*2-1)*.6;
	}
};

dagball.Game.prototype.randomizeVel = function(){
	//TODO merge duplicate code between randomizePos and randomizeVel
	/*let oBall = this.oBall();
	let endOBall = oBall+this.nBall*this.mBall;
	for(let i=0; i<this.vel.length; i++){
		let isBallRange = oBall <= i && i < endOBall;
		//let mul = isBallRange ? .05 : .5;
		let mul = isBallRange ? 4.3 : 8.5;
		this.vel[i] = (Math.random()*2-1)*mul;
	}*/
	for(let ed of dagball.getEds()){
		ed.vel = (Math.random()*2-1)*.5;
	}
	for(let ball of dagball.balls){ //new kind of balls
		ball.yv = (Math.random()*2-1)*.85;
		ball.xv = (Math.random()*2-1)*.85;
	}
};

dagball.Game.prototype.tinyGlslBeforeCode = function(funcName){
	let beforeCode = '';
	if(funcName != 'potentialEnergiesForGradient'){
		//FIXME remove this cuz not using parr anymore 2023-12, havent for months.
		beforeCode += '#define parr par'; //so dont have to copy par array to parr array when not modifying it.
	}
	return beforeCode;
};

//This code was replaced by Ap.js long ago, now is 2024-2. But 2024-5-6 I see its still being called when load *.dagball file
//from file chooser button, in some cases (2024-5-6-3pET_dagballOftenRandomizesBallPositionsAfterLoadFromFileButton).
//Its called in [[dagball.Game.prototype.nextState = function(dt){ let newNcurve = dagball.view.numEds(); if(this.nCurve != newNcurve){]]
//
//OLD comment, what this originally did:
//changes this.pos and this.vel and this.nCurve. nCurve is the number of parrMem dims in dagball.view.
dagball.Game.prototype.setNcurve = function(newNcurve){
	if(this.nCurve != newNcurve){
		console.log('dagball.Game changing its nCurve from '+this.nCurve+' to '+newNcurve+' and same size change for pos and vel float arrays.');
		let oldPos = this.pos;
		let oldVel = this.vel;
		let oldNcurve = this.nCurve; //number of dims in parrMem in dagball.view, unless its out of sync in the middle of a video frame.
		if(oldPos.length != this.oEnd()){
			throw new Error('Old pos is wrong length');
		}
		let newSize = oldPos.length+newNcurve-oldNcurve;
		let newPos = new Float32Array(newSize);
		let newVel = new Float32Array(newSize);
		let oldOBall = this.oBall();
		this.nCurve = newNcurve;
		this.pos = newPos;
		this.vel = newVel;
		/* Removed cuz of 2024-5-6-3pET_dagballOftenRandomizesBallPositionsAfterLoadFromFileButton
		let newOBall = this.oBall();
		//copy ball positions and velocities, but randomize everything else.
		this.randomizePos();
		this.randomizeVel();
		let ballDims = this.nBall*this.mBall; //number of balls * dimsPerBall.
		for(let i=0; i<ballDims; i++){
			newPos[newOBall+i] = oldPos[oldOBall+i];
			newVel[newOBall+i] = oldVel[oldOBall+i];
		}
		*/

		if(this.pos.length != this.oEnd()){
			throw new Error('New pos is wrong length');
		}
	}
};

//This isnt used anymore 2023-11-13+. Dagball calls Ape.js/Ap.js calls TinyGlsl calls Webgl2_GLSL. Dagball doesnt call TinyGlsl directly,
//(though I might find other uses for TinyGlsl later that Dagball may call directly?).
//
//funcName can be 1 of: 'potentialEnergiesForGradient' or 'potentialEnergiesForDisplay'
//If dagball.doPhysicsAndGraphicsFromGpuCodeInCircsElseTheExampleGpuCode then this returns from dagball.View.mergedGpuCode, else its an example code.
dagball.Game.prototype.tinyGlslCode = function(funcName){
	let tinyGlslCurveCode = dagball.doPhysicsAndGraphicsFromGpuCodeInCircsElseTheExampleGpuCode ? dagball.view.mergedGpuCode : this.tinyGlslCurveCode;
	if(dagball.log_tinyGlslCurveCode){
		console.log('dagball.Game.prototype.tinyGlslCode tinyGlslCurveCode='+tinyGlslCurveCode);
	}
	//FIXME also change this.nCurve this.nBall etc depending on this.View. Maybe dagball.View is becoming the new dagball.Game object?

	//let line = '\n		';
	let code =
		`//TODO make some vars here.
		//ids will be this.oEnd()+1 cuz this.oEnd() is number of dimensions of the potentialEnergy scalarField.
		const int oGlo = ${this.oGlo()};
		const int oCurve = ${this.oCurve()};
		const int nCurve = ${this.nCurve}; //FIXME update this in dagball.updateView()?
		const int oBall = ${this.oBall()};
		const int nBall = ${this.nBall};
		const int mBall = ${this.mBall};
		const int oEnd = ${this.oEnd()};
		const float floatEpsilon = ${this.floatEpsilon};
		float potenOne = 0.; //potential energy of n dimensional heightmap from current ball or pixel
		float potenSum = 0.; //sum of potenOne.;
		int o = oCurve;
		`
	if(funcName == 'potentialEnergiesForGradient'){
		code +=
			`float parr[oEnd]; //for potentialEnergy. each GPU thread adds epsilon to 1 dimension of this, except highest id (oEnd) is neutral.
			for(int p=0; p<oEnd; p++){
				parr[p] = par[p];
				if(p == id) parr[p] += floatEpsilon;
			}
			for(int b=0; b<nBall; b++){
				int ob = oBall+b*mBall;
				float y = parr[ob++]; //dagball coordinates, unlike idy idx idh idw which are pixel/tinyGlsl coordinates.
				float x = parr[ob++];
				potenOne = 0.;
				//START tinyGlslCurveCode for potentialEnergiesForGradient
				${tinyGlslCurveCode}
				//END tinyGlslCurveCode for potentialEnergiesForGradient
				potenSum += potenOne;
			}
			ret = potenSum;
			//TODO loop over balls, computing height at each. then loop over all pairs of balls and do bounce/repel. Return potentialEnergy.
			`;
	}else if(funcName == 'potentialEnergiesForDisplay'){
		//throw 'TODO get pixel from idy idx idh idw.'
		/*
		dagball.SimpleAftrans.prototype.reverseY = function(forwardY){
			//FIXME?
			//forwardY return this.addY+this.magnifyY*y;
			return (forwardY-this.addY)/this.magnifyY;
		};
		dagball.SimpleAftrans.prototype.reverseX = function(forwardX){
			//FIXME?
			//forwardX return this.addX+this.magnifyX*x;
			return (forwardX-this.addX)/this.magnifyX;
		};*/
		let af = dagball.aftrans;
		code +=
			`//FIXME move the aftrans numbers into nGlo/oGlo vars or parr vars so dont have to recompile GPU code to move them.
			//FIXME use a prefix for built-in vars so they dont overlap user created vars
			//float yScreenFraction = float(idy)/float(idh);
			//float xScreenFraction = float(idx)/float(idw);
			const float afAddY = ${TinyGlsl.jsNumToGlslFloat(af.addY)};
			const float afAddX = ${TinyGlsl.jsNumToGlslFloat(af.addX)};
			const float afMagnifyY = ${TinyGlsl.jsNumToGlslFloat(af.magnifyY)};
			const float afMagnifyX = ${TinyGlsl.jsNumToGlslFloat(af.magnifyX)};
			//float y = (yScreenFraction-afAddY)/afMagnifyY; //dagball.aftrans.reverseY
			//float x = (xScreenFraction-afAddX)/afMagnifyX; //dagball.aftrans.reverseX
			float y = (float(idy)-afAddY)/afMagnifyY; //dagball.aftrans.reverseY
			float x = (float(idx)-afAddX)/afMagnifyX; //dagball.aftrans.reverseX
			//float y = float(idy)/float(idh)*2.-1.; //screen y coordinate in range -1 to 1. OLD. These are not dagball or screen coordinates, but FIXME the example GPU code depends on them. Converting to dagball coordinates anyways.
			//float x = float(idx)/float(idw)*2.-1.; //screen x coordinate in range -1 to 1. TODO height/width ratio other than 1.
			//START tinyGlslCurveCode for potentialEnergiesForDisplay
			${tinyGlslCurveCode}
			//END tinyGlslCurveCode for potentialEnergiesForDisplay
			ret = potenOne;
			`;
	}else{
		throw new Error('Unknown funcName='+funcName);
	}
	return code;
};

//offset of nGlo vars. These vars include at least const1 y x, so must be at least those 3.
dagball.Game.prototype.oGlo = function(){
	return 3;
};

//offset of nCurve vars. 2024-2 this has not been used for a long time and this kind of code has been moved into Ap.js.
dagball.Game.prototype.oCurve = function(){
	return this.oGlo()+this.nGlo;
};

//offset of nBall*mBall vars.
dagball.Game.prototype.oBall = function(){
	return this.oCurve()+this.nCurve;
};

//number of vars
dagball.Game.prototype.oEnd = function(){
	return this.oBall()+this.nBall*this.mBall;
};

//TODO also calls CPU sparsely for 
//Calls GPU using TinyGlsl. If dagball.bitpic then also adds dagball.bitpic.readYX(gameY,gameX) to that.
//returns a Float32Array(height*width). You might want to sigmoid them then display as brightnesses,
//or you might want to compare each float to the float down and to the float right and display that 2d vector
//in 2 or 3 colors (see complexnum graphics, for example). You'll get more precision by displaying the 2d angle
//than the float directly.
dagball.Game.prototype.potentialEnergiesForDisplay = function(height, width){
	//let apCall = dagball.view.mergedApCalls.singleHeightmapDisplay;
	let apCall = dagball.get_singleHeightmapDisplay(); //excludes circs where circ.preferCpu is true, cuz those are TODO computed separately sparsely in CPU.
	if(dagball.potentialEnergiesForDisplay_usesApesInCircs_elseSimpleTestCode && apCall){
		/*
		//dagball.logOnce('potentialEnergiesForDisplay using apCall='+apCall);
		//all circs that physics will be calculated on, that graphics and EdGroups etc will be calculated on,
		//but there might be other circs nearby displayed in CPU only since its supposed to be sparse with many times more
		//circs in 2d than can be computed in a view at once.
		//copy floats from dagball.Ed's to Ap.Call, preparing to call.eval() in GPU to get floats back to CPU to update the Eds with (if gradient, or to display on screen if not gradient).
		let circHeadersIndex = 0;
		for(let circ of dagball.view.circs){
			if(dagball.view.hasGpuCodeAndShouldUseIt(circ)){ //without this, the circs in dagball.view would not align to circHeaders
				//ape array in apCall. Youd get windowing to the wrong circs. 2023-11-12 I saw code from 2 circs display curves in 2 different circs.
				//see "(circHeaders parMem (numCircs ${circApes.length}) (headerFloatsPerCirc 4))" in "codeMaker".
				apCall.put('circHeaders', circHeadersIndex++, circ.y);
				apCall.put('circHeaders', circHeadersIndex++, circ.x);
				apCall.put('circHeaders', circHeadersIndex++, circ.r);
				apCall.put('circHeaders', circHeadersIndex++, circ.influence);
				for(let edGroup of circ.getEdGroups()){
					let arrName = edGroup.apeArrayName;
					if(!arrName){
						throw new Error('edGroup has no apeArrayName. circ='+circ+' edGroup='+edGroup);
					}
					//Ap.Ape names must be unique within the same tree/forest of Ape, in every way they're combined. This is normally done
					//by when merging Apes, use Ap.Ape.prototype.prefixNames which renames all of them except where apeType is '$' or '&' cuz
					//those are for externally defined float and int vars.
					if(!apCall.hasArrayName(arrName)){
						throw new Error('edGroup.apeArrayName='+arrName+' is not in apCall.hasArrayName. The edGroup probably was not created by thatApCall.ape in dagball.view.updateLocalFields(). circ='+circ+' edGroup='+edGroup);
					}
					let arraySizeApCall = apCall.size(arrName);
					let arraySizeEdGroup = edGroup.size();
					if(arraySizeApCall != arraySizeEdGroup){
						throw new Error('edGroup and apCall both have an array named '+arrName+' but disagree on its size. arraySizeApCall='+arraySizeApCall+' arraySizeEdGroup='+arraySizeEdGroup);
					}
					for(let i=0; i<arraySizeApCall; i++){
						apCall.put(arrName, i, edGroup.eds[i].pos); //Theres also putFloat if you have a Float32Array that size.
					}
				}
			}
		}*/

		dagball.updateApCallBeforeEval(apCall, new Set(['balls','par','loc','big']), dagball.view.circs, dagball.balls, dagball.aftrans);


		apCall.numGpuThreads = height*width;
		//defaults to 1: apCall.floatsPerGpuThread = 1; //must be 1 or 4. its 1 or 4 params of freturn.
		
		//apCall.eval() should take about 100 milliseconds (compile time) the first time for a unique code string
		//and about 3 milliseconds every time after that until
		//TinyGlsl cache is cleared which happens every minute or so randomly as of 2023-11-11 and then its the compile time once again.
		//let floatsFromGpu = apCall.eval(); //will be modified by dagball.bitpic if exists.
		let floatsFromGpu = apCall.evalGpuMain(); //will be modified by dagball.bitpic if exists.
		if(floatsFromGpu.length != height*width){
			throw new Error('floatsFromGpu.length='+floatsFromGpu.length+' but should be height*width='+(height*width));
		}
		//dont update Ed.pos for display. Only update it by gradient which is a different apCall.eval() GPU call.
		dagball.last_potentialEnergiesForDisplay = floatsFromGpu; //size height*width)
		for(let circ of dagball.circles){
			if(dagball.view.hasGpuCodeAndShouldUseIt(circ,true) && circ.preferCpu){ //code starts with ape: or apeV1: and circ.preferCpu is true, so its computed here in CPU instead of in GPU.
				circ.cpuPaintPotensIntoFloatArray(floatsFromGpu, height, width, dagball.aftrans);
			}
		}

		if(dagball.bitpic && dagball.chk('wallsIfExist',true)){
			if(dagball.chk('paintBitpicAllAtOnce',true)){
				dagball.bitpic.paintOntoPotens(floatsFromGpu, height, width, dagball.aftrans); //does same as "floatsFromGpu[i++] += poten;" in the loop but faster
			}else{
				let isDetailedVerySlowDisplayOfBitpic = dagball.chk('isDetailedVerySlowDisplayOfBitpic',false);
				let poten;
				let i = 0;
				for(let canvasY=0; canvasY<height; canvasY++){
					let gameY = dagball.aftrans.reverseY(canvasY); //in game coordinates, which are about 80 pixels per 1.0 distance in game.
					for(let canvasX=0; canvasX<width; canvasX++){
						let gameX = dagball.aftrans.reverseX(canvasX);
						if(isDetailedVerySlowDisplayOfBitpic){
							poten =  dagball.bitpic.readSmoothYXR(gameY,gameX); //FIXME this is the very slow way, the one used for physics on far less number of points.
							if(!canvasY && !canvasX){
								console.log('FIXME: let poten =  dagball.bitpic.readSmoothYXR(gameY,gameX,5); //FIXME this is the very slow way, the one used for physics on far less number of points.');
							}
						}else{
							poten = dagball.bitpic.readYX(gameY,gameX); //reads either bitpic.wallPoten or 0, or maybe later bilinear interpolation?
						}
						floatsFromGpu[i++] += poten;
					}
				}
			}
		}

		return floatsFromGpu; //from GPU and dagball.bitpic
	}else{ //elseSimpleTestCode
		//TODO use dagball.view.mergedApCalls.singleHeightmapDisplay instead of this small example code {freturn {fmod {f* {id} .01} .2}}.
		let testMemABC_sizeInFloats = 1;
		let call = Ap.lazyEval(`
			{freturn {f+ [(testMemABC parMem {${testMemABC_sizeInFloats}}) 0%10000] {fmod {f* {id} .01} .2}}}
		`);
		let testMemABC_observedSizeInFloats = call.size('testMemABC');
		if(testMemABC_observedSizeInFloats != 1) throw new Error('testMemABC_observedSizeInFloats='+testMemABC_observedSizeInFloats+' but should be '+testMemABC_sizeInFloats);
		//call.put('testMemABC', 0, Math.random()*.1);
		call.put('testMemABC', 0, (dagball.time()%1)*.3); //vary brightness on interval of 1 second, as test
		//TODO call.par.put('arrayName',index,val)
		call.numGpuThreads = height*width;
		//defaults to 1: call.floatsPerGpuThread = 1; //must be 1 or 4. its 1 or 4 params of freturn.
		let floatsFromGpu = call.eval();
		return floatsFromGpu; //get something on screen fast. this isnt the right pixels cuz doesnt come from dagball.view.circs or dagball.circles etc.
	}


	//throw 'TODO use Ap.Ape for potentialEnergiesForDisplay';

	/*
	return TinyGlsl.simple(this.tinyGlslBeforeCode('potentialEnergiesForDisplay'),
		this.tinyGlslCode('potentialEnergiesForDisplay'), this.pos, null, height, width);
	*/
};

//strings logged before by logOnce
dagball.logOnce_ = new Set();
dagball.logOnce = function(str){
	if(!dagball.logOnce_.has(str)){
		dagball.logOnce_.add(str);
		console.log('LOGONCE: '+str);
	}
};

/*2023-12-12 before adding apCall.vel.floats array:
dagball.updateApCallBeforeEval = function(apCall, setOfApeArrayNamesToIgnore, circs, balls){
	let circHeadersIndex = 0;
	//for(let circ of dagball.view.circs){
	for(let circ of circs){
		if(dagball.view.hasGpuCodeAndShouldUseIt(circ)){ //without this, the circs in dagball.view would not align to circHeaders
			//ape array in apCall. Youd get windowing to the wrong circs. 2023-11-12 I saw code from 2 circs display curves in 2 different circs.
			//see "(circHeaders parMem (numCircs ${circApes.length}) (headerFloatsPerCirc 4))" in "codeMaker".
			apCall.put('circHeaders', circHeadersIndex++, circ.y);
			apCall.put('circHeaders', circHeadersIndex++, circ.x);
			apCall.put('circHeaders', circHeadersIndex++, circ.r);
			apCall.put('circHeaders', circHeadersIndex++, circ.influence);
			for(let edGroup of circ.getEdGroups()){
				//throw 'TODO';
				
				let arrName = edGroup.apeArrayName;
				if(!arrName){
					throw new Error('edGroup has no apeArrayName. circ='+circ+' edGroup='+edGroup);
				}
				if(setOfApeArrayNamesToIgnore.has(arrName)){
					throw new Error('Ignoring arrName='+arrName+' TODO make sure thats what you meant to do.');
				}else{
					//Ap.Ape names must be unique within the same tree/forest of Ape, in every way they're combined. This is normally done
					//by when merging Apes, use Ap.Ape.prototype.prefixNames which renames all of them except where apeType is '$' or '&' cuz
					//those are for externally defined float and int vars.
					if(!apCall.hasArrayName(arrName)){
						throw new Error('edGroup.apeArrayName='+arrName+' is not in apCall.hasArrayName. The edGroup probably was not created by thatApCall.ape in dagball.view.updateLocalFields(). circ='+circ+' edGroup='+edGroup);
					}
					let arraySizeApCall = apCall.size(arrName);
					let arraySizeEdGroup = edGroup.size();
					if(arraySizeApCall != arraySizeEdGroup){
						throw new Error('edGroup and apCall both have an array named '+arrName+' but disagree on its size. arraySizeApCall='+arraySizeApCall+' arraySizeEdGroup='+arraySizeEdGroup);
					}
					for(let i=0; i<arraySizeApCall; i++){
						apCall.put(arrName, i, edGroup.eds[i].pos); //Theres also putFloat if you have a Float32Array that size.
					}
				}
			}
		}
	}
	let floatsPerBall = dagball.isDoubleHeightmap ? 3 : 2;
	let ballFloats = new Float32Array(balls.length*floatsPerBall);
	let i = 0;
	for(let ball of balls){
		ballFloats[i++] = ball.y;
		ballFloats[i++] = ball.x;
		if(floatsPerBall > 2){
			throw new Error('TODO is it ball.bal or ball.ballBal? either way its gradient is ball.gradientBal.');
			//ballFloats[i++] = ball.bal;
		}
	}
	apCall.par.putFloats('balls', ballFloats);
};*/

//updateLocalFields
//similar to: dagball.updateApCallBeforeEval = function(apCall, setOfApeArrayNamesToIgnore, circs, balls, aftrans) but with less params
//You still need to set cpuApCall.par.put('hdr',0,z), cpuApCall.par.put('hdr',1,y), cpuApCall.par.put('hdr',2,x) for observed (z,y,x)
//before eachcpuApCall.evan() (which returns float) after this, but it should keep the same other numbers stored here.
dagball.updateCpuApCallBeforeManyEvals = function(cpuApCall, circ){
	//2024-6-9 about to write this code... FIXME this might break things if i change the number or size of built in arrays? Probably will be ok.
	if(cpuApCall.par.floats.length != circ.edsOut.length){
		Err('cpuApCall.par.floats.length='+cpuApCall.par.floats.length+' but should be circ.edsOut.length='+circ.edsOut.length+' Check the "hdr" array and related js and ap.js code.');
	}
	for(let i=0; i<circ.edsOut.length; i++){
		cpuApCall.par.floats[i] = circ.edsOut[i].pos;
	}
};

dagball.numCurveGrabBalls = function(){
	let numCurveGrabs = 0;
	for(let i=0; i<dagball.balls.length; i++){
		if(dagball.balls[i].curveGrab){
			numCurveGrabs++;
		}
	}
	return numCurveGrabs;
};


//2024-6-9 this was only designed for gpucircs, not cpucircs, though some code should be common between them. Cpu needs 'hdr' array (z y x, at least),
//and in cpu you dont need the circHeaders array cuz its 1 circ at a time, but in theory you could run multiple circs with a circHeaders array.
//In cpu, it returns float poten directly instead of doing it in parallel blocks, so also doesnt need aftrans and balls arrays.
//2023-12-12+ adding apCall.vel.floats array (checks for apCall.vel and fills it if so)...
dagball.updateApCallBeforeEval = function(apCall, setOfApeArrayNamesToIgnore, circs, balls, aftrans){
	let aftransNumbers = Float32Array.of(aftrans.addY, aftrans.addX, aftrans.magnifyY, aftrans.magnifyX);
	/*<(afAddY float) [aftrans 0] ${TinyGlsl.jsNumToGlslFloat(af.addY)}>
	<(afAddX float) [aftrans 1] ${TinyGlsl.jsNumToGlslFloat(af.addX)}>
	<(afMagnifyY float) [aftrans 2] ${TinyGlsl.jsNumToGlslFloat(af.magnifyY)}>
	<(afMagnifyX float) [aftrans 3]${TinyGlsl.jsNumToGlslFloat(af.magnifyX)}>
	*/
	//always has vel: let doDiffeq = !!apCall.vel; //if so, has .vel .dvel .dpos. Either way, has .par (position) .loc and .big (or maybe only has .big if its nonempty?).
	let doDiffeq = apCall.ape.containsGpucpu; //if so, has .vel .dvel .dpos. Either way, has .par (position) .loc and .big (or maybe only has .big if its nonempty?).
	let circHeadersIndex = 0;
	//for(let circ of dagball.view.circs){
	let compileCircHeadersUsingLocMem = dagball.chk('compileCircHeadersUsingLocMem',false);
	for(let circ of circs){
		if(dagball.view.hasGpuCodeAndShouldUseIt(circ)){ //without this, the circs in dagball.view would not align to circHeaders
			//ape array in apCall. Youd get windowing to the wrong circs. 2023-11-12 I saw code from 2 circs display curves in 2 different circs.
			//see "(circHeaders parMem (numCircs ${circApes.length}) (headerFloatsPerCirc 4))" in "codeMaker".
			if(!compileCircHeadersUsingLocMem){
				apCall.put('circHeaders', circHeadersIndex++, circ.y);
				apCall.put('circHeaders', circHeadersIndex++, circ.x);
				apCall.put('circHeaders', circHeadersIndex++, circ.r);
				//apCall.put('circHeaders', circHeadersIndex++, circ.influence);
				apCall.put('circHeaders', circHeadersIndex++, circ.computeInfluence());
			}//else these are compiled in to the GLSL code in codeMaker's circHeadersContents array
			//and circHeaders array would be a locMem instead of locparMem as an optimization to have smaller par so less dimensions for gradient func
			//especially if theres alot of circs with very few dimensions/theSharedAreaOfParAndLocMems so circHeaders in that case is biggest part.
			//FIXME 2024-1-30 this is likely to break code that assumes par and loc are same size. Its an upgrade that was planned during design of par and loc.

			//leave vel of circHeaders as 0. dont copy it. cuz circs are only supposed to move resize etc when user holds keyboard button and moves mouse.
			for(let edGroup of circ.getEdGroups()){
				//throw 'TODO';
				
				let arrName = edGroup.apeArrayName;
				if(!arrName){
					throw new Error('edGroup has no apeArrayName. circ='+circ+' edGroup='+edGroup);
				}
				if(setOfApeArrayNamesToIgnore.has(arrName)){
					throw new Error('Ignoring arrName='+arrName+' TODO make sure thats what you meant to do.');
				}else{
					//Ap.Ape names must be unique within the same tree/forest of Ape, in every way they're combined. This is normally done
					//by when merging Apes, use Ap.Ape.prototype.prefixNames which renames all of them except where apeType is '$' or '&' cuz
					//those are for externally defined float and int vars.
					if(!apCall.hasArrayName(arrName)){
						throw new Error('edGroup.apeArrayName='+arrName+' is not in apCall.hasArrayName. The edGroup probably was not created by thatApCall.ape in dagball.view.updateLocalFields(). circ='+circ+' edGroup='+edGroup);
					}
					let arraySizeApCall = apCall.size(arrName);
					let arraySizeEdGroup = edGroup.size();
					if(arraySizeApCall != arraySizeEdGroup){
						throw new Error('edGroup and apCall both have an array named '+arrName+' but disagree on its size. arraySizeApCall='+arraySizeApCall+' arraySizeEdGroup='+arraySizeEdGroup);
					}
					for(let i=0; i<arraySizeApCall; i++){
						apCall.put(arrName, i, edGroup.eds[i].pos); //Theres also putFloat if you have a Float32Array that size.
						if(doDiffeq){
							apCall.vel.put(arrName, i, edGroup.eds[i].vel);
						}
					}
				}
			}
		}
	}
	//so it doesnt recompile when you move or zoom/resize view, 2024-1-6 moved those 4 floats
	//into GPU floats instead of literals in Ap.js/ape code string.
	apCall.par.putFloats('aftrans', aftransNumbers);
	let floatsPerBall = dagball.isDoubleHeightmap ? 3 : 2;
	let ballFloats = new Float32Array(balls.length*floatsPerBall); //position
	let ballVels = doDiffeq ? new Float32Array(ballFloats.length) : null; //velocity
	//let numCurveGrabs = balls.length; //FIXME see numCurveGrabs in codeMaker, which is between 0 and balls.length, the first this many balls.
	let numCurveGrabs = dagball.numCurveGrabBalls();
	for(let i=0; i<balls.length; i++){
		if(!!balls[i].curveGrab != i<numCurveGrabs){
			Err('balls are not sorted by those with curveGrabs first, i='+i+' numCurveGrabs='+numCurveGrabs+'. Caller should have used sortBallByCurveGrabs func.');
		}
	}
	let doCurveGrab = dagball.chk('doCurveGrab',true) && numCurveGrabs>0; //same as near codeMaker, todo merge duplicate code
	//let ballCurveGrabLows = new Float32Array(numCurveGrabs); //position
	let ballCurveGrabMids = doCurveGrab ? new Float32Array(numCurveGrabs) : null; //position
	//let ballCurveGrabHighs = new Float32Array(numCurveGrabs); //position
	let i = 0; //+2 each time
	for(let ball of balls){
		ballFloats[i] = ball.y;
		if(doDiffeq){
			ballVels[i] = ball.yv;
		}
		i++;

		ballFloats[i] = ball.x;
		if(doDiffeq){
			ballVels[i] = ball.xv;
		}
		i++;

		if(floatsPerBall > 2){ //ignoring curveGrab*
			throw new Error('TODO is it ball.bal or ball.ballBal? either way its gradient is ball.gradientBal.');
			//ballFloats[i++] = ball.bal;
		}
	}
	if(doCurveGrab) for(let i=0; i<numCurveGrabs; i++){
		let ball = balls[i];
		//ballCurveGrabLows[i] = ball.curveGrab[0];
		ballCurveGrabMids[i] = ball.curveGrab[1];
		//ballCurveGrabHighs[i] = ball.curveGrab[2];
	}
	apCall.par.putFloats('balls', ballFloats);
	if(doDiffeq){
		apCall.vel.putFloats('balls', ballVels);
	}
	//apCall.par.putFloats('curveGrabLow', ballCurveGrabLows);
	if(doCurveGrab){
		apCall.par.putFloats('curveGrabMid', ballCurveGrabMids);
	}
	//apCall.par.putFloats('curveGrabHigh', ballCurveGrabHighs);
};

//diffeqMapOrNull is null or like {dpos: floats, dvel: floats, dfriction: floats}, which should be multiplied by dt then added to pos and vel,
//but since this updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient only updates gradients, im making a few new vars dposY dposX dvelY dvelX dvel dpos etc.
dagball.updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient = function(gradientsMem, edGroups, balls, diffeqMapOrNull){
	if(diffeqMapOrNull && (gradientsMem.memSize != diffeqMapOrNull.dfriction.length)){
		Err('gradientsMem.memSize='+gradientsMem.memSize+' != diffeqMapOrNull.dfriction.length='+diffeqMapOrNull.dfriction.length);
	}

	//in codeMaker, balls array is first. then circHeaders. Then arrays in the circs.
	//FIXME this should get the _o offsets and _s sizes from apCall.
	//(balls locparMem (numBalls ${numBalls}) (floatsPerBall ${floatsPerBall}))
	//(circHeaders parlocMem (numCircs ${circApes.length}) (headerFloatsPerCirc ${headerFloatsPerCirc}))

	let doDiffeq = !!diffeqMapOrNull;

	if(!gradientsMem.hasArrayName('balls')) throw 'No balls array in gradientsMem. It should have y x, and depending on dagball.isDoubleHeightmap also bal/ballBal var. (gradients of those)';
	let ballsGradients = gradientsMem.getFloats('balls'); //a Float32Array
	let ballsIndex = gradientsMem.ptr('balls');
	let floatsPerBall = dagball.isDoubleHeightmap ? 3 : 2;
	if(ballsGradients.length != balls.length*floatsPerBall){
		Err('ballsGradients.length='+ballsGradients.length+' but should be balls.length*floatsPerBall='+(balls.length*floatsPerBall));
	}
	let j = 0;
	for(let ball of balls){
		
		ball.gradientY = ballsGradients[j];
		if(doDiffeq){
			ball.dposY = diffeqMapOrNull.dpos[ballsIndex+j];
			ball.dvelY = diffeqMapOrNull.dvel[ballsIndex+j];
			ball.dfrictionY = diffeqMapOrNull.dfriction[ballsIndex+j];
		}
		j++;
		
		ball.gradientX = ballsGradients[j];
		if(doDiffeq){
			ball.dposX = diffeqMapOrNull.dpos[ballsIndex+j];
			ball.dvelX = diffeqMapOrNull.dvel[ballsIndex+j];
			ball.dfrictionX = diffeqMapOrNull.dfriction[ballsIndex+j];
		}
		j++;

		if(floatsPerBall > 2){
			ball.gradientBal = floats[j];
			if(doDiffeq){
				ball.dposBal = diffeqMapOrNull.dpos[ballsIndex+j];
				ball.dvelBal = diffeqMapOrNull.dvel[ballsIndex+j];
				ball.dfrictionBal = diffeqMapOrNull.dfriction[ballsIndex+j];
			}
			j++
		}
	}

	//dont do calculus gradients on circHeaders array, since those are only supposed to change by user moving the circs, not by physics.

	let doKnobGradients = dagball.chk('doKnobGradients',true);
	for(let edGroup of edGroups){
		let apeArrayName = edGroup.apeArrayName;
		if(!apeArrayName) Err('no edGroup.apeArrayName');
		if(edGroup.fromCirc.preferCpu){ //update ed used by CPU. FIXME as of 2024-6-9 alot of stuff is missing from cpucircs
			for(let ed of edGroup.eds){
				ed.gradient = 0;
				if(doKnobGradients){
					ed.gradient += ed.knobGradient();
				}
				if(doDiffeq){
					ed.dpos = ed.dvel = ed.dfriction = 0; //avoid NaNs when ed.pos and ed.vel are computed using these later
				}
			}
		}else{ //updage ed used by GPU
			let floats = gradientsMem.getFloats(apeArrayName); //a Float32Array
			let arrayIndex = doDiffeq ? gradientsMem.ptr(apeArrayName) : 0;
			if(floats.length != edGroup.eds.length){
				Err('ape array name='+apeArrayName+' size differs from edGroup size');
			}
			for(let i=0; i<floats.length; i++){
				let ed = edGroup.eds[i];
				ed.gradient = floats[i]; //doPhysics will read ed.gradient to update ed.vel and ed.pos. TODO should dt be in the ed too or use the dt in doPhysics?
				if(doKnobGradients){
					//this todo copied from other code also commented out there before found here the right place to put the code. Todo('FIXME how do i know which index is which ed? that was already computed somewhere. find out where. is it updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient?');
					//some eds have ed.sliderKnobs and ed.knobFunc which takes their knob.val and ed.pos as param, and returns potentialEnergy to adjust that ed's dimension.
					//Its (TODO) used for tuning game content by sliding the knobs along the ed lines, and in some cases you might want to
					//write a custom EdSliderKnob func (dagball.apeFuncJs(apeCode) which compiles ape to js instead of to GLSL as usual but only funcName? lambdas aka apeType=='?').
					ed.gradient += ed.knobGradient();
				}
				if(doDiffeq){
					ed.dpos = diffeqMapOrNull.dpos[arrayIndex+i];
					ed.dvel = diffeqMapOrNull.dvel[arrayIndex+i];
					ed.dfriction = diffeqMapOrNull.dfriction[arrayIndex+i];
					if(ed.dfriction === undefined){
						Err('No ed.dfriction');
					}
				}
			}
		}
	}
	//let expectedNumFloats = floats.length*floatsPerBall;
	//if(floats.length != expectedNumFloats) throw new Error('ape array name=balls size differs from numBalls('+balls.length+')*floatsPerBall('+floatsPerBall+')');

	if(dagball.chk('doNN',true)){
		for(let circ of dagball.circles){
			if(circ.nn){
				//adds to circ.edsOut[any].gradient based on a tiny neuralnet.
				//You can train it for/against current eds state by circ.nn.learn(learnRate) where learnRate is positive to learn and negative to unlearn.
				circ.nn.doPhysics();
			}
		}
	}
};

/*
//potensMem is an Ap.Mem returned by dagball.Game.prototype.potens
dagball.updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient = function(gradientsMem, edGroups, balls){
	for(let edGroup of edGroups){
		let apeArrayName = edGroup.apeArrayName;
		if(!apeArrayName) throw new Error('no edGroup.apeArrayName');
		let floats = gradientsMem.getFloats(apeArrayName); //a Float32Array
		if(floats.length != edGroup.eds.length) throw new Error('ape array name='+apeArrayName+' size differs from edGroup size');
		for(let i=0; i<floats.length; i++){
			edGroup.eds[i].gradient = floats[i]; //doPhysics will read ed.gradient to update ed.vel and ed.pos. TODO should dt be in the ed too or use the dt in doPhysics?
		}
	}
	if(!gradientsMem.hasArrayName('balls')) throw 'No balls array in gradientsMem. It should have y x, and depending on dagball.isDoubleHeightmap also bal/ballBal var. (gradients of those)';
	let floats = gradientsMem.getFloats('balls');
	let floatsPerBall = dagball.isDoubleHeightmap ? 3 : 2;
	if(floats.length/floatsPerBall != balls.length){
		Err('floats.length/floatsPerBall != balls.length');
	}
	//let expectedNumFloats = floats.length*floatsPerBall;
	//if(floats.length != expectedNumFloats) throw new Error('ape array name=balls size differs from numBalls('+balls.length+')*floatsPerBall('+floatsPerBall+')');
	let i = 0;
	for(let ball of balls){
		ball.gradientY = floats[i++];
		ball.gradientX = floats[i++];
		if(floatsPerBall > 2){
			ball.gradientBal = floats[i++];
		}
	}
};
*/

dagball.cacheAnswers = {};
dagball.askOnceYesNo = function(question){
	if(dagball.cacheAnswers[question] === undefined){
		dagball.cacheAnswers[question] = confirm(question);
	}
	return dagball.cacheAnswers[question];
};

dagball.countNaNs = function(floats){
	let count = 0;
	for(let f of floats) if(f !== f) count++;
	return count;
};

dagball.countCallsStarted = {
	gradient: 0,
};
dagball.countCallsEnded = {
	gradient: 0,
};

//merging potens and gradient func into just gradient, cuz need the Ap.Call array names etc.
//
//TODO returns Ap.Mem wrapping the GPU output Float32Array, so you can match it to edGroup.apeArrayName and update ed.gradient
//before doPhysics updates ed.pos and ed.vel. An ed is a dagball.Ed and is in circ.edsOut. An ed is displayed as a line from circ perimeter.
//
//Calls GPU using TinyGlsl.
//OLD... returns this.pos.length+1 potentialEnergies. Index n uses this.pos[n]+this.floatEpsilon if n==id, else just this.pos[n],
//where 0 <= id <= this.pos.length (UPDATE 2023-11-12: the floats are in dagball.Ed's in the circs, not in dagball.game.pos),
//and the last id (this.pos.length) is neutral with no floatEpsilon.
//This is for calculus in gradient func.
//dagball.Game.prototype.potens = function(){
dagball.Game.prototype.gradient = function(){
	dagball.countCallsStarted.gradient++;
	//console.log('dagball.countCallsStarted.gradient='+dagball.countCallsStarted.gradient);
	try{
		//if(dagball.isSplitOuterBallsLoopIntoMultipleGPUThreads){
		//	Todo('isSplitOuterBallsLoopIntoMultipleGPUThreads in dagball.Game.prototype.gradient. Merge multiple floats into 1 by sum and return the same size gradient array regardless of isSplitOuterBallsLoopIntoMultipleGPUThreads.');
		//}
		//let apCall = dagball.view.mergedApCalls[dagball.isDoubleHeightmap ? 'doubleHeightmapPotentialEnergiesForGradient' : 'singleHeightmapPotentialEnergiesForGradient'];
		let apCall = dagball.isDoubleHeightmap ?
			dagball.view.mergedApCalls.doubleHeightmapPotentialEnergiesForGradient :
			dagball.get_singleHeightmapPotentialEnergiesForGradient();
		//if(dagball.askOnceYesNo('Do physics dagball.Game.prototype.potens?') && apCall){
		if(apCall){
			//throw 'FIXME updateApCallBeforeEval shouldnt put floats in the balls ape array cuz theyre not stored in a circs (dagball.Ed)s. Maybe they should be? But that wouldnt fix it cuz it has to happen outside the loop over the balls, which the circs ape codes are inside that loop.';
			dagball.updateApCallBeforeEval(apCall, new Set(['balls','par','loc','big']), dagball.view.circs, dagball.balls, dagball.aftrans);
			dagball.debug_lastApParMem = apCall.par.floats;
			if(!apCall.hasArrayName('balls')){
				throw 'You dont have the balls to call the GPU';
			}
			let floatsPerBall = dagball.isDoubleHeightmap ? 3 : 2; //Has y x either way. ballBal is the third param used only in doubleHeightmaps to linear interpolate between them.
			//TODO number of floats per ball? get that from an ape 'floatsPerBall' and 'numBalls'? Or get it from whether its singleHeightmap vs doubleHeightmap?
			let ballsSizeInFloats = apCall.size('balls');
			let numBalls = ballsSizeInFloats/floatsPerBall;
			//if(numBalls != dagball.view.numBalls){
			if(numBalls != dagball.balls.length){
				throw 'apCall vs dagball.balls.length disagree on number of balls. FIXME upgrade to sparse by using dagball.view.balls which will be a subset of dagball.game.balls.';
			}
			//let retSize = apCall.par.memSize+1; //number of float vars in par mems, plus 1 for the neutral float.
			let retSize = apCall.par.memSize; //number of float vars in par mems. gradient.length==(potens.length-1).
			let potensSize = retSize+1; //numDimensions+1
			//moreGpuThreadsByForkBalls is an optimization to use more GPU threads by forking balls instead of looping over them.
			let moreGpuThreadsByForkBalls = dagball.chk('moreGpuThreadsByForkBalls',false);
			//gradientCall.numGpuThreads *= numBalls;
			apCall.numGpuThreads = moreGpuThreadsByForkBalls ? (potensSize*numBalls) : potensSize;
			
			if(dagball.makeTestCaseOfNextGpuPotensCall){
				//FIXME this hasnt been tested since moreGpuThreadsByForkBalls, and has been months before that, now is 2024-1-23.
				console.log('Doing dagball.makeTestCaseOfNextGpuPotensCall');
				apCall = apCall.makeTestCaseOfNextGpuPotensCall(dagball.makeTestCaseOfNextGpuPotensCall);
				dagball.makeTestCaseOfNextGpuPotensCall = null;
			}
			
			//from GPU [and dagball.bitpic in CPU if it exists]
			//let floatsFromGpu = apCall.eval(); //this is the potens array, 1 bigger than gradient array
			let floatsFromGpu = apCall.evalGpuMain(); //this is the potens array, 1 bigger than gradient array
			let nans = dagball.countNaNs(floatsFromGpu);
			if(nans){
				let s = 'nans='+nans+' in floatsFromGpu='+[...floatsFromGpu]+' apCall.par='+[...apCall.par.floats];
				console.warn('WARNING: '+s);
				//Err(s);
			}
			dagball.debug_lastApCall = apCall;
			if(document.getElementById('moreGpuThreadsByForkBalls').checked){ //An optimization to use more GPU threads by forking the balls loop.
				//Theres numBalls*(numDimensions+1) floats instead of numDimensions+1 floats.
				//For now, just sum them back to numDimensions+1 floats, which is the same calculation either way (except roundoff) but uses more GPU threads.
				if(floatsFromGpu.length%numBalls) Err('floatsFromGpu.length='+floatsFromGpu.length+' is not divisible by numBalls='+numBalls);
				let newFloatsFromGpu = new Float32Array(floatsFromGpu.length/numBalls);
				let j = 0;
				for(let i=0; i<newFloatsFromGpu.length; i++){
					for(let b=0; b<numBalls; b++){
						newFloatsFromGpu[i] += floatsFromGpu[j++];
					}
				}
				dagball.debug_lastPotensForkBalls = floatsFromGpu;
				floatsFromGpu = newFloatsFromGpu;
			}

			/*let floatsFromGpu = new Float32Array(potensSize); //FIXME
			Ap.lazyEval(`
				{doLast (arrayX parMem {3}) (arrayY locMem {4}) {+
					<[arrayY 0%4] [arrayX 0%3]>
					<[arrayY 1%4] [arrayX 1%3]>
					<[arrayY 2%4] {f+ [arrayX 0%3] [arrayX 1%3]}>
					(returnIndex int {id})
					{freturn [arrayY returnIndex]}
				}}
			`).setThreadsFloats(3,1).putFloats('arrayX',[5,7,100]).evalTest().
				testGet(0,5).testGet(1,7).testGet(2,12).log('Test pass: doLast (arrayX parMem {3}) (arrayY locMem {4})');
			*/


			if(dagball.bitpic){
				//let r = 5; //FIXME what should this be? what units is it in?
				/*This is wrong cuz potens/gradient is sparse, so should loop over balls
				and do 3 calls of readSmoothYXR each (2 with +epsilon of dy dx) instead of looping over pixels.
				let height = dagball.canvasHeight();
				let width = dagball.canvasWidth();
				if(height*width != floatsFromGpu.length){
					Err('height('+height+')*width('+width+')=='+(height*width)+' != floatsFromGpu.length ('+floatsFromGpu.length+')');
				}
				let i = 0;
				for(let canvasY=0; canvasY<height; canvasY++){
					let gameY = dagball.aftrans.reverseY(canvasY); //in game coordinates, which are about 80 pixels per 1.0 distance in game.
					for(let canvasX=0; canvasX<width; canvasX++){
						let gameX = dagball.aftrans.reverseX(canvasX);
						//let poten = dagball.bitpic.readYX(gameY,gameX); //reads either bitpic.wallPoten or 0, or maybe later bilinear interpolation?
						//FIXME this poten might be scaled very differently cuz of summing alot more pixels?
						let poten = dagball.bitpic.readSmoothYXR(gameY,gameX,r);
						floatsFromGpu[i++] += poten;
					}
				}
				*/
				let epsilon = dagball.game.floatEpsilon;
				let neutralIndex = floatsFromGpu[floatsFromGpu.length-1];
				let do_readSmoothYX_onDisplayPotens = dagball.chk('do_readSmoothYX_onDisplayPotens',false);
				for(let b=0; b<numBalls; b++){
					let ballYIndex = b*floatsPerBall;
					let ballXIndex = ballYIndex+1;
					//this happens at potens[potens.length-1] and is reused for all dimensions: let potenNeutral = dagball.bitpic.readSmoothYXR(gameY,gameX,r);
					//but lets do it anyways since GPU didnt have access to dagball.bitpic, and subtract it here.
					let gameY = apCall.par.get('balls',ballYIndex); //the input ball y position to GPU
					let gameX = apCall.par.get('balls',ballXIndex); //the input ball x position to GPU
					let potenAtPlusDy = dagball.bitpic.readSmoothYXR(gameY+epsilon,gameX);
					let potenAtPlusDx = dagball.bitpic.readSmoothYXR(gameY,gameX+epsilon);
					let potenNeutral = dagball.bitpic.readSmoothYXR(gameY,gameX);
					if(do_readSmoothYX_onDisplayPotens){
						//FIXME merge them so its min distance to either of 2 kinds of wall, not sum of them in case theres 2 walls at same place.
						potenAtPlusDy += dagball.readSmoothYX_onDisplayPotens(gameY+epsilon,gameX);
						potenAtPlusDx += dagball.readSmoothYX_onDisplayPotens(gameY,gameX+epsilon);
						potenNeutral += dagball.readSmoothYX_onDisplayPotens(gameY,gameX);
					}
					//let changeInPotenDy = potenAtPlusDy-potenNeutral;
					//let changeInPotenDx = potenAtPlusDx-potenNeutral;
					//floatsFromGpu[ballYIndex] += changeInPotenDy;
					//floatsFromGpu[ballXIndex] += changeInPotenDx;
					floatsFromGpu[ballYIndex] += potenAtPlusDy-potenNeutral;
					floatsFromGpu[ballXIndex] += potenAtPlusDx-potenNeutral;
					//floatsFromGpu[neutralIndex] += potenNeutral;
				}
			}


			let potens = floatsFromGpu; //from GPU [and dagball.bitpic in CPU if it exists]
			dagball.debug_lastPotens = potens;
			if(potens.length-1 != retSize){
				throw new Error('potens.length-1='+floatsFromGpu.length+'-1 but should be retSize='+retSize);
			}

			//TODO separate (2023-11-13 thats in progress) ape language from dagball by using ape.call here (dagball.Ape.prototype.call = function(parrMem, optionalBigMem)).

			let gradient = new Float32Array(retSize);
			dagball.debug_lastGradient = gradient;
			let neutralPoten = potens[retSize];
			/*ApGpuTester.js was created cuz of this and the context lost WebGL bug. Fixed 2023-12-5...
			dagballBug_onlyLowestIndexedNBallsRollOnCurvesTheOthersJustDoVelocity: 'A bug likely caused by Ap.js andOr TinyGlsl.js where the dagball
			potens function returns the same float32 for the last n indexs, but does not do that depending on various combos of array sizes that by
			the design of Ap.js and TinyGlsl.js should have no effect but it does. ... this bug was reproduced on 2 computers 2023-12-2, both running
			win10 with nvidia gpu. in chrome firefox and brave in my computer, and at least chrome in the other, and also just verified the
			software works in general in firefox and opera in that other computer. TODO more computers, but get Agt tests made first. Put it on
			a website so can get ppl to help test it by just going to a url. etc. To test this bug in dagball, load a json game state that the
			bug happens, randomize ball positions button, then quickly run this on console:
			dagball.balls.map((b,i)=>[b.gradientY,b.gradientX,dagball.debug_lastPotens[i*2],dagball.debug_lastPotens[i*2+1],dagball.debug_lastPotens[dagball.debug_lastPotens.length-1]]);
			to get something like this, and the last 3 rows shouldnt have 0s: 29		: 
					(5) [1.0000228881835938, 0.03719329833984375, -10.6068115234375, -10.616439819335938, -10.616811752319336]	
						30		: 		(5) [1.0000228881835938, 0.03719329833984375, -10.6068115234375, -10.616439819335938, -10.616811752319336]	
							31		: 		(5) [1.0000228881835938, 0.03719329833984375, -10.6068115234375, -10.616439819335938, -10.616811752319336]	
								32		: 		(5) [0, 0, -10.6068115234375, -10.616439819335938, -10.616811752319336]	
									33		: 		(5) [0, 0, -10.6068115234375, -10.616439819335938, -10.616811752319336]	
										34		: 		(5) [0, 0, -10.6068115234375, -10.616439819335938, -10.616811752319336].
			In that case, its either comparing 2 different physics cycles (one video frame back vs current video frame, as its dagball.balls vs dagball.debug_lastPotens
			which may have been updated at different times, OR (more likely) thats a bug in CPU not seeing the difference -10.6068115234375 vs -10.616811752319336.
			Also I had set dagball.game.floatEpsilon to .01 so I could see the potential energy differences easier and test for if its a roundoff problem.
			But 1 in game coordinates is around 100 or a few hundred pixels (TODO which?) so epsilon shouldnt be that big normally). Maybe its this code
			since it doesnt use dagball.game.pos in all the code anymore (moved it into circ.edsOut and dagball.balls etc):
			for(let i=0; i<this.pos.length; i++){			gradient[i] = (potens[i]-neutralPoten)/this.floatEpsilon;		}
			Added check for that. Dagball097.html:1557 Uncaught Error: gradient.length(33) != this.pos.length(32). Changed to for(let i=0; i<gradient.length; i++),
			and that may have just fixed it 2023-12-5-308pET. Test more TODO. But even if that fixed it, this ApGpuTester.js is still going to be useful for
			testing a bunch of stuff, including stuff thats been fixed in case its broken on other computers or in some cases or cuz of future code changes etc.
			After I made the code change described here (loop up to gradient.length instead of this.pos.length which differs in size by 1) I saw all balls that
			werent moving start moving in dagball1701804687.142.json.',

			Video: https://www.youtube.com/watch?v=J5Li524G6Us
			"DagBall 097 with 479 balls and 983 dimensions (mostly balls) slowed to 20 FPS - fixed stuck ball bug".

			if(gradient.length != this.pos.length){
				Err('gradient.length('+gradient.length+') != this.pos.length('+this.pos.length+')');
			}
			for(let i=0; i<this.pos.length; i++){
			*/
			for(let i=0; i<gradient.length; i++){
				gradient[i] = (potens[i]-neutralPoten)/this.floatEpsilon; //calculus
			}

			/*looks like its in updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient try there
			if(dagball.addEdSliderKnobGradientsToFloatsFromGpu){
				Todo('FIXME how do i know which index is which ed? that was already computed somewhere. find out where. is it updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient?');
			}*/

			let gradientMem = apCall.par.copy(); //ape array names at ranges of the shared float array
			if(gradientMem.floats.length != gradient.length) throw new Error('Was about to replace the floats in the copy of apCall.par but it has a different number of floats than 1 less than (cuz not including neutralPoten) GPU returned (1 float from each GPU thread cuz is potens func for gradient)');
			dagball.debug_lastGradientMem = gradientMem; //also has array names and sizes, so can display it that way using "gradient rectangles" checkbox at top of screen
			gradientMem.floats = gradient;
			gradientMem.apeType = 'gradient'; //not par loc or big. Even though its computed from loc in potens array.
			if(dagball.addFakeNumbersToGradientForTestingSoYouCanSeeItAccelerate){
				console.log("WARNING: doing dagball.addFakeNumbersToGradientForTestingSoYouCanSeeItAccelerate");
				for(let i=0; i<gradient.length; i++) gradientMem.floats[i] += 2.1+Math.random()*.1;
			}
			this.lastGradientFloats = gradientMem.floats;
			return gradientMem; //an Ap.Mem. Example: gradientMem.getFloats('balls') returns that range of floats from the shared gradient float array.
			//Each edGroup in dagball.view.circs.eds[any].edGroup has an edGroup.apeArrayName you can use similarly. gradientMem.getFloats(edGroup.apeArrayName)
			//TODO caller dagball.updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient(potensMem, ); which is the other side of updateApCallBeforeEval.


			/*FIXME let retSize = apCall.par.memSize+1; //number of float vars in par mems, plus 1 for the neutral float.
			apCall.numGpuThreads = retSize;
			let floatsFromGpu = apCall.eval();
			if(floatsFromGpu.length != retSize){
				throw new Error('floatsFromGpu.length='+floatsFromGpu.length+' but should be retSize='+retSize);
			}
			return floatsFromGpu;
			*/

			/*
			apCall.numGpuThreads = height*width;
			//defaults to 1: apCall.floatsPerGpuThread = 1; //must be 1 or 4. its 1 or 4 params of freturn.
			
			//apCall.eval() should take about 100 milliseconds (compile time) the first time for a unique code string
			//and about 3 milliseconds every time after that until
			//TinyGlsl cache is cleared which happens every minute or so randomly as of 2023-11-11 and then its the compile time once again.
			let floatsFromGpu = apCall.eval();
			if(floatsFromGpu.length != height*width){
				throw new Error('floatsFromGpu.length='+floatsFromGpu.length+' but should be height*width='+(height*width));
			}
			//dont update Ed.pos for display. Only update it by gradient which is a different apCall.eval() GPU call.
			return floatsFromGpu;
			*/
		}else{ //elseSimpleTestCode
			//TODO separate ape language from dagball by using ape.call here (dagball.Ape.prototype.call = function(parrMem, optionalBigMem)).

			//dagball.logOnce('Returning all 0s from dagball.Game.prototype.potens. TODO use Ap.lazyEval(code) instead.');
			//throw 'Since potens func has to return Ap.Mem instead of just Float32Array (will wrap that Float32Array), dont want to complicate in the case of theres no apCall (which has a .par Mem, a .loc Mem, and a .big Mem). Was going to return all 0s here.';
			//return new Float32Array(this.pos.length+1); //all 0s
			Err('TODO use Ap.Ape for potens. What info do I need from dagball.view.circs? Stop using dagball.view.mergedGpuCode and do it all in Ap.Ape instead.');
			
			/*
			let potensSize = this.pos.length+1;
			let beforeCode = this.tinyGlslBeforeCode('potentialEnergiesForGradient');
			let code = this.tinyGlslCode('potentialEnergiesForGradient');
			console.log('dagball.Game.prototype.potens beforeCode='+beforeCode);
			console.log('dagball.Game.prototype.potens code='+code);
			return TinyGlsl.simple(beforeCode, code, this.pos, null, 1, potensSize);
			*/
		}
	}finally{
		dagball.countCallsEnded.gradient++;
	}
};

dagball.Game.prototype.diffeqMap = function(){
	if(dagball.isDoubleHeightmap) Todo('diffeqMap in doubleHeightmap');
	//let apCall = dagball.view.mergedApCalls.singleHeightmapCpuDiffeq;
	//use the VArray one if exists. It will only exist if created near codeMaker (a js function that generates ape/Ap.js code).
	//In theory defaulting to singleHeightmapCpuDiffeq_transformFloatValsToVArray if exists should solve the bug:
	//"2024-9-29 V array broken when used with diffeq - it appears the bug is that diffeq does not use the expanded V array cuz the V array starts as size 1 in ape and is later expanded."
	//where diffEq (second param of gpucpu) that runs on CPU,
	//had smaller par and loc arrays than the main (first param of gpucpu) ape code that runs on CPU or GPU, but they should be the same size.
	let apCall = dagball.view.mergedApCalls.singleHeightmapCpuDiffeq_transformFloatValsToVArray || dagball.view.mergedApCalls.singleHeightmapCpuDiffeq;
	if(!apCall) Err('No dagball.view.mergedApCalls.singleHeightmapCpuDiffeq or maybe it was the other one singleHeightmapCpuDiffeq_transformFloatValsToVArray?');
	dagball.updateApCallBeforeEval(apCall, new Set(['balls','par','loc','big']), dagball.view.circs, dagball.balls, dagball.aftrans);
	dagball.debug_lastApVelMem = apCall.vel.floats; //game state -> ApCall. similar to par is position, vel is velocity.

	//the 5-6 kinds of eval handle lang. apCall doesnt specify a lang and can do multiple langs in the same apCall.
	//if(apCall.compileToLang != 'js'){
	//	Err('apCall.compileToLang='+apCall.compileToLang+' but must be "js" for diffeqMap which does the whole contents of apeType="gpucpu" (somewhere in call.ape)');
	//}

	//let diffeqMap = apCall.eval();
	
	//its evalCpuDiffeq, not evalCpuDiffeqParloc, cuz of gradientCopyIndexUglyHackForDisplay
	let diffeqMap = apCall.evalCpuDiffeq(); //FIXME evalCpuDiffeq vs evalCpuDiffeqParloc?
	//let diffeqMap = apCall.evalCpuDiffeqParloc(); //FIXME evalCpuDiffeq vs evalCpuDiffeqParloc?


	if(!diffeqMap.dpos) Err('No diffeqMap.dpos diffeqMap='+JSON.stringify(diffeqMap));
	if(!diffeqMap.dvel) Err('No diffeqMap.dvel diffeqMap='+JSON.stringify(diffeqMap));
	if(diffeqMap.dpos.length != apCall.vel.floats.length) Err('diffeqMap.dpos.length ('+diffeqMap.dpos.length+') != apCall.vel.floats.length ('+apCall.vel.floats.length+') diffeqMap='+JSON.stringify(diffeqMap));
	if(diffeqMap.dvel.length != apCall.vel.floats.length) Err('diffeqMap.dvel.length ('+diffeqMap.dvel.length+') != apCall.vel.floats.length ('+apCall.vel.floats.length+') diffeqMap='+JSON.stringify(diffeqMap));
	dagball.debug_lastApDposMem = diffeqMap.dpos; //ApCall -> game state. Caller should add dt*these to par aka position (ball.y ball.x ed.pos etc).
	dagball.debug_lastApDvelMem = diffeqMap.dvel; //ApCall -> game state. Caller should add dt*these to vel aka velocity (ball.yv ball.xv ed.vel etc).
	return diffeqMap;
};

//diffeqMap is the third func, similar to gradient func and display func. Those last 2 run in GPU as ape is compiled to glsl.
//diffeqMap runs in CPU as ape is compiled to js.
dagball.Game.prototype.diffeqMap_OLD = function(){

	//from gradient func:
	//dagball.updateApCallBeforeEval(apCall, new Set(['balls','par','loc','big']), dagball.view.circs, dagball.balls);
	//dagball.debug_lastApParMem = apCall.par.floats;

	if(dagball.isDoubleHeightmap) Todo('diffeqMap in doubleHeightmap');
	let apCall = dagball.view.mergedApCalls.singleHeightmapCpuDiffeq;
	if(!apCall) Err('No dagball.view.mergedApCalls.singleHeightmapCpuDiffeq');
	dagball.updateApCallBeforeEval(apCall, new Set(['balls','par','loc','big']), dagball.view.circs, dagball.balls, dagball.aftrans);
	dagball.debug_lastApVelMem = apCall.vel.floats; //game state -> ApCall. similar to par is position, vel is velocity.
	if(apCall.compileToLang != 'js'){
		Err('apCall.compileToLang='+apCall.compileToLang+' but must be "js" for diffeqMap which does the whole contents of apeType="gpucpu" (somewhere in call.ape)');
	}
	let diffeqMap = apCall.eval();
	if(!diffeqMap.dpos) Err('No diffeqMap.dpos diffeqMap='+JSON.stringify(diffeqMap));
	if(!diffeqMap.dvel) Err('No diffeqMap.dvel diffeqMap='+JSON.stringify(diffeqMap));
	if(diffeqMap.dpos.length != apCall.vel.floats.length) Err('diffeqMap.dpos.length ('+diffeqMap.dpos.length+') != apCall.vel.floats.length ('+apCall.vel.floats.length+') diffeqMap='+JSON.stringify(diffeqMap));
	if(diffeqMap.dvel.length != apCall.vel.floats.length) Err('diffeqMap.dvel.length ('+diffeqMap.dvel.length+') != apCall.vel.floats.length ('+apCall.vel.floats.length+') diffeqMap='+JSON.stringify(diffeqMap));
	dagball.debug_lastApDposMem = diffeqMap.dpos; //ApCall -> game state. Caller should add dt*these to par aka position (ball.y ball.x ed.pos etc).
	dagball.debug_lastApDvelMem = diffeqMap.dvel; //ApCall -> game state. Caller should add dt*these to vel aka velocity (ball.yv ball.xv ed.vel etc).
	return diffeqMap;

	/*
	TODO use updateApCallBeforeEval
	Todo('should I call dagball.view.mergedApCalls.singleHeightmapCpuDiffeq.eval() after filling dagball.view.mergedApCalls.singleHeightmapCpuDiffeq.par.floats and .vel.floats etc?');
	let code = dagball.view.mergedApCalls.singleHeightmapCpuDiffeq.toCode('js')+'\n//# sourceURL=singleHeightmapCpuDiffeq.js';
	let diffeqFunc = TinyGlsl.cachedJsEval(code);
	Todo('call diffeqFunc on the 6 arrays');
	*/
};


/*
//returns a Float32Array(this.pos.length). Calls tinyGlsl (GPU) with this.pos.length+1 threads.
//The last thread is neutral, that is subtracted from each dimension with position + this.floatEpsilon,
//before dividing by this.floatEpsilon (calculus basics). Each GPU thread computes potentialEnergy
//at a combo of positions of all the balls each on the n dimensional heightmap,
//and the heightmap movies by epsilon too, each of those dimensions +0 or +this.floatEpsilon.
dagball.Game.prototype.gradient = function(){
	
	//TODO separate ape language from dagball by using ape.call here (dagball.Ape.prototype.call = function(parrMem, optionalBigMem)).

	//if(this.pos.length > 1010){
	//	No, this is for output, which can be bigger, maybe up to 16k y and 16k x? Its the inputs
	//	throw this.pos.length+'==this.pos.length dimensions wont fit in uniform/constant memory (the fastest) in tinyGlsl if its bigger than around 1024 (not sure where exact limit is, and that may vary across computers, TODO test that)';
	//}
	let potensSize = this.pos.length+1;
	//let potens = TinyGlsl.simple(this.tinyGlslCode('potentialEnergiesForGradient'), this.pos, 1, potensSize);
	let potens = this.potens(); //GPU optimized
	let gradient = new Float32Array(this.pos.length);
	let neutralPoten = potens[potensSize-1];
	for(let i=0; i<this.pos.length; i++){
		gradient[i] = (potens[i]-neutralPoten)/this.floatEpsilon;
	}
	return gradient;
};*/

/*
//floats is a Float32Array(height*width). y and x are in units of height and width, not game coordinates.
//floats param is normally from dagball.Game.prototype.potentialEnergiesForDisplay = function(height, width).
dagball.bilinearInterpolate = function(floats, height, width, y, x){
	//TODO verify this generated code. also range check it?
	let y0 = Math.floor(y);
	let x0 = Math.floor(x);
	let y1 = y0+1;
	let x1 = x0+1;
	let y0x0 = floats[y0*width+x0];
	let y0x1 = floats[y0*width+x1];
	let y1x0 = floats[y1*width+x0];
	let y1x1 = floats[y1*width+x1];
	let y0x0y1x0 = y0x0+(y1x0-y0x0)*(y-y0);
	let y0x1y1x1 = y0x1+(y1x1-y0x1)*(y-y0);
	let y0x0y0x1y1x0y1x1 = y0x0y1x0+(y0x1y1x1-y0x0y1x0)*(x-x0);
	return y0x0y0x1y1x0y1x1;
};*/

//These are a sum of relative chances (divided by total chance) of dagball.wavefunctionObserveCollisions returning each pixel.
dagball.last_wavefunctionObserveCollisions_floats = Float32Array.of(0);

//returns a list of ints, size numWavefunctionObserves.
//Chance of a pixel index being chosen is proportional to Math.max(0,potentialEnergyPerPixel[i]-1).
//Not chance exactly cuz this is deterministic based on percentile of cumulative sum of that, except for roundoff.
dagball.wavefunctionObserveCollisions = function(potentialEnergyPerPixel, height, width, numWavefunctionObserves){
	let ret = [];
	if(numWavefunctionObserves == 0) return ret;
	let sum = 0;
	if(dagball.last_wavefunctionObserveCollisions_floats.length != height*width){
		dagball.last_wavefunctionObserveCollisions_floats = new Float32Array(height*width);
	}

	const relChances = dagball.last_wavefunctionObserveCollisions_floats;
	//for(let i=0; i<potentialEnergyPerPixel.length; i++){
	//const offsetUp1Pixel = -width;
	//const offsetLeft1Pixel = -1;
	const offsetUp1Pixel = -width*2; //FIXME
	const offsetLeft1Pixel = -2; //FIXME
	for(let i=-(offsetUp1Pixel+offsetLeft1Pixel); i<potentialEnergyPerPixel.length; i++){
		let aboveOne = Math.max(0,potentialEnergyPerPixel[i]-1);
		/*let relChance = Math.max(0,potentialEnergyPerPixel[i]-1);
		if(relChance > 0){
			let pixelGradientY = potentialEnergyPerPixel[i]-potentialEnergyPerPixel[i+offsetUp1Pixel];
			let pixelGradientX = potentialEnergyPerPixel[i]-potentialEnergyPerPixel[i+offsetLeft1Pixel];
			relChance *= Math.hypot(pixelGradientY,pixelGradientX);;
		}*/
		/*let pixelGradientY = potentialEnergyPerPixel[i]-potentialEnergyPerPixel[i+offsetUp1Pixel];
		let pixelGradientX = potentialEnergyPerPixel[i]-potentialEnergyPerPixel[i+offsetLeft1Pixel];
		//let relChance = Math.hypot(pixelGradientY,pixelGradientX);
		let relChance = pixelGradientY*pixelGradientY + pixelGradientX*pixelGradientX;
		*/
		let relChance = aboveOne;
		relChance *= 20;
		relChances[i] = relChance;
		sum += relChance;
	}
	let sizeEach = sum/numWavefunctionObserves;

	
	console.log('wavefunctionObserveCollisions sum='+sum);
	//let gradientMul = document.getElementById('gradientMul');
	//gradientMul.step = 1e-9
	//gradientMul.valueAsNumber = sum*3.001; //FIXME, experiment 2023-12-19 trying to make wavefunction collisions less jumpy
	dagball.experimentalGradientMul2 = document.getElementById('experimentalGradientMul2').checked ? (.001+sum*.0001) : 1;


	//let sum2 = 0;
	let sum2 = sizeEach/2; //FIXME?
	/*for(let i=0; i<potentialEnergyPerPixel.length; i++){
		sum2 += Math.max(0,potentialEnergyPerPixel[i]-1);
		if(sum2 >= sizeEach){
			sum2 -= sizeEach;
			ret.push(i);
		}
	}*/
	for(let i=0; i<relChances.length; i++){
		sum2 += relChances[i];
		//if(sum2 >= sizeEach){
		if(sum2 >= sizeEach){
			sum2 -= sizeEach;
			ret.push(i);
			if(ret.length == numWavefunctionObserves){
				break; //nned this if sizeEach==0
			}
		}
	}
	if(ret.length != numWavefunctionObserves){
		Err('ret.length='+ret.length+' != numWavefunctionObserves='+numWavefunctionObserves); //roundoff might make it different by 1 sometimes?
	}
	return ret;
};

//code may be the same between gpu and cpu but differ only by circ.preferCpu.
dagball.Circ.prototype.hasCpuCodeAndShouldUseIt = function(){
	return this.preferCpu && dagball.view.hasGpuCodeAndShouldUseIt(this,true); //true allow cpu
};

dagball.cpucircs = ()=>dagball.circles.filter(c=>c.hasCpuCodeAndShouldUseIt());
//returns list of circs that should be computed on cpu instead of gpu, excluding those that dont have "ape:" code such as start with "txt:" or "ignore:".
//dagball.cpucircs = ()=>dagball.circles.filter(c=>(c.hasGpuCodeAndShouldUseIt && !c.preferCpu));

dagball.anyCpuCircHasCpugpu = ()=>{
	for(let circ of dagball.circles) if(circ.preferCpu){
		if(circ.cpuCall){
			if(circ.cpuCall.ape.containsGpucpu){ //the more efficient way to measure it
				return true;
			}
		}else{
			if(circ.hasCpuCodeAndShouldUseIt() && circ.text.includes('(cpugpu ')){ //the less efficient way, in case it hasnt been compiled
				//FIXME what if it contains '( cpugpu	' (with space(s) andOr tabs)? Normally I write it as '(cpugpu '.
				return true;
			}
		}
	}
	return false;
};

//updates this.pos (high dimensional position) and this.vel (high dimensional velocity). dt is change in time, or might arbitrarily choose .01 etc (FIXME).
dagball.Game.prototype.doPhysics = function(dt){

	//dagball.sortBallsByCurveGrabFirst(); //in case any ball.curveGrab has been deleted or created.

	let doWavefunctionCollisions = dagball.last_potentialEnergiesForDisplay &&
		!isNaN(dagball.last_potentialEnergiesForDisplay[0]) && //seems to happen during boot a short time. FIXME?
		document.getElementById('doStatisticalCollisionsBetweenWavefunctions').checked;

	//all balls except the players ball which is first (in single player). FIXME this should be adjustable,
	//and theres other optimizations to do since these balls can be thrown away after the calculation,
	//dont need to compute their gradients, just the gradients of wavefunctions they sample collisions between.
	//The sampling of their collisions is max(0,potentialEnergy-1) so they can add up to 1 potentialEnergy without triggering this.
	//Take cumulative sum of max(0,potentialEnergy-1) at every pixel as 1d array size height*width,
	//and go to numWavefunctionObserves percentile-evenly-spread points along that, which are the statistical ball observes.
	//Wherever 2 dagball.Circs write the same pixel (or 1 of them writing too much potentialEnergy by itself)
	//that raises chance of a doWavefunctionCollisions ball being put there.
	let numWavefunctionObserves = doWavefunctionCollisions ? (dagball.balls.length-1) : 0;
	let whichPixelsToWavefunctionObserveCollisions = [];
	if(doWavefunctionCollisions){
		let h = dagball.canvasHeight();
		let w = dagball.canvasWidth();
		if(dagball.last_potentialEnergiesForDisplay.length != h*w) Err('last_potentialEnergiesForDisplay.length != h*w');
		whichPixelsToWavefunctionObserveCollisions = dagball.wavefunctionObserveCollisions(
			dagball.last_potentialEnergiesForDisplay, h, w, numWavefunctionObserves);
		let startBallIndex = dagball.balls.length-numWavefunctionObserves;
		for(let b=startBallIndex; b<dagball.balls.length; b++){
			let ball = dagball.balls[b]; //FIXME dagball.view.balls[b]?
			let whichPixelIndex = whichPixelsToWavefunctionObserveCollisions[b-startBallIndex];
			let whichPixelX = whichPixelIndex%w;
			let whichPixelY = (whichPixelIndex-whichPixelX)/w;
			ball.yv = ball.xv = 0;
			ball.y = dagball.aftrans.reverseY(whichPixelY); //game coordinates, such as 100 pixels per distance 1 in the game.
			ball.x = dagball.aftrans.reverseX(whichPixelX);
		}
	}

	let cpucircs = dagball.cpucircs();
	for(let cpucirc of cpucircs){
		if(cpucirc.cpuCall){
			dagball.updateCpuApCallBeforeManyEvals(cpucirc.cpuCall, cpucirc);
		}else{
			console.warn('doPhysics: cpucirc.cpuCall not found, cpucirc='+cpucirc);
		}
	}

	//FIXME get gradient of the 'balls' ape array. apCall.par.ptr('balls') -> int index in gradient array.
	//have the .gradient() code put that in ball.gradientY ball.gradientX ball.gradientBal, and in ed.gradient
	//let gradient = this.gradient();
	let gradientMem = this.gradient();
	let gradient = gradientMem.floats;

	let doDiffeq = dagball.view && dagball.view.mergedApCalls.singleHeightmapCpuDiffeq &&
		//TODO (dagball.chk('rockPaperScissors') || dagball.view.mergedApCalls.singleHeightmapCpuDiffeq.ape.containsGpucpu || dagball.anyCpuCircHasCpugpu()) &&
		dagball.view.mergedApCalls.singleHeightmapCpuDiffeq.ape.containsGpucpu &&
		document.getElementById('doDiffeq').checked;
	//console.log('doPhysics doDiffeq='+doDiffeq);
	let diffeqMapOrNull = doDiffeq ? this.diffeqMap() : null;
	dagball.debug_lastDiffeqMap = diffeqMapOrNull;

	//let edGroups = dagball.edGroups(); //FIXME only the edGroups from dagball.view.circs. This is from all the circs.
	let edGroupsForGpuAndCpu = dagball.view.edGroups(); //gpucircs and cpucircs
	let edGroupsForGpu = edGroupsForGpuAndCpu.filter(eg=>!eg.fromCirc.preferCpu);
	//edGroups = edGroups.filter(eg=>!eg.fromCirc.preferCpu); //keep only the GPU edGroups cuz CPU circs are computed elsewhere. TODO also check hasGpuCodeAndShouldUseIt?
	let balls = dagball.balls.slice(); //TODO sparse. FIXME when later switching to sparse, this is likely to have the wrong number of balls. TODO dagball.view.balls.
	//set ball.gradientY ball.gradientX ball.gradientBal, and in ed.gradient
	//dagball.updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient(gradientMem, edGroupsForGpu, balls, diffeqMapOrNull);
	dagball.updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient(gradientMem, edGroupsForGpuAndCpu, balls, diffeqMapOrNull);

	for(let cpucirc of cpucircs){
		cpucirc.cpuPhysics(); //updates circ.edsOut[any].gradient and ball.gradientY and ball.gradientX of whatever balls intersect the circ
		//cpucirc.edsOut[cpucirc.edsOut.length-1].gradient += Math.sin(dagball.time())*3; //FIXME dont do this. just checking if gradient is changing velocity in cpucircs
		//cpucirc.edsOut[cpucirc.edsOut.length-1].gradient *= 100; //FIXME remove this
	}

	let edsInThoseEdGroups = new Set();
	for(let edGroup of edGroupsForGpuAndCpu) for(let ed of edGroup.eds) edsInThoseEdGroups.add(ed);
	//if(dagball.askOnceYesNo('updateEdsByEdJoints? cuz this is breaking the physics but it still syncs in position, just not gradient which is always 0, FIXME')){
	if(dagball.isUpdateEdsByEdJoints){
		dagball.updateEdsByEdJoints(edsInThoseEdGroups);
	}


	let velocityDecayPerSecond = dagball.num('baseVelDecay',dagball.defaultBaseVelDecay);
	//let velocityDecayPerSecond = 2.3; //FIXME make this either one of oGlo vars or Game.velocityDecayPerSecond
	//let velocityDecayPerSecond = .1; //FIXME make this either one of oGlo vars or Game.velocityDecayPerSecond
	//let velocityDecayPerSecond = .3; //FIXME make this either one of oGlo vars or Game.velocityDecayPerSecond
	//let velocityDecayPerSecond = .6; //FIXME make this either one of oGlo vars or Game.velocityDecayPerSecond
	//let velocityDecayPerSecond = 1.2; //FIXME make this either one of oGlo vars or Game.velocityDecayPerSecond
	//let velocityDecayPerSecond = 0; //FIXME should be more than 0. FIXME make this either one of oGlo vars or Game.velocityDecayPerSecond
	let velMul = 1-dt*velocityDecayPerSecond; //TODO use ball.vd ed.vd or is it called velDecay or what?
	//let gradientMul = 1; //this is the correct way, but for experimenting im increasing it
	//let gradientMul = 3;
	//let gradientMul = 2; //FIXME why isnt this 1?
	//let gradientMul = document.getElementById('gradientMul').valueAsNumber; //FIXME why isnt this 1?
	let gradientMul = dagball.num('gradientMul')*dagball.experimentalGradientMul2; //FIXME why isnt this 1?
	//let gradientMul = .3;
	//let gradientMul = 5;
	//let gradientMul = 15; //this is the correct way, but for experimenting im increasing it
	//let gradientMul = 1000000000; //FIXME should be 1

	//FIXME remove velMul var above and use Math.exp(-dt*ed.dfriction)
	//and ball.dfrictionY ball.dfrictionX (and if doubleHeightmap also ball.dfrictionBal).

	let eds = []; //TODO copy this from "let edsInThoseEdGroups = new Set();" or do i need to do this again here to get the order? TODO at least merge the loops.
	for(let edGroup of edGroupsForGpuAndCpu) for(let ed of edGroup.eds) eds.push(ed);

	for(let ed of eds){ //include eds in gpucircs and cpucircs, cuz their positions and velocities all need updating
		ed.pos = dagball.normPositionOrVelocityFloat(ed.pos);
		ed.vel = dagball.normPositionOrVelocityFloat(ed.vel);
		if(ed.gradient === undefined){
			throw 'No ed.gradient. 2023-11-13+ TODO gradient() should fill the fields ball.gradientY ball.gradientX ball.gradientBal, and in ed.gradient';
		}
		ed.vel -= dt*ed.gradient*gradientMul; //FIXME gradientMul should always be 1?
		if(doDiffeq){
			if(ed.dfriction !== undefined){
				//velMul = Math.exp(-dt*ed.dfriction); //FIXME dont use velocityDecayPerSecond, just dfriction?
				velMul = Math.exp(-dt*(velocityDecayPerSecond+ed.dfriction)); //FIXME dont use velocityDecayPerSecond, just dfriction?
			}else{
				Err('No dfriction in ed='+ed);
			}
		}
		ed.vel *= velMul;
		//ed.vel *= velMul*1000;
		ed.pos += dt*ed.vel;
		//FIXME does ed have a velDecay/velocityDecay/vd var? FIXME still using velocityDecayPerSecond

		if(doDiffeq){
			if(ed.dpos === undefined) throw new Error('No ed.dpos but doDiffeq');
			if(isNaN(ed.dpos)) throw new Error('NaN ed.dpos');
			if(ed.dvel === undefined) throw new Error('No ed.dvel but doDiffeq');
			if(isNaN(ed.dvel)) throw new Error('NaN ed.dvel');
			//differential equation in second param of apeType=='gpucpu' (the cpu/js part) sets dpos and dvel in some circs
			//so can make powered game content like pinball bumpers and those springy things that throw sonic the hedgehog when
			//he jumps on them to much higher than he jumped from, for example. Gradient cant define perpetual motion machines, but diffeq can.
			//The up to 1000 dimensional dagball physics may be useful for science and is likely physically accurate in some ways.
			//It cant define perpetual motion machines. The diffeq code, seen in the second param of gpucpu (that cpu/js runs),
			//can for more flexible gameplay but within limits.
			//ed.dpos and ed.dvel and ball.dposY and ball.dposX and ball.dvelY and ball.dvelX are set in updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient.
			ed.pos += dt*ed.dpos; //changing position directly without going through velocity is similar to chuasCircuit having 3 floats of state as a differential equation.
			ed.vel += dt*ed.dvel;
		}
	}
	
	dagball.gobsNextState(dt, dagball.gobs, dagball.fobs);
	
	//for(let ball of dagball.balls){ //FIXME make this sparse by using dagball.view.balls instead which will later be a subset of dagball.balls?
	for(let ball of balls){ //FIXME make this sparse by using dagball.view.balls instead which will later be a subset of dagball.balls?
		if(ball.lockPos){
			ball.yv = ball.xv = 0;
			//FIXME also set dfrictionX etc to 0? might overflow eventually if dont, cuz code will keep adding to it, thinking it started as 0 at start of each physics cycle.
		}else{
			ball.y = dagball.normPositionOrVelocityFloat(ball.y); //ball y position in game coordinates
			ball.x = dagball.normPositionOrVelocityFloat(ball.x);
			ball.yv = dagball.normPositionOrVelocityFloat(ball.yv); //ball y velocity in game coordinates
			ball.xv = dagball.normPositionOrVelocityFloat(ball.xv);
			//TODO ball.vd is velocityDecay, but FIXME still using velocityDecayPerSecond
			ball.yv -= dt*ball.gradientY*gradientMul; //FIXME gradientMul should always be 1?
			if(doDiffeq){
				if(ball.dfrictionY !== undefined){
					//velMul = Math.exp(-dt*ball.dfrictionY);
					velMul = Math.exp(-dt*(velocityDecayPerSecond+ball.dfrictionY)); //FIXME dont use velocityDecayPerSecond, just dfriction?
				}else Err('No dfrictionY in ball='+ball);
			}
			ball.yv *= velMul;
			ball.y += dt*ball.yv;
			ball.xv -= dt*ball.gradientX*gradientMul; //FIXME gradientMul should always be 1?
			if(doDiffeq){
				if(ball.dfrictionX !== undefined){
					//velMul = Math.exp(-dt*ball.dfrictionX);
					velMul = Math.exp(-dt*(velocityDecayPerSecond+ball.dfrictionX)); //FIXME dont use velocityDecayPerSecond, just dfriction?
				}else Err('No dfrictionX in ball='+ball);
			}
			ball.xv *= velMul;
			ball.x += dt*ball.xv;
			if(ball.bal || ball.ballBal){
				throw 'TODO... //FIXME ball.ballBal or will it be called ball.bal? ball.gradientBal. If dagball.isDoubleHeightmap then not using ballBal or pixBal but make gradientBal be 0.';
			}
		}
	}
	
	if(dagball.chk('rockPaperScissors')){
		for(let ball of balls){
			if(ball.dvelY===undefined){
				//likely is not there cuz doDiffeq didnt create it, maybe Ap.js opcode gpucpu wasnt used?
				//Not sure why that would matter but it seems the most likely thing.
				ball.dvelY = ball.dvelX = 0;
			}
		}
		dagball.rpsAllBallPairs(dt); //modifies ball.dvelY and ball.dvelX
	}
		
	for(let ball of balls){ //FIXME make this sparse by using dagball.view.balls instead which will later be a subset of dagball.balls?
		if(doDiffeq){ //the cpu part of the gpucpu apeType in Ap.js (cpu does first and second param, gpu only does first param).

			//This code "(+= (dvelPtr abc 0%55) (* 4.4 (velPtr abc 0%55)))" adds dt*4.4*itsVelocity*abc[0] to the velocity of abc[0]
			//so makes it speed up whichever direction the star starts turning, usually turning cuz the balls are laying on it that way.
			//Load the gpucirc007_starCanTurnEitherWayUsingVelToComputeDvel_dagball1702411552.16.json saved game to try it, and check the doDiffeq checkbox.

			//ed.dpos and ed.dvel and ball.dposY and ball.dposX and ball.dvelY and ball.dvelX
			//are set in updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient.	
			if(ball.dposY === undefined) Err('No ball.dposY but doDiffeq');
			if(ball.dposX === undefined) Err('No ball.dposX but doDiffeq');
			if(isNaN(ball.dposY)) Err('NaN ed.dposY');
			if(isNaN(ball.dposX)) Err('NaN ed.dposX');
			if(ball.dvelY === undefined) Err('No ball.dvelY but doDiffeq');
			if(ball.dvelX === undefined) Err('No ball.dvelX but doDiffeq');
			if(isNaN(ball.dvelY)) Err('NaN ed.dvelY');
			if(isNaN(ball.dvelX)) Err('NaN ed.dvelX');
			ball.y += dt*ball.dposY; //changing position directly without going through velocity is similar to chuasCircuit having 3 floats of state as a differential equation.
			ball.x += dt*ball.dposX; //changing position directly
			ball.yv += dt*ball.dvelY;
			ball.xv += dt*ball.dvelX;
			ball.dposY = ball.dposX = ball.dvelY = ball.dvelX;
		}
		if(dagball.gravityToward00){ //gravity toward the game coordinate (0,0)
			let dist = Math.hypot(ball.y,ball.x);
			let gravity = dagball.gravityToward00;
			ball.yv -= dt*gravity*ball.y/dist;
			ball.xv -= dt*gravity*ball.x/dist;
		}
	}

	/*
	for(let i=0; i<this.pos.length; i++){
		this.vel[i] -= dt*gradient[i]*gradientMul;
		this.vel[i] *= velMul;
		this.pos[i] += dt*this.vel[i];
		//TODO energy norm. kinetic + potential should be constant. adjust velocity to cause that.
		//FIXME should potentialEnergy be negative?
		//FIXME what if kineticEnergy is so big, cuz of stepping discretely instead of continuously,
		//that potentialEnergy of 0 cant make kinetic+potential be constant?
	}
	dagball.normPositionsOrVelocities(this.pos);
	dagball.normPositionsOrVelocities(this.vel);
	*/
};

dagball.Game.prototype.paintOntoByteRect = function(byteRect){
	if(!byteRect){
		console.log('No byteRect in paintOntoByterect. Canvas not created yet in first 0.1 second of page load?');
		return;
	}
	let potens = this.potentialEnergiesForDisplay(byteRect.height, byteRect.width);
	//console.log('potens[0] = '+potens[0]);
	//console.log('potens[5] = '+potens[5]);
	//console.log('potens[25678] = '+potens[25678]);
	//let brightness = 0; //default is 0. contrast and brightness like on a screen
	//let contrast = 1.5; //default is 1.
	let brightness = .5; //cuz removed sigmoid, trying to make it faster, cuz sigmoid was costing 3.64ms/videoFrame 2024-1-31
	let contrast = .75; //cuz removed sigmoid, trying to make it faster, cuz sigmoid was costing 3.64ms/videoFrame 2024-1-31
	let displayFloats = potens;
	if(dagball.last_wavefunctionObserveCollisions_floats && document.getElementById('displayWavefunctionCollisionsAsBackground').checked){
		displayFloats = dagball.last_wavefunctionObserveCollisions_floats;
	}
	let age = dagball.age(); //seconds since this page loaded, with fraction part.
	age *= .01;
	let redByte;
	let greenByte;
	let blueByte;
	let doColorBackground = dagball.chk('doColorBackground',false);
	for(let y=0; y<byteRect.height; y++){
		for(let x=0; x<byteRect.width; x++){
			let i = y*byteRect.width+x;
			//potens[i] = Math.random();
			//let brightFraction = Math.max(0, Math.min(dagball.sigmoid(brightness+contrast*displayFloats[i]), .999999));
			let brightFraction = Math.max(0, Math.min(brightness+contrast*displayFloats[i], 1));
			//let byte = Math.max(0, Math.min(brightFraction*256, 255));
			
			if(doColorBackground){
				//a simple graphics effect from SimpleCanvas.html (see jsutils in benrayfield github)
				/*let backgroundRed = (x+age*35)&255;
				let backgroundGreen = (x+y*age)&255;
				let backgroundBlue = (333*x/y)&255;
				*/
				//age = 1;
				let backgroundRed = (128+127*Math.sin(.1*x+age*35))&255;
				let backgroundGreen = (128+127*Math.sin(.1*x+y*age))&255;
				let backgroundBlue = (128+127*Math.sin(3.3*x/y))&255;
				let bgSum = backgroundRed+backgroundGreen+backgroundBlue;
				if(bgSum){
					//make them sum to 1
					backgroundRed /= bgSum;
					backgroundGreen /= bgSum;
					backgroundBlue /= bgSum;
				}
				//let addBrightToBG = .45;
				let addBrightToBG = .7;
				backgroundRed = addBrightToBG+(1-addBrightToBG)*backgroundRed;
				backgroundGreen = addBrightToBG+(1-addBrightToBG)*backgroundGreen;
				backgroundBlue = addBrightToBG+(1-addBrightToBG)*backgroundBlue;
				redByte = Math.max(0, Math.min(brightFraction*backgroundRed*256, 255));
				greenByte = Math.max(0, Math.min(brightFraction*backgroundGreen*256, 255));
				blueByte = Math.max(0, Math.min(brightFraction*backgroundBlue*256, 255));
			}else{
				redByte = greenByte = blueByte = Math.floor(brightFraction*256);
			}
			let by = i<<2;
			byteRect.bytes[by+RED] = redByte;
			byteRect.bytes[by+GREEN] = greenByte;
			byteRect.bytes[by+BLUE] = blueByte;
			byteRect.bytes[by+ALPHA] = 255; //visible, not transparent
		}
	}

	if(dagball.chk('isDisplayGradientsAsBrightnessOfRectanglesOnBackground') && dagball.debug_lastGradientMem){
		let gradientMem = dagball.debug_lastGradientMem;
		let arrays = [
			gradientMem.floats, //gradient. This one must be first cuz of the i==0 check below.
			//dagball.debug_lastPotens, //position (potens)
			//TODO velocity (velocity of potens)
		];

		if(dagball.debug_lastApCall){
			arrays.push(dagball.debug_lastApCall.par.floats);
		}
		
		/*let testA = arrays[0].slice();
		let testB = arrays[0].slice();
		let testC = arrays[0].slice();
		for(let i=0; i<testA.length; i++){
			testA[i] = Math.random(); //test display randomness
			testB[i] = Math.random();
			testC[i] = Math.random();	
		}
		arrays.push(testA);
		arrays.push(testB);
		arrays.push(testC);
		*/

		/*Gonna be very close to (if not equal to?) the gradients, since gradient is computed as (poten[i]-poten[neutral])/epsilon, so displaying poten[i] and gradient[i],
		each normed onto their own bellcurve, will take poten[neutral] as the approx ave and should equal. This is the correct behavior. I just dont need both of them.
		if(dagball.debug_lastPotens && dagball.debug_lastPotens.length >= arrays[0].length){ //potens is normally 1 more than gradient cuz of neutral dimension.
			arrays.push(dagball.debug_lastPotens); //position (potens)
		}*/
		dagball.debug_last_isDisplayGradientsAsBrightnessOfRectanglesOnBackground_arrays = arrays;

		let allFromY = 0;
		let allToY = Math.min(dagball.gradientRectanglesHeightPixels,byteRect.height); //whole y range. Split vertically between arrays.length
		let i = 0;
		let displayTextAtX = [];
		let arrayNames = [];
		for(let i=0; i<gradientMem.memSize; i++) arrayNames.push(gradientMem.ptrToName(i));
		for(let array of arrays){
			//for display when hold mouse over 1 of the "gradient rects" at top of screen, it shows contents of that array cell
			//and the name of the array. Theres multiple circs merged into that, and in each there can be multiple arrays.
			array.arrayNames = arrayNames;
			//display negated so bright is downhill instead of uphill, cuz position += dt*velocity; velocity -= dt*gradient(position); see doPhysics.
			let isGradient = array==gradientMem.floats;
			let displayMul = isGradient ? -1 : 1;
			//let displayMul = 1;
			//let displayMul = isGradient ? 0 : 1;
			let gradient = array;  //FIXME rename this var. its not always gradient. it might be position (potens) or velocity (velocity of potens).
			//let gradientMem = dagball.debug_lastGradientMem;
			//let gradient = gradientMem.floats;
			let [gradientAve, gradientStdDev] = Ap.aveDev(gradient);
			let dims = gradient.length;
			//for(let g=0; g<dims; g++){
			for(let c=0; c<gradientMem.childs.length; c++){ //display each array in different color
				let arrayName = gradientMem.childs[c].name;
				let indexFrom = gradientMem.nameToPtr.get(arrayName);
				let size = gradientMem.nameToSize.get(arrayName);
				let toExcl = indexFrom+size;
				if(i==1){ //per array in position (i==1), but all together in gradients (i==0)
					[gradientAve, gradientStdDev] = Ap.aveDev(Ap.subfloats(gradient, indexFrom, toExcl));
				}
				for(let g=indexFrom; g<toExcl; g++){
					//byteRect.paint
					let rangeY = allToY-allFromY;
					let fromY = allFromY+Math.floor(i/arrays.length*rangeY);
					let toY = allFromY+Math.ceil((i+1)/arrays.length*rangeY); //FIXME should this be floor or ceil?
					//let fromY = Math.floor(i/arrays.length*rangeY);
					//let toY = Math.min(dagball.gradientRectanglesHeightPixels,byteRect.height);
					let fromX = Math.floor(byteRect.width*g/dims);
					let toX = Math.floor(byteRect.width*(g+1)/dims);
					if(i==0 && g==indexFrom){
						displayTextAtX.push(fromX);
					}
					let brightAve = 100;
					let brightStdDev = 150;
					let gradientOnUnitBellcurve = (gradient[g]-gradientAve)/gradientStdDev;
					//if(i==1){
					//	gradientOnUnitBellcurve *= 35; //FIXME remove this
					//}
					//let bright = brightAve+brightStdDev*gradientOnUnitBellcurve;
					let bright = brightAve+brightStdDev*gradientOnUnitBellcurve*displayMul; //display gradient negated cuz position += dt*velocity; velocity -= dt*gradient(position); see doPhysics.
					//let colorFraction = (c+1)/gradientMem.childs.length;
					let colorFraction = c&1 ? .7 : .3;
					let red = 0;
					let green = bright*colorFraction;
					let blue = bright*(1-colorFraction);
					red = Math.floor(Math.max(0, Math.min(red, 255)));
					green = Math.floor(Math.max(0, Math.min(green, 255)));
					blue = Math.floor(Math.max(0, Math.min(blue, 255)));
					byteRect.paintRect(fromY, fromX, toY, toX, red, green, blue);
				}
			}
			i++;
		}
		for(let c=0; c<gradientMem.childs.length; c++){
			let arrayName = gradientMem.childs[c].name;
			dagball.scheduleCpuPaint(()=>{
				dagball.paintTextPixYXRGB(8, (arrayName=='balls'?30:0)+displayTextAtX[c], 1, 1, 1, arrayName);
			});
		}
	}
	if(dagball.chk('displayTiles',true)){
		//byteRect.paintLineYXYXRGB(aftrans.forwardY(onThisCirclesEdgeY), aftrans.forwardX(onThisCirclesEdgeX),
		//	aftrans.forwardY(pointBetweenY), aftrans.forwardX(pointBetweenX), red, green, blue);
		let vMinY = dagball.viewMinY();
		let vMaxY = dagball.viewMaxY();
		let vMinX = dagball.viewMinX();
		let vMaxX = dagball.viewMaxX();
		let af = dagball.aftrans;
		let vMinYPix = af.forwardY(vMinY);
		let vMaxYPix = af.forwardY(vMaxY);
		let vMinXPix = af.forwardX(vMinX);
		let vMaxXPix = af.forwardX(vMaxX);
		let red = 100;
		let green = 150;
		let blue = 200;
		let ts = dagball.tileSize();
		//y and x are game coords. convert to canvas coords to paint grid borders.
		for(let y=dagball.snapToGridEdgeRoundUp(ts,vMinY); y<vMaxY; y+=ts){ //horizontal lines, varying y
			let yPix = af.forwardY(y);
			byteRect.paintLineYXYXRGB(yPix, vMinXPix, yPix, vMaxXPix, red, green, blue);
		}
		for(let x=dagball.snapToGridEdgeRoundUp(ts,vMinX); x<vMaxX; x+=ts){ //vertical lines, varying x
			let xPix = af.forwardX(x);
			byteRect.paintLineYXYXRGB(vMinYPix, xPix, vMaxYPix, xPix, red, green, blue);
		}
	}

	if(dagball.isDisplayCircs){
		//todo also aftrans param
		dagball.displayCircs(byteRect);
	}


	let oBall = this.oBall(); //balls start at this index in this.pos. 2024-6-11 dagball.game.pos is either not used or only used for its size. use dagball.Ball and codeMaker instead.
	//this.nBall is number of balls. this.mBall is vars per ball.
	/*for(let b=0; b<this.nBall; b++){
		//these are the old kind of balls stored in dagball.game.pos.
		//The new kind is dagball.Ball stored in dagball.balls and dagball.view.balls and created by dagball.ball(id).

		let o = oBall+b*this.mBall;
		//let y = (.5+.5*this.pos[o])*byteRect.height;
		//let x = (.5+.5*this.pos[o+1])*byteRect.width;
		let y = dagball.aftrans.forwardY(this.pos[o]);
		let x = dagball.aftrans.forwardX(this.pos[o+1]);
		let radius = dagball.defaultIconRadius; //in pixels. TODO make that one of the ball vars (that increases this.mBall)?
		//defaultBallColor* is for bytRectTrail to match where the balls are, so only trail those,
		//but FIXME later Ill want multiple ball colors, maybe even changing their colors depending on game state.
		let redByte = dagball.defaultBallColorRed_OLD;
		let greenByte = dagball.defaultBallColorGreen_OLD;
		let blueByte = dagball.defaultBallColorBlue_OLD;
		//byteRect.paintCircleRadiusYXRGBSafe(radius, y, x, redByte, greenByte, blueByte);
		byteRect.paintDonut(y, x, 0, radius, redByte, greenByte, blueByte); //whole circle
	}*/

	if(dagball.chk('displayGobs',true)){
		for(let gob of dagball.gobs){
			//if(dagball.weightedCoinFlip(.1)){ //testing whats making it slow when theres hundreds of gobs, is it the rules or the graphics
				gob.paintOntoByteRect(byteRect);
			//}
		}
	}

	if(dagball.chk('isDisplayBallCircles')){
		for(let ball of dagball.balls){ //new kind of balls (2023-12-19 this has been the only kind of ball im using for months. fix "new" comment).
			//The new kind is dagball.Ball stored in dagball.balls and dagball.view.balls and created by dagball.ball(id).

			let y = dagball.aftrans.forwardY(ball.y);
			let x = dagball.aftrans.forwardX(ball.x);
			let radius = dagball.defaultIconRadius; //in pixels. TODO make that one of the ball vars (that increases this.mBall)?
			//FIXME defaultBallColor*(_OLD?) is for bytRectTrail to match where the balls are, so only trail those,
			//but FIXME later Ill want multiple ball colors, maybe even changing their colors depending on game state.
			
			//let redByte = dagball.defaultBallColorRed;
			//let greenByte = dagball.defaultBallColorGreen;
			//let blueByte = dagball.defaultBallColorBlue;
			let redByte = ball.red;
			let greenByte = ball.green;
			let blueByte = ball.blue;
			let displayAsSelected = ball == dagball.balls[0]; //local player ball (FIXME this isnt multiplayer yet)
			//TODO display green/blue depending on the third ball number (ball.ballBal or what is it called? bal?) if dagball.isDoubleHeightmap
			let doMouseBall = dagball.chk('mouseBall');
			if(displayAsSelected){ //TODO check for doMouseBall or !doMouseBall?
				redByte = dagball.localPlayerBallColorRed;
				greenByte = dagball.localPlayerBallColorGreen;
				blueByte = dagball.localPlayerBallColorBlue;
			}

			//byteRect.paintCircleRadiusYXRGBSafe(radius, y, x, redByte, greenByte, blueByte);
			//byteRect.paintDonut(y, x, 0, radius, redByte, greenByte, blueByte); //whole circle
			//let innerRadius = Math.max(0, radius-2);
			let innerRadius = Math.max(0, radius-.5);
			if(displayAsSelected){
				innerRadius /= 2;
			}
			//if(dagball.chk('rockPaperScissors') && ball.team < 3){ //is not cursor ball or other strange ball
			if(dagball.chk('rockPaperScissors') && 1 <= ball.team && ball.team < 4){ //is not cursor ball or other strange ball
				
				
				//FIXME this is not using the team colors array. see tournamentGraph.


				//display what color this ball becomes if the touched by the team chasing it, as a small dot in its center
				let becomesRed = blueByte; //FIXME is this reversed?
				let becomesGreen = redByte;
				let becomesBlue = greenByte;
				//FIXMEFIXMEFIXME byteRect.paintRect(y-1, x-1, y+1, x+1, becomesRed, becomesGreen, becomesBlue); //FIXME is 3x3 pixels too big?
				byteRect.paintYXRGBSafe(y, x, becomesRed, becomesGreen, becomesBlue);
				byteRect.paintYXRGBSafe(y+1, x, becomesRed, becomesGreen, becomesBlue);
				byteRect.paintYXRGBSafe(y-1, x, becomesRed, becomesGreen, becomesBlue);
				byteRect.paintYXRGBSafe(y, x-1, becomesRed, becomesGreen, becomesBlue);
				byteRect.paintYXRGBSafe(y, x+1, becomesRed, becomesGreen, becomesBlue);
			}
			byteRect.paintDonut(y, x, innerRadius, radius, redByte, greenByte, blueByte); //perimeter of circle

			if(ball.curveGrab){
				for(let i=0; i<ball.curveGrab.length; i++){
					//let angle = (1/3-.25-i/ball.curveGrab.length)*2*Math.PI;
					//let angle = (1/3-.25+i/ball.curveGrab.length)*2*Math.PI;
					let angle = (-.25+(i-1)/ball.curveGrab.length)*2*Math.PI;
					//no that flips vertical: angle = 2*Math.PI-angle; //flip horizontal
					let yOnPerimeter = y+Math.sin(angle)*radius; //in pixel coords, not game coords
					let xOnPerimeter = x+Math.cos(angle)*radius; //in pixel coords, not game coords
					let numberToDisplayAsBrightness = ball.curveGrab[i];
					/*let brightness = Math.floor(dagball.sigmoid(numberToDisplayAsBrightness)*255.999); //FIXME scaling
					byteRect.paintLineYXYXRGB(y-2, x, yOnPerimeter, xOnPerimeter, brightness, brightness, brightness);
					*/
					//let brightnessFraction = dagball.sigmoid(numberToDisplayAsBrightness); //FIXME scaling
					let brightnessFraction = dagball.sigmoid(.01*numberToDisplayAsBrightness); //FIXME scaling
					for(let xx=((i==1)?(x-2):x); xx<=((i==1)?(x+2):x); xx++){
						for(let yPlus=0; yPlus<2; yPlus++){
							let bright = brightnessFraction;
							if(ball.lockPos && i==1 && (xx==x || xx==x-1 || xx==x+1)){
								continue;
								//bright *= 1.2;
								//bright = Math.min(1, bright);
							}
							byteRect.paintLineYXYXRGB(y-2+yPlus, xx, ((i==1)?(yOnPerimeter-10):yOnPerimeter)+yPlus, xOnPerimeter,
								Math.floor(bright*redByte), Math.floor(bright*greenByte), Math.floor(bright*blueByte));
						}
					}
					/*byteRect.paintLineYXYXRGB(y-2, x, yOnPerimeter, xOnPerimeter,
						Math.floor(brightnessFraction*redByte), Math.floor(brightnessFraction*greenByte), Math.floor(brightnessFraction*blueByte));
					if(i==1){
						byteRect.paintLineYXYXRGB(y-2, x+1, yOnPerimeter, xOnPerimeter, brightness, brightness, brightness);
						byteRect.paintLineYXYXRGB(y-2, x-1, yOnPerimeter, xOnPerimeter, brightness, brightness, brightness);
					}*/
				}
			}
			
			if(ball.isSelected){
				let radius = dagball.defaultIconRadius*1.5;
				let innerRadius = Math.max(0, radius-.5);
				let randBrightness = Math.random();
				byteRect.paintDonut(y, x, radius+2, radius+4, dagball.randByte(), Math.floor(randBrightness*redByte), Math.floor(randBrightness*greenByte), Math.floor(randBrightness*blueByte)); //circle a little bigger than the normal ball circle, of random brightness but same color
			}

			//if(true || !doMouseBall){ //since its not moving dagball.balls[0] to mouse cursor, and mouse cursor is not displayed over canvans, display mouse cursor this way
			if(!dagball.isTextEditing()){
				let screenCursorY = dagball.aftrans.forwardY(dagball.controls('mouseY'));
				let screenCursorX = dagball.aftrans.forwardX(dagball.controls('mouseX'));
				//let screenCursorOuterRadius = 3+dagball.defaultIconRadius*1.6;
				//let screenCursorOuterRadius = 20;
				//let screenCursorOuterRadius = 12;
				let screenCursorOuterRadius = 15;
				//let screenCursorInnerRadius = screenCursorOuterRadius-2;
				let screenCursorInnerRadius = screenCursorOuterRadius-1;
				//byteRect.paintDonut(screenCursorY, screenCursorX, screenCursorInnerRadius, screenCursorOuterRadius, dagball.localPlayerBallColorRed, dagball.localPlayerBallColorGreen,dagball.localPlayerBallColorBlue);
				byteRect.paintDonut(screenCursorY, screenCursorX, screenCursorInnerRadius, screenCursorOuterRadius, dagball.mouseColorRGB[0], dagball.mouseColorRGB[1], dagball.mouseColorRGB[2]);
			}
		}
	}

	dagball.update_estimateFPS(); //FIXME move this into a nextstate func, instead of paint func?

	dagball.updateGamepadsEtc();

	dagball.doDisplayLogs();
	let displayLogs = document.getElementById('displayLogs');
	let overCanvas = document.getElementById('overCanvas');
	overCanvas.style.top = displayLogs.clientHeight+'px'; //move text editor etc to just below displayLogs, on left of screen.
	//overCanvas.style.height = (window.innerHeight - displayLogs.clientHeight) + 'px';
	overCanvas.style.height = (window.innerHeight - displayLogs.clientHeight + dagball.pixelsTextareaIsBelowBottomOfScreen) + 'px';
	//overCanvas.style.height = '200px';

	/*
	//make debugTextAreaDiv (which is in top right corner 2023-10-7) only as tall as needed for its content, but if too tall then vertical scrollbar
	//FIXME debugTextAreaDiv is ignoring dagball.pixelsTextareaIsBelowBottomOfScreen, but its working in overCanvas, 2023-10-7.
	let debugTextAreaDiv = document.getElementById('debugTextAreaDiv');
	let maxHeight = window.innerHeight - debugTextAreaDiv.getBoundingClientRect().top - dagball.pixelsTextareaIsBelowBottomOfScreen;
	debugTextAreaDiv.style.height = Math.min(debugTextAreaDiv.scrollHeight-dagball.pixelsTextareaIsBelowBottomOfScreen, maxHeight)+'px';
	debugTextAreaDiv.style.overflowY = (debugTextAreaDiv.scrollHeight > maxHeight) ? 'auto' : 'hidden';
	*/
	let debugTextAreaDiv = document.getElementById('debugTextAreaDiv');
	let maxHeight = window.innerHeight - debugTextAreaDiv.getBoundingClientRect().top;
	debugTextAreaDiv.style.height = Math.min(debugTextAreaDiv.scrollHeight, maxHeight)+'px';
	debugTextAreaDiv.style.overflowY = (debugTextAreaDiv.scrollHeight > maxHeight) ? 'auto' : 'hidden';
};


dagball.getEds = function(){ //dagball.Ed
	let list = [];
	let set = new Set();
	for(let circ of dagball.circles){
		for(let ed of circ.edsOut){
			set.add(ed);
			list.push(ed);
		}
	}
	return list;
};

dagball.getEdGroups = function(){
	let list = [];
	let set = new Set();
	for(let circ of dagball.circles){
		for(let ed of circ.edsOut){
			let edGroup = ed.edGroup;
			if(edGroup && !set.has(edGroup)){
				set.add(edGroup);
				list.push(edGroup);
			}
		}
	}
	return list;
};

dagball.Circ.prototype.getEdGroups = function(){
	let list = [];
	let set = new Set();
	for(let ed of this.edsOut){
		let edGroup = ed.edGroup;
		if(edGroup && !set.has(edGroup)){
			set.add(edGroup);
			list.push(edGroup);
		}
	}
	return list;
};

dagball.setSelectedBalls = function(...balls){
	let set = new Set(balls);
	for(let ball of dagball.balls){
		//ball.isSelected = balls.includes(ball);
		ball.isSelected = set.has(ball);
	}
};

//TODO since theres circ.isSelected, there could be multiple of them selected, maybe for bulk changes? If circ is null, unselect all. Unselects all except the given circ.
dagball.setSelectedCirc = function(circ){
	dagball.circles.forEach(c=>{ c.isSelected = (circ==c); });
	if(circ){ //null (or undefined?) to unselect
		document.getElementById('selectedCircIsPreferCpu').checked = circ.preferCpu || false;
		//document.getElementById('circMutid').value = circ.mutid || '';
		//document.getElementById('circMutid').value = circ.mutid ? ('dagball.mutidToCirc(\''+circ.mutid+'\').text') : '';
		//document.getElementById('circMutid').value = circ.mutid ? ('dagball.mutidToCirc(\''+circ.mutid+'\')') : '';
		document.getElementById('circMutid').value = circ.mutid  || '';
	}
	C = circ; //one of the few global vars dagball defines, C for convenience, the selected circ
};

dagball.setSelectedEdGroup = function(edGroup){
	//console.log('setSelectedEdGroup '+edGroup);
	for(let g of dagball.getEdGroups()){
		g.isSelected = (g==edGroup);
	}
};
//TODO dagball.setSelectedEdGroups (g==edGroup) in the set. Will need that for edgroups that are already connected, each from a diff circ.

//sets the selected dagball.EdSliderKnob (found in ed.sliderKnobs[index]) and sliderKnob.val its the number its been slided to, similar to ed.pos.
//It must already be in an ed so its displayed. Use param of null to unselect all EdSliderKnobs.
dagball.setSelectedEdSliderKnob = function(edSliderKnob){
	for(let knob of dagball.allEdSliderKnobs()){
		knob.isSelected = knob===edSliderKnob; //FIXME since knob.toString() returns knob.val (a number), would == return the wrong thing here?
	}
};

//get potentialEnergy of knob at current this.pos and ed.sliderKnobs[eachIndex].val.
//Computed in CPU, so this is called many times less than potential energy in GPU.
dagball.Ed.prototype.knobPoten = function(optionalPos){
	if(!this.slidersFunc){
		return 0;
	}
	let usePos = optionalPos!==undefined ? optionalPos : this.pos;

	let params = [];
	for(let knob of this.sliderKnobs){
		params.push(knob.val);
	}
	params.push(usePos);
	return this.slidersFunc(...params); //FIXME is this faster?
	
	//This might be very slow cuz of this.sliderKnobs[any] being not numbers but their toString is a number?:
	//return this.slidersFunc(...(this.sliderKnobs), usePos); //each sliderKnob has a toString that returns thisKnob.val, so all params are or soon become numbers.
};

//0 if there is no slidersFunc, else its the gradient of this.pos (ed.pos) at ed.sliderKnobs[eachIndex].val.
//This could be computed as potentialEnergy instead of gradient directly, but since that would require changing every dimensions potentialEnergy,
//and this is a smaller simpler change to just (caller should do) add this to 1 index's val in gradient array (just after get floats from GPU for gradient).
dagball.Ed.prototype.knobGradient = function(){
	let ep = dagball.game.floatEpsilon;
	return (this.knobPoten(this.pos+ep)-this.knobPoten(this.pos))/ep;
};

dagball.Ed.prototype.isSelected = function(){
	return this.edGroup && this.edGroup.isSelected;
};

dagball.roundToEdSnapGrid = function(x){
	//let snapGridSize = 2**-6; //FIXME adjust this. FIXME this might not work far away from (0,0) cuz float has 24 digit bits of precision. Theres some max radius of game. adjust it.
	//let snapGridSize = 2**-4; //FIXME adjust this. FIXME this might not work far away from (0,0) cuz float has 24 digit bits of precision. Theres some max radius of game. adjust it.
	return dagball.snapGridSize*Math.round(x/dagball.snapGridSize);
	//TODO merge this with the more general dagball.snapToGrid?
};

//Move (y,x) of all eds in this edgroup to around a circle. TODO snap onto another such edgroup if its very near there. Dont let roundoff prevent it.
dagball.EdGroup.prototype.pointAtYXR = function(y, x, r){
	y = dagball.roundToEdSnapGrid(y);
	x = dagball.roundToEdSnapGrid(x);
	for(let i=0; i<this.eds.length; i++){ //FIXME does it start at angle 0 or angle pi/2 or what? Does it go down? pi/2 and going down is like a round clock.
		let ed = this.eds[i];
		let angle = i/this.eds.length * 2*Math.PI;
		//let angle = Math.PI/2 - (i/this.eds.length * 2*Math.PI);
		ed.y = dagball.roundToEdSnapGrid(y + r*Math.sin(angle)); //display and EdJoint_merge them by roundToEdSnapGrid but let it be loose (any float32) in ed.y and ed.x
		ed.x = dagball.roundToEdSnapGrid(x + r*Math.cos(angle));
		//ed.y = y + r*Math.sin(angle);
		//ed.x = x + r*Math.cos(angle);
	}
};

//choose nearby circs (of at most 1000 total vars each, todo hopfield-without-storing-derived-from-distance-weights constraint solver by priority-vote-per-circ to make there be at most 1000 numGpuUniformVars in View)
//and they will become the potentialEnergy gradient for physics and potentialEnergy for graphics.
//This should cause those circs to be displayed instead of the example GPU code that dagball.game.tinyGlslCurveCode starts as, IF dagball.doPhysicsAndGraphicsFromGpuCodeInCircsElseTheExampleGpuCode.
dagball.updateView = function(){
	dagball.view = new dagball.View(dagball.circles.slice(), dagball.balls.slice()); //FIXME make this sparse since the view shouldnt be ALL the circles and ALL the balls, only those on screen and nearby, however many will fit in the upo to 1000 floats/dimensions in GPU at once.
	//dagball.view = new dagball.View(dagball.circles.filter(c=>c.isSelected));
};


//Putting y, x, and radius into parr avoids recompiling GPU code when only moving or resizing the circs, which was 2023-10-16 slowing it down during that.
dagball.varsPerCircIntoGpu_y = 0;
dagball.varsPerCircIntoGpu_x = 1;
dagball.varsPerCircIntoGpu_r = 2;
dagball.varsPerCircIntoGpu = 3;

//2024-1-28 I noticed I save about 7 milliseconds (ms) per video frame by not calling updateView (see Performance tab in browser console),
//but that would also prevent changing the ape code (in circ.text) to change the kind of curves, so use this to check for changes.
//UPDATE: changing it to dagball.circles and dagball.balls (instead of .view.circs and .view.balls) cuz that way it gets ALL the circs,
//including new ones that im trying to copy ape code into but dont have it yet and dont get it cuz updateView isnt called.
//Returns a string generated from dagball.view.circs and dagball.view.balls, to check if anything changed that requires
//recompiling the ape code, especially circ.text and the number of circs and number of balls.
//Positions and velocities (and radius of circs) of circs, eds, balls, etc dont affect this since they reuse same GPU code.
dagball.viewDedupString = function(){
	if(!dagball.view) return '[No dagball.view, randomNumToPreventDedup='+dagball.randInt(1000000000)+dagball.randInt(1000000000)+']';
	let s = '[viewDedupString numCircs='+dagball.circles.length+' numBalls='+dagball.balls.length+
		' compileCircHeadersUsingLocMem='+dagball.chk('compileCircHeadersUsingLocMem')+' doDiffEq='+dagball.chk('doDiffEq');
	for(let circ of dagball.circles){
		/*
		//FIXME adding this code 2024-2-23 but it might interfere with the drawing of circs that have no GPU code
		//or those which are too far away from screen center (theres a checkbox and 2 number boxes for it).
		//Adding the "if(dagball.view.hasGpuCodeAndShouldUseIt(circ)" instead of including all circs.
		if(dagball.view.hasGpuCodeAndShouldUseIt(circ)
				
		FIXME Try this first, but eventually will have to make a smaller viewDedupString cuz there will be ALOT of circs,
		most of which dont get displayed. For now im just marking which of them are hasGpuCodeAndShouldUseIt.
		*/
		s += ' circText['+circ.text+']';
		s += dagball.view.hasGpuCodeAndShouldUseIt(circ) ? 'G' : 'g'; //see sparseWorld checkbox.
	}
	s += ' sparseWorld='+dagball.chk('sparseWorld',false);
	s += ' sparseWorldTiles='+dagball.chk('sparseWorldTiles',true);
	s += ' tileSize='+dagball.tileSize();
	s += ' gpuCompileNumTilesOutward='+dagball.num('gpuCompileNumTilesOutward',dagball.defaultGpuCompileNumTilesOutward);
	s += ' transformFloatValsToVArray='+dagball.chk('transformFloatValsToVArray',dagball.default_transformFloatValsToVArray);
	s += ' testRetPar='+dagball.chk('testRetPar',false);
	s += ' gpuAddEpsilonForGradient='+dagball.chk('gpuAddEpsilonForGradient',true);
	s += ' doAllPairsOfBalls='+dagball.chk('doAllPairsOfBalls',true);
	s += ' doCurveGrab='+dagball.chk('doCurveGrab',true);
	s += ' numCurveGrabBalls='+dagball.numCurveGrabBalls();
	//sparseWorldTiles
	//tileSize
	//gpuCompileNumTilesOutward
	if(dagball.mulPotenCircInsideTanhBeforeMulInfluence !== undefined){ //in case i bring the var back, commentingout it 2024-2-23
		s += ' mulPotenCircInsideTanhBeforeMulInfluence='+dagball.mulPotenCircInsideTanhBeforeMulInfluence;
	}
	return s+']';
};

//a list of dagball.Circs that are merged in GPU to a single GPU code (use TinyGlsl.simple) to paint screen and compute potentialEnergy gradient.
//and a list of dagball.Ball.
dagball.View = function(circs, balls){
	this.circs = circs;
	this.balls = balls; //FIXME some code uses dagball.balls instead of dagball.view.balls and theres comments about upgrading to sparse/sparsity later.
	//Keys are: string of which calculation. 2023-10 these were 'potentialEnergiesForDisplay' or 'potentialEnergiesForGradient' as params of dagball.Game.prototype.tinyGlslCode,
	//but 2023-11+ there will more since theres 1 (potentialEnergy) vs 4 floats (greenHeightmap blueHeightmap pixDistance pixBalance) which are used in display
	//and those 4 floats with a (y x ballBalance) 3d position generates 1 potentialEnergy float at that (y x ballBalanced) and
	//Vals are: Ap.Call instance from Ape.js. this.mergedApCall.par is where the dimensions/floats go (up to about 1000 on screen at once) then this.mergedApCall.eval() -> Float32Array.
	this.mergedApCalls = {
		singleHeightmapDisplay: null, //(y,x) for every pixel. No derivatives, just use par memory as it is without adding epsilons. Returns 1 number per (y,x).
		singleHeightmapDisplay_transformFloatValsToVArray: null, //the Ap.lazyEvalV form of singleHeightmapDisplay thats used if dagball.chk('transformFloatValsToVArray') else use singleHeightmapDisplay
		doubleHeightmapDisplay: null, //(y,x) for every pixel. No derivatives, just use par memory as it is without adding epsilons. Returns 4 numbers per (y,x): (greenHeightmap blueHeightmap pixDistance pixBalance).
		singleHeightmapPotentialEnergiesForGradient: null, //par memory in (up to around 1000 floats). par.length-1 floats out, with an epsilon added to each such float depending on which gpu thread {id}. Loops over all balls, of 2 floats each (y x) and computes the potentialEnergy added by that ball. Returns 1 potentialEnergy per GPU thread. Theres {f+ {id} 1} number of gpu threads and floats out.
		singleHeightmapPotentialEnergiesForGradient_transformFloatValsToVArray: null, //the Ap.lazyEvalV form of singleHeightmapPotentialEnergiesForGradient thats used if dagball.chk('transformFloatValsToVArray') else use singleHeightmapPotentialEnergiesForGradient
		doubleHeightmapPotentialEnergiesForGradient: null, //par memory in (up to around 1000 floats). par.length-1 floats out, with an epsilon added to each such float depending on which gpu thread {id}. Computes the 4 numbers (greenHeightmap blueHeightmap pixDistance pixBalance) per ball. Each ball has 3 numbers (y x ballBalance) that are combined with the 4 numbers to get the potentialEnergy that ball adds. Loops for all balls and returns 1 potentialEnergy float per gpu thread. so {f+ {id} 1} number of gpu threads and floats out.
		singleHeightmapCpuDiffeq: null, //a whole (gpucpu (do ...gpu stuff...) (do ...also do this in cpu...)). CPU does both (at y=0, x=0). GPU only does first part.
		doubleHeightmapCpuDiffeq: null,
	};
	this.mergedGpuCode = 'TODO mergedGpuCode'; //TODO remove this. its being replaced by this.mergedApCalls.
	//this.numGpuUniformVars = null; //readOnly parr array.
	//this.numGpuLocalVars = null; //read and write. TODO add this parallel to the parr array.
	//dagball.Circ to int. Where these start in par/parr: mergedGpuCode += n+'circY = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_y)+'];';
	//Filled by updateLocalFields.
	//This means you need to copy circ.y circ.x and circ.r into par array (that goes into tinyGlsl, and which parr array is generated from) just before calling TinyGlsl.
	//This is an upgrade to move y, x, and r/radius into the par/parr arrays instead of as literal floats that need recompiling the GPU code with every change, so its faster.
	//In Dagball 070 moving and resizing GPU_circles is alot faster cuz it doesnt recompile to change them. Instead, moved (y,x,radius) of each circle into the up to 1000 dimensions.
	this.circToPreOffset = new Map(); //key is dagball.Circ, val is int.
	this.circToOffset = new Map(); //key is dagball.Circ, val is int.
	this.updateLocalFields(); //updates this.mergedGpuCode, this.numGpuUniformVars, this.numGpuLocalVars, etc.
};
//if optionalIncludeCpu then also includes circ where circ.preferCpu if it would have matched other than that.
dagball.View.prototype.hasGpuCodeAndShouldUseIt = function(circ, optionalIncludeCpu){
	if(!optionalIncludeCpu && circ.preferCpu){
		//FIXME compute circs that have circ.preferCpu in a different function for physics and graphics (2 functions)F
		return false;
	}
	let txt = circ.text.toLowerCase();
	//return txt.startsWith('tinyglsl:') || (dagball.evalGlslCodeGeneratedFromApeCode && txt.startsWith('ape:'));
	//2023-11+ tinyglsl isnt used directly from dagball. dagball uses ape uses tinyglsl. its easier to fit a bunch of ape code together than apeCode+tinyglslCode.
	//You can still use TinyGlsl from browser console.
	//let ret = (dagball.evalGlslCodeGeneratedFromApeCode && (txt.startsWith('ape:') || txt.startsWith('apev1:')));
	
	//computeInfluence ranges 0 to 1, gradually becomes 0 when too far out of view, which causes Ap.js/GLSL recompile
	//when move view so likely 1/5 second of jumpyness/lag then unless Ap.js has cached the same GPU calculations
	//(it normally does, until TinyGLSL clear cache which happens around once per minute)
	let sparseWorldStuff;
	if(!dagball.chk('sparseWorld')){ //not sparse, so sparseWorldStuff does not exclude any circs
		sparseWorldStuff = true;
	}else if(dagball.chk('sparseWorldTiles')){ //The tileSize and gpuTilesOutward number boxes choose which circs go in GPU.
		//the circle around view that it fades computeInfluence gradually to 0 at edge of circle
		//is only for display and physics but a grid of 2x2 tiles, that overlap other 2x2 tiles
		//on 2x1 or 1x2 or 1x1 of such tiles (each group of 2x2 tiles overlaps 8 adjacent such groups),
		//whatever circs whose centers are in that
		//(FIXME if theyre too big theyll hang off unless use 3x3 4x4 5x5 etc or bigger tiles?)
		//so basically the tiles choose which circs are compiled in GPU.
		//I dont think 2x2 is gonna work cuz view has to be centered inside 1 of the tiles, so doing 3x3,
		//and the view is always inside the middle one.
		//
		//More generally, could simply compute a (y,x) center by snapping to the center of a tile)
		//and have an arbitrary number for distance outward, that considers circ radius similar to influenceAtYXR.
		//Do that.
		
		//Circs past this will be faded out to 0 circ.computeInfluence() so will be invisible
		//even if they're compiled and run in GPU. If you zoom out, viewRadius looks alot smaller on screen.
		//let viewRadius = dagball.sparseDistFar();
		//let tileSize = viewRadius*1.7; //arbitrary multiplier
		let tileSize = dagball.tileSize();
		
		//let manhattanDistanceFromTileCenterToGPUCompile = tileSize*2.5; //arbitrary multiplier
		let manhattanDistanceFromTileCenterToGPUCompile = tileSize*dagball.num('gpuCompileNumTilesOutward'); //arbitrary multiplier
		
		//There is a tile whose center is (tileSize*N,tileSize*M) for all integers N and M.
		let tileCenterY = dagball.snapToGrid(tileSize, dagball.viewCenterY());
		let tileCenterX = dagball.snapToGrid(tileSize, dagball.viewCenterX());
		
		//This doesnt work cuz its circ center but should be nearest point in the circ
		//let observedManhattanDistanceFromTileCenter = Math.abs(circ.y-tileCenterY)+Math.abs(circ.x-tileCenterX);
		//sparseWorldStuff = observedManhattanDistanceFromTileCenter<=manhattanDistanceFromTileCenterToGPUCompile;
		
		let distance = Math.hypot(circ.y-tileCenterY, circ.x-tileCenterX);
		if(distance <= circ.r){ //tile center is inside circ
			sparseWorldStuff = true;
		}else{
			//Tile center is outside circ. Find closest point on circs perimeter and do manhattan distance to that.
			//The reason to use both kinds of distance together is every pixel in the circle may be affected,
			//and physics affected by it (FIXME or even farther if its ed lines are outside the circ),
			//so if any part of the circ should be in the enlarged square tile area, include that circ.
			
			//let fractionDistanceTowardCircCenter = (distance-circ.r)/distance;
			let fraction = circ.r/distance;
			let onCircsPerimeterY = tileCenterY*fraction + (1-fraction)*circ.y;
			let onCircsPerimeterX = tileCenterX*fraction + (1-fraction)*circ.x;
			let manhattan = Math.abs(onCircsPerimeterY-tileCenterY)+Math.abs(onCircsPerimeterX-tileCenterX);
			sparseWorldStuff = manhattan<=manhattanDistanceFromTileCenterToGPUCompile;	
		}
	}else{ //the sparseDist box [fadeTiles dist=numberbox_id_sparseDist*numberbox_id_sparseDistFrac] number box chooses what goes in GPU,
		   //but as of 2024-2-24 it may be buggy and maybe is multiplied by some constant times bigger than that

		//the circle around view that it fades computeInfluence gradually to 0 at edge of circle,
		//the circs that are in that circle are GPU compiled.
		sparseWorldStuff = dagball.chk('sparseWorldOnlyInfluence',false) || circ.computeInfluence()>0;
	}
	//dagball.sparseDistFar()
	return (dagball.evalGlslCodeGeneratedFromApeCode &&
		sparseWorldStuff && //(dagball.chk('sparseWorldOnlyInfluence',false) || circ.computeInfluence()>0) &&
		(txt.startsWith('ape:') || txt.startsWith('apev1:')));
};

//all the edGroups in this.circs[any].edsOut[any].edGroup aka all the edGroups that are in view.
dagball.View.prototype.edGroups = function(){
	let edGroups = [];
	let set = new Set();
	for(let circ of this.circs) for(let ed of circ.edsOut){
		if(!ed.edGroup){
			Err('No ed.edGroup in ed='+ed+' in circ='+circ);
		}
		if(!set.has(ed.edGroup)){
			edGroups.push(ed.edGroup);
			set.add(ed.edGroup);
		}
	}
	return edGroups;
};

dagball.View.prototype.removeUpToFirstColon = function(str){ //Example: 'ape:{abc locparMem (5)}' -> '{abc locparMem (5)}'
	let i = str.indexOf(':');
	if(i == -1) return str;
	return str.substring(i+1);
};

//Gets 1 of 2 possible Ap.Call objects that are lazyEvals of calling GPU for physics.
//That Ap.Call is normally called dagball.physicsCyclesPerVideoFrame times per video frame.
dagball.get_singleHeightmapPotentialEnergiesForGradient = ()=>( //These are both created in dagball.View.prototype.updateLocalFields = function()
	dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient_transformFloatValsToVArray || //exists if dagball.chk('transformFloatValsToVArray') and next video frame has happened
	dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient); //exists either way

//Gets 1 of 2 possible Ap.Call objects that are lazyEvals of calling GPU for display. That Ap.Call is normally called once per video frame.
dagball.get_singleHeightmapDisplay = ()=>( //These are both created in dagball.View.prototype.updateLocalFields = function()
	dagball.view.mergedApCalls.singleHeightmapDisplay_transformFloatValsToVArray || //exists if dagball.chk('transformFloatValsToVArray') and next video frame has happened
	dagball.view.mergedApCalls.singleHeightmapDisplay); //exists either way

//also updates EdGroups in Circs, so edGroup.apeArrayName is the (already prefixNames modified) names here.
dagball.View.prototype.updateLocalFields = function(){

	//if(dagball.isSplitOuterBallsLoopIntoMultipleGPUThreads){
	//	Todo('isSplitOuterBallsLoopIntoMultipleGPUThreads in dagball.View.prototype.updateLocalFields. Generate different code in singleHeightmapPotentialEnergiesForGradient');
	//}

	//Will replace this.mergedApCalls.singleHeightmapDisplay etc at end of this func.
	let singleHeightmapDisplay = null;
	let singleHeightmapPotentialEnergiesForGradient = null;
	let singleHeightmapCpuDiffeq = null;
	//TODO option for doubleHeightmapDisplay and doubleHeightmapPotentialEnergiesForGradient

	//throw 'TODO singleHeightmapDisplay using Ap.Ape and Ap.Call ONLY';
	//console.log('FIXME: skipping updateLocalFields during upgrade to Ape');
	//return;

	let compileCircHeadersUsingLocMem = dagball.chk('compileCircHeadersUsingLocMem');
	//is filled only if compileCircHeaders, to put these literal contents in circHeaders ape array, else fill from apCall later.
	let circHeadersContents = [];
	
	let circNum = 0;
	let circApes = []; //from gpucircs only (no circ.preferCpu cuz thats not computed in GPU, is computed separately, see 'hdr' array and circ.cpuCall).
	//key is a dagball.Circ. Val is [] of Ap.Ape.name (after name is prefixed to prevent with 'c0_' 'c1_' 'c2_'...)
	//whose .apeType is 'parMem' or 'parlocMem' or 'locparMem' or 'locMem' or 'bigMem'
	//(TODO not including 'par' 'loc' or 'big' which many smaller arrays are inside). And TODO dont include 'float' or 'int' which are single vars not arrays.
	//These strings can be used to put floats (from circ eds (some of the lines on their perimeter)) into the Ap.Call objects in dagball.View.mergedApCalls
	//before calling GPU to process those floats which returns a Float32Array.
	this.mapOfCircToMemApeNames = new Map();
	for(let circ of this.circs){
		let hasCpuOrGpuCodeAndShouldUseIt = this.hasGpuCodeAndShouldUseIt(circ,true);
		let hasGpuCodeAndShouldUseIt = hasCpuOrGpuCodeAndShouldUseIt && !circ.preferCpu;
		if(hasCpuOrGpuCodeAndShouldUseIt){
			if(circ.preferCpu){ //CPU. Create ape for the circ to call it to get 1 poten number at a time from potenCirc$
				//TODO optimize, only replace circ.cpuCall if circ.text or circ.y or circ.x or circ.r etc changed.
				lc = circ.text.toLowerCase();
				if(lc.startsWith('apev1:')){
					Err('Circ.preferCpu requires Ap.Ape V2, not V1.');
					//ape (V2), not apeV1, despite that codeMaker below uses apeV1 then is auto translated to v2, but since this is more isolated use v2 from the start.
				}
				if(!lc.startsWith('ape:')){
					Err('must start with "ape:" (without the quotes): '+circ.text);
				}
				//2024-6-9 renaming cpuHeaders to hdr: z y x cinfluence cz cy cx cradius, but just the first 3 for now.
				//use parlocMem for cpuHeaders (or parMem would be better, but par and loc being diff sizes is not well tested as of 2024-6-3) instead of locparMem
				//cuz when using cpucircs (individual circ compiled to js for CPU), codeMaker does not generate the gradient/physics vs display code,
				//and its all just get poten directly as 1 number, so par doesnt get copied to loc (with or without the +epsilon in some dim depending on id).
				//Its a simpler thing that doesnt have that, though it could be written into the ape to do that (as codeMaker does).
				//The plan is to run gradient code in CPU by calling apCall.evan() many times, each time getting 1 number,
				//and changing apCall.par.floats contents to be +epsilon in some cases, then changing it back.
				//This parlocMem might cause a problem later in which case you should switch it back to locparMem but only if you know par will get copied to loc.
				//let apePrefix = 'ape:(do {hdr parlocMem (3)} {potenCirc float} <{z float} [hdr 0]> <{y float} [hdr 1]> <{x float} [hdr 2]> <{cy float} '+TinyGlsl.jsNumToGlslFloat(circ.y)+'> <{cx float} '+TinyGlsl.jsNumToGlslFloat(circ.x)+'> <{cr float} '+TinyGlsl.jsNumToGlslFloat(circ.r)+'>\n'; //FIXME what sets values of y and x?
				let apeCode = circ.text.trim();
				if(!apeCode.includes('{hdr ')){ //put hdr array in if doesnt have it. Its (z,y,x) at least, position to get poten at.
					//Err('Code does not include "{hdr ". Expected it contain something like: (do {hdr parlocMem (3)} {potenCirc float} <{z float} [hdr 0]> <{y float} [hdr 1]> <{x float} [hdr 2]>');
					let removedPrefix = '';
					let removedSuffix = '';
					let midApeCode = apeCode;
					if(apeCode.startsWith('ape:\n(gpucpu')){
						apeCode = apeCode.substring('ape:'+apeCode.substring('ape:\n'.length)); //remove \n
					}
					//FIXME what if its 'ape:\n(gpucpu'?
					if(apeCode.startsWith('ape:(gpucpu') && apeCode.endsWith(')')){ //keep (gpucpu ...) as outermost ape cuz theres compiler code which checks for that.
						let firstParamOfGpucpuStartsAt = midApeCode.indexOf('(','ape:(gpucpu'.length);
						let firstParamOfGpucpuEndsAtExcl = Ap.indexOfClosingParen(midApeCode,firstParamOfGpucpuStartsAt)+1;
						removedPrefix = midApeCode.substring(0,firstParamOfGpucpuStartsAt);
						removedSuffix = midApeCode.substring(firstParamOfGpucpuEndsAtExcl);
						midApeCode = apeCode.substring(removedPrefix.length,apeCode.length-removedSuffix.length);
					}
					let addPrefix = '(do {hdr parlocMem (3)} {potenCirc float} <{z float} [hdr 0]> <{y float} [hdr 1]> <{x float} [hdr 2]> <{cy float} '+TinyGlsl.jsNumToGlslFloat(circ.y)+'> <{cx float} '+TinyGlsl.jsNumToGlslFloat(circ.x)+'> <{cr float} '+TinyGlsl.jsNumToGlslFloat(circ.r)+'>\n';
					if(!removedPrefix.startsWith('ape:')){
						addPrefix = 'ape:'+addPrefix; //so it doesnt get 2 of 'ape:' with 1 somewhere in middle
					}
					let addSuffix = '\n(return potenCirc$)\n)';
					let newApeCode = removedPrefix+addPrefix+this.removeUpToFirstColon(midApeCode)+addSuffix+removedSuffix;
					console.log('Changing ap code to include hdr array:\n'+newApeCode);
					apeCode = newApeCode;
				}
				//let apeSuffix = '\n<ret potenCirc>)';
				//let apeSuffix = '\n(return potenCirc$))';
				//let apeCode = apePrefix+this.removeUpToFirstColon(circ.text)+apeSuffix;
				circ.cpuCall = Ap.lazyEval(apeCode); //use lazyEval instead of lazyEvalV cuz dont need to use the V array in CPU cuz its purpose is to skip long compiling in GPU but eval in CPU is fast.
				let hdrSize = circ.cpuCall.size('hdr');
				if(hdrSize < 3){
					Err('hdrSize='+hdrSize+' < 3 (z y x, and if bigger would be cInfluence cz cy cx cr)');
				}
				let hdrPtr = circ.cpuCall.par.ptr('hdr');
				if(hdrPtr != 0){
					Err('circ.cpuCall.par.ptr("hdr") is not 0. As an optimization im trying to use it as always 0 (make sure hdr is first array in the ap code).');
				}
				let ape = circ.cpuCall.ape;
				//without this, circs where circ.preferCpu is true, when first loaded (instead of modified from existing GPU circ) have eds with ed.edGroup==null.
				//updateEdGroups sets ed.edGroup, since the groups are not known until the ape code is parsed andOr this dagball.View.prototype.updateLocalFields func is called.
				ape.updateEdGroups(circ); //if adds hdr array, this will add eds for it.

				//FIXME this should happen every physics cycle cuz could be EdJoints or balls affecting it (TODO): dagball.updateCpuApCallBeforeManyEvals(circ.cpuCall, circ); //once (until recompile) copy ed.pos for all circ.edsOut into circ.cpuCall.
				dagball.updateCpuApCallBeforeManyEvals(circ.cpuCall, circ); //do it once at first anyways, despite it needs to be repeated every physics cycle
			}else{ //GPU
				//if(!circ.text.startsWith('ape:')){
				if(!circ.text.startsWith('ape:') && !circ.text.toLowerCase().startsWith('apev1:')){
					throw new Error('Is not ape code: '+circ.text+' in circ='+circ+' but hasGpuCodeAndShouldUseIt said to use it.');
				}
				//let apeCode = this.removeUpToFirstColon(circ.text);
				let apeCode = circ.text; //leave ape: or apeV1: prefix. Ap.lazyEval allows it and will automatically call Ap.lazyEvalOld if starts with "apeV1:".
				//an Ap.Call. You can put floats in it or call.eval() to get GPU output floats, but shouldnt do that from here since its only part of the ape code.
				//FIXME theres likely some shared vars that will cause that parsing/lazyEval to break?
				let callWithOriginalNames = Ap.lazyEval(apeCode);
				let apeWithOriginalNames = callWithOriginalNames.ape;
				let namePrefix = 'c'+circNum+'_';
				let ape = apeWithOriginalNames.prefixNames(namePrefix); //so the use of the same var name in multiple circs doesnt break eachothers code.
				circApes.push(ape);
				//let memApeNamesSet = new Set('parMem parlocMem locparMem locMem bigMem'.split(' '));
				//excludes {par} {loc} and {big} cuz {par} is what (arrayName parMem) and (arrayName parlocMem) and (arrayName locparMem) goes inside. par is a view of them all together.
				//similar for {big}.
				//FIXME what if it ONLY contains {par} but no parMem parlocMem locparMem inside it? should it throw then?
				let memApeNamesSet = new Set('parMem parlocMem locparMem bigMem'.split(' ')); //excludes locMem cuz that only exists in GPU memory, not CPU.
				let memApeNames = ape.searchApes(ape=>memApeNamesSet.has(ape.apeType)).map(ape=>ape.Name());
				let dedupedMemApeNames = Ap.dedupList(memApeNames);
				/*if(dedupedMemApeNames.length != memApeNames){
					dagball.logOnce('WARNING: dedupedMemApeNames.length='+dedupedMemApeNames.length+' != memApeNames='+memApeNames+' Shouldnt be creating duplicate apes. Should reuse same ape when see its name again. Fix this in Ap.ParseApe etc.');
					memApeNames = dedupedMemApeNames;
				}*/
				this.mapOfCircToMemApeNames.set(circ, memApeNames);
				//dagball.logOnce('circ has these mems: '+memApeNames);
				//TODO where do circ edges (with float pos(ition)) go into the ape? not callWithOriginalNames.par.put('arrayName',index,val) cuz that would be a different name of array without the prefix.
				//let call = Ap.lazyEval(''+ape);

				//sets circ.edsOut[each].edGroup.apeArrayName to the new names made by "let ape = apeWithOriginalNames.prefixNames(namePrefix);"
				//so later can copy floats from circ.edsOut[any].pos (in CPU) into thisView.mergedApCalls.singleHeightmapDisplay (an Ap.Call) of those ape arrays,
				//then apCall.eval() (calls GPU) -> Float32Array (returned to CPU),
				//then in that shared_by_multiple_circs_and_edGroups Float32Array are numDimensions+1 number of floats, which a numDimensions size gradient
				//is made by subtracting the last (no calculus +epsilon) float from each of the numDimensions floats,
				//then in the old (as of 2023-11-11) code that (times dt, the change in time) would get subtracted from dagball.game.vel (velocity of game state)
				//and update dagball.game.pos[each] by dt*dagball.game.vel[each] and decay velocity (similar to friction),
				//but since the recent (incomplete) redesign to move dagball.Ape to its own file (Ap.js or Ape.js?) and its Ap.Ape (js class now),
				//and Ap.Call.prototype.eval calls TinyGlsl instead of Dagball calling TinyGlsl directly (Dagball calls Ape calls TinyGlsl calls Webgl2_GLSL),
				//the redesign will update pos and vel in circ.edsOut[any].pos and circ.edsOut[any].vel (instead of in dagball.game.pos and .vel).
				ape.updateEdGroups(circ);

				if(compileCircHeadersUsingLocMem){
					/*apCall.put('circHeaders', circHeadersIndex++, circ.y);
					apCall.put('circHeaders', circHeadersIndex++, circ.x);
					apCall.put('circHeaders', circHeadersIndex++, circ.r);
					apCall.put('circHeaders', circHeadersIndex++, circ.influence);
					*/
					circHeadersContents.push(circ.y);
					circHeadersContents.push(circ.x);
					circHeadersContents.push(circ.r);
					//circHeadersContents.push(circ.influence);
					circHeadersContents.push(circ.computeInfluence());
				}
			}
		}else{
			circ.removeAllEds();
		}
		circNum++;
	}

	/*
	let preVarsUseWhichArray = 'par';
	//In Dagball 070 moving and resizing GPU_circles is alot faster cuz it doesnt recompile to change them. Instead, moved (y,x,radius) of each circle into the up to 1000 dimensions.
	mergedGpuCode += n+'circY = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_y)+'];';
	mergedGpuCode += n+'circX = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_x)+'];';
	mergedGpuCode += n+'circR = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_r)+'];';
	numGpuUniformVars += dagball.varsPerCircIntoGpu;
	//mergedGpuCode += n+"circY = "+TinyGlsl.jsNumToGlslFloat(circ.y)+";";
	//mergedGpuCode += n+"circX = "+TinyGlsl.jsNumToGlslFloat(circ.x)+";";
	//mergedGpuCode += n+"circR = "+TinyGlsl.jsNumToGlslFloat(circ.r)+";";
	
	mergedGpuCode += n+"circInfluence = "+TinyGlsl.jsNumToGlslFloat(circ.influence)+";";
	mergedGpuCode += n+'circWindow = (length(vec2(circY-y,circX-x))<circR ? 1. : 0.); //FIXME smoother near edges';
	//mergedGpuCode += n+'circWindow = 1.; //FIXME';
	mergedGpuCode += n+'potenCirc = 0.; //in case user code uses += or doesnt set it.';
	let nextCircO = numGpuUniformVars + circ.edsOut.length;
	*/

	/*let funcDoubleHeightmapNumbersToPotentialEnergy =
	`{func TODO how to take 4 params? heightA heightB pixDist pixBal
		return potentialEnergy of those 4 numbers
	}`;*/
	//`{func
	//	TODO func of 4 numbers, or is it n*4 numbers, to 1 number. The n*4 should be a separate func. They are just combined with scaledTanh (order doesnt matter within each 1 of 4 numbers groups)
	//}`;

	/*
	//equals x in range -.5 to .5. Smoothly returns between -1 to 1 as x ranges -Infinity to Infinity.
	let straightenedMiddleTanhPlusMinusTwo = x =>((x < -0.5) ? ((Math.tanh((x + 0.5) * 2) - 1) / 2) : ((x > 0.5) ? ((Math.tanh((x - 0.5) * 2) + 1) / 2) : x));

	//equals x in range -1 to 1. Smoothly returns between -2 to 2 as x ranges -Infinity to Infinity.
	let straightenedMiddleTanhPlusMinusOne x=>{
		if(x < -1) return Math.tanh(x+1)-1;
		if(x > 1) return Math.tanh(x-1)+1;
		return x;
	};
	let straightenedMiddleTanhPlusMinusOne = x=>((x<-1) ? (Math.tanh(x+1)-1) : ((x>1) ? (Math.tanh((x-1)+1) : x)));

	{?: {fless x 1} {f- {tanh {f+ x 1}} 1} {?: {fmore x 1} {f+ {tanh {f- x 1}} 1} x}}
	{?: {fless x 1} {f- {tanh {f+ x 1}} 1} {?: {fmore x 1} {f+ {tanh {f- x 1}} 1} x}}
	*/

	//circsCode FIXME make it write potenCirc and more generally need a way to write any number of float vars
	//TODO indent? Its generated code, but i do need to read it on browser console etc for now (2023-11-8).
	//can do this cuz the Ap.Ape GPU programming language is partly homoiconic https://en.wikipedia.org/wiki/Homoiconicity
	//but finite and knows its sizes of mem and time and number of GPU threads, and doesnt have lisp-like pointers to cons nodes,
	//but its nodes can be used like that before compiled to GLSL/GPU code, by using Ap.Ape objects.
	//let circsCode = circApes.join('\n'); //as of 2023-12-7 this is (may be buggy) the NEW/NEXT LANGUAGE
	//convert it to OLD/ORIGINAL LANGUAGE cuz the coce below it fits in is that way, before converting it all to NEW/NEXT LANGUAGE at end of this func.
	//circsCode = Ap.stringFromNextLanguage(circsCode);
	
	if(!circApes.length){
		console.warn('WARNING: In dagball.View.prototype.updateLocalFields circApes is empty which 2024-2 breaks the GPU code.');
	}

	let circsCodeForGpu = circApes.map(a=>{
		if(a.apeType=='gpucpu'){
			if(a.childs.length != 2){
				throw 'apeType=gpucpu must have 2 childs, first is code that can run on gpu or cpu, then more cpu code. numChilds='+a.childs.length;
			}
			return a.childs[0]; //code that can run on gpu or cpu. a.childs[1] is more cpu code.
		}else{
			return a;
		}
	}).join('\n'); //as of 2023-12-7 this is (may be buggy) the NEW/NEXT LANGUAGE
	//convert it to OLD/ORIGINAL LANGUAGE cuz the coce below it fits in is that way, before converting it all to NEW/NEXT LANGUAGE at end of this func.
	circsCodeForGpu = Ap.stringFromNextLanguage(circsCodeForGpu);
	let circsCodeForCpu = circApes.join('\n'); //all of it
	circsCodeForCpu = Ap.stringFromNextLanguage(circsCodeForCpu);

	//TODO if moreGpuThreadsByForkBalls then the potens/gradient/physics calculation returns numBalls*(numDimensions+1) floats
	//instead of numDimensions+1 floats with all balls summed into each. You can merge the numBalls*(numDimensions+1) into numDimensions+1
	//by summing each numBalls floats. Its 1 float for each pair of ball_and_dimension.
	//Might be considered a bipartite-jacobian but thats probably not the right word?
	//The main purpose of this is to use more GPU threads so GPU cores dont go unused, so it runs alot faster, in theory.
	//Also there might be other calculations that can be layered on top of the numBalls*(numDimensions+1) floats, for future research?
	let moreGpuThreadsByForkBalls = document.getElementById('moreGpuThreadsByForkBalls').checked;

	let numBalls = dagball.balls.length; //TODO make this sparse by using dagball.view.balls which will be a subset of dagball.balls.

	//If isDoubleHeightmap (2024-1-6 that has never been coded, its all single heightmap so far, but tinyglsl does support 1 or 4 output
	//floats per GPU thread) then each ape in circApes should set heightA$ heightB$ pixDist$ pixBal$ (potenCirc will be derived from it),
	//else each should set potenCirc$.
	//If isDisplayElsePotensForGradient then it loops over varying y and x, else loops over balls.
	//freturn is ignored in circApes. freturn happens from the combined code,
	//either of ret=heightA retb=heightB retc=pixDist retd=pixBal (if isDoubleHeightmap && isDisplayElsePotensForGradient) else ret=potenSum.
	let codeMaker = function(circApes, isDoubleHeightmap, isDisplayElsePotensForGradient, isCpu){

		//TODO What did this cause, if anything, that its not doing anymore cuz i just changed this to canvasHeight()? let height = dagball.canvasWidth(); //If isDisplayElsePotensForGradient then number of GPU threads is height*width, else is numDimensions+1.
		let height = dagball.canvasHeight(); //If isDisplayElsePotensForGradient then number of GPU threads is height*width, else is numDimensions+1.
		let width = dagball.canvasWidth();
		let floatsPerBall = isDoubleHeightmap ? 3 : 2;
		let headerFloatsPerCirc = 4;
		let af = dagball.aftrans;

		//throw new Error('TODO use {loc} array (all parlocMem locparMem and locMem arrays are inside {loc} to copy from {par}. {loc} and {par} likely dont exist yet, their code is incomplete, exists in some places but not others. And it will require changing the mem type of some of the ap.ape code to use loc, at least in the gradient/potens code but use par in the display code cuz dont want to waste compute power copying it to loc if not adding gradient stuff to it.)');
		//(circHeaders parMem (numCircs ${circApes.length}) (headerFloatsPerCirc ${headerFloatsPerCirc}))
		//changing to locparMem 2023-11-16-517pET as experiment but it should probably go back to parMem
		//since i dont want the circles moving and resizing based on potentialEnergy, only when user changes them.
		//(circHeaders locparMem (numCircs ${circApes.length}) (headerFloatsPerCirc ${headerFloatsPerCirc}))
		let doAllPairsOfBalls = document.getElementById('doAllPairsOfBalls').checked && !!dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap;
		if(doAllPairsOfBalls){
			//let s = '(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap?';
			if(!dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap.includes('(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap?')){
				Err('dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap='+dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap);
			}
		}
		let numCurveGrabBalls = dagball.numCurveGrabBalls(); //in dagball.balls, those where ball.curveGrab exists, else its a normalBall.
		//cant have arrays size 0 in Ap language so added "&& numCurveGrabBalls>0".
		//${doCurveGrab?'(curveGrabMid locparMem (numCurveGrabs ${curveGrabMid}))':''} //0 apeSize not allowed. dont doCurveGrab if curveGrabMid==0
		let doCurveGrab = dagball.chk('doCurveGrab',true) && numCurveGrabBalls>0;
		//FIXME array indexs in updateGradientsInEdGroupsAndBallsAfterGPUComputesGradient may depend on balls array, circHeaders array, etc.
		//let circHeadersMemType = 'parlocMem'; //normal
		//let circHeadersMemType = 'locparMem'; //trying to fix bug 2023-12-2
		let circHeadersMemType = compileCircHeadersUsingLocMem ? 'locMem' : 'locparMem';
		//let extraFloatArrayToFixBugFIXME = '(extraFloatArrayToFixBugFIXME locparMem {300})'; //FIXME this is wasteful, takes this many dimensions of the 1000 of dagball
		let extraFloatArrayToFixBugFIXME = '';
		//let canvasScale = Math.sqrt(dagball.canvasScaleY*dagball.canvasScaleX); //ugly hack. FIXME
		let loopOverBalls = !isDisplayElsePotensForGradient && !moreGpuThreadsByForkBalls; //If moreGpuThreadsByForkBalls then fork more GPU threads instead of looping
		let extraGpuThreadsToForkBalls = !isDisplayElsePotensForGradient && moreGpuThreadsByForkBalls;
		//removed: (curveGrabLow locparMem numCurveGrabs)
		//removed: (curveGrabHigh locparMem numCurveGrabs)
		//TODO if curveGrabMid[i] is NaN aka != itself, then its a normalBall (which may be a rockPaperScissors ball depending on ball.team etc,
		//but as far as GPU is concerned it just rolls down hills), else is a curveGrabBall.
		
		//2024-9-27 and earlier. TODO change it to parlocMem, or better parMem, but parlocMem for now cuz par and loc
		//being different sizes is not well tested or doesnt align well with "gradient rects" on screen.
		//let vMemType = 'locparMem'; //2024-9-27 and earlier
		let vMemType = 'parlocMem'; //TODO trying this 2024-9-28+
		//let vMemType = 'parMem'; //TODO do this one longterm, but only after par and loc are reliable while being different sizes.
		//Also, keep in mind that (V ${vMemType} {1}) gets automatically replaced with some bigger size like (V ${vMemType} {50})
		//depending how many float literals get replaced by use of the V array.

		let code =
			`{doLast
				(balls locparMem (numBalls ${numBalls}) (floatsPerBall ${floatsPerBall}))
				(V ${vMemType} {1})
				${doCurveGrab?('(curveGrabMid locparMem (numCurveGrabs '+numCurveGrabBalls+'))'):''
					//0 apeSize not allowed. dont doCurveGrab if curveGrabMid==0
				}

				(circHeaders ${circHeadersMemType} (numCircs ${circApes.length}) (headerFloatsPerCirc ${headerFloatsPerCirc}))
				(aftrans locparMem {4})
				${extraGpuThreadsToForkBalls?('(forkedBallId int {imod {id} '+numBalls+'})'):''}
				${(isDoubleHeightmap && !isDisplayElsePotensForGradient)?(
		'		(ballBal float)'
				):(
				''
				)}
				{+
					<(epsilon float) ${dagball.game.floatEpsilon}>
					${isDisplayElsePotensForGradient?(
					//'<(isDisplayElsePotensForGradient float) 1>'//'//no gradient code cuz is for display'
					//FIXME dont copy par to loc in display, and use different Mem types (auto convert some of them), for efficiency.
					//Put these 4 42s here so display and physics have the same number of V vars.
		`			(ignoreTheseAddingExtraVarsSoGraphicsAndPhysicsHaveSameNumberOfVVars f+ 42 42 42 42)
					<(isDisplayElsePotensForGradient float) 1>
					{* (gradientCopyIndexUglyHackForDisplay copy {par})
						<[{loc} gradientCopyIndexUglyHackForDisplay] [{par} gradientCopyIndexUglyHackForDisplay]>
					}
		`
					):(
					/* From Ap.doApeTests() passed 2023-11-16:
					Ap.lazyEval(`
						{+
							<(epsilon float) 1>
							(arrayX parMem {4})
							(arrayLocA locMem {2})
							(arrayLocB locMem {2})
							<(countLoops float)	0>
							{* (gradientCopyIndex copy {par})
								<[{loc} gradientCopyIndex] {f+
									[{par} gradientCopyIndex]
									{?: {i== gradientCopyIndex {id}} epsilon 0}
								}>
							}
							{freturn [arrayLocA 0%2] [arrayLocA 1%2] [arrayLocB 0%2] [arrayLocB 1%2]}
						}
					`).setThreadsFloats(5,4).putFloats('arrayX',[100,200,300,400]).evalTest().
						testGet(0,101).testGet(1,200).testGet(2,300).testGet(3,400).
						testGet(4,100).testGet(5,201).testGet(6,300).testGet(7,400).
						testGet(8,100).testGet(9,200).testGet(10,301).testGet(11,400).
						testGet(12,100).testGet(13,200).testGet(14,300).testGet(15,401).
						testGet(16,100).testGet(17,200).testGet(18,300).testGet(19,400).
						log('Test pass: copy par to loc with +epsilon in 5 GPU threads and array size 4 so at most 1 float gets +epsilon in each thread. See dagball codeMaker.');
					*/

					//up to 1000 dimensional calculus gradient (todo exactly how many dims, say in this comment? get par size)

					/*
					2023-11-18 this is the code that causes the error cuz when i replaced it with '' the error didnt happen.
					[Violation] 'requestAnimationFrame' handler took 72ms
					51[.WebGL-00006A6800296200] GL_INVALID_OPERATION: Error: 0x00000502, in ..\..\third_party\angle\src\libANGLE\renderer\d3d\d3d11\Context11.cpp,
					triggerDrawCallProgramRecompilation:1041. Internal D3D11 error: HRESULT: 0x80004005: Error compiling dynamic pixel executable
		`			<(isGradientElseDisplay float) 1>
					{* (gradientCopyIndex copy {par})
						<[{loc} gradientCopyIndex] {f+
							[{par} gradientCopyIndex]
							{?: {i== gradientCopyIndex {id}} epsilon 0}
						}>
					}
		`*/
					//'' //FIXME
		/*			This code, where all i did is change (gradientCopyIndex copy {par}) to (gradientCopyIndex copy {loc}), doesnt have that error,
					so im guessing par and loc are the wrong sizes OR glsl compiler is not verifying the sizes even though they are correct (if they are)
					since glsl will not prove every true statement and may just do the safe thing and refuse to run code it cant prove memory fencing on,
					or something like that? TODO figure out why that 1 line code change stops the error.
					Either way its still giving all 0s as output, which is a later problem to solve.
					Or maybe its that par is bigger than loc since I wrote these
					(balls parMem (numBalls ${numBalls}) (floatsPerBall ${floatsPerBall}))
					(circHeaders parMem (numCircs ${circApes.length}) (headerFloatsPerCirc ${headerFloatsPerCirc}))
					but they should be locparMem or parLocMem, and only use parMem for display, not for gradient.
					TODO verify that in gradient code, theres no parMem.
					...
		`			<(isGradientElseDisplay float) 1>
					{* (gradientCopyIndex copy {loc})
						<[{loc} gradientCopyIndex] {f+
							[{par} gradientCopyIndex]
							{?: {i== gradientCopyIndex {id}} epsilon 0}
						}>
					}
		`*/
		`			<(isDisplayElsePotensForGradient float) 0>
					{* (gradientCopyIndex copy {par})
						<[{loc} gradientCopyIndex]
							${dagball.chk('gpuAddEpsilonForGradient',true)?
							`{f+
								[{par} gradientCopyIndex]
								{?: {i== gradientCopyIndex ${extraGpuThreadsToForkBalls ? '{i/ {id} '+numBalls+'}' : '{id}'}} epsilon 0}
							}`: //normal
							'[{par} gradientCopyIndex]' //0 gradient for testing, dont add epsilon
							}
						>
					}
		`
		/*`			<(isDisplayElsePotensForGradient float) 0>
					{* (gradientCopyIndex copy {par})
						<[{loc} gradientCopyIndex] [{par} gradientCopyIndex]>
					}
		`*/
					)}
					${doAllPairsOfBalls?(
		'			'+dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap
					):(
					''
					)}
					${circHeadersContents.map((num,index)=>('<[circHeaders '+index+'] '+TinyGlsl.jsNumToGlslFloat(num)+'>')).join('\n')}
					{*
						${(!loopOverBalls)?(
		'				(loopSize1TodoRemoveLoopInThisCase 1)'
						):(
		'				numBalls'
						)}
						{+
							<(heightASum float) 0>
							<(heightBSum float) 0>
							<(pixDistSum float) 0>
							<(pixBalSum float) 0>
							${isDisplayElsePotensForGradient?(
		`					<(pixelY float) {i/ {id} {size {${width}}}}>
							<(pixelX float) {imod {id} {size {${width}}}}>
							<(afAddY float) [aftrans 0]>
							<(afAddX float) [aftrans 1]>
							<(afMagnifyY float) [aftrans 2]>
							<(afMagnifyX float) [aftrans 3]>
							<(y float) {f/ {f- pixelY afAddY} afMagnifyY}>
							<(x float) {f/ {f- pixelX afAddX} afMagnifyX}>
		`
		/*`					<(pixelY float) {i/ {id} {size {${width}}}}>
							<(pixelX float) {imod {id} {size {${width}}}}>
							<(afAddY float) ${TinyGlsl.jsNumToGlslFloat(af.addY)}>
							<(afAddX float) ${TinyGlsl.jsNumToGlslFloat(af.addX)}>
							<(afMagnifyY float) ${TinyGlsl.jsNumToGlslFloat(af.magnifyY)}>
							<(afMagnifyX float) ${TinyGlsl.jsNumToGlslFloat(af.magnifyX)}>
							<(y float) {f/ {f- pixelY afAddY} afMagnifyY}>
							<(x float) {f/ {f- pixelX afAddX} afMagnifyX}>
		`*/
							):(
		`					<(y float) [balls ${extraGpuThreadsToForkBalls?'forkedBallId':'numBalls'} 0%${floatsPerBall}]>
							<(x float) [balls ${extraGpuThreadsToForkBalls?'forkedBallId':'numBalls'} 1%${floatsPerBall}]>
		`
							)}
							<(potenOne float) 0>
							{listLoop
								numCircs
								{+
									<(cy float) [circHeaders numCircs 0%${headerFloatsPerCirc}]>
									<(cx float) [circHeaders numCircs 1%${headerFloatsPerCirc}]>
									<(cr float) [circHeaders numCircs 2%${headerFloatsPerCirc}]>
									<(circInfluence float) [circHeaders numCircs 3%${headerFloatsPerCirc}]>
									<(circWindow float) {?: {fless {fhypot {f- cy y} {f- cx x}} cr} 1 0}>
									<(potenCirc float) 0>
								}
								${ //{listLoop counter beforeEachItem afterEachItem items...}\
								//so beforEachItem and afterEachItem must each be 1 thing (put in {+...} if multiple). circsCode is items.
								isDoubleHeightmap?(
			`					{+
									{f+= heightASum {fxtanh heightA}}
									{f+= heightBSum {fxtanh heightB}}
									{f+= pixDistSum {fxtanh pixDist}}
									{f+= pixBalSum {fxtanh pixBal}}
								}
			`
								):(
			//'					{f+= potenOne {f* {fxtanh potenCirc} circWindow circInfluence}}'
			'					{f+= potenOne {f* potenCirc circInfluence circWindow}}' //2023-12-5
			//`					{f+= potenOne {f* {ftanh {f* ${dagball.mulPotenCircInsideTanhBeforeMulInfluence} potenCirc}} circInfluence circWindow}}` //2024-2-23
			//'					{f+= potenOne potenCirc}' //FIXME
			//'					{f+= potenOne potenCirc}'
								)}
								${isCpu ? circsCodeForCpu : circsCodeForGpu}
							}
							${isDoubleHeightmap?(
							/*<(heightOfCurvyDitch3dThatHelpsBallRollBetweenThe2Heightmaps float) {f+
								TODO when ballZ is less than both ditches or more than both ditches steep hill.
								When ballZ is between the 2 ditches but not near either, a flat sigmoidlike hill.
								When ball is near either ditch, an upsidedown bellcurve or smooth small valley.
								FIXME but for now (see code below that sets heightOfCurvyDitch3dThatHelpsBallRollBetweenThe2Heightmaps)
								just do it as 2 upsidedown bellcurves.
								<(heightOfCurvyDitch3dThatHelpsBallRollBetweenThe2Heightmaps float) {f+
									{f* -.1 {fexp {f* -.5 {** {f- ballZ ditchAZ} 2}}}}
									{f* -.1 {fexp {f* -.5 {** {f- ballZ ditchBZ} 2}}}}
								}>
							}>
							*/
			`				<(heightA float) {fxtanh heightASum}>
							<(heightB float) {fxtanh heightBSum}>
							<(pixDist float) {fsigmoid pixDistSum}>
							<(pixBal float) {fsigmoid pixBalSum}>
							<(ditchAChance float) pixBal>
							<(ditchBChance float) {f- 1 pixBal}>
							<(ditchMul float) -.1>
							<ballBal {fxtanh ballBal}>
							<(linearInterpolatedBetween2HeightmapsAtYX float) {f+
								{f* heightA ballBal}
								{f* heightB {f- 1 ballBal}}
							}>
							<(ditchAZ float) {f* -.5 pixDist}>
							<(ditchBZ float) {f* .5 pixDist}>
							<(ballZ float) ballBal>
							<(heightOfCurvyDitch3dThatHelpsBallRollBetweenThe2Heightmaps float) {f+
								{f* ditchMul ditchAChance {fexp {f* -.5 {** {f- ballZ ditchAZ} 2}}}}
								{f* ditchMul ditchBChance {fexp {f* -.5 {** {f- ballZ ditchBZ} 2}}}}
							}>
							<potenOne {f+
								linearInterpolatedBetween2HeightmapsAtYX
								heightOfCurvyDitch3dThatHelpsBallRollBetweenThe2Heightmaps
							}>
			`
							):(
			//'				<potenOne {fxtanh potenOne}>'
			//'				<potenOne 3.1>'
							''
							)}

							${doAllPairsOfBalls?(
			`				{* (otherBall copy numBalls) {+
								${isDisplayElsePotensForGradient?(
			'					<(otherBallWeight float) 1>'
								):(
			`					<(otherBallWeight float) {?: {i== otherBall ${extraGpuThreadsToForkBalls?'forkedBallId':'numBalls'}} 0 1}>`
								)}
								<(otherBallY float) [balls otherBall 0%${floatsPerBall}]>
								<(otherBallX float) [balls otherBall 1%${floatsPerBall}]>
								<(ballOrDisplayYX_vs_otherBall_distance float) {fhypot {f- y otherBallY} {f- x otherBallX}}>
								{f+= potenOne {f* otherBallWeight
									{@addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap ballOrDisplayYX_vs_otherBall_distance}
								}}
							}}
			`
							/*{f+= potenOne {fxtanh {f* otherBallWeight
								{@addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap ballOrDisplayYX_vs_otherBall_distance}
							}}}
							{f+= potenOne {f* otherBallWeight ballOrDisplayYX_vs_otherBall_distance}}
							*/
							):(
							'' //NOT_doAllPairsOfBalls
							)}
							${(!isDisplayElsePotensForGradient&&doCurveGrab)?(
								//FIXME this is incomplete curveGrab code. it shouldnt run for every ball. numCurveGrabbers <= numBalls, but for now 2024-4-20 they equal.
								//FIXME this isnt using curveGrabLow or curveGrabHigh, is just doing a hardcoded leastsquares of hardcoded strength for testing.
								//`<potenOne {f* 3.5 {f** {f- potenOne [curveGrabMid ${extraGpuThreadsToForkBalls?'forkedBallId':'numBalls'}]} 2}}>`
								//`<potenOne {f* .035 {f** {f- potenOne 2.7} 2}}>`
								//`<potenOne {f* .35 {f** {f- potenOne {f- {fmod ${extraGpuThreadsToForkBalls?'forkedBallId':'numBalls'} 2} .5}} 2}}>`

								//as of 2024-4-22, curveGrabMid is displayed as a thin cone up from ball center when the displayBallCircs checkbox is checked,
								//and its color direction is same as the circle around the ball but brightness of that thin code is ball.curveGrab[1] aka its mid of 0 1 2.
								`<potenOne {f* 2.35 {f** {fabs {f- potenOne [curveGrabMid ${extraGpuThreadsToForkBalls?'forkedBallId':'numBalls'}]}} 2}}>`
								
								
								//`<potenOne {f* potenOne [curveGrabMid ${extraGpuThreadsToForkBalls?'forkedBallId':'numBalls'}]}>`
								
								
								//`<potenOne {f* potenOne -1}>`
							):''}

							{f+= (potenSum float) potenOne}
						}
					}
					${extraFloatArrayToFixBugFIXME}
					${(isDoubleHeightmap && isDisplayElsePotensForGradient)?(
			'			{freturn heightA heightB pixDist pixBal}'
					):(
						(dagball.chk('testRetPar',false)?
			'			{freturn [{par} {id}]}': //FIXME remove this test
			'			{freturn potenSum}') //normal as of 2024-5-16

			//'			{freturn .567}'
			//`			(copyOfId int {id})
			//			{freturn [{par} copyOfId]}`
			//`			(copyOfId int {id})
			//			{freturn [balls 0%10000]}`
					)}
				}
			}`;
		let stringsItMustNotContain = [' c0>']; //if it has a " c0>" then it should have contained " 0>" instead. c0 may be id of the float literal 0, though im not sure if I want to keep it that way or if it was a bug that made it that way or just something I coded and didnt think much about. First letter in id is syncType.
		for(let s of stringsItMustNotContain){
			if(code.includes(s)){
				Err('codeMaker generated code (before stringToNextLanguage) contains "'+s+'", code='+code);
			}
		}
		code = Ap.stringToNextLanguage(code);
		return code;
	};

	//TODO dagball.updateApCallBeforeEval(apCall, new Set(['balls','par','loc','big']), dagball.view.circs, dagball.balls);
	//TODO apCall.numGpuThreads = height*width;

	let singleHeightmapDisplay_apCode = codeMaker(circApes, false, true, false);
	if(dagball.log_updateLocalFields_apCode) console.log('singleHeightmapDisplay_apCode='+singleHeightmapDisplay_apCode);
	//console.log('abcxyz singleHeightmapDisplay_apCode='+singleHeightmapDisplay_apCode);

	//TODO use dagball.isDoubleHeightmap but as of 2023-11-13 neither one works (cuz Ape.js upgrade is incomplete)
	//and trying to get single (dagball.isDoubleHeightmap==false) working first.
	//let codeMaker = function(circApes, isDoubleHeightmap, isDisplayElsePotensForGradient)
	let singleHeightmapPotentialEnergiesForGradient_apCode = codeMaker(circApes, false, false, false);
	if(dagball.log_updateLocalFields_apCode) console.log('singleHeightmapPotentialEnergiesForGradient_apCode='+singleHeightmapPotentialEnergiesForGradient_apCode);

	//this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient.floatsPerGpuThread = 1;
	//console.log('Compiling before set this.mergedApCalls.singleHeightmapDisplay');
	this.mergedApCalls.singleHeightmapDisplay = Ap.lazyEval(singleHeightmapDisplay_apCode);
	let transformFloatValsToVArray = dagball.chk('transformFloatValsToVArray',dagball.default_transformFloatValsToVArray);
	if(transformFloatValsToVArray){
		//Err('Was toMemV upgraded in the 5+ kinds of eval redesign?');
		console.error('if(transformFloatValsToVArray) Was toMemV upgraded in the 5+ kinds of eval redesign?');
		this.mergedApCalls.singleHeightmapDisplay_transformFloatValsToVArray = this.mergedApCalls.singleHeightmapDisplay.ape.dedupByName().toMemV(); //an Ap.Call that has 'V' array filled in with constants like 2.34 from the code that becomes [V 15] etc. like Ap.lazyEvalV.
		
		//this.mergedApCalls.singleHeightmapDisplay_transformFloatValsToVArray = this.mergedApCalls.singleHeightmapDisplay.ape.toMemV(); //an Ap.Call that has 'V' array filled in with constants like 2.34 from the code that becomes [V 15] etc. like Ap.lazyEvalV.
		//this.mergedApCalls.singleHeightmapDisplay_transformFloatValsToVArray = this.mergedApCalls.singleHeightmapDisplay.ape.transformFloatValsToVArray(); //an Ap.Call
		//this.mergedApCalls.singleHeightmapDisplay_transformFloatValsToVArray = this.mergedApCalls.singleHeightmapDisplay.transformFloatValsToVArray(); //an Ap.Call
	}else{
		this.mergedApCalls.singleHeightmapDisplay_transformFloatValsToVArray = null;
	}
	//this.mergedApCalls.singleHeightmapDisplay.floatsPerGpuThread = 1;
	//the doubleHeightmap for display will have 4 floatsPerGpuThread, but the other 3 kinds (including doubleHeightmap for gradient) all are floatsPerGpuThread 1.

	
	//console.log('Compiling before set this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient');
	let gradientCall = Ap.lazyEval(singleHeightmapPotentialEnergiesForGradient_apCode);
	let numberOfParMems = gradientCall.ape.searchApes(ape=>(ape.apeType=='parMem')).length;
	if(moreGpuThreadsByForkBalls){
		//FIXME this is done in gradient function, not here... gradientCall.numGpuThreads *= numBalls;
	}else{
		if((gradientCall.par.memSize > gradientCall.loc.memSize) || numberOfParMems){
			throw 'gradientCall.par.memSize('+gradientCall.par.memSize+') > gradientCall.loc.memSize('+gradientCall.loc.memSize+') (this doesnt apply to display, only gradient/potens). gradientCall must have loc.memSize >= par.memSize cuz the gradient calculation copies from par to loc and adds epsilon to 1 of those depending on which GPU thread aka {id}. It must also have no parMem (counted numberOfParMems='+numberOfParMems+') (allow parlocMem and locparMem cuz those exist in both par and loc, and allow locMem cuz that is after par size, but no parMem cuz that would get copied into loc where theres no matched parlocMem or locparMem, so copied over the wrong arrays or even outside of loc memory, resulting in glsl dropping the gl context). See the Ap.js test "copy par to loc with +epsilon in 5 GPU threads and array size 4 so at most 1 float gets +epsilon in each thread. See dagball codeMaker" for how that copying between par and loc and the adding of epsilon is supposed to work. ape='+gradientCall.ape;
		}
	}
	this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient = gradientCall;
	if(transformFloatValsToVArray){
		this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient_transformFloatValsToVArray =
			this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient.ape.dedupByName().toMemV(); //an Ap.Call that has 'V' array filled in with constants like 2.34 from the code that becomes [V 15] etc. like Ap.lazyEvalV.
			//this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient.ape.toMemV(); //an Ap.Call that has 'V' array filled in with constants like 2.34 from the code that becomes [V 15] etc. like Ap.lazyEvalV.
			//this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient.ape.transformFloatValsToVArray(); //an Ap.Call
			//this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient.transformFloatValsToVArray(); //an Ap.Call
	}else{
		this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient_transformFloatValsToVArray = null;
	}
	if(transformFloatValsToVArray){
		console.log('After codeMaker, created 2 transformFloatValsToVArray [Ap.Call]s which should already (TODO) have their V parMem floats already filed in.');
	}
	//dagball.updateApCallBeforeEval(this.mergedApCalls.singleHeightmapPotentialEnergiesForGradient,
	//	new Set(['balls','par','loc','big']), this.circs, dagball.balls);
	
	//let singleHeightmapCpuDiffeq_apCode = codeMaker(circApes, false, false, true); //isDoubleHeightmap isDisplayElsePotensForGradient isCpu
	let singleHeightmapCpuDiffeq_apCode = codeMaker(circApes, false, true, true); //isDoubleHeightmap isDisplayElsePotensForGradient isCpu. use display code so doesnt do gradient.
	this.mergedApCalls.singleHeightmapCpuDiffeq = Ap.lazyEval(singleHeightmapCpuDiffeq_apCode, 'js');
	if(this.mergedApCalls.singleHeightmapCpuDiffeq.code.includes('int ')){ //test that [true preferCpu so lang is 'js'] worked.
		Err('Did not create js code for singleHeightmapCpuDiffeq in:\n'+this.mergedApCalls.singleHeightmapCpuDiffeq.code);
	}
	if(transformFloatValsToVArray){ //adding this 2024-9-29 trying to fix bug "2024-9-29 V array broken when used with diffeq - it appears the bug is that diffeq does not use the expanded V array cuz the V array starts as size 1 in ape and is later expanded.".
		this.mergedApCalls.singleHeightmapCpuDiffeq_transformFloatValsToVArray =
			this.mergedApCalls.singleHeightmapCpuDiffeq.ape.dedupByName().toMemV(); //an Ap.Call that has 'V' array filled in with constants like 2.34 from the code that becomes [V 15] etc. like Ap.lazyEvalV.
	}else{
		this.mergedApCalls.singleHeightmapCpuDiffeq_transformFloatValsToVArray = null;
	}
	/*
	this.mergedApCalls.singleHeightmapCpuDiffeq = Ap.lazyEval(singleHeightmapCpuDiffeq_apCode);
	let prevLangBefore_singleHeightmapCpuDiffeq = Ap.lang; //probably 'glsl'.
	try{
		Ap.lang = 'js';
		this.mergedApCalls.singleHeightmapCpuDiffeq.updateCode(); //updates this.mergedApCalls.singleHeightmapCpuDiffeq.code and .beforeCode based on Ap.lang. Ugly hack.
	}finally{
		Ap.lang = prevLangBefore_singleHeightmapCpuDiffeq;
	}*/
	/*let prevLangBefore_singleHeightmapCpuDiffeq = Ap.lang; //probably 'glsl'.
	try{
		Ap.lang = 'js';
		this.mergedApCalls.singleHeightmapCpuDiffeq = Ap.lazyEval(singleHeightmapCpuDiffeq_apCode);
		if(this.mergedApCalls.singleHeightmapCpuDiffeq.code.includes('int ')){
			Err('Did not create js code for singleHeightmapCpuDiffeq in:\n'+this.mergedApCalls.singleHeightmapCpuDiffeq.code);
		}
	}finally{
		Ap.lang = prevLangBefore_singleHeightmapCpuDiffeq;
	}*/


	//console.log('Did set those in this.mergedApCalls. Next step is to put floats in them (to fill (from circ edges) the float arrays inside the bigger shared parMem locMem parlocMem locparMem and bigMem arrays), then call GPU to get Float32Arrays out, then update floats in the (dagball.Circ)s edges and update canvas pixels.');

	//debugger;

	/*
	//throw 'FIXME do singleHeightmapDisplay (not potenForGradientCode) instead, and use a ${""+apeA+apeB+apeC} etc to put the ape code string in there';
	let singleHeightmapDisplay_apeCode =
		`{doLast
			(balls locparMem (numBalls 20) (floatsPerBall 2))
			(circHeaders parMem (numCircs 2) (headerFloatsPerCirc 4))
			(y float)
			(x float)
			{+
				{*
					numBalls
					{+
						<y [balls numBalls 0%floatsPerBall]>
						<x [balls numBalls 1%floatsPerBall]>
						<(potenOne float) 0>
						{listLoop
							numCircs
							{+
								<(circY float) [circHeaders numCircs 0%headerFloatsPerCirc]>
								<(circX float) [circHeaders numCircs 1%headerFloatsPerCirc]>
								<(circR float) [circHeaders numCircs 2%headerFloatsPerCirc]>
								<(circInfluence float) [circHeaders numCircs 3%headerFloatsPerCirc]>
								<(circWindow float) {?: {fless {hypot {f- circY y} {f- circX x}} circR} 1 0}>
							}
							{f+= potenOne {f* (potenCirc float) circWindow circInfluence}}	
							${circsCode}
						}
						{f+= (potenSum float) potenOne}
					}
				}
				{freturn potenSum}
			}
		}`;
	
	console.log('singleHeightmapDisplay_apeCode='+singleHeightmapDisplay_apeCode);
	*/
	//throw 'FIXME verify singleHeightmapDisplay_apeCode is what i want, then Ap.lazyEval it and so on';
	/*2023-11-8-608pET
	TinyGLSL tests starting before dagball
	Dagball087.html:1639 Dagball starting
	Ape.js:1662 parOnlyMem=(matAB parMem (matDimA 3) (matDimB 10))
	Ape.js:1662 parOnlyMem=(matBC parMem (matDimB 10) (matDimC 7))
	Ape.js:1678 locOnlyMem=(matAC locMem (matDimA 3) (matDimC 7))
	Dagball087.html:5021 singleHeightmapDisplay_apeCode={doLast
				(balls locparMem (numBalls 20) (floatsPerBall 2))
				(circHeaders parMem (numCircs 2) (headerFloatsPerCirc 4))
				(circY float)
				(circX float)
				(circR float)
				(circInfluence float)
				(circWindow float)
				(potenCirc float)
				(potenOne float)
				(potenSum float)
				(y float)
				(x float)
				{*
					numBalls
					{+
						<y [balls numBalls 0]>
						<x [balls numBalls 1]>
						<potenOne 0>
						{listLoop
							numCircs
							{+
								<circY [circHeaders numCircs 0]>
								<circX [circHeaders numCircs 1]>
								<circR [circHeaders numCircs 2]>
								<circInfluence [circHeaders numCircs 3]>
								<circWindow {?: {fless {hypot {f- circY y} {f- circX x}} circR} 1 0}>
							}
							{f+= potenOne {f* potenCirc circWindow circInfluence}}	
							(c4_null doLast (c4_matAB parMem (c4_matDimA 3) (c4_matDimB 10)) (c4_matBC parMem c4_matDimB (c4_matDimC 7)) (c4_matAC locMem c4_matDimA c4_matDimC) (c4_matmulABCLoop * c4_matDimA c4_matDimC c4_null))
						}
						{f+= potenSum potenOne}
					}
				}
				{freturn potenSum}
			}
	Dagball087.html:1575 dagball.mainLoop stopped cuz error. Edit textarea to start mainLoop again. This will happen thru dagball.wasErrorNeedMainLoopRestart. See line number in generated tinyGlsl GPU code on browser console to know what to fix.
	Dagball087.html:1576 Uncaught FIXME verify singleHeightmapDisplay_apeCode is what i want, then Ap.lazyEval it and so on
	*/

	/*let potenForGradientCode =
		`TODO this is getting complex. do a smaller test first.
		{doLast
			(numBalls 20)
			(floatsPerBall 2)
			(balls locparMem numBalls floatsPerBall)
			(numCircs 2)
			(headerFloatsPerCirc 4)
			(circHeaders parMem numCircs headerFloatsPerCirc)
			(circY float)
			(circX float)
			(circR float)
			(circInfluence float)
			(circWindow float)
			(potenCirc float)
			(potenOne float)
			(potenSum float)
			(y float)
			(x float)
			{*
				numBalls
				{+
					<y [balls numBalls 0]>
					<x [balls numBalls 1]>
					<potenOne 0>
					{listLoop
						numCircs
						{+
							<circY [circHeaders numCircs 0]>
							<circX [circHeaders numCircs 1]>
							<circR [circHeaders numCircs 2]>
							<circInfluence [circHeaders numCircs 3]>
							<circWindow {?: {fless {hypot {f- circY y} {f- circX x}} circR} 1 0}>
						}
						{f+= potenOne {f* potenCirc circWindow circInfluence}}	
						(simpleTestCirc doLast
							<potenCirc {sine {f* 33.4 {f- {f* x x (someVarABC locparMem) .1} {f* y y .1}}}}>
						)
						(matmulTestCirc doLast
							(matAB locparMem (matDimA 3) (matDimB 10))
							(matBC locparMem matDimB (matDimC 7))
							(matAC locMem matDimA matDimC)
							(matmulABCLoop *
								matDimA
								matDimC
								{+
									<(sumB float) 0>
									{*
										matDimB
										{f+= sumB {f*
											[matAB matDimA matDimB]
											[matBC matDimB matDimC]
										}}
									}
									<[matAC matDimA matDimC] sumB>
								}
							)
							<potenCirc [matAC 0 0]>
						)
					}
					{f+= potenSum potenOne}
				}
			}
			{freturn potenSum}
		}`;*/

	/*
	//let numGpuUniformVars = 0;
	//let numGpuLocalVars = 0; //FIXME
	let n = '\n		';
	//let mergedGpuCode = '//merging up to '+this.circs.length+' GPU codes (some might not contain GPU code so not appear below)...';
	for(let circ of this.circs){
		if(this.hasGpuCodeAndShouldUseIt(circ)){
			//FIXME todo numGpuLocalVars
			let preO = numGpuUniformVars; //circ starts at preO but is only allowed to use vars starting at o. dagball.varsPerCircIntoGpu_y _x _r (circ.y etc) go in pre.
			this.circToPreOffset.set(circ, preO);
			//TODO use par instead?, since its not affected by +epsilon 1000d calculus? Its meant to be readOnly.
			//let preVarsUseWhichArray = 'parr'; //is making the circs move and change size, likely by by calculus gradient, 2023-10-16.
			let preVarsUseWhichArray = 'par';
			//In Dagball 070 moving and resizing GPU_circles is alot faster cuz it doesnt recompile to change them. Instead, moved (y,x,radius) of each circle into the up to 1000 dimensions.
			mergedGpuCode += n+'circY = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_y)+'];';
			mergedGpuCode += n+'circX = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_x)+'];';
			mergedGpuCode += n+'circR = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_r)+'];';
			numGpuUniformVars += dagball.varsPerCircIntoGpu;
			//mergedGpuCode += n+"circY = "+TinyGlsl.jsNumToGlslFloat(circ.y)+";";
			//mergedGpuCode += n+"circX = "+TinyGlsl.jsNumToGlslFloat(circ.x)+";";
			//mergedGpuCode += n+"circR = "+TinyGlsl.jsNumToGlslFloat(circ.r)+";";
			
			mergedGpuCode += n+"circInfluence = "+TinyGlsl.jsNumToGlslFloat(circ.influence)+";";
			mergedGpuCode += n+'circWindow = (length(vec2(circY-y,circX-x))<circR ? 1. : 0.); //FIXME smoother near edges';
			//mergedGpuCode += n+'circWindow = 1.; //FIXME';
			mergedGpuCode += n+'potenCirc = 0.; //in case user code uses += or doesnt set it.';
			let nextCircO = numGpuUniformVars + circ.edsOut.length;
			//o is only used by older code, like parr[o++], not by dagball.Ape (new GPU language 2023-10+).
			mergedGpuCode += n+`o = ${numGpuUniformVars}; //next circ starts at ${nextCircO}. index in parr array this circ starts. You can use parr[o++] multiple times, for example.`;
			this.circToOffset.set(circ, numGpuUniformVars);

			let tinyGlslCode;
			//FIXME potenCirc is from old code. freturn is from new code. I want both to continue working. Cant return if code is getting merged.
			//So could just change 'return' to 'potenCirc += ' BUT that would create bugs if a var name contains return. TODO Do it for now. FIXME.
			if(circ.text.toLowerCase().startsWith('tinyglsl:')){
				//The old way, but its more flexible and more complex so keep it backwardCompatible.
				//FIXME isolate them in {...} or something. Do basic checks on them. TODO prevent some code from breaking other code. Its still webgl sandboxed in browser either way, unless u run it outside browser somehow.
				tinyGlslCodeFromCirc = this.removeUpToFirstColon(circ.text);
			}else if(circ.text.toLowerCase().startsWith('ape:')){
				//dagball.Ape is a new GPU language Y2023 that compiles to tinyGlsl and TODO could in theory compile to OpenCL (such as LazyCL which uses LWJGL2's OpenCL API) or other GPU languages later.
				let apeCode = this.removeUpToFirstColon(circ.text);
				//TODO cache the transpiling (of ape to tinyglsl), but only if it worked, and not until there havent been much bigs for a while, so dont have to transpile it again once per video frame.
				//FIXME if any var name includes return such as <(abreturncd float) 3>.
				//FIXME if theres return statement thats not at the end or multiple return statements.
				//let ape = dagball.parseApeCode(apeCode).toApe();
				//let ape = Ap.parse(apeCode).toApe();
				let call = Ap.lazyEval(apeCode);
				let ape = call.ape;
				tinyGlslCodeFromCirc = ape.toTinyGlslCode().replace('return ', 'potenCirc += '); //FIXMEFIXME use Ap.lazyEval(apeCode) instead. dont directly call tinyglsl from dagball. let ape do it.
				//TODO edGroup.pointAtYXR
				if(dagball.useEdGroups){
					if(dagball.logEdGroupStuff) console.log('ape.updateEdGroups(circ) after transpiled ape code to tinyGlsl code. This may change the number of lines (dagball.Ed) hanging off the circ. They are its parrMems, how it connects to other circs.');
					ape.updateEdGroups(circ);
				}
			}
			mergedGpuCode += n+tinyGlslCodeFromCirc;

			mergedGpuCode += n+'potenOne += circInfluence*circWindow*potenCirc; //potenSum is all balls. potenOne is inner loop of potentialEnergy. potenCirc is part of that inner loop for a specific circ. circ GPU code should set potenCirc, not those other vars.';
			numGpuUniformVars = nextCircO;
			
			//TODO more vars here, maybe some combo of potenOne, potenSum, o, parr[o++], etc?
			
		}
	}
	this.numGpuUniformVars = numGpuUniformVars;
	this.numGpuLocalVars = numGpuLocalVars; //FIXME
	this.mergedGpuCode = mergedGpuCode;


	/*
	let numGpuUniformVars = 0;
	let numGpuLocalVars = 0; //FIXME
	let n = '\n		';
	let mergedGpuCode = '//merging up to '+this.circs.length+' GPU codes (some might not contain GPU code so not appear below)...';
	for(let circ of this.circs){
		if(this.hasGpuCodeAndShouldUseIt(circ)){
			//FIXME todo numGpuLocalVars
			let preO = numGpuUniformVars; //circ starts at preO but is only allowed to use vars starting at o. dagball.varsPerCircIntoGpu_y _x _r (circ.y etc) go in pre.
			this.circToPreOffset.set(circ, preO);
			//TODO use par instead?, since its not affected by +epsilon 1000d calculus? Its meant to be readOnly.
			//let preVarsUseWhichArray = 'parr'; //is making the circs move and change size, likely by by calculus gradient, 2023-10-16.
			let preVarsUseWhichArray = 'par';
			//In Dagball 070 moving and resizing GPU_circles is alot faster cuz it doesnt recompile to change them. Instead, moved (y,x,radius) of each circle into the up to 1000 dimensions.
			mergedGpuCode += n+'circY = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_y)+'];';
			mergedGpuCode += n+'circX = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_x)+'];';
			mergedGpuCode += n+'circR = '+preVarsUseWhichArray+'['+(numGpuUniformVars+dagball.varsPerCircIntoGpu_r)+'];';
			numGpuUniformVars += dagball.varsPerCircIntoGpu;
			//mergedGpuCode += n+"circY = "+TinyGlsl.jsNumToGlslFloat(circ.y)+";";
			//mergedGpuCode += n+"circX = "+TinyGlsl.jsNumToGlslFloat(circ.x)+";";
			//mergedGpuCode += n+"circR = "+TinyGlsl.jsNumToGlslFloat(circ.r)+";";
			
			mergedGpuCode += n+"circInfluence = "+TinyGlsl.jsNumToGlslFloat(circ.influence)+";";
			mergedGpuCode += n+'circWindow = (length(vec2(circY-y,circX-x))<circR ? 1. : 0.); //FIXME smoother near edges';
			//mergedGpuCode += n+'circWindow = 1.; //FIXME';
			mergedGpuCode += n+'potenCirc = 0.; //in case user code uses += or doesnt set it.';
			let nextCircO = numGpuUniformVars + circ.edsOut.length;
			//o is only used by older code, like parr[o++], not by dagball.Ape (new GPU language 2023-10+).
			mergedGpuCode += n+`o = ${numGpuUniformVars}; //next circ starts at ${nextCircO}. index in parr array this circ starts. You can use parr[o++] multiple times, for example.`;
			this.circToOffset.set(circ, numGpuUniformVars);

			let tinyGlslCode;
			//FIXME potenCirc is from old code. freturn is from new code. I want both to continue working. Cant return if code is getting merged.
			//So could just change 'return' to 'potenCirc += ' BUT that would create bugs if a var name contains return. TODO Do it for now. FIXME.
			if(circ.text.toLowerCase().startsWith('tinyglsl:')){
				//The old way, but its more flexible and more complex so keep it backwardCompatible.
				//FIXME isolate them in {...} or something. Do basic checks on them. TODO prevent some code from breaking other code. Its still webgl sandboxed in browser either way, unless u run it outside browser somehow.
				tinyGlslCodeFromCirc = this.removeUpToFirstColon(circ.text);
			}else if(circ.text.toLowerCase().startsWith('ape:')){
				//dagball.Ape is a new GPU language Y2023 that compiles to tinyGlsl and TODO could in theory compile to OpenCL (such as LazyCL which uses LWJGL2's OpenCL API) or other GPU languages later.
				let apeCode = this.removeUpToFirstColon(circ.text);
				//TODO cache the transpiling (of ape to tinyglsl), but only if it worked, and not until there havent been much bigs for a while, so dont have to transpile it again once per video frame.
				//FIXME if any var name includes return such as <(abreturncd float) 3>.
				//FIXME if theres return statement thats not at the end or multiple return statements.
				//let ape = dagball.parseApeCode(apeCode).toApe();
				//let ape = Ap.parse(apeCode).toApe();
				let call = Ap.lazyEval(apeCode);
				let ape = call.ape;
				tinyGlslCodeFromCirc = ape.toTinyGlslCode().replace('return ', 'potenCirc += '); //FIXMEFIXME use Ap.lazyEval(apeCode) instead. dont directly call tinyglsl from dagball. let ape do it.
				//TODO edGroup.pointAtYXR
				if(dagball.useEdGroups){
					if(dagball.logEdGroupStuff) console.log('ape.updateEdGroups(circ) after transpiled ape code to tinyGlsl code. This may change the number of lines (dagball.Ed) hanging off the circ. They are its parrMems, how it connects to other circs.');
					ape.updateEdGroups(circ);
				}
			}
			mergedGpuCode += n+tinyGlslCodeFromCirc;

			mergedGpuCode += n+'potenOne += circInfluence*circWindow*potenCirc; //potenSum is all balls. potenOne is inner loop of potentialEnergy. potenCirc is part of that inner loop for a specific circ. circ GPU code should set potenCirc, not those other vars.';
			numGpuUniformVars = nextCircO;
			
			//TODO more vars here, maybe some combo of potenOne, potenSum, o, parr[o++], etc?
			
		}
	}
	this.numGpuUniformVars = numGpuUniformVars;
	this.numGpuLocalVars = numGpuLocalVars; //FIXME
	this.mergedGpuCode = mergedGpuCode;
	*/
};

dagball.View.prototype.numEds = function(){
	let sum = 0;
	for(let circ of this.circs){
		sum += circ.edsOut.length;
	}
	return sum;
};

dagball.cachedApeFuncJs_ = {};

//same string returns same js lambda, whatever apeFuncJs returned. FIXME clear that cache if theres too many?
dagball.cachedApeFuncJs = function(text){
	let evaled = dagball.cachedApeFuncJs_[text];
	if(!evaled){
		evaled = dagball.cachedApeFuncJs_[text] = dagball.apeFuncJs(text);
	}
	return evaled;
};

dagball.updateTextareaColorsEtc = function(){
	let selectedCircs = dagball.selectedCircs();
	let isError = dagball.wasErrorNeedMainLoopRestart; //FIXME is vs was error?
	let color;
	if(selectedCircs.length == 1){
		let textIsSame = selectedCircs[0].text == dagball.getTextareaText();
		//document.getElementById('mainEditTextarea').style.backgroundColor = textIsSame ? dagball.textareaBgColor_inSync : dagball.textareaBgColor_waitingOnButtonToCompile;
		let now = dagball.time();
		let freq = .4;
		let b;
		color = (!dagball.chk('semicolonCompiles',dagball.default_semicolonCompiles) || textIsSame) ?
			(isError ? dagball.textareaBgColor_inSync_error : dagball.textareaBgColor_inSync_worked) :
			dagball.colorStr((b=.95+.05*Math.sin(dagball.time()*2*Math.PI*freq))*.92, b*.96, b);
	}else{
		color = (isError ? dagball.textareaBgColor_inSync_error : dagball.textareaBgColor_inSync_worked);
	}
	document.getElementById('mainEditTextarea').style.backgroundColor = color;
	//document.getElementById('semicolonCompilesLabel').style.backgroundColor = color;
	document.getElementById('semicolonCompilesLabel').style.color = color;
	document.getElementById('showGlslCodeOfApesInRightTextareaLabel').style.color = color;
};

dagball.handleIf_wasErrorNeedMainLoopRestart = ()=>{
	if(dagball.wasErrorNeedMainLoopRestart){
		dagball.wasErrorNeedMainLoopRestart = false;
		console.log('dagball.wasErrorNeedMainLoopRestart restarting dagball.mainLoop()');
		dagball.updateTextareaColorsEtc();
		dagball.mainLoop();
		dagball.updateTextareaColorsEtc();
	}
};

dagball.Circ.prototype.cpuPotenAtZYX = function(z,y,x){
	//if(!this.cpuCall){
	//	Err('No this.cpuCall');
	//}
	//let hdrPtr = this.cpuCall.par.ptr('hdr');
	
	const call = this.cpuCall;
	const fl = call.par.floats;
	fl[0] = z; //observe z //this.cpuCall.par.floats[hdrPtr] = z; //observe z
	fl[1] = y; //observe y //this.cpuCall.par.floats[hdrPtr+1] = y; //observe y
	fl[2] = x; //observe z this.cpuCall.par.floats[hdrPtr+2] = z; //observe z
	//this.cpuCall.par.floats[hdrPtr+3] = this.influence;
	//this.cpuCall.par.floats[hdrPtr+4] = this.z; //cz, for if its a 3d sphere instead of 3d circle
	//this.cpuCall.par.floats[hdrPtr+5] = this.y; //cy
	//this.cpuCall.par.floats[hdrPtr+6] = this.x; //cx
	//this.cpuCall.par.floats[hdrPtr+7] = this.r; //cr, radius

	//this.cpuCall.par.put('cpuHeaders', [z,y,x]);
	//this.cpuCall.par.put('cpuHeaders', [y,x]);
	//return this.cpuCall.eval()[0];
	//return call.evan();
	return call.evanCpuMainParloc();
};


dagball.Game.prototype.nextState = function(dt){
	this.countNextState++;

	dagball.doAsaps(); //deleteCircle etc, if scheduled. This way it doesnt interfere with display and physics

	dagball.updateTextareaColorsEtc();

	let gamepadsEtc = dagball.getButtonsJoysticksEtc();
	for(let dimensionName in gamepadsEtc){
		dagball.directControls[dimensionName] = gamepadsEtc[dimensionName];
		//FIXME since didnt call dagball.afterEveryCanvasDomEvent(event); (cuz this happens every video frame, not on events),
		//the controlsChanged code might not work for it? dagball.update_prev_directControls(); is farther below in this same nextState func.
	}

	//if ball.curveGrab then those are first.
	//See balls array in codeMaker and curveGrabLow, curveGrabMid, and curveGrabHigh arrays parallel to balls array.
	dagball.sortBallsByCurveGrabFirst(); //TODO all balls will have 3 numbers (ball.y, ball.x, ball.curveGrab[1] aka targetPoten, and if targetPoten is NaN then its a normalBall)
	
	let cursorBall = dagball.balls[0];
	cursorBall.team = ALPHA; //team 3 so it doesnt change any balls team nor have its own team changed by them

	if(dagball.chk('gamepadBallsEtc',true)){
		dagball.doGamepadBallsEtc(dt);
	}

	if(dagball.screen){ //wait for canvas to exist. takes a fraction of a second when page loads
		if(dagball.clearTinyGlslCacheAtRandomTimes && (Math.random() < dt/dagball.clearTinyGlslCacheAtRandomTimes_aveSeconds)){ 
			console.log('TinyGlsl.clearAllCache() cuz dagball.clearTinyGlslCacheAtRandomTimes');
			//let bright = .7+.3*Math.random();
			//document.getElementById('clearTinyGlslCacheBtn').style.backgroundColor = dagball.colorStr(bright,bright,bright); //change brightness of that button randomly when auto clear tinyGlslCache
			dagball.clearTinyGlslCacheAndUpdateButton();
		}
		//document.getElementById('countNextState').innerHTML = this.ptr()+'.countNextState='+this.countNextState;
		//affects doPhysics and paintOntoByteRect by changing dagball.view to some list of nearby circles
		//that each may have their own GPU code to merge into a combined GPU code to TinyGlsl.simple together.
		
		let doUpdateView = dagball.chk('alwaysUpdateViewInNextState',false);
		let this_viewDedupString = null;
		if(!doUpdateView){
			this_viewDedupString = dagball.viewDedupString();
			if(this_viewDedupString != dagball.last_viewDedupString){
				dagball.last_viewDedupString = this_viewDedupString;
				doUpdateView = true;
			}
		}
		if(doUpdateView){
			console.log('doUpdateView, this_viewDedupString='+this_viewDedupString);
			dagball.updateView(); //creates EdGroups in Eds in Circs
		}else{
			console.log('NOT doUpdateView');
		}

		let newNcurve = dagball.view.numEds();
		if(this.nCurve != newNcurve){
			/*2023-10-23 this happened likely cuz of changing this.nCurve and something got out of sync, the par and parr float arrays created in GPU memory were probably smaller than it tried to read/write.
			No, it was caused by not updating dagball.game.pos and .vel when updated .nCurve. Fixed it with game.setNcurve func which updates those together.
			Dagball starting
			Dagball076.html:6603 ape.updateEdGroups(circ) after transpiled ape code to tinyGlsl code. This may change the number of lines (dagball.Ed) hanging off the circ. They are its parrMems, how it connects to other circs.
			Dagball076.html:4791 Updating Eds and EdGroups in a circ
			Dagball076.html:4820 Making edGroup for ape=(radiusesAndPhases parrMem (freqs 10) (floatsPerFreq 2)) in circ.eds[0..19], newEdGroup=[object Object]
			Dagball076.html:4820 Making edGroup for ape=(memXy parrMem {4}) in circ.eds[20..23], newEdGroup=[object Object]
			Dagball076.html:6644 dagball.Game.prototype.nextState changing game.nCurve from 40 to 84 cuz dagball.view.numEds(), FIXME make sure its not more than 1000 or whatever the limit is.
			Dagball076.html:2366 dagball.mainLoop stopped cuz error. Edit textarea to start mainLoop again. This will happen thru dagball.wasErrorNeedMainLoopRestart. See line number in generated tinyGlsl GPU code on browser console to know what to fix.
			Dagball076.html:1010 Uncaught Error: error X3504: literal loop terminated early due to out of bounds array access
			C:\fakepath(85,26-37): error X3696: infinite loop detected - loop never exits

			error X3504: literal loop terminated early due to out of bounds array access
			C:\fakepath(85,26-37): error X3696: infinite loop detected - loop never exits

			Warning: D3D shader compilation failed with default flags. (ps_5_0)
			Retrying with skip validation
			error X3504: literal loop terminated early due to out of bounds array access
			C:\fakepath(85,26-37): error X3696: infinite loop detected - loop never exits

			Warning: D3D shader compilation failed with skip validation flags. (ps_5_0)
			Retrying with skip optimization
			error X3504: literal loop terminated early due to out of bounds array access
			C:\fakepath(85,26-37): error X3696: infinite loop detected - loop never exits

			Warning: D3D shader compilation failed with skip optimization flags. (ps_5_0)

			Failed to create D3D Shaders
			*/
			console.log('dagball.Game.prototype.nextState changing game.nCurve from '+this.nCurve+' to '+newNcurve+' cuz dagball.view.numEds(), FIXME make sure its not more than 1000 or whatever the limit is.');
			//console.log('doing clearTinyGlslCacheAndUpdateButton just in case, FIXME dont do this so often, it slows things down alot');
			//dagball.clearTinyGlslCacheAndUpdateButton(); //FIXME shouldnt need to do this
			//this.nCurve = newNcurve;
			this.setNcurve(newNcurve);
			//throw 'FIXME replace dagball.game instance';
		}
		//this.nCurve = newNcurve;
		//this.doPhysics(dt); //TODO more physics cycles than 1 per video frame? Check how fast it is first.

		for(let circ of dagball.view.circToPreOffset.keys()){
			//FIXME its not using dagball.game.pos and .vel anymore? I dont think it is. That was moved into eds and balls. now is 2024-1-22.
			//In Dagball 070 moving and resizing GPU_circles is alot faster cuz it doesnt recompile to change them. Instead, moved (y,x,radius) of each circle into the up to 1000 dimensions.
			let preO = dagball.view.circToPreOffset.get(circ);
			
			this.pos[preO+dagball.varsPerCircIntoGpu_y] = circ.y;
			this.vel[preO+dagball.varsPerCircIntoGpu_y] = 0;

			this.pos[preO+dagball.varsPerCircIntoGpu_x] = circ.x;
			this.vel[preO+dagball.varsPerCircIntoGpu_x] = 0;

			this.pos[preO+dagball.varsPerCircIntoGpu_r] = circ.r;
			this.vel[preO+dagball.varsPerCircIntoGpu_r] = 0;
		}

		//do this after move a ball to mouse etc, so its a little lower lag, in theory.
		//dagball.updateView();
		//this.doPhysics(dt); //TODO more physics cycles than 1 per video frame? Check how fast it is first.
		for(let repeatPhysics=0; repeatPhysics<dagball.physicsCyclesPerVideoFrame; repeatPhysics++){
			this.doPhysics(dt/dagball.physicsCyclesPerVideoFrame);
		}
		
		if(!dagball.mouseIsInTextEditorEtc() && dagball.chk('mouseBall',true)){
			let cursorBallYGoTo = dagball.controls('mouseY'); //move first ball here to mouse
			let cursorBallXGoTo = dagball.controls('mouseX');
			//cursorBallYGoTo += dagball.predictMouseThisMuchAheadForCursorBall*dagball.directControls.simpleMouseYVelocity;
			//cursorBallXGoTo += dagball.predictMouseThisMuchAheadForCursorBall*dagball.directControls.simpleMouseXVelocity;
			//this.pos[this.oBall()] = cursorBallYGoTo;
			//this.pos[this.oBall()+1] = cursorBallXGoTo;
			let mouseBall = dagball.balls[0];
			//console.log('moving mouse ball mouseBall.y='+mouseBall.y+' x'+mouseBall.x+' cursorBallXGoTo'+cursorBallXGoTo);
			mouseBall.y = cursorBallYGoTo; //FIXME use dagball.view.balls[0] instead to make it sparse
			mouseBall.x = cursorBallXGoTo;
			mouseBall.yv = mouseBall.xv = mouseBall.gradientY = mouseBall.gradientX = 0; //dont move
		}
	}

	if(!dagball.screen){
		dagball.screen = new FullScreenCanvas(dagball.bootCanvasHeight, dagball.bootCanvasWidth);
		//dagball.aftrans = new dagball.SimpleAftrans(dagball.screen.byteRect.height/2, dagball.screen.byteRect.width/2, 1, 1)
		//dagball.aftrans = new dagball.SimpleAftrans(dagball.screen.byteRect.height/2, dagball.screen.byteRect.width/2, 100, 100);
		dagball.resetAftrans();
		let canvas = dagball.screen.dom;
		canvas.style.display = 'block';
		canvas.style.transformOrigin = '0 0';
		canvas.style.position = 'absolute';
		canvas.style['z-index'] = -1;
		canvas.style.top = '0';
		canvas.style.left = '0';
		canvas.setAttribute('tabIndex', 0); //make canvas focusable
		//canvas.setAttribute('tabIndex', 1); //make canvas focusable
		dagball.canvasScaleY = window.innerHeight/canvas.height;
		dagball.canvasScaleX = window.innerWidth/canvas.width;
		canvas.style.transform = `scaleX(${dagball.canvasScaleX}) scaleY(${dagball.canvasScaleY})`;
		window.addEventListener('resize', () => {
			canvas.style.transform = `scaleX(${window.innerWidth / canvas.width}) scaleY(${window.innerHeight / canvas.height})`;
		});
		document.addEventListener('contextmenu', function(event){
			if(!dagball.isAllowRightClickPopupMenuNow()){
				event.preventDefault();
			}
		});


		//dagball.screen.dom
		//FIXME what if its not resized to screen size yet (does that happen in beforePaint or afterPaint instead?)?
		dagball.byteRectTrail = dagball.displayBallTrails ? dagball.screen.byteRect.copy() : null;
		//let canv = dagball.screen.dom;
		let mousemove = event=>{
			//dagball.directControls.mouseY = (event.clientY/canv.height/dagball.canvasScaleY)*2-1; //approx range -1 to 1 but might go outside
			//dagball.directControls.mouseX = (event.clientX/canv.width/dagball.canvasScaleX)*2-1; //approx range -1 to 1 but might go outside
			//dagball.directControls.mouseY = event.clientY/dagball.canvasScaleY;
			//dagball.directControls.mouseX = event.clientX/dagball.canvasScaleX;
			
			/*
			//trying to make the mouse cursor being about 2 video frames ahead of canvas less annoying by predicting its position by its velocity
			let now = dagball.time();
			let prevTime = dagball.lastTimeMouseMove || 0;
			dagball.lastTimeMouseMove = now;
			let dt = Math.max(.000001, Math.min(now-prevTime, .1)); //FIXME
			let prevMouseY = dagball.directControls.mouseY;
			let prevMouseX = dagball.directControls.mouseX;
			*/

			dagball.directControls.rawMouseY = event.clientY; //in screen coordinates, not affine transformed
			dagball.directControls.rawMouseX = event.clientX;
			dagball.updateDirectControlsMouse();

			/*
			//trying to make the mouse cursor being about 2 video frames ahead of canvas less annoying by predicting its position by its velocity
			let dy = dagball.directControls.mouseY-prevMouseY;
			let dx = dagball.directControls.mouseX-prevMouseX;
			dagball.directControls.simpleMouseYVelocity = dy/dt;
			dagball.directControls.simpleMouseXVelocity = dx/dt;
			*/

			/*moving this to afterEveryCanvasDomEvent if(!dagball.selectLock() && !dagball.isTextEditing()){ //FIXME merge selectLock with isTextEditing? They're tangled 2023-9-24.
				dagball.setSelectedCirc(dagball.uiCircNearYXElseNull(dagball.directControls.mouseY, dagball.directControls.mouseX));
			}*/
			//console.log('focusing on event.target='+event.target);

			
			//dont do this cuz 2023-9-27 changing to mouse left click on canvas switches modes. if(!dagball.selectLock()){
			//	event.target.focus(); //focus on whatever mouse is over, so keyboard controls work differently when mouse is over textarea vs over canvas
			//}

			//let mainEditTextarea = document.getElementById('mainEditTextarea');
			//if(event.target != mainEditTextarea) mainEditTextarea.blur(); //unfocus, so it doesnt keep getting typed into when mouse is over circles in canvas editing them with keyboard buttons
			dagball.afterEveryCanvasDomEvent(event);
		};
		let displayLogs = document.getElementById('displayLogs');
		let body = document.body;
		body.addEventListener('mousemove', mousemove);
		canvas.addEventListener('mousemove', mousemove);
		
		//cumulative position of mouse wheel, though not sure if it will add up consistently.
		//Use with controlsChange('mouseWheelY') and if your mouse has it 'mouseWheelX' and even rarer 'mouseWheelZ'.
		dagball.directControls.mouseWheelZ = 0;
		dagball.directControls.mouseWheelY = 0;
		dagball.directControls.mouseWheelX = 0;
		dagball.directControls.mouseWheelDeltaMode = 0;
		let mouseWheel = event=>{
			if(!dagball.isTextEditing()){ //if mouse is over canvas, zoom canvas, else let mouse wheel do what it normally does in textarea.
				event.preventDefault(); // Prevent the default wheel action
				dagball.directControls.mouseWheelZ += event.deltaZ;
				dagball.directControls.mouseWheelY += event.deltaY;
				dagball.directControls.mouseWheelX += event.deltaX;
				dagball.directControls.mouseWheelDeltaMode = event.deltaMode;
				dagball.afterEveryCanvasDomEvent(event);
			}
		};
		let mouseWheelParam = {passive: false}; //makes preventDefault() work, in theory
		body.addEventListener('wheel', mouseWheel, mouseWheelParam);
		canvas.addEventListener('wheel', mouseWheel, mouseWheelParam);
		
		let mousedown = event=>{
			let key = 'mouseButton'+event.button;
			if(key == 'mouseButton2' && dagball.isAllowRightClickPopupMenuNow() || dagball.mouseIsInTextEditorEtc()){
				console.log('asdfasdfsdfA Ignoring event cuz right click popup or in text editor etc');
			}else{
				dagball.directControls[key] = 1;
				dagball.afterEveryCanvasDomEvent(event);
			}
		};
		body.addEventListener('mousedown', mousedown);
		canvas.addEventListener('mousedown', mousedown);
		
		let mouseup = event=>{
			let key = 'mouseButton'+event.button;
			if(key == 'mouseButton2' && dagball.isAllowRightClickPopupMenuNow() || dagball.mouseIsInTextEditorEtc()){
				console.log('asdfasdfsdfB Ignoring event cuz right click popup or in text editor etc');
			}else{
				dagball.directControls[key] = 0;
				dagball.afterEveryCanvasDomEvent(event);
			}
		};
		body.addEventListener('mouseup', mouseup);
		canvas.addEventListener('mouseup', mouseup);
		
		let keydown = function(event){
			//let didControlCombo = false;
			if(event.key == 'Control'){
				for(let key in dagball.directControls){
					if(!key.startsWith('Control') && !key.includes('ouse') && key!='dt'){ //Control_v Control_c etc, but not mouse vars
						dagball.directControls['Control_'+key] = 1; //if holding c then push Control, Control_c starts
						didControlCombo = true;
					}
				}
			}else{
				if(dagball.directControls.Control && event.key != 'Control' && !event.key.includes('ouse') && event.key!='dt'){ //Control_c Control_v etc
					dagball.directControls['Control_'+event.key] = 1; //if holding Control then push c, Control_c starts
					//didControlCombo = true;
				}
			}
			if(!dagball.directControls.Control){ //dont put the other keys down while control is down. FIXME this might break things.
				dagball.directControls[event.key] = 1;
			}
			dagball.afterEveryCanvasDomEvent(event);
		};
		body.addEventListener('keydown', keydown);
		canvas.addEventListener('keydown', keydown);
		
		let keyup = function(event){
			if(event.key == 'Control'){
				for(let key in dagball.directControls){
					if(key.startsWith('Control_')){ //Control_v Control_c etc
						dagball.directControls[key] = 0; //Control_c stops, etc.
					}
				}
			}
			dagball.directControls[event.key] = 0;
			if(dagball.directControls['Control_'+event.key]){ //end Control_c etc if that was down
				dagball.directControls['Control_'+event.key] = 0;
			}
			dagball.afterEveryCanvasDomEvent(event);
		};
		body.addEventListener('keyup', keyup);
		canvas.addEventListener('keyup', keyup);
		//canv.dom.addEventListener('contextmenu', event=>event.preventDefault()); //prevent right click popup menu from canvas

		if(dagball.hideMouseCursorOnCanvas){
			canvas.style.cursor = "none";
			displayLogs.style.cursor = "none";
		}

	}

	if(dagball.view){ //cuz dagball.screen may have just been created in code above but didnt create view above that cuz screen didnt exist yet (2023-11-12)
		dagball.screen.beforePaint();
		//calls GPU to get height*width floats of potentialEnergy, one per pixel, sets dagball.last_potentialEnergiesForDisplay to that,
		//which doPhysics uses next cycle (FIXME reduce lag by changing order of that?) depending on the doStatisticalCollisionsBetweenWavefunctions checkbox.
		this.paintOntoByteRect(dagball.screen.byteRect);
		if(this.displayBallTrails){
			if(dagball.screen.byteRect.bytes.length != dagball.byteRectTrail.bytes.length){
				//FIXME copy that func in ByteRect thats something like "is same size as (param byterect) from my other code"
				throw new Error('Diff ByteRect sizes');
			}
			//let h = dagball.screen.byteRect.height;
			//let w = dagball.screen.byteRect.width;
			//let by = h*w*4; //number of bytes per ByteRect. Should equal byteRect.bytes.length
			let byMain = dagball.screen.byteRect.bytes;
			let byTrail = dagball.byteRectTrail.bytes;
			for(let i=0; i<byMain.length; i+=4){
				let isMainDefaultBallColor = (byMain[i+RED]==dagball.defaultBallColorRed) &&
					(byMain[i+GREEN]==dagball.defaultBallColorGreen) && (byMain[i+BLUE]==dagball.defaultBallColorBlue);
				let isTrailDefaultBallColor = (byTrail[i+RED]==dagball.defaultBallColorRed) &&
					(byTrail[i+GREEN]==dagball.defaultBallColorGreen) && (byTrail[i+BLUE]==dagball.defaultBallColorBlue);
				if(isMainDefaultBallColor || isTrailDefaultBallColor){
					byMain[i+RED] = byTrail[i+RED] = dagball.defaultBallColorRed;
					byMain[i+GREEN] = byTrail[i+GREEN] = dagball.defaultBallColorGreen;
					byMain[i+BLUE] = byTrail[i+BLUE] = dagball.defaultBallColorBlue;
				}
			}
		}
		dagball.screen.afterPaint();
		dagball.afterAfterPaint();
	}


	dagball.changeGameStateByInputControls(); //uses dagball.controlChange('mouseY') and dagball.controlChange('moveView') etc.
	if(dagball.makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest){
		let i = 1;
		let time = dagball.time(); //UTC seconds
		for(let dimOut of dagball.sortedKeys(dagball.directControlsOut)){
			if(dagball.isGamepadRumbleDimName(dimOut)){
				let freq = 1/(i++);
				let strengthFraction = .5+.5*Math.sin(2*Math.PI*freq*time); //chatgpt4 says range should be 0 to 1
				if(dimOut.includes('_weakRumble')){
					strengthFraction *= dagball.makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest_maxWeakRumbleStrength;
				}
				if(dimOut.includes('_strongRumble')){
					strengthFraction *= dagball.makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest_maxStrongRumbleStrength;
				}
				dagball.directControlsOut[dimOut] = strengthFraction;
				console.log('makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest test rumbling dim='+dimOut+' strengthFraction='+strengthFraction);
			}
		}
	}
	dagball.update_prev_directControls();

	if(dagball.chk('fpsCheckbox',true)){
		document.getElementById('fpsLabel').innerHTML = 'FPS=<b>'+Math.round(dagball.estimateFPS)+"</b>";
	}

	if(dagball.chk('varyPhysicsCycs',true)){
		let now = dagball.time();
		let timeSinceChaged_physicsCyclesPerVideoFrame = now-dagball.physicsCyclesPerVideoFrame_timeLastChanged;
		let isTimeToChange = timeSinceChaged_physicsCyclesPerVideoFrame >= dagball.physicsCyclesPerVideoFrame_waitAtLeast;
		if(isTimeToChange){
			let fpsIsTooLow = dagball.estimateFPS < dagball.physicsCyclesPerVideoFrame_targetMinFPS;
			dagball.physicsCyclesPerVideoFrame += fpsIsTooLow ? -1 : 1;
			dagball.physicsCyclesPerVideoFrame = Math.max(dagball.physicsCyclesPerVideoFrame_min,
				Math.min(dagball.physicsCyclesPerVideoFrame,dagball.physicsCyclesPerVideoFrame_max));
			dagball.physicsCyclesPerVideoFrame_timeLastChanged = now; //so it wont change again right away, wait for dagball.estimateFPS to decay update. 
		}
	}
	if(TinyGlsl.do_clearAllCache_whenWebglContextLost){ //in case TinyGlsl cleared its own cache cuz of that error
		dagball.updateButtonButDontClearnTinyGlslCache();
	}
	document.getElementById('varyPhysicsCycsLabel').innerHTML = 'varPhy=<b>'+dagball.physicsCyclesPerVideoFrame+"</b>";

	/*
	if(canv == null){
		canv = new FullScreenCanvas();
		canv.dom.addEventListener('mousemove', event=>{
			controls.mouseYCell = Math.max(0, Math.min(Math.floor(event.clientY/pixelsPerCell), rule110SquareSide-1));
			controls.mouseXCell = Math.max(0, Math.min(Math.floor(event.clientX/pixelsPerCell), rule110SquareSide-1));
		});
		canv.dom.addEventListener('mousedown', event=>{
			controls['mouseButton'+event.button] = 1;
		});
		canv.dom.addEventListener('mouseup', event=>{
			controls['mouseButton'+event.button] = 0;
		});
		canv.dom.addEventListener('contextmenu', event=>event.preventDefault()); //prevent right click popup menu from canvas, so that button paints black instead
	}
	let now = time();
	let age = now-timeStarted;
	let dt = Math.max(0, Math.min(now-prevTime, .2));
	prevTime = now;
	canv.beforePaint();
	doPageTransitioningGraphics(dt, age, canv.byteRect);
	canv.afterPaint();
	setTimeout(nextState, 1);
	*/

	//dagball.doAsaps(); //deleteCircle etc, if scheduled. This way it doesnt interfere with display and physics
};
//pointer to me, kind of. Javascript code that evals to this existing Game object, or throws if unknown.
dagball.Game.prototype.ptr = function(){
	if(dagball.game != this) throw new Error('Where is this Game?');
	return 'dagball.game';
};

dagball.updateDirectControlsMouse = function(){
	dagball.directControls.mouseY = dagball.aftrans.reverseY(dagball.directControls.rawMouseY/dagball.canvasScaleY);
	dagball.directControls.mouseX = dagball.aftrans.reverseX(dagball.directControls.rawMouseX/dagball.canvasScaleX);
};

var between = (min,x,max)=>Math.max(min,Math.min(x,max));

//modified https://github.com/benrayfield/jsutils/blob/master/src/FullScreenCanvasPrototype.html
var FullScreenCanvas = function(optionalHeight, optionalWidth, optionalParentDom){ //FullScreenCanvas opensource MIT licensed by Ben F Rayfield
	let parentDom = optionalParentDom  || document.body;
	this.dom = document.createElement('canvas');
	//TODO z order, in front of everything else.
	//this.dom = document.getElementById('canv'); //FIXME remove this line, use createElement instead.
	this.context = null;
	this.imageData = null;
	this.pixels = null;
	this.byteRect = null;
	parentDom.appendChild(this.dom);
	this.dom.style.position = 'absolute';
	this.dom.style.left = '0px';
	this.dom.style.top = '0px';
	
	//else uses window size. FIXME also 
	this.resizeCanvas = function(optionalHeight, optionalWidth){
		let targetHeight = optionalHeight || window.innerHeight;
		let targetWidth = optionalWidth || window.innerWidth;
		if(this.dom.height != targetHeight) this.dom.height = targetHeight;
		if(this.dom.width != targetWidth) this.dom.width = targetWidth;
	};
	
	/*//TODO optimize, if you're not reading from the canvas, maybe can skip parts of this or only call this once?
	//FIXME reuse some of these vars. might be slowing it down doing getContext and imageData every time, for example,
	//but careful with that cuz canvas doesnt update if you do this wrong.
	this.beforePaint = function(){
		if(this.dom == null) throw 'No canvas';
		
		//this.context = this.dom.getContext('2d');
		//cuz got this warning 2023-9-2: ForestCurveFit004.html:1503 Canvas2D: Multiple readback operations using getImageData
		//are faster with the willReadFrequently attribute set to true.
		//See: https://html.spec.whatwg.org/multipage/canvas.html#concept-canvas-will-read-frequently
		this.context = this.dom.getContext('2d', {willReadFrequently: true});

		//console.log('this.dom.width = '+this.dom.width);
		this.imageData = this.context.getImageData(0, 0, this.dom.width, this.dom.height);
		this.pixels = this.imageData.data;
		this.byteRect = new ByteRect(this.pixels, this.dom.height, this.dom.width);
	};*/
	this.beforePaint = function(){
		if(this.dom == null) throw new Error('No canvas');

		// Create the context if it doesn't exist
		if(!this.context){
			this.context = this.dom.getContext('2d', {willReadFrequently: true});
		}

		//Only create image data if it doesn't exist or if the canvas size has changed
		if(!this.imageData || this.imageData.width !== this.dom.width || this.imageData.height !== this.dom.height){
			this.imageData = this.context.getImageData(0, 0, this.dom.width, this.dom.height);
			this.pixels = this.imageData.data;
			this.byteRect = new ByteRect(this.pixels, this.dom.height, this.dom.width);
		}
	};
	
	//call this after modify byteRect.bytes which contains pixel colors to write to Canvas.
	this.afterPaint = function(){
		if(this.dom == null) throw new Error('No canvas');
		//this.context.drawImage(this.dom, 0, 0, this.dom.width, this.dom.height);
		this.context.putImageData(this.imageData, 0, 0);
	};
	
	this.removeFromScreen = function(){
		this.dom.remove();
		this.dom = null;
		this.context = null;
		this.imageData = null;
		this.pixels = null;
		this.byteRect = null;
	};
	
	this.resizeCanvas(optionalHeight, optionalWidth);
	this.beforePaint();
};

var ByteRect = (()=>{
	let ByteRect = function(bytes, height, width){ //ByteRect opensource MIT licensed by Ben F Rayfield (has more funcs other places)
		this.bytes = bytes || new Uint8Array(height*width*4);
		this.height = height;
		this.width = width;
	};
	
	ByteRect.prototype.paintOntoByteRectAtYX = function(byteRect, y, x){
		y = Math.round(y);
		x = Math.round(x);
		let yFrom = Math.max(0, y);
		let yToExcl = Math.min(byteRect.height, y+this.height);
		let xFrom = Math.max(0, x);
		let xToExcl = Math.min(byteRect.width, x+this.width);
		for(let yPix=yFrom; yPix<yToExcl; yPix++){
			//TODO optimize by computing a range of bytes to copy
			let myYPix = yPix-y;
			for(let xPix=xFrom; xPix<xToExcl; xPix++){
				let myXPix = xPix-x;
				let myI = (myYPix*this.width+myXPix)*4;
				let otherI = (yPix*byteRect.width+xPix)*4;
				let alpha = this.bytes[myI+ALPHA];
				if(alpha){ //is always 0 or 255, TODO verify that doesnt change. this is for 1 bit of transparency
					byteRect.bytes[otherI+RED] = this.bytes[myI+RED];
					byteRect.bytes[otherI+GREEN] = this.bytes[myI+GREEN];
					byteRect.bytes[otherI+BLUE] = this.bytes[myI+BLUE];
				}
			}
		}
	};

	ByteRect.prototype.copy = function(){
		//let newBytes = new Uint8Array(this.bytes.length);
		//copyBytes(this.bytes, newBytes);
		let newBytes = new Uint8Array(this.bytes);
		return new ByteRect(newBytes, this.height, this.width);
	};

	//TODO choose [y x] vs [x y z scale] order. Swap y and x in ByteRect params order? aftrans is [x y z scale].

	ByteRect.prototype.index = function(y, x, colorDim){
		return (y*this.width+x)*4+colorDim;
	};

	ByteRect.prototype.read = function(y, x, colorDim){
		return this.bytes[(y*this.width+x)*4+colorDim];
	};

	//TODO bilinear interpolation for smoother color?
	ByteRect.prototype.readSafe = function(y, x, colorDim){
		return this.bytes[betweenInt(0,(Math.round(y)*this.width+Math.round(x))*4+colorDim,this.bytes.length-1)];
	};

	ByteRect.prototype.readBrightnessSafe = function(y, x){
		let i = between(0, (Math.round(y)*this.width+Math.round(x))*4, this.bytes.length-4);
		return (this.bytes[i+RED]+this.bytes[i+GREEN]+this.bytes[i+BLUE])/3;
	};

	/** same as readBrightnessSafe but as Float32Array whose length is this.bytes.length/4. a copy, not backing. */
	ByteRect.prototype.brightnessFloats = function(y, x){
		let ret = new Float32Array(this.bytes.length/4);
		let i = 0;
		for(let j=0; j<this.bytes.length; j+=4){
			ret[i++] = (this.bytes[j+RED]+this.bytes[j+GREEN]+this.bytes[j+BLUE])/3;
		}
		return ret;
	};

	ByteRect.prototype.write = function(y, x, colorDim, bright){
		this.bytes[(y*this.width+x)*4+colorDim] = bright;
	};

	ByteRect.prototype.writeSafe = function(y, x, colorDim, bright){
		this.bytes[between(0,(Math.round(y)*this.width+Math.round(x))*4+colorDim,this.bytes.length-1)] = bright;
	};

	ByteRect.prototype.writeSafeRGBA = function(y, x, redByte, greenByte, blueByte, optionalAlphaByte){
		if(optionalAlphaByte === undefined) optionalAlphaByte = 255; //visible
		let index = between(0,(Math.round(y)*this.width+Math.round(x))*4,this.bytes.length-4);
		this.bytes[index+RED] = redByte;
		this.bytes[index+GREEN] = greenByte;
		this.bytes[index+BLUE] = blueByte;
		this.bytes[index+ALPHA] = optionalAlphaByte;
	};

	ByteRect.prototype.writeSafeBright = function(y, x, brightByte){
		let index = between(0,(Math.round(y)*this.width+Math.round(x))*4,this.bytes.length-4);
		this.bytes[index+RED] = brightByte;
		this.bytes[index+GREEN] = brightByte;
		this.bytes[index+BLUE] = brightByte;
		this.bytes[index+ALPHA] = 255;
	};

	ByteRect.prototype.atYXWriteRGB = function(y, x, redByte, greenByte, blueByte){
		let ind = (y*this.width+x)*4;
		this.bytes[ind+RED] = redByte;
		this.bytes[ind+GREEN] = greenByte;
		this.bytes[ind+BLUE] = blueByte;
	};

	ByteRect.prototype.writeHoriz = function(y, fromX, toXExclusive, colorDim, fromBright, toBright){
		var indexStart = this.index(y, fromX, colorDim);
		var pixelSiz = toXExclusive-fromX;
		var siz = pixelSiz*4;
		var bright = fromBright;
		var brightAdd = (toBright-fromBright)/pixelSiz;
		for(var i=0; i<siz; i+=4){
			bright += brightAdd;
			this.bytes[indexStart+i] = Math.floor(bright) & 0xff;
		}
	};

	ByteRect.prototype.flipHorizontal = function(){
		let bytes = this.bytes;
		for(let y=0; y<this.height; y++){
			let xMid = Math.floor(this.width/2);
			let offsetA = y*this.width*4; //first byte index of first pixel in row
			let offsetB = ((y+1)*this.width-1)*4; //first byte of last pixel in row
			for(let x=0; x<xMid; x++){
				for(let colorDim=0; colorDim<4; colorDim++){ //swap 2 pixels as 4 bytes each
					let temp = bytes[offsetA+colorDim];
					bytes[offsetA+colorDim] = bytes[offsetB+colorDim];
					bytes[offsetB+colorDim] = temp;
				}
				offsetA += 4;
				offsetB -= 4;
			}
		}
	};

	ByteRect.prototype.verifySameSizeAs = function(byteRect){
		if(!byteRect) throw new Error('Param ByteRect = '+byteRect);
		if(this.height != byteRect.height) throw new Error(this.height+' == this.height != byteRect.height == '+byteRect.height);
		if(this.width != byteRect.width) throw new Error(this.width+' == this.width != byteRect.width == '+byteRect.width);
	};

	ByteRect.prototype.loopAve = function(loopSize, firstByteIndex, addByteIndex){
		let sum = 0;
		let i = firstByteIndex;
		for(let a=0; a<loopSize; a++){
			sum += this.bytes[i];
			i += addByteIndex;
		}
		return sum/loopSize;
	};

	ByteRect.prototype.loopFractionOfBytesThatAreAtLeastVal = function(loopSize, firstByteIndex, addByteIndex, brightnessIsAtLeastThisByteVal){
		let count = 0;
		let i = firstByteIndex;
		for(let a=0; a<loopSize; a++){
			if(brightnessIsAtLeastThisByteVal <= this.bytes[i]) count++;
			i += addByteIndex;
		}
		return count/loopSize;
	};

	ByteRect.prototype.loopWriteByte = function(loopSize, firstByteIndex, addByteIndex, writeByteVal){
		let i = firstByteIndex;
		for(let a=0; a<loopSize; a++){
			this.bytes[i] = writeByteVal;
			i += addByteIndex;
		}
	};

	ByteRect.prototype.loopWriteBlack = function(loopSize, firstByteIndex, addByteIndex){
		let i = firstByteIndex;
		for(let a=0; a<loopSize; a++){
			this.bytes[i+RED] = 0;
			this.bytes[i+GREEN] = 0;
			this.bytes[i+BLUE] = 0;
			i += addByteIndex;
		}
	};

	/** stdDev of looping over bytes (a row or column and colorDim).
	optionalAve is from loopAve or as optional param it computes that.
	*/
	ByteRect.prototype.loopDev = function(loopSize, firstByteIndex, addByteIndex, optionalAve){
		if(optionalAve === undefined) optionalAve = this.loopAve(byteRect, firstByteIndex, addByteIndex);
		let sumOfSquares = 0;
		let i = firstByteIndex;
		for(let a=0; a<loopSize; a++){
			let diff = this.bytes[i]-optionalAve;
			sumOfSquares += diff*diff;
			i += addByteIndex;
		}
		return Math.sqrt(sumOfSquares/loopSize);
	};

	/** ave brightness of a certain row and [RED, GREEN, BLUE, or ALPHA]. Range 0 to 255. */
	ByteRect.prototype.rowAve = function(y, colorDim){
		return this.loopAve(this.width, y*this.width*4+colorDim, 4);
	};

	/** stdDev of brightness of a certain row and [RED, GREEN, BLUE, or ALPHA]. Range 0 to 255. */
	ByteRect.prototype.rowDev = function(y, colorDim, optionalAve){
		return this.loopDev(this.width, y*this.width*4+colorDim, 4, optionalAve);
	};

	/** ave brightness of a certain column and [RED, GREEN, BLUE, or ALPHA]. Range 0 to 255. */
	ByteRect.prototype.colAve = function(x, colorDim){
		return this.loopAve(this.height, x*4+colorDim, this.width*4);
	};

	/** stdDev of brightness of a certain column and [RED, GREEN, BLUE, or ALPHA]. Range 0 to 255. */
	ByteRect.prototype.colDev = function(x, colorDim, optionalAve){
		return this.loopDev(this.height, x*4+colorDim, this.width*4, optionalAve);
	};

	ByteRect.prototype.setRowAndColordimToByte = function(y, colorDim, byteVal){
		this.loopWriteByte(this.width, y*this.width*4+colorDim, 4, byteVal);
	};

	ByteRect.prototype.setColAndColordimToByte = function(x, colorDim, byteVal){
		this.loopWriteByte(this.height, x*4+colorDim, this.width*4, byteVal);
	};

	ByteRect.prototype.rowFractionOfBytesThatAreAtLeastVal = function(y, colorDim, brightnessIsAtLeastThisByteVal){
		return this.loopFractionOfBytesThatAreAtLeastVal(this.width, y*this.width*4+colorDim, 4, brightnessIsAtLeastThisByteVal);
	};

	ByteRect.prototype.colFractionOfBytesThatAreAtLeastVal = function(x, colorDim, brightnessIsAtLeastThisByteVal){
		return this.loopFractionOfBytesThatAreAtLeastVal(this.height, x*4+colorDim, this.width*4, brightnessIsAtLeastThisByteVal);
	};

	ByteRect.prototype.setRowToBlack = function(y){
		this.loopWriteBlack(this.width, y*this.width*4, 4);
	};

	ByteRect.prototype.setColToBlack = function(x){
		this.loopWriteBlack(this.height, x*4, this.width*4);
	};

	ByteRect.prototype.paintRect = function(fromY, fromX, toY, toX, redByte, greenByte, blueByte){
		for(let y=fromY; y<toY; y++){
			for(let x=fromX; x<toX; x++){
				let i = (y*this.width+x)*4;
				this.bytes[i+RED] = redByte;
				this.bytes[i+GREEN] = greenByte;
				this.bytes[i+BLUE] = blueByte;
			}
		}
	};
	
	ByteRect.prototype.paintYXRGBSafe = function(y, x, redByte, greenByte, blueByte){
		y = Math.max(0, Math.min(Math.round(y), this.height-1));
		x = Math.max(0, Math.min(Math.round(x), this.width-1));
		let i = (y*this.width+x)*4;
		this.bytes[i+RED] = redByte;
		this.bytes[i+GREEN] = greenByte;
		this.bytes[i+BLUE] = blueByte;
	};

	//centerY, centerX, and radius can be scalars. Does bounds checking
	ByteRect.prototype.paintDonut = function(centerY, centerX, minRadius, maxRadius, redByte, greenByte, blueByte){
		let byteRect = this;
		if(minRadius > maxRadius) throw new Error('minRadius='+minRadius+' maxRadius='+maxRadius);
		var minYI = Math.max(0, Math.min(Math.floor(centerY-maxRadius), byteRect.height-1));
		var maxYI = Math.max(0, Math.min(Math.ceil(centerY+maxRadius), byteRect.height-1));
		var minXI = Math.max(0, Math.min(Math.floor(centerX-maxRadius), byteRect.width-1));
		var maxXI = Math.max(0, Math.min(Math.ceil(centerX+maxRadius), byteRect.width-1));
		var minRadiusSq = minRadius*minRadius;
		var maxRadiusSq = maxRadius*maxRadius;
		for(var y=minYI; y<=maxYI; y++){
			var i = byteRect.index(y, minXI, 0);
			for(var x=minXI; x<=maxXI; x++){
				var dy = y-centerY;
				var dx = x-centerX;
				let sq = dy*dy + dx*dx;
				if((minRadiusSq <= sq) && (sq <= maxRadiusSq)){
					//TODO optimize by skipping parts where this isnt true, in the loop before getting here.
					byteRect.bytes[i+RED] = redByte;
					byteRect.bytes[i+GREEN] = greenByte;
					byteRect.bytes[i+BLUE] = blueByte;
				}
				i += 4;
			}
		}
	};

	/*ByteRect.prototype.paintLineYXYXRGB = function(fromY, fromX, toY, toX, redByte, greenByte, blueByte){
		let diffY = toY-fromY;
		let diffX = toX-fromX;
		let len = Math.hypot(diffY, diffX);
		let numPoints = Math.ceil(len*1.5);
		for(let i=0; i<numPoints; i++){
			//TODO optimize
			let y = Math.round(fromY+diffY*i/numPoints);
			let x = Math.round(fromX+diffX*i/numPoints);
			this.atYXWriteRGB(y, x, redByte, greenByte, blueByte);
		}
	};*/
	/*//optimization to call itself recursively on a shorter line thats all on screen if either end of line is outside. TODO test this.
	//but it stack overflows.
	ByteRect.prototype.paintLineYXYXRGB = function(fromY, fromX, toY, toX, redByte, greenByte, blueByte){
		// Constants for boundary checks
		const OUT_LEFT = 1, OUT_RIGHT = 2, OUT_TOP = 4, OUT_BOTTOM = 8;

		// Determine out-of-bounds status for from and to points
		let fromStatus = 0;
		if (fromX < 0) fromStatus |= OUT_LEFT;
		else if (fromX >= this.width) fromStatus |= OUT_RIGHT;
		if (fromY < 0) fromStatus |= OUT_TOP;
		else if (fromY >= this.height) fromStatus |= OUT_BOTTOM;

		let toStatus = 0;
		if (toX < 0) toStatus |= OUT_LEFT;
		else if (toX >= this.width) toStatus |= OUT_RIGHT;
		if (toY < 0) toStatus |= OUT_TOP;
		else if (toY >= this.height) toStatus |= OUT_BOTTOM;

		// Check if both points are inside the rectangle
		if (fromStatus === 0 && toStatus === 0) {
			let diffY = toY - fromY;
			let diffX = toX - fromX;
			let len = Math.hypot(diffY, diffX);
			let numPoints = Math.ceil(len * 1.5);

			for (let i = 0; i < numPoints; i++) {
				let y = Math.round(fromY + diffY * i / numPoints);
				let x = Math.round(fromX + diffX * i / numPoints);
				this.atYXWriteRGB(y, x, redByte, greenByte, blueByte);
			}
			return;
		}

		// Adjust for out-of-bounds and call recursively
		let newX, newY;
		if (fromStatus & OUT_LEFT) {
			newY = fromY + (0 - fromX) * (toY - fromY) / (toX - fromX);
			newX = 0;
		} else if (fromStatus & OUT_RIGHT) {
			newY = fromY + (this.width - 1 - fromX) * (toY - fromY) / (toX - fromX);
			newX = this.width - 1;
		} else if (fromStatus & OUT_TOP) {
			newX = fromX + (0 - fromY) * (toX - fromX) / (toY - fromY);
			newY = 0;
		} else if (fromStatus & OUT_BOTTOM) {
			newX = fromX + (this.height - 1 - fromY) * (toX - fromX) / (toY - fromY);
			newY = this.height - 1;
		}

		this.paintLineYXYXRGB(newY, newX, toY, toX, redByte, greenByte, blueByte);
	};*/
	/*This works 2024-1-31 but is slow for lines that dont need bounds checking (ed lines mostly).
	ByteRect.prototype.paintLineYXYXRGB = function(fromY, fromX, toY, toX, redByte, greenByte, blueByte, optional_skipBoundsCheck){
		if(!optional_skipBoundsCheck){
			// Constants for boundary checks
			const OUT_LEFT = 1, OUT_RIGHT = 2, OUT_TOP = 4, OUT_BOTTOM = 8;

			// Function to determine out-of-bounds status
			function checkBounds(x, y, width, height) {
				let status = 0;
				if (x < 0) status |= OUT_LEFT;
				else if (x >= width) status |= OUT_RIGHT;
				if (y < 0) status |= OUT_TOP;
				else if (y >= height) status |= OUT_BOTTOM;
				return status;
			}

			// Check bounds for from and to points
			let fromStatus = checkBounds(fromX, fromY, this.width, this.height);
			let toStatus = checkBounds(toX, toY, this.width, this.height);

			// If both points are out of bounds on the same side, return
			if ((fromStatus & toStatus) !== 0) return;

			// Calculate new intersection point if needed
			if (fromStatus !== 0 || toStatus !== 0) {
				let ratio, newX, newY;

				// Adjust the from point if it's out of bounds
				if (fromStatus !== 0) {
					if (fromStatus & OUT_LEFT) {
						ratio = (0 - fromX) / (toX - fromX);
						newX = 0;
						newY = fromY + ratio * (toY - fromY);
					} else if (fromStatus & OUT_RIGHT) {
						ratio = (this.width - 1 - fromX) / (toX - fromX);
						newX = this.width - 1;
						newY = fromY + ratio * (toY - fromY);
					} else if (fromStatus & OUT_TOP) {
						ratio = (0 - fromY) / (toY - fromY);
						newY = 0;
						newX = fromX + ratio * (toX - fromX);
					} else if (fromStatus & OUT_BOTTOM) {
						ratio = (this.height - 1 - fromY) / (toY - fromY);
						newY = this.height - 1;
						newX = fromX + ratio * (toX - fromX);
					}
					this.paintLineYXYXRGB(newY, newX, toY, toX, redByte, greenByte, blueByte, true);
				}
				// Else, if the to point is out of bounds, adjust it
				else if (toStatus !== 0) {
					if (toStatus & OUT_LEFT) {
						ratio = (0 - toX) / (fromX - toX);
						newX = 0;
						newY = toY + ratio * (fromY - toY);
					} else if (toStatus & OUT_RIGHT) {
						ratio = (this.width - 1 - toX) / (fromX - toX);
						newX = this.width - 1;
						newY = toY + ratio * (fromY - toY);
					} else if (toStatus & OUT_TOP) {
						ratio = (0 - toY) / (fromY - toY);
						newY = 0;
						newX = toX + ratio * (fromX - toX);
					} else if (toStatus & OUT_BOTTOM) {
						ratio = (this.height - 1 - toY) / (fromY - toY);
						newY = this.height - 1;
						newX = toX + ratio * (fromX - toX);
					}
					this.paintLineYXYXRGB(fromY, fromX, newY, newX, redByte, greenByte, blueByte, true);
				}
				return;
			}
		}
		// Draw the line if both points are within bounds
		let diffY = toY - fromY;
		let diffX = toX - fromX;
		let len = Math.hypot(diffY, diffX);
		let numPoints = Math.ceil(len * 1.5);

		for (let i = 0; i < numPoints; i++) {
			let y = Math.round(fromY + diffY * i / numPoints);
			let x = Math.round(fromX + diffX * i / numPoints);
			this.atYXWriteRGB(y, x, redByte, greenByte, blueByte);
		}
	};*/
	ByteRect.prototype.paintLineYXYXRGB = function(fromY, fromX, toY, toX, redByte, greenByte, blueByte){
		if((fromY < 0 && toY < 0) || (fromY >= this.height && toY >= this.height) ||
				(fromX < 0 && toX < 0) || (fromX >= this.width && toX >= this.width)){
			//line is completely off screen.
			return;
		}
		//TODO optimize by when line is partially on screen, start and end i at different integers.
		let diffY = toY-fromY;
		let diffX = toX-fromX;
		let len = Math.hypot(diffY, diffX);
		let numPoints = Math.ceil(len*1.5);
		for(let i=0; i<numPoints; i++){
			//TODO optimize
			let y = Math.round(fromY+diffY*i/numPoints);
			let x = Math.round(fromX+diffX*i/numPoints);
			this.atYXWriteRGB(y, x, redByte, greenByte, blueByte);
		}
	};


	ByteRect.prototype.paintCircleRadiusYXRGBSafe = function(radius, cy, cx, redByte, greenByte, blueByte){
		let circle = 2*Math.PI;
		let numPoints = Math.ceil(radius*circle*1.5);
		let anglePerPoint = 2*Math.PI/numPoints;
		for(let i=0; i<numPoints; i++){
			let angle = anglePerPoint*i;
			let x = cx+radius*Math.cos(angle);
			let y = cy+radius*Math.sin(angle);
			this.writeSafeRGBA(y, x, redByte, greenByte, blueByte);
		}
	};

	return ByteRect;
})();

window.onload = ()=>{
	if(!Ap.booted){
		throw new Error('Ape.js is not booted before Dagball');
	}
	dagball.lastTextareaText = document.getElementById('mainEditTextarea').value;
	dagball.set_circNever0CircsInGPU_enabled(dagball.chk('never0CircsInGPU'));
	dagball.boot();
	let openFileInput = document.getElementById('openFileInput');
	openFileInput.addEventListener('change', function(event){
		console.log('asdfasdfsdfCA file load button A');
		//openFileInput.style.backgroundColor = dagball.colorStr(Math.random(),Math.random(),Math.random()); //FIXME remove this. it changes color of file load button randomly when click it
		const file = event.target.files[0];
		if(file){
			dagball.doAsap(()=>{
				console.log('asdfasdfsdfCB file load button B');
				const reader = new FileReader();
				reader.onload = function(e){
					console.log('asdfasdfsdfCC file load button C');
					const fileContentAsString = e.target.result;
					dagball.loadGameStateFromJson(fileContentAsString);
					console.log('asdfasdfsdfCD file load button D');
					//setTimeout(function(){
					//	openFileInput.value = null; //so if you click it and load the same file again, it will get the event and do it
					//}, 3000);
					let s = openFileInput.value;
					if(s.includes('\\')){
						s = s.substring(s.lastIndexOf('\\')+1);
					}else if(s.includes('/')){
						s = s.substring(s.lastIndexOf('/')+1);
					}
					if(s.length > 50){
						s = s.substring(0,25)+'...'+s.substring(s.length-25);
					}
					//document.getElementById('lastFilenameLoaded').innerHTML = 'Last file loaded: '+s;
					document.getElementById('lastFilenameLoaded').innerHTML = s;
					openFileInput.value = null; //so if you click it and load the same file again, it will get the event and do it
					//throws: openFileInput.value += '(opened)'; //so if you click it and load the same file again, it will get the event and do it
				};
				reader.readAsText(file);
			});
		}
	});
	document.getElementById('showLeftControlsLabel').innerHTML =
		'menu ('+dagball.shortButtonEtcName(dagball.actionControls.toggleMenu)+')';
	//document.getElementById('paintWalls').click(); //auto run this experiment, put 1 bit per pixel pic on screen that can paint with mouse while holding certain buttons
	document.getElementById('textareaEventUpgrades').checked = dagball.default_textareaEventUpgrades;
	document.getElementById('semicolonCompiles').checked = dagball.default_semicolonCompiles;
	document.getElementById('transformFloatValsToVArray').checked = dagball.default_transformFloatValsToVArray;
	document.getElementById('edIncludeRegex').value = dagball.default_edIncludeRegex;
	document.getElementById('edExcludeRegex').value = dagball.default_edExcludeRegex;
	dagball.update_selectedCircIsPreferCpu_toCheckbox();
	if(dagball.loadWikibinatorAsyncRightAfterBoot){ //TODO will use dagball/lib/Axgob.js instead of dagball.lib/Wikibinator203VM.js, but first make dagball fun and online multiplayer without axgob cuz its a big upgrade for later.
		document.getElementById('loadWikibinatorButton').click();
	}

	TinyGlsl.log_cachedJsEval_eval = true; //FIXME turn this off. its for testing during redesign 2024-7-29+

	let bootCode = window.location.search.trim();
	if(bootCode.startsWith('?')) bootCode = bootCode.substring(1);
	bootCode = unescape(bootCode);
	if(bootCode){
		console.log('evaling bootCode='+bootCode);
		eval(bootCode);
		console.log('Done evaling bootCode.')
	}
};


/*
const BIAS = 0;
const Y = 1;
const X = 2;


Dagball
Make the crossection move by ball weight.
Make line at angle door on hinge that ball can push.
Make whitneymusicbox that any of its circling icons can be pushed.
Make balancing scale at torque ratio.
Make 1way valve ball rolls on like ramp thats pushed down but then
fall into hole and hard to get out.
Make interesting game out of scalarfield, and make more dims of scalarfield
including balls, and do whole thing using gradient. And okayers can push balls
some. Have fun. Race. Solve puzzles. Build bendy shapes. Etc.

START WITH THIS SIMPLE THING... A SINE WAVE GROOVE FOR BALL TO ROLL IN, WITH WIGGLE ROOM,
THAT IMPLEMENTS DIODE AKA 1WAYVALVE BUT TIME-SYMMETRICLY, AS BALL ROLLING ON IT
CAN BE PUSHED A LITTLE ONE WAY BUT NOT AS EASILY THE OTHER WAY.
...
NO, start with wavefunctionlikeDagballExample_fourierLikeDitchAtRadiusesChosenBy(a*sine(b+3*angle)+c*sine(d+4*angle)...)AndWhereverBallsRollItFouriersOnThatByGradient

Dagball...
Play with it. Find way to make dags reusable so it goviral. Stay rubberbandpath
compatible and tinyglsl compatible so keep it simple. Port to wikib later,
or earlier if want the lambda opcode for scalar fields.


var Rect = function(y, x, h, w){
	this.y = y;
	this.x = x;
	this.h = h;
	this.w = w;
};

var MultiRectMap = function(rects){
	this.rects = rects;
};
MultiRectMap.prototype.height = function(vec){
	throw new Error('TODO');
};

//a rectangle windowed heightmap of n dimensions (including Y and X) to 1 dimension (scalar field).
//Its not a dag, or if viewed that way, is just 1 level above Vars.
//TODO make rectangle editor and javascript code editor inside it and get started making curvy shapes
//to roll balls around and game controls to change the n input dims that varies the heightmap shape
//by moving crossSection viewed of constant high dimensional heightmap.
var RectMap = function(rect, code){
	this.rect = rect;
	this.code = code;
};
RectMap.prototype.height = function(vec){
	return vec[this.index];
};

var Var = function(index){
	this.index = index;
};
Var.prototype.height = function(vec){
	return vec[this.index];
};


//FIXME should this be part of the state? How else is it going to
//be optimized for "rubberbandlike path of allballstogether pos and vel and input dims, between state now"?
//Or could just start with funDagballPrototypeButNoAIYet without that rubberbandy paths stuff.
var Ball = function(id){
	this.id = id;
};


/*TODO how can it be both sparse (aftrans bellcurve windowed dags) AND work by dag.height(vec)?
It seems each dag would need to depend on specific indexs in vec.
Maybe I should name them a to z, for the first 26. Might need more dims but could generate more names later.
Or f0 f982 etc like I named them in audivolv is another option. In any case,
those vars are shared between multiple bellcurves while reused at different aftranses
and summed into a combined heightmap. So its at least well defined what the height is.
All vars except x and y (2d on screen) are NOT aftransed.
Each aftransedBellcurveDagGroup (bedag).
*

//Like ForestCurveFit, lets make index 0 in vec always have value 1, and put y and x at indexs 1 and 2.

//TODO include bellcurves in the .height functions.

//This is a a whole game world's heightmap.
//sparse dag, a set (actually list, but order has no effect except roundoff) of Bedags that are summed.
//TODO could this be a Dag?
var Spag = function(childs){
	this.childs = childs;
};
Spag.prototype.height = function(vec){
	throw 'TODO aftrans x and y (2 values in vec)';
};

//Example: Math.cos(angle), Math.sin(angle), -Math.sin(angle), Math.cos(angle), 0, 0.
//FIXME order of the 6 params.
var Aftrans = function(yx, yy, xy, xx, y, x){
	this.yx = yx;
	this.yy = yy;
	this.xy = xy;
	this.xx = xx;
	this.y = y;
	this.x = x;
	//this.radius is for optimization by not computing things that cant overlap.
	//circle centered at [this.y,this.x] that this fits in, if the thing transformed by this coordinate system fits in a unit circle.
	//FIXME check dotproduct and add something cuz if their angle is very parallel then it can add.
	this.radius = Math.sqrt(Math.max(this.yx**2+this.yy**2, this.xy**2+this.xx**2));
};
//a bellcurve whose max height is 1. FIXME how many stdDevs is radius outward.
//And should it be bellcurve or only similar to bellcurve but make it smoothly drop to exactly 0 within a finite distance?
Aftrans.prototype.bellHeightAtYX = function(y,x){
	throw new Error('TODO');
};
Aftrans.prototype.height = function(vec){
	return this.bellHeightAtYX(vec[Y], vec[X]);
};
Aftrans.prototype.forwardY = function(y,x){
	throw new Error('TODO');
};
Aftrans.prototype.forwardX = function(y,x){
	throw new Error('TODO');
};
Aftrans.prototype.reverseY = function(y,x){
	throw new Error('TODO');
};
Aftrans.prototype.reverseX = function(y,x){
	throw new Error('TODO');
};

/*Maybe later, but for now just do 2d aftrans and if need multiple instances of something, just copy it with different Vars...
TODO?? make a sparse permutation (of subset of dims in vec) thats similar to how Aftrans moves and rotates
to allow reuse of Vars and Dags on them...
I might want some SparsePermutation object that maybe goes in Bedag or something like Bedag,
that allows something higher in forest to permutate the Vars lower in it,
so the same Dags can be used as multiple instances of those Dags with separate input controls (indexs in vec),
like 2 of the "mostly flat platform with walls and obstacles in middle, that you tilt in 2d with 2 other dims" dags
that can be tilted by 4 dimensions, 2 dimensions each, even though theyre made of same dags.
Higher dimensional affine transforms can do that, so should I do that instead, merge Aftrans and SparsePermutation?
Not exactly, cuz storing it those 2 separate ways is more efficient.
Im not sure if I want such permutations or not.
*

var Bedag = function(dag, aftrans){
	this.dag = dag;
	this.aftrans = aftrans;
};
Bedag.prototype.height = function(vec){
	throw 'TODO bellcurveOrSomethingsimilarbutsmoothlydropsto0atfinitedistance-windowed aftrans x and y (2 values in vec)';
};

var Dag = function(childs, code){
	this.childs = childs;
	this.code = code; //TODO use cachedEval of this code, though it could also be TinyGLSL optimized.
	this.v = 0; //last val returned by cachedEval(this.code)(vec) or something like that.
};

Dag.prototype.height = function(vec){
	throw 'TODO use cachedEval(this.code)(vec) or something like that, but remember to ';
};

var Var = function(index){
	this.index = index;
};
Var.prototype.height = function(vec){
	return vec[this.index];
};

//TODO implement aftrans2d as Dag or make a new object type for it?
//Hopefully Dag is general enuf to do that itself? But maybe for sparse optimization, a few different types are good?


//FIXME should this be part of the state? How else is it going to
//be optimized for "rubberbandlike path of allballstogether pos and vel and input dims, between state now"?
//Or could just start with funDagballPrototypeButNoAIYet without that rubberbandy paths stuff.
var Ball = function(id){
	this.id = id;
};


var makeExampleGame = function(){
	let vars = [];
	for(let v=0; v<20; v++){
		vars.push(new Var(v));
	}
	let varBias = vars[BIAS]; //value should always be 1
	let varY = vars[Y];
	let varX = vars[X];
	let dagdistanceFromCenter = new Dag([varY,varX], '(a,b)=>Math.hypot(a,b)');

	throw new Error('TODO');
};
*/


/*
Bug: {i+1 linkExceptLast} in [...] is not generating code and is just displaying its ape.LoopName().
Thats how arrays and loop vars work but using a custom index in [...] is new (2023-11-21)
and the code was never written to do that.
c0_cbe2e6cfd434f4ec05c90be275663119f7e430e63d27235405a6b85346dbee124_i is {i+1 linkExceptLast}.
<(linkY2 float) [abc {i+1 linkExceptLast} 0%2]>
c0_linkY2_f = loc[c0_abc_o+c0_cbe2e6cfd434f4ec05c90be275663119f7e430e63d27235405a6b85346dbee124_i*2+0]; //146
mmDagball:circChain

ape: {+
	(abc locparMem (numChainLinks 5) (yxSize 2))
	<(sum float) 0>
	<(chainLinkDist float) .2>
	<(chainLinkHoleSize float) .1>
	<(chainLinkHoleSizePowNeg2 float) {f** chainLinkHoleSize -2}>
	{* numChainLinks
		{+
			<(linkY float) [abc numChainLinks 0%2]>
			<(linkX float) [abc numChainLinks 1%2]>
			<(dy float) {f- linkY y$}>
			<(dx float) {f- linkX x$}>
			<(distSq float) {f+ {f* dy dy} {f* dx dx}}>
			<(scaledDistSq float) {f* distSq chainLinkHoleSizePowNeg2}>
			<(holeHeightAtYX float) {f* -1.3 {fexp {f- scaledDistSq}}}>
			{f+= sum holeHeightAtYX}
		}
	}
	{* (linkExceptLast exceptLast numChainLinks)
		{+
			<(todoRemoveThisVar float) 3>
			<linkY [abc linkExceptLast 0%2]>
			<linkX [abc linkExceptLast 1%2]>
			<(linkY2 float) [abc {i+1 linkExceptLast} 0%2]>
			<(linkX2 float) [abc {i+1 linkExceptLast} 1%2]>
			<dy {f- linkY linkY2}>
			<dx {f- linkX linkX2}>
			<(linkLinkDist float) {fhypot dy dx}>
			<(linkLinkDistErr float) {f- chainLinkDist linkLinkDist}>
			{f+= sum {f* 1122.2 linkLinkDistErr linkLinkDistErr}}
		}
	}
	<potenCirc$ sum>
}

This is generated (possibly from a different run of the program with different ids) by ape.prefixNames during codeMaker
combining multiple apes into 1.
..
Dagball092.html:1359 Uncaught It didnt work in parseFloat so not a float string, and no Ape found of name c0_c4e888f70bfadc79a964e599a49b8efdf7640220bdd64e76486771031e7bb7183.
If name, youre supposed to define it earlier like sizeA in (matAB * (sizeA 3) sizeA).
{doLast (balls locparMem (numBalls 12) (floatsPerBall 2)) (circHeaders parlocMem (numCircs 2) (headerFloatsPerCirc 4)) (ballBal float) {+ <(epsilon float) 0.0009765625>
	 <(isDisplayElsePotensForGradient float) 1> {* (gradientCopyIndexUglyHackForDisplay copy {par}) <[{loc} gradientCopyIndexUglyHackForDisplay] [{par} gradientCopyIndexUglyHackForDisplay]>}
	  {* (loopSize1TodoRemoveLoopInThisCase 1) {+ <(heightASum float) 0> <(heightBSum float) 0> <(pixDistSum float) 0> <(pixBalSum float) 0> <(pixelY float) {i/ {id} {size {800}}}>
	   <(pixelX float) {imod {id} {size {800}}}> <(afAddY float) 300.> <(afAddX float) 400.> <(afMagnifyY float) 100.> <(afMagnifyX float) 100.>
	    <(y float) {f/ {f- pixelY afAddY} afMagnifyY}> <(x float) {f/ {f- pixelX afAddX} afMagnifyX}> <(potenOne float) 0> {listLoop numCircs
			 {+ <(circY float) [circHeaders numCircs 0%4]> <(circX float) [circHeaders numCircs 1%4]> <(circR float) [circHeaders numCircs 2%4]> 
				<(circInfluence float) [circHeaders numCircs 3%4]> <(circWindow float) {?: {fless {fhypot {f- circY y} {f- circX x}} circR} 1 0}> <(potenCirc float) 0>} 
				{f+= potenOne {f* potenCirc circInfluence circWindow}} (c0_c534f09ee33f6db84a320f9120969b9b635069e6c5d95f4489e3f5ce642973afc + (c0_abc locparMem (c0_numChainLinks 5)
				 (c0_yxSize 2)) <(c0_sum float) 0> <(c0_chainLinkDist float) 0.2> <(c0_chainLinkHoleSize float) 0.1> <(c0_chainLinkHoleSizePowNeg2 float)
				  (c0_c0b0db7dac5cf44c3b60d03613b28b0e3d5a215cebcdb667793ac656d1d88cc0c f** c0_chainLinkHoleSize -2)> 
				  (c0_c6a346976e15af376223a192c405cb461c6aa3c8b7b04754a4c854293b64358b2 * c0_numChainLinks (c0_c3134d5010cd6349b283cbf831eb84272736f36d5b8791098b8692f265faad848
				   + <(c0_linkY float) [c0_abc c0_numChainLinks 0%2]> <(c0_linkX float) [c0_abc c0_numChainLinks 1%2]> <(c0_dy float)
				    (c0_cc67657ed06cfc346acd850994d5828a1b8464d92e482aebad418a48408341a14 f- c0_linkY y$)> <(c0_dx float)
					 (c0_c997d90919e2161536de304d5d9904151fec65d45ad5b817add6b8dccf8c8fb26 f- c0_linkX x$)> <(c0_distSq float) 
					 (c0_c1d1a311c72de4022b31a9ebfafe1f907aca818a7f2206480e7db714a5576165b f+ (c0_ca3f21f482a593270284ea07f292f80fc952fb354f3779388ea879e03c9fd7fcb f*
					  c0_dy c0_dy) (c0_c0e2dc439c833eae012544a1f6853cdd21d11e3e8da6736ea48b7547ac5552012 f* c0_dx c0_dx))> <(c0_scaledDistSq float)
					   (c0_c99cabdb283b18f3a2a5e78a63bdd723d8a562af3f1c8de3eacd99a78407dd446 f* c0_distSq c0_chainLinkHoleSizePowNeg2)>
					    <(c0_holeHeightAtYX float) (c0_cf63eb0a4abbad83f945f05875c2c164c8277545a11e63118da856905543f3315 f* -1.3
						 (c0_c088294b98b5116c2f0e4b2f393e9262ab8e3757e2ec315ae92f1017df7497aa0 fexp (c0_ca1f25545a23859bb2d8e3691985b94dbd79d884c101084eff148c8f68bb981da
						  f- c0_scaledDistSq)))> (c0_c71b124a40d9546253aa8db6733f964580e490dc632a77181553c3f2b623850b9 f+= c0_sum c0_holeHeightAtYX)))
						   (c0_c16afa2d0c6dd3029ba4827ea6a74353ab3d9513538788bd99be0cf258fc3aeba * (c0_linkExceptLast exceptLast c0_numChainLinks)
						    (c0_cdc0b6735e930535b967690ef72b8d753c2220012b910ce82f20cd2e0062a6b4c + <c0_linkY [c0_abc c0_linkExceptLast
							 c0_c4e888f70bfadc79a964e599a49b8efdf7640220bdd64e76486771031e7bb7183]> <c0_linkX [c0_abc c0_linkExceptLast
							  c0_cc11f36a3603bac5afbc5b82758ea1c697eea0b4f25a19e939534fb302d0397e7]> <(c0_linkY2 float)
   [c0_abc (c0_cd75e22dc5579302e5727d4c3e3c6b4a9d8e329f5b149ad3780795812047cad41 i+ c0_linkExceptLast 1)
 c0_c4e888f70bfadc79a964e599a49b8efdf7640220bdd64e76486771031e7bb7183]> <(c0_linkX2 float)
[c0_abc (c0_c63755ec3ac92829c99fa08f71df2a5900aa4327518b85ca1dcd229918d9efcc6 i+ c0_numChainLinks c0_c1)
 c0_cc11f36a3603bac5afbc5b82758ea1c697eea0b4f25a19e939534fb302d0397e7]>
<c0_dy (c0_cfbff9f3576b46b82b202b275e807b2f119a7f33cc4b8b3d2fb2b118036bee7b4 f- c0_linkY c0_linkY2)> <c0_dx (c0_c15514093bfb6fb5a4a3c6166be75f00951154e4901e82b0eaf20c7286ccc6fe2
	 f- c0_linkX c0_linkX2)> <(c0_linkLinkDist float) (c0_c37e96ff7c4a24477f557133fbc1a4ec5d1d33fb0bc0b5d2a0c947adb98a3ec51 fhypot c0_dy c0_dx)>
	  <(c0_linkLinkDistErr float) (c0_ce5e49f1cf9dc7d4df71c6ac5dea4dad7909cbd10c54f1ba492827bcc191269eb f- c0_chainLinkDist c0_linkLinkDist)>
	   (c0_c9c21278189668a22625a79f7d439ed72c3a1386c2c965b8f08cf92eca71d54af f+= c0_sum (c0_c4424b6676a01b7d024ceb54668142fb0829dc302b073236858b313a005642b22
	    f* c0_c0.2 c0_linkLinkDistErr c0_linkLinkDistErr)))) <potenCirc$ c0_sum>) (c6_cc7e7398d8fb69e6ad92fe2fda3b722273c8d58437a1a6207c2759fe19b607d05 +
		 (c6_abc locparMem (c6_c1efccd6afd44eede3f5fdec9fe2956d3f5ad80a8c3d277e2a28f2649aca7c44a 5)) <(c6_a float)
		  (c6_c6c1c3b4d216bbeb574dae44c9b13791649ea3b00b7e02f336e2ec68333d50edf locPtr c6_abc 4%99)> <potenCirc$
		   (c6_cea2655c713cd0f27dd85f6ea42c80aa14ebe084f729fc47e1d76438947ea42e4 f+ 0.2 (c6_c58e040710e4b6d0ebd4c81f2a67937f96b4b8d4a6d846e92940dcd6d88bbde94
		    fsin (c6_c3e1d7a5f98c1eafafabe9899ffa196f78bc798056234edad7ac021cd4ed8fc4a f* (c6_c6ebc14c320dd02f39c73a68ed839e8f4f5629b5d53063442b6b1f47306015049
			 f+ x$ c6_a) y$ 33)))>)} {f+= (potenSum float) potenOne}}} {freturn potenSum}}}


Dagball092.html:1367 Uncaught Error: ERROR: 0:146: 'c0_cbe2e6cfd434f4ec05c90be275663119f7e430e63d27235405a6b85346dbee124_i' : undeclared identifier
ERROR: 0:146: '*' : wrong operand types - no operation '*' exists that takes a left-hand operand of type 'const highp float' and a right operand of type 'const int' (or there is no acceptable conversion)
ERROR: 0:146: '+' : wrong operand types - no operation '+' exists that takes a left-hand operand of type 'const mediump int' and a right operand of type 'const highp float' (or there is no acceptable conversion)
ERROR: 0:147: 'c0_cbe2e6cfd434f4ec05c90be275663119f7e430e63d27235405a6b85346dbee124_i' : undeclared identifier
ERROR: 0:147: '*' : wrong operand types - no operation '*' exists that takes a left-hand operand of type 'const highp float' and a right operand of type 'const int' (or there is no acceptable conversion)
ERROR: 0:147: '+' : wrong operand types - no operation '+' exists that takes a left-hand operand of type 'const mediump int' and a right operand of type 'const highp float' (or there is no acceptable conversion)
 

FRAGMENTSHADERCODE:
#version 300 es
				precision highp float; //2
				 //3
				uniform vec2 mouse; //4
				uniform float par[47]; //5
				in vec2 coord; //6
				//flat in int id; //7
				out vec4 fragColor; //8
				void main(){ //9
					const int pars = 47; //number of params in the par array //10
					const int idh = 6; //height in pixels //11
					const int idw = 8; //width in pixels //12
					int idy = int(coord.y*float(idh)); //y position from 0 to idh-1 //13
					int idx = int(coord.x*float(idw)); //x position from 0 to idw-1 //14
					int id = idy*idw+idx; //2d pixel index in 1 int //15
					const int ids = idh*idw; //height*width //16
					float ret = 0.; //floatsOutPerPixel=1 use ret retb retc retd if 4, use just ret if 1. //17
					float retb = 0.; //18
					float retc = 0.; //19
					float retd = 0.; //20
					//TODO for funcs of up to 10 float params, math expressions to refer to child float outputs multiple times, etc. //21
					float temp0 = 0.; float temp1 = 0.; float temp2 = 0.; float temp3 = 0.; float temp4 = 0.; //22
					float temp5 = 0.; float temp6 = 0.; float temp7 = 0.; float temp8 = 0.; float temp9 = 0.; //23
					float circY = 0.; //each dagball.Circ.y //FIXME remove dagball-specific and Ap.Ape-specific code. //24
					float circX = 0.; //each dagball.Circ.x //25
					float circR = 0.; //each dagball.Circ.r //26
					float circInfluence = 0.; //each dagball.Circ.influence //27
					float circWindow = 0.; //0 to 1. using the circle as a windowing function //28
					float potenCirc = 0.; //circs GPU code sets this. gets added into potenOne automatically. then in outer loop over balls, potenOne gets added into potenSum. //29
					//start user code //30
					float loc[47]; //contains all locMem, locparMem, parlocMem arrays. ptrLoc or ptr can point into here. //31
const int balls_o = 0; //array offset in parMem and locMem (locparMem) //32
const int balls_s = 24; //array size in parMem and locMem (locparMem) //33
const int circHeaders_o = 24; //array offset in parMem and locMem (parlocMem) //34
const int circHeaders_s = 8; //array size in parMem and locMem (parlocMem) //35
const int c0_abc_o = 32; //array offset in parMem and locMem (locparMem) //36
const int c0_abc_s = 10; //array size in parMem and locMem (locparMem) //37
const int c6_abc_o = 42; //array offset in parMem and locMem (locparMem) //38
const int c6_abc_s = 5; //array size in parMem and locMem (locparMem) //39
float ballBal_f = 0.; //40
float epsilon_f = 0.; //41
float isDisplayElsePotensForGradient_f = 0.; //42
float heightASum_f = 0.; //43
float heightBSum_f = 0.; //44
float pixDistSum_f = 0.; //45
float pixBalSum_f = 0.; //46
float y_f = 0.; //47
float x_f = 0.; //48
float potenOne_f = 0.; //49
float circY_f = 0.; //50
float circX_f = 0.; //51
float circR_f = 0.; //52
float circInfluence_f = 0.; //53
float circWindow_f = 0.; //54
float potenCirc_f = 0.; //55
float c0_sum_f = 0.; //56
float c0_chainLinkDist_f = 0.; //57
float c0_chainLinkHoleSize_f = 0.; //58
float c0_chainLinkHoleSizePowNeg2_f = 0.; //59
float c0_linkY_f = 0.; //60
float c0_linkX_f = 0.; //61
float c0_dy_f = 0.; //62
float c0_dx_f = 0.; //63
float c0_distSq_f = 0.; //64
float c0_scaledDistSq_f = 0.; //65
float c0_holeHeightAtYX_f = 0.; //66
float c0_todoRemoveThisVar_f = 0.; //67
float c0_linkY2_f = 0.; //68
float c0_linkX2_f = 0.; //69
float c0_linkLinkDist_f = 0.; //70
float c0_linkLinkDistErr_f = 0.; //71
float c6_a_f = 0.; //72
float potenSum_f = 0.; //73
const int par_o = 0; //view of whole {par} shared array //74
const int loc_o = 0; //view of whole {loc} shared array //75
const int big_o = 0; //view of whole {big} shared array //76
const int par_s = 47; //size of {par} shared array //77
const int loc_s = 47; //size of {loc} shared array //78
const int big_s = 0; //size of {big} shared array //79
epsilon_f = 0.0009765625; //80
isDisplayElsePotensForGradient_f = 0.; //81
for(int gradientCopyIndex_i=0; gradientCopyIndex_i<47; gradientCopyIndex_i++){ //82
	loc[loc_o+gradientCopyIndex_i] = ( //83
			par[par_o+gradientCopyIndex_i] + //84
			(( //85
					gradientCopyIndex_i == //86
					id) ? epsilon_f : 0.)); //87
} //88
for(int numBalls_i=0; numBalls_i<12; numBalls_i++){ //89
	heightASum_f = 0.; //90
	heightBSum_f = 0.; //91
	pixDistSum_f = 0.; //92
	pixBalSum_f = 0.; //93
	y_f = loc[balls_o+numBalls_i*2+0]; //94
	x_f = loc[balls_o+numBalls_i*2+1]; //95
	potenOne_f = 0.; //96
	int numCircs_i = 0; //listLoop iter (numCircs 2) //97
	 //98
	circY_f = par[circHeaders_o+numCircs_i*4+0]; //99
	circX_f = par[circHeaders_o+numCircs_i*4+1]; //100
	circR_f = par[circHeaders_o+numCircs_i*4+2]; //101
	circInfluence_f = par[circHeaders_o+numCircs_i*4+3]; //102
	circWindow_f = ((length(vec2( //103
					( //104
						circY_f - //105
						y_f), //106
					( //107
						circX_f - //108
						x_f)))<circR_f) ? 1. : 0.); //109
	potenCirc_f = 0.; //110
	//in {+ ...}, outermostIsDeclaringMem c0_abc //111
	c0_sum_f = 0.; //112
	c0_chainLinkDist_f = 0.2; //113
	c0_chainLinkHoleSize_f = 0.1; //114
	c0_chainLinkHoleSizePowNeg2_f = pow( //115
			c0_chainLinkHoleSize_f, //116
			-2.); //117
	for(int c0_numChainLinks_i=0; c0_numChainLinks_i<5; c0_numChainLinks_i++){ //118
		c0_linkY_f = loc[c0_abc_o+c0_numChainLinks_i*2+0]; //119
		c0_linkX_f = loc[c0_abc_o+c0_numChainLinks_i*2+1]; //120
		c0_dy_f = ( //121
				c0_linkY_f - //122
				y_f); //123
		c0_dx_f = ( //124
				c0_linkX_f - //125
				x_f); //126
		c0_distSq_f = ( //127
				( //128
					c0_dy_f * //129
					c0_dy_f) + //130
				( //131
					c0_dx_f * //132
					c0_dx_f)); //133
		c0_scaledDistSq_f = ( //134
				c0_distSq_f * //135
				c0_chainLinkHoleSizePowNeg2_f); //136
		c0_holeHeightAtYX_f = ( //137
				-1.3 * //138
				exp(-c0_scaledDistSq_f)); //139
		c0_sum_f += c0_holeHeightAtYX_f; //140
	} //141
	for(int c0_linkExceptLast_i=0; c0_linkExceptLast_i<4; c0_linkExceptLast_i++){ //142
		c0_todoRemoveThisVar_f = 3.; //143
		c0_linkY_f = loc[c0_abc_o+c0_linkExceptLast_i*2+0]; //144
		c0_linkX_f = loc[c0_abc_o+c0_linkExceptLast_i*2+1]; //145
		c0_linkY2_f = loc[c0_abc_o+c0_cbe2e6cfd434f4ec05c90be275663119f7e430e63d27235405a6b85346dbee124_i*2+0]; //146
		c0_linkX2_f = loc[c0_abc_o+c0_cbe2e6cfd434f4ec05c90be275663119f7e430e63d27235405a6b85346dbee124_i*2+1]; //147
		c0_dy_f = ( //148
				c0_linkY_f - //149
				c0_linkY2_f); //150
		c0_dx_f = ( //151
				c0_linkX_f - //152
				c0_linkX2_f); //153
		c0_linkLinkDist_f = length(vec2( //154
				c0_dy_f, //155
				c0_dx_f)); //156
		c0_linkLinkDistErr_f = ( //157
				c0_chainLinkDist_f - //158
				c0_linkLinkDist_f); //159
		c0_sum_f += ( //160
				1122.2 * //161
				c0_linkLinkDistErr_f * //162
				c0_linkLinkDistErr_f); //163
	} //164
	potenCirc_f = c0_sum_f; //165
	 //166
	potenOne_f += ( //167
			potenCirc_f * //168
			circInfluence_f * //169
			circWindow_f); //170
	numCircs_i = 1; //listLoop iter (numCircs 2) //171
	 //172
	circY_f = par[circHeaders_o+numCircs_i*4+0]; //173
	circX_f = par[circHeaders_o+numCircs_i*4+1]; //174
	circR_f = par[circHeaders_o+numCircs_i*4+2]; //175
	circInfluence_f = par[circHeaders_o+numCircs_i*4+3]; //176
	circWindow_f = ((length(vec2( //177
					( //178
						circY_f - //179
						y_f), //180
					( //181
						circX_f - //182
						x_f)))<circR_f) ? 1. : 0.); //183
	potenCirc_f = 0.; //184
	//in {+ ...}, outermostIsDeclaringMem c6_abc //185
	c6_a_f = loc[c6_abc_o+4]; //186
	potenCirc_f = ( //187
			0.2 + //188
			sin( //189
					( //190
						x_f + //191
						c6_a_f) * //192
					y_f * //193
					33.)); //194
	 //195
	potenOne_f += ( //196
			potenCirc_f * //197
			circInfluence_f * //198
			circWindow_f); //199
	potenSum_f += potenOne_f; //200
} //201
ret = potenSum_f; //202
					//end user code //203
					fragColor = vec4(ret, retb, retc, retd); //204
				} //205

    at TinyGLSL.js:718:13
    at Object.cache (TinyGLSL.js:274:49)
    at TinyGLSL.js:713:35
    at Object.cache (TinyGLSL.js:274:49)
    at Object.internalGLSL_disorganizedTODO (TinyGLSL.js:683:27)
    at Object.simple (TinyGLSL.js:171:20)
    at Ap.Call.eval (Ap.js:703:18)
    at dagball.Game.gradient (Dagball092.html:5051:30)
    at dagball.Game.doPhysics (Dagball092.html:5170:25)
    at dagball.Game.nextState (Dagball092.html:6235:8)
*/


</script></head><body style="margin: 0;padding: 0;overflow: hidden;width: 100%;height: 100%;">
	<font color=white>
		<div style="position:absolute;top:0px;left:0px;z-index:300;opacity:.6">
			<input type=checkbox id=showLeftControls checked oninput="let b = document.getElementById('overCanvas'); b.style.display = this.checked ? 'flex' : 'none';"><label for=showLeftControls id=showLeftControlsLabel>menu (Esc)</label>
		</div>
	</font>
	<font color=white id="overCanvasB">
		<h3><div id=displayLogs style="z-index:1;position:absolute;left:0px;top:0px;opacity:.6;user-select:none;">displayLogs</div></h3>
	</font>
	<div id="overCanvas" style="z-index:1; position:absolute; left:0px; top:200px; opacity:.6; display: flex; flex-direction: column; height: 100%;">
	
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
	<nobr style="z-index:1; position:absolute; left:100px; top:2px;">
	<input type=checkbox id=showLeftTopControls checked oninput="let b = document.getElementById('overCanvasTop'); b.style.display = this.checked ? 'flex' : 'none';"><label for=showLeftTopControls id=showLeftControlsLabel>top</label>
	<input type=checkbox id="varEqLogs"><label for="varEqLogs">var=</label>
	<input type=checkbox id=pauseDagball><label for=pauseDagball>pause</label>
	</nobr>
	<div id=overCanvasTop style="display:flex;flex-direction:column;">
		<nobr style="position:absolute;bottom:-16px;left:0px"><a href="https://github.com/benrayfield/DagBall"><font color=#00f>https://github.com/benrayfield/DagBall</font></a> (lowest lag in OperaGX? TODO linux android mac etc)</nobr>
	<font color=white>
		<input type=range min=100000 max=1000000 value=720000 title="transparency of this stuff on the left" oninput="let fraction = this.value/1000000;  document.getElementById('displayLogs').style.opacity=document.getElementById('overCanvas').style.opacity=fraction;">
		<input type=checkbox id=doDiffeq checked><label for=doDiffeq>diffeq</label>
		<input type=checkbox id=isShowWhichCircleIsSelected checked><label for=isShowWhichCircleIsSelected>flash selected</label>
		<input type=checkbox id=isDisplayGradientsAsBrightnessOfRectanglesOnBackground><label for=isDisplayGradientsAsBrightnessOfRectanglesOnBackground>gradient rects</label>
		<br>
	
		<input type=checkbox id=doAllPairsOfBalls checked><label for=doAllPairsOfBalls>bounce balls together</label>
		<input type=checkbox id=doStatisticalCollisionsBetweenWavefunctions><label for=doStatisticalCollisionsBetweenWavefunctions>wavefunction collisions</label>
		<input type=checkbox id=displayWavefunctionCollisionsAsBackground><label for=displayWavefunctionCollisionsAsBackground>&lt;-- display</label>
		<input type=checkbox id=displayGobs checked><label for=displayGobs>displayGobs</label>
		<input type=checkbox id=doColorBackground><label for=doColorBackground>colorbackg</label>
		<br>
	
		<input type=checkbox id=isDisplayCircOutlines checked><label for=isDisplayCircOutlines>isDisplayCircOutlines</label>
		<input type=checkbox id=isDisplayEdges checked><label for=isDisplayEdges>isDisplayEdges</label>
		<input type=checkbox id=isDisplayEds checked><label for=isDisplayEds>isDisplayEds</label>
		<input type=checkbox id=isDetailedVerySlowDisplayOfBitpic><label for=isDetailedVerySlowDisplayOfBitpic>isDetailedVerySlowDisplayOfBitpic</label>
		<br>

		<input type=checkbox id=isDisplayBallText checked><label for=isDisplayBallText>displayBallText</label>
		<input type=checkbox id=isDisplayBallCircles checked><label for=isDisplayBallCircles>displayBallCircs</label>
		<input type=checkbox id=experimentalGradientMul2><label for=experimentalGradientMul2>gradMul2</label>
		<input type=checkbox id=doKnobGradients checked><label for=doKnobGradients>knobGrads</label>
		<input type=checkbox id=moreGpuThreadsByForkBalls><label for=moreGpuThreadsByForkBalls>moreGpuThreadsByForkBalls</label>
		<br>
		
		<input type=checkbox id=isDisplayDetailedEdsAlways><label for=isDisplayDetailedEdsAlways>detailedEdsAlways</label>
		<input type=checkbox id=detailedEdsIfSelected checked><label for=detailedEdsIfSelected>detailedEdsIfSelected</label>
		<input type=checkbox id=gamepadBallsEtc checked><label title="Use gamepad analog joysticks etc to control some of the ball(s). This is experimental 2024-1-21, trying to make game characters out of a few balls each that jump and bounce around the dagball world." for=gamepadBallsEtc>gamepadBallsEtc</label>
		<input type=checkbox id=showGlslCodeOfApesInRightTextarea oninput="dagball.updateDebugTextArea();"><label id=showGlslCodeOfApesInRightTextareaLabel for=showGlslCodeOfApesInRightTextarea>GLSL and errors out --&gt;</label>
		<br>

		<input type=checkbox id=alwaysUpdateViewInNextState><label for=alwaysUpdateViewInNextState>alwaysUpdateViewInNextState</label>
		<input type=checkbox id=compileCircHeadersUsingLocMem><label title="checkboxToHardcodeCircHeadersIntoGpuCodeToReduceDimsEspeciallyIfAlotOf1DimCircs" for=compileCircHeadersUsingLocMem>compileCircHeadersUsingLocMem</label>
		<input type=checkbox id=paintBitpicAllAtOnce checked><label for=paintBitpicAllAtOnce>paintBitpicAllAtOnce</label>
		<br>

		<input type=checkbox id=showGroundHeightOnMouse><label for=showGroundHeightOnMouse>heightOnMouse</label>
		<input type=checkbox id=textareaEventUpgrades><label for=textareaEventUpgrades title="If checked, the tab button in textarea types a tab. If unchecked, it tabs out of the textarea. 2024-5-10 I suspect this (if checked) might be causing the compiler to be very slow, to wait up to 20 seconds after you type anything into textarea before that thing appears in textarea, but am still tracking down the problem. 2024-6-2 the problem is GLSL compiler is slow for big complex andOr deep looping GLSL code (generated by Ap code) but that might be improveable by reusing canvas, GL, and other objects for different GLSL codes of the same array sizes (already reuses those for same code again).">textareaEventUpgrades</label>
		<input type=checkbox id=mouseDragsKnobs checked><label for=mouseDragsKnobs title="mouse drags dagball.EdSliderKnob's instead of whatever other controls it may be attached to, when its touching knobs">drag knobs</label>
		<br>

		Display which ed lines, regex +<input type=text id=edIncludeRegex title="edIncludeRegex" value="^(.*)$" oninput="console.log('edIncludeRegex='+this.value); dagball.handleIf_wasErrorNeedMainLoopRestart();">
		-<input type=text id=edExcludeRegex title="edExcludeRegex" value="^(hdr|V)$" oninput="console.log('edExcludeRegex='+this.value); dagball.handleIf_wasErrorNeedMainLoopRestart();">
		<br>

		{<input type=checkbox id=doNN checked><label for=doNN>circ.nn</label>
		<input type=button value="make neuralnet in selected circ" onclick="dagball.selectedCircs().map(circ=>{ let hiddens = Math.ceil(10+circ.edsOut.length**1.5); let ave = 0; let dev = Math.sqrt(hiddens); circ.createNN(hiddens, ave, dev); });">
		<input type=button value="X" onclick="dagball.selectedCircs().map(circ=>{ circ.nn=null; });">
		<!--input type=button value="see nnet weights" title="neuralnet weights of selected circ, if any. FIXME displayTxtQuiet is replaced by selected circs circ.text as usual so doesnt work so i made it unselect the circ by calling displayTxt."
			onclick="let circ = dagball.selectedCircs()[0]; if(circ && circ.nn) dagball.displayTxt(circ.nn.rbmLayer.array2dToString());"-->
		<input type=button value="see nnet weights & V/H" title="neuralnet weights of selected circ, if any. FIXME displayTxtQuiet is replaced by selected circs circ.text as usual so doesnt work so i made it unselect the circ by calling displayTxt."
			onclick="let circ = dagball.selectedCircs()[0]; if(circ && circ.nn){ let v = circ.nn.getVisible(); let h = circ.nn.rbmLayer.forward(v); dagball.displayTxt(circ.nn.rbmLayer.array2dToStringWithVisibleAndHidden(v,h)); }">
		}
		<input type=button value="runServerInBrowser" title="after starting Tomcat with webapps/dagverse/index.html and this html file should be webapps/dagball.html and some js files in webapps/lib/*.js" onclick="DV.runServerInBrowser();">
		<input type=button value="X" title="stops the browser part of dagverse server (you may have started it with runServerInBrowser button). Another way is to just close this browser tab. But Tomcat will still be running and youd have to close that directly if you want to stop the whole server cuz otherwise other browsers may keep calling urls and it wont respond cuz this browser part of the server stopped ajaxing to tomcat (TODO)." onclick="DV.stopServerInBrowser();">
		<br>
		
		((<input type=checkbox id=sparseWorld><label for=sparseWorld title="only sim/display near view">sparseWorld</label>
		<input type=checkbox id=sparseWorldOnlyInfluence><label for=sparseWorldOnlyInfluence title="for testing 'only sim/display near view', is sparse in influence but everything in the whole game world is still computed in GPU so its not actually sparse.">denseInGPU</label>
		[
		<input type=checkbox id=fadeTiles><label for=fadeTiles title="When checked, use the next 2 boxes to gradually fade circ.influence (from 1/exists to 0/ignore) when it gets that far away, else just let the other 2 checkboxes (which act either way) handle it. Of course if the sparseWorld box is unchecked, none of this happens, and all circs are computed all the time.">fadeTiles</label>
		dist=<input id=sparseDist type=number style="width:6ch" step=".01" value=8 min=.3 max=50 title="circ.influence ranges 0 to 1 and is 0 past this so not computed in GPU, if the 'only sim/display whats near view' checkbox is checked. If its unchecked, distance is infinity.">
		*<input id=sparseDistFrac type=number style="width:6ch" step=".01" value=.7 min=0 max=1 title="fadeDist, multiplied by dist (sparseDist). circ.influence ranges 0 to 1 and fades downward from 1 when farther than this times the distance number box">
		]
		<input type=checkbox id=never0CircsInGPU checked oninput="console.log('never0CircsInGPU oninput'); let enabled = this.checked; dagball.doAsap(()=>{ dagball.set_circNever0CircsInGPU_enabled(enabled); });"><label for=never0CircsInGPU>never0CircsInGPU</label>
		<br>
		{
		<input type=checkbox id=sparseWorldTiles checked><label for=sparseWorldTiles title="GPU compile less often by using tiles. This text is not accurate 2024-2-23, see code in hasGpuCodeAndShouldUseIt for details: If sparseWorld checkbox is checked, it has to GPU recompile whenever the set of circs (maybe also balls later?) to compute in GPU changes. This often gets cached in Ap.js as it uses 2 off-screen-canvases per compile (one for graphics and one for physics) so seamlessly swaps between GPU compiles if cached, but if not cached it takes maybe 1/2 or 1/5 or 1 second. So to reduce the number of compiles, you check this box so it divides the partially-overlapping sets of circs into 2x2 or 3x3 or 4x4 or 5x5 etc tiles, while still using nearDist and farDist to adjust circ.computeInfluence() so its still a smooth high dimensional scalarField during all that.">tiles</label>
		<input type=checkbox id=displayTiles checked><label for=displayTiles title="Display the tile borders of size dagball.tileSize(), which is only relevant if sparseWorld and sparseWorldTiles checkboxes are checked ">&lt;-display.</label>
		tileSize<input id=tileSize type=number style="width:6ch" min=1 max=100 step=1 value=4>
		gpuTilesOutward<input id=gpuCompileNumTilesOutward type=number style="width:6ch" step=".1" value=1 min=.1 max=20>
		}
		<input type=button value="move view around to preload" title="If sparseWorld is checked, you might notice 1/3 second loading time when you move. Click this to move around (and come back to where it started) and get that over with. If you change some things it will have to be loaded again." onclick="dagball.moveViewAroundToPreload();">
		))
		
	</font>
		<nobr>
			<font color=white>
			bVelDec=<input id=baseVelDecay type=number style="width:8ch" step=".01" value=0.6>
			gradMul=<input id=gradientMul type=number style="width:8ch" step=".1" value=2>
			<input type=checkbox id=centerViewOnGamepadBall><label for=centerViewOnGamepadBall>follow gamepad ball</label>
			<input type=checkbox id=do_readSmoothYX_onDisplayPotens><label for=do_readSmoothYX_onDisplayPotens>blob walls</label>
			<input type=checkbox id=displayGameBorders><label for=displayGameBorders>borders</label>
			<br>

			<input type=button value="1" title="dagball.physicsCyclesPerVideoFrame = 1" onclick="dagball.physicsCyclesPerVideoFrame = 1;"><input type=checkbox id=varyPhysicsCycs checked><label id="varyPhysicsCycsLabel" title="vary num physics cycles per video frame" for=varyPhysicsCycs>varPhy</label>
			<input type=checkbox id=fpsCheckbox checked oninput="document.getElementById('fpsLabel').innerHTML = 'FPS=';"><label id=fpsLabel for=fpsCheckbox>FPS=</label>
			[
			<input type=button id=paintWalls value="bitpic" title="pops up questions about size (make it a powOf2 and both same size) then creates dagball.bitpic" onclick="let h = parseFloat(prompt('bitpic height?','1024')); let w = parseFloat(prompt('bitpic width?',''+h)); dagball.addExampleBitPic(h,w);">
			<input type=button value="->bloomtree" onclick="if(!dagball.bitpic) alert('Theres no dagball.bitpic yet. Click bitpic button and paint on it first.'); else dagball.bloomtree = dagball.bitpic.toBloomTree();">
			<input type=button value="<--" title="dagball.bitpic <- dagball.bloomtree (if bloomtree has any transparent pixels, it will leave those in bitpic as they are)" onclick="if(!dagball.bloomtree) alert('Theres no dagball.bloomtree yet'); else dagball.bloomtree.paintOntoBitPic(dagball.bitpic);">
			<input type=button value="<logB4" title="log in base4 dagball.bloomtree.bytes" onclick="console.log(dagball.bytesToBase4(dagball.bloomtree.bytes));">
			<input type=button value="<logB64" title="log in base64 dagball.bloomtree.bytes" onclick="console.log(dagball.bytesToBase64(dagball.bloomtree.bytes));">
			<input type=button value="endian" title="forEndianSwapEvery4Bytes. this is for upgrading saved bitpics from ints to bytes so i dont have to deal with endian." onclick="if(!dagball.bitpic) alert('Theres no dagball.bitpic yet. Click bitpic button and paint on it first.'); else dagball.forEndianSwapEvery4Bytes(dagball.bitpic.bytes);">
			<input type=button value="dagverse" title="copy game state to browser console as a test" onclick="let setOfMaps = dagball.gameStateToMaps(); console.log('Dagverse setOfMaps, dvid then json val=...'); for(let map of setOfMaps) console.log(DV.mapToId(map)+':'+JSON.stringify(map)+', //TODO norm it in DV');">
			]
			<br>

			{
			<input type=button value="Add example game rules" onclick="dagball.addExampleGameRules();">
			<input type=button value="Add 100 gobs" onclick="for(let i=0; i<100; i++) dagball.gobs.push(new dagball.Gob());">
			}
			[
				<input type=checkbox id="doCurveGrab" checked><label for=doCurveGrab>doCurveGrab</label>
				<input type=button value="[1,+-1,1]" title="Set all ball.curveGrab to randomly [1,Math.random()<.5 ? -1 : 1,1]" onclick="dagball.balls.map(b=>{ b.curveGrab = [1,Math.random()<.5 ? -1 : 1,1]; b.red = b.green = b.blue = 128+127*b.curveGrab[1]; })">
				<input type=checkbox id="mouseBall"><label for=mouseBall checked>mouseBall</label>
			]
			<br>
			
			(Balls
			<input type=button value="-10" onclick="for(let i=0; i<10 && dagball.balls.length > 1; i++) dagball.removeBall();">
			<input type=button value="-1" onclick="if(dagball.balls.length > 1) dagball.removeBall();">
			<input type=button value="+1" onclick="dagball.addBall();">
			<input type=button value="+10" onclick="for(let i=0; i<10; i++) dagball.addBall();">
			<input type=checkbox id=rockPaperScissors checked><label for=rockPaperScissors>rockPaperScissors</label>
			<input type=button value="rpsRandomizeBallTeams" onclick="dagball.rpsRandomizeBallTeams();">
			<input type=button id=renameAllBalls value="Set ball names" onclick="dagball.renameAllBalls();">
			)
			</font>
		</nobr>
		<nobr>
			<font color=white>
			{
			<input type=button value="GLSL->console (1)" onclick="TinyGlsl.logNextNGlslCodes = Math.max(TinyGlsl.logNextNGlslCodes,1);">
			<input type=button value="JS diffeq (1)" onclick="dagball.displayTxt(dagball.view.mergedApCalls.singleHeightmapCpuDiffeq.toCode('js'));" style="background-color:#ccccff">
			<input type=button value="&lt;-- eval" onclick="let code = dagball.view.mergedApCalls.singleHeightmapCpuDiffeq.toCode('js')+'\n//# sourceURL=singleHeightmapCpuDiffeq.js'; console.log('jsCode=\n'+code); console.log('Evaling...'); eval(code);" style="background-color:#ccccff">
			<input type=button value="(both, will get duplicates unless varPhy is 1)" onclick="TinyGlsl.logNextNGlslCodes = Math.max(TinyGlsl.logNextNGlslCodes,2);"><br>
			<input type=button value="(10)" onclick="TinyGlsl.logNextNGlslCodes = Math.max(TinyGlsl.logNextNGlslCodes,10);">
			<input type=button value="(A_get)" title="does 1 of A0 or A1 depending on transformFloatValsToVArray checkbox" onclick="dagball.displayTxt(dagball.get_singleHeightmapPotentialEnergiesForGradient().code);">
			<input type=button value="(A0)" onclick="dagball.displayTxt(dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient.code);">
			<input type=button value="(A1)" onclick="let apCall = dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient_transformFloatValsToVArray; dagball.displayTxt(apCall.code || 'No dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient_transformFloatValsToVArray, probably cuz of transformFloatValsToVArray checkbox being unchecked (is it?)');">
			<input type=button value="See display ape _get:" onclick="dagball.displayTxt(''+dagball.get_singleHeightmapDisplay().ape);">
			}
			<input type=checkbox id=wallsIfExist checked><label for=wallsIfExist>wallsIf</label>
			<input type=button value="PV" onclick="let ob = dagball.randInList(Math.random()<.5 ? dagball.balls : dagball.circles); dagball.displayTxt(JSON.stringify(ob.toPv()));">
			<input type=checkbox id=selectedCircIsPreferCpu oninput="dagball.doAsap(dagball.update_selectedCircIsPreferCpu_fromCheckbox);"><label for=selectedCircIsPreferCpu>circ.preferCpu</label>
			</font>
		</nobr>
		<nobr>
			<font color=white>
			<input type=checkbox id=saveToPubInternetBtn_lockCheckbox oninput="document.getElementById('saveToPubInternetBtn').disabled = !this.checked;"><label for=saveToPubInternetBtn_lockCheckbox>unlock --&gt;</label>
			<input type="button" id=saveToPubInternetBtn disabled value="Save to public Internet, no takebacks" onclick="if(confirm('This doesnt work yet 2024-2-24 but will use Dagverse.js/DV. Save to public Internet (no take backs, maybe forever whether u like it or not, TODO similar to IPFS)?')) alert('TODO: make them agree to (by the text of the button?) put it into public domain or MIT license or something, so they cant legally stop others from sharing and building variants of it.');">
			(
			<input type="button" value="Test ed25519, see console" onclick="DV.naclBasics.testNacl();" title="see console">
			<input type="button" value="<--jsondag" onclick="let x = Dv({zz:2,hello:5,yy:22}); let y = Dv(x,x); for(let i=0; i<5; i++) y = Dv(x,y,'i='+i); y.logJsonll();" title="see console">
			)
			</font>
		</nobr>
		<nobr>
			<input type=button value="Quicksave 1 (cookie)" onclick="dagball.quicksave('1')">
			<input type=button value="QS 2" onclick="dagball.quicksave('2')">
			<input type=button value="3" onclick="dagball.quicksave('3')">
			<input type=button value="4" onclick="dagball.quicksave('4')">
			<input type=button value="5" onclick="dagball.quicksave('5')">
			<input type=button value="6" onclick="dagball.quicksave('6')">
			<input type=button value="7" onclick="dagball.quicksave('7')">
			<input type=button value="8" onclick="dagball.quicksave('8')">
			<input type=button value="9" onclick="dagball.quicksave('9')">
			<input type=button value="10" onclick="dagball.quicksave('10')">
			<input type=button value="Save to file" onclick="let filename = prompt('Filename?',TinyGlsl.timeId()+'.dagball'); if(filename) dagball.saveFile(filename, 'application/json', dagball.gameStatetoJSON());">
			<input type=button value="X cookies" onclick="if(confirm('Delete all this webpage\'s cookies (in browser, not anywhere else the same info may have been copied to)?')){ dagball.deleteAllCookiesInBrowser(); alert('deleted cookies'); }else alert('did NOT delete cookies');">
		</nobr>
		<nobr>
			<input type=button value="Quickload 1 (cookie)" onclick="dagball.quickload('1')">
			<input type=button value="QL 2" onclick="dagball.quickload('2')">
			<input type=button value="3" onclick="dagball.quickload('3')">
			<input type=button value="4" onclick="dagball.quickload('4')">
			<input type=button value="5" onclick="dagball.quickload('5')">
			<input type=button value="6" onclick="dagball.quickload('6')">
			<input type=button value="7" onclick="dagball.quickload('7')">
			<input type=button value="8" onclick="dagball.quickload('8')">
			<input type=button value="9" onclick="dagball.quickload('9')">
			<input type=button value="10" onclick="dagball.quickload('10')">
			<input type=file id=openFileInput value="Load from file">
		</nobr>
		<font color=white>
		<nobr>
			<input type=button value="Add test sliders" onclick="let arr = eval(prompt('list of slider vals?', '[-2, -1.9, -1.8, .2, .3, .55, .6, .7, .8]')); for(let circ of dagball.circles) for(let ed of circ.edsOut) ed.bootSliderKnobs(arr, dagball.defaultSlidersFunc);">
			<label id=lastFilenameLoaded></label>
		</nobr><br>
		<nobr>
			[Test compiler lag:
				<input type=button value="&lt;testTime 0&gt; in textarea" disabled onclick="dagball.do_modTextToTestCompilerLag_forTextarea();">
				<input type=checkbox id=modTextToTestCompilerLagWhenLoadFile disabled><label for=modTextToTestCompilerLagWhenLoadFile>modTextToTestCompilerLagWhenLoadFile</label>
		</nobr><br>
		<nobr>
			<input type=checkbox id=transformFloatValsToVArray oninput="console.log('transformFloatValsToVArray='+dagball.chk('transformFloatValsToVArray'));"><label for=transformFloatValsToVArray title="makes it compile faster while editing textarea when you edit only float numbers like changing 2.34 to 2.534 or changing 2 to 12. It puts those in par mem instead of recompiling. It replaces those with [V 5] [V 23] etc, and auto sizes the V array which you must put in there as {V parMem (25)} etc. TODO (2024-5-11 im coding this but not done yet). 2024-5-20 this works, fixed nan bug (put abs in base of pow in GLSL even when exponent is 2 cuz 2 plus/minus epsilon).">transformFloatValsToVArray</label>
			<input type=checkbox id=semicolonCompiles disabled title="If checked, after editing in textarea, push ; (semicolon) to compile and use those changes in the selected circle. If unchecked, it does that after every key press but may get very slow (screen locks up for 0.1 to 20 seconds depending how complex a code it is."><label id=semicolonCompilesLabel for=semicolonCompiles>push ; after edit ape: code (FIXME always happens)</label><br>
			<input type=checkbox id=testRetPar><label for=testRetPar title="For testing, near the codeMaker code, have GPU return the par mem at index of GPU thread id (like get_global_id(0) in OpenCL) to see the contents of the par array incoming to GPU, for finding bugs such as transformFloatValsToVArray 2024-5-16.">testRetPar</label>
			<input type=checkbox id=gpuAddEpsilonForGradient checked><label for=gpuAddEpsilonForGradient title="For testing, see the js code in codeMaker that adds epsilon. If unchecked, it will not add epsilon so gradient will be wrongly computed as 0.">gpuAddEpsilonForGradient</label>
			]
			<input type=button onclick="TinyGlsl.callListener = callMap=>{ if(dagball.countNaNs(callMap.par)==0 && dagball.countNaNs(callMap.ret)>0){ dagball.displayTxt(TinyGlsl.callMapToJsCode(callMap)); console.log('Found TinyGlsl code that creates NaN bug. Removing TinyGlsl.callListener.'); console.log('TinyGlsl.callListener got:\n'+JSON.stringify(callMap)); TinyGlsl.callListener = null; }else{ console.log('Did not find TinyGlsl code that causes the NaN bug.'); } };" title="Sets TinyGlsl.callListenet to look for calls of TinyGlsl.simple in the future that have no NaNs in input but have at least 1 NaN in output, and if it finds one it puts that in main textarea (on left) starting with txt: so its not a command, just text you can copy to console to run it or variants of it to track down and fix the NaN bug." value="Get TinyGlsl call of NaN bug 2024-5+">
			<input type=button onclick="TinyGlsl.callListener = callMap=>console.log('TinyGlsl called: '+TinyGlsl.callMapToJsCode(callMap));" title="like the 'Get TinyGlsl call of NaN bug 2024-5+' button but just logs to console, and does it every time (todo only if its not cached)" value="&lt;-- log all">
			<input type=button onclick="TinyGlsl.callListener = null;" value="X">
		</nobr>
		</font>
		<nobr>
			<input type=button onclick="dagball.displayTxt(dagball.codeHelpText);" value="Help with ape: code">
			<input type=button value="all gamepads rumble test" onclick="dagball.makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest = true;" style="z-index:0">
			<input type=button value="<-X" title="stop 'all gamepads rumble test'" onclick="dagball.turnOff_makeAllGamepadRumblesTurnOnAndOffSmoothlyAsSineWavesAsATest();">
			<input type=button id=clearConsole value="Clear browser console" onclick="console.clear();">
			<input type=button value="reset view" onclick="dagball.resetAftrans();">
			<input type=button disabled onclick="let s = dagball.getMainTextareaContent(); if(s.toLowerCase().startsWith('apev1:')) dagball.doAsap(()=>{ dagball.setMainTextareaContent('ape:'+Ap.stringToNextLanguage(s.substring('apeV1:'.length))); });" value="V2">
			<input type=button disabled onclick="let s = dagball.getMainTextareaContent(); if(s.startsWith('ape:')) dagball.doAsap(()=>{ dagball.setMainTextareaContent('apeV1:'+Ap.stringFromNextLanguage(s.substring('ape:'.length))); });" value="V1">
		</nobr>
		<nobr>
			<input type=button id=clearTinyGlslCacheBtn value="Clear TinyGLSL cache" onclick="dagball.clearTinyGlslCacheAndUpdateButton();">
			<input type=button id=tinyglslCacheStats value="stats" title="Enable TinyGlsl cache stats, get them from TinyGlsl.cacheStats after" onclick="dagball.tinyglslCacheStats();">
			<input type=button id=tinyglslSkipLinkTest value="SKLT" title="TinyGlsl.skip_gl_getProgramParameter_LINK_STATUS = true" onclick="let prev = TinyGlsl.skip_gl_getProgramParameter_LINK_STATUS; TinyGlsl.skip_gl_getProgramParameter_LINK_STATUS = !prev; console.log('TinyGlsl.skip_gl_getProgramParameter_LINK_STATUS='+TinyGlsl.skip_gl_getProgramParameter_LINK_STATUS+' (was '+prev+')'); this.value='SKLT='+(TinyGlsl.skip_gl_getProgramParameter_LINK_STATUS?'T':'F');">
			<input type=button value="Ap.js tests" title="Do Ap.js tests (check console warnings for: context will be lost)" onclick="Ap.doApeTests(); TinyGlsl.clearAllCache();">
			<input type=button value="makeTest:ApGpuTester.js" title="Make GPU potens test case for ApGpuTester.js" onclick="dagball.makeTestCaseOfNextGpuPotensCall = testCase=>{ console.log('makeTestCaseOfNextGpuPotensCall returned test case '+JSON.stringify(testCase)); }; console.log('dagball.makeTestCaseOfNextGpuPotensCall = '+dagball.makeTestCaseOfNextGpuPotensCall);">
			<input type=button value="TinyGLSL tests" title="TinyGlsl.testAfterBoot(), see console." onclick="TinyGlsl.testAfterBoot();">
		</nobr>
		<nobr>
			
			<font color=white>
			(Start over:
			<input type=button value="randomizePos" onclick="dagball.game.randomizePos();" title="randomize positions in many dimensions. Use this if it gets stuck alot of black or alot of white on screen">
			<input type=button value="randomizeVel" onclick="dagball.game.randomizeVel();" title="randomize velocities in many dimensions. 2023-10-19 this seems weaker than randomizePos">
			)
			&nbsp;&nbsp;
			<!--input type="button" value="load Wikibinator" onclick="try{ dagball.loadJsFile('Wikibinator203VMf.js'); this.style.backgroundColor='green'; this.disabled = true; }catch(e){ this.style.backgroundColor = 'red'; throw e; }"-->
			[
			<input type="button" id=loadWikibinatorButton value="load Wikibinator" onclick="dagball.loadJsFile('lib/Wikibinator203VM.js'); this.style.backgroundColor='green'; this.disabled = true;">
			<input type="button" id=loadCallGPTFromBrowser value="load CallGPTFromBrowser" onclick="dagball.loadJsFile('lib/CallGPTFromBrowser.js'); this.style.backgroundColor='#3333bb'; this.disabled = true;">
			]
			</font>
			<br>
		</nobr>
		<nobr style="display:flex;width:100%;">
			<input id=circMutid readonly spellcheck=false title="" type="text" style="flex-grow:1"></input>
			<input type=button onclick="console.log('copy mutid etc'); navigator.clipboard.writeText(document.getElementById('circMutid').value);" value="copy circ.mutid">
			<input type=button onclick="console.log('copy mutid etc code'); navigator.clipboard.writeText('dagball.mutidToCirc(\''+document.getElementById('circMutid').value+'\')');" value="copy code to get circ">
		</nobr>
		</div>
		<textarea id=mainEditTextarea rows=50 cols=70 spellcheck=false style="tab-size:4;background-color:white;flex-grow: 1; resize: horizontal;"
			onkeydown="dagball.onMainTextareaEvent(this,event);" onclick="dagball.onMainTextareaEvent(this,event);" oninput="dagball.onMainTextareaEvent(this,event);">
			TODO numDimsInACreature+1 pics generated in gpu, and 1 1millisecond gpu call per creatureType<br>
				(shares scalarField but can have multiple instances in par) make this kind of game object that,<br>
				so maybe up to 15 creature types and few instances of each, computed at once.<br>
				interacts mostly with eachother and turn off the other object types with a checkbox. take creatures as far<br>
				as they can go without balls cuz its all pixels they touch. leave most creatures nonmoving far off screen.<br>
				lay them out as world to explore thru. go 1-bit precision of dagball creatures. 200x200. maybe 100x100.<br>
				etc. each gpu thread can return 96 bits of is the creature there yes/no</b><br>
				TODO replace apCall.eval() and .evan() with 5 kinds of eval that put optimizations in<br>
				apCall.compiled.evalGpuMain, .evalCpuDiffeq, .evalCpuDiffeqParloc, .evanCpuMain, .evanCpuMainParloc.<br>
				TODO creatures that are each made of 1 moving circ and b balls it controls. B can differ between<br>
				Make creatures. The code can vary between creatures as they are normally cpucircs. Creatures can grab eachother by<br>
				one creatures balls get into a valley (energyWell) of another creature. From there they can stretch, squash,<br>
				twist, vibrate etc eachother. The outline color of a creatures balls should be the same color as its circs<br>
				border. Many circs will not be creatures (just normal circs with no balls) and many will. Creatures can<br>
				interact with all circs, but noncreature circs can only interact with balls (unless neuralGoo which as of<br>
				2024-6-13 isnt built). Make a doCreatures checkbox, vs just sim creatures if they exist? Its very important<br>
				that the circ move by physics as it will have position and velocity of x y angle. Figure out a way to<br>
				make the physics work with angle, which will require more code, maybe new kind of gradient code, for the<br>
				balls to apply force on the circs x y and angle. Auto wrap the angle by its position but dont wrap during<br>
				gradient of angle. Creatures must be able to climb, stack, and wrestle eachother. This must work with diffeq<br>
				but diffeq is optional for creatures. Diffeq like the pinball bumper *.dagball files but moving custom ways.<br>
				There will be an array in such a circ that has ball y and x positions OR maybe should recompile it to use the<br>
				existing balls array? Could do similar thing as EdJoint does for eds but between the multiple balls arrays?
			TODO:[[[
				New apc fields:
				* bit inEvaParloc_fillLocWithAll0sRightAfterCreate.
				* ape apeParloc.

				Fields to remove from apc: beforeCode, code, compileToLang, preferCpu.

				Fields to remove from ape: preferCpu.

				Global fields to remove from Ap: Ap.lang.

				New kinds of apc eval: evalGpuMain evalCpuDiffeq evalCpuDiffeqParloc evanCpuMain evanCpuMainParloc evalCpuDiffeqParloc.

				Changes to gpu codeMaker and cpucirc code generator:
				* include hdr as parlocMem, and code that copies from it to y$ x$ etc, but do it by modifying ape, and make a variant of Ap.lazyEval that returns ape (likely already is one) instead of returns apc (Ap.Call) where apc.ape is that ape.
			]]]


			DONE 2024-5-20: 2024-5-17TodoIsolateTheNaNErrorInTinyGLSL make TinyGlsl.callListener = callOfSimpleAs=>{...} and a button in dagball to set .callListener to something that looks for par having no nans and returned floats having at least 1 nan, and in that case does dagball.displayTxt('TinyGlsl.simple(code...etc...Float32Array.of(...)...)') of the call it did, including all params and returned floats. Display it with txt: in the main textarea in dagball as soon as that happens after pushing the button. also it might be useful for searching for other calls of tinyglsl.simple.

			very simple 3d voxel system similar to https://github.com/benrayfield/statvoxel , that around each near local area has a 2d grid of voxels, 1 per direction that would be seen from screen there (bucket in that direction, keep nearest that matches, when loop thru other near "near local area"s to copy relevant voxels into here). Do that and make some fun 3d shapes of twisty caves and bridges etc. for monkeyball-like and snakepass-like games etc. will hook in ape language for various stuff maybe NPCs.

Maybe I should define small tensors of up to 9 dimensions (normally 1 or 2 sometimes 3 rarely 4) as colored dots on screen in an affine transform pattern, with its forexample 3 dimension vectors outward from the position of the tensor on screen, and adjust it automatically so fewer of them overlap in (y,x) on screen after aftransed. Have just 1 edge between that and circ. like (radiusesAndPhases parrMem (freqs 10) (floatsPerFreq 2)) is a 10x2 tensor so would be 20 dots on screen and just 1 line. VERY IMPORTANT: tensor contents are shown as brightness of those dots (few pixels wide dot each) live, in a different color than the background.

I like that 2+ circs could share tensors that way, BUT i likely also need ability to split off a subrange of them or individual float vars.

And I want parrFloat and localparFloat types, while float is stack. parrFloat would be like a tensor of 0 dimensions with 1 float in it. So maybe just define it as (name parrMem) since thats how you give 0 dimensions?

Do I want n dimensional tensor subranges? Convolution skipping of n rows m cols etc? This could get complicated

I can probably handle 2 levels of dag in the existsVoting and medianVoting. I'd figure out a way. lowest level being tensors/floats and layer above that being circleWithCode that points at such tensors/floats nearby.

Have circ tensorEds point at the (0,0,0...) index corner of each tensor/float. For a float its just 1 corner, a few pixels wide dot of live varying brightness either way.

If you want to split them, then maybe should have to do so in the code, so only whole tensors are used.


Imagine it with circle perimeter usually not displayed, but its center is, and (0,0,0... index) of each small tensor is displayed similarly, a bipartitle graph.
Each tensor and each circ has a name, so they get automatically connected when using that name in code. Automatic funcs you can click a button or keyboard shortcuts to find names, rename a bunch of things together, etc. Circs have position chosen by user, but arrays position is springy, wants to be near whichever circs ape code points at it.

Or instead of nd aftrans, could display tensor as flattened to 1d, with some marks on it to show where the dimensions start/end, like a 2x20 would be mark 10 mark 10 -> around to the first mark, on its perimeter. YES, i like it. so its all circs.


			DONE: 2023-10-7 FIXME keyboard events are not showing up often since I put in that second div/textarea acting
			as a textarea on the right. Need to fix that ASAP before any more Ape code stuff, cuz it will get harder
			to fix the longer it takes to track down, and i need to do diffs with recent code files.

			[[[
			SOLUTION: This makes it straightforward to code asap. DO IT...

			* Do this: I could index it as only * and + and pow etc, in the abstract math, but in practice compute it as triangle loops etc. So in the math forestCurveFit would use square loop and at runtime in that math it would just decide not to do anything when c>=b but in generated glsl code it would be loop b up to something, loop c up to b. In those timeCycles in the math model where c>=b it would be a noOp. That way, its all alot easier to index, and forestCurveFit only gets misestimated as twice as many timeCycles as it actually does. Do this. YES. That means THERE IS NO TRIANGLE APETYPE but can get optimized to that. Since triangle loops will be less than 10% of all apes, it would be ok to put an IF in there even if it still gets optimized in generated code to a triangle loop (which would be best if it does). loop b, loop c, if b<c do loopbody, should get compiled to loop b, loop c up to b, loopbody, but very important that in the "outerjoin(thread,time,mems) is the core model of dagball.Ape" math model its all loops of constant size that dont depend on eachothers _i, only on eachothers _s.

			* each ape has a constant size/_s and a single counter/_i.

			* an ape's contents can not refer to its own name (for _s or _i).

			* an ape can only be looped over once at a time (in a stack) but can occur again as siblings like if u wanted to loop over matDimB then that finishes then loop over matDimB again. If you want to loop over matDimB twice in a double loop, use {copy matDimB} for one of them.

			* An apes childs can be loop vars, like in {* matDimA matDimC {+ ...}} that causes matDimA_i and matDimC_i to change inside the {+ ...}.

			* Ptr arithmetic can use {somethingABC {p- matDimB 3}] meaning somethingABC[matDimB_i-3].

			* Ptr arithmetic will use pairs of even/odd index in Float64Array as fromIncl toExcl ranges, and prove the possible mem read and mem write and if is read before written in localparMem or fill localparMem earlier with 0s of the sizes proved to readandorwrite.

			* outerjoin(thread,time,mems) is the core model of dagball.Ape. Given input mems, it deterministiclyExceptRoundoff defines which float is at each index up to numThreads*numTimeCycles*memSize-1, and that can be treesearched in time by each ape knowing its _s.
			]]]


			TODO write Ape code for a simpler form of ForestCurveFit, using the 2 triangle arrays in a square array,
			AND do similar for hypercubewave and raymarching 3d mandelbulb fractal. Those are the prototypes.


			TODO write usecases for the union andOr unionMax dagball.Ape opcodes,
			then make them work in ape code in the manifold editor.
			This is needed to make dagball flexible enuf for what will be built later.
			Its a safe alternative to pointer arithmetic,
			and pointer arithmetic can still kind of be done but only in ways that dont cross into memory they shouldnt,
			and not all of those ways but most of them that have predictable read/write patterns at compile time.


			The dagball.Player object with the votes for exists and median vote for priority
			will be useful even in single player, compared to the circs not working at all. Do it asap,
			and make some fun prototypes.

			blah blah
			TODO check how long since last user input (mouse movement, keyboard, etc) and if its been longer than 10 minutes, stop simulating, cuz wasting GPU power. Make this user adjustable.

			Dagball
Make a simpler demo, different code in dagball.Game constructor. Make elevators, gears, or something simple.

Dagball
A big part of the game will be exploring big areas that have unique stuff in them,
So i need a way to compute it solparsrly in 2d.
And might wantscrewballsctamblelike controls on some parts. Either that or a heavy ball that u can push to switch some parts by physics.
Start with just sparse bellcurveorrectanglewindowed glsl code that i can type in an editor in browser at chosen 2d positions.
Also consider LLMs helping design the game. But do it myself at first.
There will only be 1 kernelpair per near 2d area, sum of whichever are near.
So its smooth.
Some areas will emit balls. Some will consume balls.
Some will limit number of balls. Etc.
Object of the game will be to get a certain few balls, colored differently, to the end of the game far away, using many disposable balls along the way.
Also consider rubberbandlike paths as a weaker substitute for qlearning.
Plan is to port it to wikib later but it goviral soon first.

Dagball get working in mobile too
		</textarea>
	</div>

	<!--div id="debugTextAreaDiv" contenteditable="false" style="flex-grow:1;resize:horizontal;position:fixed;top:0;right:0;z-index:9999;opacity:.6;white-space:nowrap;overflow-x:hidden;overflow-y:auto;height:50vh;"></div-->
	<div id="debugTextAreaDiv" contenteditable="false" style="flex-grow:1;resize:horizontal;position:fixed;top:0;right:0;z-index:9999;opacity:.72;white-space:pre;tab-size:4;overflow-x:hidden;overflow-y:auto;height:50vh"></div>
	<br><br><br><br><br><br><br><br><br><br><br><br>
	<!--textarea id=debugTextArea style="z-index:9999;opacity:.6;white-space:nowrap;overflow-x:hidden;overflow-y:auto;"
	>debug text area todo put generated glsl code here when theres a certain prefix then colon in the left textarea ... TODO tests like... a = dagball.parseApeCode(`(matmulABCLoop *
		matDimA
		matDimC
		(sumInDimBSteps +
			<sumB 0.>
			(sumInDimB_loop *
				matDimB
				{f+= sumB {f* [matAB matDimA matDimB] [matBC matDimB matDimC]}}
			)
			<[matAC matDimA matDimC] sumB>
		)
	)`).toApe().toApeCode()</textarea>

</body></html> 