HTML/CSS - CH. 10 Collision Resolve [JS Game Dev Tutorial] Online Editor and JavaScript Compiler

html

<!--
    Author: 「ＨＡＰＰＹ ＴＯ ＨＥＬＰ」
    Date: 08 March 2019
    Purpose: CH. 10 Collision Resolve
    License: CC BY-SA 4.0 
            https://creativecommons.org/licenses/by-sa/4.0/
-->
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
        
        <meta name="author" content="「ＨＡＰＰＹ ＴＯ ＨＥＬＰ」">
        <meta name="description" content="Collision resolve">
        <title>CH. 10 Collision Resolve [JS Game Dev Tutorial]</title>
        
        <link rel="stylesheet" href="styles.css">
        
        <script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
        <script src="main.js"></script>
    </head>
    
    <body>
        <div id="header">
            <div class="container">

css

/*
    Author: 「ＨＡＰＰＹ ＴＯ ＨＥＬＰ」
    Date: 08 March 2019
    Purpose: CH. 10 Collision Resolve
    License: CC BY-SA 4.0 
            https://creativecommons.org/licenses/by-sa/4.0/
*/
body {
    font: 15px/1.5 Consolas, Arial, sans-serif;
    letter-spacing: 0.5vw;
    
    margin:  0;
    padding: 0;
    
    background-color:  #BBB;
}
.container {
    width:   80%;
    margin: auto;
}
#header {
    background-color:  #333;
    color:             #FFF;
    padding-top:      30px;
    min-height:       70px;

/*
    Author: 「ＨＡＰＰＹ ＴＯ ＨＥＬＰ」
    Date: 08 March 2019
    Purpose: CH. 10 Collision Resolve
    License: CC BY-SA 4.0 
            https://creativecommons.org/licenses/by-sa/4.0/
*/
window.onload = () => {
    // Get all canvases
    let cnvs = document.getElementsByTagName("canvas");
    let ctx = []; // Drawing context
    
    // Get context
    for (const o of cnvs)ctx.push(o.getContext('2d'));
    
    
    
    
    //=== For the vector and half dimension stuff
    
    // Create squares
    let sq1 = new Square(cnvs[0].width/2-16/2,0,[255,20,20,1]);
    let sq2 = new Square(cnvs[0].width/2-16/2,12,[20,05,255,1]);
    
    /*
        Uncomment and change values

BROWSER

Console