16 Replies Latest reply on Jan 6, 2016 10:09 PM by Silly-V

    Embedded image data inside a JSON string.

    Silly-V Adobe Community Professional

      Hello everyone!

       

      I would like to put "stringified" image data into a JSON string so that I can use these in ScriptUI, and pull them from a JSON object.

       

      An example is this:

      "image":"\u0089PNG\r\n\x1A\n\x00\x00\x00\rIHDR\x00\x00\x00F\x00\x00\x00\x1E\b\x02\x00\x00\x00\x1E\ u0091\u00FFI\x00\x00\x00\x19tEXtSoftware\x00Adobe ImageReadyq\u00C9e<\x00\x00\x03\u0099IDATx\u00DA\u00EC\u0098\u00CDK\x14a\x1C\u00C7\u009DZ \u00EC\u00D0\u00AE\x07\x13\u00D4\u00C4\u00C2\u0097\u00D8,\u00D8\x12\u0094\u00A0\b\u00A2 \n\x02o\u00DD:t\u00EC\u00D6\u00BDK\u00E7\u00AE]\u00FA\x03\u00BAu\bO\u0082\u0081\u0087\u00 C4 \x14,\u0083PR\u00935S!]h\u00D7C\u00B3\u0097>\u00E3\u00D7~>\u00CC\u00AC\u00B3\u00B9\u00BB\ u00A2\u00C8>\f\x0F\u00CF<\u00FB{\x7F\u009F\u00F5\u00DE\u008F\u00CE4\x1C\u00AFu\u00A2\u00E1 \u00D8\u00AD\u00BAJu\u0095\u008E\u008AJk\u00EB?\u00E7\x17\u00E6\u008E\u009B\u0097\n[\u00F9 Z1\u00C0@\u009Ff\u00A6\u00D8c`\x00\u00D8/\u00D9\x18\u0094DT\u0082o\x0B\u00B3\u0086\u00B6\u 00BA\u00B6\u00D2\u00DE\u00D6\u00A1\u00D7\u00E4\u00E9T[\u00EB\u00D9\u00F9\u00C5\x1D\x07^\u0 0CD\f\u0084\u00A8\u00F7v\u00A7\u0093\u00C9\u0094\u00CE\u00F8Yv\u0081Z\x7Ff\u0090\u00BDP\u0 0C8\u009B\u00A5\f\u00D7\u00E5\b\u00FD\u00DE\u009E\u00B4K\u00D0n\u00C0\x15_ndq\u00A1\u00B8\ x1Cm\u009D|\u00FC\u00E8\u0089\u00FB\x0E\u00C4\u00F9\u00CE\u00AE\\n\x03\u00E9y.\u00F4\\\x1C \u00FF0v\u00E7\u00D6=\u00CE~\u00D1\u00FF85q\u00F3\u00FAm\u00CE\u0090\u00CE./57\u00B7Hm]~\u 009D\u00FD\u00C2.:\u00D9\x1FK\u00C8\u00CD\u00EB\u0099\u00E6\x16\u00DF\u00F7\u00A13=3\x19\u 00C25\u008E\u00C5\u00A2\x0F\u00B0n \b\u00C0\u00A5\u00BE\u008C8\"=\x00P\x165n6s\x1B\u009C\u0085\u00D2\u00D8x\u00AA\u0092\u00F 2\u00804:@q\u00D7c\u00C9\u0094L\x0E{\u00D9\u00C9u/+_\u00F8m\u0096f\u00C7.\u00E8\x13\u00C2- \u00B9 \"\u00CF\u0088\u00A3\"\u00D6\u00A8\u00C9\"\u00F1\x02'\u00AAL\x15\u00E4Km5aZ\u00B9T\u0097( @\u00A8\u00B0\u00A7\u0092M\n\u00B3\u00D5\u00F5\x15\u008BX\u00D3\u00B3D\x0E\x17\u00F2\u00FC \u00E4\u00E6\u0089\u00DC\u00AE`\x11\u0080\u0099f\x07>\x12x\u0089\u00EA\u00B3\u00DF\x12C^\" \u008B\u00D0\u0084\u00FCq\u0099q\u00E3\u00E6\u00CF^\u00C9\u008D\u00DA\x04B\bR\u00BE2M\\\u0 087\x03\u00EF\x02\u00C7\x05\x1E\u00E9af0\u00A7\u00EFu6\u00DD\x14$\x04\x15?\u00C1\x18i\u00E C!\u008FM\u008Dh\u0087\u00B0\x00\u0093\x03\u00ED\f\x11yi\u00FA\u00F3\u00A4\u00F1mo\u00ED\u 0088\u00B7\u00B2\x17\x1A[\u00AD\u00B6\u00B8\u009C\u00940%\u00CF\u00C4\u00BDdU\u0094\u0083\ u008B\u00F4!\u00E3\u0089\u00A6\u00EE\x05iUd\u00D7?\u00DB\x15RXf\x1D+hv\x13\u00AA\u0081%Iy\ x071\u0089\u008F\u008C\x0E\u00DF\u00BF;d\u00AF\x18;\x14\u0087\x07\u00BA\u00CA\u00AB$\x0B\u 0099y*h\u0085%\u00BB\u00C7\u00A1\u00CDxA\x7F,\x04\u00F1\u00F0\u00F2\u00D5\u008B}\u00D1\x05 \u00C5\u009E\u00FF\u00D7\u00E7\u00D9\u00F3\u00A7e\u00ED[\u0095\u0097\u00E4\x1Fl\x1C\u00EC= \u00E9P\u00F8\u00CAu\u00AA\x07\u00FC\x14\u00F5\u00A1\u00CA@\u0090c\u00FFT2\u0082\u0096\u00 8D\u00C18\u00B20\u00C7\u00AB\u00E5\u00AD\x11\u00D7Y\u009DW\u00DCU\u00E2\u00CA\u00C6K\u009C \u0097\u00A0H]\u0096\x1A\u00F0\u00A0\u00FD+}\u00DF\u00BC}\u00BD#\u00CD\u00E2\u00DC\u00C8\u 00BBa\u00E3\x1D\n<)/`%\u0098\u00BC\u00A7\u00B1\x18\u00C9T\x15\u00A5CP\x1E\u00B6[\u0099)\u0 0CF\x19\\\u00F4\x07\u0080\u00B3\u00AC\u0080<\u00D1zPf \n-\u009B;\u0090\u00FE\u00DA\u00C0\r\u009B\u00984\u00FB\u00F0l\u00E6~]\u00EE\u00CB\u00F0\ n3\x0E\u00AE\u0087\u00CFuv\u0081\u00E8y\u009E\\\u00C1\u00AF\x1Ay\u0098\u00AA\u00FC\u00E2\x 1F\u00BA'\u00C4\u00E51$\u00E6\u00A6\u00FF\u00CA 7\u0092\u0098=\u00BB\u00FC}\u00E8\u00C1C(\u00F0\u00C0\x11\u00E5\u0099\u0092\x00\u0080l\u0 0ED\u00A7\u0087P\x0F\u0095\x04\b\x17\u00AD{\u00F4M\u0089\u00A8Q\u00CD&,\u00B3\u00B4.\u00B9 \u0089\u00C6\u0092\r_\u0087\u00F3\t\u00E8&\u008C\u00A2\x0E\u00DFR\u00C7\u00D9\u00E9\u0092\ u00A1\u009C\u008EJ\u00BF\u00AFZZ\u00B2YW\u00AB\x12\"\u0096\rhe3\u008B\u00E1\u0085\u00B3;\x 1F(\u00CB\u00CBr\u00B1\t&\u00CA1\u00FEs.\x11o\f2\u0084\u00E9&\b\u008C\u00EE\u00B4\u008D\u0 0A1\u0096\u00E5\u00FC\u00BAW\u00CBr\u0085VQq?\x04\u0083I\u00C2!n\x15\u00C2\u00BD!\u00F0\u0 0A2\x1FN\u00F6\u00F5QU\u00AB=\u00AC\u00A5\u00E8\u00AD\x001qd\u00F5\x19\u009F\x18\u00ABl\u0 0F2\u00F0\u00EA\u00FF\u00B6\u00D6U\u00AA\u00ABT\u0093\u00F5W\u0080\x01\x00H@\u00A4W\u009F\ u008F\u00E9\u009D\x00\x00\x00\x00IEND\u00AEB`\u0082"

       

       

      As you can see, this site did not like all of the stuff that's highlighted in red

      https://jsonformatter.curiousconcept.com/

       

      The JSON parse did not work in parsing this data, and of course this image did not show up in my ScriptUI dialog.

      Any suggestions on how to format this to comply with JSON syntax, if possible?

        • 1. Re: Embedded image data inside a JSON string.
          mickyhulse Level 1

          hi,

           

          format does look odd.

           

          Have you tried using a tool like (found randomly via Google search):

           

          Base64 Image Encoder

          • 2. Re: Embedded image data inside a JSON string.
            Silly-V Adobe Community Professional

            I don't think that kind can be displayed by ScriptUI:

             

            function test(){
              var w = new Window('dialog');
              var p = w.add("panel");
              var imgStr = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAAAeCAIAAAAekf9JAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA5lJREFUeNrsmM1LFGEcx51a7NCuBxPUxMKX2CzYEpSgCKIgCgJv3Tp07Na9S+euXfoDunUIT4KBh8QgFCyDUFKTNVMhXWjXQ7OXPuPXfj7MrLO5u6LIPgwPzzz7e3+f9d6PzjQcr3Wi4ditukp1lY6KSmvrP+cX5o6blwpb+VoxwECfZqbYY2AA2C/ZGJREVIJvC7OGtrq20t7Wodfk6VRb69n5xR0HXs0MhKj3dqeTyZTO+Fl2gVp/ZpC9UMibpQzX5Qj93p60S9BuwBVfbmRxobgcbZ18/OiJ+w7E+c6uXG4D6Xku9Fwc/zB259Y9zn7R/zg1cfP6bc6Qzi4vNTe3SG1dfp39wi462R9LyM3rmeYW3/ehMz0zGcI1jsWiD7BuIAjApb6MOCI9AFAWNW42cxuchdLYeKqS8oA0OkBx12PJlEwOe9nJdS8rX/htlmbHLugTwi25ICLPiKMi1qjJIvECJ6pMFeRLbTVhWrlUlyhAqLCnkk0Ks9X1FYtY07NEDhfy/OTmidyuYBGAmWYHPhJ4ieqz3xJDXiKL0IT8cZlx4+bPXsmN2gRCCFK+Mk1chwPvAscFHulhZjCn73U23RQkBBU/wRhp7CGPTY1oh7AAkwPtDBF5afrzpPFtb+2It7IXGluttriclDAlz8S9ZFWUg4v0IeOJpu4FaVVk1z/bFVJYZh0raHYTqoElSXkHMYmPjA7fvztkrxg7FIcHusqrJAuZeSpohSW7x6HNeEF/LATx8PLVi33RBcWe/9fn2fOnZe1blZfkH2wc7D3pUPjKdaoH/BT1ocpAkGP/VDKClo3BOLIwx6vlrRHXWZ1X3FXiysZLnJegSF2WGvCg/St937x9vSPN4tzIu2HjHQo8KS9gJZi8p7EYyVQVpUNQHrZbmSnPGVz0B4CzrIA80XpQZiAKLZs7kP7awA2bmDT78Gzmfl3uy/AKMw6uh891doHoeZ5cwa8aeZiq/OIfuifE5TEk5qb/yiA3kpg9u/x96MFDKPDAEeWZkgCAbO2nh1APlQQIF6179E2JqFHNJiyztC65icaSDV+H8wnoJoyiDt9Sx9npkqGcjkq/r1pasllXqxIilg1oZTOL4YWzOx8oy8tysQkmyjH+cy4RbwwyhOkmCIzutI2hluX8ulfLcoVWUXE/BINJwiFuFcK9IfCiH0729VFVqz2speitADFxZPUZnxirbPLw6v+21lWqq1ST9VeAAQBIQKRXn4/pnQAAAABJRU5ErkJggg==";
              var img = p.add("image", undefined, ScriptUI.newImage(imgStr));
              w.show();
            };
            test();
            
            • 3. Re: Embedded image data inside a JSON string.
              Silly-V Adobe Community Professional

              But this will work:

              function test(){
                var w = new Window('dialog');
                var p = w.add("panel");
                var imgStr = "\u0089PNG\r\n\x1A\n\x00\x00\x00\rIHDR\x00\x00\x00F\x00\x00\x00\x1E\b\x02\x00\x00\x00\x1E\u0091\u00FFI\x00\x00\x00\x19tEXtSoftware\x00Adobe ImageReadyq\u00C9e<\x00\x00\x03\u0099IDATx\u00DA\u00EC\u0098\u00CDK\x14a\x1C\u00C7\u009DZ\u00EC\u00D0\u00AE\x07\x13\u00D4\u00C4\u00C2\u0097\u00D8,\u00D8\x12\u0094\u00A0\b\u00A2 \n\x02o\u00DD:t\u00EC\u00D6\u00BDK\u00E7\u00AE]\u00FA\x03\u00BAu\bO\u0082\u0081\u0087\u00C4 \x14,\u0083PR\u00935S!]h\u00D7C\u00B3\u0097>\u00E3\u00D7~>\u00CC\u00AC\u00B3\u00B9\u00BB\u00A2\u00C8>\f\x0F\u00CF<\u00FB{\x7F\u009F\u00F5\u00DE\u008F\u00CE4\x1C\u00AFu\u00A2\u00E1\u00D8\u00AD\u00BAJu\u0095\u008E\u008AJk\u00EB?\u00E7\x17\u00E6\u008E\u009B\u0097\n[\u00F9Z1\u00C0@\u009Ff\u00A6\u00D8c`\x00\u00D8/\u00D9\x18\u0094DT\u0082o\x0B\u00B3\u0086\u00B6\u00BA\u00B6\u00D2\u00DE\u00D6\u00A1\u00D7\u00E4\u00E9T[\u00EB\u00D9\u00F9\u00C5\x1D\x07^\u00CD\f\u0084\u00A8\u00F7v\u00A7\u0093\u00C9\u0094\u00CE\u00F8Yv\u0081Z\x7Ff\u0090\u00BDP\u00C8\u009B\u00A5\f\u00D7\u00E5\b\u00FD\u00DE\u009E\u00B4K\u00D0n\u00C0\x15_ndq\u00A1\u00B8\x1Cm\u009D|\u00FC\u00E8\u0089\u00FB\x0E\u00C4\u00F9\u00CE\u00AE\\n\x03\u00E9y.\u00F4\\\x1C\u00FF0v\u00E7\u00D6=\u00CE~\u00D1\u00FF85q\u00F3\u00FAm\u00CE\u0090\u00CE./57\u00B7Hm]~\u009D\u00FD\u00C2.:\u00D9\x1FK\u00C8\u00CD\u00EB\u0099\u00E6\x16\u00DF\u00F7\u00A13=3\x19\u00C25\u008E\u00C5\u00A2\x0F\u00B0n \b\u00C0\u00A5\u00BE\u008C8\"=\x00P\x165n6s\x1B\u009C\u0085\u00D2\u00D8x\u00AA\u0092\u00F2\u00804:@q\u00D7c\u00C9\u0094L\x0E{\u00D9\u00C9u/+_\u00F8m\u0096f\u00C7.\u00E8\x13\u00C2-\u00B9 \"\u00CF\u0088\u00A3\"\u00D6\u00A8\u00C9\"\u00F1\x02'\u00AAL\x15\u00E4Km5aZ\u00B9T\u0097(@\u00A8\u00B0\u00A7\u0092M\n\u00B3\u00D5\u00F5\x15\u008BX\u00D3\u00B3D\x0E\x17\u00F2\u00FC\u00E4\u00E6\u0089\u00DC\u00AE`\x11\u0080\u0099f\x07>\x12x\u0089\u00EA\u00B3\u00DF\x12C^\"\u008B\u00D0\u0084\u00FCq\u0099q\u00E3\u00E6\u00CF^\u00C9\u008D\u00DA\x04B\bR\u00BE2M\\\u0087\x03\u00EF\x02\u00C7\x05\x1E\u00E9af0\u00A7\u00EFu6\u00DD\x14$\x04\x15?\u00C1\x18i\u00EC!\u008FM\u008Dh\u0087\u00B0\x00\u0093\x03\u00ED\f\x11yi\u00FA\u00F3\u00A4\u00F1mo\u00ED\u0088\u00B7\u00B2\x17\x1A[\u00AD\u00B6\u00B8\u009C\u00940%\u00CF\u00C4\u00BDdU\u0094\u0083\u008B\u00F4!\u00E3\u0089\u00A6\u00EE\x05iUd\u00D7?\u00DB\x15RXf\x1D+hv\x13\u00AA\u0081%Iy\x071\u0089\u008F\u008C\x0E\u00DF\u00BF;d\u00AF\x18;\x14\u0087\x07\u00BA\u00CA\u00AB$\x0B\u0099y*h\u0085%\u00BB\u00C7\u00A1\u00CDxA\x7F,\x04\u00F1\u00F0\u00F2\u00D5\u008B}\u00D1\x05\u00C5\u009E\u00FF\u00D7\u00E7\u00D9\u00F3\u00A7e\u00ED[\u0095\u0097\u00E4\x1Fl\x1C\u00EC=\u00E9P\u00F8\u00CAu\u00AA\x07\u00FC\x14\u00F5\u00A1\u00CA@\u0090c\u00FFT2\u0082\u0096\u008D\u00C18\u00B20\u00C7\u00AB\u00E5\u00AD\x11\u00D7Y\u009DW\u00DCU\u00E2\u00CA\u00C6K\u009C\u0097\u00A0H]\u0096\x1A\u00F0\u00A0\u00FD+}\u00DF\u00BC}\u00BD#\u00CD\u00E2\u00DC\u00C8\u00BBa\u00E3\x1D\n<)/`%\u0098\u00BC\u00A7\u00B1\x18\u00C9T\x15\u00A5CP\x1E\u00B6[\u0099)\u00CF\x19\\\u00F4\x07\u0080\u00B3\u00AC\u0080<\u00D1zPf \n-\u009B;\u0090\u00FE\u00DA\u00C0\r\u009B\u00984\u00FB\u00F0l\u00E6~]\u00EE\u00CB\u00F0\n3\x0E\u00AE\u0087\u00CFuv\u0081\u00E8y\u009E\\\u00C1\u00AF\x1Ay\u0098\u00AA\u00FC\u00E2\x1F\u00BA'\u00C4\u00E51$\u00E6\u00A6\u00FF\u00CA 7\u0092\u0098=\u00BB\u00FC}\u00E8\u00C1C(\u00F0\u00C0\x11\u00E5\u0099\u0092\x00\u0080l\u00ED\u00A7\u0087P\x0F\u0095\x04\b\x17\u00AD{\u00F4M\u0089\u00A8Q\u00CD&,\u00B3\u00B4.\u00B9\u0089\u00C6\u0092\r_\u0087\u00F3\t\u00E8&\u008C\u00A2\x0E\u00DFR\u00C7\u00D9\u00E9\u0092\u00A1\u009C\u008EJ\u00BF\u00AFZZ\u00B2YW\u00AB\x12\"\u0096\rhe3\u008B\u00E1\u0085\u00B3;\x1F(\u00CB\u00CBr\u00B1\t&\u00CA1\u00FEs.\x11o\f2\u0084\u00E9&\b\u008C\u00EE\u00B4\u008D\u00A1\u0096\u00E5\u00FC\u00BAW\u00CBr\u0085VQq?\x04\u0083I\u00C2!n\x15\u00C2\u00BD!\u00F0\u00A2\x1FN\u00F6\u00F5QU\u00AB=\u00AC\u00A5\u00E8\u00AD\x001qd\u00F5\x19\u009F\x18\u00ABl\u00F2\u00F0\u00EA\u00FF\u00B6\u00D6U\u00AA\u00ABT\u0093\u00F5W\u0080\x01\x00H@\u00A4W\u009F\u008F\u00E9\u009D\x00\x00\x00\x00IEND\u00AEB`\u0082";
                var img = p.add("image", undefined, ScriptUI.newImage(imgStr));
                w.show();
              };
              test();
              
              • 4. Re: Embedded image data inside a JSON string.
                mickyhulse Level 1

                Interesting. ESTK crashes when it doesn't like the image string.

                 

                So, I took your javascript unicode-escaped image string and ran it through:

                 

                Escape for JSON and Javascript online tool

                 

                Then validated the below test JSON here:

                 

                JSONLint PRO - The JSON Validator

                 

                [     {         "image": "\\u0089PNG\\r\\n\\x1A\\n\\x00\\x00\\x00\\rIHDR\\x00\\x00\\x00F\\x00\\x00\\x00\\x1E\\b\\x 02\\x00\\x00\\x00\\x1E\\u0091\\u00FFI\\x00\\x00\\x00\\x19tEXtSoftware\\x00Adobe ImageReadyq\\u00C9e<\\x00\\x00\\x03\\u0099IDATx\\u00DA\\u00EC\\u0098\\u00CDK\\x14a\\x1C\\ u00C7\\u009DZ\\u00EC\\u00D0\\u00AE\\x07\\x13\\u00D4\\u00C4\\u00C2\\u0097\\u00D8,\\u00D8\\x 12\\u0094\\u00A0\\b\\u00A2 \\n\\x02o\\u00DD:t\\u00EC\\u00D6\\u00BDK\\u00E7\\u00AE]\\u00FA\\x03\\u00BAu\\bO\\u0082\\u 0081\\u0087\\u00C4 \\x14,\\u0083PR\\u00935S!]h\\u00D7C\\u00B3\\u0097>\\u00E3\\u00D7~>\\u00CC\\u00AC\\u00B3\\ u00B9\\u00BB\\u00A2\\u00C8>\\f\\x0F\\u00CF<\\u00FB{\\x7F\\u009F\\u00F5\\u00DE\\u008F\\u00C E4\\x1C\\u00AFu\\u00A2\\u00E1\\u00D8\\u00AD\\u00BAJu\\u0095\\u008E\\u008AJk\\u00EB?\\u00E7 \\x17\\u00E6\\u008E\\u009B\\u0097\\n[\\u00F9Z1\\u00C0@\\u009Ff\\u00A6\\u00D8c`\\x00\\u00D8 /\\u00D9\\x18\\u0094DT\\u0082o\\x0B\\u00B3\\u0086\\u00B6\\u00BA\\u00B6\\u00D2\\u00DE\\u00D 6\\u00A1\\u00D7\\u00E4\\u00E9T[\\u00EB\\u00D9\\u00F9\\u00C5\\x1D\\x07^\\u00CD\\f\\u0084\\u 00A8\\u00F7v\\u00A7\\u0093\\u00C9\\u0094\\u00CE\\u00F8Yv\\u0081Z\\x7Ff\\u0090\\u00BDP\\u00 C8\\u009B\\u00A5\\f\\u00D7\\u00E5\\b\\u00FD\\u00DE\\u009E\\u00B4K\\u00D0n\\u00C0\\x15_ndq\ \u00A1\\u00B8\\x1Cm\\u009D|\\u00FC\\u00E8\\u0089\\u00FB\\x0E\\u00C4\\u00F9\\u00CE\\u00AE\\ \\n\\x03\\u00E9y.\\u00F4\\\\\\x1C\\u00FF0v\\u00E7\\u00D6=\\u00CE~\\u00D1\\u00FF85q\\u00F3\ \u00FAm\\u00CE\\u0090\\u00CE./57\\u00B7Hm]~\\u009D\\u00FD\\u00C2.:\\u00D9\\x1FK\\u00C8\\u0 0CD\\u00EB\\u0099\\u00E6\\x16\\u00DF\\u00F7\\u00A13=3\\x19\\u00C25\\u008E\\u00C5\\u00A2\\x 0F\\u00B0n \\b\\u00C0\\u00A5\\u00BE\\u008C8\\\"=\\x00P\\x165n6s\\x1B\\u009C\\u0085\\u00D2\\u00D8x\\u 00AA\\u0092\\u00F2\\u00804:@q\\u00D7c\\u00C9\\u0094L\\x0E{\\u00D9\\u00C9u/+_\\u00F8m\\u009 6f\\u00C7.\\u00E8\\x13\\u00C2-\\u00B9 \\\"\\u00CF\\u0088\\u00A3\\\"\\u00D6\\u00A8\\u00C9\\\"\\u00F1\\x02'\\u00AAL\\x15\\u00E4Km 5aZ\\u00B9T\\u0097(@\\u00A8\\u00B0\\u00A7\\u0092M\\n\\u00B3\\u00D5\\u00F5\\x15\\u008BX\\u0 0D3\\u00B3D\\x0E\\x17\\u00F2\\u00FC\\u00E4\\u00E6\\u0089\\u00DC\\u00AE`\\x11\\u0080\\u0099 f\\x07>\\x12x\\u0089\\u00EA\\u00B3\\u00DF\\x12C^\\\"\\u008B\\u00D0\\u0084\\u00FCq\\u0099q\ \u00E3\\u00E6\\u00CF^\\u00C9\\u008D\\u00DA\\x04B\\bR\\u00BE2M\\\\\\u0087\\x03\\u00EF\\x02\ \u00C7\\x05\\x1E\\u00E9af0\\u00A7\\u00EFu6\\u00DD\\x14$\\x04\\x15?\\u00C1\\x18i\\u00EC!\\u 008FM\\u008Dh\\u0087\\u00B0\\x00\\u0093\\x03\\u00ED\\f\\x11yi\\u00FA\\u00F3\\u00A4\\u00F1m o\\u00ED\\u0088\\u00B7\\u00B2\\x17\\x1A[\\u00AD\\u00B6\\u00B8\\u009C\\u00940%\\u00CF\\u00C 4\\u00BDdU\\u0094\\u0083\\u008B\\u00F4!\\u00E3\\u0089\\u00A6\\u00EE\\x05iUd\\u00D7?\\u00DB \\x15RXf\\x1D+hv\\x13\\u00AA\\u0081%Iy\\x071\\u0089\\u008F\\u008C\\x0E\\u00DF\\u00BF;d\\u0 0AF\\x18;\\x14\\u0087\\x07\\u00BA\\u00CA\\u00AB$\\x0B\\u0099y*h\\u0085%\\u00BB\\u00C7\\u00 A1\\u00CDxA\\x7F,\\x04\\u00F1\\u00F0\\u00F2\\u00D5\\u008B}\\u00D1\\x05\\u00C5\\u009E\\u00F F\\u00D7\\u00E7\\u00D9\\u00F3\\u00A7e\\u00ED[\\u0095\\u0097\\u00E4\\x1Fl\\x1C\\u00EC=\\u00 E9P\\u00F8\\u00CAu\\u00AA\\x07\\u00FC\\x14\\u00F5\\u00A1\\u00CA@\\u0090c\\u00FFT2\\u0082\\ u0096\\u008D\\u00C18\\u00B20\\u00C7\\u00AB\\u00E5\\u00AD\\x11\\u00D7Y\\u009DW\\u00DCU\\u00 E2\\u00CA\\u00C6K\\u009C\\u0097\\u00A0H]\\u0096\\x1A\\u00F0\\u00A0\\u00FD+}\\u00DF\\u00BC} \\u00BD#\\u00CD\\u00E2\\u00DC\\u00C8\\u00BBa\\u00E3\\x1D\\n<)/`%\\u0098\\u00BC\\u00A7\\u00 B1\\x18\\u00C9T\\x15\\u00A5CP\\x1E\\u00B6[\\u0099)\\u00CF\\x19\\\\\\u00F4\\x07\\u0080\\u00 B3\\u00AC\\u0080<\\u00D1zPf \\n-\\u009B;\\u0090\\u00FE\\u00DA\\u00C0\\r\\u009B\\u00984\\u00FB\\u00F0l\\u00E6~]\\u00EE \\u00CB\\u00F0\\n3\\x0E\\u00AE\\u0087\\u00CFuv\\u0081\\u00E8y\\u009E\\\\\\u00C1\\u00AF\\x1 Ay\\u0098\\u00AA\\u00FC\\u00E2\\x1F\\u00BA'\\u00C4\\u00E51$\\u00E6\\u00A6\\u00FF\\u00CA 7\\u0092\\u0098=\\u00BB\\u00FC}\\u00E8\\u00C1C(\\u00F0\\u00C0\\x11\\u00E5\\u0099\\u0092\\ x00\\u0080l\\u00ED\\u00A7\\u0087P\\x0F\\u0095\\x04\\b\\x17\\u00AD{\\u00F4M\\u0089\\u00A8Q\ \u00CD&,\\u00B3\\u00B4.\\u00B9\\u0089\\u00C6\\u0092\\r_\\u0087\\u00F3\\t\\u00E8&\\u008C\\u 00A2\\x0E\\u00DFR\\u00C7\\u00D9\\u00E9\\u0092\\u00A1\\u009C\\u008EJ\\u00BF\\u00AFZZ\\u00B2 YW\\u00AB\\x12\\\"\\u0096\\rhe3\\u008B\\u00E1\\u0085\\u00B3;\\x1F(\\u00CB\\u00CBr\\u00B1\\ t&\\u00CA1\\u00FEs.\\x11o\\f2\\u0084\\u00E9&\\b\\u008C\\u00EE\\u00B4\\u008D\\u00A1\\u0096\ \u00E5\\u00FC\\u00BAW\\u00CBr\\u0085VQq?\\x04\\u0083I\\u00C2!n\\x15\\u00C2\\u00BD!\\u00F0\ \u00A2\\x1FN\\u00F6\\u00F5QU\\u00AB=\\u00AC\\u00A5\\u00E8\\u00AD\\x001qd\\u00F5\\x19\\u009 F\\x18\\u00ABl\\u00F2\\u00F0\\u00EA\\u00FF\\u00B6\\u00D6U\\u00AA\\u00ABT\\u0093\\u00F5W\\u 0080\\x01\\x00H@\\u00A4W\\u009F\\u008F\\u00E9\\u009D\\x00\\x00\\x00\\x00IEND\\u00AEB`\\u00 82"     } ]

                 

                Validates as JSON. You'd just need to unescape before calling it in a dialog window.

                 

                Not sure if that's headed in the right direction, but that's probably the route I would head.

                • 5. Re: Embedded image data inside a JSON string.
                  Silly-V Adobe Community Professional

                  Thanks Micky, it looked like the escaping via the means you listed had somehow changed some of the actual characters, so it did not end up working out in the actual code. However, I also noticed that the site I listed myself was less than optimal for figuring out my issue: had I used this one instead (http://codebeautify.org/jsonvalidate), I would have quickly noticed the issue of blackslashes because it uses better syntax highlighting!

                  Now I decided to use encodeURI() to turn this image data string into a valid JSON string. This seems to work when turning such a string directly into a ScriptUI.newImage(), but now I have to figure a couple other things out to make sure that it's gotten via JSON parse inside of my script I'm working on.

                  • 6. Re: Embedded image data inside a JSON string.
                    Silly-V Adobe Community Professional

                    Okay, looks like it is working. I'll explain real quick the simple reason why I wanted to get this working: my script panel uses embedded metadata inside comments of individual scripts for instructions on how to display these scripts as buttons inside the panel, and I wanted to add onto the existing function of referencing an image file with ability to use embedded image data so there wouldn't even need to be any external image files. After successfully embedding the image data as JSON, I've still come to the non-great reality that my imagined function for this wasn't so easily implemented - doing File() on a string which is a long glob of weird characters which is the image data string (with or without having it gone through encodeURI()), crashes the application. My ideal function would have made File objects out of whatever was in the "image" property of the metadata comment and first looked for the image file before continuing to try & make a ScriptUI.newImage from this property, except since it crashes, it's not possible. Therefore I am gonna make it my own wacky convention to use "_embedded" if I want to put in an image that's meant to be interpreted as such. Now my function will look for the "image" property and try to act on a File, and then look for the "image_embedded" property and will use decodeURI() on whatever is written there to make an image out of.

                     

                        var btn;
                        var scriptImage = "";
                        var imageProp = VIEWMODES.imageDisplayModes.buttons.kind;
                        if(thisScript.hasOwnProperty(imageProp) && thisScript[imageProp] != ""){
                          try {
                            if(File(thisScript[imageProp]).exists){
                              scriptImage = File(thisScript[imageProp]);
                            } else if(File(File(thisScript.path).parent + "/" + thisScript[imageProp]).exists){
                              scriptImage = File(File(thisScript.path).parent + "/" + thisScript[imageProp]);
                            }
                          } catch (e) {
                            scriptImage = "";
                          }
                        } else if(thisScript.hasOwnProperty(imageProp + "_embedded") && thisScript[imageProp + "_embedded"] != ""){
                          try {
                            ScriptUI.newImage(decodeURI(thisScript[imageProp + "_embedded"]));
                            scriptImage = decodeURI(thisScript[imageProp + "_embedded"]);
                          } catch(e) {
                            scriptImage = "";
                          }
                        }
                    
                    
                        if(scriptImage != ""){
                          btn = g.add("iconbutton", undefined, ScriptUI.newImage(scriptImage));
                          btn.size = [BUTTONIMAGESIZES[imageProp].width, BUTTONIMAGESIZES[imageProp].height];
                        } else {
                          btn = g.add("button", undefined, buttonText);
                          btn.size = [BUTTONSIZES.width, BUTTONSIZES.height];
                        }
                    
                    • 7. Re: Embedded image data inside a JSON string.
                      mickyhulse Level 1

                      Wow, that's interesting!!!! Thanks for sharing Silly-V. I've learned so much from your informative posts.

                       

                      Glad you got it figured out.

                       

                      So, let's put on our Illy-scripting wish-list:

                       

                      1. Embedded image support
                      2. Animated gif support (totally off topic, but I ran into this recently and now seemed like a good time to mention it)
                      • 8. Re: Embedded image data inside a JSON string.
                        W_J_T Level 4

                        mickyhulse wrote:

                         

                        So, let's put on our Illy-scripting wish-list:

                         

                        1. Embedded image support
                        2. Animated gif support (totally off topic, but I ran into this recently and now seemed like a good time to mention it)

                         

                        You can try posting those over here:

                        Illustrator scripting bug / wish list.

                        • 9. Re: Embedded image data inside a JSON string.
                          mickyhulse Level 1

                          Good call! And ... done.

                           

                          Thanks W_J_T!

                          • 10. Re: Embedded image data inside a JSON string.
                            pixxxel schubser Level 5

                            Hi Silly-V,

                            only for interest, what is the reason for embedding the PNG in the code itself? (I think in this case you doesn't need an additional file, is this right?)

                             

                            And one question: how do you get the image data string (\u0089PNG\r\n\x1A\n\x00\x00\x00\rIHDR\x00 …) from your PNG file?

                            Kindly regards

                            pixxxel schubser

                            • 11. Re: Embedded image data inside a JSON string.
                              Silly-V Adobe Community Professional

                              Yes, the purpose for embedding the image is so that no external file would be needed.

                              In my case here I not only embed the image, but also place it into a JSON string inside a comment for the purpose of being parsed by another script which is a script panel.

                               

                              I use this function which there are some threads about - where, I forget - so let me just paste it here:

                               

                              function test(){

                                  var chosenFile = File.openDialog("Choose file");

                                  if(chosenFile != null){

                                      var infile = File(chosenFile.fsName.replace('file://', ''));

                                      var outfile = File (chosenFile.path+"/"+chosenFile.name+".txt");

                                      infile.open ("r");

                                      infile.encoding = "binary";

                                      var temp = infile.read();

                                      infile.close();

                                      outfile.open ("w");

                                      outfile.write (temp.toSource ());

                                      outfile.close ();

                                  }

                              }

                              test();

                               

                              Since I'm using this more, and now need to put it into encodeURI() format, I'm going to improve it by making it into a ScriptUI dialog to show the text.

                              • 12. Re: Embedded image data inside a JSON string.
                                pixxxel schubser Level 5

                                Thanx.

                                I just found this similar example in the last minutes:

                                Re: How can I let the png images pack into .jsx files?

                                 

                                I'll give you a response later.

                                regards

                                • 13. Re: Embedded image data inside a JSON string.
                                  pixxxel schubser Level 5

                                  I tried your method and it works with png as well. But not with PNG saved with PS normally and not with PNG saved for web and legacy. Only with PNG save with Quick export. The code of the other kinds of PNG is very very longer and with to much additional informations.

                                   

                                  Again, Thank you for sharing.

                                   

                                  • 14. Re: Embedded image data inside a JSON string.
                                    pixxxel schubser Level 5

                                    OK.

                                     

                                    But what is this:

                                    AdobeForum_wirdModeriert.png

                                     

                                    I get this message in all of my posts.

                                    • 15. Re: Embedded image data inside a JSON string.
                                      Silly-V Adobe Community Professional

                                      They apparently screen all posts for spam and most messages now get randomly selected for manual checking by humans, according to the great CarlosCanto

                                       

                                      Yes, I noticed that not all png formats work and I only stick to Save-for-Web PNG from Illustrator. 

                                      • 16. Re: Embedded image data inside a JSON string.
                                        Silly-V Adobe Community Professional

                                        Okay, here's my improved function for this:

                                         

                                        function test(){
                                          var chosenFile = File.openDialog("Choose file");
                                          if(chosenFile == null){
                                            return;
                                          }
                                          var infile = File(chosenFile.fsName.replace('file://', ''));
                                          infile.open ("r");
                                          infile.encoding = "binary";
                                          var temp = infile.read();
                                          infile.close();
                                        
                                        
                                          var encodedImageData = temp.toSource().replace('(new String("', "").replace('"))', "");
                                          var encodedImageDataURI = encodeURI(temp);
                                        
                                        
                                          var w = new Window("dialog", "Image Data");
                                          w.margins = [4,4,4,4];
                                          w.spacing = 4;
                                          var g0 = w.add("tabbedpanel");
                                          g0.spacing = 2;
                                        
                                        
                                          var t1 = g0.add("tab", undefined, "Encoded");
                                          var disp_imageData = t1.add("edittext", undefined, encodedImageData, {multiline : true});
                                          disp_imageData.size = [400, 400];
                                        
                                        
                                          var t2 = g0.add("tab", undefined, "URI Encoded");
                                          var disp_imageDataURI = t2.add("edittext", undefined, encodedImageDataURI, {multiline : true});
                                          disp_imageDataURI.size = [400, 400];
                                        
                                        
                                          var t3 = g0.add("tab", undefined, "How well the image shows up");
                                          try {
                                            var uiImg = ScriptUI.newImage(decodeURI(encodedImageDataURI));
                                            t3.add("image", undefined, uiImg);
                                          } catch(e){
                                            t3.add("statictext", undefined, "Sorry, this image data could not be made into ScriptUI newImage() for some reason.", {multiline : true});
                                          }
                                        
                                        
                                          var g_btn = w.add("group");
                                          var btn_ok = g_btn.add("button", undefined, "Oookay");
                                          w.defaultElement = btn_ok;
                                          btn_ok.size = [400, 26];
                                        
                                        
                                          w.show();
                                        }
                                        test();
                                        
                                        
                                        
                                        

                                         

                                        Note that if the image data is not to it's liking, this script will likely just crash Illustrator, so take care. I only stick to PNG24 exported from AI save for web.

                                        Just did a test with some more formats from AI's Save for Web, JPG seems to work, but not GIF.

                                        Did one test with AI's export raster format BMP (OS2 24bit) and also crash on this.

                                        So it looks like just Save for Web JPG and PNG24