# New Start of NewMath

NewMath will now get a restart based on the new  JavaScript web editor p5.js with some examples in recent posts to be filled into a complete program under the name DigiMat.

DigiMat will be launched as a new mathematics education for school/university related to the FEniCS Project as a open source platform för automatic mathematical simulations DigiMat will from this platform successively be transformed to a new platform. See also Swedish version.

DigiMat is based on the principle that all mathematical objects are constructed/computed through the execution of av computer programs:

• Construction of the natural numbers 1, 2, 3,..by repetition of the basic operation of +1.
• Construction of integers by repetion of -1.
• Construction of rational numbers as pairs of integers
• Construction the operations of addition, subtraction, multiplication och division on natural and  rational numbers.
• Construction of straight line, plane, coordinate system.
• Construction of spatial representation in coordinate systems of geometrical objects: straight line, circle, rectangle, triangle.
• Construction of motion of geometrical objects in coordinate systems.
• Constructiv Calculus as time stepping of dx=v*dt.
• Constructive mechanics and physics by Calculus.
• Constructive matematickl modeleing of systems in physics, chemistry, economics…
• Construction of computer games as interactive mathematical modeling.

Below you find some introductory examples in JavaScript. All previous examples/games in Codea can be more or less directly by reformulated in JavaScript and so offer  bank of applications:

# Polynomials

Construction of Polynomials by time stepping dx[i]=x[i-1]*dt

var x = [];
var q = [];
var f= [];
var t;
var dt;
var N;

function setup() {
N=5;
t=0;
dt=0.01;
for (var i=0; i<N; i++){
x[i]=0;
}
x=1;
createCanvas(400, 400);
}
function draw() {
t=t+dt;
for (var i=1; i<N; i++){
x[i]=x[i]+x[i-1]*dt;
q[i]=i*x[i]/x[i-1];
noStroke();
fill(0);
ellipse(50+40*t,350-10*x[i],3,3);
fill(255,0,0,255);
ellipse(50+40*t,355-10*q[i],3,3);
fill(0,0,255,255);
ellipse(50+40*t,355-10*pow(t,i)/factorial(i),3,3);
}
fill(0,255,0,255);
ellipse(50+40*t,350-10*x,3,3);
stroke(0);
line(50,350,350,350);
line(50,350,50,50);
fill(0);
text(“Construction of polynomials x(t)=t^n/n!”,100,50);
text(“by time stepping dx[i]=x[i-1]*dt”,100,70);
text(“black: x[i](t)”, 100, 100);
text(“blue: pow(t,i)/factorial(i)”,100,150);
text(“red: i*x[i](t)/x[i-1](t) vs t (black)”,100,200);
text(“green: x(t)=1”,100,250)
}
function factorial(n) {
if (n == 0 || n == 1)
return 1;
if (f[n] > 0)
return f[n];
return f[n] = factorial(n-1) * n;
}

# Logarithm dx = dt/t

Logarithm dx =1/t * dt

var x=0;
var t=1;
var dt=0.01;
function setup() {
createCanvas(400, 400);
}
function draw() {
//time stepping
t=t+dt;
x=x+dt/t;

//output
fill(0);
stroke(0);
line(50,350,350,350);
line(50,350,50,50);
line(50,350,350,50);
text(“Logarithm: x=log(t) red”, 200,50);
text(“Exponential: x=exp(t) green”, 200,100);
text(“Compare dx=dt/t with dt = tdx”,200,150);
text(“t-axis”,360,350);
text(“x-axis”,40,40);
fill(255,0,0,255);
noStroke();
ellipse(t*20+50,350-x*50,2,2);
fill(0,255,0,255);
noStroke();
ellipse(x*50+50,350-t*20,2,2);
}

# Exponential dx = x*dt

Exponential dx = x*dt

var x=1;
var t=0;
var dt=0.01;
function setup() {
createCanvas(400, 400);
}
function draw() {
//time stepping
t=t+dt*10
x=x+x*dt;
//output
fill(0);
stroke(0);
line(50,350,350,350);
line(50,350,50,50);
text(“Exponential: x(t)=exp(t)”, 200,50);
text(“t-axis”,360,350);
text(“x-axis”,40,40);
fill(255,0,0,255);
noStroke();
ellipse(t*5+50,350-x,2,2);
}

# Binary Multiplication by 2

Binary Multiplication by 2

var bit = [];
var bitnew=[];
var I = 5;
var D = 1;
var N;

function setup() {
N=1;
for (var i = 0; i < I-1; i++) {
bit[i] = floor(random(0,2));
bitnew[i]=0;
}
createCanvas(400, 400);
}

function draw() {
background(220);
fill(0);
text(“Number of digits =”,20,20);
text(“A digit can be 0 or 1”,20,40);
text(“Click to multiply by 2:”,250,20);
text(“Binary Multiplication: *2”,150,390);
text(I,120,20);
text(pow(2,N-1),370,20);

for (var i = 0; i<I-1; i++) {
if (bit[i]>D){
bit[i+1]=bit[i+1]+1;
bit[i]=0;
}
}

//output
if (bit===1){
fill(0,255,0,255);
ellipse(305,80,10,10);
fill(0,255,0,255);
for (var i=0;i<1;i++){
ellipse(305,110+10*i,5,5);
}
}
if (bit===1){
fill(255,255,0,255);
ellipse(305-40,80,10,10);
fill(0,255,0,255);
for (var i=0;i<2;i++){
ellipse(305-40,110+10*i,5,5);
}
}
if (bit===1){
fill(255,0,0,255);
ellipse(305-80,80,10,10);
fill(0,255,0,255);
for (var i=0;i<4;i++){
ellipse(305-80,110+10*i,5,5);
}
}
if (bit===1){
fill(0,0,255,255);
ellipse(305-120,80,10,10);
fill(0,255,0,255);
for (var i=0;i<8;i++){
ellipse(305-120,110+10*i,5,5);
}
for (var i=0;i<8;i++){
ellipse(305-120,110+10*i,5,5);
}

}
if (bit===1){
fill(0);
ellipse(305-160,80,10,10);
fill(0,255,0,255);
for (var i=0;i<16;i++){
ellipse(305-160,110+10*i,5,5);
}
}
for (var i = 0; i<I; i++){
fill(0);
text(bit[i],300-40*i,100,10)
}

fill(0,255,0,255);
ellipse(100,300,10,10);
ellipse(150,300,10,10);
fill(0);
text(“+”,120,302,20);
text(“=”,170,302,20);
fill(255,255,0,255);
ellipse(200,300,10,10);

fill(255,255,0,255);
ellipse(100,320,10,10);
ellipse(150,320,10,10);
fill(0);
text(“+”,120,322,20);
text(“=”,170,322,20);
fill(255,0,0,255);
ellipse(200,320,10,10);

fill(255,0,0,255);
ellipse(100,340,10,10);
ellipse(150,340,10,10);
fill(0);
text(“+”,120,342,20);
text(“=”,170,342,20);
fill(0,0,255,255);
ellipse(200,340,10,10);

fill(0,0,255,255);
ellipse(100,360,10,10);
ellipse(150,360,10,10);
fill(0);
text(“+”,120,362,20);
text(“=”,170,362,20);
fill(0,0,0,255);
ellipse(200,360,10,10);

}

function mousePressed(){
for (i=0;i<I-1;i++){
bitnew[i+1]=bit[i];
}
for (i=0;i<I;i++){
bit[i]=bitnew[i];
}
N=N+1;
}

# Binary Subtraction: -1

Binary Subtraction (click)

var bit = [];
var I = 5;
var D = 1;
var N;
var N1;

function setup() {
N=32;
for (var i = 0; i < I; i++) {
bit[i] = 1;
}

createCanvas(400, 400);
}

function draw() {
background(220);
fill(0);
text(“Number of digits =”,20,20);
text(“A digit can be 0 or 1”,20,40);
text(“Click to subtract”,250,20);
text(“Binary Subtraction: -1”,150,390);
text(I,120,20);
text(N-1,360,10);

//the subtraction operator
for (var i = 0; i<I-1; i++) {
if (bit[i]<0){
bit[i+1]=bit[i+1]-1;
bit[i]=1;
}
}

//output
if (bit===1){
fill(0,255,0,255);
ellipse(305,80,10,10);
fill(0,255,0,255);
for (var i=0;i<1;i++){
ellipse(305,110+10*i,5,5);
}
}
if (bit===1){
fill(255,255,0,255);
ellipse(305-40,80,10,10);
fill(0,255,0,255);
for (var i=0;i<2;i++){
ellipse(305-40,110+10*i,5,5);
}
}
if (bit===1){
fill(255,0,0,255);
ellipse(305-80,80,10,10);
fill(0,255,0,255);
for (var i=0;i<4;i++){
ellipse(305-80,110+10*i,5,5);
}
}
if (bit===1){
fill(0,0,255,255);
ellipse(305-120,80,10,10);
fill(0,255,0,255);
for (var i=0;i<8;i++){
ellipse(305-120,110+10*i,5,5);
}
}
if (bit===1){
fill(0);
ellipse(305-160,80,10,10);
fill(0,255,0,255);
for (var i=0;i<16;i++){
ellipse(305-160,110+10*i,5,5);
}
}
for (var i = 0; i<I; i++){
fill(0);
text(bit[i],300-40*i,100,10)
}
for (var i = 0; i<(N-1); i++){
fill(0,255,0,255);
ellipse(365,20+10*i,5,5);
}
fill(0,255,0,255);
ellipse(100,300,10,10);
ellipse(150,300,10,10);
fill(0);
text(“+”,120,302,20);
text(“=”,170,302,20);
fill(255,255,0,255);
ellipse(200,300,10,10);

fill(255,255,0,255);
ellipse(100,320,10,10);
ellipse(150,320,10,10);
fill(0);
text(“+”,120,322,20);
text(“=”,170,322,20);
fill(255,0,0,255);
ellipse(200,320,10,10);

fill(255,0,0,255);
ellipse(100,340,10,10);
ellipse(150,340,10,10);
fill(0);
text(“+”,120,342,20);
text(“=”,170,342,20);
fill(0,0,255,255);
ellipse(200,340,10,10);

fill(0,0,255,255);
ellipse(100,360,10,10);
ellipse(150,360,10,10);
fill(0);
text(“+”,120,362,20);
text(“=”,170,362,20);
fill(0,0,0,255);
ellipse(200,360,10,10);

}

function mousePressed(){
bit=bit-1;
N=N-1;
}

# Gravitating Bodies

Particle System under Gravitational Attraction (click)

var x = [];
var dx;
var vx = [];
var fx;
var y = [];
var dy;
var vy = [];
var fy;
var m = [];
var dt;
var N;
var I;
var r;

function setup() {
createCanvas(400, 400);
N=100;
I=1;
dt = 0.001;
for (var i=0;i<N; i++){
x[i] = random(1,200);
x=200;
dx = 0;
fx=0;
vx[i] = random(-100,100);
y[i] = random(1,200);
y=200;
dy = 0;
fy=0;
vy[i] = random(-100,100);
m[i] = random(5,20);
m=10;
r=0;
}
}

function draw() {

background(0,0,0,5);
fill(0,0,255,255);
text(“Particle System under Gravitational Attraction”,100,50);
fill(255,0,0,255);
for (var i=0; i<I; i++) {
fx=0;
fy=0;
for (var j=0; j<I; j++) {
dx = x[i]-x[j];
dy = y[i]-y[j];
r = pow(dx,2)+pow(dy,2);
r =sqrt(r);
fx = fx – m[i]*m[j]*1000000*dx/pow(r+10,3);
fy = fy – m[i]*m[j]*1000000*dy/pow(r+10,3);
}
vx[i]=vx[i]+fx*dt/m[i];
vy[i]=vy[i]+fy*dt/m[i];
x[i]=x[i]+vx[i]*dt;
y[i]=y[i]+vy[i]*dt;
fill(20*i,40*i,255-20*i);
//fill(random(0,255),random(0,255),random(0,255),255);
noStroke();
ellipse(x[i],y[i],m[i],m[i]);
}
}
function mousePressed() {
x[I]=mouseX;
y[I]=mouseY;
I=I+1
}

The same thing with base 3

Here is an intro to binary numbers with position system supported by color.

var bit = [];
var I = 5;
var D = 1;
var N;

function setup() {
N=1;
for (var i = 0; i < I; i++) {
bit[i] = 0;
}

createCanvas(400, 400);
}

function draw() {
background(220);
fill(0);
text(“Number of digits =”,20,20);
text(“A digit can be 0 or 1”,20,40);
text(I,120,20);

for (var i = 0; i<I-1; i++) {
if (bit[i]>D){
bit[i+1]=bit[i+1]+1;
bit[i]=0;
}
}

//output
if (bit===1){
fill(0,255,0,255);
ellipse(305,80,10,10);
fill(0,255,0,255);
for (var i=0;i<1;i++){
ellipse(305,110+10*i,5,5);
}
}
if (bit===1){
fill(255,255,0,255);
ellipse(305-40,80,10,10);
fill(0,255,0,255);
for (var i=0;i<2;i++){
ellipse(305-40,110+10*i,5,5);
}
}
if (bit===1){
fill(255,0,0,255);
ellipse(305-80,80,10,10);
fill(0,255,0,255);
for (var i=0;i<4;i++){
ellipse(305-80,110+10*i,5,5);
}
}
if (bit===1){
fill(0,0,255,255);
ellipse(305-120,80,10,10);
fill(0,255,0,255);
for (var i=0;i<8;i++){
ellipse(305-120,110+10*i,5,5);
}
for (var i=0;i<8;i++){
ellipse(305-120,110+10*i,5,5);
}

}
if (bit===1){
fill(0);
ellipse(305-160,80,10,10);
fill(0,255,0,255);
for (var i=0;i<16;i++){
ellipse(305-160,110+10*i,5,5);
}
}
for (var i = 0; i<I; i++){
fill(0);
text(bit[i],300-40*i,100,10)
}
for (var i = 0; i<N-1; i++){
fill(0,255,0,255);
ellipse(365,20+10*i,5,5);
}

fill(0,255,0,255);
ellipse(100,300,10,10);
ellipse(150,300,10,10);
fill(0);
text(“+”,120,302,20);
text(“=”,170,302,20);
fill(255,255,0,255);
ellipse(200,300,10,10);

fill(255,255,0,255);
ellipse(100,320,10,10);
ellipse(150,320,10,10);
fill(0);
text(“+”,120,322,20);
text(“=”,170,322,20);
fill(255,0,0,255);
ellipse(200,320,10,10);

fill(255,0,0,255);
ellipse(100,340,10,10);
ellipse(150,340,10,10);
fill(0);
text(“+”,120,342,20);
text(“=”,170,342,20);
fill(0,0,255,255);
ellipse(200,340,10,10);

fill(0,0,255,255);
ellipse(100,360,10,10);
ellipse(150,360,10,10);
fill(0);
text(“+”,120,362,20);
text(“=”,170,362,20);
fill(0,0,0,255);
ellipse(200,360,10,10);

//print(bit);
}

function mousePressed(){
bit=bit+1;

N=N+1;
}

# Mathematics-IT as NewMath

NewMath:Mathematics-IT is a basic school version of the BodyandSoul university mathematics education reform program. The Swedish version is presented at Matematik-IT.

Mathematics-IT combines the language of mathematics with programming and the computational power of the computer into a new tool for simulation of real and imagined worlds, to be used to understand and handle these worlds. Mathematics-IT is constructive mathematics where all mathematical objects are constructed computationally.

All of this can be described as different forms of computer games, where the student both constructs/programs and plays the game, where computer game means interaction between player and mathematical model using the computational power of the computer.

The main questions are here: What can I construct? How do I do to construct such a thing? rather than the traditional questions: What am I supposed to do? How am I supposed to do that? The questions and answers are here connected so that How? influences What?.

The perspective is thus open towards a large variety of different constructive possibilities for different students, rather than closed as in traditional school mathematics towards few possibilities, the same for everybody. The question Why? has a different answer when possibilities are many, than when possibilities are few.

Mathematics-IT is below presented as a sequence of computer games in posts Game1, Game2, Game3,…, from the simplest to more complex, where the design and programming of the game is the main point.

We use Codea, which is a user friendly app for programming on the iPad for the iPad.

Mathematics-IT is supported by a set of apps on App Store illustrating different basic concepts and serving as inspiration for student work on programming apps for App Store and can be found searching for “new math”.

Take a look and see that these apps serving the basic school  version also represent central core of BodyandSoul for university.

NewMath: Mathematics-IT thus offers a mathematics education with a new uniformity over levels, where the basic questions are the same independent of level: What can be computed and how?

# Apps on App Store

Mathematics-IT is supported by a number of apps on App Store with the dual purpose of illustrating basic concepts of mathematics and programming and serving as inspiration for student work to create apps on App Store. Here are the icons of some of the apps:   