@flourish/sdk 4.1.0 → 4.2.0

package/README.md

@@ -214,7 +214,7 @@ show_if:
   color_mode: [diverging, continuous]
 ```
 
-You can specify multiple conditions. All of these tests must pass for the setting to be displayed. For example:
+You can specify multiple conditions. Where _all_ conditions should pass for the setting to be displayed, use an object syntax. For example, the setting below will be shown if `show_x_axis` is enabled **AND** `color_mode` is set to "diverging".
 
 ```yaml
 show_if:
@@ -222,6 +222,17 @@ show_if:
   color_mode: diverging
 ```
 
+Where _any_ one combination of conditions should pass for the setting to be displayed, use an array syntax where conditions **within** an array (elements separated with `-`) operate as **OR** and conditions within an object still operate as **AND**.
+
+For example, the setting below will be shown if `chart_mode` is "line", **OR** if `chart_mode` is "bar" **AND** the "labels" data binding contains numeric data.
+
+```yaml
+show_if:
+  - chart_mode: line
+  - chart_mode: bar
+    data.data.labels.type: numeric
+```
+
 The `hide_if` option works in exactly the same way, except that the setting is hidden if the conditional test passes.
 
 ```yaml
@@ -245,7 +256,7 @@ The `template.yml` file may also include a `data` section. This section consists
 
 Once your template is published, Flourish users can change the data in the Flourish editor, and also change which columns are linked to each binding. But in your code you don’t need to worry about this because you just refer to the `key` rather than referencing the column header or index.
 
-There are two types of data binding: `column` is used when the number of columns is and must always be one; `columns` supports any number of columns, including none. 
+There are two types of data binding: `column` is used when the number of columns is and must always be one; `columns` supports any number of columns, including none.
 
 A default value must be supplied for each data binding, unless you have specified `optional: true` (only supported for single `column` bindings). The example below shows how this is done.
 
@@ -266,7 +277,7 @@ data:
   key: values
   type: columns # This binding can take any number of columns
   columns: By Decade::B-D,F # The default values are arrays drawing from columns B-D and F of `By Decade.csv`
-- name: Flag image 
+- name: Flag image
   dataset: country_scores
   key: flag_pic
   type: column
@@ -507,4 +518,4 @@ The method has 2 arguments:
 
 ```js
 takeScreenshot().then(onSuccess, onFail)
-```
+```

package/RELEASE_NOTES.md

@@ -1,3 +1,9 @@
+# 4.2.0
+* Add support for OR conditions in `show_if` and `hide_if`
+
+# 4.1.1
+* Fixes the reporting of server errors by the CLI
+
 # 4.1.0
 * Allow SDK CLI token based authentication.
 

package/common/embed/credit.d.ts

@@ -0,0 +1,5 @@
+export function createFlourishCredit(credit_url: any, query_string: any, public_url: any, credit_text: any): any;
+export function getLocalizedCreditTextAndUrl(lang: any, credit_key: any): {
+    credit_text: any;
+    credit_url: any;
+};

package/common/embed/credit.js

@@ -0,0 +1,47 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getLocalizedCreditTextAndUrl = exports.createFlourishCredit = void 0;
+const localizations_1 = __importDefault(require("./localizations"));
+function createFlourishCredit(credit_url, query_string, public_url, credit_text) {
+    credit_url = credit_url || "https://flourish.studio",
+        query_string = query_string || "?utm_source=api&utm_campaign=" + window.location.href,
+        public_url = public_url || "https://public.flourish.studio/",
+        credit_text = credit_text || "A Flourish data visualization";
+    var credit = document.createElement("div");
+    credit.setAttribute("class", "flourish-credit");
+    credit.setAttribute("style", "width:100%!important;margin:0 0 4px!important;text-align:right!important;font-family:Helvetica,sans-serif!important;color:#888!important;font-size:11px!important;font-weight:bold!important;font-style:normal!important;-webkit-font-smoothing:antialiased!important;box-shadow:none!important;");
+    var a = document.createElement("a");
+    a.setAttribute("href", credit_url + query_string);
+    a.setAttribute("target", "_top");
+    a.setAttribute("style", "display:inline-block!important;text-decoration:none!important;font:inherit!important;color:inherit!important;border:none!important;margin:0 5px!important;box-shadow:none!important;");
+    credit.appendChild(a);
+    var img = document.createElement("img");
+    img.setAttribute("alt", "Flourish logo");
+    img.setAttribute("src", public_url + "resources/bosh.svg");
+    img.setAttribute("style", "font:inherit!important;width:auto!important;height:12px!important;border:none!important;margin:0 2px 0!important;vertical-align:middle!important;display:inline-block!important;box-shadow:none!important;");
+    a.appendChild(img);
+    var span = document.createElement("span");
+    span.setAttribute("style", "font:inherit!important;color:#888!important;vertical-align:middle!important;display:inline-block!important;box-shadow:none!important;");
+    span.appendChild(document.createTextNode(credit_text));
+    a.appendChild(span);
+    return credit;
+}
+exports.createFlourishCredit = createFlourishCredit;
+function getLocalizedCreditTextAndUrl(lang, credit_key) {
+    var credit_text, credit_url;
+    lang = lang || "en", credit_key = credit_key || "";
+    credit_text = localizations_1.default[lang].credits[credit_key] || localizations_1.default.en.credits[credit_key] || localizations_1.default.en.credits.default;
+    if (typeof credit_text == "object") {
+        if (credit_text.url)
+            credit_url = credit_text.url;
+        credit_text = credit_text.text;
+    }
+    return {
+        credit_text: credit_text,
+        credit_url: credit_url
+    };
+}
+exports.getLocalizedCreditTextAndUrl = getLocalizedCreditTextAndUrl;

package/common/embed/customer_analytics.d.ts

@@ -0,0 +1,5 @@
+export function sendCustomerAnalyticsMessage(message: any): void;
+export function addAnalyticsListener(callback: any): void;
+export function removeAnalyticsListener(callback: any): void;
+export function dispatchAnalyticsEvent(message: any): void;
+export function initCustomerAnalytics(): void;

package/common/embed/customer_analytics.js

@@ -0,0 +1,114 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initCustomerAnalytics = exports.dispatchAnalyticsEvent = exports.removeAnalyticsListener = exports.addAnalyticsListener = exports.sendCustomerAnalyticsMessage = void 0;
+// Embedded code - must work in IE
+var enabled = false;
+function getLocationData() {
+    var data = {};
+    if (window._Flourish_template_id) {
+        data.template_id = window._Flourish_template_id;
+    }
+    if (window.Flourish && window.Flourish.app && window.Flourish.app.loaded_template_id) {
+        data.template_id = window.Flourish.app.loaded_template_id;
+    }
+    if (window._Flourish_visualisation_id) {
+        data.visualisation_id = window._Flourish_visualisation_id;
+    }
+    if (window.Flourish && window.Flourish.app && window.Flourish.app.loaded_visualisation) {
+        data.visualisation_id = window.Flourish.app.loaded_visualisation.id;
+    }
+    if (window.Flourish && window.Flourish.app && window.Flourish.app.story) {
+        data.story_id = window.Flourish.app.story.id;
+        data.slide_count = window.Flourish.app.story.slides.length;
+    }
+    if (window.Flourish && window.Flourish.app && window.Flourish.app.current_slide) {
+        // One indexed
+        data.slide_index = window.Flourish.app.current_slide.index + 1;
+    }
+    return data;
+}
+function sendCustomerAnalyticsMessage(message) {
+    if (!enabled)
+        return;
+    if (window.top === window.self)
+        return;
+    var embedded_window = window;
+    if (embedded_window.location.pathname === "srcdoc")
+        embedded_window = embedded_window.parent;
+    var location_data = getLocationData();
+    var message_with_metadata = {
+        sender: "Flourish",
+        method: "customerAnalytics"
+    };
+    for (var key in location_data) {
+        if (location_data.hasOwnProperty(key)) {
+            message_with_metadata[key] = location_data[key];
+        }
+    }
+    for (var key in message) {
+        if (message.hasOwnProperty(key)) {
+            message_with_metadata[key] = message[key];
+        }
+    }
+    embedded_window.parent.postMessage(JSON.stringify(message_with_metadata), "*");
+}
+exports.sendCustomerAnalyticsMessage = sendCustomerAnalyticsMessage;
+function addAnalyticsListener(callback) {
+    if (typeof callback !== "function") {
+        throw new Error("Analytics callback is not a function");
+    }
+    window.Flourish._analytics_listeners.push(callback);
+}
+exports.addAnalyticsListener = addAnalyticsListener;
+function removeAnalyticsListener(callback) {
+    if (typeof callback !== "function") {
+        throw new Error("Analytics callback is not a function");
+    }
+    window.Flourish._analytics_listeners = window.Flourish._analytics_listeners.filter(function (listener) {
+        return callback !== listener;
+    });
+}
+exports.removeAnalyticsListener = removeAnalyticsListener;
+function dispatchAnalyticsEvent(message) {
+    // If the window.Flourish object hasn't been created by the customer, they
+    // can't be listening for analytics events
+    if (!window.Flourish)
+        return;
+    window.Flourish._analytics_listeners.forEach(function (listener) {
+        listener(message);
+    });
+}
+exports.dispatchAnalyticsEvent = dispatchAnalyticsEvent;
+function initCustomerAnalytics() {
+    enabled = true;
+    var events = [
+        {
+            event_name: "click",
+            action_name: "click",
+            use_capture: true
+        },
+        {
+            event_name: "keydown",
+            action_name: "key_down",
+            use_capture: true
+        },
+        {
+            event_name: "mouseenter",
+            action_name: "mouse_enter",
+            use_capture: false
+        },
+        {
+            event_name: "mouseleave",
+            action_name: "mouse_leave",
+            use_capture: false
+        }
+    ];
+    events.forEach(function (event) {
+        document.body.addEventListener(event.event_name, function () {
+            sendCustomerAnalyticsMessage({
+                action: event.action_name
+            });
+        }, event.use_capture);
+    });
+}
+exports.initCustomerAnalytics = initCustomerAnalytics;

package/common/embed/embedding.d.ts

@@ -0,0 +1,25 @@
+export default initEmbedding;
+declare function initEmbedding(): {
+    createEmbedIframe: typeof createEmbedIframe;
+    isFixedHeight: typeof isFixedHeight;
+    getHeightForBreakpoint: typeof getHeightForBreakpoint;
+    startEventListeners: typeof startEventListeners;
+    notifyParentWindow: typeof notifyParentWindow;
+    initScrolly: typeof initScrolly;
+    createScrolly: typeof createScrolly;
+    isSafari: typeof isSafari;
+    initCustomerAnalytics: typeof initCustomerAnalytics;
+    addAnalyticsListener: typeof addAnalyticsListener;
+    sendCustomerAnalyticsMessage: typeof sendCustomerAnalyticsMessage;
+};
+declare function createEmbedIframe(embed_url: any, container: any, width: any, height: any, play_on_load: any): any;
+declare function isFixedHeight(): any;
+declare function getHeightForBreakpoint(width: any): 650 | 575 | 400;
+declare function startEventListeners(callback: any, allowed_methods: any, embed_domain: any): void;
+declare function notifyParentWindow(height: any, opts: any): void;
+declare function initScrolly(opts: any): void;
+declare function createScrolly(iframe: any, slides: any): void;
+declare function isSafari(): boolean;
+import { initCustomerAnalytics } from "./customer_analytics";
+import { addAnalyticsListener } from "./customer_analytics";
+import { sendCustomerAnalyticsMessage } from "./customer_analytics";