[U] Release v0.4.3.1006

[M] Rename course-type-radar to type-radar
[S] Make background lighter
2019-11-09 22:15:31 -05:00 · 2019-11-09 22:14:41 -05:00 · 2019-11-09 22:11:02 -05:00 · 2019-11-09 22:10:45 -05:00 · 2019-11-09 22:10:33 -05:00 · 2019-11-09 22:10:16 -05:00
32 changed files with 1205 additions and 539 deletions
@@ -3,7 +3,8 @@
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
-        <meta name="viewport" content="width=device-width,initial-scale=1.0">
+        <!--meta name="viewport" content="width=device-width,initial-scale=1.0"-->
+        <meta name="viewport" content="width=1024">

        <link rel="icon" href="<%= BASE_URL %>favicon.ico">
        <title>Veracross Analyzer</title>
@@ -3,63 +3,14 @@ import Login from '@/components/login/login';
 import Navigation from '@/components/navigation/navigation';
 import Overall from '@/pages/overall/overall.vue';
 import Constants from '@/constants';
-import JsonUtils from '@/utils/json-utils';
 import pWaitFor from 'p-wait-for';
-import {HttpUtils} from '@/utils/http-utils';
-import {CourseUtils} from '@/utils/course-utils';
-import {GPAUtils} from '@/utils/gpa-utils';
+import {HttpUtils} from '@/logic/utils/http-utils';
+import {GPAUtils} from '@/logic/utils/gpa-utils';
 import Loading from '@/components/loading/loading.vue';
 import CoursePage from '@/pages/course/course-page.vue';
-import {FormatUtils} from '@/utils/format-utils';
+import Course from '@/logic/course';


-/**
- * Objects of this interface represent assignment grades.
- */
-export interface Assignment
-{
-    id: number,
-    scoreId: number,
-    type: string,
-    typeId: number,
-    description: string,
-    date: string,
-    complete: string,
-    include: boolean,
-    display: boolean,
-
-    unread: boolean,
-
-    scoreMax: number,
-    score: number
-}
-
-/**
- * A course
- */
-export interface Course
-{
-    assignmentsId: number,
-    id: number,
-    name: string,
-    teacherName: string,
-    status: string,
-
-    letterGrade?: string,
-    numericGrade?: number,
-
-    level: string,
-    scaleUp: number,
-
-    grading:
-    {
-        method: string,
-        weightingMap: {[index: string]: number}
-    }
-
-    assignments: Assignment[]
-}
-
@Component({
    components: {Login, Navigation, Overall, Loading, CoursePage},
 })
@@ -145,10 +96,7 @@ export default class App extends Vue
            if (response.success)
            {
                // Save courses
-                this.courses = response.data;
-
-                // Post processing
-                CourseUtils.postProcess(this.courses);
+                this.courses = response.data.map((courseJson: any) => new Course(courseJson));

                // Load assignments
                this.loadAssignments();
@@ -175,9 +123,7 @@ export default class App extends Vue
                // Check success
                if (response.success)
                {
-                    // Load assignments
-                    // Parse json and filter it
-                    course.assignments = JsonUtils.filterAssignments(response.data);
+                    course.loadAssignments(response.data);
                }
                else throw new Error(response.data);
            })
@@ -185,10 +131,10 @@ export default class App extends Vue
        });

        // Wait for assignments to be ready.
-        pWaitFor(() => this.courses.every(c => c.assignments != null)).then(() =>
+        pWaitFor(() => this.courses.every(c => c.rawAssignments != null)).then(() =>
        {
            // Filter courses
-            this.filteredCourses = CourseUtils.getGradedCourses(this.courses);
+            this.filteredCourses = this.courses.filter(c => c.isGraded);

            // Check grading algorithms
            this.checkGradingAlgorithms();
@@ -206,8 +152,10 @@ export default class App extends Vue
        // Loop through all the courses
        for (const course of this.filteredCourses)
        {
+            let termGrade = +GPAUtils.getTotalMeanAverage(course.computed.termAssignments[Constants.CURRENT_TERM]).toFixed(2);
+
            // Check if total-average grade is the same with percent-type grade
-            if (course.numericGrade == +GPAUtils.getTotalMeanAverage(course).toFixed(2))
+            if (course.rawNumericGrade == termGrade)
            {
                course.grading = {method: 'TOTAL_MEAN', weightingMap: {}};
            }
@@ -272,4 +220,15 @@ export default class App extends Vue
        // Refresh
        window.location.reload();
    }
+
+    /**
+     * Select time (Eg. Term 1, Term 2, All Year, etc.)
+     *
+     * @param code
+     */
+    public selectTime(code: number)
+    {
+        // TODO: Optimize
+        window.location.reload();
+    }
 }
@@ -3,7 +3,7 @@
        <login v-if="showLogin" v-on:login:token="onLogin"></login>
        <navigation :courses="filteredCourses"
                    :activeIndex.sync="selectedTab"
-                    v-on:sign-out="signOut">
+                    @sign-out="signOut" @select-time="selectTime">
        </navigation>

        <div id="app-content" v-if="assignmentsReady && loading === ''">
@@ -1,7 +1,7 @@
 import {Component, Vue} from 'vue-property-decorator';
 import Constants from '@/constants';
 import App from '@/components/app/app';
-import VersionUtils from '@/utils/version-utils';
+import VersionUtils from '@/logic/utils/version-utils';

 /**
 * This component handles user login, and obtains data from the server.
@@ -33,10 +33,12 @@ export default class Login extends Vue
                // Clear all cookies
                this.$cookies.keys().forEach(key => this.$cookies.remove(key));
            }
-
-            // Already contains valid token / TODO: Validate
-            // TODO: Update token each access
-            this.$emit('login:token', this.$cookies.get('va.token'));
+            else
+            {
+                // Already contains valid token / TODO: Validate
+                // TODO: Update token each access
+                this.$emit('login:token', this.$cookies.get('va.token'));
+            }
        }
        else
        {
@@ -27,6 +27,17 @@
    width: 110px;
 }

+#nav-grading-period
+{
+    // Float right
+    position: absolute;
+    right: 110px;
+
+    // Margins
+    margin-top: 12px;
+    margin-bottom: 12px;
+}
+
 #nav-title
 {
    // Float left
@@ -40,12 +51,21 @@
    align-items: center;

    // Margins
-    margin-left: 14px;
+    margin-left: 20px;
    margin-right: 8px;

    // Font
-    font-size: 1.25rem;
+    font: bold 16px arial;
    display: inline-flex;
+
+    // Shadow effect
+    -webkit-background-clip: text;
+    background-color: #b1b1b1;
+    color: transparent;
+    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.85);
+
+    // Make it non-clickable
+    pointer-events: none;
 }

 #next-course
@@ -59,6 +79,14 @@
    box-shadow: 0 -2px 9px 0 #ecebeb;
 }

+footer
+{
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+}
+
 #prev-course
 {
    // Up center
@@ -1,8 +1,9 @@
 import {Component, Prop, Vue} from 'vue-property-decorator';
-import App, {Course} from '@/components/app/app';
-import {CourseUtils} from '@/utils/course-utils';
-import {FormatUtils} from '@/utils/format-utils';
+import App from '@/components/app/app';
+import {CourseUtils} from '@/logic/utils/course-utils';
+import {FormatUtils} from '@/logic/utils/format-utils';
 import pWaitFor from 'p-wait-for';
+import Course from '@/logic/course';

 /**
 * This component is the top navigation bar
@@ -16,12 +17,27 @@ export default class Navigation extends Vue

    @Prop({required: true}) courses: Course[];

+    private gradingPeriod: string = 'All Year';
+
    // Instance
    public static instance: Navigation;

    /**
     * This is called when the instance is created.
     */
+    public created()
+    {
+        // Check selected time
+        if (!this.$cookies.isKey('va.grading-period'))
+        {
+            this.$cookies.set('va.grading-period', this.gradingPeriod, '10y');
+        }
+        this.gradingPeriod = this.$cookies.get('va.grading-period');
+    }
+
+    /**
+     * This is called when the instance is loaded.
+     */
    public mounted()
    {
        // Set instance
@@ -146,11 +162,25 @@ export default class Navigation extends Vue
    }

    /**
-     * This function is called when the sign out button is clicked.
+     * Select grading period
+     *
+     * @param command Term 1, Term 2, All Year, etc.
     */
-    public signOut()
+    public selectGradingPeriod(command: string)
    {
-        // Call custom event
-        this.$emit('sign-out');
+        this.gradingPeriod = command;
+        this.$cookies.set('va.grading-period', command, '10y');
+
+        // Call event
+        this.$emit('select-time', this.getSelectedGradingPeriod());
+    }
+
+    /**
+     * Get code for selected time
+     */
+    public getSelectedGradingPeriod(): number
+    {
+        if (this.gradingPeriod == 'All Year') return -1;
+        else return +this.gradingPeriod.replace('Term ', '') - 1;
    }
 }
@@ -3,9 +3,9 @@
        <el-menu style="margin-bottom: 10px;" class="centered" mode="horizontal"
                 :default-active="activeIndex" @select="onSelect">

-            <!--div id="nav-title">
+            <div id="nav-title">
                Veracross Analyzer
-            </div-->
+            </div>

            <el-menu-item index="overall">Overall</el-menu-item>

@@ -16,16 +16,34 @@
                              :key="course.name">{{course.name}}</el-menu-item>
            </el-submenu>

-            <el-button @click="signOut" id="sign-out-button" type="text">Sign Out</el-button>
+            <!-- Grading period selection -->
+            <el-dropdown id="nav-grading-period" @command="selectGradingPeriod">
+                <el-button type="primary" size="medium">
+                    {{gradingPeriod}}<i class="el-icon-arrow-down el-icon--right"></i>
+                </el-button>
+                <el-dropdown-menu slot="dropdown">
+                    <el-dropdown-item command="Term 1">Term 1</el-dropdown-item>
+                    <el-dropdown-item command="Term 2">Term 2</el-dropdown-item>
+                    <el-dropdown-item command="Term 3" disabled>Term 3</el-dropdown-item>
+                    <el-dropdown-item command="Term 4" disabled>Term 4</el-dropdown-item>
+                    <el-dropdown-item command="All Year" divided>All Year</el-dropdown-item>
+                </el-dropdown-menu>
+            </el-dropdown>
+
+            <el-button @click="$emit('sign-out')" id="sign-out-button" type="text">Sign Out</el-button>
        </el-menu>
+
+        <!-- Previous course / Next course (Only when the page is courses) -->
        <div v-if="activeIndex.includes('course') && findNextCourse(-1) != null"
             @click="nextCourse(-1)" id="prev-course" class="nav-course-operations unselectable">
            ▲ PREVIOUS COURSE ▲
        </div>
-        <div v-if="activeIndex.includes('course') && findNextCourse(1) != null"
-             @click="nextCourse(1)" id="next-course" class="nav-course-operations unselectable">
-            ▼ NEXT COURSE ▼
-        </div>
+        <footer>
+            <div v-if="activeIndex.includes('course') && findNextCourse(1) != null"
+                 @click="nextCourse(1)" id="next-course" class="nav-course-operations unselectable">
+                ▼ NEXT COURSE ▼
+            </div>
+        </footer>
    </div>
 </template>

@@ -7,7 +7,7 @@ export default class Constants
    public static API_URL: string = 'https://va.hydev.org/api';

    /** Current version */
-    public static VERSION: string = '0.3.6.784';
+    public static VERSION: string = '0.4.3.1006';

    /** Minimum version that still supports the same cookies */
    public static MIN_SUPPORTED_VERSION: string = '0.3.4.561';
@@ -53,5 +53,16 @@ export default class Constants
            '#724e58',
            '#4b565b'
        ]
-    }
+    };
+
+    // Terms (TODO: Actually get the terms dynamically
+    public static TERMS =
+    [
+        new Date('Sep 04 2019'),
+        new Date('Nov 03 2019'),
+        new Date('Jan 19 2020'),
+        new Date('Mar 22 2020'),
+        new Date('Jun 05 2020'),
+    ];
+    public static CURRENT_TERM = 1;
 }
@@ -0,0 +1,266 @@
+import JsonUtils from '@/logic/utils/json-utils';
+import {FormatUtils} from '@/logic/utils/format-utils';
+import {CourseUtils} from '@/logic/utils/course-utils';
+import Navigation from '@/components/navigation/navigation';
+import {GPAUtils} from '@/logic/utils/gpa-utils';
+
+/**
+ * Objects of this interface represent assignment grades.
+ */
+export interface Assignment
+{
+    id: number
+    scoreId: number
+    type: string
+    typeId: number
+    description: string
+    time: number
+    complete: string
+    include: boolean
+    display: boolean
+
+    unread: boolean
+
+    scoreMax: number
+    score: number
+
+    gradingPeriod: number
+}
+
+export interface AssignmentType
+{
+    id: number
+    name: string
+
+    weight: number
+    scoreMax: number
+    score: number
+    percent: number
+}
+
+export default class Course
+{
+    id: number;
+    assignmentsId: number;
+    name: string;
+    teacherName: string;
+    status: string;
+    rawAssignments: Assignment[];
+
+    rawLetterGrade?: string;
+    rawNumericGrade?: number;
+
+    level: string;
+    scaleUp: number;
+
+    grading:
+    {
+        method: string
+        weightingMap: {[index: string]: number}
+    };
+
+    computed:
+    {
+        termAssignments: Assignment[][]
+        allYearGrade: number
+    };
+
+    /**
+     * Construct a course with a course json object
+     *
+     * @param courseJson Course json object
+     */
+    constructor(courseJson: any)
+    {
+        this.id = courseJson.id;
+        this.assignmentsId = courseJson.assignmentsId;
+        this.name = FormatUtils.parseText(courseJson.name).trim();
+        this.teacherName = courseJson.teacherName;
+        this.status = courseJson.status;
+
+        this.rawLetterGrade = courseJson.letterGrade;
+        this.rawNumericGrade = courseJson.numericGrade;
+
+        // Other api issue
+        if (this.rawLetterGrade == '')
+        {
+            this.rawNumericGrade = undefined;
+            this.rawLetterGrade = undefined;
+        }
+
+        // Level and scaleUp
+        let level = CourseUtils.detectLevel(this.name);
+        if (level != undefined)
+        {
+            this.level = level.level;
+            this.scaleUp = level.scaleUp;
+        }
+        else this.level = 'Unknown';
+
+        this.grading = courseJson.grading;
+    }
+
+    /**
+     * Load in assignments data
+     *
+     * @param data Assignments data
+     */
+    loadAssignments(data: any)
+    {
+        // Load assignments
+        // Parse json and filter it
+        this.rawAssignments = JsonUtils.filterAssignments(data);
+
+        // Sort by date (Latest is at 0)
+        this.rawAssignments.sort((a, b) => b.time - a.time);
+
+        // Filter assignments into terms
+        let termAssignments: Assignment[][] = [[], [], [], []];
+        let currentTerm = 0;
+
+        // Loop through it by time order
+        this.rawAssignments.forEach(a => termAssignments[a.gradingPeriod].push(a));
+
+        // Set computed data
+        this.computed = {termAssignments: termAssignments, allYearGrade: -1};
+    }
+
+    /**
+     * Is graded or not
+     */
+    get isGraded(): boolean
+    {
+        // Skip future or past courses
+        if (this.status != 'active') return false;
+
+        // Skip courses without levels TODO: Ask for user input
+        if (this.level == 'None' || this.level == 'Unknown' || this.scaleUp == -1) return false;
+
+        // Skip courses without graded assignments
+        if (this.assignments.length == 0) return false;
+
+        // Skip if there are no grading scale
+        // if (course.grading.method == 'NOT_GRADED') return;
+
+        // Is graded
+        return true;
+    }
+
+    /**
+     * Get assignments of the selected time
+     */
+    get rawSelectedAssignments(): Assignment[]
+    {
+        let timeCode = Navigation.instance.getSelectedGradingPeriod();
+
+        // All year
+        if (timeCode == -1)
+        {
+            return this.rawAssignments;
+        }
+
+        // Specific time
+        return this.computed.termAssignments[timeCode];
+    }
+
+    private _cacheAssignments: Assignment[];
+
+    /**
+     * Get graded assignments
+     */
+    get assignments(): Assignment[]
+    {
+        if (this._cacheAssignments == null)
+           this._cacheAssignments = this.rawSelectedAssignments.filter(a => a.complete == 'Complete');
+
+        return this._cacheAssignments;
+    }
+
+    private _cacheLetterGrade: string;
+
+    /**
+     * Get letter grade
+     */
+    get letterGrade(): string
+    {
+        if (this._cacheLetterGrade == null)
+        {
+            // Get scale
+            let scale = GPAUtils.findScale(this.numericGrade);
+
+            // Scale not found
+            if (scale == undefined) return this._cacheLetterGrade = '--';
+
+            // Cache
+            this._cacheLetterGrade = scale.letter;
+        }
+
+        return this._cacheLetterGrade;
+    }
+
+    private _cacheNumericGrade: number;
+
+    /**
+     * Get numeric grade
+     */
+    get numericGrade(): number
+    {
+        // Cached
+        if (this._cacheNumericGrade == null)
+        {
+            // Calculate
+            if (this.grading.method == 'PERCENT_TYPE')
+            {
+                this._cacheNumericGrade = GPAUtils.getPercentTypeAverage(this, this.assignments);
+            }
+            else if (this.grading.method == 'TOTAL_MEAN')
+            {
+                this._cacheNumericGrade = GPAUtils.getTotalMeanAverage(this.assignments);
+            }
+            else this._cacheNumericGrade = -1;
+        }
+
+        return this._cacheNumericGrade;
+    }
+
+    private _cacheAssignmentTypes: AssignmentType[];
+
+    /**
+     * Get assignment types
+     */
+    get assignmentTypes(): AssignmentType[]
+    {
+        if (this._cacheAssignmentTypes == null)
+        {
+            // Get all types
+            let types = this.assignments.map(a => a.type);
+
+            // Remove duplicates
+            types = types.filter((type, i, a) => a.indexOf(type) == i);
+
+            // Get total possible score for weight calculation
+            let totalScoreMax = this.assignments.reduce((sum, a) => sum + a.scoreMax, 0);
+
+            // For every type...
+            this._cacheAssignmentTypes = types.map(type =>
+            {
+                // Get assignments of the type
+                let typeAssignments = this.assignments.filter(a => a.type == type);
+
+                // Count scores and max scores
+                let score = typeAssignments.reduce((sum, a) => sum + a.score, 0);
+                let scoreMax = typeAssignments.reduce((sum, a) => sum + a.scoreMax, 0);
+
+                // Calculate weight
+                let weight = this.grading.method == 'PERCENT_TYPE'
+                    ? this.grading.weightingMap[type] : scoreMax / totalScoreMax;
+
+                // Return
+                return {name: type, id: typeAssignments[0].typeId, weight: weight,
+                    scoreMax: scoreMax, score: score, percent: +(score / scoreMax * 100).toFixed(2)}
+            })
+        }
+
+        return this._cacheAssignmentTypes;
+    }
+}
@@ -1,5 +1,6 @@
-import {Course} from '@/components/app/app';
-import {FormatUtils} from '@/utils/format-utils';
+import Course from '@/logic/course';
+import Navigation from '@/components/navigation/navigation';
+import Constants from '@/constants';

 const LEVEL_AP = {level: 'AP', scaleUp: 1};
 const LEVEL_H = {level: 'H', scaleUp: 0.75};
@@ -19,39 +20,6 @@ UNKNOWN_COURSE_LIST.set('Painting', LEVEL_CP);

 export class CourseUtils
 {
-    /**
-     * Return a list of courses that are graphed
-     *
-     * @param original Original course list
-     * @return Course[] Filtered course list
-     */
-    public static getGradedCourses(original: Course[]): Course[]
-    {
-        // Define result
-        let result: Course[] = [];
-
-        // Filter through courses
-        original.forEach(course =>
-        {
-            // Skip future or past courses
-            if (course.status != 'active') return;
-
-            // Skip courses without levels TODO: Ask for user input
-            if (course.level == 'None' || course.level == 'Unknown' || course.scaleUp == -1) return;
-
-            // Skip courses without graded assignments
-            if (course.assignments.filter(a => a.complete == 'Complete').length == 0) return;
-            
-            // Skip if there are no grading scale
-            // if (course.grading.method == 'NOT_GRADED') return;
-
-            // Add it to the list
-            result.push(course);
-        });
-
-        return result;
-    }
-
    /**
     * Format course to tab index string
     *
@@ -63,38 +31,12 @@ export class CourseUtils
        return `course/${course.id}/${course.name.toLowerCase().split(' ').join('-')}`;
    }

-    /**
-     * Post process course list
-     *
-     * @param courses Course list
-     */
-    public static postProcess(courses: Course[])
-    {
-        for (let course of courses)
-        {
-            // Parse name
-            course.name = FormatUtils.parseText(course.name).trim();
-
-            // Detect level
-            let level = this.detectLevel(course.name);
-            if (level != undefined)
-            {
-                course.level = level.level;
-                course.scaleUp = level.scaleUp;
-            }
-            else
-            {
-                course.level = 'Unknown';
-            }
-        }
-    }
-
    /**
     * Detect course level based on course name
     *
     * @param name Course name
     */
-    private static detectLevel(name: string)
+    static detectLevel(name: string)
    {
        // Common ones
        if (name.startsWith('AP')) return LEVEL_AP;
@@ -124,4 +66,24 @@ export class CourseUtils
        // Really unknown
        return undefined;
    }
+
+    /**
+     * Get the begin date of the selected term
+     */
+    static getTermBeginDate()
+    {
+        let selected = Navigation.instance.getSelectedGradingPeriod();
+
+        return selected == -1 ? Constants.TERMS[0] : Constants.TERMS[selected];
+    }
+
+    /**
+     * Get the end date of the selected term
+     */
+    static getTermEndDate()
+    {
+        let selected = Navigation.instance.getSelectedGradingPeriod();
+
+        return selected == -1 ? Constants.TERMS[3] : Constants.TERMS[selected + 1];
+    }
 }
@@ -2,20 +2,6 @@ import moment from 'moment';

 export class FormatUtils
 {
-    /**
-     * Convert date format to yyyy-mm-dd
-     *
-     * @param _date Date
-     */
-    public static toChartDate(_date: string | Date)
-    {
-        // Convert to Date
-        let date: Date = _date instanceof Date ? _date : new Date(_date);
-
-        // Convert to yyyy-mm-dd
-        return moment(date).format('YYYY-MM-DD');
-    }
-
    /**
     * Limit string length
     *
@@ -0,0 +1,190 @@
+import Course, {Assignment} from '@/logic/course';
+
+export interface Scale
+{
+    min: number
+    letter: string
+    gp: number
+}
+
+/**
+ * This is an utility class to calculate GPA.
+ */
+export class GPAUtils
+{
+    // [[Min score, Letter grade, Base GPA], ...]
+    public static SCALE: Scale[] =
+    [
+        {min: 96.5, letter: 'A+', gp: 4.00},
+        {min: 92.5, letter: 'A' , gp: 3.75},
+        {min: 89.5, letter: 'A-', gp: 3.50},
+        {min: 86.5, letter: 'B+', gp: 3.25},
+        {min: 82.5, letter: 'B' , gp: 3.00},
+        {min: 79.5, letter: 'B-', gp: 2.75},
+        {min: 76.5, letter: 'C+', gp: 2.50},
+        {min: 72.5, letter: 'C' , gp: 2.25},
+        {min: 70.5, letter: 'C-', gp: 2.00},
+        {min: 69.5, letter: 'D' , gp: 1.00},
+        {min: 0   , letter: 'F' , gp: 0.00}
+    ];
+
+    /**
+     * Calculate GPA for a list of couses
+     *
+     * @param coursesOriginal List of courses
+     */
+    public static getGPA(coursesOriginal: Course[]): {gpa: number, accurate: boolean, max: number}
+    {
+        // Clone array
+        let courses: Course[] = [];
+
+        // Accurate or not
+        let accurate: boolean = true;
+
+        // Remove all courses that does not have a grade
+        coursesOriginal.forEach(course =>
+        {
+            if (course.letterGrade == null || course.letterGrade == '')
+            {
+                accurate = false;
+            }
+            else if (course.level != 'none')
+            {
+                courses.push(course);
+            }
+        });
+
+        // If no course have grade, return -1
+        if (courses.length == 0)
+        {
+            return {gpa: -1, accurate: false, max: -1};
+        }
+
+        // Count total GPA
+        let totalGPA = 0;
+        let maxTotal = 0;
+        courses.forEach(course =>
+        {
+            totalGPA += this.getGP(course, course.letterGrade);
+            maxTotal += this.getGP(course, 'A+');
+        });
+
+        // Get average GPA, round to two decimal places
+        let gpa = Math.round(totalGPA / courses.length * 100) / 100;
+        let maxGPA = Math.round(maxTotal / courses.length * 100) / 100;
+
+        // Return results
+        return {gpa: gpa, accurate: accurate, max: maxGPA};
+    }
+
+    /**
+     * Calculate GPA for a course
+     *
+     * @param course Course
+     * @param letterGrade Letter grade
+     */
+    public static getGP(course: Course, letterGrade: string): number
+    {
+        // Get scale
+        let scale = this.findScale(letterGrade);
+
+        // No scale
+        if (scale == undefined) return -1;
+
+        // Add scaleUp if not failed.
+        return scale.gp == 0 ? 0 : scale.gp + course.scaleUp;
+
+    }
+
+    /**
+     * Find the scale for a grade
+     *
+     * @param grade Letter grade or numeric grade
+     */
+    public static findScale(grade: string | number): Scale | undefined
+    {
+        // Letter grade
+        if (typeof grade == 'string')
+        {
+            return this.SCALE.find(scale => scale.letter == grade);
+        }
+
+        // Numeric grade
+        return this.SCALE.find(scale => grade >= scale.min);
+    }
+
+    /**
+     * Calculate the total-mean (total/max) average
+     *
+     * @param assignments
+     */
+    public static getTotalMeanAverage(assignments: Assignment[])
+    {
+        let score = 0;
+        let max = 0;
+
+        // Loop through assignments
+        assignments.forEach(assignment =>
+        {
+            // If assignment should be displayed
+            if (assignment.complete != 'Complete') return;
+
+            // Record scores
+            score += assignment.score;
+            max += assignment.scoreMax;
+        });
+
+        // Return
+        return +(score / max * 100).toFixed(2);
+    }
+
+    /**
+     * Calculate the percent type
+     * TODO: Combine it with overall-line
+     *
+     * @param course
+     * @param assignments
+     */
+    public static getPercentTypeAverage(course: Course, assignments: Assignment[])
+    {
+        let typeScores: {[index: string]: any} = {};
+        let typeCounts: {[index: string]: any} = {};
+
+        // Loop through assignments
+        assignments.forEach(assignment =>
+        {
+            // If assignment should be displayed
+            if (assignment.complete != 'Complete') return;
+
+            // Record scores
+            if (typeScores[assignment.type] == undefined) typeScores[assignment.type] = 0;
+            typeScores[assignment.type] += assignment.score / assignment.scoreMax;
+
+            if (typeCounts[assignment.type] == undefined) typeCounts[assignment.type] = 0;
+            typeCounts[assignment.type] ++;
+        });
+
+        // Count total percentage (This is to avoid less than expected cases)
+        // Eg. If HW = 25% and Quiz = 75%, I have 1 hw and 0 quiz
+        // Without total percentage, the avg grade I get is 25%.
+        let totalPercentage = 0;
+        for (let type in course.grading.weightingMap)
+        {
+            if (typeScores[type] != undefined)
+            {
+                totalPercentage += course.grading.weightingMap[type];
+            }
+        }
+
+        // Count
+        let score = 0;
+        for (let type in typeScores)
+        {
+            let typeFactor = course.grading.weightingMap[type] / totalPercentage;
+            score += typeScores[type] * typeFactor / typeCounts[type];
+        }
+
+        // Add average to the row
+        return +(score * 100).toFixed(2);
+    }
+}
@@ -0,0 +1,73 @@
+import Constants from '@/constants';
+
+export default class GraphUtils
+{
+    static DOT = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:{color}"></span>';
+
+    /**
+     * Base settings
+     *
+     * @param title
+     * @param subtitle
+     */
+    static getBaseSettings(title?: String, subtitle?: String)
+    {
+        return {
+            // Color
+            color: Constants.THEME.colors,
+
+            // Title
+            title:
+            {
+                show: title != null,
+                textStyle:
+                {
+                    fontSize: 13
+                },
+                text: title,
+                subtext: subtitle,
+                x: 'center'
+            },
+        }
+    }
+
+    /**
+     * Get term mark lines
+     */
+    static getTermLines()
+    {
+        return {
+            silent: true,
+            symbol: 'none',
+            lineStyle: {color: Constants.THEME.colors[2]},
+            animationDuration: 500,
+            data: Constants.TERMS.map((term, index) =>
+            {
+                return {xAxis: term.getTime(), label: {formatter: `Term ${index + 1}`}}
+            })
+        }
+    }
+
+    /**
+     * Get mark areas for percentage scores
+     */
+    static getGradeMarkAreas(opacity: number)
+    {
+        return {
+            silent: true,
+            data:
+            [
+                // Above 100
+                [{itemStyle: {color: 'rgba(230,253,255)', opacity: opacity}, yAxis: 120}, {yAxis: 100}],
+                // 90 to 100
+                [{itemStyle: {color: 'rgba(241,255,237)', opacity: opacity}, yAxis: 100}, {yAxis: 90}],
+                // 80 to 90
+                [{itemStyle: {color: 'rgba(255,250,216)', opacity: opacity}, yAxis: 90}, {yAxis: 80}],
+                // 70 to 80
+                [{itemStyle: {color: 'rgba(255,225,199)', opacity: opacity}, yAxis: 80}, {yAxis: 70}],
+                // Below 70 (Fail)
+                [{itemStyle: {color: 'rgb(255,190,184)', opacity: opacity}, yAxis: 70}, {yAxis: -100}]
+            ]
+        }
+    }
+}
@@ -1,4 +1,4 @@
-import {Assignment} from '@/components/app/app';
+import {Assignment} from '@/logic/course';

 export default class JsonUtils
 {
@@ -10,18 +10,15 @@ export default class JsonUtils
     */
    public static filterAssignments(assignments: any): Assignment[]
    {
-        let result: Assignment[] = [];
-
-        assignments.assignments.forEach((assignment: any) =>
+        return assignments.assignments.map((assignment: any) =>
        {
-            result.push(
-            {
+            return {
                id: assignment.assignment_id,
                scoreId: assignment.score_id,
                type: assignment.assignment_type,
                typeId: assignment.assignment_type_id,
                description: assignment.assignment_description,
-                date: assignment._date,
+                time: new Date(assignment._date).getTime(),
                complete: assignment.completion_status,
                include: assignment.include_in_calculated_grade == 1,
                display: assignment.display_grade == 1,
@@ -29,10 +26,10 @@ export default class JsonUtils
                unread: assignment.is_unread == 1,

                scoreMax: assignment.maximum_score,
-                score: +assignment.raw_score
-            });
-        });
+                score: +assignment.raw_score,

-        return result;
+                gradingPeriod: +assignment.grading_period.replace('Quarter ', '') - 1
+            }
+        });
    }
 }
@@ -0,0 +1,74 @@
+<template>
+    <div id="assignment-type-head">
+        <el-card :body-style="{padding: '0px'}">
+            <div id="type-info-card">
+                <span id="type-name">{{type.name}}</span>
+                <span id="type-average">Average: {{type.percent}}%</span>
+            </div>
+
+            <AssignmentEntry v-for="assignment of filteredAssignments" :key="assignment.id"
+                             :assignment="assignment" :unread="false"
+                             backgroundColor="#ffffff" narrow="true">
+            </AssignmentEntry>
+        </el-card>
+    </div>
+</template>
+
+<script lang="ts">
+    import {Component, Prop, Vue} from 'vue-property-decorator';
+    import AssignmentEntry from '@/pages/overall/overall-course/assignment-entry/assignment-entry.vue';
+    import {Assignment, AssignmentType} from '@/logic/course';
+
+    @Component({
+        components: {AssignmentEntry}
+    })
+    export default class AssignmentTypeHead extends Vue
+    {
+        @Prop({required: true}) type: AssignmentType;
+        @Prop({required: true}) assignments: Assignment[];
+
+        get filteredAssignments()
+        {
+            // Filter assignments to only this type
+            return this.assignments.filter(a => a.typeId == this.type.id);
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+    #type-info-card
+    {
+        height: 60px;
+    }
+
+    #type-name
+    {
+        // Font
+        font-size: 22px;
+        color: var(--main);
+
+        // Center
+        height: 60px;
+        line-height: 60px;
+
+        // Alignment
+        padding-left: 20px;
+        float: left;
+    }
+
+    #type-average
+    {
+        // Font
+        font-size: 14px;
+        color: #8db3e4;
+
+        // Center
+        height: 60px;
+        line-height: 64px;
+
+        // Alignment
+        float: left;
+        margin-left: 15px;
+        display: inline-block;
+    }
+</style>
@@ -14,22 +14,36 @@
                </el-col>
            </el-row>

-            <!--AssignmentEntry v-for="assignment in course.assignments"
-                             :assignment="assignment" :unread="false">
-            </AssignmentEntry-->
+
+            <el-row>
+                <el-col :span="12">
+                    <el-card class="large overall-line-card vertical-center" body-style="padding: 0">
+                        <CourseTypeRadar :course="course"></CourseTypeRadar>
+                    </el-card>
+                </el-col>
+                <el-col :span="12">
+                    Hi
+                </el-col>
+            </el-row>
+
+            <AssignmentTypeHead v-for="type in course.assignmentTypes" :key="type.id"
+                                :type="type" :assignments="course.assignments">
+            </AssignmentTypeHead>
        </div>
    </el-card>
 </template>

 <script lang="ts">
    import {Component, Prop, Vue} from 'vue-property-decorator';
-    import {Assignment, Course} from '@/components/app/app';
    import CourseHead from '@/pages/overall/overall-course/course-head/course-head.vue';
    import CourseScatter from '@/pages/course/course-scatter/course-scatter';
    import AssignmentEntry from '@/pages/overall/overall-course/assignment-entry/assignment-entry.vue';
+    import AssignmentTypeHead from '@/pages/course/assignment-type-head/assignment-type-head.vue';
+    import Course, {Assignment} from '@/logic/course';
+    import TypeRadar from '@/pages/course/course-type-radar/type-radar';

    @Component({
-        components: {AssignmentEntry, CourseHead, CourseScatter}
+        components: {CourseTypeRadar: TypeRadar, AssignmentEntry, CourseHead, CourseScatter, AssignmentTypeHead}
    })
    export default class CoursePage extends Vue
    {
@@ -1,15 +1,14 @@
 import {Component, Prop, Vue} from 'vue-property-decorator';
-import {Assignment, Course} from '@/components/app/app';
 import Constants from '@/constants';
-import {FormatUtils} from '@/utils/format-utils';
+import {FormatUtils} from '@/logic/utils/format-utils';
 import moment from 'moment';
+import Course, {Assignment} from '@/logic/course';
+import GraphUtils from '@/logic/utils/graph-utils';

@Component({
 })
 export default class CourseScatter extends Vue
 {
-    private static DOT = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:{color}"></span>';
-
    @Prop({required: true}) course: Course;

    /**
@@ -27,40 +26,11 @@ export default class CourseScatter extends Vue
     */
    get chartSettings()
    {
-        // Map assignments
-        let map = this.mapAssignments();
-
-        // Scatter data point style
-        let itemStyle =
-        {
-            normal:
-            {
-                opacity: 0.8,
-                shadowBlur: 10,
-                shadowOffsetX: 0,
-                shadowOffsetY: 0,
-                shadowColor: 'rgba(0, 0, 0, 0.2)'
-            }
-        };
-
        // Create settings
        let settings =
        {
-            // Color
-            color: Constants.THEME.colors,
-
-            // Title
-            title:
-            {
-                show: true,
-                textStyle:
-                {
-                    fontSize: 13
-                },
-                text: 'Assignments',
-                subtext: 'Assignment scores for ' + this.course.name,
-                x: 'center'
-            },
+            // Base settings
+            ...GraphUtils.getBaseSettings('Assignments', 'Assignment scores for ' + this.course.name),

            // X axis represents course names
            xAxis:
@@ -70,7 +40,7 @@ export default class CourseScatter extends Vue
                {
                    formatter: (name: any) => moment(name).format('MMM DD')
                },
-                max: FormatUtils.toChartDate(new Date())
+                max: new Date().getTime()
            },

            // Y axis represents GPAs and MaxGPAs
@@ -84,8 +54,8 @@ export default class CourseScatter extends Vue
                {
                    formatter: (name: any) => name + '%'
                },
-                max: 100,
-                min: (value: any) => Math.floor(value.min) - 5
+                min: (value: any) => Math.floor(value.min) - 5,
+                max: (value: any) => Math.min(Math.ceil(value.max), 110)
            },

            // Tooltip
@@ -96,8 +66,8 @@ export default class CourseScatter extends Vue
                {
                    type: 'cross'
                },
-                formatter: (ps: any[]) => ps[0].data[0] + '<br>' + ps.map(p =>
-                    `${CourseScatter.DOT.replace('{color}', p.color)}
+                formatter: (ps: any[]) => moment(ps[0].data[0]).format('MMM DD, YYYY') + '<br>' + ps.map(p =>
+                    `${GraphUtils.DOT.replace('{color}', p.color)}
                    ${FormatUtils.limit(p.data[2], 22)}: ${p.data[1]}%<br>`).join('')
            },

@@ -114,20 +84,53 @@ export default class CourseScatter extends Vue
            },

            // Data
-            series: Array.from(map, ([type, assignments]) =>
-            {
-                return {
-                    type: 'scatter',
-                    name: type,
-                    data: CourseScatter.assignmentsData(assignments),
-                    itemStyle: itemStyle
-                }
-            })
+            series: this.series()
        };

        return settings;
    }

+    /**
+     * Get series data
+     */
+    private series()
+    {
+        // Scatter data point style
+        let itemStyle =
+        {
+            normal:
+            {
+                opacity: 0.8,
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowOffsetY: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.2)'
+            }
+        };
+
+        // Create scatter plots
+        let map = this.mapAssignments();
+        let series: any[] = Array.from(map, ([type, assignments]) =>
+        {
+            return {
+                type: 'scatter',
+                name: type,
+                data: CourseScatter.assignmentsData(assignments),
+                itemStyle: itemStyle
+            }
+        });
+
+        // Push other stuff
+        series.push(
+        {
+            type: 'line',
+            markLine: GraphUtils.getTermLines(),
+            markArea: GraphUtils.getGradeMarkAreas(0.4)
+        });
+
+        return series;
+    }
+
    /**
     * Map assignments to {assignmentType, [assignment]} format.
     */
@@ -157,6 +160,6 @@ export default class CourseScatter extends Vue
    private static assignmentsData(assignments: Assignment[])
    {
        return assignments.filter(a => a.complete == 'Complete')
-            .map(a => [FormatUtils.toChartDate(a.date), (a.score / a.scoreMax * 100).toFixed(2), a.description]);
+            .map(a => [a.time, (a.score / a.scoreMax * 100).toFixed(2), a.description]);
    }
 }
@@ -1,6 +1,6 @@
 <template>
    <div id="course-scatter">
-        <ve-scatter height="450px" class="graph" :extend="{heyIUsedCourseObject: this.course.name}" :after-config="afterConfig"></ve-scatter>
+        <ve-scatter height="450px" class="graph" :extend="{a: this.course.name}" :after-config="afterConfig"></ve-scatter>
    </div>
 </template>

@@ -0,0 +1,114 @@
+import {Component, Prop, Vue} from 'vue-property-decorator';
+import Constants from '@/constants';
+import {FormatUtils} from '@/logic/utils/format-utils';
+import moment from 'moment';
+import Course, {Assignment} from '@/logic/course';
+import GraphUtils from '@/logic/utils/graph-utils';
+
+@Component
+export default class TypeRadar extends Vue
+{
+    @Prop({required: true}) course: Course;
+
+    /**
+     * Override options
+     *
+     * @param options Original options (Unused)
+     */
+    afterConfig(options: any)
+    {
+        return this.chartSettings;
+    }
+
+    /**
+     * Generate settings
+     */
+    get chartSettings()
+    {
+        // Create settings
+        let settings =
+        {
+            ...GraphUtils.getBaseSettings('Type Radar',
+                'Assignment type grades for ' + this.course.name),
+
+            // Radar settings
+            radar:
+            {
+                // shape: 'circle',
+                name:
+                {
+                    textStyle:
+                    {
+                        fontSize: 14,
+                        textShadowColor: '#cfcfcf',
+                        textShadowBlur: 2,
+                        textShadowOffsetX: 1,
+                        textShadowOffsetY: 1,
+                        color: '#fff',
+                        backgroundColor: '#f6f6f6',
+                        borderRadius: 3,
+                        padding: [3, 5]
+                    }
+                },
+                splitArea:
+                {
+                    areaStyle:
+                    {
+                        color:
+                        [
+                            'rgb(255,161,151)',
+                            'rgb(255,190,184)',
+                            'rgba(255,225,199)',
+                            'rgba(255,250,216)',
+                            'rgba(241,255,237)',
+                        ],
+                        opacity: 0.4
+                    }
+                },
+                indicator: this.course.assignmentTypes.map((t, i) => {return {
+                    name: `${t.name}\n${t.percent}%`,
+                    max: 100,
+                    color: Constants.THEME.colors[i]
+                }}),
+                radius: '60%',
+                center: ['50%', '60%']
+            },
+
+            tooltip: {},
+
+            // Data
+            series:
+            {
+                type: 'radar',
+                data:
+                [
+                    {
+                        name: 'Score',
+                        symbol: 'circle',
+                        areaStyle:
+                        {
+                            color:
+                            {
+                                type: 'radial',
+                                x: 0.5, y: 0.6, r: 0.5,
+                                colorStops:
+                                [
+                                    {offset: 0, color: '#ffa0a0'},
+                                    {offset: 0.5, color: '#fffead'},
+                                    {offset: 1, color: '#d1ffde'}
+                                ],
+                                global: false // 缺省为 false
+                            },
+                            opacity: 0.2
+                        },
+                        value: this.course.assignmentTypes.map(t => t.percent)
+                    }
+                ]
+            },
+
+            color: '#6771c1'
+        };
+
+        return settings;
+    }
+}
@@ -0,0 +1,16 @@
+<template>
+    <div id="course-scatter">
+        <ve-radar height="450px" class="graph" :extend="{a: this.course.name}" :after-config="afterConfig"></ve-radar>
+    </div>
+</template>
+
+<script src="./type-radar.ts" lang="ts"></script>
+<style lang="scss" scoped>
+    #overall-bar
+    {
+        .graph
+        {
+            margin-top: 50px;
+        }
+    }
+</style>
@@ -1,8 +1,8 @@
 import {Component, Prop, Vue} from 'vue-property-decorator';
-import {Course} from '@/components/app/app';
-import {GPAUtils} from '@/utils/gpa-utils';
+import Course from '@/logic/course';
+import {GPAUtils} from '@/logic/utils/gpa-utils';
 import Constants from '@/constants';
-import {FormatUtils} from '@/utils/format-utils';
+import {FormatUtils} from '@/logic/utils/format-utils';

@Component({
 })
@@ -53,15 +53,16 @@ export default class OverallBar extends Vue
            // Data
            series:
            [
+                // Max GP
                {
                    type: 'bar',
                    barGap: '-100%',
                    data: this.courses.map(course =>
                    {
-                        return {value: [course.name, GPAUtils.getGP(course, 'A+')],
-                            itemStyle: {color: '#d8d8d8'}}
+                        return {value: [course.name, GPAUtils.getGP(course, 'A+')], itemStyle: {color: '#d8d8d8'}}
                    }),
                },
+                // Current GP
                {
                    type: 'bar',
                    barGap: '-100%',
@@ -92,14 +93,21 @@ export default class OverallBar extends Vue
    {
        let data: any = [];

-        this.courses.forEach(course =>
+        this.courses.forEach((course, index) =>
        {
+            // Get GP
+            let gp = GPAUtils.getGP(course, course.letterGrade);
+
+            // No grade cases
+            if (gp == -1) return;
+
+            // Push data
            data.push(
            {
-                value: [course.name, GPAUtils.getGP(course, course.letterGrade)],
+                value: [course.name, gp],
                itemStyle:
                {
-                    color: Constants.THEME.colors[data.length]
+                    color: Constants.THEME.colors[index]
                }
            });
        });
@@ -1,6 +1,6 @@

 // Row
-.unread-entry
+.assignment-entry
 {
    height: 40px;
    padding: 0 10px 0 20px;
@@ -16,6 +16,10 @@
        span.month
        {
            margin-right: 5px;
+
+            // Unified width
+            display: inline-block;
+            min-width: 50px;
        }

        span.now
@@ -95,9 +99,40 @@
        height: 22px;
        padding: 0 5px;
    }
+
+    // Unified width
+    .entry-box.score, .entry-box.max
+    {
+        min-width: 30px;
+        display: inline-block;
+        text-align: center;
+    }
+
+    // Unified width
+    .entry-box.percent
+    {
+        min-width: 60px;
+        display: inline-block;
+        text-align: right;
+    }
 }

-.unread-entry:first-child
+// Narrow layout
+.assignment-entry.narrow
+{
+    height: 34px;
+}
+
+// Unread
+.no-unread
+{
+    visibility: hidden !important;
+    width: 0 !important;
+    margin-left: 0 !important;
+    padding: 0 0 0 10px !important;
+}
+
+.assignment-entry:first-child
 {
    padding-top: 3px;

@@ -1,9 +1,12 @@
 <template>
-    <div class="unread-entry vertical-center">
+    <div class="assignment-entry vertical-center"
+         :class="narrow ? 'narrow' : ''"
+         :style="`background: ${backgroundColor}`">
+
        <el-row class="unread-row">
            <el-col :span="3" class="date">
-                <span class="month">{{getMoment(assignment.date).format("MMM Do")}}</span>
-                <span class="now">({{getMoment(assignment.date).fromNow()}})</span>
+                <span class="month">{{getMoment(assignment.time).format("MMM D")}}</span>
+                <span class="now">({{getMoment(assignment.time).fromNow()}})</span>
            </el-col>

            <el-col :span="15" class="description">
@@ -22,8 +25,9 @@
                <span class="score entry-box">{{assignment.score}}</span>
                <span class="max entry-box">{{assignment.scoreMax}}</span>

-                <el-button class="mark-as-read" size="mini" type="text"
-                           icon="el-icon-close" @click="markAsRead" v-if="unread">
+                <el-button class="mark-as-read" :class="unread ? 'unread' : 'no-unread'"
+                           size="mini" type="text" icon="el-icon-close"
+                           @click="markAsRead">
                </el-button>
            </el-col>
        </el-row>
@@ -32,8 +36,8 @@

 <script lang="ts">
    import {Component, Prop, Vue} from 'vue-property-decorator';
-    import {Assignment} from '@/components/app/app';
    import moment from 'moment';
+    import {Assignment} from '@/logic/course';

    @Component
    export default class AssignmentEntry extends Vue
@@ -41,13 +45,15 @@
        @Prop({required: true}) assignment: Assignment;

        @Prop({default: false}) unread: boolean;
+        @Prop({default: '#f5f7fa'}) backgroundColor: string;
+        @Prop({default: false}) narrow: boolean;

        /**
         * Format a date to the displayed format
         *
         * @param date Date
         */
-        getMoment(date: string)
+        getMoment(date: number)
        {
            return moment(new Date(date));
        }
@@ -9,8 +9,8 @@
            <el-col :span="12" class="course-col-grade">
                <div class="course-grade">
                    <span class="letter">{{course.letterGrade}} </span>
-                    <span class="numeric">{{course.numericGrade.toFixed(2)}}</span>
-                    <span class="percent">%</span>
+                    <span class="numeric">{{course.numericGrade === undefined ? '--' : course.numericGrade.toFixed(2)}}</span>
+                    <span class="percent" v-if="course.numericGrade !== undefined">%</span>
                </div>
                <div class="course-updates" @click="redirect" :class="unread === 0 ? 'none' : 'unread'">
                    <span class="unread-number">{{unread}}</span>
@@ -25,8 +25,8 @@

 <script lang="ts">
    import {Component, Prop, Vue} from 'vue-property-decorator';
-    import {Course} from '@/components/app/app';
-    import {CourseUtils} from '@/utils/course-utils';
+    import Course from '@/logic/course';
+    import {CourseUtils} from '@/logic/utils/course-utils';
    import Navigation from '@/components/navigation/navigation';

    @Component
@@ -1,7 +1,8 @@
 import {Component, Prop, Vue} from 'vue-property-decorator';
-import App, {Assignment, Course} from '@/components/app/app';
+import App from '@/components/app/app';
 import AssignmentEntry from '@/pages/overall/overall-course/assignment-entry/assignment-entry.vue';
 import CourseHead from '@/pages/overall/overall-course/course-head/course-head.vue';
+import Course, {Assignment} from '@/logic/course';

@Component({
    components: {UnreadEntry: AssignmentEntry, CourseHead}
@@ -1,179 +1,164 @@
 import {Component, Prop, Vue} from 'vue-property-decorator';
-import {Course} from '@/components/app/app';
 import moment from 'moment';
+import Course, {Assignment} from '@/logic/course';
+import Constants from '@/constants';
+import Navigation from '@/components/navigation/navigation';
+import {CourseUtils} from '@/logic/utils/course-utils';
+import GraphUtils from '@/logic/utils/graph-utils';
+import {GPAUtils} from '@/logic/utils/gpa-utils';

-@Component({
-})
+@Component
 export default class OverallLine extends Vue
 {
    @Prop({required: true}) courses: Course[];

-    private settings =
-    {
-        // Title
-        title:
-        {
-            show: true,
-            textStyle:
-            {
-                fontSize: 12
-            },
-            text: 'Average Grade',
-            subtext: 'Average score trend for every course',
-            x: 'center'
-        },
-        // Legend
-        legend:
-        {
-            show: false,
-            //left: 'auto',
-            //align: 'left',
-            //orient: 'vertical'
-            textStyle:
-            {
-                fontSize: 11
-            },
-            icon: 'circle'
-        },
-        // Zoom bar
-        dataZoom:
-        [
-            {
-                startValue: moment().subtract(30, 'days').format('M/D/YYYY')
-            },
-            {
-                type: 'inside'
-            }
-        ],
-        series:
-        {
-            smooth: true
-        },
-        xAxis:
-        {
-            //type: 'time'
-        },
-        yAxis:
-        {
-            min: (value: any) => Math.floor(value.min),
-            max: (value: any) => value.max
-        }
-    };
+    filteredCourses: Course[];
+    settings: any;

    /**
-     * Convert assignments list to a graph dataset.
+     * When this component is created
     */
-    get convertChart()
+    created()
    {
-        let courses = this.courses;
+        // Filter courses
+        this.filteredCourses = this.courses.filter(c => c.isGraded && c.assignments.length > 0);

-        // Compute the column names
-        let columns = courses.map(course => course.name);
-        columns.unshift('date');
+        // Generate settings
+        this.settings =
+        {
+            ...GraphUtils.getBaseSettings('Average Grade', 'Average score trend for every course'),

+            // Zoom bar
+            dataZoom:
+            [
+                {
+                    type: 'slider',
+                    startValue: Math.max(moment().subtract(30, 'days').toDate().getTime(),
+                        CourseUtils.getTermBeginDate().getTime()),
+
+                    // Minimum zoom: 1 week
+                    minValueSpan: 7 * 24 * 60 * 60 * 1000
+                }
+            ],
+
+            // Tooltip
+            tooltip:
+            {
+                trigger: 'axis'
+            },
+
+            // Axis
+            xAxis:
+            {
+                type: 'time',
+                axisLabel:
+                {
+                    formatter: (name: any) => moment(name).format('MMM DD')
+                },
+            },
+            yAxis:
+            {
+                axisLabel:
+                {
+                    formatter: (name: any) => name + '%'
+                },
+                min: (value: any) => Math.floor(value.min),
+                max: (value: any) => Math.min(Math.ceil(value.max), 110)
+            },
+
+            // Series data
+            series: this.series()
+        }
+    }
+
+    /**
+     * Override options
+     *
+     * @param options Original options (Unused)
+     */
+    afterConfig(options: any)
+    {
+        return this.settings;
+    }
+
+    /**
+     * Generate series data
+     */
+    private series()
+    {
+        // Each course
+        let series: any[] = this.filteredCourses.map(course => this.getCourseSeries(course));
+
+        // Push other stuff
+        series.push(
+        {
+            type: 'line',
+            markLine: GraphUtils.getTermLines(),
+            markArea: GraphUtils.getGradeMarkAreas(0.4)
+        });
+
+        return series
+    }
+
+    /**
+     * Generate series data for a course
+     *
+     * @param course
+     */
+    private getCourseSeries(course: Course)
+    {
+        // Graded assignments
+        let assignments = course.assignments.slice().reverse();
+
+        // Create series
+        return {
+            name: course.name,
+            type: 'line',
+            smooth: true,
+            symbol: 'circle', // circle, diamond, emptyCircle, none
+            data: this.toDateRange([...assignments.map(a => a.time)].map((time, i) =>
+            {
+                // Find subset before this assignment
+                let subset = assignments.filter(a => a.time <= time);
+
+                // Find grade
+                if (course.grading.method == 'PERCENT_TYPE')
+                    return [time, GPAUtils.getPercentTypeAverage(course, subset)];
+                if (course.grading.method == 'TOTAL_MEAN')
+                    return [time, GPAUtils.getTotalMeanAverage(subset)];
+            }))
+        }
+    }
+
+    /**
+     * Convert point data to date range data.
+     * Eg. [[Mon, 10], [Wed, 5]] to [[Mon, 10], [Tue, 10], [Wed, 5]]
+     *
+     * @param data
+     */
+    private toDateRange(data: any[])
+    {
        // Find the min date
-        let minDates = courses.map(course => new Date(course.assignments[course.assignments.length - 1].date).getTime());
+        let minDates = this.courses.map(course => course.assignments[course.assignments.length - 1].time);
        let minDate: Date = new Date(Math.min.apply(null, minDates));

        // Find the dates in between
-        let now = new Date();
-        let dates = [];
+        let now = new Date(Math.min(new Date().getTime(), CourseUtils.getTermEndDate().getTime()));
+        let dates: number[] = [];
        for (let date = minDate; date <= now; date.setDate(date.getDate() + 1))
        {
-            dates.push(new Date(date));
+            dates.push(new Date(date).getTime());
        }

-        // Compute the rows data
-        let rows: {[index: string]: any}[] = [];
-        dates.forEach(date =>
+        let lastValue: any = null;
+        return dates.map(date =>
        {
-            // Define row object
-            let row: {[index: string]:any} = {'date': date.toLocaleDateString('en-US')};
+            // Data point on this specific date
+            let thisValue = data.find(a => a[0] == date);

-            // Loop through courses
-            courses.forEach(course =>
-            {
-                // Total Mean
-                if (course.grading.method == 'TOTAL_MEAN')
-                {
-                    let score = 0;
-                    let max = 0;
-
-                    // Loop through assignments
-                    course.assignments.forEach(assignment =>
-                    {
-                        // If assignment should be displayed
-                        if (assignment.complete != 'Complete') return;
-
-                        // Date is being looked at
-                        let assignmentDate = new Date(assignment.date);
-                        if (assignmentDate.getTime() < date.getTime())
-                        {
-                            // Record scores
-                            score += assignment.score;
-                            max += assignment.scoreMax;
-                        }
-                    });
-
-                    // Add average to the row
-                    row[course.name] = score / max * 100;
-                }
-                else if (course.grading.method == 'PERCENT_TYPE')
-                {
-                    let typeScores: {[index: string]: any} = {};
-                    let typeCounts: {[index: string]: any} = {};
-
-                    // Loop through assignments
-                    course.assignments.forEach(assignment =>
-                    {
-                        // If assignment should be displayed
-                        if (assignment.complete != 'Complete') return;
-
-                        // Date is being looked at
-                        let assignmentDate = new Date(assignment.date);
-                        if (assignmentDate.getTime() < date.getTime())
-                        {
-                            // Record scores
-                            if (typeScores[assignment.type] == undefined) typeScores[assignment.type] = 0;
-                            typeScores[assignment.type] += assignment.score / assignment.scoreMax;
-
-                            if (typeCounts[assignment.type] == undefined) typeCounts[assignment.type] = 0;
-                            typeCounts[assignment.type] ++;
-                        }
-                    });
-
-                    // Count total percentage (This is to avoid less than expected cases)
-                    // Eg. If HW = 25% and Quiz = 75%, I have 1 hw and 0 quiz
-                    // Without total percentage, the avg grade I get is 25%.
-                    let totalPercentage = 0;
-                    for (let type in course.grading.weightingMap)
-                    {
-                        if (typeScores[type] != undefined)
-                        {
-                            totalPercentage += course.grading.weightingMap[type];
-                        }
-                    }
-
-                    // Count
-                    let score = 0;
-                    for (let type in typeScores)
-                    {
-                        let typeFactor = course.grading.weightingMap[type] / totalPercentage;
-                        score += typeScores[type] * typeFactor / typeCounts[type];
-                    }
-
-                    // Add average to the row
-                    if (score != 0) row[course.name] = score * 100;
-                }
-            });
-
-            // Add it to the array
-            rows.push(row);
+            // None
+            if (thisValue == null) return [date, lastValue == null ? null : lastValue[1]];
+            else return [date, (lastValue = thisValue)[1]];
        });
-
-        return {
-            columns: columns,
-            rows: rows
-        }
    }
 }
@@ -1,6 +1,6 @@
 <template>
    <div id="overall-line">
-        <ve-line :data="convertChart" :extend="settings"></ve-line>
+        <ve-line :extend="{a: this.courses}" :after-config="afterConfig"></ve-line>
    </div>
 </template>

@@ -34,6 +34,17 @@
    font-size: 11px;
 }

+.no-grade
+{
+    font-size: 30px;
+    color: #b1b1b1;
+
+    // Disable selecting
+    display:block;
+    pointer-events: none;
+    user-select: none;
+}
+
 // Cards
 .el-card.overall-bar-card
 {
@@ -1,6 +1,6 @@
 <template>
    <div id="overall">
-        <el-row>
+        <el-row v-if="getGPA().gpa !== -1">
            <el-col :span="4">
                <el-card class="large gpa-card vertical-center">
                    <div style="padding: 14px;">
@@ -25,6 +25,12 @@
            </el-col>
        </el-row>

+        <el-row v-if="getGPA().gpa === -1">
+            <el-card class="large gpa-card vertical-center">
+                <div class="no-grade">This quarter has no grades yet...</div>
+            </el-card>
+        </el-row>
+
        <overall-course v-for="course in courses"
                        :course="course"
                        :key="course.id">
@@ -37,8 +43,8 @@
    import OverallLine from '@/pages/overall/overall-line/overall-line';
    import OverallBar from '@/pages/overall/overall-bar/overall-bar';
    import OverallCourse from '@/pages/overall/overall-course/overall-course';
-    import {Course} from '@/components/app/app';
-    import {GPAUtils} from '@/utils/gpa-utils';
+    import Course from '@/logic/course';
+    import {GPAUtils} from '@/logic/utils/gpa-utils';

    @Component({
        components: {OverallLine, OverallBar, OverallCourse}
@@ -1,130 +0,0 @@
-/**
- * This is an utility class to calculate GPA.
- */
-import {Course} from '@/components/app/app';
-
-export class GPAUtils
-{
-    // [[Min score, Letter grade, Base GPA], ...]
-    public static SCALE =
-    [
-        [96.5, 'A+', 4.00],
-        [92.5, 'A' , 3.75],
-        [89.5, 'A-', 3.50],
-        [86.5, 'B+', 3.25],
-        [82.5, 'B' , 3.00],
-        [79.5, 'B-', 2.75],
-        [76.5, 'C+', 2.50],
-        [72.5, 'C' , 2.25],
-        [70.5, 'C-', 2.00],
-        [69.5, 'D' , 1.00],
-        [0   , 'F' , 0.00]
-    ];
-
-    // Keywords
-    public static MIN = 0;
-    public static LETTER = 1;
-    public static GPA = 2;
-
-    /**
-     * Calculate GPA for a list of couses
-     *
-     * @param coursesOriginal List of courses
-     */
-    public static getGPA(coursesOriginal: Course[]): {gpa: number, accurate: boolean, max: number}
-    {
-        // Clone array
-        let courses: Course[] = [];
-
-        // Accurate or not
-        let accurate: boolean = true;
-
-        // Remove all courses that does not have a grade
-        coursesOriginal.forEach(course =>
-        {
-            if (course.letterGrade == null || course.letterGrade == '')
-            {
-                accurate = false;
-            }
-            else if (course.level != 'none')
-            {
-                courses.push(course);
-            }
-        });
-
-        // If no course have grade, return -1
-        if (courses.length == 0)
-        {
-            return {gpa: -1, accurate: false, max: -1};
-        }
-
-        // Count total GPA
-        let totalGPA = 0;
-        let maxTotal = 0;
-        courses.forEach(course =>
-        {
-            totalGPA += this.getGP(course, course.letterGrade);
-            maxTotal += this.getGP(course, 'A+');
-        });
-
-        // Get average GPA, round to two decimal places
-        let gpa = Math.round(totalGPA / courses.length * 100) / 100;
-        let maxGPA = Math.round(maxTotal / courses.length * 100) / 100;
-
-        // Return results
-        return {gpa: gpa, accurate: accurate, max: maxGPA};
-    }
-
-    /**
-     * Calculate GPA for a course
-     *
-     * @param course Course
-     * @param letterGrade Letter grade
-     */
-    public static getGP(course: Course, letterGrade?: string): number
-    {
-        // Find the GPA for this course.
-        for (let scale of this.SCALE)
-        {
-            // Letter grades are the same
-            if (scale[this.LETTER] == letterGrade)
-            {
-                // Get grade and add it
-                let grade = <number> scale[this.GPA];
-
-                // Add scaleUp if not failed.
-                if (grade != 0) grade += course.scaleUp;
-
-                // That's it
-                return grade;
-            }
-        }
-
-        return -1;
-    }
-
-    /**
-     * Calculate the total-mean (total/max) average
-     *
-     * @param course Course
-     */
-    public static getTotalMeanAverage(course: Course)
-    {
-        let score = 0;
-        let max = 0;
-
-        // Loop through assignments
-        course.assignments.forEach(assignment =>
-        {
-            // If assignment should be displayed
-            if (assignment.complete != 'Complete') return;
-
-            // Record scores
-            score += assignment.score;
-            max += assignment.scoreMax;
-        });
-
-        // Return
-        return score / max * 100;
-    }
-}
Author	SHA1	Message	Date
Hykilpikonna	6204efd453	[U] Release v0.4.3.1006	2019-11-09 22:15:31 -05:00
Hykilpikonna	db083732b0	[M] Rename course-type-radar to type-radar	2019-11-09 22:14:41 -05:00
Hykilpikonna	4974049c0b	[S] Make background lighter	2019-11-09 22:11:02 -05:00
Hykilpikonna	857192ee6d	[S] Add text shadows	2019-11-09 22:10:45 -05:00
Hykilpikonna	90d07b1faa	[S] Make font size larger	2019-11-09 22:10:33 -05:00
Hykilpikonna	4abe02da94	[+] Color the indicator texts	2019-11-09 22:10:16 -05:00
Hykilpikonna	adca4b41e2	[+] Add percent score after indicator	2019-11-09 22:10:08 -05:00
Hykilpikonna	4d9d8e0be5	[S] Darken line color	2019-11-09 21:58:39 -05:00
Hykilpikonna	546ad81f7c	[+] Colorize split area	2019-11-09 21:58:23 -05:00
Hykilpikonna	1eff27ad26	[S] Center color gradient	2019-11-09 21:49:40 -05:00
Hykilpikonna	f540e03a56	[S] Adjust the graph down 10%	2019-11-09 21:47:34 -05:00
Hykilpikonna	af925741b4	[S] Make graph smaller	2019-11-09 21:47:18 -05:00
Hykilpikonna	08bb24cac4	[O] Use percentage score instead of score	2019-11-09 21:47:06 -05:00
Hykilpikonna	8a9ca83e68	[O] Optimize graph with baseSettings	2019-11-09 21:46:47 -05:00
Hykilpikonna	e6b6a73f1f	[O] Optimize type adverage with pre-calculated percent	2019-11-09 21:35:18 -05:00
Hykilpikonna	ceca351b07	[+] Include percent score in AssignmentType	2019-11-09 21:34:28 -05:00
Hykilpikonna	4e14730db6	[S] Change the graph symbol to circle	2019-11-09 21:24:13 -05:00
Hykilpikonna	3b0e291df4	[S] Make radar only take half the screen	2019-11-09 21:23:54 -05:00
Hykilpikonna	6bcb2577f7	[+] Add area gradient	2019-11-09 21:23:34 -05:00
Hykilpikonna	54e54b89e9	[+] Display tooltip	2019-11-09 21:23:14 -05:00
Hykilpikonna	0085d384fd	[+] Display data in radar graph	2019-11-09 21:23:07 -05:00
Hykilpikonna	3b4e40261f	[O] Use scoreMax instead	2019-11-09 21:22:31 -05:00
Hykilpikonna	eb8715867e	[+] Add radar indicator	2019-11-09 21:03:12 -05:00
Hykilpikonna	1bcfdf5648	[+] Add radar component in course page	2019-11-09 20:55:56 -05:00
Hykilpikonna	429de6553b	[+] Create course-type-radar	2019-11-09 20:55:39 -05:00
Hykilpikonna	fce47648c8	[O] Remove unnecessary getAssignmentTypes()	2019-11-09 20:45:30 -05:00
Hykilpikonna	f6d44dd1f2	[O] Remove unnecessary complete verification	2019-11-09 20:45:12 -05:00
Hykilpikonna	4fe0a54277	[O] Remove unnecessary average() method	2019-11-09 20:44:57 -05:00
Hykilpikonna	e8bf21e60c	[F] Fix type name display	2019-11-09 20:44:37 -05:00
Hykilpikonna	472df39ac8	[O] Pass in AssignmentType object for AssignmentTypeHead component	2019-11-09 20:44:23 -05:00
Hykilpikonna	ae94f54a7b	[O] Cache assignment types	2019-11-09 20:39:24 -05:00
Hykilpikonna	8c9f0a0e83	[O] Optimize caching	2019-11-09 20:37:56 -05:00
Hykilpikonna	cb22baf120	[+] Calculate type score and weight	2019-11-09 20:33:32 -05:00
Hykilpikonna	0525aae98a	[+] Create method to get assignment types	2019-11-09 20:25:18 -05:00
Hykilpikonna	4c87cb2947	[F] Fix null pointer	2019-11-09 20:21:57 -05:00
Hykilpikonna	076a1ee52e	[O] Return graded assignments by default	2019-11-09 20:21:09 -05:00
Hykilpikonna	7bd9e97396	[S] Remove ugly circle between data points	2019-11-09 20:05:52 -05:00
Hykilpikonna	aa014bcdab	[+] Create AssignmentType interface	2019-11-09 19:47:56 -05:00
Hykilpikonna	ee308d29ff	[S] Optimize x axis label	2019-11-09 19:39:53 -05:00
Hykilpikonna	35ef2144b7	[O] Limit minimum zoom	2019-11-09 19:29:45 -05:00
Hykilpikonna	6dc2a21e8f	[+] Add back tooltip	2019-11-09 17:42:03 -05:00
Hykilpikonna	343c921eb2	[+] Add y axis label	2019-11-09 17:40:15 -05:00
Hykilpikonna	f54dfba058	[F] Fix scatter plot out of bounds issue	2019-11-09 17:39:58 -05:00
Hykilpikonna	a7d7ef44a6	[-] Remove debug output	2019-11-09 17:35:29 -05:00
Hykilpikonna	793d7444b2	[O] Add back the term lines and mark areas	2019-11-09 17:35:22 -05:00
Hykilpikonna	eaf4d2ce7b	[O] Make y max an integer	2019-11-09 17:32:17 -05:00
Hykilpikonna	79e615ee46	[O] Use graded courses only	2019-11-09 17:31:32 -05:00
Hykilpikonna	40353cfd35	[O] Generate settings on created	2019-11-09 17:31:22 -05:00
Hykilpikonna	2be2ce98e6	[F] Fix date conversion	2019-11-09 17:27:45 -05:00
Hykilpikonna	6659f65763	[F] Fix multiple assignment creating multiple dates issue	2019-11-09 17:19:30 -05:00
Hykilpikonna	5b3ba4db07	[+] Create method to convert data points to date points	2019-11-09 17:11:35 -05:00
Hykilpikonna	a05281f4e4	[+] Separate method to generate series	2019-11-09 17:10:54 -05:00
Hykilpikonna	2f95548fb3	[+] Create method to get series for course	2019-11-09 17:10:37 -05:00
Hykilpikonna	96ee9e9265	[O] Default to 2 decimal places	2019-11-09 17:05:06 -05:00
Hykilpikonna	9026b9d3a9	[-] Remove deprecated convertChart()	2019-11-09 17:02:53 -05:00
Hykilpikonna	67e38dd554	[F] Fix tooltip date representation	2019-11-09 16:59:52 -05:00
Hykilpikonna	7ffef67e42	[F] Parse time instead of date	2019-11-09 16:57:12 -05:00
Hykilpikonna	0d195cfb7f	[F] Fix invalid date	2019-11-09 16:56:22 -05:00
Hykilpikonna	0d3e9c0840	[O] Remove toChartDate, use timestamp instead	2019-11-09 16:53:53 -05:00
Hykilpikonna	6c600f31f8	[O] Change assignment.date to time	2019-11-09 16:50:48 -05:00
Hykilpikonna	a05a44aaef	[+] Add assignments.length > 0 as a condition	2019-11-09 16:49:30 -05:00
Hykilpikonna	31d3a5a09e	[+] Filter graded courses	2019-11-09 16:48:45 -05:00
Hykilpikonna	30293cd261	[O] Encapsulate method to get graded assignments	2019-11-09 16:31:36 -05:00
Hykilpikonna	9a279b3417	[O] Use afterconfig	2019-11-09 16:24:00 -05:00
Hykilpikonna	4a7ff0ea55	[O] Use base settings in overall-line	2019-11-09 16:23:41 -05:00
Hykilpikonna	fd341e9d33	[O] Use basesettings in course-scatter	2019-11-09 16:15:21 -05:00
Hykilpikonna	bdacc8dd9e	[+] Create function to generate base settings	2019-11-09 16:14:58 -05:00
Hykilpikonna	ad2c8a1ee8	[M] Move dot to graph utils	2019-11-09 16:12:44 -05:00
Hykilpikonna	1f58818a1a	[S] Dim markline brightness	2019-11-09 16:06:28 -05:00
Hykilpikonna	09442cbfba	[+] Add mark areas and lines in scatter plot	2019-11-09 16:05:55 -05:00
Hykilpikonna	91e10d1fa8	[+] Add opacity param to markline generation	2019-11-09 16:05:25 -05:00
Hykilpikonna	80267feb54	[O] Separate series creation with the main settings	2019-11-09 16:00:57 -05:00
Hykilpikonna	f4ee2dadb6	[M] Move markarea to GraphUtils	2019-11-09 15:51:05 -05:00
Hykilpikonna	d698f3d13a	[M] Move markline stuff to GraphUtils	2019-11-09 15:47:30 -05:00
Hykilpikonna	82cb845061	[S] Make line animation faster	2019-11-09 15:43:53 -05:00
Hykilpikonna	940738307b	[F] Fix term 1 graph displaying dates after term 2	2019-11-09 15:41:54 -05:00
Hykilpikonna	df011787e1	[S] Change line color	2019-11-09 15:41:12 -05:00
Hykilpikonna	0af393a1e4	[+] Put in actual term dates	2019-11-09 15:37:52 -05:00
Hykilpikonna	6504cc033b	[+] Encapsulate method to get term end date	2019-11-09 15:32:25 -05:00
Hykilpikonna	c6ccc5e311	[F] Fix: All year graph begins at term 2	2019-11-09 15:28:48 -05:00
Hykilpikonna	3a8899507f	[+] Encapsulate method to get begin date of a term	2019-11-09 15:28:21 -05:00
Hykilpikonna	2b7026c4ce	[F] Fix: Make starting time not exceed the beginning of a term	2019-11-09 15:24:41 -05:00
Hykilpikonna	a3fd822252	[S] Remove quater line arrow symbol	2019-11-09 15:05:57 -05:00
Hykilpikonna	f9d7fa398f	[+] Add quater line label	2019-11-09 14:59:38 -05:00
Hykilpikonna	7ffc445bba	[+] Show quater lines	2019-11-09 14:55:47 -05:00
Hykilpikonna	8e9f6a4bb7	[O] Optimize date data type	2019-11-09 14:55:37 -05:00
Hykilpikonna	05cb560c8c	[-] Disable legend	2019-11-09 14:54:35 -05:00
Hykilpikonna	53a57234a0	[-] Remove unused legend	2019-11-09 14:54:02 -05:00
Hykilpikonna	6af6bb0959	[O] Optimize time display	2019-11-09 14:47:32 -05:00
Hykilpikonna	089aad7398	[O] Optimize date formatting	2019-11-09 14:47:22 -05:00
Hykilpikonna	937e89ce5f	[M] Move assignment interface from app.ts to course.ts	2019-11-09 14:38:57 -05:00
Hykilpikonna	b0685ffd6b	[M] Move util classes to /logic	2019-11-09 14:32:45 -05:00
Hykilpikonna	18dee50b96	[F] Force desktop view on mobile devices	2019-11-09 14:32:10 -05:00
Hykilpikonna	8dbef09ec9	[U] Release v0.4.2.912	2019-11-07 22:29:01 -05:00
Hykilpikonna	73b71f56a5	[S] Disable text selecting	2019-11-07 22:26:43 -05:00
Hykilpikonna	ce702405d0	[S] Adjust no-grade font size	2019-11-07 22:26:33 -05:00
Hykilpikonna	21744a1bef	[F] Fix gpa -1 when no grade issue	2019-11-07 22:26:13 -05:00
Hykilpikonna	82064f2f02	[O] Optimize graph max value	2019-11-07 22:14:46 -05:00
Hykilpikonna	adfebc8c44	[F] Fix term 1 displaying term 2 grades issue	2019-11-07 22:00:08 -05:00
Hykilpikonna	2f30e67671	[F] Fix course grade displayed as 0.00 issue	2019-11-07 21:53:16 -05:00
Hykilpikonna	0a80d534eb	[O] Optimize imports	2019-11-07 21:48:40 -05:00
Hykilpikonna	a77c495843	[S] Further divide marklines	2019-11-07 21:45:34 -05:00
Hykilpikonna	5503aff6b1	[S] Dim marklines a little bit	2019-11-07 21:40:16 -05:00
Hykilpikonna	7cc4567245	[O] Optimize color representation	2019-11-07 21:39:09 -05:00
Hykilpikonna	e7f29ad0bf	[+] Add mark area below 70	2019-11-07 21:35:45 -05:00
Hykilpikonna	cdbd101428	[+] Add mark area from 70 to 80	2019-11-07 21:33:22 -05:00
Hykilpikonna	da650ef16b	[+] Add mark area from 100 to 80	2019-11-07 21:31:51 -05:00
Hykilpikonna	8abfdd7f8e	[+] Add mark area above 100	2019-11-07 21:31:36 -05:00
Hykilpikonna	3c66f99363	[F] Limit graph max value to 120	2019-11-07 20:57:35 -05:00
Hykilpikonna	251f87a072	[F] Fix assignment type update problem	2019-11-06 23:09:32 -05:00
Hykilpikonna	e15c95561c	[U] Release v0.4.1.895	2019-11-06 22:34:08 -05:00
Hykilpikonna	f4ed39401c	[S] Emphesize the title more	2019-11-06 22:29:03 -05:00
Hykilpikonna	c3fb998254	[S] Set font size	2019-11-06 22:25:03 -05:00
Hykilpikonna	d9e9bcc731	[S] Align the average span to the left	2019-11-06 22:24:56 -05:00
Hykilpikonna	110ff6daec	[S] Center the average span	2019-11-06 22:24:46 -05:00
Hykilpikonna	7d83344e73	[F] Calculate percent average instead of ratio	2019-11-06 22:19:29 -05:00
Hykilpikonna	06d93398fb	[S] Disable unread in courses page	2019-11-06 22:18:44 -05:00
Hykilpikonna	b05328888e	[M] Rename unread-entry class to assignment-entry	2019-11-06 22:17:25 -05:00
Hykilpikonna	19598f4a10	[+] Add average span	2019-11-06 22:16:59 -05:00
Hykilpikonna	cd7102a5df	[+] create method to get type average	2019-11-06 22:16:52 -05:00
Hykilpikonna	9bf1f6b624	[O] Optimize assignments filtering	2019-11-06 21:54:41 -05:00
Hykilpikonna	f1681ad405	[F] Fix 'selectedTime undefined'	2019-11-06 21:54:11 -05:00
Hykilpikonna	e0a70a23b0	[F] Fix: ' Invalid handler for event "command": got undefined'	2019-11-06 21:53:40 -05:00
Hykilpikonna	677dfb491a	[+] Parse grading period	2019-11-06 21:50:28 -05:00
Hykilpikonna	07a9b38c8d	[+] Add grading period field to app.ts	2019-11-06 21:50:22 -05:00
Hykilpikonna	53b78c4a94	[M] Rename cookie name too	2019-11-06 21:50:06 -05:00
Hykilpikonna	2057f08e40	[M] Rename time selection to grading period	2019-11-06 21:49:17 -05:00
Hykilpikonna	7bc843aa9a	[O] Optimize assignments loading with [].map()	2019-11-06 21:41:49 -05:00
Hykilpikonna	0a8855e020	[F] Fix self-referencing error	2019-11-06 21:37:13 -05:00
Hykilpikonna	445d07c5e4	[+] Encapsulate method to get numeric and letter grades	2019-11-06 21:35:34 -05:00
Hykilpikonna	125e7d14de	[O] Change letterGrade and numericGrade to raw fields	2019-11-06 21:32:55 -05:00
Hykilpikonna	4917f5cb0c	[O] Optimize getGP	2019-11-06 21:32:38 -05:00
Hykilpikonna	2504b37eb7	[O] Also support numeric grade	2019-11-06 21:30:15 -05:00
Hykilpikonna	b0d3bf4bd2	[+] Encapsulate method to find scale	2019-11-06 21:28:27 -05:00
Hykilpikonna	e640384fd8	[O] Optimize scale list	2019-11-06 21:27:30 -05:00
Hykilpikonna	adf7af6b84	[+] Create interface for scale	2019-11-06 21:27:19 -05:00
Hykilpikonna	beb4155aab	[+] Compare numeric grade with current term grade	2019-11-06 21:17:31 -05:00
Hykilpikonna	3337766ae6	[+] Add current term constant	2019-11-06 21:17:11 -05:00
Hykilpikonna	dc135dc78b	[+] Encapsulate getPercentTypeAverage	2019-11-06 21:16:47 -05:00
Hykilpikonna	b39c51beea	[O] getTotalMeanAverage pass in assignments not course	2019-11-06 21:16:31 -05:00
Hykilpikonna	971339e49c	[F] Fix assignments order issue	2019-11-06 20:59:12 -05:00
Hykilpikonna	9db0431e96	[O] Use caching to optimize graphs	2019-11-06 20:57:52 -05:00
Hykilpikonna	d667f2ab34	[-] Remove temp string	2019-11-06 20:39:58 -05:00
Hykilpikonna	9b895a8fd7	[+] Reload directly when selected time is changed	2019-11-06 20:39:47 -05:00
Hykilpikonna	66d7e18a71	[F] Fix selectedTime initialization issue	2019-11-06 20:30:05 -05:00
Hykilpikonna	4643155908	[+] Add useless string for updating	2019-11-06 20:29:39 -05:00
Hykilpikonna	c6c3303a99	[O] Optimize onclick method call	2019-11-06 20:02:41 -05:00
Hykilpikonna	1aea558c40	[+] Store selected time in cookies	2019-11-06 20:02:29 -05:00
Hykilpikonna	316c7e1f63	[F] Fix 'cannot getTime() of undefined'	2019-11-06 20:01:32 -05:00
Hykilpikonna	8364befc91	[F] Fix more type problems	2019-11-06 19:26:41 -05:00
Hykilpikonna	47c25d0e71	[F] Fix imports	2019-11-06 19:23:39 -05:00
Hykilpikonna	422d574c6c	[F] Fix term display number offset issue	2019-11-06 19:14:14 -05:00
Hykilpikonna	3400c07e77	[+] Encapsulate method to get assignments of specific time	2019-11-06 19:13:45 -05:00
Hykilpikonna	79bb10b14e	[M] Rename assignments to rawAssignments	2019-11-06 19:12:24 -05:00
Hykilpikonna	e7563fcfb5	[+] Encapsulate method to get selected time code	2019-11-06 19:11:55 -05:00
Hykilpikonna	43f0046827	[+] Update selected time dynamically	2019-11-06 19:11:41 -05:00
Hykilpikonna	ef424dd9e3	[O] Unify time names	2019-11-06 19:11:27 -05:00
Hykilpikonna	37902b6d1f	[+] Display selected time dynamically	2019-11-06 19:11:13 -05:00
Hykilpikonna	92e692f69a	[O] Remove getGradedCourses	2019-11-06 18:27:19 -05:00
Hykilpikonna	b6e0e12cab	[+] Add isGraded method to course	2019-11-06 18:25:48 -05:00
Hykilpikonna	6eb7e421e0	[M] Move level detection to course	2019-11-06 18:22:35 -05:00
Hykilpikonna	fbb9352546	[O] Move name parsing to course	2019-11-06 18:15:54 -05:00
Hykilpikonna	6f5c4f3a09	[M] Move loadAssignments to course	2019-11-06 18:13:24 -05:00
Hykilpikonna	1e91cec8d2	[O] Create course objects after parsing json	2019-11-06 18:08:47 -05:00
Hykilpikonna	17262e12af	[+] Create constructor	2019-11-06 18:05:53 -05:00
Hykilpikonna	56a954c235	[O] Separate course object	2019-11-06 18:03:27 -05:00
Hykilpikonna	da5eced769	[F] Fix pushed data duplicate issue	2019-11-06 17:55:10 -05:00
Hykilpikonna	71f2eccab4	[F] Fix filter assignment order issue	2019-11-06 17:54:57 -05:00
Hykilpikonna	a5162c1f5b	[O] Optimize date usage	2019-11-06 17:38:53 -05:00
Hykilpikonna	53c82fd477	[F] Fix sorting	2019-11-06 17:38:36 -05:00
Hykilpikonna	2867f8d09c	[+] Set computed data	2019-11-06 17:26:52 -05:00
Hykilpikonna	5b902171c8	[+] Filter assignments into terms	2019-11-06 17:26:44 -05:00
Hykilpikonna	c40c5b6b94	[+] Create computed model in course	2019-11-06 17:26:29 -05:00
Hykilpikonna	b66c313b05	[+] Define terms date list	2019-11-06 17:20:09 -05:00
Hykilpikonna	48287cdc4b	[O] Sort by date	2019-11-06 17:17:02 -05:00
Hykilpikonna	750c768848	[O] Use Date for date instead of string	2019-11-06 17:16:49 -05:00
Hykilpikonna	4b512d64d9	[+] Add commands to dropdown options	2019-11-06 16:48:43 -05:00
Hykilpikonna	e121210e96	[S] Add proper up and down margins	2019-11-06 16:34:08 -05:00
Hykilpikonna	5a87608fa6	[S] Align dropdown to the right	2019-11-06 16:33:59 -05:00
Hykilpikonna	e819abe789	[S] Make dropdown button smaller	2019-11-06 16:33:42 -05:00
Hykilpikonna	eb718d14d1	[S] Add id to dropdown	2019-11-06 16:33:35 -05:00
Hykilpikonna	564896e940	[+] Create time selection button	2019-11-06 16:29:02 -05:00
Hykilpikonna	d91c3875b0	[F] Fix bar graph color problem	2019-11-06 16:18:39 -05:00
Hykilpikonna	1fe2edb9f4	[F] Fix bar graph -1 problem	2019-11-06 16:17:31 -05:00
Hykilpikonna	91977e1226	[S] Change assignment type head font size	2019-11-06 16:06:33 -05:00
Hykilpikonna	948018c7de	[F] Fix grade display when no grade exist	2019-11-06 16:06:03 -05:00
Hykilpikonna	f2350680c8	[S] Optimize narrow height	2019-11-05 22:57:19 -05:00
Hykilpikonna	4cc424e079	[S] Make percentage score's width unified	2019-11-05 22:57:09 -05:00
Hykilpikonna	49d26fcf61	[S] Make month's width unified	2019-11-05 22:56:51 -05:00
Hykilpikonna	9fde3b21d4	[S] Fix margins when there are no unread	2019-11-05 22:51:47 -05:00
Hykilpikonna	6952649058	[S] Optimize date formatting	2019-11-05 22:51:15 -05:00
Hykilpikonna	b12a717cea	[S] Move unread property to css class	2019-11-05 22:41:33 -05:00
Hykilpikonna	8e1e222656	[S] Align the scores the same width	2019-11-05 22:39:57 -05:00
Hykilpikonna	8f7775bb69	[O] Reduce height for narrow layout	2019-11-05 22:33:22 -05:00
Hykilpikonna	0477161af2	[+] Create narrow property for class	2019-11-05 22:29:43 -05:00
Hykilpikonna	3b387db5b5	[S] Fix float left alignment issue	2019-11-05 22:24:45 -05:00
Hykilpikonna	d85d0e4e36	[S] Align the text to the left	2019-11-05 22:23:25 -05:00
Hykilpikonna	b74b086f98	[S] Vertically center the text	2019-11-05 22:23:14 -05:00
Hykilpikonna	e1d20b822f	[S] Optimize font size and color	2019-11-05 22:22:53 -05:00
Hykilpikonna	e98997f230	[S] Specify background color	2019-11-05 18:25:56 -05:00
Hykilpikonna	82e17030d4	[+] Add property for background style	2019-11-05 18:22:44 -05:00
Hykilpikonna	d1905ee2b1	[+] Create info div	2019-11-05 18:09:12 -05:00
Hykilpikonna	310b2bcee1	[S] Remove card body padding	2019-11-05 18:07:49 -05:00
Hykilpikonna	d55eebce19	[F] Fix: Next course doesn't show up on mobile devices	2019-11-05 18:00:04 -05:00
Hykilpikonna	03507968ee	[+] Add assignment entry components	2019-11-05 17:51:36 -05:00
Hykilpikonna	56769e4518	[F] Fix: Filter assignments based on value of type	2019-11-05 17:51:22 -05:00
Hykilpikonna	fba589d6fe	[+] Display type name	2019-11-05 17:44:16 -05:00
Hykilpikonna	ff5b22b5dc	[+] Filter assignment type	2019-11-05 17:42:46 -05:00
Hykilpikonna	14de2e0b23	[+] Create assignments property	2019-11-05 17:40:50 -05:00
Hykilpikonna	880e331c99	[F] Fix distinct key for v-for problem	2019-11-05 17:37:42 -05:00
Hykilpikonna	cf794588df	[-] Reomve duplicate type names	2019-11-05 17:37:29 -05:00
Hykilpikonna	d362598d83	[+] Show an assignment type for each type	2019-11-05 17:29:27 -05:00
Hykilpikonna	536e98642d	[+] Encapsulate method to get assignment types	2019-11-05 17:28:28 -05:00
Hykilpikonna	baae0d088c	[+] Add assignment head element in course page	2019-11-05 17:28:18 -05:00
Hykilpikonna	202feb12d7	[+] Create assignment type head vue comp	2019-11-05 17:22:13 -05:00
Hykilpikonna	d2ab7c059f	[F] Fix clear cookie issue	2019-11-04 16:23:40 -05:00
Hykilpikonna	e1ef117dcd	[S] Make logo non-clickable	2019-11-03 11:18:35 -05:00
Hykilpikonna	fb3186d575	[S] Add shadow effect to logo	2019-11-03 11:18:26 -05:00
Hykilpikonna	b913873951	[S] Adjust margin font size	2019-11-03 11:18:01 -05:00
Hykilpikonna	bbdcb42316	[S] Adjust title margin size	2019-11-03 11:17:53 -05:00
Hykilpikonna	5438637224	[S] Add the title	2019-11-03 11:17:33 -05:00