Summary of function names in the bespoke cutting service JS app

bespoke-cutting-service.txt

// set/initialise app-scope vars
var productData
var orderData

isEmpty() - // Checks if an object is empty;

document 'keypress' listener // For some elements, simulate a click when enter key is pressed during focus.

var steps

setStateBasedOnURL() // Inspect URL and switch to step given in the URL parameter.

.js-button-back click listener // Back button click handler to go back a step.

var buttonGetStarted // #buttonGetStarted element
buttonGetStarted click listener // Advance to step 1.

changeState() // Jump backwards or forwards steps by a given increment.

window onpopstate // When browser history changes, setStateBasedOnURL();

var buttonContinue // #buttonContinue element
var colourSelect // #colour element
var setupData

buttonContinue click listener // Continue button click handler to advance a step.

onload() // Initialise the app state on page load.

fetchOrderData() // Make AJAX GET request to fetch orderData JSON from the server.

saveOrderData() // Make AJAX POST request to save OrderData to the server.

initialiseApp() // Set up all steps based on the most recently created product.

isIpRatingComplete() // Checks if the productData product includes an IP Rating id.
isColourComplete() // Checks if the productData product has includes a Colour id.
isComponentsComplete() // Checks if the productData product includes valid components.
isProductComplete() // Checks if the productData product is complete.

ipRatingInitialise() // Initialise the IP Rating step.
coloursInitialise() // Initialise the Step 2. Colour step.
setupInitialise() // Initialise the Step 3. Setup step.
extrasInitialise() // Initialise the Step 4. Extras steps.
reviewInitialise() // Initialise the Step 5. Review step.
orderInitialise() // Initialise the Step 6. Order step.

validationMessageShow() // Show a form invalid message, appended as a child of the given element.
validationMessageRemove() // Remove any form invalid messages present in the given element.
validateApp() // Show validation messages if pages are accessed before it's possible to populate them.

.js-button-restart click listener // 'Start a New Order' button click event handler. Reset & go to Intro page.

For all '.js-radio-field's register click listeners
handleRadioFieldClick()

var fields // all .field__input elements
initialiseField() // Add event listeners to an input field, enabling client-side validation feedback.
validationTooltipShow()
validationTooltipRemove()
checkValidity()

handleErrors() // Checks that a fetch was resolved successfully, throwing an error if not.

// Step 2. Colours
coloursRequest() // Make AJAX Request to fetch Colours JSON based on the selected IP Rating.
coloursConstruct() // Construct the HTML and add to DOM, the 'Step 2. Colour' dropdown select options and their content divs using JSON data.

colourSelectHandleChange()

// Step 3. Setup

var templateCable // #templateCable element
var templateConnector // #templateConnector element
var templateFlexStrip // #templateFlexStrip element
var componentList // #componentList element

setupRequest() // Make AJAX Request to fetch setup JSON based on the selected IP Rating & Colour.
setupConstruct() // Construct the HTML and add to DOM, the 'Step 3. Setup' configurator components using JSON data.

// register event listeners for add /remove component controls
setAddControlsState()
constructCableComponent()
constructFlexStripComponent()
constructConnectorComponent()

recordSetupProductData()

// Step 4. Extras.
extrasRequest()

var radioFieldTemplate // #templateRadioField element
var templateOptionContent // #optionContent element
var qtyInputFieldTemplate // #templateQtyInputField element
var lengthInputFieldTemplate // #templateLengthInputField element

extrasConstruct()
getDefaultProfileLength() // Return in mm, the total length of flex strip included in the current order, rounded up to nearest multiple of 1000.

// Step 5. Review.

recordExtrasProductData() // Record the products and quantities configured by the user on Step 4 Extras pages to the productData object.

var abortController
var isLoading

reviewRequest()

var templateReviewTableRow // #templateReviewTableRow element
var reviewComponentsTbody // #reviewComponents element
var reviewProductQtyInputField // #reviewProductQuantity element

reviewConstruct()

reviewProductQtyInputField 'change' listener
reviewProductQtyInputField 'keyup' listener

handleReviewQtyInputChange()

// Step 6. Order.

orderRequest()
var orderTableTbody // #orderTableTbody elemnent
var templateOrderTableRow // #templateOrderTableRow elemnent
var orderBasketTotal // #orderBasketTotal elemnent
var orderCarriageTotal // #orderCarriageTotal elemnent
var orderVatTotal // #orderVatTotal elemnent
var orderTotal // #orderTotal elemnent
orderConstruct()

handleOrderQtyInputChange()

recordReviewProductData()

var buttonAddProduct // #buttonAddProduct
buttonAddProduct click listener

// 'Remove' modal dialog
var dialogRemoveProduct // #dialogRemoveProduct element
var dialogRemoveProductCancel // #dialogRemoveProductCancel element
var dialogRemoveProductConfirm // #dialogRemoveProductConfirm element
dialogRemoveProductCancel click listener
dialogRemoveProductConfirm click listener

orderDataProductRemove() // Removes a product from orderData
handleRemoveButtonClick() // Click event handler for remove product buttons.

// Delivery Method modal dialog
var dialogDelivery // #dialogDelivery element
var dialogDeliveryCancel // #dialogDeliveryCancel element
var dialogDeliveryConfirm // #dialogDeliveryConfirm element
var buttonDeliveryEdit // #buttonDeliveryEdit element

buttonDeliveryEdit click listener
dialogDeliveryCancel click listener
dialogDeliveryConfirm click listener

browserSupportsDialog()

var deliveryRadioOptions

handleDeliveryMethodRadioChange()

collapseSection()
expandSection()

var buttonPlaceOrder // #buttonPlaceOrder element
buttonPlaceOrder click listener

requestPlaceOrder() // AJAX request made on clicking "Place Order" button on Step 6 Order page.
orderConfirmationConstruct() // Update the text on Step 7. Order Confirmation page.