In this article I will show how to upload a new file into IBM Smarcloud using the IBM Social Business Toolkit

Introduction

For the demonstration I am working on, I want to be able to upload a file into IBM Smartcloud and then Tag it with a value so that I may search by Tag at a later date. This article will discuss how to upload the new file and then in the next article I will discuss Tagging.

Uploading a file using Java

All Credit to this code goes to Toby Samples and it is published with his permission.

On the XPage we have the following:

• xp:div control with the id fileIdWrapper
  • inside of that DIV we have a computed xp:text which is bound to the viewScope fileId value
• A file upload control
  • Bound to viewScope.fileupload  (because we want it in Smartcloud we do not actually want it bound to the notes document)
• A button
  • Clicking the button
    • Submits the file calling the com.psclistens.sbt.Utils.addFile(uuid) Java Method – In this case the CommunityId is being passed into my custom control as a Custom Property (communityUuid).
    • triggers a partialRefresh on the fileIdWrapper which should pull the new fileId up to the client

<xp:div id="fileIdWrapper" styleClass="row">
	<div class="col-sm-3">
		<xp:label for="fieldId" styleClass="control-label" value="File Id"></xp:label>
	</div>
	<div class="col-sm-9">
		<xp:div  id="fieldId" styleClass="fileId">
			<xp:div>
				<xp:text escape="true" id="computedField1">
					<xp:this.value><![CDATA[#{javascript:viewScope.get("fileId");}]]></xp:this.value>
				</xp:text>
			</xp:div>
		</xp:div>
	</div>
</xp:div>

<xp:fileUpload id="fileUpload1"
	value="#{viewScope.fileUpload}">
</xp:fileUpload>

<xp:button value="Add File" id="button1">
	<xp:eventHandler event="onclick" submit="true"
		refreshMode="partial" refreshId="fileIdWrapper">
		<xp:this.action><![CDATA[#{javascript:
			var uuid = compositeData.get('communityUuid');
			com.psclistens.sbt.Utils.addFile(uuid);}
		]]></xp:this.action>
	</xp:eventHandler>
</xp:button>

Before

After

The Java code within the Utils class looks like this. The interesting thing (which Toby figured out) was how the XSP model handles a file submitted and bound to the viewScope. The file is accessed using the UIFileuploadedEx.UploadedFile

public static void addFile(String communityUuid) throws FileNotFoundException, FileServiceException{
	Endpoint scEndpoint = getEndpoint();
	UIFileuploadEx.UploadedFile uf = (UploadedFile) ExtLibUtil.getViewScope().get("fileUpload");
	FileInputStream fis = new FileInputStream(uf.getUploadedFile().getServerFile().getAbsoluteFile());
	FileService fileService = new FileService(scEndpoint);
	File fileEntry = new File();
	//Upload the file
	fileEntry = fileService.uploadCommunityFile(fis, communityUuid, uf.getFilename(), uf.getUploadedFile().getContentLength());
	//Add the new FileID into a viewScope variable
	ExtLibUtil.getViewScope().put("fileId", fileEntry.getFileId());

}

From this we can then see the new file within Smartcloud and the fileId as part of the URL (ce6aeb0f-12ab-45e2-9cd5-570e3ac201b8)

Conclusion

Adding a file from an XPage into Smartcloud via the Java API is pretty straight forward and simple. Once it is up there though, how do you bring it back into your application so that it can be used……? 🙂