More Setings UI Tweaks
This commit is contained in:
parent
d736cb021a
commit
51d11cac93
3 changed files with 187 additions and 56 deletions
|
@ -2,10 +2,10 @@
|
|||
|
||||
body{
|
||||
font-family: "Alef Hebrew",
|
||||
“Helvetica Neue”,
|
||||
Helvetica,
|
||||
Arial,
|
||||
sans-serif;
|
||||
“Helvetica Neue”,
|
||||
Helvetica,
|
||||
Arial,
|
||||
sans-serif;
|
||||
}
|
||||
|
||||
.menuBtn {
|
||||
|
@ -144,10 +144,10 @@ body.noscroll
|
|||
}
|
||||
|
||||
|
||||
.createCampus
|
||||
{
|
||||
position:relative;
|
||||
}
|
||||
.createCampus
|
||||
{
|
||||
position:relative;
|
||||
}
|
||||
|
||||
|
||||
/*div.img campusAvatar
|
||||
|
@ -248,3 +248,62 @@ body.noscroll
|
|||
text-decoration: none !important;
|
||||
color: #7f7f7f;
|
||||
}
|
||||
|
||||
/*Settings Style*/
|
||||
|
||||
.settingList .settingListItem:hover{
|
||||
background-color: #E2E2E2;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.settingList .settingListItemRoot{
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.settingList .settingListItem{
|
||||
width: 100%;
|
||||
padding: 15px 0px auto 15px;
|
||||
}
|
||||
|
||||
|
||||
/*End Settings*/
|
||||
|
||||
|
||||
/*md Effects*/
|
||||
|
||||
.md-avatar{
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-top: 8px;
|
||||
margin-bottom: 8px;
|
||||
margin-right: 16px;
|
||||
border-radius: 50%;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
|
||||
md-list-item .md-no-style.md-button, md-list-item.md-no-proxy.md-button {
|
||||
font-size: inherit;
|
||||
height: inherit;
|
||||
text-align: left;
|
||||
text-transform: none;
|
||||
width: 100%;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
md-list-item, md-list-item .md-list-item-inner {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-justify-content: flex-start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
min-height: 48px;
|
||||
}
|
||||
|
||||
/*End Effects for MD*/
|
|
@ -1,57 +1,78 @@
|
|||
angular.module('SeHub')
|
||||
.controller('settingsController', ['$scope', '$rootScope', 'dataService','apiService', '$cookies', '$location',
|
||||
function($scope, $rootScope, dataService ,apiService, $cookies, $location) {
|
||||
.controller('settingsController', ['$scope', '$rootScope', 'dataService', 'apiService', '$cookies', '$location',
|
||||
function($scope, $rootScope, dataService, apiService, $cookies, $location) {
|
||||
|
||||
var token = $cookies['com.sehub.www'];
|
||||
var token = $cookies['com.sehub.www'];
|
||||
|
||||
$scope.loadingData = true;
|
||||
$scope.isInRegisterMode = false;
|
||||
$scope.loadingData = true;
|
||||
$scope.isInRegisterMode = false;
|
||||
|
||||
$scope.title = "Settings"
|
||||
$scope.title = "Settings"
|
||||
|
||||
apiService.getUserByToken(token).success(function(data) {
|
||||
if (data.message == 'No User Found') {
|
||||
console.error("No User Found!");
|
||||
}
|
||||
$scope.loadingData = false;
|
||||
$scope.user = data;
|
||||
console.log(data);
|
||||
if ($scope.user.isFirstLogin) {
|
||||
$scope.menuObj = {};
|
||||
$scope.isInRegisterMode = true;
|
||||
apiService.getUserByToken(token).success(function(data) {
|
||||
if (data.message == 'No User Found') {
|
||||
console.error("No User Found!");
|
||||
}
|
||||
$scope.loadingData = false;
|
||||
$location.path('/register')
|
||||
$scope.user = data;
|
||||
console.log(data);
|
||||
if ($scope.user.isFirstLogin) {
|
||||
$scope.menuObj = {};
|
||||
$scope.isInRegisterMode = true;
|
||||
$scope.loadingData = false;
|
||||
$location.path('/register')
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$scope.isEditMode = false;
|
||||
$scope.profileMode = "Edit Profile";
|
||||
$scope.profileModeIcon = "fa fa-pencil";
|
||||
|
||||
$scope.changeProfileMode = function() {
|
||||
$scope.isEditMode = !$scope.isEditMode;
|
||||
if ($scope.isEditMode) {
|
||||
$scope.profileMode = "Save Profile";
|
||||
$scope.profileModeIcon = "fa fa-floppy-o";
|
||||
} else {
|
||||
dataService.userBrodcast($scope.user);
|
||||
$scope.profileMode = "Edit Profile";
|
||||
$scope.profileModeIcon = "fa fa-pencil";
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
/**
|
||||
* DEBUG DATA
|
||||
*/
|
||||
$scope.courses = [{
|
||||
"courseName": "Advance Math",
|
||||
"campusName": "JCE",
|
||||
"startDate": {
|
||||
"year": 2015,
|
||||
"month": 4,
|
||||
"day": 3
|
||||
},
|
||||
"endDate": {
|
||||
"year": 2016,
|
||||
"month": 5,
|
||||
"day": 14
|
||||
},
|
||||
"taskFlag": false,
|
||||
"campus_avatar": "https://yt3.ggpht.com/--ZkWxybWGOM/AAAAAAAAAAI/AAAAAAAAAAA/_nAICC_kzzI/s88-c-k-no/photo.jpg"
|
||||
}];
|
||||
|
||||
$scope.campuses = [{
|
||||
'title': 'JCE',
|
||||
'email_ending': '@post.jce.ac.il',
|
||||
'master_user_id': 123453433341,
|
||||
'avatar_url': 'https://yt3.ggpht.com/--ZkWxybWGOM/AAAAAAAAAAI/AAAAAAAAAAA/_nAICC_kzzI/s88-c-k-no/photo.jpg'
|
||||
}, {
|
||||
'title': 'Stanford',
|
||||
'email_ending': '@post.jce.ac.il',
|
||||
'master_user_id': 123453433341,
|
||||
'avatar_url': 'https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcR9M4uQgaJP1zyiCGw-dK31hU8buWqeuOi9vTXBd4Y8hQcFTZqA'
|
||||
}];
|
||||
|
||||
$scope.isEditMode = false;
|
||||
$scope.profileMode = "Edit Profile";
|
||||
$scope.profileModeIcon = "fa fa-pencil";
|
||||
|
||||
$scope.changeProfileMode = function() {
|
||||
$scope.isEditMode = !$scope.isEditMode;
|
||||
if ($scope.isEditMode) {
|
||||
$scope.profileMode = "Save Profile";
|
||||
$scope.profileModeIcon = "fa fa-floppy-o";
|
||||
} else {
|
||||
dataService.userBrodcast($scope.user);
|
||||
$scope.profileMode = "Edit Profile";
|
||||
$scope.profileModeIcon = "fa fa-pencil";
|
||||
}
|
||||
}
|
||||
|
||||
// {
|
||||
// name: ";"
|
||||
// isLecturer: false
|
||||
// email: "sagidayan@gmail.com"
|
||||
// username: "sagidayan"
|
||||
// seToken: "76cd4178-94dd-4cb4-b464-111d2239e567"
|
||||
// isFirstLogin: true
|
||||
// campuses_id_list: [0]
|
||||
// classes_id_list: [0]
|
||||
// avatar_url: "https://avatars.githubusercontent.com/u/2984053?v=3"
|
||||
// }
|
||||
|
||||
|
||||
}]);
|
||||
]);
|
|
@ -9,6 +9,7 @@
|
|||
<div>
|
||||
<md-card layout-padding>
|
||||
<div id="profile" layout="column">
|
||||
<!-- User Profile Box -->
|
||||
<div class="user-box" layout="row">
|
||||
<div>
|
||||
<img ng-src="{{user.avatar_url}}" alt="" style="width:20%">
|
||||
|
@ -20,6 +21,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Start View Profile -->
|
||||
<div layout="column" ng-if="!isEditMode">
|
||||
<div>
|
||||
<h2>{{user.name}}</h2>
|
||||
|
@ -31,7 +33,7 @@
|
|||
I Am a: {{(user.isLecturer) ? "Lecturer" : "Student"}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- End View Profile -->
|
||||
<!-- Starting Edit Mode Div -->
|
||||
<div layout="column" ng-if="isEditMode">
|
||||
<div>
|
||||
|
@ -52,8 +54,57 @@
|
|||
</md-switch>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Edit Div -->
|
||||
</md-card>
|
||||
</div>
|
||||
<!-- Campuses & Classes Div -->
|
||||
<div flex>
|
||||
<md-card layout-padding>
|
||||
<h3><i class="fa fa-graduation-cap"></i> My Classes</h3>
|
||||
<div class="settingList">
|
||||
<div class="settingListRoot">
|
||||
<div ng-repeat="course in courses" class="settingListItem" layout="row">
|
||||
<div>
|
||||
<img alt="{{ person.name }}" ng-src="{{ course.campus_avatar }}" class="md-avatar" />
|
||||
</div>
|
||||
<div class="port_spacer">
|
||||
{{ course.courseName }} - <strong>IN</strong> {{course.campusName}}
|
||||
</div>
|
||||
<div class="spacer"></div>
|
||||
<div>
|
||||
<md-button class="">
|
||||
X
|
||||
</md-button>
|
||||
</div>
|
||||
<md-divider ng-if="!$last"></md-divider>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3><i class="fa fa-university"></i> My Campuses</h3>
|
||||
|
||||
<div class="settingList">
|
||||
<div class="settingListRoot">
|
||||
<div ng-repeat="campus in campuses" class="settingListItem" layout="row">
|
||||
<div>
|
||||
<img alt="{{ person.name }}" ng-src="{{ campus.avatar_url }}" class="md-avatar" />
|
||||
</div>
|
||||
<div class="port_spacer">
|
||||
{{ campus.title }} -
|
||||
</div>
|
||||
<div class="spacer"></div>
|
||||
<div>
|
||||
<md-button class="">
|
||||
X
|
||||
</md-button>
|
||||
</div>
|
||||
<md-divider ng-if="!$last"></md-divider>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</md-card>
|
||||
</div>
|
||||
<!-- End Campuses & Classes Div -->
|
||||
</div>
|
||||
</md-card>
|
||||
|
||||
|
|
Loading…
Reference in a new issue