This question is answered. Helpful answers available: 2. Correct answers available: 1.


Permlink Replies: 36 - Pages: 3 [ Previous | 1 2 3 | Next ] - Last Post: 29-Mar-2017 08:24 Last Post By: jGromit Threads: [ Previous | Next ]
RobM

Posts: 3,364
Registered: 4-Aug-2006
Re: Custom edit panel / panoramic image
Posted: 26-Mar-2017 21:29   in response to: jGromit in response to: jGromit
 
  Click to reply to this thread Reply
jGromit wrote:
RobM wrote:
From a users POV I would suggest radio buttons might be easier to use....

The most usable, but also the choice that chews up the most screen real estate. And when you're talking about a little custom UI, that matters. When it comes to space, a JComboBox is usually the most efficient.

Then my next minimalist vote goes for removing both checkboxes, and just detecting if there is any valid entry in either of the fields :)
Dschuwi

Posts: 533
Registered: 12-Nov-2003
Re: Custom edit panel / panoramic image
Posted: 27-Mar-2017 09:21   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
RobM wrote:

Then my next minimalist vote goes for removing both checkboxes, and just detecting if there is any valid entry in either of the fields :)

There's more than one way to skin a cat.

I agree with jGromit regarding radiobuttons and space. That's why I have removed all buttons from my skin and replaced them with checkboxes or comboboxes.
Dschuwi

Posts: 533
Registered: 12-Nov-2003
Re: Custom edit panel / panoramic image
Posted: 27-Mar-2017 17:29   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
RobM wrote:

From a users POV I would suggest radio buttons might be easier to use; dIsabled, panoramic, 360 panoramic. That removes the need to check two boxes for the 360 - a mega time saver ;)

Et voilà!

I was in the mood :-)

The passed userVariables are noPano / pano / pano360

ATTENTION - THE FOLLOWING CODE DOES NOT WORK RELIABLY - READ FURTHER DOWN THIS THREAD FOR MORE INFORMATION

/**
 * Begin custom edit view panel
 */
 
String customImageWidthLabelText = "Max. image width";
String noPanoText = "No pano";
String panoText = "Pano";
String pano360Text = "Pano 360";
String customImageWidthDefault = "50000";
String pan360WidthDefault = "123456";
String panoramicImageText = "Panoramic image";
 
class CustomUI extends JCustomPanel {
 
  AlbumObject cAO;
  AlbumObjectProperties cProps;
  JTextField customImageWidth = new JSmartTextField(customImageWidthDefault);
  JLabel customImageWidthLabel = new JLabel(customImageWidthLabelText);
  JRadioButton noPano = new JRadioButton(noPanoText, true);
  JRadioButton pano = new JRadioButton(panoText, false);
  JRadioButton pano360 = new JRadioButton(pano360Text, false);
  ButtonGroup panoGroup = new ButtonGroup();
  panoGroup.add(noPano);
  panoGroup.add(pano);
  panoGroup.add(pano360);
   
  public void setAlbumObject(AlbumObject ao) {
    super.setAlbumObject(ao);
    saveUI();
    removeAll();
    if (ao != null) {
      cAO = ao;
      cProps = cAO.getProperties();
      File currentContextFile = ao.getFile();
      add(noPano);
      add(pano);
      add(pano360);
      add("br", customImageWidthLabel);
      add("hfill", customImageWidth);
      customImageWidthLabel.setEnabled(!noPano.isSelected());
      customImageWidth.setEnabled(!noPano.isSelected());
      loadUI();
    }
  }
	
	public CustomUI(JAlbumContext context) {
		super(context);
		
		// Set up the UI
		setBackground(SystemColor.text);
		setOpaque(true);
    noPano.setBackground(SystemColor.text);
    pano.setBackground(SystemColor.text);
    pano360.setBackground(SystemColor.text);
 
		// Make sure changes are saved even if one doesn't move between images
		FocusListener fl = new FocusAdapter() {
			private void focusLost(FocusEvent e) {
        saveUI();
			}
		};
 
    noPano.addFocusListener(fl);
    pano.addFocusListener(fl);
    pano360.addFocusListener(fl);
 
    // Check whether a valid integer value was entered, otherwise use default
    customImageWidth.addFocusListener(new FocusListener() {
      public void focusLost(FocusEvent e) {
        if (!noPano.isSelected()) {
        if (customImageWidth.getText().trim().equals("") || !customImageWidth.getText().matches("\\d*")) customImageWidth.setText(customImageWidthDefault);
        cProps.put("maxImageWidth", customImageWidth.getText());
        cProps.save();
        }
      }
    }
    );
 
    noPano.addItemListener(new ItemListener() {
      public void itemStateChanged(ItemEvent e) {
        if (noPano.isSelected()) {
          customImageWidth.setText(customImageWidthDefault);
          cProps.remove("maxImageWidth");
          cProps.save();
          customImageWidthLabel.setEnabled(false);
          customImageWidth.setEnabled(false);
        }
      }
    }
    );
 
    pano.addItemListener(new ItemListener() {
      public void itemStateChanged(ItemEvent e) {
        if (pano.isSelected()) {
          customImageWidth.setText(customImageWidthDefault);
          cProps.put("maxImageWidth", customImageWidth.getText());
          cProps.save();
          customImageWidthLabel.setEnabled(true);
          customImageWidth.setEnabled(true);
        }
      }
    }
    );
 
    pano360.addItemListener(new ItemListener() {
      public void itemStateChanged(ItemEvent e) {
        if (pano360.isSelected()) {
          customImageWidth.setText(customImageWidthDefault);
          cProps.put("maxImageWidth", customImageWidth.getText());
          cProps.save();
          customImageWidthLabel.setEnabled(true);
          customImageWidth.setEnabled(true);
        }
      }
    }
    );
 
		// Subclasses like us should call init after components are initiated
		init();
	}
}
 
// Make some convenient references available
JAlbumContext context = JAlbumContext.getInstance();
PluginContext pc = context.getPluginContext();
EditPanel editPanel = pc.getEditPanel();
 
CustomUI CustomUI = new CustomUI(context);
// Install custom panel in Jalbum's edit panel
editPanel.addCustomTab(panoramicImageText, CustomUI);
 
/**
 * End custom edit view panel
 */


Edited by: Dschuwi on 28-Mar-2017 20:11
AndreWolff

Posts: 1,963
Registered: 14-Dec-2007
Re: Custom edit panel / panoramic image
Posted: 27-Mar-2017 17:50   in response to: Dschuwi in response to: Dschuwi
 
  Click to reply to this thread Reply
Attachment NoMaxImageSet.PNG (339.7 KB)
Dschuwi wrote:
I was in the mood :-)

The passed userVariables are noPano / pano / pano360

Very nice Heinz-Peter, these variables are indeed passed, but the maxImagewidth is not set to the value showed in the text box; the image size is not changed, see also attached screenshot.

Edited by: AndreWolff on 27-Mar-2017 17:53
Just setting an option box is not sufficient.
To get the maxImageWidth set, I had to put the cursor in the textbox and next I had to push the Enter key.
Dschuwi

Posts: 533
Registered: 12-Nov-2003
Re: Custom edit panel / panoramic image
Posted: 27-Mar-2017 18:47   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
AndreWolff wrote:

To get the maxImageWidth set, I had to put the cursor in the textbox and next I had to push the Enter key.

There was a wrong variable left in the customImageWidth focus listener. I have correct the code, it should work now.
AndreWolff

Posts: 1,963
Registered: 14-Dec-2007
Re: Custom edit panel / panoramic image
Posted: 27-Mar-2017 19:25   in response to: Dschuwi in response to: Dschuwi
 
  Click to reply to this thread Reply
Attachment pan360.PNG (414.6 KB)
Dschuwi wrote:
There was a wrong variable left in the customImageWidth focus listener. I have correct the code, it should work now.
OK, I will test it later.
But I addapted your very first proposal with the extra check-box for a 360 panorama, see screenshot.
This is the adapted code:
/**
 * Begin custom edit view panel
 */
 
String customImageWidthLabelText = ("Max. image width");
String customImageWidthDefault = "50000";
 
class CustomUI extends JCustomPanel {
 
  AlbumObject cAO;
  AlbumObjectProperties cProps;
  JCheckBox panoramicImage = new JCheckBox("Panoramic image");
  JCheckBox pan360 = new JCheckBox("<html>360° panorama image</html>");
  JTextField customImageWidth = new JSmartTextField(customImageWidthDefault);
  JLabel customImageWidthLabel = new JLabel(customImageWidthLabelText);
    
  public void setAlbumObject(AlbumObject ao) {
    super.setAlbumObject(ao);
    saveUI();
    removeAll();
    if (ao != null) {
      cAO = ao;
      cProps = cAO.getProperties();
      File currentContextFile = ao.getFile();
      add(panoramicImage);
      add("br", pan360);
      add("br", customImageWidthLabel);
      add("hfill", customImageWidth);
      customImageWidthLabel.setEnabled(panoramicImage.isSelected());
      customImageWidth.setEnabled(panoramicImage.isSelected());
      pan360.setEnabled(panoramicImage.isSelected());
      loadUI();
    }
  }
	
	public CustomUI(JAlbumContext context) {
		super(context);
		
		// Set up the UI
		setBackground(SystemColor.text);
		setOpaque(true);
    		panoramicImage.setBackground(SystemColor.text);
     	pan360.setBackground(SystemColor.text);
 
		// Make sure changes are saved even if one doesn't move between images
		FocusListener fl = new FocusAdapter() {
			private void focusLost(FocusEvent e) {
        saveUI();
			}
		};
 
    panoramicImage.addFocusListener(fl);
 
    // Check whether a valid integer value was entered, otherwise use default
    customImageWidth.addFocusListener(new FocusListener() {
      public void focusLost(FocusEvent e) {
        if (panoramicImage.isSelected()) {
        if (isEmptyString(customImageWidth.getText()) || !customImageWidth.getText().matches("\\d*")) customImageWidth.setText(customImageWidthDefault);
          cProps.put("maxImageWidth", customImageWidth.getText());
          cProps.save();
        }
      }
    }
    );
 
    // Enable maxImageWidth field if panoramicImage is checked, otherwise remove userVariables
    panoramicImage.addActionListener(new ActionListener() {
      public void actionPerformed(ActionEvent e) {
        if (panoramicImage.isSelected()) {
          customImageWidth.setText(customImageWidthDefault);
          cProps.put("maxImageWidth", customImageWidth.getText());
        }
        else {
          customImageWidth.setText(customImageWidthDefault);
          cProps.remove("maxImageWidth");
          cProps.remove("panoramicImage");
          cProps.remove("pan360");
          cProps.remove("customImageWidth");
        }
        cProps.save();
        customImageWidthLabel.setEnabled(panoramicImage.isSelected());
        customImageWidth.setEnabled(panoramicImage.isSelected());
        pan360.setEnabled(panoramicImage.isSelected());
      }
    }
    );
 
		// Subclasses like us should call init after components are initiated
		init();
	}
}
 
// Make some convenient references available
JAlbumContext context = JAlbumContext.getInstance();
PluginContext pc = context.getPluginContext();
EditPanel editPanel = pc.getEditPanel();
 
CustomUI CustomUI = new CustomUI(context);
// Install custom panel in Jalbum's edit panel
editPanel.addCustomTab("Panoramic image", CustomUI);
 
/**
 * End custom edit view panel
 */

What do you think?
This seems to work fine.
What I do not like is that the p360 check-box stays checked if the Panoramic image check-box is cleared, so that I see pan360 as true in the skin
AndreWolff

Posts: 1,963
Registered: 14-Dec-2007
Re: Custom edit panel / panoramic image
Posted: 27-Mar-2017 19:48   in response to: Dschuwi in response to: Dschuwi
 
  Click to reply to this thread Reply
Dschuwi wrote:
There was a wrong variable left in the customImageWidth focus listener. I have correct the code, it should work now.
I did copy all your code above again, but it is still not correctly working.
I fetch the value of pan360 in my skin with this code:
var AutoPan_360 = [<ja:fileiterator start="0" >
<ja:if exists="pan360">${pan360},</ja:if><ja:else>false,</ja:else>
</ja:fileiterator>
];
This array shows a value true for a panorama if No Pano is selected and also if Pano is selected.
Dschuwi

Posts: 533
Registered: 12-Nov-2003
Re: Custom edit panel / panoramic image
Posted: 27-Mar-2017 23:18   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
AndreWolff wrote:

I fetch the value of pan360 in my skin with this code:
var AutoPan_360 = [<ja:fileiterator start="0" >
<ja:if exists="pan360">${pan360},</ja:if><ja:else>false,</ja:else>
</ja:fileiterator>
];
This array shows a value true for a panorama if No Pano is selected and also if Pano is selected.

Your test tries to show if the variable EXISTS. Yes, it does exist. (But your syntax seems to be wrong anyway). Look here:

http://jalbum.net/help/en/Tags

You want to test whether the existing variable is TRUE or FALSE:

<ja:if test="${pano360}">YES, the value is TRUE</ja:if>
<ja:else>NO, the value is FALSE</ja:else>


And be careful: My latest code (with the radio buttons) uses pano360 notnot pan360

I put it together quickly as a starting point, and found another bug; all three JRadioButttons have to be initialized with either true or false. I have corrected the code in the posting accordingly.
Dschuwi

Posts: 533
Registered: 12-Nov-2003
Re: Custom edit panel / panoramic image
Posted: 27-Mar-2017 23:29   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
AndreWolff wrote:

This seems to work fine.
What I do not like is that the p360 check-box stays checked if the Panoramic image check-box is cleared, so that I see pan360 as true in the skin

In your panoramicImage action listener, after
pan360.setEnabled(panoramicImage.isSelected());

add this
pan360.setSelected(panoramicImage.isSelected());
AndreWolff

Posts: 1,963
Registered: 14-Dec-2007
Re: Custom edit panel / panoramic image
Posted: 28-Mar-2017 08:48   in response to: Dschuwi in response to: Dschuwi
 
  Click to reply to this thread Reply
Dschuwi wrote:
In your panoramicImage action listener, after
pan360.setEnabled(panoramicImage.isSelected());

add this
pan360.setSelected(panoramicImage.isSelected());
No, that does not solve the problem, the 360 checkbox is now automatically set if you set the panoramic image checkbox.
I solved the problem by investigating both user variables in the skin.

Edited by: AndreWolff on 29-Mar-2017 08:20
AndreWolff

Posts: 1,963
Registered: 14-Dec-2007
Re: Custom edit panel / panoramic image
Posted: 28-Mar-2017 09:36   in response to: Dschuwi in response to: Dschuwi
 
  Click to reply to this thread Reply
Attachment NotWoirking.PNG (75.9 KB)
Dschuwi wrote:
I put it together quickly as a starting point, and found another bug; all three JRadioButttons have to be initialized with either true or false. I have corrected the code in the posting accordingly.
Well I copied your new code from above, but it is no longer working, see screenshot.
Dschuwi

Posts: 533
Registered: 12-Nov-2003
Re: Custom edit panel / panoramic image
Posted: 28-Mar-2017 12:45   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
AndreWolff wrote:

Well I copied your new code from above, but it is no longer working, see screenshot.

This is strange, indeed. This happens here as well with some images, sometimes, and I don't know why.
Click on another image, then it will be fine, if you go back to the frst image, it will work there as well ...

It seems it is connected with the *.info file in the image diirectory's .jalbum folder. If I delete the *.info file, everything works well from the beginning ...
AndreWolff

Posts: 1,963
Registered: 14-Dec-2007
Re: Custom edit panel / panoramic image
Posted: 28-Mar-2017 12:55   in response to: Dschuwi in response to: Dschuwi
 
  Click to reply to this thread Reply
Dschuwi wrote:
This is strange, indeed. This happens here as well with some images, sometimes, and I don't know why.
Click on another image, then it will be fine, if you go back to the frst image, it will work there as well ...
Yes, that is correct, if I start with another image it works!!

Edited by: AndreWolff on 28-Mar-2017 13:01:

But I did delete the .info file, started jAlbum again and started with the problem image: this image was again not visible and the Panoramic image panel was empty.
Next I did open again another image and next again the problem image: it was OK.

Edited by: AndreWolff on 28-Mar-2017 13:01
jGromit

Posts: 8,632
Registered: 31-Jan-2006
Re: Custom edit panel / panoramic image
Posted: 28-Mar-2017 12:57   in response to: Dschuwi in response to: Dschuwi
 
  Click to reply to this thread Reply
I've stayed out of this thread, but this is all very familiar. Been there before....

http://jalbum.net/forum/message.jspa?messageID=299147#299147
Dschuwi

Posts: 533
Registered: 12-Nov-2003
Re: Custom edit panel / panoramic image
Posted: 28-Mar-2017 14:28   in response to: jGromit in response to: jGromit
 
  Click to reply to this thread Reply
jGromit wrote:
I've stayed out of this thread, but this is all very familiar. Been there before....

http://jalbum.net/forum/message.jspa?messageID=299147#299147


Ok, thanks for this hint. It seems to be some weird timing problem, indeed, located in the lines
cProps.put("maxImageWidth", customImageWidthDefault);
 cProps.save();

in both the pano and pano360 item listeners. It is also dependend on the state of the radio buttons when the skin is loaded.

I tried quite something there, got varying results.
I am giving up.
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums