From 70eff78d8c875118ff22da5a3e8ecc45b730574e Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 18 Dec 2015 14:17:19 -0500 Subject: arrows for buttons --- app/assets/stylesheets/pages/projects.scss | 61 +++++++++++++++++++++++++++++- app/views/projects/_home_panel.html.haml | 2 +- app/views/projects/buttons/_fork.html.haml | 5 +++ app/views/projects/buttons/_star.html.haml | 6 +++ 4 files changed, 72 insertions(+), 2 deletions(-) diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 2ded32dba12..31a093fadd5 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -101,11 +101,70 @@ margin-top: 12px; margin-bottom: 0px; + .count-buttons { + display: block; + } + .btn { @include btn-gray; - + text-transform: none; + } + .count-with-arrow { + display: inline-block; + position: relative; + margin-left: 4px; + + .arrow { + + &:before { + content: ''; + display: inline-block; + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + top: 50%; + left: 0; + margin-top: -6px; + border-width: 7px 5px 7px 0; + border-right-color: #dce0e5; + } + + &:after { + content: ''; + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + top: 50%; + left: 1px; + margin-top: -9px; + border-width: 10px 7px 10px 0; + border-right-color: #FFF; + } + } .count { + @include btn-gray; display: inline-block; + background: white; + border-radius: 2px; + border-width: 1px; + border-style: solid; + font-size: 13px; + font-weight: 600; + line-height: 20px; + padding: 11px 16px; + letter-spacing: .4px; + padding: 10px; + text-align: center; + vertical-align: middle; + touch-action: manipulation; + cursor: pointer; + background-image: none; + white-space: nowrap; + margin: 0 11px 0px 4px; } } } diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml index c1669ac046b..4420861c9dc 100644 --- a/app/views/projects/_home_panel.html.haml +++ b/app/views/projects/_home_panel.html.haml @@ -27,7 +27,7 @@ = icon('rss') .project-repo-buttons - .split-one + .split-one.count-buttons = render 'projects/buttons/star' = render 'projects/buttons/fork' diff --git a/app/views/projects/buttons/_fork.html.haml b/app/views/projects/buttons/_fork.html.haml index 2d3abf09051..133531887a2 100644 --- a/app/views/projects/buttons/_fork.html.haml +++ b/app/views/projects/buttons/_fork.html.haml @@ -4,10 +4,15 @@ = link_to namespace_project_path(current_user, current_user.fork_of(@project)), title: 'Go to your fork', class: 'btn has_tooltip' do = icon('code-fork fw') Fork + %div.count-with-arrow + %span.arrow %span.count = @project.forks_count - else = link_to new_namespace_project_fork_path(@project.namespace, @project), title: "Fork project", class: 'btn has_tooltip' do = icon('code-fork fw') + Fork + %div.count-with-arrow + %span.arrow %span.count = @project.forks_count diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index 41a3ec6d90f..27d63cc4cec 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -1,6 +1,9 @@ - if current_user = link_to toggle_star_namespace_project_path(@project.namespace, @project), class: 'btn star-btn toggle-star has_tooltip', method: :post, remote: true, title: "Star project" do = icon('star fw') + Star + %div.count-with-arrow + %span.arrow %span.count = @project.star_count @@ -15,5 +18,8 @@ - else = link_to new_user_session_path, class: 'btn has_tooltip star-btn', title: 'You must sign in to star a project' do = icon('star fw') + Star + %div.count-with-arrow + %span.arrow %span.count = @project.star_count -- cgit v1.2.1 From c82691b7b8c102ae8998ae8cff7facc6f720f5a8 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 18 Dec 2015 16:06:48 -0500 Subject: adds starring and unstarring text to star button, also adds partial new styles --- app/assets/stylesheets/pages/projects.scss | 5 ++++- app/controllers/projects_controller.rb | 2 +- app/views/projects/buttons/_star.html.haml | 19 +++++++++++++++++-- 3 files changed, 22 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 31a093fadd5..32a66052659 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -115,7 +115,6 @@ margin-left: 4px; .arrow { - &:before { content: ''; display: inline-block; @@ -165,6 +164,10 @@ background-image: none; white-space: nowrap; margin: 0 11px 0px 4px; + + &:hover { + background: #FFF; + } } } } diff --git a/app/controllers/projects_controller.rb b/app/controllers/projects_controller.rb index bf5e25ff895..2dab04f2a7c 100644 --- a/app/controllers/projects_controller.rb +++ b/app/controllers/projects_controller.rb @@ -171,7 +171,7 @@ class ProjectsController < ApplicationController @project.reload render json: { - html: view_to_html_string("projects/buttons/_star") + star_count: @project.star_count } end diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index 27d63cc4cec..4289d7afd26 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -1,7 +1,10 @@ - if current_user = link_to toggle_star_namespace_project_path(@project.namespace, @project), class: 'btn star-btn toggle-star has_tooltip', method: :post, remote: true, title: "Star project" do = icon('star fw') - Star + - if current_user.starred?(@project) + %span.starred Unstar + - else + %span Star %div.count-with-arrow %span.arrow %span.count @@ -9,7 +12,19 @@ :javascript $('.project-home-panel .toggle-star').on('ajax:success', function (e, data, status, xhr) { - $(this).replaceWith(data.html); + var $this = $(this); + var $starSpan = $this.find('span'); + $this + .parent() + .find('span.count') + .text(data.star_count); + if($starSpan.hasClass('starred')){ + $starSpan.removeClass('starred'); + $starSpan.text('Star'); + } else { + $starSpan.addClass('starred'); + $starSpan.text('Unstar'); + } }) .on('ajax:error', function (e, xhr, status, error) { new Flash('Star toggle failed. Try again later.', 'alert'); -- cgit v1.2.1 From 67c623d8a28f1a3e2b8023f7e4c91947720218bb Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 18 Dec 2015 17:12:47 -0500 Subject: adds dropdown for cloning --- app/assets/stylesheets/pages/projects.scss | 11 ++++++++-- app/views/projects/buttons/_star.html.haml | 21 +++++++++++++++----- app/views/shared/_clone_panel.html.haml | 32 ++++++++++++++++++++++-------- 3 files changed, 49 insertions(+), 15 deletions(-) diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 32a66052659..7626bf113dc 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -91,10 +91,9 @@ } } - .input-group { + .git-clone-holder { display: inline-table; position: relative; - top: 17px; } .project-repo-buttons { @@ -103,6 +102,7 @@ .count-buttons { display: block; + margin-bottom: 12px; } .btn { @@ -187,6 +187,13 @@ margin-right: 45px; } + .clone-options { + display: table-cell; + a.btn { + width: 100%; + } + } + .form-control { cursor: auto; @extend .monospace; diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index 4289d7afd26..aba959f991a 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -1,9 +1,10 @@ - if current_user = link_to toggle_star_namespace_project_path(@project.namespace, @project), class: 'btn star-btn toggle-star has_tooltip', method: :post, remote: true, title: "Star project" do - = icon('star fw') - if current_user.starred?(@project) + = icon('star fw') %span.starred Unstar - else + = icon('star-o fw') %span Star %div.count-with-arrow %span.arrow @@ -14,16 +15,26 @@ $('.project-home-panel .toggle-star').on('ajax:success', function (e, data, status, xhr) { var $this = $(this); var $starSpan = $this.find('span'); + var $starIcon = $this.find('i'); $this .parent() .find('span.count') .text(data.star_count); if($starSpan.hasClass('starred')){ - $starSpan.removeClass('starred'); - $starSpan.text('Star'); + $starSpan + .removeClass('starred') + .text('Star'); + $starIcon + .removeClass('fa-star') + .addClass('fa-star-o'); + } else { - $starSpan.addClass('starred'); - $starSpan.text('Unstar'); + $starSpan + .addClass('starred') + .text('Unstar'); + $starIcon + .removeClass('fa-star-o') + .addClass('fa-star'); } }) .on('ajax:error', function (e, xhr, status, error) { diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml index edb5778f424..d6fa2ea6a66 100644 --- a/app/views/shared/_clone_panel.html.haml +++ b/app/views/shared/_clone_panel.html.haml @@ -1,10 +1,26 @@ - project = project || @project -.git-clone-holder.input-group - .input-group-addon.git-protocols + +.git-clone-holder + .btn-group.clone-options + %a.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'} + %span SSH + = icon('angle-down') + %ul.dropdown-menu.dropdown-menu-right.clone-options-dropdown + %li + %a{href: '#'} + SSH + %li + %a{href: '#'} + HTTPS + + = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true .input-group-btn - = ssh_clone_button(project) - .input-group-btn - = http_clone_button(project) - = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true - .input-group-btn - = clipboard_button(clipboard_target: '#project_clone') + = clipboard_button(clipboard_target: '#project_clone') + +:javascript + $('ul.clone-options-dropdown a').on('click',function(e){ + e.preventDefault(); + var $this = $(this); + $('a.clone-dropdown-btn span').text($this.text()); + console.log("got it",$(this).text()); + }); -- cgit v1.2.1 From f1d5f35936e11a27115b3f4e405d6af5fb850987 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 18 Dec 2015 17:24:43 -0500 Subject: dropdown chooses right default --- app/views/shared/_clone_panel.html.haml | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml index d6fa2ea6a66..74e82af48c8 100644 --- a/app/views/shared/_clone_panel.html.haml +++ b/app/views/shared/_clone_panel.html.haml @@ -3,14 +3,15 @@ .git-clone-holder .btn-group.clone-options %a.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'} - %span SSH + %span + = default_clone_protocol.upcase = icon('angle-down') %ul.dropdown-menu.dropdown-menu-right.clone-options-dropdown %li - %a{href: '#'} + %a{href: '#', "data-url" => @project.ssh_url_to_repo} SSH %li - %a{href: '#'} + %a{href: '#', "data-url" => @project.http_url_to_repo} HTTPS = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true @@ -22,5 +23,5 @@ e.preventDefault(); var $this = $(this); $('a.clone-dropdown-btn span').text($this.text()); - console.log("got it",$(this).text()); + $('#project_clone').val($this.data('url')); }); -- cgit v1.2.1 From 7b50ab5c1de71e8d2e9e959bfd1cbf68352c70ec Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 18 Dec 2015 14:17:19 -0500 Subject: arrows for buttons --- app/assets/stylesheets/pages/projects.scss | 61 +++++++++++++++++++++++++++++- app/views/projects/_home_panel.html.haml | 2 +- app/views/projects/buttons/_fork.html.haml | 5 +++ app/views/projects/buttons/_star.html.haml | 6 +++ 4 files changed, 72 insertions(+), 2 deletions(-) diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 2ded32dba12..31a093fadd5 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -101,11 +101,70 @@ margin-top: 12px; margin-bottom: 0px; + .count-buttons { + display: block; + } + .btn { @include btn-gray; - + text-transform: none; + } + .count-with-arrow { + display: inline-block; + position: relative; + margin-left: 4px; + + .arrow { + + &:before { + content: ''; + display: inline-block; + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + top: 50%; + left: 0; + margin-top: -6px; + border-width: 7px 5px 7px 0; + border-right-color: #dce0e5; + } + + &:after { + content: ''; + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + top: 50%; + left: 1px; + margin-top: -9px; + border-width: 10px 7px 10px 0; + border-right-color: #FFF; + } + } .count { + @include btn-gray; display: inline-block; + background: white; + border-radius: 2px; + border-width: 1px; + border-style: solid; + font-size: 13px; + font-weight: 600; + line-height: 20px; + padding: 11px 16px; + letter-spacing: .4px; + padding: 10px; + text-align: center; + vertical-align: middle; + touch-action: manipulation; + cursor: pointer; + background-image: none; + white-space: nowrap; + margin: 0 11px 0px 4px; } } } diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml index c1669ac046b..4420861c9dc 100644 --- a/app/views/projects/_home_panel.html.haml +++ b/app/views/projects/_home_panel.html.haml @@ -27,7 +27,7 @@ = icon('rss') .project-repo-buttons - .split-one + .split-one.count-buttons = render 'projects/buttons/star' = render 'projects/buttons/fork' diff --git a/app/views/projects/buttons/_fork.html.haml b/app/views/projects/buttons/_fork.html.haml index 2d3abf09051..133531887a2 100644 --- a/app/views/projects/buttons/_fork.html.haml +++ b/app/views/projects/buttons/_fork.html.haml @@ -4,10 +4,15 @@ = link_to namespace_project_path(current_user, current_user.fork_of(@project)), title: 'Go to your fork', class: 'btn has_tooltip' do = icon('code-fork fw') Fork + %div.count-with-arrow + %span.arrow %span.count = @project.forks_count - else = link_to new_namespace_project_fork_path(@project.namespace, @project), title: "Fork project", class: 'btn has_tooltip' do = icon('code-fork fw') + Fork + %div.count-with-arrow + %span.arrow %span.count = @project.forks_count diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index 41a3ec6d90f..27d63cc4cec 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -1,6 +1,9 @@ - if current_user = link_to toggle_star_namespace_project_path(@project.namespace, @project), class: 'btn star-btn toggle-star has_tooltip', method: :post, remote: true, title: "Star project" do = icon('star fw') + Star + %div.count-with-arrow + %span.arrow %span.count = @project.star_count @@ -15,5 +18,8 @@ - else = link_to new_user_session_path, class: 'btn has_tooltip star-btn', title: 'You must sign in to star a project' do = icon('star fw') + Star + %div.count-with-arrow + %span.arrow %span.count = @project.star_count -- cgit v1.2.1 From 011a7a32978ea6cfc7857f9afa7f2f242a753634 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 18 Dec 2015 16:06:48 -0500 Subject: adds starring and unstarring text to star button, also adds partial new styles --- app/assets/stylesheets/pages/projects.scss | 5 ++++- app/controllers/projects_controller.rb | 2 +- app/views/projects/buttons/_star.html.haml | 19 +++++++++++++++++-- 3 files changed, 22 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 31a093fadd5..32a66052659 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -115,7 +115,6 @@ margin-left: 4px; .arrow { - &:before { content: ''; display: inline-block; @@ -165,6 +164,10 @@ background-image: none; white-space: nowrap; margin: 0 11px 0px 4px; + + &:hover { + background: #FFF; + } } } } diff --git a/app/controllers/projects_controller.rb b/app/controllers/projects_controller.rb index bf5e25ff895..2dab04f2a7c 100644 --- a/app/controllers/projects_controller.rb +++ b/app/controllers/projects_controller.rb @@ -171,7 +171,7 @@ class ProjectsController < ApplicationController @project.reload render json: { - html: view_to_html_string("projects/buttons/_star") + star_count: @project.star_count } end diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index 27d63cc4cec..4289d7afd26 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -1,7 +1,10 @@ - if current_user = link_to toggle_star_namespace_project_path(@project.namespace, @project), class: 'btn star-btn toggle-star has_tooltip', method: :post, remote: true, title: "Star project" do = icon('star fw') - Star + - if current_user.starred?(@project) + %span.starred Unstar + - else + %span Star %div.count-with-arrow %span.arrow %span.count @@ -9,7 +12,19 @@ :javascript $('.project-home-panel .toggle-star').on('ajax:success', function (e, data, status, xhr) { - $(this).replaceWith(data.html); + var $this = $(this); + var $starSpan = $this.find('span'); + $this + .parent() + .find('span.count') + .text(data.star_count); + if($starSpan.hasClass('starred')){ + $starSpan.removeClass('starred'); + $starSpan.text('Star'); + } else { + $starSpan.addClass('starred'); + $starSpan.text('Unstar'); + } }) .on('ajax:error', function (e, xhr, status, error) { new Flash('Star toggle failed. Try again later.', 'alert'); -- cgit v1.2.1 From f56783e5244c8199dc30fb8374a96d8e5d96549c Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 18 Dec 2015 17:12:47 -0500 Subject: adds dropdown for cloning --- app/assets/stylesheets/pages/projects.scss | 11 ++++++++-- app/views/projects/buttons/_star.html.haml | 21 +++++++++++++++----- app/views/shared/_clone_panel.html.haml | 32 ++++++++++++++++++++++-------- 3 files changed, 49 insertions(+), 15 deletions(-) diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 32a66052659..7626bf113dc 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -91,10 +91,9 @@ } } - .input-group { + .git-clone-holder { display: inline-table; position: relative; - top: 17px; } .project-repo-buttons { @@ -103,6 +102,7 @@ .count-buttons { display: block; + margin-bottom: 12px; } .btn { @@ -187,6 +187,13 @@ margin-right: 45px; } + .clone-options { + display: table-cell; + a.btn { + width: 100%; + } + } + .form-control { cursor: auto; @extend .monospace; diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index 4289d7afd26..aba959f991a 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -1,9 +1,10 @@ - if current_user = link_to toggle_star_namespace_project_path(@project.namespace, @project), class: 'btn star-btn toggle-star has_tooltip', method: :post, remote: true, title: "Star project" do - = icon('star fw') - if current_user.starred?(@project) + = icon('star fw') %span.starred Unstar - else + = icon('star-o fw') %span Star %div.count-with-arrow %span.arrow @@ -14,16 +15,26 @@ $('.project-home-panel .toggle-star').on('ajax:success', function (e, data, status, xhr) { var $this = $(this); var $starSpan = $this.find('span'); + var $starIcon = $this.find('i'); $this .parent() .find('span.count') .text(data.star_count); if($starSpan.hasClass('starred')){ - $starSpan.removeClass('starred'); - $starSpan.text('Star'); + $starSpan + .removeClass('starred') + .text('Star'); + $starIcon + .removeClass('fa-star') + .addClass('fa-star-o'); + } else { - $starSpan.addClass('starred'); - $starSpan.text('Unstar'); + $starSpan + .addClass('starred') + .text('Unstar'); + $starIcon + .removeClass('fa-star-o') + .addClass('fa-star'); } }) .on('ajax:error', function (e, xhr, status, error) { diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml index edb5778f424..d6fa2ea6a66 100644 --- a/app/views/shared/_clone_panel.html.haml +++ b/app/views/shared/_clone_panel.html.haml @@ -1,10 +1,26 @@ - project = project || @project -.git-clone-holder.input-group - .input-group-addon.git-protocols + +.git-clone-holder + .btn-group.clone-options + %a.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'} + %span SSH + = icon('angle-down') + %ul.dropdown-menu.dropdown-menu-right.clone-options-dropdown + %li + %a{href: '#'} + SSH + %li + %a{href: '#'} + HTTPS + + = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true .input-group-btn - = ssh_clone_button(project) - .input-group-btn - = http_clone_button(project) - = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true - .input-group-btn - = clipboard_button(clipboard_target: '#project_clone') + = clipboard_button(clipboard_target: '#project_clone') + +:javascript + $('ul.clone-options-dropdown a').on('click',function(e){ + e.preventDefault(); + var $this = $(this); + $('a.clone-dropdown-btn span').text($this.text()); + console.log("got it",$(this).text()); + }); -- cgit v1.2.1 From ea5fa54b2d1949a21503661b3fd5a25401bf110e Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Fri, 18 Dec 2015 17:24:43 -0500 Subject: dropdown chooses right default --- app/views/shared/_clone_panel.html.haml | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml index d6fa2ea6a66..74e82af48c8 100644 --- a/app/views/shared/_clone_panel.html.haml +++ b/app/views/shared/_clone_panel.html.haml @@ -3,14 +3,15 @@ .git-clone-holder .btn-group.clone-options %a.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'} - %span SSH + %span + = default_clone_protocol.upcase = icon('angle-down') %ul.dropdown-menu.dropdown-menu-right.clone-options-dropdown %li - %a{href: '#'} + %a{href: '#', "data-url" => @project.ssh_url_to_repo} SSH %li - %a{href: '#'} + %a{href: '#', "data-url" => @project.http_url_to_repo} HTTPS = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true @@ -22,5 +23,5 @@ e.preventDefault(); var $this = $(this); $('a.clone-dropdown-btn span').text($this.text()); - console.log("got it",$(this).text()); + $('#project_clone').val($this.data('url')); }); -- cgit v1.2.1 From 69f9bf77d4ad3fd6c690bf863337854f4347494d Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Wed, 23 Dec 2015 12:26:41 -0500 Subject: spinach tests will pass now --- app/views/projects/buttons/_star.html.haml | 2 +- features/project/star.feature | 1 + features/steps/project/star.rb | 2 +- 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index aba959f991a..0f2ee119871 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -8,7 +8,7 @@ %span Star %div.count-with-arrow %span.arrow - %span.count + %span.count.star-count = @project.star_count :javascript diff --git a/features/project/star.feature b/features/project/star.feature index a45f9c470ea..618f44fe6dc 100644 --- a/features/project/star.feature +++ b/features/project/star.feature @@ -1,3 +1,4 @@ +@project-stars Feature: Project Star Scenario: New projects have 0 stars Given public project "Community" diff --git a/features/steps/project/star.rb b/features/steps/project/star.rb index bd2e0619cdd..9f7c748a3b7 100644 --- a/features/steps/project/star.rb +++ b/features/steps/project/star.rb @@ -32,6 +32,6 @@ class Spinach::Features::ProjectStar < Spinach::FeatureSteps protected def has_n_stars(n) - expect(page).to have_css(".star-btn .count", text: n, visible: true) + expect(page).to have_css(".star-count", text: n, visible: true) end end -- cgit v1.2.1 From 8bbcbe78546beda04420e4403f7e6d42b38a55e4 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Wed, 23 Dec 2015 12:43:27 -0500 Subject: spacing changed from 4 to 2 in ` _clone_panel.html.haml`. --- app/views/shared/_clone_panel.html.haml | 42 ++++++++++++++++----------------- 1 file changed, 21 insertions(+), 21 deletions(-) diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml index 74e82af48c8..9edd1f0750e 100644 --- a/app/views/shared/_clone_panel.html.haml +++ b/app/views/shared/_clone_panel.html.haml @@ -1,27 +1,27 @@ - project = project || @project .git-clone-holder - .btn-group.clone-options - %a.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'} - %span - = default_clone_protocol.upcase - = icon('angle-down') - %ul.dropdown-menu.dropdown-menu-right.clone-options-dropdown - %li - %a{href: '#', "data-url" => @project.ssh_url_to_repo} - SSH - %li - %a{href: '#', "data-url" => @project.http_url_to_repo} - HTTPS + .btn-group.clone-options + %a.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'} + %span + = default_clone_protocol.upcase + = icon('angle-down') + %ul.dropdown-menu.dropdown-menu-right.clone-options-dropdown + %li + %a{href: '#', "data-url" => @project.ssh_url_to_repo} + SSH + %li + %a{href: '#', "data-url" => @project.http_url_to_repo} + HTTPS - = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true - .input-group-btn - = clipboard_button(clipboard_target: '#project_clone') + = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true + .input-group-btn + = clipboard_button(clipboard_target: '#project_clone') :javascript - $('ul.clone-options-dropdown a').on('click',function(e){ - e.preventDefault(); - var $this = $(this); - $('a.clone-dropdown-btn span').text($this.text()); - $('#project_clone').val($this.data('url')); - }); + $('ul.clone-options-dropdown a').on('click',function(e){ + e.preventDefault(); + var $this = $(this); + $('a.clone-dropdown-btn span').text($this.text()); + $('#project_clone').val($this.data('url')); + }); -- cgit v1.2.1 From 52293ccd65b1de8c2f70642d8146a09518258c47 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Wed, 23 Dec 2015 12:54:51 -0500 Subject: refactoring javascript to put starring functionality in a function --- app/views/projects/buttons/_star.html.haml | 43 +++++++++++++++++------------- 1 file changed, 24 insertions(+), 19 deletions(-) diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index 0f2ee119871..f92488fd88f 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -16,26 +16,31 @@ var $this = $(this); var $starSpan = $this.find('span'); var $starIcon = $this.find('i'); - $this - .parent() - .find('span.count') - .text(data.star_count); - if($starSpan.hasClass('starred')){ - $starSpan - .removeClass('starred') - .text('Star'); - $starIcon - .removeClass('fa-star') - .addClass('fa-star-o'); - } else { - $starSpan - .addClass('starred') - .text('Unstar'); - $starIcon - .removeClass('fa-star-o') - .addClass('fa-star'); - } + var toggleStar = function(isStarred) { + $this + .parent() + .find('span.count') + .text(data.star_count); + if(isStarred){ + $starSpan + .removeClass('starred') + .text('Star'); + $starIcon + .removeClass('fa-star') + .addClass('fa-star-o'); + + } else { + $starSpan + .addClass('starred') + .text('Unstar'); + $starIcon + .removeClass('fa-star-o') + .addClass('fa-star'); + } + }; + + toggleStar($starSpan.hasClass('starred')); }) .on('ajax:error', function (e, xhr, status, error) { new Flash('Star toggle failed. Try again later.', 'alert'); -- cgit v1.2.1 From 7ba4482fcf6faae162ceb920044f4ec07ef048af Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Wed, 23 Dec 2015 19:57:30 -0500 Subject: fixes failing test by updating project clone instructions --- app/assets/javascripts/project.js.coffee | 5 +++-- app/views/shared/_clone_panel.html.haml | 8 ++++---- features/project/create.feature | 1 + features/steps/project/create.rb | 10 ++++++---- 4 files changed, 14 insertions(+), 10 deletions(-) diff --git a/app/assets/javascripts/project.js.coffee b/app/assets/javascripts/project.js.coffee index 1f221945c06..d7a658f8faa 100644 --- a/app/assets/javascripts/project.js.coffee +++ b/app/assets/javascripts/project.js.coffee @@ -1,7 +1,7 @@ class @Project constructor: -> # Git protocol switcher - $('.js-protocol-switch').click -> + $('ul.clone-options-dropdown a').click -> return if $(@).hasClass('active') @@ -10,7 +10,8 @@ class @Project # Add the active class for the clicked button $(@).toggleClass('active') - url = $(@).data('clone') + url = $("#project_clone").val() + console.log("url",url) # Update the input field $('#project_clone').val(url) diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml index 9edd1f0750e..687a59c270f 100644 --- a/app/views/shared/_clone_panel.html.haml +++ b/app/views/shared/_clone_panel.html.haml @@ -2,16 +2,16 @@ .git-clone-holder .btn-group.clone-options - %a.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'} + %a#clone-dropdown.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'} %span = default_clone_protocol.upcase = icon('angle-down') %ul.dropdown-menu.dropdown-menu-right.clone-options-dropdown %li - %a{href: '#', "data-url" => @project.ssh_url_to_repo} + %a#ssh-selector{href: @project.ssh_url_to_repo} SSH %li - %a{href: '#', "data-url" => @project.http_url_to_repo} + %a#http-selector{href: @project.http_url_to_repo} HTTPS = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true @@ -23,5 +23,5 @@ e.preventDefault(); var $this = $(this); $('a.clone-dropdown-btn span').text($this.text()); - $('#project_clone').val($this.data('url')); + $('#project_clone').val($this.attr('href')); }); diff --git a/features/project/create.feature b/features/project/create.feature index a86079143e5..27136798e36 100644 --- a/features/project/create.feature +++ b/features/project/create.feature @@ -1,3 +1,4 @@ +@project-create Feature: Project Create In order to get access to project sections A user with ability to create a project diff --git a/features/steps/project/create.rb b/features/steps/project/create.rb index f90218f3791..0c247c83133 100644 --- a/features/steps/project/create.rb +++ b/features/steps/project/create.rb @@ -26,18 +26,20 @@ class Spinach::Features::ProjectCreate < Spinach::FeatureSteps end step 'I click on HTTP' do - click_button 'HTTP' + find('#clone-dropdown').click + find('#http-selector').click end step 'Remote url should update to http link' do - expect(page).to have_content "git remote add origin #{Project.last.http_url_to_repo}" + expect(page).to have_content Project.last.http_url_to_repo end step 'If I click on SSH' do - click_button 'SSH' + find('#clone-dropdown').click + find('#ssh-selector').click end step 'Remote url should update to ssh link' do - expect(page).to have_content "git remote add origin #{Project.last.url_to_repo}" + expect(page).to have_content Project.last.ssh_url_to_repo end end -- cgit v1.2.1 From 6592bfbb9ed37c348f257106c1da35692ef6a111 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Wed, 23 Dec 2015 20:36:29 -0500 Subject: Moves star code to a class --- app/assets/javascripts/star.js.coffee | 22 +++++++++++++++++++ app/views/projects/_home_panel.html.haml | 3 +++ app/views/projects/buttons/_star.html.haml | 35 ------------------------------ features/steps/project/create.rb | 4 ++-- 4 files changed, 27 insertions(+), 37 deletions(-) create mode 100644 app/assets/javascripts/star.js.coffee diff --git a/app/assets/javascripts/star.js.coffee b/app/assets/javascripts/star.js.coffee new file mode 100644 index 00000000000..d849b2e7950 --- /dev/null +++ b/app/assets/javascripts/star.js.coffee @@ -0,0 +1,22 @@ +class @Star + constructor: -> + $('.project-home-panel .toggle-star').on('ajax:success', (e, data, status, xhr) -> + $this = $(this) + $starSpan = $this.find('span') + $starIcon = $this.find('i') + + toggleStar = (isStarred) -> + $this.parent().find('span.count').text data.star_count + if isStarred + $starSpan.removeClass('starred').text 'Star' + $starIcon.removeClass('fa-star').addClass 'fa-star-o' + else + $starSpan.addClass('starred').text 'Unstar' + $starIcon.removeClass('fa-star-o').addClass 'fa-star' + return + + toggleStar $starSpan.hasClass('starred') + return + ).on 'ajax:error', (e, xhr, status, error) -> + new Flash('Star toggle failed. Try again later.', 'alert') + return \ No newline at end of file diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml index 4420861c9dc..e92115b9b98 100644 --- a/app/views/projects/_home_panel.html.haml +++ b/app/views/projects/_home_panel.html.haml @@ -38,3 +38,6 @@ = render 'projects/buttons/dropdown' = render 'projects/buttons/notifications' + +:coffeescript + new Star() \ No newline at end of file diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index f92488fd88f..21ba426aaa1 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -11,41 +11,6 @@ %span.count.star-count = @project.star_count - :javascript - $('.project-home-panel .toggle-star').on('ajax:success', function (e, data, status, xhr) { - var $this = $(this); - var $starSpan = $this.find('span'); - var $starIcon = $this.find('i'); - - var toggleStar = function(isStarred) { - $this - .parent() - .find('span.count') - .text(data.star_count); - if(isStarred){ - $starSpan - .removeClass('starred') - .text('Star'); - $starIcon - .removeClass('fa-star') - .addClass('fa-star-o'); - - } else { - $starSpan - .addClass('starred') - .text('Unstar'); - $starIcon - .removeClass('fa-star-o') - .addClass('fa-star'); - } - }; - - toggleStar($starSpan.hasClass('starred')); - }) - .on('ajax:error', function (e, xhr, status, error) { - new Flash('Star toggle failed. Try again later.', 'alert'); - }); - - else = link_to new_user_session_path, class: 'btn has_tooltip star-btn', title: 'You must sign in to star a project' do = icon('star fw') diff --git a/features/steps/project/create.rb b/features/steps/project/create.rb index 0c247c83133..8a0e8fc2b6c 100644 --- a/features/steps/project/create.rb +++ b/features/steps/project/create.rb @@ -31,7 +31,7 @@ class Spinach::Features::ProjectCreate < Spinach::FeatureSteps end step 'Remote url should update to http link' do - expect(page).to have_content Project.last.http_url_to_repo + expect(page).to have_content "git remote add origin #{Project.last.http_url_to_repo}" end step 'If I click on SSH' do @@ -40,6 +40,6 @@ class Spinach::Features::ProjectCreate < Spinach::FeatureSteps end step 'Remote url should update to ssh link' do - expect(page).to have_content Project.last.ssh_url_to_repo + expect(page).to have_content "git remote add origin #{Project.last.url_to_repo}" end end -- cgit v1.2.1 From a1294e5aabcfcc50423d78184b1bb34031754519 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Wed, 23 Dec 2015 20:39:42 -0500 Subject: fixes css spacing issues --- app/assets/stylesheets/pages/projects.scss | 54 +++++++++++++++--------------- 1 file changed, 27 insertions(+), 27 deletions(-) diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index c4275ef6c87..2894e935e8d 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -115,33 +115,33 @@ margin-left: 4px; .arrow { - &:before { - content: ''; - display: inline-block; - position: absolute; - width: 0; - height: 0; - border-color: transparent; - border-style: solid; - top: 50%; - left: 0; - margin-top: -6px; - border-width: 7px 5px 7px 0; - border-right-color: #dce0e5; - } - - &:after { - content: ''; - position: absolute; - width: 0; - height: 0; - border-color: transparent; - border-style: solid; - top: 50%; - left: 1px; - margin-top: -9px; - border-width: 10px 7px 10px 0; - border-right-color: #FFF; + &:before { + content: ''; + display: inline-block; + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + top: 50%; + left: 0; + margin-top: -6px; + border-width: 7px 5px 7px 0; + border-right-color: #dce0e5; + } + + &:after { + content: ''; + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + top: 50%; + left: 1px; + margin-top: -9px; + border-width: 10px 7px 10px 0; + border-right-color: #FFF; } } .count { -- cgit v1.2.1