koha-tmpl/intranet-tmpl/prog/en/modules/tools/upload-images.tt

   1 [% USE raw %]
   2 [% USE Asset %]
   3 [% SET footerjs = 1 %]
   4 [% INCLUDE 'doc-head-open.inc' %]
   5 <title>
   6     Koha &rsaquo;
   7     Tools &rsaquo;
   8     Upload local cover image
   9     [% IF ( biblio ) %]
  10         &rsaquo; [% INCLUDE 'biblio-title-head.inc' %]
  11     [% END %]
  12 </title>
  13 [% INCLUDE 'doc-head-close.inc' %]
  14 [% FILTER collapse %]
  15     <style>
  16         #fileuploadstatus,
  17         #fileuploadfailed,
  18         #jobpanel,
  19         #jobstatus,
  20         #jobfailed,
  21         #fileuploadform,
  22         #upload_file_type,
  23         #upload_options,
  24         #process_images {
  25             display: none;
  26         }
  27         #uploadpanel {
  28             clear:both;
  29             margin-top: .9em;
  30         }
  31         #filedrag {
  32             background-color: #FFF;
  33             outline: 2px dashed #92b0b3;
  34             outline-offset: -10px;
  35             font-weight: bold;
  36             font-size: 130%;
  37             text-align: center;
  38             position: relative;
  39             padding: 50px 20px;
  40             margin: 1em;
  41
  42             cursor: default;
  43         }
  44
  45         #click_to_select:hover {
  46             color: #538200;
  47             cursor: pointer;
  48         }
  49
  50         #filedrag.hover {
  51             outline-offset: -20px;
  52             outline-color: #c8dadf;
  53             background-color: #fff;
  54         }
  55
  56         #messages {
  57             font-weight: normal;
  58         }
  59         .cover_preview {
  60             margin:1em;
  61             max-height:200px;
  62             max-width:200px;
  63         }
  64         .progress_panel {
  65             border: 0;
  66             border-radius: 0;
  67             margin: .9em;
  68             background-color: #FFF;
  69         }
  70         .fa-file-archive-o {
  71             color: #777;
  72             font-size: 300%
  73         }
  74     </style>
  75 [% END %]
  76 </head>
  77
  78 <body id="tools_upload-images" class="tools">
  79 [% INCLUDE 'header.inc' %]
  80 [% INCLUDE 'cat-search.inc' %]
  81
  82 <nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumb">
  83     <ol>
  84         <li>
  85             <a href="/cgi-bin/koha/mainpage.pl">Home</a>
  86         </li>
  87         <li>
  88             <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a>
  89         </li>
  90         <li>
  91             <a href="/cgi-bin/koha/tools/upload-cover-image.pl">Upload local cover image</a>
  92         </li>
  93
  94         [% IF ( uploadimage ) %]
  95             <li>
  96                 <a href="#" aria-current="page">
  97                     Upload results
  98                 </a>
  99             </li>
 100             [% IF ( biblionumber ) %]
 101                <li>
 102                     <a href="#" aria-current="page"><em>[% INCLUDE 'biblio-title.inc' %]</em></a>
 103                 </li>
 104             [% END %]
 105         [% ELSIF itemnumber %]
 106             <li>
 107                 <a href="#" aria-current="page">
 108                     Upload cover for itemnumber: [% itemnumber | html %]
 109                 </a>
 110             </li>
 111         [% ELSIF biblionumber %]
 112             <li>
 113                 <a href="#" aria-current="page">
 114                     Upload cover for biblionumber: [% biblionumber | html %]
 115                 </a>
 116             </li>
 117         [% ELSE %]
 118             <li>
 119                 <a href="#" aria-current="page">
 120                     Upload local cover image
 121                 </a>
 122             </li>
 123         [% END %]
 124     </ol>
 125 </nav>
 126
 127 <div class="main container-fluid">
 128     <div class="row">
 129         <div class="col-sm-10 col-sm-push-2">
 130             <main>
 131
 132                 [% UNLESS itemnumber || biblionumber %]
 133                     <h1>Upload local cover image</h1>
 134                 [% ELSIF biblio %]
 135                     <h1>
 136                         Upload local cover image for <a href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% biblionumber | uri %]"><em>[% INCLUDE 'biblio-title.inc' %]</em></a>
 137                         [% IF ( itemnumber ) %],  Item number: [% itemnumber | html %][% END %]
 138                     </h1>
 139                 [% ELSIF itemnumber %]
 140                     <h1>Upload local cover image for item number: [% itemnumber | html %]</h1>
 141                 [% END %]
 142
 143                 [% IF ( uploadimage ) %]
 144                     <h2>Image upload results :</h2>
 145                     <div id="upload_results">
 146                         [% IF ( error ) %]
 147                             <div class="dialog alert">
 148                                 [% IF ( error == 'UZIPFAIL' ) %]
 149                                     <p><strong>Failed to unzip archive.<br />Please ensure you are uploading a valid zip file and try again.</strong></p>
 150                                 [% ELSIF ( error == 'OPNLINK' ) %]
 151                                     <p><strong>Cannot open folder index (idlink.txt or datalink.txt) to read.<br />Please verify that it exists.</strong></p>
 152                                 [% ELSIF ( error == 'OPNIMG' ) %]
 153                                     <p><strong>Cannot process file as an image.<br />Please ensure you only upload GIF, JPEG, PNG, or XPM images.</strong></p>
 154                                 [% ELSIF ( error == 'DELERR' ) %]
 155                                     <p><strong>Unrecognized or missing field delimiter.<br />Please verify that you are using either a single quote or a tab.</strong></p>
 156                                 [% ELSIF ( error == 'DBERR' ) %]
 157                                     <p><strong>Unable to save image to database.</strong></p>
 158                                 [% ELSE %]
 159                                     <p><strong>An unknown error has occurred.<br />Please review the error log for more details.</strong></p>
 160                                 [% END %]
 161                             </div>
 162                         [% END # /IF error  %]
 163                         <h3>[% total | html %] images found</h3>
 164                         <ul>
 165                             [% FOREACH result IN results %]
 166                                 <li><a href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% result.biblionumber | uri %]">[% result.title | html %]</a></li>
 167                             [% END %]
 168                         </ul>
 169                         <hr />
 170                     </div> <!-- /#upload_results -->
 171                 [% END # /IF uploadimage %]
 172
 173                 <ul>
 174                     [% UNLESS itemnumber || biblionumber %]
 175                         <li>Select an image file or ZIP file to upload. The tool will accept images in GIF, JPEG, PNG, and XPM formats.</li>
 176                     [% ELSE %]
 177                         <li>Select an image file to upload. The tool will accept images in GIF, JPEG, PNG, and XPM formats.</li>
 178                     [% END %]
 179                 </ul>
 180
 181                 <div class="row">
 182                     [% IF ( cover_images ) %]
 183                         <div class="col-sm-9">
 184                     [% ELSE %]
 185                         <div class="col-sm-12">
 186                     [% END %]
 187
 188                         <form method="post" action="/cgi-bin/koha/tools/upload-cover-image.pl" id="uploadfile" enctype="multipart/form-data">
 189                             <fieldset class="rows" >
 190                                 <div id="fileuploadform">
 191                                     <label for="fileToUpload">Select the file to upload: </label>
 192                                     <input type="file" id="fileToUpload" name="fileToUpload" />
 193                                 </div>
 194
 195                                 <div id="filedrag">
 196                                     <a id="click_to_select" href="#">Drop files here or click to select a file</a>
 197                                     <div id="messages"></div>
 198                                 </div>
 199
 200                                 <div id="uploadpanel">
 201                                     <div id="fileuploadstatus" class="progress_panel">Upload progress:
 202                                         <progress max="100" value="0" id="fileuploadprogress">
 203                                         </progress>
 204                                         <span class="fileuploadpercent">0</span>%
 205                                     </div>
 206                                     <div id="fileuploadfailed"></div>
 207                                 </div>
 208                             </fieldset>
 209                         </form> <!-- /#uploadfile -->
 210
 211                         <form method="post" id="processfile" action="/cgi-bin/koha/tools/upload-cover-image.pl" enctype="multipart/form-data">
 212                             <input type="hidden" name="uploadedfileid" id="uploadedfileid" value="" />
 213                             <input type="hidden" name="runinbackground" id="runinbackground" value="" />
 214                             <input type="hidden" name="completedJobID" id="completedJobID" value="" />
 215
 216                             [% IF itemnumber %]
 217                                 <input type="hidden" id="itemnumber" name="itemnumber" value="[% itemnumber | html %]" />
 218                                 <input type="hidden" name="filetype" value="image" />
 219                             [% ELSIF biblionumber %]
 220                                 <input type="hidden" id="biblionumber" name="biblionumber" value="[% biblionumber | html %]" />
 221                                 <input type="hidden" name="filetype" value="image" />
 222                             [% END %]
 223
 224
 225                             <fieldset id="upload_options" class="rows">
 226                                 <ol>
 227                                     [% UNLESS itemnumber || biblionumber %]
 228                                         <li class="radio">
 229                                             [% IF (filetype != 'image' ) %]
 230                                                 <input type="radio" id="zipfile" name="filetype" value="zip" checked="checked" />
 231                                             [% ELSE %]
 232                                                 <input type="radio" id="zipfile" name="filetype" value="zip" />
 233                                             [% END %]
 234                                             <label for="zipfile">ZIP file</label>
 235                                         </li>
 236                                         <li class="radio">
 237                                             [% IF (filetype == 'image' ) %]
 238                                                 <input type="radio" id="image" name="filetype" value="image" checked="checked" />
 239                                             [% ELSE %]
 240                                                 <input type="radio" id="image" name="filetype" value="image" />
 241                                             [% END %]
 242                                             <label for="image">Image file</label>
 243                                         </li>
 244                                         <li id="biblionumber_entry">
 245                                             <label for="biblionumber">Bibliographic record number: </label>
 246                                             <input type="text" id="biblionumber" name="biblionumber" value="[% biblionumber | html %]" size="15" />
 247                                         </li>
 248                                     [% END %]
 249                                     <li class="radio">
 250                                         <label for="replace">
 251                                         [% IF AllowMultipleCovers == 0 %]
 252                                             <input type="checkbox" id="replace" name="replace" value="" disabled="disabled" checked="checked" />
 253                                             Existing covers will be replaced
 254                                         [% ELSE %]
 255                                             <input type="checkbox" id="replace" name="replace" value="1" />
 256                                             Replace existing covers
 257                                         [% END %]
 258                                     </li>
 259                                 </ol>
 260                             </fieldset>
 261
 262                             <fieldset id="process_images" class="action">
 263                                 <button type="submit" class="btn btn-default btn-sm save_image">Process images</button>
 264                                 [% IF ( biblionumber ) %]
 265                                     <a class="cancel cancel_image" href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% biblionumber | uri %]">Cancel</a>
 266                                 [% ELSE %]
 267                                     <a class="cancel cancel_image" href="/cgi-bin/koha/tools/upload-cover-image.pl">Cancel</a>
 268                                 [% END %]
 269                             </fieldset>
 270                         </form> <!-- /#processfile -->
 271                     </div> <!-- /.col-sm-9/.col-sm-12 -->
 272
 273                     [% IF ( cover_images.size ) %]
 274                         <div class="col-sm-3">
 275                             <h3>Existing images</h3>
 276                             <ul class="thumbnails">
 277                                 [% FOREACH img IN cover_images %]
 278                                     [% IF img %]
 279                                         <li id="imagenumber-[% img.imagenumber | html %]" class="thumbnail">
 280                                             <a class="show_cover" data-coverimg="[% img.imagenumber | html %]" href="/cgi-bin/koha/catalogue/imageviewer.pl?biblionumber=[% biblionumber | html %]&amp;imagenumber=[% img.imagenumber | html %]">
 281                                                 [% IF ( imagenumber == img.imagenumber ) %]
 282                                                     <img class="selected" id="thumbnail_[% img.imagenumber | html %]" src="/cgi-bin/koha/catalogue/image.pl?imagenumber=[% img.imagenumber | html %]&amp;thumbnail=1" alt="Thumbnail" />
 283                                                 [% ELSE %]
 284                                                     <img id="thumbnail_[% img.imagenumber | html %]" src="/cgi-bin/koha/catalogue/image.pl?imagenumber=[% img.imagenumber | html %]&amp;thumbnail=1" alt="Thumbnail" />
 285                                                 [% END %]
 286                                             </a>
 287                                             <a href="#" class="remove" data-coverimg="[% img.imagenumber | html %]"><i class="fa fa-trash"></i> Delete image</a>
 288                                         </li>
 289                                     [% END # /IF img %]
 290                                 [% END # /FOREACH img %]
 291                             </ul> <!-- /ul.thumbnails -->
 292                         </div> <!-- /.col-sm-3 -->
 293                     [% END # /IF images.size %]
 294
 295                 </div> <!-- /.row -->
 296             </main>
 297         </div> <!-- /.col-sm-10.col-sm-push-2 -->
 298
 299         <div class="col-sm-2 col-sm-pull-10">
 300             <aside>
 301                 [% INCLUDE 'tools-menu.inc' %]
 302             </aside>
 303         </div> <!-- /.col-sm-2.col-sm-pull-10 -->
 304      </div> <!-- /.row -->
 305
 306 [% MACRO jsinclude BLOCK %]
 307     [% Asset.js("js/tools-menu.js") | $raw %]
 308     <script>
 309         var interface = "[% interface | html %]";
 310         var theme = "[% theme | html %]";
 311         var biblionumber = "[% biblionumber | html %]";
 312     </script>
 313     [% Asset.js("js/upload-images.js") | $raw %]
 314
 315     </script>
 316 [% END %]
 317
 318 [% INCLUDE 'intranet-bottom.inc' %]