sagi/se-hub
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Merge pull request #105 from sagidayan/UI

Browse source 
Ui - project layout fixed
This commit is contained in:
Sagi Dayan 2015-06-30 18:06:05 +03:00
commit 493ea04499
8 changed files with 318 additions and 119 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
templates/js/app.js
View file

@ -4,7 +4,6 @@ var welcome = angular.module('welcome', ['ngMaterial', 'seHub.services', 'ngRout
var app = angular.module('SeHub', ['ngMaterial', 'ngRoute', 'seHub.services', 'ngCookies', 'chart.js', '720kb.datepicker']); var app = angular.module('SeHub', ['ngMaterial', 'ngRoute', 'seHub.services', 'ngCookies', 'chart.js', '720kb.datepicker']);
welcome.config(function($mdThemingProvider) { welcome.config(function($mdThemingProvider) {
$mdThemingProvider.theme('default') $mdThemingProvider.theme('default')
.primaryPalette('teal'); .primaryPalette('teal');
@ -12,18 +11,13 @@ welcome.config(function($mdThemingProvider) {
welcome.controller('welcomeController', ['$scope', 'apiService', '$cookies', '$window', function($scope, apiService, $cookies, $window) { welcome.controller('welcomeController', ['$scope', 'apiService', '$cookies', '$window', function($scope, apiService, $cookies, $window) {
console.log("Welcome Controller"); console.log("Welcome Controller");
var uid = $cookies['com.sehub.www']; var uid = $cookies['com.sehub.www'];
if(uid){ if(uid){
console.info("Session in Place"); console.info("Session in Place");
$window.location.href = DEBUG ? 'http://localhost:8080/home' : 'http://se-hub.appspot.com/home'; $window.location.href = DEBUG ? 'http://localhost:8080/home' : 'http://se-hub.appspot.com/home';
} }
}]); }]);
app.config(['$routeProvider', '$locationProvider', app.config(['$routeProvider', '$locationProvider',
function($routeProvider, $locationProvider) { function($routeProvider, $locationProvider) {
$routeProvider $routeProvider

9
templates/js/controllers/myClassesController.js
View file

@ -2,6 +2,7 @@ angular.module('SeHub')
.controller('myClassesController', ['$scope', '$location', '$routeParams', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope', .controller('myClassesController', ['$scope', '$location', '$routeParams', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope',
function ($scope, $location, $routeParams, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService ,$rootScope) function ($scope, $location, $routeParams, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService ,$rootScope)
{ {
$scope.loadingData = true;
$scope.isStudent = false; $scope.isStudent = false;
$scope.isCourse = false; $scope.isCourse = false;
$scope.isNewCourse = false; $scope.isNewCourse = false;
@ -11,7 +12,7 @@ angular.module('SeHub')
$scope.user.finalDate = ''; $scope.user.finalDate = '';
$scope.user.startDate = ''; $scope.user.startDate = '';
$scope.showMyClass = false; $scope.showMyClass = false;
$scope.coursesEmpty = false; $scope.coursesEmpty = true;
$scope.campusId; $scope.campusId;
var campusId = $routeParams.campusId; var campusId = $routeParams.campusId;
@ -124,12 +125,14 @@ angular.module('SeHub')
{ {
apiService.getAllCoursesByCampus(token, campusId).success(function(data) // Shows all classes from this campus apiService.getAllCoursesByCampus(token, campusId).success(function(data) // Shows all classes from this campus
{ {
$scope.loadingData = false;
$scope.courses = data; $scope.courses = data;
console.log("success " + $scope.courses); console.log("success " + $scope.courses);
init(); // Executing the function to initialize course display init(); // Executing the function to initialize course display
if(!$scope.courses) if($scope.courses && $scope.courses.length > 0)
{ {
$scope.coursesEmpty = true; // $scope.coursesEmpty = true;
$scope.coursesEmpty = false;
} }
}).error(function(err) }).error(function(err)
{ {

14
templates/js/controllers/myProjectsController.js
View file

@ -1,7 +1,6 @@
angular.module('SeHub') angular.module('SeHub')
.controller('myProjectsController', ['$scope', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope', function ($scope, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService ,$rootScope) .controller('myProjectsController', ['$scope', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope', function ($scope, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService ,$rootScope)
{ {
$scope.isEditPressed = false;
$scope.loadingData = true; $scope.loadingData = true;
$scope.myProjectsEmpty = true; $scope.myProjectsEmpty = true;
$scope.user = $scope.$parent.user; $scope.user = $scope.$parent.user;
@ -52,18 +51,5 @@ angular.module('SeHub')
}; };
$scope.arrayHolder.push(tempArr); $scope.arrayHolder.push(tempArr);
} }
$scope.editPressed = function()
{
$scope.isEditPressed = true;
console.log("EditPressed " + $scope.isEditPressed);
}
$scope.removeProject = function()
{
console.log("Project has been removed!");
}
$scope.displayMyProjects(); // Will display all my projects $scope.displayMyProjects(); // Will display all my projects
}]); }]);

57
templates/js/controllers/projectController.js
View file

@ -2,6 +2,63 @@ angular.module('SeHub')
.controller('projectController', ['$scope', '$routeParams', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope', .controller('projectController', ['$scope', '$routeParams', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope',
function ($scope, $routeParams, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService ,$rootScope) function ($scope, $routeParams, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService ,$rootScope)
{ {
var token = $cookies['com.sehub.www'];
var projectId = $routeParams.projectId;
$scope.isEditPressed = false;
$scope.user = $scope.$parent.user;
$scope.loadingData = true;
$scope.isMasterOrLecturer = false;
// $scope.thisProject = {};
// $scope.thisProject.courseName = $routeParams.className;
$scope.editProject = function(ev)
{
$scope.isEditPressed = true;
console.log("EditPressed " + $scope.isEditPressed);
}
$scope.removeProject = function(ev)
{
console.log("Project has been removed!");
$mdDialog.show($mdDialog.alert().title('Remove Project').content('Are you sure you want to remove the project ?')
.ariaLabel('Removing project alert dialog').ok('Yes').targetEvent(ev));
// .then(function() {
// $location.path('/class/' + data.id + '/' + data.courseName); // Will display all the projects in this course
// }); // Pop-up alert
};
$scope.getProjectInfo = function()
{
apiService.getProjectsById(token, projectId).success(function(data)
{
$scope.project = data;
console.log($scope.project);
$scope.init_line_lables();
// if($scope.user === $scope.project.info.master_id)
// {
// $scope.isMasterOrLecturer = true;
// }
// if($scope.project && $scope.project.length > 0) // TODO - TEST?
// {
$scope.loadingData = false;
// }
console.log($scope.project);
}).error(function(err)
{
console.log("Error: " + err.message);
});
}
$scope.init_line_lables = function(){
$scope.project.weekly_labels = [];
for(var i = 0 ; i < $scope.project.info.stats.weekly_commits[0].length; i++)
$scope.project.weekly_labels.push('w '+i.toString());
}
$scope.getProjectInfo(); // Get all this project data
}]); }]);

8
templates/js/services/apiService.js
View file

@ -125,6 +125,14 @@ service.factory('apiService', ['$http', function($http) {
}; };
return $http(req); return $http(req);
}, },
getProjectsById: function(token, projectId){
var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/projects/getProjectsById/" + token + "/" + projectId;
req = {
method : "GET",
url : url
};
return $http(req);
},
getProjectsByUser: function(token){ getProjectsByUser: function(token){
var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/projects/getProjectsByUser/" + token; var url = (DEBUG ? "http://localhost:8080" : "http://se-hub.appspot.com") + "/api/projects/getProjectsByUser/" + token;
req = { req = {

54
templates/views/myClasses.html
View file

@ -2,36 +2,40 @@
<md-content layout-padding layout-margin> <md-content layout-padding layout-margin>
<h1 layout-margin style="margin-left:15px"><i class="fa fa-graduation-cap"></i> My Classes</h1> <h1 layout-margin style="margin-left:15px"><i class="fa fa-graduation-cap"></i> My Classes</h1>
</md-content> </md-content>
<md-card class="cardAllcourses"> <div layout-paddig layout-margin class="loader" ng-if="loadingData">
<div flex = "99" layout = "row" ng-repeat = "t in holdArrays" value = "{{t}}" layout-padding> <md-progress-circular md-mode="indeterminate"></md-progress-circular>
</div>
<div ng-if = "coursesEmpty && !loadingData" layout-padding layout-margin>
You Are Not Related To Any Course, You May Join Any Course You Wish.
</div>
<div ng-if = "!coursesEmpty">
<md-card class="cardAllcourses">
<div flex = "99" layout = "row" ng-repeat = "t in holdArrays" value = "{{t}}" layout-padding>
<div flex = "32" layout = "column" ng-repeat = "course in t" value = "{{course}}" > <div flex = "32" layout = "column" ng-repeat = "course in t" value = "{{course}}" >
<div ng-if = "!scope.coursesEmpty"> <div ng-if="t.length != 1">
<div ng-if="t.length != 1"> <md-button ng-click = "goToClass(course.id, course.courseName)" style="width:100%; height:32%;" layout-padding class = "md-raised" >
<md-button ng-click = "goToClass(course.id, course.courseName)" style="width:100%; height:32%;" layout-padding class = "md-raised" > <div style="width:97%;height:97%">
<div style="width:97%;height:97%"> <md-card-content>
<md-card-content> <h2 class="md-title">{{course.courseName}}</h2> <!-- Should Be "course.title" -->
<h2 class="md-title">{{course.courseName}}</h2> <!-- Should Be "course.title" --> </md-card-content>
</md-card-content> </div>
</div> </md-button>
</md-button>
</div>
<div ng-if="t.length == 1">
<md-button ng-click = "goToClass(course.id, course.courseName)" style="width:32%; height:32%;" layout-padding class = "md-raised" >
<div style="width:97%;height:97%">
<md-card-content>
<h2 class="md-title">{{course.courseName}}</h2> <!-- Should Be "course.title" -->
</md-card-content>
</div>
</md-button>
</div>
</div> </div>
<div class="spacer"></div> <div ng-if="t.length == 1">
<div ng-if = "scope.coursesEmpty"> <md-button ng-click = "goToClass(course.id, course.courseName)" style="width:32%; height:32%;" layout-padding class = "md-raised" >
You Are Not Related To Any Course, You May Join Any Course You Wish. <div style="width:97%;height:97%">
<md-card-content>
<h2 class="md-title">{{course.courseName}}</h2> <!-- Should Be "course.title" -->
</md-card-content>
</div>
</md-button>
</div> </div>
</div> </div>
<div class="spacer"></div>
</div> </div>
</md-card> </md-card>
</div>
<!-- Lecturer Mode --> <!-- Lecturer Mode -->

155
templates/views/project.html
View file

@ -1,13 +1,160 @@
<div class = "myClasses"> <div class = "project">
<md-content layout-padding layout-margin> <md-content layout-padding layout-margin>
<h1 layout-margin style="margin-left:15px"><i class="fa fa-cube"></i> Project</h1> <div layout = "row">
Yipi Kayea Mother Fraker <div layout = "column">
<div>
<h1 layout-margin style="margin-left:15px"><i class="fa fa-cube"></i> Project '{{project.projectName}}'</h1>
</div>
<div> <!-- ng-if = "{{project.logo_url}}"> -->
<div flex = "25">
<img ng-src="{{project.logo_url}}" class = "md-avatar">
</div>
</div>
</div>
<div> <div>
<div layout = "row" flex = "45">
<!-- <div ng-if = "isMasterOrLecturer"> -->
<md-card layout = "row">
<div layout-padding>
<md-button ng-click="editProject($event)" ng class="md-raised md-primary">
<i class="fa fa-pencil-square-o"></i>
</md-button>
</div>
<div layout-padding>
<md-button ng-click="removeProject($event)" ng class="md-raised md-primary">
<i class="fa fa-times"></i>
</md-button>
</div>
</md-card>
<!-- </div> -->
</div>
</div>
</div> </div>
<!-- <div flex = "99" layout = "row" layout-padding>
<div flex = "20">
Project Name: {{project.projectName}}
</div>
</div> -->
<md-card>
<div flex = "99" layout = "row">
<div flex = "10" layout-padding layout-margin border = "1">
Team Members:
<ul layout-padding>
<li ng-repeat = "member in project.members">
<a ng-href="#/profile/{{member.id}}" style="text-decoration:none; color:black;"> {{member.name}}</a>
</li>
</ul>
</div>
<div flex = "45">
<!-- Graph -->
<div ng-if="loadingData" layout-paddig layout-margin class="loader">
<md-progress-circular md-mode="indeterminate"></md-progress-circular>
</div>
<md-card>
<canvas layout-padding layout-margin ng-if = "!loadingData" id="line" class="chart chart-line" data="project.info.stats.weekly_commits" labels="project.weekly_labels" legend="true" ></canvas>
</md-card>
</div>
<div flex = "40">
<md-card>
<canvas layout-padding layout-margin ng-if = "!loadingData" id="project.projectName" class="chart chart-bar" data="project.info.stats.micro.data" labels="project.info.stats.micro.labels" series="project.info.stats.micro.series"></canvas>
</md-card>
</div>
</div>
</md-card>
<div>
<div flex = "96" style="height:70%;">
<div flex>
<md-card>
<md-content class="md-padding">
<md-tabs md-dynamic-height md-border-bottom>
<md-tab label="Messages">
<md-content class="md-padding">
<h1 class="md-display-2">Messages</h1>
<p>Messages...</p>
</md-content>
</md-tab>
<md-tab label="Commits">
<md-content class="md-padding">
<h1 class="md-display-2">Commits</h1>
<table style="width:100%;" border = "1">
<tr>
<th>Name</th>
<th>Number</th>
<th>url</th>
</tr>
<tr ng-repeat = "member in project.members">
<td>
<a ng-href="#/profile/{{member.id}}" style="text-decoration:none; color:black;">
{{member.name}}
</a>
</td>
<td>
<div ng-repeat = "commit in project.info.info">
{{commit.commits_url}}
</div>
</td>
<td></td>
</tr>
</table>
</md-content>
</md-tab>
<md-tab label="Issues">
<md-content class="md-padding" style="overflow:scroll;">
<h1 class="md-display-2">Issues</h1>
<table style="width:100%;" border = "1">
<tr>
<th>Title</th>
<th style = "width:15%;">Labels</th>
<th style = "width:10%;">Milestone</th>
<th style = "width:10%;">User</th>
</tr>
<tr ng-repeat = "issue in project.info.issues" layout-margin align="center">
<td align="top">
<a target="_blank" ng-href="{{issue.html_url}}" style="text-decoration:none; color:black;">
{{issue.title}}
</a>
</td>
<td>
<span ng-repeat = "label in issue.labels">
<md-card style="background-color:{{label.color}}">
{{label.name}}
</md-card>
</span>
</td>
<td>
{{issue.milestone.title}}
</td>
<td>
<a ng-href="#/profile/{{issue.user.id}}" style="text-decoration:none; color:black;">
{{issue.user.login}}
</a>
</td>
</tr>
</table>
</md-content>
</md-tab>
<md-tab label="Bugs">
<md-content class="md-padding">
<h1 class="md-display-2">Bugs</h1>
<p> Bugs ..</p>
</md-content>
</md-tab>
<md-tab label="tasks">
<md-content class="md-padding">
<h1 class="md-display-2">tasks</h1>
<p>tasks..</p>
</md-content>
</md-tab>
</md-tabs>
</md-content>
</md-card>
</div>
</div>
</div>

132
templates/views/register.html
View file

@ -1,80 +1,80 @@
<div class="register"> <div class="register">
<md-content layout-padding> <md-content layout-padding>
<md-card layout-padding> <md-card layout-padding>
<h1 style="margin-left:15px"><i class="fa fa-pencil"></i> Registration</h1> <h1 style="margin-left:15px"><i class="fa fa-pencil"></i> Registration</h1>
<center> <center>
First Login Of {{user.name}} First Login Of {{user.name}}
<div class="avatar"> <div class="avatar">
<img ng-src="{{user.avatar_url}}" alt="{{item.who}}"> <img ng-src="{{user.avatar_url}}" alt="{{item.who}}">
</div> </div>
</center> </center>
<div layout="col"> <div layout="col">
<div>
<md-input-container ng-if="userHasNoName">
<label>Full Name: </label>
<input ng-model="user.name" ng-minlength="1" required>
</md-input-container>
</div>
<br></br>
<div layout="row" layout-align="center center">
<p>Are You A Lecturer?</p>
<md-switch ng-model="user.isLecturer" aria-label="Switch 1">
</md-switch>
</div>
</div>
<div>
<div ng-if="user.isLecturer">
<div> <div>
<md-button ng-click = "createCampus($event)" ng-model="jsonCreateCampus" class="md-raised">Create Campus</md-button> <md-input-container ng-if="userHasNoName">
<div class = "createCampus" ng-if="createCampusClicked"> <label>Full Name: </label>
<md-input-container> <input ng-model="user.name" ng-minlength="1" required>
<label>Academic Suffix Email</label> </md-input-container>
<input type="text" ng-model="user.campusMail" ng-minlength="1" required/> </div>
</md-input-container> <br></br>
<md-input-container> <div layout="row" layout-align="center center">
<label>Campus Name</label> <p>Are You A Lecturer?</p>
<input type="text" ng-if="createCampusClicked" ng-model="user.campusName" ng-minlength="1" required !important/> <md-switch ng-model="user.isLecturer" aria-label="Switch 1">
</md-input-container> </md-switch>
<md-input-container> </div>
<label>Campus Avatar Url (optional)</label> </div>
<input type="text" ng-if="createCampusClicked" ng-model="user.newCampusAvatar"/> <div>
</md-input-container> <div ng-if="user.isLecturer">
<div>
<md-button ng-click = "createCampus($event)" ng-model="jsonCreateCampus" class="md-raised">Create Campus</md-button>
<div class = "createCampus" ng-if="createCampusClicked">
<md-input-container>
<label>Academic Suffix Email</label>
<input type="text" ng-model="user.campusMail" ng-minlength="1" required/>
</md-input-container>
<md-input-container>
<label>Campus Name</label>
<input type="text" ng-if="createCampusClicked" ng-model="user.campusName" ng-minlength="1" required !important/>
</md-input-container>
<md-input-container>
<label>Campus Avatar Url (optional)</label>
<input type="text" ng-if="createCampusClicked" ng-model="user.newCampusAvatar"/>
</md-input-container>
</div>
</div>
</div>
<div class = "dropDown">
<md-select placeholder="Pick your Campus" ng-model="campus" style="z-index: 300" ng-change="dropdownClicked()">
<md-option ng-switch="user.isLecturer" ng-repeat="c in campuses" value="{{c.title}}">{{c.title}}</md-option>
</md-select>
</div>
</div>
<div layout="col" layout-align="center center">
<div>
<div class="campusAvatar" ng-if="campusChecked">
<img ng-src="{{campusObj.avatar_url}}" alt="campusAvatar">
</div> </div>
</div> </div>
</div> </div>
<div class = "dropDown">
<md-select placeholder="Pick your Campus" ng-model="campus" style="z-index: 300" ng-change="dropdownClicked()">
<md-option ng-switch="user.isLecturer" ng-repeat="c in campuses" value="{{c.title}}">{{c.title}}</md-option>
</md-select>
</div>
</div>
<div layout="col" layout-align="center center">
<div> <div>
<div class="campusAvatar" ng-if="campusChecked"> <div class = "disabledSubmitButton">
<img ng-src="{{campusObj.avatar_url}}" alt="campusAvatar"> <md-button ng-click="submitClicked($event)" ng-disabled="!campusChecked" class="md-raised md-primary">Submit</md-button>
</div> </div>
</div> </div>
</div> <div layout="row" layout-align="center center">
<div> <div ng-if="campusChecked">
<div class = "disabledSubmitButton"> <div>
<md-button ng-click="submitClicked($event)" ng-disabled="!campusChecked" class="md-raised md-primary">Submit</md-button> <md-input-container>
</div> <label>Academic Email</label>
</div> <input type="text" ng-model="user.AcMail" ng-length="1" required/>
<div layout="row" layout-align="center center"> </md-input-container>
<div ng-if="campusChecked"> </div>
</div>
<div> <div>
<md-input-container> <div class="mail_suffix">
<label>Academic Email</label> {{campusObj.email_ending}}
<input type="text" ng-model="user.AcMail" ng-length="1" required/> </div>
</md-input-container>
</div> </div>
</div> </div>
<div> </md-card>
<div class="mail_suffix">
{{campusObj.email_ending}}
</div>
</div>
</div>
</md-card>
</md-content> </md-content>
</div> </div>