SmartBuilding How-to

From Sense/Net 6.0 Wiki

In this tutorial, you will create two simple SmartPages for displaying content data, and learn how to utilize the Workspace Content Type as a point of aggregation. To learn what a SmartPage is, see this explanation.

[edit] Create a Smart Page

[edit] Create the Content

First off, we need data to display. Let us create a simple Content Type.

1. Open the Content Explorer
2. Click New Content in the toolbar
3. Select Content Type Definition from the list of Content Types
4. Paste the following xml into the textbox that appears.
5. Click Create. Congratulations, you have created the type.

<ContentType name="Artist" parentType="GenericContent"
  handler="SenseNet.ContentRepository.GenericContent"
  xmlns="http://schemas.sensenet.hu/SenseNet/ContentRepository/ContentTypeDefinition">
  <Title>Artist</Title>
  <Description>Content type for storing
    data on musicians</Description>
  <Fields>
    <Field name="FullName" type="ShortText">
      <Title>Full Name</Title>
      <Bind property="DisplayName" />
    </Field>
    <Field name="Discography" type="LongText">
      <Title>Discography</Title>
      <Description>Discography in HTML format</Description>
    </Field>
  </Fields>
</ContentType>

Now that we have defined the Content Type, let's make an Artist Content to display!

1. Navigate to /YourInternet
2. Click New Content and select Artist
3. Let's say, enter Jacko for Name, and Michael Jackson for Full Name. Feel free to enter a simple Discography, but that is not necessary for now.
4. Click Create

[edit] Create the renderer

Currently the prototype portlets created for SmartPages primarily support XSLT Renderers instead of Content Views, so let's create a simple renderer for our Content Type.

1. Navigate to /Root/System/SystemPlugins/Renderers. This is where Xslt renderers should be kept.
2. Create a new Folder named GenreWs
3. In that folder, Create a new File named Artist.xslt
4. Enter the following into the Binary field of your file, and click Save

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns:msxsl="urn:schemas-microsoft-com:xslt"
                xmlns:snc="sn://SenseNet.Portal.UI.ContentTools"
                xmlns:snf="sn://SenseNet.Portal.UI.XmlFormatTools"
                exclude-result-prefixes="msxsl">
 
  <xsl:output method="html" indent="yes" omit-xml-declaration="yes" />
 
  <xsl:template match="/">
    <xsl:call-template name="Main">
      <xsl:with-param name="Context" select="/Content" />
    </xsl:call-template>
  </xsl:template>
 
  <xsl:template name="Main">
    <xsl:param name="Context" select="/Content" />
    <div>
      <p>
        <strong>Name:</strong>
        <xsl:value-of select="$Context/Fields/FullName" />
      </p>
      <div>
        <h3>Discography:</h3>
        <xsl:value-of select="$Context/Fields/Discography" disable-output-escaping="yes"/>
      </div>
    </div>
  </xsl:template>
 
</xsl:stylesheet>

[edit] Create the page

Now that we have our Content Type, let's create a Smart Page to display it.

1. In the Content Explorer, navigate to /Root/System/Apps
2. Click New Content and select Page
3. Name the Page Artist, and select any of the Page Templates available
4. That's all you need to enter right now, click Create

We now have a Smart Page to display Artists.

Now, enter the following URL into a new tab of your browser:

http://{your.Sense/Net.6.0.host}/Jacko

An almost empty page should show up.

1. Now, open the Portal Remote Control
2. Click Add Portlet
3. Select the Context bound Content Portlet prototype
4. Place the Portlet in a comfortable location, and open its Edit dialog
5. Set Bind to Current Content
6. Set RenderingMode to Xslt
7. Enter /Root/System/SystemPlugins/Renderers/GenreWs/Artist.xslt as the Xslt renderer path
8. Enter Artist details as the Title of the Portlet
9. Click Ok and Publish the Page

You should now see Name: Michael Jackson, with anything you entered as Discography shown below. Congratulations, your SmartPage is fully operational.

[edit] Create a Workspace

Now, let's create a Workspace to store Artists. The Workspace Content Type is a point of aggregation, which serves as a collection of items below it, and an easily accessible root for these items.

[edit] Create a Workspace Type

1. In the Content Explorer, click Create
2. From the list, select Content Type
3. Paste the following xml into the textbox that appears.
4. Click Create

<ContentType name="GenreWorkspace" parentType="Workspace"
  handler="SenseNet.Portal.Workspaces.Workspace"
  xmlns="http://schemas.sensenet.hu/SenseNet/ContentRepository/ContentTypeDefinition">
  <Title>Genre Workspace</Title>
  <Description>Workspace type for storing
    Artist Contents of a specific Genre</Description>
  <Fields></Fields>
</ContentType>

You might notice that we haven't defined any new Fields, and we might even have used the base Workspace Content Type. That is not exactly true, though. We created this Content Type so we can define a special SmartPage for it.

[edit] Create the Genre Workspace SmartPage

1. In the Content Explorer, navigate to /Root/System/Apps
2. Click New Content and select Page
3. Name the Page GenreWorkspace, and select any of the Page Templates available
4. Click Create

Now that we have created the Page, we need to set it up properly. With the Artist page, we defined an Artist Content first, and accessed the SmartPage for editing by navigating to that Content. This time, we'll try something different.

1. Open a new browser window, and navigate to http://{your.Sense/Net.6.0.host}/Root/System/Apps/Genreworkspace
2. An almost empty page should show up. In the Portal Remote Control, click Add Portlet
3. Select the Context bound Content Collection Portlet prototype
4. Place the Portlet in a comfortable location, and open its Edit dialog
5. Set Bind to Current Content
6. Enter Artists as the Bind_RelativeContextPath. This is a folder under the Workspace that we'll be creating soon.
7. Set RenderingMode to Xslt
8. Enter /Root/System/SystemPlugins/Renderers/WsCommon/RecentDocs.xslt as the Xslt renderer path. This is a Renderer for displaying folder contents on a dashboard-style page.
9. Enter Artists as the Title of the Portlet
10. Click Ok and Publish the Page

You should now see either and empty Portlet, or a Portlet containing an error message. This is completely natural, as there is no Content for the SmartPage to display right now.

[edit] Create the Workspace itself

1. In the Content Explorer, navigate to /YourInternet/Workspaces
2. Create a new GenreWorkspace, and name it Pop
3. Under the Workspace, Create a new Folder named Artists
4. Copy or move the Jacko Content you have created previously into this folder.
5. Feel free to populate the folder with more Artist Contents.
6. Navigate to http://{your.Sense/Net.6.0.host}/Workspaces/Pop

You should now see your GenreWorkspace SmartPage, with all the Artist Contents you have created displayed in the single Portlet on it. Click on Jacko. The Artist SmartPage should open, displaying the details of the Content we created earlier.

[edit] Make the Artist SmartPage Workspace-aware

Now, let's see what makes Workspaces special. You should now see a perfectly working Artist SmartPage. It's still a bit bland though, with that single Portlet. Let's spice it up a bit!

1. Open the Portal Remote Control, and click Add Portlet
2. Select the Context bound Content Portlet prototype
3. Place the Portlet in a comfortable location on the side of the Page, and open its Edit dialog
4. Set Bind to Current Workspace
5. Set RenderingMode to Xslt
6. Enter /Root/System/SystemPlugins/Renderers/WsCommon/SiteMenu.xslt as the Xslt renderer path.
7. Enter Navigation as the Title of the Portlet
8. Click Ok

You should now see a menu in the new Portlet, showing Artists, as the single subfolder of the Pop Workspace. You have linked to the Workspace from a Content inside it. No matter where this SmartPage is called from, this Portlet will always bind to and display the immediate children of the nearest Workspace - or Site, in the absence of a workspace - above it.

1. Now, click Add Portlet again.
2. Select the Breadcrumb Trail Portlet
3. Place it at the top of the Page
4. Now, click Publish on the Portal Remote Control

This should show Workspaces > Pop > Artists > Michael Jackson.

[edit] Spicing things up

I hope you got a hang of the basics of the Smart Application model and Workspaces. You might try the following to further your understanding of these topics:

• Create a Rock and Classic GenreWorkspace, populate them, and examine the behavior of Portlets
• Create an Album Content Type, a SmartPage to display it, and populated Albums folders under your GenreWorkspaces.
• Create SmartPages for Editing these Content Types.
• Examine the existing demo Workspaces in your the Sense/Net installation, and try to understand the hows and whys of the configuration of the Portlets on them.

[edit] Related pages

• SmartBuilding and the Workspace framework
• What is the Smart Application model?
• What is a Workspace?