├── .gitignore
├── LICENSE
├── README.md
├── build
    ├── asset-manifest.json
    ├── favicon.ico
    ├── index.html
    ├── service-worker.js
    └── static
    │   ├── css
    │       ├── main.2ab780be.css
    │       └── main.2ab780be.css.map
    │   └── js
    │       ├── main.ca6013a6.js
    │       └── main.ca6013a6.js.map
├── crypto-bot-icon.png
├── logo-readme.png
├── logo.icns
├── logoban.png
├── main.js
├── package.json
├── public
    ├── favicon.ico
    └── index.html
├── src
    ├── App.js
    ├── actions
    │   └── methods.js
    ├── components
    │   ├── Editer.js
    │   ├── MainPage.js
    │   └── TopBar.js
    ├── index.js
    ├── reducers
    │   └── methods.js
    ├── store
    │   └── configureStore.js
    └── styles
    │   └── index.css
└── yarn.lock


/.gitignore:
--------------------------------------------------------------------------------
 1 | /node_modules
 2 | /crypto-bot-darwin-x64
 3 | 
 4 | # misc
 5 | .DS_Store
 6 | .env.local
 7 | .env.development.local
 8 | .env.test.local
 9 | .env.production.local
10 | 
11 | npm-debug.log*
12 | yarn-debug.log*
13 | yarn-error.log*
14 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2018 Eric Choo
 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.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | ### It's for encrypting and decrypting your messages
 2 | 
 3 | CryptoBot uses CryptoJS on most of the encrytion methods. You can use this application to view these encrytion and decryption process without headache.
 4 | 
 5 | #### For fun :)
 6 | 
 7 | ![logo](logoban.png)
 8 | 
 9 | #### view this app from browser
10 | 
11 | ```
12 | yarn install
13 | yarn start
14 | ```
15 | 
16 | #### view this app (electron)
17 | 
18 | ```
19 | yarn build // you need to modify the /build/index.html for the right <script src="">
20 | electron .
21 | ```
22 | 
23 | #### package for darwin
24 | 
25 | ```
26 | electron-packager . --electron-version=1.8.4  --platform=darwin --icon=./logo.icns --arch=x64 --ignore=node_modules/ --appname=CryptoBot --overwrite
27 | ```
28 | 
29 | #### package for win32
30 | 
31 | ```
32 | electron-packager . --electron-version=1.8.4  --platform=win32 --arch=x64 --ignore=node_modules/ --appname=CryptoBot --overwrite
33 | ```
34 | 
35 | #### package for linux
36 | 
37 | ```
38 | electron-packager . --electron-version=1.8.4  --platform=linux --arch=x64 --ignore=node_modules/ --appname=CryptoBot --overwrite
39 | ```
40 | 
41 | there may be some issues with the performance on win
42 | 
43 | **Thanks for the new icon by Arslanshn**
44 | 


--------------------------------------------------------------------------------
/build/asset-manifest.json:
--------------------------------------------------------------------------------
1 | {
2 |   "main.css": "static/css/main.2ab780be.css",
3 |   "main.css.map": "static/css/main.2ab780be.css.map",
4 |   "main.js": "static/js/main.ca6013a6.js",
5 |   "main.js.map": "static/js/main.ca6013a6.js.map"
6 | }


--------------------------------------------------------------------------------
/build/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cyphernull/crypto-bot/78f159d40a85174fde37c51f35d50a8c128ac453/build/favicon.ico


--------------------------------------------------------------------------------
/build/index.html:
--------------------------------------------------------------------------------
1 | <!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="manifest" href="/manifest.json"><link rel="shortcut icon" href="/favicon.ico"><link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"><title>Crypto-Bot</title><link href="./static/css/main.2ab780be.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script type="text/javascript" src="./static/js/main.ca6013a6.js"></script></body></html>
2 | 


--------------------------------------------------------------------------------
/build/service-worker.js:
--------------------------------------------------------------------------------
1 | "use strict";var precacheConfig=[["/index.html","864867079eaa05719b6c78a833bb579d"],["/static/css/main.2ab780be.css","f8e213c5cf69c85c2701e1dea63e2f5c"],["/static/js/main.ca6013a6.js","0848fe487109f7b63c8fa1e85d8bdd21"]],cacheName="sw-precache-v3-sw-precache-webpack-plugin-"+(self.registration?self.registration.scope:""),ignoreUrlParametersMatching=[/^utm_/],addDirectoryIndex=function(e,t){var n=new URL(e);return"/"===n.pathname.slice(-1)&&(n.pathname+=t),n.toString()},cleanResponse=function(t){return t.redirected?("body"in t?Promise.resolve(t.body):t.blob()).then(function(e){return new Response(e,{headers:t.headers,status:t.status,statusText:t.statusText})}):Promise.resolve(t)},createCacheKey=function(e,t,n,r){var a=new URL(e);return r&&a.pathname.match(r)||(a.search+=(a.search?"&":"")+encodeURIComponent(t)+"="+encodeURIComponent(n)),a.toString()},isPathWhitelisted=function(e,t){if(0===e.length)return!0;var n=new URL(t).pathname;return e.some(function(e){return n.match(e)})},stripIgnoredUrlParameters=function(e,n){var t=new URL(e);return t.hash="",t.search=t.search.slice(1).split("&").map(function(e){return e.split("=")}).filter(function(t){return n.every(function(e){return!e.test(t[0])})}).map(function(e){return e.join("=")}).join("&"),t.toString()},hashParamName="_sw-precache",urlsToCacheKeys=new Map(precacheConfig.map(function(e){var t=e[0],n=e[1],r=new URL(t,self.location),a=createCacheKey(r,hashParamName,n,/\.\w{8}\./);return[r.toString(),a]}));function setOfCachedUrls(e){return e.keys().then(function(e){return e.map(function(e){return e.url})}).then(function(e){return new Set(e)})}self.addEventListener("install",function(e){e.waitUntil(caches.open(cacheName).then(function(r){return setOfCachedUrls(r).then(function(n){return Promise.all(Array.from(urlsToCacheKeys.values()).map(function(t){if(!n.has(t)){var e=new Request(t,{credentials:"same-origin"});return fetch(e).then(function(e){if(!e.ok)throw new Error("Request for "+t+" returned a response with status "+e.status);return cleanResponse(e).then(function(e){return r.put(t,e)})})}}))})}).then(function(){return self.skipWaiting()}))}),self.addEventListener("activate",function(e){var n=new Set(urlsToCacheKeys.values());e.waitUntil(caches.open(cacheName).then(function(t){return t.keys().then(function(e){return Promise.all(e.map(function(e){if(!n.has(e.url))return t.delete(e)}))})}).then(function(){return self.clients.claim()}))}),self.addEventListener("fetch",function(t){if("GET"===t.request.method){var e,n=stripIgnoredUrlParameters(t.request.url,ignoreUrlParametersMatching),r="index.html";(e=urlsToCacheKeys.has(n))||(n=addDirectoryIndex(n,r),e=urlsToCacheKeys.has(n));var a="/index.html";!e&&"navigate"===t.request.mode&&isPathWhitelisted(["^(?!\\/__).*"],t.request.url)&&(n=new URL(a,self.location).toString(),e=urlsToCacheKeys.has(n)),e&&t.respondWith(caches.open(cacheName).then(function(e){return e.match(urlsToCacheKeys.get(n)).then(function(e){if(e)return e;throw Error("The cached response that was expected is missing.")})}).catch(function(e){return console.warn('Couldn\'t serve response for "%s" from cache: %O',t.request.url,e),fetch(t.request)}))}});


--------------------------------------------------------------------------------
/build/static/css/main.2ab780be.css:
--------------------------------------------------------------------------------
1 | body{margin:0;padding:0;font-family:Roboto,sans-serif}.editer{margin:10px}.footer{margin-top:20px;font-size:12px;font-weight:100;color:#c6c6c6;text-align:center}.footer p{margin:0;margin-bottom:6px}
2 | /*# sourceMappingURL=main.2ab780be.css.map*/


--------------------------------------------------------------------------------
/build/static/css/main.2ab780be.css.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["styles/index.css"],"names":[],"mappings":"AAAA,KACE,SACA,UACA,6BAAkC,CAEpC,QACE,WAA4B,CAE9B,QACE,gBACA,eACA,gBACA,cACA,iBAAmB,CAErB,UACE,SACA,iBAAmB","file":"static/css/main.2ab780be.css","sourcesContent":["body {\n  margin: 0;\n  padding: 0;\n  font-family: 'Roboto', sans-serif;\n}\n.editer {\n  margin: 10px 10px 10px 10px;\n}\n.footer {\n  margin-top: 20px;\n  font-size: 12px;\n  font-weight: 100;\n  color: rgb(198, 198, 198);\n  text-align: center;\n}\n.footer p {\n  margin: 0;\n  margin-bottom: 6px;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/styles/index.css"],"sourceRoot":""}


--------------------------------------------------------------------------------
/crypto-bot-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cyphernull/crypto-bot/78f159d40a85174fde37c51f35d50a8c128ac453/crypto-bot-icon.png


--------------------------------------------------------------------------------
/logo-readme.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cyphernull/crypto-bot/78f159d40a85174fde37c51f35d50a8c128ac453/logo-readme.png


--------------------------------------------------------------------------------
/logo.icns:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cyphernull/crypto-bot/78f159d40a85174fde37c51f35d50a8c128ac453/logo.icns


--------------------------------------------------------------------------------
/logoban.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cyphernull/crypto-bot/78f159d40a85174fde37c51f35d50a8c128ac453/logoban.png


--------------------------------------------------------------------------------
/main.js:
--------------------------------------------------------------------------------
 1 | const electron = require('electron')
 2 | const { app, BrowserWindow, Menu } = require('electron')
 3 | const path = require('path')
 4 | const url = require('url')
 5 | let win
 6 | const createWindow = () => {
 7 |   win = new BrowserWindow({ width: 420, height: 720, resizable: false })
 8 |   win.loadURL(
 9 |     url.format({
10 |       pathname: path.join(__dirname, '/build/index.html'),
11 |       protocol: 'file:',
12 |       slashes: true
13 |     })
14 |   )
15 | 
16 |   const template = [
17 |     {
18 |       label: 'Application',
19 |       submenu: [
20 |         { label: 'About Application', selector: 'orderFrontStandardAboutPanel:' },
21 |         { type: 'separator' },
22 |         {
23 |           label: 'Quit',
24 |           accelerator: 'Command+Q',
25 |           click: function() {
26 |             app.quit()
27 |           }
28 |         }
29 |       ]
30 |     },
31 |     {
32 |       label: 'Edit',
33 |       submenu: [
34 |         { label: 'Undo', accelerator: 'CmdOrCtrl+Z', selector: 'undo:' },
35 |         { label: 'Redo', accelerator: 'Shift+CmdOrCtrl+Z', selector: 'redo:' },
36 |         { type: 'separator' },
37 |         { label: 'Cut', accelerator: 'CmdOrCtrl+X', selector: 'cut:' },
38 |         { label: 'Copy', accelerator: 'CmdOrCtrl+C', selector: 'copy:' },
39 |         { label: 'Paste', accelerator: 'CmdOrCtrl+V', selector: 'paste:' },
40 |         { label: 'Select All', accelerator: 'CmdOrCtrl+A', selector: 'selectAll:' }
41 |       ]
42 |     }
43 |   ]
44 | 
45 |   Menu.setApplicationMenu(Menu.buildFromTemplate(template))
46 |   win.on('closed', () => {
47 |     win = null
48 |   })
49 | }
50 | app.on('ready', createWindow)
51 | app.on('window-all-closed', () => {
52 |   if (process.platform !== 'darwin') {
53 |     app.quit()
54 |   }
55 | })
56 | app.on('activate', () => {
57 |   if (win === null) {
58 |     createWindow()
59 |   }
60 | })
61 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "crypto-bot",
 3 |   "version": "0.1.0",
 4 |   "private": true,
 5 |   "main": "main.js",
 6 |   "dependencies": {
 7 |     "crypto-js": "^3.1.9-1",
 8 |     "material-ui": "^0.20.0",
 9 |     "react": "^16.2.0",
10 |     "react-dom": "^16.2.0",
11 |     "react-redux": "^5.0.7",
12 |     "react-scripts": "1.1.1",
13 |     "redux": "^3.7.2"
14 |   },
15 |   "scripts": {
16 |     "start": "react-scripts start",
17 |     "build": "react-scripts build",
18 |     "test": "react-scripts test --env=jsdom",
19 |     "eject": "react-scripts eject"
20 |   },
21 |   "devDependencies": {
22 |     "electron": "^1.8.4"
23 |   }
24 | }
25 | 


--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cyphernull/crypto-bot/78f159d40a85174fde37c51f35d50a8c128ac453/public/favicon.ico


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


--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
 1 | import React, { Component } from 'react'
 2 | import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
 3 | import MainPage from './components/MainPage'
 4 | class App extends Component {
 5 |   render() {
 6 |     return (
 7 |       <MuiThemeProvider>
 8 |         <MainPage />
 9 |       </MuiThemeProvider>
10 |     )
11 |   }
12 | }
13 | export default App
14 | 


--------------------------------------------------------------------------------
/src/actions/methods.js:
--------------------------------------------------------------------------------
1 | export const changeMethod = method => ({
2 |   type: 'CHANGE_METHOD',
3 |   method
4 | })
5 | 


--------------------------------------------------------------------------------
/src/components/Editer.js:
--------------------------------------------------------------------------------
  1 | import React, { Component } from 'react'
  2 | import { connect } from 'react-redux'
  3 | import { changeMethod } from '../actions/methods'
  4 | import { Card, CardActions, CardHeader } from 'material-ui/Card'
  5 | import SelectField from 'material-ui/SelectField'
  6 | import MenuItem from 'material-ui/MenuItem'
  7 | import RaisedButton from 'material-ui/RaisedButton'
  8 | import TextField from 'material-ui/TextField'
  9 | import CryptoJS from 'crypto-js'
 10 | class Editer extends Component {
 11 |   constructor(props) {
 12 |     super(props)
 13 |     this.state = {
 14 |       plainText: '',
 15 |       cipherText: '',
 16 |       bitsValue: 384,
 17 |       passphrase: '',
 18 |       keySize: 512,
 19 |       salt: '',
 20 |       literation: 1000,
 21 |       subtitle: 'MD5'
 22 |     }
 23 |   }
 24 |   componentDidMount() {
 25 |     if (localStorage.getItem('method') !== null) {
 26 |       this.props.dispatch(changeMethod(localStorage.getItem('method')))
 27 |     }
 28 |   }
 29 |   componentWillReceiveProps(nextProps) {
 30 |     this.setState({
 31 |       subtitle: this.getSubtitle(nextProps.method)
 32 |     })
 33 |   }
 34 |   handlePlainChange = e => {
 35 |     const plainText = e.target.value
 36 |     this.setState({
 37 |       plainText
 38 |     })
 39 |   }
 40 |   handleCipherChange = e => {
 41 |     const cipherText = e.target.value
 42 |     this.setState({
 43 |       cipherText
 44 |     })
 45 |   }
 46 |   handlePassphraseChange = e => {
 47 |     const passphrase = e.target.value
 48 |     this.setState({
 49 |       passphrase
 50 |     })
 51 |   }
 52 |   handleSaltChange = e => {
 53 |     const salt = e.target.value
 54 |     this.setState({
 55 |       salt
 56 |     })
 57 |   }
 58 |   handleLiterationChange = e => {
 59 |     const literation = e.target.value
 60 |     this.setState({
 61 |       literation
 62 |     })
 63 |   }
 64 |   handleEncrypt = () => {
 65 |     if (this.props.method === 'SHA3') {
 66 |       const output = {
 67 |         outputLength: this.state.bitsValue
 68 |       }
 69 |       const cipherText = CryptoJS.SHA3(this.state.plainText, output).toString()
 70 |       this.setState({
 71 |         cipherText
 72 |       })
 73 |     } else if (this.props.method.indexOf('Hmac') > -1) {
 74 |       const cipherText = CryptoJS[this.props.method](this.state.plainText, this.state.passphrase).toString()
 75 |       this.setState({
 76 |         cipherText
 77 |       })
 78 |     } else if (this.props.method.indexOf('EvpKDF') > -1 || this.props.method.indexOf('PBKDF2') > -1) {
 79 |       const cfg = {
 80 |         keySize: this.state.keySize / 32,
 81 |         iterations: this.state.literation
 82 |       }
 83 |       const cipherText = CryptoJS[this.props.method](this.state.plainText, this.state.salt, cfg).toString()
 84 |       this.setState({
 85 |         cipherText
 86 |       })
 87 |     } else if (
 88 |       this.props.method.indexOf('AES') > -1 ||
 89 |       this.props.method.indexOf('DES') > -1 ||
 90 |       this.props.method.indexOf('RC4') > -1 ||
 91 |       this.props.method.indexOf('Rabbit') > -1
 92 |     ) {
 93 |       const key = this.state.passphrase
 94 |       const cipherText = CryptoJS[this.props.method]
 95 |         .encrypt(this.state.plainText, key, {
 96 |           mode: CryptoJS.mode.ECB,
 97 |           padding: CryptoJS.pad.Pkcs7
 98 |         })
 99 |         .toString()
100 |       this.setState({
101 |         cipherText
102 |       })
103 |     } else {
104 |       const cipherText = CryptoJS[this.props.method](this.state.plainText).toString()
105 |       this.setState({
106 |         cipherText
107 |       })
108 |     }
109 |   }
110 |   getSubtitle = method => {
111 |     if (method.indexOf('Hmac') > -1) {
112 |       return 'Hash-based Message Authentication Code'
113 |     }
114 |     switch (method) {
115 |       case 'MD5':
116 |         return 'Message Digest Algorithm 5'
117 |       case 'SHA1':
118 |         return 'Secure Hash Algorithm 1'
119 |       case 'SHA3':
120 |         return 'Secure Hash Algorithm ( Keccak[c=2d] )'
121 |       case 'SHA224':
122 |         return 'Secure Hash Algorithm 224'
123 |       case 'SHA256':
124 |         return 'Secure Hash Algorithm 256'
125 |       case 'SHA384':
126 |         return 'Secure Hash Algorithm 384'
127 |       case 'SHA512':
128 |         return 'Secure Hash Algorithm 512'
129 |       default:
130 |         return 'Encrytion'
131 |     }
132 |   }
133 |   handleBitsChange = (e, k, p) => {
134 |     this.setState({
135 |       bitsValue: p
136 |     })
137 |   }
138 |   handlekeySizeChange = (e, k, p) => {
139 |     this.setState({
140 |       keySize: p
141 |     })
142 |   }
143 |   determineDecryptable = () => {
144 |     if (
145 |       this.props.method.indexOf('AES') > -1 ||
146 |       this.props.method.indexOf('DES') > -1 ||
147 |       this.props.method.indexOf('RC4') > -1 ||
148 |       this.props.method.indexOf('Rabbit') > -1
149 |     ) {
150 |       return false
151 |     } else {
152 |       return true
153 |     }
154 |   }
155 |   handleDecrypt = () => {
156 |     const cipher = this.state.cipherText
157 |     const key = this.state.passphrase
158 |     const plainText = CryptoJS[this.props.method]
159 |       .decrypt(cipher, key, {
160 |         mode: CryptoJS.mode.ECB,
161 |         padding: CryptoJS.pad.Pkcs7
162 |       })
163 |       .toString(CryptoJS.enc.Utf8)
164 |     this.setState({
165 |       plainText
166 |     })
167 |   }
168 |   render() {
169 |     return (
170 |       <div className="editer">
171 |         <Card>
172 |           <CardHeader title={this.props.method} subtitle={this.state.subtitle} />
173 |           <CardActions>
174 |             <TextField
175 |               fullWidth={true}
176 |               className="text-input"
177 |               hintText="输入"
178 |               floatingLabelText="明文"
179 |               onChange={this.handlePlainChange}
180 |               value={this.state.plainText}
181 |             />
182 |             {this.props.method === 'SHA3' ? (
183 |               <SelectField value={this.state.bitsValue} onChange={this.handleBitsChange} floatingLabelText="bits">
184 |                 <MenuItem value={512} primaryText="512" />
185 |                 <MenuItem value={384} primaryText="384" />
186 |                 <MenuItem value={256} primaryText="256" />
187 |                 <MenuItem value={224} primaryText="224" />
188 |               </SelectField>
189 |             ) : null}
190 |             {this.props.method.indexOf('Hmac') > -1 ||
191 |             this.props.method.indexOf('AES') > -1 ||
192 |             this.props.method.indexOf('DES') > -1 ||
193 |             this.props.method.indexOf('RC4') > -1 ||
194 |             this.props.method.indexOf('Rabbit') > -1 ? (
195 |               <TextField
196 |                 fullWidth={true}
197 |                 className="text-input"
198 |                 hintText="输入"
199 |                 floatingLabelText="密钥"
200 |                 onChange={this.handlePassphraseChange}
201 |                 value={this.state.passphrase}
202 |               />
203 |             ) : null}
204 |             {this.props.method.indexOf('EvpKDF') > -1 || this.props.method.indexOf('PBKDF2') > -1 ? (
205 |               <div>
206 |                 <TextField
207 |                   fullWidth={true}
208 |                   className="text-input"
209 |                   hintText="输入"
210 |                   floatingLabelText="盐"
211 |                   onChange={this.handleSaltChange}
212 |                   value={this.state.salt}
213 |                 />
214 |                 <SelectField value={this.state.keySize} onChange={this.handlekeySizeChange} floatingLabelText="bits">
215 |                   <MenuItem value={512} primaryText="512" />
216 |                   <MenuItem value={256} primaryText="256" />
217 |                   <MenuItem value={128} primaryText="128" />
218 |                 </SelectField>
219 |                 <TextField
220 |                   fullWidth={true}
221 |                   className="text-input"
222 |                   hintText="1000"
223 |                   floatingLabelText="迭代"
224 |                   onChange={this.handleLiterationChange}
225 |                   value={this.state.literation}
226 |                   type="number"
227 |                 />
228 |               </div>
229 |             ) : null}
230 |             <TextField
231 |               fullWidth={true}
232 |               className="text-input text-input-down"
233 |               hintText="输入"
234 |               floatingLabelText="密文"
235 |               onChange={this.handleCipherChange}
236 |               value={this.state.cipherText}
237 |               multiLine={true}
238 |             />
239 |           </CardActions>
240 |           <CardActions className="editer-buttons">
241 |             <RaisedButton label="加 密" primary={true} onClick={this.handleEncrypt} />
242 |             <RaisedButton
243 |               label="解 密"
244 |               secondary={true}
245 |               onClick={this.handleDecrypt}
246 |               disabled={this.determineDecryptable()}
247 |             />
248 |           </CardActions>
249 |         </Card>
250 |       </div>
251 |     )
252 |   }
253 | }
254 | const mapSateToProps = (state, props) => {
255 |   return {
256 |     method: state.method
257 |   }
258 | }
259 | export default connect(mapSateToProps)(Editer)
260 | 


--------------------------------------------------------------------------------
/src/components/MainPage.js:
--------------------------------------------------------------------------------
 1 | import React, { Component } from 'react'
 2 | import TopBar from './TopBar'
 3 | import Editer from './Editer'
 4 | class MainPage extends Component {
 5 |   render() {
 6 |     return (
 7 |       <div>
 8 |         <TopBar />
 9 |         <Editer />
10 |         <div className="footer">
11 |           <p>Inspired by crypto-js</p>
12 |           <p>Created by Eric</p>
13 |         </div>
14 |       </div>
15 |     )
16 |   }
17 | }
18 | export default MainPage
19 | 


--------------------------------------------------------------------------------
/src/components/TopBar.js:
--------------------------------------------------------------------------------
  1 | import React, { Component } from 'react'
  2 | import { changeMethod } from '../actions/methods'
  3 | import { connect } from 'react-redux'
  4 | import AppBar from 'material-ui/AppBar'
  5 | import Drawer from 'material-ui/Drawer'
  6 | import Menu from 'material-ui/Menu'
  7 | import MenuItem from 'material-ui/MenuItem'
  8 | class TopBar extends Component {
  9 |   constructor(props) {
 10 |     super(props)
 11 |     this.state = {
 12 |       open: false
 13 |     }
 14 |   }
 15 |   handleClickLeft = () => {
 16 |     this.setState({
 17 |       open: true
 18 |     })
 19 |   }
 20 |   handleClose = () => {
 21 |     this.setState({
 22 |       open: false
 23 |     })
 24 |   }
 25 |   handleClickItem = (e, m) => {
 26 |     const cryptoMethod = m.props.children
 27 |     this.props.dispatch(changeMethod(cryptoMethod))
 28 |     localStorage.setItem('method', cryptoMethod)
 29 |   }
 30 |   render() {
 31 |     return (
 32 |       <div>
 33 |         <Drawer docked={false} width={240} open={this.state.open} onRequestChange={open => this.setState({ open })}>
 34 |           <Menu onItemClick={this.handleClickItem}>
 35 |             <MenuItem disabled={true}>
 36 |               <a style={{ fontWeight: 'bold' }}>选择加密方式</a>
 37 |             </MenuItem>
 38 |             <MenuItem onClick={this.handleClose} checked={'MD5' === this.props.method}>
 39 |               MD5
 40 |             </MenuItem>
 41 | 
 42 |             <MenuItem onClick={this.handleClose} checked={'RIPEMD160' === this.props.method}>
 43 |               RIPEMD160
 44 |             </MenuItem>
 45 |             <MenuItem onClick={this.handleClose} checked={'SHA1' === this.props.method}>
 46 |               SHA1
 47 |             </MenuItem>
 48 |             <MenuItem onClick={this.handleClose} checked={'SHA3' === this.props.method}>
 49 |               SHA3
 50 |             </MenuItem>
 51 |             <MenuItem onClick={this.handleClose} checked={'SHA224' === this.props.method}>
 52 |               SHA224
 53 |             </MenuItem>
 54 |             <MenuItem onClick={this.handleClose} checked={'SHA256' === this.props.method}>
 55 |               SHA256
 56 |             </MenuItem>
 57 |             <MenuItem onClick={this.handleClose} checked={'SHA384' === this.props.method}>
 58 |               SHA384
 59 |             </MenuItem>
 60 |             <MenuItem onClick={this.handleClose} checked={'SHA512' === this.props.method}>
 61 |               SHA512
 62 |             </MenuItem>
 63 |             <MenuItem onClick={this.handleClose} checked={'HmacMD5' === this.props.method}>
 64 |               HmacMD5
 65 |             </MenuItem>
 66 |             <MenuItem onClick={this.handleClose} checked={'HmacRIPEMD160' === this.props.method}>
 67 |               HmacRIPEMD160
 68 |             </MenuItem>
 69 |             <MenuItem onClick={this.handleClose} checked={'HmacSHA1' === this.props.method}>
 70 |               HmacSHA1
 71 |             </MenuItem>
 72 |             <MenuItem onClick={this.handleClose} checked={'HmacSHA3' === this.props.method}>
 73 |               HmacSHA3
 74 |             </MenuItem>
 75 |             <MenuItem onClick={this.handleClose} checked={'HmacSHA224' === this.props.method}>
 76 |               HmacSHA224
 77 |             </MenuItem>
 78 |             <MenuItem onClick={this.handleClose} checked={'HmacSHA256' === this.props.method}>
 79 |               HmacSHA256
 80 |             </MenuItem>
 81 |             <MenuItem onClick={this.handleClose} checked={'HmacSHA384' === this.props.method}>
 82 |               HmacSHA384
 83 |             </MenuItem>
 84 |             <MenuItem onClick={this.handleClose} checked={'HmacSHA512' === this.props.method}>
 85 |               HmacSHA512
 86 |             </MenuItem>
 87 |             <MenuItem onClick={this.handleClose} checked={'EvpKDF' === this.props.method}>
 88 |               EvpKDF
 89 |             </MenuItem>
 90 |             <MenuItem onClick={this.handleClose} checked={'PBKDF2' === this.props.method}>
 91 |               PBKDF2
 92 |             </MenuItem>
 93 |             <MenuItem onClick={this.handleClose} checked={'AES' === this.props.method}>
 94 |               AES
 95 |             </MenuItem>
 96 |             <MenuItem onClick={this.handleClose} checked={'DES' === this.props.method}>
 97 |               DES
 98 |             </MenuItem>
 99 |             <MenuItem onClick={this.handleClose} checked={'RC4' === this.props.method}>
100 |               RC4
101 |             </MenuItem>
102 |             <MenuItem onClick={this.handleClose} checked={'Rabbit' === this.props.method}>
103 |               Rabbit
104 |             </MenuItem>
105 |           </Menu>
106 |         </Drawer>
107 |         <AppBar
108 |           title="Crypto-Bot"
109 |           onLeftIconButtonClick={this.handleClickLeft}
110 |           showMenuIconButton={true}
111 |           className="topbar"
112 |         />
113 |       </div>
114 |     )
115 |   }
116 | }
117 | const mapSateToProps = (state, props) => {
118 |   return {
119 |     method: state.method
120 |   }
121 | }
122 | export default connect(mapSateToProps)(TopBar)
123 | 


--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | import ReactDOM from 'react-dom'
 3 | import App from './App'
 4 | import { Provider } from 'react-redux'
 5 | import configureStore from './store/configureStore'
 6 | import './styles/index.css'
 7 | const store = configureStore()
 8 | const crypto_bot = (
 9 |   <Provider store={store}>
10 |     <App />
11 |   </Provider>
12 | )
13 | ReactDOM.render(crypto_bot, document.getElementById('root'))
14 | 


--------------------------------------------------------------------------------
/src/reducers/methods.js:
--------------------------------------------------------------------------------
 1 | let methodsReducerDefaultState = 'MD5'
 2 | const methodsReducer = (state = methodsReducerDefaultState, action) => {
 3 |   switch (action.type) {
 4 |     case 'CHANGE_METHOD': {
 5 |       state = action.method
 6 |       return state
 7 |     }
 8 |     default: {
 9 |       return state
10 |     }
11 |   }
12 | }
13 | export default methodsReducer
14 | 


--------------------------------------------------------------------------------
/src/store/configureStore.js:
--------------------------------------------------------------------------------
 1 | import { createStore, combineReducers } from 'redux'
 2 | import methodsReducer from '../reducers/methods'
 3 | export default () => {
 4 |   const store = createStore(
 5 |     combineReducers({
 6 |       method: methodsReducer
 7 |     }),
 8 |     /* istanbul ignore next */
 9 |     window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
10 |   )
11 |   return store
12 | }
13 | 


--------------------------------------------------------------------------------
/src/styles/index.css:
--------------------------------------------------------------------------------
 1 | body {
 2 |   margin: 0;
 3 |   padding: 0;
 4 |   font-family: 'Roboto', sans-serif;
 5 | }
 6 | .editer {
 7 |   margin: 10px 10px 10px 10px;
 8 | }
 9 | .footer {
10 |   margin-top: 20px;
11 |   font-size: 12px;
12 |   font-weight: 100;
13 |   color: rgb(198, 198, 198);
14 |   text-align: center;
15 | }
16 | .footer p {
17 |   margin: 0;
18 |   margin-bottom: 6px;
19 | }
20 | 


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