javascript Calling parent function from child object

[SilicateWielder]

Hello,

 

I am currently messing around with Snap, an implementation of Scratch that allows one to write their code in Javascript. I've run into a bit of an issue.

 

So, I have this code that I've been writing, all it does is allow me to create circular objects and store them as images for later use.

 

// Make sure we have no duplicates, just delete EVERYTHING.
this.costumes = new List();

Wcx = [];
Wcy = [];
Wcs = [];
Wcp = [];
Wcc = [];

// Used to convert degrees to radians, for ease of use.
function toRads (degrees)
{
 return degrees * 0.0174532925 
};

// Circle class begin.
circle = function (radius, x, y)
{
  this.radius = 0.985 * radius;
  this.posX = x;
  this.posY = y;
  this.color = {}
  this.color.r = 0;
  this.color.g = 0;
  this.color.b = 255;

  this.Xmatrix = [];
  this.Ymatrix = [];
  this.offset = [x, y];
  this.moved = false;

  // Generate the coordinate table needed to draw our object.
  it = 0;
  while (it < toRads(360))
  {
    this.Xmatrix.push(Math.sin(it) * this.radius) - (Math.cos(it) * this.radius);
    this.Ymatrix.push(Math.cos(it) * this.radius) + (Math.sin(it) * this.radius);
    it = it + 0.0174532925;
  };
};

circle.prototype = {};

// We can now export our drawings as images, remove this.
circle.prototype.position = function (offX, offY)
{
  if (this.offset[0] == offX)
  {
    if (this.moved == true) 
    {
      this.moved = false;
    };
  } else if (this.moved == false)
  {
    this.moved = true;
  };

  if (this.offset[1] == offY)
  {
    if (this.moved == true)
    {
      this.moved = false;
    };
  } else if (this.moed == false)
  {
    this.moved = true;
  };
  
  if (this.moved = true)
  {
    this.offset = [offX, offY];
  };
};

// Inject our point array into the world buffer.
circle.prototype.inject = function (mode = "OUTLINE")
{
  a = 0;
  sic = 2 / 90 * this.radius;
  if (mode == "OUTLINE") {
    
    while (a < this.Xmatrix.length)
    {
      Wcx[Wcx.length] = (this.Xmatrix[a] + this.offset[0]);
      Wcy[Wcy.length] = (this.Ymatrix[a] + this.offset[1]);
      Wcs[Wcs.length] = false;
      Wcs[Wcs.length] = false;
      Wcp[Wcp.length] = this.radius;
      Wcp[Wcp.length] = this.radius;
      Wcc[Wcc.length] = [this.color.r, this.color.g, this.color.b];
      Wcc[Wcc.length] = [this.color.r, this.color.g, this.color.b];
      a = a + 1;
    };
  } else if (mode == "FILLED") {
    while (a < this.Xmatrix.length / 2)
    {
      Wcx[Wcx.length] = -1 * (this.Xmatrix[a] + this.offset[0]);
      Wcx[Wcx.length] = (this.Xmatrix[a] + this.offset[0]);
      Wcy[Wcy.length] = (this.Ymatrix[a] + this.offset[1]);
      Wcy[Wcy.length] = (this.Ymatrix[a] + this.offset[1]);
      Wcs[Wcs.length] = false;
      Wcs[Wcs.length] = false;
      Wcp[Wcp.length] = sic;
      Wcp[Wcp.length] = sic;
      Wcc[Wcc.length] = [this.color.r, this.color.g, this.color.b];
      Wcc[Wcc.length] = [this.color.r, this.color.g, this.color.b];
      a = a + 1
    };
  }
  Wcx[Wcx.length] = this.offset[0];
  Wcy[Wcy.length] = this.offset[1];
  Wcs[Wcs.length] = true;
  Wcp[Wcp.length] = 1;
  Wcc[Wcc.length] = [this.color.r, this.color.g, this.color.b];
};

// Sets the color of our circle.
circle.prototype.changeColor = function (ra, ga, ba)
{
  this.color = {};
  this.color.r = ra;
  this.color.g = ga;
  this.color.b = ba;
};
// End circle class.

// Begin light class, incomplete.
particle = function (color, Xp, Yp, wid, hei)
{
  this.color = {};
  this.color.r = color[0];
  this.color.g = color[1];
  this.color.b = color[2];

  this.posX = Xp;
  this.posY = Yp;
  this.width = wid;
  this.height = hei;

  this.matrix = {};
  this.matrix.x = [];
  this.matrix.y = [];
  this.matrix.color = {};
  this.matrix.color.r = color[0];
  this.matrix.color.g = color[1];
  this.matrix.color.b = color[2];

  multiplier = 1;
  while (multiplier < 100)
  {
    Wc = multiplier / 100 * this.width;
    Hc = multiplier / 100 * this.height;

    Cc = {}
    Cc.r = multiplier / 100 * this.color.r;
    Cc.g = multiplier / 100 * this.color.g;
    Cc.b = multiplier / 100 * this.color.b;

    multiplier = multiplier + 1
  };  
};
// End light class.

// Testing code, begin
starBorder = new circle (300, 0,0);
starBody = new circle (280, 0, 0);

starBorder.changeColor(250, 230, 0);
starBody.changeColor(250, 220, 0);

starBorder.inject("FILLED");
starBody.inject("FILLED");
// Testing code, end.

// Begin drawing our object.
this.clear();
this.gotoXY(Wcx[0], Wcy[0]);
this.down(0);
wa = 0;

while (wa < Wcx.length)
{
  if (Wcs[wa] == true)
  {
    if (wa < Wcx.length)
    {
      this.up();
      this.gotoXY(Wcx[wa], Wcy[wa]);
      this.down();
    }
  } else {
    this.setColor(new Color(Wcc[wa][0], Wcc[wa][1], Wcc[wa][2]));
    this.setSize(Wcp[a]);
    this.gotoXY(Wcx[wa], Wcy[wa]);
  };
    
  wa = wa + 1
};


//Take our drawing and turn it into a costume.
var cst = new Costume(
  this.parentThatIsA(StageMorph).trailsCanvas
);
cst.shrinkWrap();
cst.name = this.newCostumeName("tesT", null);
this.addCostume(cst);
this.wearCostume(cst);

// Now that we've created our image, lets clear the screen so we can use it.
this.clear();
this.up();
this.gotoXY(0, 0);

the code actually runs within this block of code here, which contains all of my functions and variables.

function anonymous (/**/)
{
  // Code gets contatenated between the curly brackets.
}

this anonymous function contains all of the variables, objects, and functions I need in order to write working code. how can I create a function within this, and still access the parent objects and functions?

[mikat]

What do you mean? A function declared inside the anonymous function can still see and modify the variables outside the anonymous function but just not the other way around

var a = 1;

function anon() {
  var b = 4;
  function hey() {
    console.log(a); // 1
    console.log(b); // 4
  }
  
  hey();
}

anon();

console.log(b); // undefined

 

[SilicateWielder]

13 minutes ago, mikat said:

What do you mean? A function declared inside the anonymous function can still see and modify the variables outside the anonymous function but just not the other way around

var a = 1;

function anon() {
  var b = 4;
  function hey() {
    console.log(a); // 1
    console.log(b); // 4
  }
  
  hey();
}

anon();

console.log(b); // undefined

 

That was my assumption but when I call this.gotoXY(x, y) or parent.gotoXY(x, y) returns "TypeError this.gotoXY is not a function"

[mikat]

12 minutes ago, UnbrokenMotion said:

That was my assumption but when I call this.gotoXY(x, y) or parent.gotoXY(x, y) returns "TypeError this.gotoXY is not a function"

can you post the output of this command (needs to be invoked from the same place you invoke this.gotoXY from

console.log(this)

 

[SilicateWielder]

3 minutes ago, mikat said:

can you post the output of this command (needs to be invoked from the same place you invoke this.gotoXY from

console.log(this)

 

this is the output...

 

a SpriteMorph 0 [1048@179 | 60@60]
	

[mikat]

 

1 minute ago, UnbrokenMotion said:

this is the output...

 

 

a SpriteMorph 0 [1048@179 | 60@60]
	

 

hmm that doesn't help me much, but can you try creating the functions outside of the anon function? you don't need to include them into the anon function