Merge branch 'MDL-78204-master' of https://github.com/roland04/moodle

admin/tool/componentlibrary/content/moodle/components/showmore.md

@@ -0,0 +1,40 @@
+---
+layout: docs
+title: "Show more"
+date: 2023-06-12T00:00:00+01:00
+draft: false
+weight: 70
+tags:
+- MDL-78204
+- 4.3
+---
+
+## How to use
+
+The show more component is used to show and hide content. It is useful for showing a preview of content and then allowing the user to expand it to see more.
+
+The parameters for the template context are:
+* collapsedcontent: The content to show when collapsed.
+* expandedcontent: The content to show when expanded.
+* extraclasses: Any extra classes added to the showmore outer container.
+* buttonextraclasses: Any extra classes added to the button.
+* collapsedextraclasses: Any extra classes added to the collapsed content container.
+* expandedextraclasses: Any extra classes added to the expanded content container.
+
+## Example
+
+{{< mustache template="core/showmore" >}}
+    {
+        "collapsedcontent": "Hello...",
+        "expandedcontent": "Hello<br>Is it me you're looking for? I can see it in your eyes",
+        "extraclasses": "rounded p-2 border",
+        "buttonextraclasses": "font-weight-bold"
+    }
+{{< /mustache >}}
+
+## Example used as a template block
+
+{{< mustache template="tool_componentlibrary/examples/showmore/example" >}}
+    {
+    }
+{{< /mustache >}}

admin/tool/componentlibrary/templates/examples/showmore/example.mustache

@@ -0,0 +1,37 @@
+{{!
+    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_componentlibrary/examples/showmore/example
+
+    Template for showmore element used as a block example
+
+    Example context (json):
+    {
+    }
+}}
+<div id="showmore-example">
+    <h1>Show more block</h1>
+    <p>This is a simple example using showmore template as a block.</p>
+    {{< core/showmore }}
+        {{$collapsedcontent}} Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem... {{/collapsedcontent}}
+        {{$expandedcontent}}
+            Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem suspendisse faucibus, nunc et pellentesque egestas, lacus ante convallis tellus, vitae iaculis lacus elit id tortor.
+            Sed augue ipsum, egestas nec, vestibulum et, malesuada adipiscing, dui. Sed cursus turpis vitae tortor. Praesent turpis. Proin viverra, ligula sit amet ultrices semper, ligula arcu
+            tristique sapien, a accumsan nisi mauris ac eros. Donec venenatis vulputate lorem. Vestibulum eu odio. Morbi nec metus. Vivamus euismod mauris. Vivamus elementum semper nisi.
+        {{/expandedcontent}}
+    {{/core/showmore }}
+</div>

availability/amd/src/availability_more.js

@@ -16,6 +16,8 @@
 /**
  * Show more action for availablity information.
  *
+ * @deprecated since 4.3 MDL-78204.
+ * @todo       MDL-78489 This will be deleted in Moodle 4.7.
  * @module     core_availability/availability_more
  * @copyright  2021 Bas Brands <bas@moodle.com>
  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later

availability/classes/output/availability_info.php

@@ -40,20 +40,13 @@ class availability_info implements renderable, templatable {
     /** @var core_availability_multiple_messages availabilitymessages the course format class */
     protected $availabilitymessages;
 
-    /** @var int counts number of conditions */
-    protected $count = 0;
-
-    /** @var int Maximum number of lines of availability info */
-    protected const MAXVISIBLE = 4;
-
     /**
      * Constructor.
      *
      * @param core_availability_multiple_messages $renderable the availability messages
      */
     public function __construct(core_availability_multiple_messages $renderable) {
         $this->availabilitymessages = $renderable;
-        $this->count = 0;
     }
 
     /**
@@ -68,10 +61,6 @@ public function export_for_template(\renderer_base $output): stdClass {
 
         $template->id = uniqid();
 
-        if ($this->count >= self::MAXVISIBLE) {
-            $template->showmorelink = true;
-        }
-
         return $template;
     }
 
@@ -82,12 +71,9 @@ public function export_for_template(\renderer_base $output): stdClass {
      */
     protected function get_item_base_template(): stdClass {
         return (object)[
-            'hidden' => $this->count > self::MAXVISIBLE,
-            'abbreviate' => $this->count === self::MAXVISIBLE,
             'id' => false,
             'items' => [],
             'hasitems' => false,
-            'showmorelink' => false,
         ];
     }
 
@@ -101,15 +87,9 @@ protected function get_item_template(core_availability_multiple_messages $availa
 
         $template = $this->get_item_base_template();
 
-        $template->header = get_string(
-            'list_' . ($availability->root ? 'root_' : '') .
-                ($availability->andoperator ? 'and' : 'or') .
-                ($availability->treehidden ? '_hidden' : ''),
-            'availability'
-        );
+        $template->header = $this->get_item_header($availability);
 
         foreach ($availability->items as $item) {
-            $this->count++;
             if (is_string($item)) {
                 $simple_item = $this->get_item_base_template();
                 $simple_item->header = $item;
@@ -123,4 +103,20 @@ protected function get_item_template(core_availability_multiple_messages $availa
 
         return $template;
     }
+
+    /**
+     * Get the item header.
+     * Depending on availability configuration this will return a string from a combined string identifier.
+     * For example: list_root_and_hidden, list_and, list_root_or_hidden, list_root_or, etc.
+     *
+     * @param core_availability_multiple_messages $availability the availability messages
+     * @return string the item header
+     */
+    protected function get_item_header(core_availability_multiple_messages $availability): string {
+        $stridentifier = 'list_' . ($availability->root ? 'root_' : '') .
+            ($availability->andoperator ? 'and' : 'or') .
+            ($availability->treehidden ? '_hidden' : '');
+
+        return get_string($stridentifier, 'availability');
+    }
 }

availability/condition/completion/tests/behat/conditional_bug.feature

@@ -44,6 +44,7 @@ Feature: Confirm that conditions on completion no longer cause a bug
     And I click on "Activity completion" "button" in the "Add restriction..." "dialogue"
     And I set the field with xpath "//div[contains(concat(' ', normalize-space(@class), ' '), ' availability-item ')][preceding-sibling::div]//select[@name='cm']" to "Page2"
     And I press "Save and return to course"
+    And I click on "Show more" "button" in the "#section-1 .availabilityinfo" "css_element"
     Then I should see "Not available unless:" in the ".activity.glossary" "css_element"
     And I should see "The activity Page1 is marked complete" in the ".activity.glossary" "css_element"
     And I should see "The activity Page2 is marked complete" in the ".activity.glossary" "css_element"

availability/templates/availability_info.mustache

@@ -25,74 +25,36 @@
         "header": "Not available unless:",
         "items" : [
             {
-                "showmorelink": 0,
-                "abbreviate" : 0,
-                "hidden" : 0,
                 "hasitems": 0,
                 "header": "You belong to Green Group"
             },
             {
-                "showmorelink": 0,
-                "abbreviate" : 0,
-                "hidden" : 0,
                 "hasitems": 0,
                 "header": "You belong to Red Group"
             },
             {
-                "showmorelink": 0,
-                "abbreviate" : 1,
-                "hidden" : 0,
                 "hasitems": 0,
                 "header": "You belong to Orange Group"
             },
             {
-                "showmorelink": 0,
-                "abbreviate" : 0,
-                "hidden" : 1,
                 "hasitems": 0,
                 "header": "You belong to Pink Group"
             },
             {
-                "showmorelink": 0,
-                "abbreviate" : 0,
-                "hidden" : 1,
                 "hasitems": 0,
                 "header": "You belong to Red Group"
             }
         ],
-        "hasitems": 1,
-        "showmorelink": 1
+        "hasitems": 1
     }
 }}
 {{{header}}}
 {{#hasitems}}
 <ul {{#id}} id="availability-tree-{{id}}" {{/id}} data-region="availability-multiple">
     {{#items}}
-        <li class="{{#hidden}}d-none{{/hidden}}">
-            {{#abbreviate}}
-                <span class="d-none">
-                    {{> core_availability/availability_info }}
-                </span><span class="d-block">...</span>
-            {{/abbreviate}}
-            {{^abbreviate}}
-                {{> core_availability/availability_info }}
-            {{/abbreviate}}
+        <li>
+            {{> core_availability/availability_info }}
         </li>
     {{/items}}
-    {{#showmorelink}}
-        <li data-action="showmore" class="d-block showmore">
-            <a role="button" aria-expanded="false" aria-controls="availability-tree-{{id}}" href="#" >
-                {{#str}}showmore, availability{{/str}}
-            </a>
-        </li>
-    {{/showmorelink}}
 </ul>
 {{/hasitems}}
-
-{{#showmorelink}}
-{{#js}}
-require(['core_availability/availability_more'], function(availabilityMore) {
-        availabilityMore.init();
-});
-{{/js}}
-{{/showmorelink}}

availability/tests/behat/display_availability.feature

@@ -73,13 +73,17 @@ Feature: display_availability
     And I should see "2013" in the "#section-1 .availabilityinfo" "css_element"
     And I should see "2013" in the "#section-1 .availabilityinfo" "css_element"
     And "li" "css_element" should not exist in the "#section-1 .availabilityinfo" "css_element"
+    And "Show more" "button" should not exist in the "#section-1 .availabilityinfo" "css_element"
 
     # Page 2 should show in list format.
     And "li" "css_element" should exist in the "#section-2 .availabilityinfo" "css_element"
     And I should see "Not available unless:" in the "#section-2 .availabilityinfo" "css_element"
     And I should see "It is before" in the "#section-2 .availabilityinfo" "css_element"
     And I should see "hidden otherwise" in the "#section-2 .availabilityinfo" "css_element"
+    And I click on "Show more" "button" in the "Page 2" "activity"
     And I should see "Email address" in the "#section-2 .availabilityinfo" "css_element"
+    And I click on "Show less" "button" in the "#section-2 .availabilityinfo" "css_element"
+    And I should not see "Email address" in the "#section-2 .availabilityinfo" "css_element"
 
     # Page 3 should not have available info.
     And "#section-3 .availabilityinfo" "css_element" should not exist
@@ -114,6 +118,11 @@ Feature: display_availability
     And I click on "Date" "button" in the "Add restriction..." "dialogue"
     And I set the field "direction" to "until"
     And I set the field "x[year]" to "2013"
+    And I press "Add restriction..."
+    And I click on "User profile" "button" in the "Add restriction..." "dialogue"
+    And I set the field "User profile field" to "Email address"
+    And I set the field "Value to compare against" to "email@example.com"
+    And I set the field "Method of comparison" to "is equal to"
     And I press "Save changes"
 
     # Section 2 is the same but hidden from students
@@ -130,7 +139,7 @@ Feature: display_availability
     And I am on "Course 1" course homepage
 
     # Check display
-    Then I should see "Available until" in the "#section-1 .availabilityinfo" "css_element"
+    Then I should see "Not available unless" in the "#section-1 .availabilityinfo" "css_element"
     And I should see "Available until" in the "#section-2 .availabilityinfo" "css_element"
     And I should see "hidden otherwise" in the "#section-2 .availabilityinfo" "css_element"
 
@@ -144,7 +153,11 @@ Feature: display_availability
 
     # Section 1 should be visible and show info.
     And I should see "Topic 1" in the "region-main" "region"
-    And I should see "Available until" in the "#section-1 .availabilityinfo" "css_element"
+    And I should see "Not available unless" in the "#section-1 .availabilityinfo" "css_element"
+    And I click on "Show more" "button" in the "#section-1 .availabilityinfo" "css_element"
+    And I should see "Email address" in the "#section-1 .availabilityinfo" "css_element"
+    And I click on "Show less" "button" in the "#section-1 .availabilityinfo" "css_element"
+    And I should not see "Email address" in the "#section-1 .availabilityinfo" "css_element"
 
     # Section 2 should not be available at all
     And I should not see "Topic 2" in the "region-main" "region"