Refactor blob views

3 files changed, 125 insertions, 0 deletions

diff --git a/app/views/projects/blob/edit.html.haml b/app/views/projects/blob/edit.html.haml
new file mode 100644
index 00000000000..883845c03f5
--- /dev/null
+++ b/app/views/projects/blob/edit.html.haml
@@ -0,0 +1,62 @@
+.file-editor
+  %ul.nav.nav-tabs.js-edit-mode
+    %li.active
+      = link_to '#editor' do
+        %i.fa.fa-edit
+        Edit file
+
+    %li
+      = link_to '#preview', 'data-preview-url' => project_preview_blob_path(@project, @id) do
+        %i.fa.fa-eye
+        = editing_preview_title(@blob.name)
+
+  = form_tag(project_update_blob_path(@project, @id), method: :put, class: "form-horizontal") do
+    = render 'projects/blob_editor', ref: @ref, path: @path, blob_data: @blob.data
+    = render 'shared/commit_message_container', params: params,
+             placeholder: "Update #{@blob.name}"
+    = hidden_field_tag 'last_commit', @last_commit
+    = hidden_field_tag 'content', '', id: "file-content"
+    = hidden_field_tag 'from_merge_request_id', params[:from_merge_request_id]
+    = render 'projects/commit_button', ref: @ref,
+              cancel_path: @after_edit_path
+
+:javascript
+  ace.config.set("modePath", gon.relative_url_root + "#{Gitlab::Application.config.assets.prefix}/ace")
+  ace.config.loadModule("ace/ext/searchbox");
+  var ace_mode = "#{@blob.language.try(:ace_mode)}";
+  var editor = ace.edit("editor");
+  if (ace_mode) {
+    editor.getSession().setMode('ace/mode/' + ace_mode);
+  }
+
+  disableButtonIfEmptyField("#commit_message", ".js-commit-button");
+
+  $(".js-commit-button").click(function(){
+    $("#file-content").val(editor.getValue());
+    $(".file-editor form").submit();
+  });
+
+  var editModePanes = $('.js-edit-mode-pane'),
+      editModeLinks = $('.js-edit-mode a');
+
+  editModeLinks.click(function(event) {
+    event.preventDefault();
+
+    var currentLink = $(this),
+        paneId = currentLink.attr('href'),
+        currentPane = editModePanes.filter(paneId);
+
+    editModeLinks.parent().removeClass('active hover');
+    currentLink.parent().addClass('active hover');
+    editModePanes.hide();
+
+    if (paneId == '#preview') {
+      currentPane.fadeIn(200);
+      $.post(currentLink.data('preview-url'), { content: editor.getValue() }, function(response) {
+        currentPane.empty().append(response);
+      })
+    } else {
+      currentPane.fadeIn(200);
+      editor.focus()
+    }
+  })
diff --git a/app/views/projects/blob/new.html.haml b/app/views/projects/blob/new.html.haml
new file mode 100644
index 00000000000..57e830d5c56
--- /dev/null
+++ b/app/views/projects/blob/new.html.haml
@@ -0,0 +1,38 @@
+%h3.page-title New file
+%hr
+.file-editor
+  = form_tag(project_create_blob_path(@project, @id), method: :post, class: 'form-horizontal form-new-file') do
+    .form-group.commit_message-group
+      = label_tag 'file_name', class: 'control-label' do
+        File name
+      .col-sm-10
+        .input-group
+          %span.input-group-addon
+            = @path[-1] == "/" ? @path : @path + "/"
+          = text_field_tag 'file_name', params[:file_name], placeholder: "sample.rb", required: true, class: 'form-control'
+          %span.input-group-addon
+            on
+            %span= @ref
+
+    .form-group.commit_message-group
+      = label_tag :encoding, class: "control-label" do
+        Encoding
+      .col-sm-10
+        = select_tag :encoding, options_for_select([ "base64", "text" ], "text"), class: 'form-control'
+    = render 'projects/blob_editor', ref: @ref
+    = render 'shared/commit_message_container', params: params,
+             placeholder: 'Add new file'
+    = hidden_field_tag 'content', '', id: 'file-content'
+    = render 'projects/commit_button', ref: @ref,
+              cancel_path: project_tree_path(@project, @id)
+
+:javascript
+  ace.config.set("modePath", gon.relative_url_root + "#{Gitlab::Application.config.assets.prefix}/ace-src-noconflict")
+  var editor = ace.edit("editor");
+
+  disableButtonIfAnyEmptyField($('.form-new-file'), '.form-control', '.btn-create')
+
+  $(".js-commit-button").click(function(){
+    $("#file-content").val(editor.getValue());
+    $(".file-editor form").submit();
+  });
diff --git a/app/views/projects/blob/preview.html.haml b/app/views/projects/blob/preview.html.haml
new file mode 100644
index 00000000000..e7c3460ad78
--- /dev/null
+++ b/app/views/projects/blob/preview.html.haml
@@ -0,0 +1,25 @@
+.diff-file
+  .diff-content
+    - if gitlab_markdown?(@blob.name)
+      .file-content.wiki
+        = preserve do
+          = markdown(@content)
+    - elsif markup?(@blob.name)
+      .file-content.wiki
+        = raw render_markup(@blob.name, @content)
+    - else
+      .file-content.code
+        - unless @diff_lines.empty?
+          %table.text-file
+            - @diff_lines.each do |line|
+              %tr.line_holder{ class: "#{line.type}" }
+                - if line.type == "match"
+                  %td.old_line= "..."
+                  %td.new_line= "..."
+                  %td.line_content.matched= line.text
+                - else
+                  %td.old_line
+                  %td.new_line
+                  %td.line_content{class: "#{line.type}"}= raw diff_line_content(line.text)
+        - else
+          .nothing-here-block No changes.