6 Replies Latest reply on Feb 19, 2008 11:58 AM by (Olav_Kvern)

    IDCS3 JS:  Baby Steps

    JADarnell
      I am venturing out onto new ground in JS and admit that I am taking baby steps at this point. I am trying to make some very simple code work, that looks like this:

      #target "indesign"

      var ADialog = new Window('dialog',' message') ;
      ADialog.bounds = [400, 200, 700, 500];
      ADialog.mytxt = ADialog.add('statictext', undefined, 'some text');
      ADialog.show();

      When run, this code produces a dialog box with the word "message" in the title bar, and nothing else. I was hoping to see "some text" in the body of the dialog.

      I have tried several variations on this to see if I can shake something loose, but nothing works. What am I doing wrong?

      R,
      John
        • 1. Re: IDCS3 JS:  Baby Steps
          Peter Kahrel Adobe Community Professional & MVP
          John,

          If you're new to JavaScript, then trying to use scriptUI (which is what you're doing with the Window object) may not be such a good idea. It is pretty complicated, even for those well-versed in Javascript. It would be much more rewarding for you to get the general hang of the language and the object model before tackling something is complicated as scriptUI.

          For a JavaScript introduction and a tutorial on how to explore the object model, you could try http://www.oreilly.com/catalog/scriptingindesign/ This covers CS2, and some of the code examples later on in the title don't work in CS3, but the general principles are still valid.

          Anyway, the code needed to display some text in a window is this:

          var ADialog = new Window('dialog',' message') ;
          var mytxt = ADialog.add('statictext',undefined,'some text');
          ADialog.show();

          Peter
          • 2. Re: IDCS3 JS:  Baby Steps
            Level 1
            Bob Stucky explained to me here some time back that when you set the bounds of a dialog, ScriptUI stops processing the rest of the dialog (assuming I understood his explanation). I can't say it makes a lot of sense, so perhaps I didn't understand, but what happened to John bears this out because that's only difference between Peter's script and John's.

            Dave
            • 3. Re: IDCS3 JS:  Baby Steps
              Peter Kahrel Adobe Community Professional & MVP
              You're right, I missed that one. Shows my point that scriptUI is not where you want to begin learning about JavaScript.

              Peter
              • 4. Re: IDCS3 JS:  Baby Steps
                Level 1
                That's not quite accurate, Dave, but close.

                Peter's point is well taken. The learning curve for ScriptUI is pretty steep. Once you understand it, it's not that hard, but getting to understand it can be a challenge even for seasoned coders.

                ScriptUI has a "Layout Manager" to auto-layout your dialogs/palettes/windows. The best way to use ScriptUI is with the Layout Manager as you don't have to worry about the appearance of the resulting dialog on different platforms.

                The way it works is by grouping controls into "containers". Containers are objects of class "Window", "Group", and "Panel". The layout manager places container objects, then places the individual controls and sub-containers inside them.

                BUT!

                If you set a container's bounds (which would be a manual placement of the container), the layout manager will not auto-layout the contents of the container. It assumes that, since you manually placed the container, that you are manually placing the contents of the container. At one level this makes no little sense, but at another, it's perfectly clear. Once you have specified the bounds for a container, the layout manager would be "at your mercy".

                For example, if you set a container's bounds to be 3 pixels high and 2 pixels wide, and then told ScriptUI to auto-layout 3 text frames, just what would ScriptUI do?

                While I have no knowledge of Mark's (the guy responsible for ScriptUI) algorithm, it would make sense that he has to drill down to the lowest level container - find the size of the controls, set the size of the container, and work his way back up. If that's the case, then there's no way for him to execute that on a container once the developer has manually set the bounds for that container.

                So, in your code:

                #target "indesign"

                var ADialog = new Window('dialog',' message') ;
                ADialog.bounds = [400, 200, 700, 500];
                ADialog.mytxt = ADialog.add('statictext', undefined, 'some text');
                ADialog.show();

                ADialog.bounds = [400,200,700,500];

                Sets the bounds for the window, and therefore stops the layout manager from laying out the container (in this case the window).

                #target "indesign"

                var ADialog = new Window('dialog',' message') ;
                ADialog.mytxt = ADialog.add('statictext', undefined, 'some text');
                ADialog.show();

                This will work.

                Now, if you're trying to set your preferences for size and location...

                var aDialog = new Window( "dialog", "Message" );
                aDialog.frameLocation = [ 400, 200 ]; // the left and top coords
                aDialog.frameSize = [ 300, 300 ]; // width and height
                aDialog.myTxt = aDialog.add( "statictext", undefined, "some text" );
                aDialog.show();

                In this case, you didn't set the "bounds" you simply said, put it at the x/y location on the screen, and "PLEASE TRY to make the window this size". Note the "PLEASE". The layout manager will make the window as large as it needs to, the smallest will be the size you asked for. The "frameSize" setting is used only as a suggestion, and that's very different than setting fixed bounds.

                A warning to you: ScriptUI doesn't do anything you don't tell it to. In your example, you didn't add OK and Cancel buttons, so there will be no way to dismiss your dialog. You'll have to force-quit the app, most likely.

                I typically use a window type of "palette" until I have the window doing everything I want it to do correctly BEFORE I change the window type to "dialog".

                Here's how I would write your code:

                var aDialog = new Window( "dialog", "Message" );
                aDialog.frameLocation = [ 400, 200 ]; // the left and top coords
                aDialog.frameSize = [ 300, 300 ]; // width and height
                aDialog.myTxt = aDialog.add( "statictext", undefined, "some text" );
                var bGroup = aDialog.add( "group" );
                aDialog.okBtn = bGroup.add( "button", undefined, "OK" );
                aDialog.okBtn.onClick = function() {
                this.window.close( 1 );
                }
                aDialog.cancelBtn = bGroup.add( "button", undefined, "Cancel" );
                aDialog.cancelBtn.onClick = function() {
                this.window.close( 2 );
                }

                aDialog.show();

                Regards

                Bob
                • 5. Re: IDCS3 JS:  Baby Steps
                  Level 1
                  I'm sure you explained it just as well last time, Bob. It sank into my consciousness as "don't do it" and I promptly forgot the details.

                  Thanks again.

                  Dave
                  • 6. Re: IDCS3 JS:  Baby Steps
                    Level 1
                    Hi John,

                    In addition, if all you need is a simple modal dialog box, you might want to consider using InDesign's Dialog object rather than ScriptUI. It's quite a bit easier to work with. You can find examples of the dialog object in almost all of the CS3 sample scripts. Oh, and it works with all scripting languages, rather than with JavaScript only.

                    Thanks,

                    Ole