Showing posts with label Javascript. Show all posts
Showing posts with label Javascript. Show all posts

Thursday, September 21, 2017

Javascript: Prime Number Generator

HTML/Javascript Code:

<html><head>
<meta name="viewport" content="width=device-width">
<script>
var d=document;
var primes=[];

function Prime(){
   for (var i=2; i<=2000000;i++){
      if (this.check(i, primes)){
         primes.push(i);
         d.write(i+" ");
      }
   }
}

Prime.prototype.check=function(i, primes){
   var isOdd=i%2;
   var isPrime=true;
   var n=2;

   if(i==2 || isOdd){
      var to=Math.floor(i/2);

      if (primes.length>0){
         for (var j=0;j<primes.length; j++){
            n=primes[j];
            if(n>to){
               break;
            }
            if(i%n==0){
               isPrime=false;
               break;
            }
         }
      }

      for(;n<=to;n++){
         if(i%n==0){
            isPrime=false;
            break;
         }
      }
   } else {
      isPrime=false;
   }

   return isPrime;
}

function main(){
   var p=new Prime();
}
</script>
</head>
<body onload="main()">default</body>
</html>


Web Inspector:

23.51s



Friday, November 18, 2016

HTML5 & JavaScript: Snake (Alpha Version)

Command:

$ cat html5game_snake.html


Result:

<canvas id="gc" width="640" height="480"></canvas>
<script>
rh=rv=0; //Resolution horizontal and vertical
sx=sy=1; //Snake position x and y
gx=gy=1; //Grid x and y
fps=60; //Frames per second
a=0.1; //Acceleration
v=1 //Velocity
vx=0; //Velocity x
vy=0; //Velocity y
dx=0; //Distance x
dy=0; //Distance y
gd=10; //Grid dimension
kc=39; //Key code
s=0; //Score

window.onload=function() {
c=document.getElementById('gc');
cc=c.getContext('2d');
setInterval(update,1000/fps); //reflesh screen fps times a second
window.addEventListener("keydown", function(e){
console.log(e.keyCode);
kc=e.keyCode;
});
rh=c.width/gd;
rv=c.height/gd;
}
function update(){
v+=a/fps; //Accelerate

if(kc==37){ //left
vx=-v;
vy=0;
} else if (kc==38) { //up
vx=0;
vy=-v;
} else if (kc==39) { //right
vx=v;
vy=0;
} else if (kc==40) { //down
vx=0;
vy=v;
}

dx=vx/fps;
dy=vy/fps;

s+=Math.abs(dx);
s+=Math.abs(dy);

sx+=dx;
sy+=dy;

//Snake boundary condition for x
while(sx<0 || sx>rh){
if(sx<0){
sx+=rh;
} else if(sx>rh){
sx-=rh;
}
}

//Snake boundary condition for y
while(sy<0 || sy>rv){
if(sy<0){
sy+=rv;
} else if(sy>rv){
sy-=rv;
}
}

gx=Math.round(sx);
gy=Math.round(sy);

if (gx < 1){
gx=rh;
} else if (gx>rh) {
gx=1;
}

if (gy < 1){
gy=rv;
} else if (gy>rv) {
gy=1;
}

//Finally Display
cc.fillStyle='black';
cc.fillRect(0,0,c.width,c.height);

//Food
cc.fillStyle='white';
cc.fillRect(gd*Math.round(rh/2),gd*Math.round(rv/2),gd,gd);

//Snake
cc.fillStyle='white';
cc.fillRect(gd*(gx-1),gd*(gy-1),gd,gd);
cc.fillText(v,100,100);
cc.fillText("score:" + Math.round(s),c.width-100,100);
}
</script>


Command:

$ open html5game_snake.html


Result:

HTML5 Snake Alpha

Thursday, November 17, 2016

Wednesday, November 16, 2016

macOS Sierra: HTML5 & JavaScript: Pong

Command:

$ cat html5game.html


Result:

<canvas id="gc" width="640" height="480"></canvas>
<script>
p1y=p2y=40; //Paddle vertical positions
pt=10; //Paddle thickness
ph=100; //Paddle height
bx=by=50; //Ball position
xv=yv=4; //Velocities
bd=6; //Ball dimension
score1=score2=0;
ais=2; //AI Speed
window.onload=function() {
c=document.getElementById('gc');
cc=c.getContext('2d');
setInterval(update,1000/30); //30 times a second
c.addEventListener('mousemove',function(e){
p1y=e.clientY-ph/2;
});
}
function reset(){
bx=c.width/2;
by=c.height/2;
xv=-xv;
yv=4;
}
function update(){
bx+=xv;
by+=yv;
if(by<0 && yv<0)
{
yv=-yv;
}
if(by>c.height && yv>0)
{
yv=-yv;
}
if(bx<0)
{
if(by>p1y && by<p1y+ph){
xv=-xv;
dy=by-(p1y+ph/2);
yv= dy*0.3;
} else {
score2++;
reset();
}
}
if(bx>c.width)
{
if(by>p2y && by<p2y+ph){
xv=-xv;
dy=by-(p2y+ph/2);
yv= dy*0.3;
} else {
score1++;
reset();
}
}

if(p2y+ph/2<by){
p2y+=ais;
} else {
p2y-=ais;
}

cc.fillStyle='black';
cc.fillRect(0,0,c.width,c.height);
cc.fillStyle='white';
cc.fillRect(0,p1y,pt,ph);
cc.fillRect(c.width-pt,p2y,pt,ph);
cc.fillRect(bx-bd/2,by-bd/2,bd,bd);
cc.fillText(score1,100,100);
cc.fillText(score2,c.width-100,100);

}
</script>


Command:

$ open html5game.html


Graphical result:

HTML5 & JavaScript Pong


Chris DeLeon: JavaScript & HTML5: Coding Pong in 5 Minutes

Chris DeLeon

Wednesday, March 23, 2016

npm: Using npm Package Manager for Node.js to Install Node Module Lodash

Installation command:
$ npm install lodash

index.js:

var lodash = require('lodash');
var output = lodash.without([1, 2, 3], 1);
console.log(output);

Executing index.js:

[ 2, 3 ]

Saturday, February 13, 2016

Thursday, January 14, 2016

Javascript: Dialog box

Code 1:
window.alert("Dialog");

Code 2:
alert("Dialog");

Sunday, January 13, 2013

Bookmarklet: Clear All Timeouts

javascript:var x=setTimeout('',0);for(var i=0;i<=x;i++){clearTimeout(i);if(i==x)alert('cleared:'+i);}