Bug 22660: (follow-up) Improve asset handling, add linting
[koha.git] / koha-tmpl / intranet-tmpl / prog / en / modules / tools / koha-news.tt
1 [% USE raw %]
2 [% USE Asset %]
3 [% USE Koha %]
4 [% USE KohaDates %]
5 [% USE Branches %]
6 [% SET footerjs = 1 %]
7 [% INCLUDE 'doc-head-open.inc' %]
8 <title>Koha &rsaquo; Tools &rsaquo; News</title>
9 [% INCLUDE 'doc-head-close.inc' %]
10 [% IF ( opac_news_count ) %]
11 [% END %]
12 [% IF Koha.Preference('NewsToolEditor') == 'codemirror' %]
13     [% Asset.css("lib/codemirror/codemirror.css") | $raw %]
14     [% Asset.css("lib/codemirror/lint.min.css") | $raw %]
15     <style>
16         .CodeMirror {
17             resize: vertical;
18         }
19     </style>
20 [% END %]
21 </head>
22
23 <body id="tools_koha-news" class="tools">
24 [% INCLUDE 'header.inc' %]
25 [% INCLUDE 'cat-search.inc' %]
26
27 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo; [% IF ( add_form ) %]<a href="/cgi-bin/koha/tools/koha-news.pl">News</a> &rsaquo; [% IF ( id ) %]
28 Edit news item[% ELSE %]Add news item[% END %][% ELSE %]News[% END %]</div>
29
30 [% IF ( add_form ) %]
31     <div class="main container-fluid">
32         <div class="row">
33             <div class="col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2">
34 [% ELSE %]
35     <div class="main container-fluid">
36         <div class="row">
37             <div class="col-sm-10 col-sm-push-2">
38 [% END %]
39                 <main>
40
41 [% UNLESS ( add_form ) %]
42     [% IF error_message == 'title_missing' %]
43         <div class="dialog alert">Error: Required news title missing!</div>
44     [% END %]
45 <h2>News</h2>
46 <div id="toolbar" class="btn-toolbar">
47     <a class="btn btn-default" id="newentry" href="/cgi-bin/koha/tools/koha-news.pl?op=add_form&amp;lang=[% lang | html %]"><i class="fa fa-plus"></i> New entry</a>
48 </div>
49 [% END %]
50
51 [% IF ( add_form ) %]
52     [% IF ( op == 'add' ) %]
53         [% default_lang = lang %]
54     [% ELSE %]
55         [% default_lang = new_detail.lang %]
56     [% END %]
57         <form name="add_form" method="post" action="/cgi-bin/koha/tools/koha-news.pl" >
58             <input type="hidden" name="op" value="[% op | html %]" />
59             <input type="hidden" name="id" value="[% id | html %]" />
60                         <fieldset class="rows">
61             <legend>OPAC and Koha news</legend>
62            <ol> <li>
63             <label for="lang">Display location:</label>
64             <select id="lang" name="lang">
65                 [% PROCESS lang_locations language => default_lang %]
66             </select>
67             </li>
68             <li>
69                 <label for="branch">Library: </label>
70                 <select id="branch" name="branch">
71                     [% IF ( new_detail.branchcode == '' ) %]
72                         <option value="" selected="selected">All libraries</option>
73                     [% ELSE %]
74                         <option value=""         >All libraries</option>
75                     [% END %]
76                     [% PROCESS options_for_libraries libraries => Branches.all( selected => new_detail.branchcode, unfiltered => 1, ) %]
77                 </select>
78             </li>
79             <li>
80                 <label for="title" class="required">Title: </label>
81                 <input id="title" size="30" type="text" name="title" value="[% new_detail.title | html %]" required="required" class="required" /> <span class="required">Required</span>
82             </li>
83             <li>
84                 <label for="from">Publication date: </label>
85                 <input id="from" type="text" name="timestamp" size="15" value="[% new_detail.timestamp | html %]" class="datepickerfrom" />
86                                 <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
87             </li>
88             <li>
89                 <label for="to">Expiration date: </label>
90                 <input id="to" type="text" name="expirationdate" size="15" value="[% new_detail.expirationdate | html %]" class="datepickerto" />
91                 <div class="hint">
92                     [% INCLUDE 'date-format.inc' %]
93                     <br>News will still be accessible by direct URL if expired.
94                 </div>
95             </li>
96             <li>
97                 <label for="number">Appear in position: </label>
98                 [% IF ( new_detail.number ) %]
99                     <input id="number" size="3" name="number" type="text" value="[% new_detail.number | html %]" />
100                 [% ELSE %]
101                     <input id="number" size="3" name="number" type="text" />
102                 [% END %]
103             </li>
104             <li><label for="content">News: </label>
105             <textarea name="content" id="content"  cols="75" rows="10">[% new_detail.content | $raw %]</textarea>
106             </li>
107             </ol>
108                         </fieldset>
109   
110                 <fieldset class="action"><input class="button" type="submit" value="Submit" /> <a class="cancel" href="/cgi-bin/koha/tools/koha-news.pl">Cancel</a></fieldset>
111         </form>
112     [% ELSE %]
113         [% IF ( opac_news_count ) %]
114         <form id="del_form" method="post" action="/cgi-bin/koha/tools/koha-news.pl">
115                 <table id="newst">
116                    <thead> <tr>
117                         <th class="NoSort">&nbsp;</th>
118                         <th>Location</th>
119                         <th>Library</th>
120                         <th>Number</th>
121                         <th class="title-string">Publication date</th>
122                         <th class="title-string">Expiration date</th>
123                         <th class="anti-the">Title</th>
124                         <th>Author</th>
125                         <th class="anti-the">News</th>
126                         <th class="NoSort">Actions</th>
127                     </tr></thead>
128                     <tbody>[% FOREACH opac_new IN opac_news %]
129                          [% IF ( opac_new.expired ) %]
130                             <tr class="expired">
131                             [% ELSE %]
132                             <tr>
133                             [% END %]
134                             <td>
135                                 <input type="checkbox" name="ids" value="[% opac_new.idnew | html %]" />
136                             </td>
137                             <td>[% SWITCH opac_new.lang %]
138                                 [%   CASE "koha" %]
139                                     Librarian interface
140                                 [%   CASE "slip" %]
141                                     Slip
142                                 [%   CASE "" %]
143                                     All
144                                 [%   CASE %]
145                                     OPAC ([% opac_new.lang | html %])
146                                 [% END %]
147                              </td>
148                             <td>[% IF ( opac_new.branchcode == "" ) -%]
149                                 All libraries
150                                 [% ELSE %][% opac_new.branchname | html %]
151                                 [% END %]</td>
152                             <td>[% opac_new.number | html %]</td>
153                             <td><span title="[% opac_new.newdate | html %]">[% opac_new.newdate | $KohaDates %]</span></td>
154                             <td><span title="[% opac_new.expirationdate | html %]">[% opac_new.expirationdate | $KohaDates %] [% IF ( opac_new.expired ) %](<span class="expired">expired</span>)[% END %]</span></td>
155                             <td>[% opac_new.title | html %]</td>
156                             <td>[% opac_new.author_title | html %] [% opac_new.author_firstname | html %] [% opac_new.author_surname | html %]</td>
157                            <td>
158                                 [% opac_new.content | $raw %]
159                             </td>
160                             <td class="actions">
161                                 <a href="/cgi-bin/koha/tools/koha-news.pl?op=add_form&amp;id=[% opac_new.idnew | uri %]" class="btn btn-default btn-xs"><i class="fa fa-pencil"></i> Edit</a>
162                                 <a href="/cgi-bin/koha/tools/koha-news.pl?op=del&amp;ids=[% opac_new.idnew | uri %]" class="delete_news btn btn-default btn-xs"><i class="fa fa-trash"></i> Delete</a>
163                             </td>
164                         </tr>
165                     [% END %]</tbody>
166                 </table>
167                 <input type="hidden" name="op" value="del" />
168                 <fieldset class="action"><input type="submit" class="button" value="Delete selected" /></fieldset>
169             </form>
170         [% ELSE %]
171             <div class="dialog message">There are no news items.</div>
172         [% END %]
173     [% END %]
174
175                 </main>
176             [% UNLESS ( add_form ) %]
177                 </div> <!-- /.col-sm-10.col-sm-push-2 -->
178
179                 <div class="col-sm-2 col-sm-pull-10">
180                     <aside>
181
182                         <div id="news-filter">
183                             <form action="/cgi-bin/koha/tools/koha-news.pl" method="get">
184                                 <h4>Filter</h4>
185                                 <fieldset class="brief">
186                                     <ol>
187                                         <li>
188                                             <label for="news_keyword">Keyword:</label>
189                                             <input type="text" name="news_keyword" id="news_keyword" />
190                                         </li>
191                                         <li>
192                                             <label for="news_display_location">Display location:</label>
193                                             <select name="news_display_location" id="news_display_location">
194                                                 [% PROCESS lang_locations %]
195                                             </select>
196                                         </li>
197                                         <li>
198                                             <label for="news_library">Library: </label>
199                                             <select id="news_library" name="news_library">
200                                                 <option value=""></option>
201                                                 <option value="">All libraries</option>
202                                                 [% PROCESS options_for_libraries libraries => Branches.all( selected => branchcode, unfiltered => 1, ) %]
203                                             </select>
204                                         </li>
205                                     </ol>
206                                 </fieldset>
207                             </form>
208                         </div>
209
210                         [% INCLUDE 'tools-menu.inc' %]
211                     </aside>
212                 </div> <!-- /.col-sm-2.col-sm-pull-10 -->
213             [% END %]
214         </div> <!-- /.row -->
215     </div> <!-- /.main.container-fluid -->
216
217
218 [% MACRO jsinclude BLOCK %]
219     [% INCLUDE 'calendar.inc' %]
220     [% Asset.js("js/tools-menu.js") | $raw %]
221     [% IF ( opac_news_count ) %]
222         [% INCLUDE 'datatables.inc' %]
223         <script>
224             function Checkbox(){
225                 var form = document.getElementById('del_form');
226                 var inputs = form.getElementsByTagName('input');
227                 var checked = false;
228                 for (var i=0; i<inputs.length; i++) {
229                     if (inputs[i].type == 'checkbox' && inputs[i].name == 'ids') {
230                         checked = inputs[i].checked;
231                         if (checked) return true;
232                     }
233                 }
234             }
235
236             function filterDataTable( table, column, term ){
237                 if( column ){
238                     table.column( column ).search( term ).draw();
239                 } else {
240                     table.search( term ).draw();
241                 }
242                 clearFilter( term );
243             }
244
245             function clearFilter( term ){
246                 if( term == "" ){
247                     $(".dt_button_clear_filter").addClass("disabled");
248                 } else {
249                     $(".dt_button_clear_filter").removeClass("disabled");
250                 }
251             }
252
253             $(document).ready(function() {
254                 var newst = $("#newst").DataTable($.extend(true, {}, dataTablesDefaults, {
255                     "order": [[ 4, "desc" ]],
256                     "aoColumnDefs": [
257                         { "sortable": false, "searchable": false, 'targets': [ 'NoSort' ] },
258                         { "type": "anti-the", "targets": [ "anti-the" ] },
259                         { "type": "title-string", "targets" : [ "title-string"] }
260                     ],
261                     "sPaginationType": "full_numbers"
262                 }));
263
264                 $(".delete_news").on("click", function(){
265                     return confirmDelete( _("Are you sure you want to delete this news item? This cannot be undone.") );
266                 });
267
268                 $("#del_form").on("submit",function(){
269                     if ( Checkbox() ) {
270                         return confirmDelete( _("Are you sure you want to delete the selected news?") );
271                     } else {
272                         alert(_("Please select a news item to delete."));
273                         return false;
274                     }
275                 });
276
277                 newst.on( 'search.dt', function () {
278                     var term = newst.search();
279                     $("#news_keyword").val( term );
280                 });
281
282                 $("#news_keyword").on("keyup", function(){
283                     var term = $(this).val();
284                     filterDataTable( newst, null, term );
285                 });
286
287                 $("#news_display_location").on("change", function(){
288                     var term = $(this).val();
289                     filterDataTable( newst, 1, term );
290                 });
291
292                 $("#news_library").on("change", function(){
293                     // Table must be filtered by the <option>'s text, not its value
294                     var opt = $(this).find("option:selected").text();
295                     filterDataTable( newst, 2, opt );
296                 });
297
298                 $(".dt_button_clear_filter").on("click", function(){
299                     newst.search('').columns().search('').draw();
300                     $("#news-filter select").each(function(){
301                         $(this).val("");
302                     });
303                 });
304             });
305         </script>
306     [% END %]
307     [% IF Koha.Preference('NewsToolEditor') == 'codemirror' %]
308         [% Asset.js( "lib/codemirror/codemirror.min.js" ) | $raw %]
309         [% Asset.js( "lib/codemirror/xml.min.js" ) | $raw %]
310         [% Asset.js( "lib/codemirror/lint.min.js" ) | $raw %]
311         [% Asset.js( "lib/linters/htmlhint.min.js" ) | $raw %]
312         [% Asset.js( "lib/codemirror/html-lint.min.js" ) | $raw %]
313         <script>
314             var editor = CodeMirror.fromTextArea(document.getElementById('content'), {
315                 lineNumbers: true,
316                 lineWrapping: true,
317                 lint: true,
318                 mode: "text/html",
319                 gutters: ["CodeMirror-lint-markers"],
320                 viewportMargin: Infinity,
321             });
322         </script>
323     [% ELSE %]
324         [% INCLUDE 'str/tinymce_i18n.inc' %]
325         [% Asset.js("lib/tiny_mce/tinymce.min.js") | $raw %]
326         <script>
327             tinyMCE.init({
328                 verify_html: false,
329                 force_br_newlines : false,
330                 force_p_newlines : false,
331                 forced_root_block : '',
332                 branding : false,
333                 relative_urls : false,
334                 content_css : "[% interface | html %]/[% theme | html %]/css/tinymce.css",
335                 menubar : "file edit view insert format tools table",
336                 mode : "specific_textareas",
337                 plugins : "autoresize table hr link image charmap lists code emoticons",
338                 toolbar : [
339                     "formatselect | bold italic | cut copy paste | alignleft aligncenter alignright | outdent indent | image link unlink anchor cleanup hr",
340                     "table | bullist numlist | undo redo | removeformat | emoticons charmap | forecolor backcolor | code visualaid help"
341                 ],
342             });
343         </script>
344     [% END # /IF NewsToolEditor %]
345 [% END %]
346
347 [% BLOCK lang_locations %]
348     [% IF ( language == "" ) %]
349         <option value="" selected="selected"></option>
350     [% ELSE %]
351         <option value="">All</option>
352     [% END %]
353     [% IF ( language == "koha" ) %]
354         <option value="koha" selected="selected">Librarian interface</option>
355     [% ELSE %]
356         <option value="koha">Librarian interface</option>
357     [% END %]
358     [% IF ( language == "slip" ) %]
359         <option value="slip" selected="selected">Slip</option>
360     [% ELSE %]
361         <option value="slip">Slip</option>
362     [% END %]
363     [% FOREACH lang_lis IN lang_list %]
364         <optgroup label="[% lang_lis.language | html %]">
365             [% FOREACH location IN [ '', 'OpacNavRight', 'opacheader', 'OpacCustomSearch', 'OpacMainUserBlock', 'opaccredits', 'OpacLoginInstructions'] %]
366                 [% IF ( location == '' ) %]
367                     [% SET location_lang = lang_lis.language %]
368                     [% location = BLOCK %]OPAC news[% END %]
369                 [% ELSE %]
370                     [% SET location_lang = location _ "_" _ lang_lis.language %]
371                 [% END %]
372                 [% IF ( location_lang == language ) %]
373                     <option value="[% location_lang | html %]" selected="selected">[% location | html %] ([% lang_lis.language | html %])</option>
374                 [% ELSE %]
375                     <option value="[% location_lang | html %]">[% location | html %] ([% lang_lis.language | html %])</option>
376                 [% END %]
377             [% END %]
378         </optgroup>
379     [% END %]
380 [% END %]
381
382 [% INCLUDE 'intranet-bottom.inc' %]