improvement in presentation of lesson list

pull/2837/head
Alex Aragón 7 years ago
parent cec93780ae
commit 3b25f342fc
  1. 94
      assets/css/scss/_base.scss
  2. 2
      main/lp/learnpath.class.php
  3. 7
      main/lp/lp_list.php
  4. BIN
      public/img/icons/22/cd_copy.png
  5. BIN
      public/img/icons/22/cd_copy_na.png
  6. 4
      src/ThemeBundle/Resources/views/Layout/layout_one_col.html.twig
  7. 466
      src/ThemeBundle/Resources/views/LearnPath/list.html.twig

@ -1630,66 +1630,44 @@ hr {
} }
/**** LP COLLAPSE CATEGORY ****/ /**** LP COLLAPSE CATEGORY ****/
#lp-accordion .panel-default { .progress{
border-radius: 10px; border: 1px solid #d5d5d5;
}
#lp-accordion .panel-default .panel-heading {
background: url(#{$svg-path}/arrow-down.svg) #FFF right center no-repeat;
border-radius: 10px;
}
#lp-accordion .panel-default .panel-heading .tools-actions {
padding-right: 20px;
}
#lp-accordion .panel {
box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}
#lp-accordion .panel .panel-title {
font-weight: bold;
width: 100%;
display: block;
padding-top: 5px;
padding-bottom: 5px;
} }
.lp-accordion{
#lp-accordion .panel .panel-title a { .list-group{
width: 100%; .list-group-item{
display: block; padding: 0.75rem 0;
} .title{
font-size: 14px;
#lp-accordion .lp-item { font-weight: normal;
border-bottom: 1px solid #dddddd; }
padding-top: 5px; .extra {
padding-bottom: 5px; padding-left: 26px;
margin-bottom: 5px; font-size: 12px;
display: inline-block; color: #868686;
width: 100%; }
} .list-allowed{
margin-bottom: 5px;
#lp-accordion .lp-item:last-child { font-size: 12px;
border-bottom: none; list-style: none;
padding-bottom: 0; padding: 0;
} }
}
#lp-accordion .lp-item .fa { }
color: #686f7a; .lp-actions{
opacity: .5; a{
margin-right: 5px; img{
} border: 1px solid #cdcdcd;
background-color: #ffffff;
#lp-accordion .lp-item .progress { padding: 2px;
border: none; border-radius: 4px;
background: #D7E3E6; &:hover{
margin-bottom: 10px; background-color: #cdcdcd;
} }
}
#lp-accordion #not-category .lp-item { }
margin-bottom: 0; }
} }
/***** PROMOTIONS *****/ /***** PROMOTIONS *****/
.promotions { .promotions {

@ -9099,7 +9099,7 @@ class learnpath
$renderer = $form->defaultRenderer(); $renderer = $form->defaultRenderer();
$renderer->setElementTemplate(' {label}{element}', 'content_lp'); $renderer->setElementTemplate(' {label}{element}', 'content_lp');
$form->addElement('html', '<div class="editor-lp">'); $form->addElement('html', '<div class="editor-lp">');
$form->addHtmlEditor('content_lp', null, null, true, $editor_config, true); $form->addHtmlEditor('content_lp', null, null, true, $editor_config);
$form->addElement('html', '</div>'); $form->addElement('html', '</div>');
$defaults['content_lp'] = $content; $defaults['content_lp'] = $content;
} }

@ -321,12 +321,11 @@ foreach ($categories as $item) {
// student view automatically. Many teachers are confused // student view automatically. Many teachers are confused
// by that, so maybe a solution can be found to avoid it // by that, so maybe a solution can be found to avoid it
$url_start_lp .= '&isStudentView=true'; $url_start_lp .= '&isStudentView=true';
$dsp_desc = '<em>'.$details['lp_maker'].'</em> ' $dsp_desc = '<span>'.$details['lp_maker'].'</span> '
.($lpVisibility .($lpVisibility
? '' ? ''
: ' - ('.get_lang('LPNotVisibleToStudent').')'); : ' - ('.get_lang('LPNotVisibleToStudent').')');
$extra = '<div class ="lp_content_type_label">'.$dsp_desc $extra = $dsp_desc;
.'</div>';
} }
$my_title = $name; $my_title = $name;
@ -391,7 +390,7 @@ foreach ($categories as $item) {
} }
if ($is_allowed_to_edit) { if ($is_allowed_to_edit) {
$dsp_progress = '<center>'.$progress.'%</center>'; $dsp_progress = learnpath::get_progress_bar($progress, '%');
} else { } else {
$dsp_progress = ''; $dsp_progress = '';
if (!api_is_invitee()) { if (!api_is_invitee()) {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 740 B

After

Width:  |  Height:  |  Size: 727 B

@ -38,6 +38,10 @@
<section class="container-fluid"> <section class="container-fluid">
<div class="card mb-4"> <div class="card mb-4">
<div id="card-container" class="card-body"> <div id="card-container" class="card-body">
{% if introduction != '' %}
{{ introduction }}
{% endif %}
{% if actions != '' %} {% if actions != '' %}
{{ actions }} {{ actions }}
{% endif %} {% endif %}

@ -1,6 +1,9 @@
{% extends '@ChamiloTheme/Layout/layout_one_col.html.twig' %} {% extends '@ChamiloTheme/Layout/layout_one_col.html.twig' %}
{% block content %} {% block content %}
{% autoescape false %} {% autoescape false %}
<script> <script>
function confirmation(name) { function confirmation(name) {
if (confirm("{{ "AreYouSureToDeleteJS"|trans }} \"" + name + "\" ?")) { if (confirm("{{ "AreYouSureToDeleteJS"|trans }} \"" + name + "\" ?")) {
@ -10,8 +13,8 @@
} }
} }
</script> </script>
{% set configuration = 'lp_category_accordion'|api_get_configuration_value %}
<div class="lp-accordion panel-group" id="lp-accordion" role="tablist" aria-multiselectable="true"> <div class="lp-accordion">
{% for lp_data in data %} {% for lp_data in data %}
{% set show_category = true %} {% set show_category = true %}
@ -20,27 +23,27 @@
{% endif %} {% endif %}
{% if show_category %} {% if show_category %}
{% if configuration == 0 %}
<!--- old view --> <!--- old view -->
{% if categories|length > 1 and lp_data.category.id %} {% if categories|length > 1 and lp_data.category.id %}
{% if is_allowed_to_edit %} {% if is_allowed_to_edit %}
<h3 class="page-header">
{{ lp_data.category.getName() }} {% set toolbar_actions %}
{% if lp_data.category.getId() > 0 %} {% if lp_data.category.getId() > 0 %}
{% if not _c.session_id %} {% if not _c.session_id %}
<a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=add_lp_category&id=' ~ lp_data.category.getId() }}" <a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=add_lp_category&id=' ~ lp_data.category.getId() }}"
title="{{ "Edit"|trans }}"> title="{{ "Edit"|trans }}">
<img src="{{ "edit.png"|icon }}" alt="{{ "Edit"|trans }}"> <img src="{{ "edit.png"|icon }}" alt="{{ "Edit"|trans }}">
</a> </a>
{% if subscription_settings.allow_add_users_to_lp_category %} {% if subscription_settings.allow_add_users_to_lp_category %}
<a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=add_users_to_category&id=' ~ lp_data.category.getId() }}" <a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=add_users_to_category&id=' ~ lp_data.category.getId() }}"
title="{{ "AddUsers"|trans }}"> title="{{ "AddUsers"|trans }}">
<img src="{{ "user.png"|icon }}" alt="{{ "AddUsers"|trans }}"> <img src="{{ "user.png"|icon }}" alt="{{ "AddUsers"|trans }}">
</a> </a>
{% endif %} {% endif %}
{% if loop.index0 == 1 %} {% if loop.index0 == 1 %}
<a href="#"> <a href="#">
<img src="{{ "up_na.png"|icon }}" alt="{{ "Move"|trans }}"> <img src="{{ "up_na.png"|icon }}" alt="{{ "Move"|trans }}">
@ -51,7 +54,6 @@
<img src="{{ "up.png"|icon }}" alt="{{ "Move"|trans }}"> <img src="{{ "up.png"|icon }}" alt="{{ "Move"|trans }}">
</a> </a>
{% endif %} {% endif %}
{% if (data|length - 1) == loop.index0 %} {% if (data|length - 1) == loop.index0 %}
<a href="#"> <a href="#">
<img src="{{ "down_na.png"|icon }}" alt="{{ "Move"|trans }}"> <img src="{{ "down_na.png"|icon }}" alt="{{ "Move"|trans }}">
@ -63,7 +65,6 @@
</a> </a>
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if lp_data.category_visibility == 0 %} {% if lp_data.category_visibility == 0 %}
<a href="lp_controller.php?{{ _p.web_cid_query ~ '&' ~ {'action':'toggle_category_visibility', 'id':lp_data.category.id, 'new_status':1}|url_encode }}" <a href="lp_controller.php?{{ _p.web_cid_query ~ '&' ~ {'action':'toggle_category_visibility', 'id':lp_data.category.id, 'new_status':1}|url_encode }}"
title="{{ 'Show'|trans }}"> title="{{ 'Show'|trans }}">
@ -95,396 +96,105 @@
</a> </a>
{% endif %} {% endif %}
{% endif %} {% endif %}
</h3>
{% elseif lp_data.lp_list is not empty %} {% endset %}
<h3 class="page-header">{{ lp_data.category.getName() }}</h3>
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if lp_data.lp_list %} <div class="card">
<div class="table-responsive"> <h5 class="card-header">
<table class="table table-hover table-striped"> {{ lp_data.category.getName() }}
<thead> <div class="float-right">
<tr> {{ toolbar_actions }}
<th>{{ "Title"|trans }}</th> </div>
{% if is_allowed_to_edit %} </h5>
<th>{{ "PublicationDate"|trans }}</th> <div class="card-body">
<th>{{ "ExpirationDate"|trans }}</th>
<th>{{ "Progress"|trans }}</th> <!-- LIST SCORM -->
<th>{{ "AuthoringOptions"|trans }}</th>
{% else %}
{% if not is_invitee %}
<th>{{ "Progress"|trans }}</th>
{% endif %}
<th>{{ "Actions"|trans }}</th>
{% endif %}
</tr>
</thead>
<tbody>
{% for row in lp_data.lp_list %}
<tr>
<td>
{{ row.learnpath_icon }}
<a href="{{ row.url_start }}">
{{ row.title }}
{{ row.session_image }}
{{ row.extra }}
</a>
</td>
{% if is_allowed_to_edit %}
<td>
{% if row.start_time %}
<span class="small">{{ row.start_time }}</span>
{% endif %}
</td>
<td>
<span class="small">{{ row.end_time }}</span>
</td>
<td>
{{ row.dsp_progress }}
</td>
{% else %}
{% if not is_invitee %}
<td>
{{ row.dsp_progress }}
</td>
{% endif %}
{% endif %}
<td>
{{ row.action_build }}
{{ row.action_edit }}
{{ row.action_visible }}
{{ row.action_tracking }}
{{ row.action_publish }}
{{ row.action_subscribe_users }}
{{ row.action_serious_game }}
{{ row.action_reinit }}
{{ row.action_default_view }}
{{ row.action_debug }}
{{ row.action_export }}
{{ row.action_copy }}
{{ row.action_auto_launch }}
{{ row.action_pdf }}
{{ row.action_delete }}
{{ row.action_order }}
{{ row.action_update_scorm }}
{{ row.action_export_to_course_build }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
<!--- end old view -->
{% else %}
<!-- new view block accordeon -->
{% if lp_data.category.id == 0 %}
{% if is_allowed_to_edit %}
{% if lp_data.lp_list %} {% if lp_data.lp_list %}
<div class="table-responsive">
<table class="table table-hover table-striped">
<thead>
<tr>
<th>{{ "Title"|trans }}</th>
{% if is_allowed_to_edit %}
<th>{{ "PublicationDate"|trans }}</th>
<th>{{ "ExpirationDate"|trans }}</th>
<th>{{ "Progress"|trans }}</th>
<th>{{ "AuthoringOptions"|trans }}</th>
{% else %}
{% if not is_invitee %}
<th>{{ "Progress"|trans }}</th>
{% endif %}
<th>{{ "Actions"|trans }}</th> <ul class="list-group list-group-flush">
{% endif %} {% for row in lp_data.lp_list %}
</tr> <li class="list-group-item">
</thead> <div class="row">
<tbody> <div class="col-md-5">
{% for row in lp_data.lp_list %} <h4 class="title">
<tr> <a href="{{ row.url_start }}">
<td> {{ row.learnpath_icon }}
{{ row.learnpath_icon }} {{ row.title }}
<a href="{{ row.url_start }}"> {{ row.session_image }}
{{ row.title }} </a>
{{ row.session_image }} </h4>
<div class="extra">
{{ row.extra }} {{ row.extra }}
</a> </div>
</td> <div class="lp-actions">
{% if is_allowed_to_edit %} {{ row.action_build }}
<td> {{ row.action_edit }}
{{ row.action_visible }}
{{ row.action_tracking }}
{{ row.action_publish }}
{{ row.action_subscribe_users }}
{{ row.action_serious_game }}
{{ row.action_reinit }}
{{ row.action_default_view }}
{{ row.action_debug }}
{{ row.action_export }}
{{ row.action_copy }}
{{ row.action_auto_launch }}
{{ row.action_pdf }}
{{ row.action_delete }}
{{ row.action_order }}
{{ row.action_update_scorm }}
{{ row.action_export_to_course_build }}
</div>
</div>
<div class="col-md-5">
{% if is_allowed_to_edit %}
<ul class="list-allowed">
{% if row.start_time %} {% if row.start_time %}
<span class="small">{{ row.start_time }}</span> <li>
<strong>{{ "PublicationDate"|trans }} :</strong>
{{ row.start_time }}
</li>
{% endif %} {% endif %}
</td> <li>
<td> <strong>{{ "ExpirationDate"|trans }} :</strong>
<span class="small">{{ row.end_time }}</span> {{ row.end_time }}
</td> </li>
<td> </ul>
{{ row.dsp_progress }} {{ row.dsp_progress }}
</td> {% else %}
{% else %} {% if not is_invitee %}
{% if not is_invitee %}
<td>
{{ row.dsp_progress }} {{ row.dsp_progress }}
</td> {% endif %}
{% endif %} {% endif %}
{% endif %}
<td>
{{ row.action_build }}
{{ row.action_edit }}
{{ row.action_visible }}
{{ row.action_tracking }}
{{ row.action_publish }}
{{ row.action_subscribe_users }}
{{ row.action_serious_game }}
{{ row.action_reinit }}
{{ row.action_default_view }}
{{ row.action_debug }}
{{ row.action_export }}
{{ row.action_copy }}
{{ row.action_auto_launch }}
{{ row.action_pdf }}
{{ row.action_delete }}
{{ row.action_order }}
{{ row.action_update_scorm }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
{% else %}
<div id="not-category" class="panel panel-default">
<div class="panel-body">
{% for row in lp_data.lp_list %}
<div class="lp-item">
<div class="row">
<div class="col-md-8">
<i class="fa fa-chevron-circle-right" aria-hidden="true"></i>
<a href="{{ row.url_start }}">
{{ row.title }}
{{ row.session_image }}
{{ row.extra }}
</a>
</div>
<div class="col-md-3">
{{ row.dsp_progress }}
</div> </div>
<div class="col-md-1"> <div class="col-md-2">
{{ row.action_pdf }} <div class="float-right">
<a class="btn btn-success" href="{{ row.url_start }}">
Acceder
</a>
</div>
</div> </div>
</div> </div>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% endif %}
{% if categories|length > 1 and lp_data.category.id %}
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="heading-{{ lp_data.category.getId() }}">
{% if is_allowed_to_edit %}
<div class="tools-actions pull-right">
{% if lp_data.category.getId() > 0 %}
{% if not _c.session_id %}
<a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=add_lp_category&id=' ~ lp_data.category.getId() }}"
title="{{ "Edit"|trans }}">
<img src="{{ "edit.png"|icon }}" alt="{{ "Edit"|trans }}">
</a>
{% if subscription_settings.allow_add_users_to_lp_category %}
<a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=add_users_to_category&id=' ~ lp_data.category.getId() }}"
title="{{ "AddUsers"|trans }}">
<img src="{{ "user.png"|icon }}" alt="{{ "AddUsers"|trans }}">
</a>
{% endif %}
{% if loop.index0 == 1 %} </li>
<a href="#"> {% endfor %}
<img src="{{ "up_na.png"|icon }}" alt="{{ "Move"|trans }}"> </ul>
</a>
{% else %}
<a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=move_up_category&id=' ~ lp_data.category.getId() }}"
title="{{ "Move"|trans }}">
<img src="{{ "up.png"|icon }}" alt="{{ "Move"|trans }}">
</a>
{% endif %}
{% if (data|length - 1) == loop.index0 %}
<a href="#">
<img src="{{ "down_na.png"|icon }}" alt="{{ "Move"|trans }}">
</a>
{% else %}
<a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=move_down_category&id=' ~ lp_data.category.getId() }}"
title="{{ "Move"|trans }}">
<img src="{{ "down.png"|icon }}" alt="{{ "Move"|trans }}">
</a>
{% endif %}
{% endif %}
{% if lp_data.category_visibility == 0 %}
<a href="lp_controller.php?{{ _p.web_cid_query ~ '&' ~ {'action':'toggle_category_visibility', 'id':lp_data.category.id, 'new_status':1}|url_encode }}"
title="{{ 'Show'|trans }}">
<img src="{{ 'invisible.png'|icon }}" alt="{{ 'Show'|trans }}">
</a>
{% else %}
<a href="lp_controller.php?{{ _p.web_cid_query ~ '&' ~ {'action':'toggle_category_visibility', 'id':lp_data.category.id, 'new_status':0}|url_encode }}"
title="{{ 'Hide'|trans }}">
<img src="{{ 'visible.png'|icon }}" alt="{{ 'Hide'|trans }}">
</a>
{% endif %}
{% if lp_data.category_visibility == 1 %}
{% if lp_data.category_is_published == 0 %}
<a href="lp_controller.php?{{ _p.web_cid_query ~ '&' ~ {'action':'toggle_category_publish', 'id':lp_data.category.id, 'new_status':1}|url_encode }}"
title="{{ 'LearnpathPublish'|trans }}">
<img src="{{ 'lp_publish_na.png'|icon }}"
alt="{{ 'LearnpathPublish'|trans }}">
</a>
{% else %}
<a href="lp_controller.php?{{ _p.web_cid_query ~ '&' ~ {'action':'toggle_category_publish', 'id':lp_data.category.id, 'new_status':0}|url_encode }}"
title="{{ 'LearnpathDoNotPublish'|trans }}">
<img src="{{ 'lp_publish.png'|icon }}" alt="{{ 'Hide'|trans }}">
</a>
{% endif %}
{% else %}
<img src="{{ 'lp_publish_na.png'|icon }}"
alt="{{ 'LearnpathPublish'|trans }}">
{% endif %}
{% if not _c.session_id %} {% endif %}
<a href="{{ 'lp_controller.php?' ~ _p.web_cid_query ~ '&action=delete_lp_category&id=' ~ lp_data.category.getId() }}"
title="{{ "Delete"|trans }}">
<img src="{{ "delete.png"|icon }}" alt="{{ "Delete"|trans }}">
</a>
{% endif %}
{% endif %}
</div>
{% endif %}
<h4 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#lp-accordion"
href="#collapse-{{ lp_data.category.getId() }}" aria-expanded="true"
aria-controls="collapse-{{ lp_data.category.getId() }}">
{{ lp_data.category.getName() }}
</a>
</h4>
</div>
<div id="collapse-{{ lp_data.category.getId() }}" class="panel-collapse collapse {{ (categories|length > 1 ? 'in':'') }}" <!-- END LIST SCORM -->
role="tabpanel" aria-labelledby="heading-{{ lp_data.category.getId() }}">
<div class="panel-body">
{% if lp_data.lp_list %}
{% if is_allowed_to_edit %} </div>
<div class="table-responsive"> </div>
<table class="table table-hover table-striped">
<thead>
<tr>
<th>{{ "Title"|trans }}</th>
{% if is_allowed_to_edit %}
<th>{{ "PublicationDate"|trans }}</th>
<th>{{ "ExpirationDate"|trans }}</th>
<th>{{ "Progress"|trans }}</th>
<th>{{ "AuthoringOptions"|trans }}</th>
{% else %}
{% if not is_invitee %}
<th>{{ "Progress"|trans }}</th>
{% endif %}
<th>{{ "Actions"|trans }}</th>
{% endif %}
</tr>
</thead>
<tbody>
{% for row in lp_data.lp_list %}
<tr>
<td>
{{ row.learnpath_icon }}
<a href="{{ row.url_start }}">
{{ row.title }}
{{ row.session_image }}
{{ row.extra }}
</a>
</td>
{% if is_allowed_to_edit %}
<td>
{% if row.start_time %}
<span class="small">{{ row.start_time }}</span>
{% endif %}
</td>
<td>
<span class="small">{{ row.end_time }}</span>
</td>
<td>
{{ row.dsp_progress }}
</td>
{% else %}
{% if not is_invitee %}
<td>
{{ row.dsp_progress }}
</td>
{% endif %}
{% endif %}
<td> <!--- end old view -->
{{ row.action_build }}
{{ row.action_edit }}
{{ row.action_visible }}
{{ row.action_tracking }}
{{ row.action_publish }}
{{ row.action_subscribe_users }}
{{ row.action_serious_game }}
{{ row.action_reinit }}
{{ row.action_default_view }}
{{ row.action_debug }}
{{ row.action_export }}
{{ row.action_copy }}
{{ row.action_auto_launch }}
{{ row.action_pdf }}
{{ row.action_delete }}
{{ row.action_order }}
{{ row.action_update_scorm }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
{% for row in lp_data.lp_list %}
<div class="lp-item">
<div class="row">
<div class="col-md-8">
<i class="fa fa-chevron-circle-right" aria-hidden="true"></i>
<a href="{{ row.url_start }}">
{{ row.title }}
{{ row.session_image }}
{{ row.extra }}
</a>
</div>
<div class="col-md-3">
{{ row.dsp_progress }}
</div>
<div class="col-md-1">
{{ row.action_pdf }}
</div>
</div>
</div>
{% endfor %}
{% endif %}
{% endif %}
</div>
</div>
</div>
{% endif %}
<!-- end view block accordeon -->
{% endif %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</div> </div>

Loading…
Cancel
Save