Dúvida exercicio frações

Olá galera tudo bem? Estou no exercício de frações e gostaria de inventar algo diferente. Gostaria que meu usuário digitasse por exemplo numerador e denominador da fração no prompt, e ai aparecem os quadradinhos. Por exemplo 3/4 (apareceria 3 quadrados verdes e 4 brancos). Só que não estou conseguindo 'linkar' o que o usuário digita com a função... Alguém tem uma dica ou já fez algo parecido pode me auxiliar?

<canvas width="600" height="400"></canvas>

<script>

    function desenhaQuadradoVerde(x, y, cor) {

        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');

        pincel.fillStyle = 'green';
        pincel.fillRect(x, y, 50, 50);
        pincel.fillStroke = 'black';
        pincel.strokeRect(x, y, 50, 50);

        }

    function desenhaQuadradoTotal(x, y, cor) {

        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');

        pincel.fillStyle = 'white';
        pincel.fillRect(x, y, 50, 50);
        pincel.fillStroke = 'black';
        pincel.strokeRect(x, y, 50, 50);
    }

    var desenhaQuadradoVerde = parseInt(prompt("Digite o numerador da fração!"));
    var desenhaQuadradoTotal = parseInt(prompt("Digite o denominador da fração!"));

</script>