How to draw an OBB in Javascript?

Question

I’m having serious difficulty designing an OBB. Follows the code:

window.onload = function() {
	var canvas = document.getElementById("canvas"),
		context = canvas.getContext("2d"),
		width = canvas.width = window.innerWidth,
		height = canvas.height = window.innerHeight,

		centro = {
			x:  Math.random() * 150,
			y: Math.random() * 150
		},

		angulo = Math.floor(Math.random() * 361),

		vetorU = {
			x: Math.cos(angulo),
			y: Math.sin(angulo)
		},

		vetorV = {
			x: -vetorU.y, //cos(angulo + 90),
			y: vetorU.x//sin(angulo + 90)
		};

		vetorU.x = vetorU.x * width/12 + centro.x,
		vetorU.y = vetorU.y * width/12 + centro.y,
		vetorV.x = vetorV.x * height/12 + centro.x,

		context.moveTo(vetorU.x + vetorV.x, vetorU.y + vetorV.y);
		context.lineTo(-vetorU.x + vetorV.x, -vetorU.y + vetorV.y);
		context.lineTo(-vetorU.x + (-vetorV.x), -vetorU.y + (-vetorV.y));
		context.lineTo(vetorU.x + (-vetorV.x), vetorU.y + (-vetorV.y));
		context.lineTo(vetorU.x + vetorV.x, vetorU.y + vetorV.y);
		context.stroke();	
    };

<canvas id="canvas" width="200" height="100"></canvas>