Comments by Le_Bedel - CodeProject

Le_Bedel 1-May-11 19:04pm View

Thank you.

Le_Bedel 1-May-11 7:23am View

Thanks a lot. It is working. But I think the philosophy of using it is wrong. I have an animated canvas and I want to re-size the shapes dimension without stop the motion of the canvas. but when it stops whenever the dialog box of "alert" pop up. The more, I want to apply the result as a value of a hidden field. Then take that value and split it and apply them as new values of drawing: radius and size.
Thank you for you time.

Le_Bedel 30-Apr-11 18:22pm View

Thanks again. I try to run a worker example on Chrome and it is running fine. But I don't understand what's wrong in my code. I reduce the code. But still not working and I can't detect the problem.
// worker.js

function applyValues(radius, size) {
return radius + "," + size;
}

/*
Add a event listener to the worker, this will
be called when the worker receives a message
from the main page.
*/
this.onmessage = function(event) {
var data = event.data;
postMessage(applyValues(data.radius, data.size));
};

// Worker
/* Check if Web Workers are supported */
function getWebWorkerSupport() {
return (typeof (Worker) !== "undefined") ? true : false;
}

if (getWebWorkerSupport() == true) {
var radius, size, message;

worker = new worker("worker.js");

/*
Add a event listener to the worker, this will
be called when the worker posts a message.
*/
worker.onmessage = function(event) {
alert(event.data);
document.getElementById("hidden").value = event.data;
};

// Register event for button
document.getElementById("btn").onclick = function() {
radius = document.getElementById("tcircle").value;
size = document.getElementById("tsquare").value;
message = {'radius': radius, 'size': size };
worker.postMessage(message);
}
}

Le_Bedel 28-Apr-11 4:44am View

Thank you. No I am not using chrome. In fact the application target on Blackberry mobile. Anyway I will try then let you know.

Le_Bedel 17-Apr-11 13:35pm View

Thanks. it works. But I don't understand why the following animation looks like static.

// JScript source code

var s_canvas;
var s_context;
var R = 70;
var beta = 0;
var Xs = R * Math.cos(beta);
var Ys = R*Math.sin(beta);
var WIDTH = 400;
var HEIGHT = 300;
var angle = 0;
var tetha = 1.8 * Math.PI / 180;
var counterclockwise=true;
var n = 4;

function draw_square(c,n, x, y, r, angle, counterclockwise) {

c.fillStyle = "00ff00";
c.beginPath();
c.moveTo(x + r * Math.cos(angle), y - r * Math.sin(angle));

var alpha=2*Math.PI/n;

for(var i=1;i

Le_Bedel 16-Apr-11 12:38pm View

The following does not work. I don't know why. I tried all the possibilities as you where I comment out. Either the same problem on clear_circle() either nothing is drawn on the canvas.

var canvasCircle = document.getElementById("canvas_circle");
//var canvasCircle;
var contextCircle;

var theContext = function () {
if (canvasCircle && canvasCircle.getContext) {
//contextCircle = canvasCircle.getContext('2');
return canvasCircle.getContext('2');
};

var x = 400;
var y = 300;
var dx = 2;
var WIDTH = 800;
var HEIGHT = 600;

// Check for canvas support
//function supports_canvas() {
// return !!document.createElement("canvas").getContext('2');
}

// the circle wont make any transsformation.
function draw_circle(x, y, r) {

contextCircle.beginPath();
contextCircle.arc(x, y, r, 0, 2 * Math.PI, true);
contextCircle.closePath();
contextCircle.fill();
}

function clear_canvas() {
contextCircle = theContext();
contextCircle.clearRect(0, 0, WIDTH, HEIGHT);
}

function init() {
// canvasCircle = document.getElementById("canvas_circle");
// canvasCircle = documsent.getElementById("canvas_circle");
// if (canvasCircle && canvasCircle.getContext) {
// contextCircle = canvasCircle.getContext('2');
// return setInterval(draw, 10);
// } else {
// alert('No canvas!');
// }

contextCircle=theContext();
return setInterval(draw,10);
}

function draw() {
clear_canvas();
draw_circle(x, y, 50);

if (x + dx > WIDTH || x + dx < 0)
dx = -dx;
x += dx;

}
window. önload = init;

Comments by Le_Bedel (Top 6 by date)