Intel Evo Selector

An Evo-specific version of PC Finder, focusing on in-store retailer kiosk experiences.

Contents

• Quick start
• PC Finder Tools
• Documentation
• Local development
• Project customizations

Quick start

Note: requires Node 16. Recommended version is 16.19.1.

• Clone a PC finder repo to your project directory and initialize core and CLI submodules: git clone https://github.com/rwest-interactive/intel-srt-evo-selector.git
• Within your new project directory, initialize git submodules: git submodule update --init --recursive
• Run npm i to install the required Node modules.
• Run srt build --run to compile and run a development build, which can be viewed in the Webpack dev server at localhost:8080.
  • See CLI command documentation or run srt build -h for more information on build commands.

Note: if your terminal implementation does not automatically make Node bin scripts available in the PATH, add export PATH="$PATH:./node_modules/.bin" to your bash or zsh profile in order to run the SRT CLI tool.

PC Finder tools

• PC Finder directory - directory of all currently deployed staging and production builds.
• SRT inventory converter - convert SRT inventories between CSV ↔ JSON.

Documentation

Build process documentation

Full build process documentation can be found in the SRT Core build directory. This includes detailed information on CLI commands, build configuration, and more.

SRT Core Documentation

Core developer documentation is available here. Note that it is not yet automatically updated so it may be behind the current core version.

Updated core docs may be generated locally by running srt build --docs, which will build documentation to the docs directory which can be viewed with a local dev server. This documentation is generated automatically from SRT Core modules using JSDoc.

Project customization

Extensions of SRT Core for project-specific use cases are detailed in project customizations. This documentation is generated automatically from project modules using JSDoc.

Note: changes to project modules will require running srt build --docs in order to update project README with latest documentation.

Changelog

Changes to project are tracked in CHANGELOG.md.

Local Development

Updates to project-specific functionality and configuration options are done in the customize and config modules, respectively. SRT Core files should not be modified directly unless features that affect all projects need to be added/modified.

Branches & PRs

All changes need to be created from branches, then a PR is opened and merged into master after review. The branches should be named as features, fixes or chore. EG. feat/my-new-feature, fix/broken-submit-form, chore/working-on-event-page. Please always branch from master.

Please no long running branches! EG. feat/jareds-branch.

Good PRs

• Meaningful title
• Useful description with context
• Link to a Teamwork ticket
• What was changed and why?
• How does the code solve the issue?
• Screenshots, as appropriate
• Small PRs are easier to review.
• Avoid mixing concerns inside a single PR.
• Iterate, release code that is ready, even if the full feature isn't.

Commits

To help keep things standard and uniform we use Conventional Commits. This allows us to grow and run scripts based on commits.

Here are some simple rules.

• Always start the commit with feat:, fix: or chore:.
• Keep everything lowercase when possible.
• Keep them short and concise.

Examples of some commits:

git commit -am "fix: broken events page"
git commit -am "feat: created new location type"
git commit -am "chore: linted code"

Merging

Once you follow the above commits and branching, you'll then open a PR targeting master. Once the code is reviewed by at least one person and the code is merged. CI will build the project, create a new versioned release in Github and add a changelog based on your commits. You may then distribute that code as necessary.

Project customizations

Modules

project/config

Validate content for project-specific functionality.

For information on documenting project properties, see Core.

See: core/config

• project/config
  • .settings(settings)
  • .app_settings(settings)
  • .page_settings(settings)

project/config.settings(settings)

Project general settings.

Kind: static method of project/config
See

• Extends:
• settings

Since: 1.3.2

| Param | Type | Description | | --- | --- | --- | | settings | object | | | settings.3d_module | object | Settings related to 3D module. | | [settings.slider] | object | Slider carousel settings. | | [settings.slider.enabled] | boolean | Enable/disable slider functionality. Default: true | | [settings.slider.slidesPerView] | number | Number of slides per carousel view. Default: 4 | | [settings.slider.slidesPerGroup] | number | Number of slides to move per swipe/arrow navigation. Default: 1 |

Example

"settings": {
  "3d_module": { ... },
  "slider": {
    "enabled": true,
    "slidesPerView": 4,
    "slidesPerGroup": 1,
    "speed": 400
  }
}

project/config.app_settings(settings)

Project app settings.

Kind: static method of project/config
See

• Extends:
• app_settings

Since: 1.0.0

| Param | Type | Description | | --- | --- | --- | | settings | object | | | [settings.admin_nav_ids] | array | Array of view IDs to use in the admin menu. Each view id must have a corresponding entry in content destinations setting. | | settings.admin_password | string | Password to access admin area. | | [settings.app_path] | string | Which paths are allowed in the app. Possible values are all, compare, or recommend. Default: all | | [settings.currency] | string | The currency that should be used for product prices. Default: USD | | [settings.dev_lang_switcher] | boolean | Enable the dev language switcher, which allows the language to be switched without going into admin area. Default: false | | [settings.enable_admin] | boolean | Enable admin area access button. Default: true | | [settings.enable_gallery] | boolean | Enable retailer gallery display. Default: false | | [settings.gallery_items] | array | Array of retailer gallery item objects. Default: [] | | settings.gallery_items.{} | object | Gallery item object. | | settings.gallery_items.{}.type | string | Type of gallery item. Valid values are image or video. | | settings.gallery_items.{}.src | string | Source URL for the gallery item media file. Note that this will be a generated object URL if the item was added through the admin interface. | | settings.keyboard | object | Software keyboard settings. | | settings.keyboard.enabled | boolean | Enable/disable software keyboard. Default: true | | settings.product_spec_titles | array | Array of attribute names to use for product spec titles. This list differs from [filter](module:core/config.filter).display_product_specs in that it determines the labels in that it determines the spec row labels, which may not align 1-to-1 with displayed product specs. This list is also updated dynamically within view content depending on the attributes available in the requested products. | | [settings.progress_nav_start] | string | View ID of the first view to progress nav, used to generate the progress nav sidebar. | | [settings.progress_nav_ids] | array | Array of view IDs included in the progress nav sidebar. Note this list is generated automatically using the progress_nav_start as the starting view, however it may also be defined as a static list in settings. | | [settings.show_product_link_direct] | boolean | Enable display of buttons that link directly to product page. Note that even when enabled, buttons will only be displayed if the product contains a link value. | | [settings.show_product_link_qr_code] | boolean | Enable display of buttons that display a QR code popup, which will lead to the product page when scanned. Note that even when enabled, buttons will only be displayed if the product contains a link value. |

Example

"settings": {
  "admin_nav_ids": [
    "admin_lang",
    "admin_path",
    "admin_inventory"
  ],
  "admin_password": "evokiosk2022",
  "app_path": "all",
  "currency": "USD",
  "enable_gallery": false,
  "gallery_items": [
    {
      "type": "video",
      "src": "assets/videos/example.mp4"
    },
    {
      "type": "image",
      "src": "assets/images/photo-example.png"
    }
  ],
  "keyboard": {
    "enabled": true
  },
  "product_spec_titles": [
    "ratings",
    "price",
    "processor",
    "storage_amount",
    "ram",
    "display",
    "resolution",
    "weight",
    "ports"
  ],
  "progress_nav_start": "device_type",
  "progress_nav_ids": [
    "device_type",
    "tasks",
    "display",
    "recommend"
  ],
  "show_product_link_direct": false,
  "show_product_link_qr_code": false
}

project/config.page_settings(settings)

Project page settings.

Kind: static method of project/config
See

• Extends:
• page_settings

Since: 1.0.0

| Param | Type | Description | | --- | --- | --- | | settings | object | | | [settings.show_background] | number | Which background should be shown on the given view. If no background should be shown, set to 0. Default: 1 |

Example

"settings": {
  "show_background": 1
}

project/customize

Customize SRT functionality. Methods used to extend SRT directly should be exported, but additional project callbacks within those calls may be inner methods. See App.customize for more information on extending SRT.

Example

// method extending SRT through the App.customize() method
export const init = () => {
  projectMethod();
};

// inner project method
const projectMethod = () => {
  // do project things
};

Example

// add config defaults for custom project settings
export const config = {
  project_setting: true,
};

export const configInit = () => {
  // update app settings
  App.updateConfig(config);
}

• project/customize
  • static
    • .config : object
    • .configInit()
    • .init()
    • .settingsInit()
    • .lintProducts(product)
    • .setProductAttributes()
    • .setProductLabels(formatFunctions)
    • .setCurrentContent()
    • .preRenderViewActions()
    • .postRenderViewActions()
    • .exitView()
    • .renderReady()
    • .toggleAttractMode()
    • .viewAllInit(content)
    • .addEventListeners()
  • inner
    • ~attributes : array
    • ~setDynamicRefs()
    • ~adminButtonInit()
    • ~backgroundInit()
    • ~progressNavInit()
    • ~setCurrency(currency)
    • ~getContentCurrency() ⇒ string
    • ~setProgressNavContent(view)
    • ~setProductSpecTitles(view)
    • ~setProductSpecLabels(view)
    • ~addFormActions()
    • ~keyboardInit()
    • ~sortableInit()
    • ~setProductOrder(products)
    • ~toggleIncludeProduct(input)
    • ~setEditProductAttributes(productID)
    • ~removeProduct(button)
    • ~resetInventory()
    • ~saveProduct() ⇒ object
    • ~confirmPopup(message, [confirm], [cancel])
    • ~addGallerySlide(file)
    • ~removeGallerySlide(slide)
    • ~setGallerySlideOrder(slides)
    • ~toggleKeyboard([input])
    • ~sliderInit()
    • ~sliderDestroy()
    • ~starRatingsInit()
    • ~renderProductButtonQRCodes()
    • ~spaceInit()
    • ~spaceWarp()

project/customize.config : object

Project default settings.

See project content settings for more information on configuration.

Kind: static constant of project/customize
Since: 1.0.0

project/customize.configInit()

Customize config defaults.

• Update app config with project defaults.

Kind: static method of project/customize
See: App.updateConfig
Since: 1.0.0

project/customize.init()

Initialize project functionality.

• Append admin access button to view.
• Initialize background elements.
• Add project form actions.
• Initialize software keyboard.
• Set the app currency.
• Add attribute definition with project attributes.

Kind: static method of project/customize
See

• adminButtonInit
• backgroundInit
• addFormActions
• keyboardInit
• setCurrency
• App.updateAttributeDefs

Since: 1.0.0

project/customize.settingsInit()

Customize settings initialization.

• Generate list of progress nav view IDs.
• Set dynamic label references.

Kind: static method of project/customize
See

• progressNavInit
• setDynamicRefs

Since: 1.0.0

project/customize.lintProducts(product)

Customize product linting.

• Localize decimal numbers in product names.

Kind: static method of project/customize

| Param | Type | Description | | --- | --- | --- | | product | object | Product object. |

project/customize.setProductAttributes()

Customize product attribute values.

• Set display_integer value based on display_units.inch value instead of display value, as the latter may not be set, or may be using different units.

Kind: static method of project/customize
Since: 1.3.1

project/customize.setProductLabels(formatFunctions)

Customize product spec labels.

Spec labels are customized both to use custom string templates with dynamic reference tags (e.g. [unit], [amount]) provided by translations, and to insert span tags to facilitate styling. In addition, some attributes are combined into a single label:

• ram - Insert ram type into ram spec label.
• display - Insert touchscreen (if available) into display spec label. In addition, display labels which use "in" or "tum" (sv_SE) abbr. for inches are replaced with '"' symbol.

Kind: static method of project/customize
Since: 1.3.1

| Param | Type | Description | | --- | --- | --- | | formatFunctions | object | Object containing custom formatting functions for product attributes. |

project/customize.setCurrentContent()

Customize current view content.

• Add progress nav content to current content.
• Set current product spec titles, if applicable.
• Modify current product spec labels, if applicable.

Kind: static method of project/customize
See

• setProgressNavContent
• setProductSpecTitles
• setProductSpecLabels

Since: 1.0.0

project/customize.preRenderViewActions()

Customize pre-render view actions.

• Hide keyboard.
• Destroy any slider instances.

Kind: static method of project/customize
See

• toggleKeyboard
• sliderDestroy

Since: 1.3.0

project/customize.postRenderViewActions()

Customize post-render view actions.

• If initial load, remove hidden class from background.
• Initialize sortable items.
• Initialize gallery slider.
• Build star rating classes.
• Render product button QR codes.

Kind: static method of project/customize
See

• sortableInit
• sliderInit
• starRatingsInit
• renderProductButtonQRCodes

Since: 1.0.0

project/customize.exitView()

Customize view exit actions.

• Animate stars.

Kind: static method of project/customize
See: animateStars
Since: 1.3.0

project/customize.renderReady()

Customize render ready actions.

• Animate stars.

Kind: static method of project/customize
See: animateStars
Since: 1.3.0

project/customize.toggleAttractMode()

Customize attract mode actions

• Animate stars.

Kind: static method of project/customize
See: animateStars
Since: 1.3.3

project/customize.viewAllInit(content)

Modify default "view all" content.

Kind: static method of project/customize
Since: 1.0.0

| Param | Type | Description | | --- | --- | --- | | content | object | Default "view all" content |

project/customize.addEventListeners()

Add project event listeners.

• Click and refocus window after one second on window blur (i.e. iframe interaction).
• Navigate to admin password screen on .js-adminAccess click.
• Submit form on inactive admin lang select option click.
• Submit form on admin path radio option change.
• Toggle product include/exclude on .js-showProduct change.
• Set up product attributes for editing on .js-editProduct click.
• Remove product from inventory on .js-deleteProduct click.
• Reset inventory on .js-resetInventory click.
• Submit form on admin "enable gallery" radio option change.
• Simulate .js-addGalleryFile input click on .js-addGallerySlide button click.
• Add gallery slide, if file is present, on .js-addGalleryFile click.
• Remove gallery slide on .js-removeGallerySlide click.
• Toggle media playing state on video click.
• Toggle keyboard on/off when .js-textInput is focused or blurred respectively, and toggle off when .js-keyboard is also blurred.
• Add postMessage listener to communicate with 3D module iframe, including sending translated content when module is ready, and listening for click activity.

Kind: static method of project/customize
See

• View.navigate
• Form.submit
• toggleIncludeProduct
• setEditProductAttributes
• removeProduct
• resetInventory
• addGallerySlide
• removeGallerySlide
• View.toggleMedia
• toggleKeyboard

Since: 1.0.0

project/customize~attributes : array

Array of project attribute definitions.

• Update app attribute type. Adds applyActive: true
• Add product attribute type.

Kind: inner constant of project/customize
Since: 1.0.0
Example

// project attributes
[
  {
    type: 'app',
    ignoreAnchor: true,
    applyActive: true,
  },
  {
    type: 'product',
    applyActive: true,
  },
]

project/customize~setDynamicRefs()

Set dynamic reference tags and their replacement value. See the args.string param in App.transformContent for more information on using dynamic reference tags.

• [display_unit] - set to current formatted display unit.
• [currency] - set to current currency label.
• [weight_unit] - set to current formatted weight unit.

Kind: inner method of project/customize
See

• Used by:
• settingsInit

Since: 1.3.1

project/customize~adminButtonInit()

Create admin button element. Appends an element with the classes l-app__adminAccess js-adminAccess.

Kind: inner method of project/customize
See

• Used by:
• init

Since: 1.0.0

project/customize~backgroundInit()

Initialize background elements.

Kind: inner method of project/customize
See

• spaceInit
• Used by:
• init

Since: 1.0.0

project/customize~progressNavInit()

Generate list of progress nav view IDs.

The progress nav includes select views from the app path. To generate an array of view IDs that the progress bar encompasses:

• A starting progress view ID is defined with the progress_nav_start project setting.
• From the starting view ID's content, the next destination view ID is retrieved. If no destination is defined, the end view is used. This new view ID is set to the "current" view ID, and this step is repeated until the end view is reached.
• The array of nav IDs is added to settings as progress_nav_ids.

Kind: inner method of project/customize
See

• App.getContent
• App.updateSettings
• Used by:
• settingsInit

Since: 1.0.0

project/customize~setCurrency(currency)

Update the currency project setting, and update the filter price attribute's format currency.

Kind: inner method of project/customize
See

• App.updateSettings
• Used by:
• init
• addFormActions

Since: 1.3.1

| Param | Type | Description | | --- | --- | --- | | currency | string | The currency code to make active. |

project/customize~getContentCurrency() ⇒ string

Get currency format value from content settings.

This is required in order to update the currency setting when changing languages, otherwise the currency value would be overwritten by the stored currency setting value during settings initialization.

Kind: inner method of project/customize
See

• App.getContent
• Used by:
• addFormActions

Since: 1.3.1

project/customize~setProgressNavContent(view)

Add progress nav content to current content, if applicable.

Note that in order to define the the nav item object properties label, there must be a value in settings.labels.progress_nav.id, where id is the nav item ID.

Kind: inner method of project/customize
See

• Used by:
• setCurrentContent

Since: 1.0.0

| Param | Type | Description | | --- | --- | --- | | view | object | Current view content. |

Example

// example progress nav items array
[
  {
    id: 'device_type,
    label: 'Device type'
    active: false,
    visited: true,
  },
  {
    id: 'tasks,
    label: 'Tasks'
    active: true,
    visited: false,
  },
  {
    id: 'recommend,
    label: 'Recommended device'
    active: false,
    visited: false,
  },
]

project/customize~setProductSpecTitles(view)

Update the list of product spec titles that accompany product results in the current view content.

Kind: inner method of project/customize
See

• Filter.availableProductAttr
• Used by:
• setCurrentContent

Since: 1.3.0

| Param | Type | Description | | --- | --- | --- | | view | object | Current view content. |

project/customize~setProductSpecLabels(view)

Customize product specs with prefix and suffix values, which are added to each spec object as pre or post properties, respectively.

• For processor spec, add processor_gen product value to post.
• For storage_type, spec, remove value so only the name and title values remain. This spec is used as the title for all storage type specs.
• For ssd, hdd, and emmc specs, add the storage type label to post.
• For ram spec, add ram_type product value to post.
• For display spec, add touchscreen label to post.
• For resolution spec, add pixels unit post.

Additionally, if any products contain a price attribute, but the current product does not, a "empty" price spec with the value - is added to the beginning of the specs array as a spacer.

Kind: inner method of project/customize
See

• Used by:
• setCurrentContent

Since: 1.0.0

| Param | Type | Description | | --- | --- | --- | | view | object | Current view content. |

project/customize~addFormActions()

Add form actions.

• adminPassword - Check password field value against the admin_password project setting. Navigates to admin_settings view on success.
• changeLang - Switch language based on the currently active lang app attribute value. Restarts app on admin_settings view.
• changeCurrency - Update the currency project setting
• changeSettings - Update app_path, show_product_link_direct, and show_product_link_qr_code project settings.
• saveProduct - [Save product data] and navigate back to inventory view.
• toggleGallery - Update the enable_gallery project setting in both config and settings.

Kind: inner method of project/customize
See

• View.navigate
• App.contentInit
• keyboardInit
• setCurrency
• View.updateLang
• View.getActiveInputs
• App.updateSettings
• Used by:
• init

Since: 1.0.0

project/customize~keyboardInit()

Initialize Simple Keyboard JS.

1. Keyboard element is appended to the view container.
2. Keyboard layouts are defined. Layouts include:
   • default - lowercase QWERTY keyboard with number row.
   • shift - uppercase QWERTY keyboard with special characters row.
   • number - phone-style number pad selection, used for number inputs.
3. Define actions to take on keyboard keypress. Most of these actions attempt to replicate real keyboard functionality:
   • Pressing enter key will submit the current input's parent form.
   • Pressing caps will toggle between the shift and default layout.
   • Pressing shift will toggle between the shift and default layout, but the shift layout will only be enabled for the next keypress.
4. Define actions to take when the keyboard's stored input for a given input changes:
   • Update the current input's value with the stored value
   • Dispatch a new input event to trigger any event listeners on the input.
   • For number fields, delay updating the input with invalid values until after the value is valid again, such as values which contain a trailing decimal point with no number after it (e.g. 1999.).
5. Finally, the keyboard is refocused after a small time delay. This is to prevent the loss of focus on the keyboard caused by the module during certain button presses, due to either settings updates or keyboard re-renders.

Kind: inner method of project/customize
See

• Used by:
• init

Since: 1.2.1

project/customize~sortableInit()

Initialize SortableJS on .sortable container. If no sortable container is found, nothing is done.

On order update, run any additional functionality if necessary:

• On admin_inventory view, update product order values.
• On admin_gallery view, update gallery slide order.

Kind: inner method of project/customize
See

• setProductOrder
• setGallerySlideOrder
• Used by:
• postRenderViewActions

Since: 1.1.0

project/customize~setProductOrder(products)

For each provided product row, set its priority value based on position in product list, and update inventory product with new priority.

Kind: inner method of project/customize
See

• Filter.updateProduct
• Used by:
• sortableInit
• removeProduct

Since: 1.1.0

| Param | Type | Description | | --- | --- | --- | | products | jQuery | jQuery object containing product list rows. |

project/customize~toggleIncludeProduct(input)

Toggle include/exclude product, both visually (in product list) and in inventory.

Kind: inner method of project/customize
See

• Filter.updateProduct
• Used by:
• addEventListeners

Since: 1.1.0

| Param | Type | Description | | --- | --- | --- | | input | jQuery | jQuery "show" toggle input. |

project/customize~setEditProductAttributes(productID)

Update app with attributes for a given product in preparation for product editing.

• Retrieve product by product ID.
• Create array of attributes objects, including attribute name, value, and/or label, as required for the input of the same type in the "edit product" form. These objects mirror the output of Util.parseElementAttributes.
• Update path node with attributes objects, under the attribute type product. Then, update app state with path attributes. This process mirrors what happens during App.setAttributes.
• Navigate to edit product view.

Kind: inner method of project/customize
See

• Filter.getProductsByID
• App.updatePathNode
• App.updateState
• App.getAttributesFrom
• View.navigate
• Used by:
• addEventListeners

Since: 1.1.0

| Param | Type | Description | | --- | --- | --- | | productID | string | ID of the product to use. |

project/customize~removeProduct(button)

Remove product from admin inventory list, as well as filter inventory. Requires confirmation before product can be removed.

After product removal, product order is updated.

Kind: inner method of project/customize
See

• confirmPopup
• setProductOrder
• Used by:
• addEventListeners

Since: 1.1.0

| Param | Type | Description | | --- | --- | --- | | button | jQuery | jQuery object of the pressed "delete" button. |

project/customize~resetInventory()

Reset product inventory to default included products. Requires confirmation.

Kind: inner method of project/customize
See

• confirmPopup
• App.db.clear
• Filter.init
• View.navigate
• Used by:
• addEventListeners

Since: 1.1.0

project/customize~saveProduct() ⇒ object

Add or update product using "edit product" form data.

• Product object is created from product attributes stored in state.attr.products condensed attributes.
• If adding a new product, set as lowest priority product.
• Update product in inventory with product object.

Kind: inner method of project/customize
See

• App.getAttributeDef
• Filter.getProductsByID
• Filter.recommend
• Filter.updateProduct
• Used by:
• addEventListeners

Since: 1.1.0

project/customize~confirmPopup(message, [confirm], [cancel])

Custom "confirm" popup.

Kind: inner method of project/customize
See

• View.togglePopup
• Used by:
• removeProduct
• resetInventory

Since: 1.1.0

| Param | Type | Description | | --- | --- | --- | | message | string | Confirmation message to display in popup. | | [confirm] | function | Callback function to run on confirmation success. | | [cancel] | function | Callback function to run on confirmation cancel. |

project/customize~addGallerySlide(file)

Add provided file object to gallery_items project setting array.

If file type is not video or image, a popup warning is shown and the file is not added. Otherwise, a new gallery item object is added, and the view is reloaded.

Kind: inner method of project/customize
See

• confirmPopup
• App.updateSettings
• View.navigate
• Used by:
• addEventListeners

Since: 1.2.0

| Param | Type | Description | | --- | --- | --- | | file | object | File Blob object. |

project/customize~removeGallerySlide(slide)

Remove a provided slide from gallery.

Before a slide is removed, it must be confirmed. If confirmed, the slide element is deleted from the view, and the new gallery item order is set.

Kind: inner method of project/customize
See

• confirmPopup
• setGallerySlideOrder
• Used by:
• addEventListeners

Since: 1.2.0

| Param | Type | Description | | --- | --- | --- | | slide | jQuery | Slide jQuery object to be removed. |

project/customize~setGallerySlideOrder(slides)

Update gallery slide order in gallery_items project setting array.

For each slide in the view, the previous index (before reordering) is retrieved from the slide's data-slide-index attribute. The slide's data is then added to the new order array, and the data attribute updated with the new index. Once complete, [settings are updated] with the new gallery item order.

Kind: inner method of project/customize
See

• App.updateSettings
• Used by:
• sortableInit
• removeGallerySlide

Since: 1.2.0

| Param | Type | Description | | --- | --- | --- | | slides | jQuery | Slides jQuery objects, in desired order. |

project/customize~toggleKeyboard([input])

Toggle keyboard visibility.

If an input element is supplied, the keyboard is shown, and will manage the input value for the provided input element.

Otherwise, the keyboard is hidden. A 200 ms delay before hiding allows time for the keyboard to be refocused if necessary, such as during the keyboardInit onKeyPress action.

Kind: inner method of project/customize
See

• Used by:
• addEventListeners

Since: 1.2.1

| Param | Type | Description | | --- | --- | --- | | [input] | HTMLElement | Input element for the keyboard to manage. If not supplied, the keyboard will be hidden. |

project/customize~sliderInit()

Initialize Swiper.js slider.

On slide change, any videos that were playing on the previous slide are paused and set to the beginning. If slider autoplay is enabled, the current slide will start playing.

Kind: inner method of project/customize
See

• Used by:
• postRenderViewActions

Since: 1.2.0

project/customize~sliderDestroy()

Destroy any active Swiper.js sliders.

Kind: inner method of project/customize
See

• Used by:
• preRenderViewActions

project/customize~starRatingsInit()

Add classes to product stars that correspond to the product's rating (if provided).

• Runs a loop for each integer in the provided rating, decrementing the rating on each loop.
• Adds a "full" star class if remaining rating is greater than one.
• Adds a "half" star class if less than one.

Kind: inner method of project/customize
See

• Used by:
• postRenderViewActions

Since: 1.2.2

project/customize~renderProductButtonQRCodes()

Render QR codes to product buttons, if show_product_link_qr_code project setting is enabled.

Kind: inner method of project/customize
See

• View.renderQRCode
• Used by:
• postRenderViewActions

Since: 1.3.0

project/customize~spaceInit()

Initialize star layers.

Kind: inner method of project/customize
See

• Used by:
• backgroundInit

Since: 1.3.0

project/customize~spaceWarp()

Animate traveling through stars background.

Kind: inner method of project/customize
See

• Used by:
• exitView
• renderReady
• toggleAttractMode

Since: 1.3.0