Skip to content

Instantly share code, notes, and snippets.

@liddiard

liddiard/game_master.html

Created October 27, 2022 22:56
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save liddiard/0ced31fbb3fa1ee38bcb295fdf07cb4f to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save liddiard/0ced31fbb3fa1ee38bcb295fdf07cb4f to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. liddiard created this gist Oct 27, 2022.
    88 changes: 88 additions & 0 deletions game_master.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,88 @@
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <link
    rel="stylesheet"
    href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
    />
    <style>
    body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    }

    #person {
    font-size: 16vw;
    font-weight: 500;
    color: #0070e0;
    animation-name: bounceIn;
    animation-duration: 2s;
    }
    </style>
    </head>
    <body>
    <script>
    // updated 2022-10-24
    const people = [
    'Rithvik',
    'Harrison',
    'Sean',
    'Raghav',
    'Sandeep',
    'Mohini',
    'Borja',
    'Lucy'
    ]

    // https://stackoverflow.com/a/6117889
    const getWeekNumber = () => {
    const d = new Date()
    d.setUTCDate(d.getUTCDate() + 4 - (d.getUTCDay() || 7))
    // Get first day of year
    const yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1))
    // Calculate full weeks to nearest Thursday
    const weekNo = Math.ceil(( ( (d - yearStart) / 86400000) + 1) / 7)
    // Return array of year and week number
    return weekNo
    }

    // set person name
    const sprintOfYear = Math.floor(getWeekNumber(new Date()) / 2)
    const gameMaster = people[sprintOfYear % people.length]

    const node = document.createElement("div")
    node.id = "person"
    node.innerText = gameMaster

    document.body.appendChild(node)
    document.title= `🎲 ${gameMaster}!!!`

    // animate it
    const animations = [
    'bounce',
    'flash',
    'pulse',
    'rubberBand',
    'shakeX',
    'shakeY',
    'headShake',
    'swing',
    'tada',
    'wobble',
    'jello',
    'flip',
    'hinge',
    ]
    window.setInterval(() =>
    // pick random animation that isn't the current one
    node.style.animationName = animations
    .filter(el => el !== node.style.animationName)[Math.floor((Math.random()*(animations.length-1)))],
    2000)
    </script>
    </body>
    </html>