Simplifying if else

[spamushere]

Hi all,

I’m learning as I go, wondering if there is a way to simplify an if else statement:

export async function populateChart(
    owner,
    month_current,
    month_minus_1,
    month_minus_2,
    month_minus_3,
    month_minus_4,
    month_minus_5,
    month_minus_6,
    month_minus_7,
    month_minus_8,
    month_minus_9,
    month_minus_10,
    month_minus_11,
) {

    var option1 = 0;
    if (month_current === null || month_current === undefined) {
        if (month_minus_1 === null || month_minus_1 === undefined) {
            if (month_minus_2 === null || month_minus_2 === undefined) {
                if (month_minus_3 === null || month_minus_3 === undefined) {
                    if (month_minus_4 === null || month_minus_4 === undefined) {
                        if (month_minus_5 === null || month_minus_5 === undefined) {
                            if (month_minus_6 === null || month_minus_6 === undefined) {
                                if (month_minus_7 === null || month_minus_7 === undefined) {
                                    if (month_minus_8 === null || month_minus_8 === undefined) {
                                        if (month_minus_9 === null || month_minus_9 === undefined) {
                                            if (month_minus_10 === null || month_minus_10 === undefined) {
                                                if (month_minus_11 === null || month_minus_11 === undefined) {
                                                    month_current = Number(0);
                                                    month_minus_1 = Number(0);
                                                    month_minus_2 = Number(0);
                                                    month_minus_3 = Number(0);
                                                    month_minus_4 = Number(0);
                                                    month_minus_5 = Number(0);
                                                    month_minus_6 = Number(0);
                                                    month_minus_7 = Number(0);
                                                    month_minus_8 = Number(0);
                                                    month_minus_9 = Number(0);
                                                    month_minus_10 = Number(0);
                                                    month_minus_11 = Number(0);
                                                } else {
                                                    month_current = Number(0);
                                                    month_minus_1 = Number(0);
                                                    month_minus_2 = Number(0);
                                                    month_minus_3 = Number(0);
                                                    month_minus_4 = Number(0);
                                                    month_minus_5 = Number(0);
                                                    month_minus_6 = Number(0);
                                                    month_minus_7 = Number(0);
                                                    month_minus_8 = Number(0);
                                                    month_minus_9 = Number(0);
                                                    month_minus_10 = Number(0);
                                                }
                                            } else {
                                                month_current = Number(0);
                                                month_minus_1 = Number(0);
                                                month_minus_2 = Number(0);
                                                month_minus_3 = Number(0);
                                                month_minus_4 = Number(0);
                                                month_minus_5 = Number(0);
                                                month_minus_6 = Number(0);
                                                month_minus_7 = Number(0);
                                                month_minus_8 = Number(0);
                                                month_minus_9 = Number(0);
                                            }
                                        } else {
                                            month_current = Number(0);
                                            month_minus_1 = Number(0);
                                            month_minus_2 = Number(0);
                                            month_minus_3 = Number(0);
                                            month_minus_4 = Number(0);
                                            month_minus_5 = Number(0);
                                            month_minus_6 = Number(0);
                                            month_minus_7 = Number(0);
                                            month_minus_8 = Number(0);
                                        }
                                    } else {
                                        month_current = Number(0);
                                        month_minus_1 = Number(0);
                                        month_minus_2 = Number(0);
                                        month_minus_3 = Number(0);
                                        month_minus_4 = Number(0);
                                        month_minus_5 = Number(0);
                                        month_minus_6 = Number(0);
                                        month_minus_7 = Number(0);
                                    }
                                } else {
                                    month_current = Number(0);
                                    month_minus_1 = Number(0);
                                    month_minus_2 = Number(0);
                                    month_minus_3 = Number(0);
                                    month_minus_4 = Number(0);
                                    month_minus_5 = Number(0);
                                    month_minus_6 = Number(0);
                                }
                            } else {
                                month_current = Number(0);
                                month_minus_1 = Number(0);
                                month_minus_2 = Number(0);
                                month_minus_3 = Number(0);
                                month_minus_4 = Number(0);
                                month_minus_5 = Number(0);
                            }
                        } else {
                            month_current = Number(0);
                            month_minus_1 = Number(0);
                            month_minus_2 = Number(0);
                            month_minus_3 = Number(0);
                            month_minus_4 = Number(0);
                        }
                    } else {
                        month_current = Number(0);
                        month_minus_1 = Number(0);
                        month_minus_2 = Number(0);
                        month_minus_3 = Number(0);
                    }
                } else {
                    month_current = Number(0);
                    month_minus_1 = Number(0);
                    month_minus_2 = Number(0);
                }
            } else {
                month_current = Number(0);
                month_minus_1 = Number(0);
            }
        } else {
            month_current = Number(0);
        }
    } else {
        // do more
    } ... continues

[yisrael-wix]

Whoa! Did I have one beer too many? Nah! Never too many.

So hold on, I’d be glad to help, but let’s try to make this easier… What exactly is it that you are trying to do?

[spamushere]

Hi @yisrael-wix , awesome, thank you.

I am passing a few query results (numbers) into a function to populate a chart. If the number is 0, I get NaN on the chart log and nothing renders.

So if I get a 0 back I want to assign a value of 0.1 or something to recognise a number and get the render to happen. Full code is:

export async function populateChart(
    owner,
    month_current,
    month_minus_1,
    month_minus_2,
    month_minus_3,
    month_minus_4,
    month_minus_5,
    month_minus_6,
    month_minus_7,
    month_minus_8,
    month_minus_9,
    month_minus_10,
    month_minus_11,
) {

   
    let months = [
        "January",
        "February",
        "March",
        "April",
        "May",
        "June",
        "July",
        "August",
        "September",
        "October",
        "November",
        "December"
    ];

    let currentMonth = new Date().getMonth();
    let monthsB = months.splice((currentMonth + 1) % 12).reverse();
    months = months.reverse();
    months.push(monthsB);
    months = months.flat();

    let label = [
        months[0],
        months[1],
        months[2],
        months[3],
        months[4],
        months[5],
        months[6],
        months[7],
        months[8],
        months[9],
        months[10],
        months[11]
    ];

    let data = [
     month_current,
      month_minus_1,
        month_minus_2,
        month_minus_3,
        month_minus_4,
        month_minus_5,
        month_minus_6,
        month_minus_7,
        month_minus_8,
        month_minus_9,
        month_minus_10,
        month_minus_11
    ];

    let background_colour = [
        "rgba(54, 162, 235, 0.2)",
        "rgba(255, 206, 86, 0.2)",
        "rgba(75, 192, 192, 0.2)",
        "rgba(153, 102, 255, 0.2)",
        "rgba(255, 159, 64, 0.2)",
        "rgba(255, 99, 132, 0.2)",
        "rgba(85, 162, 235, 0.2)",
        "rgba(33, 206, 86, 0.2)",
        "rgba(180, 192, 192, 0.2)",
        "rgba(153, 102, 255, 0.2)",
        "rgba(200, 159, 64, 0.2)",
        "rgba(100, 99, 132, 0.2)"
    ];

    let border_colour = [
        "rgba(54, 162, 235, 1)",
        "rgba(255, 206, 86, 1)",
        "rgba(75, 192, 192, 1)",
        "rgba(153, 102, 255, 1)",
        "rgba(255, 159, 64, 1)",
        "rgba(255, 99, 132, 1)",
        "rgba(85, 162, 235, 1)",
        "rgba(33, 206, 86, 1)",
        "rgba(180, 192, 192, 1)",
        "rgba(200, 102, 255, 1)",
        "rgba(255, 159, 64, 1)",
        "rgba(100, 99, 132, 1)"
    ];

    console.log(items);
    let chart = new ChartJSAPI($w('#specificationTimeline'));
    chart.customization = chartCustomization;

    chart.data = {
        label,
        datasets: [{ data, background_colour, border colour }] 
    }

    $w('#specificationTimeline').show();
    $w('#specificationTimeline').expand();
}

[yisrael-wix]

@spamushere Are you sure that you have Number 0 and not the string “0”? If you have a number (and 0 is a number), you shouldn’t be getting NaN.

[spamushere]

@yisrael-wix 100% certain it’s returning as a number, but when pushing it to the array I get it as a string

[yisrael-wix]

@spamushere The only push I see in your code is to the months array which is an array of strings (month names). Sorry, I just don’t understand your code or what you’re trying to do.

[spamushere]

@yisrael-wix there are around 3000 lines of code on this one, probably too much, but in short I have a dataset with various items created by a user, they contain a numerical value in each item, I am querying the records by month, and adding them up, these results I want to display on a graph starting with the month 11 months ago, up to the current month, i.e., covering 12 months.

Here’s some of the relevant stuff, maybe you could help me sort this out:

export function monthValue9(
    owner
) {
    var date = new Date(); // full date today
    var start = new Date(date.getFullYear(), date.getMonth() - 9, 1);
    var end = new Date(date.getFullYear(), date.getMonth() - 8, 0);
    var x = new Date();
    x.setDate(1);
    x.setMonth(x.getMonth() - 9);

    let month_number_minus9 = (x.getMonth()); // current month in a number 0 - 11

    specificationValue(owner, start, end).then(result => {
            let month_minus_9 = result;
            month_minus_10(
                owner,
                month_minus_9,
                month_number_minus9
                
                // done for every month from current to 11 months ago... when complete, populateChart() with all datasets passed to it
            );
        })
        .catch(error => {
            console.log(error);
        });
}



export async function populateChart(
    owner,
    month_current,
    month_minus_1,
    month_minus_2,
    month_minus_3,
    month_minus_4,
    month_minus_5,
    month_minus_6,
    month_minus_7,
    month_minus_8,
    month_minus_9,
    month_minus_10,
    month_minus_11,
) {

   

    let months = [
        "January",
        "February",
        "March",
        "April",
        "May",
        "June",
        "July",
        "August",
        "September",
        "October",
        "November",
        "December"
    ];

    let currentMonth = new Date().getMonth();
    let monthsB = months.splice((currentMonth + 1) % 12).reverse();
    months = months.reverse();
    months.push(monthsB);
    months = months.flat();

    let label = [
        months[0],
        months[1],
        months[2],
        months[3],
        months[4],
        months[5],
        months[6],
        months[7],
        months[8],
        months[9],
        months[10],
        months[11]
    ];

    let data = [
        month_current,
        month_minus_1,
        month_minus_2,
        month_minus_3,
        month_minus_4,
        month_minus_5,
        month_minus_6,
        month_minus_7,
        month_minus_8,
        month_minus_9,
        month_minus_10,
        month_minus_11
    ];

    let background_colour = [
        "rgba(54, 162, 235, 0.2)",
        "rgba(255, 206, 86, 0.2)",
        "rgba(75, 192, 192, 0.2)",
        "rgba(153, 102, 255, 0.2)",
        "rgba(255, 159, 64, 0.2)",
        "rgba(255, 99, 132, 0.2)",
        "rgba(85, 162, 235, 0.2)",
        "rgba(33, 206, 86, 0.2)",
        "rgba(180, 192, 192, 0.2)",
        "rgba(153, 102, 255, 0.2)",
        "rgba(200, 159, 64, 0.2)",
        "rgba(100, 99, 132, 0.2)"
    ];

    let border_colour = [
        "rgba(54, 162, 235, 1)",
        "rgba(255, 206, 86, 1)",
        "rgba(75, 192, 192, 1)",
        "rgba(153, 102, 255, 1)",
        "rgba(255, 159, 64, 1)",
        "rgba(255, 99, 132, 1)",
        "rgba(85, 162, 235, 1)",
        "rgba(33, 206, 86, 1)",
        "rgba(180, 192, 192, 1)",
        "rgba(200, 102, 255, 1)",
        "rgba(255, 159, 64, 1)",
        "rgba(100, 99, 132, 1)"
    ];

    let items = {
        label: label,
        data: data,
        background_colour: background_colour,
        border_colour: border_colour
    };

    console.log(items);
    let chart = new ChartJSAPI($w('#specificationTimeline'));
    chart.customization = chartCustomization;

    console.log(label);
    console.log("data");
    console.log(data);
    console.log(background_colour);
    console.log(border_colour);

    chart.data = {
        label,
        datasets: [{ data }] //, background_colour, border_colour
    }

    $w('#specificationTimeline').show();
    $w('#specificationTimeline').expand();
}

I am creating arrays with the data I am passing in to the function, then attempting to display them on the chart. When I created an object (items) and I couldn’t map the results to the chart, so this seems to be a bit of experimenting

[spamushere]

@yisrael-wix So some of these results will return a 0 for a new user, and when populating the chart, I get a NaN result when returning Number(0) or undefined when returning 0 from the backend function

Thus I need to create a simplified if else statement to set the value to 0 if the result is a string or undefined/null/etc…

[yisrael-wix]

@spamushere I don’t really see how 0 ends up as a string. 3000 lines of code is a lot to deal with, and we’re really unable to debug complex code.

What backend function are you calling? Do you know what in fact you are returning? You’ll need to find out why if it’s 0 you get undefined. Try some console.log() statements wherever you can to see what’s happening.

Number(0) doesn’t make sense, as 0 is already a number. However, I tried and it returns - wait for it… the number 0. Number(‘0’) would make more sense, and of course returns the number 0.

[spamushere]

@yisrael-wix

Backend:

export async function specificationValue(owner, start, end) {

    let filter = wixData.filter().eq("_owner", owner).eq("specified", true).ge("_createdDate", start).le("_createdDate", end);

    return await wixData.aggregate("projectproducts")
        .filter(filter)
        .sum("specificationValue")
        .run()
        .then((results) => {
            if (results.items.length > 0) {

                let specificationSumMonthCurrent = results.items[0].specificationValueSum;

                let finalValue = specificationSumMonthCurrent; // Matthew: formats numbers to be separated by thousands
                console.log(finalValue);
                return (finalValue);

            } else {
                // handle case where no matching items found
                let finalValue = 0; // Matthew: formats numbers to be separated by thousands
                console.log(finalValue);
                console.log("No specification value for this user");
                return (finalValue);
            }
        })
        .catch((error) => {
            let errorMsg = error.message;
            console.log(errorMsg);

            let code = error.code;
            console.log(code);

        });

}

I’ve got this working, it returns 0 when it’s 0.

Then I’m running 12 functions like this on the page code to call the backend function ( specificationValue() ):

export async function month_current() {
    let owner = $w('#recordId').text;
    var date = new Date(); // full date today
    var start = new Date(date.getFullYear(), date.getMonth(), 1);
    var end = new Date(date.getFullYear(), date.getMonth() + 1, 0);
    let month_number_current = date.getMonth(); // current month in a number 0 - 11

    await specificationValue(owner, start, end).then(result => {
            let month_current = result;

            month_minus_1(owner, month_current, month_number_current);
        })
        .catch(error => {
            console.log(error);
        });
}

Once done all results are passed to a function to create an array & objects:

export async function createArrays(
    owner,
    month_current,
    month_minus_1,
    month_minus_2,
    month_minus_3,
    month_minus_4,
    month_minus_5,
    month_minus_6,
    month_minus_7,
    month_minus_8,
    month_minus_9,
    month_minus_10,
    month_minus_11,
) {

    let months = [
        "January",
        "February",
        "March",
        "April",
        "May",
        "June",
        "July",
        "August",
        "September",
        "October",
        "November",
        "December"
    ];

    let currentMonth = new Date().getMonth();
    let monthsB = months.splice((currentMonth + 1) % 12).reverse();
    months = months.reverse();
    months.push(monthsB);
    months = months.flat();

    let label = [
        months[0],
        months[1],
        months[2],
        months[3],
        months[4],
        months[5],
        months[6],
        months[7],
        months[8],
        months[9],
        months[10],
        months[11]
    ];

    let data = [
        month_current,
        month_minus_1,
        month_minus_2,
        month_minus_3,
        month_minus_4,
        month_minus_5,
        month_minus_6,
        month_minus_7,
        month_minus_8,
        month_minus_9,
        month_minus_10,
        month_minus_11
    ];

    let background_colour = [
        "rgba(54, 162, 235, 0.2)",
        "rgba(255, 206, 86, 0.2)",
        "rgba(75, 192, 192, 0.2)",
        "rgba(153, 102, 255, 0.2)",
        "rgba(255, 159, 64, 0.2)",
        "rgba(255, 99, 132, 0.2)",
        "rgba(85, 162, 235, 0.2)",
        "rgba(33, 206, 86, 0.2)",
        "rgba(180, 192, 192, 0.2)",
        "rgba(153, 102, 255, 0.2)",
        "rgba(200, 159, 64, 0.2)",
        "rgba(100, 99, 132, 0.2)"
    ];

    let border_colour = [
        "rgba(54, 162, 235, 1)",
        "rgba(255, 206, 86, 1)",
        "rgba(75, 192, 192, 1)",
        "rgba(153, 102, 255, 1)",
        "rgba(255, 159, 64, 1)",
        "rgba(255, 99, 132, 1)",
        "rgba(85, 162, 235, 1)",
        "rgba(33, 206, 86, 1)",
        "rgba(180, 192, 192, 1)",
        "rgba(200, 102, 255, 1)",
        "rgba(255, 159, 64, 1)",
        "rgba(100, 99, 132, 1)"
    ];

    let item = {
        label: label,
        data: data,
        background_colour: background_colour,
        border_colour: border_colour
    };

    console.log("item");
    console.log(item);

    await insertValues(item)
        .then((popchart) => {

            console.log("insert values result");

            if (popchart === "success") {
                $w('#specificationTimeline').show();
                $w('#specificationTimeline').expand();
            } else {
                console.log("error populating chart");
            }
        });

}

Once done trying to get this info to a chart, following these instructions:

[SOLVED] Chart.js not rendering on editor X?? | Velo by Wix

(I’ve got a sample chart working)

export async function insertValues(item) {

    console.log("item");
    console.log(item);

    let chart = new ChartJSAPI($w('#specificationTimeline'));
    chart.customization = chartCustomization;

    const chartItems = item;

    const labels = /* chartItems.map(item => */ Object.keys(chartItems.label); //);
    const data = /* chartItems.map(item =>  */ Object.keys(Number(chartItems.data)); //););
    const backgroundColor = /* chartItems.map(item =>  */ Object.keys(chartItems.backgroundColor); //););
    const borderColor = /* chartItems.map(item =>  */ Object.keys(chartItems.borderColor); //););

    chart.data = {
        labels,
        datasets: [{ data, backgroundColor, borderColor }]
    }

    let rendered = $w('#specificationTimeline').rendered;
    if (rendered === true) {
        return "success"
    } else {
        return "error"
    }
}

So now the issue is not so much an if else, but getting this data onto a chart. @amandagm, any idea? Sorry for the deviation

[yisrael-wix]

I don’t have any answers for you, but I do have some observations:

Why is insertValues() defined with the async keyword? It doesn’t have any statements with await .
You don’t need to call insertValues() with an await since it doesn’t return a Promise .
Furthermore, you call wixData.aggregate(“projectproducts”) , insertValues(), and specificationValue() with both an await and .then() . This is incorrect and could result in unpredictable results. The call to an asynchronous function/service should use either an await or a .then() — but not both .