4801a7fb840c4e38c3fc31a06200f0aa56000b16
[moodle.git] / contentbank / templates / bankcontent.mustache
1 {{!
2     This file is part of Moodle - http://moodle.org/
4     Moodle is free software: you can redistribute it and/or modify
5     it under the terms of the GNU General Public License as published by
6     the Free Software Foundation, either version 3 of the License, or
7     (at your option) any later version.
9     Moodle is distributed in the hope that it will be useful,
10     but WITHOUT ANY WARRANTY; without even the implied warranty of
11     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
12     GNU General Public License for more details.
14     You should have received a copy of the GNU General Public License
15     along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
16 }}
17 {{!
18     @template core_contentbank/bankcontent
20     Example context (json):
21     {
22         "contents": [
23             {
24                 "name": "Accordion.h5p",
25                 "title": "accordion.h5p",
26                 "timemodified": 1589792272,
27                 "size": "699.3KB",
28                 "bytes": 716126,
29                 "type": "Archive (H5P)",
30                 "link": "http://something/contentbank/contenttype/h5p/view.php?url=http://something/pluginfile.php/1/contentbank/public/accordion.h5p",
31                 "icon" : "http://something/theme/image.php/boost/core/1581597850/f/h5p-64"
32             },
33             {
34                 "name": "resume.pdf",
35                 "title": "resume",
36                 "timemodified": 1589792039,
37                 "size": "699.3KB",
38                 "bytes": 716126,
39                 "type": "Archive (PDF)",
40                 "icon": "http://something/theme/image.php/boost/core/1584597850/f/pdf-64"
41             }
42         ],
43         "tools": [
44             {
45                 "name": "Add",
46                 "dropdown": true,
47                 "link": "http://something/contentbank/edit.php?contextid=1",
48                 "contenttypes": [
49                     {
50                         "name": "H5P Interactive Content",
51                         "baseurl": "http://something/contentbank/edit.php?contextid=1&plugin=h5p",
52                         "types": [
53                             {
54                                 "typename": "H5P Interactive Content"
55                             },
56                             {
57                                 "typename": "Accordion",
58                                 "typeeditorparams": "library=Accordion-1.4",
59                                 "typeicon": "http://something/pluginfile.php/1/core_h5p/libraries/13/H5P.Accordion-1.4/icon.svg"
60                             }
61                         ]
62                     }
63                 ]
64             },
65             {
66                 "name": "Upload",
67                 "link": "http://something/contentbank/contenttype/h5p/view.php?url=http://something/pluginfile.php/1/contentbank/public/accordion.h5p",
68                 "icon" : "i/upload"
69             },
70             {
71                 "icon": "i/export"
72             }
73         ]
74     }
76 }}
77 <div class="content-bank-container {{#viewlist}}view-list{{/viewlist}} {{^viewlist}}view-grid{{/viewlist}}"
78 data-region="contentbank">
79     <div class="d-flex justify-content-between flex-column flex-sm-row">
80         <div class="cb-search-container mb-2">
81             {{>core_contentbank/bankcontent/search}}
82         </div>
83         <div class="cb-toolbar-container mb-2 d-flex">
84             {{>core_contentbank/bankcontent/toolbar}}
85         </div>
86     </div>
87     <div class="pb-3 border">
88         <div class="content-bank">
89             <div class="cb-navbar bg-light p-2 border-bottom">
90                 <div class="cb-navbar-breadbrumb">
91                     {{#pix}} i/folder {{/pix}}
92                 </div>
93                 <div class="cb-navbar-totalsearch d-none">
94                 </div>
95             </div>
96             <div class="cb-content-wrapper d-flex px-2" data-region="filearea">
97                 <div class="cb-heading bg-white">
98                     <div class="cb-file cb-column d-flex">
99                         <div class="title">{{#str}} contentname, contentbank {{/str}}</div>
100                         <button class="btn btn-sm cb-btnsort dir-none ml-auto" data-string="contentname" data-action="sortname"
101                             title="{{#str}} sortbyx, core, {{#str}} contentname, contentbank {{/str}} {{/str}}">
102                             <span class="default">{{#pix}} t/sort, core, {{#str}}sort, core {{/str}} {{/pix}}</span>
103                             <span class="desc">{{#pix}} t/sort_desc, core, {{#str}}desc, core{{/str}} {{/pix}}</span>
104                             <span class="asc">{{#pix}} t/sort_asc, core, {{#str}}asc, core{{/str}} {{/pix}}</span>
105                         </button>
106                     </div>
107                     <div class="cb-date cb-column d-flex">
108                         <div class="title">{{#str}} lastmodified, contentbank {{/str}}</div>
109                         <button class="btn btn-sm cb-btnsort dir-none ml-auto" data-string="lastmodified" data-action="sortdate"
110                         title="{{#str}} sortbyx, core, {{#str}} lastmodified, contentbank {{/str}} {{/str}}">
111                             <span class="default">{{#pix}} t/sort, core, {{#str}}sort, core {{/str}} {{/pix}}</span>
112                             <span class="desc">{{#pix}} t/sort_desc, core, {{#str}}desc, core{{/str}} {{/pix}}</span>
113                             <span class="asc">{{#pix}} t/sort_asc, core, {{#str}}asc, core{{/str}} {{/pix}}</span>
114                         </button>
115                     </div>
116                     <div class="cb-size cb-column d-flex">
117                         <div class="title">{{#str}} size, contentbank {{/str}}</div>
118                         <button class="btn btn-sm cb-btnsort dir-none ml-auto" data-string="size" data-action="sortsize"
119                         title="{{#str}} sortbyx, core, {{#str}} size, contentbank {{/str}} {{/str}}">
120                             <span class="default">{{#pix}} t/sort, core, {{#str}}sort, core {{/str}} {{/pix}}</span>
121                             <span class="desc">{{#pix}} t/sort_desc, core, {{#str}}desc, core{{/str}} {{/pix}}</span>
122                             <span class="asc">{{#pix}} t/sort_asc, core, {{#str}}asc, core{{/str}} {{/pix}}</span>
123                         </button>
124                     </div>
125                     <div class="cb-type cb-column d-flex last">
126                         <div class="title">{{#str}} type, contentbank {{/str}}</div>
127                         <button class="btn btn-sm cb-btnsort dir-none ml-auto" data-string="type" data-action="sorttype"
128                         title="{{#str}} sortbyx, core, {{#str}} size, contentbank {{/str}} {{/str}}">
129                             <span class="default">{{#pix}} t/sort, core, {{#str}}sort, core {{/str}} {{/pix}}</span>
130                             <span class="desc">{{#pix}} t/sort_desc, core, {{#str}}desc, core{{/str}} {{/pix}}</span>
131                             <span class="asc">{{#pix}} t/sort_asc, core, {{#str}}asc, core{{/str}} {{/pix}}</span>
132                         </button>
133                     </div>
134                 </div>
135             {{#contents}}
136                 <div class="cb-listitem"
137                     data-file="{{{ title }}}"
138                     data-name="{{{ name }}}"
139                     data-bytes="{{ bytes }}"
140                     data-timemodified="{{ timemodified }}"
141                     data-type="{{{ type }}}">
142                     <div class="cb-file cb-column position-relative">
143                         <div class="cb-thumbnail" role="img" aria-label="{{{ name }}}"
144                         style="background-image: url('{{{ icon }}}');">
145                         </div>
146                         <a href="{{{ link }}}" class="cb-link stretched-link" title="{{{ name }}}">
147                             <span class="cb-name word-break-all clamp-2" data-region="cb-content-name">
148                                 {{{ name }}}
149                             </span>
150                         </a>
151                     </div>
152                     <div class="cb-date cb-column small">
153                         {{#userdate}} {{ timemodified }}, {{#str}} strftimedatetimeshort, core_langconfig {{/str}} {{/userdate}}
154                     </div>
155                     <div class="cb-size cb-column small">
156                         {{ size }}
157                     </div>
158                     <div class="cb-type cb-column last small">
159                         {{{ type }}}
160                     </div>
161                 </div>
162             {{/contents}}
163             </div>
164         </div>
165     </div>
166 </div>