ibm-wch-sdk-rendition-utils

Exposes framework independent APIs to support the implementation of ibm-wch-sdk-ng and similar SDK.

Details

Refer to the documentation.

Changes

CHANGELOG

Class documentation

Refer to the documentation.

Utils

TBD

Changelog

Current

Added

• Initial version

@ibm-wch-sdk/rendition-utils

Index

External modules

• "index"
• "utils/empty.image"
• "utils/rendition.utils"

@ibm-wch-sdk/rendition-utils > "index"

External module: "index"

Index

@ibm-wch-sdk/rendition-utils > "utils/empty.image"

External module: "utils/empty.image"

Index

Variables

• TRANSPARENT_PIXEL

Variables

<Const> TRANSPARENT_PIXEL

● TRANSPARENT_PIXEL: "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" = "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="

Defined in utils/empty.image.ts:1

@ibm-wch-sdk/rendition-utils > "utils/rendition.utils"

External module: "utils/rendition.utils"

Index

Interfaces

• Dimension
• RenditionBean
• ScaledImage

Variables

• DEFAULT_RENDITION
• LOGGER
• RENDITION_REGEXP
• _mathFloor
• _mathRound
• jsonStringify

Functions

• _appendQueryString
• _approx
• _binaryIndexOf
• _clip
• _compareByAspect
• _compareByWidth
• _compareByWidthAndHeight
• _compareNumbers
• _createDimension
• _createRenditionBean
• _equalsWidth
• _findBestAspects
• _findBestWidth
• _findByWidth
• _getDecodedQueryString
• _getRendition
• _getScaledImageFromRendition
• _getScaledImageFromRenditionBean
• _getSourceSet
• _parseNumber
• _round

Variables

<Const> DEFAULT_RENDITION

● DEFAULT_RENDITION: "default" = "default"

Defined in utils/rendition.utils.ts:8

<Const> LOGGER

● LOGGER: "RenditionDirective" = "RenditionDirective"

Defined in utils/rendition.utils.ts:4

<Const> RENDITION_REGEXP

● RENDITION_REGEXP: RegExp = /resize=(\d+)(?:px)?:(\d+)(?:px)?&crop=(\d+)(?:px)?:(\d+)(?:px)?;(\d+)(?:px)?,(\d+)(?:px)?/

Defined in utils/rendition.utils.ts:287

Regular expression to detect the renditions settings. Make sure to not use the 'g' flag!

<Const> _mathFloor

● _mathFloor: floor = Math.floor

Defined in utils/rendition.utils.ts:51

<Const> _mathRound

● _mathRound: round = Math.round

Defined in utils/rendition.utils.ts:52

<Const> jsonStringify

● jsonStringify: stringify = JSON.stringify

Defined in utils/rendition.utils.ts:6

Functions

_appendQueryString

▸ _appendQueryString(aBaseUrl: string, aQueryString: string): string

Defined in utils/rendition.utils.ts:62

Appends a query string to a base URL that may or may not have a query part. If it has a query, the previous query is removed

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aBaseUrl | string | current base URL | | aQueryString | string | string to append |

Returns: string the resulting URL

_approx

▸ _approx(aNumber: number): number

Defined in utils/rendition.utils.ts:76

Approximate a floating number to a fixed number of decimals

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aNumber | number | number to approximate |

Returns: number the approximated number

_binaryIndexOf

▸ _binaryIndexOf<T,K>(aSearchElement: K, aArray: T[], aCmp: function): number

Defined in utils/rendition.utils.ts:118

Executes a binary search for an element

Type parameters:

T

K

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aSearchElement | K | element to look for | | aArray | T[] | array to search | | aCmp | function | comparision function |

Returns: number the index

_clip

▸ _clip(aValue: number, aMin: number, aMax: number): number

Defined in utils/rendition.utils.ts:334

Clips a value against the given boundaries

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aValue | number | the value to clip | | aMin | number | the min value | | aMax | number | the max value |

Returns: number the clipped value

_compareByAspect

▸ _compareByAspect(aLeft: RenditionBean, aRight: RenditionBean): number

Defined in utils/rendition.utils.ts:161

Compares renditions by aspect

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aLeft | RenditionBean | left value to compare | | aRight | RenditionBean | right value to compare |

Returns: number comparison result

_compareByWidth

▸ _compareByWidth(aLeft: Rendition | RenditionBean, aRight: Rendition | RenditionBean): number

Defined in utils/rendition.utils.ts:172

Compares renditions by width

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aLeft | Rendition | RenditionBean | left value to compare | | aRight | Rendition | RenditionBean | right value to compare |

Returns: number comparison result

_compareByWidthAndHeight

▸ _compareByWidthAndHeight(aLeft: Rendition | RenditionBean, aRight: Rendition | RenditionBean): number

Defined in utils/rendition.utils.ts:187

Compares renditions by width

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aLeft | Rendition | RenditionBean | left value to compare | | aRight | Rendition | RenditionBean | right value to compare |

Returns: number comparison result

_compareNumbers

▸ _compareNumbers(aLeft: number, aRight: number): number

Defined in utils/rendition.utils.ts:150

Safe number comparison

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aLeft | number | left value to compare | | aRight | number | right value to compare |

Returns: number comparison result

_createDimension

▸ _createDimension(aWidth: number, aHeight: number): Dimension

Defined in utils/rendition.utils.ts:26

Constructs a dimensions object based on width and height

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aWidth | number | the width | | aHeight | number | the height |

Returns: Dimension the dimension object

_createRenditionBean

▸ _createRenditionBean(aTargetAspect: number, aRendition: Rendition, aImage: Image): RenditionBean

Defined in utils/rendition.utils.ts:88

Constructs the rendition bean based on the actual rendition

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aTargetAspect | number | desired target aspect | | aRendition | Rendition | the rendition | | aImage | Image |

Returns: RenditionBean the bean

_equalsWidth

▸ _equalsWidth(aLeft: Rendition | RenditionBean, aRight: Rendition | RenditionBean): boolean

Defined in utils/rendition.utils.ts:202

Tests if the width of two renditions is equal

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aLeft | Rendition | RenditionBean | left rendition | | aRight | Rendition | RenditionBean | right rendition |

Returns: boolean true if equal

_findBestAspects

▸ _findBestAspects(aRenditions: RenditionBean[], aLogger: Logger): RenditionBean[]

Defined in utils/rendition.utils.ts:230

Returns a list of renditions with the best matching aspect ratio

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aRenditions | RenditionBean[] | the renditions | | aLogger | Logger | the logger |

Returns: RenditionBean[] the renditions with the best matching aspect ratio

_findBestWidth

▸ _findBestWidth(aWidth: number, aRenditions: RenditionBean[], aLogger: Logger): RenditionBean | undefined

Defined in utils/rendition.utils.ts:257

Find the rendition with the best width, i.e. the closest width that is larger than the given width

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aWidth | number | desired width | | aRenditions | RenditionBean[] | renditions | | aLogger | Logger | the logger |

Returns: RenditionBean | undefined the selected rendition

_findByWidth

▸ _findByWidth(aLeft: number, aRight: Rendition | RenditionBean): number

Defined in utils/rendition.utils.ts:216

Compares renditions by width

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aLeft | number | left value to compare | | aRight | Rendition | RenditionBean | right value to compare |

Returns: number comparison result

_getDecodedQueryString

▸ _getDecodedQueryString(aUrl: string): string | undefined

Defined in utils/rendition.utils.ts:295

Checks if the URL has a query string and decodes it if so.

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aUrl | string | the URL |

Returns: string | undefined the decoded query string or undefined

_getRendition

▸ _getRendition(aDstWidth: number, aDstHeight: number, aImage: Image, aLogger: Logger): ScaledImage

Defined in utils/rendition.utils.ts:516

Builds a query string for the Akamai rendition service such that the resulting image matches the desired dimensions. The algorithm first finds the renditions with the best matching aspect ratio. Out of the result set it then selects the nearest rendition that is large or equal in size, because that most likely represents the desired excerpt best. It then fixes the aspect ration and computes the new transform.

In case the image would be scaled up, we return the identity scaling and let the browser scale the image.

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aDstWidth | number | desired image width | | aDstHeight | number | desired image height | | aImage | Image | the image | | aLogger | Logger | the logger |

Returns: ScaledImage the URL string

_getScaledImageFromRendition

▸ _getScaledImageFromRendition(aRenditionName: string, aImage: Image, aLogger: Logger): ScaledImage

Defined in utils/rendition.utils.ts:480

Returns the scaled image given the rendition name explicitly

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aRenditionName | string | the name of the rendition | | aImage | Image | the image | | aLogger | Logger | the actual logger |

Returns: ScaledImage the scaled image

_getScaledImageFromRenditionBean

▸ _getScaledImageFromRenditionBean(aDstWidth: number, aDstHeight: number, aBean: RenditionBean, aLogger: Logger): ScaledImage

Defined in utils/rendition.utils.ts:353

Builds a query string for the Akamai rendition service such that the resulting image matches the desired dimensions. The algorithm first finds the renditions with the best matching aspect ratio. Out of the result set it then selects the nearest rendition that is large or equal in size, because that most likely represents the desired excerpt best. It then fixes the aspect ration and computes the new transform.

In case the image would be scaled up, we return the identity scaling and let the browser scale the image.

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aDstWidth | number | desired image width | | aDstHeight | number | desired image height | | aBean | RenditionBean | the rendition bean | | aLogger | Logger | the logger |

Returns: ScaledImage the URL string

_getSourceSet

▸ _getSourceSet(aImage: Image, aOrigin: string): string

Defined in utils/rendition.utils.ts:554

Computes the source set from the available renditions

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aImage | Image | the image | | aOrigin | string | the origin |

Returns: string the source set

_parseNumber

▸ _parseNumber(aValue: string): number

Defined in utils/rendition.utils.ts:312

Parses a string into a number

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aValue | string | the value to parse |

Returns: number the decoded string

_round

▸ _round(aValue: number): number

Defined in utils/rendition.utils.ts:322

Rounding function

Parameters:

| Name | Type | Description | | ------ | ------ | ------ | | aValue | number | the value to round |

Returns: number the rounded value

@ibm-wch-sdk/rendition-utils

Index

External modules

• "index"
• "utils/empty.image"
• "utils/rendition.utils"

@ibm-wch-sdk/rendition-utils > "utils/rendition.utils" > Dimension

Interface: Dimension

Exposes the concept of a dimension

Hierarchy

Dimension

Index

Properties

• h
• w

Properties

h

● h: number

Defined in utils/rendition.utils.ts:15

w

● w: number

Defined in utils/rendition.utils.ts:14

@ibm-wch-sdk/rendition-utils > "utils/rendition.utils" > RenditionBean

Interface: RenditionBean

Hierarchy

RenditionBean

Index

Properties

• aspect
• diff
• height
• image
• rendition
• width

Properties

aspect

● aspect: number

Defined in utils/rendition.utils.ts:44

diff

● diff: number

Defined in utils/rendition.utils.ts:47

height

● height: number

Defined in utils/rendition.utils.ts:46

image

● image: Image

Defined in utils/rendition.utils.ts:42

rendition

● rendition: Rendition

Defined in utils/rendition.utils.ts:43

width

● width: number

Defined in utils/rendition.utils.ts:45

@ibm-wch-sdk/rendition-utils > "utils/rendition.utils" > ScaledImage

Interface: ScaledImage

Hierarchy

ScaledImage

Index

Properties

• container
• image
• img
• url

Properties

container

● container: Dimension

Defined in utils/rendition.utils.ts:37

image

● image: Image

Defined in utils/rendition.utils.ts:35

img

● img: Dimension

Defined in utils/rendition.utils.ts:36

url

● url: string

Defined in utils/rendition.utils.ts:38