How to resize panel-extension, CSInterface.js function "resizeContent" not working.

[owita]

Hi all,

the problem seems to be very simple, but I cant find a solution, so far.

I want to resize the window of my extension during runtime.

I am using CSInterface v7.0.0.

In the file "manifest.xml" the following code defines the size of the panel-extension-window:

<Extension Id="EasySelectionOptions">
      <DispatchInfo>
        <Resources>
          <MainPath>./html/EasySelectionSettings.html</MainPath>
          <CEFCommandLine/>
        </Resources>
        <Lifecycle>
          <AutoVisible>true</AutoVisible>
        </Lifecycle>
        <UI>
          <Type>Panel</Type>
          <Menu>Easy Selection</Menu>
          <Geometry>
            <Size>
			  <minHeight>240</minHeight>
              <minWidth>405</minWidth>
			  <maxHeight>330</maxHeight>
              <maxWidth>415</maxWidth>
              <Height>320</Height>
              <Width>410</Width>
            </Size>
          </Geometry>
          <Icons/>
        </UI>
      </DispatchInfo>
    </Extension>

In the correspoding ".js" file, I have added the call to the function resizeContent:

function onload()
{
	var csInterface = new CSInterface();
	
	// Resize GUI-window
	csInterface.resizeContent(410, 250);
	
    updateThemeWithAppSkinInfo(csInterface.hostEnvironment.appSkinInfo);

    // Update the color of the panel when the theme color of the product changed.
    csInterface.addEventListener(CSInterface.THEME_COLOR_CHANGED_EVENT, onAppThemeColorChanged);		
...
...
}

The call of the function addEventListener works fine, but the call of resizeContent has no effect at all.

In the file "CSInterface.js", the description of the function resizeContent mentions that "Extension's manifest min/max size constraints apply and take precedence". But the values I used for resizing meet the constraints and should not be the problem.

So, the next thing I tried was to remove the tags "<Height>" and "<Width>" from the manifest.xml file and only keep the tags "<min/maxHeight>" and "<min/maxWidth>".

After that, the panel-extension window did not even appear anymore!

I even tried to change the value of the tag "<Type>" to Modeless instead of Panel, but this did not work as well.

It seems as if the function resizeContent has no effect at all.

Update:

I just found out, that instead of the tags "<min/maxWidth>" and "<min/maxHeight>", the tags "<MinSize>" and "<MaxSize>" should be used in the "manifest.xml" file:

        <UI>
          <Type>Panel</Type>
          <Menu>Easy Selection</Menu>
          <Geometry>
            <Size>
              <Height>240</Height>
              <Width>410</Width>
            </Size>
			<MinSize>
			  <Height>240</Height>
              <Width>410</Width>
			</MinSize>
			<MaxSize>
			  <Height>320</Height>
              <Width>410</Width>
			</MaxSize>
          </Geometry>
          <Icons/>
        </UI>

Afterwards, the panel-extension window was manually resizable using the mouse-cursor.

But unfortunately, the function resizeContent is still not working.

What am I missing?

How can I resize the extension window during runtime, using JavaScript and/or the CSInterface?

Thank you very much in advance.

Best Regards,

Fabian Taubitz

[Charu Rajput]

Hi @owita,

I have tested and it is working fine. First of all it will work for Modless and Modal only, secondly, when you are using resizeContent, the value of height is just 10 px larger. To see the difference may be you try the much larger value.

[owita]

Hi Charu Rajput,

Thank you very much for the fast answer.

You are right, I have tested the type Modeless not good enough.

Interestingly enough, when I use the following code in the ".js" file inside the function "onload()", the resizing is not working even for the type Modeless:

function onload()
{
	var csInterface = new CSInterface();
	// Resize GUI-window
	csInterface.resizeContent(410, 315);
        ...
}

But when I use e.g. a button for triggering the resizing, like in the following code-example, everything works as expected:

function shiftLeftButtonClicked() 
{
	// Resize GUI-window
	new CSInterface().resizeContent(410, 260);
        ...
}

Nevertheless, I need a way to do the same for an extension with type Panel instead of Modeless.

In the CSInterface.js file, the comment of the function resizeContent says:

/**
 * Resize extension's content to the specified dimensions.
 * 1. Works with modal and modeless extensions in all Adobe products.
 * 2. Extension's manifest min/max size constraints apply and take precedence.
 * 3. For panel extensions
 *    3.1 This works in all Adobe products except:
 *        * Premiere Pro
 *        * Prelude
 *        * After Effects
 *    3.2 When the panel is in certain states (especially when being docked),
 *        it will not change to the desired dimensions even when the
 *        specified size satisfies min/max constraints.
 *
 * Since 6.0.0
 *
 * @Param width  The new width
 * @Param height The new height
 */

So, according to this comment, it should also work for panel-extensions in Adobe Illustrator. Only when the panel is "docked" the resizing should not work.

But you have mentioned that it only works for the types Modeless and Modal (ModalDialog?).

That means the information from the comment is somehow outdated, correct?

So, there is currently no way that you are aware of, to change the size of a panel-extension in Illustrator during runtime using JavaScript, right?

I need to know, in order to communicate this to our customer.

Again, thanks in advance.

Best Regards,

Fabian Taubitz

[Charu Rajput]

@owita - I don't remember why I wrote it works only in Modal and Modeless. My bad..

It works with Panel as well in Illustartor. So whatever is written in documentation is correct and updated.

[owita]

Thank you Charu Rajput, for the update.

Unfortunately, I have still the problem, that the code above is not working when I use the type Panel. It only works fine for the types Modeless and ModalDialog. The type Panel somehow blocks the resizing.

Do you have an idea what I am doing wrong or missing?

Best regards,

Fabian T.

[Charu Rajput]

@owita -

Is it possible to share the complete code.

I will share my personal email on private message.

[owita]

Sorry for the delay. I have sent the code via the website "TransferBigFiles" to your email-address. Please let me know if this has worked.

Best regards

[Charu Rajput]

Thank you, I have received I will look into that.

[Charu Rajput]

@owita - I have sent you a message and link to the updated code with video where you can see resizeContent is working fine on onLoad() function. Let me know if you need more help.

[owita · Accepted solution]

Short update,

Mr. Charu Rajput has proved that the function resizeContent in the CSInterface.js is not causing the problem.

The problem still remains, but it seems to be caused on my side of the plugin-code.

I will investigate the problem further and update this posting, if I find out more.

Best regards

[Dirk Becker]

For your testing:

choose 1:1 UI scaling - it was giving me trouble on several occasions outside CEP

use far larger max dimensions so that your resize passes even if it is a scaling bug on those max values

[owita]

Thank you very much Mr. Becker. I keep that in mind.

Best regards.