Selection Maker

JokerMartini · Post by **JokerMartini** » Thu Sep 06, 2012 7:40 pm

If you run the code below it simply creates a new layer with the desired dimensions and fills it with a grey color.
I was wondering If i could get some help from the community in giving this a UI with just two input fields and a color picker which defaults to grey.
Lastly just a commit and cancel button.

I'm trying to learn photoshop scripting and I'm making some headway but would love some help in giving this a UI. From there I'll be able to pick up and learn how to do future UI's.

Code: Select allif(app.documents.length > 0){
var doc = app.activeDocument;
var selWidth = parseInt( prompt("Define width of selection:", 640));
var selHeight = parseInt( prompt("Define height of selection:", 360));
var squareColor = new RGBColor;

squareColor.hexValue = 808080;
var newLayer = doc.artLayers.add();
newLayer.name = "Guide - " + selWidth + " x " + selHeight;
selectedRegion = Array(Array(0,0), Array(0, selHeight), Array(selWidth, selHeight), Array(selWidth, 0));
doc.selection.select(selectedRegion);
doc.selection.fill(squareColor);
doc.selection.deselect();
}

Thanks

John

JokerMartini · Post by **JokerMartini** » Thu Sep 06, 2012 9:03 pm

I've gone ahead and tried to attempt to create the dialog and functions I wanted. I do not really care to much about the color picker part. That seems like more of a hassel than anything.

Anyways, this is what I have so far. It creates the dialog and controls but I'm not sure how to bind the action of the button being pressed with the function. I'd love it if someone could help me clean this up and get rid of what is needed versus the garbage. Like I mentioned before I'm still new to all of this so I'm just figuring this out still.
Thanks for the help.

Code: Select all createDialog = function ( ) {
var dlg = new Window( 'dialog', 'Guides' );
dlg.btnPnl = dlg.add( 'group', [20,20,170,100] );
dlg.stWidth = dlg.btnPnl.add('statictext',[4,6,100,34],'Width:');
dlg.etWidth = dlg.btnPnl.add('edittext',[60,4,120,24],'90');
dlg.stWpx = dlg.btnPnl.add('statictext',[125,6,180,150],'px');
dlg.etWidth.addEventListener ('keydown', NumericEditKeyboardHandler );

dlg.stHeight = dlg.btnPnl.add('statictext',[4,36,100,34],'Height:');
dlg.etHeight = dlg.btnPnl.add('edittext',[60,36,120,56],'120');
dlg.stHpx = dlg.btnPnl.add('statictext',[125,36,180,150],'px');
dlg.etHeight.addEventListener ('keydown', NumericEditKeyboardHandler );

dlg.grpCancel = dlg.add('group');
dlg.btnPnl.cancelBtn = dlg.grpCancel.add( 'button', undefined, 'Done', { name:'cancel' });
dlg.btnPnl.cancelBtn.preferredSize.width = 96;
return dlg;
};

initializeDialog = function( w ) {
};

runDialog = function( w ) {
return w.show( );
};

function createGuide(){
if(app.documents.length > 0){
var doc = app.activeDocument;
var selWidth = parseInt( prompt("Define width of selection:", etWidth.value));
var selHeight = parseInt( prompt("Define height of selection:", 360));
var squareColor = new RGBColor;

squareColor.hexValue = 808080;
var newLayer = doc.artLayers.add();
newLayer.name = "Guide - " + selWidth + " x " + selHeight;
selectedRegion = Array(Array(0,0), Array(0, selHeight), Array(selWidth, selHeight), Array(selWidth, 0));
doc.selection.select(selectedRegion);
doc.selection.fill(squareColor);
doc.selection.deselect();
}
};

function findDialog( inItem ) {
var w = inItem;
while ( 'dialog' != w.type ) {
if ( undefined == w.parent ) {
w = null;
break;
}
w = w.parent;
}
return w;
};
function NumericEditKeyboardHandler (event) {
try {
var keyIsOK = KeyIsNumeric(event) ||
KeyIsDelete (event) ||
KeyIsLRArrow (event) ||
KeyIsTabEnterEscape (event);

if (! keyIsOK) {
// Bad input: tell ScriptUI not to accept the keydown event
event.preventDefault();
/* Notify user of invalid input: make sure NOT
to put up an alert dialog or do anything which
requires user interaction, because that
interferes with preventing the 'default'
action for the keydown event */
app.beep();
}
}
catch (e) {
; // alert ("Ack! bug in NumericEditKeyboardHandler: " + e);
}
};
function KeyHasModifier ( event ) {
return event.shiftKey || event.ctrlKey || event.altKey || event.metaKey;
};
function KeyIsNumeric ( event ) {
return ( event.keyName >= '0' ) && ( event.keyName <= '9' ) && ! KeyHasModifier ( event );
};
function KeyIsDelete (event) {
return (event.keyName == 'Backspace') && ! (event.ctrlKey);
};
function KeyIsLRArrow (event) {
return ((event.keyName == 'Left') || (event.keyName == 'Right')) && ! (event.altKey || event.metaKey);
};
function KeyIsTabEnterEscape (event) {
return event.keyName == 'Tab' || event.keyName == 'Enter' || event.keyName == 'Escape';
};
//////////////////////////////////////////////////////////////////////////////////////////////////////
var originalRulerUnits = app.preferences.rulerUnits;
app.preferences.rulerUnits = Units.PIXELS;
var myDocument = app.activeDocument;
var theLayer = myDocument.activeLayer;
var win = createDialog();
initializeDialog(win);
runDialog(win);
app.preferences.rulerUnits = originalRulerUnits;

Mike Hale · Post by **Mike Hale** » Thu Sep 06, 2012 10:47 pm

There are a lot of ways to do this. Here is an example that you should be able to adapt to your needs.
Code: Select all createDialog = function ( ) {
var dlg = new Window( 'dialog', 'Guides' );
dlg.btnPnl = dlg.add( 'group', [20,20,170,100] );
dlg.stWidth = dlg.btnPnl.add('statictext',[4,6,100,34],'Width:');
dlg.etWidth = dlg.btnPnl.add('edittext',[60,4,120,24],'90');
dlg.stWpx = dlg.btnPnl.add('statictext',[125,6,180,150],'px');
dlg.etWidth.addEventListener ('keydown', NumericEditKeyboardHandler );

dlg.stHeight = dlg.btnPnl.add('statictext',[4,36,100,34],'Height:');
dlg.etHeight = dlg.btnPnl.add('edittext',[60,36,120,56],'120');
dlg.stHpx = dlg.btnPnl.add('statictext',[125,36,180,150],'px');
dlg.etHeight.addEventListener ('keydown', NumericEditKeyboardHandler );

dlg.grpCancel = dlg.add('group');
dlg.btnPnl.cancelBtn = dlg.grpCancel.add( 'button', undefined, 'create', { name:'ok' });
dlg.btnPnl.cancelBtn.preferredSize.width = 96;
return dlg;
};

initializeDialog = function( w ) {
};

runDialog = function( w ) {
return w.show( );
};

function createGuide(){
if(app.documents.length > 0){
var doc = app.activeDocument;
var selWidth = parseInt( win.etWidth.text );
var selHeight = parseInt(win.etHeight.text );
var squareColor = new RGBColor;

squareColor.hexValue = 808080;
var newLayer = doc.artLayers.add();
newLayer.name = "Guide - " + selWidth + " x " + selHeight;
selectedRegion = Array(Array(0,0), Array(0, selHeight), Array(selWidth, selHeight), Array(selWidth, 0));
doc.selection.select(selectedRegion);
doc.selection.fill(squareColor);
doc.selection.deselect();
}
};

function findDialog( inItem ) {
var w = inItem;
while ( 'dialog' != w.type ) {
if ( undefined == w.parent ) {
w = null;
break;
}
w = w.parent;
}
return w;
};
function NumericEditKeyboardHandler (event) {
try {
var keyIsOK = KeyIsNumeric(event) ||
KeyIsDelete (event) ||
KeyIsLRArrow (event) ||
KeyIsTabEnterEscape (event);

if (! keyIsOK) {
// Bad input: tell ScriptUI not to accept the keydown event
event.preventDefault();
/* Notify user of invalid input: make sure NOT
to put up an alert dialog or do anything which
requires user interaction, because that
interferes with preventing the 'default'
action for the keydown event */
app.beep();
}
}
catch (e) {
; // alert ("Ack! bug in NumericEditKeyboardHandler: " + e);
}
};
function KeyHasModifier ( event ) {
return event.shiftKey || event.ctrlKey || event.altKey || event.metaKey;
};
function KeyIsNumeric ( event ) {
return ( event.keyName >= '0' ) && ( event.keyName <= '9' ) && ! KeyHasModifier ( event );
};
function KeyIsDelete (event) {
return (event.keyName == 'Backspace') && ! (event.ctrlKey);
};
function KeyIsLRArrow (event) {
return ((event.keyName == 'Left') || (event.keyName == 'Right')) && ! (event.altKey || event.metaKey);
};
function KeyIsTabEnterEscape (event) {
return event.keyName == 'Tab' || event.keyName == 'Enter' || event.keyName == 'Escape';
};
//////////////////////////////////////////////////////////////////////////////////////////////////////
var originalRulerUnits = app.preferences.rulerUnits;
app.preferences.rulerUnits = Units.PIXELS;
var myDocument = app.activeDocument;
var theLayer = myDocument.activeLayer;
var win = createDialog();
initializeDialog(win);
var results = runDialog(win);
if(results == 1) createGuide();
app.preferences.rulerUnits = originalRulerUnits;

JokerMartini · Post by **JokerMartini** » Fri Sep 07, 2012 12:24 am

Thank you very much Mike for the help.
Just for the sake of learning is there a better more efficient and lighter code wise, way of doing this kind of script?
I would be interested in seeing a better or more stripped and simplified version of it.
It seems like there is a bunch of extra garbage in the script that is un-needed or atleast could be condensed more.

Mike Hale · Post by **Mike Hale** » Fri Sep 07, 2012 1:04 am

I think some of the extra functions are a matter of style and dialog complexity. And no, they are not needed with a simple dialog like this one but I left them in before because you had them and I thought you had plans for using them later. Here is one way to shorten the code.
Code: Select all function createGuide(){
if(app.documents.length > 0){
   var doc = app.activeDocument;
   var selWidth = parseInt( win.etWidth.text );
   var selHeight = parseInt(win.etHeight.text );
   var squareColor = new RGBColor;

   squareColor.hexValue = 808080;
   var newLayer = doc.artLayers.add();
   newLayer.name = "Guide - " + selWidth + " x " + selHeight;
   selectedRegion = Array(Array(0,0), Array(0, selHeight), Array(selWidth, selHeight), Array(selWidth, 0));
   doc.selection.select(selectedRegion);
   doc.selection.fill(squareColor);
   doc.selection.deselect();
}
};
function NumericEditKeyboardHandler (event) {
try {
   var keyIsOK = KeyIsNumeric(event) ||
            KeyIsDelete (event) ||
         KeyIsLRArrow (event) ||
         KeyIsTabEnterEscape (event);

   if (! keyIsOK) {
      // Bad input: tell ScriptUI not to accept the keydown event
      event.preventDefault();
      /* Notify user of invalid input: make sure NOT
         to put up an alert dialog or do anything which
         requires user interaction, because that
         interferes with preventing the 'default'
         action for the keydown event */
      app.beep();
   }
}
catch (e) {
   ; // alert ("Ack! bug in NumericEditKeyboardHandler: " + e);
}
};
function KeyHasModifier ( event ) {
return event.shiftKey || event.ctrlKey || event.altKey || event.metaKey;
};
function KeyIsNumeric ( event ) {
return ( event.keyName >= '0' ) && ( event.keyName <= '9' ) && ! KeyHasModifier ( event );
};
function KeyIsDelete (event) {
return (event.keyName == 'Backspace') && ! (event.ctrlKey);
};
function KeyIsLRArrow (event) {
return ((event.keyName == 'Left') || (event.keyName == 'Right')) && ! (event.altKey || event.metaKey);
};
function KeyIsTabEnterEscape (event) {
return event.keyName == 'Tab' || event.keyName == 'Enter' || event.keyName == 'Escape';
};
/////////////////////////////
var win = new Window( 'dialog', 'Guides' );
win.btnPnl = win.add( 'group', [20,20,170,100] );
win.stWidth = win.btnPnl.add('statictext',[4,6,100,34],'Width:');
win.etWidth = win.btnPnl.add('edittext',[60,4,120,24],'90');
win.stWpx = win.btnPnl.add('statictext',[125,6,180,150],'px');
win.etWidth.addEventListener ('keydown', NumericEditKeyboardHandler );

win.stHeight = win.btnPnl.add('statictext',[4,36,100,34],'Height:');
win.etHeight = win.btnPnl.add('edittext',[60,36,120,56],'120');
win.stHpx = win.btnPnl.add('statictext',[125,36,180,150],'px');
win.etHeight.addEventListener ('keydown', NumericEditKeyboardHandler );

win.grpCancel = win.add('group');
win.btnPnl.cancelBtn = win.grpCancel.add( 'button', undefined, 'create', { name:'ok' });
win.btnPnl.cancelBtn.preferredSize.width = 96;
var originalRulerUnits = app.preferences.rulerUnits;
app.preferences.rulerUnits = Units.PIXELS;
var results = win.show();
if(results == 1) createGuide();
app.preferences.rulerUnits = originalRulerUnits;

JokerMartini · Post by **JokerMartini** » Fri Sep 07, 2012 1:23 pm

Thank you Mike very much for your help.
The code was rather a jumbled mess because I was just combining scripts I came across online in attempt to make this Selection Maker.
Thanks for helping cleaning it up. It will allow me to see a simple basic tool and how its done.
John