## For which product do you need support?

Start a new topic

## Size of all elements

I would like to get a size of the hole designed set. So my customers can actually see what height and length they are going to order.

It would be way more easier to calculare a price with real sizes of the designed product (in my case, plotter film), also you can calculate the area, and get a 100% safe price for their designed products. It would be awesome, if you also can set up pricing rules for specific area sizes. Since I was tired of waiting for a reply. I coded it by myself.

Open assets/js/FancyProductDesigner.js (run in debug mode)

do your stuff you need in that function and than call:

```var allElements = new Array();

function calcPriceBox(){
var TL = {x:9999, y:9999}; //not fancy, but works
var LR = {x:0, y:0};

allElements.forEach(function(e){
TL.x = TL.x < e.oCoords.tl.x ? TL.x : e.oCoords.tl.x;
TL.y = TL.y < e.oCoords.tl.y ? TL.y : e.oCoords.tl.y;

TL.x = TL.x < e.oCoords.tr.x ? TL.x : e.oCoords.tr.x;
TL.y = TL.y < e.oCoords.tr.y ? TL.y : e.oCoords.tr.y;

TL.x = TL.x < e.oCoords.br.x ? TL.x : e.oCoords.br.x;
TL.y = TL.y < e.oCoords.br.y ? TL.y : e.oCoords.br.y;

TL.x = TL.x < e.oCoords.bl.x ? TL.x : e.oCoords.bl.x;
TL.y = TL.y < e.oCoords.bl.y ? TL.y : e.oCoords.bl.y;

LR.x = LR.x > e.oCoords.tl.x ? LR.x : e.oCoords.tl.x;
LR.y = LR.y > e.oCoords.tl.y ? LR.y : e.oCoords.tl.y;

LR.x = LR.x > e.oCoords.tr.x ? LR.x : e.oCoords.tr.x;
LR.y = LR.y > e.oCoords.tr.y ? LR.y : e.oCoords.tr.y;

LR.x = LR.x > e.oCoords.br.x ? LR.x : e.oCoords.br.x;
LR.y = LR.y > e.oCoords.br.y ? LR.y : e.oCoords.br.y;

LR.x = LR.x > e.oCoords.bl.x ? LR.x : e.oCoords.bl.x;
LR.y = LR.y > e.oCoords.bl.y ? LR.y : e.oCoords.bl.y;
});
var foilbox = {width:0, height:0, aspect:0}
//get this box that contains every element
foilbox.width = LR.x - TL.x;
foilbox.height = LR.y - TL.y;
foilbox.aspect = foilbox.width / foilbox.height;
return foilbox;
}```

with this function you will get box (in pixels) I made in the post before with my awesome drawing skills.

Of course you need to add every element in an array you can access... I made it dirty and made my own.. IDGAS..

```if(action === "elementAdd")
allElements.push(element);
else if(action === "elementRemove"){
allElements.indexOf(element);
allElements.splice(myFuckingElements.indexOf(element), 1);
}```

I use it like this: (shortened)

``` if(allElements.length > 0){
var priceBox = calcPriceBox();
foilSize.width = \$(".decal .size .length").val(); //real length of the ding you design e.g. 20cm (val: 20)
foilSize.height = round(foilSize.width / priceBox.aspect,2); //calc the real height of it
var area = foilSize.width * foilSize.height;
//calculate a price. maybe with the area, maybe with a crazy mathematical workarounds
}
return price;```

1 Comment

Since I was tired of waiting for a reply. I coded it by myself.

Open assets/js/FancyProductDesigner.js (run in debug mode)

do your stuff you need in that function and than call:

```var allElements = new Array();

function calcPriceBox(){
var TL = {x:9999, y:9999}; //not fancy, but works
var LR = {x:0, y:0};

allElements.forEach(function(e){
TL.x = TL.x < e.oCoords.tl.x ? TL.x : e.oCoords.tl.x;
TL.y = TL.y < e.oCoords.tl.y ? TL.y : e.oCoords.tl.y;

TL.x = TL.x < e.oCoords.tr.x ? TL.x : e.oCoords.tr.x;
TL.y = TL.y < e.oCoords.tr.y ? TL.y : e.oCoords.tr.y;

TL.x = TL.x < e.oCoords.br.x ? TL.x : e.oCoords.br.x;
TL.y = TL.y < e.oCoords.br.y ? TL.y : e.oCoords.br.y;

TL.x = TL.x < e.oCoords.bl.x ? TL.x : e.oCoords.bl.x;
TL.y = TL.y < e.oCoords.bl.y ? TL.y : e.oCoords.bl.y;

LR.x = LR.x > e.oCoords.tl.x ? LR.x : e.oCoords.tl.x;
LR.y = LR.y > e.oCoords.tl.y ? LR.y : e.oCoords.tl.y;

LR.x = LR.x > e.oCoords.tr.x ? LR.x : e.oCoords.tr.x;
LR.y = LR.y > e.oCoords.tr.y ? LR.y : e.oCoords.tr.y;

LR.x = LR.x > e.oCoords.br.x ? LR.x : e.oCoords.br.x;
LR.y = LR.y > e.oCoords.br.y ? LR.y : e.oCoords.br.y;

LR.x = LR.x > e.oCoords.bl.x ? LR.x : e.oCoords.bl.x;
LR.y = LR.y > e.oCoords.bl.y ? LR.y : e.oCoords.bl.y;
});
var foilbox = {width:0, height:0, aspect:0}
//get this box that contains every element
foilbox.width = LR.x - TL.x;
foilbox.height = LR.y - TL.y;
foilbox.aspect = foilbox.width / foilbox.height;
return foilbox;
}```

with this function you will get box (in pixels) I made in the post before with my awesome drawing skills.

Of course you need to add every element in an array you can access... I made it dirty and made my own.. IDGAS..

```if(action === "elementAdd")
allElements.push(element);
else if(action === "elementRemove"){
allElements.indexOf(element);
allElements.splice(myFuckingElements.indexOf(element), 1);
}```

I use it like this: (shortened)

``` if(allElements.length > 0){
var priceBox = calcPriceBox();
foilSize.width = \$(".decal .size .length").val(); //real length of the ding you design e.g. 20cm (val: 20)
foilSize.height = round(foilSize.width / priceBox.aspect,2); //calc the real height of it
var area = foilSize.width * foilSize.height;
//calculate a price. maybe with the area, maybe with a crazy mathematical workarounds
}
return price;``` 