17 Replies Latest reply on Mar 17, 2013 10:04 AM by Thom Parker

    addToolButton - oIcon - Hexadecimal Value

    billjar

      I am working with Adobe Acrobat Standard v9.5.1.  I am attempting to add a button to the toolbar using the addToolButton method via a JavaScript. I am embedding the hexadecimal string of the image inside the JavaScript.  I am able to add the button just fine using a hexadecimal value for an Acrobat Icon that I found on a forum, and the button and icon appear / work just fine.  However, when I convert my own image to hexadecimal it never seems to appear correctly.  It usually ends up looking like lots of colorful dots randomly placed on the screen. 

       

      Here are the specs on the original image:

       

      Name:  Sample.tiff

      Tagged Image File Format

      Dimension 20x20 pixels (0.21 x 0.21 inches
      Color Depth:  32bpp

      Density: 96x96 dpi

      Byte order:  littleendian

      Bits per sample:  8

      Samples per pixel:  4

      Photometric:  RGB

      Segmentation:  Single-Striped

      Extra Samples:  associated alpha

      planar config:  contig

      compression:  None

       

      I have noticed that other people's example begin using a jpg, however, I am unable to get a jpg in ARGB, the option that always appears for me is ycbcr.

       

      Does anyone have a good process to convert a standard image into a hexadecimal string for an icon? 

       

      Also, I attempted to do through WindJack Solutions, and the process by which they explain, must require the paid version.  Unfortunately, at this time, purchasing software is not an option.

       

      Any help would be greatly appreciated.


      Thanks

        • 1. Re: addToolButton - oIcon - Hexadecimal Value
          Thom Parker Level 3

          Ok, I'll give you a hint of how to do this.  Look up the util.iconStreamFromIcon() function in the Acrobat JavaScript Reference.  Look at the first example.

           

          But the best Solution is the article on this page, titled "Creating Acrobat Toolbar Buttons"

          http://www.pdfscripting.com/public/department35.cfm

           

          Thom Parker
          The source for PDF Scripting Info
          pdfscripting.com

           

          The Acrobat JavaScript Reference, Use it Early and Often

           

          Then most important JavaScript Development tool in Acrobat
          The Console Window (Video tutorial)

          The Console Window(article)

           

          Having trouble, Why Doesn't my Script Work?

          • 2. Re: addToolButton - oIcon - Hexadecimal Value
            billjar Level 1

            Thanks Thom!  I was able to figure out how to use the iconstreamfromicon function as well as how to encode my icon as a hexadecimal string.  The problem I was having with the hexadecimal value was that the first 244 characters of the string needed to be stripped making the hex string 3200 characters.  First 244 must have been header information not actual image data...not sure, but it worked by cutting the leading 244 characters of my hex string.

             

            Thanks again Thom! 

            • 3. Re: addToolButton - oIcon - Hexadecimal Value
              Lev Ger Level 1

              Dear billjar, would you be able to share your code for getting the HEX from the icon stream. I have this almost working but I seem to be missing about 1158 chars from my icons. I'm using the read function on the icon stream object.

              • 5. Re: addToolButton - oIcon - Hexadecimal Value
                Lev Ger Level 1

                Thank you very much for your those great tutorials! Unfortunately I'm getting pretty much the same result that I was before in Acrobat X, that is I am only getting half the image data from the image. If you have something that works for Acrobat X that would be totally awesome!

                • 6. Re: addToolButton - oIcon - Hexadecimal Value
                  Test Screen Name Most Valuable Participant

                  JPEG files (except greyscale and CMYK) are always stored in YCbCr format. This is a direct (lossless) conversion of RGB, which compresses better, and when a JPEG is opened it is conveted back to RGB for further use.  However, I've not heard of JPEG with alpha information; it's inherently a rectangular format without a mask. 

                   

                  In reading a TIFF, it is just good luck for the original poster that it is single striped format - since the data could be in any order, in all sorts of chunks. The discovery that you need to skip 244 bytes isn't so much a fixed header, since TIFF files can be in any order; it's just a lucky number for that PDF. It sounds as if you really need some kind of raw format (and not just a random camera RAW either). Lev Ger is perhaps just not lucky enough to have a single stripe TIFF. Reading a TIFF without TIFF-savvy code is pretty much a non-starter except for the very fortunate.

                   

                  Or, as seems to be the idea, import images into Acrobat using the UI and use methods to get at the imported image data.

                  • 7. Re: addToolButton - oIcon - Hexadecimal Value
                    Thom Parker Level 3

                    Lev, I"m surprised you're having this issue with an image that is imported into Acrobat. I have never seen the case where only half the image is converted to bytes with the "util.iconStreamFromIcon()" function.  Can you share the image file? What is the technique you are using?

                     

                    BTW: the version of Acrobat isn't important. This functionality has been the same since Acrobat 7.

                    • 8. Re: addToolButton - oIcon - Hexadecimal Value
                      Lev Ger Level 1

                      Thom, I really appreciate you taking an interest in this. Here is my imaage and the code I'm using to first get the hex and then set the button image.

                       

                      Image:

                      http://ubuntuone.com/4fOnXp0aLxC1zVCWpd5a1Q

                       

                      Code for getting hex from image (executed in the console):

                       

                      this.importIcon("myIcon", "/Users/myname/Desktop/myIcon.jpg", 0);
                      var oIcon = util.iconStreamFromIcon(this.getIcon("myIcon"));
                      oIcon.read();
                      

                       

                      HEX that I get from the above (soft returns added for readability):

                       

                      ff9f4e7bffa54b7fffa84880ffac4481ffb04182ffb23e83ffb53c84ffb83785ffb93785ffba3685ffba3685ffba3685ffb83a84ffb53a85ffb23e83ffb04182ffad438
                      1ffa94780ffa44b7fffa04c7cffa54b7fffaa4680ffad4381ffb23e83ffb63c83ffb93785ffbc3086ffbd2d86ffc2428dffc33e8cffc02c87ffbf2c86ffbe2c87ffbc3086
                      ffb93686ffb63b84ffb23e83ffae4282ffa94780ffa6497fffa84880ffac4481ffb24083ffb83a84ffba3485ffbe2d86ffc12588ffc62d8bffe196bfffebbfd6ffd877ad
                      ffc5238affc32289ffc12788ffbe2d86ffba3386ffb83a84ffb23e83ffad4382ffaa4680ffac4481ffb13f83ffb63b84ffbb3286ffbf2a86ffc32288ffc7258affe08ab9f
                      ff5dce9fff9f5f8fff0c9dcffd96eaaffc71b88ffc51e88ffc32288ffc02a88ffbb3286ffb83a84ffb13f83ffad4382ffaf4182ffb53c83ffba3685ffbf2a86ffc42288ffc61
                      c88ffdd78b1fff3d2e4fffcf8fbfffffffffffaf5f7fff0c3dbffda6aaaffc9198affc61c88ffc42288ffc02a88ffba3386ffb53c84ffb04182ffb23e83ffb83a84ffbe2d86ff
                      c22588ffc61e89ffca168affd7499efff0b7d6fffaf3f7fffefefefffefefefff9f2f6fff1c6dcffde72afffc91a8affc61c89ffc32288ffbe2c87ffb83986ffb43e83ffb53c84
                      ffba3386ffc02788ffc61e88ffc9198affcc138bffd1158effdf4fa5fff1b5d7fff9f2f6fffefefefffefefefffaf3f7fff1c6ddffdd6babffc9188affc61e89ffc12788ffba338
                      6ffb63b84ffb63a84ffbd2d86ffc22588ffc71a89ffcc158affcf0f8bffd10a8cffd50c8fffe449a8fff4b6d8fffbf6f8fffefefefffffffffff9f2f6fff0c2daffdb66a8ffc81a8
                      9ffc42288ffbd2f86ffb93886ffb93785ffcb5d9cffe39cc2ffe8a1c7ffeb9ec8ffec9cc8ffed97c8ffef94c7fff19bcbfff6c9e2fffaf5f8fffefefefffffffffffefefffff9f2f6ff
                      f0c3daffdb6facffc52289ffbf2c87ffb93485ffba3386ffd57dadfff4e7effffaf6f9fffaf6f9fffaf6f9fffaf6f9fffaf6f9fffaf6f9fffbf7fafffcfcfdfffefefefffffffffffffffffff
                      dfffffffaf5f7fff1c9ddffd974acffc02e88ffba3386ffba3386ffd781aefff7eef3fffefefefffefefefffefefefffefefefffefefefffefefffffefefffffefefeffffffffffffffffffffffff
                      fffdfffffffdfefefff7f0f4ffe8abcbffc02e88ffba3386ffb93686ffd77faffff8f0f3fffffffffffffffffffffffffffffffffffdfffdfffdfffdfffffffefffffffffffffffffffffffffffffffff
                      ffefefefffbf8f9fff3d3e3ffda7ab0ffc02a88ffba3386ffb93686ffcd66a0ffe9aeccffedb4d2ffefb1d2fff1aed2fff3abd2fff3a8d1fff4abd5fff7d2e6fffbf7fafffefefeffff
                      fffffffefefefffaf5f7fff4cee1
                      

                       

                      Code for setting the icon image:

                       

                      var myIconStream = [the hex string goes here];
                      
                      
                      var oIcon =
                      {
                          count: 0,
                          width: 20,
                          height: 20,
                          read: function(nBytes)
                          {
                              return myIconStream.slice(this.count, this.count += nBytes);
                          },
                          GetIcon: function() {
                            this.count = 0;
                            return this;
                          }
                      };
                      
                      
                      
                      
                      var myButton = {
                                          cName: "myToolaButton",
                                          oIcon: oIcon,
                                          cExec: "app.alert('Someone pressed me!')",
                                          cTooltext: "Push Me!",
                                          cEnable: true,
                                      cLabel: "button123",
                                      nPos: 00
                                };
                      app.addToolButton(myButton);
                      

                       

                      Hope this gives some sort of idea what I might be doing wrong.

                      • 9. Re: addToolButton - oIcon - Hexadecimal Value
                        Test Screen Name Most Valuable Participant

                        The hex data yields 1024 hex bytes. That isn't consistent with a 20x20 icon, but it is consistent with a 16x16 icon.

                         

                        I observe - don't  know if it matters - that you do not pass a value to the read method, though the documentation says you should pass the number of bytes to read.

                        • 10. Re: addToolButton - oIcon - Hexadecimal Value
                          Lev Ger Level 1

                          Thank you for pointing that out. I have tried both ways, meaning passing the number of bytes and not, and it did not seem to make any difference.

                          But to be sure I just tried passing "read(1600)", I got a different amount of characters, but when I passed them to the Icon I still only got half an icon. Here is the HEX that I got.

                           

                           

                          ff9d4f78ffa14a7effa34b7effa64c7fffae4381ffaf4183ffb23e82ffb23e83ffb63a83ffb73d84ffb73c86ff b63d84ffb93984ffb13f83ffb24082ffaf4284ffac4582ffa94780ffa54b7fffa24c7cff9e4f7dffa64a81ffad 4582ffab4380ffb53d84ffb14084ffbb3787ffba3685ffbc3187ffc45092ffc02d89ffbc3088ffbd3284ffb936 86ffbd3186ffb33f83ffb14083ffad4381ffa94a81ffa54b7fffa44c7fffa84a81ffb04183ffb44085ffba3982 ffbc3285ffbb3488ffc2298affe2adc8fff5e9efffcb5e96ffc3248affc32489ffc02d89ffbc3086ffba3588ff b73b85ffb33f84ffaf4683ffab4881ffaa477effad4581ffb53f84ffb73983ffbb3385ffbe2f87ffc42586ffd5 7fabfffcfefefffefefbfff6e9f2ffd2639fffc51c88ffc41f8affc42785ffc12b87ffbc3286ffb93886ffb33f 83ffae4381ffaa4882ffb33d81ffb73d85ffbd2f86ffc0298affc81b8bffd264a2fffffffffffffdffffffffff fffffffffffcfefdffdc7eaeffcb168bffcb198affc12789ffbf2a86ffbd2f86ffb73b84ffb24082ffb24082ff b53d85ffb83987ffbf2d85ffc52289ffc91d8cffca1886ffebaacffffffffffffefffcfffdfffffffffffffffe fcfdffdb7bb0ffc91a87ffca1a8bffc52289ffc02c87ffbb3787ffb53d84ffae4381ffb93886ffbe2f87ffc524 87ffc72088ffca168affd00e8affcf0d8dffe9abcbfffdfefbfffefdfcfffffcfefffffffefffffcfeffda7baf ffc9188affc81e8affc42489ffbe2f87ffb83a84ffb33c84ffbb3586ffbf2d85ffc52288ffce158dffcd118dff d20d8bffd60a8dffd5078dffe88fc0fffffffffffefffcfffcfefefffffffffffffdffffeaabcdffca1989ffc6 1e89ffbf2c87ffba3586ffb93984ffc76b9efffffcfefffffffffffcfefdfffdfffffffefcfdfffffffffffffd fffffdfffcfffdfffffffefefffffffffffffffdfffffffdffffffffffffe7accbffc81e8affc32788ffbb3286 ffb83c82ffcb699dfffbfefefffffdfffffffffffffffdfffffdfffffffffdfffffffffefffffffffffefefeff fdfffffffcfefefffefffcfffefffcffffffffffffffffffe5adccffc5238bffbc3187ffb73a88ffc96a9fffff fdfffffffefefffcfefefffefefefffdfffffffffffffffefefefffffdfffffdfffffffefffcfffffdffffffff fffffffffffffcfefefffefffcffe7accdffc4218bffbc3285ffb93984ffcb6b9dfffbfefefffffffffffcfefd fffffffefffffffffffcfefefffffdfffffffdfffffffdffffffffffffffffffffffffffffffffffffffffffff eaabcdffc91e88ffc52288ffbc3286ffb63b85ffbd2f87ffc22787ffc71e89ffcc1789ffcd1289ffd3088dffd6 088effd7078affe685b8fffefcfcfffbfefefffefefefffefffcffffffffffe7accb

                          • 11. Re: addToolButton - oIcon - Hexadecimal Value
                            Saulius Stonys Level 1

                            Hi, Lev.

                             

                            The solution for Acrobat X is:

                             

                            1. Make your icon image 16x16 px

                            2. Change properies width and height of oIcon from 20 to16.

                             

                            var oIcon =

                            {

                                count: 0,

                                width: 16,

                                height: 16,

                                read: function(nBytes)

                                {

                                    return myIconStream.slice(this.count, this.count += nBytes);

                                },

                                GetIcon: function() {

                                  this.count = 0;

                                  return this;

                                }

                            };

                             

                            That works for me. Voilà !

                            • 12. Re: addToolButton - oIcon - Hexadecimal Value
                              Lev Ger Level 1

                              Wow!!! You solved it! That worked!!! Thank you sooooo much!

                              • 13. Re: addToolButton - oIcon - Hexadecimal Value
                                Thom Parker Level 3

                                At this stage of the process

                                 

                                this.importIcon("myIcon", "/Users/myname/Desktop/myIcon.jpg", 0);

                                var oIcon = util.iconStreamFromIcon(this.getIcon("myIcon"));

                                 

                                you can actually get the width and height from the icon

                                 

                                oIcon.height

                                oIcon.width

                                 

                                I should have mentioned this earlier. I noticed it was missing from that tutorial.

                                 

                                I actually have a full icon/Automation script creation tool AcroButtons. Unfortunately it doesn't work in Acrobat XI, but I also have all of this functionality built-into a PDF file, that acts as an icon creation tool. You can download it from here if you are a member.

                                Download Tools


                                It's labeled "Creating Toolbar Buttons", towards the bottom of the list.

                                • 14. Re: addToolButton - oIcon - Hexadecimal Value
                                  JBS001

                                  Thom are you saying we cannot add an icon in XI?

                                  • 15. Re: addToolButton - oIcon - Hexadecimal Value
                                    Test Screen Name Most Valuable Participant

                                    There are no toolbars, in the sense of Acrobat versions up to 9, in Acrobat X and above. They were abolished and moved to the Tools palette. Don't know if JavaScript gives control over this area.

                                    • 16. Re: addToolButton - oIcon - Hexadecimal Value
                                      try67 MVP & Adobe Community Professional

                                      Icons in the Tools menu have icons just like those in the toolbars (and in

                                      fact, they can be added to the toolbar).

                                       

                                       

                                      On Sun, Mar 17, 2013 at 6:05 PM, Test Screen Name

                                      • 17. Re: addToolButton - oIcon - Hexadecimal Value
                                        Thom Parker Level 3

                                        You add tool buttons to Acrobat/Reader XI in exactly the same way you do in previous versions. It's just that they appear on the "Tools > Add-ins" panel. You can see a video here that explains it.

                                         

                                        http://www.pdfscripting.com/public/images/Free_Videos/AcroXJSUpdates.cfm

                                         

                                        The video is for Acrobat X, but everything it says is also valid for Acrobat XI.