//Lesson One
#Lesson 1: How to draw a symbol
#1-Write flower(25,25,1);.
Each statement in javascript should end with(;).
#2-Click the Run button and see the result on the right side.
#3-When you put the mouse on any symbol, you can see a gray box with three or more variables. for the flower symbol, these are x, y, and size.
#4-Try to change x, y and size to 125, 125, and 2 then run again to see the result.
#5-When you increase the x value the symbol moves to the right and when you increase the y value, the symbol goes down.
Lesson 1,1,2,0
//Lesson Two
//-------------------
#Lesson 2: How to change the Symbol color
#1-On the top left there are the Color and Stroke buttons where you can change the color and the outline of the symbol by choosing the color and then the symbol.
#2-Choose the Coral color on the third row or write color("Coral");
#3-Click the star button or type star(50,50,1);
#4-Click the Run button to see a coral star. Try to change the color and run again.
The color and the stroke statement should be before the star statement.
#5-The stroke statement has three parameters, so you can change the line color, the line width, and the line style to be a dashed or dotted line instead of the solid line.
#6- Write stroke("DarkCyan",5,0); before the star statement and run.
#7-Change the last paremeter of the the strok to 2 stroke("DarkCyan",5,2); and run again
Lesson 2,2,2,0
//Lesson Three
#Lesson 3: How to use Text
#1-To write a text click on the T button on the left or write
text(10,30,"Hello World",1,30);
#2-text(10,30,"Hello World",1,30);
10 is the x position. 30 is the y position, "Hello World" is the text, 1 is the font, and 30 is the font size.
#3-Try to change the text to the following:
text(50,130,"Hello World",2,60);
and click Run.
#4-for online text, write these three lines then click Run
stroke("CornflowerBlue",2,0);
color("White");
text(50,130,"Hello World",2,60);
Lesson 3,3,2,0
//Lesson Four
#How to write if-else statement
#1-write the following if-else statement:
x=3;
if(x==3)
flower(25,25,0.7);
else
star(25,25,1);
#2- Click Run, you should see a flower. Try to change x to 5 and run again. You should see a star.
#3- It is important to put two equal signs in the if condition (x==3). If you put only one equal sign (x=3), the condition will always be true which is wrong.
#4- If you have more than one statement to be executed if the condition is true then all statements should be enclosed in two curly brackets {}
#5- if-statement with curly brackets:
x=3;
if(x==3) {
flower(25,25,0.7);
star(25,25,1);
}
Lesson 4,4,2,0
//Lesson Five
//-------------
#How to write a for-loop
#1- Write the following for loop to draw 5 flowers
for (i=1; i<=5; i++){
flower(25,50*i,0.7);
}
#2- The for-loop has three statements
for (statement 1; statement 2; statement 3)
statements 1: set the initial value of the counter variable.
statements 2: has the loop condition.
statements 3: is executed each time to increase the counter variable.
#3- The i variable is the counter in the for-loop.
for (i=1; i<=5; i++)
the loop starts from i=1 and it repeats drawing the flower until i=5.
#4- The loop keeps repeating since the condition is true (i<=5).
#5- With each iteration, if the condition is true, the value of i is increased by one (i++).
#6- All statements enclosed in the for-loop block or between the curly brackets { } are executed.
#7- The following loop draw 5 flowers and 5 starts:
for (i=1; i<=5; i++){
flower(25,50*i,0.7);
star(50,50*i,0.7);
}
Lesson 5,5,2,0
//Lesson Six
//-------------
#How to write a switch statement
#1- Write the following code and click Run. You should see a flower:
a=3;
switch (a){
case 3: flower(50,50,0.7);break;
case 5: star(50,50,0.7);break;
case 7: heart(50,50,30); break;
}
#2- Try to change the value of a to 5 and click Run. You should see a star.
#3- Try to change the value of a to 7, you should see a heart.
#4- Each case statement should end with the break; statement.
#5- Try to add the default statement:
switch (a){
case 3: flower(50,50,0.7);break;
case 5: star(50,50,0.7);break;
case 7: heart(50,50,30); break;
default:circle(150,125,25);
}
#6- Change the value of a to 1 or any
value that is not 3 or 5 or 7. Click Run, You should see a circle.
Lesson 6,6,2,0
//Lesson Seven
//-------------
#Lesson 7: How to use the oval symbol:
#1- Write the following code and run
oval(50,50,35,25,0);
#2- The oval symbol has the 5 parameters:
oval (x, y, width, height, angle);
#3- Try to change the last number to 90.
oval(50,50,35,25,90);
The oval angle should be changed.
#4- Try to change the width and height as follows:
oval(50,150,20,15,90);
You should see a smaller oval shape after clicking the Run button.
Lesson 7,7,2,0
//Lesson Eight
//-------------
#Lesson 8: How to use the Triangle symbol
#1- The Triangle Symbol: Write the following code and run
triangle(50,50,1,0);
#2- The triangle symbol has the 4 parameters:
triangle (x, y, size, flip);
#3- Try to change the last number to 1 and run.
triangle(50,50,1,1);
This will flip the triangle.
try to change it to 2 and 3 for diffrent directions.
#4- You can also change the triangle size by changing the third number from 1 to 2 or to 0.5:
triangle(50,50,2,1);
triangle(50,100,0.5,1);
Lesson 8,8,2,0
//Lesson Nine
//-------------
#Lesson 9: How to use the Arc symbol
#1- Write the following code and run
arc(50,50,40,40,140);
#2- The arc symbole has 5 parameters
arc(x,y,radius,start angle, end angle);
#3- You can change the arc thickness using the stroke function.
stroke("Black",3,0);
arc(50,50,40,40,140);
#4- Try to change the x and y position of the arc
arc(100,100,40,40,140);
#5- Try to change the radius
arc(50,50,140,40,140);
#6- Try to change the start and end angle
arc(50,50,40,20,170);
the start angle on the right while the end angle on the left.
Lesson 9,9,2,0
//Lesson Ten
//-------------
#How to use the Plygon symbol
#1- Write the following code and run
polygon(50,50,25,6,0);
#2- The polygon symbol has 5 parameters
polygon(x,y,raduis, sides,angle);
#3- Try to change the raduis and run. This will change the polygon size
polygon(50,50,50,6,0);
#4- Try to change the polygon sides
polygon(50,50,50,8,0);
polygon(50,150,50,4,0);
#5- Try to change the angle to 45
polygon(50,150,50,4,45,0);
Then add another polygon and run
polygon(50,150,50,4,0,0);
Lesson 10,10,2,0
//Lesson 11
//-------------
#How to use other symbols
#1- The rectangle symbol has 4 paramaters:
rect(x,y,width,height);
rect(50,50,100,100);
#2- the circle symbol has 3 parameters:
circle(x,y,radius);
circle(50,50,40);
#3- The line symbol has 4 parameters:
line(x1,y1,x2,y2);
line(0,0,50,50);
#4- To change the line thickness, the stroke function should be called before the line function
stroke("Crimson",3,0);
line(0,0,50,50);
#5- The star symbol has 3 parameters
star(x,y,size);
star(50,50,0.5);
#6- Several symbols has 3 parameter x,y, and size. these are:
cloud(50,50,0.5);
cloud2(50,50,0.5);
flower(50,50,0.5);
flower2(50,50,0.5);
flower3(50,50,0.5);
heart(50,50,0.5);
bow2(50,50,0.5);
umbrella(50,50,0.5);
bicycle(50,50,0.5);
shirt(50,50,1);
stickBoy(50,50,1);
#7- Some symbols have 4 parameters:
bow(x,y,center color).
bow(50,50,1,"Yellow");
#8- The stickGirl has the dress color parameter
stickGirl(x,y,dress color);
stickGirl(50,50,1,"red");
#9- The type in the gift symbol can be 1 or 2
gift(x,y,type);
gift(50,50,1,1);
#10- The direction in the crescent symbol can be 0 or 1
crescent(x,y,direction).
crescent(50,50,1,0);
#How to use the button symbol
#1- Click the button symbol or write the following code:
x=1;
button(200,25,"Button",
function(){
//write your code when the button clicked here
x+=1;
star(0+x*100,75,1);
});
#2- Run the code. You should see a new star on different x-position whenever you click the button
#3- You can add any code to be executed when the button clicked.
#4- You can change the button color and the text color by adding the following code before the Button symbol
color("CodeGenieBlue");
stroke("White",1,0);
var quote=["If you have good thoughts they will shine out of your face like sunbeams and you will always look lovely. - Roald Dahl","I enjoy the spring more than the autumn now. One does, I think, as one gets older. - Virginia Woolf","That is one good thing about this world... There are always sure to be more springs.- L.M. Montgomery","Spring work is going on with joyful enthusiasm. - John Muir","Spring adds new life and new beauty to all that is. - Jessica Harrelson","Blossom by blossom the spring begins. - Algernon Charles Swinburne","The first blooms of spring always make my heart sing. - S. Brown","Spring will come and so will happiness. Hold on. Life will get warmer. - Anita Krizzan","If we had no winter, the spring would not be so pleasant. - Anne Bradstreet","Bloom where you are planted. - 1 Corinthians 7:20-24","Nature gives to every time and season some beauties of its own. - Charles Dickens","Spring\'s greatest joy beyond a doubt is when it brings the children out. - Edgar Guest","Spring is the time of plans and projects. - Leo Tolstoy","The promise of spring\'s arrival is enough to get anyone through the bitter winter. - Jen Selinsky","Despite the forecast, live like it\'s spring. - Lilly Pulitzer","Some old-fashioned things like fresh air and sunshine are hard to beat. - Laura Ingalls Wilder","Can words describe the fragrance of the very breath of spring? - Neltje Blanchan","Don\'t wait for someone to bring you flowers. Plant your own garden and decorate your own soul. - Luther Burbank","A kind word is like a spring day. - Russian Proverb","My favorite weather is bird chirping weather. - Terri Guillemets","My favorite weather is bird chirping weather. - Terri Guillemets","Deep in their roots, all flowers keep the light. - Theodore Roethke","That is one good thing about this world...there are always sure to be more springs. - L.M. Montgomery","A flower blossoms for its own joy. - Oscar Wilde","No winter lasts forever; no spring skips its turn. - Hal Borland","Let everything you do be done in love. - 1 Corinthians 16:14","To plant a garden is to believe in tomorrow. - Audrey Hepburn","The earth laughs in flowers. - Ralph Waldo Emerson","Where flowers bloom, so does hope. - Lady Bird Johnson","Faith makes all things possible... love makes all things easy. - Jeffrey R. Holland","Darkness cannot drive out darkness: only light can do that. Hate cannot drive out hate: only love can do that. - Martin Luther King, Jr.","Peace begins with a smile. - Mother Teresa","Do not let the behavior of others destroy your inner peace. - Dalai Lama","Let go of the thoughts that donβt make you strong. - Karen Salmansohn","Be healthy and take care of yourself, but be happy with the beautiful things that make you, you. - Beyonce","The biggest adventure you can ever take is to live the life of your dreams. - Oprah Winfrey","Beauty is everywhere. You only have to look to see it. - Bob Ross","You canβt stop the waves, but you can learn to swim. - Jon Kabat Zinn","The point is not to pay back kindness but to pass it on. - Julia Alvarez","No medicine cures what happiness cannot. - Gabriel GarcΓa MΓ‘rquez","If you have only one smile in you give it to the people you love. - Maya Angelou","The most important thing is to enjoy your life - to be happy. It\'s all that matters. - Audrey Hepburn","Happiness is the best makeup. - Drew Barrymore","Happiness comes in waves. It\'ll find you again. - Unknown","Start each day with a grateful heart. - Unknown","When it rains, look for rainbows. When it\'s dark, look for stars. - Unknown","All our dreams can come true, if we have the courage to pursue them. - Walt Disney","Happiness is not something ready made. It comes from your own actions - Dalai Lama XIV","Keep your eyes on the stars, and your feet on the ground. β Theodore Roosevelt","Never be in a hurry; do everything quietly and in a calm spirit. Do not lose your inner peace for anything whatsoever, even if your whole world seems upset. - Saint Francis de Sales"]
color("DARKBlue");
text(15,25,"Click the emoji",1,20,0);
color("white");
var arrEmoji=["π","π","π","π","π","πΈ","π","πΊ","π€","π€","π","π","π","π","π","π","π","π","π","π","π","π¦","π£","π","π’","πΈ","πΆ","π","π»","πΉ","π·","πΌ","βοΈ","πΏ","π³","π","π","π","π","π","π","π","π‘","π","π","π°","π","π¦","π","π"];
var y=0;
function showEmoji(index){
return function(){
color("white");
rect(50,45,60,65);
emoji(50,100,arrEmoji[index],60);
color("Teal");
alert(quote[index]);
}
}
for(var i=0;i<7;i++)
for(var j=0;j<7;j++)
{
button(50+i*30,110+j*30,arrEmoji[y], showEmoji(y));
if(y<49)
y++;
else
y=0;
}
x=200; y=90;
//z rang: 0.5 to 1.3
z=1;
stroke("MediumVioletRed",2);
//you can change the bow color
bowClr="HotPink";
ln=1; // ln is the line number
//Line 1
x1=(x-ln*10)+z*10;
y1=(y+2*(ln*10))+z*10;
size=z*10;
color(bowClr);
for(i=1;i<=6;i++)
{
if(i<=2 || i>4)
circle(x1+i*20,y1,size);
}
//Line 2
ln++;
x2=(x-ln*10)+z*10;
y2=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=7;i++)
{
switch (i){
case 1:
case 3:
case 5:
case 7:
circle(x2+i*20,y2,size);
break;
}
}
//Line 3
ln++;
x3=(x-ln*10)+z*10;
y3=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=8;i++)
{
switch (i){
case 1:
case 4:
case 5:
case 8:
circle(x3+i*20,y3,size);
break;
}
}
//Line 4
ln++;
x4=(x-(ln*10)+20)+z*10;
y4=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=7;i++)
{
circle(x4+i*20,y4,size);
}
//Line 5
ln++;
x5=(x-(ln*10)+60)+z*10;
y5=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=4;i++)
{
circle(x5+i*20,y5,size);
}
//Line 6
ln++;
x6=(x-(ln*10)+40)+z*10;
y6=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=7;i++)
{
if(i<=3 || i>4)
circle(x6+i*20,y6,size);
}
//Line 7
ln++;
x7=(x-(ln*10)+60)+z*10;
y7=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<7;i++)
{
if(i<=2 || i>4)
circle(x7+i*20,y7,size);
}
color("AntiqueWhite");
rect(0,0,555,500);
x=160; y=90;
stroke("Tan",1.5);
//you can change horse color
horseClr="White";
horseHair="HotPink"
ln=0; // ln is the line number
//Line 1
color(horseHair);
for(i=1;i<=3;i++)
{
circle(x+i*20,y,10);
}
//Line 2
ln++;
x2=x-ln*10;
y2=y+2*(ln*10);
for (i=1;i<=5;i++)
{
Cl=0;eCl=0;eClr=0;Clr=0;
if(i==1)
color(horseClr);
else
color(horseHair);
circle(x2+i*20,y2,10);
}
//Line 3
ln++;
x3=x-ln*10;
y3=y+2*(ln*10);
for (i=1;i<7;i++)
{
switch (i){
case 1:color(horseHair);
break;
case 2:
case 3:color(horseClr);
break;
case 4:color("Gold");
break;
case 5:
case 6:color(horseHair);
break;
}
circle(x3+i*20,y3,10);
}
//Line 4
ln++;
x4=x-(ln*10)+20;
y4=y+2*(ln*10);
for (i=1;i<7;i++)
{
switch (i){
case 1:color(horseClr);
break;
case 2:color("Black");
break;
case 3:color("Gold");
break;
case 4:color(horseClr);
break;
case 5:
case 6:color(horseHair);
}
circle(x4+i*20,y4,10);
//eye
if(i==2)
{
color("White");
circle(x4+i*22,y4-2,3);
}
}
//Line 5
ln++;
x5=x-(ln*10)+20;
y5=y+2*(ln*10);
for (i=1;i<8;i++)
{
switch (i){
case 3:color("Gold");
break;
case 6:
case 7:color(horseHair);
break;
default:color(horseClr);
}
circle(x5+i*20,y5,10);
}
//Line 6
ln++;
x6=x-(ln*10)+20;
y6=y+2*(ln*10);
for (i=1;i<13;i++)
{
switch (i){
case 1:
case 2:
case 3:color("Gold");
break;
case 7:color("MediumPurple");
break;
case 8:
case 9:color("Pink");
break;
case 10:color("MediumPurple");
break;
case 12:color(horseHair);
break;
default:color(horseClr);
}
circle(x6+i*20,y6,10);
}
//Line 7
ln++;
x7=x-(ln*10)+40;
y7=y+2*(ln*10);
for (i=1;i<13;i++)
{
switch (i){
case 3:color("MediumPurple");
break;
case 4:
case 5:
case 6:color("Gold");
break;
case 7:
case 8:
case 9:color("MediumPurple");
break;
case 12:color(horseHair);
break;
default:color(horseClr);
}
circle(x7+i*20,y7,10);
}
//Line 8
ln++;
x8=x+(ln*10)-20;
y8=y+2*(ln*10);
for (i=1;i<9;i++)
{
switch (i){
case 4:color("Gold");
break;
case 7:
case 8:color(horseHair);
break;
default:color(horseClr);
}
circle(x8+i*20,y8,10);
}
//Line 9
ln++;
x9=x-(ln*10)+80;
y9=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 6:color("Gold");
break;
case 9:
case 10:color(horseHair);
break;
default:color(horseClr);
}
circle(x9+i*20,y9,10);
}
//Line 10
ln++;
x10=x-(ln*10)+80;
y10=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 6:color("Gold");
break;
case 10:color(horseHair);
break;
default:color(horseClr);
}
circle(x10+i*20,y10,10);
}
//Line 11
ln++;
x11=x-(ln*10)+100;
y11=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 1:
case 2:color("Orange");
break;
case 10:color(horseHair);
break;
default:color(horseClr);
}
if(!(i>4 && i<7))
circle(x11+i*20,y11,10);
}
//Line 12
ln++;
x12=x11+30;
y12=y+2*(ln*10);
color(horseClr);
for (i=1;i<8;i++)
{
if(!(i>2 && i<6))
circle(x12+i*20,y12,10);
}
//Line 13
ln++;
x13=x12-10;
y13=y+2*(ln*10);
color(horseClr);
for (i=1;i<8;i++)
{
if(!(i>2 && i<6))
circle(x13+i*20,y13,10);
}
//Line 14
ln++;
x14=x13-10;
y14=y+2*(ln*10);
color("Orange");
for (i=1;i<8;i++)
{
if(!(i>2 && i<6))
circle(x14+i*20,y14,10);
}
dogClr="Tan";
//Line 1
color(dogClr);
for(i=1;i<=7;i++)
{
if(!(i>2 && i<6))
circle(150+i*20,90,10);
}
//Line 2
for (i=1;i<=8;i++)
{
if(i>=7)
color("HotPink");
circle(140+i*20,110,10);
}
//Line 3
for (i=1;i<=9;i++)
{
switch (i){
case 1:color(dogClr);
break;
case 7:
case 9:color("HotPink");
break;
case 8:color("Gold");
break;
default:color("MediumPurple");
}
circle(130+i*20,130,10);
}
//Line 4
for (i=1;i<=7;i++)
{
if(i>=6)
color("HotPink");
else
color(dogClr);
circle(160+i*20,150,10);
}
//Line 5
for (i=1;i<8;i++)
{
if(i==2 || i== 6)
{
color("Black");
circle(150+i*20,170,10);
color("White");
circle(145+i*20,168,3);
}
else
{color(dogClr);
circle(150+i*20,170,10);
}
}
//Line 6
for (i=1;i<=5;i++)
{
if(i==3 )
color("Black");
else
color(dogClr);
circle(170+i*20,190,10);
}
//Line 7
for (i=1;i<9;i++)
{
if(i==3 )
color("Gold");
else
color(dogClr);
if(i<5 || i==8)
circle(180+i*20,210,10);
}
//Line 8
for (i=1;i<=8;i++)
{
switch (i){
case 5:
case 6: color("Pink");
break;
default:color(dogClr);
}
if(i<5 )
color("MediumPurple");
circle(190+i*20,230,10);
}
//Line 9
for (i=1;i<=8;i++)
{
switch (i){
case 5:
case 6: color("Pink");
break;
default:color(dogClr);break;
}
circle(180+i*20,250,10);
}
//Line 10
for (i=1;i<8;i++)
{
switch (i){
case 4:
case 5:color("Pink");
break;
default:color(dogClr);
}
circle(190+i*20,270,10);
}
//Line 11
for (i=1;i<8;i++)
{
switch (i){
case 3:
case 4:color("Pink");
break;
default:color(dogClr);
}
circle(200+i*20,290,10);
}
//Line 12
for(i=1;i<=7;i++)
{
if(i==4)
color("Pink");
else
color(dogClr);
if(!(i>2 && i<6) || i==4)
circle(190+i*20,310,10);
}
// write a program that prints numbers from 1 to 10
for(i=0;i<10;i++)
{
text(10+i*20,30,i,1,20,1);
}
// write a program that prints even numbers from 1 to 10
for(i=0;i<10;i++)
{
if(i%2==0) text(10+i*20,80,i,1,20,1);
}
// write a program that prints odd numbers from 1 to 10
for(i=0;i<10;i++)
{
if(i%2) text(10+i*20,120,i,1,20,1);
}
arrColor=["pink", "SkyBlue", "Salmon", "LimeGreen", "orange", "LightPink", "red", "GreenYellow"];
color ("AntiqueWhite");
rect(20,15,515,400);
x=275; y=50;k=0;
for(i=0;i<=7;i++)
{
for (j=0;j<6;j++)
{
stroke(3,"white");
color(arrColor[k]);
flower(x-j*45,y+i*45,0.8);
flower(x+j*45,y+i*45,0.8);
//try to change flower with flower 2 or 3
k++;
k=k%7;//change 7 with other number
}
}
i=0;
r=0;
// you can chage the shape between 1 and 10
shape=5;
color("Crimson");
function draw(){
r=3*Math.cos(shape*i/6);
circle(70*r*Math.cos(i)+270,70*r*Math.sin(i)+230,1);
i+=0.01;
if(i>12*Math.PI)
clearInterval(timer);
}
timer=setInterval(function(){draw();},0.001)
var d=0;
var colors=["Red","Orange","Yellow","Green","Blue","Purple"];
function f1(){
color("White");
rect(0,0,6000,6000);
color(colors[Math.floor(Math.random()*colors.length)]);
r=4*Math.cos(d/6);
circle(r*50*Math.cos(d)+300,r*50*Math.sin(d)+200,10);
circle(-r*50*Math.cos(d)+300,-r*50*Math.sin(d)+200,10);
d=d+0.05;
}
f1();
timer=setInterval(function(){
f1();
},0.1);
var s = "Welcome to Code Genie";
function draw(x){
color("White");
stroke("White",1);
rect(0,0,800,800);
stroke("Black",1);
color("Brown");
text(x,100,s,1,60,0);
}
var x = 700;
var timer = setInterval(function(){
draw(x);
x=x-1;
if(x<-700)
x = 700;
},10)
var d=0;
var clr=0;
var colors=["Red","Orange","Yellow","Green","Blue","Purple"];
function circles(a,b){x=a*Math.cos(d);
y=Math.abs(a)*Math.sin(d-b);
color(colors[clr++ % colors.length]);
circle(x+360,y+280,25);
d+=0.0001;
}
function f1(){
color("White");
rect(0,0,6000,6000);
stroke("Black",1);
color("Black");
for(i=0;i<=Math.PI*2;i+=Math.PI/11){
circles(175,i);
}
for(i=0;i<=Math.PI*2;i+=Math.PI/7.5){
circles(-125,i);
}
for(i=0;i<=Math.PI*2;i+=Math.PI/4.5){
circles(75,i);
}
for(i=0;i<=Math.PI*2;i+=Math.PI/14){
circles(-225,i);
}
//circle(360,280,50);
}
f1();
timer=setInterval(function(){
f1();
},0);
var gameStarted = false;
var x = 0;
var y = 20;
var w = 500;
var h = 400;
var gap = 100;
var pipeWidth = 30;
var dist = 250;
var speed = 0;
var birdXPos = w / 5;
var birdYPos = h / 2;
var timer;
var score = 0;
var scoreRecorded = false;
var arrPipeXPos = [w - pipeWidth];
var arrTopPipeH = [200];
function drawBird() {
stroke("Yellow", 1);
color("Yellow");
circle(birdXPos, birdYPos, 15);
stroke("Black", 1);
color("Black");
triangle(birdXPos + 15, birdYPos - 3, 0.2, 2);
circle(birdXPos + 1, birdYPos - 1, 2);
if (birdYPos > h - 1 || birdYPos - 15 < 0 || ((birdYPos < arrTopPipeH[0] || birdYPos > arrTopPipeH[0] + gap) && birdXPos >= arrPipeXPos[0] && birdXPos <= arrPipeXPos[0] + pipeWidth)) {
clearInterval(timer);
gameStarted = false;
playAgain();
}
birdYPos = birdYPos - speed;
speed -= 0.5;
}
function drawBkg() {
stroke("DeepSkyBlue", 1);
color("DeepSkyBlue");
rect(x, y, w, h);
}
function drawPipe(x, th) {
stroke("Black", 1);
color("Brown");
for (var i = 0; i < x.length; i++) {
rect(x[i], y, pipeWidth, th[i]);
rect(x[i], y + th[i] + gap, pipeWidth, h - (th[i] + gap));
x[i] -= 1;
}
}
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
function startGame() {
birdXPos = w / 5;
birdYPos = h / 2;
gameStarted = true;
scoreRecorded = false;
speed = 0;
arrPipeXPos = [w - pipeWidth];
arrTopPipeH = [200];
timer = setInterval(function () {
drawBkg();
drawPipe(arrPipeXPos, arrTopPipeH);
drawBird();
if (w - arrPipeXPos[arrPipeXPos.length - 1] > dist) {
var newH = getRandomInt(100, 200);
arrPipeXPos.push(w - pipeWidth);
arrTopPipeH.push(newH);
}
if (!scoreRecorded && arrPipeXPos[0] + pipeWidth < birdXPos) {
scoreRecorded = true;
score++;
updateScore();
}
if (arrPipeXPos[0] < birdXPos - dist / 2 || arrPipeXPos[0] < 0) {
arrPipeXPos.shift();
arrTopPipeH.shift();
scoreRecorded = false;
}
}, 20);
}
document.onkeydown = checkKey;
function checkKey(e) {
e = e || window.event;
if (e.keyCode == "32") {
if (gameStarted)
speed = 5;
else
startGame();
}
}
function updateScore() {
color("White");
stroke("White", 1);
rect(300, 0, 150, 18);
stroke("Black", 1);
color("Black");
text(300, 12, "Score: " + score, 1, 15, 0);
}
function playAgain() {
stroke("MediumTurquoise", 1);
color("MediumTurquoise");
rect(w / 4, h / 4, 210, 75);
stroke("Black", 1);
color("Black");
text(w / 4 + 15, h / 4 + 30, "Press Space to play again", 1, 15, 0);
}
stroke("White", 1);
color("White");
rect(0, 0, 650, 550);
color("Black");
stroke("Black", 1);
text(25, 150, "Hide the Grid and click here to start the game.", 1, 18, 0);
text(25, 170, "Use Space to fly the bird.", 1, 18, 0);
document.onmousedown = function (e) {
if (!gameStarted) {
startGame();
updateScore()
}
}
color("white");
stroke("Black",2);
rect(20,20,550,450);
text(320,16,"Bouncing Ball",1,20,1);
function getRandomNo(min, max) {
return Math.random() * (max - min) + min;
}
var x= getRandomNo(30,440);
var oldx=x;
var y=getRandomNo(30,440);
var oldy=y;
var id=0;
var incX = 1;
var incY = 1;
function draw(){
color("white");
stroke("white",1);
circle(oldx,oldy,12);
color("Brown");
stroke("Brown",1);
circle(x,y,10);
oldx = x;
oldy=y;
x+=incX;
y+=incY;
if(x+10>=567 || x-10<=23)
incX = -incX;
if(y+10>=467 || y-10<=23)
incY = -incY;
}
id = setInterval(function(){
draw();
},6)
color("white");
stroke("Black",2);
rect(20,20,550,450);
text(320,16,"Snake",2,20,1);
var r=5;
function getRandomNo(min, max) {
return Math.random() * (max - min) + min;
}
var x= getRandomNo(30,440);
var oldx=x;
var y=getRandomNo(30,440);
var oldy=y;
var id=0;
var incX = 2;
var incY = 2;
var clr = "blue";
function draw(){
//color("white");
//stroke("white",1);
//circle(oldx,oldy,12);
color(clr);
stroke(clr,1);
circle(x,y,r);
oldx = x;
oldy=y;
x+=incX;
y+=incY;
if(x+r>=567 || x-r<=23)
incX = -incX;
if(y+r>=467 || y-r<=23)
incY = -incY;
}
id = setInterval(function(){
draw();
},2)
var t1 = 0;
var t2 = 90;
arrColor = ["Blue", "Brown", "Coral", "DarkGreen", "Red", "Sienna", "Black", "MediumTurquoise", "MidnightBlue", "LightSlateGray", "LightCoral", "DeepPink"];
c = 0;//color counter
//try to change inc1 and inc2
inc1 = 10;
inc2 = 1;
//change n will change the number of lines
n = 1;
timer = 0;
function draw() {
r = t1 * Math.PI / 180.0;
r2 = t2 * Math.PI / 180.0
x = 250 + Math.cos(r) * 170;
y = 200 + Math.sin(r) * 170;
x1 = 250 + Math.cos(r2) * 170;
y1 = 200 + Math.sin(r2) * 170;
stroke(arrColor[c], 1);
c = c + 1;
c = c % 12;//return c to 0 if > 12
line(x, y, x1, y1);
t1 += inc1;
t2 += inc2;
n++;
if (n > 520)
clearInterval(timer);
}
timer = setInterval(function () {
draw()
}, 10);
arrColor=["PaleTurquoise","MediumAquaMarine","Moccasin","Pink", "LightBlue","Thistle", "LightPink", "MediumAquaMarine", "Lavender", "PaleTurquoise"];
var xCenter = 260;
var yCenter = 230;
var PI = Math.PI;
var tick = PI*2/60.0;
var tickHour = PI*2/12.0
var handsColor = "Crimson";
stroke("white",7);
color("LightYellow");
stroke("Peru",10);
circle(xCenter,yCenter,200);
color("Crimson");
stroke("Transparent",1);
circle(xCenter,yCenter,15);
n=1;
radius=157;
start=-PI/2+tickHour;
end=PI+PI/2;
color("Peru");
for(i=start;i<end;i+=tickHour)
{
x=xCenter+Math.cos(i)*radius;
y=yCenter+Math.sin(i)*radius;
text(x-15,y+10,n,0,40,0);
n++;
}
drawClockHands()
function drawClockHands(){
var now = new Date();
var h = now.getHours()-12;
var m = now.getMinutes();
var s = now.getSeconds();
var rHour = radius-70;
var rMin = radius-57;
var rSec = radius-27;
//clear the hands
color("LightYellow");
stroke("LightYellow",1);
circle(xCenter,yCenter,rSec);
color("CornflowerBlue");
text(xCenter-70,yCenter-30,"Code Genie",1,30,0);
//hour
var deg = 0.5*(60*h+m);
angle = PI-deg*PI/180.0;// PI-tickHour*h;
var xh=xCenter+Math.sin(angle)*rHour;
var yh=yCenter+Math.cos(angle)*rHour;
stroke(handsColor,10);
line(xCenter,yCenter,xh,yh);
color(handsColor);
stroke(handsColor,1);
circle(xh,yh,4);
//minute
angle = PI-tick*m;
var xm=xCenter+Math.sin(angle)*rMin;
var ym=yCenter+Math.cos(angle)*rMin;
stroke(handsColor,10);
line(xCenter,yCenter,xm,ym);
color(handsColor);
stroke(handsColor,1);
circle(xm,ym,4);
//second
var angle = PI-tick*s;
var x=xCenter+Math.sin(angle)*rSec;
var y=yCenter+Math.cos(angle)*rSec;
stroke(handsColor,2);
line(xCenter,yCenter,x,y);
//draw the small center circle
color(handsColor);
stroke(handsColor,1);
circle(xCenter,yCenter,10);
}
setInterval(function(){
drawClockHands();
},1000);
i=0;
r=0;
// you can chage the shape between 1 and 10
shape=5;
color("Crimson");
function draw(){
r=3*Math.cos(shape*i/6);
circle(70*r*Math.cos(i)+270,70*r*Math.sin(i)+230,1);
i+=0.01;
if(i>12*Math.PI)
clearInterval(timer);
}
timer=setInterval(function(){draw();},0.001)
width=10;
height=5;
w = "";
for ( i = 0; i < width; ++i) {
w += "πΈ";
}
w += '\n';
// create horizontal line for height
h = "";
for ( i = 0; i < width; ++i) {
if (i == 0 || i == width - 1) {
h += "π";
}
else {
h += "πΏ";
}
}
h += '\n';
// create complete string
s = "";
s += w;
for ( i = 0; i < height - 2; ++i) {
s += h;
}
s += w;
alert(s);
color("DARKBlue");
text(15,25,"Click the emoji",1,20,0);
color("white");
arrEmoji=["π","π","π","π","π","πΈ","π","πΊ","π€","π€","π","π","π","π","π","π","π","π","π","π","π","π¦","π£","π","π’","πΈ","πΆ","π","π»","πΉ","π·","πΌ","βοΈ","πΏ","π³","π","π","π","π","π","π","π","π‘","π","π","π°","π","π¦","π","π"];
y=0;
function showEmoji(index){
return function(){
color("white");
rect(50,45,60,65);
emoji(50,100,arrEmoji[index],60);
color("Teal");
alert(quote[index]);
}
}
for(var i=0;i<7;i++)
for(var j=0;j<7;j++)
{
button(50+i*30,110+j*30,arrEmoji[y], showEmoji(y));
if(y<49)y++;
else y=0;
}
quote=["If you have good thoughts they will shine out of your face like sunbeams and you will always look lovely. - Roald Dahl"
,"I enjoy the spring more than the autumn now. One does I think as one gets older. - Virginia Woolf"
,"That is one good thing about this world... There are always sure to be more springs.- L.M. Montgomery"
,"Spring work is going on with joyful enthusiasm. - John Muir"
,"Spring adds new life and new beauty to all that is. - Jessica Harrelson"
,"Blossom by blossom the spring begins. - Algernon Charles Swinburne"
,"The first blooms of spring always make my heart sing. - S. Brown"
,"Spring will come and so will happiness. Hold on. Life will get warmer. - Anita Krizzan"
,"If we had no winter, the spring would not be so pleasant. - Anne Bradstreet"
,"Bloom where you are planted. - 1 Corinthians 7:20-24"
,"Nature gives to every time and season some beauties of its own. - Charles Dickens"
,"Spring's greatest joy beyond a doubt is when it brings the children out. - Edgar Guest"
,"Spring is the time of plans and projects. - Leo Tolstoy"
,"The promise of spring's arrival is enough to get anyone through the bitter winter. - Jen Selinsky"
,"Despite the forecast, live like it's spring. - Lilly Pulitzer"
,"Some old-fashioned things like fresh air and sunshine are hard to beat. - Laura Ingalls Wilder"
,"Can words describe the fragrance of the very breath of spring? - Neltje Blanchan"
,"Don't wait for someone to bring you flowers. Plant your own garden and decorate your own soul. - Luther Burbank"
,"A kind word is like a spring day. - Russian Proverb"
,"My favorite weather is bird chirping weather. - Terri Guillemets"
,"My favorite weather is bird chirping weather. - Terri Guillemets"
,"Deep in their roots, all flowers keep the light. - Theodore Roethke"
,"That is one good thing about this world...there are always sure to be more springs. - L.M. Montgomery"
,"A flower blossoms for its own joy. - Oscar Wilde"
,"No winter lasts forever; no spring skips its turn. - Hal Borland"
,"Let everything you do be done in love. - 1 Corinthians 16:14"
,"To plant a garden is to believe in tomorrow. - Audrey Hepburn"
,"The earth laughs in flowers. - Ralph Waldo Emerson"
,"Where flowers bloom, so does hope. - Lady Bird Johnson"
,"Faith makes all things possible... love makes all things easy. - Jeffrey R. Holland"
,"Darkness cannot drive out darkness: only light can do that. Hate cannot drive out hate: only love can do that. - Martin Luther King, Jr."
,"Peace begins with a smile. - Mother Teresa"
,"Do not let the behavior of others destroy your inner peace. - Dalai Lama"
,"Let go of the thoughts that donβt make you strong. - Karen Salmansohn"
,"Be healthy and take care of yourself, but be happy with the beautiful things that make you, you. - Beyonce"
,"The biggest adventure you can ever take is to live the life of your dreams. - Oprah Winfrey"
,"Beauty is everywhere. You only have to look to see it. - Bob Ross"
,"You canβt stop the waves, but you can learn to swim. - Jon Kabat Zinn"
,"The point is not to pay back kindness but to pass it on. - Julia Alvarez"
,"No medicine cures what happiness cannot. - Gabriel GarcΓa MΓ‘rquez"
,"If you have only one smile in you give it to the people you love. - Maya Angelou"
,"The most important thing is to enjoy your life - to be happy. It's all that matters. - Audrey Hepburn"
,"Happiness is the best makeup. - Drew Barrymore"
,"Happiness comes in waves. It'll find you again. - Unknown"
,"Start each day with a grateful heart. - Unknown"
,"When it rains, look for rainbows. When it's dark, look for stars. - Unknown"
,"All our dreams can come true, if we have the courage to pursue them. - Walt Disney"
,"Happiness is not something ready made. It comes from your own actions - Dalai Lama XIV"
,"Keep your eyes on the stars, and your feet on the ground. β Theodore Roosevelt"
,"Never be in a hurry; do everything quietly and in a calm spirit. Do not lose your inner peace for anything whatsoever, even if your whole world seems upset. - Saint Francis de Sales"
]
var emojies = ["π","π","π","π"]
function showEmoji(index){
return function(){
emoji(10,75,emojies[index],30);
}
}
for(var i=0;i<emojies.length;i++){
button(10+i*50,250,emojies[i], showEmoji(i));
}
x=10; y=100;
for(i=1;i<=10;i++)
{
switch(i){
case 6:color("red");break;
case 8:color("green");break;
case 10:color("black");break;
default:
color("blue");
}//end of Switch
circle(x+i*50,y,15);
}//end of for
i=5;
x=10; y=100;
for(i=1;i<=10;i++)
{
switch(i){
case 1:
emoji(x+i*30,y,"πΆ",30);break;
case 5:
emoji(x+i*50,y,"π±",30);break;
case 3:
emoji(x+i*50,y,"π΅",30); break;
default:
emoji(x+i*50,y,"π",30);
}
}
var a = [1,3,4,4];
var sum = 8;
text(10,100,a+" Has pair with sum "+sum+" is "+hasPairWithSum2(a,sum),1,30);
function hasPairWithSum2(data, sum){
var len = data.length;
var low = 0;
var hi = len-1;
while(low<hi){
var s = data[low]+data[hi];
if(s == sum)
return true;
if(s>sum)
--hi;
else
++low;
}
return false;
}
//[1,2,4,4]has one pair equal 8
var a = [1,2,4,4];
var sum = 8;
var fn=hasPairWithSum(a,sum);
text(10,100,a+" Has pair with sum "+sum+" is "+fn,1,30);
//[1,2,3,9] has no pair equal 8
var a = [1,2,3,9];
var sum = 8;
var fn=hasPairWithSum(a,sum);
text(10,200,a+" Has pair with sum "+sum+" is "+fn,1,30);
//fn
function hasPairWithSum(data, sum){
var len = data.length;
var comp = [];
for(var i=0;i<len;++i){
var value = data[i];
if(comp.indexOf(value)!=-1)
return true;
comp.push(sum-value);
}
return false;
}
//console.log(var)
var nRow = 4;
var nCol = 4;
var rectSize = 100;
var margin = 10;
var pictureGrid = [];
var rectColor = "LightGray";
pictureGrid[0] = [0, 3, 5, 0];
pictureGrid[1] = [7, 4, 3, 1];
pictureGrid[2] = [5, 6, 7, 2];
pictureGrid[3] = [4, 2, 1, 6];
var picturesFn = ["flower", "star", "heart", "umbrella", "bicycle", "bow2", "bow", "crescent"]
for (var i = 0; i < nRow; i++) {
for (var j = 0; j < nCol; j++) {
color(rectColor);
rect(20 + i * (rectSize + margin), 20 + j * (rectSize + margin), rectSize, rectSize);
color("Black");
text(20 + i * (rectSize + margin) + rectSize / 2 - 10, 20 + j * (rectSize + margin) + rectSize / 2 + 10, String.fromCharCode(65 + j * nCol + i), 1, 30);
}
}
document.onkeydown = checkKey;
var img1 = "";
var img2 = "";
var row1 = -1;
var row2 = -1;
var col1 = -1;
var col2 = -1;
var lastKey = null;
function hidePict(row, col) {
color(rectColor);
rect(20 + col * (rectSize + margin), 20 + row * (rectSize + margin), rectSize, rectSize);
color("Black");
text(20 + col * (rectSize + margin) + rectSize / 2 - 10, 20 + row * (rectSize + margin) + rectSize / 2 + 10, String.fromCharCode(65 + row * nCol + col), 1, 30);
}
function checkKey(e) {
if(lastKey == e.keyCode)
return;
lastKey = e.keyCode;
e = e || window.event;
var row = 0;
var col = 0;
var index = 0;
var a = e.keyCode - 'A'.charCodeAt(0);
if (a >= 0 && a <= 15) {
row = Math.floor(a / nRow);
col = a % nCol;
//alert(row+","+col);
index = pictureGrid[row][col];
if (index == -1)
return;
var fnName = picturesFn[index];
color("White");
rect(20 + col * (rectSize + margin), 20 + row * (rectSize + margin), rectSize, rectSize);
switch (fnName) {
case 'flower':
color("CarnationPink");
flower(20 + col * (rectSize + margin) + rectSize / 2, 20 + row * (rectSize + margin) + rectSize / 2, 1.5);
break;
case 'star':
color("yellow");
star(20 + col * (rectSize + margin), 20 + row * (rectSize + margin), 2);
break;
case 'heart':
color("red");
heart(20 + col * (rectSize + margin), 20 + row * (rectSize + margin), 100);
break;
case 'umbrella':
color("black");
umbrella(20 + col * (rectSize + margin), 20 + row * (rectSize + margin), 2);
break;
case 'bicycle':
color("blue");
bicycle(20 + col * (rectSize + margin), 20 + row * (rectSize + margin) + 20, 2);
break;
case 'bow2':
color("DeepPink");
bow2(20 + col * (rectSize + margin), 20 + row * (rectSize + margin), 1.8);
break;
case 'bow':
color("Teal");
bow(20 + col * (rectSize + margin) + 10, 20 + row * (rectSize + margin) + 10, 1.05, "Yellow");
break;
case 'crescent':
color("ForestGreen");
crescent(20 + col * (rectSize + margin), 20 + row * (rectSize + margin), 2.5, 0);
break;
}
if (img1 == "") {
img1 = fnName;
row1 = row;
col1 = col;
}
else {
row2 = row;
col2 = col;
img2 = fnName;
setTimeout(function () {
if (img1 == img2) {
pictureGrid[row1][col1] = -1;
pictureGrid[row2][col2] = -1;
img1 = "";
img2 = "";
lastKey = null;
}
else {
img1 = "";
img2 = "";
hidePict(row1, col1);
hidePict(row2, col2);
lastKey=null;
}
}, 1000);
}
}
}
/****** Binary Tree ******/
function TreeNode(d) {
this.data = d;
this.left = null;
this.right = null;
this.parent = null;
this.size = 1;
}
TreeNode.prototype.insertInOrder = function (d) {
if (d < this.data) {
if (this.left === nUll) {
this.setLeftChild(new TreeNode(d));
}
else
this.left.insertlnOrder(d);
}
else {
if (this.right === null)
this.setRightChild(new TreeNode(d));
else
this.right.insertlnOrder(d);
}
this.size++;
}
TreeNode.prototype.find = function (d) {
if (d == this.data)
return this;
else if (d <= this.data)
return this.left != null ? this.left.find(d) : null;
else if (d > this.data)
return this.right != null ? this.right.find(d) : null;
return null;
}
TreeNode.prototype.setLeftChild = function (left) {
this.left = left;
if (left != null) {
left.parent = this;
}
}
TreeNode.prototype.setRightChild = function (right) {
this.right = right;
if (right != null) {
right.parent = this;
}
}
TreeNode.prototype.isBST = function () {
if (this.left != null) {
if (this.data < this.left.data || !this.left.isBST()) {
return false;
}
}
if (this.right != null) {
if (this.data >= this.right.data || !this.right.isBST()) {
return false;
}
}
return true;
}
TreeNode.prototype.height = function () {
var leftHeight = this.left != null ? this.left.height() : 0;
var rightHeight = this.right != null ? this.right.height() : 0;
return 1 + Math.max(leftHeight, rightHeight);
}
function addToTree(arr, start, end) {
if (end < start) {
return null;
}
var mid = Math.floor((start + end) / 2);//Math.floor is IMPORTANT in JS to return integer number
var n = new TreeNode(arr[mid]);
n.left = addToTree(arr, start, mid - 1);
n.right = addToTree(arr, mid + 1, end);
return n;
}
function createMinimalBST(array) {
return addToTree(array, 0, array.length - 1);
}
function traverse(obj, cb, root) {
cb(obj, root);
if (obj.left) {
traverse(obj.left, cb, obj);
}
if (obj.right) {
traverse(obj.right, cb, obj);
}
}
var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var root = createMinimalBST(array);
var x = 300;
var y = 50;
function drawNode(x, y, data, lx1, ly1, lx2, ly2, leftOrRight) {
color("Transparent");
stroke("Black", 2, 0);
circle(x, y, 20);
stroke("Black", 1, 0);
text(x - 8, y + 10, data, 1, 25);
stroke("Black", 2, 0);
if (lx1 != null && ly1 != null) {
line(lx1, ly1, lx2, ly2);
line(lx2, ly2, lx2, ly2 - 15);
if (leftOrRight == "left")
line(lx2, ly2, lx2 + 15, ly2);
else
line(lx2, ly2, lx2 - 15, ly2);
}
}
var height = root.height();
var lshift = 15;
traverse(root, function (node, root) {
if (node.data) {
console.log(node.data);
if (root == null) {
node.x = x;
node.y = y;
drawNode(x, y, node.data);
node.level = height;
}
else {
if (node == root.left) {
var level = root.level;
node.x = root.x - 30 * level;
node.y = root.y + 30 * level;
node.level = level - 1;
drawNode(node.x, node.y, node.data, root.x - lshift, root.y + lshift, node.x + lshift, node.y - lshift, "left");
}
else if (node == root.right) {
var level = root.level;
node.level = level - 1;
node.x = root.x + 30 * level;
node.y = root.y + 30 * level;
drawNode(node.x, node.y, node.data, root.x + lshift, root.y + lshift, node.x - lshift, node.y - lshift, "right");
}
}
}
});
//Palindrome Permutation
//eg. "kaoak" start with k and end //with k and could be read from //start and from end
str="kaioiak"
text(60,150,fnQ4(str),1,30);
str="kainbiak"
text(60,250,fnQ4(str),1,30);
function fnQ4(str){
var table=buildCharFrequencyTable(str.toLowerCase());
x=checkMaxOneOdd(table);
return x;
}
function buildCharFrequencyTable(s){
var table=[];
var tableLen='z'.charCodeAt(0)-'a'.charCodeAt(0)+1;
for (var i=0;i<tableLen;i++)
table[i]=0;
var len=s.length;
for (var i=0;i<len;i++){
var c=s.charAt(i);
var x=getCharNo(c);
if(x!=-1)
{
table[x]++;
}
}
return table;
}
function checkMaxOneOdd(table){
var foundOdd=false;
var len=table.length;
for (i=0;i<len;i++)
{
var count=table[i];
if(count%2 == 1)
{
if(foundOdd)
return false;
foundOdd=true;
}
}
return true;
}
function getCharNo(c){
var a='a'.charCodeAt(0);
var z='z'.charCodeAt(0);
var val= c.charCodeAt(0);
if(val<=z && val>=a)
return val-a;
return -1;
}
//replace spaces with %20
str="Hello My Friend"
text(10,100,fn(str),1,30);
function fn(str){
var tmp="";
var len=str.length;
for (i=0;i<len;i++){
var c=str.charAt(i);
if(c==" ")
tmp+="%20";
else
tmp+=c;
}
return tmp;
}
//permutation Sol 1
text(10,200,permutation("god","dog"),1,30);
text(100,200,permutation("doog","ordo"),1,30);
function permutation(str1,str2){
if(str1.length!=str2.length)return false;
if(str1.split("").sort().join("")==str2.split("").sort().join(""))
return true;
else return false;
}
//permutation Sol 2
text(10,200,permutation("god","dog"),1,30);
text(100,200,permutation("dgor","ordo"),1,30);
function permutation(str1,str2){
if(str1.length!=str2.length)return false;
var letter=[];
for(i=0;i<128;i++)letter[i]=0;
var len=str1.length;
for(i=0;i<len;i++)
{
var c=str1.charCodeAt(i);
letter[c]++;
}
var len=str2.length;
for(i=0;i<len;i++)
{
var c=str2.charCodeAt(i);
--letter[c];
if(letter[c]<0)
return false;
}
return true;
}
//if a string has repeated characters then return false otherwise return true
x=0;
text(10,100,fn("abcdef"),1,30);
x=20;
text(10,200,fn("abcdefghh"),1,30);
function fn(str){
var checker=0;
var charCodeFora='a'.charCodeAt(0);
text(200,50+15,charCodeFora,1,18);
var len=str.length;
for (i=0;i<len;i++)
{
var val=str.charCodeAt(i)-charCodeFora;
text(100+x,50+15*i,val,1,18);
if((checker &(1<<val))>0)
return false;
checker=(1<<val);
}
return true;
}
//if a string has repeated characters then return false otherwise return true
text(10,100,fn("ABCDEF"),1,30);
text(10,200,fn("ABCDEFE"),1,30);
function fn(str){
var checker=0;
var charCodeFora='a'.charCodeAt(0);
var len=str.length;
for (i=0;i<len;i++)
{
var val=str.charCodeAt(i)-charCodeFora;
if((checker &(1<<val))>0)
return false;
checker|=(1<<val);
}
return true;
}
//if a string has repeated characters then return false otherwise return true
text(10,100,fn("ABCDFF"),1,30);
text(10,200,fn("ABCDEF"),1,30);
function fn(str){
var ch_set=[];
var len=str.length;
for (i=0;i<len;i++)
{
var val=str.charCodeAt(i);
if(ch_set[val]==true)
return false;
ch_set[val]=true;
}
return true;
}
//Check Permutation: Given two strings, write a method to decide if one is a permutation of the other.
//Method 1 use sorting
function permutation(s, t) {
if(s.length != t.length)
return false;
//array in JS has builtin sort fn
return s.split("").sort().join("") == t.split("").sort().join("");
}
//Method 2 no sorting
function permutation2(s, t) {
if(s.length != t.length)
return false;
var letters = [];
for (var i = 0; i <= 128; ++i) letters[i] = 0;
var len = s.length;
for (var i = 0; i < len; ++i) {
// count number of each char in s.
var c = s.charCodeAt(i);
letters[c]++;
}
len = t.length;
for (var i = 0; i < len; ++i) {
var c = t.charCodeAt(i);
--letters[c];
if (letters[c] < 0)
return false;
}
return true;
}
color("Black");
text(10,150,'permutation2("abcd","dcba") = '+permutation2("abcd","dcba"),1,30);
text(10,190,'permutation2("Abcd","dcba") = '+permutation2("Abcd","dcba"),1,30);
//Is Unique: Implement an algorithm to determine if a string has all unique characters. What if you cannot use additional data structures?
//Method 1 use additional data structure
function isUniqueChars(str) {
var char_set = [];
var len = str.length;
for(var i=0;i<len;++i){
var val = str.charCodeAt(i);
//charCodeAt return the ascii code for the char
//to get the char itself, we use charAt
if(char_set[val] === true) return false;
char_set[val] = true;
}
return true;
}
//Method 2 without additional data structure
function isUniqueChars2(str) {
var checker = 0;
var len = str.length;
var charCodeFora = 'a'.charCodeAt(0);
for(var i=0;i<len;++i){
var val = str.charCodeAt(i) - charCodeFora;
if((checker & (1 << val)) > 0) return false;
checker |= (1 << val);
}
return true;
}
color("Black");
var s1 = "abcdef";
var s2 = "abcabc";
text(10,100,'isUniqueChars("'+s1+'")= '+isUniqueChars(s1),1,30);
text(10,140,'isUniqueChars("'+s2+'")= '+isUniqueChars(s2),1,30);
text(10,180,'isUniqueChars2("'+s1+'")= '+isUniqueChars(s1),1,30);
text(10,220,'isUniqueChars2("'+s2+'")= '+isUniqueChars(s2),1,30);
//rotate a two dimensional array clockwise
color("Brown");
a=[[1,2,3,4],[5,6,7,8],[9,10,11,12],[9,10,11,12]]
n=4;
//print before rotate
text(100,50,"Before",1,14);
for(i=0;i<n;i++)
for(j=0;j<n;j++)
{
text(100+30*j,100+30*i,a[i][j],1,20);
}
//rotate algorithm
for (i=0; i<n/2; i++)
{
first=i;
last=n-i-1;
for (j=first; j<last; j++)
{
offset=j-first;
top1=a[first][j];
a[first][j]=a[last-offset][first];
a[last-offset][first]=a[last][last-offset];
a[last][last-offset]=a[j][last];
a[j][last]=top1;
}
}
//Print after rotate
color("Black");
text(300,50,"After",1,14);
for(i=0;i<n;i++)
for(j=0;j<n;j++)
{
text(300+30*j,100+30*i,a[i][j],1,20);
}
for(i=0;i<10;i++)
{
//enter your code here
star(100,i*25,0.5);
}
for(i=0;i<10;i++)
{
//enter your code here
star(i*10,125,0.2);
}
i=0;
r=0;
// you can chage the shape between 1 and 10
shape=5;
color("Crimson");
function draw(){
r=3*Math.cos(shape*i/6);
circle(70*r*Math.cos(i)+270,70*r*Math.sin(i)+230,1);
i+=0.01;
if(i>12*Math.PI)
clearInterval(timer);
}
timer=setInterval(function(){draw();},0.001)
text(550,130,"Cam is the goat",1,20,0);
//flag
color("Red")
rect(200,200,450,300);
//stars
color("Yellow")
color("Yellow")
color("Yellow")
color("Yellow")
color("Yellow")
star(215,222.5,.9);
umbrella(215,280,2);
bicycle(215,280,2);
color("Red")
text(10,100,"hello people from the futuer",1,30);
arrColor=["PaleTurquoise","MediumAquaMarine","Moccasin","Pink", "LightBlue","Thistle", "LightPink", "MediumAquaMarine", "Lavender", "PaleTurquoise"];
var xCenter = 260;
var yCenter = 230;
var PI = Math.PI;
var tick = PI*2/60.0;
var tickHour = PI*2/12.0
var handsColor = "Crimson";
stroke("white",7);
color("LightYellow");
stroke("Peru",10);
circle(xCenter,yCenter,200);
color("Crimson");
stroke("Transparent",1);
circle(xCenter,yCenter,15);
n=1;
radius=157;
start=-PI/2+tickHour;
end=PI+PI/2;
color("Peru");
for(i=start;i<end;i+=tickHour)
{
x=xCenter+Math.cos(i)*radius;
y=yCenter+Math.sin(i)*radius;
text(x-15,y+10,n,0,40,0);
n++;
}
drawClockHands()
function drawClockHands(){
var now = new Date();
var h = now.getHours()-12;
var m = now.getMinutes();
var s = now.getSeconds();
var rHour = radius-70;
var rMin = radius-57;
var rSec = radius-27;
//clear the hands
color("LightYellow");
stroke("LightYellow",1);
circle(xCenter,yCenter,rSec);
color("CornflowerBlue");
text(xCenter-70,yCenter-30,"i was made to do this-allayah",1,30,0);
//hour
var deg = 0.5*(60*h+m);
angle = PI-deg*PI/180.0;// PI-tickHour*h;
var xh=xCenter+Math.sin(angle)*rHour;
var yh=yCenter+Math.cos(angle)*rHour;
stroke(handsColor,10);
line(xCenter,yCenter,xh,yh);
color(handsColor);
stroke(handsColor,1);
circle(xh,yh,4);
//minute
angle = PI-tick*m;
var xm=xCenter+Math.sin(angle)*rMin;
var ym=yCenter+Math.cos(angle)*rMin;
stroke(handsColor,10);
line(xCenter,yCenter,xm,ym);
color(handsColor);
stroke(handsColor,1);
circle(xm,ym,4);
//second
var angle = PI-tick*s;
var x=xCenter+Math.sin(angle)*rSec;
var y=yCenter+Math.cos(angle)*rSec;
stroke(handsColor,2);
line(xCenter,yCenter,x,y);
//draw the small center circle
color(handsColor);
stroke(handsColor,1);
circle(xCenter,yCenter,10);
}
setInterval(function(){
drawClockHands();
},1000);
stroke("MediumTurquoise", 1, 0); //this is the color of the background but not the actual stars
dy = 0; //initializing the variable
function move()
{
for (i = 1; i <= 11; i++)
{
if (i % 3)
{
color("purple");
} else {
color("blue");
}
star(60 + i * 40, i * 20 + dy, 0.7);
}
if (dy < 500)
{
dy++;
} else {
dy = 0;
}
}
timer=setInterval(function(){move();},10); //animates the stars moving down the page
timer=setInterval(function(){move();},10);
stroke("SteelBlue",2,0)
move(50,"red");
move(100,"green");
var dy=0;
function move(){
for(i=1; i<=10; i++){
if (i<=3)
color("purple");
else
color("pink")
star(50+i*30,dy,.7);
}
if (dy<500)
dy++;
else
dy=0;
}
timer=setInterval(function(){move();},10);
text(600,275,"Zain S.",1,30);
stroke("SteelBlue",2,0)
move(50,"red");
move(100,"green");
var dy=0;
function move(){
for(i=1; i<=10; i++){
if (i<=3)
color("purple");
else
color("pink")
star(50+i*30,dy,.7);
}
if (dy<500)
dy++;
else
dy=0;
}
timer=setInterval(function(){move();},10);
stroke ("MediumTurquoise", 2, 0);
dy=0;
function move()
{
for(i=1; i<=10; i++)
{
if (i<=3)
color ("purple");
else
color ("white");
star (50+i*30,dy,0.7);
}
if (dy<500)
dy++;
else
dy=0;
}
timer=setInterval(function(){move();},10);
size=30;
function Movingeyes()
{
//face
stroke("Black",2,0);
color ("Yellow");
circle(250,250,200);
//mouth
color ("Black");
crescent(100,200,5,1);
//speech bubble and text
color("lightBlue");
bubble(300,325,200, 60, 20,"up");
color("Black");
}
Movingeyes();
timer=setInterval(function(){Movingeyes();},seconds);
size=30;
function emma()
{
//face
stroke ("LightPink",2,0);
color ("PaleTurquoise");
circle(250,250,200);
//mouth
color ("LightPink");
crescent (100,200,5,1);
//eyes
color ("Navy");
if (size == 30)
size=50;
else
size=30;
heart (120,175,size);
heart (320,175,size);
}
emma();
timer=setInterval(function(){emma();},300);
arrColor=["DarkOrchid","Yellow","Black","SkyBlue"];
var ColorSwitch = 0;
var Scale = 0.5;
var X = 50;
for(i=1;i<=10;i++)
{
color (arrColor[i-1]);
star(X, 25, Scale);
X = X +20;
Scale = Scale + 0.1;
}
var d=100000000000000000000000;
var clr=1000000000;
var colors=["Red","blue","Green"];
function circles(a,b){x=a*Math.cos(d);
y=Math.abs(a)*Math.sin(d-b);
color(colors[clr++ % colors.length]);
circle(x+360,y+280,25);
d+=0.0001;
}
function f1(){
color("White");
rect(0,0,6000,6000);
stroke("Black",1);
color("Black");
for(i=0;i<=Math.PI*2;i+=Math.PI/11){
circles(175,i);
}
for(i=0;i<=Math.PI*2;i+=Math.PI/7.5){
circles(-125,i);
}
for(i=0;i<=Math.PI*2;i+=Math.PI/4.5){
circles(75,i);
}
for(i=0;i<=Math.PI*2;i+=Math.PI/14){
circles(-225,i);
}
//circle(360,280,50);
}
f1();
timer=setInterval(function(){
f1();
},0);
color("Yellow");
stroke("Black",3);
//face
circle(250,220,200);
color("Black");
//eyes
circle(180,150,20);
circle(320,150,20);
//mouth
rect(160,260,200,20);
rect(180,280,200,20);
rect(200,300,1200,20);
rect(320,280,200,20);
rect(340,260,200,20);
//speech bubble and text
color("lightBlue");
bubble(300,325,200, 60, 20,"up");
color("Black");
text(310,365,"Hi boi do you like my tongue!",1,30,0);
var t1 = 0;
var t2 = 90;
arrColor=['Blue','red','white'];
c=0;//color counter
//try to change inc1 and inc2
inc1=90001;
inc2=.250;
//change n will change the number of lines
n = -10000;
timer = 8989458;
function draw()
{
r = t1*Math.PI/180.0;
r2 = t2*Math.PI/180.0
x=250+Math.cos(r)*170;
y=200+Math.sin(r)*170;
x1=250+Math.cos(r2)*170;
y1=200+Math.sin(r2)*170;
stroke(arrColor[c],1);
c = c + 1;
c = c % 12;//return c to 0 if > 12
line(x,y,x1,y1);
t1+=inc1;
t2+=inc2;
n++;
if(n>120)
clearInterval(timer);
}
timer = setInterval(function(){draw()}, 10);
var t1 = 0;
var t2 = 99500.01;
arrColor=['greenyellow','green','yellow','red']
c=0;//color counter
//try to change inc1 and inc2
inc1=200;
inc2=-1000+10001-20;
//change n will change the number of lines
n = -1000000;
timer = 40;
function draw()
{
r = t1*Math.PI/180.0;
r2 = t2*Math.PI/180.0
x=250+Math.cos(r)*170;
y=200+Math.sin(r)*170;
x1=250+Math.cos(r2)*170;
y1=200+Math.sin(r2)*170;
stroke(arrColor[c],1);
c = c + 1;
c = c % 12;//return c to 0 if > 12
line(x,y,x1,y1);
t1+=inc1;
t2+=inc2;
n++;
if(n>120)
clearInterval(timer);
}
timer = setInterval(function(){draw()}, 10);
text(345,479,"Made by: Taleon",240,30);
//1st Dot
var x = 310;
var inc = 3;
drawCircle();
var id = setInterval(function(){
color("white");
rect(-x,280,250,150);
x = x - inc;
drawCircle();
},0)
function drawCircle(){
color("Black");
circle(256-x,388,40);
}
//2nd Dot
var y = 310;
var inc = 3;
drawCircle2();
var id = setInterval(function(){
color("white");
rect(-y,280,250,150);
y = y - inc;
drawCircle2();
},0)
function drawCircle2(){
color("Black");
circle(256-y,388,40);
if (y<80)
y=80
}
//Dot 3
color("Blue");
b=['BlueViolet', 'Brown', 'DarkMagenta'];
var z = 310;
var inc = 3;
drawCircle3();
var id = setInterval(function(){
color("Red");
rect(-z,280,250,150);
z = z - inc;
drawCircle3();
},3)
function drawCircle3(){
color("Black");
circle(256-z,388,40);
if (z>0)
z=0;
}
x=['Crimson', 'DarkOrange', 'Gold', 'Green', 'RoyalBlue', 'RebeccaPurple','LightCyan'];
//SKY
color("LightCyan");
rect(0,0,800,500);
//RAINBOW
for(i=0;i<=7;i++){
color(x[i]);
circle(400,300,250-25*i);
}
//GRASS AND CLOUD
color("LimeGreen");
rect(0,300,800,300);
color("White");
cloud(120,70,2);
//LEGS AND BODY
stroke("Black",8);
line(278,428,271,478);
line(368,428,361,478);
cloud(250,350,1.5);
stroke("Black",8);
line(298,428,291,482);
line(388,428,381,482);
//HEAD
color("Gainsboro");
cloud(376,345,0.6);
cloud(388,370,0.4);
cloud(396,389,0.2);
//EYES AND NOSE
color("Black");
circle(395,366,2);
circle(417,366,2);
circle(402,386,0.5);
circle(410,386,0.5);
//WORDS
color("Black");
text(480,520,"~Tony",1,18,0);
var x = -180;
var inc = .5;
drawcar();
var id = setInterval(function(){
stroke("white",1);
color("White");
rect(355-x,417,300,200);
x = x + inc;
drawcar();
},5);
function drawcar(){
color("Black");
circle(590-x,560,30);
circle(415-x,560,30);
rect(360-x,483,280,50);
color("Red");
rect(400-x,433,200,50);
color("White");
circle(415-x,560,25);
circle(590-x,560,25);
if(x>528)
x=+392;
//inc = -inc
//if (x<-80
//clearinterval id
}
text(210,325,"Raneen",1,60,1);
var x = -180;
var inc = .5;
drawcar();
var id = setInterval(function(){
stroke("white",1);
color("White");
rect(355-x,417,300,200);
x = x + inc;
drawcar();
},5);
function drawcar(){
color("Black");
circle(590-x,560,30);
circle(415-x,560,30);
rect(360-x,483,280,50);
color("Red");
rect(400-x,433,200,50);
color("White");
circle(415-x,560,25);
circle(590-x,560,25);
if(x>528)
x=+392;
//inc = -inc
//if (x<-80
//clearinterval id
}
var y=0.5;
var r=0.01;
function logisticMap(x){
return 1-r*Math.pow(Math.abs(x),2);
}
for(i=0;i<400;i+=0.01)
{
for(j=0;j<400;j++)
{
y=logisticMap(y);
}
for(k=0;k<700;k++)
{
y=logisticMap(y);
circle(300*i,300-(250*y),0.1);
}
r=r+0.01;
y=0.5;
}
color("Yellow");
stroke("Black",3);
circle(300,300,200);
//eyes
color("Black");
circle(220,250,25);
circle(370,250,25);
crescent(220,330,3,1);
color("MediumVioletRed");
flower(180,145,2);
color("LightPink");
circle(190,330,15);
circle(390,330,15);
var x="aeaef";
text (250,600,x,3,50);
//face
color("Yellow")
stroke("Black",3)
circle(350,300,200)
//mouth
color ("Blue")
crescent (205,300,5,1)
//nose
color ("blue")
circle (342,325,10)
//ears
color("Blue")
circle (125,310,25)
circle (575,310,25)
//eyes
color("Blue")
circle (275,250,25);
circle (415,250,25);
//tongue
color ("Blue")
stroke("White",1)
circle (375,425,15)
color("Turquoise");
for(i=0;i<10;i++)
{
var str1 = "H";
var n = 0;
for(i=0;i<15;i++)
{
text(30,60+n,str1,1,75,2);
n+=50;
}
color("LightGreen");
circle(100,550,40);
circle(90,500,25);
stroke("Black",1);
line(90,490,70,489);
line(75,490,75,500);
line(77,536,50,500);
line(69,511,82,505);
line(50,586,73,566);
}
color("DarkTurquoise");
x=5;
y=6;
z=1;
if(z>10){
z = x+y;
text(300,225,z,1,150,2);
}
color("FireBrick");
text(500,550,"Ella",1,30,0);
color("Turquoise");
for(i=0;i<10;i++)
{
var str1 = "H";
var n = 0;
for(i=0;i<15;i++)
{
text(30,60+n,str1,1,75,2);
n+=50;
}
color("LightGreen");
circle(100,550,40);
circle(90,500,25);
stroke("Black",1);
line(90,490,70,489);
line(75,490,75,500);
line(77,536,50,500);
line(69,511,82,505);
line(50,586,73,566);
}
color("DarkTurquoise");
x=5;
y=6;
z=1;
if(z>10){
z = x+y;
text(300,225,z,1,150,2);
}
var t1 = 0;
var t2 = 90;
arrColor = ["Blue", "Brown", "Coral", "DarkGreen", "Red", "Sienna", "Black", "MediumTurquoise", "MidnightBlue", "LightSlateGray", "LightCoral", "DeepPink"];
c = 0;//color counter
//try to change inc1 and inc2
inc1 = 10;
inc2 = 1;
//change n will change the number of lines
n = 1;
timer = 0;
function draw() {
r = t1 * Math.PI / 180.0;
r2 = t2 * Math.PI / 180.0
x = 250 + Math.cos(r) * 170;
y = 200 + Math.sin(r) * 170;
x1 = 250 + Math.cos(r2) * 170;
y1 = 200 + Math.sin(r2) * 170;
stroke(arrColor[c], 1);
c = c + 1;
c = c % 12;//return c to 0 if > 12
line(x, y, x1, y1);
t1 += inc1;
t2 += inc2;
n++;
if (n > 520)
clearInterval(timer);
}
timer = setInterval(function () {
draw()
}, 10);
var t1 = 0;
var t2 = 90;
arrColor=['Blue', 'Brown', 'Coral', 'DarkGreen', 'Red', 'Sienna', 'Black', 'MediumTurquoise', 'MidnightBlue', 'LightSlateGray', 'LightCoral', 'DeepPink'];
c=0;//color counter
//try to change inc1 and inc2
inc1=10;
inc2=10;
//change n will change the number of lines
n = 120;
for(i=0;i<n;i++)
{
r = t1*Math.PI/180.0;
r2 = t2*Math.PI/180.0
x=250+Math.cos(r)*170;
y=200+Math.sin(r)*170;
x1=250+Math.cos(r2)*170;
y1=200+Math.sin(r2)*170;
stroke(arrColor[c],1);
c = c + 1;
c = c % 12;//return c to 0 if > 12
line(x,y,x1,y1);
t1+=inc1*Math.random()*10;
t2+=inc2*Math.random()*10;
}
for(i=0;i<20;i=i+1)
{
//enter your code here
//flower3(i*20+60,-i*i+390,.5);
circle(i*20+60,-i*i+390,10);
//circle(i*20+60,-i*10+210,10);
//text(i*20+50,-i*i+370,i,1,10,0);
}
n1=0;
n2=2;
for ( i = 6; i < 10; i++)
{
n1= n1 + 1;
if (n1 > 7)
n2 = n1 * n2;
if (n2 == 2)
n3=10;
else
n3=5;
text(i*30,60,n1,1,20,0);
text(i*30,100,n2,1,20,0);
text(i*30,140,n3,1,20,0);
}
x=200; y=90;
//z rang: 0.5 to 1.3
z=1;
stroke("MediumVioletRed",2);
//you can change the bow color
bowClr="HotPink";
ln=1; // ln is the line number
//Line 1
x1=(x-ln*10)+z*10;
y1=(y+2*(ln*10))+z*10;
size=z*10;
color(bowClr);
for(i=1;i<=6;i++)
{
if(i<=2 || i>4)
circle(x1+i*20,y1,size);
}
//Line 2
ln++;
x2=(x-ln*10)+z*10;
y2=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=7;i++)
{
switch (i){
case 1:
case 3:
case 5:
case 7:
circle(x2+i*20,y2,size);
break;
}
}
//Line 3
ln++;
x3=(x-ln*10)+z*10;
y3=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=8;i++)
{
switch (i){
case 1:
case 4:
case 5:
case 8:
circle(x3+i*20,y3,size);
break;
}
}
//Line 4
ln++;
x4=(x-(ln*10)+20)+z*10;
y4=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=7;i++)
{
circle(x4+i*20,y4,size);
}
//Line 5
ln++;
x5=(x-(ln*10)+60)+z*10;
y5=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=4;i++)
{
circle(x5+i*20,y5,size);
}
//Line 6
ln++;
x6=(x-(ln*10)+40)+z*10;
y6=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<=7;i++)
{
if(i<=3 || i>4)
circle(x6+i*20,y6,size);
}
//Line 7
ln++;
x7=(x-(ln*10)+60)+z*10;
y7=(y+2*(ln*10))+z*10;
size=z*10;
for (i=1;i<7;i++)
{
if(i<=2 || i>4)
circle(x7+i*20,y7,size);
}
var t1 = 0;
var t2 = 90;
arrColor=['Blue', 'Brown', 'Coral', 'DarkGreen', 'Red', 'Sienna', 'Black', 'MediumTurquoise', 'MidnightBlue', 'LightSlateGray', 'LightCoral', 'DeepPink'];
c=0;//color counter
//try to change inc1 and inc2
inc1=10;
inc2=1;
//change n will change the number of lines
n = 1;
timer = 0;
x=0;
r=0;
prevX=0;prevY=200;
prevX1=0;prevY1=200;
function draw()
{
y=200+Math.sin(r)*170;
y1=200+Math.sin(-r)*170;
//circle(x,y,1);
stroke("Black",4);
line(prevX,prevY,x,y);
line(prevX1,prevY1,x,y1);
prevX=x;prevY=y;
prevX1=x;prevY1=y1;
r+=0.1;
x+=1;
if(x>360)
clearInterval(timer);
}
timer = setInterval(function(){draw()}, 10);
var t1 = 0;
var t2 = 90;
arrColor=['Blue', 'Brown', 'Coral', 'DarkGreen', 'Red', 'Sienna', 'Black', 'MediumTurquoise', 'MidnightBlue', 'LightSlateGray', 'LightCoral', 'DeepPink'];
c=0;//color counter
//try to change inc1 and inc2
inc1=5;
inc2=5;
//change n will change the number of lines
n = 1;
timer = 0;
function draw()
{
r = t1*Math.PI/180.0;
r2 = t2*Math.PI/180.0
x=250+Math.cos(r)*170;
y=200+Math.sin(r)*170;
x1=250+Math.cos(r2)*170;
y1=200+Math.sin(r2)*170;
stroke(arrColor[c],1);
c = c + 1;
c = c % 12;//return c to 0 if > 12
line(x,y,x1,y1);
t1+=inc1;
t2+=inc2;
n++;
if(n>120)
clearInterval(timer);
}
timer = setInterval(function(){draw()}, 10);
var t1 = 0;
var t2 = 90;
arrColor=['Blue', 'Brown', 'Coral', 'DarkGreen', 'Red', 'Sienna', 'Black', 'MediumTurquoise', 'MidnightBlue', 'LightSlateGray', 'LightCoral', 'DeepPink'];
c=0;//color counter
//try to change inc1 and inc2
inc1=10;
inc2=10;
//change n will change the number of lines
n = 120;
for(i=0;i<n;i++)
{
r = t1*Math.PI/180.0;
r2 = t2*Math.PI/180.0
x=250+Math.cos(r)*170;
y=200+Math.sin(r)*170;
x1=250+Math.cos(r2)*170;
y1=200+Math.sin(r2)*170;
stroke(arrColor[c],1);
c = c + 1;
c = c % 12;//return c to 0 if > 12
line(x,y,x1,y1);
t1+=inc1;
t2 +=inc2;
}
for(i=0;i<20;i=i+1)
{
//enter your code here
flower3(i*20+100,-i*i+350,.5);
text(100+i*10,250,i,1,10,0);
}
arrColor=["PaleTurquoise","MediumAquaMarine","Moccasin","Pink", "LightBlue","Thistle", "LightPink", "MediumAquaMarine", "Lavender", "PaleTurquoise"];
var xCenter = 260;
var yCenter = 230;
var PI = Math.PI;
var tick = PI*2/60.0;
var tickHour = PI*2/12.0
var handsColor = "Crimson";
stroke("white",7);
color("LightYellow");
stroke("Peru",10);
circle(xCenter,yCenter,200);
color("Crimson");
stroke("Transparent",1);
circle(xCenter,yCenter,15);
n=1;
radius=157;
start=-PI/2+tickHour;
end=PI+PI/2;
color("Peru");
for(i=start;i<end;i+=tickHour)
{
x=xCenter+Math.cos(i)*radius;
y=yCenter+Math.sin(i)*radius;
text(x-15,y+10,n,0,40,0);
n++;
}
drawClockHands()
function drawClockHands(){
var now = new Date();
var h = now.getHours()-12;
var m = now.getMinutes();
var s = now.getSeconds();
var rHour = radius-70;
var rMin = radius-57;
var rSec = radius-27;
//clear the hands
color("LightYellow");
stroke("LightYellow",1);
circle(xCenter,yCenter,rSec);
color("CornflowerBlue");
text(xCenter-70,yCenter-30,"Code Genie",1,30,0);
//hour
var deg = 0.5*(60*h+m);
angle = PI-deg*PI/180.0;// PI-tickHour*h;
var xh=xCenter+Math.sin(angle)*rHour;
var yh=yCenter+Math.cos(angle)*rHour;
stroke(handsColor,10);
line(xCenter,yCenter,xh,yh);
color(handsColor);
stroke(handsColor,1);
circle(xh,yh,4);
//minute
angle = PI-tick*m;
var xm=xCenter+Math.sin(angle)*rMin;
var ym=yCenter+Math.cos(angle)*rMin;
stroke(handsColor,10);
line(xCenter,yCenter,xm,ym);
color(handsColor);
stroke(handsColor,1);
circle(xm,ym,4);
//second
var angle = PI-tick*s;
var x=xCenter+Math.sin(angle)*rSec;
var y=yCenter+Math.cos(angle)*rSec;
stroke(handsColor,2);
line(xCenter,yCenter,x,y);
//draw the small center circle
color(handsColor);
stroke(handsColor,1);
circle(xCenter,yCenter,10);
}
setInterval(function(){
drawClockHands();
},1000);
arrColor=["PaleTurquoise","MediumAquaMarine","Moccasin","Pink", "LightBlue","Thistle", "LightPink", "MediumAquaMarine", "Lavender", "PaleTurquoise"];
var xCenter = 260;
var yCenter = 230;
var PI = Math.PI;
var tick = PI*2/60.0;
var tickHour = PI*2/12.0
var handsColor = "Crimson";
stroke("white",7);
color("LightYellow");
stroke("Peru",10);
circle(xCenter,yCenter,200);
color("Crimson");
stroke("Transparent",1);
circle(xCenter,yCenter,15);
n=1;
radius=157;
start=-PI/2+tickHour;
end=PI+PI/2;
color("Peru");
for(i=start;i<end;i+=tickHour)
{
x=xCenter+Math.cos(i)*radius;
y=yCenter+Math.sin(i)*radius;
text(x-15,y+10,n,0,40,0);
n++;
}
drawClockHands()
function drawClockHands(){
var now = new Date();
var h = now.getHours()-12;
var m = now.getMinutes();
var s = now.getSeconds();
var rHour = radius-70;
var rMin = radius-57;
var rSec = radius-27;
//clear the hands
color("LightYellow");
stroke("LightYellow",1);
circle(xCenter,yCenter,rSec);
//hour
var deg = 0.5*(60*h+m);
angle = PI-deg*PI/180.0;// PI-tickHour*h;
var xh=xCenter+Math.sin(angle)*rHour;
var yh=yCenter+Math.cos(angle)*rHour;
stroke(handsColor,10);
line(xCenter,yCenter,xh,yh);
color(handsColor);
stroke(handsColor,1);
circle(xh,yh,4);
//minute
angle = PI-tick*m;
var xm=xCenter+Math.sin(angle)*rMin;
var ym=yCenter+Math.cos(angle)*rMin;
stroke(handsColor,10);
line(xCenter,yCenter,xm,ym);
color(handsColor);
stroke(handsColor,1);
circle(xm,ym,4);
//second
var angle = PI-tick*s;
var x=xCenter+Math.sin(angle)*rSec;
var y=yCenter+Math.cos(angle)*rSec;
stroke(handsColor,2);
line(xCenter,yCenter,x,y);
//draw the small center circle
color(handsColor);
stroke(handsColor,1);
circle(xCenter,yCenter,10);
}
setInterval(function(){
drawClockHands();
},1000);
var PI = Math.PI;
var tick = Math.PI*2/60.0;
var tickHour = Math.PI*2/12.0
drawClockHands()
function drawClockHands(){
var now = new Date();
var h = now.getHours()-12;
var m = now.getMinutes();
var s = now.getSeconds();
//clear the hands
color("White");
stroke("White",1);
circle(250,200,180);
//hour
var deg = 0.5*(60*h+m);
angle = PI-deg*PI/180.0;// PI-tickHour*h;
text(110,40,angle,1,20,0);
var xh=250+Math.sin(angle)*100;
var yh=200+Math.cos(angle)*100;
stroke("red",10);
line(250,200,xh,yh);
color("Red");
stroke("Red",1);
circle(xh,yh,4);
//minute
angle = PI-tick*m;
var xm=250+Math.sin(angle)*140;
var ym=200+Math.cos(angle)*140;
stroke("blue",10);
line(250,200,xm,ym);
color("blue");
stroke("blue",1);
circle(xm,ym,4);
//second
var angle = PI-tick*s;
var x=250+Math.sin(angle)*150;
var y=200+Math.cos(angle)*150;
stroke("Brown",2);
line(250,200,x,y);
//draw the small center circle
color("Black");
stroke("Black",1);
circle(250,200,10);
}
setInterval(function(){
drawClockHands();
},1000);
var PI = Math.PI;
var tick = Math.PI*2/60.0;
var tickHour = Math.PI*2/12.0
drawClockHands()
function drawClockHands(){
var now = new Date();
var h = now.getHours()-12;
var m = now.getMinutes();
var s = now.getSeconds();
//clear the hands
color("White");
stroke("White",1);
circle(250,200,180);
//second
var angle = PI-tick*s;
var x=250+Math.sin(angle)*150;
var y=200+Math.cos(angle)*150;
stroke("Brown",2);
line(250,200,x,y);
//minute
angle = PI-tick*m;
var xm=250+Math.sin(angle)*140;
var ym=200+Math.cos(angle)*140;
stroke("blue",10);
line(250,200,xm,ym);
color("blue");
stroke("blue",1);
circle(xm,ym,4);
//hour
angle = PI-tickHour*h;
var xh=250+Math.sin(angle)*100;
var yh=200+Math.cos(angle)*100;
stroke("red",10);
line(250,200,xh,yh);
color("Red");
stroke("Red",1);
circle(xh,yh,4);
//draw the small center circle
color("Black");
stroke("Black",1);
circle(250,200,10);
}
setInterval(function(){
drawClockHands();
},1000);
for(i=0;i<5;i++)
{
for (j=0;j<=i;j++)
{
color("LimeGreen");
text(j*60+150,i*55+100,i+","+j,1,20,0);
if (i!=j){
color("Orange");
text(i*60+150,j*55+100,i+","+j,1,20,0);
}
}
}
color("#333");
for(i=0;i<=41;i++)
{
if (i<4 || i>37)rect(60+i*10,0,10,10);
}
for(i=0;i<=41;i++)
{
if (i<7 || i>34)rect(60+i*10,10,10,10);
}
for(i=0;i<=41;i++)
{
if (i<9 || i>32)rect(60+i*10,20,10,10);
}
for(i=0;i<=41;i++)
{
if (i>5 ||i<9)color("yellow");
if (i>32 ||i<36)color("yellow");
switch(i){
case 6:
case 7:
case 8:
case 33:
case 34:
case 35:color("yellow");break;
default: color("#333");
}
if (i<10 || i>31)
rect(60+i*10,30,10,10);
}
for(i=0;i<=41;i++)
{
switch(i){
case 6:
case 7:
case 8:
case 9:
case 32:
case 33:
case 34:
case 35:color("yellow");break;
default: color("#333"); }
if (i<11 || i>30)
rect(60+i*10,40,10,10);
}
for(i=0;i<=41;i++)
{
switch(i){
case 6:
case 7:
case 8:
case 9:
case 32:
case 33:
case 34:
case 35:color("yellow");break;
default: color("#333"); }
if (i<11 || i>30)
rect(60+i*10,40,10,10);
}
for(i=0;i<=41;i++)
{
switch(i){
case 5:
case 6:
case 7:
case 8:
case 9:
case 10:
case 31:
case 32:
case 33:
case 34:
case 35:
case 36:color("yellow");break;
default: color("#333"); }
if (i<12 || i>29)
rect(60+i*10,50,10,10);
}
for(i=0;i<=41;i++)
{
switch(i){
case 5:
case 6:
case 7:
case 8:
case 9:
case 10:
case 11:
case 30:
case 31:
case 32:
case 33:
case 34:
case 35:
case 36:color("yellow");break;
default: color("#333"); }
if (i<13 || i>28)
rect(60+i*10,60,10,10);
}
for(i=0;i<=41;i++)
{
switch(i){
case 5:
case 6:
case 7:
case 8:
case 9:
case 10:
case 11:
case 12:
case 29:
case 30:
case 31:
case 32:
case 33:
case 34:
case 35:
case 36:color("yellow");break;
default: color("#333"); }
if (i<14 || i>27 )
{
if( i!=0 && i!=41)
rect(60+i*10,70,10,10);
}
if (i>15 && i<26 )
rect(60+i*10,70,10,10);
}
for(i=0;i<=41;i++)
{
switch(i){
case 5:
case 6:
case 7:
case 8:
case 9:
case 10:
case 11:
case 12:
case 29:
case 30:
case 31:
case 32:
case 33:
case 34:
case 35:
case 36:color("yellow");break;
default: color("#333"); }
if (i<16 || i>25)
{
if( i!=0 && i!=41)
rect(60+i*10,80,10,10);
}
color("yellow");
if (i>15 && i<26)
rect(60+i*10,80,10,10);
}
for(i=0;i<=41;i++)
{
switch(i){
case 5:
case 6:
case 7:
case 8:
case 9:
case 10:
case 31:
case 32:
case 33:
case 34:
case 35:
case 36:color("yellow");break;
default: color("#333"); }
if (i<14 || i>27)
{
if( i>1 && i<40)
rect(60+i*10,90,10,10);
}
color("yellow");
if (i>12 && i<29)
rect(60+i*10,90,10,10);
}
for(i=0;i<=41;i++)
{
color("#333");
if (i<5 || i>36)
{
if( i>1 && i<40)
rect(60+i*10,100,10,10);
}
color("yellow");
if (i>4 && i<37)
rect(60+i*10,100,10,10);
}
for(i=0;i<=41;i++)
{
color("#333");
if (i<5 || i>36)
{
if( i>2 && i<39)
rect(60+i*10,110,10,10);
}
color("yellow");
if (i>4 && i<37)
rect(60+i*10,110,10,10);
}
for(i=0;i<=41;i++)
{
color("#333");
if (i==4 || i==37 || i==8 ||i==33)
{
rect(60+i*10,120,10,10);
}
color("yellow");
if (i>4 && i<37)
{
if(i!=8 && i!= 33)
rect(60+i*10,120,10,10);
}
}
for(i=0;i<=41;i++)
{
color("#333");
if (i>4 && i<37 )
{
rect(60+i*10,130,10,10);
}
color("yellow");
if (i>7 && i<34)
{
rect(60+i*10,130,10,10);
}
}
color("AntiqueWhite");
rect(0,0,555,500);
x=160; y=90;
stroke("Tan",1.5);
//you can change horse color
horseClr="White";
horseHair="HotPink"
ln=0; // ln is the line number
//Line 1
color(horseHair);
for(i=1;i<=3;i++)
{
circle(x+i*20,y,10);
}
//Line 2
ln++;
x2=x-ln*10;
y2=y+2*(ln*10);
for (i=1;i<=5;i++)
{
if(i==1)
color(horseClr);
else
color(horseHair);
circle(x2+i*20,y2,10);
}
//Line 3
ln++;
x3=x-ln*10;
y3=y+2*(ln*10);
for (i=1;i<7;i++)
{
switch (i){
case 1:color(horseHair);
break;
case 2:
case 3:color(horseClr);
break;
case 4:color("Gold");
break;
case 5:
case 6:color(horseHair);
break;
}
circle(x3+i*20,y3,10);
}
//Line 4
ln++;
x4=x-(ln*10)+20;
y4=y+2*(ln*10);
for (i=1;i<7;i++)
{
switch (i){
case 1:color(horseClr);
break;
case 2:color("Black");
break;
case 3:color("Gold");
break;
case 4:color(horseClr);
break;
case 5:
case 6:color(horseHair);
}
circle(x4+i*20,y4,10);
//eye
if(i==2)
{
color("White");
circle(x4+i*22,y4-2,3);
}
}
//Line 5
ln++;
x5=x-(ln*10)+20;
y5=y+2*(ln*10);
for (i=1;i<8;i++)
{
switch (i){
case 3:color("Gold");
break;
case 6:
case 7:color(horseHair);
break;
default:color(horseClr);
}
circle(x5+i*20,y5,10);
}
//Line 6
ln++;
x6=x-(ln*10)+20;
y6=y+2*(ln*10);
for (i=1;i<13;i++)
{
switch (i){
case 1:
case 2:
case 3:color("Gold");
break;
case 7:color("MediumPurple");
break;
case 8:
case 9:color("Pink");
break;
case 10:color("MediumPurple");
break;
case 12:color(horseHair);
break;
default:color(horseClr);
}
circle(x6+i*20,y6,10);
}
//Line 7
ln++;
x7=x-(ln*10)+40;
y7=y+2*(ln*10);
for (i=1;i<13;i++)
{
switch (i){
case 3:color("MediumPurple");
break;
case 4:
case 5:
case 6:color("Gold");
break;
case 7:
case 8:
case 9:color("MediumPurple");
break;
case 12:color(horseHair);
break;
default:color(horseClr);
}
circle(x7+i*20,y7,10);
}
//Line 8
ln++;
x8=x+(ln*10)-20;
y8=y+2*(ln*10);
for (i=1;i<9;i++)
{
switch (i){
case 4:color("Gold");
break;
case 7:
case 8:color(horseHair);
break;
default:color(horseClr);
}
circle(x8+i*20,y8,10);
}
//Line 9
ln++;
x9=x-(ln*10)+80;
y9=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 6:color("Gold");
break;
case 9:
case 10:color(horseHair);
break;
default:color(horseClr);
}
circle(x9+i*20,y9,10);
}
//Line 10
ln++;
x10=x-(ln*10)+80;
y10=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 6:color("Gold");
break;
case 10:color(horseHair);
break;
default:color(horseClr);
}
circle(x10+i*20,y10,10);
}
//Line 11
ln++;
x11=x-(ln*10)+100;
y11=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 1:
case 2:color("Orange");
break;
case 10:color(horseHair);
break;
default:color(horseClr);
}
if(!(i>4 && i<7))
circle(x11+i*20,y11,10);
}
//Line 12
ln++;
x12=x11+30;
y12=y+2*(ln*10);
color(horseClr);
for (i=1;i<8;i++)
{
if(!(i>2 && i<6))
circle(x12+i*20,y12,10);
}
//Line 13
ln++;
x13=x12-10;
y13=y+2*(ln*10);
color(horseClr);
for (i=1;i<8;i++)
{
if(!(i>2 && i<6))
circle(x13+i*20,y13,10);
}
//Line 14
ln++;
x14=x13-10;
y14=y+2*(ln*10);
color("Orange");
for (i=1;i<8;i++)
{
if(!(i>2 && i<6))
circle(x14+i*20,y14,10);
}
x=160; y=90;
//you can change horse color
horseClr="Tan";
ln=0; // ln is the line number
//Line 1
color("HotPink");
for(i=1;i<=3;i++)
{
circle(x+i*20,y,10);
}
//Line 2
ln++;
x2=x-ln*10;
y2=y+2*(ln*10);
for (i=1;i<=5;i++)
{
if(i==1)
color(horseClr);
else
color("HotPink");
circle(x2+i*20,y2,10);
}
//Line 3
ln++;
x3=x-ln*10;
y3=y+2*(ln*10);
for (i=1;i<7;i++)
{
switch (i){
case 1:color("HotPink");
break;
case 2:
case 3:color(horseClr);
break;
case 4:color("Gold");
break;
case 5:
case 6:color("HotPink");
break;
}
circle(x3+i*20,y3,10);
}
//Line 4
ln++;
x4=x-(ln*10)+20;
y4=y+2*(ln*10);
for (i=1;i<7;i++)
{
switch (i){
case 1:color(horseClr);
break;
case 2:color("Black");
break;
case 3:color("Gold");
break;
case 4:color(horseClr);
break;
case 5:
case 6:color("HotPink");
}
circle(x4+i*20,y4,10);
//eye
if(i==2)
{
color("White");
circle(x4+i*22,y4-2,3);
}
}
//Line 5
ln++;
x5=x-(ln*10)+20;
y5=y+2*(ln*10);
for (i=1;i<8;i++)
{
switch (i){
case 3:color("Gold");
break;
case 6:
case 7:color("HotPink");
break;
default:color(horseClr);
}
circle(x5+i*20,y5,10);
}
//Line 6
ln++;
x6=x-(ln*10)+20;
y6=y+2*(ln*10);
for (i=1;i<13;i++)
{
switch (i){
case 1:
case 2:
case 3:color("Gold");
break;
case 7:color("MediumPurple");
break;
case 8:
case 9:color("Pink");
break;
case 10:color("MediumPurple");
break;
case 12:color("HotPink");
break;
default:color(horseClr);
}
circle(x6+i*20,y6,10);
}
//Line 7
ln++;
x7=x-(ln*10)+40;
y7=y+2*(ln*10);
for (i=1;i<13;i++)
{
switch (i){
case 3:color("MediumPurple");
break;
case 4:
case 5:
case 6:color("Gold");
break;
case 7:
case 8:
case 9:color("MediumPurple");
break;
case 12:color("HotPink");
break;
default:color(horseClr);
}
circle(x7+i*20,y7,10);
}
//Line 8
ln++;
x8=x+(ln*10)-20;
y8=y+2*(ln*10);
for (i=1;i<9;i++)
{
switch (i){
case 4:color("Gold");
break;
case 7:
case 8:color("HotPink");
break;
default:color(horseClr);
}
circle(x8+i*20,y8,10);
}
//Line 9
ln++;
x9=x-(ln*10)+80;
y9=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 6:color("Gold");
break;
case 9:
case 10:color("HotPink");
break;
default:color(horseClr);
}
circle(x9+i*20,y9,10);
}
//Line 10
ln++;
x10=x-(ln*10)+80;
y10=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 6:color("Gold");
break;
case 10:color("HotPink");
break;
default:color(horseClr);
}
circle(x10+i*20,y10,10);
}
//Line 11
ln++;
x11=x-(ln*10)+100;
y11=y+2*(ln*10);
for (i=1;i<11;i++)
{
switch (i){
case 1:
case 2:color("Orange");
break;
case 10:color("HotPink");
break;
default:color(horseClr);
}
if(!(i>4 && i<7))
circle(x11+i*20,y11,10);
}
//Line 12
ln++;
x11=x10+40;
y11=y+2*(ln*10);
color(horseClr);
for (i=1;i<8;i++)
{
if(!(i>2 && i<6))
circle(x11+i*20,y11,10);
}
arrColor=["pink", "SkyBlue", "Salmon", "LimeGreen", "orange", "LightPink", "red", "GreenYellow"];
color ("AntiqueWhite");
rect(20,15,515,400);
x=275; y=50;k=0;
for(i=0;i<=7;i++)
{
for (j=0;j<6;j++)
{
stroke(3,"white");
color(arrColor[k]);
flower(x-j*45,y+i*45,0.8);
flower(x+j*45,y+i*45,0.8);
//try to change flower with flower 2 or 3
k++;
k=k%7;//change 7 with other number
}
}