The content hub - tips and tricks#

../../_images/01.png

Content Hub Share Page#

On Ubuntu Touch the apps are confined. The way of sharing files between them is through the Content Hub, a part of the system that takes care of file import, export and sharing.

Different ways of sharing the content#

As we can see in the Content Hub documentation, there are several ways of handling the file to be shared:

  • ContentHandler.Source (The selected app will provide a file to be imported)

  • ContentHandler.Destination (The selected app will be the destination for the exported file)

  • ContentHandler.Share (The selected app will be the destination for the exported file, which will then be shared externally)

../../_images/12.svg

Importing#

../../_images/02.png

Webapp Creator on the OpenStore#

Looking into the code of Webapp Creator, we’ll find the code to import an image to be used as icon. Tapping on the place holder will open the Content Hub that will let us choose from where to import the image (see the Webapp Creator source code)

ContentPeerPicker {
    anchors { fill: parent; topMargin: picker.header.height }
    visible: parent.visible
    showTitle: false
    contentType: picker.contentType //ContentType.Pictures
    handler: picker.handler //ContentHandler.Source

ContentPeerPicker is the element that shows the apps.

var importPage = mainPageStack.push(Qt.resolvedUrl("ImportPage.qml"),{"contentType": ContentType.Pictures, "handler": ContentHandler.Source})

contentType is passed in Main.qml as ContentType.Pictures. So, we will only see apps from which we only can import images. handler is passed in the same line as ContentHandler.Source. As we want to import an image from the app selected in the Content Hub.

Exporting#

../../_images/04.png

Gelek in the OpenStore#

In Gelek, we are going to end with some saved games that we want to save in our device or share with ourselves (in Telegram and then save them to our computer).

../../_images/05.png

Tapping on the download icon we will get a Content Hub to save the game file (which is actually an export).

The game file is a file of type glksave. We will tell Content Hub that we are sending a file of type All (see the Install Page code).

ContentPeerPicker {
    anchors { fill: parent; topMargin: picker.header.height }
    visible: parent.visible
    showTitle: false
    contentType: ContentType.All
    handler: ContentHandler.Destination

    onPeerSelected: {

contentType is ContentType.All, so we will only see apps which are able to receive unmarked file types. handler is ContentHandler.Destination, so the app selected should store the saved game.

Tapping on the File Manager we will save the saved game in the folder we choose.

Sharing#

Similarly, tapping on the share icon will allow us to send the saved game through Telegram to ourselves (see the Webapp Creator Import Page source code). Sharing is similar to exporting, except the destination app may share the content externally (for example, over Telegram or text message).

ContentPeerPicker {
    anchors { fill: parent; topMargin: picker.header.height }
    visible: parent.visible
    showTitle: false
    contentType: picker.contentType //ContentType.Pictures
    handler: picker.handler //ContentHandler.Source

    onPeerSelected: {

The only difference between this and the previous code is that handler is ContentHandler.Share.

Wait a minute. Why the different apps?#

../../_images/08.png

Content Hub: Export vs Share#

Each developer can decide the rules each app would follow in relation to the Content Hub. Why the OpenStore is shown as the destination of an export?

Let’s check its manifest.json

"hooks": {
    "openstore": {
        "apparmor": "openstore/openstore.apparmor",
        "desktop": "openstore/openstore.desktop",
        "urls": "openstore/openstore.url-dispatcher",
        "content-hub": "openstore/openstore-contenthub.json"
    }
},

The above code defines that the hooks for the app named "openstore" in relation to the "content-hub" should follow the rules defined in openstore-contenthub.json

{
    "destination": [
        "all"
    ]
}

This means, the OpenStore will be the destination for all ContentTypes.

What about uMatriks? Let’s see its content-hub.json

{
    "destination": [
        "pictures",
        "documents",
        "videos",
        "contacts",
        "music"
    ],
    "share": [
        "pictures",
        "documents",
        "videos",
        "contacts",
        "music"
    ],
    "source": [
        "pictures",
        "documents",
        "videos",
        "contacts",
        "music"
    ]
}

So, with this example, uMatriks will be able to be the destination, source and share app for all kinds of ContentType. What about the other hooks in the manifest.json? That is discussed in the next guide.