aiforge/templates/org/home.tmpl

{{template "base/head" .}}
<div class="organization profile">
	{{/* overflow: auto is the clearfix - this avoids the image going beyond
	the container where it is supposed to stay inside. */}}
	<div class="organization-info">
		<div class="ui center aligned container " style="overflow: auto">
			<img class="ui circular image" id="org-avatar" src="{{.Org.SizedRelAvatarLink 140}}"/>
			<div id="org-info">
				<div class="ui header">
					{{.Org.DisplayName}}
					{{if .IsOrganizationOwner}}<a class="middle text grey" href="{{.OrgLink}}/settings">{{svg "octicon-gear" 16}}</a>{{end}}
				</div>
				{{if .Org.Description}}<p class="text grey desc">{{.Org.Description}}</p>{{end}}
				<div class="meta">
					{{if .Org.Location}}<div class="item">{{svg "octicon-location" 16}} <span>{{.Org.Location}}</span></div>{{end}}
					{{if .Org.Website}}<div class="item">{{svg "octicon-link" 16}} <a target="_blank" rel="noopener noreferrer" href="{{.Org.Website}}">{{.Org.Website}}</a></div>{{end}}
				</div>
			</div>
		</div>
	</div>

	<div class="ui container">
		{{template "org/navber" .}}
		{{template "org/select_pro" .}}
		<div class="ui stackable grid">	
			
			<div class="ui sixteen wide computer column">
				<div class="ui mobile reversed stackable grid">
					<div class="ui sixteen wide tablet sixteen wide computer column margin-bottom20 pad-botom maxheight"  id='key_tag'>
						{{if .OrgTopics}}
							<a class="{{if eq $.Keyword "" }} tag_bg {{end}} tag_key ui small tag_lable topic omit"  href="{{$.Link}}?" onclick="iscontinueStatus()" id="tag_a">{{$.i18n.Tr "org.all_org_topics"}}</a>
						{{end}}

						{{range .OrgTopics}}
							{{if ne .Name ""}}
								<a  class="{{if eq $.Keyword .Name }} tag_bg {{end}} tag_key ui small tag_lable topic omit" href="{{$.Link}}?q={{.Name}}" onclick="iscontinueStatus()">
									{{.Name}}
								</a>
							{{end}}
						{{end}}
						{{if .OrgTopics}}
							<a  class=" tag_key ui small tag_lable topic omit icon_a" onclick="isUnfold()" id="icon_btn" >
								<i class="ri-arrow-down-s-line" style="display:inline-block;vertical-align:top"></i>
								&nbsp{{.i18n.Tr "org.unfold"}}	
							</a>
						{{end}}
					</div>
					
				</div>
			</div>
		</div>
		<div class="ui stackable grid">	
		
			<div class="ui sixteen wide computer column">
				<div class="ui mobile reversed stackable grid">
					<div class="ui ten wide tablet eleven wide computer column">
						<!-- {{if .CanCreateOrgRepo}}
							<div class="text right">
								<a class="ui green button" href="{{AppSubUrl}}/repo/create?org={{.Org.ID}}">{{.i18n.Tr "new_repo"}}</a>
							</div>
						{{end}} -->
						{{template "org/repo_list" .}}
						{{template "base/paginate" .}}
					</div>

					<div class="ui sixteen wide mobile six wide tablet five wide computer column">
						{{if .CanCreateOrgRepo}}
							<div class="text right">
								<a class="ui green button" href="{{AppSubUrl}}/repo/create?org={{.Org.ID}}">{{.i18n.Tr "new_repo"}}</a>
							</div>
						{{end}}
						<h4 class="ui top attached header" style="margin-top: 10px;">
							<strong>{{.i18n.Tr "org.people"}}</strong>
							<div class="ui right">
								<a class="text grey" href="{{.OrgLink}}/members">{{.MembersTotal}} {{svg "octicon-chevron-right" 16}}</a>
							</div>
							<!-- {{if .IsOrganizationMember}} -->
								
							<!-- {{end}} -->
						</h4>
						<div class="ui attached segment members">
							{{$isMember := .IsOrganizationMember}}
							{{range .Members}}
								{{if or $isMember (.IsPublicMember $.Org.ID)}}
									<a href="{{.HomeLink}}" title="{{.Name}}{{if .FullName}} ({{.FullName}}){{end}}"><img class="ui avatar" src="{{.RelAvatarLink}}"></a>
								{{end}}
							{{end}}
						</div>

						{{if .IsOrganizationMember}}
							<div class="ui top attached header">
								<strong>{{.i18n.Tr "org.teams"}}</strong>
								<div class="ui right">
									<a class="text grey" href="{{.OrgLink}}/teams"><span>{{.Org.NumTeams}}</span> {{svg "octicon-chevron-right" 16}}</a>
								</div>
							</div>
							<div class="ui attached table segment teams">
								{{range .Teams}}
									<div class="item">
										<a href="{{$.OrgLink}}/teams/{{.LowerName}}"><strong class="team-name">{{.Name}}</strong></a>
										<p class="text grey">
											<a href="{{$.OrgLink}}/teams/{{.LowerName}}"><strong>{{.NumMembers}}</strong> 
												{{if le .NumMembers 1}}
													{{$.i18n.Tr "org.lower_member"}}
												{{else}}
													{{$.i18n.Tr "org.lower_members"}}
												{{end}}
											</a> ·
											<a href="{{$.OrgLink}}/teams/{{.LowerName}}/repositories"><strong>{{.NumRepos}}</strong> 
												{{if le .NumRepos 1}}
													{{$.i18n.Tr "org.lower_repository"}}
												{{else}}
													{{$.i18n.Tr "org.lower_repositories"}}
												{{end}}
											</a>
										</p>
									</div>
								{{end}}
							</div>
							{{if .IsOrganizationOwner}}
								<div class="ui bottom attached segment">
									<a class="ui blue small button" href="{{.OrgLink}}/teams/new">{{.i18n.Tr "org.create_new_team"}}</a>
								</div>
							{{end}}
						{{end}}
					</div>
				</div>
			</div>
			
		</div>
	</div>
</div>
{{template "base/footer" .}}

<script>

	function isUnfold(){
		// var isTrue = document.getElementById("tag_a").getAttribute("data-tag")
		var isContain= document.querySelector("#key_tag").classList.contains("maxheight");
		if(isContain){			
			document.querySelector("#key_tag").classList.remove("maxheight");
			document.getElementById("icon_btn").innerHTML="<i class=\"ri-arrow-up-s-line\" style=\"display:inline-block;vertical-align:top\"></i> &nbsp {{.i18n.Tr "org.fold"}}"
			localStorage.setItem("isunfold",true)
		}else{
			document.querySelector("#key_tag").classList.add("maxheight");
			document.getElementById("icon_btn").innerHTML="<i class=\"ri-arrow-down-s-line\" style=\"display:inline-block;vertical-align:top\"></i> &nbsp {{.i18n.Tr "org.unfold"}}"
			localStorage.setItem("isunfold",false)
		}
	}

	function isShowIconBtn(){
		var key_height = document.getElementById("key_tag").offsetHeight
		var parent = document.getElementById("key_tag")
		var child = document.getElementById("icon_btn")
		if (key_height < 88){
			parent.removeChild(child)
		}
	}
	function iscontinueStatus(){
		var isunfold = localStorage.getItem("isunfold")
		if (isunfold == "true" || isunfold == true){
			document.querySelector("#key_tag").classList.remove("maxheight");
			document.getElementById("icon_btn").innerHTML="<i class=\"ri-arrow-up-s-line\" style=\"display:inline-block;vertical-align:top\"></i> &nbsp {{.i18n.Tr "org.fold"}}"
		}else{
			document.querySelector("#key_tag").classList.add("maxheight");
			document.getElementById("icon_btn").innerHTML="<i class=\"ri-arrow-down-s-line\" style=\"display:inline-block;vertical-align:top\"></i> &nbsp {{.i18n.Tr "org.unfold"}}"
		}	
	}

	if ({{.OrgTopics}}.length>0){
		isShowIconBtn()
		iscontinueStatus()
	}
	
</script>