Custom attributes extensibility model
Each object within the Customizer object model has a number of out-of-the-box attributes are considered a part of the core or standard model. Attributes such a ID, style code, name, descriptions, etc are encountered in almost every customization project and thus are made standard. Additionally, some attributes drive functionality within the customizer widget or customizer API: for example, a product is not buildable or finished until all placeholders have been filled.
In addition to standard attributes, each object within the hierarchy may have an arbitrary number of custom attributes. Customizer is schema-less and does not enforce or validate the custom attributes, except through rules.
Each custom attribute has:
A name
and a string value
Custom attributes can be added both manually through the administration UI or Customizer API, and can be used to shape the final blueprint to suit the specific object model needs:
A product may have a custom product-safe-area-svg attribute to contain an SVG of the safely engravable area, which can be used in the UI experience to provide a doodling UI
A font option may have a custom gravotech-font to contain the machine code for the engraving font
Some object model attributes are considered rare or specific enough so they are not added to the Customizer administration UI, but nonetheless drive some functionality within the API or Customizer backend. For example, image view attribute mask may control rendered font or dynamic image clipping.
Custom attributes inheritance
An important element of the object model is attribute inheritance. At runtime, when a blueprint is requested, Customizer combines and resolves attribute lists:
Blueprint attributes inherit custom attributes from products and versions
Blueprint placements inherit attributes from component placements
Blueprint components inherit attributes from all involved options
Using the engraving example concept:
Serif Font option may be define personalization-font attribute with serif.ttf value
Size 5mm option may have personalization-size of 16 (points)
Color Fill Red option may have color option of #ff0000
Which would result in Serif + Size 5mm + Red component to have all of these attributes, which would in turn control the rendering process.
JavaScript API and reference implementation
Customizer JavaScript API and standard reference components such as ImageView or CameraView automatically interpret and handle a variety of standard attributes which depend on the specific customer use case.
For example, a customer’s 3D-based configurator would contain a product view that defines 3D camera position and type. The CameraView component would expect those attributes and knows how to interpret their values.