Duck with HTMX

duck.html

<!-- htmx  -->
<script src="https://unpkg.com/htmx.org"></script>
<!-- serverless extension -->
<script src="https://unpkg.com/htmx-serverless"></script>

<button hx-get="js:getDuck" hx-trigger="click, load" hx-target="next .duckcount" hx-ext="serverless">
    Click for more 🦆!
</button>
<span class="duckcount"></span>

<script>
let duckCount = 0;
function getDuck(text, params, xhr){
    let status = 'bad, get more.';
    
    if ( duckCount > 0 ) {
        // Switch is for the weak
        if ( duckCount < 10 ) {
            status = 'okay.'
        } else if ( duckCount < 20 ) {
            status = 'getting better.'
        } else if ( duckCount < 50 ) {
            status = 'getting better and better.'
        } else if ( duckCount < 100 ) {
            status = 'even better!'
        } else if ( duckCount < 200 ) {
            status = 'marvelous!'
        } else if ( duckCount < 500 ) {
            status = 'duckolitios!'
        } else if ( duckCount < 1000 ) {
            status = 'what???'
        } else {
            status = 'crazy...'
        }
    }

    return `You have ${duckCount++} 🦆, it is ${status}`;
}
</script>