Function

Static Public Summary
public	analytics(options: Object) Track an event with our analytics library
public	channel(channelName: String): * Sets up the channel for subcriptions.
public	coverVid(elem: , width: , height: *)
public	fitText($el: jQuery Object, options: Object) Scales text to fit within a given area
public	flamsteed(data: Object \| String) Log an event with Flamsteed
public	highlight(el: , words: , options: ):
public	isDev(): *
public	isJson(value: string): Boolean Test the value to see if it's a JSON string
public	matchMedia(query: String, callback: Function) Checks against a specified media query string.
public	publish(topic: String, channel: String): * Decorator for publishing on an event bus (postal).
public	subscribe(topic: String, channel: String): * Decorator for listening on an event bus (postal).
public	track(trackingFn: Function \| String, options: Object): Function Use when you need to track a method call w/ the `trackEvent` utility.
public	trackEvent(options: Object) Abstraction over tracking services such as Flamsteed and Google Analytics

Static Public

public analytics(options: Object) source

import analytics from 'rizzo-next/src/core/events/trackers/analytics.js'

Track an event with our analytics library

Params:

Name	Type	Attribute	Description
options	Object		An object with event data

public channel(channelName: String): * source

import channel from 'rizzo-next/src/core/decorators/channel.js'

Sets up the channel for subcriptions. Keep in mind that after you use it, all other subscriptions underneath will use the same channel

Params:

Name	Type	Attribute	Description
channelName	String		Channel name for the class

Return:

Example:

import "publish" from "path/to/core/decorators/publish"

class FooComponent () {
  @subscribe("foo.some.other")
  @channel("foobar")
  anotherMethod() {
    // ...
  }
  @subscribe("foo.yet.another")
  anotherMethod() {
    // Still on the "foobar channel"
  }
  @subscribe("foo.yet.another")
  @channel("another")
  anotherMethod() {
    // Now we're on another channel
  }
}

See:

public coverVid(elem: , width: , height: *) source

import coverVid from 'rizzo-next/src/core/utils/covervid.js'

Params:

Name	Type	Attribute	Description
elem	*
width	*
height	*

public fitText($el: jQuery Object, options: Object) source

import fitText from 'rizzo-next/src/core/utils/fitText.js'

Scales text to fit within a given area

In order to scale the text, a span is wrapped around the $el's text; this allows for the width of the text to be calculated. The width of the $el is also calculated and those two widths are used to create a ratio in which to divide the minFontSize by.

Params:

Name	Type	Attribute	Description
$el	jQuery Object		The element where the text will be scaled
options	Object		An array of options; currently `minFontSize` is the only accepted key

Example:

fitText(this.$el.find(".js-masthead-title"), {
  minFontSize: 56
});

public flamsteed(data: Object | String) source

import flamsteed from 'rizzo-next/src/core/events/trackers/flamsteed.js'

Log an event with Flamsteed

Params:

Name	Type	Attribute	Description
data	Object \| String		An object containing data to log, or a string description of an event

public highlight(el: , words: , options: ): source

import highlight from 'rizzo-next/src/core/utils/highlight.js'

Params:

Name	Type	Attribute	Description
el	*
words	*
options	*

Return:

public isDev(): * source

import isDev from 'rizzo-next/src/core/utils/is_dev.js'

Return:

public isJson(value: string): Boolean source

import isJson from 'rizzo-next/src/core/utils/is_json.js'

Test the value to see if it's a JSON string

Params:

Name	Type	Attribute	Description
value	string		String to test

Return:

Boolean

public matchMedia(query: String, callback: Function) source

import matchMedia from 'rizzo-next/src/core/utils/matchMedia.js'

Checks against a specified media query string. Adds a listener for matchMedia and runs a callback function when the media query matches.

Params:

Name	Type	Attribute	Description
query	String		Media query to listen for
callback	Function		Callback function to run when the query matches.

Example:

import matchMedia from "../../core/utils/matchMedia";

matchMedia("(min-width: 720px)", (query) => {
  if (query.matches) {
    // do this
  } else {
    // do that
  }
});

public publish(topic: String, channel: String): * source

import publish from 'rizzo-next/src/core/decorators/publish.js'

Decorator for publishing on an event bus (postal). Whatever the decorated function returns gets published as the data. Will search the class for a channel, or use / by default.

Params:

Name	Type	Attribute	Description
topic	String		Topic to publish on
channel	String		Channel to publish on

Return:

Example:

import "publish" from "path/to/core/decorators/publish"

class FooComponent () {
  @publish("foo.some.message")
  someMethod() {
    return {
      my: "data"
    };
  }
  @publish("foo.some.other")
  anotherMethod() {
    // ...
  }
}

import subscribe from 'rizzo-next/src/core/decorators/subscribe.js'

Decorator for listening on an event bus (postal).
Will search the class for a channel, or use / by default.
NOTE: You have to call this.subscribe() in the constructor in order to have postal actually attatch the listeners correctly.

Params:

Name	Type	Attribute	Description
topic	String		Topic to listen for
channel	String		The channel to listen on

Return:

Example:

Default Channel

import publish from "path/to/core/decorators/publish"

class FooComponent () {
  constructor() {
    // This is required
    this.subscribe();
  }
  @subscribe("foo.some.message")
  someMethod(data, evnelope, subscription) {
    
  }
  @subscribe("foo.some.other")
  anotherMethod(data, evnelope, subscription) {
    // ...
  }
}

Custom Channel

import publish from "path/to/core/decorators/publish"

class FooComponent () {
  constructor() {
    // This is required
    this.subscribe();
  }
  @subscribe("foo.some.message", "custom")
  someMethod(data, envelope, subscription) {
    // ...
  }
}

Channel decorator

import publish from "path/to/core/decorators/publish";
import channel from "path/to/core/decorators/channel"

class FooComponent () {
  constructor() {
    // This is required
    this.subscribe();
  }
  @subscribe("foo.some.message")
  @channel("custom")
  someMethod(data, envelope, subscription) {
    // ...
  }
}

public track(trackingFn: Function | String, options: Object): Function source

import track from 'rizzo-next/src/core/decorators/track.js'

Use when you need to track a method call w/ the trackEvent utility. The value returned will be passed as data to trackEvent. If a function is used for the trackingFn, it must return an object w/ a name, and optional data

Params:

Name	Type	Attribute	Description
trackingFn	Function \| String		Either a function to build up the event data or a string event name.
options	Object	optional	An opject of options
options.sendReturnValue	Boolean	optional	Whether or not to send the return value as data

Return:

Function

The decorator function

Example:

String Tracking


class Foo {
  @track("Button Clicked")
  buttonClicked() {
    // ...
    return { some: "data" };
  }
}

Function


import FooTracker from "./foo.tracker";

class Foo {
  @track(FooTracker.clicked)
  buttonClicked() {
    // ...
    return { some: "data" };
  }
}

// foo.tracker.js

export default function clicked(data) {
  // data = { some: "data" } 
  data.otherData = "other data";
  
  return { 
    name: "Button Clicked",
    data
  };
}

String Tracking w/ sendReturnValue false


class Foo {
  @track("Button Clicked").sendReturnValue(false)
  buttonClicked() {
    // ...
    return { some: "data" };
  }
}

public trackEvent(options: Object) source

import trackEvent from 'rizzo-next/src/core/events/track_event.js'

Abstraction over tracking services such as Flamsteed and Google Analytics

Params:

Name	Type	Attribute	Description
options	Object
options.name	String		The name of the event
options.data	String \| Object		Details of the event
options.trackers	Array	optional	An array of string names of trackers to use.

Function

Static Public

public analytics(options: Object) source

Params:

public channel(channelName: String): * source

Params:

Return:

Example:

See:

public coverVid(elem: *, width: *, height: *) source

Params:

public fitText($el: jQuery Object, options: Object) source

Params:

Example:

public flamsteed(data: Object | String) source

Params:

public highlight(el: *, words: *, options: *): * source

Params:

Return:

public isDev(): * source

Return:

public isJson(value: string): Boolean source

Params:

Return:

public matchMedia(query: String, callback: Function) source

Params:

Example:

public publish(topic: String, channel: String): * source

Params:

Return:

Example:

public subscribe(topic: String, channel: String): * source

Params:

Return:

Example:

public track(trackingFn: Function | String, options: Object): Function source

Params:

Return:

Example:

public trackEvent(options: Object) source

Params:

public coverVid(elem: , width: , height: *) source

public highlight(el: , words: , options: ): source