1 Reply Latest reply: Apr 19, 2014 6:46 AM by DBarranca RSS

    Making the switch from Configurator...

    Jephix Community Member

      This is like a progress-update / introduction to let you know there are users out there who are dealing with the necessity of switching from Configurator to Extension Builder 3.    I tried and even paid for a year's subscription of Extension Builder 2 with Flash Builder 4.6, but I could only build the samples and try to replace with some basic script and I don't think they were HTML5 from that...     I'm not really a coder/programmer.   

       

        So last year I jumped into Configurator 3 and it was awesome, I was able to port my plugin that I created in VBA for CorelDraw over to Photoshop working in CS6 and CC, because originally I had always been recording my actions for my work through photoshop and planned on releasing action-sets.  (within my intended demographic or market for my automations it was mostly actions and a standalone program, nothing for CorelDraw).     So me and my partner who already had the Corel VBA framework in place and I jumped right into macro recording/debugging and building a GUI etc in VBA for Draw...   With Configurator then I was able to finish off and make the same actions I had most of them already in photoshop -- then easily export with xtools my actions to .jsx files, and I had already built most of the GUI for the Corel release which was Fall 2012,  and so by mid 2013 after only a couple weeks I was able to build out this massive panel almost like my plugin for Corel... within Photoshop as a single .zxp that installs to BOTH CS6 and CC.

       

      Smooth...  or so I thought.   Well one of the things that bothered me was I could not do quite as much stuff in the Configurator setup as with VBA (entry fields for values, then going into the code and getting the GUI values etc) -- but again I'm not much of a programmer.. most of my stuff is buttons that run types of processes to the art to prepare for printing.   My specialty is within graphic design and production pre-press etc, color science / theory, and only surface level on the programming/math for now but I love it because I'm a perfectionist and technical person, but the frustrations are endless when you don't know how to do something with a coding language etc.. and I have no clue about javascript in the first place let alone HTML5...  I record actions and build them debugged in a way by testing, then export the actions as .jsx files.

       

        Now in configurator I was able to do some really cool stuff like using the pull-down menu panels/containers within containers to create a fake but usable sort of GUI script-variable selection...  before I was doing this I would just have multiple rows of buttons to select the one with the variable you need... but thats confusing.    Obviously the right way is using an entry field in the GUI and having the entry field update your script.    I'm not at that level yet.     I am at the level where I can take the .jsx files or actions as xml files... use type find/replace to change all my variables and save as separate files... using the same button it works fine in Configurator positioned within mutiple-page containers... you get the same effect when you choose the page in the pull-down - the label set to the variable.     

       

         I released my photoshop extension last year in the summer but due to certain demographic and other market-variables I decided to take it down after only a handful of users purchased it, to work on building additional features requested and an entire training series to go along with it.   Again, being a perfectionist I felt my extension needed to have this whole other tab of processes for the user demographic to make it easier to use as well as to work for those with lower initial understanding of the plugin or processes involved - more like some 1-click type of really long processes to carry other things all the way through finishing off what normally can be done manually from the other tabs.   

       

       

         Well one of the issues in some testing... and through help in the configurator boards... it was determined that all "script-file" buttons calling out a .jsx file have a 5-minute TIME-OUT.    If its a long process and on the user's system it is taking past 5 minutes... it stops there wherever it was in the script... doesn't finish.

       

      Ok, well we found a work-around... you use the "script" buttons to call out the .jsx files from the extension assets directory.    I haven't figured out how to make it smart like it is, so I will have to make 2 versions of the .ZXP now for CS6 and CC -- and also another 2 for Mac.    Before I had 1 .zxp file working for Mac/PC and CS6 / CC.   From Configurator 3.  

      Of course I went through and building out the fixes almost done, replacing all my gui buttons with script buttons and then replacing the gui images, using the script and calling out the various .jsx files from the buttons.      Great... thought I was almost done building the new upgrade and re-launch version of my extension... then I started reading about all this  new Flash-panel being killed and Configurator Dead and HTML5 panels with Extension Builder 3...   supposedly the new photoshop will NOT OVERWRITE the current Photoshop 14.2,  so that anyone who uses my extensions for CC 14.2 will keep working... the new photoshop CC (15?) will be an additional installation?      I hope so.   Because I am trying to learn right now... I have installed the Java sdk, the Eclipse program and Extension Builder 3 is in a folder I have to figure out where to put that to get it opened up so I can start watching the videos and building the demos etc.

       

      The huge amount of work I know is going to be a few things like...  getting all my custom gui images connected to the buttons, multiple tabs, figuring out how to call the multple .jsx files and have them install with the panel or whatever etc...  porting it all over is only about those things basically.. but I know nothing of HTML5 or javascript etc like I mentioned just surface-level stuff.    Now I built a massive extension but that makes it a pain now to have to switch it all over and learn all this other stuff.

       

      I do understand however that by learning this I will enable myself to jump into web, etc... and especially for deeper level coding of PS and also making Illy extensions, Indesign etc.. and of course the further ability with Eclipse and javascript/html5 I assume for me to get really wild with the GUI and variables/sliders etc etc.      But I don't want to get forced into this I need time for the learning curve.    I want to continue and release my new upgrade for my photoshop extension, perhaps just for CC 14.2 for now as I continue to get the code worked in for the other .zxp installers (now need multiple to call out the .jsx folder locations for mac/pc cs6/cc) - but that is fine.       

       

      Now... it is not currently "live" available online to purchase, but if you want to see what version 1.0 of my extension was like last summer in the first release... here is a youtube link to the video of my partner doing an introduction.    You can see that it is a complex panel with a custom GUI of images... just simple rollovers and backing panels,  and the buttons like I mentioned call out .jsx files I created from my actions to .jsx conversions and then manipulations through some surface-level code replacing.  

       

      If there is any question to this discussion and I want people to realize this is what others are going through....  got me all creating awesome panels easily with configurator I picked it up built my panel in a few months,  its such a smooth workflow for someone familiar with recording their actions... to make images and import them on your buttons connected to your .jsx conversions... but then Adobe pulled the rug out from under me with this end-of-flash-based-panel-support stuff.    

       

      What happens if I try to release continued CS6 or CC 14.2 panel upgrade for my extension to re-launch it so I can have it go live again,  and then when Adobe releases the new PS CC update -- people who are NEW SUBSCRIBERS -- they won't have the OLD PS 14.2.     So they won't be able to install my extensions from configurator if they don't have the previous photoshop correct?

       

      So the main question is... how much work do I have to go through just to PORT my CONFIGURATOR extension -- which uses GUI buttons to call .JSX files... over to HTML5 and/or Extension Builder 3??    I don't expect anyone to do anything for me... I will follow all the links and help offered in the other discussions and tutorial videos, learning whatever I need... like I said so far I have eclipse installed and working because I had to install the Java SDK... Extension Builder zip is unzipped but I think  need to just put the folder somewhere.  Then I can start a project following the video tutorials and try to modify / build.. like I said I only know how to surface-level program so I would at first just want to copy the way I have my panel in configurator -- custom gui buttons that call out the .jsx files for now.     I guess it seems like its better some things I have been reading that you can contain all the .jsx files automatically and such or it is more protected this way I don't know.    This is not a "please help" type of question but a "I'm in this boat with you now" sort of to the others out there similar to me.   I'm sure there are lots of people who found it easy to do the "hack-job" type of building of panels with configurator, and then its like oh this is completely useless what you spent the whole last year of your life learning and building.  

       

      Thanks for any time and/or help offered... or discussions furthered through sharing this, etc.

       

      -Jeff  aka Full-Spectrum Separator / co-author of SimpleSeps Raster for CorelDraw and author of SimpleSeps Raster for Adobe Photoshop

       

      https://www.youtube.com/watch?v=J35d1GMQpuc

       

      http://adobe.ly/1j3U27z

       

      http://adobe.ly/1nrrQjg

       

       

      Thank you to the creators of Photoshop and Configurator for enabling me to get this far, and also thank you now to Hallgrímur Th. Björnsson  for helping me to get into HTML5 now trying to make the switch, I know i will learn more and be better off for it because it will get me into learning javascript and html5 and even web stuff (canvas webgl yeah!)   I will post as I make progress and try to help others with what I learn as an extension developer. 

        • 1. Re: Making the switch from Configurator...
          DBarranca Community Member

          Hi Jeff,

          long writing but I've got the "we share the same boat" side of it :-)

          I might be wrong but optimistically the migration path from Configurator to HTML Panels (whether using Extension Builder 3 or something else) shouldn't be very hard. Well of course it depends, but not impossible.

           

          I cannot say, actually, since I did use Extension Builder 2 and not Configurator (a really talented friend of mine used it for this Channels Power Tool utility). But personally I had to learn ActionScript from scratch just for the fun of building Flex Panels back in CS4 (I'm not a programmer), and I've ended up forgetting all about Flex in CS6 when the HTML thing went public. Bad times, back then, so I possibly understand your feelings now.

           

          But.

          As long as your GUI is about buttons (that is, clickable things with images on, rollovers, etc) triggering scripts, and you do not need the panel doing any heavy lifting in JS (implementing MVC patterns with AngularJS or something like that - looks like I'm smooth talking about these things but I've just started learning them ;-) it *might* be easier than you think.

           

          Basically an HTML Panel is "just" an HTML page supported by Javascript. Nice fact about HTML is that there's ton of information about it - i.e. what tags to use, how to style them, etc. It's "just" a matter of finding and learning the bits you need to know.

          (already two "just"...)

          Now, CSInterface (the JS glue between Panels and Photoshop) provides an evalScript() function, which is what its name suggests. You set up the panel so that when a user clicks button A, a JSX function A is evaluated (passing or not passing data down to the JSX) and if you want a callback executed. That's "just" it. (three "just"...)

           

          I did found in troubles myself so I put together a list of HTML Panels Quick Tips that you might find helpful, covering basic topics such as how to include multiple JSX, how to send parameters and complex data from HTML to JSX and vice versa, etc. I could be a starting point as a FAQ.

          I don't use Extension Builder myself but boilerplate code - it's just the same.

          I would suggest to build a test panel with buttons (no matter how much unstyled and ugly) linking your JSX functions, then try to craft the look & feel later when everything's wired more or less correctly.

           

          After all we're working with a technology that is quite green (promising but green), so there's no any actual set of recommended practices - we're all "just" learning (and four ;-)

          Kind regards

           

          Davide Barranca

          ---

          www.davidebarranca.com

          www.cs-extensions.com