diff --git a/awx/ui/client/lib/angular-codemirror/.bower.json b/awx/ui/client/lib/angular-codemirror/.bower.json
index 194a61b513..c88cb405db 100644
--- a/awx/ui/client/lib/angular-codemirror/.bower.json
+++ b/awx/ui/client/lib/angular-codemirror/.bower.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-codemirror",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "dependencies": {
     "angular": "latest",
     "angular-route": "latest",
@@ -13,14 +13,13 @@
     "codemirror": "latest"
   },
   "homepage": "https://github.com/chouseknecht/angular-codemirror",
-  "_release": "1.0.2",
+  "_release": "1.0.3",
   "_resolution": {
     "type": "version",
-    "tag": "v1.0.2",
-    "commit": "94b7aac548b036f4fbd94e56129ed9574e472616"
+    "tag": "1.0.3",
+    "commit": "b94dc86fde8f60a50b324054806d29d742177d21"
   },
-  "_source": "git://github.com/chouseknecht/angular-codemirror.git",
-  "_target": "~1.0.2",
-  "_originalSource": "angular-codemirror",
-  "_direct": true
+  "_source": "https://github.com/chouseknecht/angular-codemirror.git",
+  "_target": "~1.0.3",
+  "_originalSource": "angular-codemirror"
 }
\ No newline at end of file
diff --git a/awx/ui/client/lib/angular-codemirror/bower.json b/awx/ui/client/lib/angular-codemirror/bower.json
index 943b83b3e7..df7644686c 100644
--- a/awx/ui/client/lib/angular-codemirror/bower.json
+++ b/awx/ui/client/lib/angular-codemirror/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-codemirror",
-  "version": "0.0.3",
+  "version": "1.0.2",
   "dependencies": {
     "angular": "latest", 
     "angular-route": "latest",
diff --git a/awx/ui/client/lib/angular-codemirror/lib/AngularCodeMirror.css b/awx/ui/client/lib/angular-codemirror/lib/AngularCodeMirror.css
index a81ff6dff4..f233cc2941 100644
--- a/awx/ui/client/lib/angular-codemirror/lib/AngularCodeMirror.css
+++ b/awx/ui/client/lib/angular-codemirror/lib/AngularCodeMirror.css
@@ -1,6 +1,6 @@
 /**********************************************
  * AngularCodeMirror.css
- *
+ * 
  * CodeMirror.css overrides
  *
  * Copyright (c) 2014 Chris Houseknecht
@@ -30,14 +30,14 @@
   .CodeMirror {
       height: auto;
   }
-
+  
   .CodeMirror-activeline-background {
       background-color: #f7f7f7;
   }
+  
 
 
-
-/* Modal dialog overrides to make jqueryui dialog blend in with Twitter.
+/* Modal dialog overrides to make jqueryui dialog blend in with Twitter. 
    Why? Twitter's modal is not draggable or resizable, which is not very
    useful for a code editor */
 
@@ -71,7 +71,7 @@
       border-color: #ffffff;
       color: #A9A9A9;
   }
-
+  
   .ui-dialog .ui-resizable-se {
       right: 5px;
       bottom: 5px;
@@ -108,3 +108,4 @@
   .CodeMirror-lint-tooltip {
       z-index: 2060;
   }
+
diff --git a/awx/ui/client/lib/angular-codemirror/lib/AngularCodeMirror.js b/awx/ui/client/lib/angular-codemirror/lib/AngularCodeMirror.js
index e4b9e5e02e..2ef0ad4fe7 100644
--- a/awx/ui/client/lib/angular-codemirror/lib/AngularCodeMirror.js
+++ b/awx/ui/client/lib/angular-codemirror/lib/AngularCodeMirror.js
@@ -30,7 +30,7 @@
 angular.module('AngularCodeMirrorModule', [])
 
     .factory('AngularCodeMirror', [ function() {
-        return function() {
+        return function(readOnly) {
             var fn = function() {
 
                 this.myCodeMirror = null;
@@ -43,7 +43,6 @@ angular.module('AngularCodeMirrorModule', [])
                         model = params.model,
                         mode = params.mode,
                         onReady = params.onReady,
-                        onChange = params.onChange,
                         height = 0;
 
                     self.element = $(element);
@@ -69,6 +68,15 @@ angular.module('AngularCodeMirrorModule', [])
 
                     // Initialize CodeMirror
                     self.modes[mode].value = scope[model];
+                    
+                    // if readOnly is passed to AngularCodeMirror, set the
+                    // options for all modes to be readOnly
+                    if (readOnly) {
+                        Object.keys(self.modes).forEach(function(val) {
+                            self.modes[val].readOnly = true;
+                        });
+                    }
+                    
                     self.myCodeMirror = CodeMirror(document.getElementById('cm-' + model + '-container'), self.modes[mode]);
 
                     // Adjust the height
@@ -85,14 +93,7 @@ angular.module('AngularCodeMirrorModule', [])
 
                     // Update the model on change
                     self.myCodeMirror.on('change', function() {
-                        setTimeout(function() {
-                            scope.$apply(function(){
-                                scope[model] = self.myCodeMirror.getValue();
-                                if (onChange) {
-                                    onChange();
-                                }
-                            });
-                        }, 500);
+                        setTimeout(function() { scope.$apply(function(){ scope[model] = self.myCodeMirror.getValue(); }); }, 500);
                     });
                 };
                
diff --git a/awx/ui/client/lib/ngToast/.bower.json b/awx/ui/client/lib/ngToast/.bower.json
index 446800a71d..27c51cca55 100644
--- a/awx/ui/client/lib/ngToast/.bower.json
+++ b/awx/ui/client/lib/ngToast/.bower.json
@@ -52,8 +52,7 @@
     "tag": "2.0.0",
     "commit": "8a1951c54a956c33964c99b338f3a4830e652689"
   },
-  "_source": "git://github.com/tameraydin/ngToast.git",
+  "_source": "https://github.com/tameraydin/ngToast.git",
   "_target": "~2.0.0",
-  "_originalSource": "ngtoast",
-  "_direct": true
+  "_originalSource": "ngtoast"
 }
\ No newline at end of file
diff --git a/awx/ui/client/src/helpers/Parse.js b/awx/ui/client/src/helpers/Parse.js
index c484963162..a81f8c8194 100644
--- a/awx/ui/client/src/helpers/Parse.js
+++ b/awx/ui/client/src/helpers/Parse.js
@@ -25,7 +25,8 @@ export default
                     fld = (params.variable) ? params.variable : 'variables',
                     pfld = (params.parse_variable) ? params.parse_variable : 'parseType',
                     onReady = params.onReady,
-                    onChange = params.onChange;
+                    onChange = params.onChange,
+                    readOnly = params.readOnly;
 
                 function removeField(fld) {
                     //set our model to the last change in CodeMirror and then destroy CodeMirror
@@ -35,8 +36,7 @@ export default
 
                 function createField(onChange, onReady, fld) {
                     //hide the textarea and show a fresh CodeMirror with the current mode (json or yaml)
-
-                    scope[fld + 'codeMirror'] = AngularCodeMirror();
+                    scope[fld + 'codeMirror'] = AngularCodeMirror(readOnly);
                     scope[fld + 'codeMirror'].addModes($AnsibleConfig.variable_edit_modes);
                     scope[fld + 'codeMirror'].showTextArea({
                         scope: scope,
diff --git a/awx/ui/client/src/job-detail/job-detail.controller.js b/awx/ui/client/src/job-detail/job-detail.controller.js
index 02cb21a5f1..9181b21b20 100644
--- a/awx/ui/client/src/job-detail/job-detail.controller.js
+++ b/awx/ui/client/src/job-detail/job-detail.controller.js
@@ -641,7 +641,7 @@ export default
                                return true;
                            });
                         //scope.setSearchAll('host');
-                        ParseTypeChange({ scope: scope, field_id: 'pre-formatted-variables' });
+                        ParseTypeChange({ scope: scope, field_id: 'pre-formatted-variables', readOnly: true });
                         scope.$emit('LoadPlays', data.related.job_events);
                     })
                     .error(function(data, status) {