From a32066b4ba046e370b689ab3b1910e00aa768eb5 Mon Sep 17 00:00:00 2001
From: codescientist703 <pukimonlegend@gmail.com>
Date: Tue, 11 May 2021 22:01:43 +0530
Subject: [PATCH] feat: added real time chart API

---
 frappe/public/js/frappe/ui/chart.js | 36 +++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/frappe/public/js/frappe/ui/chart.js b/frappe/public/js/frappe/ui/chart.js
index 6df28204f9..36e081a7f0 100644
--- a/frappe/public/js/frappe/ui/chart.js
+++ b/frappe/public/js/frappe/ui/chart.js
@@ -1,3 +1,39 @@
 import { Chart } from "frappe-charts/dist/frappe-charts.esm";
 
+frappe.provide("frappe.ui");
 frappe.Chart = Chart;
+
+frappe.ui.RealtimeChart = class RealtimeChart extends frappe.Chart {
+	constructor(element, socketEvent, maxLabelPoints = 8, data) {
+		super(element, data);
+		if (data.data.datasets[0].values.length > maxLabelPoints) {
+			frappe.throw(
+				__(
+					"Length of passed data array is greater than value of maximum allowed label points!"
+				)
+			);
+		}
+		this.currentSize = data.data.datasets[0].values.length;
+		this.socketEvent = socketEvent;
+		this.maxLabelPoints = maxLabelPoints;
+
+		this.start_updating = function() {
+			frappe.realtime.on(this.socketEvent, data => {
+				this.update_chart(data.label, data.points);
+			});
+		};
+
+		this.stop_updating = function() {
+			frappe.realtime.off(this.socketEvent);
+		};
+
+		this.update_chart = function(label, data) {
+			if (this.currentSize >= this.maxLabelPoints) {
+				this.removeDataPoint(0);
+			} else {
+				this.currentSize++;
+			}
+			this.addDataPoint(label, data);
+		};
+	}
+};