JavaScript to change the Gradient color
Hi,
I have this script that works perfectly fine. However, I have a new requirement to specifically target the gradient layers "Gradient Fill 1456" and "Gradient Fill 1459" within the designated layer groups. Additionally, the left Stop Color of these gradients should match the gradientColorInput color provided by the user.
Link to PSD: https://drive.google.com/file/d/1FlfauSXbxwKIXtAEGaxgxrMQoTy_P7aJ/view?usp=sharing
Layer group name 1: Additional gradients (FOLDER opacity must not exceed 40%)
Gradient Layer name 1: Gradient Fill 1456
Layer group name 2: Crop Gradient (Don't use with other graident)
Gradient Layer name 2: Gradient Fill 1459
In the Gradient Layer 1 and 2, there's a gradient fill applied. The left Stop Color value in the gradient map should match the 'gradientColorInput' color (user Input as per the script).
function showDialog() {
var dialog = new Window('dialog', 'Set Layer Group Colors');
// Add checkboxes
var gradientCheckbox = dialog.add('checkbox', undefined, 'Gradient');
var gradientColorInput = dialog.add('edittext', undefined, '#FFFFFF');
gradientColorInput.characters = 7;
gradientColorInput.enabled = false; // Disable until checkbox is selected
var accentColorCheckbox = dialog.add('checkbox', undefined, 'Accent Colour');
var accentColorInput = dialog.add('edittext', undefined, '#FFFFFF');
accentColorInput.characters = 7;
accentColorInput.enabled = false; // Disable until checkbox is selected
// Enable color inputs when checkboxes are selected
gradientCheckbox.onClick = function() {
gradientColorInput.enabled = gradientCheckbox.value;
};
accentColorCheckbox.onClick = function() {
accentColorInput.enabled = accentColorCheckbox.value;
};
// Add buttons
var buttons = dialog.add('group');
buttons.alignment = 'right';
buttons.add('button', undefined, 'OK', { name: 'ok' });
buttons.add('button', undefined, 'Cancel', { name: 'cancel' });
if (dialog.show() === 1) {
var tasks = []; // Initialize tasks as an array
if (gradientCheckbox.value) {
tasks.push({ layerName: 'gradient', colorHex: gradientColorInput.text });
}
if (accentColorCheckbox.value) {
tasks.push({
layerName: 'accent colour',
colorHex: accentColorInput.text
});
}
// Loop through each task and apply settings
for (var i = 0; i < tasks.length; i++) {
activateLayersAndApplyAction(tasks[i].layerName, tasks[i].colorHex);
}
} else {
dialog.close();
}
}
function activateLayersAndApplyAction(layerName, hexColor) {
var doc = app.activeDocument;
var hex = hexColor.replace('#', '');
if (hex.length !== 6 || !/^[\dA-Fa-f]{6}$/.test(hex)) {
alert(
'Invalid hex color for ' +
layerName +
'. Please enter a 6-digit hex color code.'
);
return;
}
var rValue = parseInt(hex.substring(0, 2), 16);
var gValue = parseInt(hex.substring(2, 4), 16);
var bValue = parseInt(hex.substring(4, 6), 16);
var colorValues = { r: rValue, g: gValue, b: bValue };
processLayers(doc, layerName.toLowerCase(), colorValues);
}
function processLayers(layerSet, layerName, colorValues) {
if (!layerSet || !layerSet.layers) return;
for (var i = 0; i < layerSet.layers.length; i++) {
var layer = layerSet.layers[i];
if (layer.typename === 'LayerSet') {
if (layer.name.toLowerCase() === layerName) {
var targetLayer = findLayerInGroup(layer, 'change me');
if (targetLayer) {
app.activeDocument.activeLayer = targetLayer;
interactiveSetColorFill(targetLayer, colorValues);
}
}
processLayers(layer, layerName, colorValues);
}
}
}
function findLayerInGroup(layerGroup, layerName) {
for (var i = 0; i < layerGroup.layers.length; i++) {
if (layerGroup.layers[i].name.toLowerCase() === layerName.toLowerCase()) {
return layerGroup.layers[i];
}
}
return null;
}
function interactiveSetColorFill(layer, colorValues) {
var s2t = function(s) {
return app.stringIDToTypeID(s);
};
var ref = new ActionReference();
ref.putEnumerated(s2t('contentLayer'), s2t('ordinal'), s2t('targetEnum'));
var desc = new ActionDescriptor();
desc.putReference(s2t('null'), ref);
var colorDesc = new ActionDescriptor();
colorDesc.putDouble(s2t('red'), colorValues.r);
colorDesc.putDouble(s2t('green'), colorValues.g);
colorDesc.putDouble(s2t('blue'), colorValues.b);
var listDesc = new ActionDescriptor();
listDesc.putObject(s2t('color'), s2t('RGBColor'), colorDesc);
desc.putObject(s2t('to'), s2t('solidColorLayer'), listDesc);
executeAction(s2t('set'), desc, DialogModes.NO);
}
// Call the show dialog function to start the process
showDialog();
