Bug 18541 - Patron card creator: Add a grid to support layout design
[srvgit] / koha-tmpl / intranet-tmpl / prog / en / modules / patroncards / image-manage.tt
index 66f1725..5ceb132 100644 (file)
@@ -1,21 +1,23 @@
     [% INCLUDE 'doc-head-open.inc' %]
-    <title>Koha &rsaquo; Patron card creator &rsaquo; Manage images</title>
+    <title>Koha &rsaquo; Tools &rsaquo; Patron card creator &rsaquo; Images</title>
     [% INCLUDE 'doc-head-close.inc' %]
     <script type="text/javascript">
         //<![CDATA[
             function DeleteConfirm() {
                 var results = selected_images("delete");
-                if (results.images != -1) {
-                    var msg = "Are you sure you want to delete image(s): " + results.image_ids + "?";
+                if (results.images) {
+                    var msg = _("Are you sure you want to delete image(s): %s?").format(results.image_ids);
                     var answer = confirm(msg);
                     if (answer) {
                         window.location = "/cgi-bin/koha/patroncards/image-manage.pl?op=delete&" + results.images;
-                    }
-                    else {
+                    } else {
                         return; // abort delete
                     }
+                } else {
+                    alert(_("Please select image(s) to delete."));
                 }
-            };
+            }
+
             function selected_images(op) {
                 var selected = new Array;
                 var image_ids = new Array;
                             selected.push("image_id=" + document.delete_images.action[i].value);
                             image_ids.push(document.delete_images.action[i].value);
                         }
-                    };
+                    }
                     images = selected.join("&");
                     return {images:images, image_ids:image_ids};
                 }
                 else if (document.delete_images.action.checked){
-                        return {images:"batch_id="+document.delete_images.action.value, image_ids:document.delete_images.action.value};
-                };
-                alert(_("Please select image(s) to ") + op + ".");
+                        return {images:"image_id="+document.delete_images.action.value, image_ids:document.delete_images.action.value};
+                }
                 return (-1);
-            };
+            }
         $(document).ready(function() {
             $("#delete").click(function(){
                 return DeleteConfirm();
             });
+            $(".delete_image").on("click", function(){
+                return confirmDelete( _("Are you sure you want to delete this image?") );
+            });
          });
         //]]>
     </script>
     <a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo;
     <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo;
     <a href="/cgi-bin/koha/patroncards/home.pl">Patron card creator</a> &rsaquo;
-    Manage images
+    Images
 </div>
 <div id="doc3" class="yui-t2">
     <div id="bd">
         <div id="yui-main">
             <div class="yui-b">
-                [% INCLUDE 'error-messages.inc' %]
+                    <div class="yui-g">
+                    [% INCLUDE 'patroncards-toolbar.inc' %]
+                        <div class="yui-u first">
+
+                        </div>
+                    </div>
+                [% INCLUDE 'patroncards-errors.inc' %]
                 <div class="yui-g">
                     <div class="yui-u first">
-                        <h1>Upload Images</h1>
-                        [% IF ( IMPORT_SUCCESSFUL ) %]
-                        <div id="dialog" class="dialog message">
-                            <h3>Image successfully uploaded</h3>
-                            <ul><li>File: [% SOURCE_FILE %]</li>
-                            <li>Image name: [% IMAGE_NAME %]</li></ul>
-                        </div>
-                        [% END %]
+                        <h1>Upload additional images for patron cards</h1>
+                        <p>Manage additional images to use as logo, decoration or background on a patron card layout.</p>
                         <form name="upload_images" method="post" action="/cgi-bin/koha/patroncards/image-manage.pl" enctype="multipart/form-data">
                             <fieldset class="brief">
-                                <div class="hint">
-                                    <b>NOTE:</b> Only PNG, GIF, JPEG, XPM formats are supported. Images <b>must</b> be less than 500KB.
-                                </div>
+                                <div class="hint">Only PNG, GIF, JPEG, XPM formats are supported. Maximum image size is 500KB.</div>
                                 <ol>
                                 <li>
                                     <label for="uploadfile">Select the file to upload: </label>
                                     <div class="hint">
                                         This will be the name by which you will refer to this image in the patron card layout editor.
                                     </div>
+                                    <div class="hint">
+                                        To replace an image, delete it, upload a new file and give it the same image name.
+                                    </div>
+
                                     <input type="text" id="image_name" name="image_name" size="20" />
                                 </li>
                                 </ol>
+                                <div class="action">
+                                    <input type="hidden" name="op" value="upload" />
+                                    <input class="btn btn-default btn-default" id="uploadsu" type="submit" value="Upload" />
+                                </div>
+                                [% IF ( IMPORT_SUCCESSFUL ) %]
+                                    <div class="dialog message">
+                                    <h3>Image successfully uploaded</h3>
+                                    <ul><li>File: [% SOURCE_FILE %]</li>
+                                    <li>Image name: [% IMAGE_NAME %]</li></ul>
+                                    </div>
+                                [% END %]
                             </fieldset>
-                            <fieldset class="action">
-                                <input type="hidden" name="op" value="upload" />
-                                <input id="uploadsu" type="submit" value="Upload" />
-                                <a id="cancelul" href="/cgi-bin/koha/patroncards/home.pl" class="cancel">Cancel</a>
-                            </fieldset>
+
                         </form>
                     </div>
                     <div class="yui-u">
                     <h1>Delete Images</h1>
-                        [% IF ( DELETE_SUCCESSFULL ) %]
-                        <div id="dialog" class="dialog message">
-                            <h3>Image(s) successfully deleted</h3>
-                        </div>
-                        [% END %]
                         [% IF ( TABLE ) %]
                         <form name="delete_images" method="post" action="/cgi-bin/koha/patroncards/image-manage.pl" enctype="multipart/form-data">
                             <fieldset class="brief">
                                 </div>
                                <table>
                                     [% FOREACH TABL IN TABLE %]
+
                                     [% IF ( TABL.header_fields ) %]
+
                                     <tr>
                                     [% FOREACH header_field IN TABL.header_fields %]
-                                        <th>[% header_field.field_label %]</th>
+                                    [% SWITCH header_field.field_label -%]
+                                        [% CASE "ID" %]
+                                            <th>Image ID</th>
+                                        [% CASE "Name" %]
+                                            <th>Name</th>
+                                        [% CASE " " %]
+                                            <th>Delete</th>
+                                        [% CASE %]
+                                           <th>[% header_field.field_label %]</th>
+                                    [% END %]
                                     [% END %]
                                     </tr>
                                     [% ELSE %]
                                     <tr>
                                     [% FOREACH text_field IN TABL.text_fields %]
                                     [% IF ( text_field.select_field ) %]
+                                        <td>
+                                            <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>
+                                        </td>
                                         <td align="center"><input type="checkbox" name="action" value="[% text_field.field_value %]" /></td>
                                     [% ELSIF ( text_field.field_value ) %]
                                         <td>[% text_field.field_value %]</td>
                                     [% END %]
                                     [% END %]
                                 </table>
-                            </fieldset>
-                            <fieldset class="action">
-                                <input type="hidden" name="op" value="delete" />
-                                <input type="button" id="delete" value="Delete" />
-                                <a id="canceldel" href="/cgi-bin/koha/patroncards/home.pl" class="cancel">Cancel</a>
+                                <div class="action">
+                                    <input type="hidden" name="op" value="delete" />
+                                    <input class="btn btn-default btn-default" type="button" id="delete" value="Delete selected" />
+                                </div>
+                                [% IF ( DELETE_SUCCESSFULL ) %]
+                                <div id="dialog" class="dialog message">
+                                    <h3>Image(s) successfully deleted</h3>
+                                </div>
+                                [% END %]
                             </fieldset>
                         </form>
                         [% ELSE %]
                             <div class="hint">
                                 No images are currently available.
                             </div>
+                            [% IF ( DELETE_SUCCESSFULL ) %]
+                                <div id="dialog" class="dialog message">
+                                    <h3>Image(s) successfully deleted</h3>
+                                </div>
+                            [% END %]
                         </fieldset>
                         [% END %]
                     </div>
                 </div>
             </div>
         </div>
-        <div class="yui-b noprint">
-            [% INCLUDE 'patroncards-menu.inc' %]
+        <div class="yui-b">
+          [% INCLUDE 'tools-menu.inc' %]
         </div>
     </div>
     [% INCLUDE 'intranet-bottom.inc' %]