From 1312bafb779aeb7f9e040e41705cee0861c00bd5 Mon Sep 17 00:00:00 2001
From: Ahmad Alfy <ahmadalfy@gmail.com>
Date: Wed, 5 Feb 2020 01:22:24 +0200
Subject: [PATCH] feat: Draw commits additions vs deletions

---
 scripts/charts.js   | 53 ++++++++++++++++++++++++++++++++++++++++-----
 scripts/members.js  |  2 +-
 scripts/projects.js | 25 +++++++++++++++++++--
 3 files changed, 71 insertions(+), 9 deletions(-)

diff --git a/scripts/charts.js b/scripts/charts.js
index 2fe707c..eee032c 100644
--- a/scripts/charts.js
+++ b/scripts/charts.js
@@ -60,14 +60,58 @@ class Charts {
 		return { data: formattedData, groupedEvents };
 	}
 
-	static drawChart(data, name, area) {
+	static prepareProjectCommits(projectCommits) {
+		const groupedCommits = projectCommits.reduce((acc, obj)=> {
+			let key = obj.creation_day
+			if (!acc[key]) {
+				acc[key] = []
+			}
+				acc[key].push(obj)
+			return acc
+		}, {});
+		const additionSeries = [];
+		const deletionSeries = [];
+		for (let date in groupedCommits) {
+			let additions = 0;
+			let deletions = 0;
+			groupedCommits[date].forEach(commit => {
+				additions += commit.stats.additions;
+				deletions += commit.stats.deletions;
+			});
+			additionSeries.push([JSON.parse(date), additions]);
+			deletionSeries.push([JSON.parse(date), -(deletions)]);
+		}
+		const sortByDate = (a, b) => {
+			if (a[0] > b[0]) {
+				return -1;
+			}
+			if (a[0] < b[0]) {
+				return 1;
+			}
+			return 0;
+		}
+		additionSeries.sort(sortByDate);
+		deletionSeries.sort(sortByDate);
+
+		return [{
+			data: additionSeries,
+			name: 'Additions',
+			color: '#00ff00'
+		}, {
+			data: deletionSeries,
+			name: 'Deletions',
+			color: '#ff0000'
+		}];
+	}
+
+	static drawChart(series, title, area) {
 		this.chart = Highcharts.chart('charts', {
 			chart: {
 				zoomType: 'x',
 				type: area,
 			},
 			title: {
-				text: `Activity of ${name}`
+				text: `Activity of ${title}`
 			},
 			subtitle: {
 				text: `Source: Gitlab Activities`
@@ -75,10 +119,7 @@ class Charts {
 			xAxis: {
 				type: 'datetime',
 			},
-			series: [{
-				name,
-				data,
-			}],
+			series,
 			tooltip: {
 				split: true,
 			},
diff --git a/scripts/members.js b/scripts/members.js
index 3d0969b..2393382 100644
--- a/scripts/members.js
+++ b/scripts/members.js
@@ -118,7 +118,7 @@ class Members extends Base {
 		const response = Charts.prepareMemberEvents(memberEvents);
 
 		const { data, memberEvents: { member : { name }} } = response;
-		Charts.drawChart(data, name);
+		Charts.drawChart([{ data, name }], name);
 		Charts.prepareChartFilters(memberId, name, this.showActivityDetals.bind(this));
 	}
 
diff --git a/scripts/projects.js b/scripts/projects.js
index b9ebc66..7fe7c41 100644
--- a/scripts/projects.js
+++ b/scripts/projects.js
@@ -87,7 +87,13 @@ class Projects extends Base {
 								<button title="Load Commits" @click=${() => {this.loadProjectCommits(project.id)}}>Commits</button>
 							</span>
 						</span>
-						<button title="Display Activities" @click=${()=> {this.showProjectActivities(project.id, project.name)}}>Display</button>
+						<span class="button-group">
+							<button @click=${(ev) => {this.displayButtons(ev)}}>Display</button>
+							<span class="buttons">
+							<button title="Display Activities" @click=${()=> {this.showProjectActivities(project.id, project.name)}}>Activities</button>
+							<button title="Display Commits" @click=${()=> {this.showProjectCommits(project.id, project.name)}}>Commits</button>
+							</span>
+						</span>
 						<button @click=${()=> {this.appendToChart(project.id, project.name)}}>+</button>
 					</td>
 				</tr>
@@ -133,6 +139,13 @@ class Projects extends Base {
 			.with({ project: 'project_id' });
 	}
 
+	async getProjectCommits(projectId) {
+		return await db.commits
+			.where('project_id')
+			.equals(projectId)
+			.with({ project: 'project_id' });
+	}
+
 	async appendToChart(projectId, projectName) {
 		let projectEvents = await this.getProjectEvents(projectId);
 		const response = Charts.prepareProjectEvents(projectEvents);
@@ -183,6 +196,7 @@ class Projects extends Base {
 				'id',
 			].forEach(key => { delete commit[key] });
 			commit.project_id = projectId;
+			commit.creation_day = new Date(commit.authored_date).setHours(0, 0, 0, 0);
 		});
 		db.commits.bulkPut(commits);
 	}
@@ -191,7 +205,14 @@ class Projects extends Base {
 		let projectEvents = await this.getProjectEvents(projectId);
 		const updatedEvents = Charts.prepareProjectEvents(projectEvents);
 		const { data } = updatedEvents;
-		Charts.drawChart(data, projectName, 'areaspline');
+		Charts.drawChart([{ data, name: projectName }], projectName, 'areaspline');
+		Charts.prepareChartFilters();
+	}
+
+	async showProjectCommits(projectId, projectName) {
+		let projectCommits = await this.getProjectCommits(projectId);
+		const formattedCommitsSerieses = Charts.prepareProjectCommits(projectCommits);
+		Charts.drawChart(formattedCommitsSerieses, projectName, 'area');
 		Charts.prepareChartFilters();
 	}