Создание объекта в режиме экземпляра p5.js - PullRequest
Новая
       22

Создание объекта в режиме экземпляра p5.js

0 голосов
/ 12 марта 2019

Я пытаюсь создать экземпляр объекта в режиме экземпляра p5.js, однако у меня много ошибок в свойствах и функциях объекта. 

var sketch1 = function(p){

    var dados = [];

    p.setup = function(){
        var canvas = p.createCanvas(640, 480);
        canvas.parent('area-sketch');

        p.button = p.createButton('Rolar dado');
        p.button.position(p.width, p.height);
        p.button.parent('area-sketch');
        p.button.mouseClicked(p.rolaDado);
    };

    p.draw = function(){
        if(dados.length>0){
            for(var i=0;i<dados.length;i++){
                dados[i].show();
            }
        }
    };

    p.rolaDado = function(){
        var total=0;
        if(dados.length>0){
            for(var i=0;i<dados.length;i++){
                dados[i].shuffle();
                total+=dados[i].getValor();
            }

            return(total);
        }
    };

    p.limpaDados = function(){
        dados = [];
    };

    p.criaDados = function(num){
        for(var i=0;i<num;i++){
            dados.push(new Dado());
        }
    };

    p.limpaTela = function(){
        p.clear();    
    };
};

var mesa_dados = new p5(sketch1);

function Dado(){   

    this.lado = 80;
    this.x = random(1,width-this.lado);
    this.y = random(1,height-this.lado);

    this.type = 6;

    this.show = function(){
        stroke(0,0,0);
        p.fill(255,255,255);

        p.rect(this.x,this.y, this.lado, this.lado);

        switch(this.type){
            case 1:
                fill(0,0,0);
                ellipse(this.x+this.lado*0.5, this.y+this.lado*0.5, 10, 10);
                break;
            case 2:
                fill(0,0,0);
                ellipse(this.x+this.lado*0.25, this.y+this.lado*0.25, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, (this.y+this.lado)-this.lado*0.25, 10, 10);
                break;
            case 3:
                fill(0,0,0);
                ellipse(this.x+this.lado*0.25, this.y+this.lado*0.25, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, (this.y+this.lado)-this.lado*0.25, 10, 10);
                ellipse(this.x+this.lado*0.5, this.y+this.lado*0.5, 10, 10);
                break;
            case 4:
                fill(0,0,0);
                ellipse(this.x+this.lado*0.25, this.y+this.lado*0.25, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, this.y+this.lado*0.25, 10, 10);
                ellipse(this.x+this.lado*0.25, (this.y+this.lado)-this.lado*0.25, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, (this.y+this.lado)-this.lado*0.25, 10, 10);
                break;
            case 5:
                fill(0,0,0);
                ellipse(this.x+this.lado*0.25, this.y+this.lado*0.25, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, this.y+this.lado*0.25, 10, 10);
                ellipse(this.x+this.lado*0.25, (this.y+this.lado)-this.lado*0.25, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, (this.y+this.lado)-this.lado*0.25, 10, 10);
                ellipse(this.x+this.lado*0.5, this.y+this.lado*0.5, 10, 10);
                break;
            case 6:
                fill(0,0,0);
                ellipse(this.x+this.lado*0.25, this.y+this.lado*0.25, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, this.y+this.lado*0.25, 10, 10);
                ellipse(this.x+this.lado*0.25, (this.y+this.lado)-this.lado*0.25, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, (this.y+this.lado)-this.lado*0.25, 10, 10);
                ellipse(this.x+this.lado*0.25, this.y+this.lado*0.5, 10, 10);
                ellipse((this.x+this.lado)-this.lado*0.25, this.y+this.lado*0.5, 10, 10);
                break;
        }

    }

    this.clear = function(){

    }

    this.shuffle = function(){
        this.type = ceil(random(0,6));
    }

    this.shufflePos = function(){
        times = 100;
        speed = 50;
        this.xdirection = random(-1,1);
        this.ydirection = random(-1,1);
    }

    this.getValor = function(){
        return(this.type);
    }
}

Когда я пытаюсь запустить этот код, яполучено сообщение об ошибке:

Uncaught ReferenceError: случайно не определен в новом Dado (dado.js: 4) в p5.p.criaDados (sketch.js: 41)

У меня есть эта ошибка для каждой функции внутри объекта Dado.Когда я тестировал код, но в глобальном режиме p5.js, я не получил эти ошибки.

1 Ответ

0 голосов
/ 12 марта 2019

Функция random, а также вызовы stroke, fill и ellipse все пытаются использовать глобальные версии функций, которые предоставляет вам p5.

Чтобы использовать их вВ режиме экземпляра переместите определение Dado в функцию эскиза и используйте экземпляр p, переданный в функцию: 

var sketch1 = function(p){

    // existing sketch code...

    function Dado(){   

    this.lado = 80;
    this.x = p.random(1,width-this.lado);
    this.y = p.random(1,height-this.lado);

    this.type = 6;

    this.show = function(){
        p.stroke(0,0,0);
        p.fill(255,255,255);

        p.rect(this.x,this.y, this.lado, this.lado);

        switch(this.type){
            case 1:
                p.fill(0,0,0);
                p.ellipse(this.x+this.lado*0.5, this.y+this.lado*0.5, 10, 10);
                break;
            case 2:
        // Rest of Dado etc...
}; // end of sketch1
...