Namespace: Editor

Editor

Main decorator class, that make API
Mixes In:
Source:
index.js

Members


<static> Utils

Provides access to Utils
Source:
index.js

Methods


.addFace(face)

Add new face
Parameters:
Name Type Description
face Object data
Source:
index.js
Example
App.Editor.addFace(faceData);

.addImageToCanvas(url, isFotolia)

Image and SVG will be add to canvas. Create preview, create layer, create state
Parameters:
Name Type Description
url Array image url. Use getExternal route for CRUD solution
isFotolia Boolean Drawing prices
Source:
index.js
Example
App.Editor.addImageToCanvas(url, isFotolia);

.addToCanvas(object)

Add object to canvas (It is use for object was create outside)
Parameters:
Name Type Description
object Object
Source:
index.js
Example
App.Editor.addToCanvas(obj);

.bringToFront()

Put objects on the front side. Get active canvas objects and send it to front
Source:
index.js
Example
App.Editor.bringToFront();

.buildGrid()

[public API support] Rebuild grid on canvas
Source:
index.js
Example
App.Editor.buildGrid();

.buildRuler(inZoom,, canvasOffsetX,, canvasOffsetY,)

[public API support] Rebuild ruller on offset canvas, zoom canvas
Parameters:
Name Type Description
inZoom, String If you change zoom factor, need set offset
canvasOffsetX, String Drag canvas on X axis
canvasOffsetY, String Drag canvas on Y axis
Source:
index.js
Example
App.Editor.buildRuler(inZoom, canvasOffsetX, canvasOffsetY);

.changeText(new)

Change text
Parameters:
Name Type Description
new String text
Source:
index.js
Example
App.Editor.changeText(text);

.changeZIndex(New, Old)

Put objects on the front side. Get active canvas objects and send it to front
Parameters:
Name Type Description
New Number index layer
Old Number index layer
Source:
index.js
Example
App.Editor.changeZIndex(newIndex, oldIndex);

.copyObjects()

[public API support] Copy active objects
Source:
index.js
Example
App.Editor.copyObjects();

.cutObjects()

[public API support] Paste copy objects to canvas and remove originals
Source:
index.js
Example
App.Editor.cutObjects();

.drawActivate(type, state)

Activated draw module. After that you can drawing
Parameters:
Name Type Description
type String (circle | ellipse | freeDrawing | line | polyline | rect | text | triangle)
state Boolean toggle
Source:
index.js
Example
App.Editor.drawActivate('freeDrawing', true); //Active Free Drawing

.fillFigureToCanvas()

Fill figure to canvas with proportion
Source:
index.js
Example
App.Editor.fillFigureToCanvas();

.getCanvas()

Get main canvas
Source:
index.js
Example
App.Editor.getLayers();

.getFaces()

Get all faces in project
Source:
index.js
Example
App.Editor.getFaces();

.getFacesData()

Need to admin side, get all data for all faces and canvases, snapshots
Source:
index.js
Example
App.Editor.getFacesData();

.getLayers()

Get canvas layers
Source:
index.js
Example
App.Editor.getLayers();

.getProject()

Get active project
Source:
index.js
Example
App.Editor.getProject();

.getProjectData()

Need to admin side, get all data for active project
Source:
index.js
Example
App.Editor.getProjectData();

.getSettings()

Get canvas settings
Source:
index.js
Example
App.Editor.getSettings();

.group()

Active objects was group
Source:
index.js
Example
App.Editor.group();

.groupAlign(direction)

Align objects in group
Parameters:
Name Type Description
direction String offset (bottom | center-vertical | top | right | center-horizontal | left)
Source:
index.js
Example
App.Editor.groupAlign(direction);

.hasUnsavedChanges()

Check if a project has unsaved changes App.Editor.hasUnsavedChanges();
Source:
index.js

.initialize(prop)

initialize is main Editor method create instance
Parameters:
Name Type Description
prop object Editor options
Source:
index.js
Example
var Editor = require('path/editor.js');
var App = {}
var editor = new Editor();
App.Editor = editor.initialize({
            project: this.project, //Project collection
            template : this.template, //Template collection
            templateCanvas : this.templateCanvas, //current template
            settings: this.settings, //settings model
            layers: this.layers, //layers collection
            layer: Layer //layer constructor
        });

.lockLayer(layer)

Lock/unlock layer
Parameters:
Name Type Description
layer String id
Source:
index.js
Example
var id = this.canvas.getActiveObject().cid;
App.Editor.lockLayer(id);

.lockSelect(state)

Lock selection tool from canvas
Parameters:
Name Type Description
state Boolean selection
Source:
index.js
Example
App.Editor.lockSelect(state);

.objectFlip(direction)

Flip object with center
Parameters:
Name Type Description
direction String of flip
Source:
index.js
Example
App.Editor.objectFlip(direction);

.objectMove(direction)

Change coordinates object
Parameters:
Name Type Description
direction String move (top-left | top-center | top-right | center-left | center-right | bottom-left | bottom-center | bottom-right)
Source:
index.js
Example
App.Editor.objectMove(direction);

.objectRotate(degree)

Rotate active object
Parameters:
Name Type Description
degree Number
Source:
index.js
Example
App.Editor.objectRotate(val);

.pasteObjects()

[public API support] Paste copy objects to canvas (on position copy objects)
Source:
index.js
Example
App.Editor.pasteObjects();

.previewProject()

Get preview in popup
Source:
index.js
Example
App.Editor.previewProject();

.previewProjectInternal(callback)

Paste in callback thumbnail
Parameters:
Name Type Description
callback function with past thumbnail
Source:
index.js
Example
App.Editor.previewProjectInternal(callback);

.previewSafeZone(show)

Show preview with safe zones
Parameters:
Name Type Description
show Boolean / hide safe zones
Source:
index.js
Example
App.Editor.previewSafeZone(state);

.projectPriceInfo(callback)

Paste in callback thumbnail
Parameters:
Name Type Description
callback function with past thumbnail
Source:
index.js
Example
App.Editor.previewProjectInternal(callback);

.recalculatePrice()

Calcaulate price for project
Source:
index.js
Example
App.Editor.recalculatePrice();

.redo()

[public API support] State manager redo method, get next step from state array
Source:
index.js
Example
App.Editor.redo();

.remove()

Remove single object for id. If id will be undefined, would be delete all selected objects
Source:
index.js
Example
App.Editor.remove();

.removeActiveFace()

Remove active face
Source:
index.js
Example
App.Editor.removeActiveFace();

.saveProject(name)

Project will be save
Parameters:
Name Type Description
name String project App.Editor.saveProject(name);
Source:
index.js
Example
App.Editor.saveProject(data);

.saveProjectPorthole()

Project will be save from Porthole
Source:
index.js
Example
App.Editor.saveProjectPorthole({final: 1});

.saveState(objectState)

[public API support] State manager save state in StateManager Module
Parameters:
Name Type Description
objectState object Save object
Source:
index.js
Example
App.Editor.saveState({
    method: 'add' //or asBg | changeBackground | group | init | modify | modifySelected | paste | remove | sort | transparencyBackground | ungroup
    //Other options (see state manager sub-modules)
});

.scaleToContainer()

Scale canvas to container (monitor sizes)
Source:
index.js
Example
App.Editor.scaleToContainer();

.scaleToUsual()

Scale canvas to template / project size
Source:
index.js
Example
App.Editor.scaleToUsual();

.selectAll()

[public API support] Select all active objects
Source:
index.js
Example
App.Editor.selectAll();

.selectSingle(cid)

[public API support] Select single object on cid
Parameters:
Name Type Description
cid String special id layer
Source:
index.js
Example
var id = this.canvas.getActiveObject().cid;
App.Editor.selectSingle(id);

.selectToggle(cid)

Toggle select single object on cid. Object will be select if this object was unselect
Parameters:
Name Type Description
cid String special id layer
Source:
index.js
Example
var id = this.canvas.getActiveObject().cid;
App.Editor.selectToggle(id);

.sendToBack()

Put objects on the back side. Get active canvas objects and send it to back
Source:
index.js
Example
App.Editor.sendToBack();

.setBackgroundColor(rgb, silent)

Set color to background or safe zone objects
Parameters:
Name Type Description
rgb String color
silent Boolean mode
Source:
index.js
Example
App.Editor.setBackgroundColor(rgb);

.setBackgroundTransparency(current)

Toggle transparency background or safe zone objects
Parameters:
Name Type Description
current Boolean state transparency
Source:
index.js
Example
App.Editor.setBackgroundTransparency(state);

.setBorder(type)

Set borders to canvas
Parameters:
Name Type Description
type String (fancy | flush | inset | round)
Source:
index.js
Example
App.Editor.setBorder(type);

.setBorderColor(rgb, silent)

Set color to object border (If active figure is line, polyline, freeDraw that method will be change color lines)
Parameters:
Name Type Description
rgb String color
silent Boolean mode
Source:
index.js
Example
App.Editor.setBorderColor(rgb);

.setFace(id)

Set active face to canvas
Parameters:
Name Type Description
id String Face id
Source:
index.js
Example
App.Editor.setFace(id);

.setFigureAsBackground(state)

Send object to back, lock all properties changes
Parameters:
Name Type Description
state Boolean
Source:
index.js
Example
App.Editor.setFigureAsBackground(state);

.setFigureColor(rgb)

Change color of figure If active figure is line, polyline, freeDraw that method will be change fill color these figures
Parameters:
Name Type Description
rgb String color
Source:
index.js
Example
App.Editor.setFigureColor(rgb);

.setFigureHeight(value)

Change figure height
Parameters:
Name Type Description
value Number
Source:
index.js
Example
App.Editor.setFigureHeight(value);

.setFigureOpacity(opacity)

Change active object opacity
Parameters:
Name Type Description
opacity Number 0 ... 100
Source:
index.js
Example
App.Editor.setFigureOpacity(val);

.setFigureWidth(value)

Change figure width
Parameters:
Name Type Description
value Number
Source:
index.js
Example
App.Editor.setFigureWidth(value);

.setFontFamily(Font)

Change font family for active text
Parameters:
Name Type Description
Font String name
Source:
index.js
Example
App.Editor.setFontFamily(fontfamily);

.setFontSize(font)

Set active text font size in units
Parameters:
Name Type Description
font String size in units
Source:
index.js
Example
App.Editor.setFontSize(fontSize);

.setGridColors(rgb)

Set default grid color
Parameters:
Name Type Description
rgb String color
Source:
index.js
Example
App.Editor.setGridColors(rgb);

.setLetterSpacing(value)

Set letter spacing for active text
Parameters:
Name Type Description
value Number letter spacing
Source:
index.js
Example
App.Editor.setLetterSpacing(val);

.setLineSmoothValue(value)

Set line smoothing value
Parameters:
Name Type Description
value Number
Source:
index.js
Example
App.Editor.setLineSmoothValue(state);

.setMantainProportion(state)

Change mantain proportion
Parameters:
Name Type Description
state Boolean
Source:
index.js
Example
App.Editor.setFigureHeight(value);

.setObjectOffset(direction)

Set object to corner of canvas
Parameters:
Name Type Description
direction String offset (top-left | top-center | top-right | center-left | center-right | bottom-left | bottom-center | bottom-right)
Source:
index.js
Example
App.Editor.setObjectOffset(offset, object, layer);

.setPreloader(show, description)

Show / hide preloader
Parameters:
Name Type Description
show Boolean / hide preloader
description text preloader
Source:
index.js
Example
App.Editor.setPreloader(state, text);

.setRulerUnits(Unit)

[public API support] Set current unit to ruller
Parameters:
Name Type Description
Unit String name
Source:
index.js
Example
App.Editor.setRulerUnits(unit);

.setShapeColors(rgb)

Set default color to shapes
Parameters:
Name Type Description
rgb String color
Source:
index.js
Example
App.Editor.setShapeColors(rgb);

.setStrokeOpacity(opacity)

Set opacity to object border
Parameters:
Name Type Description
opacity String value
Source:
index.js
Example
App.Editor.setStrokeOpacity(val);

.setStrokeWidth(width)

Set width object border
Parameters:
Name Type Description
width String in current units (automatical recalculation)
Source:
index.js
Example
App.Editor.setStrokeWidth(val);

.setTextBold(state)

Set bold for active text
Parameters:
Name Type Description
state Boolean bold
Source:
index.js
Example
App.Editor.setTextBold(state);

.setTextItalic(state)

Set italic for active text
Parameters:
Name Type Description
state Boolean italic
Source:
index.js
Example
App.Editor.setTextBold(state, object, layer);

.setTextLineHeight(value)

Set line height for active text
Parameters:
Name Type Description
value Number line height
Source:
index.js
Example
App.Editor.setTextLineHeight(val);

.setTextShadow(state)

Active text shadow
Parameters:
Name Type Description
state Boolean of shadow
Source:
index.js
Example
App.Editor.setTextShadow(state);

.setTextShadowBlur(shadow)

Set text shadow blur
Parameters:
Name Type Description
shadow Number blur (0 - None, 1 - light shadow, 3 - medium shadow, 5 - large shadow)
Source:
index.js
Example
App.Editor.setTextShadowBlur(val);

.setTextShadowColor(rgb, silent)

Set text shadow color
Parameters:
Name Type Description
rgb String color
silent Boolean mode
Source:
index.js
Example
App.Editor.setTextShadowColor(rgb);

.setTextShadowPosition((none)

Set text shadow position
Parameters:
Name Type Description
(none String | tl - top left | t - top | tr - top right | r - right | br - bottom right | b - bottom | bl - bottom left | l - left)
Source:
index.js
Example
App.Editor.setTextShadowPosition(val);

.setTextTransform((none)

Set text transform
Parameters:
Name Type Description
(none String | canUp | canDown | waveUp | waveDown)
Source:
index.js
Example
App.Editor.setTextTransform(val);

.setUnits(current)

Set units to canvas
Parameters:
Name Type Description
current String units (px | inch | pt | m | cm | mm)
Source:
index.js
Example
App.Editor.setUnits(units);

.setZoom(value, Step)

Set zoom step to resize all object on canvas (0.5 - 2)
Parameters:
Name Type Description
value Number zoom step
Step Number in array settings ZoomStep (1 - 4)
Source:
index.js
Example
App.Editor.setZoom(val, step);

.shareProject(email)

Project will be share (email | linkedin | facebook | twitter | google)
Parameters:
Name Type Description
email String | linkedin | facebook | twitter | google
Source:
index.js
Example
App.Editor.shareProject(type);

.shareUserImage(email, array)

Share upload images in User Images area
Parameters:
Name Type Description
email String | linkedin | facebook | twitter | google
array Array images
Source:
index.js
Example
App.Editor.shareUserImage(type, images);

.textAlign(align)

Set active text align
Parameters:
Name Type Description
align String text (left | right | center)
Source:
index.js
Example
App.Editor.textAlign(direction);

.toggleBorders(border)

Set visible/incisible border to object
Parameters:
Name Type Description
border Boolean state
Source:
index.js
Example
App.Editor.toggleBorders(state);

.toggleSmoothLine(state)

Set line smoothing
Parameters:
Name Type Description
state Boolean line
Source:
index.js
Example
App.Editor.toggleSmoothLine(state);

.undo()

[public API support] State manager undo method, get previous step from state array
Source:
index.js
Example
App.Editor.undo();

.ungroup()

Active object was ungroup
Source:
index.js
Example
App.Editor.ungroup();

.unselectAll()

[public API support] Deselect all select objects
Source:
index.js
Example
App.Editor.unselectAll();

.visibleLayer(layer)

Toggle layer visibility
Parameters:
Name Type Description
layer String id
Source:
index.js
Example
var id = this.canvas.getActiveObject().cid;
App.Editor.visibleLayer(id);

Namespace: Editor

Editor

Editor is decorator for modules ArtworkTool Editor. This is namespace include public methods and interface
Source:
index.js

Members


<static> Utils

Provides access to Utils
Source:
index.js

Methods


.addFace(face)

Add new face
Parameters:
Name Type Description
face Object data
Source:
index.js
Example
App.Editor.addFace(faceData);

.addImageToCanvas(url, isFotolia)

Image and SVG will be add to canvas. Create preview, create layer, create state
Parameters:
Name Type Description
url String image url. Use getExternal route for CRUD solution
isFotolia Boolean Drawing prices
Source:
index.js
Example
App.Editor.addImageToCanvas(url, isFotolia);

.addToCanvas(object)

Add object to canvas (It is use for object was create outside)
Parameters:
Name Type Description
object Object
Source:
index.js
Example
App.Editor.addToCanvas(obj);

.bringToFront()

Put objects on the front side. Get active canvas objects and send it to front
Source:
index.js
Example
App.Editor.bringToFront();

.buildGrid()

[public API support] Rebuild grid on canvas
Source:
index.js
Example
App.Editor.buildGrid();

.buildRuler(inZoom,, canvasOffsetX,, canvasOffsetY,)

[public API support] Rebuild ruller on offset canvas, zoom canvas
Parameters:
Name Type Description
inZoom, String If you change zoom factor, need set offset
canvasOffsetX, String Drag canvas on X axis
canvasOffsetY, String Drag canvas on Y axis
Source:
index.js
Example
App.Editor.buildRuler(inZoom, canvasOffsetX, canvasOffsetY);

.changeText(new)

Change text
Parameters:
Name Type Description
new String text
Source:
index.js
Example
App.Editor.changeText(text);

.changeZIndex(New, Old)

Put objects on the front side. Get active canvas objects and send it to front
Parameters:
Name Type Description
New Number index layer
Old Number index layer
Source:
index.js
Example
App.Editor.changeZIndex(newIndex, oldIndex);

.copyObjects()

[public API support] Copy active objects
Source:
index.js
Example
App.Editor.copyObjects();

.cutObjects()

[public API support] Paste copy objects to canvas and remove originals
Source:
index.js
Example
App.Editor.cutObjects();

.drawActivate(type, state)

Activated draw module. After that you can drawing
Parameters:
Name Type Description
type String (circle | ellipse | freeDrawing | line | polyline | rect | text | triangle)
state Boolean toggle
Source:
index.js
Example
App.Editor.drawActivate('freeDrawing', true); //Active Free Drawing

.fillFigureToCanvas()

Fill figure to canvas with proportion
Source:
index.js
Example
App.Editor.fillFigureToCanvas();

.getCanvas()

Get main canvas
Source:
index.js
Example
App.Editor.getLayers();

.getFaces()

Get all faces in project
Source:
index.js
Example
App.Editor.getFaces();

.getFacesData()

Need to admin side, get all data for all faces and canvases, snapshots
Source:
index.js
Example
App.Editor.getFacesData();

.getLayers()

Get canvas layers
Source:
index.js
Example
App.Editor.getLayers();

.getProject()

Get active project
Source:
index.js
Example
App.Editor.getProject();

.getProjectData()

Need to admin side, get all data for active project
Source:
index.js
Example
App.Editor.getProjectData();

.getSettings()

Get canvas settings
Source:
index.js
Example
App.Editor.getSettings();

.group()

Active objects was group
Source:
index.js
Example
App.Editor.group();

.groupAlign(direction)

Align objects in group
Parameters:
Name Type Description
direction String offset (bottom | center-vertical | top | right | center-horizontal | left)
Source:
index.js
Example
App.Editor.groupAlign(direction);

.hasUnsavedChanges()

Check if a project has unsaved changes App.Editor.hasUnsavedChanges();
Source:
index.js

.initialize(prop)

initialize is main Editor method create instance
Parameters:
Name Type Description
prop object Editor options
Source:
index.js
Example
var Editor = require('path/editor.js');
var App = {}
var editor = new Editor();
App.Editor = editor.initialize({
            project: this.project, //Project collection
            template : this.template, //Template collection
            templateCanvas : this.templateCanvas, //current template
            settings: this.settings, //settings model
            layers: this.layers, //layers collection
            layer: Layer //layer constructor
        });

.lockLayer(layer)

Lock/unlock layer
Parameters:
Name Type Description
layer String id
Source:
index.js
Example
var id = this.canvas.getActiveObject().cid;
App.Editor.lockLayer(id);

.lockSelect(state)

Lock selection tool from canvas
Parameters:
Name Type Description
state Boolean selection
Source:
index.js
Example
App.Editor.lockSelect(state);

.objectFlip(direction)

Flip object with center
Parameters:
Name Type Description
direction String of flip
Source:
index.js
Example
App.Editor.objectFlip(direction);

.objectMove(direction)

Change coordinates object
Parameters:
Name Type Description
direction String move (top-left | top-center | top-right | center-left | center-right | bottom-left | bottom-center | bottom-right)
Source:
index.js
Example
App.Editor.objectMove(direction);

.objectRotate(degree)

Rotate active object
Parameters:
Name Type Description
degree Number
Source:
index.js
Example
App.Editor.objectRotate(val);

.pasteObjects()

[public API support] Paste copy objects to canvas (on position copy objects)
Source:
index.js
Example
App.Editor.pasteObjects();

.previewProject()

Get preview in popup
Source:
index.js
Example
App.Editor.previewProject();

.previewProjectInternal(callback)

Paste in callback thumbnail
Parameters:
Name Type Description
callback function with past thumbnail
Source:
index.js
Example
App.Editor.previewProjectInternal(callback);

.previewSafeZone(show)

Show preview with safe zones
Parameters:
Name Type Description
show Boolean / hide safe zones
Source:
index.js
Example
App.Editor.previewSafeZone(state);

.projectPriceInfo(callback)

Paste in callback thumbnail
Parameters:
Name Type Description
callback function with past thumbnail
Source:
index.js
Example
App.Editor.previewProjectInternal(callback);

.recalculatePrice()

Calcaulate price for project
Source:
index.js
Example
App.Editor.recalculatePrice();

.redo()

[public API support] State manager redo method, get next step from state array
Source:
index.js
Example
App.Editor.redo();

.remove()

Remove single object for id. If id will be undefined, would be delete all selected objects
Source:
index.js
Example
App.Editor.remove();

.removeActiveFace()

Remove active face
Source:
index.js
Example
App.Editor.removeActiveFace();

.saveProject(name)

Project will be save
Parameters:
Name Type Description
name String project App.Editor.saveProject(name);
Source:
index.js
Example
App.Editor.saveProject(data);

.saveProjectPorthole()

Project will be save from Porthole
Source:
index.js
Example
App.Editor.saveProjectPorthole({final: 1});

.saveState(objectState)

[public API support] State manager save state in StateManager Module
Parameters:
Name Type Description
objectState object Save object
Source:
index.js
Example
App.Editor.saveState({
    method: 'add' //or asBg | changeBackground | group | init | modify | modifySelected | paste | remove | sort | transparencyBackground | ungroup
    //Other options (see state manager sub-modules)
});

.scaleToContainer()

Scale canvas to container (monitor sizes)
Source:
index.js
Example
App.Editor.scaleToContainer();

.scaleToUsual()

Scale canvas to template / project size
Source:
index.js
Example
App.Editor.scaleToUsual();

.selectAll()

[public API support] Select all active objects
Source:
index.js
Example
App.Editor.selectAll();

.selectSingle(cid)

[public API support] Select single object on cid
Parameters:
Name Type Description
cid String special id layer
Source:
index.js
Example
var id = this.canvas.getActiveObject().cid;
App.Editor.selectSingle(id);

.selectToggle(cid)

Toggle select single object on cid. Object will be select if this object was unselect
Parameters:
Name Type Description
cid String special id layer
Source:
index.js
Example
var id = this.canvas.getActiveObject().cid;
App.Editor.selectToggle(id);

.sendToBack()

Put objects on the back side. Get active canvas objects and send it to back
Source:
index.js
Example
App.Editor.sendToBack();

.setBackgroundColor(rgb, silent)

Set color to background or safe zone objects
Parameters:
Name Type Description
rgb String color
silent Boolean mode
Source:
index.js
Example
App.Editor.setBackgroundColor(rgb);

.setBackgroundTransparency(current)

Toggle transparency background or safe zone objects
Parameters:
Name Type Description
current Boolean state transparency
Source:
index.js
Example
App.Editor.setBackgroundTransparency(state);

.setBorder(type)

Set borders to canvas
Parameters:
Name Type Description
type String (fancy | flush | inset | round)
Source:
index.js
Example
App.Editor.setBorder(type);

.setBorderColor(rgb, silent)

Set color to object border (If active figure is line, polyline, freeDraw that method will be change color lines)
Parameters:
Name Type Description
rgb String color
silent Boolean mode
Source:
index.js
Example
App.Editor.setBorderColor(rgb);

.setFace(id)

Set active face to canvas
Parameters:
Name Type Description
id String Face id
Source:
index.js
Example
App.Editor.setFace(id);

.setFigureAsBackground(state)

Send object to back, lock all properties changes
Parameters:
Name Type Description
state Boolean
Source:
index.js
Example
App.Editor.setFigureAsBackground(state);

.setFigureColor(rgb)

Change color of figure If active figure is line, polyline, freeDraw that method will be change fill color these figures
Parameters:
Name Type Description
rgb String color
Source:
index.js
Example
App.Editor.setFigureColor(rgb);

.setFigureHeight(value)

Change figure height
Parameters:
Name Type Description
value Number
Source:
index.js
Example
App.Editor.setFigureHeight(value);

.setFigureOpacity(opacity)

Change active object opacity
Parameters:
Name Type Description
opacity Number 0 ... 100
Source:
index.js
Example
App.Editor.setFigureOpacity(val);

.setFigureWidth(value)

Change figure width
Parameters:
Name Type Description
value Number
Source:
index.js
Example
App.Editor.setFigureWidth(value);

.setFontFamily(Font)

Change font family for active text
Parameters:
Name Type Description
Font String name
Source:
index.js
Example
App.Editor.setFontFamily(fontfamily);

.setFontSize(font)

Set active text font size in units
Parameters:
Name Type Description
font String size in units
Source:
index.js
Example
App.Editor.setFontSize(fontSize);

.setGridColors(rgb)

Set default grid color
Parameters:
Name Type Description
rgb String color
Source:
index.js
Example
App.Editor.setGridColors(rgb);

.setLetterSpacing(value)

Set letter spacing for active text
Parameters:
Name Type Description
value Number letter spacing
Source:
index.js
Example
App.Editor.setLetterSpacing(val);

.setLineSmoothValue(value)

Set line smoothing value
Parameters:
Name Type Description
value Number
Source:
index.js
Example
App.Editor.setLineSmoothValue(state);

.setMantainProportion(state)

Change mantain proportion
Parameters:
Name Type Description
state Boolean
Source:
index.js
Example
App.Editor.setFigureHeight(value);

.setObjectOffset(direction)

Set object to corner of canvas
Parameters:
Name Type Description
direction String offset (top-left | top-center | top-right | center-left | center-right | bottom-left | bottom-center | bottom-right)
Source:
index.js
Example
App.Editor.setObjectOffset(offset, object, layer);

.setPreloader(show, description)

Show / hide preloader
Parameters:
Name Type Description
show Boolean / hide preloader
description text preloader
Source:
index.js
Example
App.Editor.setPreloader(state, text);

.setRulerUnits(Unit)

[public API support] Set current unit to ruller
Parameters:
Name Type Description
Unit String name
Source:
index.js
Example
App.Editor.setRulerUnits(unit);

.setShapeColors(rgb)

Set default color to shapes
Parameters:
Name Type Description
rgb String color
Source:
index.js
Example
App.Editor.setShapeColors(rgb);

.setStrokeOpacity(opacity)

Set opacity to object border
Parameters:
Name Type Description
opacity String value
Source:
index.js
Example
App.Editor.setStrokeOpacity(val);

.setStrokeWidth(width)

Set width object border
Parameters:
Name Type Description
width String in current units (automatical recalculation)
Source:
index.js
Example
App.Editor.setStrokeWidth(val);

.setTextBold(state)

Set bold for active text
Parameters:
Name Type Description
state Boolean bold
Source:
index.js
Example
App.Editor.setTextBold(state);

.setTextItalic(state)

Set italic for active text
Parameters:
Name Type Description
state Boolean italic
Source:
index.js
Example
App.Editor.setTextBold(state, object, layer);

.setTextLineHeight(value)

Set line height for active text
Parameters:
Name Type Description
value Number line height
Source:
index.js
Example
App.Editor.setTextLineHeight(val);

.setTextShadow(state)

Active text shadow
Parameters:
Name Type Description
state Boolean of shadow
Source:
index.js
Example
App.Editor.setTextShadow(state);

.setTextShadowBlur(shadow)

Set text shadow blur
Parameters:
Name Type Description
shadow Number blur (0 - None, 1 - light shadow, 3 - medium shadow, 5 - large shadow)
Source:
index.js
Example
App.Editor.setTextShadowBlur(val);

.setTextShadowColor(rgb, silent)

Set text shadow color
Parameters:
Name Type Description
rgb String color
silent Boolean mode
Source:
index.js
Example
App.Editor.setTextShadowColor(rgb);

.setTextShadowPosition((none)

Set text shadow position
Parameters:
Name Type Description
(none String | tl - top left | t - top | tr - top right | r - right | br - bottom right | b - bottom | bl - bottom left | l - left)
Source:
index.js
Example
App.Editor.setTextShadowPosition(val);

.setTextTransform((none)

Set text transform
Parameters:
Name Type Description
(none String | canUp | canDown | waveUp | waveDown)
Source:
index.js
Example
App.Editor.setTextTransform(val);

.setUnits(current)

Set units to canvas
Parameters:
Name Type Description
current String units (px | inch | pt | m | cm | mm)
Source:
index.js
Example
App.Editor.setUnits(units);

.setZoom(value, Step)

Set zoom step to resize all object on canvas (0.5 - 2)
Parameters:
Name Type Description
value Number zoom step
Step Number in array settings ZoomStep (1 - 4)
Source:
index.js
Example
App.Editor.setZoom(val, step);

.shareProject(email)

Project will be share (email | linkedin | facebook | twitter | google)
Parameters:
Name Type Description
email String | linkedin | facebook | twitter | google
Source:
index.js
Example
App.Editor.shareProject(type);

.shareUserImage(email, array)

Share upload images in User Images area
Parameters:
Name Type Description
email String | linkedin | facebook | twitter | google
array Array images
Source:
index.js
Example
App.Editor.shareUserImage(type, images);

.textAlign(align)

Set active text align
Parameters:
Name Type Description
align String text (left | right | center)
Source:
index.js
Example
App.Editor.textAlign(direction);

.toggleBorders(border)

Set visible/incisible border to object
Parameters:
Name Type Description
border Boolean state
Source:
index.js
Example
App.Editor.toggleBorders(state);

.toggleSmoothLine(state)

Set line smoothing
Parameters:
Name Type Description
state Boolean line
Source:
index.js
Example
App.Editor.toggleSmoothLine(state);

.undo()

[public API support] State manager undo method, get previous step from state array
Source:
index.js
Example
App.Editor.undo();

.ungroup()

Active object was ungroup
Source:
index.js
Example
App.Editor.ungroup();

.unselectAll()

[public API support] Deselect all select objects
Source:
index.js
Example
App.Editor.unselectAll();

.visibleLayer(layer)

Toggle layer visibility
Parameters:
Name Type Description
layer String id
Source:
index.js
Example
var id = this.canvas.getActiveObject().cid;
App.Editor.visibleLayer(id);