Bug 7977: Further UI work on the QOTD editor

This patch implements more of oleonard's suggestions as well as other
improvments:

--Adds instructions for using the QOTD editor
--Moves inline css to quotes.css, etc.

Signed-off-by: Jared Camins-Esakov <jcamins@cpbibliography.com>
Signed-off-by: Mason James <mtj@kohaaloha.com>

diff --git a/koha-tmpl/intranet-tmpl/prog/en/css/quotes.css b/koha-tmpl/intranet-tmpl/prog/en/css/quotes.css
index 0399a36..d68dee8 100644 (file)
--- a/koha-tmpl/intranet-tmpl/prog/en/css/quotes.css
+++ b/koha-tmpl/intranet-tmpl/prog/en/css/quotes.css
@@ -4,7 +4,6 @@
 }
 
 #footer {
-    visibility  : hidden;
     position    : relative;
     top         : 10px;
     height      : 25px;
@@ -37,5 +36,4 @@
 #quotes_editor {
     float       : left;
     width       : 100%;
-    visibility  :hidden;
 }

diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/quotes-toolbar.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/quotes-toolbar.inc
index 7372a70..7229fb5 100644 (file)
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/quotes-toolbar.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/quotes-toolbar.inc
@@ -43,6 +43,5 @@
         <li id="add_quote"><a id="add" href="#">Add quote</a></li>
         <li id="delete_quote"><a id="delete" href="#">Delete quote(s)</a></li>
         <li id="import_quotes"><a id="import" href="#">Import quotes</a></li>
-        <span class="hint" style="">Click Source or Text field to edit contents. Press &lt;Enter&gt; to save changes.</span>
     </ul>
 </div>

diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/quotes-upload.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/quotes-upload.tt
index 2f0bf1a..1518290 100644 (file)
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/quotes-upload.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/quotes-upload.tt
@@ -340,7 +340,7 @@
                     </div>
                 </fieldset>
                 <div id="server_response" onclick='fnResetUpload()'>Server Response</div>
-                <table id="quotes_editor">
+                <table id="quotes_editor" style="visibility: hidden;">
                 <thead>
                     <tr>
                         <th>Source</th>
@@ -357,7 +357,7 @@
                     </tr>
                 </tbody>
                 </table>
-                <fieldset id="footer" class="action">
+                <fieldset id="footer" class="action" style="visibility: hidden;">
                 </fieldset>
             </div>
         </div>

diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/quotes.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/quotes.tt
index 770bd31..51e11b6 100644 (file)
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/quotes.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/quotes.tt
@@ -2,6 +2,7 @@
     <title>Koha &rsaquo; Tools &rsaquo; Quote editor</title>
     [% INCLUDE 'doc-head-close.inc' %]
     <link rel="stylesheet" type="text/css" href="[% themelang %]/css/datatables.css" />
+    <link rel="stylesheet" type="text/css" href="[% themelang %]/css/quotes.css" />
     <script type="text/javascript" src="[% themelang %]/lib/jquery/plugins/jquery.dataTables.min.js"></script>
     <script type="text/javascript" src="[% themelang %]/lib/jquery/plugins/dataTables.fnReloadAjax.js"></script>
     [% INCLUDE 'datatables-strings.inc' %]
@@ -39,7 +40,7 @@
                         var quoteID = $('td', nRow)[0].innerHTML;
                         $(nRow).attr("id", quoteID); /* set row ids to quote id */
                         $('td:eq(0)', nRow).click(function() {$(this.parentNode).toggleClass('selected',this.clicked);}); /* add row selectors */
-                        $('td:eq(0)', nRow).attr("title", "Click ID to select/deselect quote");
+                        $('td:eq(0)', nRow).attr("title", _("Click ID to select/deselect quote"));
                         if (isNaN(quoteID)) {
                             noEditFields = [0,1,2,3]; /* all fields when adding a quote */
                         }
@@ -101,11 +102,11 @@
                     });
                 }
                 else {
-                    alert('Please supply both the text and source of the quote before saving.');
+                    alert(_('Please supply both the text and source of the quote before saving.'));
                 }
             }
             else if (e.keyCode == 27) {
-                if (confirm('Are you sure you want to cancel adding this quote?')) {
+                if (confirm(_('Are you sure you want to cancel adding this quote?'))) {
                     oTable.fnDeleteRow(node);
                 }
                 else {
@@ -134,9 +135,9 @@
                   return this.id;
             }).get().join(', ');
             if (!idsToDelete) {
-                alert('Please select a quote(s) by clicking the quote id(s) you desire to delete.');
+                alert(_('Please select a quote(s) by clicking the quote id(s) you desire to delete.'));
             }
-            else if (confirm('Are you sure you wish to delete quote(s) '+idsToDelete+'?')) {
+            else if (confirm(_('Are you sure you wish to delete quote(s) ')+idsToDelete+'?')) {
                 oTable.$('.selected').each(function(){
                         var quoteID = $(this).attr('id');
                             $.ajax({
@@ -173,10 +174,23 @@
             <div class="yui-b">
                 [% INCLUDE 'quotes-toolbar.inc' %]
                 <h2>Quote editor</h2>
-                <table id="quotes_editor" style="float: left; width: 100%;">
+                <div id="instructions">
+                <fieldset id="quote_editor_help" class="rows">
+                    <legend>Instructions</legend>
+                    <div id="quote_editor_inst">
+                        <ul>
+                        <li>Click on the 'Add Quote' button to add a single quote; Press the &lt;Enter&gt; key to save the quote. <b>Note:</b> Both the 'source' and 'text' fields must have content in order for the quote to be saved.</li>
+                        <li>Click on any field to edit the contents; Press the &lt;Enter&gt; key to save edit.</li>
+                        <li>Click on one or more quote numbers to select entire quotes for deletion; Click the 'Delete Quote(s)' button to delete selected quotes.</li>
+                        <li>Click the 'Import Quotes' button in the toolbar to import a CSV file of quotes.</li>
+                        </ul>
+                    </div>
+                </fieldset>
+                </div>
+                <table id="quotes_editor">
                 <thead>
                     <tr>
-                        <th><span style="cursor: help" onclick="event.stopPropagation();alert('Click on the quote\'s id to select or deselect the quote. Multiple quotes may be selected.');">ID</span></th>
+                        <th><span style="cursor: help" onclick="event.stopPropagation();alert(_('Click on the quote\'s id to select or deselect the quote. Multiple quotes may be selected.'));">ID</span></th>
                         <th>Source</th>
                         <th>Text</th>
                         <th>Last Displayed</th>
@@ -194,7 +208,7 @@
                     </tr>
                 </tbody>
                 </table>
-                <fieldset id="footer" class="action" style="height:25px;">
+                <fieldset id="footer" class="action">
                 </fieldset>
             </div>
         </div>