Class: ResponsiveUtils

Oracle® JavaScript Extension Toolkit (JET)
1.1.2

E65298-01

QuickNav

Fields

oj. ResponsiveUtils

Version:
  • 1.1.2
Since:
  • 1.1.0
Utilities for responsive pages.

Constructor

new ResponsiveUtils()

Source:

Fields

<static, constant> FRAMEWORK_QUERY_KEY :string

In the jet sass files there are variables for responsive queries like $responsiveQuerySmallUp, $responsiveQuerySmallOnly, $responsiveQueryMediumUp, etc.

These constants are used to identify these queries.

Properties:
Name Type Default Description
SM_UP string sm-up matches small and up screens
MD_UP string md-up matches medium and up screens
LG_UP string lg-up matches large and up screens
XL_UP string xl-up matches extra large and up screens
XXL_UP string xxl-up matches xxl and up screens
SM_ONLY string sm-only matches small screens only
MD_ONLY string md-only matches medium screens only
LG_ONLY string lg-only matches large screens only
XL_ONLY string xl-only matches extra large screens only
MD_DOWN string md-down matches medium and down screens
LG_DOWN string lg-down matches large and down screens
XL_DOWN string xl-down matches extra large and down screens
HIGH_RESOLUTION string high-resolution matches high resolution screems
Source:

<static, constant> SCREEN_RANGE :string

In the jet sass files there are variables for responsive screen sizes, these look something like

  • $screenSmallRange: 0, 767px;
  • $screenMediumRange: 768px, 1023px;
  • $screenLargeRange: 1024px, 1279px;
  • $screenXlargeRange: 1280px, $appContentMaxWidth;

These constants are used to identify these ranges.

Properties:
Name Type Default
SM string sm
MD string md
LG string lg
XL string xl
XXL string xxl
Source:

Methods

<static> compare(size1, size2) → {number}

Parameters:
Name Type Description
size1 oj.ResponsiveUtils.SCREEN_RANGE one of the screen size constants, for example oj.ResponsiveUtils.SCREEN_RANGE.MD
size2 oj.ResponsiveUtils.SCREEN_RANGE one of the screen size constants, for example oj.ResponsiveUtils.SCREEN_RANGE.LG
Source:
Returns:
a negative integer if the first argument is less than the second. Zero if the two are equal. 1 or greater if the first argument is more than the second.
Type
number

<static> getFrameworkQuery(frameworkQueryKey) → {string|null}

Get a framweork (built in) media query
Parameters:
Name Type Description
frameworkQueryKey oj.ResponsiveUtils.FRAMEWORK_QUERY_KEY one of the FRAMEWORK_QUERY_KEY constants, for example oj.ResponsiveUtils.FRAMEWORK_QUERY_KEY.MD_UP
Source:
Returns:
the media query to use for the framework query key passed in
Type
string | null