Skip to main content

FancyProductDesignerView

Classes

FancyProductDesignerViewEventTarget

Functions

init()

This method needs to be called to initialize the generation.

loadElements(elements, callback)

Removes the current elements and loads a set of new elements into the view.

toDataURL(callback, [options], [deselectElement])

Creates a data URL of the view.

toSVG([options], [fontsToEmbed])String

Returns the view as SVG.

toggleLock(toggle)Boolean

Toggles the lockment of view. If the view is locked, the price of the view will not be added to the total product price.

changePrice(price, operator)Number

Changes the price by an operator, + or -.

Events

"priceChange" (event)

Gets fired as soon as the price has changed.

FancyProductDesignerView ⇐ EventTarget

Kind: global class
Extends: EventTarget

new FancyProductDesignerView(container, [viewData], [callback], [fabricCanvasOptions])

Creates a new FancyProductDesignerView.

ParamTypeDefaultDescription
containerHTMLElementThe container for the Fancy Product Designer View.
[viewData]Object{}The initial view data.
[callback]functionCallback when view is created.
[fabricCanvasOptions]Object{}Options for fabricJS canvas.

FancyProductDesignerView~totalPrice : Number

The total price for the view without max. price.

Kind: inner property of FancyProductDesignerView
Default: 0
Read only: true

FancyProductDesignerView~truePrice : Number

The total price for the view including max. price and corrert formatting.

Kind: inner property of FancyProductDesignerView
Default: 0
Read only: true

FancyProductDesignerView~additionalPrice : Number

Additional price for the view.

Kind: inner property of FancyProductDesignerView
Default: 0
Read only: true

FancyProductDesignerView~mask : Object

The properties for the mask object (url, left, top, width, height).

Kind: inner property of FancyProductDesignerView
Default: null
Read only: true

init()

This method needs to be called to initialize the generation.

Kind: global function

loadElements(elements, callback)

Removes the current elements and loads a set of new elements into the view.

Kind: global function

ParamTypeDescription
elementsArrayAn array containing elements.
callbackfunctionA function that will be called when all elements have beed added.

toDataURL(callback, [options], [deselectElement])

Creates a data URL of the view.

Kind: global function

ParamTypeDefaultDescription
callbackfunctionA function that will be called when the data URL is created. The function receives the data URL.
[options]ObjectSee fabricjs documentation http://fabricjs.com/docs/fabric.Canvas.html#toDataURL.
[options.onlyExportable]BooleanfalseIf true elements with excludeFromExport=true are not exported in the image.
[options.backgroundColor]String"transparent"The background color as hexadecimal value. For 'png' you can also use 'transparent'.
[options.watermarkImg]fabric.ImageA fabricJS image that includes the watermark image.
[deselectElement]BooleantrueDeselect current selected element.

toSVG([options], [fontsToEmbed]) ⇒ String

Returns the view as SVG.

Kind: global function
Returns: String - A XML representing a SVG.

ParamTypeDefaultDescription
[options]ObjectSee fabricjs documentation http://fabricjs.com/docs/fabric.Canvas.html#toSVG
[options.watermarkImg]fabric.ImageA fabricJS image that includes the watermark image.
[options.reviver]functionSee fabricjs documentation http://fabricjs.com/docs/fabric.Canvas.html#toSVG
[options.respectPrintingBox]BooleanfalseOnly generate SVG from printing box
[fontsToEmbed]Array[]Aan array containing fonts to embed in the SVG. You can use getUsedFonts method

toggleLock(toggle) ⇒ Boolean

Toggles the lockment of view. If the view is locked, the price of the view will not be added to the total product price.

Kind: global function
Returns: Boolean - The toggle state.

ParamTypeDescription
toggleBooleanThe toggle state.

changePrice(price, operator) ⇒ Number

Changes the price by an operator, + or -.

Kind: global function
Returns: Number - The total price of the view.

ParamTypeDescription
priceNumberPrice as number.
operatorString"+" or "-".

"priceChange" (event)

Gets fired as soon as the price has changed.

Kind: event emitted

ParamTypeDescription
eventEvent
event.detail.elementPricenumberThe price of the added element.
event.detail.truePricenumberThe total price.