add organization team-single page

This commit is contained in:
fuxiaohei 2014-07-07 18:13:42 +08:00
parent 63cc14062a
commit c127d84777
5 changed files with 250 additions and 32 deletions

View File

@ -201,6 +201,8 @@ func runWeb(*cli.Context) {
r.Post("/:org/teams/new", bindIgnErr(auth.CreateTeamForm{}), org.NewTeamPost) r.Post("/:org/teams/new", bindIgnErr(auth.CreateTeamForm{}), org.NewTeamPost)
r.Get("/:org/teams/:team/edit", org.EditTeam) r.Get("/:org/teams/:team/edit", org.EditTeam)
r.Get("/:org/team/:team",org.SingleTeam)
r.Get("/:org/settings", org.Settings) r.Get("/:org/settings", org.Settings)
r.Post("/:org/settings", bindIgnErr(auth.OrgSettingForm{}), org.SettingsPost) r.Post("/:org/settings", bindIgnErr(auth.OrgSettingForm{}), org.SettingsPost)
r.Post("/:org/settings/delete", org.DeletePost) r.Post("/:org/settings/delete", org.DeletePost)

View File

@ -408,28 +408,33 @@ body {
#repo-hooks-list .remove-hook { #repo-hooks-list .remove-hook {
color: #DD4B39; color: #DD4B39;
} }
#repo-collab-form .dropdown-menu { #repo-collab-form .dropdown-menu,
#org-team-content .header .dropdown-menu {
margin-left: 15px; margin-left: 15px;
margin-top: 4px; margin-top: 4px;
padding: 0; padding: 0;
} }
#repo-collab-form .dropdown-menu li { #repo-collab-form .dropdown-menu li,
#org-team-content .header .dropdown-menu li {
padding: 0 1em; padding: 0 1em;
line-height: 36px; line-height: 36px;
cursor: pointer; cursor: pointer;
font-weight: bold; font-weight: bold;
} }
#repo-collab-form .dropdown-menu li:hover { #repo-collab-form .dropdown-menu li:hover,
#org-team-content .header .dropdown-menu li:hover {
background-color: #e8f0ff; background-color: #e8f0ff;
} }
#repo-collab-form .dropdown-menu img { #repo-collab-form .dropdown-menu img,
#org-team-content .header .dropdown-menu img {
width: 28px; width: 28px;
height: 28px; height: 28px;
margin-right: 1em; margin-right: 1em;
vertical-align: middle; vertical-align: middle;
margin-top: -3px; margin-top: -3px;
} }
#repo-collab-form .dropdown-menu ul { #repo-collab-form .dropdown-menu ul,
#org-team-content .header .dropdown-menu ul {
margin-bottom: 0; margin-bottom: 0;
} }
#repo-hooks-list li { #repo-hooks-list li {
@ -1446,8 +1451,7 @@ body {
#footer { #footer {
background: #fff; background: #fff;
-webkit-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);
box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05); box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);;
;
height: 100px; height: 100px;
} }
#footer .footer-wrap { #footer .footer-wrap {
@ -1677,31 +1681,39 @@ body {
#org-members { #org-members {
margin-right: 30px; margin-right: 30px;
} }
#org-members .member .avatar img { #org-members .member .avatar img,
#org-team-members .member .avatar img {
width: 50px; width: 50px;
height: 50px; height: 50px;
} }
#org-members .member { #org-members .member,
#org-team-members .member {
padding-bottom: 20px; padding-bottom: 20px;
margin-bottom: 20px; margin-bottom: 20px;
border-bottom: 1px solid #DDD; border-bottom: 1px solid #DDD;
height: 70px; height: 70px;
} }
#org-members .member .name { #org-members .member .name,
#org-team-members .member .name {
padding-top: 4px; padding-top: 4px;
} }
#org-members .member .nick { #org-members .member .nick,
#org-team-members .member .nick {
display: block; display: block;
color: #888; color: #888;
} }
#org-members .member .name a { #org-members .member .name a,
#org-team-members .member .name a {
color: #444; color: #444;
} }
#org-members .member .name strong { #org-members .member .name strong,
#org-team-members .member .name strong {
font-size: 1.2em; font-size: 1.2em;
} }
#org-members .status, #org-members .status,
#org-members .role { #org-members .role,
#org-team-members .status,
#org-team-members .role {
line-height: 48px; line-height: 48px;
text-align: right; text-align: right;
} }
@ -1727,4 +1739,44 @@ body {
} }
#org-teams .org-team { #org-teams .org-team {
border-bottom: none; border-bottom: none;
}
#org-team-card {
border: 1px solid #CCC;
background-color: #FFF;
}
#org-team-card .meta .num {
font-weight: bold;
color: #444;
font-size: 1.2em;
}
#org-team-card .meta > div {
margin-bottom: 12px;
}
#org-team-card .meta a:hover {
text-decoration: none;
font-weight: bold;
}
#org-team-card .action a {
margin-right: 12px;
}
#org-team-card .action a:hover {
text-decoration: none;
}
#org-team-content .header {
height: 50px;
}
#org-team-content .header > form {
padding-right: 0;
}
#org-team-repos .repo{
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 1px solid #DDD;
padding-left: 15px;
}
#org-team-repos .repo-name{
font-size: 1.2em;
color: #444;
font-weight: bold;
line-height: 30px;
} }

View File

@ -301,6 +301,26 @@ var Gogits = {};
}).addClass("js-copy-bind"); }).addClass("js-copy-bind");
} }
// api working
Gogits.getUsers = function (val, $target) {
$.ajax({
url: '/api/v1/users/search?q=' + val,
dataType: "json",
success: function (json) {
if (json.ok && json.data.length) {
var html = '';
$.each(json.data, function (i, item) {
html += '<li><img src="' + item.avatar + '">' + item.username + '</li>';
});
$target.toggleShow();
$target.find('ul').html(html);
} else {
$target.toggleHide();
}
}
});
}
})(jQuery); })(jQuery);
// ajax utils // ajax utils
@ -733,22 +753,23 @@ function initRepoSetting() {
$this.next().toggleHide(); $this.next().toggleHide();
return; return;
} }
$.ajax({ Gogits.getUsers($this.val(), $this.next());
url: '/api/v1/users/search?q=' + $this.val(), /*$.ajax({
dataType: "json", url: '/api/v1/users/search?q=' + $this.val(),
success: function (json) { dataType: "json",
if (json.ok && json.data.length) { success: function (json) {
var html = ''; if (json.ok && json.data.length) {
$.each(json.data, function (i, item) { var html = '';
html += '<li><img src="' + item.avatar + '">' + item.username + '</li>'; $.each(json.data, function (i, item) {
}); html += '<li><img src="' + item.avatar + '">' + item.username + '</li>';
$this.next().toggleShow(); });
$this.next().find('ul').html(html); $this.next().toggleShow();
} else { $this.next().find('ul').html(html);
$this.next().toggleHide(); } else {
} $this.next().toggleHide();
} }
}); }
});*/
}).on('focus', function () { }).on('focus', function () {
if (!$(this).val()) { if (!$(this).val()) {
$(this).next().toggleHide(); $(this).next().toggleHide();
@ -771,14 +792,43 @@ function initRepoCreating() {
$(this).addClass("checked"); $(this).addClass("checked");
} }
// set button group to show clicked owner // set button group to show clicked owner
$('#repo-owner-avatar').attr("src",$(this).find('img').attr("src")); $('#repo-owner-avatar').attr("src", $(this).find('img').attr("src"));
$('#repo-owner-name').text($(this).text().trim()); $('#repo-owner-name').text($(this).text().trim());
console.log("set repo owner to uid :",uid,$(this).text().trim()); console.log("set repo owner to uid :", uid, $(this).text().trim());
}); });
}()); }());
console.log("init repo-creating scripts"); console.log("init repo-creating scripts");
} }
function initOrganization() {
(function(){
$('#org-team-add-user').on('keyup', function () {
var $this = $(this);
if (!$this.val()) {
$this.next().toggleHide();
return;
}
Gogits.getUsers($this.val(), $this.next());
}).on('focus', function () {
if (!$(this).val()) {
$(this).next().toggleHide();
}
}).next().on("click", 'li', function () {
$('#org-team-add-user').val($(this).text());
$('#org-team-add-user-form').submit();
}).toggleHide();
console.log("init script : add user to team");
}());
(function(){
$('#org-team-add-repo').next().toggleHide();
console.log("init script : add repository to team");
}());
console.log("init script : organization done");
}
(function ($) { (function ($) {
$(function () { $(function () {
initCore(); initCore();
@ -804,6 +854,9 @@ function initRepoCreating() {
if ($('#repo-create').length) { if ($('#repo-create').length) {
initRepoCreating(); initRepoCreating();
} }
if ($('#body-nav').hasClass("org-nav")) {
initOrganization();
}
}); });
})(jQuery); })(jQuery);

View File

@ -129,3 +129,8 @@ func EditTeam(ctx *middleware.Context, params martini.Params) {
ctx.Data["Title"] = "Organization " + params["org"] + " Edit Team" ctx.Data["Title"] = "Organization " + params["org"] + " Edit Team"
ctx.HTML(200, "org/edit_team") ctx.HTML(200, "org/edit_team")
} }
func SingleTeam(ctx *middleware.Context,params martini.Params){
ctx.Data["Title"] = "single-team"+params["org"]
ctx.HTML(200,"org/team")
}

106
templates/org/team.tmpl Normal file
View File

@ -0,0 +1,106 @@
{{template "base/head" .}}
{{template "base/navbar" .}}
<div id="body-nav" class="org-nav org-nav-auto">
<div class="container clearfix">
<div id="org-nav-wrapper">
<ul class="nav nav-pills pull-right">
<li><a href="#"><i class="fa fa-users"></i>Members
<span class="label label-default">5</span></a>
</li>
<li class="active"><a href="#"><i class="fa fa-tags"></i>Teams
<span class="label label-default">2</span></a>
</li>
</ul>
<img class="pull-left org-small-logo" src="https://avatars3.githubusercontent.com/u/6656686?s=140" alt="" width="60"/>
<div id="org-nav-info">
<h2 class="org-name">Organization Name</h2>
</div>
</div>
</div>
</div>
<div id="body" class="container">
<div id="org">
<div id="org-team">
<div id="org-team-card" class="col-md-3">
<h3 class="title">Team name</h3>
<p class="desc">team description</p>
<hr/>
<div class="meta">
<div class="col-md-6">
<a href="#"><span class="num"><strong>1</strong></span>
<br/>Member</a>
</div>
<div class="col-md-6">
<a href="#"><span class="num"><strong>1</strong></span>
<br/>Repository</a>
</div>
</div>
<hr style="width: 100%"/>
<div class="action">
<a href="#">
<button class="btn btn-danger">Leave</button>
</a>
<a href="#">
<button class="btn btn-success">Edit</button>
</a>
<a href="#">
<button class="btn btn-default">Setting</button>
</a>
</div>
<hr/>
<p>This team grants <strong>Push, Read & Clone</strong> access: members can read from and push to the team's repositories.</p>
</div>
<div id="org-team-content" class="col-md-9">
<div class="header">
<div class="header-tab col-md-4">
<div class="btn-group">
<a class="btn btn-primary" href="#">Members</a>
<a class="btn btn-default" href="#">Repositories</a>
</div>
</div>
<form id="org-team-add-user-form" action="url" class="col-md-4 pull-right open" method="post">
<input type="text" class="form-control" name="user" placeholder="add user to teams" id="org-team-add-user"/>
<div class="dropdown-menu">
<ul class="list-unstyled"></ul>
</div>
<input type="hidden" name="team" value="team-id"/>
</form>
</div>
<div class="content" id="org-team-members">
<div class="member">&nbsp;
<div class="avatar col-md-1">
<img src="https://avatars3.githubusercontent.com/u/2142787?s=140" alt="">
</div>
<div class="name col-md-4">
<a href="#"><strong>fuxiaohei</strong><span class="nick">傅小黑</span></a>
</div>
<a class="remove btn btn-danger pull-right" href="#">Remove</a>
</div>
</div>
<!---------------------- for ?member or ?repo ---------->
<div class="header">
<div class="header-tab col-md-4">
<div class="btn-group">
<a class="btn btn-default" href="#">Members</a>
<a class="btn btn-primary" href="#">Repositories</a>
</div>
</div>
<form id="org-team-add-repo-form" action="url" class="col-md-4 pull-right open" method="post">
<input type="text" class="form-control" name="repo" placeholder="add repository to teams" id="org-team-add-repo"/>
<div class="dropdown-menu">
<ul class="list-unstyled"></ul>
</div>
<input type="hidden" name="team" value="team-id"/>
</form>
</div>
<div class="content" id="org-team-repos">
<div class="repo">
<a href="#" class="repo-name"><i class="fa fa-book"></i> repo-name</a>
<a class="remove btn btn-danger pull-right" href="#">Remove</a>
</div>
</div>
</div>
</div>
</div>
</div>
{{template "base/footer" .}}