const rectSize = 15; // Size of the color box
        const spacing = 5; // Space between legend items
        let legend = canvas.append('g').attr('class','chart-legend')
        .attr('transform', `translate(${0}, ${height + 3})`);

        // Sample data for the legend
        const legendData = [
            { label: 'low', color: '#1f77b4' },
            { label: 'medium', color: '#ff7f0e' },
            { label: 'high', color: '#2ca02c' },
            { label: 'very high', color: '#2ca02c' }
        ];


        legend.selectAll('g')
            .data(legendData)
            .join('g')
            .attr('class', 'legend-item')
            
            .each(function (d, i) {
                const legendItem = d3.select(this);
                console.log(d.label)
                console.log(d.label?.length)
                let labelWidth = (d.label.length * 5) + 7 + 15
                

                var bbox = legendItem.node().getBBox()
                var width = bbox.width
                console.log(width)
                
                // Add rectangle for color
                legendItem.append('rect')
                    .attr('width', rectSize)
                    .attr('height', rectSize)
                    .attr('fill', d.color);
                    
                    // Add label
                    legendItem.append('text')
                    .attr('x', rectSize + spacing) // Position text to the right of the rectangle
                    .attr('y', rectSize / 2) // Align text vertically with the rectangle
                    .attr('dy', '.35em') // Adjust vertical alignment
                    .attr('text-anchor', 'start') // Align text to the start
                    .text(d.label)
                    .attr('fill', 'black'); // Optional: Text color
                // legendItem.attr('transform', `translate(${i * (rectSize + spacing + labelWidth)}, 0)`) // Position each item horizontally
            });

            const legendItems_spacing = 12
            var legendLength = 0
            legend.selectAll('.legend-item').each(function(d,i) {
              d3.select(this).attr('transform',function() {
                var bbox = d3.select(this).node().getBBox()
                var width = bbox.width
                // if (width == 0) width = (d.text.length * 5) +15  // not in dom yet
                let startingPosition = 0 
                if (i > 0) {
                    startingPosition = legendLength
                }
                legendLength += width + legendItems_spacing
                
                // return `translate(${xx - (width + 30)},0$)`
                return `translate(${startingPosition},0)`
            })
            })

questions = Array.from(document.querySelectorAll(".multiple-choice-question"));
async function hackRadio(question){
	if(question.querySelector(".question-chevron").getAttribute("aria-label") == "Question completed") return;
	let answerChoices = question.querySelectorAll(".zb-radio-button");
	async function guess(answerChoice){
		answerChoice.querySelector("label").click();
	}
	let pause = 0;
	for(let answerChoice of answerChoices){
		setTimeout(()=>{guess(answerChoice)},pause);	//No need to check given that it will record the correct answer anyways.
		pause += 1000;
	}
}
for(let question of questions){
	hackRadio(question);
}
questions = Array.from(document.querySelectorAll(".short-answer-question"));
async function hackShortAnswer(question){
	if(question.querySelector(".question-chevron").getAttribute("aria-label") == "Question completed") return;
	question.querySelector("textarea").value = question.querySelector(".forfeit-answer").textContent;
	//question.querySelector(".check-button").click(); They are smart bastards
}
for(let question of questions){
	const showAnswerButton = question.querySelector(".show-answer-button");
	showAnswerButton.click();
	showAnswerButton.click();
	hackShortAnswer(question);
}

class SequentialQueue{	//if you want it to go backwards, too bad
	next(){
		return this.i++;
	}
	constructor(start = 0){
		this.i = start;
	}
}
const que = new SequentialQueue(0);
for(let i = 0; i < 10; i++){
	console.log(que.next());
}

const gcd = (...arr) => {
  const _gcd = (x, y) => (!y ? x : gcd(y, x % y));
  return [...arr].reduce((a, b) => _gcd(a, b));
};

gcd(8, 36); // 4
gcd(...[12, 8, 32]); // 4

console.log("xa")

var arr = [{
    "success": true,
    "data": [
        {
            "id": "ipi_1KrrbvDOiB2klwsKhuqUWqt1",
            "object": "issuing.transaction",
            "amount": -2743,
            "amount_details": {
                "atm_fee": null
            },
            "authorization": "iauth_1KrrbuDOiB2klwsKoFjQZhhd",
            "balance_transaction": "txn_1KrrbwDOiB2klwsK1YkjJJRi",
            "card": "ic_1Krqe5DOiB2klwsK44a35eiE",
            "cardholder": "ich_1KrqL8DOiB2klwsKtBnZhzYr",
            "created": 1650753567,
            "currency": "usd",
            "dispute": null,
            "livemode": false,
            "merchant_amount": -2743,
            "merchant_currency": "usd",
            "merchant_data": {
                "category": "advertising_services",
                "category_code": "7311",
                "city": "San Francisco",
                "country": "US",
                "name": "Aeros Marketing, LLC",
                "network_id": "1234567890",
                "postal_code": "94103",
                "state": "CA"
            },
            "metadata": {},
            "type": "capture",
            "wallet": null
        },
                {
            "id": "ipi_1Krrbvc62B2klwsKhuqUWqt1",
            "object": "issuing.transaction",
            "amount": -9999,
            "amount_details": {
                "atm_fee": null
            },
            "authorization": "iauth_1KrrbuDOiB2klwsKoFjQZhhd",
            "balance_transaction": "txn_1KrrbwDOiB2klwsK1YkjJJRi",
            "card": "ic_1Krqe5DOiB2klwsK44a35eiE",
            "cardholder": "ich_1KrqL8DOiB2klwsKtBnZhzYr",
            "created": 1650753567,
            "currency": "USD",
            "dispute": null,
            "livemode": false,
            "merchant_amount": -9999,
            "merchant_currency": "usd",
            "merchant_data": {
                "category": "fast_food",
                "category_code": "7311",
                "city": "San Francisco",
                "country": "US",
                "name": "Aeros Marketing, LLC",
                "network_id": "1234567890",
                "postal_code": "94103",
                "state": "CA"
            },
            "metadata": {},
            "type": "capture",
            "wallet": null
        }
    ]
}];
    

const reduced = arr.reduce((prev, curr) => {
    prev.push({
        amount: curr.data[0].merchant_amount,
        id: curr.data[0].id,
        currency: curr.data[0].currency,
        category: curr.data[0].merchant_data.category
    });
    console.log(prev)

    return prev;
    
}, []);