Updated to use the javascript-obfuscator@0.13.0 which includes the new 'identifierNamesGenerator' option.

Author: slig

App/actions/index.js

@@ -97,3 +97,8 @@ export const setTarget = (target) => ({
   'type': types.SET_TARGET,
   target
 });
+
+export const setIdentifierNamesGenerator = (identifierNamesGenerator) => ({
+  'type': types.SET_IDENTIFIER_NAMES_GENERATOR,
+  identifierNamesGenerator
+});

App/constants/ActionTypes.js

@@ -36,10 +36,10 @@ export const TOGGLE_CONTROL_FLOW_FLATTENING = 'TOGGLE_CONTROL_FLOW_FLATTENING'
 export const SET_DEAD_CODE_INJECTION_THRESHOLD = 'SET_DEAD_CODE_INJECTION_THRESHOLD'
 export const TOGGLE_DEAD_CODE_INJECTION = 'TOGGLE_DEAD_CODE_INJECTION'
 
-export const TOGGLE_MANGLE = 'TOGGLE_MANGLE'
-
 export const TOGGLE_UNICODE_ESCAPE_SEQUENCE = 'TOGGLE_UNICODE_ESCAPE_SEQUENCE'
 
 export const TOGGLE_RENAME_GLOBALS = 'TOGGLE_RENAME_GLOBALS'
 
 export const SET_TARGET = 'SET_TARGET'
+
+export const SET_IDENTIFIER_NAMES_GENERATOR = 'SET_IDENTIFER_NAMES_GENERATOR'

App/containers/OptionsContainer.js

@@ -36,6 +36,15 @@ const TARGET_OPTIONS = [
   { text: 'Node', value: TARGET_NODE },
 ];
 
+export const IDENTIFIER_NAMES_GENERATOR_HEXADECIMAL = 'hexadecimal'
+export const IDENTIFIER_NAMES_GENERATOR_MANGLED = 'mangled'
+
+const IDENTIFIER_NAMES_GENERATOR_OPTIONS = [
+  { text: 'hexadecimal', value: IDENTIFIER_NAMES_GENERATOR_HEXADECIMAL },
+  { text: 'mangled', value: IDENTIFIER_NAMES_GENERATOR_MANGLED },
+];
+
+
 const Options = ({dispatch, options}) =>
   <Form className="OptionsForm">
     <Grid columns={4} relaxed>
@@ -47,11 +56,6 @@ const Options = ({dispatch, options}) =>
             checked={options.compact}
             onChange={() => dispatch(actions.toggleOption(types.TOGGLE_COMPACT_CODE)) } />
 
-          <Form.Checkbox
-            label='Mangle Variable Names'
-            checked={options.mangle}
-            onChange={() => dispatch(actions.toggleOption(types.TOGGLE_MANGLE)) } />
-
           <Form.Checkbox
             label='Rename Globals'
             checked={options.renameGlobals}
@@ -140,6 +144,14 @@ const Options = ({dispatch, options}) =>
             checked={options.unicodeEscapeSequence}
             onChange={() => dispatch(actions.toggleOption(types.TOGGLE_UNICODE_ESCAPE_SEQUENCE)) } />
 
+          <Divider />
+
+          <Form.Select
+            label='Identifier Names Generator'
+            value={options.identifierNamesGenerator}
+            onChange={(event, {value}) => dispatch(actions.setIdentifierNamesGenerator(value)) }
+            options={IDENTIFIER_NAMES_GENERATOR_OPTIONS} />
+
         </Segment>
       </Grid.Column>
 

App/reducers/options.js

@@ -38,14 +38,14 @@ const initialState = {
   deadCodeInjectionThreshold: 0.4,
   deadCodeInjection: false,
 
-  mangle: false,
-
   unicodeEscapeSequence: false,
 
   renameGlobals: false,
 
   target: 'browser',
 
+  identifierNamesGenerator: 'hexadecimal',
+
 }
 
 export const options = (state = initialState, action) => {
@@ -223,12 +223,6 @@ export const options = (state = initialState, action) => {
       }
     }
 
-    case types.TOGGLE_MANGLE:
-      return {
-        ...state,
-        mangle: !state.mangle
-      }
-
     case types.TOGGLE_UNICODE_ESCAPE_SEQUENCE:
       return {
         ...state,
@@ -247,6 +241,12 @@ export const options = (state = initialState, action) => {
         target: action.target
       }
 
+    case types.SET_IDENTIFIER_NAMES_GENERATOR:
+      return {
+        ...state,
+        identifierNamesGenerator: action.identifierNamesGenerator
+      }
+
     default:
       return state
   }

package.json

@@ -30,7 +30,7 @@
     "extract-text-webpack-plugin": "^2.0.0-beta",
     "graceful-fs": "^4.1.9",
     "inert": "^4.0.2",
-    "javascript-obfuscator": "^0.12.5",
+    "javascript-obfuscator": "^0.13.0",
     "less": "^2.7.1",
     "less-loader": "^2.2.3",
     "react": "^15.3.1",

templates/index.html

@@ -27,7 +27,7 @@
         <div class="column">
           <div class="ui basic segment">
             <h1>JavaScript Obfuscator Tool</h1>
-            <p>A free and efficient obfuscator for JavaScript (including ES6). Make your code harder to copy and prevent people from stealing your work. This tool is a Web UI to the excellent (and open source) <code><a href="https://github.com/javascript-obfuscator/javascript-obfuscator" target="_new">JavaScript Obfuscator</a>@0.12.5</code> created by Timofey Kachalov.</p>
+            <p>A free and efficient obfuscator for JavaScript (including ES6). Make your code harder to copy and prevent people from stealing your work. This tool is a Web UI to the excellent (and open source) <code><a href="https://github.com/javascript-obfuscator/javascript-obfuscator" target="_new">JavaScript Obfuscator</a>@0.13.0</code> created by Timofey Kachalov.</p>
           </div>
         </div>
       </div>
@@ -80,13 +80,6 @@ <h3>Sounds great!</h3>
                 </td>
               </tr>
 
-              <tr>
-                <td class="collapsing">Mangle Variable Names</td>
-                <td>
-                  Mangles the variable names. (For instance, instead of having this random pattern <code>0x123456</code>, they become <code>a</code>, <code>b</code>, and so on.)
-                </td>
-              </tr>
-
               <tr>
                 <td class="collapsing">Rename Globals</td>
                 <td>
@@ -217,6 +210,21 @@ <h3>Sounds great!</h3>
                 </td>
               </tr>
 
+              <tr>
+                <td class="collapsing">Identifier Names Generator</td>
+                <td>
+                  <p>Use this option to control how identifiers (variable names, functions names, etc) will be obfuscated.</p>
+
+                  <strong>hexadecimal</strong>
+                  <p>Generates random identifier names using a hexadecimal pattern (e.g: <code>0xabc123</code>)</p>
+
+                  <strong>mangled</strong>
+                  <p>Uses short identifier names (e.g: <code>a</code>, <code>b</code>, <code>c</code>, etc.)</p>
+
+                </td>
+              </tr>
+
+
               <tr>
                 <td class="collapsing">Disable Console Output</td>
                 <td>