'use strict';

import {fabric} from '../vendor/lib/fabric/dist/fabric';
import calculadora from './modules/calculadora';

// Calculadora Stuff
const x = calculadora(6);
const r = x
	.plus(50, 4)
	.less(5, 55, 10);

console.log(`6  + sum(50, 4)      ---> 50 + 4       = 60`);
console.log(`60 - less(5, 55, 10) ---> 5 - 55 - 10  = ${r.number}`);

// Fabric Stuff
const canvas = new fabric.Canvas('calcCanvas', {
	backgroundColor: 'rgb(200,200,200)'
});

const rect = new fabric.Rect({
	width: 100,
	height: 100,
	left: 50,
	top: 50,
	fill: 'blue',
	angle: 30
});

canvas.add(rect);

@@ -1,8 +1,28 @@
+/* global window */%0A
 'use str
@@ -378,58 +378,351 @@
 uff%0A
-const canvas = new fabric.Canvas('calcCanvas', %7B%0A%09
+function retina(canvas) %7B%0A%09if (window.devicePixelRatio !== 1) %7B%0A%09%09const c = canvas.getElement();%0A%09%09const w = c.width;%0A%09%09const h = c.height;%0A%09%09c.setAttribute('width', w * window.devicePixelRatio);%0A%09%09c.setAttribute('height', h * window.devicePixelRatio);%0A%09%09c.getContext('2d').scale(window.devicePixelRatio, window.devicePixelRatio);%0A%09%7D%0A%7D%0A%0Aconst 
 back
@@ -732,17 +732,18 @@
 undColor
-:
+ =
  'rgb(20
@@ -753,21 +753,186 @@
 00,200)'
-%0A%7D);%0A
+;%0Aconst canvas = new fabric.StaticCanvas('calcCanvas', %7BbackgroundColor%7D);%0Aretina(canvas);%0A%0Aconst %5Bwidth, height, top, left, angle, fill%5D = %5B100, 100, 50, 50, 30, 'red'%5D;
 %0Aconst r
@@ -934,16 +934,17 @@
 nst rect
+A
  = new f
@@ -959,83 +959,130 @@
 ct(%7B
-%0A%09
 width
-: 100,%0A%09height: 100,%0A%09left: 50,%0A%09top: 50,%0A%09fill: 'blue',%0A%09angle: 30%0A
+, height, left, top, angle, fill: 'blue'%7D);%0Aconst rectB = new fabric.Rect(%7Bwidth, height, left: 200, top, angle, fill
 %7D);%0A
@@ -1097,11 +1097,19 @@
 add(rect
+A, rectB
 );%0A

update fabric