[Koha-patches] [PATCH] Bug 9690 - Replace YUI buttons on the catalog search results page with Bootstrap

Owen Leonard oleonard at myacpl.org
Fri Feb 22 18:52:28 CET 2013


"Save," "Place hold," and "Z39.50 search" buttons on the catalog search
results page are generated by YUI.

This patch removes YUI styling from the "Save" button and uses Bootstrap
to apply styling to the "Place hold" and "Z39.50 search" button.
The "search to hold" split button menu is converted to Bootstrap as well.

The "Save" button's appearance is inconsistent with the Bootstrap ones,
but right now we don't have a good method for overriding the default
submit button CSS with Bootstrap button styling. I hope this can be
dealt with in a more global way in a subsequent patch.

To test, search the catalog in the staff client. Confirm that the
"Save," "Place hold," and "Z39.50 search" buttons look correct and work
correctly. Also select a patron and "search to hold," confirming the
functionality of all the opitions added to the "Place hold" button menu.
---
 .../intranet-tmpl/prog/en/css/staff-global.css     |    5 +-
 .../prog/en/modules/catalogue/results.tt           |  103 ++++++++++----------
 2 files changed, 53 insertions(+), 55 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/en/css/staff-global.css b/koha-tmpl/intranet-tmpl/prog/en/css/staff-global.css
index e95c60f..4fd2d70 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/css/staff-global.css
+++ b/koha-tmpl/intranet-tmpl/prog/en/css/staff-global.css
@@ -1427,9 +1427,8 @@ li.email {
    border : 1px solid #B9D8D9;
 }
 
-/* Hack just for Firefox */
-html>/**/body #searchheader button, x:-moz-any-link, x:default {
-	padding-bottom : 3px;
+#searchheader .btn-group > .btn:first-child {
+    margin-left : .7em;
 }
 
 #searchheader form {
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/results.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/results.tt
index 4d89a53..c5eaaf8 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/results.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/results.tt
@@ -52,16 +52,35 @@ function cartList(){
         return false;
     }
 }
-$(window).load(function() {
-        new YAHOO.widget.Button("cartsubmit", { onclick: { fn: cartList }});
-});
 $(document).ready(function() {
-$("#placeholdc").empty();
+$("#cartsubmit").click(function(){
+    cartList();
+    return false;
+});
+$("#z3950submit").click(function(){
+    PopupZ3950();
+    return false;
+});
+
+$("#searchheader").on("click",".placehold", function(){
+    placeHold();
+    $(".btn-group").removeClass("open");
+    return false;
+});
+$(".placeholdfor").click(function(){
+    holdForPatron();
+    $(".btn-group").removeClass("open");
+    return false;
+});
+$("#forgetholdfor").click(function(){
+    forgetPatron();
+    $(".btn-group").removeClass("open");
+    return false;
+});
 $('#sortbyform').find("input:submit").hide();
 $('#sort_by').change(function() {
         $('#sortbyform').submit();
     });
-$(".addtocart").show();
         var param1 = "<label for=\"addto\">"+_("Add to:")+"<\/label><select name=\"addto\" id=\"addto\"><option value=\"\"><\/option>";
         [% IF ( intranetbookbag ) %]     param1 += "<option value=\"addtocart\">"+_("Cart")+"<\/option>"; [% END %]
         [% IF ( virtualshelves ) %][% IF ( addbarshelves ) %]
@@ -154,14 +173,7 @@ function placeHold () {
 function forgetPatron(){
     $.cookie("holdfor",null, { path: "/", expires: 0 });
     $(".holdforlink").remove();
-    $("#placeholdc").empty();
-    new YAHOO.widget.Button({
-    id: "placehold",
-    type: "button",
-    label: _("Place hold"),
-    container: "placeholdc",
-    onclick: { fn: placeHold }
- });
+    $("#placeholdc").html("<a class=\"btn btn-mini placehold\" href=\"#\"><i class=\"icon-hold\"></i> "+_("Place hold")+"</a>");
 }
 
 function addToList () {
@@ -196,40 +208,14 @@ function GetZ3950Terms(){
 	return strQuery;
 }
 
-YAHOO.util.Event.onContentReady("searchheader", function () {
-        new YAHOO.widget.Button( "z3950submit", { onclick: { fn: PopupZ3950 }});
-        [% IF ( holdfor ) %]
-        var holdFor = function (){
-            $("#holdFor").val("");
-            placeHold();
-        }
-        var holdForPatron = function () {
-            $("#holdFor").val("[% holdfor_cardnumber %]");
-            placeHold();
-        }
-        var HoldForButtonMenu = [
-            { text: _("Place hold"), onclick: { fn: holdFor }},
-            { text: _("Place hold for") + " [% holdfor_firstname %] [% holdfor_surname %] ([% holdfor_cardnumber %])", onclick: { fn: holdForPatron }},
-            { text: _("Forget") + " [% holdfor_firstname %] [% holdfor_surname %] ([% holdfor_cardnumber %])", onclick: { fn: forgetPatron }}];
-
-        var HoldForButton = new YAHOO.widget.Button({
-                type: "split",
-                label: _("Place hold"),
-                name: "holdfor",
-                menu: HoldForButtonMenu,
-                container: "placeholdc",
-                onclick: { fn: holdFor }
-        });
-        [% ELSE %]
-        new YAHOO.widget.Button({
-            id: "placehold",
-            type: "button",
-            label: _("Place hold"),
-            container: "placeholdc",
-            onclick: { fn: placeHold }
-         });
-        [% END %]
-}); // YAHOO onContentReady
+var holdFor = function (){
+    $("#holdFor").val("");
+    placeHold();
+}
+var holdForPatron = function () {
+    $("#holdFor").val("[% holdfor_cardnumber %]");
+    placeHold();
+}
 //]]>
 </script>
 </head>
@@ -296,13 +282,26 @@ YAHOO.util.Event.onContentReady("searchheader", function () {
                 <a href="#" class="highlight_toggle" id="highlight_toggle_on">Highlight</a>
                 |
 		<span class="addto"></span>
-                [% IF ( CAN_user_reserveforothers ) %]
-                    [% IF ( DisplayMultiPlaceHold ) %]
-                  | <span id="placeholdc"><input type="button" id="placehold" onclick="placeHold(); return false;" value="Place Hold"/></span>
-                    [% END %]
+                [% IF ( CAN_user_reserveforothers && DisplayMultiPlaceHold ) %]
+                [% IF ( holdfor ) %]
+                    <div id="placeholdc" class="btn-group">
+                        <button class="btn btn-mini placehold"><i class="icon-hold"></i> Place hold</button>
+                        <button class="btn btn-mini dropdown-toggle" data-toggle="dropdown">
+                        <span class="caret"></span>
+                        </button>
+                        <ul class="dropdown-menu">
+                            <li><a href="#" class="placehold">Place hold</a></li>
+                            <li><a href="#" class="placeholdfor">Place hold for [% holdfor_firstname %] [% holdfor_surname %] ([% holdfor_cardnumber %])</a></li>
+                            <li class="divider"></li>
+                            <li><a href="#" id="forgetholdfor">Forget  [% holdfor_firstname %] [% holdfor_surname %] ([% holdfor_cardnumber %])</a></li>
+                        </ul>
+                    </div>
+                [% ELSE %]
+                    <div id="placeholdc" class="btn-group"><a class="btn btn-mini placehold" href="#"><i class="icon-hold"></i> Place hold</a></div>
+                [% END %]
                 [% END %]
 
-				[% IF ( CAN_user_editcatalogue_edit_catalogue ) %] | <input type="button" id="z3950submit" onclick="PopupZ3950(); return false;" value="Z39.50 Search"/>[% END %]
+                [% IF ( CAN_user_editcatalogue_edit_catalogue ) %] <div class="btn-group"><a class="btn btn-mini" id="z3950submit" href="#"><i class="icon-search"></i> Z39.50 search</a></div>[% END %]
             </div>
         </div>
     [% IF ( stopwords_removed ) %]<div><p class="tip">Ignored the following common words: "[% stopwords_removed %]"<p></div>[% END %]
-- 
1.7.9.5


More information about the Koha-patches mailing list