Skip to main content
Inspiring
September 20, 2024
Answered

•  Small javascript that gives back the scale and the rotate of a selected "placed img"

  • September 20, 2024
  • 3 replies
  • 1881 views

Hello -

 

I made a small script (w/ the help of ChatGPT) that gives back the current scale and the rotate of a placed and selected image

It works prefectly as a "standalone" script.

But when I try to embed in a palette and call it via a button it doesn't work".

 

Could someone helps me on this?

 

Here is the code:

 

 

#target Illustrator
#targetengine main


var myPalette_XPOS = 2150;
var myPalette_YPOS = 30;

// PALETTE
// =======
var myPalette = new Window('palette', 'DC TOOLS');  // , {resizeable: true}
    // myPalette.text = "DC TOOLS";
    myPalette.orientation = "column";
    myPalette.alignment = "center"; // Center the text horizontally
    myPalette.alignChildren = ["center","top"];
    myPalette.spacing = 1;
    myPalette.margins = 2;


var button10 = myPalette.add("button", undefined, undefined, {name: "button10"});
    button10.text    = "IMG Scale";
    button10.alignment = ["center","top"];

myPalette.frameLocation = [ myPalette_XPOS, myPalette_YPOS ];
myPalette.show();


// Function to show a dialog with SCALE & ROTATION
function showScaleAndRotation() {

    // Ensure there is an active document
    if (app.documents.length === 0) {
        alert("No document open.");
        return;
    }

    var IMG_selected = app.activeDocument.selection;

    // Check if something is selected
    if (IMG_selected.length === 0) {
        alert("you called me, is an image seleced?");
        alert("Please select an object.");
        return;
    }

    var selectedItem = IMG_selected[0];

    // Check if it's a linked image (PlacedItem) or a raster image (RasterItem)
    if (selectedItem.typename !== "PlacedItem" && selectedItem.typename !== "RasterItem") {
        alert("The selected object is not a linked or raster image.");
        return;
    }

    // Get the transformation matrix of the selected object
    var matrix = selectedItem.matrix;
        // alert("you called me? So it s an IMG and its selected");

    // Calculate the scaling based on the transformation matrix
    var scaleX = Math.sqrt(matrix.mValueA * matrix.mValueA + matrix.mValueB * matrix.mValueB) * 100;
    var scaleY = Math.sqrt(matrix.mValueC * matrix.mValueC + matrix.mValueD * matrix.mValueD) * 100;

    // Calculate the rotation in degrees
    var rotation = Math.atan2(matrix.mValueB, matrix.mValueA) * (180 / Math.PI);

    // Show the result in a dialog box
    alert("Scale X: " + scaleX.toFixed(2) + "%\n" + "Scale Y: " + scaleY.toFixed(2) + "%\n" + "Rotation: " + rotation.toFixed(2) + "°\n");

}

 

This topic has been closed for replies.
Correct answer dimitri_cas

Hi…

 

At the end, I made it works 🙂

NB. I make use of "BridgeTalk()" & Photoshop must be open (even It's a Illustrator script)

Here is the script:

 

 

 

 

#target Illustrator
#targetengine main

var myPaletteTest_XPOS = 1150;
var myPaletteTest_YPOS = 30;

// PALETTE
// =======
var myPaletteTest = new Window('palette', 'DC TOOLS');  
    myPaletteTest.orientation = "column";
    myPaletteTest.alignment = "center"; 
    myPaletteTest.alignChildren = ["center", "top"];
    myPaletteTest.spacing = 1;
    myPaletteTest.margins = 2;

var button100 = myPaletteTest.add('button', undefined, "Show Scale & Rotation", {name: "button100"});
    button100.alignment = ["center", "top"];

myPaletteTest.frameLocation = [myPaletteTest_XPOS, myPaletteTest_YPOS];
myPaletteTest.show();



// BUTTON
// =======
button100.addEventListener('mousedown', function () {

    // Use BridgeTalk to target Photoshop
    var btTest = new BridgeTalk();
    btTest.target = "photoshop";
    
    // Send a BridgeTalk message to Photoshop to execute the scale/rotation function in Illustrator
    btTest.body = "var btIllustrator = new BridgeTalk();\n" +
                  "btIllustrator.target = 'illustrator';\n" +
                  "btIllustrator.body = 'showScaleAndRotation();';\n" +
                  "btIllustrator.send();";

    // Send the message to Photoshop, which will in turn trigger Illustrator
    btTest.send();
});


// Function to show a dialog with SCALE & ROTATION (of aplaced image)
// =======
function showScaleAndRotation() {

   var IMG_selected = app.activeDocument.selection;

    // Check if something is selected
    if (IMG_selected.length === 0) {
        alert("Please select an object.");
        return;
    }

    var selectedItem = IMG_selected[0];

    // Check if it's a linked image (PlacedItem) or a raster image (RasterItem)
    if (selectedItem.typename !== "PlacedItem" && selectedItem.typename !== "RasterItem") {
        alert("The selected object is not a linked or raster image.");
        return;
    }

    // Get the transformation matrix of the selected object
    var matrix = selectedItem.matrix;

    // Calculate the scaling based on the transformation matrix
    var scaleX = Math.sqrt(matrix.mValueA * matrix.mValueA + matrix.mValueB * matrix.mValueB) * 100;
    var scaleY = Math.sqrt(matrix.mValueC * matrix.mValueC + matrix.mValueD * matrix.mValueD) * 100;

    // Calculate the rotation in degrees
    var rotation = Math.atan2(matrix.mValueB, matrix.mValueA) * (180 / Math.PI);

    // Show the result in a dialog box
    alert("Rotation: " + rotation.toFixed(2) + "°\n" +
          "Scale X: " + scaleX.toFixed(2) + "%\n" + 
          "Scale Y: " + scaleY.toFixed(2) + "%\n");
}

 

 

3 replies

dimitri_casAuthorCorrect answer
Inspiring
September 25, 2024

Hi…

 

At the end, I made it works 🙂

NB. I make use of "BridgeTalk()" & Photoshop must be open (even It's a Illustrator script)

Here is the script:

 

 

 

 

#target Illustrator
#targetengine main

var myPaletteTest_XPOS = 1150;
var myPaletteTest_YPOS = 30;

// PALETTE
// =======
var myPaletteTest = new Window('palette', 'DC TOOLS');  
    myPaletteTest.orientation = "column";
    myPaletteTest.alignment = "center"; 
    myPaletteTest.alignChildren = ["center", "top"];
    myPaletteTest.spacing = 1;
    myPaletteTest.margins = 2;

var button100 = myPaletteTest.add('button', undefined, "Show Scale & Rotation", {name: "button100"});
    button100.alignment = ["center", "top"];

myPaletteTest.frameLocation = [myPaletteTest_XPOS, myPaletteTest_YPOS];
myPaletteTest.show();



// BUTTON
// =======
button100.addEventListener('mousedown', function () {

    // Use BridgeTalk to target Photoshop
    var btTest = new BridgeTalk();
    btTest.target = "photoshop";
    
    // Send a BridgeTalk message to Photoshop to execute the scale/rotation function in Illustrator
    btTest.body = "var btIllustrator = new BridgeTalk();\n" +
                  "btIllustrator.target = 'illustrator';\n" +
                  "btIllustrator.body = 'showScaleAndRotation();';\n" +
                  "btIllustrator.send();";

    // Send the message to Photoshop, which will in turn trigger Illustrator
    btTest.send();
});


// Function to show a dialog with SCALE & ROTATION (of aplaced image)
// =======
function showScaleAndRotation() {

   var IMG_selected = app.activeDocument.selection;

    // Check if something is selected
    if (IMG_selected.length === 0) {
        alert("Please select an object.");
        return;
    }

    var selectedItem = IMG_selected[0];

    // Check if it's a linked image (PlacedItem) or a raster image (RasterItem)
    if (selectedItem.typename !== "PlacedItem" && selectedItem.typename !== "RasterItem") {
        alert("The selected object is not a linked or raster image.");
        return;
    }

    // Get the transformation matrix of the selected object
    var matrix = selectedItem.matrix;

    // Calculate the scaling based on the transformation matrix
    var scaleX = Math.sqrt(matrix.mValueA * matrix.mValueA + matrix.mValueB * matrix.mValueB) * 100;
    var scaleY = Math.sqrt(matrix.mValueC * matrix.mValueC + matrix.mValueD * matrix.mValueD) * 100;

    // Calculate the rotation in degrees
    var rotation = Math.atan2(matrix.mValueB, matrix.mValueA) * (180 / Math.PI);

    // Show the result in a dialog box
    alert("Rotation: " + rotation.toFixed(2) + "°\n" +
          "Scale X: " + scaleX.toFixed(2) + "%\n" + 
          "Scale Y: " + scaleY.toFixed(2) + "%\n");
}

 

 

m1b
Community Expert
Community Expert
September 25, 2024

Hi @dimitri_cas, thanks for posting your solution—it's quite ingenious. I've never heard of anyone doing that before and I'm honestly surprised it works! Well done for finding a way!

- Mark

Inspiring
September 25, 2024

Thanks Mark  🙂

 

You are welcome

m1b
Community Expert
Community Expert
September 25, 2024

Hi @dimitri_cas, I will use the same structure I showed you on your other question, but this time I've incorporated your function. Give it a try. Note that if you are new to scripting, using BridgeTalk is not an easy thing to do.

- Mark

 

/**
 * @file Illustrator ScriptUI BridgeTalk Palette Demo.js
 *
 * Just shows a simple example of using BridgeTalk to
 * communicate between a palette window and Ilustrator.
 *
 * @author m1b and @dimitri_cas
 * https://community.adobe.com/t5/illustrator-discussions/small-javascript-that-gives-back-the-scale-and-the-rotate-of-a-selected-quot-placed-img-quot/m-p/14871091#M420851
 */
(function () {

    // check if the window already exists by using a global variable
    if (
        "undefined" !== typeof $.global.myPalette
        && null !== $.global.myPalette
    ) {
        // NOTE: while debugging, you will want to disable this part
        // because it will stop your new palette from instantiating
        // (otherwise you'll need to restart Illustrator each time!)
        $.global.myPalette.active = true;
        $.global.myPalette.show();
        return;
    }

    // create a new ScriptUI palette (modeless window)
    $.global.myPalette = new Window("palette", "Text Setter", undefined, { resizeable: false });

    // simple UI for the demo: a text field and button
    var scaleXGroup = myPalette.add('group {orientation: "row", preferredSize:[300,-1]}'),
        scaleXlabel = scaleXGroup.add("statictext {text:'Scale X:', alignment:['left','center'] }"),
        scaleXField = scaleXGroup.add("edittext {text:'100', alignment:['left','center'], characters:10}"),
        scaleYlabel = scaleXGroup.add("statictext {text:'Scale Y:', alignment:['left','center'] }"),
        scaleYField = scaleXGroup.add("edittext {text:'100', alignment:['left','center'], characters:10}"),
        rotationField = scaleXGroup.add("edittext {text:'0', alignment:['left','center'], characters:10}"),
        udpateButton = myPalette.add("button", undefined, "Update");

    // do the BT call when the button is clicked
    udpateButton.onClick = function () {

        // a BridgeTalk message
        var bt = new BridgeTalk();
        bt.target = "illustrator";

        // convert the function to a string using toSource and invoke it, passing the textInput text
        bt.body = "(" + getScaleAndRotation.toSource() + ")();";

        // handle the result returned from Illustrator
        bt.onResult = function (response) {

            var values = response.body.split(',');

            var rounded = [
                roundStringToTwoPlaces(values[0]),
                roundStringToTwoPlaces(values[1]),
                roundStringToTwoPlaces(values[2]),
            ];

            if (undefined != rounded[0])
                scaleXField.text = rounded[0];
            if (undefined != rounded[1])
                scaleYField.text = rounded[1];
            if (undefined != rounded[2])
                rotationField.text = rounded[2];

        };

        // send the script to Illustrator
        bt.send();

    };

    // Show the palette
    myPalette.center();
    myPalette.show();

    // helper to format a number string from response
    function roundStringToTwoPlaces(n) {
        if (!isNaN(n))
            return String(Math.round(Number(n) * 100) / 100);
    };

    // function to be sent to Illustrator via BridgeTalk
    function getScaleAndRotation() {

        /*
            IMPORTANT: you must use block comments in any function
            that you will be sending via BridgeTalk, because it seems
            to evaluate the whole body as a single line, therefore
            an inline comment will nullify everything after it.
        */

        var selectedItem = app.activeDocument.selection[0];

        /* Check if something is selected */
        if (undefined == selectedItem) {
            alert("Please select an object.");
            return;
        }

        /* Check if it's a linked image (PlacedItem) or a raster image (RasterItem) */
        if (selectedItem.typename !== "PlacedItem" && selectedItem.typename !== "RasterItem") {
            alert("The selected object is not a linked or raster image.");
            return;
        }

        /* Get the transformation matrix of the selected object */
        var matrix = selectedItem.matrix;

        /* Calculate the scaling based on the transformation matrix */
        var scaleX = Math.sqrt(matrix.mValueA * matrix.mValueA + matrix.mValueB * matrix.mValueB) * 100;
        var scaleY = Math.sqrt(matrix.mValueC * matrix.mValueC + matrix.mValueD * matrix.mValueD) * 100;

        /* Calculate the rotation in degrees */
        var rotation = -Math.atan2(matrix.mValueB, matrix.mValueA) * (180 / Math.PI);

        return [scaleX, scaleY, rotation].join(',');

    };

})();

 

Inspiring
September 25, 2024

Thanks Mark  🙂

 

Enjoy your day…

renél80416020
Inspiring
September 20, 2024

Bonjour,

// PALETTE
// =======
var myPalette = new Window('dialog', 'DC TOOLS');  // , {resizeable: true}
    // myPalette.text = "DC TOOLS";
    myPalette.orientation = "column";
    myPalette.alignment = "center"; // Center the text horizontally
    myPalette.alignChildren = ["center","top"];
    myPalette.spacing = 1;
    myPalette.margins = 2;


var button10 = myPalette.add("button", undefined, undefined, {name: "button10"});
    button10.text    = "IMG Scale";
    button10.alignment = ["center","top"];
    button10.onClick = function () {
      showScaleAndRotation();
      myPalette.close();
    }

    myPalette.center();
//myPalette.frameLocation = [ myPalette_XPOS, myPalette_YPOS ];
    myPalette.show();
Inspiring
September 20, 2024

Bonjuor René

 

Merci/Thx for your reply.

 

Now, OK, but the "palette" just disappered after I clicked the button.

And if it works, I'll use constantly that button/palette.

Inspiring
September 21, 2024

Bonjour,

Dans l'état actuel de votre script,

Cliquez sur le bouton "IMG Scale"

le résultat s'affiche...

puis fermez le dialogue ou appuyez sur la touche ESC

 

 

// JavaScript Document
#target Illustrator
#targetengine main


var myPalette_XPOS = 200;
var myPalette_YPOS = 200;

// PALETTE
// =======
var myPalette = new Window('dialog', 'DC TOOLS');  // , {resizeable: true}
    // myPalette.text = "DC TOOLS";
    myPalette.orientation = "column";
    myPalette.alignment = "center"; // Center the text horizontally
    myPalette.alignChildren = ["center","top"];
    myPalette.spacing = 1;
    myPalette.margins = 2;


var button10 = myPalette.add("button", undefined, undefined, {name: "button10"});
    button10.text    = "IMG Scale";
    button10.alignment = ["center","top"];
    button10.onClick = function () {
      showScaleAndRotation();
      //myPalette.close();
    }

    myPalette.center();
//myPalette.frameLocation = [ myPalette_XPOS, myPalette_YPOS ];
    myPalette.show();

// Function to show a dialog with SCALE & ROTATION
function showScaleAndRotation() {

    // Ensure there is an active document
    if (app.documents.length === 0) {
        alert("No document open.");
        return;
    }

    var IMG_selected = app.activeDocument.selection;

    // Check if something is selected
    if (IMG_selected.length === 0) {
        alert("you called me, is an image seleced?");
        alert("Please select an object.");
        return;
    }

    var selectedItem = IMG_selected[0];

    // Check if it's a linked image (PlacedItem) or a raster image (RasterItem)
    if (selectedItem.typename !== "PlacedItem" && selectedItem.typename !== "RasterItem") {
        alert("The selected object is not a linked or raster image.");
        return;
    }

    // Get the transformation matrix of the selected object
    var matrix = selectedItem.matrix;
        // alert("you called me? So it s an IMG and its selected");

    // Calculate the scaling based on the transformation matrix
    var scaleX = Math.sqrt(matrix.mValueA * matrix.mValueA + matrix.mValueB * matrix.mValueB) * 100;
    var scaleY = Math.sqrt(matrix.mValueC * matrix.mValueC + matrix.mValueD * matrix.mValueD) * 100;

    // Calculate the rotation in degrees
    var rotation = Math.atan2(matrix.mValueB, matrix.mValueA) * (180 / Math.PI);
    
    // Show the result in a dialog box
    alert("Scale X: " + scaleX.toFixed(2) + "%\n" + "Scale Y: " + scaleY.toFixed(2) + "%\n" + "Rotation: " + rotation.toFixed(2) + "°\n");

}

 

 

René

PS  ajoutez des bouton OK et Cancel...

 

 


 

 

Merci René…  🙂