PasswordField - new component

Hi all!

I've started a small project called "PasswordField" - it's a field specifically for password entry. Currently it shows a warning if the user has CapsLock on, but I have some other small things on the TODO - feel free to suggest stuff...

Obviously, this component is going to be in the Directory, but if you can't wait, there is a demo and the sources are on google (Apache 2.0 as usual).

Feedback & comments welcome!

Best Regards,
Marc

Next feature: Chroma-hash
I have a working implementation, I'm just going to clean it up a little and document before pushing to svn.

This IMO makes it less important to have a 'show password' feature, but I'm still considering adding that...

Thoughts?

//Marc

CapsLock detection in the demo doesn't seem to work for WinXP, FF3.6, in fact all three fields behave identically for me.

Chroma-hash integration is a nice touch, and I agree that it makes the plaintext option unneccessary. It will require some description, though, as I think most people will not understand it right away.

Perhaps a silly question, but how would most users go about integrating your code into their application?

Would we just copy the source and PNG into an existing Vaadin Eclipse project?

Would we create a new Vaadin Eclipse project with just this code in it (checking out via SVN)? And if so, how would we then integrate it into our main application project?

Does the standard compile of a Vaadin Eclipse project take care of the GWT compiling or whatever else is needed?

Just not sure how it all goes together so it can be used in my main Vaadin Eclipse project.

Thanks for any tips... This seems generally useful as that's a major cause of the "I know I typed it in correctly but it was rejected" complaints we receive.

Henri Muurimaa: CapsLock detection in the demo doesn't seem to work for WinXP, FF3.6, in fact all three fields behave identically for me.

Hmm... Did you actually type in the fields?
(one can't actually detect the state of the CapsLock key in the browser, so it figures out the state of things while you type)

It has worked fine in all browsers I've tried so far - the only odd thing being Safari displaying it's built-in CapsLock warning.

Update: just tried FF 3.6 on WinXP, worksforme

Henri Muurimaa: Chroma-hash integration is a nice touch, and I agree that it makes the plaintext option unneccessary. It will require some description, though, as I think most people will not understand it right away.

Yes, I my thoughts exactly - there is a tooltip about the chroma-hash, but there is just no way to explain it properly within the component itself. I'm imagining you'd want to use it like this: In the registration process, don't show the chroma-hash "flag" to the user while filling in the password, instead show the flag once the registration is complete, along with an explanation - then show the chroma-hash as usual in the actual login form.

Chroma-hash in SVN, deploying demo WAR in a minute...

// Marc

David Wall: Perhaps a silly question, but how would most users go about integrating your code into their application?

If you're using Eclipse, the Vaadin plugin takes care of compiling when you drop a jar in the lib folder (if it contains GWT code that requires separate compiling). However, as you no doubt noticed, PasswordField is a source-only release so far - sorry about that, I'll upload the jar somewhere, but I wanted to do some more coding first ;-)

If you want to have it _now_, I'd say the best way is to checkout the sources from SVN, make sure it runs, and the export a jar from eclipse, and put that in your project(s).

//Marc

The new version with chroma-hash is now online:

http://marc.virtuallypreinstalled.com/PasswordField

Note:

• you must type something for the CapsLock warning to work
• the chroma-hash flag appears after you stop typing - and not befor you've typed at least 4 characters

// Marc
(BTW I'm sorry, but the editor in use here must be one of the worst rich text editor known to man...)

(BTW I'm sorry, but the editor in use here must be one of the worst rich text editor known to man...)]

Indeed. using this with Chrome you lose your whole message when inserting lists, or code. Copy-paste to text editor prior to using any of the buttons, or learn to type the markup yourself.

Liferay listening ?

Marc Englund: Hmm... Did you actually type in the fields?
(one can't actually detect the state of the CapsLock key in the browser, so it figures out the state of things while you type)

Yeah that was it, I just toggled capslock after typing something...

chroma-hash is a very cool feature, i think. however, in the online-demo i got the same chroma-hash with pirouette as with pIrouette (upper case i). this is not the case in the other chroma-hash demo at mattt.github.com, thus i believe it's a bug.

cheers kilian

Very nice component - chroma hash is really cool - I have never sow it earlier.
I have two suggestion though.

I think that caps-lock icon should be published to user as the public resource and then assigned to the field by CSS. It is done by creating folder called "public" in the same package you put gwt.xml file. All files in that folder are copied to WebContent/VAADIN/widgetsets/[finalWidgetsetName] when widgetset is compiled. That is why by convention all your files should be in subfolder of public. To sum it up - your file structure should look like that:

- org.vaadin.passwordField
| - client
| | - [all client files here]
| - PasswordFieldWidgetSet.gwt.xml
| - public
| | - passwordField
| | | - capsLockIcon.png
| | | - styles.css
[and so on]

Moreover if you just change field style names you let the user to customize it much more ... maybe make the whole field orange ?

Even changing ClassResource into Resource would be an improvement.

The second one is about client side code - this is minor - maybe you could enclose this chroma cache in some kind of widget rather than appending html "by hand"

It would be nice to have a non-deprecated version of PasswordField#setSecret to allow show/hide the password.

Hi Marc,

intresting Add-On, would help me a lot if I could get it to run.
I downloaded the 7.0.0 Version and tried to includ it into my Vaadin 7.0.1 Application.

When I now try to create a new org.vaadin.passwordfield.PasswordField I get a ClassNotFound-Exception:

Caused by: java.lang.NoClassDefFoundError: com/vaadin/terminal/Resource
	at amos.server.webserver.vaadin.ui.fields.basicFields.AmosWebPasswordField.initInputField(AmosWebPasswordField.java:30)
	at amos.server.webserver.vaadin.ui.fields.basicFields.AbstractAmosWebTextField.<init>(AbstractAmosWebTextField.java:29)
	at amos.server.webserver.vaadin.ui.fields.basicFields.AmosWebPasswordField.<init>(AmosWebPasswordField.java:13)
	at amos.server.webserver.vaadin.ui.fields.AmosWebFieldFactory.getTextField(AmosWebFieldFactory.java:92)
	at amos.server.webserver.vaadin.ui.fields.AmosWebFieldFactory.getPasswordField(AmosWebFieldFactory.java:102)
	at amos.server.amosweb.modules.test.xpoy.AmosWebTestXpoy.initContent(AmosWebTestXpoy.java:93)
	at amos.server.webserver.vaadin.ui.module.AbstractAmosWebModule.<init>(AbstractAmosWebModule.java:37)
	at amos.server.amosweb.modules.test.xpoy.AmosWebTestXpoy.<init>(AmosWebTestXpoy.java:39)
	at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)
	at sun.reflect.NativeConstructorAccessorImpl.newInstance(Unknown Source)
	at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(Unknown Source)
	at java.lang.reflect.Constructor.newInstance(Unknown Source)
	at java.lang.Class.newInstance0(Unknown Source)
	at java.lang.Class.newInstance(Unknown Source)
	at com.vaadin.navigator.Navigator$ClassBasedViewProvider.getView(Navigator.java:336)
	at com.vaadin.navigator.Navigator.navigateTo(Navigator.java:506)
	at amos.server.webserver.vaadin.ui.mainMenu.content.UserMenuContentItem.layoutClick(UserMenuContentItem.java:49)
	at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
	at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)
	at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
	at java.lang.reflect.Method.invoke(Unknown Source)
	at com.vaadin.event.ListenerMethod.receiveEvent(ListenerMethod.java:508)
	... 32 more
Caused by: java.lang.ClassNotFoundException: com.vaadin.terminal.Resource
	at java.net.URLClassLoader$1.run(Unknown Source)
	at java.net.URLClassLoader$1.run(Unknown Source)
	at java.security.AccessController.doPrivileged(Native Method)
	at java.net.URLClassLoader.findClass(Unknown Source)
	at java.lang.ClassLoader.loadClass(Unknown Source)
	at sun.misc.Launcher$AppClassLoader.loadClass(Unknown Source)
	at java.lang.ClassLoader.loadClass(Unknown Source)
	... 54 more

Any Idea why I tries to load the com.vaadin.terminal.Resource from Vaadin 6?

Thanks for any help

Marc

Marc Poy:
Any Idea why I tries to load the com.vaadin.terminal.Resource from Vaadin 6?

The add-on was updated for Vaadin 7-alpha-something, but has not been updated since (and there was/is no way to indicate that in the Directory). Sorry! :-(
As soon as I can find a few hours, I'll go trough all my add-ons and maks sure they're all up-to-date. Unfortunately I can't promise exactly when that will occur.

Sorry again, thanks for your patience!

Best Regards,
Marc

Hi Marc,

thanks for the reply, no problem it is not that urgent.
I can easly live with the "default" Vaadin PasswordField till then.

but thanks for the nice add-on anyway

Marc