LabelColorUI.jsx
(function() {
function createLabelColorPanel(thisObj) {
var win = (thisObj instanceof Panel) ? thisObj : new Window("palette", "Change Layer Label", undefined, { resizeable: false });
var labelColors = [
{ name: "None", id: 0, color: [102/255, 102/255, 102/255] },
{ name: "Red", id: 1, color: [181/255, 56/255, 56/255] },
{ name: "Yellow", id: 2, color: [228/255, 216/255, 76/255] },
{ name: "Aqua", id: 3, color: [169/255, 203/255, 199/255] },
{ name: "Pink", id: 4, color: [229/255, 188/255, 201/255] },
{ name: "Lavender", id: 5, color: [169/255, 169/255, 202/255] },
{ name: "Peach", id: 6, color: [221/255, 193/255, 158/255] },
{ name: "Sea Foam", id: 7, color: [179/255, 199/255, 179/255] },
{ name: "Blue", id: 8, color: [103/255, 125/255, 224/255] },
{ name: "Green", id: 9, color: [ 74/255, 164/255, 76/255] },
{ name: "Purple", id: 10, color: [142/255, 44/255, 154/255] },
{ name: "Orange", id: 11, color: [232/255, 146/255, 13/255] },
{ name: "Brown", id: 12, color: [127/255, 69/255, 42/255] },
{ name: "Fuchsia", id: 13, color: [244/255, 109/255, 214/255] },
{ name: "Cyan", id: 14, color: [ 61/255, 162/255, 165/255] },
{ name: "Sandstone", id: 15, color: [168/255, 150/255, 119/255] },
{ name: "Dark Green", id: 16, color: [ 30/255, 64/255, 30/255] }
];
var btnGroup = win.add("group");
btnGroup.orientation = "column";
btnGroup.alignment = ["left", "top"];
btnGroup.spacing = 3; // 余白を最適化
for (var i = 0; i < labelColors.length; i++) {
(function(colorObj) {
var row = btnGroup.add("group");
row.orientation = "row";
row.alignment = ["fill", "center"];
row.spacing = 2;
// **ボタンの代わりに Panel をクリック可能に**
var colorPanel = row.add("panel", undefined, undefined, { borderStyle: "sunken" });
colorPanel.size = [22, 22]; // サイズを大きく
colorPanel.minimumSize = [22, 22]; // 縮小を防ぐ
try {
var g = colorPanel.graphics;
g.backgroundColor = g.newBrush(g.BrushType.SOLID_COLOR, colorObj.color);
} catch (e) {
alert("Error applying color: " + e.toString());
}
// **Panel にクリックイベントを追加**
colorPanel.addEventListener("click", function() {
var comp = app.project.activeItem;
if (!comp || !(comp instanceof CompItem)) {
alert("Please select a composition first.");
return;
}
if (comp.selectedLayers.length === 0) {
alert("Please select at least one layer.");
return;
}
app.beginUndoGroup("Change Layer Label");
for (var j = 0; j < comp.selectedLayers.length; j++) {
comp.selectedLayers[j].label = colorObj.id;
}
app.endUndoGroup();
});
})(labelColors[i]);
}
win.layout.layout(true);
win.layout.resize();
win.onResizing = win.onResize = function() { win.layout.resize(); };
if (win instanceof Window) {
win.center();
win.show();
}
}
createLabelColorPanel(this);
})();
OLD
(function() {
function createLabelColorPanel(thisObj) {
var win = (thisObj instanceof Panel) ? thisObj : new Window("palette", "Change Layer Label", undefined, { resizeable: false });
var labelColors = [
{ name: "None", id: 0, color: [0.5, 0.5, 0.5] },
{ name: "Red", id: 1, color: [0.79, 0.24, 0.24] },
{ name: "Yellow", id: 2, color: [0.85, 0.80, 0.41] },
{ name: "Aqua", id: 3, color: [0.50, 0.67, 0.64] },
{ name: "Pink", id: 4, color: [0.84, 0.54, 0.60] },
{ name: "Lavender", id: 5, color: [0.72, 0.62, 0.76] },
{ name: "Peach", id: 6, color: [0.80, 0.69, 0.57] },
{ name: "Sea Foam", id: 7, color: [0.61, 0.69, 0.55] },
{ name: "Blue", id: 8, color: [0.38, 0.54, 0.77] },
{ name: "Green", id: 9, color: [0.43, 0.62, 0.38] },
{ name: "Purple", id: 10, color: [0.53, 0.32, 0.58] },
{ name: "Orange", id: 11, color: [0.73, 0.42, 0.15] },
{ name: "Brown", id: 12, color: [0.48, 0.35, 0.20] },
{ name: "Fuchsia", id: 13, color: [0.76, 0.36, 0.55] },
{ name: "Cyan", id: 14, color: [0.34, 0.63, 0.69] },
{ name: "Sandstone", id: 15, color: [0.69, 0.56, 0.41] },
{ name: "Dark Green", id: 16, color: [0.32, 0.42, 0.30] }
];
var btnGroup = win.add("group");
btnGroup.orientation = "column";
btnGroup.alignment = ["left", "top"];
btnGroup.spacing = 4; // 余白を最適化
for (var i = 0; i < labelColors.length; i++) {
(function(colorObj) {
var row = btnGroup.add("group");
row.orientation = "row";
row.alignment = ["fill", "center"];
row.spacing = 4;
// **色付きの四角を Panel で作成**
var colorPanel = row.add("panel", undefined, undefined, { borderStyle: "etched" });
colorPanel.size = [20, 20]; // サイズを大きく
colorPanel.minimumSize = [20, 20]; // 縮小を防ぐ
try {
var g = colorPanel.graphics;
g.backgroundColor = g.newBrush(g.BrushType.SOLID_COLOR, colorObj.color);
} catch (e) {
alert("Error applying color: " + e.toString());
}
// **ボタンを作成（少し小さめに）**
var btn = row.add("button", undefined, colorObj.name);
btn.size = [75, 25]; // ボタンサイズも調整
// **ボタンの文字色を調整**
var brightness = (colorObj.color[0] * 0.299) + (colorObj.color[1] * 0.587) + (colorObj.color[2] * 0.114);
btn.graphics.foregroundColor = btn.graphics.newPen(
btn.graphics.PenType.SOLID_COLOR,
brightness > 0.5 ? [0, 0, 0, 1] : [1, 1, 1, 1],
1
);
btn.onClick = function() {
var comp = app.project.activeItem;
if (!comp || !(comp instanceof CompItem)) {
alert("Please select a composition first.");
return;
}
if (comp.selectedLayers.length === 0) {
alert("Please select at least one layer.");
return;
}
app.beginUndoGroup("Change Layer Label");
for (var j = 0; j < comp.selectedLayers.length; j++) {
comp.selectedLayers[j].label = colorObj.id;
}
app.endUndoGroup();
};
})(labelColors[i]);
}
win.layout.layout(true);
win.layout.resize();
win.onResizing = win.onResize = function() { win.layout.resize(); };
if (win instanceof Window) {
win.center();
win.show();
}
}
createLabelColorPanel(this);
})();
(function() {
function createLabelColorPanel(thisObj) {
var win = (thisObj instanceof Panel) ? thisObj : new Window("palette", "Change Layer Label", undefined, { resizeable: false });
var labelColors = [
{ name: "None", id: 0, color: [0.5, 0.5, 0.5] },
{ name: "Red", id: 1, color: [0.79, 0.24, 0.24] },
{ name: "Yellow", id: 2, color: [0.85, 0.80, 0.41] },
{ name: "Aqua", id: 3, color: [0.50, 0.67, 0.64] },
{ name: "Pink", id: 4, color: [0.84, 0.54, 0.60] },
{ name: "Lavender", id: 5, color: [0.72, 0.62, 0.76] },
{ name: "Peach", id: 6, color: [0.80, 0.69, 0.57] },
{ name: "Sea Foam", id: 7, color: [0.61, 0.69, 0.55] },
{ name: "Blue", id: 8, color: [0.38, 0.54, 0.77] },
{ name: "Green", id: 9, color: [0.43, 0.62, 0.38] },
{ name: "Purple", id: 10, color: [0.53, 0.32, 0.58] },
{ name: "Orange", id: 11, color: [0.73, 0.42, 0.15] },
{ name: "Brown", id: 12, color: [0.48, 0.35, 0.20] },
{ name: "Fuchsia", id: 13, color: [0.76, 0.36, 0.55] },
{ name: "Cyan", id: 14, color: [0.34, 0.63, 0.69] },
{ name: "Sandstone", id: 15, color: [0.69, 0.56, 0.41] },
{ name: "Dark Green", id: 16, color: [0.32, 0.42, 0.30] }
];
var btnGroup = win.add("group");
btnGroup.orientation = "column";
btnGroup.alignment = ["left", "top"];
btnGroup.spacing = 2; // 余白を減らす
for (var i = 0; i < labelColors.length; i++) {
(function(colorObj) {
var row = btnGroup.add("group");
row.orientation = "row";
row.alignment = ["fill", "center"];
row.spacing = 5;
// 色を表現するための StaticText
var colorBox = row.add("statictext", undefined, "■");
colorBox.size = [15, 15];
try {
var g = colorBox.graphics;
g.foregroundColor = g.newPen(g.PenType.SOLID_COLOR, colorObj.color, 1);
} catch (e) {
alert("Error applying color: " + e.toString());
}
// ボタンを作成（小さめに調整）
var btn = row.add("button", undefined, colorObj.name);
btn.size = [80, 20];
// ボタンの文字色を調整（明るい背景なら黒、暗い背景なら白）
var brightness = (colorObj.color[0] * 0.299) + (colorObj.color[1] * 0.587) + (colorObj.color[2] * 0.114);
btn.graphics.foregroundColor = btn.graphics.newPen(
btn.graphics.PenType.SOLID_COLOR,
brightness > 0.5 ? [0, 0, 0, 1] : [1, 1, 1, 1],
1
);
btn.onClick = function() {
var comp = app.project.activeItem;
if (!comp || !(comp instanceof CompItem)) {
alert("Please select a composition first.");
return;
}
if (comp.selectedLayers.length === 0) {
alert("Please select at least one layer.");
return;
}
app.beginUndoGroup("Change Layer Label");
for (var j = 0; j < comp.selectedLayers.length; j++) {
comp.selectedLayers[j].label = colorObj.id;
}
app.endUndoGroup();
};
})(labelColors[i]);
}
win.layout.layout(true);
win.layout.resize();
win.onResizing = win.onResize = function() { win.layout.resize(); };
if (win instanceof Window) {
win.center();
win.show();
}
}
createLabelColorPanel(this);
})();