pacman-contribution-graph 1.0.0 → 1.0.2

package/dist/pacman-contribution-graph.js

@@ -12,68 +12,66 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./constants */ "./src/constants.ts");
 /* harmony import */ var _music_player__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./music-player */ "./src/music-player.ts");
-/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./store */ "./src/store.ts");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ "./src/utils.ts");
-
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ "./src/utils.ts");
 
 
 
-const resizeCanvas = () => {
+const resizeCanvas = (store) => {
     const canvasWidth = _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_WIDTH * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE);
     const canvasHeight = _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_HEIGHT * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + 20; // Adding some space for months on top
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.width = canvasWidth;
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.height = canvasHeight;
+    store.config.canvas.width = canvasWidth;
+    store.config.canvas.height = canvasHeight;
 };
-const drawGrid = () => {
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = _utils__WEBPACK_IMPORTED_MODULE_3__.Utils.getCurrentTheme().gridBackground;
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillRect(0, 0, _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.width, _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.height);
+const drawGrid = (store) => {
+    store.config.canvas.getContext('2d').fillStyle = _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme(store).gridBackground;
+    store.config.canvas.getContext('2d').fillRect(0, 0, store.config.canvas.width, store.config.canvas.height);
     for (let x = 0; x < _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_HEIGHT; x++) {
         for (let y = 0; y < _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_WIDTH; y++) {
-            const intensity = _store__WEBPACK_IMPORTED_MODULE_2__.Store.grid[x][y];
+            const intensity = store.grid[x][y].intensity;
             if (intensity > 0) {
                 const adjustedIntensity = intensity < 0.2 ? 0.3 : intensity;
-                const color = _utils__WEBPACK_IMPORTED_MODULE_3__.Utils.hexToRGBA(_utils__WEBPACK_IMPORTED_MODULE_3__.Utils.getCurrentTheme().contributionBoxColor, adjustedIntensity);
-                _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = color;
+                const color = _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.hexToRGBA(_utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme(store).contributionBoxColor, adjustedIntensity);
+                store.config.canvas.getContext('2d').fillStyle = color;
             }
             else {
-                _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = _utils__WEBPACK_IMPORTED_MODULE_3__.Utils.getCurrentTheme().emptyContributionBoxColor;
+                store.config.canvas.getContext('2d').fillStyle = _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme(store).emptyContributionBoxColor;
             }
-            _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-            _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas
+            store.config.canvas.getContext('2d').beginPath();
+            store.config.canvas
                 .getContext('2d')
                 .roundRect(y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE), x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + 15, _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE, _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE, 5);
-            _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fill();
+            store.config.canvas.getContext('2d').fill();
         }
     }
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = _utils__WEBPACK_IMPORTED_MODULE_3__.Utils.getCurrentTheme().textColor;
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').font = '10px Arial';
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').textAlign = 'center';
+    store.config.canvas.getContext('2d').fillStyle = _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme(store).textColor;
+    store.config.canvas.getContext('2d').font = '10px Arial';
+    store.config.canvas.getContext('2d').textAlign = 'center';
     let lastMonth = '';
     for (let y = 0; y < _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_WIDTH; y++) {
-        if (_store__WEBPACK_IMPORTED_MODULE_2__.Store.monthLabels[y] !== lastMonth) {
+        if (store.monthLabels[y] !== lastMonth) {
             const xPos = y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2;
-            _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillText(_store__WEBPACK_IMPORTED_MODULE_2__.Store.monthLabels[y], xPos, 10);
-            lastMonth = _store__WEBPACK_IMPORTED_MODULE_2__.Store.monthLabels[y];
+            store.config.canvas.getContext('2d').fillText(store.monthLabels[y], xPos, 10);
+            lastMonth = store.monthLabels[y];
         }
     }
 };
-const drawPacman = () => {
-    const x = _store__WEBPACK_IMPORTED_MODULE_2__.Store.pacman.y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2;
-    const y = _store__WEBPACK_IMPORTED_MODULE_2__.Store.pacman.x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2 + 15;
+const drawPacman = (store) => {
+    const x = store.pacman.y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2;
+    const y = store.pacman.x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2 + 15;
     const radius = _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2;
     // Change Pac-Man's color to red if he's on power-up, dead, else yellow
-    if (_store__WEBPACK_IMPORTED_MODULE_2__.Store.pacman.deadReaminingDuration) {
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = _constants__WEBPACK_IMPORTED_MODULE_0__.PACMAN_COLOR_DEAD;
+    if (store.pacman.deadRemainingDuration) {
+        store.config.canvas.getContext('2d').fillStyle = _constants__WEBPACK_IMPORTED_MODULE_0__.PACMAN_COLOR_DEAD;
     }
-    else if (_store__WEBPACK_IMPORTED_MODULE_2__.Store.pacman.powerupReaminingDuration) {
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = _constants__WEBPACK_IMPORTED_MODULE_0__.PACMAN_COLOR_POWERUP;
+    else if (store.pacman.powerupRemainingDuration) {
+        store.config.canvas.getContext('2d').fillStyle = _constants__WEBPACK_IMPORTED_MODULE_0__.PACMAN_COLOR_POWERUP;
     }
     else {
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = _constants__WEBPACK_IMPORTED_MODULE_0__.PACMAN_COLOR;
+        store.config.canvas.getContext('2d').fillStyle = _constants__WEBPACK_IMPORTED_MODULE_0__.PACMAN_COLOR;
     }
-    const mouthAngle = _store__WEBPACK_IMPORTED_MODULE_2__.Store.pacmanMouthOpen ? 0.35 * Math.PI : 0.1 * Math.PI;
+    const mouthAngle = store.pacmanMouthOpen ? 0.35 * Math.PI : 0.1 * Math.PI;
     let startAngle, endAngle;
-    switch (_store__WEBPACK_IMPORTED_MODULE_2__.Store.pacman.direction) {
+    switch (store.pacman.direction) {
         case 'up':
             startAngle = 1.5 * Math.PI + mouthAngle;
             endAngle = 1.5 * Math.PI - mouthAngle;
@@ -92,83 +90,74 @@ const drawPacman = () => {
             endAngle = 2 * Math.PI - mouthAngle;
             break;
     }
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').arc(x, y, radius, startAngle, endAngle);
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').lineTo(x, y);
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fill();
+    store.config.canvas.getContext('2d').beginPath();
+    store.config.canvas.getContext('2d').arc(x, y, radius, startAngle, endAngle);
+    store.config.canvas.getContext('2d').lineTo(x, y);
+    store.config.canvas.getContext('2d').fill();
 };
-const drawGhosts = () => {
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.ghosts.forEach((ghost) => {
-        const x = ghost.y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2;
-        const y = ghost.x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2 + 15;
-        const radius = _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2;
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = ghost.scared ? 'blue' : ghost.color;
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').arc(x, y, radius, 0, Math.PI);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').rect(x - radius, y, radius * 2, radius);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fill();
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = 'white';
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').arc(x - radius / 3, y - radius / 3, radius / 4, 0, Math.PI * 2);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').arc(x + radius / 3, y - radius / 3, radius / 4, 0, Math.PI * 2);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fill();
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = 'black';
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').arc(x - radius / 3, y - radius / 3, radius / 8, 0, Math.PI * 2);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').arc(x + radius / 3, y - radius / 3, radius / 8, 0, Math.PI * 2);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fill();
+const drawGhosts = (store) => {
+    store.ghosts.forEach((ghost) => {
+        const x = ghost.y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE);
+        const y = ghost.x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + 15;
+        const size = _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE;
+        const ctx = store.config.canvas.getContext('2d');
+        if (ghost.scared) {
+            ctx.drawImage(_constants__WEBPACK_IMPORTED_MODULE_0__.GHOSTS['scared'].img, x, y, size, size);
+        }
+        else {
+            ctx.drawImage(_constants__WEBPACK_IMPORTED_MODULE_0__.GHOSTS[ghost.name].img, x, y, size, size);
+        }
     });
 };
-const renderGameOver = () => {
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = 'black';
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').font = '20px Arial';
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').textAlign = 'center';
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillText('Game Over', _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.width / 2, _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.height / 2);
+const renderGameOver = (store) => {
+    store.config.canvas.getContext('2d').fillStyle = _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme(store).textColor;
+    store.config.canvas.getContext('2d').font = '20px Arial';
+    store.config.canvas.getContext('2d').textAlign = 'center';
+    store.config.canvas.getContext('2d').fillText('Game Over', store.config.canvas.width / 2, store.config.canvas.height / 2);
 };
-const drawSoundController = () => {
-    if (!_store__WEBPACK_IMPORTED_MODULE_2__.Store.config.enableSounds) {
-        console.log('vvvv');
+const drawSoundController = (store) => {
+    if (!store.config.enableSounds) {
         return;
     }
-    const width = 30, height = 30, left = _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.width - width - 10, top = 10;
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fillStyle = `rgba(0, 0, 0, ${_music_player__WEBPACK_IMPORTED_MODULE_1__.MusicPlayer.getInstance().isMuted ? 0.3 : 0.5})`;
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').moveTo(left + 10, top + 10);
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').lineTo(left + 20, top + 5);
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').lineTo(left + 20, top + 25);
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').lineTo(left + 10, top + 20);
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').closePath();
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').fill();
+    const width = 30, height = 30, left = store.config.canvas.width - width - 10, top = 10;
+    store.config.canvas.getContext('2d').fillStyle = `rgba(0, 0, 0, ${_music_player__WEBPACK_IMPORTED_MODULE_1__.MusicPlayer.getInstance().isMuted ? 0.3 : 0.5})`;
+    store.config.canvas.getContext('2d').beginPath();
+    store.config.canvas.getContext('2d').moveTo(left + 10, top + 10);
+    store.config.canvas.getContext('2d').lineTo(left + 20, top + 5);
+    store.config.canvas.getContext('2d').lineTo(left + 20, top + 25);
+    store.config.canvas.getContext('2d').lineTo(left + 10, top + 20);
+    store.config.canvas.getContext('2d').closePath();
+    store.config.canvas.getContext('2d').fill();
     if (!_music_player__WEBPACK_IMPORTED_MODULE_1__.MusicPlayer.getInstance().isMuted) {
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').strokeStyle = `rgba(0, 0, 0, 0.4)`;
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').lineWidth = 2;
+        store.config.canvas.getContext('2d').strokeStyle = `rgba(0, 0, 0, 0.4)`;
+        store.config.canvas.getContext('2d').lineWidth = 2;
         // First wave
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').arc(left + 25, top + 15, 5, 0, Math.PI * 2);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').stroke();
+        store.config.canvas.getContext('2d').beginPath();
+        store.config.canvas.getContext('2d').arc(left + 25, top + 15, 5, 0, Math.PI * 2);
+        store.config.canvas.getContext('2d').stroke();
         // Second wave
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').arc(left + 25, top + 15, 8, 0, Math.PI * 2);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').stroke();
+        store.config.canvas.getContext('2d').beginPath();
+        store.config.canvas.getContext('2d').arc(left + 25, top + 15, 8, 0, Math.PI * 2);
+        store.config.canvas.getContext('2d').stroke();
     }
     else {
         // Mute line
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').strokeStyle = 'rgba(255, 0, 0, 0.6)';
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').lineWidth = 3;
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').beginPath();
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').moveTo(left + 25, top + 5);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').lineTo(left + 5, top + 25);
-        _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getContext('2d').stroke();
+        store.config.canvas.getContext('2d').strokeStyle = 'rgba(255, 0, 0, 0.6)';
+        store.config.canvas.getContext('2d').lineWidth = 3;
+        store.config.canvas.getContext('2d').beginPath();
+        store.config.canvas.getContext('2d').moveTo(left + 25, top + 5);
+        store.config.canvas.getContext('2d').lineTo(left + 5, top + 25);
+        store.config.canvas.getContext('2d').stroke();
     }
 };
-const listenToSoundController = () => {
-    if (!_store__WEBPACK_IMPORTED_MODULE_2__.Store.config.enableSounds) {
+const listenToSoundController = (store) => {
+    if (!store.config.enableSounds) {
         return;
     }
-    _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.addEventListener('click', function (event) {
-        const rect = _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.getBoundingClientRect();
+    store.config.canvas.addEventListener('click', function (event) {
+        const rect = store.config.canvas.getBoundingClientRect();
         const x = event.clientX - rect.left, y = event.clientY - rect.top;
-        const width = 30, height = 30, left = _store__WEBPACK_IMPORTED_MODULE_2__.Store.config.canvas.width - width - 10, top = 10;
+        const width = 30, height = 30, left = store.config.canvas.width - width - 10, top = 10;
         if (x >= left && x <= left + this.width && y >= top && y <= top + this.height) {
             if (_music_player__WEBPACK_IMPORTED_MODULE_1__.MusicPlayer.getInstance().isMuted) {
                 _music_player__WEBPACK_IMPORTED_MODULE_1__.MusicPlayer.getInstance().unmute();
@@ -204,7 +193,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   DELTA_TIME: () => (/* binding */ DELTA_TIME),
 /* harmony export */   GAME_THEMES: () => (/* binding */ GAME_THEMES),
 /* harmony export */   GAP_SIZE: () => (/* binding */ GAP_SIZE),
-/* harmony export */   GHOST_COLORS: () => (/* binding */ GHOST_COLORS),
+/* harmony export */   GHOSTS: () => (/* binding */ GHOSTS),
+/* harmony export */   GHOST_NAMES: () => (/* binding */ GHOST_NAMES),
 /* harmony export */   GRID_HEIGHT: () => (/* binding */ GRID_HEIGHT),
 /* harmony export */   GRID_WIDTH: () => (/* binding */ GRID_WIDTH),
 /* harmony export */   MONTHS: () => (/* binding */ MONTHS),
@@ -221,7 +211,7 @@ const GRID_HEIGHT = 7;
 const PACMAN_COLOR = 'yellow';
 const PACMAN_COLOR_POWERUP = 'red';
 const PACMAN_COLOR_DEAD = '#80808064';
-const GHOST_COLORS = ['red', 'pink', 'cyan', 'orange'];
+const GHOST_NAMES = ['blinky', 'clyde', 'inky', 'pinky'];
 const MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
 const DELTA_TIME = 250;
 const PACMAN_DEATH_DURATION = 10;
@@ -252,6 +242,28 @@ const GAME_THEMES = {
         emptyContributionBoxColor: '#2d2d2d'
     }
 };
+const GHOSTS = {
+    blinky: {
+        imgDate: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAfUlEQVQ4T+2TUQ7AIAhDy/0PzQIRAqxmLtnn/DJPWypBAVkKKOMCyOQN7IRElLrcnIrDLNK4wVtxNbkb6Hq+jOcSbim6QVzKEstkw92gxVeFrMpqokix4wA+NvCOnvfArvcEbHoe2G9QmmhDMUc65p3xYC6q3zQPxtdl3NgF5QpL/b/rs3IAAAAASUVORK5CYIIA',
+        img: new Image()
+    },
+    clyde: {
+        imgDate: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAgUlEQVQ4T+2T0Q6AIAhFLx9sH1MfTIPCAeLKrcd8PHqP4JBQLN7BFacNlHkAs+AQcqIueBs2mVWjgtWwl4yCdrd/pHYLLlVEgR2yK0wy4SoI5TcGXU4wM+AEJQfwsUCuXngDOR4rqKbngf0C94gyFHmkbd4rbkxD/pv2jfR1Ky7sBNrzXbHpnBX+AAAAAElFTkSuQmCC',
+        img: new Image()
+    },
+    inky: {
+        imgDate: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAg0lEQVQ4T+WTWxKAIAhFuQvK/a+jFoT5QAVxypn+6vMEx6sDIO/jk12OAMs1WDVOXV3UBW+bRVbTFMFu8yCZBExH/g26VHCXI0AJpKgdUCUrTlkwxE+FECdzS7HiJemXgvyeO29gE7jD8wDVFX4vSLNtR1q2z+OVlaZxTaXYrq7HbxYBS8VgMVrqzkEAAAAASUVORK5CYIIA',
+        img: new Image()
+    },
+    pinky: {
+        imgDate: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAhklEQVQ4T+2T0Q2AIAwF281wC50Qt9DNagoptqVESfyUz4N3vJCCECxaD4o47gt6bsAo2IWUqAnehkUmbYpgNqwlvSCnur+dtnnAuYUVyCGJimTAi8DUzwmwOoGI7hYjDgAfC/jqiTfg47ZBND0P7BeoR+Sh8CMt8x5xYSWkv2nbcF834swuA/9u49Yy5bgAAAAASUVORK5CYIIA',
+        img: new Image()
+    },
+    scared: {
+        imgDate: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAeUlEQVQ4T82TUQ6AMAhD7UX0/sdyF0GREVmDmTN+bH9r6Bs0A0t2VpFULwDrrfBkZFcA3YC3ZodViAFGzQHyP0B2w2NrB0/1AoDbHwLoQ5/nrw1OBuD5e/crbM9Aiz35njHWzpSB/m3+0r40mV41M8U19WJe3Uw/tQOKt08pUUbBEQAAAABJRU5ErkJgggAA',
+        img: new Image()
+    }
+};
 
 
 /***/ }),
@@ -269,8 +281,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _canvas__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./canvas */ "./src/canvas.ts");
 /* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./constants */ "./src/constants.ts");
 /* harmony import */ var _music_player__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./music-player */ "./src/music-player.ts");
-/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./store */ "./src/store.ts");
-/* harmony import */ var _svg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./svg */ "./src/svg.ts");
+/* harmony import */ var _svg__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./svg */ "./src/svg.ts");
 var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -284,28 +295,29 @@ var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _argume
 
 
 
-
-const initializeGrid = () => {
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid = Array.from({ length: _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_HEIGHT }, () => Array.from({ length: _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH }, () => 0));
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.monthLabels = Array(_constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH).fill('');
+const initializeGrid = (store) => {
+    store.pacman.points = 0;
+    store.pacman.totalPoints = 0;
+    store.grid = Array.from({ length: _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_HEIGHT }, () => Array.from({ length: _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH }, () => ({ commitsCount: 0, intensity: 0 })));
+    store.monthLabels = Array(_constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH).fill('');
     let maxCommits = 1;
     const now = new Date();
     const startOfCurrentWeek = new Date(now);
     startOfCurrentWeek.setDate(now.getDate() - now.getDay());
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.contributions.forEach((contribution) => {
+    store.contributions.forEach((contribution) => {
         const contributionDate = new Date(contribution.date);
         const dayOfWeek = contributionDate.getDay();
         const weeksAgo = Math.floor((+startOfCurrentWeek - +contributionDate) / (1000 * 60 * 60 * 24 * 7));
         if (weeksAgo >= 0 && weeksAgo < _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH && dayOfWeek >= 0 && dayOfWeek < _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_HEIGHT) {
-            _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[dayOfWeek][_constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH - 1 - weeksAgo] = contribution.count;
+            store.grid[dayOfWeek][_constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH - 1 - weeksAgo] = { commitsCount: contribution.count, intensity: 0 };
             if (contribution.count > maxCommits)
                 maxCommits = contribution.count;
         }
     });
     for (let x = 0; x < _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_HEIGHT; x++) {
         for (let y = 0; y < _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH; y++) {
-            if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[x][y] > 0) {
-                _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[x][y] = _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[x][y] / maxCommits;
+            if (store.grid[x][y].commitsCount > 0) {
+                store.grid[x][y].intensity = store.grid[x][y].commitsCount / maxCommits;
             }
         }
     }
@@ -313,156 +325,163 @@ const initializeGrid = () => {
         const weeksAgo = _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH - 1 - y;
         const columnDate = new Date(startOfCurrentWeek);
         columnDate.setDate(columnDate.getDate() - weeksAgo * 7);
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.monthLabels[y] = _constants__WEBPACK_IMPORTED_MODULE_1__.MONTHS[columnDate.getMonth()];
+        store.monthLabels[y] = _constants__WEBPACK_IMPORTED_MODULE_1__.MONTHS[columnDate.getMonth()];
     }
 };
-const placePacman = () => {
+const placePacman = (store) => {
     let validCells = [];
     for (let x = 0; x < _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_HEIGHT; x++) {
         for (let y = 0; y < _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH; y++) {
-            if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[x][y] > 0)
+            if (store.grid[x][y].intensity > 0)
                 validCells.push({ x, y });
         }
     }
     if (validCells.length > 0) {
         const randomCell = validCells[Math.floor(Math.random() * validCells.length)];
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman = {
+        store.pacman = {
             x: randomCell.x,
             y: randomCell.y,
             direction: 'right',
             points: 0,
-            deadReaminingDuration: 0,
-            powerupReaminingDuration: 0
+            totalPoints: 0,
+            deadRemainingDuration: 0,
+            powerupRemainingDuration: 0
         };
     }
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas')
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawPacman();
+    if (store.config.outputFormat == 'canvas')
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawPacman(store);
 };
-const placeGhosts = () => {
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts = [];
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.scaredGhostsDestinations = [];
-    // Create 4 ghosts
+const placeGhosts = (store) => {
+    store.ghosts = [];
+    store.scaredGhostsDestinations = [];
     for (let i = 0; i < 4; i++) {
-        const color = _constants__WEBPACK_IMPORTED_MODULE_1__.GHOST_COLORS[i % _constants__WEBPACK_IMPORTED_MODULE_1__.GHOST_COLORS.length];
         let x, y;
         do {
             x = Math.floor(Math.random() * _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_HEIGHT);
             y = Math.floor(Math.random() * _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH);
-        } while (_store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[x][y] === 0);
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.push({ x, y, color, scared: false, target: undefined });
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.scaredGhostsDestinations.push({ x: 0, y: 0 });
+        } while (store.grid[x][y].intensity === 0);
+        store.ghosts.push({ x, y, name: _constants__WEBPACK_IMPORTED_MODULE_1__.GHOST_NAMES[i], scared: false, target: undefined });
+        store.scaredGhostsDestinations.push({ x: 0, y: 0 });
     }
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas')
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawGhosts();
+    if (store.config.outputFormat == 'canvas')
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawGhosts(store);
 };
-const startGame = () => __awaiter(void 0, void 0, void 0, function* () {
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas') {
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.config.canvas = _store__WEBPACK_IMPORTED_MODULE_3__.Store.config.canvas;
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.resizeCanvas();
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.listenToSoundController();
+const stopGame = (store) => __awaiter(void 0, void 0, void 0, function* () {
+    clearInterval(store.gameInterval);
+});
+const startGame = (store) => __awaiter(void 0, void 0, void 0, function* () {
+    if (store.config.outputFormat == 'canvas') {
+        store.config.canvas = store.config.canvas;
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.resizeCanvas(store);
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.listenToSoundController(store);
     }
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.frameCount = 0;
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.forEach((ghost) => (ghost.scared = false));
-    initializeGrid();
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas')
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawGrid();
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas') {
-        if (!_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.enableSounds) {
+    store.frameCount = 0;
+    store.ghosts.forEach((ghost) => (ghost.scared = false));
+    initializeGrid(store);
+    if (store.config.outputFormat == 'canvas')
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawGrid(store);
+    if (store.config.outputFormat == 'canvas') {
+        if (!store.config.enableSounds) {
             _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance().mute();
         }
         yield _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance().preloadSounds();
         _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance().startDefaultSound();
         yield _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance().play(_music_player__WEBPACK_IMPORTED_MODULE_2__.Sound.BEGINNING);
     }
-    placePacman();
-    placeGhosts();
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'svg') {
-        const remainingCells = () => _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid.some((row) => row.some((cell) => cell > 0));
+    placePacman(store);
+    placeGhosts(store);
+    _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.blinky.img.src = _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.blinky.imgDate;
+    _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.clyde.img.src = _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.clyde.imgDate;
+    _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.inky.img.src = _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.inky.imgDate;
+    _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.pinky.img.src = _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.pinky.imgDate;
+    _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.scared.img.src = _constants__WEBPACK_IMPORTED_MODULE_1__.GHOSTS.scared.imgDate;
+    if (store.config.outputFormat == 'svg') {
+        const remainingCells = () => store.grid.some((row) => row.some((cell) => cell.intensity > 0));
         while (remainingCells()) {
-            yield updateGame();
+            yield updateGame(store);
         }
         // One more time to generate svg
-        yield updateGame();
+        yield updateGame(store);
     }
     else {
-        clearInterval(_store__WEBPACK_IMPORTED_MODULE_3__.Store.gameInterval);
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.gameInterval = setInterval(() => __awaiter(void 0, void 0, void 0, function* () { return yield updateGame(); }), _constants__WEBPACK_IMPORTED_MODULE_1__.DELTA_TIME);
+        clearInterval(store.gameInterval);
+        store.gameInterval = setInterval(() => __awaiter(void 0, void 0, void 0, function* () { return yield updateGame(store); }), _constants__WEBPACK_IMPORTED_MODULE_1__.DELTA_TIME);
     }
 });
-const updateGame = () => __awaiter(void 0, void 0, void 0, function* () {
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.frameCount++;
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.frameCount % _store__WEBPACK_IMPORTED_MODULE_3__.Store.config.gameSpeed !== 0) {
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.gameHistory.push({
-            pacman: Object.assign({}, _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman),
-            ghosts: _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.map((ghost) => (Object.assign({}, ghost))),
-            grid: _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid.map((row) => [...row])
+const updateGame = (store) => __awaiter(void 0, void 0, void 0, function* () {
+    store.frameCount++;
+    if (store.frameCount % store.config.gameSpeed !== 0) {
+        store.gameHistory.push({
+            pacman: Object.assign({}, store.pacman),
+            ghosts: store.ghosts.map((ghost) => (Object.assign({}, ghost))),
+            grid: store.grid.map((row) => [...row.map((col) => col.intensity)])
         });
         return;
     }
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.deadReaminingDuration) {
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.deadReaminingDuration--;
-        if (!_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.deadReaminingDuration) {
+    if (store.pacman.deadRemainingDuration) {
+        store.pacman.deadRemainingDuration--;
+        if (!store.pacman.deadRemainingDuration) {
             // IT'S ALIVE!
-            if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas')
+            if (store.config.outputFormat == 'canvas')
                 _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance()
                     .play(_music_player__WEBPACK_IMPORTED_MODULE_2__.Sound.GAME_OVER)
                     .then(() => _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance().startDefaultSound());
         }
     }
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.powerupReaminingDuration) {
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.powerupReaminingDuration--;
-        if (!_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.powerupReaminingDuration) {
-            _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.forEach((ghost) => (ghost.scared = false));
-            _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.points = 0;
+    if (store.pacman.powerupRemainingDuration) {
+        store.pacman.powerupRemainingDuration--;
+        if (!store.pacman.powerupRemainingDuration) {
+            store.ghosts.forEach((ghost) => (ghost.scared = false));
+            store.pacman.points = 0;
         }
     }
-    const remainingCells = _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid.some((row) => row.some((cell) => cell > 0));
+    const remainingCells = store.grid.some((row) => row.some((cell) => cell.intensity > 0));
     if (!remainingCells) {
-        if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas') {
-            clearInterval(_store__WEBPACK_IMPORTED_MODULE_3__.Store.gameInterval);
-            if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas') {
-                _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.renderGameOver();
+        if (store.config.outputFormat == 'canvas') {
+            clearInterval(store.gameInterval);
+            if (store.config.outputFormat == 'canvas') {
+                _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.renderGameOver(store);
                 _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance()
                     .play(_music_player__WEBPACK_IMPORTED_MODULE_2__.Sound.BEGINNING)
                     .then(() => _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance().stopDefaultSound());
             }
         }
-        if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'svg') {
-            const animatedSVG = _svg__WEBPACK_IMPORTED_MODULE_4__.SVG.generateAnimatedSVG();
+        if (store.config.outputFormat == 'svg') {
+            const animatedSVG = _svg__WEBPACK_IMPORTED_MODULE_3__.SVG.generateAnimatedSVG(store);
             const svgBlob = new Blob([animatedSVG], {
                 type: 'image/svg+xml;charset=utf-8'
             });
             const svgUrl = URL.createObjectURL(svgBlob);
-            _store__WEBPACK_IMPORTED_MODULE_3__.Store.config.svgCallback(svgUrl);
+            store.config.svgCallback(svgUrl);
         }
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.config.gameOverCallback();
+        store.config.gameOverCallback();
         return;
     }
-    movePacman();
-    moveGhosts();
-    checkCollisions();
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacmanMouthOpen = !_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacmanMouthOpen;
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.gameHistory.push({
-        pacman: Object.assign({}, _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman),
-        ghosts: _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.map((ghost) => (Object.assign({}, ghost))),
-        grid: _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid.map((row) => [...row])
+    movePacman(store);
+    moveGhosts(store);
+    checkCollisions(store);
+    store.pacmanMouthOpen = !store.pacmanMouthOpen;
+    store.gameHistory.push({
+        pacman: Object.assign({}, store.pacman),
+        ghosts: store.ghosts.map((ghost) => (Object.assign({}, ghost))),
+        grid: store.grid.map((row) => [...row.map((col) => col.intensity)])
     });
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas')
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawGrid();
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas')
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawPacman();
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas')
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawGhosts();
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas')
-        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawSoundController();
+    if (store.config.outputFormat == 'canvas')
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawGrid(store);
+    if (store.config.outputFormat == 'canvas')
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawPacman(store);
+    if (store.config.outputFormat == 'canvas')
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawGhosts(store);
+    if (store.config.outputFormat == 'canvas')
+        _canvas__WEBPACK_IMPORTED_MODULE_0__.Canvas.drawSoundController(store);
 });
-const movePacman = () => {
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.deadReaminingDuration) {
+const movePacman = (store) => {
+    if (store.pacman.deadRemainingDuration) {
         return;
     }
     let targetCells = [];
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.powerupReaminingDuration) {
-        targetCells = _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.map((ghost) => ({
+    if (store.pacman.powerupRemainingDuration) {
+        targetCells = store.ghosts.map((ghost) => ({
             x: ghost.x,
             y: ghost.y,
             distance: Infinity
@@ -471,7 +490,7 @@ const movePacman = () => {
     else {
         for (let x = 0; x < _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_HEIGHT; x++) {
             for (let y = 0; y < _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH; y++) {
-                if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[x][y] > 0)
+                if (store.grid[x][y].intensity > 0)
                     targetCells.push({ x, y, distance: Infinity });
             }
         }
@@ -479,28 +498,30 @@ const movePacman = () => {
     if (targetCells.length === 0)
         return;
     const closest = targetCells.reduce((closest, cell) => {
-        const distance = Math.abs(cell.x - _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.x) + Math.abs(cell.y - _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.y);
+        const distance = Math.abs(cell.x - store.pacman.x) + Math.abs(cell.y - store.pacman.y);
         return distance < closest.distance ? Object.assign(Object.assign({}, cell), { distance }) : closest;
-    }, { x: _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.x, y: _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.y, distance: Infinity });
-    const dx = closest.x - _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.x;
-    const dy = closest.y - _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.y;
+    }, { x: store.pacman.x, y: store.pacman.y, distance: Infinity });
+    const dx = closest.x - store.pacman.x;
+    const dy = closest.y - store.pacman.y;
     if (Math.abs(dx) > Math.abs(dy)) {
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.x += Math.sign(dx);
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.direction = dx > 0 ? 'down' : 'up';
+        store.pacman.x += Math.sign(dx);
+        store.pacman.direction = dx > 0 ? 'down' : 'up';
     }
     else {
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.y += Math.sign(dy);
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.direction = dy > 0 ? 'right' : 'left';
+        store.pacman.y += Math.sign(dy);
+        store.pacman.direction = dy > 0 ? 'right' : 'left';
     }
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.x][_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.y] > 0) {
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.points += 1;
-        _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.x][_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.y] = 0;
-        if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.points >= 30)
-            activatePowerUp();
+    if (store.grid[store.pacman.x][store.pacman.y].intensity > 0) {
+        store.pacman.totalPoints += store.grid[store.pacman.x][store.pacman.y].commitsCount;
+        store.pacman.points++;
+        store.config.pointsIncreasedCallback(store.pacman.totalPoints);
+        store.grid[store.pacman.x][store.pacman.y].intensity = 0;
+        if (store.pacman.points >= 30)
+            activatePowerUp(store);
     }
 };
-const moveGhosts = () => {
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.forEach((ghost, index) => {
+const moveGhosts = (store) => {
+    store.ghosts.forEach((ghost, index) => {
         if (ghost.scared) {
             if (!ghost.target) {
                 ghost.target = getRandomDestination(ghost.x, ghost.y);
@@ -528,7 +549,7 @@ const moveGhosts = () => {
             ];
             const [dx, dy] = directions[Math.floor(Math.random() * directions.length)];
             // If Pacman has the power-up, ghosts move slower (move every other frame)
-            if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.powerupReaminingDuration && Math.random() < 0.5)
+            if (store.pacman.powerupRemainingDuration && Math.random() < 0.5)
                 return;
             const newX = ghost.x + dx;
             const newY = ghost.y + dy;
@@ -548,23 +569,23 @@ const getRandomDestination = (x, y) => {
         y: Math.max(0, Math.min(randomY, _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH - 1))
     };
 };
-const checkCollisions = () => {
-    if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.deadReaminingDuration)
+const checkCollisions = (store) => {
+    if (store.pacman.deadRemainingDuration)
         return;
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.forEach((ghost, index) => {
-        if (ghost.x === _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.x && ghost.y === _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.y) {
-            if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.powerupReaminingDuration && ghost.scared) {
-                respawnGhost(index);
-                _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.points += 10;
-                if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas') {
+    store.ghosts.forEach((ghost, index) => {
+        if (ghost.x === store.pacman.x && ghost.y === store.pacman.y) {
+            if (store.pacman.powerupRemainingDuration && ghost.scared) {
+                respawnGhost(store, index);
+                store.pacman.points += 10;
+                if (store.config.outputFormat == 'canvas') {
                     _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance().play(_music_player__WEBPACK_IMPORTED_MODULE_2__.Sound.EAT_GHOST);
                 }
             }
             else {
-                _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.points = 0;
-                _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.powerupReaminingDuration = 0;
-                _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.deadReaminingDuration = _constants__WEBPACK_IMPORTED_MODULE_1__.PACMAN_DEATH_DURATION;
-                if (_store__WEBPACK_IMPORTED_MODULE_3__.Store.config.outputFormat == 'canvas') {
+                store.pacman.points = 0;
+                store.pacman.powerupRemainingDuration = 0;
+                store.pacman.deadRemainingDuration = _constants__WEBPACK_IMPORTED_MODULE_1__.PACMAN_DEATH_DURATION;
+                if (store.config.outputFormat == 'canvas') {
                     _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance()
                         .play(_music_player__WEBPACK_IMPORTED_MODULE_2__.Sound.GAME_OVER)
                         .then(() => _music_player__WEBPACK_IMPORTED_MODULE_2__.MusicPlayer.getInstance().stopDefaultSound());
@@ -573,26 +594,27 @@ const checkCollisions = () => {
         }
     });
 };
-const respawnGhost = (ghostIndex) => {
+const respawnGhost = (store, ghostIndex) => {
     let x, y;
     do {
         x = Math.floor(Math.random() * _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_HEIGHT);
         y = Math.floor(Math.random() * _constants__WEBPACK_IMPORTED_MODULE_1__.GRID_WIDTH);
-    } while ((Math.abs(x - _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.x) <= 2 && Math.abs(y - _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.y) <= 2) || _store__WEBPACK_IMPORTED_MODULE_3__.Store.grid[x][y] === 0);
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts[ghostIndex] = {
+    } while ((Math.abs(x - store.pacman.x) <= 2 && Math.abs(y - store.pacman.y) <= 2) || store.grid[x][y].intensity === 0);
+    store.ghosts[ghostIndex] = {
         x,
         y,
-        color: _constants__WEBPACK_IMPORTED_MODULE_1__.GHOST_COLORS[ghostIndex % _constants__WEBPACK_IMPORTED_MODULE_1__.GHOST_COLORS.length],
+        name: _constants__WEBPACK_IMPORTED_MODULE_1__.GHOST_NAMES[ghostIndex % _constants__WEBPACK_IMPORTED_MODULE_1__.GHOST_NAMES.length],
         scared: false,
         target: undefined
     };
 };
-const activatePowerUp = () => {
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.pacman.powerupReaminingDuration = _constants__WEBPACK_IMPORTED_MODULE_1__.PACMAN_POWERUP_DURATION;
-    _store__WEBPACK_IMPORTED_MODULE_3__.Store.ghosts.forEach((ghost) => (ghost.scared = true));
+const activatePowerUp = (store) => {
+    store.pacman.powerupRemainingDuration = _constants__WEBPACK_IMPORTED_MODULE_1__.PACMAN_POWERUP_DURATION;
+    store.ghosts.forEach((ghost) => (ghost.scared = true));
 };
 const Game = {
-    startGame
+    startGame,
+    stopGame
 };
 
 
@@ -620,10 +642,10 @@ var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _argume
 };
 var Sound;
 (function (Sound) {
-    Sound["DEFAULT"] = "/src/assets/sounds/pacman_chomp.wav";
-    Sound["BEGINNING"] = "/src/assets/sounds/pacman_beginning.wav";
-    Sound["GAME_OVER"] = "/src/assets/sounds/pacman_death.wav";
-    Sound["EAT_GHOST"] = "/src/assets/sounds/pacman_eatghost.wav";
+    Sound["DEFAULT"] = "https://cdn.jsdelivr.net/gh/abozanona/pacman-contribution-graph@1.0.2/src/assets/sounds/pacman_chomp.wav";
+    Sound["BEGINNING"] = "https://cdn.jsdelivr.net/gh/abozanona/pacman-contribution-graph@1.0.2/src/assets/sounds/pacman_beginning.wav";
+    Sound["GAME_OVER"] = "https://cdn.jsdelivr.net/gh/abozanona/pacman-contribution-graph@1.0.2/src/assets/sounds/pacman_death.wav";
+    Sound["EAT_GHOST"] = "https://cdn.jsdelivr.net/gh/abozanona/pacman-contribution-graph@1.0.2/src/assets/sounds/pacman_eatghost.wav";
 })(Sound || (Sound = {}));
 class MusicPlayer {
     constructor() {
@@ -655,7 +677,10 @@ class MusicPlayer {
                 return;
             }
             if (this.currentSource) {
-                this.currentSource.stop();
+                try {
+                    this.currentSource.stop();
+                }
+                catch (ex) { }
             }
             const buffer = this.sounds.get(sound);
             if (!buffer) {
@@ -678,7 +703,10 @@ class MusicPlayer {
     }
     startDefaultSound() {
         if (this.defaultSource) {
-            this.defaultSource.stop();
+            try {
+                this.defaultSource.stop();
+            }
+            catch (ex) { }
         }
         const buffer = this.sounds.get(Sound.DEFAULT);
         if (!buffer) {
@@ -695,7 +723,10 @@ class MusicPlayer {
     }
     stopDefaultSound() {
         if (this.defaultSource) {
-            this.defaultSource.stop();
+            try {
+                this.defaultSource.stop();
+            }
+            catch (ex) { }
             this.defaultSource = null;
         }
     }
@@ -740,8 +771,9 @@ const Store = {
         y: 0,
         direction: 'right',
         points: 0,
-        deadReaminingDuration: 0,
-        powerupReaminingDuration: 0
+        totalPoints: 0,
+        deadRemainingDuration: 0,
+        powerupRemainingDuration: 0
     },
     ghosts: [],
     grid: [],
@@ -767,23 +799,22 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   SVG: () => (/* binding */ SVG)
 /* harmony export */ });
 /* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./constants */ "./src/constants.ts");
-/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./store */ "./src/store.ts");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ "./src/utils.ts");
-
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils */ "./src/utils.ts");
 
 
-const generateAnimatedSVG = () => {
+const generateAnimatedSVG = (store) => {
     const svgWidth = _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_WIDTH * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE);
     const svgHeight = _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_HEIGHT * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + 20;
     let svg = `<svg width="${svgWidth}" height="${svgHeight}" xmlns="http://www.w3.org/2000/svg">`;
-    svg += `<rect width="100%" height="100%" fill="${_utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme().gridBackground}"/>`;
+    svg += `<rect width="100%" height="100%" fill="${_utils__WEBPACK_IMPORTED_MODULE_1__.Utils.getCurrentTheme(store).gridBackground}"/>`;
+    svg += generateGhostsPredefinition();
     // Month labels
     let lastMonth = '';
     for (let y = 0; y < _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_WIDTH; y++) {
-        if (_store__WEBPACK_IMPORTED_MODULE_1__.Store.monthLabels[y] !== lastMonth) {
+        if (store.monthLabels[y] !== lastMonth) {
             const xPos = y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + _constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2;
-            svg += `<text x="${xPos}" y="10" text-anchor="middle" font-size="10" fill="${_utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme().textColor}">${_store__WEBPACK_IMPORTED_MODULE_1__.Store.monthLabels[y]}</text>`;
-            lastMonth = _store__WEBPACK_IMPORTED_MODULE_1__.Store.monthLabels[y];
+            svg += `<text x="${xPos}" y="10" text-anchor="middle" font-size="10" fill="${_utils__WEBPACK_IMPORTED_MODULE_1__.Utils.getCurrentTheme(store).textColor}">${store.monthLabels[y]}</text>`;
+            lastMonth = store.monthLabels[y];
         }
     }
     // Grid
@@ -791,59 +822,40 @@ const generateAnimatedSVG = () => {
         for (let y = 0; y < _constants__WEBPACK_IMPORTED_MODULE_0__.GRID_WIDTH; y++) {
             const cellX = y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE);
             const cellY = x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + 15;
-            const intensity = _store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory[0].grid[x][y];
-            const color = intensity > 0 ? getContributionColor(intensity) : _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme().emptyContributionBoxColor;
+            const intensity = store.gameHistory[0].grid[x][y];
+            const color = intensity > 0 ? getContributionColor(store, intensity) : _utils__WEBPACK_IMPORTED_MODULE_1__.Utils.getCurrentTheme(store).emptyContributionBoxColor;
             svg += `<rect id="cell-${x}-${y}" x="${cellX}" y="${cellY}" width="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE}" height="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE}" rx="5" fill="${color}">
-                <animate attributeName="fill" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite" 
-                    values="${generateCellColorValues(x, y)}" 
-                    keyTimes="${generateKeyTimes()}"/>
+                <animate attributeName="fill" dur="${store.gameHistory.length * 300}ms" repeatCount="indefinite" 
+                    values="${generateCellColorValues(store, x, y)}" 
+                    keyTimes="${generateKeyTimes(store)}"/>
             </rect>`;
         }
     }
     // Pacman
     svg += `<path id="pacman" d="${generatePacManPath(0.35)}"
-        transform="translate(${_store__WEBPACK_IMPORTED_MODULE_1__.Store.pacman.y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE)}, ${_store__WEBPACK_IMPORTED_MODULE_1__.Store.pacman.x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + 15})">
-		<animate attributeName="fill" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite"
-                keyTimes="${generateKeyTimes()}"
-                values="${generatePacManColors()}"/>
-        <animateTransform attributeName="transform" type="translate" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite"
-            keyTimes="${generateKeyTimes()}"
-            values="${generatePacManPositions()}"/>
+        transform="translate(${store.pacman.y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE)}, ${store.pacman.x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + 15})">
+		<animate attributeName="fill" dur="${store.gameHistory.length * 300}ms" repeatCount="indefinite"
+                keyTimes="${generateKeyTimes(store)}"
+                values="${generatePacManColors(store)}"/>
+        <animateTransform attributeName="transform" type="translate" dur="${store.gameHistory.length * 300}ms" repeatCount="indefinite"
+            keyTimes="${generateKeyTimes(store)}"
+            values="${generatePacManPositions(store)}"/>
         <animate attributeName="d" dur="0.2s" repeatCount="indefinite"
             values="${generatePacManPath(0.25)};${generatePacManPath(0.05)};${generatePacManPath(0.25)}"/>
     </path>`;
     // Ghosts
-    _store__WEBPACK_IMPORTED_MODULE_1__.Store.ghosts.forEach((ghost, index) => {
-        svg += `<path id="ghost${index}" d="${generateGhostPath(_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 2)}" fill="${ghost.color}">
-            <animate attributeName="fill" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite"
-                keyTimes="${generateKeyTimes()}"
-                values="${generateGhostColors(index)}"/>
-            <animateTransform attributeName="transform" type="translate" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite"
-                keyTimes="${generateKeyTimes()}"
-                values="${generateGhostPositions(index)}"/>
-        </path>
-        <circle cx="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 3}" cy="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 3}" r="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 8}" fill="white">
-            <animateTransform attributeName="transform" type="translate" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite"
-                keyTimes="${generateKeyTimes()}"
-                values="${generateGhostPositions(index)}"/>
-        </circle>
-        <circle cx="${(_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE * 2) / 3}" cy="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 3}" r="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 8}" fill="white">
-            <animateTransform attributeName="transform" type="translate" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite"
-                keyTimes="${generateKeyTimes()}"
-                values="${generateGhostPositions(index)}"/>
-        </circle>
-        <circle cx="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 3}" cy="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 3}" r="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 16}" fill="black">
-            <animateTransform attributeName="transform" type="translate" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite"
-                keyTimes="${generateKeyTimes()}"
-                values="${generateGhostPositions(index)}"/>
-        </circle>
-        <circle cx="${(_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE * 2) / 3}" cy="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 3}" r="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE / 16}" fill="black">
-            <animateTransform attributeName="transform" type="translate" dur="${_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length * 300}ms" repeatCount="indefinite"
-                keyTimes="${generateKeyTimes()}"
-                values="${generateGhostPositions(index)}"/>
-        </circle>`;
+    store.ghosts.forEach((ghost, index) => {
+        svg += `<use id="ghost${index}" width="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE}" height="${_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE}" href="#ghost-${ghost.name}">
+            <animateTransform attributeName="transform" type="translate" dur="${store.gameHistory.length * 300}ms" repeatCount="indefinite"
+                keyTimes="${generateKeyTimes(store)}"
+                values="${generateGhostPositions(store, index)}"/>
+            <animate attributeName="href" dur="${store.gameHistory.length * 300}ms" repeatCount="indefinite"
+                keyTimes="${generateKeyTimes(store)}"
+                values="${generateGhostColors(store, index)}"/>
+        </use>`;
     });
     svg += '</svg>';
+    // TODO: minify SVG
     return svg;
 };
 const generatePacManPath = (mouthAngle) => {
@@ -855,11 +867,11 @@ const generatePacManPath = (mouthAngle) => {
             A ${radius},${radius} 0 1,1 ${radius + radius * Math.cos(endAngle)},${radius + radius * Math.sin(endAngle)}
             Z`;
 };
-const generateKeyTimes = () => {
-    return _store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.map((_, index) => index / (_store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory.length - 1)).join(';');
+const generateKeyTimes = (store) => {
+    return store.gameHistory.map((_, index) => index / (store.gameHistory.length - 1)).join(';');
 };
-const generatePacManPositions = () => {
-    return _store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory
+const generatePacManPositions = (store) => {
+    return store.gameHistory
         .map((state) => {
         const x = state.pacman.y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE);
         const y = state.pacman.x * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE) + 15;
@@ -867,13 +879,13 @@ const generatePacManPositions = () => {
     })
         .join(';');
 };
-const generatePacManColors = () => {
-    return _store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory
+const generatePacManColors = (store) => {
+    return store.gameHistory
         .map((state) => {
-        if (state.pacman.deadReaminingDuration) {
+        if (state.pacman.deadRemainingDuration) {
             return _constants__WEBPACK_IMPORTED_MODULE_0__.PACMAN_COLOR_DEAD;
         }
-        else if (state.pacman.powerupReaminingDuration) {
+        else if (state.pacman.powerupRemainingDuration) {
             return _constants__WEBPACK_IMPORTED_MODULE_0__.PACMAN_COLOR_POWERUP;
         }
         else {
@@ -882,20 +894,20 @@ const generatePacManColors = () => {
     })
         .join(';');
 };
-const generateCellColorValues = (x, y) => {
-    return _store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory
+const generateCellColorValues = (store, x, y) => {
+    return store.gameHistory
         .map((state) => {
         const intensity = state.grid[x][y];
-        return intensity > 0 ? getContributionColor(intensity) : _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme().emptyContributionBoxColor;
+        return intensity > 0 ? getContributionColor(store, intensity) : _utils__WEBPACK_IMPORTED_MODULE_1__.Utils.getCurrentTheme(store).emptyContributionBoxColor;
     })
         .join(';');
 };
-const getContributionColor = (intensity) => {
+const getContributionColor = (store, intensity) => {
     const adjustedIntensity = intensity < 0.2 ? 0.3 : intensity;
-    return _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.hexToRGBA(_utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getCurrentTheme().contributionBoxColor, adjustedIntensity);
+    return _utils__WEBPACK_IMPORTED_MODULE_1__.Utils.hexToRGBA(_utils__WEBPACK_IMPORTED_MODULE_1__.Utils.getCurrentTheme(store).contributionBoxColor, adjustedIntensity);
 };
-const generateGhostPositions = (ghostIndex) => {
-    return _store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory
+const generateGhostPositions = (store, ghostIndex) => {
+    return store.gameHistory
         .map((state) => {
         const ghost = state.ghosts[ghostIndex];
         const x = ghost.y * (_constants__WEBPACK_IMPORTED_MODULE_0__.CELL_SIZE + _constants__WEBPACK_IMPORTED_MODULE_0__.GAP_SIZE);
@@ -904,25 +916,33 @@ const generateGhostPositions = (ghostIndex) => {
     })
         .join(';');
 };
-const generateGhostPath = (radius) => {
-    return `M ${radius},${radius * 2}
-            Q ${radius * 0.8},${radius * 1.5} ${radius * 0.5},${radius * 1.3}
-            Q ${radius * 0.3},${radius * 1.1} 0,${radius}
-            L 0,0
-            L ${radius * 2},0
-            L ${radius * 2},${radius}
-            Q ${radius * 1.7},${radius * 1.1} ${radius * 1.5},${radius * 1.3}
-            Q ${radius * 1.2},${radius * 1.5} ${radius},${radius * 2}
-            Z`;
-};
-const generateGhostColors = (ghostIndex) => {
-    return _store__WEBPACK_IMPORTED_MODULE_1__.Store.gameHistory
+const generateGhostColors = (store, ghostIndex) => {
+    return store.gameHistory
         .map((state) => {
         const ghost = state.ghosts[ghostIndex];
-        return ghost.scared ? 'blue' : ghost.color;
+        return ghost.scared ? '#scared' : '#' + ghost.name;
     })
         .join(';');
 };
+const generateGhostsPredefinition = () => {
+    return `<defs>
+		<symbol id="blinky" viewBox="0 0 100 100">
+            <image href="${_constants__WEBPACK_IMPORTED_MODULE_0__.GHOSTS['blinky'].imgDate}" width="100" height="100"/>
+		</symbol>
+		<symbol id="clyde" viewBox="0 0 100 100">
+            <image href="${_constants__WEBPACK_IMPORTED_MODULE_0__.GHOSTS['clyde'].imgDate}" width="100" height="100"/>
+		</symbol>
+		<symbol id="inky" viewBox="0 0 100 100">
+            <image href="${_constants__WEBPACK_IMPORTED_MODULE_0__.GHOSTS['inky'].imgDate}" width="100" height="100"/>
+		</symbol>
+		<symbol id="pinky" viewBox="0 0 100 100">
+            <image href="${_constants__WEBPACK_IMPORTED_MODULE_0__.GHOSTS['pinky'].imgDate}" width="100" height="100"/>
+		</symbol>
+		<symbol id="scared" viewBox="0 0 100 100">
+            <image href="${_constants__WEBPACK_IMPORTED_MODULE_0__.GHOSTS['scared'].imgDate}" width="100" height="100"/>
+		</symbol>
+	</defs>`;
+};
 const SVG = {
     generateAnimatedSVG
 };
@@ -941,7 +961,6 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   Utils: () => (/* binding */ Utils)
 /* harmony export */ });
 /* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./constants */ "./src/constants.ts");
-/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./store */ "./src/store.ts");
 var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -952,9 +971,9 @@ var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _argume
     });
 };
 
-
 const getGitlabContribution = (username) => __awaiter(void 0, void 0, void 0, function* () {
-    const response = yield fetch(`https://gitlab.com/users/${username}/calendar.json`);
+    // const response = await fetch(`https://gitlab.com/users/${username}/calendar.json`);
+    const response = yield fetch(`https://v0-new-project-q1hhrdodoye-abozanona-gmailcoms-projects.vercel.app/api/contributions?username=${username}`);
     const contributionsList = yield response.json();
     return Object.entries(contributionsList).map(([date, count]) => ({
         date: new Date(date),
@@ -973,9 +992,9 @@ const getGithubContribution = (username) => __awaiter(void 0, void 0, void 0, fu
     }, new Map())
         .values());
 });
-const getCurrentTheme = () => {
+const getCurrentTheme = (store) => {
     var _a;
-    return (_a = _constants__WEBPACK_IMPORTED_MODULE_0__.GAME_THEMES[_store__WEBPACK_IMPORTED_MODULE_1__.Store.config.gameTheme]) !== null && _a !== void 0 ? _a : _constants__WEBPACK_IMPORTED_MODULE_0__.GAME_THEMES['github'];
+    return (_a = _constants__WEBPACK_IMPORTED_MODULE_0__.GAME_THEMES[store.config.gameTheme]) !== null && _a !== void 0 ? _a : _constants__WEBPACK_IMPORTED_MODULE_0__.GAME_THEMES['github'];
 };
 function hexToRGBA(hex, alpha) {
     const r = parseInt(hex.slice(1, 3), 16);
@@ -1057,7 +1076,7 @@ var __webpack_exports__ = {};
   \**********************/
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   renderContributions: () => (/* binding */ renderContributions)
+/* harmony export */   PacmanRenderer: () => (/* binding */ PacmanRenderer)
 /* harmony export */ });
 /* harmony import */ var _game__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./game */ "./src/game.ts");
 /* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./store */ "./src/store.ts");
@@ -1074,33 +1093,45 @@ var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _argume
 
 
 
-const renderContributions = (conf) => __awaiter(void 0, void 0, void 0, function* () {
-    const defaultConfing = {
-        platform: 'github',
-        username: '',
-        canvas: undefined,
-        outputFormat: 'svg',
-        svgCallback: (_) => { },
-        gameOverCallback: () => () => { },
-        gameTheme: 'github',
-        gameSpeed: 1,
-        enableSounds: true
-    };
-    _store__WEBPACK_IMPORTED_MODULE_1__.Store.config = Object.assign(Object.assign({}, defaultConfing), conf);
-    switch (conf.platform) {
-        case 'gitlab':
-            _store__WEBPACK_IMPORTED_MODULE_1__.Store.contributions = yield _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getGitlabContribution(conf.username);
-            break;
-        case 'github':
-            _store__WEBPACK_IMPORTED_MODULE_1__.Store.contributions = yield _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getGithubContribution(conf.username);
-            break;
+class PacmanRenderer {
+    constructor(conf) {
+        this.store = Object.assign({}, _store__WEBPACK_IMPORTED_MODULE_1__.Store);
+        this.conf = Object.assign({}, conf);
     }
-    _game__WEBPACK_IMPORTED_MODULE_0__.Game.startGame();
-});
+    start() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const defaultConfing = {
+                platform: 'github',
+                username: '',
+                canvas: undefined,
+                outputFormat: 'svg',
+                svgCallback: (_) => { },
+                gameOverCallback: () => () => { },
+                gameTheme: 'github',
+                gameSpeed: 1,
+                enableSounds: true,
+                pointsIncreasedCallback: (_) => { }
+            };
+            this.store.config = Object.assign(Object.assign({}, defaultConfing), this.conf);
+            switch (this.conf.platform) {
+                case 'gitlab':
+                    this.store.contributions = yield _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getGitlabContribution(this.conf.username);
+                    break;
+                case 'github':
+                    this.store.contributions = yield _utils__WEBPACK_IMPORTED_MODULE_2__.Utils.getGithubContribution(this.conf.username);
+                    break;
+            }
+            _game__WEBPACK_IMPORTED_MODULE_0__.Game.startGame(this.store);
+        });
+    }
+    stop() {
+        _game__WEBPACK_IMPORTED_MODULE_0__.Game.stopGame(this.store);
+    }
+}
 
 })();
 
-var __webpack_exports__renderContributions = __webpack_exports__.renderContributions;
-export { __webpack_exports__renderContributions as renderContributions };
+var __webpack_exports__PacmanRenderer = __webpack_exports__.PacmanRenderer;
+export { __webpack_exports__PacmanRenderer as PacmanRenderer };
 
 //# sourceMappingURL=pacman-contribution-graph.js.map