// addpshot.js - Add a particle at a point on the screen. 
// The particle is an image representing part of a line. 
// By David Turover, September-October 2008.

// Constants that can be used everywhere: 
const X = 0; // Index of X in (x,y) arrays 
const Y = 1; // Index of Y in (x,y) arrays 


// Preload the image
var preloader= document.createElement("img"); 
preloader.src="http://segfault.cs.sonoma.edu/~dturover/graphics/jscommon/pshot.png";
preloader.style.position = "absolute";  // Apply CSS styling.
preloader.style.left = "1px"; // Initializing saves 1ms/1000 calls. YAY. 
preloader.style.top = "1px";


// Place a line particle on the page. pNode is the optional parent node.
function addpshot(x,y, pNode){
        const pshot_offset = [3,3];     // x,y difference from topleft of image to center. 
        // Since the image used as a line particle is wider than 1 pixel,
        // we do not need to draw it every time this function is called.

        var node=preloader.cloneNode(0);                // Make a copy of the preloaded img tag
        node.style.left = x - pshot_offset[X];          // Position the image using CSS 
        node.style.top = y - pshot_offset[Y];

	if(pNode && pNode.appendChild){
		pNode.appendChild(node);
	}

        return node;

	/* Older code would print directly to a div. */
        //var divField = document.body;
        //var divField = document.getElementById("printTarget");
        // divField.appendChild(node);                // Add the image to the document
}