Merge branch 'release/Ver.2.0.0'

.gitignore

@@ -1 +1,2 @@
 CalcGachaProbTool/.firebase/
+gacha-prob-calculator/.firebase/

README.md

@@ -1,2 +1,21 @@
-# CalcGachaProbTool
-Probability Calculation Tool for Gacha System
+# ガチャ確率計算機
+
+「3％で出る SSR、100 連したら何％の確率で出てきそう？」
+「ピックアップは公称 1％だけど 300 回回して 1 枚しか出なかった。これは妥当？」
+……などといった、ガチャに関する疑問を解決する計算機です。
+
+## 機能 1：確率計算機能
+
+ドロップ率とガチャ回数を入力すると、それに従って獲得率を計算します。
+また、ドロップ率から、「99％の確率で手に入れるには何回回す必要があるか」なども計算できます。
+
+## 機能 2：確率推定機能
+
+ガチャ回数とドロップ回数から、運営が想定しているだろうドロップ率の 95％信頼区間を算出します。
+また、公称ドロップ率も合わせることで、「公称ドロップ率から『偶然』だけでは理由にならないほどの偏りが起きているか？」を p 値で判定することもできます。
+
+## 補足説明
+
+95％信頼区間……「ドロップ率の 95％信頼区間が X％～ Y％」というのは、「**運営が想定しているだろうドロップ率は 95％の確率でその区間に入っている**」という意味です。一般的に、試行回数を増やすと X と Y の間が狭まり、より高精度な推定が行えることになります。
+
+p 値……今回のアプリの場合、「**p 値が 0.05 を下回る**」＝「有意水準 5％で統計的有意差があった」＝「**偶然だけでこの偏りが説明できる確率は 5％未満**」となります。

gacha-prob-calculator/.env

@@ -0,0 +1 @@
+CHOKIDAR_USEPOLLING=true

gacha-prob-calculator/.firebaserc

@@ -0,0 +1,14 @@
+{
+  "projects": {
+    "default": "zwsptools"
+  },
+  "targets": {
+    "zwsptools": {
+      "hosting": {
+        "calc-gacha-prob-tool": [
+          "new-calc-gacha-prob-tool"
+        ]
+      }
+    }
+  }
+}

gacha-prob-calculator/.gitignore

@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

gacha-prob-calculator/README.md

@@ -0,0 +1,46 @@
+# Getting Started with Create React App
+
+This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `yarn start`
+
+Runs the app in the development mode.\
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+
+The page will reload if you make edits.\
+You will also see any lint errors in the console.
+
+### `yarn test`
+
+Launches the test runner in the interactive watch mode.\
+See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
+
+### `yarn build`
+
+Builds the app for production to the `build` folder.\
+It correctly bundles React in production mode and optimizes the build for the best performance.
+
+The build is minified and the filenames include the hashes.\
+Your app is ready to be deployed!
+
+See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
+
+### `yarn eject`
+
+**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
+
+If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
+
+Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
+
+You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
+
+## Learn More
+
+You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
+
+To learn React, check out the [React documentation](https://reactjs.org/).

gacha-prob-calculator/firebase.json

@@ -0,0 +1,13 @@
+{
+  "hosting": {
+    "target": "calc-gacha-prob-tool",
+    "public": "build",
+    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
+    "rewrites": [
+      {
+        "source": "**",
+        "destination": "/index.html"
+      }
+    ]
+  }
+}

gacha-prob-calculator/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "gacha-prob-calculator",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@testing-library/jest-dom": "^5.11.4",
+    "@testing-library/react": "^11.1.0",
+    "@testing-library/user-event": "^12.1.10",
+    "@types/jest": "^26.0.15",
+    "@types/node": "^12.0.0",
+    "@types/react": "^17.0.0",
+    "@types/react-dom": "^17.0.0",
+    "bootstrap": "^4.6.0",
+    "decimal.js": "^10.2.1",
+    "react": "^17.0.1",
+    "react-bootstrap": "^1.5.1",
+    "react-dom": "^17.0.1",
+    "react-scripts": "4.0.3",
+    "typescript": "^4.1.2",
+    "web-vitals": "^1.0.1"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

gacha-prob-calculator/public/index.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="ja">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Web site created using create-react-app"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <title>ガチャ確率計算機</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+  </body>
+</html>

gacha-prob-calculator/public/manifest.json

@@ -0,0 +1,25 @@
+{
+  "short_name": "ガチャ確率計算機",
+  "name": "ガチャ確率計算機",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

gacha-prob-calculator/public/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

gacha-prob-calculator/src/App.css

@@ -0,0 +1,38 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}

gacha-prob-calculator/src/App.test.tsx

@@ -0,0 +1,9 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import App from './App';
+
+test('renders learn react link', () => {
+  render(<App />);
+  const linkElement = screen.getByText(/learn react/i);
+  expect(linkElement).toBeInTheDocument();
+});

gacha-prob-calculator/src/App.tsx

@@ -0,0 +1,54 @@
+import React from 'react';
+import './App.css';
+import { Col, Container, Row, Tab, Tabs } from 'react-bootstrap';
+import Title from './container/Title';
+import AppInfo from './container/AppInfo';
+import CalcProb from './container/CalcProb';
+import TestProb from './container/TestProb';
+import { CalcProbContext, useCalcProbStore } from './store/CalcProbStore';
+import { TestProbContext, useTestProbStore } from './store/TestProbStore';
+
+const App: React.FC = () => {
+  return (
+    <Container>
+      <Row className="my-3">
+        <Col className="text-center">
+          <Title />
+        </Col>
+      </Row>
+      <Row>
+        <Col className="text-center">
+          <AppInfo />
+        </Col>
+      </Row>
+      <Row className="mt-3 justify-content-md-center">
+        <Col md={6}>
+          <Tabs defaultActiveKey="help" id="main-tab" transition={false}>
+            <Tab className="border-bottom border-left border-right p-3" eventKey="calc" title="確率計算">
+              <CalcProbContext.Provider value={useCalcProbStore()}>
+                <CalcProb />
+              </CalcProbContext.Provider>
+            </Tab>
+            <Tab className="border-bottom border-left border-right p-3" eventKey="test" title="確率推定">
+              <TestProbContext.Provider value={useTestProbStore()}>
+                <TestProb />
+              </TestProbContext.Provider>
+            </Tab>
+            <Tab className="border-bottom border-left border-right p-3" eventKey="help" title="ヘルプ">
+              <h4>インストール方法</h4>
+              <p>スマホのChromeブラウザやSafariブラウザで開き、メニューから<strong>「ホーム画面に追加」</strong>をタップしてください。</p>
+              <h4>「確率計算」について</h4>
+              <p>ガチャ1連で当たりを引く確率と引く回数から、成功確率などを計算してくれます。</p>
+              <h4>「確率推定」について</h4>
+              <p>ガチャを引いた回数とドロップ数と予想ドロップ率から、95％信頼区間やp値を計算してくれます。</p>
+              <p><strong>95％信頼区間</strong>：その設定のガチャを引いた人のうち、95％は当たりがこの範囲で出る</p>
+              <p><strong>p値</strong>：この値が0.05未満なら、予想ドロップ率と実際のドロップ率がかけ離れていると言える</p>
+            </Tab>
+          </Tabs>
+        </Col>
+      </Row>
+    </Container >
+  );
+}
+
+export default App;

gacha-prob-calculator/src/constant/other.ts

@@ -0,0 +1,16 @@
+import Decimal from "decimal.js";
+
+export const APP_TITLE = 'ガチャ確率計算/推定機';
+export const LAST_UP_DATE = '2021/03/10';
+export const PROJECT_URL = 'https://github.com/YSRKEN/CalcGachaProbTool/tree/develop';
+export const APP_URL = 'https://new-calc-gacha-prob-tool.firebaseapp.com/';
+const APP_INFO = 'ドロップ率の計算・推定が簡単に行なえます。';
+export const TWITTER_SHARE_URL = `https://twitter.com/intent/tweet?text=【${APP_TITLE}】%0a${APP_INFO}%0a&url=${APP_URL}`;
+
+export const ZERO = new Decimal('0');
+export const ONE = new Decimal('1');
+export const PROB_50_PER = new Decimal('0.5');
+export const PROB_95_PER = new Decimal('0.95');
+export const PROB_99_PER = new Decimal('0.99');
+export const CONFIDENCE_INTERVAL_PER = new Decimal('95');  // 今回は95％信頼区間を用いるのでこうした
+export const EPS = new Decimal('0.00001');

gacha-prob-calculator/src/container/AppInfo.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+
+import { Button } from "react-bootstrap";
+import { LAST_UP_DATE, PROJECT_URL, TWITTER_SHARE_URL } from "../constant/other";
+
+const AppInfo: React.FC = () => (<>
+  <span className="mr-3 d-none d-sm-inline">最終更新：{LAST_UP_DATE}</span>
+  <span className="mr-3"><a href={PROJECT_URL} rel="noreferrer" target="_blank">プロジェクトURL</a></span>
+  <Button size="sm" href={TWITTER_SHARE_URL} target="_blank">Twitterにシェア</Button>
+</>);
+
+export default AppInfo;