mirror of
https://github.com/wassname/DefinitelyTyped.git
synced 2026-09-10 11:40:16 +08:00
Added fabric.js type definitions
This commit is contained in:
@@ -0,0 +1,51 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
|
||||
var canvas = new fabric.Canvas('c');
|
||||
var $ = function (id) { return document.getElementById(id); };
|
||||
|
||||
var rect = new fabric.Rect({
|
||||
width: 100,
|
||||
height: 100,
|
||||
top: 150,
|
||||
left: 150,
|
||||
fill: 'rgba(255,0,0,0.5)'
|
||||
});
|
||||
|
||||
canvas.add(rect);
|
||||
|
||||
var angleControl = <HTMLInputElement>$('angle-control');
|
||||
angleControl.onchange = function() {
|
||||
rect.setAngle(this.value).setCoords();
|
||||
canvas.renderAll();
|
||||
};
|
||||
|
||||
var scaleControl = <HTMLInputElement>$('scale-control');
|
||||
scaleControl.onchange = function() {
|
||||
rect.scale(this.value).setCoords();
|
||||
canvas.renderAll();
|
||||
};
|
||||
|
||||
var topControl = <HTMLInputElement>$('top-control');
|
||||
topControl.onchange = function() {
|
||||
rect.setTop(this.value).setCoords();
|
||||
canvas.renderAll();
|
||||
};
|
||||
|
||||
var leftControl = <HTMLInputElement>$('left-control');
|
||||
leftControl.onchange = function() {
|
||||
rect.setLeft(this.value).setCoords();
|
||||
canvas.renderAll();
|
||||
};
|
||||
|
||||
function updateControls() {
|
||||
|
||||
scaleControl.value = rect.getScaleX().toString();
|
||||
angleControl.value = rect.getAngle().toString();
|
||||
leftControl.value = rect.getLeft().toString();
|
||||
topControl.value = rect.getTop().toString();
|
||||
}
|
||||
canvas.on({
|
||||
'object:moving': updateControls,
|
||||
'object:scaling': updateControls,
|
||||
'object:resizing': updateControls
|
||||
});
|
||||
Reference in New Issue
Block a user