<commit_before><!DOCTYPE html>
<html lang="en" ng-app="teamform-event-app">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="keywords" content="teamform, team">
  <!-- The meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <title>teamform - event page</title>

  <!-- libraries and CSS 	  
		JQuery: Necessary for some bootstrap interactions (v1.12.4 is used)		
		Bootstrap: Library and CSS for bootstrap framework (v3.3.7 is used)
		Font-awesome: More icons for the web development (v4.6.3 is used)		
		site.css: A customized css for our web application. Not from any web framework. 
	  -->

  <script src="lib/jquery.min.js"></script>
  <script src="lib/bootstrap.min.js"></script>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
  <!--  <link rel="stylesheet" href="css/site.css"> -->


  <!-- Customized libraries shared by pages -->
  <script src="js/site.js"></script>
  <link rel="stylesheet" href="css/custom.css">
  <style>
    .table {
      width: 50%;
      margin-left: auto;
      margin-right: auto;
      max-width: 60%;
    }
  </style>
</head>



<body ng-controller="EventCtrl">
  <div id="load_screen">
    <div id="loading" class="text-center"> <img src="img/loading.gif">loading ... </div>
  </div>
  <div ng-include="'navbar.html'" id='navbarMenu'></div>
  <div>
    <section style="background-image: url('img/img1_thin.jpg');" class="banner img-responsive">
      <br><br><br><br><br>
      <h1 class="pull-left banner_title">{{param.eventName}} Event Page</h1>
        <div class="col-md-12">
         <div class="col-md-4"></div>
        <ul class="nav nav-tabs">
          <li class="active"><a data-toggle="tab" href="#home">Home</a></li>
          <li><a data-toggle="tab" href="#menu1">Announcements</a></li>
          <li><a data-toggle="tab" href="#menu2">Teams</a></li>
          <li><a data-toggle="tab" href="#menu3">WaitList</a></li>
           <li><a data-toggle="tab" href="#menu4">Invites</a></li>
        </ul>
          <div class="tab-content text-center" style="min-height:300px;">
            <div id="home" class="tab-pane fade in active">
              <center>
                <br>
              <div class="alert alert-success" style="width:50%;" ng-show="(deadline-today)>0">
                <h2 ng-hide="isJoin">Join this event now!</h2>
                <button id="btn_join" type="button" class="btn btn-success" ng-click="joinEvent()" ng-hide="isJoin">Join Event</button>
                <h2 ng-show="isJoin">You have joined this event.</h2>
                <button id="btn_join" type="button" class="btn btn-success" ng-click="quitEvent()" ng-show="isJoin">Quit Event</button>
              </div>
              </center>
      
      <!--join event: You will be on the waiting list of member. If cannot join a team before deadline, admin will assign you to a team according your preference.-->
     
      
      <!-- create team button -->
    <!--  <button id="btn_createTeam" type="button" class="btn btn-primary" ng-click="createTeam('default')">Create teams</button>
    -->
       

      <div ng-hide="(deadline-today)>0">
        <center>
          <br>
      <div style="width:50%;" class="alert alert-warning " >
         Registration is closed, you cannot join / quit this event now.
      </div>
        </center>
      </div>
      <!--<span class="row" >Registration is closed, you cannot join/quit this event now.</span>-->
      <div id="event_description_div" class="row">
        <div ng-include="'description.html'"></div>
      </div>
             
        </div>
        <div id="menu1" class="tab-pane fade">
          <div class=" col-md-12">
            <br><br>
          <h2 style="display:inline;vertical-align: middle;" class="text-center">Announcements</h2> &nbsp;&nbsp;
          <button type="button" class="btn btn-basic">
            <span class="glyphicon glyphicon-collapse-up" data-toggle="collapse" data-target="#announcement_div"></span>
        </button>
        </div>
        <br><br>
        <!--announcement div-->
        <div id="announcement_div">
          <div ng-include="'readAnn.html'"></div>
        </div>
        <!--end of announcement div-->
            </div>
            <div id="menu2" class="tab-pane fade">
            <div class="row">
          <center>
            <br>
            <h2>Teams</h2>
            <span>
          <h4 style="display:inline;vertical-align: middle;">Create your own team and be a leader</h4>
           <button ng-show="(deadline-today)>0" id="create_team_page_btn_visibility" type="button" class="btn btn-primary" ng-click="showTeamForm()"><span class="glyphicon glyphicon-plus" aria-label="new announcement"></span></button>
            </span>
            <div id="create_team_page_visibility">
              <div class="row">
                <div class="col-md-3 col-xs-2"></div>
                <div class="custom_center_box row col-md-6 text-left">
                  <form name="teamForm" class="css-form " novalidate>
                    <div class="form-group">
                      <label>Admin: &nbsp;</label><a href="profile.html?q={{param.admin}}">{{adminName}}</a><br>
                      <label>Team Name*:</label>
                      <div class="col-md-12"><input class="form-control ng-dirty ng-invalid ng-valid" type="text" name="userName" placeholder="Please enter team name:"
                          ng-model="nextTeamName" required>
                        <br>
                      </div>

                    </div>

                    <div class="form-group">
                      <br>
                      <label>Team Description:</label>
                      <div class="col-md-12"> <textarea class="form-control ng-dirty ng-invalid ng-valid" type="textarea" placeholder="Please enter team Description:"
                          ng-model="teamDescription" required></textarea>
                        <br>
                      </div>
                    </div>

                    <div class="form-group">
                      <br>
                      <label>Preferred Team Size:</label>
                      <span class="badge">{{preferredTeamSize}}</span>
                      <button ng-click="changePreferredTeamSize(-1);"><span class="glyphicon glyphicon-minus" ></span></button>
                      <button ng-click="changePreferredTeamSize(1);"><span class="glyphicon glyphicon-plus" ></span></button>


                    </div>

                    <div class="form-group">

                      <label>Preferred Lauguage:</label>
                      <ol>
                        <li style="cursor: pointer" ng-repeat='pre in preference'>{{pre}}&nbsp;&nbsp;<a ng-click="removePre(pre)"><span class="glyphicon glyphicon-trash"></span></a></li>
                      </ol>
                      <div class="row">
                        <div class="col-md-12">
                          <span class="col-md-10"> <input class="form-control" type="text" ng-model='addpreference'>
      
                  </span>
                          <span class="col-md-2"><button type="button" class="btn btn-primary" ng-click="addPre()">Add</button>
                  </span>
                        </div>
                      </div>
                    </div>
                    <div class="row text-center">
                      <button id="btn_createTeam" type="button" class="btn btn-default" ng-click="hideTeamForm()">Cancel</button>
                      <button id="btn_createTeam" type="button" class="btn btn-success" ng-click="createTeam()">Create</button>
                    </div>
                  </form>
                </div>
                <div class="col-md-2 col-xs-2"></div>
              </div>
            </div>
            <!--<button class="btn btn-primary" ng-click="filterByName()">Search</button>-->
          </center>
        </div>
                <!--teams list-->
        <div class="col-md-12">
          <!--not suggest list-->
          <!--skip below line since action buttons is too long-->
          <!--<div class="col-md-2"></div>-->
          <!--<div class="col-md-12">-->
          <h3 ng-show="suggested_team_visibility">Suggested Team by your Perference:</h3>
          <table id="teamsList" class="table table-hover" style="text-align:left;width:60%;font-size:16px;">
            <thead>
              <tr>
                <th style="min-width:30%;">Team Name</th>
                <th style="min-width:10%;">Team Leader</th>
                <th style="min-width:20%;">Team members</th>
                <th style="min-width:10%;">Preference</th>
                <th style="min-width:30%;" ng-show="(deadline-today)>0">Action</th>
              </tr>
            </thead>
            <!-- this table is used to show filtered result since ng-hide cannot use in the previous table -->
            <tbody ng-show="suggested_team_visibility" ng-repeat="t in filtedUsers">
              <div>
                <!--ng-show="filter(t)">-->
                <tr>
                  <td> <a style="cursor: pointer" ng-click="enterTeam(t.$id)">{{t.teamName}}</a></td>
                  <td><a href="profile.html?q={{t.teamLeader}}">{{t.teamLeaderName}}</a></td>
                  <td>
                    <span ng-repeat="member in t.members">
                                  <a href="profile.html?q={{member.memberID}}">{{member.memberName}}</a>{{$last ? '' : ', '}}
                        </span>
                  </td>
                  <td>{{t.preference}}</td>
                  <!-- enter the team button moved to table
                      <td><button id="btnEnterTeam" type="button" class="btn btn-primary" ng-click="enterTeam(t.$id)">Detail of this team</button></td>
                      -->
                  <td ng-show="(deadline-today)>0"><button id="btnJoinTeam" type="button" class="btn btn-danger" ng-click="joinTeam(t.$id)">Join directly</button></td>
                  <!--this will remove after we finish request to join team properly-->
                  <td ng-show="(deadline-today)>0"><button id="btnRequestJoinTeam" type="button" class="btn btn-primary" ng-click="requestJoinTeam(t.$id)">Request to join</button></td>
                </tr>
              </div>
            </tbody>

          </table>

          <br><br>
            <h4>Search team by team name :   <input type="text" class="input-lg" ng-model="filterName"></h4>
            
            <br><br>
          <h3>All teams:</h3>
          <!--<div ng-include="'teamList.html'" id="teamList"></div>-->
          <table ng-show="noFiltedTeam_visibility" id="teamsList" class="table table-hover" style="text-align:left;width:60%;font-size:16px;">
            <thead>
              <tr>
                <th style="min-width:30%;">Team Name</th>
                <th style="min-width:10%;">Team Leader</th>
                <th style="min-width:20%;">Team members</th>
                <th style="min-width:10%;">Preference</th>
                <th style="min-width:30%;" ng-show="(deadline-today)>0">Action</th>
              </tr>
            </thead>
            <tbody ng-repeat="t in teams | filter: filterName" ng-init="getUserNameInTeam(t)">
              <div>
                <!--ng-show="filter(t)">-->
                <tr>

                  <td><a style="cursor: pointer" ng-click="enterTeam(t.$id)">{{t.teamName}}</a></td>

                  <td><a href="profile.html?q={{t.teamLeader}}">{{t.teamLeaderName}}</a></td>
                  <td>
                    <span ng-repeat="member in t.members">
                                  <a href="profile.html?q={{member.memberID}}">{{member.memberName}}</a>{{$last ? '' : ', '}}
                        </span>
                  </td>
                  <td>{{t.preference}}</td>
                  <!-- enter the team button moved to table
                      <td><button id="btnEnterTeam" type="button" class="btn btn-primary" ng-click="enterTeam(t.$id)">Detail of this team</button></td>
                      -->
                  <td ng-show="(deadline-today)>0"><button id="btnJoinTeam" type="button" class="btn btn-danger" ng-click="joinTeam(t.$id)">Join directly</button></td>
                  <!--this will remove after we finish request to join team properly-->
                  <td ng-show="(deadline-today)>0"><button id="btnRequestJoinTeam" type="button" class="btn btn-primary" ng-click="requestJoinTeam(t.$id)">Request to join</button></td>
                </tr>
              </div>
            </tbody>

            <!-- this table is used to show filtered result since ng-hide cannot use in the previous table -->
          </table>

          <h3 ng-hide="noFiltedTeam_visibility">Search Result:</h3>

          <!--</div>-->
          <!--<div class="col-md-2"></div>-->
        </div>
        <!--end of teams list-->
            </div>
            <div id="menu3" class="tab-pane fade">
            <div class="col-md-12">
          <center>
            <br>
            <h2>Members Without Groups</h2>
          </center>
          <!--<div ng-include="'teamList.html'" id="teamList"></div>-->

          <div ng-hide="teamsList.length == 0">
            <table id="teamsList" class="table table-striped table-hover text-center" ng-hide="waitList.length == 0" style="font-size:16px;">
              <thead>
                <tr>
                  <th class="text-center">Name</th>
                  <!--<th>uid</th>-->
                  <th class="text-center">Preference</th>
                </tr>
              </thead>

              <tbody ng-repeat="member in waitList" ng-init="getUserDatabyID(member)">
                <tr>
                  <td><a href="profile.html?q={{member.uid}}">{{member.name}}</a></td>
                  <!--<td>{{member.uid}}</td>-->
                  <td>
                    <span ng-repeat="p in member.preference">{{p}}{{$last ? '' : ', '}}
                  </span>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>

          <center>
            <p ng-show="waitList.length ==0" style="font-size:16px;">No one is on the waitlist.</p>
          </center>
        </div>
            </div>
            <div id="menu4" class="tab-pane fade">
              <div ng-show="(deadline-today)<=0">
                <br>
                <h2>Invite List</h2>
                <p style="font-size:16px;">Registration is closed.</p>
              </div>
        <div ng-show="(deadline-today)>0">
          <br>
          <h2>Invite List</h2>
          <div ng-show="inviteTeamsLength ==4" style="font-size:16px;">You have not been invited yet. You can request teams below.</div>
          <div ng-hide="inviteTeamsLength ==4">
            <table id="inviteList" class="table table-hover" style="font-size:16px;">
              <thead>
                <tr>
                  <th>Team Name</th>
                  <th>Team Leader</th>
                  <th>Team members</th>
                  <th>Preference</th>
                  <th ng-show="(deadline-today)>0">Action</th>
                </tr>
              </thead>
              <!--<tbody ng-repeat="iT in inviteTeams">-->
              <tbody ng-repeat="(teamid, iT) in inviteTeams">
                <tr>
                  <td>{{iT.teamName}}</td>
                  <td><a href="profile.html?q={{iT.teamLeader}}">{{iT.teamLeaderName}}</a></td>
                  <td>
                    <span ng-repeat="member in iT.members">
                      <a href="profile.html?q={{member.memberID}}">{{member.memberName}}</a>{{$last ? '' : ', '}}
                    </span>
                  </td>
                  <td>{{iT.preference}}</td>
                  <td ng-show="(deadline-today)>0">
                    <button id="btn_acceptInvite" ng-click="acceptInvite(teamid)">Accept</button>
                    <button id="btn_rejectInvite" ng-click="rejectInvite(teamid)">Reject</button>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
            </div>
          </div>
        </div>
    </section>
  </div>
  <br>
  <div class="container">
    <div class="text-center">
  

      <br><br>

      <div id="event_page_controller">








      </div>
      <!--end of teams & member list-->
    </div>


    <!-- FOOTER -->
    <div class="col-md-12">
      <hr>
      <footer>
        <p class="pull-right"><a style="cursor: pointer" ng-click="scrollToTop()">Back to top</a></p>
        <p>&copy; 2016 &nbsp;<i>418 I'm a Teapot </i></p>
        <p>Powered by <a href="http://getbootstrap.com/" target="_blank">Bootstrap</a></p>
      </footer>
    </div>
  </div>
  <!-- JavaScript of this page -->

  <!-- Angular and Angular-route libraries (v1.5.7) -->
  <script src="lib/angular.min.js"></script>
  <script src="lib/angular-route.min.js"></script>

  <!-- Firebase (v3.0.3) and AngularFire (v2.0.0) (after angular library is loaded) -->
  <script src="lib/firebase.js"></script>
  <script src="lib/angularfire.min.js"></script>

  <script src="js/event.js"></script>

</body>

</html><commit_msg>commented Join Directly out<commit_after><!DOCTYPE html>
<html lang="en" ng-app="teamform-event-app">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="keywords" content="teamform, team">
  <!-- The meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <title>teamform - event page</title>

  <!-- libraries and CSS 	  
		JQuery: Necessary for some bootstrap interactions (v1.12.4 is used)		
		Bootstrap: Library and CSS for bootstrap framework (v3.3.7 is used)
		Font-awesome: More icons for the web development (v4.6.3 is used)		
		site.css: A customized css for our web application. Not from any web framework. 
	  -->

  <script src="lib/jquery.min.js"></script>
  <script src="lib/bootstrap.min.js"></script>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
  <!--  <link rel="stylesheet" href="css/site.css"> -->


  <!-- Customized libraries shared by pages -->
  <script src="js/site.js"></script>
  <link rel="stylesheet" href="css/custom.css">
  <style>
    .table {
      width: 50%;
      margin-left: auto;
      margin-right: auto;
      max-width: 60%;
    }
  </style>
</head>



<body ng-controller="EventCtrl">
  <div id="load_screen">
    <div id="loading" class="text-center"> <img src="img/loading.gif">loading ... </div>
  </div>
  <div ng-include="'navbar.html'" id='navbarMenu'></div>
  <div>
    <section style="background-image: url('img/img1_thin.jpg');" class="banner img-responsive">
      <br><br><br><br><br>
      <h1 class="pull-left banner_title">{{param.eventName}} Event Page</h1>
        <div class="col-md-12">
         <div class="col-md-4"></div>
        <ul class="nav nav-tabs">
          <li class="active"><a data-toggle="tab" href="#home">Home</a></li>
          <li><a data-toggle="tab" href="#menu1">Announcements</a></li>
          <li><a data-toggle="tab" href="#menu2">Teams</a></li>
          <li><a data-toggle="tab" href="#menu3">WaitList</a></li>
           <li><a data-toggle="tab" href="#menu4">Invites</a></li>
        </ul>
          <div class="tab-content text-center" style="min-height:300px;">
            <div id="home" class="tab-pane fade in active">
              <center>
                <br>
              <div class="alert alert-success" style="width:50%;" ng-show="(deadline-today)>0">
                <h2 ng-hide="isJoin">Join this event now!</h2>
                <button id="btn_join" type="button" class="btn btn-success" ng-click="joinEvent()" ng-hide="isJoin">Join Event</button>
                <h2 ng-show="isJoin">You have joined this event.</h2>
                <button id="btn_join" type="button" class="btn btn-success" ng-click="quitEvent()" ng-show="isJoin">Quit Event</button>
              </div>
              </center>
      
      <!--join event: You will be on the waiting list of member. If cannot join a team before deadline, admin will assign you to a team according your preference.-->
     
      
      <!-- create team button -->
    <!--  <button id="btn_createTeam" type="button" class="btn btn-primary" ng-click="createTeam('default')">Create teams</button>
    -->
       

      <div ng-hide="(deadline-today)>0">
        <center>
          <br>
      <div style="width:50%;" class="alert alert-warning " >
         Registration is closed, you cannot join / quit this event now.
      </div>
        </center>
      </div>
      <!--<span class="row" >Registration is closed, you cannot join/quit this event now.</span>-->
      <div id="event_description_div" class="row">
        <div ng-include="'description.html'"></div>
      </div>
             
        </div>
        <div id="menu1" class="tab-pane fade">
          <div class=" col-md-12">
            <br><br>
          <h2 style="display:inline;vertical-align: middle;" class="text-center">Announcements</h2> &nbsp;&nbsp;
          <button type="button" class="btn btn-basic">
            <span class="glyphicon glyphicon-collapse-up" data-toggle="collapse" data-target="#announcement_div"></span>
        </button>
        </div>
        <br><br>
        <!--announcement div-->
        <div id="announcement_div">
          <div ng-include="'readAnn.html'"></div>
        </div>
        <!--end of announcement div-->
            </div>
            <div id="menu2" class="tab-pane fade">
            <div class="row">
          <center>
            <br>
            <h2>Teams</h2>
            <span>
          <h4 style="display:inline;vertical-align: middle;">Create your own team and be a leader</h4>
           <button ng-show="(deadline-today)>0" id="create_team_page_btn_visibility" type="button" class="btn btn-primary" ng-click="showTeamForm()"><span class="glyphicon glyphicon-plus" aria-label="new announcement"></span></button>
            </span>
            <div id="create_team_page_visibility">
              <div class="row">
                <div class="col-md-3 col-xs-2"></div>
                <div class="custom_center_box row col-md-6 text-left">
                  <form name="teamForm" class="css-form " novalidate>
                    <div class="form-group">
                      <label>Admin: &nbsp;</label><a href="profile.html?q={{param.admin}}">{{adminName}}</a><br>
                      <label>Team Name*:</label>
                      <div class="col-md-12"><input class="form-control ng-dirty ng-invalid ng-valid" type="text" name="userName" placeholder="Please enter team name:"
                          ng-model="nextTeamName" required>
                        <br>
                      </div>

                    </div>

                    <div class="form-group">
                      <br>
                      <label>Team Description:</label>
                      <div class="col-md-12"> <textarea class="form-control ng-dirty ng-invalid ng-valid" type="textarea" placeholder="Please enter team Description:"
                          ng-model="teamDescription" required></textarea>
                        <br>
                      </div>
                    </div>

                    <div class="form-group">
                      <br>
                      <label>Preferred Team Size:</label>
                      <span class="badge">{{preferredTeamSize}}</span>
                      <button ng-click="changePreferredTeamSize(-1);"><span class="glyphicon glyphicon-minus" ></span></button>
                      <button ng-click="changePreferredTeamSize(1);"><span class="glyphicon glyphicon-plus" ></span></button>


                    </div>

                    <div class="form-group">

                      <label>Preferred Lauguage:</label>
                      <ol>
                        <li style="cursor: pointer" ng-repeat='pre in preference'>{{pre}}&nbsp;&nbsp;<a ng-click="removePre(pre)"><span class="glyphicon glyphicon-trash"></span></a></li>
                      </ol>
                      <div class="row">
                        <div class="col-md-12">
                          <span class="col-md-10"> <input class="form-control" type="text" ng-model='addpreference'>
      
                  </span>
                          <span class="col-md-2"><button type="button" class="btn btn-primary" ng-click="addPre()">Add</button>
                  </span>
                        </div>
                      </div>
                    </div>
                    <div class="row text-center">
                      <button id="btn_createTeam" type="button" class="btn btn-default" ng-click="hideTeamForm()">Cancel</button>
                      <button id="btn_createTeam" type="button" class="btn btn-success" ng-click="createTeam()">Create</button>
                    </div>
                  </form>
                </div>
                <div class="col-md-2 col-xs-2"></div>
              </div>
            </div>
            <!--<button class="btn btn-primary" ng-click="filterByName()">Search</button>-->
          </center>
        </div>
                <!--teams list-->
        <div class="col-md-12">
          <!--not suggest list-->
          <!--skip below line since action buttons is too long-->
          <!--<div class="col-md-2"></div>-->
          <!--<div class="col-md-12">-->
          <h3 ng-show="suggested_team_visibility">Suggested Team by your Perference:</h3>
          <table id="teamsList" class="table table-hover" style="text-align:left;width:60%;font-size:16px;">
            <thead>
              <tr>
                <th style="min-width:30%;">Team Name</th>
                <th style="min-width:10%;">Team Leader</th>
                <th style="min-width:20%;">Team members</th>
                <th style="min-width:10%;">Preference</th>
                <th style="min-width:30%;" ng-show="(deadline-today)>0">Action</th>
              </tr>
            </thead>
            <!-- this table is used to show filtered result since ng-hide cannot use in the previous table -->
            <tbody ng-show="suggested_team_visibility" ng-repeat="t in filtedUsers">
              <div>
                <!--ng-show="filter(t)">-->
                <tr>
                  <td> <a style="cursor: pointer" ng-click="enterTeam(t.$id)">{{t.teamName}}</a></td>
                  <td><a href="profile.html?q={{t.teamLeader}}">{{t.teamLeaderName}}</a></td>
                  <td>
                    <span ng-repeat="member in t.members">
                                  <a href="profile.html?q={{member.memberID}}">{{member.memberName}}</a>{{$last ? '' : ', '}}
                        </span>
                  </td>
                  <td>{{t.preference}}</td>
                  <!-- enter the team button moved to table
                      <td><button id="btnEnterTeam" type="button" class="btn btn-primary" ng-click="enterTeam(t.$id)">Detail of this team</button></td>
                      -->
                  <!--<td ng-show="(deadline-today)>0"><button id="btnJoinTeam" type="button" class="btn btn-danger" ng-click="joinTeam(t.$id)">Join directly</button></td>-->
                  <!--this will remove after we finish request to join team properly-->
                  <td ng-show="(deadline-today)>0"><button id="btnRequestJoinTeam" type="button" class="btn btn-primary" ng-click="requestJoinTeam(t.$id)">Request to join</button></td>
                </tr>
              </div>
            </tbody>

          </table>

          <br><br>
            <h4>Search team by team name :   <input type="text" class="input-lg" ng-model="filterName"></h4>
            
            <br><br>
          <h3>All teams:</h3>
          <!--<div ng-include="'teamList.html'" id="teamList"></div>-->
          <table ng-show="noFiltedTeam_visibility" id="teamsList" class="table table-hover" style="text-align:left;width:60%;font-size:16px;">
            <thead>
              <tr>
                <th style="min-width:30%;">Team Name</th>
                <th style="min-width:10%;">Team Leader</th>
                <th style="min-width:20%;">Team members</th>
                <th style="min-width:10%;">Preference</th>
                <th style="min-width:30%;" ng-show="(deadline-today)>0">Action</th>
              </tr>
            </thead>
            <tbody ng-repeat="t in teams | filter: filterName" ng-init="getUserNameInTeam(t)">
              <div>
                <!--ng-show="filter(t)">-->
                <tr>

                  <td><a style="cursor: pointer" ng-click="enterTeam(t.$id)">{{t.teamName}}</a></td>

                  <td><a href="profile.html?q={{t.teamLeader}}">{{t.teamLeaderName}}</a></td>
                  <td>
                    <span ng-repeat="member in t.members">
                                  <a href="profile.html?q={{member.memberID}}">{{member.memberName}}</a>{{$last ? '' : ', '}}
                        </span>
                  </td>
                  <td>{{t.preference}}</td>
                  <!-- enter the team button moved to table
                      <td><button id="btnEnterTeam" type="button" class="btn btn-primary" ng-click="enterTeam(t.$id)">Detail of this team</button></td>
                      -->
                  <!--<td ng-show="(deadline-today)>0"><button id="btnJoinTeam" type="button" class="btn btn-danger" ng-click="joinTeam(t.$id)">Join directly</button></td>-->
                  <!--this will remove after we finish request to join team properly-->
                  <td ng-show="(deadline-today)>0"><button id="btnRequestJoinTeam" type="button" class="btn btn-primary" ng-click="requestJoinTeam(t.$id)">Request to join</button></td>
                </tr>
              </div>
            </tbody>

            <!-- this table is used to show filtered result since ng-hide cannot use in the previous table -->
          </table>

          <h3 ng-hide="noFiltedTeam_visibility">Search Result:</h3>

          <!--</div>-->
          <!--<div class="col-md-2"></div>-->
        </div>
        <!--end of teams list-->
            </div>
            <div id="menu3" class="tab-pane fade">
            <div class="col-md-12">
          <center>
            <br>
            <h2>Members Without Groups</h2>
          </center>
          <!--<div ng-include="'teamList.html'" id="teamList"></div>-->

          <div ng-hide="teamsList.length == 0">
            <table id="teamsList" class="table table-striped table-hover text-center" ng-hide="waitList.length == 0" style="font-size:16px;">
              <thead>
                <tr>
                  <th class="text-center">Name</th>
                  <!--<th>uid</th>-->
                  <th class="text-center">Preference</th>
                </tr>
              </thead>

              <tbody ng-repeat="member in waitList" ng-init="getUserDatabyID(member)">
                <tr>
                  <td><a href="profile.html?q={{member.uid}}">{{member.name}}</a></td>
                  <!--<td>{{member.uid}}</td>-->
                  <td>
                    <span ng-repeat="p in member.preference">{{p}}{{$last ? '' : ', '}}
                  </span>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>

          <center>
            <p ng-show="waitList.length ==0" style="font-size:16px;">No one is on the waitlist.</p>
          </center>
        </div>
            </div>
            <div id="menu4" class="tab-pane fade">
              <div ng-show="(deadline-today)<=0">
                <br>
                <h2>Invite List</h2>
                <p style="font-size:16px;">Registration is closed.</p>
              </div>
        <div ng-show="(deadline-today)>0">
          <br>
          <h2>Invite List</h2>
          <div ng-show="inviteTeamsLength ==4" style="font-size:16px;">You have not been invited yet. You can request teams below.</div>
          <div ng-hide="inviteTeamsLength ==4">
            <table id="inviteList" class="table table-hover" style="font-size:16px;">
              <thead>
                <tr>
                  <th>Team Name</th>
                  <th>Team Leader</th>
                  <th>Team members</th>
                  <th>Preference</th>
                  <th ng-show="(deadline-today)>0">Action</th>
                </tr>
              </thead>
              <!--<tbody ng-repeat="iT in inviteTeams">-->
              <tbody ng-repeat="(teamid, iT) in inviteTeams">
                <tr>
                  <td>{{iT.teamName}}</td>
                  <td><a href="profile.html?q={{iT.teamLeader}}">{{iT.teamLeaderName}}</a></td>
                  <td>
                    <span ng-repeat="member in iT.members">
                      <a href="profile.html?q={{member.memberID}}">{{member.memberName}}</a>{{$last ? '' : ', '}}
                    </span>
                  </td>
                  <td>{{iT.preference}}</td>
                  <td ng-show="(deadline-today)>0">
                    <button id="btn_acceptInvite" ng-click="acceptInvite(teamid)">Accept</button>
                    <button id="btn_rejectInvite" ng-click="rejectInvite(teamid)">Reject</button>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
            </div>
          </div>
        </div>
    </section>
  </div>
  <br>
  <div class="container">
    <div class="text-center">
  

      <br><br>

      <div id="event_page_controller">








      </div>
      <!--end of teams & member list-->
    </div>


    <!-- FOOTER -->
    <div class="col-md-12">
      <hr>
      <footer>
        <p class="pull-right"><a style="cursor: pointer" ng-click="scrollToTop()">Back to top</a></p>
        <p>&copy; 2016 &nbsp;<i>418 I'm a Teapot </i></p>
        <p>Powered by <a href="http://getbootstrap.com/" target="_blank">Bootstrap</a></p>
      </footer>
    </div>
  </div>
  <!-- JavaScript of this page -->

  <!-- Angular and Angular-route libraries (v1.5.7) -->
  <script src="lib/angular.min.js"></script>
  <script src="lib/angular-route.min.js"></script>

  <!-- Firebase (v3.0.3) and AngularFire (v2.0.0) (after angular library is loaded) -->
  <script src="lib/firebase.js"></script>
  <script src="lib/angularfire.min.js"></script>

  <script src="js/event.js"></script>

</body>

</html>
{'fraction_non_alphanumeric': 0.17863238138582319, 'fraction_numerical': 0.009671179883945842, 'mean_word_length': 1.8026945153061225, 'pattern_counts': {'":': 0, '<': 1039, '<?xml version=': 0, '>': 1065, 'https://': 6, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5060995', 'n_tokens_mistral': 10879, 'n_tokens_neox': 10172, 'n_words': 2070}