how to install nodejs in mint/linux via package manager
--steps--
1 goto this link -> https://nodejs.org/en/download/
2 scroll and select Installing Node.js via package manager link
3 then after click on Debian and Ubuntu based Linux distributions, Enterprise Linux/Fedora and Snap packages link
4 then click on Node.js binary distributions link
5 scroll down check nodejs version and follow command you install successfully
if not follow above step simply select this link Click here to install NODEJS
like i install and commands are
# Using Ubuntu i follow this one and successfully install node
curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
sudo apt-get install -y nodejs
# Using Debian, as root
curl -sL https://deb.nodesource.com/setup_12.x | bash -
apt-get install -y nodejs
Programmers Point
if u required any help in programming/Software/Website send me mail ajay.rathod39@gmail.com or call me 7600728572
Tuesday, 18 August 2020
Thursday, 11 September 2014
Friday, 8 August 2014
How To Create Snake Game in Java
Create a folder like Snake\src\snake\snake.java,RenderPanel.java
1.Create a File Name snake.java
_________________________________________________________________________________
package snake;import java.awt.Dimension;
import java.awt.Point;
import java.awt.Toolkit;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;
import java.util.ArrayList;
import java.util.Random;
import javax.swing.JFrame;
import javax.swing.Timer;
/**
* CREATED BY AJAY RATHOD(ajju)
*/
public class Snake implements ActionListener, KeyListener {
public static Snake snake;
public JFrame jframe;
public RenderPanel renderPanel;
public Timer timer = new Timer(20, this);
public ArrayList<Point> snakeParts = new ArrayList<Point>();
public static final int UP = 0, DOWN = 1, LEFT = 2, RIGHT = 3, SCALE = 10;
public int ticks = 0, direction = DOWN, score, tailLength = 10, time;
public Point head, cherry;
public Random random;
public boolean over = false, paused;
public Dimension dim;
public Snake() {
dim = Toolkit.getDefaultToolkit().getScreenSize();
jframe = new JFrame("Snake Created By Ajay Rathod(ajju) ");
jframe.setVisible(true);
jframe.setSize(805, 700);
jframe.setResizable(false);
jframe.setLocation(dim.width / 4 - jframe.getWidth() / 4, dim.height
/ 4 - jframe.getHeight() / 4);
jframe.add(renderPanel = new RenderPanel());
jframe.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
jframe.addKeyListener(this);
startGame();
}
public void startGame() {
over = false;
paused = false;
time = 0;
score = 0;
tailLength = 1;
ticks = 0;
direction = DOWN;
head = new Point(0, -1);
random = new Random();
snakeParts.clear();
cherry = new Point(random.nextInt(79), random.nextInt(66));
timer.start();
}
@Override
public void actionPerformed(ActionEvent arg0) {
renderPanel.repaint();
ticks++;
if (ticks % 2 == 0 && head != null && !over && !paused) {
time++;
snakeParts.add(new Point(head.x, head.y));
if (direction == UP)
if (head.y - 1 >= 0 && noTailAt(head.x, head.y - 1))
head = new Point(head.x, head.y - 1);
else
over = true;
if (direction == DOWN)
if (head.y + 1 < 67 && noTailAt(head.x, head.y + 1))
head = new Point(head.x, head.y + 1);
else
over = true;
if (direction == LEFT)
if (head.x - 1 >= 0 && noTailAt(head.x - 1, head.y))
head = new Point(head.x - 1, head.y);
else
over = true;
if (direction == RIGHT)
if (head.x + 1 < 80 && noTailAt(head.x + 1, head.y))
head = new Point(head.x + 1, head.y);
else
over = true;
if (snakeParts.size() > tailLength)
snakeParts.remove(0);
if (cherry != null) {
if (head.equals(cherry)) {
score += 10;
tailLength++;
cherry.setLocation(random.nextInt(79), random.nextInt(66));
}
}
}
}
public boolean noTailAt(int x, int y) {
for (Point point : snakeParts) {
if (point.equals(new Point(x, y))) {
return false;
}
}
return true;
}
public static void main(String[] args) {
snake = new Snake();
}
@Override
public void keyPressed(KeyEvent e) {
int i = e.getKeyCode();
if ((i == KeyEvent.VK_A || i == KeyEvent.VK_LEFT) && direction != RIGHT)
direction = LEFT;
if ((i == KeyEvent.VK_D || i == KeyEvent.VK_RIGHT) && direction != LEFT)
direction = RIGHT;
if ((i == KeyEvent.VK_W || i == KeyEvent.VK_UP) && direction != DOWN)
direction = UP;
if ((i == KeyEvent.VK_S || i == KeyEvent.VK_DOWN) && direction != UP)
direction = DOWN;
if (i == KeyEvent.VK_SPACE)
if (over)
startGame();
else
paused = !paused;
}
@Override
public void keyReleased(KeyEvent e) {
}
@Override
public void keyTyped(KeyEvent e) {
}
}
_________________________________________________________________________________
2.Create Seconde File Name : RenderPanel.java
_________________________________________________________________________________
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Point;
import javax.swing.JPanel;
@SuppressWarnings("serial")
/**
* CREATED BY AJAY RATHOD(ajju)
*/
public class RenderPanel extends JPanel
{
public static Color black = new Color(1);
int c=0;
@Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
g.setColor(black);
g.fillRect(0, 0, 800, 700);
Snake snake = Snake.snake;
g.setColor(Color.WHITE);
for (Point point : snake.snakeParts) {
g.fillRect(point.x * Snake.SCALE, point.y * Snake.SCALE,
Snake.SCALE, Snake.SCALE);
}
g.fillRect(snake.head.x * Snake.SCALE, snake.head.y * Snake.SCALE,
Snake.SCALE, Snake.SCALE);
g.setColor(Color.green);
g.fillRect(snake.cherry.x * Snake.SCALE, snake.cherry.y * Snake.SCALE,
Snake.SCALE, Snake.SCALE);
String string = "|Score: " + snake.score + " | Length: "
+ snake.tailLength + " | Time: " + snake.time / 20+" |";
g.setColor(Color.YELLOW);
g.drawString(string, (int) (getWidth() / 1.15f - string.length() * 2.5f),
10);
g.setColor(Color.RED);
string = "Game Over! Better Luck Next Time";
if (snake.over)
g.drawString(string,
(int) (getWidth() / 2 - string.length() * 2.5f),
(int) snake.dim.getHeight() / 4);
string = "Paused! :(";
if (snake.paused && !snake.over)
g.drawString(string,
(int) (getWidth() / 2 - string.length() * 2.5f),
(int) snake.dim.getHeight() / 4);
}
}
Thursday, 7 August 2014
Code:Convert Digit To Word
Code For Convert Digit To Word
<html>
<head>
<title>JS</title>
<script type="text/javascript">
var th = ['','thousand','million', 'billion','trillion'];
var dg = ['zero','one','two','three','four', 'five','six','seven','eight','nine']; var tn = ['ten','eleven','twelve','thirteen', 'fourteen','fifteen','sixteen', 'seventeen','eighteen','nineteen']; var tw = ['twenty','thirty','forty','fifty', 'sixty','seventy','eighty','ninety']; function toWords(s){s = s.toString(); s = s.replace(/[\, ]/g,''); if (s != parseFloat(s)) return 'not a number'; var x = s.indexOf('.'); if (x == -1) x = s.length; if (x > 15) return 'too big'; var n = s.split(''); var str = ''; var sk = 0; for (var i=0; i < x; i++) {if ((x-i)%3==2) {if (n[i] == '1') {str += tn[Number(n[i+1])] + ' '; i++; sk=1;} else if (n[i]!=0) {str += tw[n[i]-2] + ' ';sk=1;}} else if (n[i]!=0) {str += dg[n[i]] +' '; if ((x-i)%3==0) str += 'hundred ';sk=1;} if ((x-i)%3==1) {if (sk) str += th[(x-i-1)/3] + ' ';sk=0;}} if (x != s.length) {var y = s.length; str += 'point '; for (var i=x+1; i<y; i++) str += dg[n[i]] +' ';} return str.replace(/\s+/g,' ');}
</script>
</head>
<body>
<form name="test">
<table border="1">
<tr>
<th colspan="2"><h2><marquee behavior="alternate">Convert Digit To Word</marquee></h2></th>
</tr>
<tr>
<td><b>Enter The Number:</b></td><td><input type="text" name="inum" size="40" style="background-color:#FFFF00;font-size:18px;" onkeyup="test.rnum.value = toWords(test.inum.value);"></td>
</tr><tr><th colspan="2">
<br/><br/><h2>Converted Into Word</h2><br/><br/></th></tr>
<tr>
<td align="right"><b>Word:</b></td><td><input type="text" name="rnum" size="40" style="background-color:#FFFF00;font-size:18px;"></textarea></td>
</tr>
</table>
</form>
</body>
</html>
how to download eclipse 64 or 32 bit
1.open the website www.eclipse.org/downloads/

3.click on the link and it will take few minuteClick here direct download 64 bit eclipse
Click here direct download 32 bit eclipse
Click here direct download 32 bit eclipse

4.you done 3 step then it will automatically download will be start if any problem a rise then you will click on click here link declare on the page

Wednesday, 6 August 2014
Code for canvas name move
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="620" height="300"></canvas>
<script>
window.requestAnimFrame = (function(callback) {
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
function(callback) {
window.setTimeout(callback, 1000 / 60);
};
})();
function initBalls() {
balls = [];
var blue = '#3A5BCD';
var red = '#EF2B36';
var yellow = '#FFC636';
var green = '#02A817';
var oOffset = 16;
//----
balls.push(new Ball(80, 20, 0, 0, blue));
balls.push(new Ball(100, 20, 0, 0, blue));
balls.push(new Ball(120, 20, 0, 0, blue));
balls.push(new Ball(140, 20, 0, 0, blue));
balls.push(new Ball(160, 20, 0, 0, blue));
balls.push(new Ball(180, 20, 0, 0, blue));
balls.push(new Ball(200, 20, 0, 0, blue));
balls.push(new Ball(220, 20, 0, 0, blue));
balls.push(new Ball(240, 20, 0, 0, blue));
balls.push(new Ball(260, 20, 0, 0, blue));
balls.push(new Ball(280, 20, 0, 0, blue));
balls.push(new Ball(300, 20, 0, 0, blue));
balls.push(new Ball(320, 20, 0, 0, blue));
balls.push(new Ball(340, 20, 0, 0, blue));
balls.push(new Ball(360, 20, 0, 0, blue));
balls.push(new Ball(380, 20, 0, 0, blue));
balls.push(new Ball(400, 20, 0, 0, blue));
balls.push(new Ball(420, 20, 0, 0, blue));
balls.push(new Ball(440, 20, 0, 0, blue));
balls.push(new Ball(460, 20, 0, 0, blue));
balls.push(new Ball(480, 20, 0, 0, blue));
balls.push(new Ball(500, 20, 0, 0, blue));
balls.push(new Ball(520, 20, 0, 0, blue));
balls.push(new Ball(540, 20, 0, 0, blue));
balls.push(new Ball(560, 20, 0, 0, blue));
balls.push(new Ball(580, 20, 0, 0, blue));
balls.push(new Ball(600, 20, 0, 0, blue));
//|
//|
//|
balls.push(new Ball(600, 40, 0, 0, red));
balls.push(new Ball(600, 60, 0, 0, red));
balls.push(new Ball(600, 80, 0, 0, red));
balls.push(new Ball(600, 100, 0, 0, red));
balls.push(new Ball(600, 120, 0, 0, red));
balls.push(new Ball(600, 140, 0, 0, red));
balls.push(new Ball(600, 160, 0, 0, red));
balls.push(new Ball(600, 180, 0, 0, red));
balls.push(new Ball(600, 200, 0, 0, red));
balls.push(new Ball(600, 220, 0, 0, red));
balls.push(new Ball(600, 240, 0, 0, blue));
//----
balls.push(new Ball(580, 240, 0, 0, blue));
balls.push(new Ball(560, 240, 0, 0, blue));
balls.push(new Ball(540, 240, 0, 0, blue));
balls.push(new Ball(520, 240, 0, 0, blue));
balls.push(new Ball(500, 240, 0, 0, blue));
balls.push(new Ball(480, 240, 0, 0, blue));
balls.push(new Ball(460, 240, 0, 0, blue));
balls.push(new Ball(440, 240, 0, 0, blue));
balls.push(new Ball(420, 240, 0, 0, blue));
balls.push(new Ball(400, 240, 0, 0, blue));
balls.push(new Ball(380, 240, 0, 0, blue));
balls.push(new Ball(360, 240, 0, 0, blue));
balls.push(new Ball(340, 240, 0, 0, blue));
balls.push(new Ball(320, 240, 0, 0, blue));
balls.push(new Ball(300, 240, 0, 0, blue));
balls.push(new Ball(280, 240, 0, 0, blue));
balls.push(new Ball(260, 240, 0, 0, blue));
balls.push(new Ball(240, 240, 0, 0, blue));
balls.push(new Ball(220, 240, 0, 0, blue));
balls.push(new Ball(200, 240, 0, 0, blue));
balls.push(new Ball(180, 240, 0, 0, blue));
balls.push(new Ball(160, 240, 0, 0, blue));
balls.push(new Ball(140, 240, 0, 0, blue));
balls.push(new Ball(120, 240, 0, 0, blue));
balls.push(new Ball(100, 240, 0, 0, blue));
//|
//|
//|
balls.push(new Ball(80, 240, 0, 0, blue));
balls.push(new Ball(80, 220, 0, 0, red));
balls.push(new Ball(80, 200, 0, 0, red));
balls.push(new Ball(80, 180, 0, 0, red));
balls.push(new Ball(80, 160, 0, 0, red));
balls.push(new Ball(80, 140, 0, 0, red));
balls.push(new Ball(80, 120, 0, 0, red));
balls.push(new Ball(80, 100, 0, 0, red));
balls.push(new Ball(80, 80, 0, 0, red));
balls.push(new Ball(80, 60, 0, 0, red));
balls.push(new Ball(80, 40, 0, 0, red));
//A
balls.push(new Ball(173, 63, 0, 0, blue));
balls.push(new Ball(170, 72, 0, 0, blue));
balls.push(new Ball(oOffset + 170, 63, 0, 0, blue));
balls.push(new Ball(oOffset + 175, 72, 0, 0, blue));
balls.push(new Ball(oOffset + 180, 80, 0, 0, blue));
balls.push(new Ball(oOffset + 185, 90, 0, 0, blue));
balls.push(new Ball(oOffset + 190, 100, 0, 0, blue));
balls.push(new Ball(oOffset + 195, 110, 0, 0, blue));
balls.push(new Ball(oOffset + 200, 120, 0, 0, blue));
balls.push(new Ball(oOffset + 205, 130, 0, 0, blue));
balls.push(new Ball(163, 80, 0, 0, blue));
balls.push(new Ball(156, 90, 0, 0, blue));
balls.push(new Ball(149, 100, 0, 0, blue));
balls.push(new Ball(142, 110, 0, 0, blue));
balls.push(new Ball(135, 120, 0, 0, blue));
balls.push(new Ball(160, 110, 0, 0, blue));
balls.push(new Ball(170, 110, 0, 0, blue));
balls.push(new Ball(180, 110, 0, 0, blue));
balls.push(new Ball(190, 110, 0, 0, blue));
balls.push(new Ball(128, 130, 0, 0, blue));
//J
balls.push(new Ball(250, 63, 0, 0, green));
balls.push(new Ball(257, 63, 0, 0, green));
balls.push(new Ball(265, 63, 0, 0, green));
balls.push(new Ball(272, 63, 0, 0, green));
balls.push(new Ball(278, 63, 0, 0, green));
balls.push(new Ball(285, 63, 0, 0, green));
balls.push(new Ball(292, 63, 0, 0, green));
balls.push(new Ball(300, 63, 0, 0, green));
balls.push(new Ball(275, 80, 0, 0,green));
balls.push(new Ball(275, 90, 0, 0, green));
balls.push(new Ball(275, 100, 0, 0, green));
balls.push(new Ball(275, 110, 0, 0, green));
balls.push(new Ball(275, 120, 0, 0, green));
balls.push(new Ball(275, 130, 0, 0, green));
balls.push(new Ball(275, 140, 0, 0, green));
balls.push(new Ball(275, 150, 0, 0, green));
balls.push(new Ball(275, 160, 0, 0, green));
balls.push(new Ball(oOffset + 245, 160, 0, 0, green));
balls.push(new Ball(oOffset + 230, 160, 0, 0, green));
balls.push(new Ball(oOffset + 230, 140, 0, 0, green));
balls.push(new Ball(oOffset + 230, 143, 0, 0, green));
//a
balls.push(new Ball(350, 63, 0, 0, blue));
balls.push(new Ball(343, 72, 0, 0, blue));
balls.push(new Ball(336, 80, 0, 0, blue));
balls.push(new Ball(329, 90, 0, 0, blue));
balls.push(new Ball(322, 100, 0, 0, blue));
balls.push(new Ball(315, 110, 0, 0, blue));
balls.push(new Ball(309, 120, 0, 0, blue));
balls.push(new Ball(302, 130, 0, 0, blue));
balls.push(new Ball(oOffset + 350, 63, 0, 0, blue));
balls.push(new Ball(oOffset + 355, 63, 0, 0, blue));
balls.push(new Ball(oOffset + 360, 72, 0, 0, blue));
balls.push(new Ball(oOffset + 365, 80, 0, 0, blue));
balls.push(new Ball(oOffset + 370, 90, 0, 0, blue));
balls.push(new Ball(oOffset + 375, 100, 0, 0, blue));
balls.push(new Ball(oOffset + 380, 110, 0, 0, blue));
balls.push(new Ball(oOffset + 385, 120, 0, 0, blue));
balls.push(new Ball(oOffset + 390, 130, 0, 0, blue));
balls.push(new Ball(330, 110, 0, 0, blue));
balls.push(new Ball(340, 110, 0, 0, blue));
balls.push(new Ball(350, 110, 0, 0, blue));
balls.push(new Ball(360, 110, 0, 0, blue));
balls.push(new Ball(370, 110, 0, 0, blue));
balls.push(new Ball(380, 110, 0, 0, blue));
//y
balls.push(new Ball(420, 63, 0, 0, yellow));
balls.push(new Ball(430, 72, 0, 0, yellow));
balls.push(new Ball(440, 80, 0, 0, yellow));
balls.push(new Ball(450, 90, 0, 0, yellow));
balls.push(new Ball(460, 100, 0, 0, yellow));
balls.push(new Ball(470, 110, 0, 0, yellow));
balls.push(new Ball(480, 120, 0, 0, yellow));
balls.push(new Ball(490, 130, 0, 0, yellow));
balls.push(new Ball(550, 63, 0, 0, yellow));
balls.push(new Ball(545, 75, 0, 0, yellow));
balls.push(new Ball(540, 87, 0, 0, yellow));
balls.push(new Ball(535, 99, 0, 0, yellow));
balls.push(new Ball(525, 111, 0, 0, yellow));
balls.push(new Ball(515, 123, 0, 0, yellow));
balls.push(new Ball(505, 135, 0, 0, yellow));
balls.push(new Ball(495, 147, 0, 0, yellow));
balls.push(new Ball(485, 159, 0, 0, yellow));
balls.push(new Ball(475, 171, 0, 0, yellow));
balls.push(new Ball(465, 183, 0, 0, yellow));
balls.push(new Ball(455, 195, 0, 0, yellow));
return balls;
}
function getMousePos(canvas, evt) {
// get canvas position
var obj = canvas;
var top = 0;
var left = 0;
while(obj.tagName != 'BODY') {
top += obj.offsetTop;
left += obj.offsetLeft;
obj = obj.offsetParent;
}
// return relative mouse position
var mouseX = evt.clientX - left + window.pageXOffset;
var mouseY = evt.clientY - top + window.pageYOffset;
return {
x: mouseX,
y: mouseY
};
}
function updateBalls(canvas, balls, timeDiff, mousePos) {
var context = canvas.getContext('2d');
var collisionDamper = 0.3;
var floorFriction = 0.0005 * timeDiff;
var mouseForceMultiplier = 1 * timeDiff;
var restoreForce = 0.002 * timeDiff;
for(var n = 0; n < balls.length; n++) {
var ball = balls[n];
// set ball position based on velocity
ball.y += ball.vy;
ball.x += ball.vx;
// restore forces
if(ball.x > ball.origX) {
ball.vx -= restoreForce;
}
else {
ball.vx += restoreForce;
}
if(ball.y > ball.origY) {
ball.vy -= restoreForce;
}
else {
ball.vy += restoreForce;
}
// mouse forces
var mouseX = mousePos.x;
var mouseY = mousePos.y;
var distX = ball.x - mouseX;
var distY = ball.y - mouseY;
var radius = Math.sqrt(Math.pow(distX, 2) + Math.pow(distY, 2));
var totalDist = Math.abs(distX) + Math.abs(distY);
var forceX = (Math.abs(distX) / totalDist) * (1 / radius) * mouseForceMultiplier;
var forceY = (Math.abs(distY) / totalDist) * (1 / radius) * mouseForceMultiplier;
if(distX > 0) {// mouse is left of ball
ball.vx += forceX;
}
else {
ball.vx -= forceX;
}
if(distY > 0) {// mouse is on top of ball
ball.vy += forceY;
}
else {
ball.vy -= forceY;
}
// floor friction
if(ball.vx > 0) {
ball.vx -= floorFriction;
}
else if(ball.vx < 0) {
ball.vx += floorFriction;
}
if(ball.vy > 0) {
ball.vy -= floorFriction;
}
else if(ball.vy < 0) {
ball.vy += floorFriction;
}
// floor condition
if(ball.y > (canvas.height - ball.radius)) {
ball.y = canvas.height - ball.radius - 2;
ball.vy *= -1;
ball.vy *= (1 - collisionDamper);
}
// ceiling condition
if(ball.y < (ball.radius)) {
ball.y = ball.radius + 2;
ball.vy *= -1;
ball.vy *= (1 - collisionDamper);
}
// right wall condition
if(ball.x > (canvas.width - ball.radius)) {
ball.x = canvas.width - ball.radius - 2;
ball.vx *= -1;
ball.vx *= (1 - collisionDamper);
}
// left wall condition
if(ball.x < (ball.radius)) {
ball.x = ball.radius + 2;
ball.vx *= -1;
ball.vx *= (1 - collisionDamper);
}
}
}
function Ball(x, y, vx, vy, color) {
this.x = x;
this.y = y;
this.vx = vx;
this.vy = vy;
this.color = color;
this.origX = x;
this.origY = y;
this.radius = 10;
}
function animate(canvas, balls, lastTime, mousePos) {
var context = canvas.getContext('2d');
// update
var date = new Date();
var time = date.getTime();
var timeDiff = time - lastTime;
updateBalls(canvas, balls, timeDiff, mousePos);
lastTime = time;
// clear
context.clearRect(0, 0, canvas.width, canvas.height);
// render
for(var n = 0; n < balls.length; n++) {
var ball = balls[n];
context.beginPath();
context.arc(ball.x, ball.y, ball.radius, 0, 2 * Math.PI, false);
context.fillStyle = ball.color;
context.fill();
}
// request new frame
requestAnimFrame(function() {
animate(canvas, balls, lastTime, mousePos);
});
}
var canvas = document.getElementById('myCanvas');
var balls = initBalls();
var date = new Date();
var time = date.getTime();
/*
* set mouse position really far away
* so the mouse forces are nearly obsolete
*/
var mousePos = {
x: 9999,
y: 9999
};
canvas.addEventListener('mousemove', function(evt) {
var pos = getMousePos(canvas, evt);
mousePos.x = pos.x;
mousePos.y = pos.y;
});
canvas.addEventListener('mouseout', function(evt) {
mousePos.x = 9999;
mousePos.y = 9999;
});
animate(canvas, balls, time, mousePos);
</script>
<table>
<center><b>Name Area</b></center>
<tr>
<td><td>Name:Ajay Rathod<br/>Degree:M.Sc.It<br/>Work:Fresher<br/>Mo:7600728572</td><td>move ur mouse on my name the wait a few minute the name automatically rearrange this done by Canvace Animation Html5<br/>Do with ur name by Have Good Day<br/>Note:Mouse pointer not presant in name area</td>
</tr>
</table>
</body>
</html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="620" height="300"></canvas>
<script>
window.requestAnimFrame = (function(callback) {
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
function(callback) {
window.setTimeout(callback, 1000 / 60);
};
})();
function initBalls() {
balls = [];
var blue = '#3A5BCD';
var red = '#EF2B36';
var yellow = '#FFC636';
var green = '#02A817';
var oOffset = 16;
//----
balls.push(new Ball(80, 20, 0, 0, blue));
balls.push(new Ball(100, 20, 0, 0, blue));
balls.push(new Ball(120, 20, 0, 0, blue));
balls.push(new Ball(140, 20, 0, 0, blue));
balls.push(new Ball(160, 20, 0, 0, blue));
balls.push(new Ball(180, 20, 0, 0, blue));
balls.push(new Ball(200, 20, 0, 0, blue));
balls.push(new Ball(220, 20, 0, 0, blue));
balls.push(new Ball(240, 20, 0, 0, blue));
balls.push(new Ball(260, 20, 0, 0, blue));
balls.push(new Ball(280, 20, 0, 0, blue));
balls.push(new Ball(300, 20, 0, 0, blue));
balls.push(new Ball(320, 20, 0, 0, blue));
balls.push(new Ball(340, 20, 0, 0, blue));
balls.push(new Ball(360, 20, 0, 0, blue));
balls.push(new Ball(380, 20, 0, 0, blue));
balls.push(new Ball(400, 20, 0, 0, blue));
balls.push(new Ball(420, 20, 0, 0, blue));
balls.push(new Ball(440, 20, 0, 0, blue));
balls.push(new Ball(460, 20, 0, 0, blue));
balls.push(new Ball(480, 20, 0, 0, blue));
balls.push(new Ball(500, 20, 0, 0, blue));
balls.push(new Ball(520, 20, 0, 0, blue));
balls.push(new Ball(540, 20, 0, 0, blue));
balls.push(new Ball(560, 20, 0, 0, blue));
balls.push(new Ball(580, 20, 0, 0, blue));
balls.push(new Ball(600, 20, 0, 0, blue));
//|
//|
//|
balls.push(new Ball(600, 40, 0, 0, red));
balls.push(new Ball(600, 60, 0, 0, red));
balls.push(new Ball(600, 80, 0, 0, red));
balls.push(new Ball(600, 100, 0, 0, red));
balls.push(new Ball(600, 120, 0, 0, red));
balls.push(new Ball(600, 140, 0, 0, red));
balls.push(new Ball(600, 160, 0, 0, red));
balls.push(new Ball(600, 180, 0, 0, red));
balls.push(new Ball(600, 200, 0, 0, red));
balls.push(new Ball(600, 220, 0, 0, red));
balls.push(new Ball(600, 240, 0, 0, blue));
//----
balls.push(new Ball(580, 240, 0, 0, blue));
balls.push(new Ball(560, 240, 0, 0, blue));
balls.push(new Ball(540, 240, 0, 0, blue));
balls.push(new Ball(520, 240, 0, 0, blue));
balls.push(new Ball(500, 240, 0, 0, blue));
balls.push(new Ball(480, 240, 0, 0, blue));
balls.push(new Ball(460, 240, 0, 0, blue));
balls.push(new Ball(440, 240, 0, 0, blue));
balls.push(new Ball(420, 240, 0, 0, blue));
balls.push(new Ball(400, 240, 0, 0, blue));
balls.push(new Ball(380, 240, 0, 0, blue));
balls.push(new Ball(360, 240, 0, 0, blue));
balls.push(new Ball(340, 240, 0, 0, blue));
balls.push(new Ball(320, 240, 0, 0, blue));
balls.push(new Ball(300, 240, 0, 0, blue));
balls.push(new Ball(280, 240, 0, 0, blue));
balls.push(new Ball(260, 240, 0, 0, blue));
balls.push(new Ball(240, 240, 0, 0, blue));
balls.push(new Ball(220, 240, 0, 0, blue));
balls.push(new Ball(200, 240, 0, 0, blue));
balls.push(new Ball(180, 240, 0, 0, blue));
balls.push(new Ball(160, 240, 0, 0, blue));
balls.push(new Ball(140, 240, 0, 0, blue));
balls.push(new Ball(120, 240, 0, 0, blue));
balls.push(new Ball(100, 240, 0, 0, blue));
//|
//|
//|
balls.push(new Ball(80, 240, 0, 0, blue));
balls.push(new Ball(80, 220, 0, 0, red));
balls.push(new Ball(80, 200, 0, 0, red));
balls.push(new Ball(80, 180, 0, 0, red));
balls.push(new Ball(80, 160, 0, 0, red));
balls.push(new Ball(80, 140, 0, 0, red));
balls.push(new Ball(80, 120, 0, 0, red));
balls.push(new Ball(80, 100, 0, 0, red));
balls.push(new Ball(80, 80, 0, 0, red));
balls.push(new Ball(80, 60, 0, 0, red));
balls.push(new Ball(80, 40, 0, 0, red));
//A
balls.push(new Ball(173, 63, 0, 0, blue));
balls.push(new Ball(170, 72, 0, 0, blue));
balls.push(new Ball(oOffset + 170, 63, 0, 0, blue));
balls.push(new Ball(oOffset + 175, 72, 0, 0, blue));
balls.push(new Ball(oOffset + 180, 80, 0, 0, blue));
balls.push(new Ball(oOffset + 185, 90, 0, 0, blue));
balls.push(new Ball(oOffset + 190, 100, 0, 0, blue));
balls.push(new Ball(oOffset + 195, 110, 0, 0, blue));
balls.push(new Ball(oOffset + 200, 120, 0, 0, blue));
balls.push(new Ball(oOffset + 205, 130, 0, 0, blue));
balls.push(new Ball(163, 80, 0, 0, blue));
balls.push(new Ball(156, 90, 0, 0, blue));
balls.push(new Ball(149, 100, 0, 0, blue));
balls.push(new Ball(142, 110, 0, 0, blue));
balls.push(new Ball(135, 120, 0, 0, blue));
balls.push(new Ball(160, 110, 0, 0, blue));
balls.push(new Ball(170, 110, 0, 0, blue));
balls.push(new Ball(180, 110, 0, 0, blue));
balls.push(new Ball(190, 110, 0, 0, blue));
balls.push(new Ball(128, 130, 0, 0, blue));
//J
balls.push(new Ball(250, 63, 0, 0, green));
balls.push(new Ball(257, 63, 0, 0, green));
balls.push(new Ball(265, 63, 0, 0, green));
balls.push(new Ball(272, 63, 0, 0, green));
balls.push(new Ball(278, 63, 0, 0, green));
balls.push(new Ball(285, 63, 0, 0, green));
balls.push(new Ball(292, 63, 0, 0, green));
balls.push(new Ball(300, 63, 0, 0, green));
balls.push(new Ball(275, 80, 0, 0,green));
balls.push(new Ball(275, 90, 0, 0, green));
balls.push(new Ball(275, 100, 0, 0, green));
balls.push(new Ball(275, 110, 0, 0, green));
balls.push(new Ball(275, 120, 0, 0, green));
balls.push(new Ball(275, 130, 0, 0, green));
balls.push(new Ball(275, 140, 0, 0, green));
balls.push(new Ball(275, 150, 0, 0, green));
balls.push(new Ball(275, 160, 0, 0, green));
balls.push(new Ball(oOffset + 245, 160, 0, 0, green));
balls.push(new Ball(oOffset + 230, 160, 0, 0, green));
balls.push(new Ball(oOffset + 230, 140, 0, 0, green));
balls.push(new Ball(oOffset + 230, 143, 0, 0, green));
//a
balls.push(new Ball(350, 63, 0, 0, blue));
balls.push(new Ball(343, 72, 0, 0, blue));
balls.push(new Ball(336, 80, 0, 0, blue));
balls.push(new Ball(329, 90, 0, 0, blue));
balls.push(new Ball(322, 100, 0, 0, blue));
balls.push(new Ball(315, 110, 0, 0, blue));
balls.push(new Ball(309, 120, 0, 0, blue));
balls.push(new Ball(302, 130, 0, 0, blue));
balls.push(new Ball(oOffset + 350, 63, 0, 0, blue));
balls.push(new Ball(oOffset + 355, 63, 0, 0, blue));
balls.push(new Ball(oOffset + 360, 72, 0, 0, blue));
balls.push(new Ball(oOffset + 365, 80, 0, 0, blue));
balls.push(new Ball(oOffset + 370, 90, 0, 0, blue));
balls.push(new Ball(oOffset + 375, 100, 0, 0, blue));
balls.push(new Ball(oOffset + 380, 110, 0, 0, blue));
balls.push(new Ball(oOffset + 385, 120, 0, 0, blue));
balls.push(new Ball(oOffset + 390, 130, 0, 0, blue));
balls.push(new Ball(330, 110, 0, 0, blue));
balls.push(new Ball(340, 110, 0, 0, blue));
balls.push(new Ball(350, 110, 0, 0, blue));
balls.push(new Ball(360, 110, 0, 0, blue));
balls.push(new Ball(370, 110, 0, 0, blue));
balls.push(new Ball(380, 110, 0, 0, blue));
//y
balls.push(new Ball(420, 63, 0, 0, yellow));
balls.push(new Ball(430, 72, 0, 0, yellow));
balls.push(new Ball(440, 80, 0, 0, yellow));
balls.push(new Ball(450, 90, 0, 0, yellow));
balls.push(new Ball(460, 100, 0, 0, yellow));
balls.push(new Ball(470, 110, 0, 0, yellow));
balls.push(new Ball(480, 120, 0, 0, yellow));
balls.push(new Ball(490, 130, 0, 0, yellow));
balls.push(new Ball(550, 63, 0, 0, yellow));
balls.push(new Ball(545, 75, 0, 0, yellow));
balls.push(new Ball(540, 87, 0, 0, yellow));
balls.push(new Ball(535, 99, 0, 0, yellow));
balls.push(new Ball(525, 111, 0, 0, yellow));
balls.push(new Ball(515, 123, 0, 0, yellow));
balls.push(new Ball(505, 135, 0, 0, yellow));
balls.push(new Ball(495, 147, 0, 0, yellow));
balls.push(new Ball(485, 159, 0, 0, yellow));
balls.push(new Ball(475, 171, 0, 0, yellow));
balls.push(new Ball(465, 183, 0, 0, yellow));
balls.push(new Ball(455, 195, 0, 0, yellow));
return balls;
}
function getMousePos(canvas, evt) {
// get canvas position
var obj = canvas;
var top = 0;
var left = 0;
while(obj.tagName != 'BODY') {
top += obj.offsetTop;
left += obj.offsetLeft;
obj = obj.offsetParent;
}
// return relative mouse position
var mouseX = evt.clientX - left + window.pageXOffset;
var mouseY = evt.clientY - top + window.pageYOffset;
return {
x: mouseX,
y: mouseY
};
}
function updateBalls(canvas, balls, timeDiff, mousePos) {
var context = canvas.getContext('2d');
var collisionDamper = 0.3;
var floorFriction = 0.0005 * timeDiff;
var mouseForceMultiplier = 1 * timeDiff;
var restoreForce = 0.002 * timeDiff;
for(var n = 0; n < balls.length; n++) {
var ball = balls[n];
// set ball position based on velocity
ball.y += ball.vy;
ball.x += ball.vx;
// restore forces
if(ball.x > ball.origX) {
ball.vx -= restoreForce;
}
else {
ball.vx += restoreForce;
}
if(ball.y > ball.origY) {
ball.vy -= restoreForce;
}
else {
ball.vy += restoreForce;
}
// mouse forces
var mouseX = mousePos.x;
var mouseY = mousePos.y;
var distX = ball.x - mouseX;
var distY = ball.y - mouseY;
var radius = Math.sqrt(Math.pow(distX, 2) + Math.pow(distY, 2));
var totalDist = Math.abs(distX) + Math.abs(distY);
var forceX = (Math.abs(distX) / totalDist) * (1 / radius) * mouseForceMultiplier;
var forceY = (Math.abs(distY) / totalDist) * (1 / radius) * mouseForceMultiplier;
if(distX > 0) {// mouse is left of ball
ball.vx += forceX;
}
else {
ball.vx -= forceX;
}
if(distY > 0) {// mouse is on top of ball
ball.vy += forceY;
}
else {
ball.vy -= forceY;
}
// floor friction
if(ball.vx > 0) {
ball.vx -= floorFriction;
}
else if(ball.vx < 0) {
ball.vx += floorFriction;
}
if(ball.vy > 0) {
ball.vy -= floorFriction;
}
else if(ball.vy < 0) {
ball.vy += floorFriction;
}
// floor condition
if(ball.y > (canvas.height - ball.radius)) {
ball.y = canvas.height - ball.radius - 2;
ball.vy *= -1;
ball.vy *= (1 - collisionDamper);
}
// ceiling condition
if(ball.y < (ball.radius)) {
ball.y = ball.radius + 2;
ball.vy *= -1;
ball.vy *= (1 - collisionDamper);
}
// right wall condition
if(ball.x > (canvas.width - ball.radius)) {
ball.x = canvas.width - ball.radius - 2;
ball.vx *= -1;
ball.vx *= (1 - collisionDamper);
}
// left wall condition
if(ball.x < (ball.radius)) {
ball.x = ball.radius + 2;
ball.vx *= -1;
ball.vx *= (1 - collisionDamper);
}
}
}
function Ball(x, y, vx, vy, color) {
this.x = x;
this.y = y;
this.vx = vx;
this.vy = vy;
this.color = color;
this.origX = x;
this.origY = y;
this.radius = 10;
}
function animate(canvas, balls, lastTime, mousePos) {
var context = canvas.getContext('2d');
// update
var date = new Date();
var time = date.getTime();
var timeDiff = time - lastTime;
updateBalls(canvas, balls, timeDiff, mousePos);
lastTime = time;
// clear
context.clearRect(0, 0, canvas.width, canvas.height);
// render
for(var n = 0; n < balls.length; n++) {
var ball = balls[n];
context.beginPath();
context.arc(ball.x, ball.y, ball.radius, 0, 2 * Math.PI, false);
context.fillStyle = ball.color;
context.fill();
}
// request new frame
requestAnimFrame(function() {
animate(canvas, balls, lastTime, mousePos);
});
}
var canvas = document.getElementById('myCanvas');
var balls = initBalls();
var date = new Date();
var time = date.getTime();
/*
* set mouse position really far away
* so the mouse forces are nearly obsolete
*/
var mousePos = {
x: 9999,
y: 9999
};
canvas.addEventListener('mousemove', function(evt) {
var pos = getMousePos(canvas, evt);
mousePos.x = pos.x;
mousePos.y = pos.y;
});
canvas.addEventListener('mouseout', function(evt) {
mousePos.x = 9999;
mousePos.y = 9999;
});
animate(canvas, balls, time, mousePos);
</script>
<table>
<center><b>Name Area</b></center>
<tr>
<td><td>Name:Ajay Rathod<br/>Degree:M.Sc.It<br/>Work:Fresher<br/>Mo:7600728572</td><td>move ur mouse on my name the wait a few minute the name automatically rearrange this done by Canvace Animation Html5<br/>Do with ur name by Have Good Day<br/>Note:Mouse pointer not presant in name area</td>
</tr>
</table>
</body>
</html>
Subscribe to:
Posts (Atom)