Javascript: How do you call a variable function inside a prototype class?

Question

Okay so we have a project ongoing, and it is to be passed today. But I have a problem. This is the sample code:

output.js

var MapPrintDialog = Class.create();
MapPrintDialog.prototype = {

    // 他の画面からテンプレート情報を更新するために呼ばれる。
comboReload : function() {
    var val = tempComb.getValue();
    tempComb.store.load({
        callback: function(result, o) {
            if (this.store.data.keys.indexOf(val) == -1) {
                this.setValue(this.store.data.keys[0]);
                this.fireEvent("select", this);
            }
        }.createDelegate(tempComb)
    });
},

initialize  :   function(){
    this.define();
},

define  :   function(){
    var DrawPrintAreaFrame = function(mode, noUpdateStatusBarText){
    var cs = getCurrentSetting();

        if (mode == "init" || mode == "edit"){     
            PrintController.DrawMapPrintArea(cs.center.x, cs.center.y, cs.scale, cs.result.PrintMaps[0].Width, cs.result.PrintMaps[0].Height, cs.result.PageRowCount, cs.result.PageColumnCount, mode);
        }
        else if (mode == "delete"){
            PrintFrameManager.ClearPrintFrame();
        }    

        if (noUpdateStatusBarText) {
            gisapp.noUpdateStatusBarText = true;
        }
        gisapp.refreshMap();
    }
}

Now my problem is, how will I call "DrawPrintAreaFrame" from another js file?

I tried:

MapPrintDialog.prototype.define().DrawPrintAreaFrame("edit");
MapPrintDialog.prototype.define.DrawPrintAreaFrame("edit");
MapPrintDialog.define().DrawPrintAreaFrame("edit");
MapPrintDialog.define.DrawPrintAreaFrame("edit");
MapPrintDialog.DrawPrintAreaFrame("edit");
DrawPrintAreaFrame("edit");

but it gives me an error lol. How will I fix this? Please don't be too harsh, I just started learning javascript but they gave me an advanced project which isn't really "beginner" friendly XD

EDIT ----------------------

Okay now i tried to modify it like this:

var MapPrintDialog = Class.create();
MapPrintDialog.prototype = {

    // 他の画面からテンプレート情報を更新するために呼ばれる。
comboReload : function() {
    var val = tempComb.getValue();
    tempComb.store.load({
        callback: function(result, o) {
            if (this.store.data.keys.indexOf(val) == -1) {
                this.setValue(this.store.data.keys[0]);
                this.fireEvent("select", this);
            }
        }.createDelegate(tempComb)
    });
},

initialize  :   function(){
    this.DrawPrintAreaFrame("edit");
    }
}

function DrawPrintAreaFrame(mode, noUpdateStatusBarText){
  var cs = gisapp.getCurrentView();

  if (mode == "init" || mode == "edit"){     
      PrintController.DrawMapPrintArea(cs.center.x, cs.center.y, cs.scale, cs.result.PrintMaps[0].Width, cs.result.PrintMaps[0].Height, cs.result.PageRowCount, cs.result.PageColumnCount, mode);
  }
  else if (mode == "delete"){
      PrintFrameManager.ClearPrintFrame();
  }    

  if (noUpdateStatusBarText) {
      gisapp.noUpdateStatusBarText = true;
  }
  gisapp.refreshMap();
}

But it gives me: Javascript runtime error: Object doesn't support property or method 'DrawPrintAreaFrame'

Answer 1

You have 2 different way:

1- you have to first change it like this:

define  :   function(){
    var DrawPrintAreaFrame = function(mode, noUpdateStatusBarText){
        //You function code
    }
    this.getDrawPrintAreaFrame = function(){
        return DrawPrintAreaFrame;
    }
}

then create your object using your class:

var obj = new MapPrintDialog();
obj.define();
obj.getDrawPrintAreaFrame().call(obj, "edit");

2- remove the define method and add your function to prototype:

MapPrintDialog.prototype.DrawPrintAreaFrame = function(){
    //your function code
}

create your object and simply call your method like this:

var obj = new MapPrintDialog();
obj.DrawPrintAreaFrame("edit");

It's funny, because I said you have 2 ways, and the third one just came up:

3- as far as you use Prototype framework you can use MapPrintDialog.addMethods , which is there to be used to add new instance methods to your class, remove your define and DrawPrintAreaFrame functions and add this:

MapPrintDialog.addMethods({
    DrawPrintAreaFrame: function DrawPrintAreaFrame(){
        //your code
    }
});

or even without removing your method you can use it like:

define  :   function(){
    var DrawPrintAreaFrame = function(mode, noUpdateStatusBarText){
        //You function code
    }
    MapPrintDialog.addMethods({ DrawPrintAreaFrame: DrawPrintAreaFrame });
}

and create your instance and call the method:

var obj = new MapPrintDialog();
obj.DrawPrintAreaFrame("edit");

4- try this if you need your function like a sort of static method, without needing to create a instance:

MapPrintDialog.DrawPrintAreaFrame = function(){
    //You function code
}

and call it like this

MapPrintDialog.DrawPrintAreaFrame("edit");

and if you want to define it in runtime, add the whole definition to your define method like this:

define  :   function(){
    MapPrintDialog.DrawPrintAreaFrame = function(){
        //You function code
    }
}