TaskView toolbar color darken

sandershihacker · DerekTBrown · commit f744c04cadb4 · 2017-01-01T02:16:06.000-05:00
remove tests

Combine Subscriptions

Reactive Subscription for CourseList and GradeList

instructor view of course dashboard

Dashboard not logged in
diff --git a/client/imports/ui/pages/course/course.html b/client/imports/ui/pages/course/course.html
@@ -5,19 +5,19 @@
       <div class="wrapper">
         <!-- Navigation -->
         <div class="course-toolbar-nav">
-          <a md-button [routerLink]="['/course/' + courseId]" class="home-button">Home</a>
-          <a md-button [routerLink]="['/course/' + courseId + '/labs']">Labs</a>
-          <a md-button [routerLink]="['/course/' + courseId + '/grades']">Grades</a>
-          <a md-button [routerLink]="['/course/' + courseId]">Settings</a> 
+          <a md-button [routerLink]="['/course/' + courseId]" class="home-button">{{ courseNumber }} Home</a>
+          <a md-button [routerLink]="['/course/' + courseId + '/labs']" *ngIf="isInstruct()">Labs</a>
+          <a md-button [routerLink]="['/course/' + courseId + '/grades']" *ngIf="!isInstruct()">Grades</a>
+          <a md-button [routerLink]="['/course/' + courseId]" *ngIf="isInstruct()">Students</a> 
         </div>
       </div>
     </md-toolbar>
     <md-toolbar class="small" *showItBootstrap="['xs']">
       <div>
-        <a md-button [routerLink]="['/course/' + courseId]">Home</a>
-        <a md-button [routerLink]="['/course/' + courseId + '/labs']">Labs</a>
-        <a md-button [routerLink]="['/course/' + courseId + '/grades']">Grades</a>
-        <a md-button [routerLink]="['/course/' + courseId]">Settings</a>  
+        <a md-button [routerLink]="['/course/' + courseId]">{{ courseNumber }} Home</a>
+        <a md-button [routerLink]="['/course/' + courseId + '/labs']" *ngIf="isInstruct()">Labs</a>
+        <a md-button [routerLink]="['/course/' + courseId + '/grades']" *ngIf="!isInstruct()">Grades</a>
+        <a md-button [routerLink]="['/course/' + courseId]" *ngIf="isInstruct()">Students</a>  
       </div>
       <md-icon fontIcon="tuxicon-right"></md-icon>
     </md-toolbar>
diff --git a/client/imports/ui/pages/course/course.ts b/client/imports/ui/pages/course/course.ts
@@ -19,6 +19,9 @@
 
 // Icon
   import { MD_ICON_DIRECTIVES, MdIconRegistry } from '@angular2-material/icon';
+  
+// Roles
+  import { Roles } from '../../../../../collections/users.ts';
 
   declare var Collections: any;
 
@@ -40,14 +43,33 @@
 // Export CourseView Class
   export default class CourseView extends MeteorComponent {
     courseId: string;
+    courseNumber: string = "";
+    isInstructor: boolean = false;
     user: Meteor.User;
     constructor(mdIconRegistry: MdIconRegistry, private route: ActivatedRoute) {
       super();
       // Create Icon Font
       mdIconRegistry.registerFontClassAlias('tux', 'tuxicon');
       mdIconRegistry.setDefaultFontSetClass('tuxicon');
+      this.subscribe('user-courses', () => {
+        this.autorun(() => {
+          this.courseNumber = Collections.courses.findOne({ _id: this.courseId }).course_number;
+        });
+      }, true);
     }
     ngOnInit() {
       this.courseId = (<any>(this.route.snapshot.params)).courseid;
+      if(typeof this.courseId !== "undefined") {
+        this.isInstructor = Roles.isInstructorFor(this.courseId);
+      }
+    }
+    isInstruct() {
+      if(typeof this.courseId !== "undefined") {
+        return Roles.isInstructorFor(this.courseId);
+      }
+      else {
+        return false;
+      }
     }
   }
+
diff --git a/client/imports/ui/pages/course/course_dashboard.html b/client/imports/ui/pages/course/course_dashboard.html
@@ -3,7 +3,11 @@
   <md-card>
     <md-card-title>
       <md-card-title-text>
-        <span class="md-headline">{{ courseName }}</span>
+        <span class="md-headline">
+          {{ courseName }}
+          <md-icon fontIcon="tuxicon-cog" *ngIf="isInstruct()"></md-icon>
+        </span>
+        
       </md-card-title-text>
     </md-card-title>
     <md-card-content>
@@ -15,13 +19,11 @@
   </md-card>
   
   <!-- Responsive Section for Grades and Assignments -->
-  <div layout="row" layout-xs="column">
-    
+  <div layout="row" layout-xs="column" *ngIf="!isInstruct()">  
     <!-- Grade List -->
     <div flex>
       <tuxlab-gradelist></tuxlab-gradelist>
     </div>
-    
     <!-- Announcements -->
     <div flex>
       <md-card>
@@ -56,9 +58,44 @@
         </md-card-content>
       </md-card>
     </div>
-    
+  </div>
+  
+  <!-- Permissions Section -->
+  <div layout="row" *ngIf="isInstruct()">
+    <div flex>
+      <md-card>
+        <md-card-title>
+          <md-card-title-text>
+            <span class="md-headline">Permissions</span>
+          </md-card-title-text>
+        </md-card-title>
+        <md-card-content>
+          Data
+        </md-card-content>
+        <md-card-actions layout="row" layout-align="end center">
+          <a md-button>Submit</a>
+        </md-card-actions>
+      </md-card>
+    </div>
+    <div flex>
+      <md-card>
+        <md-card-title>
+          <md-card-title-text>
+            <span class="md-headline">Syllabus</span>
+          </md-card-title-text>
+        </md-card-title>
+        <md-card-content>
+          Data
+        </md-card-content>
+        <md-card-actions layout="row" layout-align="end center">
+          <a md-button>Submit</a>
+        </md-card-actions>
+      </md-card>
+    </div>
   </div>
   
   <!--Lab List Card-->
-  <tuxlab-lablist></tuxlab-lablist>
+  <div *ngIf="!isInstruct()">
+    <tuxlab-lablist></tuxlab-lablist>
+  </div>
 </div>
diff --git a/client/imports/ui/pages/course/course_dashboard.ts b/client/imports/ui/pages/course/course_dashboard.ts
@@ -24,6 +24,9 @@
 // LabList and Grades import
   import { GradeList } from './gradelist.ts';
   import { LabList } from './lablist.ts';
+  
+// Roles Import
+  import { Roles } from '../../../../../collections/users.ts';
 
 declare var Collections: any;
 
@@ -41,16 +44,16 @@ declare var Collections: any;
       GradeList
     ],
     viewProviders: [MdIconRegistry],
-    providers: [OVERLAY_PROVIDERS],
+    providers: [ OVERLAY_PROVIDERS ],
     encapsulation: ViewEncapsulation.None
   })
 
 // Export CourseDashboard Class
   export class CourseDashboard extends MeteorComponent {
     course;
     courseId: string;
-    courseDescription: String = "";
-    courseName: String = "";
+    courseDescription: string = "";
+    courseName: string = "";
 
     constructor(private route: ActivatedRoute, private router: Router) {
       super();
@@ -66,4 +69,12 @@ declare var Collections: any;
     ngOnInit() {
       this.courseId = this.router.routerState.parent(this.route).snapshot.params['courseid'];
     }
+    isInstruct() {
+      if (typeof this.courseId !== "undefined") {
+        return Roles.isInstructorFor(this.courseId);
+      }
+      else {
+        return false;
+      }
+    }
   }
diff --git a/client/imports/ui/pages/course/gradelist.ts b/client/imports/ui/pages/course/gradelist.ts
@@ -28,7 +28,7 @@ export class GradeList extends MeteorComponent{
     super();
   }
   
-  setGrade() {
+  setGrades() {
     if (this.courseRecord !== undefined) {
       let labs = this.courseRecord.labs;
       let totalEarned = 0;
@@ -61,28 +61,26 @@ export class GradeList extends MeteorComponent{
   }
   
   getCourseRecords(){
-    if(this.cur_user) {
-      // Student
-      this.subscribe('course-records', () => {
-        this.courseRecord = Collections.course_records.findOne({ course_id: this.courseId, user_id: Meteor.userId() });
-        this.setGrade();
-      }, true);
-    }
-    else{
-      this.subscribe('course-records', [this.courseId, this.userId], () => {
-        var localCourseRecord = Collections.course_records.findOne({ course_id: this.courseId, user_id: this.userId });
-        if (localCourseRecord === null || typeof localCourseRecord === "undefined") {
-          // Admin
-          this.courseRecord = Meteor.call('getUserCourseRecord', this.courseId, this.userId);
-          this.setGrade();
+    this.subscribe('course-records', () => {
+      this.autorun(() => {
+        if(this.cur_user) {
+          // Student 
+          this.courseRecord = Collections.course_records.findOne({ course_id: this.courseId, user_id: Meteor.userId() });
         }
         else {
-          // Instructor
-          this.courseRecord = localCourseRecord;
-          this.setGrade();
+          var localCourseRecord = Collections.course_records.findOne({ course_id: this.courseId, user_id: this.userId });
+          if(localCourseRecord === null || typeof localCourseRecord === "undefined") {
+            // Admin 
+            this.courseRecord = Meteor.call('getUserCourseRecord', this.courseId, this.userId);
+          }
+          else {
+            // Instructor
+            this.courseRecord = localCourseRecord;
+          }
         }
-      }, true);
-    }
+        this.setGrades();
+      });
+    }, true);
   }
 
   ngOnInit(){
diff --git a/client/imports/ui/pages/course/lablist.ts b/client/imports/ui/pages/course/lablist.ts
@@ -47,29 +47,27 @@
       super(); 
     }
     
-    getCourseRecords(){
-      if(this.cur_user) {
-        // Student
-        this.subscribe('course-records', () => {
-          this.courseRecord = Collections.course_records.findOne({ course_id: this.courseId, user_id: Meteor.userId() });
-          this.setLabs();
-        }, true);
-      }
-      else{
-        this.subscribe('course-records', () => {
-          var localCourseRecord = Collections.course_records.findOne({ course_id: this.courseId, user_id: this.userId });
-          if (localCourseRecord === null || typeof localCourseRecord === "undefined") {
-            // Admin
-            this.courseRecord = Meteor.call('getUserCourseRecord', this.courseId, this.userId);
-            this.setLabs();
+    getCourseRecords(){     
+      this.subscribe('course-records', () => {
+        this.autorun(() => {
+          if(this.cur_user) {
+            // Student
+            this.courseRecord = Collections.course_records.findOne({ course_id: this.courseId, user_id: Meteor.userId() });
           }
           else {
-            // Instructor
-            this.courseRecord = localCourseRecord;
-            this.setLabs();
+            var localCourseRecord = Collections.course_records.findOne({ course_id: this.courseId, user_id: this.userId });
+            if(localCourseRecord === null || typeof localCourseRecord === "undefined") {
+              // Admin
+              this.courseRecord = Meteor.call('getUserCourseRecord', this.courseId, this.userId);
+            }
+            else {
+              // Instructor
+              this.courseRecord = localCourseRecord;
+            }
           }
-        }, true);
-      }
+          this.setLabs();
+        });
+      }, true);
     }
     
     setLabs() {
diff --git a/client/imports/ui/pages/dashboard/dashboard.html b/client/imports/ui/pages/dashboard/dashboard.html
@@ -63,5 +63,12 @@
 
 <!-- Non-Logged In Dashboard -->
 <div class="tuxlab-dashboard" *ngIf="!user">
-  Welcome to TuxLab Message
+  <md-card>
+    <md-card-title>
+      <h1>Welcome to TuxLab!</h1>  
+    </md-card-title>
+    <md-card-content>
+      
+    </md-card-content>  
+  </md-card>
 </div>
diff --git a/client/imports/ui/pages/lab/labview.ts b/client/imports/ui/pages/lab/labview.ts
@@ -56,12 +56,12 @@ export default class LabView extends MeteorComponent {
   updateMarkdown: string;
   taskName: string = "Task Name Here";
   labProgress: string = "3 / 10";
-  tasks: Array<any>;
+  tasks: Array<any> = [];
   currentTask: number;
   currentCompleted: boolean;
   courseId: string;
   nextButton : boolean;
-  taskUpdates : Array<string>
+  taskUpdates : Array<string> = [];
   @ViewChild(Terminal) term : Terminal;
 
 
@@ -70,25 +70,6 @@ export default class LabView extends MeteorComponent {
     this.taskUpdates = [];
     this.nextButton = false;
     
-    // Tests
-    this.tasks = [
-      { id: 1, name: "Task 1", completed: true, md: "# Task 1" },
-      { id: 2, name: "Task 2", completed: true, md: "# Task 2" },
-      { id: 3, name: "Task 3", completed: true, md: "# Task 3" },
-      { id: 4, name: "Task 4", completed: false, md: "# Task 4" },
-      { id: 5, name: "Task 5", completed: true, md: "# Task 5" },
-      { id: 6, name: "Task 6", completed: false, md: "# Task 6" },
-    ];
-    this.taskUpdates = [
-      "## Feedback 1",
-      "## Feedback 2",
-      "## Feedback 3",
-      null,
-      "## Feedback 5",
-      null
-    ];
-    this.joinTaskUpdate();
-    
     document.getElementById('course-content').style.maxWidth = "100%";
   }
 
diff --git a/client/style/course/_courseview.scss b/client/style/course/_courseview.scss
@@ -118,9 +118,20 @@
 	}
 }
 
-.course-gradelist {
-	display: none;
-}
-.course-lablist {
-	display: none;
+.tuxlab-course-dashboard {
+  md-card {
+    md-card-title {
+      md-card-title-text {
+        md-icon {
+          color: #666666;
+          float: right;
+          line-height: 0px;
+          cursor: pointer;
+        }
+        .tuxicon-cog:before {
+          font-size: 36px;
+        }
+      }
+    }
+  }
 }
diff --git a/client/style/lab/_labview.scss b/client/style/lab/_labview.scss
@@ -97,7 +97,7 @@
     .markdown-toolbar{
       md-toolbar{
         min-height:inherit;
-        background-color: #f0f0f0;
+        background-color: #e0e0e0;
         .wrapper{
           display: flex;
           flex-direction: row;
diff --git a/collections/course b/collections/course
diff --git a/collections/users.ts b/collections/users.ts
diff --git a/package.json b/package.json
