SRT Usage Categories

Intel® Shopper Recommendation Tool which focuses on segmenting user activities into categories.

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-usage-categories.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.app_settings(settings)

Project app settings.

Kind: static method of project/config
See

• Extends:
• app_settings

Since: 1.3.3

| Param | Type | Description | | --- | --- | --- | | settings | object | Modifies core app settings. | | [settings.display_segments] | boolean | When enabled, product display segments will be shown. Note that if no display_segment property is included in a product, an empty grey box will be displayed instead of the display segment and color. | | [settings.product_ratings] | object | Settings for product star ratings. | | settings.product_ratings.enabled | boolean | Turn on/off product star ratings. Note that even with this setting enabled, stars will only be displayed if a rating for that product exists. Default: true | | settings.product_ratings.aria_label | string | ARIA label text. Since stars are displayed graphically, a text fallback should be used. This text is appended to the rating number for the product, e.g. "4.5 out of 5 stars". | | [settings.product_ratings.minimum_rating] | number | Number from 0 to 5 under which product rating information should be hidden. Default: 3.5 | | [settings.product_ratings.minimum_ratings_count] | number | Number of reviews a product must have before rating count will be displayed. Default: 10 | | [settings.spec_ratings] | boolean | When enabled, product spec ratings indicators will be displayed. Default: true |

Example

{
  "product_ratings": {
    "enabled": true,
    "aria_label": "out of 5 stars",
    "minimum_rating": 3.5,
    "minimum_ratings_count": 10
  }
}

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.

• project/customize
  • static
    • .config : object
    • .setProductContent
    • .configInit()
    • .init()
    • .lintProducts(product)
    • .setProductLabels(formatFunctions)
    • .setProductSpecs(product, spec)
    • .setCurrentContent(view)
    • .addEventListeners()
    • .getProducts(filterRequest)
    • .postRenderViewActions()
    • .viewAllInit()
  • inner
    • ~setDynamicRefs()
    • ~offlineProductCTA(view)
    • ~applyStarClasses()
    • ~setRecommendGameSelect([index])

project/customize.config : object

Project default settings.

See project content settings for more information on configuration.

Kind: static constant of project/customize

project/customize.setProductContent

Manage product-related view content.

• Inject appropriate labels for game FPS into product select fields.

Kind: static constant of project/customize
See

• Used by:
• setCurrentContent

Since: 1.3.0

| Param | Type | Description | | --- | --- | --- | | view | object | Current view content. | | products | array | Products to modify or add content to. |

project/customize.configInit()

Customize config defaults.

• Update app config with project defaults.

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

project/customize.init()

Initialize project functionality.

• Add recommend_hint attribute definition..
• Set dynamic reference strings.

Kind: static method of project/customize
See

• App.updateAttributeDefs
• setDynamicRefs
• Extends:
• App.init

Since: 1.2.0

project/customize.lintProducts(product)

Customize product linting.

• Process Walmart-specific custom "tag" string which contains data which is added to products:
  • product_id
  • display_segment
  • attributes.leveling_segment
  • attributes.priority

Kind: static method of project/customize
See

• Extends:
• Filter.lintProducts

Since: 1.3.0

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

project/customize.setProductLabels(formatFunctions)

Customize product spec labels.

• For specs processor, storage_amount, ram, and display, use default formatting functions, but append the relevant attribute spec_label value, from app labels.

Kind: static method of project/customize
Since: 1.3.3

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

project/customize.setProductSpecs(product, spec)

Customize product specs.

• Add aria_rating label to specs that contain a rating value.

Kind: static method of project/customize
See

• Extends:
• Filter.setProductSpecs

Since: 1.3.3

| Param | Type | Description | | --- | --- | --- | | product | object | Current product object. | | spec | object | Current spec object. |

project/customize.setCurrentContent(view)

Set current page content.

• Set product content including splitting products into two groups.
• Set offline product messaging.

Kind: static method of project/customize
See

• setProductContent
• offlineProductCTA
• Extends:
• App.setCurrentContent

Since: 1.2.0

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

project/customize.addEventListeners()

Add project event listeners.

• Handle game performance select option interaction on .game-performance .js-selectOption click.

Kind: static method of project/customize
See: setRecommendGameSelect

project/customize.getProducts(filterRequest)

Add custom filter request settings.

• Set lowest_price filter request option to true if app attr path is "knowledgeable"
• Set intel_priority filter request option to true if app attr path is "overwhelmed".

Kind: static method of project/customize
See

• Extends:
• App.getProducts

Since: 1.2.0

| Param | Type | Description | | --- | --- | --- | | filterRequest | object | Filter options object. See filter_options in filter settings for more information. |

project/customize.postRenderViewActions()

Post-render view actions.

• Apply star classes.

Kind: static method of project/customize
See

• applyStarClasses
• setRecommendGameSelect
• Extends:
• View.postRenderViewActions

Since: 1.2.0

project/customize.viewAllInit()

Customize "view all" content.

Kind: static method of project/customize
See

• Extends:
• App.viewAllInit

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.

• [products_remaining] - <span class="js-products-remaining"></span>
• [lowest_price_product] - <span class="js-price"></span>

Kind: inner method of project/customize
See

• Used by:
• init

Since: 1.3.0

project/customize~offlineProductCTA(view)

Add "find product" CTA messaging to offline products.

• When platform is offline, and products exist in page content, loop through each product in the provided page content and add "hints" as an array of strings under product.findHints.
• If app_id is samsclub, labels specific to each form factor are added, as well as the product sku. Messaging is added in config.js.
  • Form factor hint is found under settings.labels.cta.[form_factor].
  • Product sku is added from product, and related messaging is found under settings.labels.cta.item_number.
• Any other version uses messaging found in settings.labels.product_find.

Kind: inner method of project/customize
See

• Used by:
• setCurrentContent

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

project/customize~applyStarClasses()

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.0

project/customize~setRecommendGameSelect([index])

Activate first input of game select field, or a specified index.

Kind: inner method of project/customize
See

• Used by:
• postRenderViewActions

| Param | Type | Default | Description | | --- | --- | --- | --- | | [index] | number | 0 | Index of the input to activate. |