I'm just getting started with php, so I've installed apache, changed the owner of the "/var/www" folder to me, and inserted my files within this folder. In the folder I currently have:


I've run everything in html perfect from my desktop, and it's time to start doing some server side programming, so I changed index.html to index.php and shoved it in my web root ( /var/www/ ).

The only problem is, the image doesn't load. Whether the image is set to draw on the canvas as it used to, or on the background via css, the image won't load.

From the index.js file:
function canvasOnLoad()
    var canvas = document.getElementById("clientArea");
    canvas.width = document.documentElement.clientWidth;
    canvas.height = document.documentElement.clientHeight;

    var c2d = canvas.getContext("2d");

    var img = new Image();
    img.src = "/var/www/map.jpg"; // this was simply "map.jpg", both paths don't work.

    img.onload = function ()  
        c2d.drawImage(img, 0, 0, canvas.width, canvas.height); 

    img.onerror = function() { alert("error loading image!"); }

the img.onerror alert keeps getting called.

and from the index.php:
<!DOCTYPE html>
<html >
        <link rel="stylesheet" type="text/css" href="style.css"></link>
        <script type="text/javascript" src="index.js"></script>

        <canvas id="clientArea">NotSupported.</canvas>
Like I said, the code used to work fine on the desktop (and still does).
I've tried changing the file to an html rather than php, no luck.

I have a feeling it has to do with permissions and that apache2 isn't able to send the client the image. I've done no configuring of apache2, it's standard with ubuntu... maybe this is really the source of error?