From f59b7409cb653a6e31b5fdc1f45fab211bc3d646 Mon Sep 17 00:00:00 2001
From: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Date: Tue, 14 May 2013 12:46:41 +0300
Subject: [PATCH] Improve user expirience while create/edit project settings
---
app/assets/javascripts/commits.js.coffee | 6 +-
app/assets/javascripts/main.js.coffee | 4 +-
app/assets/javascripts/project.js.coffee | 10 +-
app/views/projects/_errors.html.haml | 4 +
app/views/projects/_form.html.haml | 151 ----------------------
app/views/projects/_new_form.html.haml | 48 -------
app/views/projects/create.js.haml | 6 +-
app/views/projects/edit.html.haml | 153 ++++++++++++++++++++++-
app/views/projects/new.html.haml | 55 +++++++-
app/views/projects/update.js.haml | 5 +-
10 files changed, 222 insertions(+), 220 deletions(-)
create mode 100644 app/views/projects/_errors.html.haml
delete mode 100644 app/views/projects/_form.html.haml
delete mode 100644 app/views/projects/_new_form.html.haml
diff --git a/app/assets/javascripts/commits.js.coffee b/app/assets/javascripts/commits.js.coffee
index 47d6fcf8089..ab8eaa63228 100644
--- a/app/assets/javascripts/commits.js.coffee
+++ b/app/assets/javascripts/commits.js.coffee
@@ -23,7 +23,7 @@ class CommitsList
@data.offset = limit
this.initLoadMore()
- this.showProgress();
+ this.showProgress()
@getOld: ->
this.showProgress()
@@ -41,7 +41,7 @@ class CommitsList
else
@disable = true
- @initLoadMore: ->
+ @initLoadMore: ->
$(document).endlessScroll
bottomPixels: 400
fireDelay: 1000
@@ -51,4 +51,4 @@ class CommitsList
callback: =>
this.getOld()
-this.CommitsList = CommitsList
\ No newline at end of file
+this.CommitsList = CommitsList
diff --git a/app/assets/javascripts/main.js.coffee b/app/assets/javascripts/main.js.coffee
index fb51d379ebd..45ef44fcc04 100644
--- a/app/assets/javascripts/main.js.coffee
+++ b/app/assets/javascripts/main.js.coffee
@@ -55,8 +55,10 @@ $ ->
$(".one_click_select").on 'click', -> $(@).select()
# Click a .appear-link, appear-data fadeout
- $(".appear-link").on 'click', ->
+ $(".appear-link").on 'click', (e) ->
$('.appear-data').fadeIn()
+ e.preventDefault()
+
# Initialize chosen selects
$('select.chosen').chosen()
diff --git a/app/assets/javascripts/project.js.coffee b/app/assets/javascripts/project.js.coffee
index f926188d23f..780292daa11 100644
--- a/app/assets/javascripts/project.js.coffee
+++ b/app/assets/javascripts/project.js.coffee
@@ -1,10 +1,13 @@
class Project
constructor: ->
- $('.new_project, .edit_project').on 'ajax:before', ->
- $('.project_new_holder, .project_edit_holder').hide()
+ $('.project-edit-container').on 'ajax:before', =>
+ $('.project-edit-container').hide()
$('.save-project-loader').show()
- $('form #project_default_branch').chosen()
+ @initEvents()
+
+
+ initEvents: ->
disableButtonIfEmptyField '#project_name', '.project-submit'
$('#project_issues_enabled').change ->
@@ -21,6 +24,7 @@ class Project
else
$('#project_issues_tracker_id').removeAttr('disabled')
+
@Project = Project
$ ->
diff --git a/app/views/projects/_errors.html.haml b/app/views/projects/_errors.html.haml
new file mode 100644
index 00000000000..bb9759353a3
--- /dev/null
+++ b/app/views/projects/_errors.html.haml
@@ -0,0 +1,4 @@
+- if @project.errors.any?
+ .alert.alert-error
+ %button{ type: "button", class: "close", "data-dismiss" => "alert"} ×
+ = @project.errors.full_messages.first
diff --git a/app/views/projects/_form.html.haml b/app/views/projects/_form.html.haml
deleted file mode 100644
index 0e1fd238005..00000000000
--- a/app/views/projects/_form.html.haml
+++ /dev/null
@@ -1,151 +0,0 @@
-.row
- .span3
- %ul.nav.nav-pills.nav-stacked
- %li.active
- = link_to 'Settings', '#tab-settings', 'data-toggle' => 'tab'
- %li
- = link_to 'Transfer', '#tab-transfer', 'data-toggle' => 'tab'
- %li
- = link_to 'Remove', '#tab-remove', 'data-toggle' => 'tab'
-
- .span9
- .tab-content
- .tab-pane.active#tab-settings
- .ui-box.white
- %h5.title Settings:
- .form-holder
- = form_for(@project, remote: true) do |f|
- - if @project.errors.any?
- .alert.alert-error
- %ul
- - @project.errors.full_messages.each do |msg|
- %li= msg
-
- %fieldset
- .clearfix.project_name_holder
- = f.label :name do
- Project name is
- .input
- = f.text_field :name, placeholder: "Example Project", class: "span5"
-
-
- .clearfix
- = f.label :description do
- Project description
- %span.light (optional)
- .input
- = f.text_area :description, placeholder: "awesome project", class: "span5", rows: 3, maxlength: 250
-
- - unless @project.empty_repo?
- .clearfix
- = f.label :default_branch, "Default Branch"
- .input= f.select(:default_branch, @repository.branch_names, {})
-
-
- - if can?(current_user, :change_public_mode, @project)
- %fieldset.public-mode
- %legend
- Public mode:
- .control-group
- = f.label :public, class: 'control-label' do
- %span Public access
- .controls
- = f.check_box :public
- %span.descr
- If checked, this project can be cloned
- %em without any
- authentication.
- It will also be listed on the #{link_to "public access directory", public_root_path}.
- %em Any
- user will have #{link_to "Guest", help_permissions_path} permissions on the repository.
-
- %fieldset.features
- %legend
- Labels:
- .control-group
- = f.label :label_list, "Labels", class: 'control-label'
- .controls
- = f.text_field :label_list, maxlength: 2000, class: "span5"
- %p.hint Separate with comma.
-
- %fieldset.features
- %legend
- Features:
- .control-group
- = f.label :issues_enabled, "Issues", class: 'control-label'
- .controls
- = f.check_box :issues_enabled
- %span.descr Lightweight issue tracking system for this project
-
- - if Project.issues_tracker.values.count > 1
- .control-group
- = f.label :issues_tracker, "Issues tracker", class: 'control-label'
- .input= f.select(:issues_tracker, Project.issues_tracker.values, {}, { disabled: !@project.issues_enabled })
-
- .clearfix
- = f.label :issues_tracker_id, "Project name or id in issues tracker", class: 'control-label'
- .input= f.text_field :issues_tracker_id, disabled: !@project.can_have_issues_tracker_id?
-
- .control-group
- = f.label :merge_requests_enabled, "Merge Requests", class: 'control-label'
- .controls
- = f.check_box :merge_requests_enabled
- %span.descr Submit changes to be merged upstream.
-
- .control-group
- = f.label :wiki_enabled, "Wiki", class: 'control-label'
- .controls
- = f.check_box :wiki_enabled
- %span.descr Pages for project documentation
-
- .control-group
- = f.label :wall_enabled, "Wall", class: 'control-label'
- .controls
- = f.check_box :wall_enabled
- %span.descr Simple chat system for broadcasting inside project
-
- .control-group
- = f.label :snippets_enabled, "Snippets", class: 'control-label'
- .controls
- = f.check_box :snippets_enabled
- %span.descr Share code pastes with others out of git repository
-
-
- .form-actions
- = f.submit 'Save', class: "btn btn-save"
-
- .tab-pane#tab-transfer
- - if can?(current_user, :change_namespace, @project)
- .ui-box.ui-box-danger
- %h5.title Transfer project
- .errors-holder
- .form-holder
- = form_for(@project, url: transfer_project_path(@project), remote: true, html: { class: 'transfer-project' }) do |f|
- .control-group
- = f.label :namespace_id do
- %span Namespace
- .controls
- .clearfix
- = f.select :namespace_id, namespaces_options(@project.namespace_id || Namespace::global_id), {prompt: 'Choose a project namespace'}, {class: 'chosen'}
- %ul
- %li Be careful. Changing project namespace can have unintended side effects
- %li You can transfer project only to namespaces you can manage
- %li You will need to update your local repositories to point to the new location.
- .form-actions
- = f.submit 'Transfer', class: "btn btn-remove"
- - else
- %p.nothing_here_message Only project owner can transfer a project
-
- .tab-pane#tab-remove
- - if can?(current_user, :remove_project, @project)
- .ui-box.ui-box-danger
- %h5.title Remove project
- .ui-box-body
- %p
- Remove of project will cause removing repository and all related resources like issues, merge requests etc.
- %p
- %strong Removed project can not be restored!
-
- = link_to 'Remove project', @project, confirm: 'Removed project can not be restored! Are you sure?', method: :delete, class: "btn btn-remove btn-small"
- - else
- %p.nothing_here_message Only project owner can remove a project
diff --git a/app/views/projects/_new_form.html.haml b/app/views/projects/_new_form.html.haml
deleted file mode 100644
index b6503636890..00000000000
--- a/app/views/projects/_new_form.html.haml
+++ /dev/null
@@ -1,48 +0,0 @@
-= form_for(@project, remote: true) do |f|
- - if @project.errors.any?
- .alert.alert-error
- %span= @project.errors.full_messages.first
- .clearfix.project_name_holder
- = f.label :name do
- Project name is
- .input
- = f.text_field :name, placeholder: "Example Project", class: "xxlarge"
- = f.submit 'Create project', class: "btn btn-create project-submit"
-
- - if current_user.can_select_namespace?
- .clearfix
- = f.label :namespace_id do
- %span Namespace
- .input
- = f.select :namespace_id, namespaces_options(params[:namespace_id] || :current_user), {}, {class: 'chosen'}
-
-
- .clearfix
- .input
- = link_to "#", class: 'appear-link' do
- %i.icon-upload-alt
- %span Import existing repository?
- .clearfix.appear-data
- = f.label :import_url do
- %span Import existing repo
- .input
- = f.text_field :import_url, class: 'xlarge', placeholder: 'https://github.com/randx/six.git'
- .light
- URL must be clonable
-
- %p.padded
- New projects are private by default. You choose who can see the project and commit to repository.
- %hr
-
- - if current_user.can_create_group?
- .clearfix
- .input.light
- Need a group for several dependent projects?
- = link_to new_group_path, class: "btn btn-tiny" do
- Create a group
- - if current_user.can_create_team?
- .clearfix
- .input.light
- Want to share a project between team?
- = link_to new_team_path, class: "btn btn-tiny" do
- Create a team
diff --git a/app/views/projects/create.js.haml b/app/views/projects/create.js.haml
index 296c8688f47..52e61f47283 100644
--- a/app/views/projects/create.js.haml
+++ b/app/views/projects/create.js.haml
@@ -3,8 +3,6 @@
location.href = "#{project_path(@project)}";
- else
:plain
- $('.project_new_holder').show();
- $("#new_project").replaceWith("#{escape_javascript(render('new_form'))}");
+ $(".project-edit-errors").html("#{escape_javascript(render('errors'))}");
$('.save-project-loader').hide();
- new Projects();
- $('select.chosen').chosen()
+ $('.project-edit-container').show();
diff --git a/app/views/projects/edit.html.haml b/app/views/projects/edit.html.haml
index e215ad6fd73..dd087100e4c 100644
--- a/app/views/projects/edit.html.haml
+++ b/app/views/projects/edit.html.haml
@@ -1,10 +1,157 @@
= render "projects/settings_nav"
-.project_edit_holder
+.project-edit-container
%h3.page_title Edit Project
%hr
- = render "projects/form"
-%div.save-project-loader.hide
+ .project-edit-errors
+ .project-edit-content
+ .row
+ .span3
+ %ul.nav.nav-pills.nav-stacked
+ %li.active
+ = link_to 'Settings', '#tab-settings', 'data-toggle' => 'tab'
+ %li
+ = link_to 'Transfer', '#tab-transfer', 'data-toggle' => 'tab'
+ %li
+ = link_to 'Remove', '#tab-remove', 'data-toggle' => 'tab'
+
+ .span9
+ .tab-content
+ .tab-pane.active#tab-settings
+ .ui-box.white
+ %h5.title Settings:
+ .form-holder
+ = form_for(@project, remote: true) do |f|
+ %fieldset
+ .clearfix.project_name_holder
+ = f.label :name do
+ Project name is
+ .input
+ = f.text_field :name, placeholder: "Example Project", class: "span5"
+
+
+ .clearfix
+ = f.label :description do
+ Project description
+ %span.light (optional)
+ .input
+ = f.text_area :description, placeholder: "awesome project", class: "span5", rows: 3, maxlength: 250
+
+ - unless @project.empty_repo?
+ .clearfix
+ = f.label :default_branch, "Default Branch"
+ .input= f.select(:default_branch, @repository.branch_names, {}, {class: 'chosen'})
+
+
+ - if can?(current_user, :change_public_mode, @project)
+ %fieldset.public-mode
+ %legend
+ Public mode:
+ .control-group
+ = f.label :public, class: 'control-label' do
+ %span Public access
+ .controls
+ = f.check_box :public
+ %span.descr
+ If checked, this project can be cloned
+ %em without any
+ authentication.
+ It will also be listed on the #{link_to "public access directory", public_root_path}.
+ %em Any
+ user will have #{link_to "Guest", help_permissions_path} permissions on the repository.
+
+ %fieldset.features
+ %legend
+ Labels:
+ .control-group
+ = f.label :label_list, "Labels", class: 'control-label'
+ .controls
+ = f.text_field :label_list, maxlength: 2000, class: "span5"
+ %p.hint Separate with comma.
+
+ %fieldset.features
+ %legend
+ Features:
+ .control-group
+ = f.label :issues_enabled, "Issues", class: 'control-label'
+ .controls
+ = f.check_box :issues_enabled
+ %span.descr Lightweight issue tracking system for this project
+
+ - if Project.issues_tracker.values.count > 1
+ .control-group
+ = f.label :issues_tracker, "Issues tracker", class: 'control-label'
+ .input= f.select(:issues_tracker, Project.issues_tracker.values, {}, { disabled: !@project.issues_enabled })
+
+ .clearfix
+ = f.label :issues_tracker_id, "Project name or id in issues tracker", class: 'control-label'
+ .input= f.text_field :issues_tracker_id, disabled: !@project.can_have_issues_tracker_id?
+
+ .control-group
+ = f.label :merge_requests_enabled, "Merge Requests", class: 'control-label'
+ .controls
+ = f.check_box :merge_requests_enabled
+ %span.descr Submit changes to be merged upstream.
+
+ .control-group
+ = f.label :wiki_enabled, "Wiki", class: 'control-label'
+ .controls
+ = f.check_box :wiki_enabled
+ %span.descr Pages for project documentation
+
+ .control-group
+ = f.label :wall_enabled, "Wall", class: 'control-label'
+ .controls
+ = f.check_box :wall_enabled
+ %span.descr Simple chat system for broadcasting inside project
+
+ .control-group
+ = f.label :snippets_enabled, "Snippets", class: 'control-label'
+ .controls
+ = f.check_box :snippets_enabled
+ %span.descr Share code pastes with others out of git repository
+
+
+ .form-actions
+ = f.submit 'Save', class: "btn btn-save"
+
+ .tab-pane#tab-transfer
+ - if can?(current_user, :change_namespace, @project)
+ .ui-box.ui-box-danger
+ %h5.title Transfer project
+ .errors-holder
+ .form-holder
+ = form_for(@project, url: transfer_project_path(@project), remote: true, html: { class: 'transfer-project' }) do |f|
+ .control-group
+ = f.label :namespace_id do
+ %span Namespace
+ .controls
+ .clearfix
+ = f.select :namespace_id, namespaces_options(@project.namespace_id || Namespace::global_id), {prompt: 'Choose a project namespace'}, {class: 'chosen'}
+ %ul
+ %li Be careful. Changing project namespace can have unintended side effects
+ %li You can transfer project only to namespaces you can manage
+ %li You will need to update your local repositories to point to the new location.
+ .form-actions
+ = f.submit 'Transfer', class: "btn btn-remove"
+ - else
+ %p.nothing_here_message Only project owner can transfer a project
+
+ .tab-pane#tab-remove
+ - if can?(current_user, :remove_project, @project)
+ .ui-box.ui-box-danger
+ %h5.title Remove project
+ .ui-box-body
+ %p
+ Remove of project will cause removing repository and all related resources like issues, merge requests etc.
+ %p
+ %strong Removed project can not be restored!
+
+ = link_to 'Remove project', @project, confirm: 'Removed project can not be restored! Are you sure?', method: :delete, class: "btn btn-remove btn-small"
+ - else
+ %p.nothing_here_message Only project owner can remove a project
+
+.save-project-loader.hide
%center
= image_tag "ajax_loader.gif"
%h3 Saving project. Please wait a moment, this page will automatically refresh when ready.
diff --git a/app/views/projects/new.html.haml b/app/views/projects/new.html.haml
index 8ff873aac65..ad4f89bb5b3 100644
--- a/app/views/projects/new.html.haml
+++ b/app/views/projects/new.html.haml
@@ -1,9 +1,54 @@
-.project_new_holder
- %h3.page_title
- New Project
+.project-edit-container
+ %h3.page_title New Project
%hr
- = render 'new_form'
-%div.save-project-loader.hide
+ .project-edit-errors
+ .project-edit-content
+ = form_for @project, remote: true do |f|
+ .clearfix.project_name_holder
+ = f.label :name do
+ Project name is
+ .input
+ = f.text_field :name, placeholder: "Example Project", class: "xxlarge", tabindex: 1
+ = f.submit 'Create project', class: "btn btn-create project-submit", tabindex: 3
+
+ - if current_user.can_select_namespace?
+ .clearfix
+ = f.label :namespace_id do
+ %span Namespace
+ .input
+ = f.select :namespace_id, namespaces_options(params[:namespace_id] || :current_user), {}, {class: 'chosen', tabindex: 2}
+
+ .clearfix
+ .input
+ = link_to "#", class: 'appear-link' do
+ %i.icon-upload-alt
+ %span Import existing repository?
+ .clearfix.appear-data.import-url-data
+ = f.label :import_url do
+ %span Import existing repo
+ .input
+ = f.text_field :import_url, class: 'xlarge', placeholder: 'https://github.com/randx/six.git'
+ .light
+ URL must be clonable
+
+ %p.padded
+ New projects are private by default. You choose who can see the project and commit to repository.
+ %hr
+
+ - if current_user.can_create_group?
+ .clearfix
+ .input.light
+ Need a group for several dependent projects?
+ = link_to new_group_path, class: "btn btn-tiny" do
+ Create a group
+ - if current_user.can_create_team?
+ .clearfix
+ .input.light
+ Want to share a project between team?
+ = link_to new_team_path, class: "btn btn-tiny" do
+ Create a team
+
+.save-project-loader.hide
%center
= image_tag "ajax_loader.gif"
%h3 Creating project & repository. Please wait a moment, this page will automatically refresh when ready.
diff --git a/app/views/projects/update.js.haml b/app/views/projects/update.js.haml
index f44ed529182..cbb21f2b9fb 100644
--- a/app/views/projects/update.js.haml
+++ b/app/views/projects/update.js.haml
@@ -3,6 +3,7 @@
location.href = "#{edit_project_path(@project)}";
- else
:plain
- $('.project_edit_holder').show();
- $(".edit_project").replaceWith("#{escape_javascript(render('form'))}");
+ $(".project-edit-errors").html("#{escape_javascript(render('errors'))}");
$('.save-project-loader').hide();
+ $('.project-edit-container').show();
+ $('.project-edit-content .btn-save').enableButton();
--
GitLab