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

[dimitri_cas]

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");

}

[renél80416020]

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();

[dimitri_cas]

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.

[renél80416020]

Supprimez

myPalette.close();

dans la fonction

button10.onClick

René

[dimitri_cas]

Bonjour/Hi René -

Notthing happen, exactly the same behaviour/result has mine original script…

Any other suggestion?

Thx…

[renél80416020]

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...

[dimitri_cas]

Merci René…  🙂

[dimitri_cas]

Bonjour René -

Donc comme écrit cela fonctionne avec "dialog".

Mais cette fenêtre "dialog" pose problème au lancement d'Illustrator (car je l'ai placé dans "Startup Scripts") et je suis obligé de clicquer sur "esc" pour poursuivre le lancement d'Illustrator (cette fenêtre disparait donc). Et le but (si cela fonctionne) est de garder en permanence ce "bouton" pour connaitre rapidement et facilement les "transformations" d'une "image placée"… C'et pour cela que j'étais parti sur l'option d'une "palette" vs. un "dialog".

Une suggestion?

 •  Comment faire autrement.

 •  Pourquoi cela ne fonctionne pas dans ne "palette"?

 •  …

Merci, belle journé eà vous.

- Dimitri

[renél80416020]

Bonjour Dimitri,

Je ne peux pas te répondre car cela dépasse mes compétences,

Peut-être que quelqu'un d'autre sur ce forum pourra te donner les conseils que tu attends.

Désolé...

René

[dimitri_cas]

pas de souci René  🙂

Merci encore

[m1b]

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(',');

    };

})();

[dimitri_cas]

Thanks Mark  🙂

Enjoy your day…

[dimitri_cas · Accepted solution]

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]

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

[dimitri_cas]

Thanks Mark  🙂

You are welcome