mirror of
https://github.com/wassname/DefinitelyTyped.git
synced 2026-09-09 11:13:57 +08:00
Fix fabric.js definition and tests
This commit is contained in:
Vendored
+31
-22
@@ -149,6 +149,7 @@ declare module fabric {
|
||||
ry: number;
|
||||
|
||||
complexity(): number;
|
||||
initialize(options: any);
|
||||
initialize(points: number[], options: any): IRect;
|
||||
toObject(propertiesToInclude: any[]): any;
|
||||
toSVG(): string;
|
||||
@@ -172,6 +173,7 @@ declare module fabric {
|
||||
type: string;
|
||||
useNative: Boolean;
|
||||
|
||||
initialize(options: any);
|
||||
initialize(text: string, options: any): IText;
|
||||
toString(): string;
|
||||
render(ctx: CanvasRenderingContext2D, noTransform: bool);
|
||||
@@ -387,15 +389,16 @@ declare module fabric {
|
||||
destroy(): IGroup;
|
||||
getObjects(): IObject[];
|
||||
hasMoved(): bool;
|
||||
initialize(options: any);
|
||||
initialize(objects, options): any;
|
||||
item(index): IObject;
|
||||
remove(object): IGroup;
|
||||
remove(object?): IGroup;
|
||||
removeWithUpdate(object): IGroup;
|
||||
render(ctx, noTransform): void;
|
||||
saveCoords(): IGroup;
|
||||
setObjectsCoords(): IGroup;
|
||||
size(): number;
|
||||
toGrayscale(): void;
|
||||
toGrayscale(): IGroup;
|
||||
toObject(propertiesToInclude: any[]): any;
|
||||
tostring(): string;
|
||||
toSVG(): string;
|
||||
@@ -409,6 +412,7 @@ declare module fabric {
|
||||
y2: number;
|
||||
|
||||
complexity(): number;
|
||||
initialize(options: any);
|
||||
initialize(points: number[], options: any): ILine;
|
||||
toObject(propertiesToInclude: any[]): any;
|
||||
toSVG(): string;
|
||||
@@ -424,11 +428,13 @@ declare module fabric {
|
||||
filters: any;
|
||||
|
||||
applyFilters(callback);
|
||||
clone(callback?, propertiesToInclude?): IObject;
|
||||
clone(propertiesToInclude, callback);
|
||||
complexity(): number;
|
||||
getElement(): HTMLImageElement;
|
||||
getOriginalSize(): { width: number; height: number; };
|
||||
getSrc(): string;
|
||||
initialize(options: any);
|
||||
initialize(element: string, options: any);
|
||||
initialize(element: HTMLImageElement, options: any);
|
||||
render(ctx: CanvasRenderingContext2D, noTransform: bool);
|
||||
@@ -453,6 +459,7 @@ declare module fabric {
|
||||
|
||||
export interface IPath extends IObject {
|
||||
complexity(): number;
|
||||
initialize(options: any);
|
||||
initialize(path, options);
|
||||
render(ctx: CanvasRenderingContext2D, noTransform: bool);
|
||||
toDatalessObject(propertiesToInclude): any;
|
||||
@@ -463,6 +470,7 @@ declare module fabric {
|
||||
|
||||
export interface IPolygon extends IObject {
|
||||
complexity(): number;
|
||||
initialize(options: any);
|
||||
initialize(points, options);
|
||||
toObject(propertiesToInclude): any;
|
||||
toSVG(): string;
|
||||
@@ -470,6 +478,7 @@ declare module fabric {
|
||||
|
||||
export interface IPolyline extends IObject {
|
||||
complexity(): number;
|
||||
initialize(options: any);
|
||||
initialize(points, options);
|
||||
toObject(propertiesToInclude): any;
|
||||
toSVG(): string;
|
||||
@@ -477,11 +486,12 @@ declare module fabric {
|
||||
|
||||
export interface IPathGroup extends IObject {
|
||||
complexity(): number;
|
||||
initialize(options: any);
|
||||
initialize(paths, options);
|
||||
isSameColor(): bool;
|
||||
render(ctx: CanvasRenderingContext2D);
|
||||
toDatalessObject(propertiesToInclude): any;
|
||||
toGrayscale();
|
||||
toGrayscale(): IPathGroup;
|
||||
toObject(propertiesToInclude): any;
|
||||
tostring(): string;
|
||||
toSVG(): string;
|
||||
@@ -660,18 +670,18 @@ declare module fabric {
|
||||
export interface ITriangleOptions extends IObjectOptions {
|
||||
}
|
||||
|
||||
declare var Rect: {
|
||||
var Rect: {
|
||||
fromElement(element: SVGElement, options: IRectOptions): IRect;
|
||||
fromObject(object): IRect;
|
||||
new (options?: IRectOptions): IRect;
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var Triangle: {
|
||||
var Triangle: {
|
||||
new (options?: ITriangleOptions): ITriangle;
|
||||
}
|
||||
|
||||
declare var Canvas: {
|
||||
var Canvas: {
|
||||
new (element: HTMLCanvasElement, options?: ICanvasOptions): ICanvas;
|
||||
new (element: string, options?: ICanvasOptions): ICanvas;
|
||||
|
||||
@@ -680,7 +690,7 @@ declare module fabric {
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var StaticCanvas: {
|
||||
var StaticCanvas: {
|
||||
new (element: HTMLCanvasElement, options?: ICanvasOptions): ICanvas;
|
||||
new (element: string, options?: ICanvasOptions): ICanvas;
|
||||
|
||||
@@ -689,7 +699,7 @@ declare module fabric {
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var Circle: {
|
||||
var Circle: {
|
||||
ATTRIBUTE_NAMES: string[];
|
||||
fromElement(element: SVGElement, options: ICircleOptions): ICircle;
|
||||
fromObject(object): ICircle;
|
||||
@@ -697,11 +707,11 @@ declare module fabric {
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var Group: {
|
||||
var Group: {
|
||||
new (items?: any[], options?: IObjectOptions): IGroup;
|
||||
}
|
||||
|
||||
declare var Line: {
|
||||
var Line: {
|
||||
ATTRIBUTE_NAMES: string[];
|
||||
fromElement(element: SVGElement, options): ILine;
|
||||
fromObject(object): ILine;
|
||||
@@ -709,53 +719,53 @@ declare module fabric {
|
||||
new (points: number[], objObjects?: IObjectOptions): ILine;
|
||||
}
|
||||
|
||||
declare var Intersection: {
|
||||
var Intersection: {
|
||||
intersectLineLine(a1, a2, b1, b2);
|
||||
intersectLinePolygon(a1, a2, points);
|
||||
intersectPolygonPolygon(points1, points2);
|
||||
intersectPolygonRectangle(points, r1, r2);
|
||||
}
|
||||
|
||||
declare var Path: {
|
||||
var Path: {
|
||||
fromElement(element: SVGElement, options): IPath;
|
||||
fromObject(object): IPath;
|
||||
new (): IPath;
|
||||
}
|
||||
|
||||
declare var PathGroup: {
|
||||
var PathGroup: {
|
||||
fromObject(object): IPathGroup;
|
||||
new (): IPathGroup;
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var Point: {
|
||||
var Point: {
|
||||
new (x, y): IPoint;
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var Object: {
|
||||
var Object: {
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var Polygon: {
|
||||
var Polygon: {
|
||||
fromObject(object): IPolygon;
|
||||
fromElement(element: SVGElement, options): IPolygon;
|
||||
new (): IPolygon;
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var Polyline: {
|
||||
var Polyline: {
|
||||
fromObject(object): IPolyline;
|
||||
fromElement(element: SVGElement, options): IPolyline;
|
||||
new (): IPolyline;
|
||||
prototype: any;
|
||||
}
|
||||
|
||||
declare var Text: {
|
||||
var Text: {
|
||||
new (text: string, options?: ITextOptions): IText;
|
||||
}
|
||||
|
||||
declare var Image: {
|
||||
var Image: {
|
||||
fromURL(url: string): IImage;
|
||||
fromURL(url: string, callback: (image: IImage) => any): IImage;
|
||||
fromURL(url: string, callback: (image: IImage) => any, objObjects: IObjectOptions): IImage;
|
||||
@@ -809,7 +819,7 @@ declare module fabric {
|
||||
|
||||
}
|
||||
|
||||
declare var util: {
|
||||
var util: {
|
||||
addClass(element: HTMLElement, className: string);
|
||||
addListener(element, eventName: string, handler);
|
||||
animate(options: {
|
||||
@@ -846,5 +856,4 @@ declare module fabric {
|
||||
toFixed(number, fractionDigits);
|
||||
wrapElement(element: HTMLElement, wrapper, attributes);
|
||||
}
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
///<reference path="fabricjs.d.ts" />
|
||||
|
||||
var canvas = new fabric.Canvas('c', {
|
||||
hoverCursor: 'pointer',
|
||||
@@ -1,4 +1,4 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
///<reference path="fabricjs.d.ts" />
|
||||
|
||||
var dot, i,
|
||||
t1, t2,
|
||||
@@ -1,4 +1,4 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
///<reference path="fabricjs.d.ts" />
|
||||
|
||||
var $ = function(id){return document.getElementById(id)};
|
||||
|
||||
@@ -28,7 +28,7 @@ canvas.on({
|
||||
|
||||
for (var i = 0; i < filters.length; i++) {
|
||||
var checkBox = <HTMLInputElement>$(filters[i]);
|
||||
var image = <fabric.Image>canvas.getActiveObject();
|
||||
var image = <fabric.IImage>canvas.getActiveObject();
|
||||
checkBox.checked = !!image.filters[i];
|
||||
}
|
||||
},
|
||||
@@ -1,4 +1,4 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
///<reference path="fabricjs.d.ts" />
|
||||
|
||||
var canvas = new fabric.Canvas('c');
|
||||
var $ = function (id) { return document.getElementById(id); };
|
||||
@@ -1,4 +1,4 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
///<reference path="fabricjs.d.ts" />
|
||||
|
||||
module fabric {
|
||||
export interface CircleWithLineInfos extends ICircle {
|
||||
@@ -1,4 +1,4 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
///<reference path="fabricjs.d.ts" />
|
||||
|
||||
var canvas = new fabric.Canvas('c');
|
||||
fabric.loadSVGFromURL('../assets/135.svg', function (objects) {
|
||||
@@ -1,4 +1,4 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
///<reference path="fabricjs.d.ts" />
|
||||
|
||||
module fabric {
|
||||
export interface ImageWithInfo extends IImage {
|
||||
@@ -1,4 +1,4 @@
|
||||
///<reference path="..\fabricjs.d.ts" />
|
||||
///<reference path="fabricjs.d.ts" />
|
||||
|
||||
module fabric {
|
||||
export interface ImageWithInfo extends IImage {
|
||||
@@ -41,7 +41,7 @@ function updateComplexity() {
|
||||
}, 100);
|
||||
}
|
||||
|
||||
document.getElementById('commands').onclick = function (ev) {
|
||||
document.getElementById('commands').onclick = function (ev: any) {
|
||||
var ev: any = ev || window.event;
|
||||
|
||||
if (ev.preventDefault) {
|
||||
@@ -450,8 +450,8 @@ if (supportsColorpicker()) {
|
||||
}, 100);
|
||||
|
||||
if (document.location.search.indexOf('guidelines') > -1) {
|
||||
initCenteringGuidelines(canvas);
|
||||
initAligningGuidelines(canvas);
|
||||
//initCenteringGuidelines(canvas);
|
||||
//initAligningGuidelines(canvas);
|
||||
}
|
||||
|
||||
gradientifyBtn.onclick = function() {
|
||||
@@ -475,7 +475,7 @@ if (supportsColorpicker()) {
|
||||
var activeObject = canvas.getActiveObject();
|
||||
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
this.value = (<fabric.Text>activeObject).text;
|
||||
this.value = (<fabric.IText>activeObject).text;
|
||||
}
|
||||
};
|
||||
textEl.onkeyup = function(e) {
|
||||
@@ -485,7 +485,7 @@ if (supportsColorpicker()) {
|
||||
canvas.discardActiveObject();
|
||||
}
|
||||
else {
|
||||
(<fabric.Text>activeObject).text = this.value;
|
||||
(<fabric.IText>activeObject).text = this.value;
|
||||
}
|
||||
canvas.renderAll();
|
||||
}
|
||||
@@ -497,7 +497,7 @@ if (supportsColorpicker()) {
|
||||
activeObjectButtons.push(cmdUnderlineBtn);
|
||||
cmdUnderlineBtn.disabled = true;
|
||||
cmdUnderlineBtn.onclick = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.textDecoration = (activeObject.textDecoration == 'underline' ? '' : 'underline');
|
||||
this.className = activeObject.textDecoration ? 'selected' : '';
|
||||
@@ -511,7 +511,7 @@ if (supportsColorpicker()) {
|
||||
activeObjectButtons.push(cmdLinethroughBtn);
|
||||
cmdLinethroughBtn.disabled = true;
|
||||
cmdLinethroughBtn.onclick = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.textDecoration = (activeObject.textDecoration == 'line-through' ? '' : 'line-through');
|
||||
this.className = activeObject.textDecoration ? 'selected' : '';
|
||||
@@ -525,7 +525,7 @@ if (supportsColorpicker()) {
|
||||
activeObjectButtons.push(cmdOverlineBtn);
|
||||
cmdOverlineBtn.disabled = true;
|
||||
cmdOverlineBtn.onclick = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.textDecoration = (activeObject.textDecoration == 'overline' ? '' : 'overline');
|
||||
this.className = activeObject.textDecoration ? 'selected' : '';
|
||||
@@ -539,7 +539,7 @@ if (supportsColorpicker()) {
|
||||
activeObjectButtons.push(cmdBoldBtn);
|
||||
cmdBoldBtn.disabled = true;
|
||||
cmdBoldBtn.onclick = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.fontWeight = (activeObject.fontWeight == 'bold' ? '' : 'bold');
|
||||
this.className = activeObject.fontWeight ? 'selected' : '';
|
||||
@@ -553,7 +553,7 @@ if (supportsColorpicker()) {
|
||||
activeObjectButtons.push(cmdItalicBtn);
|
||||
cmdItalicBtn.disabled = true;
|
||||
cmdItalicBtn.onclick = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.fontStyle = (activeObject.fontStyle == 'italic' ? '' : 'italic');
|
||||
this.className = activeObject.fontStyle ? 'selected' : '';
|
||||
@@ -567,7 +567,7 @@ if (supportsColorpicker()) {
|
||||
activeObjectButtons.push(cmdShadowBtn);
|
||||
cmdShadowBtn.disabled = true;
|
||||
cmdShadowBtn.onclick = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.textShadow = !activeObject.textShadow ? 'rgba(0,0,0,0.2) 2px 2px 10px' : '';
|
||||
this.className = activeObject.textShadow ? 'selected' : '';
|
||||
@@ -581,7 +581,7 @@ if (supportsColorpicker()) {
|
||||
activeObjectButtons.push(textAlignSwitch);
|
||||
textAlignSwitch.disabled = true;
|
||||
textAlignSwitch.onchange = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.textAlign = this.value.toLowerCase();
|
||||
canvas.renderAll();
|
||||
@@ -594,7 +594,7 @@ if (supportsColorpicker()) {
|
||||
activeObjectButtons.push(fontFamilySwitch);
|
||||
fontFamilySwitch.disabled = true;
|
||||
fontFamilySwitch.onchange = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.fontFamily = this.value;
|
||||
canvas.renderAll();
|
||||
@@ -605,7 +605,7 @@ if (supportsColorpicker()) {
|
||||
var bgColorField = document.getElementById('text-bg-color');
|
||||
if (bgColorField) {
|
||||
bgColorField.onchange = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.backgroundColor = this.value;
|
||||
canvas.renderAll();
|
||||
@@ -616,7 +616,7 @@ if (supportsColorpicker()) {
|
||||
var strokeColorField = document.getElementById('text-stroke-color');
|
||||
if (strokeColorField) {
|
||||
strokeColorField.onchange = function() {
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.strokeStyle = this.value;
|
||||
canvas.renderAll();
|
||||
@@ -639,7 +639,7 @@ if (supportsColorpicker()) {
|
||||
label.appendChild(slider);
|
||||
slider.title = "Line height";
|
||||
slider.onchange = function(){
|
||||
var activeObject = <fabric.Text>canvas.getActiveObject();
|
||||
var activeObject = <fabric.IText>canvas.getActiveObject();
|
||||
if (activeObject && activeObject.type === 'text') {
|
||||
activeObject.lineHeight = this.value;
|
||||
canvas.renderAll();
|
||||
@@ -661,7 +661,7 @@ if (supportsColorpicker()) {
|
||||
});
|
||||
};
|
||||
|
||||
if (typeof Cufon !== 'undefined') {
|
||||
Cufon.fonts.delicious.offsetLeft = 75;
|
||||
Cufon.fonts.delicious.offsetTop = 25;
|
||||
}
|
||||
//if (typeof Cufon !== 'undefined') {
|
||||
// Cufon.fonts.delicious.offsetLeft = 75;
|
||||
// Cufon.fonts.delicious.offsetTop = 25;
|
||||
//}
|
||||
Reference in New Issue
Block a user