Finish new organization members and invitation page

public/ng/css/gogs.css

@@ -1823,8 +1823,12 @@ textarea#issue-add-content {
 .invite-box {
   padding: 50px 0;
   min-height: 130px;
-  text-align: center;
+  margin: 0 auto;
+  width: 50%;
 }
 .invite-box input {
-  width: 250px;
+  width: 300px;
+}
+#org-member-list-block {
+  padding-top: 2px;
 }

public/ng/js/gogs.js

@@ -329,6 +329,28 @@ function initOrgSetting() {
     });
 }
 
+function initInvite() {
+    // Invitation.
+    var $ul = $('#org-member-invite-list');
+    $('#org-member-invite').on('keyup', function () {
+        var $this = $(this);
+        if (!$this.val()) {
+            $ul.toggleHide();
+            return;
+        }
+        Gogs.searchUsers($this.val(), $ul);
+    }).on('focus', function () {
+        if (!$(this).val()) {
+            $ul.toggleHide();
+        } else {
+            $ul.toggleShow();
+        }
+    }).next().next().find('ul').on("click", 'li', function () {
+        $('#org-member-invite').val($(this).text());
+        $ul.toggleHide();
+    });
+}
+
 $(document).ready(function () {
     initCore();
     if ($('#user-profile-setting').length) {
@@ -343,6 +365,9 @@ $(document).ready(function () {
     if ($('#org-setting').length) {
         initOrgSetting();
     }
+    if ($('#invite-box').length) {
+        initInvite();
+    }
 
     Tabs('#dashboard-sidebar-menu');
 

public/ng/less/gogs/organization.less

@@ -150,8 +150,12 @@
 .invite-box {
 	padding: 50px 0;
 	min-height: 130px;
-	text-align: center;
+	margin: 0 auto;
+	width: 50%;
 	input {
-		width: 250px;
+		width: 300px;
 	}
 }
+#org-member-list-block {
+	padding-top: 2px;
+}

templates/org/invite.tmpl

@@ -2,13 +2,16 @@
 {{template "ng/base/header" .}}
 {{template "org/header" .}}
 <div class="container">
-	<div class="invite-box">
+	<div class="invite-box" id="invite-box">
     	{{template "ng/base/alert" .}}
 		<h3>{{.i18n.Tr "org.members.invite_desc" .Org.FullName}}</h3>
-		<form action="{{.OrgLink}}/invitations/new" method="post">
+		<form id="invite-member-form" action="{{.OrgLink}}/invitations/new" method="post">
 			{{.CsrfTokenHtml}}
-			<input class="ipt ipt-large ipt-radius" name="uname" required>
+			<input class="ipt ipt-large ipt-radius" id="org-member-invite" name="uname" autocomplete="off" required>
 			<button class="btn btn-blue btn-large btn-radius">{{.i18n.Tr "org.members.invite_now"}}</button>
+			<div id="org-member-list-block">
+				<ul class="menu-down-show menu-vertical menu-radius switching-list user-list" id="org-member-invite-list"></ul>
+			</div>
 		</form>
 	</div>
 </div>