diff --git a/mod/folder/amd/build/folder.min.js b/mod/folder/amd/build/folder.min.js
new file mode 100644
index 00000000000..688284d3678
--- /dev/null
+++ b/mod/folder/amd/build/folder.min.js
@@ -0,0 +1,10 @@
+define("mod_folder/folder",["exports","core/yui"],(function(_exports,_yui){var obj;
+/**
+ * Javascript helper function for Folder module
+ *
+ * @module mod_folder/folder
+ * @copyright 2009 Petr Skoda {@link http://skodak.org}
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.initTree=void 0,_yui=(obj=_yui)&&obj.__esModule?obj:{default:obj};_exports.initTree=(id,expandAll)=>{_yui.default.use("yui2-treeview","node-event-simulate",(function(Y){var tree=new Y.YUI2.widget.TreeView(id);tree.subscribe("clickEvent",(function(){return!1})),tree.subscribe("enterKeyPressed",(function(node){return Y.one(node.getContentEl()).one("a").simulate("click"),!1})),expandAll?tree.expandAll():tree.getRoot().children[0].expand(),tree.render()}))}}));
+
+//# sourceMappingURL=folder.min.js.map
\ No newline at end of file
diff --git a/mod/folder/amd/build/folder.min.js.map b/mod/folder/amd/build/folder.min.js.map
new file mode 100644
index 00000000000..54bc89a30ee
--- /dev/null
+++ b/mod/folder/amd/build/folder.min.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"folder.min.js","sources":["../src/folder.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/**\n * Javascript helper function for Folder module\n *\n * @module mod_folder/folder\n * @copyright 2009 Petr Skoda {@link http://skodak.org}\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nimport YUI from 'core/yui';\n\nexport const initTree = (id, expandAll) => {\n YUI.use('yui2-treeview', 'node-event-simulate', function(Y) {\n var tree = new Y.YUI2.widget.TreeView(id);\n\n tree.subscribe(\"clickEvent\", function() {\n // we want normal clicking which redirects to url\n return false;\n });\n\n tree.subscribe(\"enterKeyPressed\", function(node) {\n // We want keyboard activation to trigger a click on the first link.\n Y.one(node.getContentEl()).one('a').simulate('click');\n return false;\n });\n\n if (expandAll) {\n tree.expandAll();\n } else {\n // Else just expand the top node.\n tree.getRoot().children[0].expand();\n }\n\n tree.render();\n });\n};\n"],"names":["id","expandAll","use","Y","tree","YUI2","widget","TreeView","subscribe","node","one","getContentEl","simulate","getRoot","children","expand","render"],"mappings":";;;;;;;0JAyBwB,CAACA,GAAIC,0BACrBC,IAAI,gBAAiB,uBAAuB,SAASC,OACjDC,KAAO,IAAID,EAAEE,KAAKC,OAAOC,SAASP,IAEtCI,KAAKI,UAAU,cAAc,kBAElB,KAGXJ,KAAKI,UAAU,mBAAmB,SAASC,aAEvCN,EAAEO,IAAID,KAAKE,gBAAgBD,IAAI,KAAKE,SAAS,UACtC,KAGPX,UACAG,KAAKH,YAGLG,KAAKS,UAAUC,SAAS,GAAGC,SAG/BX,KAAKY"}
\ No newline at end of file
diff --git a/mod/folder/module.js b/mod/folder/amd/src/folder.js
similarity index 84%
rename from mod/folder/module.js
rename to mod/folder/amd/src/folder.js
index 32e4514051f..9352463ddae 100644
--- a/mod/folder/module.js
+++ b/mod/folder/amd/src/folder.js
@@ -16,19 +16,18 @@
/**
* Javascript helper function for Folder module
*
- * @package mod
- * @subpackage folder
+ * @module mod_folder/folder
* @copyright 2009 Petr Skoda {@link http://skodak.org}
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
-M.mod_folder = {};
+import YUI from 'core/yui';
-M.mod_folder.init_tree = function(Y, id, expand_all) {
- Y.use('yui2-treeview', 'node-event-simulate', function(Y) {
+export const initTree = (id, expandAll) => {
+ YUI.use('yui2-treeview', 'node-event-simulate', function(Y) {
var tree = new Y.YUI2.widget.TreeView(id);
- tree.subscribe("clickEvent", function(node, event) {
+ tree.subscribe("clickEvent", function() {
// we want normal clicking which redirects to url
return false;
});
@@ -39,7 +38,7 @@ M.mod_folder.init_tree = function(Y, id, expand_all) {
return false;
});
- if (expand_all) {
+ if (expandAll) {
tree.expandAll();
} else {
// Else just expand the top node.
@@ -48,4 +47,4 @@ M.mod_folder.init_tree = function(Y, id, expand_all) {
tree.render();
});
-}
+};
diff --git a/mod/folder/renderer.php b/mod/folder/renderer.php
index e6153bf8169..b53a932b66b 100644
--- a/mod/folder/renderer.php
+++ b/mod/folder/renderer.php
@@ -35,7 +35,8 @@ class mod_folder_renderer extends plugin_renderer_base {
* @return string
*/
public function display_folder(stdClass $folder) {
- $output = '';
+ static $treecounter = 0;
+
$folderinstances = get_fast_modinfo($folder->course)->get_instances_of('folder');
if (!isset($folderinstances[$folder->id]) ||
!($cm = $folderinstances[$folder->id]) ||
@@ -43,43 +44,37 @@ class mod_folder_renderer extends plugin_renderer_base {
// Some error in parameters.
// Don't throw any errors in renderer, just return empty string.
// Capability to view module must be checked before calling renderer.
- return $output;
+ return '';
}
+ $data = [];
if (trim($folder->intro)) {
if ($folder->display == FOLDER_DISPLAY_INLINE && $cm->showdescription) {
// for "display inline" do not filter, filters run at display time.
- $output .= format_module_intro('folder', $folder, $cm->id, false);
+ $data['intro'] = format_module_intro('folder', $folder, $cm->id, false);
}
}
- $buttons = '';
+ $buttons = [];
// Display the "Edit" button if current user can edit folder contents.
// Do not display it on the course page for the teachers because there
- // is an "Edit settings" button right next to it with the same functionality.
+ // is an "Edit settings" option in the action menu with the same functionality.
$canmanagefolderfiles = has_capability('mod/folder:managefiles', $context);
$canmanagecourseactivities = has_capability('moodle/course:manageactivities', $context);
if ($canmanagefolderfiles && ($folder->display != FOLDER_DISPLAY_INLINE || !$canmanagecourseactivities)) {
$editbutton = new single_button(new moodle_url('/mod/folder/edit.php', ['id' => $cm->id]),
get_string('edit'), 'post', single_button::BUTTON_PRIMARY);
$editbutton->class = 'navitem';
- $buttons .= $this->render($editbutton);
+ $data['edit_button'] = $editbutton->export_for_template($this->output);
+ $data['hasbuttons'] = true;
}
- // Do not append the edit button on the course page.
$downloadable = folder_archive_available($folder, $cm);
if ($downloadable) {
$downloadbutton = new single_button(new moodle_url('/mod/folder/download_folder.php', ['id' => $cm->id]),
get_string('downloadfolder', 'folder'), 'get');
$downloadbutton->class = 'navitem ml-auto';
- $buttons .= $this->render($downloadbutton);
- }
-
- if ($buttons) {
- $output .= $this->output->container_start("container-fluid tertiary-navigation");
- $output .= $this->output->container_start("row");
- $output .= $buttons;
- $output .= $this->output->container_end();
- $output .= $this->output->container_end();
+ $data['download_button'] = $downloadbutton->export_for_template($this->output);
+ $data['hasbuttons'] = true;
}
$foldertree = new folder_tree($folder, $cm);
@@ -87,35 +82,27 @@ class mod_folder_renderer extends plugin_renderer_base {
// Display module name as the name of the root directory.
$foldertree->dir['dirname'] = $cm->get_formatted_name(array('escape' => false));
}
- $output .= $this->output->container_start("box generalbox pt-0 pb-3 foldertree");
- $output .= $this->render($foldertree);
- $output .= $this->output->container_end();
- return $output;
- }
+ $data['id'] = 'folder_tree'. ($treecounter++);
+ $data['showexpanded'] = !empty($foldertree->folder->showexpanded);
+ $data['dir'] = $this->renderable_tree_elements($foldertree, ['files' => [], 'subdirs' => [$foldertree->dir]]);
- public function render_folder_tree(folder_tree $tree) {
- static $treecounter = 0;
-
- $content = '';
- $id = 'folder_tree'. ($treecounter++);
- $content .= '
';
- $content .= $this->htmllize_tree($tree, array('files' => array(), 'subdirs' => array($tree->dir)));
- $content .= '
';
- $showexpanded = true;
- if (empty($tree->folder->showexpanded)) {
- $showexpanded = false;
- }
- $this->page->requires->js_init_call('M.mod_folder.init_tree', array($id, $showexpanded));
- return $content;
+ return $this->render_from_template('mod_folder/folder', $data);
}
/**
* Internal function - creates htmls structure suitable for YUI tree.
+ *
+ * @deprecated since Moodle 4.3
*/
protected function htmllize_tree($tree, $dir) {
global $CFG;
+ debugging(
+ 'Method htmllize_tree() is deprecated. Please use renderable_tree_elements instead',
+ DEBUG_DEVELOPER
+ );
+
if (empty($dir['subdirs']) and empty($dir['files'])) {
return '';
}
@@ -123,14 +110,14 @@ class mod_folder_renderer extends plugin_renderer_base {
foreach ($dir['subdirs'] as $subdir) {
$image = $this->output->pix_icon(file_folder_icon(), $subdir['dirname'], 'moodle');
$filename = html_writer::tag('span', $image, array('class' => 'fp-icon')).
- html_writer::tag('span', s($subdir['dirname']), array('class' => 'fp-filename'));
+ html_writer::tag('span', s($subdir['dirname']), array('class' => 'fp-filename'));
$filename = html_writer::tag('div', $filename, array('class' => 'fp-filename-icon'));
$result .= html_writer::tag('li', $filename. $this->htmllize_tree($tree, $subdir));
}
foreach ($dir['files'] as $file) {
$filename = $file->get_filename();
$url = moodle_url::make_pluginfile_url($file->get_contextid(), $file->get_component(),
- $file->get_filearea(), $file->get_itemid(), $file->get_filepath(), $filename, false);
+ $file->get_filearea(), $file->get_itemid(), $file->get_filepath(), $filename, false);
$filenamedisplay = clean_filename($filename);
if (file_extension_in_typegroup($filename, 'web_image')) {
$image = $url->out(false, array('preview' => 'tinyicon', 'oid' => $file->get_timemodified()));
@@ -139,7 +126,7 @@ class mod_folder_renderer extends plugin_renderer_base {
$image = $this->output->pix_icon(file_file_icon($file), $filenamedisplay, 'moodle');
}
$filename = html_writer::tag('span', $image, array('class' => 'fp-icon')).
- html_writer::tag('span', $filenamedisplay, array('class' => 'fp-filename'));
+ html_writer::tag('span', $filenamedisplay, array('class' => 'fp-filename'));
$urlparams = null;
if ($tree->folder->forcedownload) {
$urlparams = ['forcedownload' => 1];
@@ -154,6 +141,57 @@ class mod_folder_renderer extends plugin_renderer_base {
return $result;
}
+
+ /**
+ * Internal function - Creates elements structure suitable for mod_folder/folder template.
+ *
+ * @param folder_tree $tree The folder tree to work with.
+ * @param array $dir The subdir and files structure to convert into a tree.
+ * @return array The structure to be rendered by mod_folder/folder template.
+ */
+ protected function renderable_tree_elements(folder_tree $tree, array $dir): array {
+ if (empty($dir['subdirs']) && empty($dir['files'])) {
+ return [];
+ }
+ $elements = [];
+ foreach ($dir['subdirs'] as $subdir) {
+ $htmllize = $this->renderable_tree_elements($tree, $subdir);
+ $image = $this->output->pix_icon(file_folder_icon(), $subdir['dirname'], 'moodle');
+ $elements[] = [
+ 'name' => $subdir['dirname'],
+ 'icon' => $image,
+ 'subdirs' => $htmllize,
+ 'hassubdirs' => !empty($htmllize),
+ ];
+ }
+ foreach ($dir['files'] as $file) {
+ $filename = $file->get_filename();
+ $filenamedisplay = clean_filename($filename);
+
+ $url = moodle_url::make_pluginfile_url($file->get_contextid(), $file->get_component(),
+ $file->get_filearea(), $file->get_itemid(), $file->get_filepath(), $filename, false);
+ if (file_extension_in_typegroup($filename, 'web_image')) {
+ $image = $url->out(false, ['preview' => 'tinyicon', 'oid' => $file->get_timemodified()]);
+ $image = html_writer::empty_tag('img', ['src' => $image]);
+ } else {
+ $image = $this->output->pix_icon(file_file_icon($file), $filenamedisplay, 'moodle');
+ }
+
+ if ($tree->folder->forcedownload) {
+ $url->param('forcedownload', 1);
+ }
+
+ $elements[] = [
+ 'name' => $filenamedisplay,
+ 'icon' => $image,
+ 'url' => $url,
+ 'subdirs' => null,
+ 'hassubdirs' => false,
+ ];
+ }
+
+ return $elements;
+ }
}
class folder_tree implements renderable {
diff --git a/mod/folder/templates/folder.mustache b/mod/folder/templates/folder.mustache
new file mode 100644
index 00000000000..d846885e56f
--- /dev/null
+++ b/mod/folder/templates/folder.mustache
@@ -0,0 +1,102 @@
+{{!
+ 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 .
+}}
+{{!
+ @template mod_folder/folder
+
+ Template for displaying folder resource.
+
+ Classes required for JS:
+ * none
+
+ Data attributes required for JS:
+ * none
+
+ Example context (json):
+ {
+ "id": 42,
+ "showexpanded": true,
+ "buttons": {
+ "edit_button": {
+ "id": "edit_button",
+ "label": "Edit",
+ "url": "/mod/folder/edit.php",
+ "classes": "navitem"
+ },
+ "download_button": {
+ "id": "download_button",
+ "label": "Download",
+ "url": "/mod/folder/download.php",
+ "classes": "navitem"
+ }
+ },
+ "dir": [
+ {
+ "name": "Folder",
+ "icon": "
",
+ "hassubdirs": true,
+ "subdirs": [
+ {
+ "name": "File1",
+ "icon": "
",
+ "hassubdirs": false,
+ "subdirs": null
+ }
+ ]
+ },
+ {
+ "name": "File2",
+ "icon": "
",
+ "hassubdirs": false,
+ "subdirs": null
+ }
+ ]
+ }
+}}
+
+
+ {{{intro}}}
+ {{#hasbuttons}}
+
+
+ {{#edit_button}}
+ {{>core/single_button}}
+ {{/edit_button}}
+ {{#download_button}}
+ {{>core/single_button}}
+ {{/download_button}}
+
+
+ {{/hasbuttons}}
+
+
+ {{#dir}}
+
+ -
+ {{>mod_folder/tree}}
+
+
+ {{/dir}}
+
+
+
+
+{{#js}}
+ // Init tree JS.
+ require(['mod_folder/folder'], function(Folder) {
+ Folder.initTree('{{{id}}}', '{{{showexpanded}}}');
+ });
+{{/js}}
diff --git a/mod/folder/templates/tree.mustache b/mod/folder/templates/tree.mustache
new file mode 100644
index 00000000000..0cf307fa9d6
--- /dev/null
+++ b/mod/folder/templates/tree.mustache
@@ -0,0 +1,65 @@
+{{!
+ 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 .
+}}
+{{!
+ @template mod_folder/tree
+
+ Template for displaying a folder content subdirs and files tree.
+
+ Classes required for JS:
+ * none
+
+ Data attributes required for JS:
+ * none
+
+ Example context (json):
+ {
+ "name": "Folder",
+ "icon": "
",
+ "hassubdirs": true,
+ "subdirs": [
+ {
+ "name": "File1",
+ "icon": "
",
+ "hassubdirs": false,
+ "subdirs": null
+ }
+ ]
+ }
+}}
+
+
+
+ {{{icon}}}
+
+
+ {{#url}}
+ {{{name}}}
+ {{/url}}
+ {{^url}}
+ {{{name}}}
+ {{/url}}
+
+
+{{#hassubdirs}}
+
+ {{#subdirs}}
+ -
+ {{>mod_folder/tree}}
+
+ {{/subdirs}}
+
+{{/hassubdirs}}
diff --git a/mod/folder/upgrade.txt b/mod/folder/upgrade.txt
new file mode 100644
index 00000000000..6bdd5bc68a6
--- /dev/null
+++ b/mod/folder/upgrade.txt
@@ -0,0 +1,5 @@
+This files describes API changes in /mod/folder/*,
+information provided here is intended especially for developers.
+
+=== 4.3 ===
+ * htmllize_tree() method has been deprecated. Use renderable_tree_elements() instead.