Extensions

The extension system in DrEdition is currently under development.

Extensions support UI-updates with external data for a) creating and monitoring A/B tests (variants) on teasers and b) to monitor article analytics data per item.

Prerequisites

  • To enable DrEdition to use the external script from your server you have to enable Cross-Origin Resource Sharing (CORS) for the resource.

  • The script must be loaded over HTTPS for the browser to load it.

  • The script must declare a function called onInit which is explained below.

Setup

Extensions are loaded using plugins in DrEdition. Start by register a new plugin in the DrEdition settings and provide the URL from where it should be loaded.

This is the minimal required settings schema that must be configured on the plugin.

Settings Schema
{
"type": "object",
"properties": {
"url": {
"type": "string"
}
}
}

API

onInit(API:Object, settings:Object, done:Function)

This function will be called by DrEdition and provide the extension with the API object and settings for the plugin. Note that the done callback must be run when the extension is ready.

getEdition()

Returns a `Promise` with the currently loaded edition.

getProduct()

Returns a `Promise` with the currently loaded product.

on(event:String, callback:Function)

Adds a listener function to the specified event.

Event name

Description

EditionItemsChange

Triggered when an item is added/removed from an edition

off(event:String, callback:Function)

Removes a listener function from the specified event.

log(...args)

Alias for console.log.

error(...args)

Alias for console.error.

setEditionItemVariantStatisticalData(itemId:String, data:Object)

Update the A/B testing status that's visible in the UI.

Info displayed when editing an edition item
Info displayed on an item in the edition items list
API.setEditionItemVariantStatisticalData('item-1', {
winner: 'B',
progress: 100,
variants: [
{
id: '59bea0c26699d569199e78f1',
winningChance: 12.5
},
{
id: '59bea0c26699d569199e78f0',
winningChance: 87.5
}
]
});

Property

Type

Description

winner

String

Will show a suggested winner in the UI

progress

Number

A number between 0 and 100 to indicate how much stats that has been gathered

variants[].id

String

The ID of the item variant used in the test

variants[].winningChance

Number

A number between 0 and 100 to indicate what variant is performing the best

setEditionItemAnalyticsData(itemId:String, data:Object)

Set analytics data to be displayed in the DrEdition UI for the given edition item.

Info displayed on the item when analytics has been enabled (see button in the toolbar)
API.setEditionItemAnalyticsData('item-1', {
ranges: {
today: {
rank: 5,
trend: -1,
labels: [
{
title: 'Click Ratio',
label: 'CR',
value: '57%'
}
]
},
hour: {
rank: 3,
trend: 4,
labels: [
{
title: 'Click Ratio',
label: 'CR',
value: '79%'
}
]
}
}
});

Property

Type

Description

ranges

Object

Contains data for one or more range for the given item

ranges[range].rank

Number

A positive number to indicate the ranking

ranges[range].trend

Number

A negative or positive number to indicate the trend

ranges[range].labels

Array

A list of one or more labels to display on the item

ranges[range].labels[].title

String

Displayed as a tooltip when hovering the label

ranges[range].labels[].label

String

Displayed combined with the value on the item

ranges[range].labels[].value

String

Displayed combined with the label on the item

We currently support the range to be one of the following: today hour 15min 5min 1min

Examples

Item variant statistics (A/B testing)

To enable the A/B testing features in the DrEdition UI you have to name the plugin variant-statisticsHere's the full source to an example extension that will update the UI with stats from an external system.

Item analytics

To enable item analytics in the DrEdition UI you have to name the plugin edition-item-analytics Here's the full source to an example extension that will update the UI with analytics from an external system.