Now output filename depends on input filename

Author: sanex3339

App/actions/index.js

@@ -7,6 +7,11 @@ export const updateCode = (code) => ({
     code
 });
 
+export const updateOutputFileName = (outputFileName) => ({
+    'type': types.UPDATE_OUTPUT_FILE_NAME,
+    outputFileName
+});
+
 export const obfuscateCode = (code, options) => {
     return (dispatch) => {
         if (!options.sourceMap) {

App/constants/ActionTypes.js

@@ -1,4 +1,5 @@
 export const UPDATE_CODE = 'UPDATE_CODE';
+export const UPDATE_OUTPUT_FILE_NAME = 'UPDATE_OUTPUT_FILE_NAME';
 
 export const OBFUSCATE = 'OBFUSCATE';
 export const OBFUSCATE_PENDING = 'OBFUSCATE_PENDING';

App/containers/App.js

@@ -16,6 +16,7 @@ class App extends Component {
         dispatch: PropTypes.func,
         code: PropTypes.string,
         obfuscatedCode: PropTypes.string,
+        outputFileName: PropTypes.string,
         sourceMap: PropTypes.string,
         obfuscating: PropTypes.bool,
         obfuscated: PropTypes.bool,
@@ -33,7 +34,7 @@ class App extends Component {
     downloadCode() {
         const data = {
             mime: 'application/javascript',
-            filename: 'obfuscated.js',
+            filename: this.props.outputFileName,
             contents: this.props.obfuscatedCode,
         };
 
@@ -43,7 +44,7 @@ class App extends Component {
     downloadSourceMap() {
         const data = {
             mime: 'application/octet-stream',
-            filename: 'obfuscated.js.map',
+            filename: `${this.props.outputFileName}.map`,
             contents: this.props.sourceMap,
         };
 
@@ -74,6 +75,7 @@ class App extends Component {
                     pending={obfuscating}
                     hasResults={obfuscated || error}
                     onCodeChange={(code) => dispatch(actions.updateCode(code))}
+                    onOutputFileNameChange={(fileName) => dispatch(actions.updateOutputFileName(fileName))}
                     onObfuscateClick={::this.obfuscate}
                     onDownloadCodeClick={::this.downloadCode}
                     onDownloadSourceMapClick={::this.downloadSourceMap}
@@ -98,6 +100,7 @@ const mapStateToProps = (state) => {
     return {
         code: code.code,
         obfuscatedCode: code.obfuscatedCode,
+        outputFileName: code.outputFileName,
         sourceMap: code.sourceMap,
         obfuscating: code.obfuscating,
         obfuscated: code.obfuscated,

App/containers/CodeContainer.js

@@ -8,6 +8,7 @@ import {Form, Grid, Segment, Button, Icon, Tab} from 'semantic-ui-react';
 import Dropzone from 'react-dropzone';
 
 import EditorContainer from '../containers/EditorContainer';
+import {DEFAULT_OUTPUT_FILE_NAME} from '../reducers/code';
 
 const TAB_CODE = 0;
 const TAB_RESULTS = 2;
@@ -20,6 +21,7 @@ class CodeContainer extends Component {
         pending: PropTypes.bool,
         hasResults: PropTypes.bool,
         onCodeChange: PropTypes.func,
+        onOutputFileNameChange: PropTypes.func,
         onObfuscateClick: PropTypes.func,
         onDownloadCodeClick: PropTypes.func,
         onDownloadSourceMapClick: PropTypes.func,
@@ -57,8 +59,18 @@ class CodeContainer extends Component {
         });
     }
 
+    onCodeChange(code) {
+        const {code: prevCode, onCodeChange, onOutputFileNameChange} = this.props;
+
+        onCodeChange(code);
+
+        if (code !== prevCode) {
+            onOutputFileNameChange(DEFAULT_OUTPUT_FILE_NAME);
+        }
+    }
+
     onDrop(files) {
-        const {onCodeChange} = this.props;
+        const {onCodeChange, onOutputFileNameChange} = this.props;
 
         if (!window.File || !window.FileReader) {
             alert('Your browser does not support File API');
@@ -69,6 +81,7 @@ class CodeContainer extends Component {
 
         reader.onload = (event) => {
             onCodeChange(event.target.result);
+            onOutputFileNameChange(file.name);
             this.onTabClick(TAB_CODE);
         };
 
@@ -146,7 +159,6 @@ class CodeContainer extends Component {
             code,
             obfuscatedCode,
             pending,
-            onCodeChange,
             onObfuscateClick,
             onDownloadCodeClick,
             onDownloadSourceMapClick,
@@ -159,7 +171,7 @@ class CodeContainer extends Component {
                 menuItem: 'Copy & Paste JavaScript Code',
                 render: () => (
                     <Pane>
-                        <EditorContainer onBlur={onCodeChange} value={code}/>
+                        <EditorContainer onBlur={::this.onCodeChange} value={code}/>
                         <Segment basic>
                             <Button
                                 loading={pending}
@@ -177,7 +189,11 @@ class CodeContainer extends Component {
                 menuItem: 'Upload JavaScript File',
                 render: () => (
                     <Pane>
-                        <Dropzone onDrop={::this.onDrop} multiple={false} className="DropZone">
+                        <Dropzone
+                            onDrop={::this.onDrop}
+                            multiple={false}
+                            className="DropZone"
+                        >
                             <div>Try dropping some file here, or click to select file to upload.</div>
                         </Dropzone>
                     </Pane>

App/reducers/code.js

@@ -9,14 +9,16 @@ const DEFAULT_CODE = [
     'hi();',
 ].join('\n');
 
+export const DEFAULT_OUTPUT_FILE_NAME = 'obfuscated.js';
 
 const initialState = {
     code: DEFAULT_CODE,
+    outputFileName: DEFAULT_OUTPUT_FILE_NAME,
     obfuscatedCode: '',
     sourceMap: '',
     obfuscating: false,
     obfuscated: false,
-    error: false,
+    error: false
 };
 
 
@@ -63,6 +65,12 @@ export const code = (state = initialState, action) => {
                 sourceMap: action.payload.sourceMap,
             };
 
+        case types.UPDATE_OUTPUT_FILE_NAME:
+            return {
+                ...state,
+                outputFileName: action.outputFileName
+            };
+
         default:
             return state
     }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "javascript-obfuscator-web",
-  "version": "3.5.0",
+  "version": "3.6.0",
   "description": "",
   "engines": {
     "node": ">=12.13.1"