What i am trying to achieve is creating some objects by following a better pattern. I am using Raphael.js library for creation of graphical shapes.
Problem is at the line:
X: "" + this.canvas_X + this.paper["width"]/2 - self.width/4,
The error i am getting is :
Uncaught TypeError: Cannot read property 'width' of undefined
I figured out that error is at this.paper["width"]/2
. I am new to using javascript and not able to understand what error i am doing
var Graphics={
create_canvas: function(){
$("#canvasdiv").append("<div id='id1' width='80px' height='50px'></div>");
},
canvas_X:get_LEFT_TOP("canvasdiv")[0],
canvas_Y:get_LEFT_TOP("canvasdiv")[1],
canvas_width:function(){return $("#canvasdiv").width()},
canvas_height:function(){return $("#canvasdiv").height()},
paper:{
width:900,
height:700,
create: function(){
return new Raphael(document.getElementById('canvasdiv'),this.width,this.height);
}
},
vswitch:{
color:"Black",
text:"vSwitch",
width:"150",
height:"150",
X: "" + this.canvas_X + this.paper["width"]/2 - self.width/4,
Y: Graphics.canvas_Y,
delay:"2000",
create: function(paper){
setTimeout(function(){
paper.rect(X,Y,width,height).attr({fill : "black"})
},delay);
}
},
}
This is the way the call is being made:
Graphics.create_canvas();
p=Graphics.paper.create();
Graphics.vswitch.create(p);