graphic:javascript:photoshop

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Next revision
Previous revision
graphic:javascript:photoshop [2021/08/22 19:48] – created yinggraphic:javascript:photoshop [2023/03/05 03:02] (current) – [Doc operation code] ying
Line 1: Line 1:
 +====== Enable Javascript in Photoshop 2022 above ======
 +
 +  * to avoid warning pop dialog, you need to create a file at <code>%appdata%\Adobe\Adobe Photoshop 2022\Adobe Photoshop 2022 Settings\PSUserConfig.txt
 +%appdata%\Adobe\Adobe Photoshop 2022\Adobe Photoshop 2022 Settings\PSUserConfig
 +at path:
 +%appdata%\Adobe\Adobe Photoshop 2022\Adobe Photoshop 2022 Settings\
 +</code>
 +  * with content inside PSUserConfig.txt and also PSUserConfig (no ext in case for win10) (also enable ps use wacom instead ink code here)<code>WarnRunningScripts 0
 +UseSystemStylus 0
 +</code>
 +  * more config text cmd here: https://helpx.adobe.com/sg/photoshop/kb/enable-optional-extensions-photoshop-cc.html
 +====== Javascript Version and Compatibility ======
 +
 +  * JS ES3 (1999): photoshop js based on.
 +  * JS ES4
 +  * JS ES5: .trim()
 +  * JS ES6 (2015): let const, arrow
 +  * JS 2016: array.includes()
 +  * JS 2017: string padding
 +  * JS 2018: 
 +
 +  * note
 +    * function with default parameter: <code javascript>
 +function hex2rgb(hex, asList) {
 +    asList = asList || 0; // default not as list but as dict
 +}
 +</code>
 +      * ref: https://code.tutsplus.com/tutorials/how-to-use-optional-function-parameters-in-javascript--cms-37376
 +    * startswith support
 +    * check JS version: $.about()
 +
 +  * ref: 
 +    * https://helpx.adobe.com/after-effects/using/legacy-and-extend-script-engine.html
 +    * https://www.w3schools.com/js/js_versions.asp
 +
 ====== My Photoshop Script ====== ====== My Photoshop Script ======
  
Line 72: Line 107:
 } }
 </code> </code>
-    * after CS5 <code javascript>activeDocument.guides.add(Direction.VERTICAL, 100); // orientation and offset</code>+    * after CS5 <code javascript>activeDocument.guides.add(Direction.VERTICAL, 100); // orientation and offset 
 +activeDocument.guides.removeAll() 
 +</code>
  
  
Line 250: Line 287:
 </code> </code>
   * resize doc <code javascript>app.activeDocument.resizeImage('150%', '150%');</code>   * resize doc <code javascript>app.activeDocument.resizeImage('150%', '150%');</code>
 +  * resize to A4 size ratio <code javascript>
 +/*
 +reisize to fit A4
 +by ying n chatGPT
 +2023.03.05
 +*/
 +// Get the active document
 +var doc = app.activeDocument;
 +app.backgroundColor.rgb.red = 255;
 +app.backgroundColor.rgb.green = 255;
 +app.backgroundColor.rgb.blue = 255;
 +// Define the A4 size in pixels (assuming 300 DPI)
 +var a4Width = 2480; // 8.27 inches * 300 pixels per inch
 +var a4Height = 3508; // 11.69 inches * 300 pixels per inch
 +var a4Ratio = a4Width / a4Height;
 +
 +// Get the current canvas size
 +var currentWidth = doc.width.value;
 +var currentHeight = doc.height.value;
 +var currentRatio = currentWidth / currentHeight;
 +
 +// Calculate the new canvas size
 +var newWidth = currentWidth;
 +var newHeight = currentHeight;
 +if (currentRatio > a4Ratio) {
 +  // Extend the height to match the A4 ratio
 +  newHeight = Math.round(newWidth / a4Ratio);
 +} else {
 +  // Extend the width to match the A4 ratio
 +  newWidth = Math.round(newHeight * a4Ratio);
 +}
 +
 +// Only resize the canvas if the new size is larger than the current size
 +if (newWidth > currentWidth || newHeight > currentHeight) {
 +  // Calculate the position of the current content
 +  var x = Math.round((newWidth - currentWidth) / 2);
 +  var y = Math.round((newHeight - currentHeight) / 2);
 +
 +  // Resize the canvas
 +  doc.resizeCanvas(newWidth, newHeight, AnchorPosition.MIDDLECENTER);
 +}
 +
 +</code>
   * file and folder <code javascript>   * file and folder <code javascript>
 var samplesFolder = Folder(app.path + "/Samples/") var samplesFolder = Folder(app.path + "/Samples/")
Line 285: Line 365:
 } }
 </code> </code>
 +  * print each layer <code javascript>
 +var msg = "Make sure you set your print setting correct and done,\nthen click Yes to run batch print layer"
 +if (confirm(msg)) {
 +    // Get the current active document
 +    var doc = app.activeDocument;
  
 +    // Get all the layers except the background layer
 +    var layers = [];
 +    for (var i = 0; i < doc.layers.length; i++) {
 +        if(!doc.layers[i].isBackgroundLayer){
 +            layers.push(doc.layers[i]);
 +        }
 +    }
 +    // Hide all the layers
 +    for (var i = 0; i < layers.length; i++) {
 +        layers[i].visible = false;
 +    }
 +
 +    // Loop through each layer and print it
 +    for (var i = 0; i < layers.length; i++) {
 +        // Show the current layer
 +        layers[i].visible = true;
 +        
 +        // Print the current layer
 +        app.activeDocument.print();
 +        //alert('printing'+layers[i].name)
 +        
 +        // Hide the current layer
 +        layers[i].visible = false;
 +    }
 +
 +    // Show all the layers again
 +    for (var i = 0; i < layers.length; i++) {
 +        layers[i].visible = true;
 +    }
 +} else {
 +  alert("Printing cancelled.");
 +}
 +</code>
 +  * split image vertically equally into N part, and stack into new doc, optionally crop border pixel <code javascript>
 +//=======================================
 +//#  image split by n
 +//=======================================
 +var doc = app.activeDocument;
 +
 +// Prompt the user for the number of parts
 +var n = parseInt(prompt("Enter the number of parts to split the image into:", 4));
 +
 +// Calculate the height of each part
 +var partHeight = Math.floor(doc.height / n);
 +
 +// Create a new document with the width of the original image and the height of one part
 +var newDoc = app.documents.add(doc.width, partHeight, doc.resolution, "Split Image");
 +
 +// Loop through each part of the image
 +for (var i = 0; i < n; i++) {
 +  // Define the source rectangle for the part
 +  var sourceRect = [
 +    [0, i * partHeight],
 +    [doc.width, i * partHeight],
 +    [doc.width, (i + 1) * partHeight],
 +    [0, (i + 1) * partHeight]
 +  ];
 +
 +  // Activate the source document
 +  app.activeDocument = doc;
 +  // Deselect any active selection
 +  doc.selection.deselect();
 +  // Create a new selection
 +  doc.selection.select(sourceRect);
 +  // Copy the part to the new document
 +  doc.selection.copy();
 +  // Activate the new document
 +  app.activeDocument = newDoc;
 +  // Paste the part into the new document
 +  newDoc.paste();
 +  // Move the selection down by the height of one part
 +  app.activeDocument = doc;
 +  doc.selection.translateBoundary(0, partHeight);
 +}
 +//=======================================
 +//#  trim border
 +//=======================================
 +app.activeDocument = newDoc;
 +newDoc.trim(TrimType.TOPLEFT, true, true, true, true);
 +</code>
 ===== Execute code ===== ===== Execute code =====
  
Line 868: Line 1033:
  
   * so conclusion, if you are not stuck with old technology, and you willing to move to adobe CC version, HTML5 is the way to go for all new techs instead of Python fighting into adobe apps.   * so conclusion, if you are not stuck with old technology, and you willing to move to adobe CC version, HTML5 is the way to go for all new techs instead of Python fighting into adobe apps.
 +
 +Update 2022:
 +  * PS automation tech age:
 +    * oldest: Actions (since v4) - macros by record and playback but no logic and no interface
 +    * older: ExtendScript (AppleScript/VBScript), ScriptUI, C++ 
 +      * jsx - (js v3)
 +    * old: CEP panel (Common Extensibility Platform) https://github.com/Adobe-CEP
 +      * html5
 +    * new and fresh: UXP (Unified Extensibility Platform) for PS 2021+ (v22)
 +      * new js support
 +      * ref: https://medium.com/adobetech/xd-and-creative-cloud-extensibility-faq-e615dd6ecbfe
 +      * https://gregbenzphotography.com/photography-reviews/what-are-uxp-plugins-in-photoshop
 +      * Building Plugins for Adobe Photoshop and XD using UXP: https://www.youtube.com/watch?v=6iFVozCJ1aw
 +      * Rundown of the UXP Announcement at MAX 2020: https://www.youtube.com/watch?v=zAOUBpDjc1Q
 +
 +UXP feature:
 +  * modern JS, new File API
  • graphic/javascript/photoshop.1629661727.txt.gz
  • Last modified: 2021/08/22 19:48
  • by ying