From 4587f5a73d05fdcdf20c43918b847c78a385234a Mon Sep 17 00:00:00 2001
From: abzicht <abzicht@gmail.com>
Date: Sat, 9 Mar 2019 20:08:52 +0100
Subject: [PATCH] Added 'clickable' class to all elements with interactivity.
 This allows css styling for clickable elements

---
 src/diagrams/gantt/ganttRenderer.js | 30 ++++++++++++++++++++---------
 src/themes/gantt.scss               |  6 ++++++
 2 files changed, 27 insertions(+), 9 deletions(-)

diff --git a/src/diagrams/gantt/ganttRenderer.js b/src/diagrams/gantt/ganttRenderer.js
index b7a6da890..f1bbdb29b 100644
--- a/src/diagrams/gantt/ganttRenderer.js
+++ b/src/diagrams/gantt/ganttRenderer.js
@@ -142,6 +142,11 @@ export const draw = function (text, id) {
       .attr('class', function (d) {
         const res = 'task '
 
+        let classStr = ''
+        if (d.classes.length > 0) {
+          classStr = d.classes.join(' ')
+        }
+
         let secNum = 0
         for (let i = 0; i < categories.length; i++) {
           if (d.type === categories[i]) {
@@ -151,25 +156,25 @@ export const draw = function (text, id) {
 
         if (d.active) {
           if (d.crit) {
-            return res + ' activeCrit' + secNum
+            return res + classStr + ' activeCrit' + secNum
           } else {
-            return res + ' active' + secNum
+            return res + classStr + ' active' + secNum
           }
         }
 
         if (d.done) {
           if (d.crit) {
-            return res + ' doneCrit' + secNum
+            return res + classStr + ' doneCrit' + secNum
           } else {
-            return res + ' done' + secNum
+            return res + classStr + ' done' + secNum
           }
         }
 
         if (d.crit) {
-          return res + ' crit' + secNum
+          return res + classStr + ' crit' + secNum
         }
 
-        return res + ' task' + secNum
+        return res + classStr + ' task' + secNum
       })
 
     rectangles.append('a').attr('href', function (d) {
@@ -206,6 +211,13 @@ export const draw = function (text, id) {
         const startX = timeScale(d.startTime)
         const endX = timeScale(d.endTime)
         const textWidth = this.getBBox().width
+
+
+        let classStr = ''
+        if (d.classes.length > 0) {
+          classStr = d.classes.join(' ')
+        }
+
         let secNum = 0
         for (let i = 0; i < categories.length; i++) {
           if (d.type === categories[i]) {
@@ -237,12 +249,12 @@ export const draw = function (text, id) {
         // Check id text width > width of rectangle
         if (textWidth > (endX - startX)) {
           if (endX + textWidth + 1.5 * conf.leftPadding > w) {
-            return 'taskTextOutsideLeft taskTextOutside' + secNum + ' ' + taskType
+            return classStr + ' taskTextOutsideLeft taskTextOutside' + secNum + ' ' + taskType
           } else {
-            return 'taskTextOutsideRight taskTextOutside' + secNum + ' ' + taskType
+            return classStr + ' taskTextOutsideRight taskTextOutside' + secNum + ' ' + taskType
           }
         } else {
-          return 'taskText taskText' + secNum + ' ' + taskType
+          return classStr + ' taskText taskText' + secNum + ' ' + taskType
         }
       })
   }
diff --git a/src/themes/gantt.scss b/src/themes/gantt.scss
index 6793135ec..376b1cb91 100644
--- a/src/themes/gantt.scss
+++ b/src/themes/gantt.scss
@@ -90,6 +90,12 @@
   font-size: 11px;
 }
 
+.task.clickable {
+  cursor: pointer;
+}
+.taskText.clickable {
+  cursor: pointer;
+}
 
 /* Specific task settings for the sections*/