fiveworlds

What?? If the weight is too much in a mountain type situation then a new stronger compound is usually formed. Plain carbon is soft but that carbon put under enough pressure can become harder than diamond.

I disagree too. The exosphere of a planet is limited to the amount of gas on that planet. The more gas the larger the exosphere. Just because earth doesn't have a mountain that extends beyond the exosphere at the moment doesn't mean that it couldn't ever.

Why would you want to do that? The program would be terribly slow. The only use I know of for primeproducts is https on servers which are limited to 10 digits. The https cert can't be so complicated that a low end device like a phone can't use it for internet banking etc. The more complicated the cert the slower the page load times.

Yes I did. The error you are getting is one thrown by chrome etc as a result of not loading the game in a server. I use brackets for development which comes with a builtin server http://brackets.io/. The game src files are all on the github page. https://github.com/davidmather/game This is the error with the link function I am not getting the scope exactly right so it is causing errors because canvas_img is undefined,

My latest error. I have the following code working fine. window.onload = function () { var canvas = document.getElementById('myCanvas'), context = canvas.getContext('2d'), boundingrect = canvas.getBoundingClientRect(), count = 0, imageObj = new Image(), t, canvas_img = [], offscreenCanvas = document.createElement("canvas"), offscreenContext = offscreenCanvas.getContext("2d"), j, i, mousePos, canvasdata, array = ["crystal.png", "greencrystal.png", "bluecrystal.png", "orangecrystal.png", "redcrystal.png"], lastselected, selectedid, shufflearray = []; function getMousePos(e) { return { x: e.clientX - boundingrect.left, y: e.clientY - boundingrect.top }; } function game() { (function () { for (i = 0; i < array.length; i = i + 1) { offscreenCanvas[i] = document.createElement("canvas"); offscreenCanvas[i].width = 90; offscreenCanvas[i].height = 116; offscreenContext[i] = offscreenCanvas[i].getContext("2d"); imageObj.src = array[i]; offscreenContext[i].drawImage(imageObj, 0, 0, 90, 116); canvasdata = offscreenContext[i].getImageData(0, 0, offscreenCanvas[i].width, offscreenCanvas[i].height); shufflearray[i] = { data : imageObj, imagedata : canvasdata, src : imageObj.src, width : imageObj.naturalWidth, height : imageObj.naturalHeight } } t = canvas_img.length; for (j = 10; j < (canvas.height - imageObj.naturalHeight); j = j + 10 + imageObj.naturalHeight) { for (i = 20; i < (canvas.width - imageObj.naturalWidth); i = i + 10 + imageObj.naturalWidth) { index = Math.floor((Math.random() * 5)).toString(); imageObj.src = array[index]; canvasdata = offscreenContext[index].getImageData(0, 0, offscreenCanvas[index].width, offscreenCanvas[index].height); canvas_img[t] = { x : i, y : j, data : imageObj, imagedata : canvasdata, src : imageObj.src, width : imageObj.naturalWidth, height : imageObj.naturalHeight }; context.fillRect(i,j,imageObj.naturalWidth+10,imageObj.naturalHeight+10); context.drawImage(imageObj, i, j); t = t + 1; } } })(); canvas.addEventListener('click', function (e) { mousePos = getMousePos(e); for (i = 0; i < canvas_img.length; i = i + 1) { if (mousePos.x > canvas_img[i].x && mousePos.y > canvas_img[i].y) { if (mousePos.x < (canvas_img[i].x + canvas_img[i].width) && mousePos.y < (canvas_img[i].y + canvas_img[i].height)) { if (canvas_img[i].imagedata.data[((mousePos.y - canvas_img[i].y) * canvas_img[i].width + (mousePos.x - canvas_img[i].x)) * 4 + 3] !== 0) { select(i); } } } } }); function select (selectedid) { if (parseInt(selectedid, 10) !== lastselected) { if (lastselected === undefined) { lastselected = selectedid; canvas_draw_image("gold",lastselected); } else if (lastselected === selectedid + 10 || lastselected === selectedid - 10 || lastselected === selectedid - 1 || lastselected === selectedid + 1) { canvas_img = array_index_swap(canvas_img, selectedid, lastselected); match = false; match = checklink(lastselected, match); match = checklink(selectedid, match); if (match === false) { canvas_img = array_index_swap(canvas_img, selectedid, lastselected); } lastselected = undefined; } else { canvas_draw_image("black",lastselected); lastselected = parseInt(selectedid, 10); canvas_draw_image("gold",lastselected); } } } function checklink(temp, match) { var rootimage = canvas_img[temp].src, i = ""; if (temp > 30) { if (canvas_img[temp - 10].src === rootimage && canvas_img[temp - 20].src === rootimage && canvas_img[temp - 30].src === rootimage) { match = true; for (i = temp; i > 0; i = i - 10) { if (i > 40) { canvas_img = array_index_swap(canvas_img, i, i-40); } else { canvas_img = array_index_random_shuffle_swap(i); } } } } if (temp > 20) { if (canvas_img[temp - 10].src === rootimage && canvas_img[temp - 20].src === rootimage) { match = true; for (i = temp; i > 0; i = i - 10) { if (i > 30) { canvas_img = array_index_swap(canvas_img, i, i-30); } else { canvas_img = array_index_random_shuffle_swap(i); } } } } if (temp < 70) { if (canvas_img[temp + 10].src === rootimage && canvas_img[temp + 20].src === rootimage && canvas_img[temp + 30].src === rootimage) { match = true; for (i = temp + 30; i > 0; i = i - 10) { if (i > 40) { canvas_img = array_index_swap(canvas_img, i, i-40); } else { canvas_img = array_index_random_shuffle_swap(i); } } } } if (temp < 80) { if (canvas_img[temp + 10].src === rootimage && canvas_img[temp + 20].src === rootimage) { match = true; for (i = temp + 20; i > 0; i = i - 10) { if (i > 30) { canvas_img = array_index_swap(canvas_img, i, i-30); } else { canvas_img = array_index_random_shuffle_swap(i); } } } } if (temp > 10 && temp < 90) { if (canvas_img[temp - 10].src === rootimage && canvas_img[temp + 10].src === rootimage) { match = true; for (i = temp + 10; i > 0; i = i - 10) { if (i > 30) { canvas_img = array_index_swap(canvas_img, i, i-30); } else { canvas_img = array_index_random_shuffle_swap(i); } } } } if (temp.toString().slice(-1).indexOf(7) === -1 && temp.toString().slice(-1).indexOf(8) === -1 && temp.toString().slice(-1).indexOf(9) === -1) { if (canvas_img[temp + 1].src === rootimage && canvas_img[temp + 2].src === rootimage && canvas_img[temp + 3].src === rootimage) { match = true; for (i = temp; i > 0; i = i - 10) { if (i > 10) { canvas_img = array_index_swap(canvas_img, i, i-10); canvas_img = array_index_swap(canvas_img, i+1, i-11); canvas_img = array_index_swap(canvas_img, i+2, i-12); canvas_img = array_index_swap(canvas_img, i+3, i-13); } else { canvas_img = array_index_random_shuffle_swap(i); canvas_img = array_index_random_shuffle_swap(i+1); canvas_img = array_index_random_shuffle_swap(i+2); } } } } if (temp.toString().slice(-1).indexOf(8) === -1 && temp.toString().slice(-1).indexOf(9) === -1) { if (canvas_img[temp + 1].src === rootimage && canvas_img[temp + 2].src === rootimage) { match = true; for (i = temp; i > 0; i = i - 10) { if (i > 10) { canvas_img = array_index_swap(canvas_img, i, i-10); canvas_img = array_index_swap(canvas_img, i+1, i-11); canvas_img = array_index_swap(canvas_img, i+2, i-12); } else { canvas_img = array_index_random_shuffle_swap(i); canvas_img = array_index_random_shuffle_swap(i+1); canvas_img = array_index_random_shuffle_swap(i+2); } } } } if (temp.toString().slice(-1).indexOf(2) === -1 && temp.toString().slice(-1).indexOf(1) === -1 && temp.toString().slice(-1).indexOf(0) === -1) { if (canvas_img[temp - 1].src === rootimage && canvas_img[temp - 2].src === rootimage && canvas_img[temp - 3].src === rootimage) { match = true; for (i = temp; i > 0; i = i - 10) { if (i > 10) { canvas_img = array_index_swap(canvas_img, i, i-10); canvas_img = array_index_swap(canvas_img, i-1, i-11); canvas_img = array_index_swap(canvas_img, i-2, i-12); canvas_img = array_index_swap(canvas_img, i-3, i-13); } else { canvas_img = array_index_random_shuffle_swap(i); canvas_img = array_index_random_shuffle_swap(i-1); canvas_img = array_index_random_shuffle_swap(i-2); canvas_img = array_index_random_shuffle_swap(i-3); } } } } if (temp.toString().slice(-1).indexOf(1) === -1 && temp.toString().slice(-1).indexOf(0) === -1) { if (canvas_img[temp - 1].src === rootimage && canvas_img[temp - 2].src === rootimage) { match = true; for (i = temp; i > 0; i = i - 10) { if (i > 10) { canvas_img = array_index_swap(canvas_img, i, i-10); canvas_img = array_index_swap(canvas_img, i-1, i-11); canvas_img = array_index_swap(canvas_img, i-2, i-12); } else { canvas_img = array_index_random_shuffle_swap(i); canvas_img = array_index_random_shuffle_swap(i-1); canvas_img = array_index_random_shuffle_swap(i-2); } } } } if (temp.toString().slice(-1).indexOf(8) === -1 && temp.toString().slice(-1).indexOf(9) === -1) { if (canvas_img[temp - 1].src === rootimage && canvas_img[temp + 1].src === rootimage) { match = true; for (i = temp; i > 0; i = i - 10) { if (i > 10) { canvas_img = array_index_swap(canvas_img, i, i-10); canvas_img = array_index_swap(canvas_img, i-1, i-11); canvas_img = array_index_swap(canvas_img, i+1, i+11); } else { canvas_img = array_index_random_shuffle_swap(i); canvas_img = array_index_random_shuffle_swap(i-1); canvas_img = array_index_random_shuffle_swap(i+1); } } } } return match; } function array_index_random_shuffle_swap(i) { randomindex = Math.floor((Math.random() * 5)).toString(); canvas_img[i].data = shufflearray[randomindex].data; canvas_img[i].imagedata = shufflearray[randomindex].imagedata; canvas_img[i].src = shufflearray[randomindex].src; canvas_img[i].width = shufflearray[randomindex].width; canvas_img[i].height = shufflearray[randomindex].height; canvas_draw_image("black",i); return canvas_img; } function array_index_swap(array, selectedid, lastselected){ temp = [array[selectedid].src, array[selectedid].data, array[selectedid].imagedata]; array[selectedid].src = array[lastselected].src; array[selectedid].data = array[lastselected].data; array[selectedid].imagedata = array[lastselected].imagedata; array[lastselected].src = temp[0]; array[lastselected].data = temp[1]; array[lastselected].imagedata = temp[2]; canvas_draw_image("black",lastselected); canvas_draw_image("black",selectedid); return array; } function canvas_draw_image(fillStyle,index){ context.fillStyle=fillStyle; context.fillRect(canvas_img[index].x,canvas_img[index].y,canvas_img[index].width,canvas_img[index].height); imageObj.src=canvas_img[index].src; context.drawImage(imageObj, canvas_img[index].x, canvas_img[index].y); } } function ImagePreloader(array) { function LoadImage(url, index) { var img = new Image(); img.onload = function () { count = count + 1; if (count === array.length) {game(); } }; img.onerror = function () {}; img.src = url; } function LoadImages(array) { var index; for (index = 0; index < array.length; index = index + 1) { LoadImage(array[index], index); } } LoadImages(array); } array = array.reverse().filter(function (e, i, array) { return array.indexOf(e, i + 1) === -1; }).reverse(); ImagePreloader(array); }; But when I try writing the if statements as a single function I am getting a scoping error where canvas_img is undefined. window.onload = function () { var canvas = document.getElementById('myCanvas'), context = canvas.getContext('2d'), boundingrect = canvas.getBoundingClientRect(), count = 0, imageObj = new Image(), t, canvas_img = [], offscreenCanvas = document.createElement("canvas"), offscreenContext = offscreenCanvas.getContext("2d"), j, i, mousePos, canvasdata, array = ["crystal.png", "greencrystal.png", "bluecrystal.png", "orangecrystal.png", "redcrystal.png"], lastselected, selectedid, shufflearray = []; function getMousePos(e) { return { x: e.clientX - boundingrect.left, y: e.clientY - boundingrect.top }; } function game() { (function () { for (i = 0; i < array.length; i = i + 1) { offscreenCanvas[i] = document.createElement("canvas"); offscreenCanvas[i].width = 90; offscreenCanvas[i].height = 116; offscreenContext[i] = offscreenCanvas[i].getContext("2d"); imageObj.src = array[i]; offscreenContext[i].drawImage(imageObj, 0, 0, 90, 116); canvasdata = offscreenContext[i].getImageData(0, 0, offscreenCanvas[i].width, offscreenCanvas[i].height); shufflearray[i] = { data : imageObj, imagedata : canvasdata, src : imageObj.src, width : imageObj.naturalWidth, height : imageObj.naturalHeight } } t = canvas_img.length; for (j = 10; j < (canvas.height - imageObj.naturalHeight); j = j + 10 + imageObj.naturalHeight) { for (i = 20; i < (canvas.width - imageObj.naturalWidth); i = i + 10 + imageObj.naturalWidth) { index = Math.floor((Math.random() * 5)).toString(); imageObj.src = array[index]; canvasdata = offscreenContext[index].getImageData(0, 0, offscreenCanvas[index].width, offscreenCanvas[index].height); canvas_img[t] = { x : i, y : j, data : imageObj, imagedata : canvasdata, src : imageObj.src, width : imageObj.naturalWidth, height : imageObj.naturalHeight }; context.fillRect(i,j,imageObj.naturalWidth+10,imageObj.naturalHeight+10); context.drawImage(imageObj, i, j); t = t + 1; } } })(); canvas.addEventListener('click', function (e) { mousePos = getMousePos(e); for (i = 0; i < canvas_img.length; i = i + 1) { if (mousePos.x > canvas_img[i].x && mousePos.y > canvas_img[i].y) { if (mousePos.x < (canvas_img[i].x + canvas_img[i].width) && mousePos.y < (canvas_img[i].y + canvas_img[i].height)) { if (canvas_img[i].imagedata.data[((mousePos.y - canvas_img[i].y) * canvas_img[i].width + (mousePos.x - canvas_img[i].x)) * 4 + 3] !== 0) { select(i); } } } } }); function select (selectedid) { if (parseInt(selectedid, 10) !== lastselected) { if (lastselected === undefined) { lastselected = selectedid; canvas_draw_image("gold",lastselected); } else if (lastselected === selectedid + 10 || lastselected === selectedid - 10 || lastselected === selectedid - 1 || lastselected === selectedid + 1) { canvas_img = array_index_swap(canvas_img, selectedid, lastselected); match = false; returned_variables = checklink(lastselected, match); match = returned_variables[0]; canvas_img = returned_variables[1]; returned_variables = checklink(selectedid, match); match = returned_variables[0]; canvas_img = returned_variables[1]; if (match === false) { canvas_img = array_index_swap(canvas_img, selectedid, lastselected); } lastselected = undefined; } else { canvas_draw_image("black",lastselected); lastselected = parseInt(selectedid, 10); canvas_draw_image("gold",lastselected); } } } function checklink(temp, match) { var rootimage = canvas_img[temp].src, i = "", linkarray = [ { "firstif": "temp > 30", "secondif": "canvas_img[temp - 10].src === rootimage && canvas_img[temp - 20].src === rootimage && canvas_img[temp - 30].src === rootimage", "g": 40, "h": 0, "score": 100 }, { "firstif": "temp > 20", "secondif": "canvas_img[temp - 10].src === rootimage && canvas_img[temp - 20].src === rootimage", "g": 30, "h": 0, "score": 100 }, { "firstif": "temp < 70", "secondif": "canvas_img[temp + 10].src === rootimage && canvas_img[temp + 20].src === rootimage && canvas_img[temp + 30].src === rootimage", "g": 40, "h": 30, "score": 100 }, { "firstif": "temp < 80", "secondif": "canvas_img[temp + 10].src === rootimage && canvas_img[temp + 20].src === rootimage", "g": 30, "h": 20, "score": 100 }, { "firstif": "temp > 10 && temp < 90", "secondif": "canvas_img[temp - 10].src === rootimage && canvas_img[temp + 10].src === rootimage", "g": 30, "h": 10, "score": 100 }, { "firstif": "temp.toString().slice(-1).indexOf(7) === -1 && temp.toString().slice(-1).indexOf(8) === -1 && temp.toString().slice(-1).indexOf(9) === -1", "secondif": "canvas_img[temp + 1].src === rootimage && canvas_img[temp + 2].src === rootimage && canvas_img[temp + 3].src === rootimage", "a": 1, "b": 2, "c": 11, "d": 12, "e": 3, "f": 12, "g": 10, "h": 0, "score": 100 }, { "firstif": "temp.toString().slice(-1).indexOf(8) === -1 && temp.toString().slice(-1).indexOf(9) === -1", "secondif": "canvas_img[temp + 1].src === rootimage && canvas_img[temp + 2].src === rootimage", "a": 1,"b": 2,"c": 11,"d": 12,"g": 10,"h": 0,"score": 100 }, { "firstif": "temp.toString().slice(-1).indexOf(2) === -1 && temp.toString().slice(-1).indexOf(1) === -1 && temp.toString().slice(-1).indexOf(0) === -1", "secondif": "canvas_img[temp - 1].src === rootimage && canvas_img[temp - 2].src === rootimage && canvas_img[temp - 3].src === rootimage", "a": -1,"b": -2,"c": 11,"d": 12,"e": -3,"f": 13,"g": 10,"h": 0,"score": 100 }, { "firstif": "temp.toString().slice(-1).indexOf(1) === -1 && temp.toString().slice(-1).indexOf(0) === -1", "secondif": "canvas_img[temp - 1].src === rootimage && canvas_img[temp - 2].src === rootimage", "a": -1, "b": -2, "c": 11, "d": 12, "g": 10, "h": 0, "score": 100 }, { "firstif": "temp.toString().slice(-1).indexOf(9) === -1 && temp.toString().slice(-1).indexOf(0) === -1", "secondif": "canvas_img[temp - 1].src === rootimage && canvas_img[temp + 1].src === rootimage", "a": -1, "b": 1, "c": 11, "d": -11, "g": 10, "h": 0, "score": 100 } ]; for(i=0; i<array.length; i=i+1){ a=linkarray[i]; returned_variables = link(a.firstif,a.secondif,temp,canvas_img,a.a,a.b,a.c,a.d,a.e,a.f,a.g,a.h,match,rootimage,a.score); match = returned_variables[0]; canvas_img = returned_variables[1]; } return returned_variables; } function link(firstif,secondif,temp,canvas_img,a,b,c,d,e,f,g,h,match,rootimage,score){ firstif = window.eval.call(window,'(function (canvas_img,temp,rootimage) {return '+firstif+';})')(canvas_img,temp,rootimage); if (Boolean(firstif)) { secondif = window.eval.call(window,'(function (canvas_img,temp,rootimage) {return '+secondif+';})')(canvas_img,temp,rootimage); if (Boolean(secondif)) { match = true; for (i = temp + h; i > 0; i = i - 10) { if (i > g) { canvas_img = array_index_swap(canvas_img, i, i-g); if(a){canvas_img = array_index_swap(canvas_img, i+a, i-c);} if(b){canvas_img = array_index_swap(canvas_img, i+b, i-d);} if(e){canvas_img = array_index_swap(canvas_img, i+e, i-f);} } else { array_index_random_shuffle_swap(i); if(a){canvas_img = array_index_random_shuffle_swap(i+a);} if(b){canvas_img = array_index_random_shuffle_swap(i+b);} if(e){canvas_img = array_index_random_shuffle_swap(i+e);} } } } } returned_variables = [match,canvas_img]; return returned_variables; } function array_index_random_shuffle_swap(i) { randomindex = Math.floor((Math.random() * 5)).toString(); canvas_img[i].data = shufflearray[randomindex].data; canvas_img[i].imagedata = shufflearray[randomindex].imagedata; canvas_img[i].src = shufflearray[randomindex].src; canvas_img[i].width = shufflearray[randomindex].width; canvas_img[i].height = shufflearray[randomindex].height; canvas_draw_image("black",i); return canvas_img; } function array_index_swap(array, selectedid, lastselected){ temp = [array[selectedid].src, array[selectedid].data, array[selectedid].imagedata]; array[selectedid].src = array[lastselected].src; array[selectedid].data = array[lastselected].data; array[selectedid].imagedata = array[lastselected].imagedata; array[lastselected].src = temp[0]; array[lastselected].data = temp[1]; array[lastselected].imagedata = temp[2]; canvas_draw_image("black",lastselected); canvas_draw_image("black",selectedid); return array; } function canvas_draw_image(fillStyle,index){ context.fillStyle=fillStyle; context.fillRect(canvas_img[index].x,canvas_img[index].y,canvas_img[index].width,canvas_img[index].height); imageObj.src=canvas_img[index].src; context.drawImage(imageObj, canvas_img[index].x, canvas_img[index].y); } } function ImagePreloader(array) { function LoadImage(url, index) { var img = new Image(); img.onload = function () { count = count + 1; if (count === array.length) {game(); } }; img.onerror = function () {}; img.src = url; } function LoadImages(array) { var index; for (index = 0; index < array.length; index = index + 1) { LoadImage(array[index], index); } } LoadImages(array); } array = array.reverse().filter(function (e, i, array) { return array.indexOf(e, i + 1) === -1; }).reverse(); ImagePreloader(array); };

Not really most calculators only go to 10 digits. Servers usually have a max int 2,147,483,647 . Javascript has a max int 2 ^ 53.

primeproduct = number. If((product>file_get_contents(largest_prime_in_database)*file_get_contents(largest_prime_in_database))!==true) { if(file_exists(prime_product/primeproduct)){ echo file_get_contents(primeproduct);} else {echo "That isn't a prime product";} } else{solve_new_primes();}

That's Apache webserver as I was saying there seems to be no way of just running the file from my desktop without using a webserver. You can't set the header using xmlhttprequests previous = undefined; function pagereloader() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (xhttp.readyState == 4 && xhttp.status == 200) { current = escape(xhttp.responseText.toString()); if(previous){ if(previous!==current){location.reload();} } previous=current; } }; xhttp.open("GET", window.location.href, true); xhttp.setRequestHeader("Access-Control-Allow-Origin","*"); xhttp.send(); } setTimeout(pagereloader, 1000); returned... XMLHttpRequest cannot load file:///C:/Users/David/Desktop/New%20folder%20(5)/test.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

Yeah only Kirby's method didn't refer to things I could do on my server (or settings on a server that was hosting me) and it didn't work the error was still thrown. I tried the mozilla method https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image var img = new Image, canvas = document.createElement("canvas"), ctx = canvas.getContext("2d"), src = "http://example.com/image"; // insert image url here img.crossOrigin = "Anonymous"; img.onload = function() { canvas.width = img.width; canvas.height = img.height; ctx.drawImage( img, 0, 0 ); localStorage.setItem( "savedImageData", canvas.toDataURL("image/png") ); } img.src = src; // make sure the load event fires for cached images too if ( img.complete || img.complete === undefined ) { img.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="; img.src = src; } but got the error Image from origin 'file://' has been blocked from loading by Cross-Origin Resource Sharing policy: Invalid response. Origin 'null' is therefore not allowed access. It would probably work on localhost but I am trying to make it work just running the file from my desktop.

console.log(offscreenCanvas.width offscreenCanvas.height); Returns 172 250. So both variables are set. There is no error if run on my server but then the path isn't the file:/// method it is http://. Why would the file method cause an error??

You can walk on custard....

While writing a click event listener with transparency I noticed the code was throwing a weird error in chrome. Uncaught SecurityError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data. If I run the code on my server as localhost or my domain it isn't throwing an error. <!DOCTYPE HTML> <html> <head> <style> body { margin: 0px; padding: 0px; } </style> </head> <body> <canvas id="myCanvas" width="800" height="400"></canvas> <script> var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); var boundingrect = canvas.getBoundingClientRect(); function getMousePos(e) { return { x: e.clientX - boundingrect.left, y: e.clientY - boundingrect.top }; } var imageObj = new Image(); imageObj.onload = function() { canvas_img = []; t=canvas_img.length; offscreenCanvas = document.createElement("canvas"); offscreenCanvas.width = imageObj.naturalWidth; offscreenCanvas.height = imageObj.naturalHeight; offscreenContext = offscreenCanvas.getContext("2d"); offscreenContext.drawImage(imageObj, 0, 0); canvasdata=offscreenContext.getImageData(0,0, offscreenCanvas.width, offscreenCanvas.height); for (j=10; j<(canvas.height-imageObj.naturalHeight); j=j+10+imageObj.naturalHeight){ for (i=10; i<(canvas.width-imageObj.naturalWidth); i=i+10+imageObj.naturalWidth){ canvas_img[t]={ x : i, y : j, data : imageObj, imagedata : canvasdata, src : imageObj.src, width : imageObj.naturalWidth, height : imageObj.naturalHeight }; context.drawImage(imageObj, i, j); t=t+1; } } }; imageObj.src = 'king_of_hearts.png'; canvas.addEventListener('click', function(e) { mousePos = getMousePos(e); for(i=0; i<canvas_img.length; i++){ if(mousePos.x > canvas_img[i].x && mousePos.y > canvas_img[i].y) { if(mousePos.x < (canvas_img[i].x+canvas_img[i].width) && mousePos.y < (canvas_img[i].y+canvas_img[i].height)) { if(canvas_img[i].imagedata.data[((mousePos.y-canvas_img[i].y)*canvas_img[i].width+(mousePos.x-canvas_img[i].x))*4+3]===0){ } else { alert(canvas_img[i].src); } } } } }); </script> </body> </html>

I'd use canvas{position:fixed;top:0px;left:0px;width:100%;height:100%} to make them overlap. It is good practice to make all games suited to being put in an iframe because most sites with games force you to use iframes facebook etc.

Why would you do that?? A game should be made with. body{margin:0px;} canvas{width:100%;height:100%;} This allows the game to run full-screen on all platforms. Then if you are including a game in a container it should be in an iframe. I did look at doing things that way too. However if you have multiple canvases all the event listeners have to be on the topmost canvas.

Okay so I eventually figured out how to do it using offscreen canvas. The idea being that prior to drawing my text on the canvas I save the portion of the background that it covers to the offscreen canvas and so only redraw that section when the text is updated. <canvas id="myCanvas" width="578" height="200"></canvas> <script> var message, canvas = document.getElementById('myCanvas'), context = canvas.getContext('2d'), boundingrect = canvas.getBoundingClientRect(); function getMousePos(e) { return { x: e.clientX - boundingrect.left, y: e.clientY - boundingrect.top }; } context.fillStyle = 'green'; context.fillRect(0,0,200,100); offscreenCanvas = document.createElement("canvas"); offscreenCanvas.width = canvas.width; offscreenCanvas.height = 26; offscreenContext = offscreenCanvas.getContext("2d"); offscreenContext.canvasdata = context.getImageData(0, 0, canvas.width, canvas.height); offscreenContext.putImageData(offscreenContext.canvasdata,0,0); canvas.addEventListener('mousemove', function(e) { mousePos = getMousePos(e); message = 'Mouse position: ' + mousePos.x + ',' + mousePos.y; context.clearRect(0, 0, canvas.width, 26); context.fillStyle = 'black'; context.putImageData (offscreenContext.getImageData(0, 0, canvas.width, canvas.height),0,0); context.font = '18pt Times New Roman'; context.fillStyle = 'black'; context.globalAlpha = 1; context.fillText(message, 0, 18); }, false); </script>

Okay well that was actually very helpful. Still haven't got it perfect though. I can create an offscreen canvas layer and then merge the layers. However at the moment it isn't detecting transparency around the text perfectly it has a white border.

Trying to update text in canvas saving the background. So far I haven't been able to not use clear rect. I can do it using a framework but I would rather be able to do it without one. Here I can save the background data and then redraw it but that isn't a good solution. Is there a way to update already filled text??

Being immortal doesn't make you invincible.

Think about it lobsters are supposedly immortal we still eat them.

This error is usually caused by trying to view an app when the minimum sdk version is above your android device's sdk version. Earlier versions of android couldn't do certain things for instance web-view didn't support javascript eval.

You wouldn't be immortal though ... not really. Many animals don't die normally however they can always be killed. Something will kill you eventually.

Okay, there is one way of making the function work .... using eval(). I tend not to use eval as it is considered bad practice.

It happens to a lot of people including myself. Usually I would ask somebody else to check my work for errors.

It'll fail on cannot find .src of undefined. See for yourself. The problem being that images[temp].src is being evaluated in the array. I don't know if there is a way to pass a variable to an if statement in a function without it being evaluated beforehand. "" won't work because it will convert the variable to a string. I would need to use a non existant variable type unevaluated boolean. I took out the promises because when I tested it on the ipad the promises were unsupported and caused a whitescreen. I was either going to use tiles like scrabble letters or just switch .src with .innerhtml. Pretty much i think i will have to put the words in instead of expecting the game to generate the words because there are so few vowels compared to constants. I will also need to look at removing letters that aren't used. If I just put all the letters of the alphabet in I'd be lucky to get a single word out of it.

My mom is a primary school teacher but she is getting old now and so she moved into some special needs assistant work at her school. She wanted me to make a game for her school ipad where she could have the kid match words from a list she could set.