Dagball.html

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>DagBall</title>
<script src="lib/Dagverse.js"></script>
<script src="lib/TinyGLSL.js"></script>
<script src="lib/Ap.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.

//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.


//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.

`);*/


/*

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.


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;

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: [
		'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: [
		//TODO list what ive done already
		'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?)',
	],

	/*
	//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??

	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);
		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.
	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;
	},

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

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

	/* 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.
	*/
	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.
	doAsap_: [],

	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,

	//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}>
	)`,*/
	
	//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,
	addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap:
	`(addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap? (pairBallDist float)
		{f* 8.05 {f** {f/ {fmax 0 {f- .07 pairBallDist}} .07} 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();
		}
	},

	//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(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;
		}
	},

	//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: 5,
	maxAftransMagnify: 10000,
	speedMouseChangesMagnify: .8,

	//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.',

	//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 of walls you bitpic and open areas, that balls bounce on.
	//If null, doesnt do this physics. If nonnull, TODO its physics is added to poten (as in gradient calculation) after GPU computes potens, per ball.
	//TODO in wholeGameState store this as compressed using dagball.BloomTree.
	bitpic: null,
	bloomtree: null, //when click 1 of 2 buttons it copies between between dagball.bitpic and dagball.bloomtree

	//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);
		}
	},

	log_tinyGlslCurveCode: true,

	//hideMouseCursorOnCanvas: false,
	hideMouseCursorOnCanvas: true,

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

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

	getCheckboxIds: function(){
		//FIXME search for them using document.querySelector? how about only those that have a certain css class dagballOptionCheckbox?
		return 'experimentalGradientMul2 isDisplayBallText isDisplayBallCircles displayWavefunctionCollisionsAsBackground varEqLogs pauseDagball doDiffeq isShowWhichCircleIsSelected doAllPairsOfBalls doStatisticalCollisionsBetweenWavefunctions isDisplayGradientsAsBrightnessOfRectanglesOnBackground isDisplayCircOutlines isDisplayEdges isDisplayEds isDisplayDetailedEdsAlways showGlslCodeOfApesInRightTextarea'.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:{}};
		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 = document.getElementById('baseVelDecay').valueAsNumber;
		ret.gradientMul = document.getElementById('gradientMul').valueAsNumber;
		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'));
		//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());
	},

	//FIXME do this in dagball.View instead of the dagball object?
	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);
		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);
		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];
		}
		if(map.baseVelDecay !== undefined){
			document.getElementById('baseVelDecay').valueAsNumber = map.baseVelDecay;
		}
		if(map.gradientMul !== undefined){
			document.getElementById('gradientMul').valueAsNumber = map.gradientMul;
		}
		if(map.aftrans && map.aftrans.type=='dagball_simpleAftrans'){
			dagball.aftrans = dagball.mapToSimpleAftrans(map.aftrans);
		}
		//if(map.readSmoothYXR_r !== undefined){
		//	dagball.readSmoothYXR_r = map.readSmoothYXR_r;
		//}
		dagball.bitpic = map.bitpic ? dagball.mapToBitPic(map.bitpic) : null;
		dagball.updateView();
	},

	//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();
	},

	//FIXME do this in dagball.View instead of the dagball object?
	loadGameStateFromJson: function(json){
		console.log('loadGameStateFromJson json=[[['+json+']]]');
		dagball.loadGameStateFromMap(JSON.parse(json));
	},

	//FIXME do this in dagball.View instead of the dagball object?
	quicksave: function(name){
		localStorage.setItem('dagball.wholeGameState.'+name, dagball.gameStateToJson());
	},

	//FIXME do this in dagball.View instead of the dagball object?
	quickload: function(name){
		dagball.loadGameStateFromJson(localStorage.getItem('dagball.wholeGameState.'+name));
	},

	//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');
	},

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

	logEdGroupStuff: false,

	log_updateLocalFields_apCode: false,

	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();
		document.getElementById('clearTinyGlslCacheBtn').value = 'Clear tinyGlsl cache (numClears '+TinyGlsl.count_clearAllCache+')';
	},

	//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);
		}
	},


	//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
	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]);
		}
	},

	//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){

		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);
			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).
				dagball.setSelectedEdGroup(edGroup); //may be null, will unselect all edGroups if so
			}
		}

		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);
	},
	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).
		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.
	},
	//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(document.getElementById('showGlslCodeOfApesInRightTextarea').checked){
				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();
	},
	jsType: TinyGlsl.jsType,
	selectLockA: false, //TODO
	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
	},
	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);
	},

	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'),
	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('moveEds') ||
			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: 'Enter',
		selectLockAOn: 'mouseButton0',
		selectLockAOff: 'mouseButton2',
		//TODO? selectLockB: 'mouseButton2',
		//TODO? search: 's',
		
		moveView: 'a',
		zoomView: 's',
		moveCircle: 'd',
		resizeCircle: 'f',
		
		createCircle: 'z',
		deleteCircle: 'x',
		moveEds: 'c',
		rebuildEdGroup: 'v',
		
		movePaintWall: 'q', //dagball.bitpic
		zoomPaintWall: 'w', //dagball.bitpic
		paintOpenPixel: 'e', //dagball.bitpic
		paintWallPixel: 'r', //dagball.bitpic
		resizePaintWallBrush: 't', //dagball.bitpic

		moveBallHere: 'b', //pick a ball at random and move it here, or maybe whichever ball is farthest from mouse? todo...

		//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',
		//some of these are keys in dagball.edgeTypes, such as: gpucircExistVote, gpucircInfluenceMedianVote, true, like, and dim.
	},
	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;
	},
	selectedCircs: ()=>dagball.circles.filter(c=>c.isSelected),
	changeGameStateByInputControls: function(){ //uses dagball.controlChange('mouseY') and dagball.controlChange('moveView') etc.
		let newMessageToUser = '';
		/*if(dagball.controlsChange('selectLockA') == 1){
			dagball.selectLockA = !dagball.selectLockA;
		}*/
		let mustClickPaintWallsMsg = ' must click "bitpic" button first, to create a dagball.bitpic';
		if(!dagball.isTextEditing()){

			if(dagball.controlsChange('selectLockAOn') == 1){
				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');
			let dt = dagball.controlsChange('time');
			dagball.directControls.mouseDy = mouseDy;
			dagball.directControls.mouseDy = 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('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('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();
					}
				}
			}
			//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('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.controls('moveView')){
				newMessageToUser += ' move view';
				//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;
				const scheduleAddY = mouseDy*mul; //FIXME use dagball.aftrans to convert the coordinates somehow
				const scheduleAddX = mouseDx*mul;
				//dagball.doAsap(()=>{
					dagball.aftrans.addY += scheduleAddY;
					dagball.aftrans.addX += scheduleAddX;
					dagball.updateDirectControlsMouse();
				//});
			}
			if(dagball.controls('zoomView')){
				//TODO merge duplicate code between zoomView and zoomPaintWall

				newMessageToUser += ' zoom view';
				//let mul = Math.max(.5, Math.min(Math.exp(-mouseDy*.3), 2));
				let mul = Math.max(.5, Math.min(Math.exp(-mouseDy*dagball.speedMouseChangesMagnify), 2));
				//let mulY = Math.max(.5, Math.min(Math.exp(-mouseDy*.3), 2));
				//let mulX = Math.max(.5, Math.min(Math.exp(-mouseDx*.3), 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('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';
			}

			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
				//dagball.doAsap(()=>{
					dagball.circles.push(new dagball.Circ('swarm', 0, 0, 0,   mouseY, mouseX,   .14,  120, 120, 80, false, 'javascript:\n//TODO\n', [], []));
				//});
			}
			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(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 += ' free select circles';
			}
			/*if(dagball.controls('selectLockA')){
				newMessageToUser += ' toggle selectLockA';
			}*/
			if(dagball.controls('selectLockB')){
				newMessageToUser += ' toggle selectLockB';
			}
			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.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);
		}
		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),
	//display these at top left of screen, evaled again each video frame.
	displayLogs: {
		//countNextState: ()=>(''+dagball.game.countNextState),
		//FPS: ()=>((57 < dagball.estimateFPS && dagball.estimateFPS < 63) ? 'around 60 where it should be' : Math.round(dagball.estimateFPS)),
		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;
			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_potens_par: ()=>{
			let potenCall = dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient;
			return potenCall.par.summarizeMems()+' par'+potenCall.par.floats.length+' par'+potenCall.par.memSize;
		},
		GPU_potens_loc: ()=>{
			let potenCall = dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient;
			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]),
		*/
	},
	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,
	
	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?...).]]'); },
	nameToDim: {},
	idToDim: {},
	randByte: ()=>dagball.randInt(256),
	randInt: size=>dagball.randIntRange(0,size),
	randIntRange: (fromIncl,toExcl)=>(fromIncl+Math.floor(Math.random()*(toExcl-fromIncl))),
	sigmoid: x=>(1/(1+Math.exp(-x))),
	mainLoop: function(){
		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.');
				throw e;
			}
		}
		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=>{
			if(i<ballNames.length) return ballNames[i];
			return 'ball'+i;
		}
		for(let b=0; b<dagball.balls.length; b++){
			let ball = dagball.balls[b];
			ball.displayText = 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,
				`//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]);
			`
			*/
		);
		//dagball.game.displayBallTrails = true;
		dagball.game.displayBallTrails = false;
		dagball.game.randomizePos();
		//dagball.game.randomizeVel();
		dagball.mainLoop();
	},
};

//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));
	}
};
//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 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);
};

//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
};

/* 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);
};


/*
//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);
};*/


//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?
*/


dagball.Edge = function(edgeType, weight, child){
	this.edgeType = edgeType;
	this.weight = weight;
	this.child = child;
};

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

dagball.Edge.prototype.toMap = function(){
	return {
		type: this.type,
		edgeType: this.edgeType,
		weight: this.weight,
		//childId: this.child.Name()
		childId: this.child.Id() //circ.Id()
	};
};

//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; //TODO rename to vd like in dagball.Dim
	//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.
	this.edGroup = null;
};
dagball.Ed.prototype.type = 'dagball_ed';

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,
		velDecay: this.velDecay,
		edGroup: null //FIXME?
	};
};

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);
};

//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+']]'
};

//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;
};

//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 = '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
};

//Dim 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(){".
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';

//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;
};

//string form of the id
//
//Example 2023-10-25 on browser commandline run this: Pair(S)(T).n.id()
//to get this: 'λ000189f5fdffffffea7fee5519df4afdfd1f4338078a68a3f06943e16af62544'
//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;
	}
};

//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 = {};

dagball.Ball = function(id, ob, influence, y, x, yv, xv, vd, red, green, blue){
	this.id = id;
	//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;
	//
	/*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
};

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

dagball.Ball.prototype.toMap = function(){
	return {
		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,
	};
};

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){
	//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;

	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.mapToEd = function(map){
	if(map.type != 'dagball_ed'){
		throw new Error('Not an ed: '+map);
	}
	return new dagball.Ed(
		this,
		map.y,
		map.x,
		map.pos,
		map.vel,
		map.velDecay
	);
};

dagball.Circ.prototype.Id = function(){
	if(!this.id){
		//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;
	return ball;
};

dagball.mapToCirc = function(map){
	//TODO verify map.type=='dagball_circ'?
	let edgesOut = []; //FIXME
	let edsOut = [];
	let dimsOut = []; //FIXME
	let cellmataOrNull = null; //FIXME
	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);
	for(let edMap of map.edsOut){
		circ.edsOut.push(circ.mapToEd(edMap));
	}
	return circ;
};

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.Id();
	return {
		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,
	};
};

//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
	}*/
};

//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){
	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.floor(eSize*angle/(2*Math.PI))%this.eSize();
	let e = this.getE(i); //may be a dagball.Ed 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.edGroup; //may be null
};

//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.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;
};

//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;
};

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
};

//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, weight || 0, this);
};

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

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+']'
};

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 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.
		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.
		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);
	}
	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];
			let detailedEds = (document.getElementById('detailedEdsIfSelected').checked && ed.isSelected()) || document.getElementById('isDisplayDetailedEdsAlways').checked;
			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);
				let scale = .2;
				let aFraction = .5-scale;
				let bFraction = .5;
				let cFraction = .5+scale;
				let dFraction = Math.max(0, Math.min(.5+scale*ed.pos, 1));
				let dYPix = toYPix*dFraction+(1-dFraction)*fromYPix;
				let dXPix = toXPix*dFraction+(1-dFraction)*fromXPix;
				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
			}
		}
	}
};

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.addExampleCircs();

dagball.displayCircs = function(optionalByteRect){
	for(let circ of dagball.circles){
		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();
	}
	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 mems){
		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);

			/** 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;
	}
	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; //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;
};

//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;
		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.
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;
};

//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;
	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.
		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

		if(dagball.bitpic){
			let isDetailedVerySlowDisplayOfBitpic = document.getElementById('isDetailedVerySlowDisplayOfBitpic').checked;
			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);
};*/

//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){
	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);
			//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 i = 0;
	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){
			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);
	if(doDiffeq){
		apCall.vel.putFloats('balls', ballVels);
	}
};

//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){

	//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.

	for(let edGroup of edGroups){
		let apeArrayName = edGroup.apeArrayName;
		if(!apeArrayName) Err('no edGroup.apeArrayName');
		let floats = gradientsMem.getFloats(apeArrayName); //a Float32Array
		let arrayIndex = doDiffeq ? gradientsMem.ptr(apeArrayName) : 0;
		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(doDiffeq){
				edGroup.eds[i].dpos = diffeqMapOrNull.dpos[arrayIndex+i];
				edGroup.eds[i].dvel = diffeqMapOrNull.dvel[arrayIndex+i];
				edGroup.eds[i].dfriction = diffeqMapOrNull.dfriction[arrayIndex+i];
			}
		}
	}
	//let expectedNumFloats = floats.length*floatsPerBall;
	//if(floats.length != expectedNumFloats) throw new Error('ape array name=balls size differs from numBalls('+balls.length+')*floatsPerBall('+floatsPerBall+')');
};

/*
//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];
};

//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(){
	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'];
	//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;
		apCall.numGpuThreads = potensSize;
		
		
		if(dagball.makeTestCaseOfNextGpuPotensCall){
			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 = 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];
			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,dagball.readSmoothYXR_r);
				let potenAtPlusDx = dagball.bitpic.readSmoothYXR(gameY,gameX+epsilon,dagball.readSmoothYXR_r);
				let potenNeutral = dagball.bitpic.readSmoothYXR(gameY,gameX,dagball.readSmoothYXR_r);
				//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;
		}

		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);
		*/
	}
};

//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 = 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;
};

//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){

	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);
		}
	}

	//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 &&
		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 edGroups = dagball.view.edGroups();
	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, edGroups, balls, diffeqMapOrNull);


	let edsInThoseEdGroups = new Set();
	for(let edGroup of edGroups) 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 = document.getElementById('baseVelDecay').valueAsNumber;
	//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 = document.getElementById('gradientMul').valueAsNumber*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 = [];
	for(let edGroup of edGroups) for(let ed of edGroup.eds) eds.push(ed);

	for(let ed of eds){
		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 'No ed.dpos but doDiffeq';
			if(isNaN(ed.dpos)) throw 'NaN ed.dpos';
			if(ed.dvel === undefined) throw 'No ed.dvel but doDiffeq';
			if(isNaN(ed.dvel)) throw '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;
		}
	}
	//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?
		ball.y = dagball.normPositionOrVelocityFloat(ball.y);
		ball.x = dagball.normPositionOrVelocityFloat(ball.x);
		ball.yv = dagball.normPositionOrVelocityFloat(ball.yv);
		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(doDiffeq){

			//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) throw 'No ball.dposY but doDiffeq';
			if(ball.dposX === undefined) throw 'No ball.dposX but doDiffeq';
			if(isNaN(ball.dposY)) throw 'NaN ed.dposY';
			if(isNaN(ball.dposX)) throw 'NaN ed.dposX';
			if(ball.dvelY === undefined) throw 'No ball.dvelY but doDiffeq';
			if(ball.dvelX === undefined) throw 'No ball.dvelX but doDiffeq';
			if(isNaN(ball.dvelY)) throw 'NaN ed.dvelY';
			if(isNaN(ball.dvelX)) throw '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;
		}
		if(dagball.gravityToward00){
			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 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 = document.getElementById('doColorBackground').checked;
	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 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(document.getElementById('isDisplayGradientsAsBrightnessOfRectanglesOnBackground').checked && dagball.debug_lastGradientMem){
		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++){
		let displayTextAtX = [];
		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;
			for(let g=indexFrom; g<toExcl; g++){
				//byteRect.paint
				let fromY = 0;
				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(g==indexFrom){
					displayTextAtX.push(fromX);
				}
				let brightAve = 100;
				let brightStdDev = 150;
				let gradientOnUnitBellcurve = (gradient[g]-gradientAve)/gradientStdDev;
				let bright = brightAve+brightStdDev*gradientOnUnitBellcurve;
				//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);
			}
		}
		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.isDisplayCircs){
		//todo also aftrans param
		dagball.displayCircs(byteRect);
	}


	let oBall = this.oBall(); //balls start at this index in this.pos
	//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(document.getElementById('isDisplayBallCircles').checked){
		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 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
			if(displayAsSelected){
				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;
			}
			byteRect.paintDonut(y, x, innerRadius, radius, redByte, greenByte, blueByte); //perimeter of circle
		}
	}

	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(){
	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;
};

//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); });
};

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.

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);
};

//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;

//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).
		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.
		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.
};
dagball.View.prototype.hasGpuCodeAndShouldUseIt = function(circ){
	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.
	return (dagball.evalGlslCodeGeneratedFromApeCode && (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){
			throw '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){
	let i = str.indexOf(':');
	if(i == -1) return str;
	return str.substring(i+1);
};

//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 circNum = 0;
	let circApes = [];
	//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){
		if(this.hasGpuCodeAndShouldUseIt(circ)){
			//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);
		}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);

	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);

	//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;
		let numBalls = dagball.balls.length; //TODO make this sparse by using dagball.view.balls which will be a subset of dagball.balls.
		//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);
			}
		}
		//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 extraFloatArrayToFixBugFIXME = '(extraFloatArrayToFixBugFIXME locparMem {300})'; //FIXME this is wasteful, takes this many dimensions of the 1000 of dagball
		let extraFloatArrayToFixBugFIXME = '';
		let code =
			`{doLast
				(balls locparMem (numBalls ${numBalls}) (floatsPerBall ${floatsPerBall}))
				(circHeaders ${circHeadersMemType} (numCircs ${circApes.length}) (headerFloatsPerCirc ${headerFloatsPerCirc}))
				(aftrans locparMem {4})
				${(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.
		`			<(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] {f+
							[{par} gradientCopyIndex]
							{?: {i== gradientCopyIndex {id}} epsilon 0}
						}>
					}
		`
		/*`			<(isDisplayElsePotensForGradient float) 0>
					{* (gradientCopyIndex copy {par})
						<[{loc} gradientCopyIndex] [{par} gradientCopyIndex]>
					}
		`*/
					)}
					${doAllPairsOfBalls?(
		'			'+dagball.addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap
					):(
					''
					)}
					{*
						${isDisplayElsePotensForGradient?(
		'				(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 numBalls 0%${floatsPerBall}]>
							<(x float) [balls 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 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}>
							<(linearInterpolatedBetwee2HeightmapsAtYX 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+
								linearInterpolatedBetwee2HeightmapsAtYX
								heightOfCurvyDitch3dThatHelpsBallRollBetweenThe2Heightmaps
							}>
			`
							):(
			//'				<potenOne {fxtanh potenOne}>'
			//'				<potenOne 3.1>'
							''
							)}

							${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}
								}}
							}}
			`
							/*{f+= potenOne {fxtanh {f* otherBallWeight
								{@addToEnergyPerBallDistanceCodePerPairOfBallsForSingleHeightmap ballOrDisplayYX_vs_otherBall_distance}
							}}}
							{f+= potenOne {f* otherBallWeight ballOrDisplayYX_vs_otherBall_distance}}
							*/
							):(
							'' //NOT_doAllPairsOfBalls
							)}

							{f+= (potenSum float) potenOne}
						}
					}
					${extraFloatArrayToFixBugFIXME}
					${(isDoubleHeightmap && isDisplayElsePotensForGradient)?(
			'			{freturn heightA heightB pixDist pixBal}'
					):(
			'			{freturn potenSum}'
			//'			{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);
	//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((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;
	//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);
	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;
	}


	//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;
};

//TODO this should return the js lambda itself but with a toString that returns the text given here.
//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.
//
//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)}')
//
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);
	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)

dagball.Game.prototype.nextState = function(dt){
	this.countNextState++;

	dagball.doAsaps(); //deleteCircle etc, if scheduled. This way it doesnt interfere with display and physics

	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.
		
		dagball.updateView(); //creates EdGroups in Eds in Circs
		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.

		if(!dagball.mouseIsInTextEditorEtc()){
			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;
			dagball.balls[0].y = cursorBallYGoTo; //FIXME use dagball.view.balls[0] instead to make it sparse
			dagball.balls[0].x = cursorBallXGoTo;
		}
		for(let circ of dagball.view.circToPreOffset.keys()){
			//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.
	}

	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);
		let mousedown = event=>{
			let key = 'mouseButton'+event.button;
			if(key == 'mouseButton2' && dagball.isAllowRightClickPopupMenuNow() || dagball.mouseIsInTextEditorEtc()){
				console.log('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('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){
			dagball.directControls[event.key] = 1;
			dagball.afterEveryCanvasDomEvent(event);
		};
		body.addEventListener('keydown', keydown);
		canvas.addEventListener('keydown', keydown);
		let keyup = function(event){
			dagball.directControls[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(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;
		this.height = height;
		this.width = width;
	};

	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;
			}
		}
	};

	//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);
		}
	};

	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.boot();
	document.getElementById('openFileInput').addEventListener('change', function(event){
		const file = event.target.files[0];
		if(file){
			const reader = new FileReader();
			reader.onload = function(e){
				const fileContentAsString = e.target.result;
				dagball.loadGameStateFromJson(fileContentAsString);
			};
			reader.readAsText(file);
		}
	});
	//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
	if(dagball.loadWikibinatorAsyncRightAfterBoot){
		document.getElementById('loadWikibinatorButton').click();
	}
};


/*
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>menu</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%;">
		<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 and android)</nobr>
	<font color=white><br>
		<input type=checkbox id="varEqLogs"><label for="varEqLogs">show var=</label>
		<input type=checkbox id=pauseDagball><label for=pauseDagball>pause</label>
		<input type=checkbox id=doDiffeq checked><label for=doDiffeq>doDiffeq</label>
		<input type=checkbox id=isShowWhichCircleIsSelected checked><label for=isShowWhichCircleIsSelected>flash selected</label>
		<input type=checkbox id=isDisplayGradientsAsBrightnessOfRectanglesOnBackground><label for=isDisplayGradientsAsBrightnessOfRectanglesOnBackground>gradient rectangles</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=doColorBackground><label for=doColorBackground>doColorBackground</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>isDisplayBallText</label>
		<input type=checkbox id=isDisplayBallCircles checked><label for=isDisplayBallCircles>isDisplayBallCircles</label>
		<input type=checkbox id=experimentalGradientMul2><label for=experimentalGradientMul2>experimentalGradientMul2</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=showGlslCodeOfApesInRightTextarea oninput="dagball.updateDebugTextArea();"><label for=showGlslCodeOfApesInRightTextarea>GLSL and errors out --&gt;</label>
	</font>
		<nobr>
			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>
			<br>

			<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?','100')); let w = parseFloat(prompt('bitpic width?',''+h)); dagball.addExampleBitPic(h,w);">
			<input type=button value="bitpic -> 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);">
			<br>

			<input type=button value="Remove 10 balls" onclick="for(let i=0; i<10 && dagball.balls.length > 1; i++) dagball.removeBall();">
			<input type=button value="Remove ball" onclick="if(dagball.balls.length > 1) dagball.removeBall();">
			<input type=button value="Add ball" onclick="dagball.addBall();">
			<input type=button value="Add 10 balls" onclick="for(let i=0; i<10; i++) dagball.addBall();">
			<input type=button id=renameAllBalls value="Set ball names" onclick="dagball.renameAllBalls();">
		</nobr>
		<nobr>
		
			<input type=button value="See GLSL on 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)" onclick="TinyGlsl.logNextNGlslCodes = Math.max(TinyGlsl.logNextNGlslCodes,2);">
			<input type=button value="(A)" onclick="dagball.displayTxt(dagball.view.mergedApCalls.singleHeightmapPotentialEnergiesForGradient.code);">
			<input type=button value="See combined ape:" onclick="dagball.displayTxt(''+dagball.view.mergedApCalls.singleHeightmapDisplay.ape);">
		</nobr>
		<nobr>
			<input type=button value="Quicksave 1" onclick="dagball.quicksave('1')">
			<input type=button value="QS 2" onclick="dagball.quicksave('2')">
			<input type=button value="QS 3" onclick="dagball.quicksave('3')">
			<input type=button value="QS 4" onclick="dagball.quicksave('4')">
			<input type=button value="QS 5" onclick="dagball.quicksave('5')">
			<input type=button value="QS 6" onclick="dagball.quicksave('6')">
			<input type=button value="QS 7" onclick="dagball.quicksave('7')">
			<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="Test new save console" 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');">
		</nobr>
		<nobr>
			<input type=button value="Quickload 1" onclick="dagball.quickload('1')">
			<input type=button value="QL 2" onclick="dagball.quickload('2')">
			<input type=button value="QL 3" onclick="dagball.quickload('3')">
			<input type=button value="QL 4" onclick="dagball.quickload('4')">
			<input type=button value="QL 5" onclick="dagball.quickload('5')">
			<input type=button value="QL 6" onclick="dagball.quickload('6')">
			<input type=button value="QL 7" onclick="dagball.quickload('7')">
			<input type=file id=openFileInput value="Load from file">
		</nobr>
		<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" 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();">
		</nobr>
		<nobr>
			<input type=button onclick="let s = dagball.getMainTextareaContent(); if(s.toLowerCase().startsWith('apev1:')) dagball.doAsap(()=>{ dagball.setMainTextareaContent('ape:'+Ap.stringToNextLanguage(s.substring('apeV1:'.length))); });" value="ape: (V2)">
			<input type=button onclick="let s = dagball.getMainTextareaContent(); if(s.startsWith('ape:')) dagball.doAsap(()=>{ dagball.setMainTextareaContent('apeV1:'+Ap.stringFromNextLanguage(s.substring('ape:'.length))); });" value="apeV1:">
			<input type=button id=clearTinyGlslCacheBtn value="Clear TinyGLSL cache" onclick="dagball.clearTinyGlslCacheAndUpdateButton();">
			<input type=button value="Do 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="make test for 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);">
		</nobr>
		<nobr>
			
			<font color=white>Start over:</font>
			<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">
			..
			<!--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;">
			<br>
		</nobr>
		<textarea id=mainEditTextarea rows=50 cols=70 spellcheck=false
				style="tab-size:4;background-color:white;flex-grow: 1; resize: horizontal;"
				onkeydown="dagball.mainEditTextareaOnKeyDown(this,event);"
				onclick="dagball.updateDebugTextArea();"
				oninput="dagball.updateDebugTextArea(); dagball.selectedCircs().forEach(circ=>{ circ.text = this.value; }); if(dagball.wasErrorNeedMainLoopRestart){ dagball.wasErrorNeedMainLoopRestart = false; console.log('dagball.wasErrorNeedMainLoopRestart restarting dagball.mainLoop()'); dagball.mainLoop(); }">
			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> 