Add career results diagram see BT#16233

main/admin/career_diagram.php

@@ -107,10 +107,10 @@ if (!empty($itemUrls) && !empty($itemUrls['value'])) {
 
 $tpl = new Template(get_lang('Diagram'));
 $html = Display::page_subheader2($careerInfo['name'].$urlToString);
-if (!empty($item) && isset($item['value']) && !empty($item['value'])) {
+$diagram = Career::renderDiagramByColumn($careerInfo, $tpl);
-    /** @var Graph $graph */
+
-    $graph = UnserializeApi::unserialize('career', $item['value']);
+if (!empty($diagram)) {
-    $html .= Career::renderDiagramByColumn($graph, $tpl);
+    $html .= $diagram;
 } else {
     Display::addFlash(
         Display::return_message(

main/cron/import_csv.php

@@ -2667,6 +2667,7 @@ class ImportCsv
 
             $extraFieldValue = new ExtraFieldValue('career');
             $extraFieldName = $this->extraFieldIdNameList['career'];
+            $loadedStudentList = [];
 
             foreach ($data as $row) {
                 if (empty($row)) {
@@ -2713,11 +2714,17 @@ class ImportCsv
 
                 $extraData = isset($userCareerData['extra_data']) && !empty($userCareerData['extra_data']) ? unserialize($userCareerData['extra_data']) : [];
 
-                $extraData[$row['CourseId']][] = [
+                $teacherInfo = api_get_user_info_from_username($row['TeacherUsername']);
+                $teacherName = $row['TeacherUsername'];
+                if ($teacherInfo) {
+                    $teacherName = $teacherInfo['complete_name'];
+                }
+
+                $extraData[$row['CourseId']][$row['ResultId']] = [
                     'Description' => $row['Description'],
                     'Period' => $row['Period'],
                     'TeacherText' => $row['TeacherText'],
-                    'TeacherUsername' => $row['TeacherUsername'],
+                    'TeacherUsername' => $teacherName,
                     'ScoreText' => $row['ScoreText'],
                     'ScoreValue' => $row['ScoreValue'],
                     'Info' => $row['Info'],
@@ -2727,10 +2734,11 @@ class ImportCsv
                     'Icon' => $row['Icon'],
                     'IconColor' => $row['IconColor'],
                 ];
-
                 $serializedValue = serialize($extraData);
 
                 UserManager::updateUserCareer($userCareerData['id'], $serializedValue);
+
+                //$loadedStudentList[] = $studentId;
             }
         }
     }

main/inc/lib/career.lib.php

@@ -453,13 +453,34 @@ class Career extends Model
     }
 
     /**
-     * @param Graph    $graph
+     * @param array    $careerInfo
      * @param Template $tpl
+     * @param int      $loadUserIdData
      *
      * @return string
      */
-    public static function renderDiagramByColumn($graph, $tpl)
+    public static function renderDiagramByColumn($careerInfo, $tpl, $loadUserIdData = 0)
     {
+        $careerId = isset($careerInfo['id']) ? $careerInfo['id'] : 0;
+        if (empty($careerId)) {
+            return '';
+        }
+
+        $extraFieldValue = new ExtraFieldValue('career');
+        $item = $extraFieldValue->get_values_by_handler_and_field_variable(
+            $careerId,
+            'career_diagram',
+            false,
+            false,
+            false
+        );
+
+        $graph = null;
+        if (!empty($item) && isset($item['value']) && !empty($item['value'])) {
+            /** @var Graph $graph */
+            $graph = UnserializeApi::unserialize('career', $item['value']);
+        }
+
         if (!($graph instanceof Graph)) {
             return '';
         }
@@ -473,6 +494,14 @@ class Career extends Model
             }
         }
 
+        $userResult = [];
+        if (!empty($loadUserIdData)) {
+            $careerData = UserManager::getUserCareer($loadUserIdData, $careerId);
+            if (isset($careerData['extra_data']) && !empty($careerData['extra_data'])) {
+                $userResult = unserialize($careerData['extra_data']);
+            }
+        }
+
         $list = [];
         $subGroups = [];
         /** @var Vertex $vertex */
@@ -506,7 +535,6 @@ class Career extends Model
             $list[$column]['column'] = $column;
         }
 
-        $groupDrawLine = [];
         $groupCourseList = [];
         $simpleConnectionList = [];
 
@@ -535,7 +563,6 @@ class Career extends Model
                                     '',
                                     $explode[0]
                                 );
-                                $groupDrawLine[$groupValueId] = true;
                                 $simpleFirstConnection = 'g'.(int) $groupValueId;
                             } else {
                                 // Course block (row_123 id)
@@ -564,7 +591,6 @@ class Career extends Model
                                     $value
                                 );
                                 $simpleSecondConnection = 'g'.(int) $groupValueId;
-                                $groupDrawLine[$groupValueId] = true;
                             } else {
                                 // Course block (row_123 id)
                                 if (!empty($explode[0]) && isset($explode[1])) {
@@ -605,11 +631,18 @@ class Career extends Model
 
         $graph->xGap = 70;
         $graph->yGap = 55;
+
         $graph->xDiff = 70;
         $graph->yDiff = 55;
 
+        if (!empty($userResult)) {
+            $graph->blockHeight = 180;
+            $graph->yGap = 60;
+            $graph->yDiff = 60;
+        }
+
         foreach ($groupsBetweenColumns as $group => $items) {
-            self::parseColumnList($groupCourseList, $items, '', $graph, $simpleConnectionList);
+            self::parseColumnList($groupCourseList, $items, $graph, $simpleConnectionList, $userResult);
         }
 
         $graphHtml .= '<style>
@@ -690,7 +723,6 @@ class Career extends Model
                 $width = $data['max_width'] + $subGroupDiffX * 2;
                 $height = $data['max_height'] + $subGroupDiffX * 2 + $spaceForSubGroupTitle;
 
-
                 $label = '<h4 style="background: white">'.$data['label'].'</h4>';
                 $vertexData = "var sg$subGroupId = graph.insertVertex(parent, null, '$label', $x, $y, $width, $height, '$style');";
                 $subGroupList[] = $vertexData;
@@ -719,7 +751,16 @@ class Career extends Model
         return $graphHtml;
     }
 
-    public static function parseColumnList($groupCourseList, $columnList, $width, &$graph, &$connections)
+    /**
+     * @param $groupCourseList
+     * @param $columnList
+     * @param $graph
+     * @param $connections
+     * @param $userResult
+     *
+     * @return string
+     */
+    public static function parseColumnList($groupCourseList, $columnList, &$graph, &$connections, $userResult)
     {
         $graphHtml = '';
         $oldGroup = null;
@@ -796,7 +837,8 @@ class Career extends Model
                     $addRow,
                     $graph,
                     $newGroup,
-                    $connections
+                    $connections,
+                    $userResult
                 );
             }
 
@@ -815,10 +857,11 @@ class Career extends Model
      * @param stdClass $graph
      * @param int      $group
      * @param array    $connections
+     * @param array    $userResult
      *
      * @return string
      */
-    public static function parseVertexList($groupCourseList, $vertexList, $addRow = 0, &$graph, $group, &$connections)
+    public static function parseVertexList($groupCourseList, $vertexList, $addRow = 0, &$graph, $group, &$connections, $userResult)
     {
         if (empty($vertexList)) {
             return '';
@@ -849,6 +892,54 @@ class Career extends Model
             $content = '<div class="pull-left">'.$vertex->getAttribute('Notes').'</div>';
             $content .= '<div class="pull-right">['.$id.']</div>';
 
+            if (!empty($userResult) && isset($userResult[$id])) {
+                $results = '';
+                $size = 2;
+                foreach ($userResult[$id] as $index => $iconData) {
+                    $icon = '';
+                    switch ($iconData['Icon']) {
+                        case 0:
+                            $icon = Display::returnFontAwesomeIcon('times-circle', $size);
+                            //$icon = Display::return_icon('delete.png', ' ');
+                            break;
+                        case 1:
+                            $icon = Display::returnFontAwesomeIcon('check-circle', $size);
+                            //$icon = Display::return_icon('check.png', ' ');
+                            break;
+                        case 2:
+                            $icon = Display::returnFontAwesomeIcon('info-circle', $size);
+                            //$icon = Display::return_icon('info3.gif', ' ');
+                            break;
+                    }
+
+                    if (!empty($icon)) {
+                        //data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">
+                        $params = [
+                            'id' => 'course_'.$id.'_'.$index,
+                            'data-toggle' => 'popover',
+                            'title' => 'Popover title',
+                            'class' => 'popup',
+                            'data-description' => $iconData['Description'],
+                            'data-period' => $iconData['Period'],
+                            'data-teacher-text' => $iconData['TeacherText'],
+                            'data-teacher' => $iconData['TeacherUsername'],
+                            'data-score' => $iconData['ScoreText'],
+                            'data-score-value' => $iconData['ScoreValue'],
+                            'data-info' => $iconData['Info'],
+                            'data-background-color' => $iconData['BgColor'],
+                            'data-color' => $iconData['Color'],
+                            'data-border-color' => $iconData['BorderColor'],
+                            'style' => 'color:'.$iconData['IconColor'],
+                        ];
+                        $results .= Display::url($icon, 'javascript:void(0);', $params);
+                    }
+                }
+
+                if (!empty($results)) {
+                    $content .= '<div class="row"></div><div class="pull-right">'.$results.'</div>';
+                }
+            }
+
             $title = $vertex->getAttribute('graphviz.label');
             if (!empty($vertex->getAttribute('LinkedElement'))) {
                 $title = Display::url($title, $vertex->getAttribute('LinkedElement'));

main/inc/lib/usermanager.lib.php

@@ -6594,7 +6594,11 @@ SQL;
 
         $params = ['extra_data' => $data, 'updated_at' => api_get_utc_datetime()];
         $table = Database::get_main_table(TABLE_MAIN_USER_CAREER);
-        Database::update($table, $params, ['where' => ['id = ?' => (int) $userCareerId],]);
+        Database::update(
+            $table,
+            $params,
+            ['id = ?' => (int) $userCareerId]
+        );
 
         return true;
     }

main/template/default/career/diagram.tpl

@@ -36,13 +36,10 @@
         function main(container)
         {
             // Checks if the browser is supported
-            if (!mxClient.isBrowserSupported())
+            if (!mxClient.isBrowserSupported()) {
-            {
                 // Displays an error message if the browser is not supported.
                 mxUtils.error('Browser is not supported!', 200, false);
-            }
+            } else {
-            else
-            {
                 // Disables the built-in context menu
                 mxEvent.disableContextMenu(container);
 
@@ -55,8 +52,7 @@
                 graph.setEnabled(false);
 
                 // Enables connect preview for the default edge style
-                graph.connectionHandler.createEdgeState = function(me)
+                graph.connectionHandler.createEdgeState = function(me) {
-                {
                     var edge = graph.createEdge(null, null, null, null, null);
 
                     return new mxCellState(this.graph.view, edge, this.graph.getCellStyle(edge));
@@ -78,7 +74,6 @@
                     //var v1 = graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30);
                     //var v2 = graph.insertVertex(parent, null, 'World!', 200, 150, 80, 30);
                     //var e1 = graph.insertEdge(parent, null, '', v1, v2);
-
                     {% for vertex in group_list %}
                         {{ vertex }}
                     {% endfor %}
@@ -99,9 +94,9 @@
                     graph.getModel().endUpdate();
                 }
             }
-        };
+        }
 
-        $(document).ready(function () {
+        $(function () {
             main(document.getElementById('graphContainer'));
 
             var svg1 = document.getElementsByTagName("svg")[0];
@@ -109,12 +104,66 @@
             var widthValue = data.width + 100;
             var heightValue = data.height + 50;
 
-            var att = document.createAttributeNS(null, "viewBox");       // Create a "viewBox" attribute
+            var att = document.createAttributeNS(null, "viewBox");
-            att.value = '0 0 ' + widthValue + ' '+heightValue;                           // Set the value of the viewBox attribute
+            att.value = '0 0 ' + widthValue + ' '+heightValue;
             svg1.setAttributeNode(att);
 
+            //$('[data-toggle="popover"]').popover({container: 'body'});
+            //$('.popup').popover({trigger: 'hover'});
+
+            $(".popup").qtip({
+                content: {
+                    text: function(event, api) {
+                        var item = $(this);
+                        var itemId = $(this).attr("id");
+
+                        var desc = $(this).attr("data-description");
+                        var period = $(this).attr("data-period");
+                        var teacherText = $(this).attr("data-teacher-text");
+                        var teacher = $(this).attr("data-teacher");
+                        var score = $(this).attr("data-score");
+                        var value = $(this).attr("data-score-value");
+                        var info = $(this).attr("data-info");
+
+                        var textToShow = desc
+                            + '<br />'+ period + '<br />'
+                            + teacherText +': '+ teacher + '<br />'
+                            + score +': '+ value + '<br />'
+                            + '<br />'+ info + '<br />'
+                        ;
+
+                        return textToShow;
+                    }
+                },
+                events: {
+                    render: function(event, api) {
+                        var popup = $(api.elements.target);
+                        var bg = popup.attr("data-background-color");
+                        var color = popup.attr("data-color");
+                        var borderColor = popup.attr("data-border-color");
+
+                        console.log(bg);
+                        console.log(color);
+                        console.log(borderColor);
+                        // Grab the tooltip element from the API
+                        //var tooltip = api.elements.tooltip;
+
+                        $(this).css('background-color', bg);
+                        $(this).css('color', color);
+                        $(this).css('border-color', borderColor);
+                    }
+                },
+                position: {
+                    my: 'bottom left',  // Position my top left...
+                    at: 'top right', // at the bottom right of...
+                    adjust: {
+                        x: -55,
+                        y: -55
+                    }
+                }
+            });
+
         });
     </script>
-
     {{ content }}
 {% endblock %}

main/user/career_diagram.php

@@ -1,8 +1,6 @@
 <?php
 /* For licensing terms, see /license.txt */
 
-use Fhaculty\Graph\Graph;
-
 /*
  *
  * Requires extra_field_values.value to be longtext to save diagram:
@@ -12,14 +10,13 @@ UPDATE extra_field_values SET updated_at = NULL WHERE CAST(updated_at AS CHAR(20
 ALTER TABLE extra_field_values modify column value longtext null;
 */
 
-$cidReset = true;
 require_once __DIR__.'/../inc/global.inc.php';
 
 if (api_get_configuration_value('allow_career_diagram') == false) {
     api_not_allowed(true);
 }
 
-$this_section = SECTION_PLATFORM_ADMIN;
+$this_section = SECTION_COURSES;
 
 $careerId = isset($_GET['career_id']) ? $_GET['career_id'] : 0;
 
@@ -41,6 +38,8 @@ if ($allow === false) {
 }
 
 $htmlHeadXtra[] = api_get_js('jsplumb2.js');
+$htmlHeadXtra[] = api_get_asset('qtip2/jquery.qtip.min.js');
+$htmlHeadXtra[] = api_get_css_asset('qtip2/jquery.qtip.min.css');
 
 // setting breadcrumbs
 $interbreadcrumb[] = [
@@ -54,13 +53,6 @@ $interbreadcrumb[] = [
 ];
 
 $extraFieldValue = new ExtraFieldValue('career');
-$item = $extraFieldValue->get_values_by_handler_and_field_variable(
-    $careerId,
-    'career_diagram',
-    false,
-    false,
-    false
-);
 
 // Check urls
 $itemUrls = $extraFieldValue->get_values_by_handler_and_field_variable(
@@ -89,10 +81,10 @@ if (!empty($itemUrls) && !empty($itemUrls['value'])) {
 
 $tpl = new Template(get_lang('Diagram'));
 $html = Display::page_subheader2($careerInfo['name'].$urlToString);
-if (!empty($item) && isset($item['value']) && !empty($item['value'])) {
+$diagram = Career::renderDiagramByColumn($careerInfo, $tpl, $userId);
-    /** @var Graph $graph */
+
-    $graph = UnserializeApi::unserialize('career', $item['value']);
+if (!empty($diagram)) {
-    $html .= Career::renderDiagramByColumn($graph, $tpl);
+    $html .= $diagram;
 } else {
     Display::addFlash(
         Display::return_message(