diff --git a/docs/app/src/docs.js b/docs/app/src/docs.js
index 5c6a76d4e29c..fc1a3e561544 100644
--- a/docs/app/src/docs.js
+++ b/docs/app/src/docs.js
@@ -1,9 +1,16 @@
 angular.module('DocsController', [])
 
-.controller('DocsController', function($scope, $rootScope, $location, $window, $cookies, NG_PAGES, NG_NAVIGATION, NG_VERSION) {
+.controller('DocsController', [
+          '$scope', '$rootScope', '$location', '$window', '$cookies', 'openPlunkr',
+              'NG_PAGES', 'NG_NAVIGATION', 'NG_VERSION',
+  function($scope, $rootScope, $location, $window, $cookies, openPlunkr,
+              NG_PAGES, NG_NAVIGATION, NG_VERSION) {
+
+
+  $scope.openPlunkr = openPlunkr;
 
   $scope.docsVersion = NG_VERSION.isSnapshot ? 'snapshot' : NG_VERSION.version;
-  
+
   $scope.fold = function(url) {
     if(url) {
       $scope.docs_fold = '/notes/' + url;
@@ -120,4 +127,4 @@ angular.module('DocsController', [])
       });
     }
   });
-});
+}]);
diff --git a/docs/app/src/examples.js b/docs/app/src/examples.js
index 0ad981c957ea..314905601ebf 100644
--- a/docs/app/src/examples.js
+++ b/docs/app/src/examples.js
@@ -1,65 +1,6 @@
 angular.module('examples', [])
 
-.directive('sourceEdit', function(getEmbeddedTemplate) {
-  return {
-    template: '<div class="btn-group pull-right">' +
-        '<a class="btn dropdown-toggle btn-primary" data-toggle="dropdown" href>' +
-        '  <i class="icon-pencil icon-white"></i> Edit<span class="caret"></span>' +
-        '</a>' +
-        '<ul class="dropdown-menu">' +
-        '  <li><a ng-click="plunkr($event)" href="">In Plunkr</a></li>' +
-        '  <li><a ng-click="fiddle($event)" href="">In JsFiddle</a></li>' +
-        '</ul>' +
-        '</div>',
-    scope: true,
-    controller: function($scope, $attrs, openJsFiddle, openPlunkr) {
-      var sources = {
-        module: $attrs.sourceEdit,
-        deps: read($attrs.sourceEditDeps),
-        html: read($attrs.sourceEditHtml),
-        css: read($attrs.sourceEditCss),
-        js: read($attrs.sourceEditJs),
-        json: read($attrs.sourceEditJson),
-        unit: read($attrs.sourceEditUnit),
-        scenario: read($attrs.sourceEditScenario)
-      };
-      $scope.fiddle = function(e) {
-        e.stopPropagation();
-        openJsFiddle(sources);
-      };
-      $scope.plunkr = function(e) {
-        e.stopPropagation();
-        openPlunkr(sources);
-      };
-    }
-  };
-
-  function read(text) {
-    var files = [];
-    angular.forEach(text ? text.split(' ') : [], function(refId) {
-      // refId is index.html-343, so we need to strip the unique ID when exporting the name
-      files.push({name: refId.replace(/-\d+$/, ''), content: getEmbeddedTemplate(refId)});
-    });
-    return files;
-  }
-})
-
-
-.factory('angularUrls', function($document) {
-  var urls = {};
-
-  angular.forEach($document.find('script'), function(script) {
-    var match = script.src.match(/^.*\/(angular[^\/]*\.js)$/);
-    if (match) {
-      urls[match[1].replace(/(\-\d.*)?(\.min)?\.js$/, '.js')] = match[0];
-    }
-  });
-
-  return urls;
-})
-
-
-.factory('formPostData', function($document) {
+.factory('formPostData', ['$document', function($document) {
   return function(url, fields) {
     var form = angular.element('<form style="display: none;" method="post" action="' + url + '" target="_blank"></form>');
     angular.forEach(fields, function(value, name) {
@@ -71,196 +12,61 @@ angular.module('examples', [])
     form[0].submit();
     form.remove();
   };
-})
-
+}])
 
-.factory('prepareDefaultAppModule', function() {
-  return function(content) {
-    var deps = [];
-    angular.forEach(content.deps, function(file) {
-      if(file.name == 'angular-animate.js') {
-        deps.push('ngAnimate');
-      }
-    });
-
-    var moduleName = 'App';
-    return {
-      module : moduleName,
-      script : "angular.module('" + moduleName + "', [" +
-          (deps.length ? "'" + deps.join("','") + "'" : "") + "]);\n\n"
-    };
-  };
-})
 
-.factory('prepareEditorAssetTags', function(angularUrls) {
-  return function(content, options) {
-    options = options || {};
-    var includeLocalFiles = options.includeLocalFiles;
-    var html = makeScriptTag(angularUrls['angular.js']);
-
-    var allFiles = [].concat(content.js, content.css, content.html, content.json);
-    angular.forEach(content.deps, function(file) {
-      if (file.name !== 'angular.js') {
-        var isLocal = false;
-        for(var i=0;i<allFiles.length;i++) {
-          if(allFiles[i].name == file.name) {
-            isLocal = true;
-            break;
-          }
-        }
-        if(!(isLocal && !includeLocalFiles)) {
-          var assetUrl = angularUrls[file.name] || file.name;
-          html += makeScriptTag(assetUrl);
-        }
-      }
-    });
-
-    if(includeLocalFiles) {
-      angular.forEach(content.css, function(file, index) {
-        html += makeCssLinkTag(file.name);
-      });
-    }
-
-    return html;
-
-
-    function makeScriptTag(src) {
-      return '<script type="text/javascript" src="' + src + '"></script>\n';
-    }
-
-    function makeCssLinkTag(src) {
-      return '<link rel="stylesheet" type="text/css" href="' + src + '" />\n';
-    }
-  };
-})
-
-
-.factory('openPlunkr', function(templateMerge, formPostData, prepareEditorAssetTags, prepareDefaultAppModule) {
-  return function(content) {
-    var hasRouting = false;
-    angular.forEach(content.deps, function(file) {
-      hasRouting = hasRouting || file.name == 'angular-route.js';
-    });
-    var indexHtmlContent = '<!doctype html>\n' +
-                           '<html ng-app="{{module}}">\n' +
-                           '  <head>\n' +
-                           '{{scriptDeps}}';
+.factory('openPlunkr', ['formPostData', '$http', '$q', function(formPostData, $http, $q) {
+  return function(exampleFolder) {
 
-    if(hasRouting) {
-        indexHtmlContent += '<script type="text/javascript">\n' +
-                            '//this is here to make plunkr work with AngularJS routing\n' +
-                            'angular.element(document.getElementsByTagName(\'head\')).append(' +
-                              'angular.element(\'<base href="\' + window.location.pathname + \'" />\')' +
-                            ');\n' +
-                            '</script>\n';
-    }
+    var exampleName = 'AngularJS Example';
 
-    indexHtmlContent += '</head>\n' +
-                        '  <body>\n\n' +
-                        '{{indexContents}}\n\n' +
-                        '  </body>\n' +
-                        '</html>\n';
+    // Load the manifest for the example
+    $http.get(exampleFolder + '/manifest.json')
+      .then(function(response) {
+        return response.data;
+      })
+      .then(function(manifest) {
+        var filePromises = [];
 
-    indexProp = {
-      module: content.module,
-      scriptDeps: prepareEditorAssetTags(content, { includeLocalFiles : true }),
-      indexContents: content.html[0].content
-    };
-
-    var allFiles = [].concat(content.js, content.css, content.html, content.json);
-
-    if(!content.module) {
-      var moduleData = prepareDefaultAppModule(content);
-      indexProp.module = moduleData.module;
-
-      var found = false;
-      angular.forEach(content.js, function(file) {
-        if(file.name == 'script.js') {
-          file.content = moduleData.script + file.content;
-          found = true;
-        }
-      });
-      if(!found) {
-        indexProp.scriptDeps += '<script type="text/javascript" src="script.js"></script>\n';
-        allFiles.push({
-          name : 'script.js',
-          content : moduleData.script
+        // Build a pretty title for the Plunkr
+        var exampleNameParts = manifest.name.split('-');
+        exampleNameParts.unshift('AngularJS');
+        angular.forEach(exampleNameParts, function(part, index) {
+          exampleNameParts[index] = part.charAt(0).toUpperCase() + part.substr(1);
         });
-      }
-    }
-
-    var postData = {};
-
-    angular.forEach(allFiles, function(file, index) {
-      if (file.content && file.name != 'index.html') {
-        postData['files[' + file.name + ']'] = file.content;
-      }
-    });
-
-    postData['files[index.html]'] = templateMerge(indexHtmlContent, indexProp);
-    postData['tags[]'] = "angularjs";
-
-    postData.private = true;
-    postData.description = 'AngularJS Example Plunkr';
-
-    formPostData('http://plnkr.co/edit/?p=preview', postData);
-  };
-})
-
-.factory('openJsFiddle', function(templateMerge, formPostData, prepareEditorAssetTags, prepareDefaultAppModule) {
-  var HTML = '<div ng-app=\"{{module}}\">\n{{html:2}}</div>',
-      CSS = '</style> <!-- Ugly Hack to make remote files preload in jsFiddle --> \n' +
-        '{{head:0}}<style>{{css}}',
-      SCRIPT = '{{script}}',
-      SCRIPT_CACHE = '\n\n<!-- {{name}} -->\n<script type="text/ng-template" id="{{name}}">\n{{content:2}}</script>',
-      BASE_HREF_TAG = '<!--  Ugly Hack to make AngularJS routing work inside of jsFiddle -->\n' +
-                      '<base href="/" />\n\n';
-
-  return function(content) {
-    var prop = {
-          module: content.module,
-          html: '',
-          css: '',
-          script: ''
-        };
-    if(!prop.module) {
-      var moduleData = prepareDefaultAppModule(content);
-      prop.script = moduleData.script;
-      prop.module = moduleData.module;
-    }
-
-    angular.forEach(content.html, function(file, index) {
-      if (index) {
-        prop.html += templateMerge(SCRIPT_CACHE, file);
-      } else {
-        prop.html += file.content;
-      }
-    });
-
-    prop.head = prepareEditorAssetTags(content, { includeLocalFiles : false });
-
-    angular.forEach(content.js, function(file, index) {
-      prop.script += file.content;
-    });
+        exampleName = exampleNameParts.join(' - ');
+
+        angular.forEach(manifest.files, function(filename) {
+          filePromises.push($http.get(exampleFolder + '/' + filename)
+            .then(function(response) {
+
+              // The manifests provide the production index file but Plunkr wants
+              // a straight index.html
+              if (filename === "index-production.html") {
+                filename = "index.html"
+              }
+
+              return {
+                name: filename,
+                content: response.data
+              };
+            }));
+        });
+        return $q.all(filePromises);
+      })
+      .then(function(files) {
+        var postData = {};
 
-    angular.forEach(content.css, function(file, index) {
-      prop.css += file.content;
-    });
+        angular.forEach(files, function(file) {
+          postData['files[' + file.name + ']'] = file.content;
+        });
 
-    var hasRouting = false;
-    angular.forEach(content.deps, function(file) {
-      hasRouting = hasRouting || file.name == 'angular-route.js';
-    });
+        postData['tags[0]'] = "angularjs";
+        postData['tags[1]'] = "example";
+        postData.private = true;
+        postData.description = exampleName;
 
-    var compiledHTML = templateMerge(HTML, prop);
-    if(hasRouting) {
-      compiledHTML = BASE_HREF_TAG + compiledHTML;
-    }
-    formPostData("http://jsfiddle.net/api/post/library/pure/", {
-      title: 'AngularJS Example',
-      html: compiledHTML,
-      js: templateMerge(SCRIPT, prop),
-      css: templateMerge(CSS, prop)
-    });
+        formPostData('http://plnkr.co/edit/?p=preview', postData);
+      });
   };
-});
+}]);
\ No newline at end of file
diff --git a/docs/app/test/docsSpec.js b/docs/app/test/docsSpec.js
index ea6c6ba930aa..732f51164461 100644
--- a/docs/app/test/docsSpec.js
+++ b/docs/app/test/docsSpec.js
@@ -3,6 +3,7 @@ describe("DocsController", function() {
 
   angular.module('fake', [])
     .value('$cookies', {})
+    .value('openPlunkr', function() {})
     .value('NG_PAGES', {})
     .value('NG_NAVIGATION', {})
     .value('NG_VERSION', {});
diff --git a/docs/config/templates/runnableExample.template.html b/docs/config/templates/runnableExample.template.html
index 4fe2a38f9f64..b4f568a68350 100644
--- a/docs/config/templates/runnableExample.template.html
+++ b/docs/config/templates/runnableExample.template.html
@@ -2,7 +2,7 @@
    is HTML and wrap each line in a <p> - thus breaking the HTML #}
 
 <div>
-  <a ng-href="http://plnkr.co/edit/ngdoc:{$ doc.example.id $}@{{docsVersion}}?p=preview" class="btn pull-right" target="_blank">
+  <a ng-click="openPlunkr('{$ doc.example.outputFolder $}')" class="btn pull-right">
     <i class="glyphicon glyphicon-edit">&nbsp;</i>
     Edit in Plunker</a>
   <div class="runnable-example"
@@ -15,7 +15,7 @@
       {$ attrName $}="{$ attrValue $}"{% endfor %}>
       {% code -%}
       {$ file.fileContents $}
-      {%- endcode %}  
+      {%- endcode %}
     </div>
   {% endfor %}