Game-countdown NPM

Game Countdown

A simple countdown from 3 to 1, that is displayed largely on the screen. While working on some new features for my game Sudoculus, I needed to have a ready, set, go kinda way to display to the players.

After not finding anything useful written in Vue, I found this answer on stackoverflow for my issue. I created this component based off of that, using a Single File Component and reading this article here to figure out how to build and publish to NPM.

Installation

Open your command line to your project, and run the following command

npm install vue-game-countdown

Then you could install the plugin using in your component

// in your component
import GameCountdown from 'game-countdown';

new Vue({
  components: {
    GameCountdown
  }
});

// then use it in your template
<game-countdown @countdown-ended="doSomething()">

Or import it globally from your index.html file if that is required

<body>
<div id="app">
  <game-countdown></game-countdown>
</div>
<script type="text/javascript" src="game-countdown.js"></script>
<script type="text/javascript">
  Vue.use(GameCountdown);
</script>
</body>

Props

countdown-ended is the only prop, and it is fired when the countdown is finished. Use it to start your

@infinitebrahmanuniverse/nolb-gam @everything-registry/sub-chunk-1718

4 years ago

4 years ago

4 years ago

4 years ago