Merge branch 'issue10' into dev

docs/create-advanced-floor-plans.md → docs/create-floor-plans.md

@@ -20,34 +20,34 @@ Launch your program, click on **'File'** from the menu, then select **'Open'**.
 ## 3. Resize the canvas
 It is good practice to keep the canvas small for easier use. The largest dimension of height or width can be between 100 to 500 pixels. To change the canvas size, click on **'File'** from the topbar, then select **'Document Setup'**. In my example, I will choose 300 x 200.
 
-![](.embed/create-advanced-floor-plans-1.png)
+![image](https://github.com/Vacansee/app/assets/50114728/95997116-8526-4c12-83fe-aaefd0ccbd82)
 
 As seen, my image is too large for the dimension. First we need to select all our floor plan elements. I can either click on the screen and drag a select square over the entire picture, or click on the layers menu, and press `CTRL`+`A`. Once selected, I `SHIFT`+click a corner maintain the aspect ratio and shrink the image down. 
 
-![](.embed/create-advanced-floor-plans-2.png)
+![image](https://github.com/Vacansee/app/assets/50114728/7a9a5cd1-9126-450e-9a20-b4d0bb3bf250)
 
 Center the image for sake of neatness.
 
 ## 4. Trace the outer walls
 Let us create a semi-transparent rectangle in blue so we can find where we are working.
 
-![](.embed/create-advanced-floor-plans-3.png)
+![image](https://github.com/Vacansee/app/assets/50114728/a6080a9c-b788-4a93-ba3d-fdab25db2f95)
 
 If you double-click on the original floor plan, your program will detect that it should be considered for alignment. Let us go back and select our blue rectange again to align it to the floor plan.
 
-![](.embed/create-advanced-floor-plans-4.png)
+![image](https://github.com/Vacansee/app/assets/50114728/eb697570-66a8-4913-8d7c-41977a167863)
 
 As seen in the photo, there is a red and green alignment bar to suggest it snapped. Now resize the rest of the rectangle to be aligned. 
 
-![](.embed/create-advanced-floor-plans-5.png)
+![image](https://github.com/Vacansee/app/assets/50114728/c18c1106-f034-4d9b-9efe-e1ba21df1da5)
 
 Let us copy `CTRL`+`C` and paste `CTRL`+`V` our rectangle and align it the next wall.
 
-![](.embed/create-advanced-floor-plans-6.png)
+![image](https://github.com/Vacansee/app/assets/50114728/473e5bc2-541d-4ae8-9bbe-50e91f130db0)
 
 As you can see, the wall we created is slightly too large. That is intential, as it does not change our ability in interpretting the map, and makes viewing the map easier on the eyes. When we have many thicknesses, it distracts the user from their primary objective of finding paths/rooms. Let us use this same thickness for the entire border.
 
-![](.embed/create-advanced-floor-plans-7.png)
+![image](https://github.com/Vacansee/app/assets/50114728/908c1d76-9f71-42ee-8271-241565eb0110)
 
 Now we have completed lining the walls. Note that we did not cover door entrances. Let us group all our work by `SHIFT`+clicking the bottom curve in our layers list and the top curve of our layers list. Right click your selection and press group. Feel free to name your grouping.
 

docs/dev-setup.md

@@ -20,15 +20,3 @@ Moment.tz('America/New_York').subtract(5, 'hours').format('e:HHmm')
 
 Also, any errors and console logs can be viewed in the `F12` Devtools menu in your browser preview.
 
-## Codebase introduction
-For the Fall '23 RCOS class, the new team that led development on the project met with the original developer to gain an overview of the codebase. That video can be found [here](https://drive.google.com/file/d/1N-sEflGNpD0a7PdGBSsbbGNePsH7WFmB/view?usp=sharing).
-
-## Getting started on an issue
-Once the project is cloned and you have found an issue that you want to work on ([for the frontend app](https://github.com/Vacansee/app/issues) or [for the backend data processing](https://github.com/Vacansee/data/issues)), you will then create a branch off of the dev branch (in app) or the main branch (in data) by either:
-
-1.  adding a branch on github, running `git fetch` and then running `git checkout -b branch_name` in your terminal
-2.  or by running the command `git checkout -b branch_name` while on the correct branch and then running `git push --set-upstream origin branch_name` in your terminal when you are ready to push your changes
-
-The `branch_name` should be of the form `issue#-short-description` (e.g. 22-make-map-zoomable).
-
-Once finished with your changes, you will add your files (`git add whatever-file`, or simply `git add .` if you want to commit all changed files) that you changed and commit your changes (`git commit -m "commit message"`) to your new branch. A good practice to adopt is to continuously run `git status` to see what branch you're on, what files you have staged to commit, and what files are untracked.

src/components/home/Floor.vue

@@ -9,7 +9,7 @@ import tinycolor from "tinycolor2";
     <component :is="floorSVG" ref="svgComponent"></component>
   </div>
 </template>
-
+  
 <script>
 const getFloorSVG = async (floor) => {
   const module = await import(`../../assets/floors/${floor}.svg`)
@@ -70,7 +70,6 @@ export default {
       if (minutes >= 10)  return colors[5]
       else return colors[6]
     },
-    
     roomSelect(path) { // Select the room needed
       let roomName = path.id.substr(1)
       if (!this.getBldg()[roomName]) {
@@ -93,7 +92,6 @@ export default {
         }, 10);
       }
     },
-
     applyRoomColors() { // Apply the room color to the popup
       const svgComponent = this.$refs.svgComponent
 

src/components/home/FloorItem.vue

@@ -59,10 +59,10 @@ export default {
       handler() {
         // If landscape mode
         if (this.global.aspectRatio <= 1) {
-          currFloor.style.transform = 
+          floorBox.style.transform = 
           `translate(calc(15vw), calc(30vh)) scale(${(window.innerHeight - 150) / 50})` + `rotate(90deg)`;
         } else { // If portrait mode
-          currFloor.style.transform = `translate(-50%, calc(-50% + 100px)) scale(${window.innerWidth / 65})`;
+          floorBox.style.transform = `translate(-50%, calc(-50% + 100px)) scale(${window.innerWidth / 65})`;
         }
       }
     },
@@ -98,14 +98,14 @@ export default {
     }
   },
   mounted() {
-    // On load, set currFloor transition
-    setTimeout(() => currFloor.style.transition = "transform .2s, width .4s", 500)
+    // On load, set floorBox transition
+    setTimeout(() => floorBox.style.transition = "transform .2s, width .4s", 500)
     // If landscape mode
     if (this.global.aspectRatio <= 1) {
-      currFloor.style.transform = 
+      floorBox.style.transform = 
       `translate(calc(15vw), calc(30vh)) scale(${(window.innerHeight - 150) / 50})` + `rotate(90deg)`;
     } else { // If portrait mode
-      currFloor.style.transform = `translate(-50%, calc(-50% + 100px)) scale(${window.innerWidth / 65})`;
+      floorBox.style.transform = `translate(-50%, calc(-50% + 100px)) scale(${window.innerWidth / 65})`;
     }
   },
   methods: {