Allow to use Dockerfile templates

4 files changed, 48 insertions, 2 deletions

diff --git a/app/assets/javascripts/api.js b/app/assets/javascripts/api.js
index 1cab66e109e..291efd2e286 100644
--- a/app/assets/javascripts/api.js
+++ b/app/assets/javascripts/api.js
@@ -10,6 +10,7 @@
     licensePath: "/api/:version/templates/licenses/:key",
     gitignorePath: "/api/:version/templates/gitignores/:key",
     gitlabCiYmlPath: "/api/:version/templates/gitlab_ci_ymls/:key",
+    dockerfilePath: "/api/:version/dockerfiles/:key",
     issuableTemplatePath: "/:namespace_path/:project_path/templates/:type/:key",
     group: function(group_id, callback) {
       var url = Api.buildUrl(Api.groupPath)
@@ -119,6 +120,10 @@
         return callback(file);
       });
     },
+    dockerfileYml: function(key, callback) {
+      var url = Api.buildUrl(Api.dockerfilePath).replace(':key', key);
+      $.get(url, callback);
+    },
     issueTemplate: function(namespacePath, projectPath, key, type, callback) {
       var url = Api.buildUrl(Api.issuableTemplatePath)
         .replace(':key', key)
diff --git a/app/assets/javascripts/blob/blob_ci_yaml.js.es6 b/app/assets/javascripts/blob/blob_ci_yaml.js.es6
index 37531aaec9b..62e686b8d9b 100644
--- a/app/assets/javascripts/blob/blob_ci_yaml.js.es6
+++ b/app/assets/javascripts/blob/blob_ci_yaml.js.es6
@@ -38,4 +38,40 @@
 
   global.BlobCiYamlSelectors = BlobCiYamlSelectors;
 
+    class BlobDockerfileSelector extends gl.TemplateSelector {
+        requestFile(query) {
+            return Api.dockerfileYml(query.name, this.requestFileSuccess.bind(this));
+        }
+
+        requestFileSuccess(file) {
+            return super.requestFileSuccess(file);
+        }
+    }
+
+    global.BlobDockerfileSelector = BlobDockerfileSelector;
+
+    class BlobDockerfileSelectors {
+        constructor({ editor, $dropdowns } = {}) {
+            this.editor = editor;
+            this.$dropdowns = $dropdowns || $('.js-dockerfile-selector');
+            this.initSelectors();
+        }
+
+        initSelectors() {
+            const editor = this.editor;
+            this.$dropdowns.each((i, dropdown) => {
+                const $dropdown = $(dropdown);
+                return new BlobDockerfileSelector({
+                    editor,
+                    pattern: /(Dockerfile)/,
+                    data: $dropdown.data('data'),
+                    wrapper: $dropdown.closest('.js-dockerfile-selector-wrap'),
+                    dropdown: $dropdown
+                });
+            });
+        }
+    }
+
+    global.BlobDockerfileSelectors = BlobDockerfileSelectors;
+
 })(window.gl || (window.gl = {}));
diff --git a/app/assets/javascripts/blob_edit/edit_blob.js b/app/assets/javascripts/blob_edit/edit_blob.js
index 60840560dd3..11dff7dfab4 100644
--- a/app/assets/javascripts/blob_edit/edit_blob.js
+++ b/app/assets/javascripts/blob_edit/edit_blob.js
@@ -33,6 +33,9 @@
       new gl.BlobCiYamlSelectors({
         editor: this.editor
       });
+        new gl.BlobDockerfileSelectors({
+            editor: this.editor
+        });
     }
 
     EditBlob.prototype.initModePanesAndLinks = function() {
diff --git a/app/assets/stylesheets/pages/editor.scss b/app/assets/stylesheets/pages/editor.scss
index 778126bcfb7..ac968618c79 100644
--- a/app/assets/stylesheets/pages/editor.scss
+++ b/app/assets/stylesheets/pages/editor.scss
@@ -67,7 +67,8 @@
   .soft-wrap-toggle,
   .license-selector,
   .gitignore-selector,
-  .gitlab-ci-yml-selector {
+  .gitlab-ci-yml-selector,
+  .dockerfile-selector {
     display: inline-block;
     vertical-align: top;
     font-family: $regular_font;
@@ -97,7 +98,8 @@
 
   .gitignore-selector,
   .license-selector,
-  .gitlab-ci-yml-selector {
+  .gitlab-ci-yml-selector,
+  .dockerfile-selector {
     .dropdown {
       line-height: 21px;
     }