Created
November 16, 2020 18:34
-
-
Save akay25/258c44b6b2f23d420aaaa4d07f59948d to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const no_of_boxes = 1; | |
| const MAX_BOX_WIDTH = 250; | |
| const SMALL_BOX_WIDTH = 100; | |
| let MOUSE_LINE_COLOR; | |
| let boxes = []; | |
| let draggableBox = {}; | |
| function setup () { | |
| MOUSE_LINE_COLOR = color(0, 255, 0); | |
| createCanvas(600, 600); | |
| for(let i = 0; i < no_of_boxes; i++){ | |
| const x = random(0, width - MAX_BOX_WIDTH); | |
| const y = random(0, height - MAX_BOX_WIDTH); | |
| boxes.push({ | |
| x: x, | |
| y: y, | |
| h: random(30, MAX_BOX_WIDTH), | |
| w: random(30, MAX_BOX_WIDTH), | |
| color_: color(random(255), random(255), random(255)) | |
| }); | |
| } | |
| draggableBox = { | |
| h: random(30, SMALL_BOX_WIDTH), | |
| w: random(30, SMALL_BOX_WIDTH), | |
| color_: color(random(255), random(255), random(255)) | |
| } | |
| } | |
| function draw(){ | |
| background(34); | |
| const wOffset = draggableBox.w /2 ; | |
| const hOffset = draggableBox.h / 2; | |
| const currentPosX = mouseX - wOffset; | |
| const currentPosY = mouseY - hOffset; | |
| for(let i = 0; i<boxes.length ; i++){ | |
| stroke(boxes[i].color_); | |
| noFill(); | |
| rect(boxes[i].x, boxes[i].y, boxes[i].w, boxes[i].h); | |
| let diff = abs(currentPosX - boxes[i].x); | |
| if(diff < 7){ | |
| stroke(255); | |
| strokeWeight(2); | |
| line(boxes[i].x, boxes[i].y, boxes[i].x, currentPosY); | |
| } | |
| diff = abs(currentPosY - boxes[i].y); | |
| if(diff < 7){ | |
| stroke(255); | |
| strokeWeight(2); | |
| line(boxes[i].x, boxes[i].y, currentPosX, boxes[i].y); | |
| } | |
| diff = abs(currentPosX - (boxes[i].x + boxes[i].w)); | |
| if(diff < 7){ | |
| stroke(255); | |
| strokeWeight(2); | |
| line((boxes[i].x + boxes[i].w), boxes[i].y, (boxes[i].x + boxes[i].w), currentPosY); | |
| } | |
| diff = abs(currentPosX - (boxes[i].x + boxes[i].w/2)); | |
| if(diff < 7){ | |
| stroke(255); | |
| strokeWeight(2); | |
| line((boxes[i].x + boxes[i].w /2), boxes[i].y, (boxes[i].x + boxes[i].w /2), currentPosY); | |
| } | |
| diff = abs(currentPosY - (boxes[i].y + boxes[i].h)); | |
| if(diff < 7){ | |
| stroke(255); | |
| strokeWeight(2); | |
| line(boxes[i].x, (boxes[i].y + boxes[i].h), currentPosX, (boxes[i].y + boxes[i].h)); | |
| } | |
| diff = abs(currentPosY - (boxes[i].y + boxes[i].h / 2)); | |
| if(diff < 7){ | |
| stroke(255); | |
| strokeWeight(2); | |
| line(boxes[i].x, (boxes[i].y + boxes[i].h / 2), currentPosX, (boxes[i].y + boxes[i].h / 2)); | |
| } | |
| } | |
| let diff = abs(currentPosX - width / 2); | |
| if(diff < 1.5){ | |
| stroke(MOUSE_LINE_COLOR); | |
| line(currentPosX, 0, currentPosX, currentPosY); | |
| } | |
| diff = abs(currentPosY - height / 2); | |
| if(diff < 1.5) { | |
| stroke(MOUSE_LINE_COLOR); | |
| line(0, currentPosY, currentPosX, currentPosY); | |
| } | |
| stroke(color(255, 0, 0)); | |
| rect(mouseX - wOffset, mouseY - hOffset, draggableBox.w, draggableBox.h); | |
| // line(0, mouseY, 600, mouseY); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment