add issue label attach-detach ui

2 files changed, 57 insertions, 3 deletions

diff --git a/public/css/gogs.css b/public/css/gogs.css
index bfca9d83ee..e3d423a3dc 100755
--- a/public/css/gogs.css
+++ b/public/css/gogs.css
@@ -1502,7 +1502,7 @@ html, body {
     min-width: 160px;
 }
 
-#issue .issue-bar .assignee .dropdown-menu, #issue .issue-bar .milestone .dropdown-menu {
+#issue .issue-bar .assignee .dropdown-menu, #issue .issue-bar .milestone .dropdown-menu, #issue .issue-bar .labels .dropdown-menu {
     padding: 0;
     margin: 0;
 }
@@ -1549,9 +1549,9 @@ html, body {
     line-height: 30px;
 }
 
-#issue .issue-bar .assignee .action, #issue .issue-bar .milestone .action {
+#issue .issue-bar .assignee .action, #issue .issue-bar .milestone .action, #issue .issue-bar .labels .action {
     position: relative;
-    margin-top: -8px;
+    margin-top: -6px;
 }
 
 #issue .issue-bar .milestone .completion {
@@ -1575,6 +1575,48 @@ html, body {
     margin-right: 12px;
 }
 
+#issue .issue-bar .labels .label-item {
+    padding: 2px 12px 4px 12px;
+    border-radius: 2px;
+    text-shadow: 0 0 2px #444;
+}
+
+#issue .issue-bar .labels .label-white {
+    color: #FFF;
+}
+
+#issue .issue-bar .labels .label-black {
+    color: #444;
+}
+
+#issue .issue-bar .labels .dropdown-menu ul {
+    margin: 0;
+    width: 180px;
+}
+
+#issue .issue-bar .labels .dropdown-menu li {
+    line-height: 30px;
+    padding-left: 12px;
+    border-bottom: 1px solid #DDD;
+}
+
+#issue .issue-bar .labels .dropdown-menu li:hover {
+    background-color: #e8f0ff;
+    cursor: pointer;
+}
+
+#issue .issue-bar .labels .color {
+    display: inline-block;
+    width: 16px;
+    height: 16px;
+    vertical-align: text-top;
+    margin-right: 6px;
+}
+
+#issue .issue-bar .labels .no-checked .color {
+    margin-left: 26px;
+}
+
 /* wrapper and footer */
 
 #wrapper {
diff --git a/public/js/app.js b/public/js/app.js
index 53948578b9..e88dadc2e0 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -650,6 +650,18 @@ function initIssue() {
         $(this).parent().remove();
         return false;
     });
+    $('.issue-bar .labels .dropdown-menu').on('click', 'li', function (e) {
+        var url = $('.issue-bar .labels').data("ajax");
+        var id = $(this).data('id');
+        var check = $(this).hasClass("checked");
+        $.post(url, {id: id, action: check ? 'detach' : "attach"}, function (json) {
+            if (json.ok) {
+                window.location.reload();
+            }
+        });
+        e.stopPropagation();
+        return false;
+    })
 }
 
 function initRelease() {