Mouse coordinate Or Action?

[Guest]

Dear all:

I am a new comer in PS scripts. Recently i come across a problem that i want to realize to draw a stable selection as the following picture.

The ideal situation would be：when i click mouse it may draw a box with script. The rectangle is 50*25 pixels. The sharp one can be missed at first.

If the ideal situaion cannot be realized, the sharp corner can be placed in the middle of above line, which length is 10.

Now i have two ideas. The first one, when i click in the pic, it may get may mouse coordinates in the info(pressing F8). I want to get the coordinates into memroy, so that scripts can call them to draw a box with selection tool. But i don't know how to get coordinates to memory.

The second one, when i click the mouse, i can use actions to complete it. But i don't know how to do it.

Thanks all.

[JJMack]

I do not understand if your drawing interactively with a mouse why would you want to slow the process down trying to script it.  You also can not get the mouse coordinates with scripting and if you could you may be be moveing how would your scriop know when to use the point the mouse is over.

For you all you may need to learn is click move and shift click. straight shart line are easy. You can also use the Pen tool to create a Path then stroke the paths with a tool.

Custom Shapes work well and can be edited.

[Guest]

Yeah, i know the pen tool and brush tool. The reason i want to use scripts is that i will create the rectangle with sharp corner many many times, maybe more than several thousand. What is a boring thing. In order to make is easier and intersrting,  i want to use scripts.

[c.pfaffenbichler]

Unfortunately I see no current option to collect the mouse position via a Photoshop Script directly.

Work-arounds exist in that

• the Pen Tool and

• the Color Sampler Tool for example

can be used to get the coordinates of a click.

But this is disruptive nonetheless and would not provide for immediate, live interaction per se.

But again a work-around seems possible if one links the event (of creating a new Color Sampler for example) to a Script with Script Events Manager.

[JJMack]

The rectangle tool will be faster than a Script. A Scripts would be better at rotating and duplicating a rectangle you create using the rectangle tool in pixel mode or shape mode. You have been told that a script can not get the coordinates of the mouse pointer. I use the the color sampler tool to set points for a script to rotate a square rectangle shape I drew.   You can set up to 10 color sampler points.. I set 4.  You could write a script to use two point  the top left and bottom right of a rectangle the script could draw. It would be slower and you would have less control then using Photoshop rectangle tool.

[Guest]

Errrrr, i think i can't let you know what i want to do clearly because of my poor english (I am sorry about this.). I will upload a pic that i do later.

[Guest]

I get a new idea.

• creating a new layer.
• creating a anchor with pen tool. (Layer only has an anchor.)
• can i select this anchor in the script, then get the coordinate of this anchor? (This step may use script event manager.)
• creating an special shape with the coordinate by scripts.

Is the idea feasible?

[c.pfaffenbichler]

The following code creates a Shape Layer (as seen in the screenshot) based on the last two Color Samplers, the second to last defines the senator of the rectangle, the last one defines one point of a triangle.

Naturally you could just as easily use a two point path as the basis, possibly even the Ruler Tool; I just picked Solor Samplers because I seldom use them and so it would – for me – be fairly unproblematic to use them for something different, so to speak.

// create shape layer consisting of one rectangle and one triangle based on the last two colorsamplers;

// 2016, use it at your own risk;

#target photoshop

if (app.documents.length > 0) {

var myDocument = app.activeDocument;

if (myDocument.colorSamplers.length > 1) {

// pixels,;

var originalRulerUnits = app.preferences.rulerUnits;

app.preferences.rulerUnits = Units.PIXELS

var originalResolution = myDocument.resolution;

myDocument.resizeImage (null, null, 72, ResampleMethod.NONE);

var halfWidth = 25;

var halfHeight = 12.5;

// get coordinates;

var theCoord1 = myDocument.colorSamplers[myDocument.colorSamplers.length-2].position;

var theCoord2 = myDocument.colorSamplers[myDocument.colorSamplers.length-1].position;

// define rectangle;

var point1 = [theCoord1[0]-halfWidth,theCoord1[1]-halfHeight];

var point2 = [theCoord1[0]+halfWidth,theCoord1[1]-halfHeight];

var point3 = [theCoord1[0]+halfWidth,theCoord1[1]+halfHeight];

var point4 = [theCoord1[0]-halfWidth,theCoord1[1]+halfHeight];

var subPath1 = [[point1, point1, point1, false], [point2, point2, point2, false], [point3, point3, point3, false], [point4, point4, point4, false], true, 1097098272];

// define triangle;

var distances = [[point1, getDistance(point1, theCoord2)], [point2, getDistance(point2, theCoord2)], [point3, getDistance(point3, theCoord2)], [point4, getDistance(point4, theCoord2)]];

distances.sort(sortArrayByIndexedItem);

var subPath2 = [[distances[0][0], distances[0][0], distances[0][0], false], [distances[1][0], distances[1][0], distances[1][0], false], [theCoord2, theCoord2, theCoord2, false], true, 1097098272];

var theArray = [subPath1, subPath2];

// create path;

createPath2015(theArray, Math.random());

var theShape = solidColorLayer (5, 128, 205);

// reset;

app.preferences.rulerUnits = originalRulerUnits;

myDocument.resizeImage (null, null, originalResolution, ResampleMethod.NONE);

};

};

////// create a path from collectPathInfoFromDesc2012-array //////

function createPath2015(theArray, thePathsName) {

var originalRulerUnits = app.preferences.rulerUnits;

app.preferences.rulerUnits = Units.POINTS;

// thanks to xbytor;

cTID = function(s) { return app.charIDToTypeID(s); };

sTID = function(s) { return app.stringIDToTypeID(s); };

    var desc1 = new ActionDescriptor();

    var ref1 = new ActionReference();

    ref1.putProperty(cTID('Path'), cTID('WrPt'));

    desc1.putReference(sTID('null'), ref1);

    var list1 = new ActionList();

for (var m = 0; m < theArray.length; m++) {

  var thisSubPath = theArray;

    var desc2 = new ActionDescriptor();

    desc2.putEnumerated(sTID('shapeOperation'), sTID('shapeOperation'), thisSubPath[thisSubPath.length - 1]);

    var list2 = new ActionList();

    var desc3 = new ActionDescriptor();

    desc3.putBoolean(cTID('Clsp'), thisSubPath[thisSubPath.length - 2]);

    var list3 = new ActionList();

for (var n = 0; n < thisSubPath.length - 2; n++) {

  var thisPoint = thisSubPath;

    var desc4 = new ActionDescriptor();

    var desc5 = new ActionDescriptor();

    desc5.putUnitDouble(cTID('Hrzn'), cTID('#Rlt'), thisPoint[0][0]);

    desc5.putUnitDouble(cTID('Vrtc'), cTID('#Rlt'), thisPoint[0][1]);

    desc4.putObject(cTID('Anch'), cTID('Pnt '), desc5);

    var desc6 = new ActionDescriptor();

    desc6.putUnitDouble(cTID('Hrzn'), cTID('#Rlt'), thisPoint[1][0]);

    desc6.putUnitDouble(cTID('Vrtc'), cTID('#Rlt'), thisPoint[1][1]);

    desc4.putObject(cTID('Fwd '), cTID('Pnt '), desc6);

    var desc7 = new ActionDescriptor();

    desc7.putUnitDouble(cTID('Hrzn'), cTID('#Rlt'), thisPoint[2][0]);

    desc7.putUnitDouble(cTID('Vrtc'), cTID('#Rlt'), thisPoint[2][1]);

    desc4.putObject(cTID('Bwd '), cTID('Pnt '), desc7);

    desc4.putBoolean(cTID('Smoo'), thisPoint[3]);

    list3.putObject(cTID('Pthp'), desc4);

  };

    desc3.putList(cTID('Pts '), list3);

    list2.putObject(cTID('Sbpl'), desc3);

    desc2.putList(cTID('SbpL'), list2);

    list1.putObject(cTID('PaCm'), desc2);

  };

    desc1.putList(cTID('T   '), list1);

    executeAction(cTID('setd'), desc1, DialogModes.NO);

// name work path;

var check = false;

var x = activeDocument.pathItems.length - 1;

while (check == false) {

if (activeDocument.pathItems.kind == PathKind.WORKPATH) {

app.activeDocument.pathItems.name = thePathsName;

var myPathItem = app.activeDocument.pathItems;

check = true

};

x--

};

/*for (var x = 0; x < activeDocument.pathItems.length; x++) {

  if (activeDocument.pathItems.kind == PathKind.WORKPATH) {

  app.activeDocument.pathItems.name = thePathsName;

  var myPathItem = app.activeDocument.pathItems

  }

  };*/

app.preferences.rulerUnits = originalRulerUnits;

return myPathItem

};

////// get a distance between two points //////

function getDistance (pointOne, pointTwo) {

// calculate the triangle sides;

  var width = pointTwo[0] - pointOne[0];

  var height = pointTwo[1] - pointOne[1];

  var sideC = Math.sqrt(Math.pow(width, 2) + Math.pow(height, 2));

  return sideC

  };

////// create solid color layer //////

function solidColorLayer (theR, theG, theB) {

// solid color layer;

// =======================================================

var idMk = charIDToTypeID( "Mk  " );

    var desc16 = new ActionDescriptor();

    var idnull = charIDToTypeID( "null" );

        var ref4 = new ActionReference();

        var idcontentLayer = stringIDToTypeID( "contentLayer" );

        ref4.putClass( idcontentLayer );

    desc16.putReference( idnull, ref4 );

    var idUsng = charIDToTypeID( "Usng" );

        var desc17 = new ActionDescriptor();

        var idType = charIDToTypeID( "Type" );

            var desc18 = new ActionDescriptor();

            var idClr = charIDToTypeID( "Clr " );

                var desc19 = new ActionDescriptor();

                var idRd = charIDToTypeID( "Rd  " );

                desc19.putDouble( idRd, theR );

                var idGrn = charIDToTypeID( "Grn " );

                desc19.putDouble( idGrn, theG );

                var idBl = charIDToTypeID( "Bl  " );

                desc19.putDouble( idBl, theB );

            var idRGBC = charIDToTypeID( "RGBC" );

            desc18.putObject( idClr, idRGBC, desc19 );

        var idsolidColorLayer = stringIDToTypeID( "solidColorLayer" );

        desc17.putObject( idType, idsolidColorLayer, desc18 );

    var idcontentLayer = stringIDToTypeID( "contentLayer" );

    desc16.putObject( idUsng, idcontentLayer, desc17 );

executeAction( idMk, desc16, DialogModes.NO );

return activeDocument.activeLayer

};

////// sort a double array, thanks to sam, http://www.rhinocerus.net/forum/lang-javascript/ //////

function sortArrayByIndexedItem(a,b) {

//var theIndex = 1;

if (a[1]<b[1]) return -1;

if (a[1]>b[1]) return 1;

return 0;

};

[Guest]

I can successfully run this script with colorsamples, and it can solve my problem absolutely.

Thank you cp. Thank you JJMack.

Shouxin Huang

[c.pfaffenbichler]

You probably already noticed the Script needs two Color Samplers.

But I have since noticed that the two nearest points of the rectangle may not be the ideal choice as this could lead to results like this

It would probably be better to  calculate which side of the rectangle is being cut by a line connecting the two points and use the two points defining that side as the basis for the triangle.

[Guest]

for floor 11:

1.Yeah, i add 2 color samplers in the layer, the script can run successfully and it is so cool.

2.In fact, what i want to do is just like you show, two nearest points are very good.

3.Maybe I can modify the script so that the triangle stay at stable direction in order to fit the entire pic.

For floor 12:

I agree with you. But my ThinkPad laptop (E530-i3-2G RAM)can only exist 4 color samplers at the same time. I must delete them when there are four points. Why may occur this situation? Maybe my computer is too old? Its cpu only is i3-3110M, and i buy it in 2012.

[c.pfaffenbichler]

But my ThinkPad laptop (E530-i3-2G RAM)can only exist 4 color samplers at the same time.

Then you probably use Photoshop CS6 or older.

You could replace the lines

createPath2015(theArray, Math.random());

var theShape = solidColorLayer (5, 128, 205);

with

var aPath = createPath2015(theArray, Math.random());

var theShape = solidColorLayer (5, 128, 205);

aPath.remove();

myDocument.colorSamplers[myDocument.colorSamplers.length-1].remove();

myDocument.colorSamplers[myDocument.colorSamplers.length-1].remove();

3.Maybe I can modify the script so that the triangle stay at stable direction in order to fit the entire pic.

I don’t understand what you mean exactly, could you provide a screenshot?

[c.pfaffenbichler · Accepted solution]

Please give this a try:

// create shape layer consisting of one rectangle and one triangle based on the last two colorsamplers;

// 2016, use it at your own risk;

#target photoshop

if (app.documents.length > 0) {

var myDocument = app.activeDocument;

if (myDocument.colorSamplers.length > 1) {

// pixels,;

var originalRulerUnits = app.preferences.rulerUnits;

app.preferences.rulerUnits = Units.PIXELS

var originalResolution = myDocument.resolution;

myDocument.resizeImage (null, null, 72, ResampleMethod.NONE);

var halfWidth = 25;

var halfHeight = 12.5;

// get coordinates;

var theCoord1 = myDocument.colorSamplers[myDocument.colorSamplers.length-2].position;

var theCoord2 = myDocument.colorSamplers[myDocument.colorSamplers.length-1].position;

// define rectangle;

var point1 = [theCoord1[0]-halfWidth,theCoord1[1]-halfHeight];

var point2 = [theCoord1[0]+halfWidth,theCoord1[1]-halfHeight];

var point3 = [theCoord1[0]+halfWidth,theCoord1[1]+halfHeight];

var point4 = [theCoord1[0]-halfWidth,theCoord1[1]+halfHeight];

var subPath1 = [[point1, point1, point1, false], [point2, point2, point2, false], [point3, point3, point3, false], [point4, point4, point4, false], true, 1097098272];

// get angle;

var theAngle = getAngle(theCoord1, theCoord2);

//alert (theAngle);

// define triangle ponts;

switch (true) {

case (theAngle >= 27 && theAngle < 153):

var tr1 = [theCoord1[0]-(halfWidth/3), theCoord1[1]+halfHeight];

var tr2 = [theCoord1[0]+(halfWidth/3), theCoord1[1]+halfHeight];

break;

case (theAngle >= 153 && theAngle < 207):

var tr1 = [theCoord1[0]-halfWidth, theCoord1[1]-(halfHeight/3)];

var tr2 = [theCoord1[0]-halfWidth, theCoord1[1]+(halfHeight/3)];

break;

case (theAngle >= 207 && theAngle < 333):

var tr1 = [theCoord1[0]-(halfWidth/3), theCoord1[1]-halfHeight];

var tr2 = [theCoord1[0]+(halfWidth/3), theCoord1[1]-halfHeight];

break;

default:

var tr1 = [theCoord1[0]+halfWidth, theCoord1[1]-(halfHeight/3)];

var tr2 = [theCoord1[0]+halfWidth, theCoord1[1]+(halfHeight/3)];

break;

};

var subPath2 = [[tr1, tr1, tr1, false], [tr2, tr2, tr2, false], [theCoord2, theCoord2, theCoord2, false], true, 1097098272];

var theArray = [subPath1, subPath2];

// create path;

var aPath = createPath2015(theArray, Math.random());

var theShape = solidColorLayer (5, 128, 205);

aPath.remove();

// remove color samplers;

myDocument.colorSamplers[myDocument.colorSamplers.length-1].remove();

myDocument.colorSamplers[myDocument.colorSamplers.length-1].remove();

// reset;

app.preferences.rulerUnits = originalRulerUnits;

myDocument.resizeImage (null, null, originalResolution, ResampleMethod.NONE);

};

};

////// create a path from collectPathInfoFromDesc2012-array //////

function createPath2015(theArray, thePathsName) {

var originalRulerUnits = app.preferences.rulerUnits;

app.preferences.rulerUnits = Units.POINTS;

// thanks to xbytor;

cTID = function(s) { return app.charIDToTypeID(s); };

sTID = function(s) { return app.stringIDToTypeID(s); };

    var desc1 = new ActionDescriptor();

    var ref1 = new ActionReference();

    ref1.putProperty(cTID('Path'), cTID('WrPt'));

    desc1.putReference(sTID('null'), ref1);

    var list1 = new ActionList();

for (var m = 0; m < theArray.length; m++) {

  var thisSubPath = theArray;

    var desc2 = new ActionDescriptor();

    desc2.putEnumerated(sTID('shapeOperation'), sTID('shapeOperation'), thisSubPath[thisSubPath.length - 1]);

    var list2 = new ActionList();

    var desc3 = new ActionDescriptor();

    desc3.putBoolean(cTID('Clsp'), thisSubPath[thisSubPath.length - 2]);

    var list3 = new ActionList();

for (var n = 0; n < thisSubPath.length - 2; n++) {

  var thisPoint = thisSubPath;

    var desc4 = new ActionDescriptor();

    var desc5 = new ActionDescriptor();

    desc5.putUnitDouble(cTID('Hrzn'), cTID('#Rlt'), thisPoint[0][0]);

    desc5.putUnitDouble(cTID('Vrtc'), cTID('#Rlt'), thisPoint[0][1]);

    desc4.putObject(cTID('Anch'), cTID('Pnt '), desc5);

    var desc6 = new ActionDescriptor();

    desc6.putUnitDouble(cTID('Hrzn'), cTID('#Rlt'), thisPoint[1][0]);

    desc6.putUnitDouble(cTID('Vrtc'), cTID('#Rlt'), thisPoint[1][1]);

    desc4.putObject(cTID('Fwd '), cTID('Pnt '), desc6);

    var desc7 = new ActionDescriptor();

    desc7.putUnitDouble(cTID('Hrzn'), cTID('#Rlt'), thisPoint[2][0]);

    desc7.putUnitDouble(cTID('Vrtc'), cTID('#Rlt'), thisPoint[2][1]);

    desc4.putObject(cTID('Bwd '), cTID('Pnt '), desc7);

    desc4.putBoolean(cTID('Smoo'), thisPoint[3]);

    list3.putObject(cTID('Pthp'), desc4);

  };

    desc3.putList(cTID('Pts '), list3);

    list2.putObject(cTID('Sbpl'), desc3);

    desc2.putList(cTID('SbpL'), list2);

    list1.putObject(cTID('PaCm'), desc2);

  };

    desc1.putList(cTID('T   '), list1);

    executeAction(cTID('setd'), desc1, DialogModes.NO);

// name work path;

var check = false;

var x = activeDocument.pathItems.length - 1;

while (check == false) {

if (activeDocument.pathItems.kind == PathKind.WORKPATH) {

app.activeDocument.pathItems.name = thePathsName;

var myPathItem = app.activeDocument.pathItems;

check = true

};

x--

};

/*for (var x = 0; x < activeDocument.pathItems.length; x++) {

  if (activeDocument.pathItems.kind == PathKind.WORKPATH) {

  app.activeDocument.pathItems.name = thePathsName;

  var myPathItem = app.activeDocument.pathItems

  }

  };*/

app.preferences.rulerUnits = originalRulerUnits;

return myPathItem

};

////// get a distance between two points //////

function getDistance (pointOne, pointTwo) {

// calculate the triangle sides;

  var width = pointTwo[0] - pointOne[0];

  var height = pointTwo[1] - pointOne[1];

  var sideC = Math.sqrt(Math.pow(width, 2) + Math.pow(height, 2));

  return sideC

  };

////// get an angle, 3:00 being 0˚, 6:00 90˚, etc. //////

function getAngle (pointOne, pointTwo) {

// calculate the triangle sides;

  var width = pointTwo[0] - pointOne[0];

  var height = pointTwo[1] - pointOne[1];

  var sideC = Math.sqrt(Math.pow(width, 2) + Math.pow(height, 2));

// calculate the angles;

  if (width+width > width) {theAngle = Math.asin(height / sideC) * 360 / 2 / Math.PI}

  else {theAngle = 180 - (Math.asin(height / sideC) * 360 / 2 / Math.PI)};

  if (theAngle < 0) {theAngle = (360 + theAngle)};

// if (theAngle > 180) {theAngle = (360 - theAngle) * (-1)};

  return theAngle

  };

////// create solid color layer //////

function solidColorLayer (theR, theG, theB) {

// solid color layer;

// =======================================================

var idMk = charIDToTypeID( "Mk  " );

    var desc16 = new ActionDescriptor();

    var idnull = charIDToTypeID( "null" );

        var ref4 = new ActionReference();

        var idcontentLayer = stringIDToTypeID( "contentLayer" );

        ref4.putClass( idcontentLayer );

    desc16.putReference( idnull, ref4 );

    var idUsng = charIDToTypeID( "Usng" );

        var desc17 = new ActionDescriptor();

        var idType = charIDToTypeID( "Type" );

            var desc18 = new ActionDescriptor();

            var idClr = charIDToTypeID( "Clr " );

                var desc19 = new ActionDescriptor();

                var idRd = charIDToTypeID( "Rd  " );

                desc19.putDouble( idRd, theR );

                var idGrn = charIDToTypeID( "Grn " );

                desc19.putDouble( idGrn, theG );

                var idBl = charIDToTypeID( "Bl  " );

                desc19.putDouble( idBl, theB );

            var idRGBC = charIDToTypeID( "RGBC" );

            desc18.putObject( idClr, idRGBC, desc19 );

        var idsolidColorLayer = stringIDToTypeID( "solidColorLayer" );

        desc17.putObject( idType, idsolidColorLayer, desc18 );

    var idcontentLayer = stringIDToTypeID( "contentLayer" );

    desc16.putObject( idUsng, idcontentLayer, desc17 );

executeAction( idMk, desc16, DialogModes.NO );

return activeDocument.activeLayer

};

////// sort a double array, thanks to sam, http://www.rhinocerus.net/forum/lang-javascript/ //////

function sortArrayByIndexedItem(a,b) {

//var theIndex = 1;

if (a[1]<b[1]) return -1;

if (a[1]>b[1]) return 1;

return 0;

};

[Droid37704358ofnr]

I met same question. I am developing a plugin using UXP. I want to get the pixel coordinates of the mouse click on the image. I need to pass these coordinates as input to an AI software. How can I get the coordinates of the user's click?

[c.pfaffenbichler]

I cannot help you with UXP Panels. 

Did you read @Davide_Barranca ’s book on the issue? 

[c.pfaffenbichler]

With the last version of the Script linked to the event via Script Events Manager one can create Shape Layers pretty easily.

[Guest]

yeah, i can do the same thing with you. The script is very good for me.

[c.pfaffenbichler]

And another thing: You may want to delete the original path after the Shape Layer has been created, otherwise the file might accumulate a lot of useless paths.

[JJMack]

Shape tools ??

[c.pfaffenbichler]

It may well be an option.

My interpretation of the issue was that the rectangle-element should have a fixed size but the triangle-part may vary.

[Guest]

It is very interesting, how to do that (adding 3 anchors?) in fig.2?

[JJMack]

You use Photoshop Vector graphic tools. Rectangle Tool in shape mode  stroke shape no fill.

Pen Tool + add anchor points tool to add three points these will have handles you do not want.

.

You use the Convert Point Tool to remove the handle from the three you added.

You use the direct selection tool to select the center point then use the tool to drag it to where you want it.

Adding  one point convert and move.

[Guest]

Thanks JJMack.

I cannot do it successfully because i don't know how to remove the anchor's handle. The important tool is Convert Point Tool, and i click on the anchor with Convert Point Tool, the handle disappears.

This idea is very useful for me in other work.

[JJMack]

守鑫黄40599923 wrote:

Thanks JJMack.

I cannot do it successfully because i don't know how to remove the anchor's handle. The important tool is Convert Point Tool, and i click on the anchor with Convert Point Tool, the handle disappears.

This idea is very useful for me in other work.

That is correct you have removed the handle with the convert tool. Now the control point are points controls  for straight  angled lines no curves when you move the center point the connecting lines will be straight lines with no curves just straight lines with sharp angles.

[Droid37704358ofnr]

I met same question. I am developing a plugin using UXP. I want to get the pixel coordinates of the mouse click on the image. I need to pass these coordinates as input to an AI software. How can I get the coordinates of the user's click?How should I do