├── CNAME ├── .gitignore ├── assets ├── bad.png ├── i.png ├── m.png ├── pk1.png ├── pk2.png ├── v.png ├── back.jpg ├── black.png ├── blue.png ├── floor.png ├── grass.png ├── logo.png ├── mew1.png ├── mew2.png ├── open.png ├── pkred.png ├── balloon.png ├── pkblack.png └── pkblue.png ├── Gemfile ├── style.css ├── Gemfile.lock ├── _config.yml ├── game.html ├── README.md ├── news.txt ├── index.html ├── sketch.js └── main.css /CNAME: -------------------------------------------------------------------------------- 1 | suburbanversion.com -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | _site 2 | .sass-cache 3 | .jekyll-metadata 4 | -------------------------------------------------------------------------------- /assets/bad.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/bad.png -------------------------------------------------------------------------------- /assets/i.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/i.png -------------------------------------------------------------------------------- /assets/m.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/m.png -------------------------------------------------------------------------------- /assets/pk1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/pk1.png -------------------------------------------------------------------------------- /assets/pk2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/pk2.png -------------------------------------------------------------------------------- /assets/v.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/v.png -------------------------------------------------------------------------------- /assets/back.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/back.jpg -------------------------------------------------------------------------------- /assets/black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/black.png -------------------------------------------------------------------------------- /assets/blue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/blue.png -------------------------------------------------------------------------------- /assets/floor.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/floor.png -------------------------------------------------------------------------------- /assets/grass.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/grass.png -------------------------------------------------------------------------------- /assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/logo.png -------------------------------------------------------------------------------- /assets/mew1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/mew1.png -------------------------------------------------------------------------------- /assets/mew2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/mew2.png -------------------------------------------------------------------------------- /assets/open.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/open.png -------------------------------------------------------------------------------- /assets/pkred.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/pkred.png -------------------------------------------------------------------------------- /assets/balloon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/balloon.png -------------------------------------------------------------------------------- /assets/pkblack.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/pkblack.png -------------------------------------------------------------------------------- /assets/pkblue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/HEAD/assets/pkblue.png -------------------------------------------------------------------------------- /Gemfile: -------------------------------------------------------------------------------- 1 | source "https://rubygems.org" 2 | ruby RUBY_VERSION 3 | 4 | # Hello! This is where you manage which Jekyll version is used to run. 5 | # When you want to use a different version, change it below, save the 6 | # file and run `bundle install`. Run Jekyll with `bundle exec`, like so: 7 | # 8 | # bundle exec jekyll serve 9 | # 10 | # This will help ensure the proper Jekyll version is running. 11 | # Happy Jekylling! 12 | gem "jekyll", "3.6.3" 13 | 14 | # This is the default theme for new Jekyll sites. You may change this to anything you like. 15 | gem "minima" 16 | 17 | # If you want to use GitHub Pages, remove the "gem "jekyll"" above and 18 | # uncomment the line below. To upgrade, run `bundle update github-pages`. 19 | # gem "github-pages", group: :jekyll_plugins 20 | 21 | # If you have any plugins, put them here! 22 | # group :jekyll_plugins do 23 | # gem "jekyll-github-metadata", "~> 1.0" 24 | # end 25 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding: 0; 3 | margin: 0; 4 | overflow:hidden; 5 | font-family: "Source Sans Pro", sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | padding: 0; 9 | margin: 0; 10 | } 11 | 12 | .container{ 13 | display:-webkit-box; 14 | display:-ms-flexbox; 15 | display:flex; 16 | justify-content:center; 17 | flex-direction: column; 18 | align-items:center; 19 | position:relative; 20 | top:20px; 21 | pointer-events:none; 22 | } 23 | .pgoprv{ 24 | position:relative; 25 | max-width:200px; 26 | width:50vw; 27 | pointer-events:none; 28 | } 29 | .pgoprv2{ 30 | position:relative; 31 | top:10px; 32 | max-width:300px; 33 | pointer-events:none; 34 | width:50vw; 35 | pointer-events:none; 36 | } 37 | 38 | .text{ 39 | position:relative; 40 | top:15px; 41 | color: white; 42 | font-size:3em; 43 | font-weight:600; 44 | pointer-events:none; 45 | text-align: center; 46 | pointer-events:none; 47 | } 48 | 49 | .subtext{ 50 | font-size:.5em; 51 | pointer-events:none; 52 | } 53 | 54 | #my{ 55 | position:absolute; 56 | } 57 | @media (max-width:676px) { 58 | .text{ 59 | font-size:2em; 60 | } 61 | } 62 | 63 | @media (max-width:450px) { 64 | 65 | .text{ 66 | font-size:1.7em; 67 | position:relative; 68 | top:60px; 69 | } 70 | } -------------------------------------------------------------------------------- /Gemfile.lock: -------------------------------------------------------------------------------- 1 | GEM 2 | remote: https://rubygems.org/ 3 | specs: 4 | addressable (2.7.0) 5 | public_suffix (>= 2.0.2, < 5.0) 6 | colorator (1.1.0) 7 | ffi (1.11.1) 8 | forwardable-extended (2.6.0) 9 | jekyll (3.6.3) 10 | addressable (~> 2.4) 11 | colorator (~> 1.0) 12 | jekyll-sass-converter (~> 1.0) 13 | jekyll-watch (~> 1.1) 14 | kramdown (~> 1.14) 15 | liquid (~> 4.0) 16 | mercenary (~> 0.3.3) 17 | pathutil (~> 0.9) 18 | rouge (>= 1.7, < 3) 19 | safe_yaml (~> 1.0) 20 | jekyll-sass-converter (1.5.2) 21 | sass (~> 3.4) 22 | jekyll-watch (1.5.1) 23 | listen (~> 3.0) 24 | kramdown (1.17.0) 25 | liquid (4.0.3) 26 | listen (3.2.0) 27 | rb-fsevent (~> 0.10, >= 0.10.3) 28 | rb-inotify (~> 0.9, >= 0.9.10) 29 | mercenary (0.3.6) 30 | minima (1.0.1) 31 | pathutil (0.16.2) 32 | forwardable-extended (~> 2.6) 33 | public_suffix (4.0.1) 34 | rb-fsevent (0.10.3) 35 | rb-inotify (0.10.0) 36 | ffi (~> 1.0) 37 | rouge (2.2.1) 38 | safe_yaml (1.0.5) 39 | sass (3.7.4) 40 | sass-listen (~> 4.0.0) 41 | sass-listen (4.0.0) 42 | rb-fsevent (~> 0.9, >= 0.9.4) 43 | rb-inotify (~> 0.9, >= 0.9.7) 44 | 45 | PLATFORMS 46 | ruby 47 | 48 | DEPENDENCIES 49 | jekyll (= 3.6.3) 50 | minima 51 | 52 | RUBY VERSION 53 | ruby 2.0.0p648 54 | 55 | BUNDLED WITH 56 | 1.12.5 57 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | # Welcome to Jekyll! 2 | # 3 | # This config file is meant for settings that affect your whole blog, values 4 | # which you are expected to set up once and rarely edit after that. If you find 5 | # yourself editing these this file very often, consider using Jekyll's data files 6 | # feature for the data you need to update frequently. 7 | # 8 | # For technical reasons, this file is *NOT* reloaded automatically when you use 9 | # 'jekyll serve'. If you change this file, please restart the server process. 10 | 11 | # Site settings 12 | # These are used to personalize your new site. If you look in the HTML files, 13 | # you will see them accessed via {{ site.title }}, {{ site.email }}, and so on. 14 | # You can create any custom variable you would like, and they will be accessible 15 | # in the templates via {{ site.myvariable }}. 16 | title: Your awesome title 17 | email: your-email@domain.com 18 | description: > # this means to ignore newlines until "baseurl:" 19 | Write an awesome description for your new site here. You can edit this 20 | line in _config.yml. It will appear in your document head meta (for 21 | Google search results) and in your feed.xml site description. 22 | baseurl: "" # the subpath of your site, e.g. /blog 23 | url: "http://example.com" # the base hostname & protocol for your site 24 | twitter_username: jekyllrb 25 | github_username: jekyll 26 | 27 | # Build settings 28 | markdown: kramdown 29 | theme: minima 30 | -------------------------------------------------------------------------------- /game.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Pokemon: Suburban Version | Pokemon GO Simulator 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 |
18 | Pokemon Go Simulator Presents 19 | Pokemon Go Suburban Edition 20 |
Press anywhere to play! 21 |
Catch 10 Pidgey to upgrade your Pokeball!
22 |
Catch 50 Pidgey to upgrade again!
23 |
24 |
25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ### Pokemon: Suburban Version. http://suburbanversion.com/game 2 | 3 | My name's Shane Brunswick, and I'm 14 years old. I set out to make this game in hopes of alerting Niantic of the severity of the communities disdain for current spawning mechanics. 4 | 5 | C'mon, Niantic, I've literally managed to teach myself Javascript just to make a statement regarding the lack of Pokemon in suburban/rural areas in Pokemon GO! (granted, if my game were a Pidgey, by comparison, yours would be a Dragonite, so full marks for... most of what you've done with GO) 6 | 7 | --- 8 | 9 | My games been featured in a multitude of international media outlets! Thank you, everyone, for helping me spread the message! Niantic, if you're reading this, please level the playing field for suburban/rural Pokemon GO players! As you can see below, the lack of viable Pokemon in non-metropolitan areas is afflicting Pokemon GO players internationally. 10 | 11 | Figure 1. News Outlets Pokemon Suburban Version has been Featured in. 12 | ![na](http://i.imgur.com/ClQdDCq.png) 13 | (check out news.txt for a comprehensive list of urls) 14 | 15 | 16 | ### To-do 17 | - [x] Complete basic game 18 | - [x] Fix whitescreen glitch that makes game unplayable in certain browsers 19 | - [x] Revamp P5 sketch implementation, get rid of hacky iframe embedding 20 | - [x] Implement Pokeball upgrades as game progresses 21 | - [x] Make a home/about me page 22 | - [x] Have bonus for players who reach 151 (Pidgey's become Dragonite? Masterball upgrade? Mew floats in background?) 23 | - [ ] Polish CSS of about me page 24 | - [ ] Fix Niantic Hitbox detection 25 | - [x] Move "Caught" text so that it doesn't overlap the score count @ 100+ 26 | - [x] Fix IOS CSS rendering + Jquery functionality 27 | -------------------------------------------------------------------------------- /news.txt: -------------------------------------------------------------------------------- 1 | USA: 2 | https://www.yahoo.com/tech/teen-creates-pok-mon-parody-153303997.html 3 | https://www.yahoo.com/news/teen-creates-pok-mon-parody-153303997.html 4 | http://www.digitaltrends.com/gaming/pokemon-go-suburban-version-parody-empty-suburbs/ 5 | http://www.nintendolife.com/news/2016/08/random_disgruntled_young_pokemon_go_fan_makes_satirical_game_about_playing_in_the_suburbs#reply 6 | 7 | Peru: 8 | https://elcomercio.pe/tecnologia/videojuegos/pokemon-go-version-tienes-evitar-pidgeys-ganar-253203-noticia/ 9 | 10 | France: 11 | http://imgmr.com/fr/actu-geek/pokemon-suburban-pokemon-go-pour-banlieues/ 12 | 13 | Japan: 14 | http://jp.automaton.am/articles/newsjp/one-boy-made-a-game-to-alert-the-severity-of-the-communities-disdain-for-current-spawning-mechanics/ 15 | http://nlab.itmedia.co.jp/nl/articles/1608/30/news145.html 16 | https://gamedrive.jp/news/1472541081 17 | http://games.yahoo.co.jp/news/item?n=20160831-00000001-ygame_gamedrive 18 | http://blog.esuteru.com/archives/20001311.html 19 | http://takeshigo.com/3684.html 20 | 21 | China: 22 | http://www.97973.com/moxw/2016-08-30/ifxvixer7447360.shtml 23 | http://www.3dmgame.com/news/201608/3588569.html 24 | http://shouyou.gamersky.com/news/201608/800969.shtml 25 | http://wap.gamersky.com/news/Content-800969.html 26 | http://game.ettoday.net/article/765563.htm 27 | http://www.kejixun.com/article/160830/216701.shtml 28 | http://www.gamedog.cn/news/20160830/1862107.html 29 | http://www.iyingdi.com/article/24979/content 30 | http://www.cbigame.com/news/22889-%E8%A1%A5%E7%BB%99%E7%AB%99%E5%88%86%E5%B8%83%E4%B8%8D%E5%9D%87%20%E5%B0%91%E5%B9%B4%E8%87%AA%E5%88%B6%E9%83%8A%E5%8C%BA%E7%89%88%E3%80%8A%E7%B2%BE%E7%81%B5%E5%AE%9D%E5%8F%AF%E6%A2%A6%EF%BC%9AGO%E3%80%8B 31 | http://koudaiyaoguaigo.net/2016/08/30/14%E5%B2%81%E5%B0%91%E5%B9%B4%E8%87%AA%E5%88%B6%E9%83%8A%E5%8C%BA%E7%89%88%E3%80%8A%E5%8F%A3%E8%A2%8B%E5%A6%96%E6%80%AA%EF%BC%9Ago%E3%80%8B-%E7%8E%A9%E6%B3%95%E4%BC%BC%E3%80%8A%E9%A9%AC%E9%87%8C/ 32 | 33 | 34 | South Korea: 35 | http://www.thisisgame.com/webzine/community/nboard/4/?n=64380 36 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Pokemon: Suburban Version | Pokemon GO Simulator 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |

Hey fellow disgruntled trainers!

17 |

My name's Shane Brunswick, and I'm 14 years old. I set out to make this game in hopes of alerting Niantic of the severity of the communities disdain for current spawning mechanics.

18 |

C'mon, Niantic, I've literally managed to teach myself Javascript just to make a statement regarding the lack of Pokemon in suburban/rural areas in Pokemon GO! (granted, if my game were a Pidgey, by comparison, yours would be a Dragonite, so full 19 | marks for... most of what you've done with GO)

20 |

If you'd like to help me in my plight, share this game on your Twitter, Facebook, Google+, or all three! (if you're one of the two people left on earth who still use Google+) Here's a convenient link if you want to do that now.

21 | 22 | 23 | 24 | 25 | 28 | 29 | 30 | 31 | 32 | 33 |

If you would like to contact me, my email is suburbanversion@gmail.com. Now, I'm sure you're thinking, "for the love of Arceus, just let me play the game" (alternatively: Now, I'm sure you're thinking, "that felt like a forced transition")! Just click 34 | the button below!

35 |
36 | Click Here to Play the Game! 37 |
38 |
39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /sketch.js: -------------------------------------------------------------------------------- 1 | var s = function(p) { 2 | var ball; 3 | var xpos, ypos; 4 | var yvel; 5 | var movingfloor; 6 | var jump; 7 | var inair; 8 | var rand; 9 | var xposclone; 10 | var score = 0; 11 | var endscreen = false; 12 | var count = 0; 13 | var jump_speed = 11; 14 | var gravity = 0.25; 15 | var placeholder; 16 | var what = true; 17 | var x; 18 | p.setup = function() { 19 | p.createCanvas(window.innerWidth, window.innerHeight); 20 | ball = p.loadImage("assets/pkred.png"); 21 | ballback = p.loadImage("assets/pkred.png"); 22 | ball2 = p.loadImage("assets/pkblue.png"); 23 | ball3 = p.loadImage("assets/pkblack.png"); 24 | thefloor = p.loadImage("assets/floor.png"); 25 | blob = p.loadImage("assets/pk1.png"); 26 | blobback = p.loadImage("assets/pk1.png"); 27 | blob2 = p.loadImage("assets/pk2.png"); 28 | bad = p.loadImage("assets/bad.png"); 29 | grass = p.loadImage("assets/grass.png"); 30 | balloon = p.loadImage("assets/balloon.png"); 31 | mew1 = p.loadImage("assets/mew1.png"); 32 | mew2 = p.loadImage("assets/mew1.png"); 33 | xpos = p.width; 34 | xposclone = p.width; 35 | ypos = p.height - 103; 36 | yvel = 0; 37 | movingfloor = 0; 38 | grassfloor = p.width - 10; 39 | balloonmove = p.width; 40 | setInterval(function() { 41 | count = count + .5 42 | }, 100); 43 | } 44 | p.draw = function() { 45 | p.background('#00bff3'); 46 | if (placeholder == true) { 47 | p.fill(p.random(255), p.random(255), p.random(255)) 48 | p.text("Caught!", 60, 30) 49 | } else if (placeholder == false) { 50 | p.fill(255) 51 | p.text("It ran away...", 60, 30) 52 | } 53 | if (score >= 10) { 54 | ball = ball2; 55 | } 56 | if (score >= 50) { 57 | ball = ball3; 58 | } 59 | p.textSize(32); 60 | p.fill(255) 61 | p.stroke(0) 62 | p.strokeWeight(5) 63 | p.textFont("Source Sans Pro"); 64 | p.text(score, 10, 30) 65 | p.image(bad, xposclone + 80, p.height - 150, 70, 70) 66 | balloonmove = balloonmove - .3; 67 | p.image(balloon, balloonmove, p.height - 300, 20, 20) 68 | if (balloonmove < 0) { 69 | balloonmove = p.width + 30; 70 | } 71 | if (jump === true) { 72 | ypos = ypos - yvel; 73 | yvel = yvel - gravity; 74 | } 75 | if (ypos > p.height - 103) { 76 | jump = false; 77 | yvel = 0; 78 | ypos = p.height - 103; 79 | } 80 | if (xposclone < -40 & xposclone > -70 & inair === false) { 81 | xposclone = p.width; 82 | endscreen = true 83 | p.noLoop() 84 | p.background('#00bff3'); 85 | p.text(" Pidgey Caught: " + score + 86 | "\n Press Anywhere\n to Restart \n", 87 | 10, 30) 88 | p.textSize(16); 89 | p.text( 90 | "\n\n\n\n\n\n\n\nUse the spacebar or tap the screen (mobile)\n to move your character\n Game by: Shane Brunswick", 91 | 10, 10) 92 | } else if (xposclone < -40 & inair === false) { 93 | xposclone = p.width; 94 | } 95 | for (i = 1; i < 100; i++) { 96 | p.image(thefloor, (movingfloor - 1) + (991 * i), p.height - 97 | 89) 98 | } 99 | movingfloor = movingfloor - 2 100 | grassfloor = grassfloor - 2 101 | p.image(grass, grassfloor, p.height - 129, 40, 40) 102 | if (score < 10) { 103 | xpos = xpos - 4 104 | xposclone = xposclone - 4 105 | } 106 | if (xposclone <= 0) { 107 | x = Math.random() 108 | } 109 | if (score > 9 & x > 0.50) { 110 | xpos = xpos - 7 111 | xposclone = xposclone - 6 112 | } else if (score > 9 & x < 0.51) { 113 | xpos = xpos - 7 114 | xposclone = xposclone - 7 115 | } 116 | if (isEven(count) == true & score != 151) { 117 | blob = blob2 118 | } else { 119 | blob = blobback 120 | } 121 | if (isEven(count) == true & score == 151) { 122 | blob = mew1 123 | } else if (isEven(count) != true & score == 151) { 124 | blob = mew2 125 | } 126 | p.image(blob, xpos, p.height - 139, 50, 50) 127 | p.image(thefloor, movingfloor, p.height - 89) 128 | if (grassfloor < -30) { 129 | grassfloor = p.width + 20; 130 | } 131 | if (xpos < 40 & xpos > 0 & inair === false) { 132 | xpos = p.width; 133 | if (Math.random() > 0.58 & score < 10) { 134 | score += 1; 135 | placeholder = true; 136 | } else if (Math.random() > 0.45 & score > 9 & score < 50) { 137 | score += 1; 138 | placeholder = true; 139 | } else if (Math.random() > 0.1 & score > 49) { 140 | score += 1; 141 | placeholder = true; 142 | } else { 143 | placeholder = false; 144 | } 145 | } else if (xpos < 30 & inair === false) { 146 | xpos = p.width; 147 | } 148 | p.translate(30, ypos); 149 | p.rotate(p.frameCount / 5.0); 150 | p.image(ball, -15, -15, 30, 30); 151 | if (ypos < p.height - 103) { 152 | inair = true; 153 | } else { 154 | inair = false 155 | } 156 | } 157 | document.onkeypress = function(e) { 158 | e = e || window.event; 159 | if (e.keyCode == "32" & ypos == p.height - 103) { 160 | jump = true; 161 | yvel = jump_speed; 162 | } 163 | }; 164 | p.touchStarted = function() { 165 | if (ypos == p.height - 103) { 166 | if (endscreen === false) { 167 | jump = true; 168 | yvel = jump_speed; 169 | } 170 | if (endscreen === true) { 171 | score = 0 172 | p.loop() 173 | endscreen = false 174 | } 175 | } 176 | } 177 | 178 | function isEven(n) { 179 | return n % 2 == 0; 180 | } 181 | 182 | function randomIntFromInterval(min, max) { 183 | return Math.floor(Math.random() * (max - min + 1) + min); 184 | } 185 | } 186 | new p5(s, 'my'); 187 | $(document).on('click', 'canvas', function() { 188 | $('.container').fadeOut() 189 | }) 190 | 191 | $(document).on('touchstart', 'canvas', function() { 192 | $('.container').fadeOut() 193 | }) 194 | 195 | $(window).keypress(function(e) { 196 | if (e.keyCode == 0 || e.keyCode == 32) { 197 | $('.container').fadeOut() 198 | } 199 | }); 200 | -------------------------------------------------------------------------------- /main.css: -------------------------------------------------------------------------------- 1 | body { 2 | background: url(https://raw.githubusercontent.com/WhataShane/PokemonGoSimulator/gh-pages/assets/back.jpg) no-repeat center center fixed; 3 | -webkit-background-size: cover; 4 | -moz-background-size: cover; 5 | -o-background-size: cover; 6 | background-size: cover; 7 | margin: 0; 8 | padding: 0; 9 | width: 100%; 10 | } 11 | 12 | .content { 13 | text-align: center; 14 | font-family: 'Source Sans Pro', sans-serif; 15 | color: white; 16 | background: rgb(22, 22, 22); 17 | background: rgba(22, 22, 22, 0.6); 18 | position: absolute; 19 | width: 100%; 20 | } 21 | 22 | h1 { 23 | min-height: 80px; 24 | max-width: 700px; 25 | text-align: center; 26 | margin: 0 auto; 27 | text-decoration: none; 28 | color: #fff; 29 | padding-top: 40px; 30 | font-weight: 400; 31 | } 32 | 33 | p { 34 | width: 90%; 35 | max-width: 700px; 36 | text-align: left; 37 | margin: 0 auto; 38 | padding-bottom: 16px; 39 | font-weight: 300; 40 | font-family: Source Sans Pro, sans-serif; 41 | color:white; 42 | } 43 | 44 | img { 45 | cursor: pointer; 46 | } 47 | 48 | .container { 49 | display: flex; 50 | justify-content: space-around; 51 | width: 500px; 52 | } 53 | 54 | .container2 { 55 | display: flex; 56 | justify-content: center; 57 | } 58 | 59 | .button { 60 | display: -webkit-box; 61 | display: -ms-flexbox; 62 | display: flex; 63 | width: 320px; 64 | height: 50px; 65 | border: 1px solid #ebebeb; 66 | background: -webkit-linear-gradient(top, #fefefe, #fdfdfd); 67 | background: linear-gradient(to bottom, #fefefe, #fdfdfd); 68 | -webkit-box-align: center; 69 | -ms-flex-align: center; 70 | align-items: center; 71 | -webkit-box-pack: center; 72 | -ms-flex-pack: center; 73 | justify-content: center; 74 | color: #6699ff; 75 | text-decoration: none; 76 | -webkit-transition: color 1000ms linear; 77 | transition: color 1000ms linear; 78 | } 79 | 80 | .button:hover { 81 | color: black; 82 | } 83 | 84 | @media (min-width:670px) { 85 | .content { 86 | height: 100%; 87 | } 88 | } 89 | 90 | @media (max-width:670px) { 91 | h1 { 92 | font-size: 1.2em; 93 | font-weight: 400; 94 | min-height: 35px; 95 | } 96 | .button{ 97 | margin-top:20px; 98 | margin-bottom: 40px; 99 | } 100 | } 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | @font-face { 110 | font-family: 'share-buttons'; 111 | src: url('https://cdn.rawgit.com/sunnysingh/share-buttons/v1.0.0/build/fonts/share-buttons.eot?gpra60'); 112 | src: url('https://cdn.rawgit.com/sunnysingh/share-buttons/v1.0.0/build/fonts/share-buttons.eot?#iefixgpra60') format('embedded-opentype'), url('https://cdn.rawgit.com/sunnysingh/share-buttons/v1.0.0/build/fonts/share-buttons.woff?gpra60') format('woff'), url('https://cdn.rawgit.com/sunnysingh/share-buttons/v1.0.0/build/fonts/share-buttons.ttf?gpra60') format('truetype'), url('https://cdn.rawgit.com/sunnysingh/share-buttons/v1.0.0/build/fonts/share-buttons.svg?gpra60#share-buttons') format('svg'); 113 | font-weight: normal; 114 | font-style: normal; 115 | } 116 | .share-btn-icon { 117 | font-family: 'share-buttons'; 118 | speak: none; 119 | font-style: normal; 120 | font-weight: normal; 121 | font-variant: normal; 122 | text-transform: none; 123 | line-height: 1; 124 | /* Better Font Rendering =========== */ 125 | -webkit-font-smoothing: antialiased; 126 | -moz-osx-font-smoothing: grayscale; 127 | } 128 | .share-btn-facebook .share-btn-icon:before { 129 | content: "\ea8c"; 130 | } 131 | .share-btn-twitter .share-btn-icon:before { 132 | content: "\ea91"; 133 | } 134 | .share-btn, 135 | .share-btn * { 136 | box-sizing: border-box; 137 | } 138 | .share-btn { 139 | position: relative; 140 | display: inline-block; 141 | height: 24px; 142 | margin: 0; 143 | padding: 2px 8px; 144 | line-height: 1.53; 145 | letter-spacing: .04em; 146 | vertical-align: top; 147 | font-size: 12px; 148 | font-weight: bold; 149 | font-family: "Helvetica Neue", Arial, sans-serif; 150 | color: #111; 151 | background: #e0e0e0; 152 | border: 1px solid #c7c7c7; 153 | border-radius: 2px; 154 | text-decoration: none; 155 | -webkit-transition: all 0.2s ease; 156 | transition: all 0.2s ease; 157 | } 158 | .share-btn:hover, 159 | .share-btn:focus { 160 | background: #d3d3d3; 161 | border-color: #bababa; 162 | text-decoration: none; 163 | color: #111; 164 | } 165 | .share-btn .share-btn-text-sr { 166 | position: absolute; 167 | width: 1px; 168 | height: 1px; 169 | padding: 0; 170 | margin: -1px; 171 | overflow: hidden; 172 | clip: rect(0, 0, 0, 0); 173 | border: 0; 174 | } 175 | .share-btn.share-btn-branded { 176 | color: #fff; 177 | } 178 | .share-btn.share-btn-branded.share-btn-twitter { 179 | background: #55acee; 180 | border-color: #3ea1ec; 181 | } 182 | .share-btn.share-btn-branded.share-btn-twitter:hover, 183 | .share-btn.share-btn-branded.share-btn-twitter:focus { 184 | background: #3ea1ec; 185 | border-color: #2795e9; 186 | } 187 | .share-btn.share-btn-branded.share-btn-twitter:active { 188 | background: #2795e9; 189 | border-color: #1689e0; 190 | } 191 | .share-btn.share-btn-branded.share-btn-facebook { 192 | background: #3b5998; 193 | border-color: #344e86; 194 | } 195 | .share-btn.share-btn-branded.share-btn-facebook:hover, 196 | .share-btn.share-btn-branded.share-btn-facebook:focus { 197 | background: #344e86; 198 | border-color: #2d4373; 199 | } 200 | .share-btn.share-btn-branded.share-btn-facebook:active { 201 | background: #2d4373; 202 | border-color: #263961; 203 | } 204 | .share-btn.share-btn-branded.share-btn-googleplus { 205 | background: #dd4b39; 206 | color: #fff; 207 | border-color: #d73925; 208 | } 209 | .share-btn.share-btn-branded.share-btn-googleplus:hover, 210 | .share-btn.share-btn-branded.share-btn-googleplus:focus { 211 | background: #d73925; 212 | border-color: #c23321; 213 | } 214 | .share-btn.share-btn-branded.share-btn-googleplus:active { 215 | background: #c23321; 216 | border-color: #ac2d1e; 217 | } 218 | .share-btn.share-btn-branded.share-btn-tumblr { 219 | background: #35465c; 220 | color: #fff; 221 | border-color: #2c3a4c; 222 | } 223 | .share-btn.share-btn-branded.share-btn-tumblr:hover, 224 | .share-btn.share-btn-branded.share-btn-tumblr:focus { 225 | background: #2c3a4c; 226 | border-color: #222d3c; 227 | } 228 | .share-btn.share-btn-branded.share-btn-tumblr:active { 229 | background: #222d3c; 230 | border-color: #19212b; 231 | } 232 | .share-btn.share-btn-branded.share-btn-reddit { 233 | background: #ff4500; 234 | color: #fff; 235 | border-color: #e63e00; 236 | } 237 | .share-btn.share-btn-branded.share-btn-reddit:hover, 238 | .share-btn.share-btn-branded.share-btn-reddit:focus { 239 | background: #e63e00; 240 | border-color: #cc3700; 241 | } 242 | .share-btn.share-btn-branded.share-btn-reddit:active { 243 | background: #cc3700; 244 | border-color: #b33000; 245 | } 246 | .share-btn.share-btn-branded.share-btn-linkedin { 247 | background: #0976b4; 248 | color: #fff; 249 | border-color: #08669c; 250 | } 251 | .share-btn.share-btn-branded.share-btn-linkedin:hover, 252 | .share-btn.share-btn-branded.share-btn-linkedin:focus { 253 | background: #08669c; 254 | border-color: #075683; 255 | } 256 | .share-btn.share-btn-branded.share-btn-linkedin:active { 257 | background: #075683; 258 | border-color: #05466b; 259 | } 260 | .share-btn.share-btn-branded.share-btn-delicious { 261 | background: #3399ff; 262 | color: #fff; 263 | border-color: #198cff; 264 | } 265 | .share-btn.share-btn-branded.share-btn-delicious:hover, 266 | .share-btn.share-btn-branded.share-btn-delicious:focus { 267 | background: #198cff; 268 | border-color: #007fff; 269 | } 270 | .share-btn.share-btn-branded.share-btn-delicious:active { 271 | background: #007fff; 272 | border-color: #0073e5; 273 | } 274 | .share-btn.share-btn-branded.share-btn-stumbleupon { 275 | background: #eb4924; 276 | color: #fff; 277 | border-color: #e13b15; 278 | } 279 | .share-btn.share-btn-branded.share-btn-stumbleupon:hover, 280 | .share-btn.share-btn-branded.share-btn-stumbleupon:focus { 281 | background: #e13b15; 282 | border-color: #ca3412; 283 | } 284 | .share-btn.share-btn-branded.share-btn-stumbleupon:active { 285 | background: #ca3412; 286 | border-color: #b22e10; 287 | } 288 | .share-btn.share-btn-branded.share-btn-pinterest { 289 | background: #cc2127; 290 | color: #fff; 291 | border-color: #b61d23; 292 | } 293 | .share-btn.share-btn-branded.share-btn-pinterest:hover, 294 | .share-btn.share-btn-branded.share-btn-pinterest:focus { 295 | background: #b61d23; 296 | border-color: #a01a1f; 297 | } 298 | .share-btn.share-btn-branded.share-btn-pinterest:active { 299 | background: #a01a1f; 300 | border-color: #8a161a; 301 | } 302 | .share-btn.share-btn-inverse { 303 | color: #eeeeee; 304 | background: #1f1f1f; 305 | border-color: #050505; 306 | } 307 | .share-btn.share-btn-inverse:hover, 308 | .share-btn.share-btn-inverse:focus { 309 | background: #121212; 310 | border-color: #000000; 311 | color: #eeeeee; 312 | } 313 | .share-btn.share-btn-inverse:active { 314 | background: #050505; 315 | border-color: #000000; 316 | color: #eeeeee; 317 | } 318 | .share-btn.share-btn-twitter .share-btn-icon, 319 | .share-btn.share-btn-googleplus .share-btn-icon, 320 | .share-btn.share-btn-tumblr .share-btn-icon, 321 | .share-btn.share-btn-linkedin .share-btn-icon, 322 | .share-btn.share-btn-pinterest .share-btn-icon, 323 | .share-btn.share-btn-stumbleupon .share-btn-icon, 324 | .share-btn.share-btn-delicious .share-btn-icon, 325 | .share-btn.share-btn-more .share-btn-icon { 326 | position: relative; 327 | top: 1px; 328 | } 329 | @-moz-document url-prefix() { 330 | .share-btn.share-btn-twitter .share-btn-icon, 331 | .share-btn.share-btn-googleplus .share-btn-icon, 332 | .share-btn.share-btn-tumblr .share-btn-icon, 333 | .share-btn.share-btn-linkedin .share-btn-icon, 334 | .share-btn.share-btn-pinterest .share-btn-icon, 335 | .share-btn.share-btn-stumbleupon .share-btn-icon, 336 | .share-btn.share-btn-delicious .share-btn-icon, 337 | .share-btn.share-btn-more .share-btn-icon { 338 | top: 0; 339 | } 340 | } 341 | .share-btn.share-btn-more.share-btn-lg .share-btn-icon { 342 | top: 2px; 343 | } 344 | .share-btn .share-btn-text { 345 | padding-left: 2px; 346 | } 347 | --------------------------------------------------------------------------------