9 Replies Latest reply on Sep 25, 2016 3:51 AM by Peter Kahrel

    … The same code x times!

    Obi-wan Kenobi Adobe Community Professional

      Hi all! 

       

      My script works fine! I'm searching better writings to "condense" its code!

       

      The UI:

       

      Capture d’écran 2016-09-04 à 21.20.10.png

       

      [I know: it's not really beautiful! … but it works fine [ It's at least a good news!  ]

       

                  var group2 = w.add ('group');
                  var mygrp2 = group2.add ('dropdownlist', undefined, styles);
                        mygrp2.minimumSize.width = 200;
                        mygrp2.maximumSize.width = 200;
                        mygrp2.selection = 0;
                      
                  var group3 = w.add ('group');
                  var mygrp3 = group3.add ('dropdownlist', undefined, styles);
                        mygrp3.minimumSize.width = 200;
                        mygrp3.maximumSize.width = 200;
                        mygrp3.selection = 0;
                      
                  var group4 = w.add ('group');
                  var mygrp4 = group4.add ('dropdownlist', undefined, styles);
                        mygrp4.minimumSize.width = 200;
                        mygrp4.maximumSize.width = 200;
                        mygrp4.selection = 0;
                      
                  var group5 = w.add ('group');
                  .........
      

       

      if (mygrp2.selection == 0) 
        exit();
      else {
          app.findGrepPreferences = app.changeGrepPreferences = null;
          app.findGrepPreferences.appliedParagraphStyle = mygrp2.selection.text;
          app.changeGrepPreferences.appliedConditions = [myCondition]; 
          myDoc.changeGrep();
          }
      
      
      if (mygrp3.selection == 0) 
        exit();
      else {
          app.findGrepPreferences = app.changeGrepPreferences = null;
          app.findGrepPreferences.appliedParagraphStyle = mygrp3.selection.text;
          app.changeGrepPreferences.appliedConditions = [myCondition]; 
          myDoc.changeGrep();
          }
      
      
      if (mygrp4.selection == 0) 
        exit();
      else {
          app.findGrepPreferences = app.changeGrepPreferences = null;
          app.findGrepPreferences.appliedParagraphStyle = mygrp4.selection.text;
          app.changeGrepPreferences.appliedConditions = [myCondition]; 
          myDoc.changeGrep();
          }
      
      
      if (mygrp5.selection == 0) 
          ......
      

       

      I'm thinking about something like this:

       

      Capture d’écran 2016-09-04 à 21.29.22.png

       

      … with such a code:

       

      //////////////////////////////////////////////////////////////////////
      
      
                  var myDropListNumber = 10;  
      
      
                  var w = new Window ('dialog {alignChildren: "center"}', 'Jump To Next Page! … [Part 1]');
                  var group1 = w.add ('group');
                        group1.add ('statictext {text: "Choose All The Targetted Para Styles!"}');
      
      
                  for( var i = 2 ; i < myDropListNumber ; ++i )  
                      {
                         var group = w.add ('group');
                         group.add ('dropdownlist', undefined, styles, {name: "mygrp"+i});
                      }                
                                               
                  var buttons = w.add ('group {alignment: "center"}');
                        buttons.add ('button {text: "OK"}');
                        buttons.add ('button {text: "Cancel"}');
      
      
                  var group11 = w.add ('group');
                        group11.add ('statictext {text: "by Michel Allio, september 2016. At your own risks! (^/)"}');
                        
      //////////////////////////////////////////////////////////////////////                  
      

       

      … At this complexity level, i'm totally off!! 

       

      Thanks in advance!

       

      (^/)

        • 1. Re: … The same code x times!
          Peter Kahrel Adobe Community Professional & MVP

          Hi Michel -- If I understand correctly what you're up to, rather than doing multiple dropdowns maybe it's easier to do a multi-select list in which you select all the paragraph styles you want to target. That gives you an array of paragraph style names, which you then process.

           

          Peter

          • 2. Re: … The same code x times!
            Obi-wan Kenobi Adobe Community Professional

            Hi Peter,

             

            It would be obviously better but for me technically more difficult to write! [ I'm still too newbie! ]

             

            (^/)

            • 3. Re: … The same code x times!
              Loic.Aigon Adobe Community Professional

              Hello Michel,

               

              You will soon find it's worth the effort to reconsider your UI conception. Otherwise you may spend a lot of time and efforts to maintain your code. To second Peter's thought, here is an approach.

               

              var main = function() {
              
                //UI comps
                var u,
                w = new Window('dialog'),
                mainGp = w.add('group'),
                leftPanel = mainGp.add('group'),
                centerPanel = mainGp.add('group'),
                rightPanel = mainGp.add('group'),
                sourceStylesList = leftPanel.add('listbox', u, u, {multiselect:true}),
                destStylesList = rightPanel.add('listbox', u, u, {multiselect:true}),
                addBtn = centerPanel.add('button', u, ">" ),
                remBtn = centerPanel.add('button', u, "<" ),
                btnGp = w.add('group'),
                cancelBtn = btnGp.add('button', u, 'Cancel'),
                okBtn = btnGp.add('button', u, 'Run');
              
                //Document related variables
                var doc = app.properties.activeDocument,
                pss, stylesProps = {}, ps,
                addedStyles = {};
              
                //Adjusting comps
                w.alignChildren = btnGp.alignChildren = ["fill","top"];
                centerPanel.orientation = 'column';
                centerPanel.alignChildren = ["fill","middle"];
                sourceStylesList.preferredSize = destStylesList.preferredSize = [200,250];
                centerPanel.preferredSize = [10, 250];
                addBtn.preferredSize = remBtn.preferredSize = [20,20];
                remBtn.enabled = addBtn.enabled = false;
              
                //Adding event handlers
                w.onShow = function() {
                //Loading styles to combobox component
                pss = doc.allParagraphStyles;
                var ls;
              
                while ( ps = pss.pop() ){
                ls = sourceStylesList.add('item', ps.name );
                ls.payload = {name:ps.name, style:ps, id:ps.id};
                }
                }
              
              
                sourceStylesList.onChange = function() {
                addBtn.enabled = sourceStylesList.selection;
                }
                destStylesList.onChange = function() {
                remBtn.enabled = destStylesList.selection;
                }
              
              
                addBtn.onClick = function() {
                var sel = sourceStylesList.selection;
                var i = 0, n = sel.length;
                for ( i = 0; i<n; i++ ) {
                var data = sel[i].payload;
                if ( !addedStyles[data.id] ) {
                addedStyles[data.id] = data;
                destStylesList.add('item', data.name ).payload = data;
                sourceStylesList.remove( sourceStylesList.items[sel[i].index] );
                }
                }
                addBtn.enabled = false;
                }
              
              
                remBtn.onClick = function() {
                var sel = destStylesList.selection;
                var i = 0, n = sel.length;
              
                while ( n-- ) {
                var data = sel[n].payload, found;
                if ( addedStyles[data.id] ) {
                delete addedStyles[data.id];
                found = destStylesList.find(data.name );
                found && destStylesList.remove(found);
                sourceStylesList.add('item', data.name).payload = data;
                }
                }
              
                remBtn.enabled = false;
                }
              
              
              
                cancelBtn.onClick = function() {
                w.close(0);
                }
              
              
                okBtn.onClick = function() {
              
                if ( !destStylesList.items.length ) {
                alert("You need to add styles or Cancel…");
                return;
                }
              
                w.close(1);
                }
              
              
                //Displaying window
                if ( doc && w.show()==1 ) {
                processDoc( addedStyles );
                }
              }
              
              
              function processDoc ( stylesObject ) {
                var stylesArray = [];
                for ( prop in stylesObject ) {
                stylesArray[stylesArray.length] = stylesObject[prop].name;
                }
                alert("Obviously you want to work with \r\t-"+stylesArray.join("\r\t-") );
              }
              
              
              var u;
              app.doScript ( "main();",u,u,UndoModes.ENTIRE_SCRIPT, "Process doc" );
              
              • 4. Re: … The same code x times!
                Peter Kahrel Adobe Community Professional & MVP

                Michel,

                 

                Loïc's interface is very clever, thoughfor the newbie that you say you are, the principle might be obscured. The idea behind using a multi-select list is shown below. This is just the barebones, it can be expanded to deal with style groups, error handling, etc.

                 

                Peter

                 

                 

                (function () {
                
                  var conditions = { // Map style names to conditions
                    'Title': ['Red'],
                    'Subtitle': ['Blue']
                  }
                
                  function processStyle (str) {
                    $.writeln ('Paragraph  style name: ' + str + ', condition: ' + conditions[str]);
                  }
                
                  var w = new Window ('dialog');
                    w.list = w.add ('listbox', undefined, app.documents[0].paragraphStyles.everyItem().name, {multiselect: true});
                    w.add ('button {text: "OK"}');
                    w.add ('button {text: "Cancel"}');
                  if (w.show() == 2 || w.list.selection == null) {
                    exit();
                  }
                
                  for (var i = w.list.selection.length-1; i >= 0; i--) {
                    processStyle (w.list.selection[i].text);
                  }
                
                }());
                
                • 5. Re: … The same code x times!
                  Skemicle Level 3

                  I know you've been given better solutions but I will go ahead and answer the original question:

                  /*added*/var ddowns = [];
                  var myDropListNumber = 10;
                  /*added*/var styles = ["ONE","TWO","THREE"];
                  var w = new Window ('dialog {alignChildren: "center"}', 'Jump To Next Page! … [Part 1]');
                  var group1 = w.add ('group');
                  group1.add ('statictext {text: "Choose All The Targetted Para Styles!"}');
                  for( var i = 2 ; i < myDropListNumber ; ++i ){
                      var group = w.add ('group');
                      /*set variable*/ddowns[i-2] = group.add ('dropdownlist', undefined, styles, {name: "mygrp"+i});
                      /*added*/ddowns[i-2].selection = 0;
                  }var buttons = w.add ('group {alignment: "center"}');
                  buttons.add ('button {text: "OK"}');
                  buttons.add ('button {text: "Cancel"}');
                  var group11 = w.add ('group');
                  group11.add ('statictext {text: "by Michel Allio, september 2016. At your own risks! (^/)"}');
                  /*added*/w.show()
                  /*added*/alert(ddowns[0].selection);
                  
                  • 6. Re: … The same code x times!
                    Obi-wan Kenobi Adobe Community Professional

                    Thanks to all of you! 

                     

                    Really nice for my learning!

                     

                    MTFBWY!

                     

                    (^/)

                    • 7. Re: … The same code x times!
                      Obi-wan Kenobi Adobe Community Professional

                      Loïc,

                       

                      Very cool UI!

                       

                      Question 1: is it possible to have the para styles sorted in the order as they appear in the para styles panel?

                      Question 2: Is it possible to have a "double-click" instead of using the ">" or "<"?

                       

                      Thanks in advance!

                       

                      (^/)

                      • 8. Re: … The same code x times!
                        Loic.Aigon Adobe Community Professional

                        Hi,

                         

                        Question 1: is it possible to have the para styles sorted in the order as they appear in the para styles panel?

                        That's a tricky one. Unless I am wrong there is no DOM representation of a global styles hierarchy. Let me rephrase this : There are no easy ways of representing the tree of all the styles and their hierarchy. So for every style you would have to get a representation of its hierarchy to the doc. Nothing here really difficult.

                        However once that done, you would need to give this a visual representation. Obviously the best tool here would be to use a treeView which shoudl suit well for such imbricated items. But then you would have to deal with letting the user know which script is already added (like being greyed for ex). Interesting and tedious challenge if even possible (Peter ?).

                        [EDIT] That would be a better case for a HTML Panel (or Flex if prior to CC2014).

                         

                        Question 2: Is it possible to have a "double-click" instead of using the ">" or "<"?

                        Sure, just add a onDoubleClick listener to the listbox instead than to the > < buttons.

                         

                        Loic

                        • 9. Re: … The same code x times!
                          Peter Kahrel Adobe Community Professional & MVP

                          By default, styles are listed in the order in which they occur in the document. If you want to include style group names you can use either a treeview, as Loic suggested, or a flat list structure the way InDesign does it here and there (toc and index windows, epub export dialog, etc.) A style can be rpresented by its name followed by its parent groups, e.g.

                           

                          style (parent1: parent2: parent3)

                           

                          This one: https://indd.adobe.com/view/a0207571-ff5b-4bbf-a540-07079bd21d75 describes ScriptUI methods for both approaches, see pp. 47 and 52.

                           

                          Peter