Javascript Windowing System, Task 14

Exercism
1

Hi, all. I’m stuck on Task 14 of this exercise. I can’t rationalize why I keep failing this test. nor do I understand why the expected dimensions are (90, 75) when the window is position within the parameters of the screen size. Below is what the test is actually asking for.

const programWindow = new ProgramWindow();
const newPosition = new Position(710, 525);
programWindow.move(newPosition);
const newSize = new Size(1000, 1000);
programWindow.resize(newSize);
expect(programWindow.size.width).toBe(90);
expect(programWindow.size.height).toBe(75);

Below is my code with the program window class. I’m just not understanding why it needs to be resized when it’s within the screen width and height. I keep failing against the resize respects limits due to position and screen size. I truly don’t know what I’m missing here.

export class ProgramWindow {
  constructor(screenSize, size, position){
    this.screenSize = new Size(800, 600);
    this.size = new Size();
    this.position = new Position();
  }
  resize(size){
    if (size.width < 1 || size.height < 1){
      this.size.width = 1;
      this.size.height = 1;
    } else {
      this.size.width = size.width;
      this.size.height = size.height;
    }
  }
  move(position){
    let maxX = this.screenSize.width - this.size.width;
    let maxY = this.screenSize.height - this.size.height;
    if (position.x < 0 || position.y < 0){
      this.position.x = 0;
      this.position.y = 0;
    } else if(position.x > this.screenSize.width || position.y > this.screenSize.height){
      this.position.x = maxX;
      this.position.y = maxY;
    } else {
      this.position.x = position.x;
      this.position.y = position.y;
    }
  }
}
2

Define a ProgramWindow class with the following fields:

  • screenSize: holds a fixed value of type Size with width 800 and height 600

The resize needs to take the ProgramWindow size into consideration.

3

I did indeed. Allow me to post that code when I get in front of my computer again, my apologies. I hadn’t realized i’d ONLY posted the two functions.

4

i apologize this took so long! i edited my post with the complete window class.

5

If the program window is created without arguments, its size is 800x600.

export class ProgramWindow {
  constructor(screenSize, size, position){
    this.screenSize = new Size(800, 600);
 
    // [...]

Now the window inside the screen is positioned at x = 710, y = 525. That looks like this:

        <------------------- 800 -------------------->

   ^    ╔════════════════════════════════════════════╗
   |    ║                                            ║
   |    ║           710, 525                         ║
   |    ║              \                             ║
   |    ║               \<----- size.width ----->    ║
   |    ║         ^      *──────────────────────┐    ║
   |    ║         |      │        title         │    ║
   |    ║         |      ├──────────────────────┤    ║
  600   ║         |      │                      │    ║
   |    ║    size.height │                      │    ║
   |    ║         |      │       contents       │    ║
   |    ║         |      │                      │    ║
   |    ║         |      │                      │    ║
   |    ║         v      └──────────────────────┘    ║
   |    ║                                            ║
   |    ║                                            ║
   v    ╚════════════════════════════════════════════╝

This means that from the top left corner (*), there are 90 pixels left to the right. The window width is 800, the top left corner is at 710, so there are 800 - 710 pixels left. You may now also see why there are 75 pixels left from the top left corner (*) to the bottom of the screen.

If the window is now sized to 1000x1000, this clearly would not fit. It would never fit in the screen if the top left corner was at (0,0), because then there would be at most 800 - 0 pixels for the width and 600 - 0 pixels for the height.

So, to reiterate what @IsaacG said: when resizing, you need to account for the available real estate on the screen.

1 Like