Vaadin Designer, mid-april status

Hi! Sorry, I posted this also in the previous loop.
I installed Vaadin Designer but I am not able to open the editor mode. No errors, nothing
I am using
Version: Luna Service Release 2 (4.4.2)
Build id: 20150219-0600
Windows 7 x64
Vaadin plug-in for Eclipse 2.3.2.20153060752

I attached a screenshot for you. It’s like if designer is always trying to open the preview mode.

Thanks in advance for your help!
19814.jpg

Hi friends:

I am still fighting with IE.

My IE can not open any Vaadin app.
For example, the “Vaadin Sample” (http://demo.vaadin.com/sampler/), or my little app developed with Vaadin.

All these sites just show a blank page, the HTML source code of the site was loaded, but the UI was not displayed.
looks like the JavaScript which bootstrap Vaadin App are not executed.

I tested some other sites which using JavaScript, for example, GMail, and the JavaScript sample pages of W3CSchool,
Same thing happened, page can not be displayed, looks like all the JavaScript not working…

I googled this problem, but found no answer worked for me…

Because I don’t use IE in my normal life, so I don’t even know when it broken, or what broke it, or why.

So many hours of my life wasted, because of this stupid IE…

I hate IE, and I hate it more and more…

My IE is broken, it can not run any JavaScript, so it can not initialize Vaadin App.

I believe this is the real problem, which cause the Vaadin Designer shows a blank page.
Because the Vaadin Designer uses the Eclipse Internal Browser to show the page,
and on the Windows OS, the “Eclipse Internal Browser” is the broken IE which can display nothing.

Hi friends,

I downgrade IE, from IE11 to IE10, and the problem still there.
JavaScript of all web site can not execute, and Vaadin App can not initialize.

Finally, I found some page, some poor guy said he had the same problem,
and fixed it by downgrade to IE9.

I tried to downgrade to IE9, and now IE can execute JavaScript, and Vaadin App can display correctly.

But in the Eclipse Vaadin Designer, there is only a loading indicator (looks like a GIF image) displayed,
and the loading indicator keep turning for ever, but the page content never come out…

Hi friends.

Another problem happened.

(1)I create a custom component, via the deprecated “Vaadin Composite” plug-in,
let’s call this component “Comp-A”

(2)I create another custom component, via the new “Vaadin Designer” plug-in,
let’s call this component “Comp-B”

(3)And then, I create the 3rd custom component, which use “Comp-A” and “Comp-B” as a part of it,
The Vaadin Designer can find out only “Comp-A” as custom component in this project,
but can not find “Comp-B” as custom component.

So, the custom component created by the new “Vaadin Designer” plug-in,
CAN NOT be used by another component created by the new “Vaadin Designer” plug-in.

Is this a bug of the “Vaadin Designer”?
Or I misunderstood how to use custom component in “Vaadin Designer”?

This is actually a known limitation in the current Designer, the next alpha will support this.

Hi Marc!! Vaadin Designer sounds great, but I cannot get it running. Which are the requirements? eclipse version, java, OS, etc? It opens but I doesn’t show the editor mode, I cannot add anything because it’s always trying to open the preview page.
Thanks!!

Hi,
I’m preparing a FAQ with solutions to specific problems users have been running into, but unfortunately it’s not up yet…
If you can tell me more about your setup and versions, I could perhaps provide a better guess.

You need at least Eclipse Luna SR2 (4.4.2) running on Java 7+ (make sure Eclipse is actually running on that - this might be confusing, especially on Mac), and your Vaadin project should use Vaadin 7.4+ (7.5 prefered, and will be required soon - there has been fixes that the Designer needs).

Also, it seems security settings for IE can cause the type of problem you are seeing, we’re still looking into this issue.

Best Regards,
Marc

Thanks vert much for your answer

Hi Marc. First, thanks for your reply.
I am running eclipse:
Version: Luna Service Release 2 (4.4.2)
Build id: 20150219-0600
Vaadin version is:7.4.7
Windows 7 - 64 bits.
JDK 1.7.0_25

I think that editor mode should work, even though IE is not working. Shouldnt that fail only when trying to show preview page?
I will upgrade to vaadin 7.5 and let you know! the results

Thanks!!!
Regards,

The Designer uses the browser to display all views (except the source view). To do that the Designer embeds the default browser into eclipse. On Windows this is IE. So you will need to get IE to work with Vaadin before you can properly use the Designer.

If you cannot get any Vaadin application to load in IE then the problem most likely is that you have blocked javascript from executing. This can happen if you turn Javascript off in the browser settings or you have a security software (adblock / firewall / virus scanner/…) that installs an IE extension into your browser and actively blocks Javascript.

Hi John! thanks for your comments. My application is deployed using tomcat and I can open it using IE or Chrome, it works on both. I think that what you said about firewall may be the problem. However, I dont know why the URL of the application uses IP:PORT. Why does it uses my IP and not localhost? How can I configure jetty to use localhost instead of my IP? Is difficult for me to change firewall because its not permitted (it’s my work’s computer).
Thanks in advance! Regards,

Hi guys! finally I am using a different computer so that network issues are not there anymore. Now I am having this error I attached as screenshot and also the log I get from error view. I get this log when I try to open a Design using vaadin designer. I hope you can help me.
Thanks in advance!
19910.txt (14.6 KB)
19911.jpg

By default the Designer will try to resolve a public facing IP + port automatically. The reason why it needs a public facing ip address is that the designs can be viewed on any mobile device by just using the design URL. But you can configure what host and port the designer will use under the project settings.

Here is a screenshot of how that can be done (just uncheck the “Automatic” checkbox and add your own ip+port):

Just remember that when you run it on localhost then the external preview feature cannot be used.

Looks like you are trying to open a Java (MainPortal.java) file instead of a design HTML file.

Thanks John!! It’s working now!! very very happy…=)
Now I am having an issue when trying to add an image to a Panel. I opened the Source property of image, and used this:
new ThemeResource(“img/logopri.jpg”) and also tried with img/logopri.jpg but they dont work. Exception is “File not found”.
What am I doing wrong?

Thank you very much for your support!
Regards,

You should use
theme://img/logopri.jpg
- assuming your image is in VAADIN/themes/≤yourtheme>/img/logopri.jpg

This works for icons as well, BTW.

This is not obvious, and it’s in our backlog of things we want to improve asap in a .x release: the […]
button should help you to add images from different sources.

Best Regards,
Marc

Thanks Marc! It worked.

Kind regards,

Quick question on null representations in the designer. I can’t seem to set that field to an empty string… if I set it empty it reverts to null.

If i set the field to “”, I get the quotes showing as the null representation.

Worth noting here that if I edit the HTML to have null-representation=“” it works as expected - hence I think this is an issue with the designer itself.

Is there a way I can set blanks in the visual designer - maybe there is a trick to it.

Radical thought: make empty string the null default for all string based fields?? :slight_smile:

Ok, so if I bring up the detail editor I can set a blank string, just not in the panel editor on the sidebar (reverts to null if you leave it blank).

Hi friends,

A problem about ItemCaptionMode of Select components.

When I drop an OptionGroup or a ComboBox into the designer, designer generate a attribute into the HTML file: “item-caption-mode=‘id’”.

This attribute set the ItemCaptionMode property of these Components into ItemCaptionMode.ID, which will display the ItemID as the selection Caption in to page.

But by default, the ItemCaptionMode property of these Components (inherit from AbstractSelect) should be ItemCaptionMode.EXPLICIT_DEFAULTS_ID.

(1)Why the UI designer change the defualt value of ItemCaptionMode property?
(2)I checked the Properties View of Eclipse, there is not a property where I can change this value

Is this a Bug?