NullOperator404 / Developer-Diary

Just a blog where I echo thoughts on projects, bugs, etc.
0 stars 0 forks source link

REFACTOR: Shopping Cart Array #40

Closed NullOperator404 closed 1 month ago

NullOperator404 commented 1 month ago

The array cartProds[] currently only stores product numbers, but should be refactored to be an object array. Numerous functions must currently iterate through the product database looking for a match for a product number stored in the array. There is no need to do is; if cartProds[] contains the entire data object, then functions can just pull data directly from the cart instead of having to access the database every time data is needed.

For example:

//WHEN USER CLICKS A QUANTITY BOX, THIS FUNCTION SETS THE PRICE ACCORDING TO THE PRODUCT STYLE
let prodIdx;
function setRow(event) {
    //GET ROW ID
    rowId = event.getAttribute('id');

    //LOCATE INDEX OF ROW ID LETTER
    prodIdx = rowLabels.indexOf(rowId);
    //LOCATE PRODUCT NUMBER IN CART PRODS ARRAY BASED ON ROW LETTER INDEX
    let userProd = cartProds[prodIdx];

    //LOCATE PRODUCT IN DATABASE
    if(products == null) {
        rowId = "a"; //DEFAULT ROW ALREADY EXISTS
    } else {
        for(let i = 0; i < products.length; i++) {
            if(userProd == products[i].ProductNumber) {
                currentProd = products[i];
                break;
            }
        }
    }
    //SET VARS BASED ON PRODUCT SELECTED
    numBoxes = currentProd.Sizes.length; //DETERMINE HOW MANY SIZE BOXES ARE IN SELECTED ROW
    basePrice = currentProd.BasePrice; //SET BASE PRICE FOR SELECTED PRODUCT

}

The above function is used to set whatever product is currently selected in the Quote panel. That is, when a user clicks to input/edit quantities, this function fires so it can assign currentProd the correct object data.

As it's currently written, the function uses an event handler to get the ID of the clicked row ("a," for example). It then checks the rowLabels[] array to find out what the index of the retrieved label is. ("a" would be at index 0.) It assigns "0" to prodIdx.

After that, it uses the value of prodIdx to find out which product number in cartProds[] to assign to userProd.

It then iterates through the product database looking for a match to the value of userProd (G800, for example). When a match is found, it updates currentProd with the new data object.

REFACTOR PROPOSAL:

//WHEN USER CLICKS A QUANTITY BOX, THIS FUNCTION SETS THE PRICE ACCORDING TO THE PRODUCT STYLE
let prodIdx;
function setRow(event) {
    //GET ROW ID
    rowId = event.getAttribute('id');

    //LOCATE INDEX OF ROW ID LETTER
    prodIdx = rowLabels.indexOf(rowId);
    //LOCATE PRODUCT NUMBER IN CART PRODS ARRAY BASED ON ROW LETTER INDEX
    currentProd = cartProds[prodIdx];

    //SET VARS BASED ON PRODUCT SELECTED
    numBoxes = currentProd.Sizes.length; //DETERMINE HOW MANY SIZE BOXES ARE IN SELECTED ROW
    basePrice = currentProd.BasePrice; //SET BASE PRICE FOR SELECTED PRODUCT

}

In this version, cartProds[] is an OBJECT ARRAY. In all instances where the user adds/edits a product in their shopping cart, this array will store the entire data object for that product instead of just it's product number. This way, any functions relating to shopping cart items need only read from cartProds[], without needing to access the product database.

A given row can always been determined using it's ID, just as setRow() does. Once it has the row ID, it should be able to locate the corresponding item in cartProds[], since the cart array always updates based on what the user has selected.

NullOperator404 commented 1 month ago

UPDATE 1 HOUR LATER:

The following functions have been refactored to utilize cartProds[] as an object array:

addToCart() trashItem() openCheckout() setRow() openPreflight()

These were all the functions I could find that access cartProds[]. From now on, the only time the program should have access the full database is when the user is adding a product or changing the current product. In such instances, the database must be accessed so that currentProd and cartProds[] can be updated with the corresponding data object (for use client-side).