URL references in XPages

Aaaah URL references, I guess everyone with Domino and XPages have struggled with them. At first you think you have tackled them, but then you open your app from another perspective (e.g. web browser launch – open designated xpage) and you discover the references did no work like you thought they would.

So how do they work? I made an xpage to demonstrate their working:

url-references

I made 6 types of references:

/.ibmxspres/domino -> this brings me back to the root of the server (or data directory)

/.ibmxspres/global -> this brings me to the folder domjava/xsp/ on the server. This is where for example server-side themes are installed

/.ibmxspres/dojoroot -> this brings me back to the folder /xsp/.ibmxspres/dojoroot-1.9.7/ on the server. This is the installation folder of dojo.

/ -> this brings me to the root of the nsf (when standing on an xpage ofcourse).

./ -> this brings me also to the root of my nsf.

../ -> a step to much, the filename is cut off, so I am standing in the installation folder of my nsf.

Can you fix the broken ones? Ofcourse:

/.ibmxspres/domino -> compute: return “/.ibmxspres/domino/” + database.getFilePath() + “/” + the resource where you want to point to.

/.ibmxspres/global -> compute: “/.ibmxspres/global/” + “../../” + database.getFilePath() + “/” + the resource where you want to point to.

/.ibmxspres/dojoroot -> compute: “/.ibmxspres/dojoroot/” + “../../../” + database.getFilePath() + “/” + the resource where you want to point to.

../ -> “../” + database.getFileName() + “/” + the resource where you want to point to.

If you have a custom stylesheet called custom.css in your nsf you can refer to it in a Theme design element as followed:

<resource>
<content-type>text/css</content-type>
<href>/.ibmxspres/domino/css/custom.css</href>
</resource>

I made the sample available on Github. Hopefully next time I do not make the same mistakes with URL references. Happy development =)

Add 20 years of experience to your workforce

You can 20 years of experience within IBM Notes and Web development to your workforce by hiring me.

Interested? Read my curriculum vitae on LinkedIn: http://www.linkedin.com/in/patrickkwinten and get in contact.

I am happy to work WITH you !

 

 

Working with LinkedIn in XPages – People Search

Here is another example for accessing LinkedIn’s API’s in XPages. This example contains code for performing a people search within your network.

I will include the example later in the next release of LinkedIn controls.

<?xml version=”1.0″ encoding=”UTF-8″?>
<xp:view xmlns:xp=”http://www.ibm.com/xsp/core&#8221;
xmlns:xc=”http://www.ibm.com/xsp/custom&#8221; createForm=”false”>
<head>
<title>LinkedIn JavaScript API Sample Application</title>
<xc:ccLinkedInAPIKey key=”//your  domain key here”></xc:ccLinkedInAPIKey>
<script type=”IN/Login”></script>
<xp:scriptBlock id=”scriptBlock3″>
<xp:this.value><![CDATA[function PeopleSearch() {
// Call the PeopleSearch API with the viewer’s keywords
// Ask for 4 fields to be returned: first name, last name, distance, and Profile URL
// Limit results to 10 and sort by distance
// On success, call displayPeopleSearch(); On failure, do nothing.
var keywords = dojo.byId(“#{id:searchBox}”).value;
IN.API.PeopleSearch()
.fields(‘firstName’, ‘lastName’, ‘distance’, ‘siteStandardProfileRequest’)
.params({‘keywords’: keywords, ‘count’: 10, ‘sort’: ‘distance’})
.result(displayPeopleSearch)
.error(function error(e) { /* do nothing */ }
);
}]]></xp:this.value>
</xp:scriptBlock>
<xp:scriptBlock id=”scriptBlock4″>
<xp:this.value><![CDATA[function displayPeopleSearch(peopleSearch) {
var div = document.getElementById(“peopleSearchResults”);
div.innerHTML = “<ul>”;
// Loop through the people returned
var members = peopleSearch.people.values;
for (var member in members) {

// Look through result to make name and url.
var nameText = members[member].firstName + ” ” + members[member].lastName;
var url = members[member].siteStandardProfileRequest.url;

// Turn the number into English
var distance = members[member].distance;
var distanceText = ”;
switch (distance) {
case 0: // The viewer
distanceText = “you!”
break;
case 1: // Within three degrees
case 2: // Falling through
case 3: // Keep falling!
distanceText = “a connection ” + distance + ” degrees away.”;
break;
case 100: // Share a group, but nothing else
distanceText = “a fellow group member.”;
break;
case -1: // Out of netowrk
default: // Hope we never get this!
distanceText = “far, far, away.”;
}
div.innerHTML += “<li><a href=\”” + url + “\”>” + nameText +
“</a> is ” + distanceText + “</li>”
}
div.innerHTML += “</ul>”;
}]]></xp:this.value>
</xp:scriptBlock>

</head>

<h1>Find People on LinkedIn</h1>
<xp:inputText id=”searchBox” defaultValue=”xpages”></xp:inputText>
<xp:button value=”Search” id=”button1″>
<xp:eventHandler event=”onclick” submit=”false”>
<xp:this.script><![CDATA[
PeopleSearch();]]></xp:this.script>
</xp:eventHandler>
</xp:button>
<div id=”peopleSearchForm”></div>
<div id=”peopleSearchResults”></div>
</xp:view>

Custom control ccLinkedInAPIKey you can find in the LinkedIn controls project.

Without any styling your result could look something similar like this: