Drag & Drop Login

On Monday I published a version of the openinfocard identity selector that allows drag & drop selection of information cards at a relyingparty.

While this is NON-standard I would like it if some relying parties would jump onto this train. And of course I hope that this or something like it will become Standard.

Some thoughts about this:
Why: It is cool. You want to drag a card onto the relyingparty.

What is the problem with the current standard? The object tag has no width and height. Although the object-element was originally intended by the W3C to handle media data like video, flash, pdf, etc this was/is not the way the object tag is intended to be used by ISIP and the ISIP Web Guide as defined by Microsoft. Here the object-element provides information about the required and optional claim, the token type etc but it does not occupy space on the web page. This means that there is nothing you can drop a card onto.

Solution: Introduce a parameter to the object-element that signifies the HTML element where a card can be dropped on. The identity selector then adds drag&drop handlers to this HTML-element and these handlers trigger the identity selector when a cardId is dropped on the HTML-element with the right icDropTargetId.
This is a 1-to-1 relationship between object-element and droptarget-element.
The drop target is inside a form that gets submitted when a cardId is dropped.

Technical detail: The thing that is dragged has the mime-type "application/x-informationcard-id". If you are a card selector outside of Firefox then all you need to do to participate in this is to create a drag-"thingy" with this mime-type. The openinfocard id selector will accept only things dropped onto the drop-target with this mime-type. Easy, isn't it?!

There is of course room for improvement. We could aggree on dragging a whole card of mime-type "application/x-informationcard" and compare the tokentype and supported claimtype before accepting the dragged card...

Compability with CardSpace: The icardie.dll does not care if there are extra parameters for the object-element. Your relyingparty works with CardSpace when this new parameters is present. There is just no drag&drop feature.

Drop into a Site

I just uploaded a new verion of the XMLDAP RP source code and a new version of the openinfocard card selector.

You still have to compile you own version of the XMLDAP relyingparty because the current server still lacks a valid cert.
Signature validation of an newly imported card seems to fail too everytime. Sorry. Working on that (too).

Now for the new stuff. You can now display a list of your Firefox Identity Selector's cards in the browsers sidebar by pressing Ctrl-Shift-I. When you then drag a card onto the Information Card Icon the identity selector gets started and you can select a card to generate a token for the relyingparty. Cool.

It would be even cooler if the dragged card was preselected but for this I have to change the interface between browser add-on and identity selector.
The current interface for the getBrowserToken function is:

    GetBrowserToken: function (
     issuer , recipientURL, requiredClaims, optionalClaims , tokenType, 
     privacyPolicy, privacyPolicyVersion, serverCert, issuerPolicy);

I will just add the new parameter cardid to this call. And while I am at it I will introduce a new parameter sslMode. "sslMode" tells the selector whether the browser thinks that the serverCert is an extended validation certificate or not. Adding more and more parameters to the call does not seem optimal but the xpt interface in mozilla code only allows simple and some more types. I can not define structs/records etc. Theses changes to the API affect the other Firefox extension too. I have to change CardSpace for Firefox too. And maybe others will make use of this API too? (Another subproject I don't have time for: convert the DigitalMe/Bandit/Higgins-Firefox selectors into components that use this API. Or another API we might agree on in the "Browser Integration Working Group" in the Information Card Foundation.)


Drag a card onto the relyingparty's icon.


How does it work: Well, I had to make another change and add a new parameter to the HTML object of type application/x-informationcard.

<form method='post' action='./infocard' id='infocard' enctype='application/x-www-form-urlencoded'>
<img id="icDropTarget" class="droparea" src="./img/card_off.png" alt=""
     onmouseover="this.src='./img/card_on.png';"
     onmouseout="this.src='./img/card_off.png';"
     onclick='var pf = document.getElementById("infocard"); pf.submit();'/>


    <object type="application/x-informationcard" name="xmlToken">
 <param name="privacyUrl" value="https://w4de3esy0069028.gdc-bln01.t-systems.com:8443/relyingparty/?privacy.txt"/>
 <param name="requiredClaims" value="http://schemas.xmlsoap.org/ws/2005/05/identity/claims/privatepersonalidentifier http://schemas.xmlsoap.org/ws/2005/05/identity/claims/givenname http://schemas.xmlsoap.org/ws/2005/05/identity/claims/surname http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress"/>
 <param name="optionalClaims" value="http://schemas.xmlsoap.org/ws/2005/05/identity/claims/streetaddress http://schemas.xmlsoap.org/ws/2005/05/identity/claims/locality http://schemas.xmlsoap.org/ws/2005/05/identity/claims/stateorprovince http://schemas.xmlsoap.org/ws/2005/05/identity/claims/postalcode http://schemas.xmlsoap.org/ws/2005/05/identity/claims/country http://schemas.xmlsoap.org/ws/2005/05/identity/claims/homephone http://schemas.xmlsoap.org/ws/2005/05/identity/claims/otherphone http://schemas.xmlsoap.org/ws/2005/05/identity/claims/mobilephone http://schemas.xmlsoap.org/ws/2005/05/identity/claims/dateofbirth http://schemas.xmlsoap.org/ws/2005/05/identity/claims/gender"/>
 <param name="tokenType" value="urn:oasis:names:tc:SAML:1.0:assertion"/>
        <param name="privacyVersion" value="1"/>
     <param name="icDropTargetId" value="icDropTarget"/>
    </object>
</form>

The new parameter "icDropTargetId" signifies the element where information cards can be dropped onto. The img element in this example has this id. If the element is inside a form than it is submitted by the dropped information card. Simple!

Enjoy. (with Firefox 2 please)