How to draw a line on Photoshop using CEP/JavaScript/ExtendScript?

Question

I am developing a Photoshop extension and I need to draw a line according to coordinates I receive from a server.

I found this code that almost answers my question: Draw circle on a new layer in Photoshop using cep/Javascript but unfortunately, the 2 ends of the line meet.

I could not find a solution, thank you in advance for your help !

Here are the coordinates :

1: 192,1246|190,1246|188,1246|188,1246|185,1244|183,1244|183,1244|180,1242|178,1242|173,1242|173,1239|171,1237|168,1237|166,1234|163,1234|161,1232|161,1230|159,1227|156,1225|156,1225|156,1222|156,1220|154,1217|154,1215|154,1213|154,1210|154,1210|154,1205|156,1205|156,1203|156,1201|156,1198|156,1198|156,1196|159,1193|159,1191|161,1189|161,1189|161,1186|163,1184|163,1184|166,1179|168,1179|168,1174|171,1172|173,1169|175,1167|175,1167|178,1165|180,1162|180,1160|183,1157|185,1157|185,1155|188,1155|190,1153|192,1150|192,1148|197,1145|200,1145|202,1143|207,1141|209,1141|214,1138|221,1136|226,1133|233,1131|240,1131|245,1131|250,1131|255,1129|260,1129|264,1129|267,1129|272,1129|274,1129|276,1129|281,1129|281,1129|286,1131|288,1131|291,1131|296,1131|298,1133|303,1136|308,1136|310,1138|315,1141|317,1141|320,1143|320,1145|325,1145|327,1148|329,1150|332,1153|334,1153|334,1153|337,1155|337,1155|337,1155|339,1155|339,1157|339,1157|339,1157|339,1157|339,1157|341,1157|341,1160|341,1160|344,1160|344,1162|346,1162|346,1165|349,1167|349,1167|351,1167|351,1169|351,1172|353,1174|353,1177|356,1179|356,1179|356,1181|356,1181|356,1184|356,1186|356,1189|356,1193|356,1198|356,1203|356,1208|353,1213|351,1220|351,1225|346,1230|344,1237|339,1244|337,1249|332,1256|329,1261|325,1266|317,1270|313,1275|305,1282|296,1287|288,1290|281,1294|276,1294|267,1297|262,1299|252,1302|245,1304|240,1304|231,1304|224,1304|214,1304|209,1304|202,1304|195,1304|188,1304|180,1302|173,1299|166,1299|159,1297|151,1294|142,1292|135,1290|125,1282|115,1278|106,1273|99,1266|94,1263|89,1261|87,1256|82,1251|77,1244|72,1239|72,1239

Here is the final result I want:

And here is the result I currently have:

Here is the code in question:

function DrawShape(arr) 
{
    
    var doc = app.activeDocument;
    var y = arr.length;
    var i = 0;

    // get original height
    var imageHeight = app.activeDocument.height.value;
    
    var lineArray = [];
    for (i = 0; i < y; i++) 
    {
        lineArray[i] = new PathPointInfo;
        lineArray[i].kind = PointKind.CORNERPOINT;

        // invert Y
        arr[i][1] = imageHeight - arr[i][1];

        lineArray[i].anchor = arr[i];
        lineArray[i].leftDirection = lineArray[i].anchor;
        lineArray[i].rightDirection = lineArray[i].anchor;
    }

    var lineSubPathArray = new SubPathInfo();
    lineSubPathArray.closed = true;
    lineSubPathArray.operation = ShapeOperation.SHAPEADD;
    lineSubPathArray.entireSubPath = lineArray;
    var myPathItem = doc.pathItems.add("myPath", [lineSubPathArray]);
    

    // =======================================================
    var idsetd = charIDToTypeID( "setd" );
    var desc100 = new ActionDescriptor();
    var idnull = charIDToTypeID( "null" );
    var ref24 = new ActionReference();
    var idChnl = charIDToTypeID( "Chnl" );
    var idfsel = charIDToTypeID( "fsel" );
    ref24.putProperty( idChnl, idfsel );
    desc100.putReference( idnull, ref24 );
    var idT = charIDToTypeID( "T   " );
    var ref25 = new ActionReference();
    var idPath = charIDToTypeID( "Path" );
    var idOrdn = charIDToTypeID( "Ordn" );
    var idTrgt = charIDToTypeID( "Trgt" );
    ref25.putEnumerated( idPath, idOrdn, idTrgt );
    desc100.putReference( idT, ref25 );
    var idVrsn = charIDToTypeID( "Vrsn" );
    desc100.putInteger( idVrsn, 1 );
    var idvectorMaskParams = stringIDToTypeID( "vectorMaskParams" );
    desc100.putBoolean( idvectorMaskParams, true );
    executeAction( idsetd, desc100, DialogModes.NO );


    // draw a pixel line in red around the path
    stroke_line(2, 215, 5, 5);

    // remove selectrion path to pixels
    deselect_path();

    // select nothing
    app.activeDocument.selection.deselect();

    // var desc88 = new ActionDescriptor();
    // var ref60 = new ActionReference();
    // ref60.putClass(stringIDToTypeID("contentLayer"));
    // desc88.putReference(charIDToTypeID("null"), ref60);
    // var desc89 = new ActionDescriptor();
    // var desc90 = new ActionDescriptor();
    // var desc91 = new ActionDescriptor();
    // desc91.putDouble(charIDToTypeID("Rd  "), 0.000000); // R
    // desc91.putDouble(charIDToTypeID("Grn "), 0.000000); // G
    // desc91.putDouble(charIDToTypeID("Bl  "), 0.000000); // B
    // var id481 = charIDToTypeID("RGBC");
    // desc90.putObject(charIDToTypeID("Clr "), id481, desc91);
    // desc89.putObject(charIDToTypeID("Type"), stringIDToTypeID("solidColorLayer"), desc90);
    // desc88.putObject(charIDToTypeID("Usng"), stringIDToTypeID("contentLayer"), desc89);
    // executeAction(charIDToTypeID("Mk  "), desc88, DialogModes.NO);
    
    // myPathItem.remove();
}


function stroke_line(strokewidth, R, G, B)
{
// =======================================================
var idStrk = charIDToTypeID( "Strk" );
var desc2613 = new ActionDescriptor();
var idWdth = charIDToTypeID( "Wdth" );
desc2613.putInteger( idWdth, strokewidth );
var idLctn = charIDToTypeID( "Lctn" );
var idStrL = charIDToTypeID( "StrL" );
var idInsd = charIDToTypeID( "Insd" );
desc2613.putEnumerated( idLctn, idStrL, idInsd );
var idOpct = charIDToTypeID( "Opct" );
var idPrc = charIDToTypeID( "#Prc" );
desc2613.putUnitDouble( idOpct, idPrc, 100.000000 ); // opacity
var idMd = charIDToTypeID( "Md  " );
var idBlnM = charIDToTypeID( "BlnM" );
var idNrml = charIDToTypeID( "Nrml" );
desc2613.putEnumerated( idMd, idBlnM, idNrml );
var idClr = charIDToTypeID( "Clr " );
var desc2614 = new ActionDescriptor();
var idRd = charIDToTypeID( "Rd  " );
desc2614.putDouble( idRd, R ); // RED
var idGrn = charIDToTypeID( "Grn " );
desc2614.putDouble( idGrn, G ); // GREEN
var idBl = charIDToTypeID( "Bl  " );
desc2614.putDouble( idBl, B ); // BLUE
var idRGBC = charIDToTypeID( "RGBC" );
desc2613.putObject( idClr, idRGBC, desc2614 );
executeAction( idStrk, desc2613, DialogModes.NO );
}

function deselect_path()
{
    //deselect path
    // =======================================================
    var id630 = charIDToTypeID( "Dslc" );
    var desc154 = new ActionDescriptor();
    var id631 = charIDToTypeID( "null" );
    var ref127 = new ActionReference();
    var id632 = charIDToTypeID( "Path" );
    ref127.putClass( id632 );
    desc154.putReference( id631, ref127 );
    executeAction( id630, desc154, DialogModes.NO );
}

Answer 1

You need to do three things:

// Change the path to be closed
//lineSubPathArray.closed = true;
lineSubPathArray.closed = false;

Comment out the selection code

// // =======================================================
// var idsetd = charIDToTypeID( "setd" );
// var desc100 = new ActionDescriptor();
// var idnull = charIDToTypeID( "null" );
// var ref24 = new ActionReference();
// var idChnl = charIDToTypeID( "Chnl" );
// var idfsel = charIDToTypeID( "fsel" );
// ref24.putProperty( idChnl, idfsel );
// desc100.putReference( idnull, ref24 );
// var idT = charIDToTypeID( "T   " );
// var ref25 = new ActionReference();
// var idPath = charIDToTypeID( "Path" );
// var idOrdn = charIDToTypeID( "Ordn" );
// var idTrgt = charIDToTypeID( "Trgt" );
// ref25.putEnumerated( idPath, idOrdn, idTrgt );
// desc100.putReference( idT, ref25 );
// var idVrsn = charIDToTypeID( "Vrsn" );
// desc100.putInteger( idVrsn, 1 );
// var idvectorMaskParams = stringIDToTypeID( "vectorMaskParams" );
// desc100.putBoolean( idvectorMaskParams, true );
// executeAction( idsetd, desc100, DialogModes.NO );

replace the stroke function with

function stroke_line()
{
    // =======================================================
    var idStrk = charIDToTypeID( "Strk" );
    var desc9847 = new ActionDescriptor();
    var idnull = charIDToTypeID( "null" );
    var ref2350 = new ActionReference();
    var idPath = charIDToTypeID( "Path" );
    var idOrdn = charIDToTypeID( "Ordn" );
    var idTrgt = charIDToTypeID( "Trgt" );
    ref2350.putEnumerated( idPath, idOrdn, idTrgt );
    desc9847.putReference( idnull, ref2350 );
    var idUsng = charIDToTypeID( "Usng" );
    var idPbTl = charIDToTypeID( "PbTl" );
    desc9847.putClass( idUsng, idPbTl );
    executeAction( idStrk, desc9847, DialogModes.NO );
}