Khan Academy VS処理2の処理2

Question

だから私はこれをカーンアカデミーで作り、それを私のウェブサイトに置きたいです。

https://www.khanacademy.org/cs/fade-away/4830224329998336

これをJavaScriptに変換するには、以下のコードを入力してください。残念ながらエラーが発生します：あなたはアクティブモードと静的モードを混在させています。これは、Khan Academyの処理で、通常の処理ではありませんか？また、それをうまくいくためにこれを書くことができる他に何を書くことができますか？

//don't forget to click!!!
background(2, 3, 3);

strokeWeight(2);
var x = random;

void setup(){
  size(500,500);
}




void draw(){
   fill(0, 0, 0, 20);
   rect(0,0, 400,400);
    var randomSize = random(20, 60);

     if (mouseIsPressed) { 

        noStroke();
        fill(random(0, 255), random(0, 255), random(0, 255), 373);

        } 

    else {
        noStroke();
        fill(255, 0, 0, 15);
        randomSize=50;
    }
    ellipse(mouseX, mouseY, randomSize, randomSize);
};

.

Answer 1

あなたのコードにはいくつかの問題があります。まず、draw()およびsetup()の外部の関数呼び出しを持つことはできません。それらをsetup()の内側に移動します。第二に、処理中のmouseIsPressedのようなものはありませんが、mousePressedがあります。draw()の閉鎖後にセミコロンを必要としません。ウィンドウ自体は400x500である間、長方形を描画するための500のハードコード化された値も使用します。とにかくそのようなハードコード番号を使用しないでください。内蔵のwidthとheight定数を使用してください。最後に、変数xを使用することは決してないので、それをコメントアウトしました。これが機能するコードです（そして清掃され、フォーマット単位ではありません）。

//don't forget to click!!!

void setup() {
  size(500, 500);
  background(2, 3, 3);
  strokeWeight(2);
  //var x = random;
}

void draw() {
  fill(0, 0, 0, 20);
  rect(0, 0, width, height);
  var randomSize = random(20, 60);
  noStroke();

  if (mousePressed) { 
    fill(random(0, 255), random(0, 255), random(0, 255), 373);
  }  else {
    fill(255, 0, 0, 15);
    randomSize=50;
  }
  ellipse(mouseX, mouseY, randomSize, randomSize);
}

.