Lazy-load list of textboxes when opening textbox form (Bug 1393734).

The query to load other textboxes when displaying textbox config. forms
is very heavy in a large instance of Mahara. This patch postpones the
listing of other textboxes in the textbox config. form, until the link
to display them is clicked.
This enables the textbox config. form to load and display quickly.

TODO: optimise loading speed of list of textboxes. This process is still
as slow as it was before - all this patch does is defer it until it's
actually required!

Change-Id: I92c77e22753882a2b9ed5be3738b8d26b7f5709d
Signed-off-by: Mike Kelly <m.f.kelly@arts.ac.uk>

htdocs/artefact/internal/blocktype/textbox/lib.php

@@ -106,6 +106,7 @@ class PluginBlocktypeTextbox extends PluginBlocktype {
             'returnfields'     => array('id', 'title', 'description', 'tags', 'license', 'licensor', 'licensorurl', 'safedescription', 'safetags', 'safelicense', 'editable', 'attachments'),
             'artefacttypes'    => array('html'),
             'template'         => 'artefact:internal:html-artefactchooser-element.tpl',
+            'lazyload'         => true,
         );
     }
 
@@ -217,6 +218,12 @@ function updateTextContent(a) {
 }
 connect('chooseartefactlink', 'onclick', function(e) {
     e.stop();
+    // if the artefact chooser is hidden, use paginator p to populate it, then toggle its visibility
+    if (hasElementClass(getElement('instconf_artefactid_container'), 'hidden')) {
+        var queryData = [];
+        queryData.extradata = serializeJSON(p.extraData);
+        p.sendQuery(queryData, true);
+    }
     toggleElementClass('hidden', 'instconf_artefactid_container');
     toggleElementClass('hidden', 'instconf_managenotes_container');
 });

htdocs/lib/form/elements/artefactchooser.php

@@ -44,6 +44,7 @@ function pieform_element_artefactchooser(Pieform $form, $element) {
     $smarty->assign('browseurl', $baseurl);
     $smarty->assign('searchurl', $baseurl . '&s=1');
     $smarty->assign('searchable', !empty($element['search']));
+    $smarty->assign('lazyload', !empty($element['lazyload']));
 
     return $smarty->fetch('form/artefactchooser.tpl');
 }
@@ -151,17 +152,25 @@ var browseTabCurrent = true;
 if (ul) {
     forEach(getElementsByTagAndClassName('a', null, ul), function(a) {
         p.rewritePaginatorLink(a);
+        // Need to make sure the accessible hidden <span> is present
+        // If loaded via ajax it may not be present
+        if (a.childNodes.length < 2) {
+            jQuery(a).append('<span class="accessible-hidden">(' + get_string_ajax('tab', 'mahara') + ')</span>');
+        }
+
         if (!doneBrowse) {
+            browseA = a;
+            jQuery(browseA).find('.accessible-hidden').html('(' + get_string_ajax('tab', 'mahara') + ' ' + get_string_ajax('selected', 'mahara') + ')');
             doneBrowse = true;
 
-            browseA = a;
             // Hide the search form
             connect(a, 'onclick', function(e) {
                 hideElement('artefactchooser-searchform');
                 removeElementClass(searchA.parentNode, 'current');
-                getFirstElementByTagAndClassName(searchA, null, 'accessible-hidden').innerHTML = '(' + get_string('tab') + ')';
+                jQuery(browseA).find('.accessible-hidden').html('(' + get_string_ajax('tab', 'mahara') + ' ' + get_string_ajax('selected', 'mahara') + ')');
+                jQuery(searchA).find('.accessible-hidden').html('(' + get_string_ajax('tab', 'mahara') + ')');
                 addElementClass(browseA.parentNode, 'current');
-                getFirstElementByTagAndClassName(browseA, null, 'accessible-hidden').innerHTML = '(' + get_string('tab') + get_string('selected') + ')';
+
                 browseA.blur();
                 $('artefactchooser-searchfield').value = ''; // forget the search for now, easier than making the tabs remember it
                 if (!browseTabCurrent) {
@@ -178,6 +187,8 @@ if (ul) {
             connect(a, 'onclick', function(e) {
                 showElement('artefactchooser-searchform');
                 removeElementClass(browseA.parentNode, 'current');
+                jQuery(searchA).find('.accessible-hidden').html('(' + get_string_ajax('tab', 'mahara') + ' ' + get_string_ajax('selected', 'mahara') + ')');
+                jQuery(browseA).find('.accessible-hidden').html('(' + get_string_ajax('tab', 'mahara') + ')');
                 addElementClass(searchA.parentNode, 'current');
 
                 connect('artefactchooser-searchfield', 'onkeypress', function(e) {

htdocs/lib/view.php

@@ -3089,6 +3089,35 @@ class View {
      */
     public static function build_artefactchooser_data($data, $group=null, $institution=null) {
         global $USER;
+        // If lazyload is set, immediately return an empty resultset
+        // In the case of forms using lazyload, lazyload is set to false by subsequent requests via ajax,
+        // for example in views/artefactchooser.json.php, at which time the full resultset is returned.
+        if ($data['lazyload']) {
+            $result =  '';
+            $pagination = build_pagination(array(
+                'id' => $data['name'] . '_pagination',
+                'class' => 'ac-pagination',
+                'url' => View::make_base_url() . (param_boolean('s') ? '&s=1' : ''),
+                'count' => 0,
+                'limit' => 0,
+                'offset' => 0,
+                'datatable' => $data['name'] . '_data',
+                'jsonscript' => 'view/artefactchooser.json.php',
+                'firsttext' => '',
+                'previoustext' => '',
+                'nexttext' => '',
+                'lasttext' => '',
+                'numbersincludefirstlast' => false,
+                'extradata' => array(
+                    'value'       => $data['defaultvalue'],
+                    'blocktype'   => $data['blocktype'],
+                    'group'       => $group,
+                    'institution' => $institution,
+                ),
+            ));
+            return array($result, $pagination, 0, 0, array());
+        }
+
         $search = '';
         if (!empty($data['search']) && param_boolean('s')) {
             $search = param_variable('search', '');

htdocs/theme/raw/templates/form/artefactchooser.tpl

@@ -10,7 +10,7 @@
             <input type="hidden" name="s" value="1">
             <input type="submit" class="submit" id="artefactchooser-searchsubmit" name="action_acsearch_id_{$blockinstance}" value="{str tag=go}" tabindex="42">
         </div>
-        {if !$artefacts}
+        {if !$artefacts && !$lazyload}
         <p class="noartefacts">{str tag=noartefactstochoosefrom section=view}</p>
         {/if}
         <table id="{$datatable}" class="artefactchooser-data">

htdocs/view/artefactchooser.json.php

@@ -22,6 +22,7 @@ $data = pieform_element_artefactchooser_set_attributes(
     call_static_method(generate_class_name('blocktype', $extradata->blocktype), 'artefactchooser_element', $extradata->value)
 );
 $data['offset'] = param_integer('offset', 0);
+$data['lazyload'] = false;
 list($html, $pagination, $count, $offset, $artefactdata) = View::build_artefactchooser_data($data, $extradata->group, $extradata->institution);
 
 json_reply(false, array(