Bug 18800: Patron card images: Add some more explanation to upload page and fix small...
[koha.git] / koha-tmpl / intranet-tmpl / prog / en / modules / patroncards / image-manage.tt
1     [% INCLUDE 'doc-head-open.inc' %]
2     <title>Koha &rsaquo; Tools &rsaquo; Patron card creator &rsaquo; Images</title>
3     [% INCLUDE 'doc-head-close.inc' %]
4     <script type="text/javascript">
5         //<![CDATA[
6             function DeleteConfirm() {
7                 var results = selected_images("delete");
8                 if (results.images) {
9                     var msg = _("Are you sure you want to delete image(s): %s?").format(results.image_ids);
10                     var answer = confirm(msg);
11                     if (answer) {
12                         window.location = "/cgi-bin/koha/patroncards/image-manage.pl?op=delete&" + results.images;
13                     } else {
14                         return; // abort delete
15                     }
16                 } else {
17                     alert(_("Please select image(s) to delete."));
18                 }
19             }
20
21             function selected_images(op) {
22                 var selected = new Array;
23                 var image_ids = new Array;
24                 if (document.delete_images.action.length) {
25                     for (i=0;i<document.delete_images.action.length;i++){
26                         if (document.delete_images.action[i].checked){
27                             selected.push("image_id=" + document.delete_images.action[i].value);
28                             image_ids.push(document.delete_images.action[i].value);
29                         }
30                     }
31                     images = selected.join("&");
32                     return {images:images, image_ids:image_ids};
33                 }
34                 else if (document.delete_images.action.checked){
35                         return {images:"image_id="+document.delete_images.action.value, image_ids:document.delete_images.action.value};
36                 }
37                 return (-1);
38             }
39         $(document).ready(function() {
40             $("#delete").click(function(){
41                 return DeleteConfirm();
42             });
43             $(".delete_image").on("click", function(){
44                 return confirmDelete( _("Are you sure you want to delete this image?") );
45             });
46          });
47         //]]>
48     </script>
49 </head>
50 <body id="pcard_image-manage" class="tools pcard">
51 [% INCLUDE 'header.inc' %]
52 [% INCLUDE 'cat-search.inc' %]
53 <div id="breadcrumbs">
54     <a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo;
55     <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo;
56     <a href="/cgi-bin/koha/patroncards/home.pl">Patron card creator</a> &rsaquo;
57     Images
58 </div>
59 <div id="doc3" class="yui-t2">
60     <div id="bd">
61         <div id="yui-main">
62             <div class="yui-b">
63                     <div class="yui-g">
64                     [% INCLUDE 'patroncards-toolbar.inc' %]
65                         <div class="yui-u first">
66
67                         </div>
68                     </div>
69                 [% INCLUDE 'patroncards-errors.inc' %]
70                 <div class="yui-g">
71                     <div class="yui-u first">
72                         <h1>Upload additional images for patron cards</h1>
73                         <p>Manage additional images to use as logo, decoration or background on a patron card layout.</p>
74                         <form name="upload_images" method="post" action="/cgi-bin/koha/patroncards/image-manage.pl" enctype="multipart/form-data">
75                             <fieldset class="brief">
76                                 <div class="hint">Only PNG, GIF, JPEG, XPM formats are supported. Maximum image size is 500KB.</div>
77                                 <ol>
78                                 <li>
79                                     <label for="uploadfile">Select the file to upload: </label>
80                                     <input type="file" id="uploadfile" name="uploadfile" />
81                                     <input type="hidden" id="image" name="filetype" value="image" />
82                                 </li>
83                                 <li>
84                                     <label for="image_name">Image name: </label>
85                                     <div class="hint">
86                                         This will be the name by which you will refer to this image in the patron card layout editor.
87                                     </div>
88                                     <div class="hint">
89                                         To replace an image, delete it, upload a new file and give it the same image name.
90                                     </div>
91
92                                     <input type="text" id="image_name" name="image_name" size="20" />
93                                 </li>
94                                 </ol>
95                                 <div class="action">
96                                     <input type="hidden" name="op" value="upload" />
97                                     <input class="btn btn-default btn-default" id="uploadsu" type="submit" value="Upload" />
98                                 </div>
99                                 [% IF ( IMPORT_SUCCESSFUL ) %]
100                                     <div class="dialog message">
101                                     <h3>Image successfully uploaded</h3>
102                                     <ul><li>File: [% SOURCE_FILE %]</li>
103                                     <li>Image name: [% IMAGE_NAME %]</li></ul>
104                                     </div>
105                                 [% END %]
106                             </fieldset>
107
108                         </form>
109                     </div>
110                     <div class="yui-u">
111                     <h1>Delete Images</h1>
112                         [% IF ( TABLE ) %]
113                         <form name="delete_images" method="post" action="/cgi-bin/koha/patroncards/image-manage.pl" enctype="multipart/form-data">
114                             <fieldset class="brief">
115                                 <div class="hint">
116                                     Select one or more images to delete.
117                                 </div>
118                                <table>
119                                     [% FOREACH TABL IN TABLE %]
120
121                                     [% IF ( TABL.header_fields ) %]
122
123                                     <tr>
124                                     [% FOREACH header_field IN TABL.header_fields %]
125                                     [% SWITCH header_field.field_label -%]
126                                         [% CASE "ID" %]
127                                             <th>Image ID</th>
128                                         [% CASE "Name" %]
129                                             <th>Name</th>
130                                         [% CASE " " %]
131                                             <th>Delete</th>
132                                         [% CASE %]
133                                            <th>[% header_field.field_label %]</th>
134                                     [% END %]
135                                     [% END %]
136                                     </tr>
137                                     [% ELSE %]
138                                     <tr>
139                                     [% FOREACH text_field IN TABL.text_fields %]
140                                     [% IF ( text_field.select_field ) %]
141                                         <td>
142                                             <a class="delete_image btn btn-default btn-xs" href="/cgi-bin/koha/patroncards/image-manage.pl?op=delete&image_id=[% text_field.field_value %]"><i class="fa fa-trash"></i> Delete</a>
143                                         </td>
144                                         <td align="center"><input type="checkbox" name="action" value="[% text_field.field_value %]" /></td>
145                                     [% ELSIF ( text_field.field_value ) %]
146                                         <td>[% text_field.field_value %]</td>
147                                     [% ELSE %]
148                                         <td>&nbsp;</td>
149                                     [% END %]
150                                     [% END %]
151                                     </tr>
152                                     [% END %]
153                                     [% END %]
154                                 </table>
155                                 <div class="action">
156                                     <input type="hidden" name="op" value="delete" />
157                                     <input class="btn btn-default btn-default" type="button" id="delete" value="Delete selected" />
158                                 </div>
159                                 [% IF ( DELETE_SUCCESSFULL ) %]
160                                 <div id="dialog" class="dialog message">
161                                     <h3>Image(s) successfully deleted</h3>
162                                 </div>
163                                 [% END %]
164                             </fieldset>
165                         </form>
166                         [% ELSE %]
167                         <fieldset class="brief">
168                             <div class="hint">
169                                 No images are currently available.
170                             </div>
171                             [% IF ( DELETE_SUCCESSFULL ) %]
172                                 <div id="dialog" class="dialog message">
173                                     <h3>Image(s) successfully deleted</h3>
174                                 </div>
175                             [% END %]
176                         </fieldset>
177                         [% END %]
178                     </div>
179                 </div>
180             </div>
181         </div>
182         <div class="yui-b">
183           [% INCLUDE 'tools-menu.inc' %]
184         </div>
185     </div>
186     [% INCLUDE 'intranet-bottom.inc' %]