# Question switched to p5.js category

**URL:** <https://discourse.processing.org/t/question-switched-to-p5-js-category/1608>\
**Category:** Coding Questions\
**Created:** [July 9, 2018, 5:50am UTC](https://discourse.processing.org/t/question-switched-to-p5-js-category/1608 "2018-07-09T05:50:42Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![ville2008](https://avatars.discourse-cdn.com/v4/letter/v/9fc348/32.png) [@ville2008](https://discourse.processing.org/u/ville2008)\
**Post date:** [July 9, 2018, 5:50am UTC](https://discourse.processing.org/t/question-switched-to-p5-js-category/1608/1 "2018-07-09T05:50:42Z")

</div>

when i play my game and eat a food and then move it sometimes removes my scale heres my source code

sketch source: (where my move runs)

```auto
var s;
var scl = 20;
var food = 20;
var foods = 0;
var foodU = foods;

function setup() {
  createCanvas(600,600)
  s = new snake();
  frameRate(10)
  PickLocation()
  console.log(foods)
}

function draw() {
  background(51);
  s.update()
  s.show()

  if(s.eat(food))
    PickLocation()

  fill(255, 0, 100);
  rect(food.x, food.y, scl, scl)
}

function PickLocation() {
  var cols = floor(width/scl);
  var rows = floor(height/scl);
  food = createVector(floor(random(cols)), floor(random(rows)));
  food.mult(scl);
}

function keyPressed() {
  if (keyCode === UP_ARROW) {
    s.dir(0, -1);
    s.yScale = s.xScale;
    s.xScale = 20;
} else if(keyCode === DOWN_ARROW) {
    s.dir(0, 1);
    s.yScale = s.xScale;
    s.xScale = 20;
} else if(keyCode === LEFT_ARROW) {
    s.dir(-1, 0);
    s.xScale = s.yScale;
    s.yScale = 20;
} else if(keyCode === RIGHT_ARROW) {
    s.dir(1, 0);
    s.xScale = s.yScale;
    s.yScale = 20;
}
}

my snake.js file
function snake() {
    this.x = 0;
    this.y = 0;
    this.xspeed = 1;
    this.yspeed = 0;
    this.yScale = 20;
    this.xScale = 20;

    this.update = function() {
      this.x = this.x + this.xspeed*scl
      this.y = this.y + this.yspeed*scl

      this.x = constrain(this.x, 0, width-scl);
      this.y = constrain(this.y, 0, height-scl);
    }

  this.eat = function(pos) {
    var d = dist(this.x, this.y, pos.x, pos.y);
    if (d < 1) {
      s.xScale = s.xScale + s.yScale

      foods = foods + 1;
      print(foods);
      return true;
    } else {
      return false;
    }
  }

  this.dir = function(x, y) {
      this.xspeed = x;
      this.yspeed = y;
}
  this.show = function() {
    fill(255)
    rect(this.x, this.y, this.xScale, this.yScale)
    }
}

my index.html:
<html>
<head>

  <meta charset="UTF-8">

  <script language="javascript" type="text/javascript" src="libraries/p5.js"></script>
  <script language="javascript" type="text/javascript" src="libraries/p5.dom.js"></script>
  <script language="javascript" type="text/javascript" src="Sketch.js"></script>
  <script language="javascript" type="text/javascript" src="snake.js"></script>
  <style> body {padding: 0; margin: 0;} </style>
</head>

<body>
</body>
</html>

```

please help me i am using p5.js

---

<div class="post-metadata">

**Author:** ![josephh](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/josephh/32/210_2.png) [@josephh](https://discourse.processing.org/u/josephh)\
**Post date:** [July 9, 2018, 9:59am UTC](https://discourse.processing.org/t/question-switched-to-p5-js-category/1608/2 "2018-07-09T09:59:01Z")

</div>

Hey,

First of all, can you format your code using the `</>` button in the message editor and press `Ctrl+T` in the processing IDE ?

Thanks

---

<div class="post-metadata">

**Author:** ![ville2008](https://avatars.discourse-cdn.com/v4/letter/v/9fc348/32.png) [@ville2008](https://discourse.processing.org/u/ville2008)\
**Post date:** [July 10, 2018, 8:47am UTC](https://discourse.processing.org/t/question-switched-to-p5-js-category/1608/3 "2018-07-10T08:47:54Z")

</div>

I dont use Proccesing cus i dont want to have my folder named “sketch”, and i dont understand anything about what you said i am not the best at p5,js/javascript sorry.

---

<div class="post-metadata">

**Author:** ![josephh](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/josephh/32/210_2.png) [@josephh](https://discourse.processing.org/u/josephh)\
**Post date:** [July 10, 2018, 8:51am UTC](https://discourse.processing.org/t/question-switched-to-p5-js-category/1608/4 "2018-07-10T08:51:25Z")

</div>

Oh sorry, thought you were on processing (put your issue in the p5.js category).  
You need to format your code and respect indentations like this (when you write your message, there’s a `</>` button to write your code) :

```auto
function setup(){
    console.log("setup");
}

function draw(){
    console.log("draw");
}

```

---

<div class="post-metadata">

**Author:** ![kfrajer](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kfrajer/32/196_2.png) [@kfrajer](https://discourse.processing.org/u/kfrajer)\
**Post date:** [July 10, 2018, 4:10pm UTC](https://discourse.processing.org/t/question-switched-to-p5-js-category/1608/5 "2018-07-10T16:10:34Z")

</div>

Please format your code. Edit your post, select your code and hit the `</>` button. Simple.

Also, edit the title of your post to reflect the nature of your question.

Notice you can edit your post by clicking the little pen in the bottom edge of the post that you want to edit.

Kf
