Geoguess Master is a free geoguess game.

Overview

Geoguess Master

logo

https://geoguessmaster.com/

About

Geoguess Master is a free geoguess game. Players compete how close each player can guess a random locations in five rounds. You can play multiplayer game with your friends up to five friends. The first player creates a room and decide a room size, and then other players type the same room name name as the first player decided and the game will start.

Build Setup

You need to configure Google Maps Platform and Firebase to make game work. See the instructions below.

Once you get an API key and register the project with Firebase, create files named .env.development.local and .env.production.local inside this project to put environment variables. The files should be like this.

.env.production.local

NODE_ENV=production
VUE_APP_API_KEY=YOUR_GOOGLE_MAPS_API_KEY
VUE_APP_FIREBASE_API_KEY=YOUR_FIREBASE_API_KEY
VUE_APP_FIREBASE_PROJECT_ID=YOUR_FIREBASE_PROJECT_ID
VUE_APP_FIREBASE_MESSAGING_SENDER_ID=YOUR_FIREBASE_MESSAGING_SENDER_ID
VUE_APP_FIREBASE_APP_ID=YOUR_FIREBASE_APP_ID
VUE_APP_FIREBASE_MEASUREMENT_ID=YOUR_FIREBASE_MEASUREMENT_ID

.env.development.local

NODE_ENV=development
...

Now you can run this game.
Download Node.js here if you don't have and make sure you can run npm from the terminal.

# install dependencies
npm install

# run locally
npm run serve

# build for production
npm run build

How to build your own game server (Step by step)

Prerequisite

1. Fork this project

First, create your Github account if you don't have and fork this project (Click Fork button at the top right coner of the this project page). There should be a copy of this project on your list of repository now.

2. Connect your Netlify account to your Github

You could use other hosting service but here I use Netlify. Create your Netlify account if you don't have. You can connect your Netlify account when you sign up or on user settings (Click the avatar icon at the top right corner and there is Connected accounts section there).

3. Create database for your game server on Firebase

Create a Firebase project from Firebase console. (Make sure to turn on Enable Google Analytics for this project.) After you created a project, you need to add your website to the Firebase project. Cick the Web icon and enter your app's nickname and then click Register app. Some variables will be generated for your website. These variables will be used at step 5. Go back to project overview page, and select Realtime Database from the left sidebar. Click Create Database button.

4. Get Google API key

Go to Google Cloud Console, and create a Google Cloud project. After creating a project, go to project top page and select APIs & Services > Credentials from the left sidebar. On the Credentials page, click Create credentials > API key. The new API key is listed on the Credentials page under API keys. This Google API key will be used at step 5.

5. Host your own website

Click New site from Git button from your Netlify top page. Click Github icon and choose your project repository you forked. Build options will look like below. Also you need to connect your project to your database in your Firebase project. Click Show advanced button and New variable button will appear. Click New variable button and you can set API key and variables that have been generated at step 3 and step 4. Set variables like below. (Replace the values with yours. The last two key names are VUE_APP_FIREBASE_MESSAGING_SENDER_ID and VUE_APP_FIREBASE_MEASUREMENT_ID.) Click Deploy site.

That's it! Your site domain will appear on the project page after the project has been deployed. Now you can play games as much as you want! Feel free to ask questions on Discord if you have troubles.

Features

  • Free game with no ads
  • Multiplayer game using realtime database

Contributors

Paulo Gomes, UI design

License

Licensed under MIT License

Contact

Feel free to give me feedback.

[email protected]
or
Discord

Issues
  • Blank app after deploying own game server

    Blank app after deploying own game server

    I followed the instructions as provided in the repo readme to build and deploy my own game server. When I try to deploy the app from netlify after building, the site loads a blank screen. Am I missing something? I'm new to the GCP related stuff. So any pointers to resolve the issue would be helpful. Thanks.

    opened by psknayak 9
  • Feature to select specific country, city, state

    Feature to select specific country, city, state

    Hello, I made a feature to select only specific country, city, state.

    Add:

    SearchBar on HomePage

    image

    Custom geojson

    I had feature to make custom map with Geojson Polygon image

    image

    Example : biggestCitymap.geojson https://gist.github.com/BilelJegham/7f855024440c67d65f24536c9215719e#file-map-geojson Link : GeoJsonEditor

    Fix:

    1. Fix Montserrat Font
    opened by BilelJegham 6
  • Fix marker placing bug

    Fix marker placing bug

    When selecting a position on the map, the marker is placed incorrectly because "transform" CSS property is set to 1.25. This commit fixes this by setting initial "transform" to 0.75 and when the user wants to place a marker on the map, the "transform" becomes 1.

    opened by olehmisar 4
  • Memory leak issue

    Memory leak issue

    I don't know why but after 2 hours playing firefox ram usage was 12GB. After some time my system freezed

    bug 
    opened by McStecca 4
  • Correct player order

    Correct player order

    Let's sort players according to their rank to increase visibility for the winner

    opened by knight37x 3
  • Need more docs for noobs

    Need more docs for noobs

    Hi, This project looks really cool but I'm a total noob with GCP. Do you think you can make a more in-depth documentation for get all those API keys ? I can't actually test it because I'm lost in GCP console... :/

    Maybe explain what they are use for and will I get charge at some time if I make a lot of requests ?

    enhancement 
    opened by gnouts 3
  • Make next button green, cancel button red

    Make next button green, cancel button red

    The buttons were the opposite colours to what I expected. This PR swaps the colours to improve usability.

    opened by BLWood 2
  • use the selected location on timeout instead of random location

    use the selected location on timeout instead of random location

    Just a little improvement: If you forgot to hit the guess button then let's still use previously selected but not confirmed location

    opened by knight37x 2
  • VUE_APP_FIREBASE_MEASUREMENT_ID

    VUE_APP_FIREBASE_MEASUREMENT_ID

    Is VUE_APP_FIREBASE_MEASUREMENT_ID missing from the config example?

    opened by gahag 2
  • Czech translation

    Czech translation

    Hey, I've translated the game to Czech language. Some of the translations have been slightly altered in Czech so that they accound for language-specific semantics and make more sense.

    opened by tululum 2
  • Bump ws from 6.2.1 to 6.2.2

    Bump ws from 6.2.1 to 6.2.2

    Bumps ws from 6.2.1 to 6.2.2.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • More players possible and allow continue using

    More players possible and allow continue using "enter" key

    Is there a reason why player we limit to max 5 players? If not I'd suggest to increase this to 10, we often play with more than 5 people. Additionally I added the ability to confirm the text entry using the "enter" keyboard key to reduce the need to use your mouse.

    opened by knight37x 4
  • Larger map

    Larger map

    I'd suggest these changes to increase usability. My friends complained that it is so hard to navigate this small map so I decided to increase its size.

    opened by knight37x 1
  • Sometime the

    Sometime the "guess" position is not the one clicked on the map

    Randomly, the position used to compute who best guessed is not the one clicked on the map, hence unvalidating the scoring. This "wrong" position is the one displayed at the end of the round.

    bug 
    opened by GuillaumeDesforges 4
Simple Trivia Service - a Serverless Single- and Multi-player Trivia Game

Simple Trivia Service - a Serverless Single- and Multi-player Trivia Game This example application shows how to build both single and multiplayer game

AWS Samples 62 Jul 19, 2021
Game of pairs of pokemon cards made with vue.js.

Game of pairs of pokemon cards made with vue.js.

Beatriz Sopeña Merino 1 Jul 19, 2021
Chessboard vue component to load positions, create positions and see threats

vue-chessboard Chessboard vue component to load positions, create positions and see threats It uses chess.js for chess movements and validations It us

vitogit (Alvaro) 119 Jul 18, 2021
使用vue3+vite2实现的数字华容道拼图游戏

数字华容道 线上体验 技术栈 vue3 + vite2 使用

刘小灰 13 Jul 17, 2021
Parte de mi curso de Vue.js de cero a experto

04-pokemon-game Project setup yarn install Compiles and hot-reloads for development yarn serve Compiles and minifies for production yarn build Run

Fernando 4 Jun 30, 2021
The maze game (MVP) built with Vue.js

The maze game (MVP) built with Vue.js

Airat Akhmetshin 11 May 19, 2021
A fully working, most feature-rich Vue.js terminal emulator

vue-command A fully working, most feature-rich Vue.js terminal emulator. See the demo and check the demo source code. Features Parses arguments with g

Julian Claus 158 Jun 29, 2021
A simple word game, built with Vue JS

A simple word game, built with Vue JS (2.0). Inspired by Hangman, it gives you a random (but common English) word, and asks you to guess it, letter by letter.

Debadeep 0 May 5, 2021
A Vue.js component of a simple maze game.

Vue-maze An itty-bitty maze game made as Vue.js component PLAY DEMO Fit to the component size automatically Mousemove/Touchmove/ArrowKey to move the p

Shinya Ishikawa 58 Jul 3, 2021
A simple 8-puzzle game made as a Vue.js component

Vue-8-puzzle An itty-bitty slide puzzle game made as Vue.js component PLAY DEMO Images/Videos for source Auto-resize Install and Usage $ npm install v

Shinya Ishikawa 23 Jun 4, 2021
Matteo Bruni 2.1k Jul 26, 2021
🌟 DataFormsJS 🌟 A minimal JavaScript Framework and standalone React and Web Components for rapid development of high quality websites and single page applications.

?? Welcome to DataFormsJS! Thanks for visiting! ?? ?? ?? ?? ?? ?? 中文 (简体) 欢迎来到 DataFormsJS Español Bienvenido a DataFormsJS Português (do Brasil) Bem

DataFormsJS 108 Jul 8, 2021
budgetzero is a free, open-source, privacy-friendly, offline-first budgeting system.

budgetzero is a free, open-source, privacy-friendly, offline-first budgeting system. Use at budgetzero.io, download the desktop apps or self-host on y

budgetzero 164 Jul 23, 2021
Applications for any device with HTML, CSS and JavaScript - free and open source!

App Framework App Framework development has ended. I recommend using the Framework7 CLI instead. iOS and Android Apps with HTML & JavaScript - App Fra

null 640 Jul 6, 2021