Available in 1.0 trunk

SAMLmetaJS

To get started you're advised to download a package (zip file), and put in in a web folder. The included demo HTML page index.html should enable SAMLmetaJS and work out of the box.

The package contains the SAMLmetaJS files, an embedded version of JQuery and JQuery UI as well as the demo HTML page.


When you move on to integrate SAMLmetaJS into your own site, you may use the demo file as a template.

In your HTML file where you have a metadata edit textarea, you should make sure JQuery and JQuery UI (for tabs support) is available. You can choose one of many options:

Including JQuery on your site, may look like this:

<!-- JQuery -->
<script type="text/javascript" src="jquery/jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="jquery/jquery-ui-1.8.5.custom.min.js"></script>
<link rel="stylesheet" media="screen" type="text/css" href="jquery/css/custom/jquery-ui-1.8.5.custom.css" />

The localization feature of SAMLmetaJS requires Google Maps API, and if you use the location plugin of SAMLmetaJS, you should also include this:

<!-- Include Google maps to use with SAMLmetaJS -->
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>

Then include SAMLmetaJS, and pick the plugins you want:

<!-- SAMLmetaJS -->
<script type="text/javascript" src="samlmetajs/samlmeta.js"></script>
<script type="text/javascript" src="samlmetajs/samlmeta.xml.js"></script>
<script type="text/javascript" src="samlmetajs/samlmeta.plugin.info.js"></script>
<script type="text/javascript" src="samlmetajs/samlmeta.plugin.organization.js"></script>
<script type="text/javascript" src="samlmetajs/samlmeta.plugin.saml2sp.js"></script>
<script type="text/javascript" src="samlmetajs/samlmeta.plugin.location.js"></script>
<script type="text/javascript" src="samlmetajs/samlmeta.plugin.certs.js"></script>

<link type="text/css" href="samlmetajs/css/samlmetajs.css" rel="Stylesheet" />

Note: SAMLmetaJS is split into multiple files for more easily locating errors and easier maintenance. For production you probably will download a minified compact javascript file, or compile your own JS package from the files above.

Now, the needed libraries are loaded, and you may tell SAMLmetaJS to embrace a textarea field in your HTML document:

<script type="text/javascript">
    $(document).ready(function(){
        $("textarea#metadata").SAMLmetaJS();                
    });
</script>

The example above will find a textarea element with id="metadata". You may off course use any JQuery supported selector. As you may have noticed SAMLmetaJS is implemented as a JQuery Plugin.

Here is an example of how your textareaelement may look like:

<textarea id="metadata"></textarea>