JavaScript Cloth Simulation

http://codepen.io/anon/pen/khwqm
Take a look at the source c0d3 on the right in the link. Its there to be modified and try out different parameters. I’m posting the source below.  The author has it free to be re-used.
Check out more from the same guys at http://lonely-pixel.com/. There are some mind boggling examples..

/*
Copyright (c) 2013 lonely-pixel.com, Stuffit at codepen.io (http://codepen.io/stuffit)

View this and others at http://lonely-pixel.com

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
*/

document.getElementById('close').onmousedown = function(e) {
  e.preventDefault();
  document.getElementById('info').style.display = 'none';
  return false;
};

// settings

var physics_accuracy = 5,
mouse_influence      = 20, 
mouse_cut            = 6,
gravity              = 900, 
cloth_height         = 30,
cloth_width          = 50,
start_y              = 20,
spacing              = 7,
tear_distance        = 60;


window.requestAnimFrame =
window.requestAnimationFrame       ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame    ||
window.oRequestAnimationFrame      ||
window.msRequestAnimationFrame     ||
function(callback) {
    window.setTimeout(callback, 1000 / 60);
};

var canvas,
    ctx,
    cloth,
    boundsx,
    boundsy,
    mouse = {
        down: false,
        button: 1,
        x: 0,
        y: 0,
        px: 0,
        py: 0
    };

window.onload = function() {

    canvas = document.getElementById('c');
    ctx    = canvas.getContext('2d');

    canvas.width = canvas.clientWidth;
    canvas.height = 376;

    canvas.onmousedown = function(e) {
        mouse.button = e.which;
        mouse.px = mouse.x;
        mouse.py = mouse.y;
  var rect = canvas.getBoundingClientRect();
  mouse.x = e.clientX - rect.left,
  mouse.y = e.clientY - rect.top,
        mouse.down = true;
        e.preventDefault();
    };

    canvas.onmouseup = function(e) {
        mouse.down = false;
        e.preventDefault();
    };

    canvas.onmousemove = function(e) {
        mouse.px = mouse.x;
        mouse.py = mouse.y;
        var rect = canvas.getBoundingClientRect();
  mouse.x = e.clientX - rect.left,
  mouse.y = e.clientY - rect.top,
        e.preventDefault();
    };

    canvas.oncontextmenu = function(e) {
        e.preventDefault(); 
    };

    boundsx = canvas.width - 1;
    boundsy = canvas.height - 1;

    ctx.strokeStyle = 'rgba(222,222,222,0.6)';
    cloth = new Cloth();
    update();
};

var Point = function(x, y) {

    this.x = x;
    this.y = y;
    this.px = x;
    this.py = y;
    this.vx = 0;
    this.vy = 0;
    this.pin_x = null;
    this.pin_y = null;
    this.constraints = [];
};

Point.prototype.update = function(delta) {

    if (mouse.down) {

        var diff_x = this.x - mouse.x,
            diff_y = this.y - mouse.y,
            dist   = Math.sqrt(diff_x * diff_x + diff_y * diff_y);

        if (mouse.button == 1) {

            if(dist < mouse_influence) {
                this.px = this.x - (mouse.x - mouse.px) * 1.8;
                this.py = this.y - (mouse.y - mouse.py) * 1.8;
            }

        } else if (dist < mouse_cut) this.constraints = [];
    }

    this.add_force(0, gravity);

    delta *= delta;
    nx = this.x + ((this.x - this.px) * .99) + ((this.vx / 2) * delta);
    ny = this.y + ((this.y - this.py) * .99) + ((this.vy / 2) * delta);

    this.px = this.x;
    this.py = this.y;

    this.x = nx;
    this.y = ny;

    this.vy = this.vx = 0
};

Point.prototype.draw = function() {

    if (this.constraints.length <= 0) return;
    
    var i = this.constraints.length;
    while(i--) this.constraints[i].draw();
};

Point.prototype.resolve_constraints = function() {

    if (this.pin_x != null && this.pin_y != null) {
    
        this.x = this.pin_x;
        this.y = this.pin_y;
        return;
    }

    var i = this.constraints.length;
    while(i--) this.constraints[i].resolve();

    this.x > boundsx ? this.x = 2 * boundsx - this.x : 1 > this.x && (this.x = 2 - this.x);
    this.y < 1 ? this.y = 2 - this.y : this.y > boundsy && (this.y = 2 * boundsy - this.y);
};

Point.prototype.attach = function(point) {

    this.constraints.push(
        new Constraint(this, point)
    );
};

Point.prototype.remove_constraint = function(lnk) {

    var i = this.constraints.length;
    while(i--) if(this.constraints[i] == lnk) this.constraints.splice(i, 1);
};

Point.prototype.add_force = function(x, y )  {

    this.vx += x;
    this.vy += y;
};

Point.prototype.pin = function(pinx, piny) {
    this.pin_x = pinx;
    this.pin_y = piny;
};

var Constraint = function(p1, p2) {

    this.p1 = p1;
    this.p2 = p2;
    this.length = spacing;
};

Constraint.prototype.resolve = function() {

    var diff_x = this.p1.x - this.p2.x,
        diff_y = this.p1.y - this.p2.y,
        dist = Math.sqrt(diff_x * diff_x + diff_y * diff_y),
        diff = (this.length - dist) / dist;

    if (dist > tear_distance) this.p1.remove_constraint(this);

    var px = diff_x * diff * 0.5;
    var py = diff_y * diff * 0.5;

    this.p1.x += px;
    this.p1.y += py;
    this.p2.x -= px;
    this.p2.y -= py;
};

Constraint.prototype.draw = function() {

    ctx.moveTo(this.p1.x, this.p1.y);
    ctx.lineTo(this.p2.x, this.p2.y);
};

var Cloth = function() {

    this.points = [];

    var start_x = canvas.width / 2 - cloth_width * spacing / 2;

    for(var y = 0; y <= cloth_height; y++) {

        for(var x = 0; x <= cloth_width; x++) {

            var p = new Point(start_x + x * spacing, start_y + y * spacing);

            y == 0 && p.pin(p.x, p.y);
            y != 0 && p.attach(this.points[x + (y - 1) * (cloth_width + 1)]);
            x != 0 && p.attach(this.points[this.points.length - 1]);

            this.points.push(p);
        }
    }
};

Cloth.prototype.update = function() {

    var i = physics_accuracy;

    while(i--) {
        var p = this.points.length;
        while(p--) this.points[p].resolve_constraints();
    }

    i = this.points.length;
    while(i--) this.points[i].update(.016);
};

Cloth.prototype.draw = function() {

    ctx.beginPath();

    var i = cloth.points.length;
    while(i--) cloth.points[i].draw();

    ctx.stroke();
};

function update() {

    ctx.clearRect(0, 0, canvas.width, canvas.height);

    cloth.update();
    cloth.draw();

    requestAnimFrame(update);
}

CSS
Notice the canvas element..

* {
     margin: 0;
  overflow:hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;  
}

body {
  background:#333;
}

canvas {
  background:#333;
  width:100%;
  height:376px;
  margin:0 auto;
  display:block;
}

#info {
  position:absolute;
  left:-1px;
  top:-1px;
  width:auto;
  max-width:380px;
  height:auto;
  background:#f2f2f2;
  border-bottom-right-radius:10px;
}

#top {
  background:#fff;
  width:100%;
  height:auto;
  position:relative;
  border-bottom:1px solid #eee;
}

p {
  font-family:Arial, sans-serif;
  color:#666;
  text-align:justify;
  font-size: 16px;
  margin:10px;
}

a {
  font-family:sans-serif;
  color:#444;
  text-decoration:none;
  font-size: 20px;
}

#site {
  float:left;
  margin: 10px;
  color: #38a;
  border-bottom:1px dashed #888;
}

#site:hover {
  color: #7af;
}

#close {
  float:right;
  margin: 10px;
}

#p {
  font-family: Verdana, sans-serif;
  position:absolute;
  right:10px;
  bottom:10px;
  color:#adf;
  border: 1px dashed #555;
  padding:4px 8px;
}

HTML
Notice the canvas element

<canvas id = "c" > </canvas>

<a target="_blank" href="http://codepen.io/stuffit/pen/fhjvk" id="p">New pen: Like playing with physics? Click here!</a>
  
<div id="info">
  <div id="top">
  <a target="_blank" id="site" href="http://lonely-pixel.com">my website</a>
  <a id="close" href="">close</a>
  </div>
  <p>
    <br>
    - Tear the cloth with your mouse.<br><br>
    - Right click and drag to cut the cloth<br><br>
    - Reduce physics_accuracy if it's laggy.<br><br>
  </p>
</div>
  
  

Security consultant hijacks plane's navigation system

A security consultant has demonstrated a successful hack of the plane's navigation system using a custom built android app which could transmit navigation signals to the plane's control system thereby compromising the entire navigation system of the aircraft. It's as if you could control the entire navigation of the plane from the android app. 

Quote : - By taking advantage of two new technologies for the discovery, information gathering and exploitation phases of the attack, and by creating an exploit framework (SIMON) and an Android app (PlaneSploit) that delivers attack messages to the airplanes' Flight Management Systems (computer unit + control display unit), he demonstrated the terrifying ability to take complete control of aircraft by making virtual planes "dance to his tune."

More Here

SimCity on Mac

Gamers who have bought the SimCity for Windows, will get free access to the mac version and vice versa. This is something to look forward to in June.

App Store Changed to US From UK

I had an email from iTunes yesterday, you know the usual weekly ones which highlight the latest and greatest of apps in the store for that week. I viewed it on my phone and clicked the links in the email only to be taken directly to the apps from the App Store. But, a moment later I realised that the App Store version had changed to US!!. I didn't do anything here. ?, I tried in vain to change it back to the UK version, only to be frustrated by a warning message each time from the App Store :- something similar to - You can only use the UK version of the App Store from this apple Id..

Solution :- I went to settings >>iTunes and App Stores >> Sign out and Signed back it. Guess what ? , My App Store popped up and said :- "changing to UK version"..

Fundamental Theory Of Troubleshooting :- Turn if off and on again..

Sigh..!?, Frustrating this..

Boot Camp Drivers

Finally, the much anticipated Windows 8 Bootcamp drivers are here. Well done apple. Thank you for the efforts..I'm installing it now as I type..