-
Notifications
You must be signed in to change notification settings - Fork 0
/
code.ts
85 lines (70 loc) · 2.28 KB
/
code.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
/**
*
* Öppenlab dot grid
* https://oppenlab.net/
*
* See: https://www.figma.com/plugin-docs/intro/
*/
let dotSize = 1;
let distance = 12;
figma.ui.onmessage = async(params) => {
var values = params.split(":") as Array<string>;
dotSize = Number(values[0]);
distance = Number(values[1]);
build((values.length > 2));//Nasty, just replace message string with a class
}
figma.showUI(__html__, {
width: 270,
height: 140
});
function numberOfDots(width: number, height: number, distance: number, dotSize: number): Number{
const numberHorizontal = width/distance;
const numberVertical = height/distance;
return numberHorizontal * numberVertical;
}
function build(overrideWarning: boolean){
const node = figma.currentPage.selection[0];
if(node && node.type == "RECTANGLE"){
const xStart = node.x;
const yStart = node.y;
const width = node.width;
const height = node.height;
console.log("Distance: " + distance);
console.log("Dot size: " + dotSize);
console.log("Width: " + width + " Height: " + height);
const inc = Math.floor(distance);
const size = Math.floor(dotSize);
const count = numberOfDots(width, height, inc, size);
console.log("Total grid dots: " + count + " override: " + overrideWarning);
if(overrideWarning == false && count > 4000){
figma.ui.postMessage(count);
return;
}
const gridParent = figma.createFrame();
gridParent.x = node.x;
gridParent.y = node.y;
gridParent.resize(node.width, node.height);
for(var y = size; y < height; y += inc){
for(var x = size; x < width; x += inc){
const ellipse = figma.createEllipse();
ellipse.x = x;
ellipse.y = y;
ellipse.resize(size, size);
gridParent.appendChild(ellipse);
}
}
let group = figma.group(gridParent.children, figma.currentPage);
let flat = figma.flatten(group.children, figma.currentPage);
flat.fills = node.fills;
node.visible = false;
gridParent.remove();
const index = node.parent.children.findIndex(_node => _node.id == node.id);
node.parent.insertChild(index+1, flat);
figma.closePlugin();
}else{
showAlert("Select a rectangle to generate a dot grid");
}
function showAlert(message: String){
figma.ui.postMessage(message)
}
}