Merge branch 'MDL-54119-master-with_progress_bar_template' of git://github.com/junpat...

diff --git a/admin/tool/lp/styles.css b/admin/tool/lp/styles.css
index 041edb6..701fc99 100644 (file)
--- a/admin/tool/lp/styles.css
+++ b/admin/tool/lp/styles.css
@@ -6,13 +6,14 @@
 }
 .path-admin-tool-lp .progresstext {
     display: inline-block;
-    height: 40px;
     vertical-align: top;
 }
 .path-admin-tool-lp .progress {
     width: 100%;
     display: inline-block;
-    margin-right: 2em;
+}
+.path-admin-tool-lp .progress .bar {
+    min-width: 3em;
 }
 .dir-rtl.path-admin-tool-lp .progress .bar {
     float: right;

diff --git a/admin/tool/lp/templates/course_competency_statistics.mustache b/admin/tool/lp/templates/course_competency_statistics.mustache
index e57159b..437bd53 100644 (file)
--- a/admin/tool/lp/templates/course_competency_statistics.mustache
+++ b/admin/tool/lp/templates/course_competency_statistics.mustache
@@ -45,19 +45,13 @@
 {{#competencycount}}
 <div data-region="coursecompetencystatistics" class="well">
     {{#canbegradedincourse}}
-    <div class="clearfix">
-        <div class="span6">
-            <div class="progresstext">
+        {{< tool_lp/progress_bar}}
+            {{$progresstext}}
                 {{#str}}xcompetenciesproficientoutofyincourse, tool_lp, { "x": "{{proficientcompetencycount}}", "y": "{{competencycount}}" } {{/str}}
-            </div>
-        </div>
-        <div class="span6">
-            <span class="pull-right label label-info">{{proficientcompetencypercentageformatted}} %</span>
-            <div class="progress">
-                <div class="bar" style="width: {{proficientcompetencypercentage}}%;"></div>
-            </div>
-        </div>
-    </div>
+            {{/progresstext}}
+            {{$percentage}}{{proficientcompetencypercentage}}{{/percentage}}
+            {{$percentlabel}}{{proficientcompetencypercentageformatted}}&nbsp;%{{/percentlabel}}
+        {{/tool_lp/progress_bar}}
     {{/canbegradedincourse}}
     {{#canmanagecoursecompetencies}}
     {{#leastproficientcount}}

diff --git a/admin/tool/lp/templates/plan_page.mustache b/admin/tool/lp/templates/plan_page.mustache
index 8bf2019..20eb2bb 100644 (file)
--- a/admin/tool/lp/templates/plan_page.mustache
+++ b/admin/tool/lp/templates/plan_page.mustache
@@ -91,17 +91,13 @@
             {{/description}}
             <dt>{{#str}}progress, tool_lp{{/str}}</dt>
             <dd>
-                <div class="span4">
-                    <div class="progresstext">
-                        {{#str}}xcompetenciesproficientoutofy, tool_lp, { "x": "{{proficientcompetencycount}}", "y": "{{competencycount}}" }{{/str}}
-                    </div>
-                </div>
-                <div class="span4">
-                    <span class="pull-right label label-info">{{proficientcompetencypercentageformatted}} %</span>
-                    <div class="progress">
-                        <div class="bar" style="width: {{proficientcompetencypercentage}}%;"></div>
-                    </div>
-                </div>
+            {{< tool_lp/progress_bar}}
+                {{$progresstext}}
+                    {{#str}}xcompetenciesproficientoutofy, tool_lp, { "x": "{{proficientcompetencycount}}", "y": "{{competencycount}}" }{{/str}}
+                {{/progresstext}}
+                {{$percentage}}{{proficientcompetencypercentage}}{{/percentage}}
+                {{$percentlabel}}{{proficientcompetencypercentageformatted}}&nbsp;%{{/percentlabel}}
+            {{/tool_lp/progress_bar}}
             </dd>
         </dl>
     </div>

diff --git a/admin/tool/lp/templates/progress_bar.mustache b/admin/tool/lp/templates/progress_bar.mustache
new file mode 100644 (file)
index 0000000..118f761
--- /dev/null
+++ b/admin/tool/lp/templates/progress_bar.mustache
@@ -0,0 +1,57 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    @template tool_lp/progress_bar
+
+    Moodle progress bar template for tool_lp.
+
+    The purpose of this template is to render a progress bar with a brief description.
+    Inherits core/columns-1to2.
+
+    Classes required for JS:
+    * none
+
+    Data attributes required for JS:
+    * none
+
+    Context variables required for this template:
+    * progresstextvalue A brief text that describes the progress bar.
+    * percentagevalue The numeric value for the progress bar's percentage.
+    * percentlabelvalue The progress bar's label that shows the percentage value.
+
+    Example context (json):
+    {
+        "progresstextvalue": "Progress:",
+        "percentagevalue": "50",
+        "percentlabelvalue": "50.00 %"
+    }
+
+}}
+<div class="row-fluid rtl-compatible">
+    <div class="span4">
+        <div class="progresstext">
+            {{$progresstext}}{{progresstextvalue}}{{/progresstext}}
+        </div>
+    </div>
+    <div class="span8">
+        <div class="progress">
+            <div class="bar" style="width: {{$percentage}}{{percentagevalue}}{{/percentage}}%;" role="progressbar" aria-valuenow="{{$percentage}}{{percentagevalue}}{{/percentage}}" aria-valuemin="0" aria-valuemax="100">
+                {{$percentlabel}}{{percentlabelvalue}}{{/percentlabel}}
+            </div>
+        </div>
+    </div>
+</div>

diff --git a/admin/tool/lp/templates/template_statistics.mustache b/admin/tool/lp/templates/template_statistics.mustache
index 0a8bdae..91b4512 100644 (file)
--- a/admin/tool/lp/templates/template_statistics.mustache
+++ b/admin/tool/lp/templates/template_statistics.mustache
@@ -46,50 +46,30 @@
 }}
 {{#competencycount}}
 <div data-region="templatestatistics" class="well">
-    <div class="clearfix">
-        <div class="span4">
-            <div class="progresstext">
-                {{#str}}xcompetencieslinkedoutofy, tool_lp, { "x": "{{linkedcompetencycount}}", "y": "{{competencycount}}" } {{/str}}
-            </div>
-        </div>
-        <div class="span6">
-            <span class="pull-right label label-info">{{linkedcompetencypercentageformatted}} %</span>
-            <div class="progress">
-                <div class="bar" style="width: {{linkedcompetencypercentage}}%;"></div>
-            </div>
-        </div>
-    </div>
+    {{< tool_lp/progress_bar}}
+        {{$progresstext}}
+            {{#str}}xcompetencieslinkedoutofy, tool_lp, { "x": "{{linkedcompetencycount}}", "y": "{{competencycount}}" } {{/str}}
+        {{/progresstext}}
+        {{$percentage}}{{linkedcompetencypercentage}}{{/percentage}}
+        {{$percentlabel}}{{linkedcompetencypercentageformatted}}&nbsp;%{{/percentlabel}}
+    {{/tool_lp/progress_bar}}
     {{#plancount}}
-    <div class="clearfix">
-        <div class="span4">
-            <div class="progresstext">
+        {{< tool_lp/progress_bar}}
+            {{$progresstext}}
                 {{#str}}xplanscompletedoutofy, tool_lp, { "x": "{{completedplancount}}", "y": "{{plancount}}" } {{/str}}
-            </div>
-        </div>
-        <div class="span6">
-            <span class="pull-right label label-info">{{completedplanpercentageformatted}} %</span>
-            <div class="progress">
-                <div class="bar" style="width: {{completedplanpercentage}}%;">
-
-                </div>
-            </div>
-        </div>
-    </div>
+            {{/progresstext}}
+            {{$percentage}}{{completedplanpercentage}}{{/percentage}}
+            {{$percentlabel}}{{completedplanpercentageformatted}}&nbsp;%{{/percentlabel}}
+        {{/tool_lp/progress_bar}}
     {{/plancount}}
     {{#usercompetencyplancount}}
-    <div  class="clearfix">
-        <div class="span4">
-            <div class="progresstext">
+        {{< tool_lp/progress_bar}}
+            {{$progresstext}}
                 {{#str}}averageproficiencyrate, tool_lp, {{proficientusercompetencyplanpercentageformatted}} {{/str}}
-            </div>
-        </div>
-        <div class="span6">
-            <span class="pull-right label label-info">{{proficientusercompetencyplanpercentageformatted}} %</span>
-            <div class="progress">
-                <div class="bar" style="width: {{proficientusercompetencyplanpercentage}}%;"></div>
-            </div>
-        </div>
-    </div>
+            {{/progresstext}}
+            {{$percentage}}{{proficientusercompetencyplanpercentage}}{{/percentage}}
+            {{$percentlabel}}{{proficientusercompetencyplanpercentageformatted}}&nbsp;%{{/percentlabel}}
+        {{/tool_lp/progress_bar}}
     {{/usercompetencyplancount}}
     {{#leastproficientcount}}
     <div>