Browse Source

Improvement in glossary view - refs #2681

Alex Aragón 6 years ago
parent
commit
0b1e85b1ff

+ 20 - 0
assets/css/scss/_base.scss

@@ -40,6 +40,7 @@ h5, h6{
 p {
   font-family: $font-primary;
   line-height: 1.9;
+  color: #666666;
 }
 
 .lead {
@@ -1209,6 +1210,9 @@ hr {
   border-radius: 4px;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
   margin-bottom: 10px;
+  .btn-export{
+    padding: 0;
+  }
   img {
     padding: 3px;
     border: 1px solid #dcdcdc;
@@ -2060,6 +2064,22 @@ hr {
     }
   }
 }
+/****** GLOSSARY *****/
+.glossary{
+  .title{
+    font-size: 1.65rem;
+    text-align: center;
+  }
+  .item-glossary{
+    border-bottom: 1px solid #dddddd;
+    h5{
+      margin-bottom: 0;
+      font-weight: bold;
+      color: #5b6be8;
+      font-size: 1.15rem;
+    }
+  }
+}
 
 /****** FORUM CSS ******/
 

+ 37 - 29
main/glossary/index.php

@@ -22,36 +22,24 @@ api_protect_course_script(true);
 // Additional javascripts.
 $htmlHeadXtra[] = GlossaryManager::javascript_glossary();
 $htmlHeadXtra[] = '<script>
-function setFocus(){
-    $("#glossary_title").focus();
-}
 
 $(document).ready(function () {
-    setFocus();
-    $( "#dialog:ui-dialog" ).dialog( "destroy" );
-    $( "#dialog-confirm" ).dialog({
-        autoOpen: false,
-        show: "blind",
-        resizable: false,
-        height:300,
-        modal: true
+    
+    var targetUrl;
+    var export_format;
+    
+    $("#export-glossary").click(function() {
+        targetUrl = $(this).attr("href");
     });
-    $("#export_opener").click(function() {
-        var targetUrl = $(this).attr("href");        
-        $( "#dialog-confirm" ).dialog({
-            width:400,
-            height:300,
-            buttons: {
-                "'.addslashes(get_lang('Download')).'": function() {
-                    var export_format = $("input[name=export_format]:checked").val();
-                    location.href = targetUrl+"&export_format="+export_format;
-                    $( this ).dialog( "close" );
-                }
-            }
-        });
-        $( "#dialog-confirm" ).dialog("open");
-        return false;
+    
+    $("#btn-download").click(function() {
+      export_format = $("input[name=export_format]:checked").val();
+      location.href = targetUrl+"&export_format="+export_format;
+      $("#modal-export").modal("hide");
     });
+    
+    
+    
 });
 </script>';
 
@@ -459,7 +447,7 @@ Display::display_introduction_section(TOOL_GLOSSARY);
 
 echo $content;
 
-$extra = '<div id="dialog-confirm" title="'.get_lang("ConfirmYourChoice").'">';
+$extra = null;
 $form = new FormValidator(
     'report',
     'post',
@@ -493,8 +481,28 @@ $form->addElement(
 );
 
 $form->setDefaults(['export_format' => 'csv']);
-$extra .= $form->returnForm();
-$extra .= '</div>';
+
+$extra .= '
+    <div class="modal fade" id="modal-export" tabindex="-1" role="dialog" aria-labelledby="exportModalLabel" aria-hidden="true">
+        <div class="modal-dialog" role="document">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h5 class="modal-title" id="exportModalLabel">'.get_lang("ConfirmYourChoice").'</h5>
+                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                        <span aria-hidden="true">&times;</span>
+                    </button>
+                </div>
+                <div class="modal-body">'
+                    .$form->returnForm().
+                '</div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">'.get_lang('Close').'</button>
+                    <button type="button" id="btn-download" class="btn btn-primary">'.get_lang('Download').'</button>
+                </div>
+            </div>
+        </div>
+    </div>
+';
 
 echo $extra;
 

+ 88 - 37
main/inc/lib/glossary.lib.php

@@ -393,36 +393,30 @@ class GlossaryManager
     {
         // This function should always be called with the corresponding
         // parameter for view type. Meanwhile, use this cheap trick.
-        $view = self::getGlossaryView();
+
         // action links
         $actionsLeft = '';
         if (api_is_allowed_to_edit(null, true)) {
-            $actionsLeft .= '<a href="index.php?'.api_get_cidreq().'&action=addglossary&msg=add?'.api_get_cidreq().'">'.
-                Display::return_icon('new_glossary_term.png', get_lang('TermAddNew'), '', ICON_SIZE_MEDIUM).'</a>';
+            $actionsLeft .= '<a href="index.php?' . api_get_cidreq() . '&action=addglossary&msg=add?' . api_get_cidreq() . '">' .
+                Display::return_icon('new_glossary_term.png', get_lang('TermAddNew'), '', ICON_SIZE_MEDIUM) . '</a>';
         }
 
         if (api_is_allowed_to_edit(null, true)) {
-            $actionsLeft .= '<a href="index.php?'.api_get_cidreq().'&action=import">'.
-                Display::return_icon('import.png', get_lang('ImportGlossary'), '', ICON_SIZE_MEDIUM).'</a>';
+            $actionsLeft .= '<a href="index.php?' . api_get_cidreq() . '&action=import">' .
+                Display::return_icon('import.png', get_lang('ImportGlossary'), '', ICON_SIZE_MEDIUM) . '</a>';
         }
 
         if (!api_is_anonymous()) {
-            $actionsLeft .= '<a id="export_opener" href="'.api_get_self().'?'.api_get_cidreq().'&action=export">'.
-                Display::return_icon('save.png', get_lang('Export'), '', ICON_SIZE_MEDIUM).'</a>';
+            $actionsLeft .= '<a id="export-glossary" href="' . api_get_self() . '?' . api_get_cidreq() . '&action=export" class="btn btn-link btn-export" data-toggle="modal" data-target="#modal-export">' .
+                Display::return_icon('save.png', get_lang('Export'), '', ICON_SIZE_MEDIUM) . '</a>';
         }
 
-        if (($view == 'table') || (!isset($view))) {
-            $actionsLeft .= '<a href="index.php?'.api_get_cidreq().'&action=changeview&view=list">'.
-                Display::return_icon('view_detailed.png', get_lang('ListView'), '', ICON_SIZE_MEDIUM).'</a>';
-        } else {
-            $actionsLeft .= '<a href="index.php?'.api_get_cidreq().'&action=changeview&view=table">'.
-                Display::return_icon('view_text.png', get_lang('TableView'), '', ICON_SIZE_MEDIUM).'</a>';
-        }
+
 
         if (!api_is_anonymous()) {
             $actionsLeft .= Display::url(
                 Display::return_icon('export_to_documents.png', get_lang('ExportToDocArea'), [], ICON_SIZE_MEDIUM),
-                api_get_self().'?'.api_get_cidreq().'&'.http_build_query(['action' => 'export_documents'])
+                api_get_self() . '?' . api_get_cidreq() . '&' . http_build_query(['action' => 'export_documents'])
             );
         }
 
@@ -430,7 +424,7 @@ class GlossaryManager
         $form = new FormValidator(
             'search',
             'get',
-            api_get_self().'?'.api_get_cidreq(),
+            api_get_self() . '?' . api_get_cidreq(),
             '',
             [],
             FormValidator::LAYOUT_INLINE
@@ -439,7 +433,7 @@ class GlossaryManager
         $form->addElement('hidden', 'cidReq', api_get_course_id());
         $form->addElement('hidden', 'id_session', api_get_session_id());
         $form->addButtonSearch(get_lang('Search'));
-        $actionsRight = $form->returnForm();
+        $actionsRight = '<div class="float-right">'.$form->returnForm().'</div>';
 
         $toolbar = Display::toolbarAction(
             'toolbar-document',
@@ -447,27 +441,12 @@ class GlossaryManager
         );
 
         $content = $toolbar;
+        $list = self::getListGlossary(1000,0,'ASC');
 
-        if (!$view || $view === 'table') {
-            $table = new SortableTable(
-                'glossary',
-                ['GlossaryManager', 'get_number_glossary_terms'],
-                ['GlossaryManager', 'get_glossary_data'],
-                0
-            );
-            //$table->set_header(0, '', false);
-            $table->set_header(0, get_lang('TermName'), true);
-            $table->set_header(1, get_lang('TermDefinition'), true);
-            if (api_is_allowed_to_edit(null, true)) {
-                $table->set_header(2, get_lang('Actions'), false, 'width=90px', ['class' => 'td_actions']);
-                $table->set_column_filter(2, ['GlossaryManager', 'actions_filter']);
-            }
-            $content .= $table->return_table();
-        }
-
-        if ($view === 'list') {
-            $content .= self::displayGlossaryList();
-        }
+        $tpl = new Template(null);
+        $tpl->assign('data', $list);
+        $layout = $tpl->get_template('glossary/list.html.twig');
+        $content .= $tpl->fetch($layout);
 
         return $content;
     }
@@ -526,6 +505,78 @@ class GlossaryManager
         return $obj->total;
     }
 
+    public static function getListGlossary($numberOfItems, $column, $direction){
+        $_user = api_get_user_info();
+
+        // Database table definition
+        $t_glossary = Database::get_course_table(TABLE_GLOSSARY);
+        $t_item_propery = Database::get_course_table(TABLE_ITEM_PROPERTY);
+
+        if (api_is_allowed_to_edit(null, true)) {
+            $col2 = " glossary.glossary_id	as col2, ";
+        } else {
+            $col2 = ' ';
+        }
+
+        //condition for the session
+        $session_id = api_get_session_id();
+        $condition_session = api_get_session_condition(
+            $session_id,
+            true,
+            true,
+            'glossary.session_id'
+        );
+
+        $column = intval($column);
+        if (!in_array($direction, ['DESC', 'ASC'])) {
+            $direction = 'ASC';
+        }
+
+        $numberOfItems = intval($numberOfItems);
+
+        $keyword = isset($_GET['keyword']) ? Database::escape_string($_GET['keyword']) : '';
+        $keywordCondition = '';
+        if (!empty($keyword)) {
+            $keywordCondition = "AND (glossary.name LIKE '%$keyword%' OR glossary.description LIKE '%$keyword%')";
+        }
+        $sql = "SELECT
+                    glossary.name as col0,
+					glossary.description as col1,
+					$col2
+					glossary.session_id
+				FROM $t_glossary glossary 
+				INNER JOIN $t_item_propery ip
+				ON (glossary.glossary_id = ip.ref AND glossary.c_id = ip.c_id)
+				WHERE				    
+					tool = '".TOOL_GLOSSARY."' 
+					$condition_session AND
+					glossary.c_id = ".api_get_course_int_id()." AND
+					ip.c_id = ".api_get_course_int_id()."
+					$keywordCondition
+		        ORDER BY col$column $direction
+		        LIMIT 0,$numberOfItems";
+        $res = Database::query($sql);
+
+        $list = [];
+        $array = [];
+
+        while ($data = Database::fetch_array($res)) {
+            // Validation when belongs to a session
+            if (api_is_allowed_to_edit(null, true)) {
+                $array['id'] = $data[2];
+                $array['edit'] = '/main/glossary/index.php?action=edit_glossary&glossary_id='.$data[2].'&'.api_get_cidreq().'&msg=edit';
+                $array['delete'] = '/main/glossary/index.php?action=delete_glossary&glossary_id='.$data[2];
+            }
+            $session_img = api_get_session_image($data['session_id'], $_user['status']);
+            $array['title'] = $data[0].$session_img;
+            $array['description'] = api_html_entity_decode($data[1]);
+            $list[] = $array;
+        }
+
+        return $list;
+        
+    }
+
     /**
      * Get all the data of a glossary.
      *

+ 22 - 0
main/template/default/glossary/list.html.twig

@@ -0,0 +1,22 @@
+{% autoescape false %}
+<div class="glossary mt-5">
+    {% for item in data %}
+    <div class="item-glossary mb-4 pl-2 pr-2">
+        {% if item.edit %}
+            <div class="float-right">
+                <div class="btn-group" role="group">
+                    <a href="{{ item.edit }}" class="btn btn-light btn-sm">
+                        <i class="fas fa-pencil-alt"></i>
+                    </a>
+                    <a title="{{ 'Confirm if you want to delete'|trans }}" href="{{ item.delete }}" class="btn btn-light btn-sm delete-swal">
+                        <i class="far fa-trash-alt"></i>
+                    </a>
+                </div>
+            </div>
+        {% endif %}
+        <h5 class="terms-title">{{ item.title }}</h5>
+        {{ item.description }}
+    </div>
+    {% endfor %}
+</div>
+{% endautoescape %}