add clone link in repo index page

public/css/gogs.css

@@ -575,6 +575,15 @@ html, body {
     min-width: 200px;
 }
 
+#gogs-repo-clone .dropdown-menu{
+    width: 400px;
+    padding: 20px;
+}
+
+#gogs-repo-clone .input-group{
+    margin-bottom: 15px;
+}
+
 /* #gogs-source */
 #gogs-source {
     margin-top: -20px;

public/js/app.js

@@ -63,6 +63,12 @@ var Gogits = {
         var $tabs = $('[data-init=tabs]');
         $tabs.find("li:eq(0) a").tab("show");
     };
+    // fix dropdown inside click
+    Gogits.initDropDown = function(){
+        $('.dropdown-menu').on('click','a,button,input,select',function(e){
+            e.stopPropagation();
+        });
+    };
 
     // render markdown
     Gogits.renderMarkdown = function () {
@@ -136,6 +142,7 @@ function initCore() {
     Gogits.initPopovers();
     Gogits.initTabs();
     Gogits.initModals();
+    Gogits.initDropDown();
     Gogits.renderMarkdown();
 }
 
@@ -181,18 +188,18 @@ function initUserSetting() {
 }
 
 function initRepository() {
-    // guide box script
+    // clone group button script
     (function () {
-        var $guide = $('.guide-box');
-        if ($guide.length) {
-            var $url = $('#guide-clone-url');
-            $guide.find('button[data-link]').on("click",function () {
+        var $clone = $('.clone-group-btn');
+        if ($clone.length) {
+            var $url = $('.clone-group-url');
+            $clone.find('button[data-link]').on("click",function (e) {
                 var $this = $(this);
                 if (!$this.hasClass('btn-primary')) {
-                    $guide.find('.btn-primary').removeClass('btn-primary').addClass("btn-default");
+                    $clone.find('.btn-primary').removeClass('btn-primary').addClass("btn-default");
                     $(this).addClass('btn-primary').removeClass('btn-default');
                     $url.val($this.data("link"));
-                    $guide.find('span.clone-url').text($this.data('link'));
+                    $clone.find('span.clone-url').text($this.data('link'));
                 }
             }).eq(0).trigger("click");
             // todo copy to clipboard

templates/repo/nav.tmpl

@@ -5,13 +5,32 @@
                 <h3 class="name"><i class="fa fa-book fa-lg"></i><a href="{{.Owner.HomeLink}}">{{.Owner.Name}}</a> / {{.Repository.Name}}</h3>
                 <p class="desc">{{.Repository.Description}}{{if .Repository.Website}}<a href="{{.Repository.Website}}">{{.Repository.Website}}</a>{{end}}</p>
             </div>
-            <div class="col-md-6 actions text-right">
+            <div class="col-md-6 actions text-right clone-group-btn">
                 {{if not .IsBareRepo}}
-                <div class="btn-group" id="gogs-repo-clone">
+                <!--<div class="btn-group" id="gogs-repo-clone">
                     <button type="button" class="btn btn-default"><i class="fa fa-download fa-lg fa-m"></i></button>
                     <button type="button" class="btn btn-default dropdown-toggle" data-container="body" data-toggle="popover" data-placement="bottom" data-content="<label>SSH:</label><div class='input-group'><input type='text' class='form-control' value='{{.CloneLink.SSH}}'></div>" data-html="1">
                         <span class="caret"></span>
                     </button>
+                </div>-->
+                <div class="btn-group" id="gogs-repo-clone">
+                    <button type="button" class="btn btn-default"><i class="fa fa-download fa-lg fa-m"></i></button>
+                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                        <span class="caret"></span>
+                    </button>
+                    <div class="dropdown-menu clone-group-btn dropdown-menu-right">
+                        <div class="input-group">
+                            <span class="input-group-btn">
+                                <button class="btn btn-default" data-link="{{.CloneLink.SSH}}" type="button">SSH</button>
+                                <button class="btn btn-default" data-link="{{.CloneLink.HTTPS}}" type="button">HTTPS</button>
+                            </span>
+                            <input type="text" class="form-control clone-group-url" value="" readonly/>
+                            <span class="input-group-btn">
+                                <button class="btn btn-default" type="button"><i class="fa fa-copy" data-toggle="tooltip" title="copy to clipboard" data-placement="top"></i></button>
+                            </span>
+                        </div>
+                        <p class="help-block text-center">Need help cloning? Visit <a href="#">Help</a>!</p>
+                    </div>
                 </div>
                 <div class="btn-group {{if .IsRepositoryWatching}}watching{{else}}no-watching{{end}}" id="gogs-repo-watching" data-watch="/{{.SignedUser.Name}}/{{.Repository.Name}}/action/watch" data-unwatch="/{{.SignedUser.Name}}/{{.Repository.Name}}/action/unwatch">
                     {{if .IsRepositoryWatching}}
@@ -21,9 +40,8 @@
                     {{end}}
                     <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                         <span class="caret"></span>
-                        <span class="sr-only">Toggle Dropdown</span>
                     </button>
-                    <div class="dropdown-menu" role="menu">
+                    <div class="dropdown-menu">
                         <div class="dropdown-item text-left to-unwatch">
                             <h4 role="presentation" class="dropdown-header {{if not .IsRepositoryWatching}}text-primary{{end}}">Not Watching</h4>
                             <p class="description">You only receive notifications for conversations in which you participate or are @mentioned.</p>
@@ -36,11 +54,11 @@
                     </div>
                 </div>
                 <div class="btn-group">
-                    <button type="button" class="btn btn-default"><i class="fa fa-star"></i>Star&nbsp;&nbsp;{{.Repository.NumStars}}</button>
+                    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Star"><i class="fa fa-star"></i>&nbsp;{{.Repository.NumStars}}</button>
                 </div>
                 {{end}}
                 <div class="btn-group">
-                    <a type="button" {{if not .IsRepositoryOwner}}href="/{{.Username}}/{{.Reponame}}/fork"{{end}} class="btn btn-default"><i class="fa fa-code-fork"></i>Fork&nbsp;&nbsp;{{.Repository.NumForks}}</a>
+                    <a type="button" {{if not .IsRepositoryOwner}}href="/{{.Username}}/{{.Reponame}}/fork"{{end}} class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Fork"><i class="fa fa-code-fork fa-lg"></i>&nbsp;{{.Repository.NumForks}}</a>
                 </div>
             </div>
         </div>

templates/repo/single_bare.tmpl

@@ -1,4 +1,4 @@
-<div class="panel panel-default guide-box">
+<div class="panel panel-default guide-box clone-group-btn">
     <div class="panel-heading guide-head">
         <h4>Quick Guide</h4>
     </div>
@@ -9,7 +9,7 @@
                 <button class="btn btn-default" data-link="{{.CloneLink.SSH}}" type="button">SSH</button>
                 <button class="btn btn-default" data-link="{{.CloneLink.HTTPS}}" type="button">HTTPS</button>
             </span>
-            <input type="text" class="form-control" id="guide-clone-url" value="" readonly/>
+            <input type="text" class="form-control clone-group-url" id="guide-clone-url" value="" readonly/>
             <span class="input-group-btn">
                 <button class="btn btn-default" type="button"><i class="fa fa-copy" data-toggle="tooltip" title="copy to clipboard" data-placement="top"></i></button>
             </span>