├── .gitignore
├── .npmignore
├── LICENSE
├── README.md
├── config
    ├── env.js
    ├── jest
    │   ├── cssTransform.js
    │   └── fileTransform.js
    ├── modules.js
    ├── paths.js
    ├── pnpTs.js
    ├── webpack.config.js
    └── webpackDevServer.config.js
├── package.json
├── public
    ├── favicon.ico
    ├── index.html
    ├── logo192.png
    ├── logo512.png
    ├── manifest.json
    └── robots.txt
├── screenshots
    └── screenshot.png
├── scripts
    ├── build.js
    ├── demo.js
    ├── start.js
    └── test.js
├── src
    ├── demo
    │   ├── App.js
    │   ├── App.test.js
    │   ├── index.css
    │   ├── index.js
    │   └── serviceWorker.js
    └── lib
    │   ├── components
    │       ├── Dino.css
    │       ├── Dino.js
    │       ├── DinoScript.js
    │       ├── DinoStyle.js
    │       └── Resources.js
    │   └── index.js
└── yarn.lock


/.gitignore:
--------------------------------------------------------------------------------
 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 2 | 
 3 | # dependencies
 4 | /node_modules
 5 | /.pnp
 6 | .pnp.js
 7 | 
 8 | # testing
 9 | /coverage
10 | 
11 | # production
12 | /build
13 | /demo
14 | 
15 | # misc
16 | .DS_Store
17 | .env.local
18 | .env.development.local
19 | .env.test.local
20 | .env.production.local
21 | 
22 | npm-debug.log*
23 | yarn-debug.log*
24 | yarn-error.log*
25 | 


--------------------------------------------------------------------------------
/.npmignore:
--------------------------------------------------------------------------------
 1 | # dependencies
 2 | /node_modules
 3 | 
 4 | # testing
 5 | /coverage
 6 | 
 7 | # misc
 8 | .DS_Store
 9 | .env.local
10 | .env.development.local
11 | .env.test.local
12 | .env.production.local
13 | 
14 | npm-debug.log*
15 | yarn-debug.log*
16 | yarn-error.log*
17 | 
18 | # Development folders and files
19 | public
20 | src
21 | scripts
22 | config
23 | demo
24 | CHANGELOG.md
25 | README.md
26 | UPGRADE.md
27 | .storybook


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) 2020 M. Hasbini
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # react-chrome-dino
 2 | 
 3 | ## Usage:
 4 | 
 5 | ![](screenshots/screenshot.png)
 6 | 
 7 | Demo: https://mhasbini.com/miscs/react-chrome-dino-demo/index.html
 8 | 
 9 | Install:
10 | 
11 | ```
12 | yarn add react-chrome-dino
13 | ```
14 | 
15 | ```js
16 | import React from 'react';
17 | import ChromeDinoGame from 'react-chrome-dino';
18 | 
19 | const App = () => (
20 |   <ChromeDinoGame />
21 | );
22 | 
23 | export default App;
24 | ```
25 | 
26 | Check [`src/demo`](src/demo) for a usage example.
27 | 
28 | ## License
29 | 
30 | This library is licensed under MIT.
31 | 
32 | The game javascript & css is licensed under BSD as follow:
33 | 
34 | ```
35 | // Copyright (c) 2014 The Chromium Authors. All rights reserved.
36 | // Use of this source code is governed by a BSD-style license that can be
37 | // found in the LICENSE file here: https://cs.chromium.org/chromium/src/LICENSE. 
38 | ```
39 | 
40 | ## Available Scripts
41 | 
42 | In the project directory, you can run:
43 | 
44 | ### `npm start` or `yarn start`
45 | 
46 | Runs the library in development mode. Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
47 | 
48 | ### `npm run test` or `yarn run test`
49 | 
50 | Runs the test watcher in an interactive mode.
51 | 
52 | ### `npm run build` or `yarn build`
53 | 
54 | Builds the library for production to the `build` folder.
55 | It correctly bundles React in production mode and optimizes the build for the best performance.
56 | 
57 | ### `npm publish`
58 | 
59 | Publishes the library to NPM.
60 | 


--------------------------------------------------------------------------------
/config/env.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | const fs = require('fs');
 4 | const path = require('path');
 5 | const paths = require('./paths');
 6 | 
 7 | // Make sure that including paths.js after env.js will read .env variables.
 8 | delete require.cache[require.resolve('./paths')];
 9 | 
10 | const NODE_ENV = process.env.NODE_ENV;
11 | if (!NODE_ENV) {
12 |   throw new Error(
13 |     'The NODE_ENV environment variable is required but was not specified.'
14 |   );
15 | }
16 | 
17 | // https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
18 | const dotenvFiles = [
19 |   `${paths.dotenv}.${NODE_ENV}.local`,
20 |   `${paths.dotenv}.${NODE_ENV}`,
21 |   // Don't include `.env.local` for `test` environment
22 |   // since normally you expect tests to produce the same
23 |   // results for everyone
24 |   NODE_ENV !== 'test' && `${paths.dotenv}.local`,
25 |   paths.dotenv,
26 | ].filter(Boolean);
27 | 
28 | // Load environment variables from .env* files. Suppress warnings using silent
29 | // if this file is missing. dotenv will never modify any environment variables
30 | // that have already been set.  Variable expansion is supported in .env files.
31 | // https://github.com/motdotla/dotenv
32 | // https://github.com/motdotla/dotenv-expand
33 | dotenvFiles.forEach(dotenvFile => {
34 |   if (fs.existsSync(dotenvFile)) {
35 |     require('dotenv-expand')(
36 |       require('dotenv').config({
37 |         path: dotenvFile,
38 |       })
39 |     );
40 |   }
41 | });
42 | 
43 | // We support resolving modules according to `NODE_PATH`.
44 | // This lets you use absolute paths in imports inside large monorepos:
45 | // https://github.com/facebook/create-react-app/issues/253.
46 | // It works similar to `NODE_PATH` in Node itself:
47 | // https://nodejs.org/api/modules.html#modules_loading_from_the_global_folders
48 | // Note that unlike in Node, only *relative* paths from `NODE_PATH` are honored.
49 | // Otherwise, we risk importing Node.js core modules into an app instead of Webpack shims.
50 | // https://github.com/facebook/create-react-app/issues/1023#issuecomment-265344421
51 | // We also resolve them to make sure all tools using them work consistently.
52 | const appDirectory = fs.realpathSync(process.cwd());
53 | process.env.NODE_PATH = (process.env.NODE_PATH || '')
54 |   .split(path.delimiter)
55 |   .filter(folder => folder && !path.isAbsolute(folder))
56 |   .map(folder => path.resolve(appDirectory, folder))
57 |   .join(path.delimiter);
58 | 
59 | // Grab NODE_ENV and REACT_APP_* environment variables and prepare them to be
60 | // injected into the application via DefinePlugin in Webpack configuration.
61 | const REACT_APP = /^REACT_APP_/i;
62 | 
63 | function getClientEnvironment(publicUrl) {
64 |   const raw = Object.keys(process.env)
65 |     .filter(key => REACT_APP.test(key))
66 |     .reduce(
67 |       (env, key) => {
68 |         env[key] = process.env[key];
69 |         return env;
70 |       },
71 |       {
72 |         // Useful for determining whether we’re running in production mode.
73 |         // Most importantly, it switches React into the correct mode.
74 |         NODE_ENV: process.env.NODE_ENV || 'development',
75 |         // Useful for resolving the correct path to static assets in `public`.
76 |         // For example, <img src={process.env.PUBLIC_URL + '/img/logo.png'} />.
77 |         // This should only be used as an escape hatch. Normally you would put
78 |         // images into the `src` and `import` them in code to get their paths.
79 |         PUBLIC_URL: publicUrl,
80 |       }
81 |     );
82 |   // Stringify all values so we can feed into Webpack DefinePlugin
83 |   const stringified = {
84 |     'process.env': Object.keys(raw).reduce((env, key) => {
85 |       env[key] = JSON.stringify(raw[key]);
86 |       return env;
87 |     }, {}),
88 |   };
89 | 
90 |   return { raw, stringified };
91 | }
92 | 
93 | module.exports = getClientEnvironment;
94 | 


--------------------------------------------------------------------------------
/config/jest/cssTransform.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | // This is a custom Jest transformer turning style imports into empty objects.
 4 | // http://facebook.github.io/jest/docs/en/webpack.html
 5 | 
 6 | module.exports = {
 7 |   process() {
 8 |     return 'module.exports = {};';
 9 |   },
10 |   getCacheKey() {
11 |     // The output is always the same.
12 |     return 'cssTransform';
13 |   },
14 | };
15 | 


--------------------------------------------------------------------------------
/config/jest/fileTransform.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | const path = require('path');
 4 | const camelcase = require('camelcase');
 5 | 
 6 | // This is a custom Jest transformer turning file imports into filenames.
 7 | // http://facebook.github.io/jest/docs/en/webpack.html
 8 | 
 9 | module.exports = {
10 |   process(src, filename) {
11 |     const assetFilename = JSON.stringify(path.basename(filename));
12 | 
13 |     if (filename.match(/\.svg$/)) {
14 |       // Based on how SVGR generates a component name:
15 |       // https://github.com/smooth-code/svgr/blob/01b194cf967347d43d4cbe6b434404731b87cf27/packages/core/src/state.js#L6
16 |       const pascalCaseFilename = camelcase(path.parse(filename).name, {
17 |         pascalCase: true,
18 |       });
19 |       const componentName = `Svg${pascalCaseFilename}`;
20 |       return `const React = require('react');
21 |       module.exports = {
22 |         __esModule: true,
23 |         default: ${assetFilename},
24 |         ReactComponent: React.forwardRef(function ${componentName}(props, ref) {
25 |           return {
26 |             $$typeof: Symbol.for('react.element'),
27 |             type: 'svg',
28 |             ref: ref,
29 |             key: null,
30 |             props: Object.assign({}, props, {
31 |               children: ${assetFilename}
32 |             })
33 |           };
34 |         }),
35 |       };`;
36 |     }
37 | 
38 |     return `module.exports = ${assetFilename};`;
39 |   },
40 | };
41 | 


--------------------------------------------------------------------------------
/config/modules.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | const fs = require('fs');
  4 | const path = require('path');
  5 | const paths = require('./paths');
  6 | const chalk = require('react-dev-utils/chalk');
  7 | const resolve = require('resolve');
  8 | 
  9 | /**
 10 |  * Get additional module paths based on the baseUrl of a compilerOptions object.
 11 |  *
 12 |  * @param {Object} options
 13 |  */
 14 | function getAdditionalModulePaths(options = {}) {
 15 |   const baseUrl = options.baseUrl;
 16 | 
 17 |   // We need to explicitly check for null and undefined (and not a falsy value) because
 18 |   // TypeScript treats an empty string as `.`.
 19 |   if (baseUrl == null) {
 20 |     // If there's no baseUrl set we respect NODE_PATH
 21 |     // Note that NODE_PATH is deprecated and will be removed
 22 |     // in the next major release of create-react-app.
 23 | 
 24 |     const nodePath = process.env.NODE_PATH || '';
 25 |     return nodePath.split(path.delimiter).filter(Boolean);
 26 |   }
 27 | 
 28 |   const baseUrlResolved = path.resolve(paths.appPath, baseUrl);
 29 | 
 30 |   // We don't need to do anything if `baseUrl` is set to `node_modules`. This is
 31 |   // the default behavior.
 32 |   if (path.relative(paths.appNodeModules, baseUrlResolved) === '') {
 33 |     return null;
 34 |   }
 35 | 
 36 |   // Allow the user set the `baseUrl` to `appSrc`.
 37 |   if (path.relative(paths.appSrc, baseUrlResolved) === '') {
 38 |     return [paths.appSrc];
 39 |   }
 40 | 
 41 |   // If the path is equal to the root directory we ignore it here.
 42 |   // We don't want to allow importing from the root directly as source files are
 43 |   // not transpiled outside of `src`. We do allow importing them with the
 44 |   // absolute path (e.g. `src/Components/Button.js`) but we set that up with
 45 |   // an alias.
 46 |   if (path.relative(paths.appPath, baseUrlResolved) === '') {
 47 |     return null;
 48 |   }
 49 | 
 50 |   // Otherwise, throw an error.
 51 |   throw new Error(
 52 |     chalk.red.bold(
 53 |       "Your project's `baseUrl` can only be set to `src` or `node_modules`." +
 54 |         ' Create React App does not support other values at this time.'
 55 |     )
 56 |   );
 57 | }
 58 | 
 59 | /**
 60 |  * Get webpack aliases based on the baseUrl of a compilerOptions object.
 61 |  *
 62 |  * @param {*} options
 63 |  */
 64 | function getWebpackAliases(options = {}) {
 65 |   const baseUrl = options.baseUrl;
 66 | 
 67 |   if (!baseUrl) {
 68 |     return {};
 69 |   }
 70 | 
 71 |   const baseUrlResolved = path.resolve(paths.appPath, baseUrl);
 72 | 
 73 |   if (path.relative(paths.appPath, baseUrlResolved) === '') {
 74 |     return {
 75 |       src: paths.appSrc,
 76 |     };
 77 |   }
 78 | }
 79 | 
 80 | /**
 81 |  * Get jest aliases based on the baseUrl of a compilerOptions object.
 82 |  *
 83 |  * @param {*} options
 84 |  */
 85 | function getJestAliases(options = {}) {
 86 |   const baseUrl = options.baseUrl;
 87 | 
 88 |   if (!baseUrl) {
 89 |     return {};
 90 |   }
 91 | 
 92 |   const baseUrlResolved = path.resolve(paths.appPath, baseUrl);
 93 | 
 94 |   if (path.relative(paths.appPath, baseUrlResolved) === '') {
 95 |     return {
 96 |       'src/(.*)$': '<rootDir>/src/$1',
 97 |     };
 98 |   }
 99 | }
100 | 
101 | function getModules() {
102 |   // Check if TypeScript is setup
103 |   const hasTsConfig = fs.existsSync(paths.appTsConfig);
104 |   const hasJsConfig = fs.existsSync(paths.appJsConfig);
105 | 
106 |   if (hasTsConfig && hasJsConfig) {
107 |     throw new Error(
108 |       'You have both a tsconfig.json and a jsconfig.json. If you are using TypeScript please remove your jsconfig.json file.'
109 |     );
110 |   }
111 | 
112 |   let config;
113 | 
114 |   // If there's a tsconfig.json we assume it's a
115 |   // TypeScript project and set up the config
116 |   // based on tsconfig.json
117 |   if (hasTsConfig) {
118 |     const ts = require(resolve.sync('typescript', {
119 |       basedir: paths.appNodeModules,
120 |     }));
121 |     config = ts.readConfigFile(paths.appTsConfig, ts.sys.readFile).config;
122 |     // Otherwise we'll check if there is jsconfig.json
123 |     // for non TS projects.
124 |   } else if (hasJsConfig) {
125 |     config = require(paths.appJsConfig);
126 |   }
127 | 
128 |   config = config || {};
129 |   const options = config.compilerOptions || {};
130 | 
131 |   const additionalModulePaths = getAdditionalModulePaths(options);
132 | 
133 |   return {
134 |     additionalModulePaths: additionalModulePaths,
135 |     webpackAliases: getWebpackAliases(options),
136 |     jestAliases: getJestAliases(options),
137 |     hasTsConfig,
138 |   };
139 | }
140 | 
141 | module.exports = getModules();
142 | 


--------------------------------------------------------------------------------
/config/paths.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | const path = require('path');
  4 | const fs = require('fs');
  5 | const url = require('url');
  6 | 
  7 | // Make sure any symlinks in the project folder are resolved:
  8 | // https://github.com/facebook/create-react-app/issues/637
  9 | const appDirectory = fs.realpathSync(process.cwd());
 10 | const resolveApp = relativePath => path.resolve(appDirectory, relativePath);
 11 | 
 12 | const envPublicUrl = process.env.PUBLIC_URL;
 13 | 
 14 | function ensureSlash(inputPath, needsSlash) {
 15 |   const hasSlash = inputPath.endsWith('/');
 16 |   if (hasSlash && !needsSlash) {
 17 |     return inputPath.substr(0, inputPath.length - 1);
 18 |   } else if (!hasSlash && needsSlash) {
 19 |     return `${inputPath}/`;
 20 |   } else {
 21 |     return inputPath;
 22 |   }
 23 | }
 24 | 
 25 | const getPublicUrl = appPackageJson =>
 26 |   envPublicUrl || require(appPackageJson).homepage;
 27 | 
 28 | // We use `PUBLIC_URL` environment variable or "homepage" field to infer
 29 | // "public path" at which the app is served.
 30 | // Webpack needs to know it to put the right <script> hrefs into HTML even in
 31 | // single-page apps that may serve index.html for nested URLs like /todos/42.
 32 | // We can't use a relative path in HTML because we don't want to load something
 33 | // like /todos/42/static/js/bundle.7289d.js. We have to know the root.
 34 | function getServedPath(appPackageJson) {
 35 |   const publicUrl = getPublicUrl(appPackageJson);
 36 |   const servedUrl =
 37 |     envPublicUrl || (publicUrl ? url.parse(publicUrl).pathname : '/');
 38 |   return ensureSlash(servedUrl, true);
 39 | }
 40 | 
 41 | const moduleFileExtensions = [
 42 |   'web.mjs',
 43 |   'mjs',
 44 |   'web.js',
 45 |   'js',
 46 |   'web.ts',
 47 |   'ts',
 48 |   'web.tsx',
 49 |   'tsx',
 50 |   'json',
 51 |   'web.jsx',
 52 |   'jsx',
 53 | ];
 54 | 
 55 | // Resolve file paths in the same order as webpack
 56 | const resolveModule = (resolveFn, filePath) => {
 57 |   const extension = moduleFileExtensions.find(extension =>
 58 |     fs.existsSync(resolveFn(`${filePath}.${extension}`))
 59 |   );
 60 | 
 61 |   if (extension) {
 62 |     return resolveFn(`${filePath}.${extension}`);
 63 |   }
 64 | 
 65 |   return resolveFn(`${filePath}.js`);
 66 | };
 67 | 
 68 | // config after eject: we're in ./config/
 69 | module.exports = {
 70 |   dotenv: resolveApp('.env'),
 71 |   appPath: resolveApp('.'),
 72 |   appBuild: resolveApp('build'),
 73 |   appDemoBuild: resolveApp('demo'), // CRL: Added for demo purposes
 74 |   appPublic: resolveApp('public'),
 75 |   appHtml: resolveApp('public/index.html'),
 76 |   appIndexJs: resolveModule(resolveApp, 'src/demo/index'), // CRL: Updated for demo purposes
 77 |   appPackageJson: resolveApp('package.json'),
 78 |   appSrc: resolveApp('src'),
 79 |   appTsConfig: resolveApp('tsconfig.json'),
 80 |   appJsConfig: resolveApp('jsconfig.json'),
 81 |   yarnLockFile: resolveApp('yarn.lock'),
 82 |   testsSetup: resolveModule(resolveApp, 'src/setupTests'),
 83 |   proxySetup: resolveApp('src/setupProxy.js'),
 84 |   appNodeModules: resolveApp('node_modules'),
 85 |   publicUrl: getPublicUrl(resolveApp('package.json')),
 86 |   servedPath: getServedPath(resolveApp('package.json')),
 87 | 
 88 |   // CRL: New paths for demo build
 89 |   appDemoIndexJs: resolveModule(resolveApp, 'src/demo/index'),
 90 |   appDemoSrc: resolveApp('src/demo'),
 91 | 
 92 |   // CRL: New paths for library
 93 |   appLibIndexJs: resolveModule(resolveApp, 'src/lib/index'),
 94 |   appLibSrc: resolveApp('src/lib'),
 95 | };
 96 | 
 97 | 
 98 | 
 99 | module.exports.moduleFileExtensions = moduleFileExtensions;
100 | 


--------------------------------------------------------------------------------
/config/pnpTs.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | const { resolveModuleName } = require('ts-pnp');
 4 | 
 5 | exports.resolveModuleName = (
 6 |   typescript,
 7 |   moduleName,
 8 |   containingFile,
 9 |   compilerOptions,
10 |   resolutionHost
11 | ) => {
12 |   return resolveModuleName(
13 |     moduleName,
14 |     containingFile,
15 |     compilerOptions,
16 |     resolutionHost,
17 |     typescript.resolveModuleName
18 |   );
19 | };
20 | 
21 | exports.resolveTypeReferenceDirective = (
22 |   typescript,
23 |   moduleName,
24 |   containingFile,
25 |   compilerOptions,
26 |   resolutionHost
27 | ) => {
28 |   return resolveModuleName(
29 |     moduleName,
30 |     containingFile,
31 |     compilerOptions,
32 |     resolutionHost,
33 |     typescript.resolveTypeReferenceDirective
34 |   );
35 | };
36 | 


--------------------------------------------------------------------------------
/config/webpack.config.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | const fs = require('fs');
  4 | const isWsl = require('is-wsl');
  5 | const path = require('path');
  6 | const webpack = require('webpack');
  7 | const resolve = require('resolve');
  8 | const PnpWebpackPlugin = require('pnp-webpack-plugin');
  9 | const HtmlWebpackPlugin = require('html-webpack-plugin');
 10 | const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 11 | const InlineChunkHtmlPlugin = require('react-dev-utils/InlineChunkHtmlPlugin');
 12 | const TerserPlugin = require('terser-webpack-plugin');
 13 | const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 14 | const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
 15 | const safePostCssParser = require('postcss-safe-parser');
 16 | const ManifestPlugin = require('webpack-manifest-plugin');
 17 | const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 18 | const WorkboxWebpackPlugin = require('workbox-webpack-plugin');
 19 | const WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin');
 20 | const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
 21 | const getCSSModuleLocalIdent = require('react-dev-utils/getCSSModuleLocalIdent');
 22 | const paths = require('./paths');
 23 | const modules = require('./modules');
 24 | const getClientEnvironment = require('./env');
 25 | const ModuleNotFoundPlugin = require('react-dev-utils/ModuleNotFoundPlugin');
 26 | const ForkTsCheckerWebpackPlugin = require('react-dev-utils/ForkTsCheckerWebpackPlugin');
 27 | const typescriptFormatter = require('react-dev-utils/typescriptFormatter');
 28 | const eslint = require('eslint');
 29 | 
 30 | const postcssNormalize = require('postcss-normalize');
 31 | 
 32 | const appPackageJson = require(paths.appPackageJson);
 33 | 
 34 | // Source maps are resource heavy and can cause out of memory issue for large source files.
 35 | const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false';
 36 | // Some apps do not need the benefits of saving a web request, so not inlining the chunk
 37 | // makes for a smoother build process.
 38 | const shouldInlineRuntimeChunk = process.env.INLINE_RUNTIME_CHUNK !== 'false';
 39 | 
 40 | const imageInlineSizeLimit = parseInt(
 41 |   process.env.IMAGE_INLINE_SIZE_LIMIT || '10000'
 42 | );
 43 | 
 44 | // Check if TypeScript is setup
 45 | const useTypeScript = fs.existsSync(paths.appTsConfig);
 46 | 
 47 | // style files regexes
 48 | const cssRegex = /\.css$/;
 49 | const cssModuleRegex = /\.module\.css$/;
 50 | const sassRegex = /\.(scss|sass)$/;
 51 | const sassModuleRegex = /\.module\.(scss|sass)$/;
 52 | 
 53 | // This is the production and development configuration.
 54 | // It is focused on developer experience, fast rebuilds, and a minimal bundle.
 55 | module.exports = function(webpackEnv) {
 56 |   const isEnvDemo = webpackEnv === 'demo';  // CRL: Add demo environment
 57 |   const isEnvDevelopment = webpackEnv === 'development';
 58 |   const isEnvProduction = webpackEnv === 'production';
 59 | 
 60 |   // Variable used for enabling profiling in Production
 61 |   // passed into alias object. Uses a flag if passed into the build command
 62 |   const isEnvProductionProfile =
 63 |     (isEnvDemo || isEnvProduction) && process.argv.includes('--profile');  // CRL: Add demo environment check
 64 | 
 65 |   // Webpack uses `publicPath` to determine where the app is being served from.
 66 |   // It requires a trailing slash, or the file assets will get an incorrect path.
 67 |   // In development, we always serve from the root. This makes config easier.
 68 |   const publicPath = (isEnvDemo || isEnvProduction) // CRL
 69 |     ? paths.servedPath
 70 |     : isEnvDevelopment && '/';
 71 |   // Some apps do not use client-side routing with pushState.
 72 |   // For these, "homepage" can be set to "." to enable relative asset paths.
 73 |   const shouldUseRelativeAssetPaths = publicPath === './';
 74 | 
 75 |   // `publicUrl` is just like `publicPath`, but we will provide it to our app
 76 |   // as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
 77 |   // Omit trailing slash as %PUBLIC_URL%/xyz looks better than %PUBLIC_URL%xyz.
 78 |   const publicUrl = (isEnvDemo || isEnvProduction)  // CRL
 79 |     ? publicPath.slice(0, -1)
 80 |     : isEnvDevelopment && '';
 81 |   // Get environment variables to inject into our app.
 82 |   const env = getClientEnvironment(publicUrl);
 83 | 
 84 |   // common function to get style loaders
 85 |   const getStyleLoaders = (cssOptions, preProcessor) => {
 86 |     const loaders = [
 87 |       isEnvDevelopment && require.resolve('style-loader'),
 88 |       (isEnvDemo || isEnvProduction) && { // CRL
 89 |         loader: MiniCssExtractPlugin.loader,
 90 |         options: shouldUseRelativeAssetPaths ? { publicPath: '../../' } : {},
 91 |       },
 92 |       {
 93 |         loader: require.resolve('css-loader'),
 94 |         options: cssOptions,
 95 |       },
 96 |       {
 97 |         // Options for PostCSS as we reference these options twice
 98 |         // Adds vendor prefixing based on your specified browser support in
 99 |         // package.json
100 |         loader: require.resolve('postcss-loader'),
101 |         options: {
102 |           // Necessary for external CSS imports to work
103 |           // https://github.com/facebook/create-react-app/issues/2677
104 |           ident: 'postcss',
105 |           plugins: () => [
106 |             require('postcss-flexbugs-fixes'),
107 |             require('postcss-preset-env')({
108 |               autoprefixer: {
109 |                 flexbox: 'no-2009',
110 |               },
111 |               stage: 3,
112 |             }),
113 |             // Adds PostCSS Normalize as the reset css with default options,
114 |             // so that it honors browserslist config in package.json
115 |             // which in turn let's users customize the target behavior as per their needs.
116 |             postcssNormalize(),
117 |           ],
118 |           sourceMap: (isEnvDemo || isEnvProduction) && shouldUseSourceMap,  // CRL
119 |         },
120 |       },
121 |     ].filter(Boolean);
122 |     if (preProcessor) {
123 |       loaders.push(
124 |         {
125 |           loader: require.resolve('resolve-url-loader'),
126 |           options: {
127 |             sourceMap: (isEnvDemo || isEnvProduction) && shouldUseSourceMap,  // CRL
128 |           },
129 |         },
130 |         {
131 |           loader: require.resolve(preProcessor),
132 |           options: {
133 |             sourceMap: (isEnvDemo || isEnvProduction) && shouldUseSourceMap,  // CRL
134 |           },
135 |         }
136 |       );
137 |     }
138 |     return loaders;
139 |   };
140 | 
141 |   return {
142 |     mode: (isEnvDemo || isEnvProduction) ? 'production' : isEnvDevelopment && 'development',  // CRL
143 |     // Stop compilation early in production
144 |     bail: (isEnvDemo || isEnvProduction), // CRL
145 |     devtool: (isEnvDemo || isEnvProduction) // CRL
146 |       ? shouldUseSourceMap
147 |         ? 'source-map'
148 |         : false
149 |       : isEnvDevelopment && 'cheap-module-source-map',
150 |     // These are the "entry points" to our application.
151 |     // This means they will be the "root" imports that are included in JS bundle.
152 |     entry: [
153 |       // Include an alternative client for WebpackDevServer. A client's job is to
154 |       // connect to WebpackDevServer by a socket and get notified about changes.
155 |       // When you save a file, the client will either apply hot updates (in case
156 |       // of CSS changes), or refresh the page (in case of JS changes). When you
157 |       // make a syntax error, this client will display a syntax error overlay.
158 |       // Note: instead of the default WebpackDevServer client, we use a custom one
159 |       // to bring better experience for Create React App users. You can replace
160 |       // the line below with these two lines if you prefer the stock client:
161 |       // require.resolve('webpack-dev-server/client') + '?/',
162 |       // require.resolve('webpack/hot/dev-server'),
163 |       isEnvDevelopment &&
164 |         require.resolve('react-dev-utils/webpackHotDevClient'),
165 |       // Finally, this is your app's code:
166 |       isEnvDemo && paths.appDemoIndexJs, // CRL: update entry
167 |       isEnvDevelopment && paths.appIndexJs, // CRL: update entry
168 |       isEnvProduction && paths.appLibIndexJs, // CRL: update entry
169 |       // We include the app code last so that if there is a runtime error during
170 |       // initialization, it doesn't blow up the WebpackDevServer client, and
171 |       // changing JS code would still trigger a refresh.
172 |     ].filter(Boolean),
173 |     output: {
174 |       // The build folder.
175 |       path: isEnvProduction ? paths.appBuild : (isEnvDemo ? paths.appDemoBuild : undefined), // CRL: Updated output.path
176 |       // Add /* filename */ comments to generated require()s in the output.
177 |       pathinfo: isEnvDevelopment,
178 |       // There will be one main bundle, and one file per asynchronous chunk.
179 |       // In development, it does not produce real files.
180 |       filename: isEnvProduction
181 |         ? 'index.js'
182 |         : isEnvDemo 
183 |             ? 'static/js/[name].[contenthash:8].js'
184 |             : isEnvDevelopment && 'static/js/bundle.js', // CRL: Updated output.filename
185 |       libraryTarget: (isEnvDemo || isEnvProduction) ? 'umd' : undefined,  // CRL: Add output.libraryTarget
186 |       // TODO: remove this when upgrading to webpack 5
187 |       futureEmitAssets: true,
188 |       // There are also additional JS chunk files if you use code splitting.
189 |       // CRL: Updated output.chunkFilename
190 |       chunkFilename: isEnvDemo
191 |         ? 'static/js/[name].[contenthash:8].chunk.js'
192 |         : isEnvDevelopment
193 |           ? 'static/js/[name].chunk.js'
194 |           : undefined,
195 |       // We inferred the "public path" (such as / or /my-project) from homepage.
196 |       // We use "/" in development.
197 |       publicPath: publicPath,
198 |       // Point sourcemap entries to original disk location (format as URL on Windows)
199 |       devtoolModuleFilenameTemplate: (isEnvDemo || isEnvProduction) // CRL: update output.devtoolModuleFilenameTemplate check
200 |         ? info =>
201 |             path
202 |               .relative(paths.appSrc, info.absoluteResourcePath)
203 |               .replace(/\\/g, '/')
204 |         : isEnvDevelopment &&
205 |           (info => path.resolve(info.absoluteResourcePath).replace(/\\/g, '/')),
206 |       // Prevents conflicts when multiple Webpack runtimes (from different apps)
207 |       // are used on the same page.
208 |       jsonpFunction: `webpackJsonp${appPackageJson.name}`,
209 |       // this defaults to 'window', but by setting it to 'this' then
210 |       // module chunks which are built will work in web workers as well.
211 |       globalObject: 'this',
212 |     },
213 |     optimization: {
214 |       minimize: (isEnvDemo || isEnvProduction), // CRL
215 |       minimizer: [
216 |         // This is only used in production mode
217 |         new TerserPlugin({
218 |           terserOptions: {
219 |             parse: {
220 |               // We want terser to parse ecma 8 code. However, we don't want it
221 |               // to apply any minification steps that turns valid ecma 5 code
222 |               // into invalid ecma 5 code. This is why the 'compress' and 'output'
223 |               // sections only apply transformations that are ecma 5 safe
224 |               // https://github.com/facebook/create-react-app/pull/4234
225 |               ecma: 8,
226 |             },
227 |             compress: {
228 |               ecma: 5,
229 |               warnings: false,
230 |               // Disabled because of an issue with Uglify breaking seemingly valid code:
231 |               // https://github.com/facebook/create-react-app/issues/2376
232 |               // Pending further investigation:
233 |               // https://github.com/mishoo/UglifyJS2/issues/2011
234 |               comparisons: false,
235 |               // Disabled because of an issue with Terser breaking valid code:
236 |               // https://github.com/facebook/create-react-app/issues/5250
237 |               // Pending further investigation:
238 |               // https://github.com/terser-js/terser/issues/120
239 |               inline: 2,
240 |             },
241 |             mangle: {
242 |               safari10: true,
243 |             },
244 |             // Added for profiling in devtools
245 |             keep_classnames: isEnvProductionProfile,
246 |             keep_fnames: isEnvProductionProfile,
247 |             output: {
248 |               ecma: 5,
249 |               comments: false,
250 |               // Turned on because emoji and regex is not minified properly using default
251 |               // https://github.com/facebook/create-react-app/issues/2488
252 |               ascii_only: true,
253 |             },
254 |           },
255 |           // Use multi-process parallel running to improve the build speed
256 |           // Default number of concurrent runs: os.cpus().length - 1
257 |           // Disabled on WSL (Windows Subsystem for Linux) due to an issue with Terser
258 |           // https://github.com/webpack-contrib/terser-webpack-plugin/issues/21
259 |           parallel: !isWsl,
260 |           // Enable file caching
261 |           cache: true,
262 |           sourceMap: shouldUseSourceMap,
263 |         }),
264 |         // This is only used in production mode
265 |         new OptimizeCSSAssetsPlugin({
266 |           cssProcessorOptions: {
267 |             parser: safePostCssParser,
268 |             map: shouldUseSourceMap
269 |               ? {
270 |                   // `inline: false` forces the sourcemap to be output into a
271 |                   // separate file
272 |                   inline: false,
273 |                   // `annotation: true` appends the sourceMappingURL to the end of
274 |                   // the css file, helping the browser find the sourcemap
275 |                   annotation: true,
276 |                 }
277 |               : false,
278 |           },
279 |         }),
280 |       ],
281 |       // Automatically split vendor and commons
282 |       // https://twitter.com/wSokra/status/969633336732905474
283 |       // https://medium.com/webpack/webpack-4-code-splitting-chunk-graph-and-the-splitchunks-optimization-be739a861366
284 |       splitChunks: {
285 |         chunks: 'all',
286 |         name: false,
287 |       },
288 |       // Keep the runtime chunk separated to enable long term caching
289 |       // https://twitter.com/wSokra/status/969679223278505985
290 |       // https://github.com/facebook/create-react-app/issues/5358
291 |       // CRL - Update runtimeChunk enabled 
292 |       runtimeChunk: !isEnvProduction ? {
293 |         name: entrypoint => `runtime-${entrypoint.name}`,
294 |       } : false,
295 |     },
296 |     resolve: {
297 |       // This allows you to set a fallback for where Webpack should look for modules.
298 |       // We placed these paths second because we want `node_modules` to "win"
299 |       // if there are any conflicts. This matches Node resolution mechanism.
300 |       // https://github.com/facebook/create-react-app/issues/253
301 |       modules: ['node_modules', paths.appNodeModules].concat(
302 |         modules.additionalModulePaths || []
303 |       ),
304 |       // These are the reasonable defaults supported by the Node ecosystem.
305 |       // We also include JSX as a common component filename extension to support
306 |       // some tools, although we do not recommend using it, see:
307 |       // https://github.com/facebook/create-react-app/issues/290
308 |       // `web` extension prefixes have been added for better support
309 |       // for React Native Web.
310 |       extensions: paths.moduleFileExtensions
311 |         .map(ext => `.${ext}`)
312 |         .filter(ext => useTypeScript || !ext.includes('ts')),
313 |       alias: {
314 |         // Support React Native Web
315 |         // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
316 |         'react-native': 'react-native-web',
317 |         // Allows for better profiling with ReactDevTools
318 |         ...(isEnvProductionProfile && {
319 |           'react-dom$': 'react-dom/profiling',
320 |           'scheduler/tracing': 'scheduler/tracing-profiling',
321 |         }),
322 |         ...(modules.webpackAliases || {}),
323 |       },
324 |       plugins: [
325 |         // Adds support for installing with Plug'n'Play, leading to faster installs and adding
326 |         // guards against forgotten dependencies and such.
327 |         PnpWebpackPlugin,
328 |         // Prevents users from importing files from outside of src/ (or node_modules/).
329 |         // This often causes confusion because we only process files within src/ with babel.
330 |         // To fix this, we prevent you from importing files out of src/ -- if you'd like to,
331 |         // please link the files into your node_modules/ and let module-resolution kick in.
332 |         // Make sure your source files are compiled, as they will not be processed in any way.
333 |         new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
334 |       ],
335 |     },
336 |     resolveLoader: {
337 |       plugins: [
338 |         // Also related to Plug'n'Play, but this time it tells Webpack to load its loaders
339 |         // from the current package.
340 |         PnpWebpackPlugin.moduleLoader(module),
341 |       ],
342 |     },
343 |     module: {
344 |       strictExportPresence: true,
345 |       rules: [
346 |         // Disable require.ensure as it's not a standard language feature.
347 |         { parser: { requireEnsure: false } },
348 | 
349 |         // First, run the linter.
350 |         // It's important to do this before Babel processes the JS.
351 |         {
352 |           test: /\.(js|mjs|jsx|ts|tsx)$/,
353 |           enforce: 'pre',
354 |           use: [
355 |             {
356 |               options: {
357 |                 cache: true,
358 |                 formatter: require.resolve('react-dev-utils/eslintFormatter'),
359 |                 eslintPath: require.resolve('eslint'),
360 |                 resolvePluginsRelativeTo: __dirname,
361 |                 
362 |               },
363 |               loader: require.resolve('eslint-loader'),
364 |             },
365 |           ],
366 |           include: isEnvProduction ? paths.appLibSrc : (isEnvDemo ? paths.appDemoSrc : paths.appSrc), // CRL: match demo/lib src path
367 |         },
368 |         {
369 |           // "oneOf" will traverse all following loaders until one will
370 |           // match the requirements. When no loader matches it will fall
371 |           // back to the "file" loader at the end of the loader list.
372 |           oneOf: [
373 |             // "url" loader works like "file" loader except that it embeds assets
374 |             // smaller than specified limit in bytes as data URLs to avoid requests.
375 |             // A missing `test` is equivalent to a match.
376 |             {
377 |               test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
378 |               loader: require.resolve('url-loader'),
379 |               options: {
380 |                 limit: imageInlineSizeLimit,
381 |                 name: 'static/media/[name].[hash:8].[ext]',
382 |               },
383 |             },
384 |             // Process application JS with Babel.
385 |             // The preset includes JSX, Flow, TypeScript, and some ESnext features.
386 |             {
387 |               test: /\.(js|mjs|jsx|ts|tsx)$/,
388 |               include: isEnvProduction
389 |                 ? paths.appLibSrc
390 |                 : isEnvDevelopment
391 |                   ? paths.appSrc
392 |                   : [paths.appLibSrc, paths.appDemoSrc],  // CRL
393 |               loader: require.resolve('babel-loader'),
394 |               options: {
395 |                 customize: require.resolve(
396 |                   'babel-preset-react-app/webpack-overrides'
397 |                 ),
398 |                 
399 |                 plugins: [
400 |                   [
401 |                     require.resolve('babel-plugin-named-asset-import'),
402 |                     {
403 |                       loaderMap: {
404 |                         svg: {
405 |                           ReactComponent:
406 |                             '@svgr/webpack?-svgo,+titleProp,+ref![path]',
407 |                         },
408 |                       },
409 |                     },
410 |                   ],
411 |                 ],
412 |                 // This is a feature of `babel-loader` for webpack (not Babel itself).
413 |                 // It enables caching results in ./node_modules/.cache/babel-loader/
414 |                 // directory for faster rebuilds.
415 |                 cacheDirectory: true,
416 |                 // See #6846 for context on why cacheCompression is disabled
417 |                 cacheCompression: false,
418 |                 compact: (isEnvDemo || isEnvProduction),  // CRL
419 |               },
420 |             },
421 |             // Process any JS outside of the app with Babel.
422 |             // Unlike the application JS, we only compile the standard ES features.
423 |             {
424 |               test: /\.(js|mjs)$/,
425 |               exclude: /@babel(?:\/|\\{1,2})runtime/,
426 |               loader: require.resolve('babel-loader'),
427 |               options: {
428 |                 babelrc: false,
429 |                 configFile: false,
430 |                 compact: false,
431 |                 presets: [
432 |                   [
433 |                     require.resolve('babel-preset-react-app/dependencies'),
434 |                     { helpers: true },
435 |                   ],
436 |                 ],
437 |                 cacheDirectory: true,
438 |                 // See #6846 for context on why cacheCompression is disabled
439 |                 cacheCompression: false,
440 |                 
441 |                 // If an error happens in a package, it's possible to be
442 |                 // because it was compiled. Thus, we don't want the browser
443 |                 // debugger to show the original code. Instead, the code
444 |                 // being evaluated would be much more helpful.
445 |                 sourceMaps: false,
446 |               },
447 |             },
448 |             // "postcss" loader applies autoprefixer to our CSS.
449 |             // "css" loader resolves paths in CSS and adds assets as dependencies.
450 |             // "style" loader turns CSS into JS modules that inject <style> tags.
451 |             // In production, we use MiniCSSExtractPlugin to extract that CSS
452 |             // to a file, but in development "style" loader enables hot editing
453 |             // of CSS.
454 |             // By default we support CSS Modules with the extension .module.css
455 |             {
456 |               test: cssRegex,
457 |               exclude: cssModuleRegex,
458 |               use: getStyleLoaders({
459 |                 importLoaders: 1,
460 |                 sourceMap: (isEnvDemo || isEnvProduction) && shouldUseSourceMap,  // CRL
461 |               }),
462 |               // Don't consider CSS imports dead code even if the
463 |               // containing package claims to have no side effects.
464 |               // Remove this when webpack adds a warning or an error for this.
465 |               // See https://github.com/webpack/webpack/issues/6571
466 |               sideEffects: true,
467 |             },
468 |             // Adds support for CSS Modules (https://github.com/css-modules/css-modules)
469 |             // using the extension .module.css
470 |             {
471 |               test: cssModuleRegex,
472 |               use: getStyleLoaders({
473 |                 importLoaders: 1,
474 |                 sourceMap: (isEnvDemo || isEnvProduction) && shouldUseSourceMap,  // CRL
475 |                 modules: true,
476 |                 getLocalIdent: getCSSModuleLocalIdent,
477 |               }),
478 |             },
479 |             // Opt-in support for SASS (using .scss or .sass extensions).
480 |             // By default we support SASS Modules with the
481 |             // extensions .module.scss or .module.sass
482 |             {
483 |               test: sassRegex,
484 |               exclude: sassModuleRegex,
485 |               use: getStyleLoaders(
486 |                 {
487 |                   importLoaders: 2,
488 |                   sourceMap: (isEnvDemo || isEnvProduction) && shouldUseSourceMap,  // CRL
489 |                 },
490 |                 'sass-loader'
491 |               ),
492 |               // Don't consider CSS imports dead code even if the
493 |               // containing package claims to have no side effects.
494 |               // Remove this when webpack adds a warning or an error for this.
495 |               // See https://github.com/webpack/webpack/issues/6571
496 |               sideEffects: true,
497 |             },
498 |             // Adds support for CSS Modules, but using SASS
499 |             // using the extension .module.scss or .module.sass
500 |             {
501 |               test: sassModuleRegex,
502 |               use: getStyleLoaders(
503 |                 {
504 |                   importLoaders: 2,
505 |                   sourceMap: (isEnvDemo || isEnvProduction) && shouldUseSourceMap,  // CRL
506 |                   modules: true,
507 |                   getLocalIdent: getCSSModuleLocalIdent,
508 |                 },
509 |                 'sass-loader'
510 |               ),
511 |             },
512 |             // "file" loader makes sure those assets get served by WebpackDevServer.
513 |             // When you `import` an asset, you get its (virtual) filename.
514 |             // In production, they would get copied to the `build` folder.
515 |             // This loader doesn't use a "test" so it will catch all modules
516 |             // that fall through the other loaders.
517 |             {
518 |               loader: require.resolve('file-loader'),
519 |               // Exclude `js` files to keep "css" loader working as it injects
520 |               // its runtime that would otherwise be processed through "file" loader.
521 |               // Also exclude `html` and `json` extensions so they get processed
522 |               // by webpacks internal loaders.
523 |               exclude: [/\.(js|mjs|jsx|ts|tsx)$/, /\.html$/, /\.json$/],
524 |               options: {
525 |                 name: isEnvProduction ? 'media/[name].[ext]' : 'static/media/[name].[hash:8].[ext]', // CRL: Updated options.name
526 |               },
527 |             },
528 |             // ** STOP ** Are you adding a new loader?
529 |             // Make sure to add the new loader(s) before the "file" loader.
530 |           ],
531 |         },
532 |       ],
533 |     },
534 |     plugins: [
535 |       // Generates an `index.html` file with the <script> injected.
536 |       (isEnvDemo || isEnvDevelopment) && new HtmlWebpackPlugin(  // CRL
537 |         Object.assign(
538 |           {},
539 |           {
540 |             inject: true,
541 |             template: paths.appHtml,
542 |           },
543 |           // CRL - Update shouldMinify check
544 |           isEnvDemo
545 |             ? {
546 |                 minify: {
547 |                   removeComments: true,
548 |                   collapseWhitespace: true,
549 |                   removeRedundantAttributes: true,
550 |                   useShortDoctype: true,
551 |                   removeEmptyAttributes: true,
552 |                   removeStyleLinkTypeAttributes: true,
553 |                   keepClosingSlash: true,
554 |                   minifyJS: true,
555 |                   minifyCSS: true,
556 |                   minifyURLs: true,
557 |                 },
558 |               }
559 |             : undefined
560 |         )
561 |       ),
562 |       // Inlines the webpack runtime script. This script is too small to warrant
563 |       // a network request.
564 |       // https://github.com/facebook/create-react-app/issues/5358
565 |       // CRL: Update InlineChunkHtmlPlugin check
566 |       isEnvDemo &&
567 |         shouldInlineRuntimeChunk &&
568 |         new InlineChunkHtmlPlugin(HtmlWebpackPlugin, [/runtime-.+[.]js/]),
569 |       // Makes some environment variables available in index.html.
570 |       // The public URL is available as %PUBLIC_URL% in index.html, e.g.:
571 |       // <link rel="icon" href="%PUBLIC_URL%/favicon.ico">
572 |       // In production, it will be an empty string unless you specify "homepage"
573 |       // in `package.json`, in which case it will be the pathname of that URL.
574 |       // In development, this will be an empty string.
575 |       (isEnvDemo || isEnvDevelopment) && new InterpolateHtmlPlugin(HtmlWebpackPlugin, env.raw), // CRL
576 |       // This gives some necessary context to module not found errors, such as
577 |       // the requesting resource.
578 |       new ModuleNotFoundPlugin(paths.appPath),
579 |       // Makes some environment variables available to the JS code, for example:
580 |       // if (process.env.NODE_ENV === 'production') { ... }. See `./env.js`.
581 |       // It is absolutely essential that NODE_ENV is set to production
582 |       // during a production build.
583 |       // Otherwise React will be compiled in the very slow development mode.
584 |       new webpack.DefinePlugin(env.stringified),
585 |       // This is necessary to emit hot updates (currently CSS only):
586 |       isEnvDevelopment && new webpack.HotModuleReplacementPlugin(),
587 |       // Watcher doesn't work well if you mistype casing in a path so we use
588 |       // a plugin that prints an error when you attempt to do this.
589 |       // See https://github.com/facebook/create-react-app/issues/240
590 |       isEnvDevelopment && new CaseSensitivePathsPlugin(),
591 |       // If you require a missing module and then `npm install` it, you still have
592 |       // to restart the development server for Webpack to discover it. This plugin
593 |       // makes the discovery automatic so you don't have to restart.
594 |       // See https://github.com/facebook/create-react-app/issues/186
595 |       isEnvDevelopment &&
596 |         new WatchMissingNodeModulesPlugin(paths.appNodeModules),
597 |       (isEnvDemo || isEnvProduction) && // CRL
598 |         new MiniCssExtractPlugin({
599 |           // Options similar to the same options in webpackOptions.output
600 |           // both options are optional
601 |           filename: isEnvProduction ? 'index.css' : 'static/css/[name].[contenthash:8].css', // CRL
602 |           chunkFilename: isEnvProduction ? '[name].[contenthash:8].chunk.css' : 'static/css/[name].[contenthash:8].chunk.css', // CRL
603 |         }),
604 |       // Generate an asset manifest file with the following content:
605 |       // - "files" key: Mapping of all asset filenames to their corresponding
606 |       //   output file so that tools can pick it up without having to parse
607 |       //   `index.html`
608 |       // - "entrypoints" key: Array of files which are included in `index.html`,
609 |       //   can be used to reconstruct the HTML if necessary
610 |       (isEnvDemo || isEnvDevelopment) && new ManifestPlugin({  // CRL
611 |         fileName: 'asset-manifest.json',
612 |         publicPath: publicPath,
613 |         generate: (seed, files, entrypoints) => {
614 |           const manifestFiles = files.reduce((manifest, file) => {
615 |             manifest[file.name] = file.path;
616 |             return manifest;
617 |           }, seed);
618 |           const entrypointFiles = entrypoints.main.filter(
619 |             fileName => !fileName.endsWith('.map')
620 |           );
621 | 
622 |           return {
623 |             files: manifestFiles,
624 |             entrypoints: entrypointFiles,
625 |           };
626 |         },
627 |       }),
628 |       // Moment.js is an extremely popular library that bundles large locale files
629 |       // by default due to how Webpack interprets its code. This is a practical
630 |       // solution that requires the user to opt into importing specific locales.
631 |       // https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
632 |       // You can remove this if you don't use Moment.js:
633 |       new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
634 |       // Generate a service worker script that will precache, and keep up to date,
635 |       // the HTML & assets that are part of the Webpack build.
636 |       // CRL: Update WorkboxWebpackPlugin.GenerateSW check
637 |       isEnvDemo &&
638 |         new WorkboxWebpackPlugin.GenerateSW({
639 |           clientsClaim: true,
640 |           exclude: [/\.map$/, /asset-manifest\.json$/],
641 |           importWorkboxFrom: 'cdn',
642 |           navigateFallback: publicUrl + '/index.html',
643 |           navigateFallbackBlacklist: [
644 |             // Exclude URLs starting with /_, as they're likely an API call
645 |             new RegExp('^/_'),
646 |             // Exclude any URLs whose last part seems to be a file extension
647 |             // as they're likely a resource and not a SPA route.
648 |             // URLs containing a "?" character won't be blacklisted as they're likely
649 |             // a route with query params (e.g. auth callbacks).
650 |             new RegExp('/[^/?]+\\.[^/]+$'),
651 |           ],
652 |         }),
653 |       // TypeScript type checking
654 |       useTypeScript &&
655 |         new ForkTsCheckerWebpackPlugin({
656 |           typescript: resolve.sync('typescript', {
657 |             basedir: paths.appNodeModules,
658 |           }),
659 |           async: isEnvDevelopment,
660 |           useTypescriptIncrementalApi: true,
661 |           checkSyntacticErrors: true,
662 |           resolveModuleNameModule: process.versions.pnp
663 |             ? `${__dirname}/pnpTs.js`
664 |             : undefined,
665 |           resolveTypeReferenceDirectiveModule: process.versions.pnp
666 |             ? `${__dirname}/pnpTs.js`
667 |             : undefined,
668 |           tsconfig: paths.appTsConfig,
669 |           reportFiles: [
670 |             '**',
671 |             '!**/__tests__/**',
672 |             '!**/?(*.)(spec|test).*',
673 |             '!**/src/setupProxy.*',
674 |             '!**/src/setupTests.*',
675 |           ],
676 |           silent: true,
677 |           // The formatter is invoked directly in WebpackDevServerUtils during development
678 |           formatter: (isEnvDemo || isEnvProduction) ? typescriptFormatter : undefined,  // CRL
679 |         }),
680 |     ].filter(Boolean),
681 |     // CRL: add externals block since it's a library
682 |     //  no need to ship React since it's shipped with the main app
683 |     externals: isEnvProduction
684 |       ? {
685 |         react: 'react',
686 |         'react-dom': 'react-dom',
687 |       }
688 |       : {},
689 |     // Some libraries import Node modules but don't use them in the browser.
690 |     // Tell Webpack to provide empty mocks for them so importing them works.
691 |     node: {
692 |       module: 'empty',
693 |       dgram: 'empty',
694 |       dns: 'mock',
695 |       fs: 'empty',
696 |       http2: 'empty',
697 |       net: 'empty',
698 |       tls: 'empty',
699 |       child_process: 'empty',
700 |     },
701 |     // Turn off performance processing because we utilize
702 |     // our own hints via the FileSizeReporter
703 |     performance: false,
704 |   };
705 | };
706 | 


--------------------------------------------------------------------------------
/config/webpackDevServer.config.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | const errorOverlayMiddleware = require('react-dev-utils/errorOverlayMiddleware');
  4 | const evalSourceMapMiddleware = require('react-dev-utils/evalSourceMapMiddleware');
  5 | const noopServiceWorkerMiddleware = require('react-dev-utils/noopServiceWorkerMiddleware');
  6 | const ignoredFiles = require('react-dev-utils/ignoredFiles');
  7 | const paths = require('./paths');
  8 | const fs = require('fs');
  9 | 
 10 | const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
 11 | const host = process.env.HOST || '0.0.0.0';
 12 | 
 13 | module.exports = function(proxy, allowedHost) {
 14 |   return {
 15 |     // WebpackDevServer 2.4.3 introduced a security fix that prevents remote
 16 |     // websites from potentially accessing local content through DNS rebinding:
 17 |     // https://github.com/webpack/webpack-dev-server/issues/887
 18 |     // https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a
 19 |     // However, it made several existing use cases such as development in cloud
 20 |     // environment or subdomains in development significantly more complicated:
 21 |     // https://github.com/facebook/create-react-app/issues/2271
 22 |     // https://github.com/facebook/create-react-app/issues/2233
 23 |     // While we're investigating better solutions, for now we will take a
 24 |     // compromise. Since our WDS configuration only serves files in the `public`
 25 |     // folder we won't consider accessing them a vulnerability. However, if you
 26 |     // use the `proxy` feature, it gets more dangerous because it can expose
 27 |     // remote code execution vulnerabilities in backends like Django and Rails.
 28 |     // So we will disable the host check normally, but enable it if you have
 29 |     // specified the `proxy` setting. Finally, we let you override it if you
 30 |     // really know what you're doing with a special environment variable.
 31 |     disableHostCheck:
 32 |       !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true',
 33 |     // Enable gzip compression of generated files.
 34 |     compress: true,
 35 |     // Silence WebpackDevServer's own logs since they're generally not useful.
 36 |     // It will still show compile warnings and errors with this setting.
 37 |     clientLogLevel: 'none',
 38 |     // By default WebpackDevServer serves physical files from current directory
 39 |     // in addition to all the virtual build products that it serves from memory.
 40 |     // This is confusing because those files won’t automatically be available in
 41 |     // production build folder unless we copy them. However, copying the whole
 42 |     // project directory is dangerous because we may expose sensitive files.
 43 |     // Instead, we establish a convention that only files in `public` directory
 44 |     // get served. Our build script will copy `public` into the `build` folder.
 45 |     // In `index.html`, you can get URL of `public` folder with %PUBLIC_URL%:
 46 |     // <link rel="icon" href="%PUBLIC_URL%/favicon.ico">
 47 |     // In JavaScript code, you can access it with `process.env.PUBLIC_URL`.
 48 |     // Note that we only recommend to use `public` folder as an escape hatch
 49 |     // for files like `favicon.ico`, `manifest.json`, and libraries that are
 50 |     // for some reason broken when imported through Webpack. If you just want to
 51 |     // use an image, put it in `src` and `import` it from JavaScript instead.
 52 |     contentBase: paths.appPublic,
 53 |     // By default files from `contentBase` will not trigger a page reload.
 54 |     watchContentBase: true,
 55 |     // Enable hot reloading server. It will provide /sockjs-node/ endpoint
 56 |     // for the WebpackDevServer client so it can learn when the files were
 57 |     // updated. The WebpackDevServer client is included as an entry point
 58 |     // in the Webpack development configuration. Note that only changes
 59 |     // to CSS are currently hot reloaded. JS changes will refresh the browser.
 60 |     hot: true,
 61 |     // It is important to tell WebpackDevServer to use the same "root" path
 62 |     // as we specified in the config. In development, we always serve from /.
 63 |     publicPath: '/',
 64 |     // WebpackDevServer is noisy by default so we emit custom message instead
 65 |     // by listening to the compiler events with `compiler.hooks[...].tap` calls above.
 66 |     quiet: true,
 67 |     // Reportedly, this avoids CPU overload on some systems.
 68 |     // https://github.com/facebook/create-react-app/issues/293
 69 |     // src/node_modules is not ignored to support absolute imports
 70 |     // https://github.com/facebook/create-react-app/issues/1065
 71 |     watchOptions: {
 72 |       ignored: ignoredFiles(paths.appSrc),
 73 |     },
 74 |     // Enable HTTPS if the HTTPS environment variable is set to 'true'
 75 |     https: protocol === 'https',
 76 |     host,
 77 |     overlay: false,
 78 |     historyApiFallback: {
 79 |       // Paths with dots should still use the history fallback.
 80 |       // See https://github.com/facebook/create-react-app/issues/387.
 81 |       disableDotRule: true,
 82 |     },
 83 |     public: allowedHost,
 84 |     proxy,
 85 |     before(app, server) {
 86 |       if (fs.existsSync(paths.proxySetup)) {
 87 |         // This registers user provided middleware for proxy reasons
 88 |         require(paths.proxySetup)(app);
 89 |       }
 90 | 
 91 |       // This lets us fetch source contents from webpack for the error overlay
 92 |       app.use(evalSourceMapMiddleware(server));
 93 |       // This lets us open files from the runtime error overlay.
 94 |       app.use(errorOverlayMiddleware());
 95 | 
 96 |       // This service worker file is effectively a 'no-op' that will reset any
 97 |       // previous service worker registered for the same host:port combination.
 98 |       // We do this in development to avoid hitting the production cache if
 99 |       // it used the same host and port.
100 |       // https://github.com/facebook/create-react-app/issues/2272#issuecomment-302832432
101 |       app.use(noopServiceWorkerMiddleware());
102 |     },
103 |   };
104 | };
105 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "name": "react-chrome-dino",
  3 |   "version": "0.1.3",
  4 |   "main": "build/index.js",
  5 |   "scripts": {
  6 |     "start": "node scripts/start.js",
  7 |     "build": "node scripts/build.js",
  8 |     "demo": "node scripts/demo.js",
  9 |     "test": "node scripts/test.js"
 10 |   },
 11 |   "license": "MIT",
 12 |   "dependencies": {},
 13 |   "homepage" : "https://github.com/0xbsec/react-chrome-dino",
 14 |   "devDependencies": {
 15 |     "@babel/core": "7.6.0",
 16 |     "@svgr/webpack": "4.3.2",
 17 |     "@typescript-eslint/eslint-plugin": "^2.2.0",
 18 |     "@typescript-eslint/parser": "^2.2.0",
 19 |     "babel-eslint": "10.0.3",
 20 |     "babel-jest": "^24.9.0",
 21 |     "babel-loader": "8.0.6",
 22 |     "babel-plugin-named-asset-import": "^0.3.4",
 23 |     "babel-preset-react-app": "^9.0.2",
 24 |     "camelcase": "^5.2.0",
 25 |     "case-sensitive-paths-webpack-plugin": "2.2.0",
 26 |     "css-loader": "2.1.1",
 27 |     "dotenv": "6.2.0",
 28 |     "dotenv-expand": "5.1.0",
 29 |     "eslint": "^6.1.0",
 30 |     "eslint-config-react-app": "^5.0.2",
 31 |     "eslint-loader": "3.0.2",
 32 |     "eslint-plugin-flowtype": "3.13.0",
 33 |     "eslint-plugin-import": "2.18.2",
 34 |     "eslint-plugin-jsx-a11y": "6.2.3",
 35 |     "eslint-plugin-react": "7.14.3",
 36 |     "eslint-plugin-react-hooks": "^1.6.1",
 37 |     "file-loader": "3.0.1",
 38 |     "fs-extra": "7.0.1",
 39 |     "html-webpack-plugin": "4.0.0-beta.5",
 40 |     "identity-obj-proxy": "3.0.0",
 41 |     "is-wsl": "^1.1.0",
 42 |     "jest": "24.9.0",
 43 |     "jest-environment-jsdom-fourteen": "0.1.0",
 44 |     "jest-resolve": "24.9.0",
 45 |     "jest-watch-typeahead": "0.4.0",
 46 |     "mini-css-extract-plugin": "0.8.0",
 47 |     "optimize-css-assets-webpack-plugin": "5.0.3",
 48 |     "pnp-webpack-plugin": "1.5.0",
 49 |     "postcss-flexbugs-fixes": "4.1.0",
 50 |     "postcss-loader": "3.0.0",
 51 |     "postcss-normalize": "7.0.1",
 52 |     "postcss-preset-env": "6.7.0",
 53 |     "postcss-safe-parser": "4.0.1",
 54 |     "react": "^16.10.2",
 55 |     "react-app-polyfill": "^1.0.4",
 56 |     "react-dev-utils": "^9.1.0",
 57 |     "react-dom": "^16.10.2",
 58 |     "resolve": "1.12.0",
 59 |     "resolve-url-loader": "3.1.0",
 60 |     "sass-loader": "7.2.0",
 61 |     "semver": "6.3.0",
 62 |     "style-loader": "1.0.0",
 63 |     "terser-webpack-plugin": "1.4.1",
 64 |     "ts-pnp": "1.1.4",
 65 |     "url-loader": "2.1.0",
 66 |     "webpack": "4.41.0",
 67 |     "webpack-dev-server": "3.2.1",
 68 |     "webpack-manifest-plugin": "2.1.1",
 69 |     "workbox-webpack-plugin": "4.3.1"
 70 |   },
 71 |   "eslintConfig": {
 72 |     "extends": "react-app"
 73 |   },
 74 |   "browserslist": {
 75 |     "production": [
 76 |       ">0.2%",
 77 |       "not dead",
 78 |       "not op_mini all"
 79 |     ],
 80 |     "development": [
 81 |       "last 1 chrome version",
 82 |       "last 1 firefox version",
 83 |       "last 1 safari version"
 84 |     ]
 85 |   },
 86 |   "jest": {
 87 |     "roots": [
 88 |       "<rootDir>/src"
 89 |     ],
 90 |     "collectCoverageFrom": [
 91 |       "src/**/*.{js,jsx,ts,tsx}",
 92 |       "!src/**/*.d.ts"
 93 |     ],
 94 |     "setupFiles": [
 95 |       "react-app-polyfill/jsdom"
 96 |     ],
 97 |     "setupFilesAfterEnv": [],
 98 |     "testMatch": [
 99 |       "<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}",
100 |       "<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}"
101 |     ],
102 |     "testEnvironment": "jest-environment-jsdom-fourteen",
103 |     "transform": {
104 |       "^.+\\.(js|jsx|ts|tsx)$": "<rootDir>/node_modules/babel-jest",
105 |       "^.+\\.css$": "<rootDir>/config/jest/cssTransform.js",
106 |       "^(?!.*\\.(js|jsx|ts|tsx|css|json)$)": "<rootDir>/config/jest/fileTransform.js"
107 |     },
108 |     "transformIgnorePatterns": [
109 |       "[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$",
110 |       "^.+\\.module\\.(css|sass|scss)$"
111 |     ],
112 |     "modulePaths": [],
113 |     "moduleNameMapper": {
114 |       "^react-native$": "react-native-web",
115 |       "^.+\\.module\\.(css|sass|scss)$": "identity-obj-proxy"
116 |     },
117 |     "moduleFileExtensions": [
118 |       "web.js",
119 |       "js",
120 |       "web.ts",
121 |       "ts",
122 |       "web.tsx",
123 |       "tsx",
124 |       "json",
125 |       "web.jsx",
126 |       "jsx",
127 |       "node"
128 |     ],
129 |     "watchPlugins": [
130 |       "jest-watch-typeahead/filename",
131 |       "jest-watch-typeahead/testname"
132 |     ]
133 |   },
134 |   "babel": {
135 |     "presets": [
136 |       "react-app"
137 |     ]
138 |   },
139 |   "keywords": [
140 |     "game", "chrome", "dinosaur"
141 |   ]
142 | }
143 | 


--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mhasbini/react-chrome-dino/8d94ecb956bfe161878152ce6a809f9021c892df/public/favicon.ico


--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8" />
 5 |     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1" />
 7 |     <meta name="theme-color" content="#000000" />
 8 |     <meta
 9 |       name="description"
10 |       content="Web site created using create-react-app"
11 |     />
12 |     <link rel="apple-touch-icon" href="logo192.png" />
13 |     <!--
14 |       manifest.json provides metadata used when your web app is installed on a
15 |       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
16 |     -->
17 |     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
18 |     <!--
19 |       Notice the use of %PUBLIC_URL% in the tags above.
20 |       It will be replaced with the URL of the `public` folder during the build.
21 |       Only files inside the `public` folder can be referenced from the HTML.
22 | 
23 |       Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
24 |       work correctly both with client-side routing and a non-root public URL.
25 |       Learn how to configure a non-root public URL by running `npm run build`.
26 |     -->
27 |     <title>React App</title>
28 |   </head>
29 |   <body>
30 |     <noscript>You need to enable JavaScript to run this app.</noscript>
31 |     <div id="root"></div>
32 |     <!--
33 |       This HTML file is a template.
34 |       If you open it directly in the browser, you will see an empty page.
35 | 
36 |       You can add webfonts, meta tags, or analytics to this file.
37 |       The build step will place the bundled scripts into the <body> tag.
38 | 
39 |       To begin the development, run `npm start` or `yarn start`.
40 |       To create a production bundle, use `npm run build` or `yarn build`.
41 |     -->
42 |   </body>
43 | </html>
44 | 


--------------------------------------------------------------------------------
/public/logo192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mhasbini/react-chrome-dino/8d94ecb956bfe161878152ce6a809f9021c892df/public/logo192.png


--------------------------------------------------------------------------------
/public/logo512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mhasbini/react-chrome-dino/8d94ecb956bfe161878152ce6a809f9021c892df/public/logo512.png


--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "short_name": "React Library",
 3 |   "name": "Create React Library Sample",
 4 |   "icons": [
 5 |     {
 6 |       "src": "favicon.ico",
 7 |       "sizes": "64x64 32x32 24x24 16x16",
 8 |       "type": "image/x-icon"
 9 |     },
10 |     {
11 |       "src": "logo192.png",
12 |       "type": "image/png",
13 |       "sizes": "192x192"
14 |     },
15 |     {
16 |       "src": "logo512.png",
17 |       "type": "image/png",
18 |       "sizes": "512x512"
19 |     }
20 |   ],
21 |   "start_url": ".",
22 |   "display": "standalone",
23 |   "theme_color": "#000000",
24 |   "background_color": "#ffffff"
25 | }
26 | 


--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | # https://www.robotstxt.org/robotstxt.html
2 | User-agent: *
3 | 


--------------------------------------------------------------------------------
/screenshots/screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mhasbini/react-chrome-dino/8d94ecb956bfe161878152ce6a809f9021c892df/screenshots/screenshot.png


--------------------------------------------------------------------------------
/scripts/build.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | // Do this as the first thing so that any code reading it knows the right env.
  4 | process.env.BABEL_ENV = 'production';
  5 | process.env.NODE_ENV = 'production';
  6 | 
  7 | // Makes the script crash on unhandled rejections instead of silently
  8 | // ignoring them. In the future, promise rejections that are not handled will
  9 | // terminate the Node.js process with a non-zero exit code.
 10 | process.on('unhandledRejection', err => {
 11 |   throw err;
 12 | });
 13 | 
 14 | // Ensure environment variables are read.
 15 | require('../config/env');
 16 | 
 17 | 
 18 | // const path = require('path');
 19 | const chalk = require('react-dev-utils/chalk');
 20 | const fs = require('fs-extra');
 21 | const webpack = require('webpack');
 22 | const configFactory = require('../config/webpack.config');
 23 | const paths = require('../config/paths');
 24 | const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
 25 | const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 26 | // const printHostingInstructions = require('react-dev-utils/printHostingInstructions');
 27 | const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
 28 | const printBuildError = require('react-dev-utils/printBuildError');
 29 | 
 30 | const measureFileSizesBeforeBuild =
 31 |   FileSizeReporter.measureFileSizesBeforeBuild;
 32 | const printFileSizesAfterBuild = FileSizeReporter.printFileSizesAfterBuild;
 33 | // const useYarn = fs.existsSync(paths.yarnLockFile);
 34 | 
 35 | // These sizes are pretty large. We'll warn for bundles exceeding them.
 36 | const WARN_AFTER_BUNDLE_GZIP_SIZE = 512 * 1024;
 37 | const WARN_AFTER_CHUNK_GZIP_SIZE = 1024 * 1024;
 38 | 
 39 | const isInteractive = process.stdout.isTTY;
 40 | 
 41 | // Warn and crash if required files are missing
 42 | if (!checkRequiredFiles([paths.appLibIndexJs])) { // CRL: Updated with library index file
 43 |   process.exit(1);
 44 | }
 45 | 
 46 | // Generate configuration
 47 | const config = configFactory('production');
 48 | 
 49 | // We require that you explicitly set browsers and do not fall back to
 50 | // browserslist defaults.
 51 | const { checkBrowsers } = require('react-dev-utils/browsersHelper');
 52 | checkBrowsers(paths.appPath, isInteractive)
 53 |   .then(() => {
 54 |     // First, read the current file sizes in build directory.
 55 |     // This lets us display how much they changed later.
 56 |     return measureFileSizesBeforeBuild(paths.appBuild);
 57 |   })
 58 |   .then(previousFileSizes => {
 59 |     // Remove all content but keep the directory so that
 60 |     // if you're in it, you don't end up in Trash
 61 |     fs.emptyDirSync(paths.appBuild);
 62 |     // Merge with the public folder
 63 |     // copyPublicFolder();  // CRL: No need to copy PublicFolder, it's a library after all ;)
 64 |     // Start the webpack build
 65 |     return build(previousFileSizes);
 66 |   })
 67 |   .then(
 68 |     ({ stats, previousFileSizes, warnings }) => {
 69 |       if (warnings.length) {
 70 |         console.log(chalk.yellow('Compiled with warnings.\n'));
 71 |         console.log(warnings.join('\n\n'));
 72 |         console.log(
 73 |           '\nSearch for the ' +
 74 |             chalk.underline(chalk.yellow('keywords')) +
 75 |             ' to learn more about each warning.'
 76 |         );
 77 |         console.log(
 78 |           'To ignore, add ' +
 79 |             chalk.cyan('// eslint-disable-next-line') +
 80 |             ' to the line before.\n'
 81 |         );
 82 |       } else {
 83 |         console.log(chalk.green('Compiled successfully.\n'));
 84 |       }
 85 | 
 86 |       console.log('File sizes after gzip:\n');
 87 |       printFileSizesAfterBuild(
 88 |         stats,
 89 |         previousFileSizes,
 90 |         paths.appBuild,
 91 |         WARN_AFTER_BUNDLE_GZIP_SIZE,
 92 |         WARN_AFTER_CHUNK_GZIP_SIZE
 93 |       );
 94 |       console.log();
 95 | 
 96 |       // CRL: No need to print HostingInstructions, it's a library after all ;)
 97 |       // const appPackage = require(paths.appPackageJson);
 98 |       // const publicUrl = paths.publicUrl;
 99 |       // const publicPath = config.output.publicPath;
100 |       // const buildFolder = path.relative(process.cwd(), paths.appBuild);
101 |       // printHostingInstructions(
102 |       //   appPackage,
103 |       //   publicUrl,
104 |       //   publicPath,
105 |       //   buildFolder,
106 |       //   useYarn
107 |       // );
108 |     },
109 |     err => {
110 |       const tscCompileOnError = process.env.TSC_COMPILE_ON_ERROR === 'true';
111 |       if (tscCompileOnError) {
112 |         console.log(chalk.yellow(
113 |           'Compiled with the following type errors (you may want to check these before deploying your app):\n'
114 |         ));
115 |         printBuildError(err);
116 |       } else {
117 |         console.log(chalk.red('Failed to compile.\n'));
118 |         printBuildError(err);
119 |         process.exit(1);
120 |       }
121 |     }
122 |   )
123 |   .catch(err => {
124 |     if (err && err.message) {
125 |       console.log(err.message);
126 |     }
127 |     process.exit(1);
128 |   });
129 | 
130 | // Create the production build and print the deployment instructions.
131 | function build(previousFileSizes) {
132 |   // We used to support resolving modules according to `NODE_PATH`.
133 |   // This now has been deprecated in favor of jsconfig/tsconfig.json
134 |   // This lets you use absolute paths in imports inside large monorepos:
135 |   if (process.env.NODE_PATH) {
136 |     console.log(
137 |       chalk.yellow(
138 |         'Setting NODE_PATH to resolve modules absolutely has been deprecated in favor of setting baseUrl in jsconfig.json (or tsconfig.json if you are using TypeScript) and will be removed in a future major release of create-react-app.'
139 |       )
140 |     );
141 |     console.log();
142 |   }
143 | 
144 |   console.log('Creating an optimized production build...');
145 | 
146 |   const compiler = webpack(config);
147 |   return new Promise((resolve, reject) => {
148 |     compiler.run((err, stats) => {
149 |       let messages;
150 |       if (err) {
151 |         if (!err.message) {
152 |           return reject(err);
153 |         }
154 |         messages = formatWebpackMessages({
155 |           errors: [err.message],
156 |           warnings: [],
157 |         });
158 |       } else {
159 |         messages = formatWebpackMessages(
160 |           stats.toJson({ all: false, warnings: true, errors: true })
161 |         );
162 |       }
163 |       if (messages.errors.length) {
164 |         // Only keep the first error. Others are often indicative
165 |         // of the same problem, but confuse the reader with noise.
166 |         if (messages.errors.length > 1) {
167 |           messages.errors.length = 1;
168 |         }
169 |         return reject(new Error(messages.errors.join('\n\n')));
170 |       }
171 |       if (
172 |         process.env.CI &&
173 |         (typeof process.env.CI !== 'string' ||
174 |           process.env.CI.toLowerCase() !== 'false') &&
175 |         messages.warnings.length
176 |       ) {
177 |         console.log(
178 |           chalk.yellow(
179 |             '\nTreating warnings as errors because process.env.CI = true.\n' +
180 |               'Most CI servers set it automatically.\n'
181 |           )
182 |         );
183 |         return reject(new Error(messages.warnings.join('\n\n')));
184 |       }
185 | 
186 |       return resolve({
187 |         stats,
188 |         previousFileSizes,
189 |         warnings: messages.warnings,
190 |       });
191 |     });
192 |   });
193 | }
194 | 
195 | // function copyPublicFolder() {
196 | //   fs.copySync(paths.appPublic, paths.appBuild, {
197 | //     dereference: true,
198 | //     filter: file => file !== paths.appHtml,
199 | //   });
200 | // }
201 | 


--------------------------------------------------------------------------------
/scripts/demo.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | // Do this as the first thing so that any code reading it knows the right env.
  4 | process.env.BABEL_ENV = 'production';
  5 | process.env.NODE_ENV = 'production';
  6 | 
  7 | // Makes the script crash on unhandled rejections instead of silently
  8 | // ignoring them. In the future, promise rejections that are not handled will
  9 | // terminate the Node.js process with a non-zero exit code.
 10 | process.on('unhandledRejection', err => {
 11 |   throw err;
 12 | });
 13 | 
 14 | // Ensure environment variables are read.
 15 | require('../config/env');
 16 | 
 17 | 
 18 | const path = require('path');
 19 | const chalk = require('react-dev-utils/chalk');
 20 | const fs = require('fs-extra');
 21 | const webpack = require('webpack');
 22 | const configFactory = require('../config/webpack.config');
 23 | const paths = require('../config/paths');
 24 | const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
 25 | const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 26 | const printHostingInstructions = require('react-dev-utils/printHostingInstructions');
 27 | const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
 28 | const printBuildError = require('react-dev-utils/printBuildError');
 29 | 
 30 | const measureFileSizesBeforeBuild =
 31 |   FileSizeReporter.measureFileSizesBeforeBuild;
 32 | const printFileSizesAfterBuild = FileSizeReporter.printFileSizesAfterBuild;
 33 | const useYarn = fs.existsSync(paths.yarnLockFile);
 34 | 
 35 | // These sizes are pretty large. We'll warn for bundles exceeding them.
 36 | const WARN_AFTER_BUNDLE_GZIP_SIZE = 512 * 1024;
 37 | const WARN_AFTER_CHUNK_GZIP_SIZE = 1024 * 1024;
 38 | 
 39 | const isInteractive = process.stdout.isTTY;
 40 | 
 41 | // Warn and crash if required files are missing
 42 | if (!checkRequiredFiles([paths.appHtml, paths.appDemoIndexJs])) { // CRL: Updated with demo index file
 43 |   process.exit(1);
 44 | }
 45 | 
 46 | // Generate configuration
 47 | const config = configFactory('demo'); // CRL: Use demo environment
 48 | 
 49 | // We require that you explicitly set browsers and do not fall back to
 50 | // browserslist defaults.
 51 | const { checkBrowsers } = require('react-dev-utils/browsersHelper');
 52 | checkBrowsers(paths.appPath, isInteractive)
 53 |   .then(() => {
 54 |     // First, read the current file sizes in build directory.
 55 |     // This lets us display how much they changed later.
 56 |     return measureFileSizesBeforeBuild(paths.appDemoBuild); // CRL: Updated with demo build path
 57 |   })
 58 |   .then(previousFileSizes => {
 59 |     // Remove all content but keep the directory so that
 60 |     // if you're in it, you don't end up in Trash
 61 |     fs.emptyDirSync(paths.appDemoBuild); // CRL: Updated with demo build path
 62 |     // Merge with the public folder
 63 |     copyPublicFolder();
 64 |     // Start the webpack build
 65 |     return build(previousFileSizes);
 66 |   })
 67 |   .then(
 68 |     ({ stats, previousFileSizes, warnings }) => {
 69 |       if (warnings.length) {
 70 |         console.log(chalk.yellow('Compiled with warnings.\n'));
 71 |         console.log(warnings.join('\n\n'));
 72 |         console.log(
 73 |           '\nSearch for the ' +
 74 |             chalk.underline(chalk.yellow('keywords')) +
 75 |             ' to learn more about each warning.'
 76 |         );
 77 |         console.log(
 78 |           'To ignore, add ' +
 79 |             chalk.cyan('// eslint-disable-next-line') +
 80 |             ' to the line before.\n'
 81 |         );
 82 |       } else {
 83 |         console.log(chalk.green('Compiled successfully.\n'));
 84 |       }
 85 | 
 86 |       console.log('File sizes after gzip:\n');
 87 |       printFileSizesAfterBuild(
 88 |         stats,
 89 |         previousFileSizes,
 90 |         paths.appDemoBuild, // CRL: Updated with demo build path
 91 |         WARN_AFTER_BUNDLE_GZIP_SIZE,
 92 |         WARN_AFTER_CHUNK_GZIP_SIZE
 93 |       );
 94 |       console.log();
 95 | 
 96 |       const appPackage = require(paths.appPackageJson);
 97 |       const publicUrl = paths.publicUrl;
 98 |       const publicPath = config.output.publicPath;
 99 |       const buildFolder = path.relative(process.cwd(), paths.appDemoBuild); // CRL: Updated with demo build path
100 |       printHostingInstructions(
101 |         appPackage,
102 |         publicUrl,
103 |         publicPath,
104 |         buildFolder,
105 |         useYarn
106 |       );
107 |     },
108 |     err => {
109 |       const tscCompileOnError = process.env.TSC_COMPILE_ON_ERROR === 'true';
110 |       if (tscCompileOnError) {
111 |         console.log(chalk.yellow(
112 |           'Compiled with the following type errors (you may want to check these before deploying your app):\n'
113 |         ));
114 |         printBuildError(err);
115 |       } else {
116 |         console.log(chalk.red('Failed to compile.\n'));
117 |         printBuildError(err);
118 |         process.exit(1);
119 |       }
120 |     }
121 |   )
122 |   .catch(err => {
123 |     if (err && err.message) {
124 |       console.log(err.message);
125 |     }
126 |     process.exit(1);
127 |   });
128 | 
129 | // Create the production build and print the deployment instructions.
130 | function build(previousFileSizes) {
131 |   // We used to support resolving modules according to `NODE_PATH`.
132 |   // This now has been deprecated in favor of jsconfig/tsconfig.json
133 |   // This lets you use absolute paths in imports inside large monorepos:
134 |   if (process.env.NODE_PATH) {
135 |     console.log(
136 |       chalk.yellow(
137 |         'Setting NODE_PATH to resolve modules absolutely has been deprecated in favor of setting baseUrl in jsconfig.json (or tsconfig.json if you are using TypeScript) and will be removed in a future major release of create-react-app.'
138 |       )
139 |     );
140 |     console.log();
141 |   }
142 | 
143 |   console.log('Creating a build of the demo app...'); // CRL - Updated log message
144 | 
145 |   const compiler = webpack(config);
146 |   return new Promise((resolve, reject) => {
147 |     compiler.run((err, stats) => {
148 |       let messages;
149 |       if (err) {
150 |         if (!err.message) {
151 |           return reject(err);
152 |         }
153 |         messages = formatWebpackMessages({
154 |           errors: [err.message],
155 |           warnings: [],
156 |         });
157 |       } else {
158 |         messages = formatWebpackMessages(
159 |           stats.toJson({ all: false, warnings: true, errors: true })
160 |         );
161 |       }
162 |       if (messages.errors.length) {
163 |         // Only keep the first error. Others are often indicative
164 |         // of the same problem, but confuse the reader with noise.
165 |         if (messages.errors.length > 1) {
166 |           messages.errors.length = 1;
167 |         }
168 |         return reject(new Error(messages.errors.join('\n\n')));
169 |       }
170 |       if (
171 |         process.env.CI &&
172 |         (typeof process.env.CI !== 'string' ||
173 |           process.env.CI.toLowerCase() !== 'false') &&
174 |         messages.warnings.length
175 |       ) {
176 |         console.log(
177 |           chalk.yellow(
178 |             '\nTreating warnings as errors because process.env.CI = true.\n' +
179 |               'Most CI servers set it automatically.\n'
180 |           )
181 |         );
182 |         return reject(new Error(messages.warnings.join('\n\n')));
183 |       }
184 | 
185 |       return resolve({
186 |         stats,
187 |         previousFileSizes,
188 |         warnings: messages.warnings,
189 |       });
190 |     });
191 |   });
192 | }
193 | 
194 | function copyPublicFolder() {
195 |   fs.copySync(paths.appPublic, paths.appDemoBuild, {  // CRL: Updated with demo build path
196 |     dereference: true,
197 |     filter: file => file !== paths.appHtml,
198 |   });
199 | }
200 | 


--------------------------------------------------------------------------------
/scripts/start.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | // Do this as the first thing so that any code reading it knows the right env.
  4 | process.env.BABEL_ENV = 'development';
  5 | process.env.NODE_ENV = 'development';
  6 | 
  7 | // Makes the script crash on unhandled rejections instead of silently
  8 | // ignoring them. In the future, promise rejections that are not handled will
  9 | // terminate the Node.js process with a non-zero exit code.
 10 | process.on('unhandledRejection', err => {
 11 |   throw err;
 12 | });
 13 | 
 14 | // Ensure environment variables are read.
 15 | require('../config/env');
 16 | 
 17 | 
 18 | const fs = require('fs');
 19 | const chalk = require('react-dev-utils/chalk');
 20 | const webpack = require('webpack');
 21 | const WebpackDevServer = require('webpack-dev-server');
 22 | const clearConsole = require('react-dev-utils/clearConsole');
 23 | const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
 24 | const {
 25 |   choosePort,
 26 |   createCompiler,
 27 |   prepareProxy,
 28 |   prepareUrls,
 29 | } = require('react-dev-utils/WebpackDevServerUtils');
 30 | const openBrowser = require('react-dev-utils/openBrowser');
 31 | const paths = require('../config/paths');
 32 | const configFactory = require('../config/webpack.config');
 33 | const createDevServerConfig = require('../config/webpackDevServer.config');
 34 | 
 35 | const useYarn = fs.existsSync(paths.yarnLockFile);
 36 | const isInteractive = process.stdout.isTTY;
 37 | 
 38 | // Warn and crash if required files are missing
 39 | if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
 40 |   process.exit(1);
 41 | }
 42 | 
 43 | // Tools like Cloud9 rely on this.
 44 | const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000;
 45 | const HOST = process.env.HOST || '0.0.0.0';
 46 | 
 47 | if (process.env.HOST) {
 48 |   console.log(
 49 |     chalk.cyan(
 50 |       `Attempting to bind to HOST environment variable: ${chalk.yellow(
 51 |         chalk.bold(process.env.HOST)
 52 |       )}`
 53 |     )
 54 |   );
 55 |   console.log(
 56 |     `If this was unintentional, check that you haven't mistakenly set it in your shell.`
 57 |   );
 58 |   console.log(
 59 |     `Learn more here: ${chalk.yellow('https://bit.ly/CRA-advanced-config')}`
 60 |   );
 61 |   console.log();
 62 | }
 63 | 
 64 | // We require that you explicitly set browsers and do not fall back to
 65 | // browserslist defaults.
 66 | const { checkBrowsers } = require('react-dev-utils/browsersHelper');
 67 | checkBrowsers(paths.appPath, isInteractive)
 68 |   .then(() => {
 69 |     // We attempt to use the default port but if it is busy, we offer the user to
 70 |     // run on a different port. `choosePort()` Promise resolves to the next free port.
 71 |     return choosePort(HOST, DEFAULT_PORT);
 72 |   })
 73 |   .then(port => {
 74 |     if (port == null) {
 75 |       // We have not found a port.
 76 |       return;
 77 |     }
 78 |     const config = configFactory('development');
 79 |     const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
 80 |     const appName = require(paths.appPackageJson).name;
 81 |     const useTypeScript = fs.existsSync(paths.appTsConfig);
 82 |     const tscCompileOnError = process.env.TSC_COMPILE_ON_ERROR === 'true';
 83 |     const urls = prepareUrls(protocol, HOST, port);
 84 |     const devSocket = {
 85 |       warnings: warnings =>
 86 |         devServer.sockWrite(devServer.sockets, 'warnings', warnings),
 87 |       errors: errors =>
 88 |         devServer.sockWrite(devServer.sockets, 'errors', errors),
 89 |     };
 90 |     // Create a webpack compiler that is configured with custom messages.
 91 |     const compiler = createCompiler({
 92 |       appName,
 93 |       config,
 94 |       devSocket,
 95 |       urls,
 96 |       useYarn,
 97 |       useTypeScript,
 98 |       tscCompileOnError,
 99 |       webpack,
100 |     });
101 |     // Load proxy config
102 |     const proxySetting = require(paths.appPackageJson).proxy;
103 |     const proxyConfig = prepareProxy(proxySetting, paths.appPublic);
104 |     // Serve webpack assets generated by the compiler over a web server.
105 |     const serverConfig = createDevServerConfig(
106 |       proxyConfig,
107 |       urls.lanUrlForConfig
108 |     );
109 |     const devServer = new WebpackDevServer(compiler, serverConfig);
110 |     // Launch WebpackDevServer.
111 |     devServer.listen(port, HOST, err => {
112 |       if (err) {
113 |         return console.log(err);
114 |       }
115 |       if (isInteractive) {
116 |         clearConsole();
117 |       }
118 | 
119 |       // We used to support resolving modules according to `NODE_PATH`.
120 |       // This now has been deprecated in favor of jsconfig/tsconfig.json
121 |       // This lets you use absolute paths in imports inside large monorepos:
122 |       if (process.env.NODE_PATH) {
123 |         console.log(
124 |           chalk.yellow(
125 |             'Setting NODE_PATH to resolve modules absolutely has been deprecated in favor of setting baseUrl in jsconfig.json (or tsconfig.json if you are using TypeScript) and will be removed in a future major release of create-react-app.'
126 |           )
127 |         );
128 |         console.log();
129 |       }
130 | 
131 |       console.log(chalk.cyan('Starting the development server...\n'));
132 |       openBrowser(urls.localUrlForBrowser);
133 |     });
134 | 
135 |     ['SIGINT', 'SIGTERM'].forEach(function(sig) {
136 |       process.on(sig, function() {
137 |         devServer.close();
138 |         process.exit();
139 |       });
140 |     });
141 |   })
142 |   .catch(err => {
143 |     if (err && err.message) {
144 |       console.log(err.message);
145 |     }
146 |     process.exit(1);
147 |   });
148 | 


--------------------------------------------------------------------------------
/scripts/test.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | // Do this as the first thing so that any code reading it knows the right env.
 4 | process.env.BABEL_ENV = 'test';
 5 | process.env.NODE_ENV = 'test';
 6 | process.env.PUBLIC_URL = '';
 7 | 
 8 | // Makes the script crash on unhandled rejections instead of silently
 9 | // ignoring them. In the future, promise rejections that are not handled will
10 | // terminate the Node.js process with a non-zero exit code.
11 | process.on('unhandledRejection', err => {
12 |   throw err;
13 | });
14 | 
15 | // Ensure environment variables are read.
16 | require('../config/env');
17 | 
18 | 
19 | const jest = require('jest');
20 | const execSync = require('child_process').execSync;
21 | let argv = process.argv.slice(2);
22 | 
23 | function isInGitRepository() {
24 |   try {
25 |     execSync('git rev-parse --is-inside-work-tree', { stdio: 'ignore' });
26 |     return true;
27 |   } catch (e) {
28 |     return false;
29 |   }
30 | }
31 | 
32 | function isInMercurialRepository() {
33 |   try {
34 |     execSync('hg --cwd . root', { stdio: 'ignore' });
35 |     return true;
36 |   } catch (e) {
37 |     return false;
38 |   }
39 | }
40 | 
41 | // Watch unless on CI or explicitly running all tests
42 | if (
43 |   !process.env.CI &&
44 |   argv.indexOf('--watchAll') === -1 &&
45 |   argv.indexOf('--watchAll=false') === -1
46 | ) {
47 |   // https://github.com/facebook/create-react-app/issues/5210
48 |   const hasSourceControl = isInGitRepository() || isInMercurialRepository();
49 |   argv.push(hasSourceControl ? '--watch' : '--watchAll');
50 | }
51 | 
52 | 
53 | jest.run(argv);
54 | 


--------------------------------------------------------------------------------
/src/demo/App.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Game from '../lib';
3 | 
4 | const App = () => (
5 |   <Game />
6 | );
7 | 
8 | export default App;
9 | 


--------------------------------------------------------------------------------
/src/demo/App.test.js:
--------------------------------------------------------------------------------
 1 | import React from 'react';
 2 | import ReactDOM from 'react-dom';
 3 | import App from './App';
 4 | 
 5 | it('renders without crashing', () => {
 6 |   const div = document.createElement('div');
 7 |   ReactDOM.render(<App />, div);
 8 |   ReactDOM.unmountComponentAtNode(div);
 9 | });
10 | 


--------------------------------------------------------------------------------
/src/demo/index.css:
--------------------------------------------------------------------------------
 1 | body {
 2 |   margin: 0;
 3 |   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
 4 |     "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
 5 |     sans-serif;
 6 |   -webkit-font-smoothing: antialiased;
 7 |   -moz-osx-font-smoothing: grayscale;
 8 | }
 9 | 
10 | code {
11 |   font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
12 |     monospace;
13 | }
14 | 


--------------------------------------------------------------------------------
/src/demo/index.js:
--------------------------------------------------------------------------------
 1 | import React from 'react';
 2 | import ReactDOM from 'react-dom';
 3 | import './index.css';
 4 | import App from './App';
 5 | import * as serviceWorker from './serviceWorker';
 6 | 
 7 | ReactDOM.render(<App />, document.getElementById('root'));
 8 | 
 9 | // If you want your app to work offline and load faster, you can change
10 | // unregister() to register() below. Note this comes with some pitfalls.
11 | // Learn more about service workers: https://bit.ly/CRA-PWA
12 | serviceWorker.unregister();
13 | 


--------------------------------------------------------------------------------
/src/demo/serviceWorker.js:
--------------------------------------------------------------------------------
  1 | // This optional code is used to register a service worker.
  2 | // register() is not called by default.
  3 | 
  4 | // This lets the app load faster on subsequent visits in production, and gives
  5 | // it offline capabilities. However, it also means that developers (and users)
  6 | // will only see deployed updates on subsequent visits to a page, after all the
  7 | // existing tabs open on the page have been closed, since previously cached
  8 | // resources are updated in the background.
  9 | 
 10 | // To learn more about the benefits of this model and instructions on how to
 11 | // opt-in, read https://bit.ly/CRA-PWA
 12 | 
 13 | const isLocalhost = Boolean(
 14 |   window.location.hostname === 'localhost' ||
 15 |     // [::1] is the IPv6 localhost address.
 16 |     window.location.hostname === '[::1]' ||
 17 |     // 127.0.0.1/8 is considered localhost for IPv4.
 18 |     window.location.hostname.match(
 19 |       /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
 20 |     )
 21 | );
 22 | 
 23 | export function register(config) {
 24 |   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
 25 |     // The URL constructor is available in all browsers that support SW.
 26 |     const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
 27 |     if (publicUrl.origin !== window.location.origin) {
 28 |       // Our service worker won't work if PUBLIC_URL is on a different origin
 29 |       // from what our page is served on. This might happen if a CDN is used to
 30 |       // serve assets; see https://github.com/facebook/create-react-app/issues/2374
 31 |       return;
 32 |     }
 33 | 
 34 |     window.addEventListener('load', () => {
 35 |       const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
 36 | 
 37 |       if (isLocalhost) {
 38 |         // This is running on localhost. Let's check if a service worker still exists or not.
 39 |         checkValidServiceWorker(swUrl, config);
 40 | 
 41 |         // Add some additional logging to localhost, pointing developers to the
 42 |         // service worker/PWA documentation.
 43 |         navigator.serviceWorker.ready.then(() => {
 44 |           console.log(
 45 |             'This web app is being served cache-first by a service ' +
 46 |               'worker. To learn more, visit https://bit.ly/CRA-PWA'
 47 |           );
 48 |         });
 49 |       } else {
 50 |         // Is not localhost. Just register service worker
 51 |         registerValidSW(swUrl, config);
 52 |       }
 53 |     });
 54 |   }
 55 | }
 56 | 
 57 | function registerValidSW(swUrl, config) {
 58 |   navigator.serviceWorker
 59 |     .register(swUrl)
 60 |     .then(registration => {
 61 |       registration.onupdatefound = () => {
 62 |         const installingWorker = registration.installing;
 63 |         if (installingWorker == null) {
 64 |           return;
 65 |         }
 66 |         installingWorker.onstatechange = () => {
 67 |           if (installingWorker.state === 'installed') {
 68 |             if (navigator.serviceWorker.controller) {
 69 |               // At this point, the updated precached content has been fetched,
 70 |               // but the previous service worker will still serve the older
 71 |               // content until all client tabs are closed.
 72 |               console.log(
 73 |                 'New content is available and will be used when all ' +
 74 |                   'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
 75 |               );
 76 | 
 77 |               // Execute callback
 78 |               if (config && config.onUpdate) {
 79 |                 config.onUpdate(registration);
 80 |               }
 81 |             } else {
 82 |               // At this point, everything has been precached.
 83 |               // It's the perfect time to display a
 84 |               // "Content is cached for offline use." message.
 85 |               console.log('Content is cached for offline use.');
 86 | 
 87 |               // Execute callback
 88 |               if (config && config.onSuccess) {
 89 |                 config.onSuccess(registration);
 90 |               }
 91 |             }
 92 |           }
 93 |         };
 94 |       };
 95 |     })
 96 |     .catch(error => {
 97 |       console.error('Error during service worker registration:', error);
 98 |     });
 99 | }
100 | 
101 | function checkValidServiceWorker(swUrl, config) {
102 |   // Check if the service worker can be found. If it can't reload the page.
103 |   fetch(swUrl)
104 |     .then(response => {
105 |       // Ensure service worker exists, and that we really are getting a JS file.
106 |       const contentType = response.headers.get('content-type');
107 |       if (
108 |         response.status === 404 ||
109 |         (contentType != null && contentType.indexOf('javascript') === -1)
110 |       ) {
111 |         // No service worker found. Probably a different app. Reload the page.
112 |         navigator.serviceWorker.ready.then(registration => {
113 |           registration.unregister().then(() => {
114 |             window.location.reload();
115 |           });
116 |         });
117 |       } else {
118 |         // Service worker found. Proceed as normal.
119 |         registerValidSW(swUrl, config);
120 |       }
121 |     })
122 |     .catch(() => {
123 |       console.log(
124 |         'No internet connection found. App is running in offline mode.'
125 |       );
126 |     });
127 | }
128 | 
129 | export function unregister() {
130 |   if ('serviceWorker' in navigator) {
131 |     navigator.serviceWorker.ready.then(registration => {
132 |       registration.unregister();
133 |     });
134 |   }
135 | }
136 | 


--------------------------------------------------------------------------------
/src/lib/components/Dino.css:
--------------------------------------------------------------------------------
  1 | /* Copyright 2014 The Chromium Authors. All rights reserved.
  2 |    Use of this source code is governed by a BSD-style license that can be
  3 |    found in the LICENSE file. */
  4 | 
  5 | .interstitial-wrapper {
  6 |   box-sizing: border-box;
  7 |   font-size: 1em;
  8 |   line-height: 1.6em;
  9 |   margin: 50px auto 0;
 10 |   max-width: 600px;
 11 |   width: 100%;
 12 | }
 13 | 
 14 | @media (max-width: 700px) {
 15 |   .interstitial-wrapper {
 16 |     padding: 0 10%;
 17 |   }
 18 | }
 19 | 
 20 | @media (max-height: 600px) {
 21 |   .interstitial-wrapper {
 22 |     margin-top: 5px;
 23 |   }
 24 | }
 25 | 
 26 | @media (max-width: 400px) {
 27 |   .interstitial-wrapper {
 28 |     padding: 0 5%;
 29 |   }
 30 | }
 31 | 
 32 | /* Don't use the main frame div when the error is in a subframe. */
 33 | html[subframe] #main-frame-error {
 34 |   display: none;
 35 | }
 36 | 
 37 | .hidden {
 38 |   display: none;
 39 | }
 40 | 
 41 | /* Don't allow overflow when in a subframe. */
 42 | html[subframe] body {
 43 |   overflow: hidden;
 44 | }
 45 | 
 46 | #buttons::after {
 47 |   clear: both;
 48 |   content: '';
 49 |   display: block;
 50 |   width: 100%;
 51 | }
 52 | 
 53 | /* Offline page */
 54 | .offline .interstitial-wrapper {
 55 |   color: #2b2b2b;
 56 |   font-size: 1em;
 57 |   line-height: 1.55;
 58 |   margin: 100px auto 0;
 59 |   max-width: 600px;
 60 |   width: 100%;
 61 | }
 62 | 
 63 | .offline .runner-container {
 64 |   height: 150px;
 65 |   max-width: 600px;
 66 |   overflow: hidden;
 67 |   position: absolute;
 68 |   top: 10px;
 69 |   width: 44px;
 70 |   z-index: 2;
 71 | }
 72 | 
 73 | .offline .runner-canvas {
 74 |   height: 150px;
 75 |   max-width: 600px;
 76 |   opacity: 1;
 77 |   overflow: hidden;
 78 |   position: absolute;
 79 |   top: 0;
 80 | }
 81 | 
 82 | .offline .controller {
 83 |   background: rgba(247,247,247, .1);
 84 |   height: 100vh;
 85 |   left: 0;
 86 |   position: absolute;
 87 |   top: 0;
 88 |   width: 100vw;
 89 |   z-index: 1;
 90 | }
 91 | 
 92 | #offline-resources {
 93 |   display: none;
 94 | }
 95 | 
 96 | @media (max-height: 350px) {
 97 |   .interstitial-wrapper {
 98 |     margin-top: 5%;
 99 |   }
100 | }


--------------------------------------------------------------------------------
/src/lib/components/Dino.js:
--------------------------------------------------------------------------------
 1 | import React from 'react';
 2 | 
 3 | import Resources from './Resources.js';
 4 | import DinoScript from './DinoScript.js';
 5 | import DinoStyle from './DinoStyle.js';
 6 | 
 7 | import './Dino.css';
 8 | 
 9 | class ChromeDinoComponent extends React.Component {
10 |   appendDinoScript() {
11 |     let dinoScriptContainer = document.createElement("script");
12 |     dinoScriptContainer.appendChild(document.createTextNode(DinoScript)); 
13 |     this.startDiv.appendChild(dinoScriptContainer);
14 |   }
15 | 
16 |   appendRunnerScript() {
17 |     let runnerScriptContainer = document.createElement("script");
18 |     runnerScriptContainer.appendChild(document.createTextNode(`new Runner('.interstitial-wrapper');`)); 
19 | 
20 |     this.endDiv.appendChild(runnerScriptContainer);
21 |   }
22 | 
23 |   componentDidMount() {
24 |     this.appendDinoScript();
25 | 
26 |     this.appendRunnerScript();
27 |   }
28 | 
29 |     render() {
30 |         return (
31 |           <div ref={el => (this.startDiv = el)}>
32 |             <style>{DinoStyle}</style>
33 |             <div id="main-frame-error" className="interstitial-wrapper">
34 |               <Resources />
35 |               <div ref={el => (this.endDiv = el)}>
36 |               </div>
37 |             </div>
38 |           </div>
39 |         );
40 |     }
41 | }
42 | 
43 | export default ChromeDinoComponent;
44 | 


--------------------------------------------------------------------------------
/src/lib/components/DinoScript.js:
--------------------------------------------------------------------------------
1 | // This uses a modified version of https://cs.chromium.org/chromium/src/components/neterror/resources/offline.js
2 | // License for the code bellow:
3 | // Copyright (c) 2014 The Chromium Authors. All rights reserved.
4 | // Use of this source code is governed by a BSD-style license that can be
5 | // found in the LICENSE file here: https://cs.chromium.org/chromium/src/LICENSE.
6 | 
7 | const DinoScript = `!function(){"use strict";function l(t,i){if(l.instance_)return l.instance_;(l.instance_=this).outerContainerEl=document.querySelector(t),this.containerEl=null,this.detailsButton=this.outerContainerEl.querySelector("#details-button"),this.config=i||l.config,this.dimensions=l.defaultDimensions,this.canvas=null,this.canvasCtx=null,this.tRex=null,this.distanceMeter=null,this.distanceRan=0,this.highestScore=0,this.time=0,this.runningTime=0,this.msPerFrame=1e3/e,this.currentSpeed=this.config.SPEED,this.obstacles=[],this.started=!1,this.activated=!1,this.crashed=!1,this.paused=!1,this.resizeTimerId_=null,this.playCount=0,this.audioBuffer=null,this.soundFx={},this.audioContext=null,this.images={},this.imagesLoaded=0,this.loadImages()}window.Runner=l;var e=60,T=1<window.devicePixelRatio,n=-1<window.navigator.userAgent.indexOf("UIWebViewForStaticFileContent"),h=-1<window.navigator.userAgent.indexOf("Mobi")||n;window;function o(t,i){return Math.floor(Math.random()*(i-t+1))+t}function a(t){for(var i=t.length/4*3,s=atob(t),e=new ArrayBuffer(i),n=new Uint8Array(e),h=0;h<i;h++)n[h]=s.charCodeAt(h);return n.buffer}function r(){return n?(new Date).getTime():performance.now()}function I(t,i,s,e){this.canvas=t,this.canvasCtx=t.getContext("2d"),this.canvasDimensions=e,this.textSprite=i,this.restartImg=s,this.draw()}function m(t,i){return new g(t.x+i.x,t.y+i.y,t.width,t.height)}function E(t,i,s){t.save(),t.strokeStyle="#f00",t.strokeRect(i.x,i.y,i.width,i.height),t.strokeStyle="#0f0",t.strokeRect(s.x,s.y,s.width,s.height),t.restore()}function f(t,i){var s=!1,e=(t.x,t.y,i.x);i.y;return t.x<e+i.width&&t.x+t.width>e&&t.y<i.y+i.height&&t.height+t.y>i.y&&(s=!0),s}function g(t,i,s,e){this.x=t,this.y=i,this.width=s,this.height=e}function c(t,i,s,e,n,h){this.canvasCtx=t,this.image=s,this.typeConfig=i,this.gapCoefficient=n,this.size=o(1,c.MAX_OBSTACLE_LENGTH),this.dimensions=e,this.remove=!1,this.xPos=0,this.yPos=this.typeConfig.yPos,this.width=0,this.collisionBoxes=[],this.gap=0,this.init(h)}function C(t,i){this.canvas=t,this.canvasCtx=t.getContext("2d"),this.image=i,this.xPos=0,this.yPos=0,this.groundYPos=0,this.currentFrame=0,this.currentAnimFrames=[],this.blinkDelay=0,this.animStartTime=0,this.timer=0,this.msPerFrame=1e3/e,this.config=C.config,this.status=C.status.WAITING,this.jumping=!1,this.jumpVelocity=0,this.reachedMinHeight=!1,this.speedDrop=!1,this.jumpCount=0,this.jumpspotX=0,this.init()}function u(t,i,s){this.canvas=t,this.canvasCtx=t.getContext("2d"),this.image=i,this.x=0,this.y=5,this.currentDistance=0,this.maxScore=0,this.highScore=0,this.container=null,this.digits=[],this.acheivement=!1,this.defaultString="",this.flashTimer=0,this.flashIterations=0,this.config=u.config,this.init(s)}function d(t,i,s){this.canvas=t,this.canvasCtx=this.canvas.getContext("2d"),this.image=i,this.containerWidth=s,this.xPos=s,this.yPos=0,this.remove=!1,this.cloudGap=o(d.config.MIN_CLOUD_GAP,d.config.MAX_CLOUD_GAP),this.init()}function s(t,i){this.image=i,this.canvas=t,this.canvasCtx=t.getContext("2d"),this.sourceDimensions={},this.dimensions=s.dimensions,this.sourceXPos=[0,this.dimensions.WIDTH],this.xPos=[],this.yPos=0,this.bumpThreshold=.5,this.setSourceDimensions(),this.draw()}function p(t,i,s,e){this.canvas=t,this.canvasCtx=this.canvas.getContext("2d"),this.config=p.config,this.dimensions=s,this.gapCoefficient=e,this.obstacles=[],this.horizonOffsets=[0,0],this.cloudFrequency=this.config.CLOUD_FREQUENCY,this.clouds=[],this.cloudImg=i.CLOUD,this.cloudSpeed=this.config.BG_CLOUD_SPEED,this.horizonImg=i.HORIZON,this.horizonLine=null,this.obstacleImgs={CACTUS_SMALL:i.CACTUS_SMALL,CACTUS_LARGE:i.CACTUS_LARGE},this.init()}l.config={ACCELERATION:.001,BG_CLOUD_SPEED:.2,BOTTOM_PAD:10,CLEAR_TIME:3e3,CLOUD_FREQUENCY:.5,GAMEOVER_CLEAR_TIME:750,GAP_COEFFICIENT:.6,GRAVITY:.6,INITIAL_JUMP_VELOCITY:12,MAX_CLOUDS:6,MAX_OBSTACLE_LENGTH:3,MAX_SPEED:12,MIN_JUMP_HEIGHT:35,MOBILE_SPEED_COEFFICIENT:1.2,RESOURCE_TEMPLATE_ID:"audio-resources",SPEED:6,SPEED_DROP_COEFFICIENT:3},l.defaultDimensions={WIDTH:600,HEIGHT:150},l.classes={CANVAS:"runner-canvas",CONTAINER:"runner-container",CRASHED:"crashed",ICON:"icon-offline",TOUCH_CONTROLLER:"controller"},l.imageSources={LDPI:[{name:"CACTUS_LARGE",id:"1x-obstacle-large"},{name:"CACTUS_SMALL",id:"1x-obstacle-small"},{name:"CLOUD",id:"1x-cloud"},{name:"HORIZON",id:"1x-horizon"},{name:"RESTART",id:"1x-restart"},{name:"TEXT_SPRITE",id:"1x-text"},{name:"TREX",id:"1x-trex"}],HDPI:[{name:"CACTUS_LARGE",id:"2x-obstacle-large"},{name:"CACTUS_SMALL",id:"2x-obstacle-small"},{name:"CLOUD",id:"2x-cloud"},{name:"HORIZON",id:"2x-horizon"},{name:"RESTART",id:"2x-restart"},{name:"TEXT_SPRITE",id:"2x-text"},{name:"TREX",id:"2x-trex"}]},l.sounds={BUTTON_PRESS:0,HIT:1,SCORE:2},l.keycodes={JUMP:{38:1,32:1},DUCK:{40:1},RESTART:{13:1}},l.events={ANIM_END:"webkitAnimationEnd",CLICK:"click",KEYDOWN:"keydown",KEYUP:"keyup",MOUSEDOWN:"mousedown",MOUSEUP:"mouseup",RESIZE:"resize",TOUCHEND:"touchend",TOUCHSTART:"touchstart",VISIBILITY:"visibilitychange",BLUR:"blur",FOCUS:"focus",LOAD:"load"},l.prototype={updateConfigSetting:function(t,i){if(t in this.config&&null!=i)switch(this.config[t]=i,t){case"GRAVITY":case"MIN_JUMP_HEIGHT":case"SPEED_DROP_COEFFICIENT":this.tRex.config[t]=i;break;case"INITIAL_JUMP_VELOCITY":this.tRex.setJumpVelocity(i);break;case"SPEED":this.setSpeed(i)}},loadImages:function(){for(var t=T?l.imageSources.HDPI:l.imageSources.LDPI,i=t.length-1;0<=i;i--){var s=t[i];this.images[s.name]=document.getElementById(s.id)}this.init()},loadSounds:function(){if(!n){this.audioContext=new AudioContext;var t=document.getElementById(this.config.RESOURCE_TEMPLATE_ID);for(var i in l.sounds){var s=t.children[l.sounds[i]].src,e=a(s=s.substr(s.indexOf(",")+1));this.audioContext.decodeAudioData(e,function(t,i){this.soundFx[t]=i}.bind(this,i))}}},setSpeed:function(t){var i=t||this.currentSpeed;if(this.dimensions.WIDTH<600){var s=i*this.dimensions.WIDTH/600*this.config.MOBILE_SPEED_COEFFICIENT;this.currentSpeed=i<s?i:s}else t&&(this.currentSpeed=t)},init:function(){var t,i,s,e,n;this.adjustDimensions(),this.setSpeed(),this.containerEl=document.createElement("div"),this.containerEl.className=l.classes.CONTAINER,this.canvas=(t=this.containerEl,i=this.dimensions.WIDTH,s=this.dimensions.HEIGHT,e=l.classes.PLAYER,(n=document.createElement("canvas")).className=e?l.classes.CANVAS+" "+e:l.classes.CANVAS,n.width=i,n.height=s,t.appendChild(n),n),this.canvasCtx=this.canvas.getContext("2d"),this.canvasCtx.fillStyle="#f7f7f7",this.canvasCtx.fill(),l.updateCanvasScaling(this.canvas),this.horizon=new p(this.canvas,this.images,this.dimensions,this.config.GAP_COEFFICIENT),this.distanceMeter=new u(this.canvas,this.images.TEXT_SPRITE,this.dimensions.WIDTH),this.tRex=new C(this.canvas,this.images.TREX),this.outerContainerEl.appendChild(this.containerEl),h&&this.createTouchController(),this.startListening(),this.update(),window.addEventListener(l.events.RESIZE,this.debounceResize.bind(this))},createTouchController:function(){this.touchController=document.createElement("div"),this.touchController.className=l.classes.TOUCH_CONTROLLER},debounceResize:function(){this.resizeTimerId_||(this.resizeTimerId_=setInterval(this.adjustDimensions.bind(this),250))},adjustDimensions:function(){clearInterval(this.resizeTimerId_),this.resizeTimerId_=null;var t=window.getComputedStyle(this.outerContainerEl),i=Number(t.paddingLeft.substr(0,t.paddingLeft.length-2));this.dimensions.WIDTH=this.outerContainerEl.offsetWidth-2*i,this.canvas&&(this.canvas.width=this.dimensions.WIDTH,this.canvas.height=this.dimensions.HEIGHT,l.updateCanvasScaling(this.canvas),this.distanceMeter.calcXPos(this.dimensions.WIDTH),this.clearCanvas(),this.horizon.update(0,0,!0),this.tRex.update(0),this.activated||this.crashed?(this.containerEl.style.width=this.dimensions.WIDTH+"px",this.containerEl.style.height=this.dimensions.HEIGHT+"px",this.distanceMeter.update(0,Math.ceil(this.distanceRan)),this.stop()):this.tRex.draw(0,0),this.crashed&&this.gameOverPanel&&(this.gameOverPanel.updateDimensions(this.dimensions.WIDTH),this.gameOverPanel.draw()))},playIntro:function(){if(this.started||this.crashed)this.crashed&&this.restart();else{this.playingIntro=!0,this.tRex.playingIntro=!0;var t="@-webkit-keyframes intro { from { width:"+C.config.WIDTH+"px }to { width: "+this.dimensions.WIDTH+"px }}";document.styleSheets[0].insertRule(t,0),this.containerEl.addEventListener(l.events.ANIM_END,this.startGame.bind(this)),this.containerEl.style.webkitAnimation="intro .4s ease-out 1 both",this.containerEl.style.width=this.dimensions.WIDTH+"px",this.touchController&&this.outerContainerEl.appendChild(this.touchController),this.activated=!0,this.started=!0}},startGame:function(){this.runningTime=0,this.playingIntro=!1,this.tRex.playingIntro=!1,this.containerEl.style.webkitAnimation="",this.playCount++,window.addEventListener(l.events.VISIBILITY,this.onVisibilityChange.bind(this)),window.addEventListener(l.events.BLUR,this.onVisibilityChange.bind(this)),window.addEventListener(l.events.FOCUS,this.onVisibilityChange.bind(this))},clearCanvas:function(){this.canvasCtx.clearRect(0,0,this.dimensions.WIDTH,this.dimensions.HEIGHT)},update:function(){this.drawPending=!1;var t=r(),i=t-(this.time||t);if(this.time=t,this.activated){this.clearCanvas(),this.tRex.jumping&&this.tRex.updateJump(i,this.config),this.runningTime+=i;var s=this.runningTime>this.config.CLEAR_TIME;1!=this.tRex.jumpCount||this.playingIntro||this.playIntro(),this.playingIntro?this.horizon.update(0,this.currentSpeed,s):(i=this.started?i:0,this.horizon.update(i,this.currentSpeed,s)),s&&function(t,i,s){l.defaultDimensions.WIDTH,t.xPos;var e=new g(i.xPos+1,i.yPos+1,i.config.WIDTH-2,i.config.HEIGHT-2),n=new g(t.xPos+1,t.yPos+1,t.typeConfig.width*t.size-2,t.typeConfig.height-2);s&&E(s,e,n);if(f(e,n))for(var h=t.collisionBoxes,o=C.collisionBoxes,a=0;a<o.length;a++)for(var r=0;r<h.length;r++){var c=m(o[a],e),d=m(h[r],n),u=f(c,d);if(s&&E(s,c,d),u)return[c,d]}return!1}(this.horizon.obstacles[0],this.tRex)?this.gameOver():(this.distanceRan+=this.currentSpeed*i/this.msPerFrame,this.currentSpeed<this.config.MAX_SPEED&&(this.currentSpeed+=this.config.ACCELERATION)),this.distanceMeter.getActualDistance(this.distanceRan)>this.distanceMeter.maxScore&&(this.distanceRan=0),this.distanceMeter.update(i,Math.ceil(this.distanceRan))&&this.playSound(this.soundFx.SCORE)}this.crashed||(this.tRex.update(i),this.raq())},handleEvent:function(s){return function(t,i){switch(t){case i.KEYDOWN:case i.TOUCHSTART:case i.MOUSEDOWN:this.onKeyDown(s);break;case i.KEYUP:case i.TOUCHEND:case i.MOUSEUP:this.onKeyUp(s)}}.bind(this)(s.type,l.events)},startListening:function(){document.addEventListener(l.events.KEYDOWN,this),document.addEventListener(l.events.KEYUP,this),h?(this.touchController.addEventListener(l.events.TOUCHSTART,this),this.touchController.addEventListener(l.events.TOUCHEND,this),this.containerEl.addEventListener(l.events.TOUCHSTART,this)):(document.addEventListener(l.events.MOUSEDOWN,this),document.addEventListener(l.events.MOUSEUP,this))},stopListening:function(){document.removeEventListener(l.events.KEYDOWN,this),document.removeEventListener(l.events.KEYUP,this),h?(this.touchController.removeEventListener(l.events.TOUCHSTART,this),this.touchController.removeEventListener(l.events.TOUCHEND,this),this.containerEl.removeEventListener(l.events.TOUCHSTART,this)):(document.removeEventListener(l.events.MOUSEDOWN,this),document.removeEventListener(l.events.MOUSEUP,this))},onKeyDown:function(t){t.target!=this.detailsButton&&(this.crashed||!l.keycodes.JUMP[String(t.keyCode)]&&t.type!=l.events.TOUCHSTART||(this.activated||(this.loadSounds(),this.activated=!0),this.tRex.jumping||(this.playSound(this.soundFx.BUTTON_PRESS),this.tRex.startJump())),this.crashed&&t.type==l.events.TOUCHSTART&&t.currentTarget==this.containerEl&&this.restart()),l.keycodes.DUCK[t.keyCode]&&this.tRex.jumping&&(t.preventDefault(),this.tRex.setSpeedDrop())},onKeyUp:function(t){var i=String(t.keyCode),s=l.keycodes.JUMP[i]||t.type==l.events.TOUCHEND||t.type==l.events.MOUSEDOWN;if(this.isRunning()&&s)this.tRex.endJump();else if(l.keycodes.DUCK[i])this.tRex.speedDrop=!1;else if(this.crashed){var e=r()-this.time;(l.keycodes.RESTART[i]||t.type==l.events.MOUSEUP&&t.target==this.canvas||e>=this.config.GAMEOVER_CLEAR_TIME&&l.keycodes.JUMP[i])&&this.restart()}else this.paused&&s&&this.play()},raq:function(){this.drawPending||(this.drawPending=!0,this.raqId=requestAnimationFrame(this.update.bind(this)))},isRunning:function(){return!!this.raqId},gameOver:function(){var t;this.playSound(this.soundFx.HIT),t=200,h&&window.navigator.vibrate&&window.navigator.vibrate(t),this.stop(),this.crashed=!0,this.distanceMeter.acheivement=!1,this.tRex.update(100,C.status.CRASHED),this.gameOverPanel?this.gameOverPanel.draw():this.gameOverPanel=new I(this.canvas,this.images.TEXT_SPRITE,this.images.RESTART,this.dimensions),this.distanceRan>this.highestScore&&(this.highestScore=Math.ceil(this.distanceRan),this.distanceMeter.setHighScore(this.highestScore)),this.time=r()},stop:function(){this.activated=!1,this.paused=!0,cancelAnimationFrame(this.raqId),this.raqId=0},play:function(){this.crashed||(this.activated=!0,this.paused=!1,this.tRex.update(0,C.status.RUNNING),this.time=r(),this.update())},restart:function(){this.raqId||(this.playCount++,this.runningTime=0,this.activated=!0,this.crashed=!1,this.distanceRan=0,this.setSpeed(this.config.SPEED),this.time=r(),this.containerEl.classList.remove(l.classes.CRASHED),this.clearCanvas(),this.distanceMeter.reset(this.highestScore),this.horizon.reset(),this.tRex.reset(),this.playSound(this.soundFx.BUTTON_PRESS),this.update())},onVisibilityChange:function(t){document.hidden||document.webkitHidden||"blur"==t.type?this.stop():this.play()},playSound:function(t){if(t){var i=this.audioContext.createBufferSource();i.buffer=t,i.connect(this.audioContext.destination),i.start(0)}}},l.updateCanvasScaling=function(t,i,s){var e=t.getContext("2d"),n=Math.floor(window.devicePixelRatio)||1,h=Math.floor(e.webkitBackingStorePixelRatio)||1,o=n/h;if(n===h)return!1;var a=i||t.width,r=s||t.height;return t.width=a*o,t.height=r*o,t.style.width=a+"px",t.style.height=r+"px",e.scale(o,o),!0},I.dimensions={TEXT_X:0,TEXT_Y:13,TEXT_WIDTH:191,TEXT_HEIGHT:11,RESTART_WIDTH:36,RESTART_HEIGHT:32},I.prototype={updateDimensions:function(t,i){this.canvasDimensions.WIDTH=t,i&&(this.canvasDimensions.HEIGHT=i)},draw:function(){var t=I.dimensions,i=this.canvasDimensions.WIDTH/2,s=t.TEXT_X,e=t.TEXT_Y,n=t.TEXT_WIDTH,h=t.TEXT_HEIGHT,o=Math.round(i-t.TEXT_WIDTH/2),a=Math.round((this.canvasDimensions.HEIGHT-25)/3),r=t.TEXT_WIDTH,c=t.TEXT_HEIGHT,d=t.RESTART_WIDTH,u=t.RESTART_HEIGHT,l=i-t.RESTART_WIDTH/2,m=this.canvasDimensions.HEIGHT/2;T&&(e*=2,s*=2,n*=2,h*=2,d*=2,u*=2),this.canvasCtx.drawImage(this.textSprite,s,e,n,h,o,a,r,c),this.canvasCtx.drawImage(this.restartImg,0,0,d,u,l,m,t.RESTART_WIDTH,t.RESTART_HEIGHT)}},c.MAX_GAP_COEFFICIENT=1.5,c.MAX_OBSTACLE_LENGTH=3,c.prototype={init:function(t){this.cloneCollisionBoxes(),1<this.size&&this.typeConfig.multipleSpeed>t&&(this.size=1),this.width=this.typeConfig.width*this.size,this.xPos=this.dimensions.WIDTH-this.width,this.draw(),1<this.size&&(this.collisionBoxes[1].width=this.width-this.collisionBoxes[0].width-this.collisionBoxes[2].width,this.collisionBoxes[2].x=this.width-this.collisionBoxes[2].width),this.gap=this.getGap(this.gapCoefficient,t)},draw:function(){var t=this.typeConfig.width,i=this.typeConfig.height;T&&(t*=2,i*=2);var s=t*this.size*(.5*(this.size-1));this.canvasCtx.drawImage(this.image,s,0,t*this.size,i,this.xPos,this.yPos,this.typeConfig.width*this.size,this.typeConfig.height)},update:function(t,i){this.remove||(this.xPos-=Math.floor(i*e/1e3*t),this.draw(),this.isVisible()||(this.remove=!0))},getGap:function(t,i){var s=Math.round(this.width*i+this.typeConfig.minGap*t);return o(s,Math.round(s*c.MAX_GAP_COEFFICIENT))},isVisible:function(){return 0<this.xPos+this.width},cloneCollisionBoxes:function(){for(var t=this.typeConfig.collisionBoxes,i=t.length-1;0<=i;i--)this.collisionBoxes[i]=new g(t[i].x,t[i].y,t[i].width,t[i].height)}},c.types=[{type:"CACTUS_SMALL",className:" cactus cactus-small ",width:17,height:35,yPos:105,multipleSpeed:3,minGap:120,collisionBoxes:[new g(0,7,5,27),new g(4,0,6,34),new g(10,4,7,14)]},{type:"CACTUS_LARGE",className:" cactus cactus-large ",width:25,height:50,yPos:90,multipleSpeed:6,minGap:120,collisionBoxes:[new g(0,12,7,38),new g(8,0,7,49),new g(13,10,10,38)]}],C.config={DROP_VELOCITY:-5,GRAVITY:.6,HEIGHT:47,INIITAL_JUMP_VELOCITY:-10,INTRO_DURATION:1500,MAX_JUMP_HEIGHT:30,MIN_JUMP_HEIGHT:30,SPEED_DROP_COEFFICIENT:3,SPRITE_WIDTH:262,START_X_POS:50,WIDTH:44},C.collisionBoxes=[new g(1,-1,30,26),new g(32,0,8,16),new g(10,35,14,8),new g(1,24,29,5),new g(5,30,21,4),new g(9,34,15,4)],C.status={CRASHED:"CRASHED",JUMPING:"JUMPING",RUNNING:"RUNNING",WAITING:"WAITING"},C.BLINK_TIMING=7e3,C.animFrames={WAITING:{frames:[44,0],msPerFrame:1e3/3},RUNNING:{frames:[88,132],msPerFrame:1e3/12},CRASHED:{frames:[220],msPerFrame:1e3/60},JUMPING:{frames:[0],msPerFrame:1e3/60}},C.prototype={init:function(){this.blinkDelay=this.setBlinkDelay(),this.groundYPos=l.defaultDimensions.HEIGHT-this.config.HEIGHT-l.config.BOTTOM_PAD,this.yPos=this.groundYPos,this.minJumpHeight=this.groundYPos-this.config.MIN_JUMP_HEIGHT,this.draw(0,0),this.update(0,C.status.WAITING)},setJumpVelocity:function(t){this.config.INIITAL_JUMP_VELOCITY=-t,this.config.DROP_VELOCITY=-t/2},update:function(t,i){this.timer+=t,i&&(this.status=i,this.currentFrame=0,this.msPerFrame=C.animFrames[i].msPerFrame,this.currentAnimFrames=C.animFrames[i].frames,i==C.status.WAITING&&(this.animStartTime=r(),this.setBlinkDelay())),this.playingIntro&&this.xPos<this.config.START_X_POS&&(this.xPos+=Math.round(this.config.START_X_POS/this.config.INTRO_DURATION*t)),this.status==C.status.WAITING?this.blink(r()):this.draw(this.currentAnimFrames[this.currentFrame],0),this.timer>=this.msPerFrame&&(this.currentFrame=this.currentFrame==this.currentAnimFrames.length-1?0:this.currentFrame+1,this.timer=0)},draw:function(t,i){var s=t,e=i,n=this.config.WIDTH,h=this.config.HEIGHT;T&&(s*=2,e*=2,n*=2,h*=2),this.canvasCtx.drawImage(this.image,s,e,n,h,this.xPos,this.yPos,this.config.WIDTH,this.config.HEIGHT)},setBlinkDelay:function(){this.blinkDelay=Math.ceil(Math.random()*C.BLINK_TIMING)},blink:function(t){t-this.animStartTime>=this.blinkDelay&&(this.draw(this.currentAnimFrames[this.currentFrame],0),1==this.currentFrame&&(this.setBlinkDelay(),this.animStartTime=t))},startJump:function(){this.jumping||(this.update(0,C.status.JUMPING),this.jumpVelocity=this.config.INIITAL_JUMP_VELOCITY,this.jumping=!0,this.reachedMinHeight=!1,this.speedDrop=!1)},endJump:function(){this.reachedMinHeight&&this.jumpVelocity<this.config.DROP_VELOCITY&&(this.jumpVelocity=this.config.DROP_VELOCITY)},updateJump:function(t){var i=t/C.animFrames[this.status].msPerFrame;this.speedDrop?this.yPos+=Math.round(this.jumpVelocity*this.config.SPEED_DROP_COEFFICIENT*i):this.yPos+=Math.round(this.jumpVelocity*i),this.jumpVelocity+=this.config.GRAVITY*i,(this.yPos<this.minJumpHeight||this.speedDrop)&&(this.reachedMinHeight=!0),(this.yPos<this.config.MAX_JUMP_HEIGHT||this.speedDrop)&&this.endJump(),this.yPos>this.groundYPos&&(this.reset(),this.jumpCount++),this.update(t)},setSpeedDrop:function(){this.speedDrop=!0,this.jumpVelocity=1},reset:function(){this.yPos=this.groundYPos,this.jumpVelocity=0,this.jumping=!1,this.update(0,C.status.RUNNING),this.midair=!1,this.speedDrop=!1,this.jumpCount=0}},u.dimensions={WIDTH:10,HEIGHT:13,DEST_WIDTH:11},u.yPos=[0,13,27,40,53,67,80,93,107,120],u.config={MAX_DISTANCE_UNITS:5,ACHIEVEMENT_DISTANCE:100,COEFFICIENT:.025,FLASH_DURATION:250,FLASH_ITERATIONS:3},u.prototype={init:function(t){var i="";this.calcXPos(t),this.maxScore=this.config.MAX_DISTANCE_UNITS;for(var s=0;s<this.config.MAX_DISTANCE_UNITS;s++)this.draw(s,0),this.defaultString+="0",i+="9";this.maxScore=parseInt(i)},calcXPos:function(t){this.x=t-u.dimensions.DEST_WIDTH*(this.config.MAX_DISTANCE_UNITS+1)},draw:function(t,i,s){var e=u.dimensions.WIDTH,n=u.dimensions.HEIGHT,h=u.dimensions.WIDTH*i,o=t*u.dimensions.DEST_WIDTH,a=this.y,r=u.dimensions.WIDTH,c=u.dimensions.HEIGHT;if(T&&(e*=2,n*=2,h*=2),this.canvasCtx.save(),s){var d=this.x-2*this.config.MAX_DISTANCE_UNITS*u.dimensions.WIDTH;this.canvasCtx.translate(d,this.y)}else this.canvasCtx.translate(this.x,this.y);this.canvasCtx.drawImage(this.image,h,0,e,n,o,a,r,c),this.canvasCtx.restore()},getActualDistance:function(t){return t?Math.round(t*this.config.COEFFICIENT):0},update:function(t,i){var s=!0,e=!1;if(this.acheivement)this.flashIterations<=this.config.FLASH_ITERATIONS?(this.flashTimer+=t,this.flashTimer<this.config.FLASH_DURATION?s=!1:this.flashTimer>2*this.config.FLASH_DURATION&&(this.flashTimer=0,this.flashIterations++)):(this.acheivement=!1,this.flashIterations=0,this.flashTimer=0);else if(0<(i=this.getActualDistance(i))){i%this.config.ACHIEVEMENT_DISTANCE==0&&(this.acheivement=!0,e=!(this.flashTimer=0));var n=(this.defaultString+i).substr(-this.config.MAX_DISTANCE_UNITS);this.digits=n.split("")}else this.digits=this.defaultString.split("");if(s)for(var h=this.digits.length-1;0<=h;h--)this.draw(h,parseInt(this.digits[h]));return this.drawHighScore(),e},drawHighScore:function(){this.canvasCtx.save(),this.canvasCtx.globalAlpha=.8;for(var t=this.highScore.length-1;0<=t;t--)this.draw(t,parseInt(this.highScore[t],10),!0);this.canvasCtx.restore()},setHighScore:function(t){t=this.getActualDistance(t);var i=(this.defaultString+t).substr(-this.config.MAX_DISTANCE_UNITS);this.highScore=["10","11",""].concat(i.split(""))},reset:function(){this.update(0),this.acheivement=!1}},d.config={HEIGHT:14,MAX_CLOUD_GAP:400,MAX_SKY_LEVEL:30,MIN_CLOUD_GAP:100,MIN_SKY_LEVEL:71,WIDTH:46},d.prototype={init:function(){this.yPos=o(d.config.MAX_SKY_LEVEL,d.config.MIN_SKY_LEVEL),this.draw()},draw:function(){this.canvasCtx.save();var t=d.config.WIDTH,i=d.config.HEIGHT;T&&(t*=2,i*=2),this.canvasCtx.drawImage(this.image,0,0,t,i,this.xPos,this.yPos,d.config.WIDTH,d.config.HEIGHT),this.canvasCtx.restore()},update:function(t){this.remove||(this.xPos-=Math.ceil(t),this.draw(),this.isVisible()||(this.remove=!0))},isVisible:function(){return 0<this.xPos+d.config.WIDTH}},s.dimensions={WIDTH:600,HEIGHT:12,YPOS:127},s.prototype={setSourceDimensions:function(){for(var t in s.dimensions)T?"YPOS"!=t&&(this.sourceDimensions[t]=2*s.dimensions[t]):this.sourceDimensions[t]=s.dimensions[t],this.dimensions[t]=s.dimensions[t];this.xPos=[0,s.dimensions.WIDTH],this.yPos=s.dimensions.YPOS},getRandomType:function(){return Math.random()>this.bumpThreshold?this.dimensions.WIDTH:0},draw:function(){this.canvasCtx.drawImage(this.image,this.sourceXPos[0],0,this.sourceDimensions.WIDTH,this.sourceDimensions.HEIGHT,this.xPos[0],this.yPos,this.dimensions.WIDTH,this.dimensions.HEIGHT),this.canvasCtx.drawImage(this.image,this.sourceXPos[1],0,this.sourceDimensions.WIDTH,this.sourceDimensions.HEIGHT,this.xPos[1],this.yPos,this.dimensions.WIDTH,this.dimensions.HEIGHT)},updateXPos:function(t,i){var s=t,e=0==t?1:0;this.xPos[s]-=i,this.xPos[e]=this.xPos[s]+this.dimensions.WIDTH,this.xPos[s]<=-this.dimensions.WIDTH&&(this.xPos[s]+=2*this.dimensions.WIDTH,this.xPos[e]=this.xPos[s]-this.dimensions.WIDTH,this.sourceXPos[s]=this.getRandomType())},update:function(t,i){var s=Math.floor(i*(e/1e3)*t);this.xPos[0]<=0?this.updateXPos(0,s):this.updateXPos(1,s),this.draw()},reset:function(){this.xPos[0]=0,this.xPos[1]=s.dimensions.WIDTH}},p.config={BG_CLOUD_SPEED:.2,BUMPY_THRESHOLD:.3,CLOUD_FREQUENCY:.5,HORIZON_HEIGHT:16,MAX_CLOUDS:6},p.prototype={init:function(){this.addCloud(),this.horizonLine=new s(this.canvas,this.horizonImg)},update:function(t,i,s){this.runningTime+=t,this.horizonLine.update(t,i),this.updateClouds(t,i),s&&this.updateObstacles(t,i)},updateClouds:function(t,i){var s=this.cloudSpeed/1e3*t*i,e=this.clouds.length;if(e){for(var n=e-1;0<=n;n--)this.clouds[n].update(s);var h=this.clouds[e-1];e<this.config.MAX_CLOUDS&&this.dimensions.WIDTH-h.xPos>h.cloudGap&&this.cloudFrequency>Math.random()&&this.addCloud(),this.clouds=this.clouds.filter(function(t){return!t.remove})}},updateObstacles:function(t,i){for(var s=this.obstacles.slice(0),e=0;e<this.obstacles.length;e++){var n=this.obstacles[e];n.update(t,i),n.remove&&s.shift()}if(this.obstacles=s,0<this.obstacles.length){var h=this.obstacles[this.obstacles.length-1];h&&!h.followingObstacleCreated&&h.isVisible()&&h.xPos+h.width+h.gap<this.dimensions.WIDTH&&(this.addNewObstacle(i),h.followingObstacleCreated=!0)}else this.addNewObstacle(i)},addNewObstacle:function(t){var i=o(0,c.types.length-1),s=c.types[i],e=this.obstacleImgs[s.type];this.obstacles.push(new c(this.canvasCtx,s,e,this.dimensions,this.gapCoefficient,t))},reset:function(){this.obstacles=[],this.horizonLine.reset()},resize:function(t,i){this.canvas.width=t,this.canvas.height=i},addCloud:function(){this.clouds.push(new d(this.canvas,this.cloudImg,this.dimensions.WIDTH))}}}();`;
8 | 
9 | export default DinoScript;


--------------------------------------------------------------------------------
/src/lib/components/DinoStyle.js:
--------------------------------------------------------------------------------
1 | // This uses a modified version of https://cs.chromium.org/chromium/src/components/neterror/resources/offline.js
2 | // License for the code bellow:
3 | // Copyright (c) 2014 The Chromium Authors. All rights reserved.
4 | // Use of this source code is governed by a BSD-style license that can be
5 | // found in the LICENSE file here: https://cs.chromium.org/chromium/src/LICENSE.
6 | 
7 | const DinoStyle = `.interstitial-wrapper{box-sizing:border-box;font-size:1em;line-height:1.6em;margin:50px auto 0;max-width:600px;width:100%}@media (max-width:700px){.interstitial-wrapper{padding:0 10%}}@media (max-height:600px){.interstitial-wrapper{margin-top:5px}}@media (max-width:400px){.interstitial-wrapper{padding:0 5%}}html[subframe] #main-frame-error{display:none}.hidden{display:none}html[subframe] body{overflow:hidden}#buttons::after{clear:both;content:'';display:block;width:100%}.offline .interstitial-wrapper{color:#2b2b2b;font-size:1em;line-height:1.55;margin:100px auto 0;max-width:600px;width:100%}.offline .runner-container{height:150px;max-width:600px;overflow:hidden;position:absolute;top:10px;width:44px;z-index:2}.offline .runner-canvas{height:150px;max-width:600px;opacity:1;overflow:hidden;position:absolute;top:0}.offline .controller{background:rgba(247,247,247,.1);height:100vh;left:0;position:absolute;top:0;width:100vw;z-index:1}#offline-resources{display:none}@media (max-height:350px){.interstitial-wrapper{margin-top:5%}}`;
8 | 
9 | export default DinoStyle;


--------------------------------------------------------------------------------
/src/lib/components/Resources.js:
--------------------------------------------------------------------------------
 1 | import React from 'react';
 2 | 
 3 | class Recources extends React.Component {
 4 |     render() {
 5 |         return (
 6 |               <div id="offline-resources">
 7 |                 <div id="offline-resources-1x">
 8 |                   <img id="1x-obstacle-large" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJYAAAAyCAMAAACJUtIoAAAACVBMVEX////39/dTU1OabbyfAAAAAXRSTlMAQObYZgAAAXhJREFUeF7t2NGqAjEMANGM///RlwvaYQndULuFPJgHUYaEI6IPhgNAOA8HZ+3U6384F5y1U6YzAZTWG+dZamnFEstBFtCKJZSHWMADLJ18z+JqpQeLdKoDC8siC5iFCQs4znIxB5B1t6F3lQWkL4N0JsF+u6GXJdbI+FKW+yWr3lhgCZ2VSag3Nlk/FnRkIRbasLCO0oulikMsvmGpeiGLZ1jOMgtIP5bODivYYUXEIVbwFCt4khVssRgsgidZwQaLd2A8m7MYLGTl4KeQQs2y4kMAMGGlmQViDIb5O6xZnnLD485dIBzqDSE1yyFdL4Iqu4XJqUUWl/NVAFSZq1P6a5aqbAUM2epQbBioWflUBABiUyhYyZoCBev8XyMAObDNOhOAfiyxmHU0YNlldGAphGjFCjA3YkUn1o/1Y3EkZFZ5isCC6NUgwDBn1RuXH96doNfAhDXfsIyJ2AnolcCVhay0kcYbW0HvCO8OwIcJ3GzkORpkFuUP/1Ec8FW1qJkAAAAASUVORK5CYII="/>
 9 |                   <img id="1x-obstacle-small" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGYAAAAjCAMAAABRlI+PAAAADFBMVEX////////39/dTU1PhglcSAAAAAXRSTlMAQObYZgAAAPNJREFUeF7tlkEKwzAMBLXr//+5iQhU7gRRQkyhZI+DhwH74jhmO+oIJBVwURljuAXagG5QqkSgBLqg3JnxJ1Cb8SmQ3o6gpO85owGlOB4m2BNKJ11BSd01owGlOHkcIAuHkz6UNpPKgozPM54dADHjJuNhZiJxdQCQgZJeBczgCAAy3yhPJvcnmdC9mZwBIsQMFV5AkzHBNknFgcKM+oyDIFcfCAoy03m+jSMIcmoVZkKqSjr1fghyahRmoKRUHYLiSI1SMlCq5CDgX6BXmKkfn+oQ0KEyyrzoy8GbXJ9xrM/YjhUZgl9nnsyTCe9rgSRdV15CwRcIEu8GGQAAAABJRU5ErkJggg=="/>
10 |                   <img id="1x-cloud" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAOCAQAAAD6HOaKAAAAU0lEQVR4XrWSsQkAQAgD3X9El/ELixQpJHCfdApnUCtXz7o49cgagaGPaq4rIwAP9s/C7R7UX3inJ0BDb6qWDC7ScOR/QWjRlFizuPwLtTLj+qkH6DjD2wLtikUAAAAASUVORK5CYII="/>
11 |                   <img id="1x-text" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAL8AAAAYAgMAAADWncTDAAAABlBMVEX///9TU1NYzE1OAAAAAXRSTlMAQObYZgAAAO1JREFUeF690TFqxUAQA1BNoRtk7jMu3E9Auv9Vgr/5A863Y9zEhVhkHmhZsEGkw4Lppmllh1tcLHx+aRj2YnEDuQFvcQW+EoZY0TQLCZbEVxRxAvY+i8ikW0C0bwFdbictG2zvu/4EcCuBF0B23IBsQHZBYgm1n86BN+BmyV5rQFyCJAiDJSTfgBV9BbjvXdzIcKchpMOYd3gO/jvCeuUGFALg95J0/SrtQlrzz+sAjDwCIQsbWAdgbqrQpKYRjmPuAfU5dMC+c0rxOTiO+T6ZlK4pbcDLI1DIRaf3GxDGALkQHnD+cGhMKeox+AEOL3mLO7TQZgAAAABJRU5ErkJggg=="/>
12 |                   <img id="1x-horizon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAAAMAgMAAAAPCKxBAAAABlBMVEX///9TU1NYzE1OAAAAAXRSTlMAQObYZgAAALJJREFUeF7t1EEKAyEMhtEvMNm7sPfJEVyY+1+ltLgYAsrQCtWhbxEhQvgxIJtSZypxa/WGshgzKdbq/UihMFMlt3o/CspEYoihIMaAb6mCvM6C+BTAeyo+wN4yykV/6pVfkdLpVyI1hh7GJ6QunUoLEQlQglNP2nkQkeF8+ei9cLxMue1qxVRfk1Ej0s6AEGWfVOk0QUtnK5Xo0Lac6wpdtnQqB6VxomPaz+dgF1PaqqmeWJlz1jYUaSIAAAAASUVORK5CYII="/>
13 |                   <img id="1x-trex" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQgAAAAvAgMAAABiRrxWAAAADFBMVEX///9TU1P39/f///+TS9URAAAAAXRSTlMAQObYZgAAAPpJREFUeF7d0jFKRkEMhdGLMM307itNLALyVmHvJuzTDMjdn72E95PGFEZSmeoU4YMMgxhskvQec8YSVFX1NhGcS5ywtbmC8khcZeKq+ZWJ4F8Sr2+ZCErjkJFEfcjAc/6/BMlfcz6xHdhRthYzIZhIHMcTVY1scUUiAphK8CMSPUbieTBhvD9Lj0vyV4wklEGzHpciKGOJoBp7XDcFs4kWxxM7Ey3iZ8JbzASAvMS7XLOJHTTvEkEZSeQl7DMuwVyCasqK5+XzQRYLUJlMbPXjFcn3m8eKBSjWZMJwvGIOvViAzCbUj1VEDoqFOEQGE3SyInJQLOQMJL4B7enP1UbLXJQAAAAASUVORK5CYII="/>
14 |                   <img id="1x-restart" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAgCAQAAADQmBIFAAAAZklEQVR4Xu3WMQoAIAxDUe/Y+58jYwV1CwQJWQT5o/DAoaWjV2i/LRym/A5FjEsR41LPQchByEHwIVAEC4gZpghmSDP8egXpr/hQZaAKQFQe+pBOQAblDC336qrlPpSg0MEjInbWTLFFmwc8TpTAAAAAAElFTkSuQmCC"/>
15 |                 </div>
16 |                 <div id="offline-resources-2x">
17 |                   <img id="2x-obstacle-large" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAABkBAMAAADOLxDzAAAACVBMVEX///9TU1P39/ea77PDAAAAAXRSTlMAQObYZgAAAa9JREFUeF7t1lFqhEAQBuG+wl6h7n/IEEgKlma2R8Vk1O4HWSh++Xzb8AKA8E4IXrlYnsXr+zgh1OdifZbBdFIApdWiWShtVhmQ+jAWMLFollCOsTzgxiyd7GcR01/YLOZf1SwsN2EBozBgAU9l4TAHkDWzCNjKApZlybO4z+GtFwu9bGKZl2TJSyxDxaoX8yyha7LGZRDqxR+ymtUsaNaWhTM+s5rl05tjNUsVz2Kxi6XqhSy4NcvbzgLSnzzvjqzgCCsiHsXSdZwVPIAVHGIhi+ABrOAAi5+Avy7HQhaycpAVpDDBsuKDAOBCrHzjQHgYhl9YsHxf+vRrsQxjVVAsDNMsF6uydBUhq+wWBq/ayCKWZekqA6DKPPEq/ZMsYllWdgGDoMdaLAzMsFwszgoAi1pDxUrWFKhZLlZnpXIkAORAs7YEoFmzQSxmt2NWs+xOP7GapRCiZjUrwFyymhX/xmpWs5rVrGZxQphmsT6LAAsvdgcBhmmWi9VZvN7+x+4K2WtgwBosFmZZvIh9IXsl8M5C1mCxLsvTfizoxfDTAfgdAIPFlVhxRqgHlrVZX9y44aEEvVqmAAAAAElFTkSuQmCC"/>
18 |                   <img id="2x-obstacle-small" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMwAAABGBAMAAAByJ2Z/AAAADFBMVEX///9TU1P39/f///+TS9URAAAAAXRSTlMAQObYZgAAARZJREFUeF7t2NEJwzAQg2GtcCtoBe2/W6k5aK8qLgR6ToL9KPzzgR+NPCRRjg2ScjiQ9DKMCE4HRYQOJB2MJyXyQWPQgeSCDD8HnYHh10F6NbJk9KyMwpJ+hkEfnoSyGX1NUmAOqVjSz4zrNgwhm9FbMmEyuS7DpQw/Gf5kOGEYXMgwWBobnGHQmZKsYuyKDcZk8gdmM5uJMzKbgS7I5KENgJzxxN95PUMfAKi8gCXO6BQM4cM4ysEZwplyfxFDErAhmWniDKT3pJEpD2RDMpPEGUt6mOIQ1XFGmiXOZNLIgKUpgzH4lTgDtDIgmY0NznhSnWhk/v2ZkuONGOI2DEn0MNf7ttvMZjazmc2AJDkdJOlQ0sk8AC45t4r28J0GAAAAAElFTkSuQmCC"/>
19 |                   <img id="2x-cloud" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFwAAAAcAgMAAACR2TCnAAAABlBMVEUAAADa2to4qB92AAAAAXRSTlMAQObYZgAAAFFJREFUeF6VzTEKAFEIxNA03m+a3P8q2wqi/E35BIdeGXq3q5hnrwBs7mC5vIZzu/nnqI319vRtqHB731blwSHjx+22+Rdn94rzQq0ugKPVlz5onyJcGdu0NgAAAABJRU5ErkJggg=="/>
20 |                   <img id="2x-text" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAX4AAAAwAQMAAAAsMYMXAAAABlBMVEUAAABTU1OoaSf/AAAAAXRSTlMAQObYZgAAAPdJREFUeF7tkzFqAzEQRb9RsZ11BF0jlXSlpDdYOcFeSeCLKLeYQujHwxRrtF0gUoqo+AwfPRh4DDZByKk7tkv3rNszWhLHKv7BhtObALxF3LP44vRvRoLPTa4avoS8BLA+PSNFzyqAq/wDwNZxrxKBxq5axLGRS4EkgP6A6rrhy6ZVQLoiZKpfRJ8NqCp+HbCZpAcromNNHTfoeWS7hwnA//tROIpm17lddCbFgMAylGSZANiRhL1ou2treo0/ErB5AtAwbr8e8HK28wpwP8rmpwCv23+cPZhvK8GOCUD4lMHRALiOw8O9TAAcB2C8B7zDSvPw+8A3sQJ/MSdPGzIAAAAASUVORK5CYII="/>
21 |                   <img id="2x-horizon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAACWAAAAAYAQMAAABEalRSAAAABlBMVEX///9TU1NYzE1OAAAAAXRSTlMAQObYZgAAAOtJREFUeF7tljEKwzAMRb/J0CWgI/QKOYAh1+pUcjQfpUfw2MFEHVyDQSQmQUNM9AYNcobnh4egU+YVqhAvZSpgsfolPnSv5d0nz3vHslgUdK81RLzyvHcsi+WBNxQh4Ln8pw4Wi7skAg9mXgHMrEACXJnbHIllsbqGAtwXhnYswzFzwPWxWEPc2CexoobkHM4ZpD6s2loWiyIEEwCChIomMiMEHqgP573C9eHkc5VLWh3XsljnGVoLWVl+31bp38piTVVuihtPOAm9kcRLbrFjEvqwamtZLK5eI8sSan9rXEK0LcNFrY5oWawf59S7YSRD7eMAAAAASUVORK5CYII="/>
22 |                   <img id="2x-trex" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAhAAAABeAgMAAAAPo8UvAAAADFBMVEX///9TU1P39/f///+TS9URAAAAAXRSTlMAQObYZgAAASdJREFUeF7t1qFOBEEQRdEyGP7vGQy/hsHc/0MPSe8ylU2vKEIqqQnviRZXdI7pyUQuONda901FGAG6j8aa+6mDEUboHP01sk5EHHWEjt/UY0dk/U+Ir/cdkXUEovV1GFF/HQMR/mLWEUYYYQRrf65XRhgB2595Y80lYRjCCG7AV/IZ0FdDabgDhiKMgE+tAX01ES+ajDBCADpHZw0tRdaZCCNEGhCdNSSlQTEVYUROQGeNxxoxH2EErXU+wohdQXONqyBorDsixiB2Be01JiOM2BXQX1MRUxFGpAL6aypiMsIIJCFBtSK98fFYKd6wFDEbYUQgEYh6hTSkonbDDTAdYQTrKNd9QPWGUFwAYYRYR7U+XemGfB0ajTACWEe1Pl3thtxMhBHfOCEbEnR2KZcAAAAASUVORK5CYII="/>
23 |                   <img id="2x-restart" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABAAgMAAADE0Nm5AAAACVBMVEX////39/dTU1OabbyfAAAAAXRSTlMAQObYZgAAAGNJREFUeF7d1CEOwDAMQ9GS3q/ExPcz8Sm3gYBWVRo0afvwSQl0ax1To22JntKWupfGjriSXiLViCXCmXBHCykJTxaYEeIQGcVrHYklcoX8YYpSUggzcpBTiv5JtQWorUltmS6s4ZKtz2GgjAAAAABJRU5ErkJggg==" />
24 |                 </div>
25 |                 <template id="audio-resources">
26 |                   <audio id="offline-sound-press" src="data:audio/mpeg;base64,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"></audio>
27 |                   <audio id="offline-sound-hit" src="data:audio/mpeg;base64,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"></audio>
28 |                   <audio id="offline-sound-reached" src="data:audio/mpeg;base64,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"></audio>
29 |                 </template>
30 |               </div>
31 |         )
32 |     }
33 | }
34 | 
35 | export default Recources;
36 | 


--------------------------------------------------------------------------------
/src/lib/index.js:
--------------------------------------------------------------------------------
1 | import Dino from './components/Dino';
2 | 
3 | export default Dino;


--------------------------------------------------------------------------------